@media screen and (max-width: 1366px) {

header .logo {  margin: 20px auto; width:180px;}
.wrapper { max-width: 90%;}
.hero h1 { font-size: 3rem;}
.get-started h2 {font-size: 5vw}
.get-started p {font-size:24px;}

}

@media screen and (max-width: 1200px) {

header .logo {margin: 20px 0; padding:10px;  width: 150px; height: 150px;  background: #fff; border-radius: 100%; }

.floating-header.inside header .logo {background: none!important;}

  .inside .hero {
    max-width: 420px;
    margin: 0 7vw 10vw 0;
    text-align: right;
  }

}

@media screen and (max-width: 1100px) {
.classes-marquee__wrapper {bottom: 0vw;}
.floating-header.inside header .logo {padding-left:80px;}

}


/* Tablet portrait view */
@media screen and (max-width: 1024px) {

.wrapper-sml { max-width: 90%;}
.footer-nav {}
.footer-logos {display:block}
.footer-logos img {max-height: 4rem; margin-top: 15px;}
.get-started p {font-size: 18px; }

.hero h1, .inside .hero h1 { font-size: 2rem;}
.feature__banner__content h4 {font-size: 2.5rem}

.line {margin-bottom: 1.5rem}

}

/* Mobile view */
@media screen and (max-width: 900px) {

  header .logo {margin: 10px auto 0; padding:0; width: 120px; height: 93px; }
  .floating-header.inside header .logo {padding:10px;}

  .hero p::before, .hero-text p::before {display:none}

  .inside .hero {
      max-width: 90%;
      margin: 0 auto;

      text-align: center;
  }

  .first-fold.alt {background-color: var(--color-green);}
  .alt header .logo {background:none; margin-top:0; padding-top: 20px;}
  .alt .book-now {border:1px solid #fff}

  .fixed-header header .logo {background:transparent; margin: 0 auto}

  .overlay-text, .floating-header {position:relative}

  header nav {position:relative; top:0; display:block; text-align:center}

  header nav li a {margin:0 10px}
  .book-now {text-align:center; display:inline-flex; align-items:center; margin-left:0}
  .hero {text-align:center; padding: 30px 0; margin: 0 auto; max-width: 90%}

}

/* Mobile view */
@media screen and (max-width: 768px) {



.button, .button-secondary {font-size: 11px}

.info-cards {display:block;}
.info-box {margin: 20px 0}
.intro-section__columns {column-count:1; text-align:center}
.intro-section__columns p {margin: 15px 0}
.intro-section__columns p:first-child {text-align:center}

.info-box h3 {
    font-size: 36px;}
.info-box p {max-width:100%}

.image-grid {
      grid-template-columns: repeat(2, 1fr);
    grid-gap: 10px; margin-top: 45px
}

.hero-text h1 {
    text-align: center;
    font-size: 3.5rem;
    line-height: 1.1;
}

.classes-marquee__comp {min-width:200vw}

.intro-heading h2 {
    font-size: 24px; margin:0 }

.intro-heading {margin:0; padding: 45px 0 0 0}
.intro-heading p::before {display:none}

.get-started__grid {
    grid-template-columns: 1fr;
    gap: 2vw;
}

.contact-form .form-row {
    display: block;

    grid-gap: 10px;
    margin-bottom: 0;
}

.contact-form {
    margin-top: 20px;
}

.footer-bottom {display:block; text-align:center; line-height: 1.4}
.footer-bottom span {display:block}

.form-actions {display:block; margin-bottom: 10px;}
.contact-info {margin-top: 20px;}
.footer__grid {margin: 20px 0 0 0}
.get-started {padding: 30px 0}
    .get-started h2 {
        font-size: 40px; letter-spacing:0
    }


.feature__banner {
    position: relative;
    width: 100%;
}

    .feature__banner__content h4 {
        font-size: 18px;
    }

.feature__banner__content p {font-size:0.75rem}
.highlight p {
    font-size: 2rem;
    margin-bottom: 1rem;
    letter-spacing: -1px;
}


}

/* Small mobile view */
@media screen and (max-width: 480px) {

}


@media (max-width: 1024px) {

}

@media (max-width: 768px) {

}