@charset "utf-8";
/* CSS Document */

/* Hide Clare */
.gyant-tooltip, .open-toggle {
  display: none !important;
}
/* End Hid Clare */
html {
  scroll-behavior: smooth;
}
body {
  font-family: 'brandon-grotesque', sans-serif;
  background: #efefef;
}
p, ol, ul {
  font-size: 1.25rem;
  line-height: 1.25;
}
h2, .h2-style {
  font-size: 2.165rem;
  font-weight: 700;
  line-height: 1.25;
}
.h4, h4 {
  font-size: 1.25rem;
  font-weight: 700;
}
.blue {
  color: #007f9b;
}
.text-center {
  display: block;
}
.no-wrap {
  white-space: nowrap;
}
.sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
ul.plain {
  list-style: none;
}
.btn-blue {
  display: block;
  color: #ffffff;
  background: #007f9b;
  border: 3px solid #ffffff;
  font-size: 1.563rem;
  padding: .6rem 1.25rem;
  border-radius: 50px;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
}
.btn-blue:hover, .btn-blue:active, .btn-blue:focus {
  background: #00647A;
  color: #ffffff;
  text-decoration: none;
}

/* Body Wrap */
.body-wrap {
  box-shadow: 0 0 40px #aaa !important;
}
.header-banner-wrap {
  background: url(images/neutral-swoosh.png) no-repeat;
  background-size: cover;
  background-position: 100% 125%;
}
/* Header */
#header .btn-blue {
  width: auto;
  display: block;
  margin: 0 auto;
  font-weight: 700;
  text-transform: uppercase;
}

/* Banner */
#banner {
  background: url(images/hero-banner-kelly.png) no-repeat;
  background-size: 54%;
  background-position: 100% 89%;
  height: 53em;
}
#banner .banner-text h1 span.heading-text {
  display: block;
  font-weight: 400;
  line-height: 1.3;
}
#banner .banner-text h1 span.text-uppercase {
  display: block;
  font-weight: 700;
}

/* Intro */
#intro {
  position: relative;
}
#intro .row {
  margin-bottom: 1rem;
}
#intro ul {
  list-style: none;
}
#intro ul li:before {
  content: "•";
  color: #000;
  margin-right: 0.5em;
}

/* Live Life */
#live-life {
  background: url(images/blue-swoosh.png) no-repeat;
  background-size: cover;
  background-position: bottom center;
  position: relative;
  z-index: 2;
  padding-top: 5rem;
}
/*#live-life .row img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}*/

#live-life img {
  width: 100%;
  height: auto;
  margin-top: -10rem;
}


#live-life h2 {
  line-height: 1.25;
}
#live-life h2 span {
  display: block;
}
#live-life h2 span.blue {
  font-size: 3.5rem;
}
#live-life h2 span.subheading {
  font-weight: 400;
}
#live-life ul {
  list-style-type: none;
}
#live-life ul li {
  position: relative;
  line-height: 1.25;
}
#live-life ul li::before {
  content: "";
  width: 6px;
  height: 6px;
  display: inline-block;
  position: absolute;
  top: 16px;
  left: -20px;
  background: #000;
  border-radius: 50%;
}

/* Services */
#services .card {
  flex-direction: row;
  background: #F4F0ED;
  border: none;
  border-radius: 15px;
}
#services .card .card-body h3 {
  font-weight: 700;
}
#services .card .card-body p {
  line-height: 1.3;
}

/* In Your Neighborhood */
#in-your-neighborhood .image img {
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: right;
}
#in-your-neighborhood .swoosh {
  background: url(images/neutral-side-swoosh.png) no-repeat;
  background-size: cover;
}
#in-your-neighborhood .text {
  width: fit-content;
  display: block;
  margin: 0 auto;
}
#in-your-neighborhood ul {
  padding-left: 0;
}
#in-your-neighborhood ul li {
  line-height: 1.25;
  margin-bottom: 1.25rem;
}
#in-your-neighborhood ul li a {
  color: #007f9b;
  font-size: 2rem;
  font-weight: 700;
}

/* CTA */
#cta {
  background: #007f9b;
}
#cta .container-xxl {
  color: #fff;
}
#cta p {
  width: 90%;
  margin: 0 auto;
}
#cta .cta-btn {
  width: fit-content;
  display: block;
  color: #007f9b;
  font-weight: 700;
  text-decoration: none;
  padding: 0.3rem 1.25rem;
  background: #fff;
  border: 3px solid #fff;
  border-radius: 50px;
  margin: 0 auto;
}
#cta .cta-btn:hover,
#cta .cta-btn:active,
#cta .cta-btn:focus {
  background: #00647A;
  color: #ffffff;
  text-decoration: none;
}

