/* Page CSS */

/* top hero */
.top-hero .m-hero-item .c-subheading {
    overflow: visible;;
}
.top-hero .m-hero-item .c-caption-1 {
    padding-top: 24px;
}
@media screen and (max-width: 767px) {
    .top-hero .m-hero-item.theme-light {
        background-color: white;
    }
    .top-hero.ctaWrap .m-hero-item.theme-light.f-transparent >div>div.high-contrast {
        top: calc(45%);
    }
    .top-hero .m-hero-item .high-contrast .c-heading-1a {
        font-size: 38px;
        line-height: 38px;
    }
}

/* Instant Library Section */
.instantLibrary .m-hero-item .high-contrast .c-group > a:nth-of-type(2) {
    padding: 0 0 0 20px;
}
.instantLibrary .m-hero-item .high-contrast .c-group > a:nth-of-type(2):focus {
    outline: 2px dashed #000 !important;
    border: 2px dashed #fff !important;
}
.instantLibrary.ctaWrap .m-hero-item.f-transparent >div>div.high-contrast {
    max-width: 490px;
}
@media screen and (max-width:1399px) {
    .instantLibrary .m-hero-item .high-contrast .c-group > a:nth-of-type(2) {
        padding-left: 0;
        margin-top: 20px;
    }
    .instantLibrary.ctaWrap .m-hero-item.f-transparent >div>div.high-contrast {
        max-width: 390px;
    }
    .instantLibrary .m-hero-item .high-contrast .c-group > a:nth-of-type(2) {
        padding-left: 0;
        padding-right: 0;
    }
}
@media screen and (max-width:1084px) {
    .instantLibrary.ctaWrap .m-hero-item.f-transparent >div>div.high-contrast {
        max-width: 350px;
    }
}
@media screen and (max-width:950px) {
    .instantLibrary.ctaWrap .m-hero-item.f-transparent >div>div.high-contrast {
        max-width: 320px;
    }
}
@media screen and (max-width:850px) {
    .instantLibrary.ctaWrap .m-hero-item.f-transparent >div>div.high-contrast {
        max-width: 290px;
    }
}
@media screen and (max-width: 767px) {
    .instantLibrary.ctaWrap .m-hero-item.f-transparent >div>div.high-contrast {
        top: calc(45%);
        max-width: 90%
    }
    .instantLibrary.ctaWrap .m-hero-item.f-transparent > div {
        height: 450px;
    }
    .instantLibrary.ctaWrap .m-hero-item.f-transparent .high-contrast .c-heading {
        font-size: 34px;
        line-height: 40px;
    }
    .instantLibrary.ctaWrap .m-hero-item.f-transparent .high-contrast .c-paragraph-2 {
        font-size: 18px;
        line-height: 24px;
    }
    .instantLibrary .m-hero-item .high-contrast .c-group > a:nth-of-type(2) {
        padding-left: 12px;
        margin-top: 0;
    }
}
@media screen and (max-width: 633px) {
    .instantLibrary .m-hero-item .high-contrast .c-group > a:nth-of-type(2) {
        margin-top: 20px;
    }
}
@media screen and (max-width: 450px) {
    .instantLibrary.ctaWrap .m-hero-item.f-transparent > div {
        height: 600px;
    }
    .instantLibrary.ctaWrap .m-hero-item.f-transparent >div>div.high-contrast {
        max-width: 100%
    }
}

/* meta section with pricing and details */
@media screen and (-ms-high-contrast:black-on-white), screen and (forced-colors: active) and (prefers-color-scheme: light) {
  .meta-content-banner .m-banner .c-logo {
      filter: invert(1);
  }
}
.meta-content-banner .m-banner .c-call-to-action:focus:not(.x-hidden-focus) {
    background-color: white;
}
.meta-content-banner .m-banner {
    padding-top: 0;
}
.meta-content-banner .m-banner .c-logo .c-image {
    height: 95px;
    max-height: 95px;
    max-width: 400px;
    width: 100%;
}
.meta-content-banner .m-banner .c-heading-3 {
    font-size: 46px;
    line-height: 35px;
    padding-top:8px;
    padding-bottom: 12px;
}
.meta-content-banner .m-banner .c-group {
    padding-top: 24px;
}
.meta-content-banner .m-banner .c-group > a:nth-of-type(1) {
    margin-right: 24px;
}
@media screen and (max-width: 767px) {
    .meta-content-banner .m-banner .c-heading-3 {
        font-size: 34px;
        line-height: 40px;
    }
    .meta-content-banner .m-banner .c-group {
        padding-top: 12px;
    }
}

/* Meta accessories 4up */
.meta-accessories-4up .theme-dark {
    background-color: #171717;
}
.meta-accessories-4up .fourForeground.zoomOutPad {
    top: -80px;
} 
.meta-accessories-4up .fourForeground.zoomOutPad .m-content-placement {
    margin-bottom: 48px;
} 
.meta-accessories-4up .fourForeground.zoomOutPad .m-content-placement .m-content-placement-item .c-heading {
    font-weight: 700 !important;
}
@media screen and (max-width:1084px) {
    .meta-accessories-4up .theme-dark .m-banner {
        background-color: black;
    }
}

/* Progress goes with you Hero Section */
@media screen and (max-width: 767px) {
    .progressHero.ctaWrap .m-hero-item.f-transparent >div>div.high-contrast {
        top: calc(40%);
    }
    .progressHero.ctaWrap .m-hero-item.f-transparent >div {
        height: 270px;
    }
}

/* Control your Reality Hero Section */
.realityHero .m-hero-item .high-contrast .c-call-to-action {
    margin-top: 24px;
}
@media screen and (max-width: 767px) {
    .realityHero.ctaWrap .m-hero-item.f-transparent >div>div.high-contrast {
        top: calc(40%);
    }
    .realityHero.ctaWrap .m-hero-item.f-transparent >div {
        height: 300px;
    }
}

/* Getting Started Section banner and 4up */
.custContPlacement .m-content-placement .m-content-placement-item .x-type-center a {
    color: #0a4f0a;
}
@media screen and (max-width: 539px) {
    .custContPlacement .m-content-placement > div > div {
        padding-bottom: 0;
    }
}

/* Buy Box */
@media screen and (max-width: 767px) {
    .SB-hero-banner.join-now {
        padding-top: 134px;
    }
}

/* FAQ */
.faq-section .c-heading-4 {
    padding-bottom: 16px;
}
.faq-section .faq-mwf .c-group .c-call-to-action.f-lightweight span {
  white-space: break-spaces;
}
.metaQuestLogo img {
  height:95px;
}

/*
@media screen and (max-width:767px) {
.metaQuestHero section {
   height:53.6vw !important;
 }
}
*/

.meta-content-banner.metaQuestHero  .m-banner {
    position: relative !important;
}

@media screen and (min-width:768px) {
  .meta-content-banner.metaQuestHero  .m-banner {
    top: -50px !important;
    margin-top: -100px !important;
 }
}

@media screen and (max-width:767px) {
  .meta-content-banner.metaQuestHero  .m-banner {
   padding-bottom:48px;
 }
}

@media screen and (min-width:1084px) {
  .meta-content-banner.metaQuestHero  .m-banner {
    top: -100px !important;
    margin-top: -200px !important;
 }
}




