/*-=Small screens=-*/
@media only screen and (max-width: 640px) {
  .header .logo img {
    max-height: 40px;
  }
  .header .right h2 {
    display: none;
  }

  .home .content .row .columns {
    height: 50%;
  }
  .home .content .row .columns a h2 {
    opacity: 1;
    text-shadow: 1px 1px 2px #000;
    font-size: 30px;
  }

  .content-bg-image {
    position: absolute;
    z-index: -1;
  }

  .map-col .acf-map {
    height: 200px;
  }
  .map-col address {
    text-align: center;
  }
  .map-col .contact-info {
    text-align: center;
  }

  h1 {
    font-size: 25px;
  }

  .footer.sticky {
    padding-top: 7px;
    padding-bottom: 7px;
  }

  .over-hide .vert-align:before {
    display: none;
  }
}
/* max-width 640px and lower. Use this for mobiles only */
/*-=Medium screens=-*/
@media only screen and (min-width: 641px) {
  .home .content .row .columns a:hover {
    background-color: rgba(91, 84, 76, 0.75);
  }
  .home .content .row .columns a:hover:before {
    height: 90%;
    opacity: 1;
  }
  .home .content .row .columns a:hover:after {
    width: 90%;
    opacity: 1;
  }
  .home .content .row .columns a:hover h2 {
    opacity: 1;
  }
}
@media only screen and (max-width: 640px), (max-height: 900px) {
  .top-bar .over-hide {
    overflow-y: auto;
    overflow-x: hidden;
  }
  .top-bar .vert-align {
    height: auto !important;
  }

  .over-hide .vert-align:before {
    display: none;
  }
}
/* min-width 641px */
@media only screen and (max-width: 1024px) {
  .content .team .team-link {
    padding-bottom: 0;
    display: inline-block;
    height: 150px;
    width: 150px;
  }
}
@media only screen and (min-width: 641px) and (max-width: 1024px) {
  /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
  .home .content .row .columns a h2 {
    font-size: 40px;
  }

  .map-col address {
    text-align: center;
  }
  .map-col .contact-info {
    text-align: center;
  }

  h1 {
    font-size: 25px;
  }
}
/*-=Large screens=-*/
@media only screen and (min-width: 1025px) {
  /* min-width 1025px, large screens */
  .member-decor {
    position: relative;
  }
  .member-decor:before {
    content: '';
    position: absolute;
    top: 20px;
    right: 100%;
    border-style: solid;
    border-color: transparent #f1f1f1 transparent transparent;
    border-width: 12px 15px 12px 0;
  }
}