/* Legacy */
#legacy h2 {
  line-height: 1.35;
}
#legacy h2 span {
  display: block;
}
#legacy h2 span.subheading {
  font-weight: 400;
}
#legacy img {
  width: 100%;
  height: auto;
}

/* FAQ */
#FAQ .accordion-item,
#FAQ .accordion-button {
  color: #fff;
  background-color: #007f9b;
  border-radius: 8px;
}
#FAQ .accordion-button {
  font-size: 1.75rem;
  font-weight: 600;
}
#FAQ .accordion-button:focus {
  box-shadow: rgba(115, 150, 69, 0.35) 0px 0px 0px 0.25rem;;
}
#FAQ .accordion-button::after {
  width: 1.5rem;
  height: 1.5rem;
  background: url(images/chevron.svg) no-repeat;
}
#FAQ .accordion-item .accordion-body p {
  font-size: 1.4rem;
}

/* Let's Talk */
#lets-talk {
  background: #e5f6fa;
}
#lets-talk .extra-spacing {
  padding-top: 2rem;
  margin-top: 7rem;
}
#lets-talk img {
  width: 100%;
  height: auto;
  margin-top: -10rem;
}
#lets-talk .text {
  margin: auto;
}
#lets-talk .text p {
  width: 85%;
}
#lets-talk .btn-blue {
  width: fit-content;
}

/* Footer */
#footer .logo img {
  width: 100%;
  margin-left: 0;
  max-width: 520px;
}

/* START OF MEDIA QUERIES */
@media only screen and (max-width: 375px) {
/*    #banner {
        height: 29em!important;
        background-size: 86%!important;
        background-position: 199% 98%!important;
    }*/
}
  
@media only screen and (max-width: 425px) {
    #banner {
        height: 38em;
        background-size: 95%;
        background-position: 100% 100%;
    }
  #banner .banner-text span.heading-text {
    font-size: 2.25rem;
  }
  #banner .banner-text h1 span.text-uppercase {
    font-size: 7rem;
  }
  #footer .logo {
    width: 100%;
    padding: 1.25rem;
    margin: auto;
    text-align: center;
  }
	  ul {
      margin-bottom: 0rem;
    }
}

@media (min-width: 426px) and (max-width: 990px) {
  .header-banner-wrap {
    background-size: cover;
    background-position: 66% 100%;
  }
#banner {
        height: 38em;
        background-size: 63%;
        background-position: 111% 99%;
    }
  #banner .banner-text span.heading-text {
    width: 75%;
    font-size: 2.75rem;
  }
  #banner .banner-text h1 span.text-uppercase {
    font-size: 8rem;
  }
}
@media only screen and (max-width: 991px) {
  .btn-blue, .cta-btn {
    font-size: 1.563rem;
  }
  #header .item {
    text-align: center;
  }
  #header .logo {
    padding-top: 1.25rem;
  }
  #header .logo img {
    max-width: 550px;
  }
  #header .btn-blue {
    margin: 0 auto;
  }
  #banner .banner-text h1 {
    line-height: 1;
    position: relative;
  }
  #services .card img {
    display: block;
    max-width: 150px;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 992px) {
  #header .btn-blue {
    width: fit-content;
    display: block;
  }
  p, ul, ol {
    font-size: 1.7rem;
  }
  .btn-blue, .cta-btn {
    font-size: 2rem;
    padding: .8rem 3rem;
  }
  h2, .h2-style {
    font-size: 2.75rem;
  }
  h3 {
    font-size: 1.875rem;
  }
  #banner .banner-text h1 {
    width: 60%;
    font-size: 16.25em;
    line-height: 0.9;
    text-align: left;
  }
  #banner .banner-text h1 span.heading-text {
    width: 85%;
    font-size: 4.5rem;
  }
  #banner .banner-text h1 span.text-uppercase {
    font-size: 13rem;
  }
  #live-life .text {
    margin-left: -3.5rem;
  }
  #cta p {
    width: 60%;
  }
  #cta .cta-btn {
    width: 25%;
  }
  #legacy h2 span.blue {
    font-size: 3.35rem;
  }
}



