@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,300i,700|Open+Sans:300,400,400i,700&display=swap');

@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/all.min.css');

body {
  font-family: 'Open Sans', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.os-reg {font-family: 'Open Sans', sans-serif !important;}

h1, h2 {font-family: 'Open Sans Condensed', sans-serif !important;}

 h3, h4, h5, h6 {font-family: 'Open Sans Condensed', sans-serif !important;}

.fz-3 {font-size: 3rem !important;}

.display-4 {
  font-size: 1.7rem !important;
  font-weight: 700;
}

.page-title {font-size: 1.4rem !important;}

@media (min-width: 768px) {
  .display-sm-4 {
    font-size: 2rem !important;
    font-weight: 700;
  }
  .page-title {font-size: 1.7rem !important;}
}

@media (min-width: 992px) {
  .display-md-4 {
    font-size: 2.5rem !important;
    font-weight: 700;
  }

  .page-title {font-size: 2rem !important;}
}

@media (min-width: 1200px) {
  .display-lg-4 {
    font-size: 3rem !important;
    font-weight: 700;
  }
  .page-title {font-size: 2.5rem !important;}
}

.display-5 {font-size: 1.35rem !important;}

.display-6 {
  font-size: 1.35rem !important;
  font-weight: bold;
}
.display-7 {
    font-size: 1.75rem !important;
}

@media screen and (min-width:576px) {
  .display-7 {
    font-size: 1.95rem !important;
  }
}

@media screen and (min-width:768px) {
  .display-7 {
    font-size: 1.95rem !important;
  }
}

@media screen and (min-width:1200px) {
  .display-7 {
    font-size: 2.8rem !important;
  }
}

.display-8 {
    font-size: 1.6rem !important;
}

.text-primary, .link-primary {color: #ec008c !important;}

.link-primary:hover {color: #FFFFFF !important;}

.text-dark, .link-dark {color: #000000 !important;}

.border-primary {border-color: #ec008c !important;}

.border-dark {border-color: #000000 !important;}

.bg-primary {background-color: #ec008c !important;}

.bg-dkblue {background-color: #00477A !important;}

.text-bubble-blue {color:#3a89c1 !important;;}

@media screen and (min-width:992px) {
  .bg-gray {background-color: #e9e9e9 !important;}
}

.border-0 {border-width: 0px !important;}

.border-1 {border-width: 1px !important;}

.border-2 {border-width: 2px !important;}

.border-3 {border-width: 3px !important;}

.border-4 {border-width: 4px !important;}

@media screen and (min-width:576px) {
  .border-sm-0 {border-width: 0px !important;}
}
@media screen and (max-width:575px) {
  .border-xs-4 {border-width: 4px !important;}
}

.bg-dark {background-color: rgba(0,0,0,1) !important;}

.btn {
  font-family: 'Open Sans Condensed', sans-serif !important;
  font-weight: 700 !important;
}

/**** SCROLL STYLES ********/

.scroll-down {
  color: rgba(255, 0, 255, 1);
  display: block;
  font-size: 36px;
  text-align: center;
  transition: color 0.275s ease;
  position: relative;
  z-index: 1;
}

.scroll-down:hover {color: #000000;}

#return-to-top {
  position: fixed;
  bottom: 16px;
  right: 16px;
  background: rgb(236, 0, 140);
  background: rgba(236, 0, 140, 0.5);
  width: 42px;
  height: 42px;
  display: block;
  text-decoration: none;
  -webkit-border-radius: 35px;
  -moz-border-radius: 35px;
  border-radius: 35px;
  display: none;
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  z-index: 9;
}
#return-to-top i {
  color: #fff;
  margin: 0;
  position: relative;
  left: 13px;
  top: 10px;
  font-size: 19px;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

#return-to-top:hover {background: rgba(0, 0, 0, 0.9);}

#return-to-top:hover i {
  color: #fff;
  top: 5px;
}

/***** END SCROLL STYLES *****/

.navbar {padding: 0;}

.btn-form-submit {
  color: #FFFFFF !important;
  background-color: rgba(0, 0, 0, 1) !important;
}

.btn-form-submit:hover {
  color: rgba(255, 255, 255, 1) !important;
  background-color: #ec008c !important;
}

header {
  background-attachment: scroll;
  background: #EFEFEF;
  background-repeat: no-repeat;
  overflow: hidden;
  position: relative;
}

header::after {
  background-image: url('/image/find-out-more/bw_megaphone.jpg');
  background-repeat: no-repeat;
  -webkit-background-size: contain;
  background-size: contain;
  content: '';
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  bottom: 0;
  width: 100%;
  z-index: 0;
}

@media screen and (min-width:420px) {
  header::after {
    bottom: 48vh;
  }
  .helpyou-wrap {
    background-attachment: scroll;
    background-position: center 94vh;
    background-repeat: repeat-y;
  }
}


@media screen and (min-width:576px) {

  header {
    background-attachment: fixed;
    background-position: 0 0;
    -webkit-background-size: cover;
    background-size: cover;
    position: relative;
    z-index: 0;

  }

  header::after {
    background-image: url('/image/find-out-more/yelling-girl.png');
    background-repeat: no-repeat;
    -webkit-background-size: auto 320px;
    background-size: auto 320px;
    content: '';
    display: block;
    height: 100%;
    bottom: 0vh;
    left: 23vw;
    position: absolute;
    width: 100%;
    z-index: -4;
  }
}

@media screen and (min-width:768px) {

  header::after {
    -webkit-background-size: auto 455px;
    background-size: auto 455px;
    bottom: -5vh;
    left: 9vw;
    position: absolute;
    z-index: -4;
  }

}

@media screen and (min-width:992px) {
  header {
    background-attachment: fixed;
    background-image: url('/image/find-out-more/pink_layer.svg');
    background-position: 19vw 0;
    -webkit-background-size: cover;
    background-size: cover;
    position: relative;
    z-index: 0;
  }
  header::after {
    -webkit-background-size: auto 495px;
    background-size: auto 495px;
    left: 0vw;
    bottom: -14vh;
    position: absolute;
    z-index: -4;
  }
}

@media screen and (min-width:1200px) {
  header {
    background-position: 19vw 0;
  }
  header::after {
    -webkit-background-size: auto 495px;
    background-size: auto 560px;
    left: 1vw;
    bottom: -6.1vh;
  }
}

@media screen and (min-width:1440px) {
  header {
    background-position: 19vw 0;
  }
  header::after {
    background-size: auto 580px;
    left: 8vw;
  }
}

@media screen and (min-width: 1640px) {
  header::after {
    left: 14vw;
    bottom: -5vh;
  }
}

.heading-divider {
  background-color:#EC1A8C;
  display:block;
  height:4px;
  left:1rem;
  margin:0 auto;
  position:relative;
  width:8rem;
}

@media screen and (min-width:576px) {

  .heading-divider {
    left:1.5rem;
  }

}

@media screen and (min-width:992px) {
  .heading-divider {
    left:2rem;
  }
}

.os-cond {font-family: 'Open Sans Condensed', sans-serif !important;}

.navbar-brand-img {max-width: 170px !important;}

.header-top {
  position: relative;
  z-index: 1;
}

.banner-title-col {padding-left: 2rem;}

.banner-title-col h1 {
  font-family: 'Open Sans Condensed', sans-serif;
  font-size: 2.5rem;
  font-weight: bold;
  text-align: center;
  text-transform: uppercase;
}

.header-top-left-col img {width: auto;}

.testimonial-wrapper {
  display:none;
}
@media screen and (min-width:768px) {
  .testimonial-wrapper {
    display:block;
  }
}

.banner-form-heading {
  display: block;
}

@media screen and (min-width:992px) {
  .banner-form-heading {
    display: none;
  }
}

.form-control, 
.custom-select, 
textarea {border-color: #777 !important;}

.rounded-lg {border-radius: 8px !important;}

.banner-form-col form * :not(h3) {font-size: 12px;}

textarea[name="service-looking"] {
  border: 1px solid #777 !important;
  max-width: 100%;
  padding: 1em;
}

textarea[name="service-looking"]::placeholder {color: #777 !important;}

.banner-form-col button {
  font-size: 18px;
  text-transform: uppercase;
  -webkit-transition: background-color 0.275s ease;
  -moz-transition: background-color 0.275s ease;
  transition: background-color 0.275s ease;
}

.header-bottom {
  bottom: 0;
  position: relative;
  z-index: 1;
}

.header-content-col {
  min-height: 100% !important;
}

.brand-logos-wrapper {
  background-color: rgba(0,0,0,0.05);
  padding: 0.5rem;
  width: 100%;
}

.tagline-wrapper {
  display: block;
  position: relative;
  z-index: 0;
}

figure > blockquote {
  line-height: 1.2 !important;
}

@media screen and (min-width:992px) {

  .tagline-wrapper {
    margin-bottom: 14.5vh;
  }

}

.brand-logos-wrapper {background-color: #000;}



@media screen and (min-width:992px) {
  .banner-title-col h1 {
    padding-top: 1rem !important;
    text-align: left;
  }
  
}

/* Slider */

.slick-slide {margin: 0px 20px;}

.slick-slide img {
  max-width: 100%;
}

/* END SLIDER STYLES*/

.helpyou-wrap {
  background-attachment: fixed;
  background-image: url('/image/find-out-more/bw_megaphone.jpg');
  background-position: center bottom;
  background-repeat: no-repeat;
  -webkit-background-size: contain;
  background-size: contain;
}

a.above-footer-button.bg-primary {
  -webkit-transition: all 0.275s ease;
  -moz-transition: all 0.275s ease;
  transition: all 0.275s ease;
}

a.footer-button.bg-primary:hover {text-decoration: none !important;}

.copyright a:hover {
  color:#000000 !important;
}

.copyright {font-size: 12px !important;}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
  header {
    background-attachment: scroll;
    background-position: -145% 50%;
  }
  header::after {
    top: 8vh;
  }
  .tagline-wrapper {
    margin-bottom: 3vh;
  }
  .header-bottom {margin-top: 0 !important;}
  .video-wrap {background-position: 37% 50%;}

  .helpyou-wrap {
    background-attachment: scroll;
    background-position: 46% 127%;
  }
  .pb-ipad-3 {
    padding-bottom: 1rem !important;
  }
}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
  header {
    background-image: none;
    background-attachment: scroll;
  }
  header::after {
    bottom: -4vh;
  }
  .video-wrap {background-position: 36.2% 50%;}
}

/* iPhone 6+, 7+, 8+ ----------- */
@media only screen 
and (min-device-width: 375px) 
and (max-device-height: 667px) 
and (orientation : landscape) {
  
  header::after {
    background-image: url('/image/yelling-girl.png');
    background-repeat: no-repeat;
    background-position: 17% 100%;
    -webkit-background-size: auto 455px;
    background-size: auto 345px;
    content: '';
    display: block;
    height: 100%;
    left: 26px;
    position: absolute;
    bottom: 181vh;
    width: 100%;
    z-index: -4;
    }
  .testimonial-wrapper {
    display: none;
  }
}

@media only screen and (max-device-width: 414px) 
and (orientation : portrait) {
  .page-title {
    font-size: 1rem !important;
  }
  header::after {
    bottom: 33vh;

  }
  .heading-divider {
    left:0;
  }

  .col-12.testimonal-wrapper {
    height: 420px !important;
    top: 0px !important;
  }

  .helpyou-wrap {
    background-attachment: scroll;
    background-position: center 94%;
    background-repeat: repeat-y;
  }
}
