/* BEGIN SM Viewport */
@media (min-width: 576px) {

    :root {
        --container-width: 540px;
    }
    
    #valuesCarousel .value-title,
    #mobileValues .value-title {
        font-size: 2.75rem;
    }
    
    #valuesCarousel .value-p,
    #mobileValues .value-p {
        font-size: 1.5rem;
    }
    
    #mobileValues .carousel-indicators {
        margin: 0.5rem 15% 1rem 15%;
    }
    
    #mobileValues .carousel-indicators > button {
        width: 2.5rem;
        height: 2.5rem;
    }
    
    }
    /* END SM Viewport */
    
    /* BEGIN MD Viewport */
    @media (min-width: 768px) {
    
    :root {
        --container-width: 720px;
    }
    
    header > div > div:last-of-type span.h5 {
        border-left: 1px solid rgba(255,255,255,0.3);
    }

    header.academy-nav > div > div:last-of-type span.h5 {
        border-left: 1px solid rgba(255,255,255,0.0);
    }
    
    .carousel-image {
        background-position: center;
    }
    
    .carousel-caption {
        max-width: calc(var(--container-width) * 0.6);
    }
    
    .carousel-caption p {
        max-width: calc(var(--container-width) * 0.5);
    }
    
    .box-p {
        min-height: 13.5rem;
    }
        
    .vision p {
        font-size: 18pt;
    }
    
    .attention-ofsted-overlay,
    .attention-academies-overlay {
        width: 50%;
    }
    
    .attention-nsc-overlay {
        width: 60%;
        clip-path: polygon(85% 0%, 90% 35%, 83% 100%, 0% 100%, 0 50%, 0% 0%);
    }
    
    .attention-ofsted-overlay,
    .attention-academies-overlay {
        right: 0;
        left: initial;
        clip-path: polygon(100% 0, 100% 35%, 100% 100%, 8% 100%, 0% 35%, 4% 0%);
    }
    
    .breadcrumb nav .breadcrumb-item:first-of-type {
        padding-left: 0.25rem;
    }
        
    .boxes .box .box-title,
    .academies .box .box-title {
        font-size: 14pt;
    }
    
    .bloctoLinkMob {
        display: flex;
        line-height: 1.5rem;
    }
    
    .bloctoRightMob {
        width: 50%;
        font-size: 10pt;
    }
    
    .bloctoAddressMob {
        display: block;
        text-align: right;
        padding: 1.5rem 1rem 0.5rem 0;
    }
    
    .bloctoTypeMob {
        display: block;
        text-align: right;
        text-transform: capitalize;
        padding: 0 1rem 1.5rem;
    }
    
    .bloctoLink {
        display: none;
    }
    
    .btns button.btn {
        font-size: 14pt;
    }

    .fancybox__nav {
        display: flex!important;
    }

    .has-iframe .fancybox__content {
        width: calc(100% - 120px)!important;
    }
    
    }
    /* END MD Viewport */
    
    /* BEGIN LG Viewport */
    @media (min-width: 992px) {
    
    :root {
        --container-width: 960px;
    }

    .acadlogo img {
        max-height: calc(var(--logo-height) * 0.8);
        max-width: calc(var(--logo-height) * 2.1);
    }

    header.academy-nav .hamburger::before {
        top: 1.1rem;
    }
    
    header.academy-nav .hamburger::after {
        bottom: 1.1rem;
    }
    
    .carousel-caption {
        max-width: calc(var(--container-width) * 0.45);
    }
    
    .carousel-caption p {
        max-width: calc(var(--container-width) * 0.35);
    }
    
    .carousel-overlay {
        background: rgba(0,0,0,0.12);
    }
    
    .academy-carousel .carousel-item {
        height: calc(100vh - 11rem);
    }

    .banner {
        height: 40vh;
        min-height: 275px;
    }
    
    .box-p {
        min-height: 10rem;
    }
    
    .ceo img {
        width: 85%;
        margin: 1rem 7.5% 0;
        min-width: 340px;
    }
    
    .ceo span.h1 {
        font-size: 28pt;
    }
    
    .ceo-title {
        top: 3rem;
    }
    
    .vision p {
        font-size: 21pt;
    }
    
    .vision span {
        font-size: 13pt;
    }
    
    .attention-nsc-overlay {
        width: 50%;
    }
    
    .progress-scores .num {
        top: 20%;
    }
        
    .progress-scores .comm {
        font-size: 14pt;
        top: 60%;
    }
    
    .boxes .box img,
    .academies .box img,
    .news .box img {
        height: 17rem;
    }
        
    .footer-bottom {
        font-size: 13pt;
    }

    .offcanvas-top {
        --bs-offcanvas-height: 61.8vh;
    }
    
    }
    /* END LG Viewport */
    
    /* BEGIN XL Viewport */
    @media (min-width: 1200px) {
    
    :root {
        --container-width: 1140px;
    }

    header.academy-nav > div > div:last-of-type span.h5 {
        border-left: 1px solid rgba(255,255,255,0.3);
    }
    
    .carousel-caption .h1 {
        font-size: 32pt;
    }
    
    .carousel-caption p {
        line-height: 2;
    }
    
    .banner {
        height: 50vh;
        min-height: 350px;
    }
    
    .box-p {
        min-height: 12rem;
    }
    
    .ceo img {
        width: 70%;
        margin: 1rem 5% 0 25%;
    }
    
    .ceo-title {
        top: 7.5rem;
    }
    
    #valuesCarousel .carousel-item {
        height: 600px;
    }
    
    #valuesCarousel .logo-strap,
    #valuesCarousel .ourvaluesfloat {
        margin-top: 0;
    }
    
    #valuesCarousel .logo-strap .thelogo {
        width: 5rem;
        height: 5rem;
    }
    
    #valuesCarousel .value-title {
        font-size: 3.5rem;
    }
    
    #valuesCarousel .value-p {
        font-size: 2.25rem;
    }
    
    #valuesCarousel .value-pjust {
        font-size: 1.75rem;
    }
    
    footer {
        background-image: linear-gradient(90deg, #1d1d1d, #1d1d1d calc(((100% - var(--container-width)) / 2) + (var(--container-width) * .75) - 0.375rem), #0e0e0e calc(((100% - var(--container-width)) / 2) + (var(--container-width) * .75) - 0.375rem), #0e0e0e);
    }
    
    }
    /* END XL Viewport */
    
    /* BEGIN XXL Viewport */
    @media (min-width: 1400px) {
    
    :root {
        --container-width: 1320px;
    }
    
    .nav > ul > li > a {
        font-size: 11.5pt;
        padding: 2.5rem 0.6rem 1.75rem;
    }
    
    .header-scroll .nav > ul > li.dropdown > a {
        padding: 1.75rem 1.1rem 1.75rem 0.6rem;
    }
    
    .nav > ul > li.dropdown .dropdown-menu li a {
        font-size: 11.5pt;
    }
    
    header.academy-nav .hamburger::after {
        bottom: 1.05rem;
    }

    .box-p {
        min-height: 10.5rem;
    }
    
    .attention-nsc-overlay {
        width: 52.5%;
    }
    
    .progress-scores .num {
        top: 25%;
    }
    
    footer ul.quickl li a {
        width: 100%;
        display: block;
    }
    
    }
    /* END XXL Viewport */