@font-face {
    font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
    font-weight: 500;
    src: url('/Assets/Fonts/helvetica-neue-lt-pro/HelveticaNeueLTProMd.otf') format("opentype");
}

@font-face {
    font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
    font-weight: 500;
    font-style: normal;
    src: url('/Assets/Fonts/helvetica-neue-lt-pro/HelveticaNeueLTProRoman.otf') format("opentype");
}

@font-face {
    font-family: 'Helvetica-Neue-LT-Pro-75-Bold';
    font-weight: bold;
    font-style: normal;
    src: url('/Assets/Fonts/helvetica-neue-lt-pro/HelveticaNeueLTProBd.otf') format("opentype");
}

@font-face {
    font-family: 'Menu-Button-Brackets';
    src: url('/Assets/Fonts/helvetica-neue-lt-pro/HelveticaNeueLTProLt.otf') format("opentype");
}

@font-face {
    font-family: 'Carousel-Button-Arrows';
    src: url('/Assets/Fonts/helvetica-neue-lt-pro/HelveticaNeueLTProUltLt.otf') format("opentype");
}

.desktop-header{
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 120px;
    background-color: #F0F0F0;

    z-index:2;

    .header-logo{
        top:28px;
        left: 84px;
        width: 192px;
        height: 68px;
    }

    .header-button-container{
        position: relative;
        top:47px;
        left: calc(100% - 500px);
        width:208px;
        height: 40px;
        background-color: #262626;
        border-radius: 20px;
        text-align: center;

        z-index: 4;
    }

    .header-menu-button{
        top: 46px;
        left: calc(100% - 168px);
        width: 84px;
        height: 42px;
        font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
        font-size: 18px;
        color: #000000;
        border: none;

        .header-menu-button-contents{
            position: relative;
            width: 84px;
            height: 42px;
            left: 0px;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            
            .menu-bracket-left{
                position: relative;
                display: block;
                width: 10px;
                height: 42px;
                font-size: 0;
                line-height: 0;
                background-image: url("/Assets/Images/NavBar/Menu_CurlyBracket.svg");
                background-repeat: no-repeat;
                background-position: center;
                background-size: contain;
                scale: -1 1;
            }
            .menu-bracket-right{
                position: relative;
                display: block;
                width: 10px;
                height: 42px;
                font-size: 0;
                line-height: 0;
                background-image: url("/Assets/Images/NavBar/Menu_CurlyBracket.svg");
                background-repeat: no-repeat;
                background-position: center;
                background-size: contain;
            }
            .menu-text{
                display: inline;
                justify-self: center;
                line-height: 38px;
            }
        }

        
    }
}

.mobile-header{
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 66px;
    background-color: #F0F0F0;

    z-index:2;

    .header-logo{
        top:17px;
        left: 16px;
        width: 94px;
        height: 33px;
    }

        .header-menu-button{
        top: 17px;
        left: calc(100% - 64px);
        width: 48px;
        height: 33px;
        padding: 0px;
        color: #000000;
        border: none;

        .header-menu-button-contents{
            position: relative;
            width: 100%;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            .menu-bars{
                display: block;
                width: 42.35px;
                height: 21.18px;
                background-image: url("/Assets/Images/NavBar/Menu_Hamburger.svg");
                background-repeat: no-repeat;
                background-position: center;
                background-size: 42.35px 21.18px;
            }
        }
    }
}

.header-button-container{
    position: fixed;
    top:47px;
    left: calc(100% - 500px);
    width:208px;
    height: 40px;
    background-color: #262626;
    border-radius: 20px;
    text-align: center;

    z-index: 4;

    .header-search-button{
        position: relative;
        font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
        font-size: 18px;
        line-height: 40px;
        color: #FFFFFF ;
        text-decoration: none;
    }
}

.desktop-menu{
    z-index: 6;
    position: fixed;
    top:0px;
    left:0px;
    width: 100%;
    height: 595px;

    .desktop-header{
        position: absolute;
        top: -595px;
        left: 0px;
        width: 100%;
        height: 595px;
        background-color: #FFFFFF;

        .header-logo{
            top:28px;
            left: 84px;
            width: 192px;
            height: 68px;
        }

        .header-button-container{
            position: relative;
            display: grid;
            top:47px;
            left: calc(100% - 500px);
            width:208px;
            height: 40px;
            background-color: #262626;
            border-radius: 20px;
        }

        .header-menu-button{
            top: 46px;
            left: calc(100% - 168px);
            width: 84px;
            height: 42px;
            font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
            font-size: 18px;
            color: #000000;
            border: none;

            .header-menu-button-contents{
                position: relative;
                width: 84px;
                height: 42px;
                left: 0px;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 6px;
                
                .menu-bracket-left{
                    position: relative;
                    display: block;
                    width: 10px;
                    height: 42px;
                    font-size: 0;
                    line-height: 0;
                    background-image: url("/Assets/Images/NavBar/Menu_CurlyBracket.svg");
                    background-repeat: no-repeat;
                    background-position: center;
                    background-size: contain;
                    scale: -1 1;
                }
                .menu-bracket-right{
                    position: relative;
                    display: block;
                    width: 10px;
                    height: 42px;
                    font-size: 0;
                    line-height: 0;
                    background-image: url("/Assets/Images/NavBar/Menu_CurlyBracket.svg");
                    background-repeat: no-repeat;
                    background-position: center;
                    background-size: contain;
                }
                .menu-text{
                    display: block;
                    width: 22px;
                    height: 22px;
                    font-size: 0;
                    line-height: 0;
                    background-image: url("/Assets/Images/NavBar/Menu_Close.svg");
                    background-repeat: no-repeat;
                    background-position: center;
                    background-size: 22px 22px;
                }
            }
        }

        .desktop-menu-options{
            position: relative;
            top:110px;
            left: calc(100% - 924px);
            width:408px;
            text-wrap: nowrap;

            a{
                text-decoration: none;
                display: block;
                font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
                font-size: 56px;
                line-height: 59px;
                letter-spacing: 0px;
                color: #8D8D8D;
                padding-bottom: 26px;
                transition: 200ms ease-out;
            }

            a:hover{
                color:#404040;
                transition: 200ms ease-out;
            }
        }
    }
}

.mobile-menu{
    z-index: 6;
    position: fixed;
    top:0px;
    left:0px;
    width: 100%;
    height: 100%;

    .mobile-header{
        position: absolute;
        top: -100%;
        left: 0px;
        width: 100%;
        height: 100%;
        background-color: #FFFFFF;

        .header-logo{
            top:17px;
            left: 16px;
            width: 94px;
            height: 33px;
        }

        .header-button-container{
            position: absolute;
            top:140px;
            left: 63px;
            width:208px;
            height: 40px;
            background-color: #262626;
            border-radius: 20px;
        }

        .header-menu-button{
            top: 17px;
            left: calc(100% - 74px);
            width: 58px;
            height: 33px;
            font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
            font-size: 18px;
            color: #000000;
            border: none;

            .header-menu-button-contents{
                position: relative;
                width: 58px;
                height: 33px;
                left: 0px;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 4px;
                
                .menu-bracket-left{
                    position: relative;
                    display: block;
                    width: 8px;
                    height: 28px;
                    font-size: 0;
                    line-height: 0;
                    background-image: url("/Assets/Images/NavBar/Menu_CurlyBracket.svg");
                    background-repeat: no-repeat;
                    background-position: center;
                    background-size: contain;
                    scale: -1 1;
                }
                .menu-bracket-right{
                    position: relative;
                    display: block;
                    width: 8px;
                    height: 28px;
                    font-size: 0;
                    line-height: 0;
                    background-image: url("/Assets/Images/NavBar/Menu_CurlyBracket.svg");
                    background-repeat: no-repeat;
                    background-position: center;
                    background-size: contain;
                }
                .menu-text{
                    display: block;
                    width: 20px;
                    height: 20px;
                    font-size: 0;
                    line-height: 0;
                    background-image: url("/Assets/Images/NavBar/Menu_Close.svg");
                    background-repeat: no-repeat;
                    background-position: center;
                    background-size: 20px 20px;
                }
            }
        }

        .mobile-menu-options{
            position: relative;
            top:197px;
            left: 60px;
            width:275px;
            text-wrap: nowrap;

            a{
                text-decoration: none;
                display: block;
                font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
                font-size: 29px;
                line-height: 30px;
                color: #8D8D8D;
                padding-bottom: 30px;
                transition: 200ms ease-out;
            }

            a:hover{
                color:#404040;
                transition: 200ms ease-out;
            }
        }
    }
}

.carousel-container{
    overflow: hidden;
    position: absolute;
    top: 121px;
    left: 0px;
    width: 100%;
    height: 192px;
}

#desktopMainCarousel{
    position: absolute;
    top:120px;
    left:0px;
    width: 100%;
    height: 473px;

    .desktop-main-carousel-inner{
        position: relative;
        display: grid;
        grid-template-columns: auto auto auto;
        top:0px;
        left: 0px;
        width: 300%;
        height: 100%;
    }

    .desktop-main-carousel-item{
        position: absolute;
        width: calc(100%/3);
        height: 100%;
    }

    #deskMainCarItem1{
        left:0px;
    }

    #deskMainCarItem2{
        left:calc(100%/3);
    }

    #deskMainCarItem3{
        left:calc(200%/3);
    }

    .carousel-item-container{
        position:absolute;
        display: inline-block;
    }

    .carousel-item-arrow-container{
        align-content: center;
        left: 0px;
        height: 100%;
        width: 84px;
    }

    .carousel-item-clickthrough{
        position: relative;
        width: calc(100% - 168px);
        height: 100%;
        left: 84px;
    }

    .carousel-item-text-container{
        left:0px;
        width: calc(100% - 840px);
    }

    .carousel-item-image-container{
        width: 840px;
        left: calc(100% - 840px);
        height: 100%;
        overflow: hidden;
    }

    .carousel-item-right-arrow-container{
        top:0px;
        left:calc(100% - 84px);
    }

    .carousel-arrow{
        width:84px;
        height:84px;
        font-family: 'Carousel-Button-Arrows';
        font-size: 60px;
        text-align: center;
        line-height: 42px;
        background-color: #00000000;
        border:none;
        margin-bottom: 29px;
    }

    .carousel-left-arrow{
        letter-spacing: -14px;
    }

    .carousel-right-arrow{
        letter-spacing: 24px;
    }

    .carousel-text-box{
        position: relative;
        top: 80px;
        left: 0px;

        font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
        font-size: 56px;
        letter-spacing: 0px;
        line-height: 59px;
        text-align: left;

        text-wrap: wrap;
    }

    .carousel-text-box .grey-text{
        color: #8D8D8D;
    }

    .carousel-text-box-link-container{
        position: relative;
        display: grid;
        top:109px;
        width:163px;
        height: 36px;
        border: 1px solid #000000;
        background: #FFFFFF 0% 0% no-repeat padding-box;
        border-radius: 18px;
    }

    a{
        align-self: center;
        justify-self: center;
        font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
        font-size: 16px;
        letter-spacing: 0px;
        line-height: 22px;
        text-align: left;
        text-decoration: none;
        color: #000000;
    }

    .carousel-text-box-link-container:hover {
        background-color: #262626;
        color: #FFFFFF;

        a{
            background-color: #262626;
            color: #FFFFFF;
        }
    }
}

#mobileMainCarousel{
    position: absolute;
    top:66px;
    left:16px;
    width: calc(100% - 32px);
    height: 659px;

    @media only screen and (min-width: 1045px) {
        top:120px;
    }

    .mobile-main-carousel-inner{
        position: relative;
        display: flex;
        top:0px;
        left: 0px;
        width: 300%;
        height: 100%;

        .mobile-main-carousel-item{
            width: 100%;
            overflow: hidden;
            
            .carousel-item-image-container{
                position: relative;
                height: 343px;
                width: 100%;
                overflow: hidden;
                
                img{position: absolute;
                    height: 100%;
                    left: calc(50% - 305px);
                }
            }

            .carousel-item-text-container{
                position: relative;
                top: 30px;
                left: max(calc(50% - 305px), 16px);
                width: calc(100% - (2 * max(calc(50% - 305px), 16px)));
                font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
                font-size: 40px;
                line-height: 44px;
                color: #000000;

                .carousel-text-box{
                    width: 100%;
                    text-wrap-style: balance;
                }

                .grey-text{
                    color:  #8D8D8D;
                }
                
                .carousel-text-box-link-container{
                    position: relative;
                    top: 20px;
                    width: 142px;
                    height: 36px;

                    border: 1px solid #000000;
                    border-radius: 18px;
                    text-align: center;
                    justify-content: center;

                    a{  
                        display: block;
                        position: relative;
                        font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
                        font-size: 16px;
                        line-height: 36px;
                        color: #000000;

                        text-decoration: none;
                    }
                }
            }
        }
    }
}

.desktop-main-carousel-radio-buttons{
    display: block;
    position:relative;
    top:638px;
    left:84px;
    width:120px;
    font-size: 20px;

    input{
        -webkit-appearance: none;
        appearance: none;
        width:20px;
        height: 20px;
        margin: 0px 16px 0px 0px;
        border: 4px solid #CCCCCC;
        border-radius: 4px;
        background: #FFFFFF no-repeat center center;
        border-radius: 50%;
    }

    input:checked{
        background-color: #CCCCCC;
    }
}

.mobile-main-carousel-radio-buttons{
    display: block;
    position: absolute;
    top:745px;
    left: max(calc(50% - 289px), 32px);
    width:120px;
    font-size: 20px;

    input{
        -webkit-appearance: none;
        appearance: none;
        width:20px;
        height: 20px;
        margin: 0px 16px 0px 0px;
        border: 4px solid #CCCCCC;
        border-radius: 4px;
        background: #FFFFFF no-repeat center center;
        border-radius: 50%;
    }

    input:checked{
        background-color: #CCCCCC;
    }
}

.desktop-course-selection-filter-container{
    position: absolute;
    top: 592px;
    left: calc(100% - 924px);
    width:840px;
    height: 299px;
    background-color: #D3D3D3;
    z-index: 1;
}

.mobile-course-selection-filter-container{
    position: absolute;
    top: 799px;
    left: max(calc(50% - 305px), 16px);
    width: min(calc(100% - 32px), 609px);
    height: 467px;
    background-color: #D3D3D3;
    z-index: 1;
}

.desktop-course-selection-filter-header{
    position: relative;
    top: 31px;
    left: 40px;
    width: 434px;
    height: 34px;
    font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
    font-size: 34px;
    line-height: 48px;
    letter-spacing: 0px;
    color: #000000;
}

.mobile-course-selection-filter-header{
    position: relative;
    top: 31px;
    left: 20px;
    width: 303px;
    font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
    font-size: 25px;
    line-height: 25px;
    color: #000000;
}

.desktop-course-selection-filter-grid{
    position: relative;
    display: grid;
    grid-template-columns: auto auto;
    grid-template-rows: auto auto;
    top:41px;
    left:40px;
    width: 760px;
    height: 165px;

    .grid-Item{
        position: absolute;
        display: block;
        width: 100%;
        height: 100%;
        font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
        font-weight: normal;
        font-size: 16px;
        line-height: 22px;

        p{
            position: relative;
            margin-top: 20px;
            margin-left: 20px;
            margin-bottom: 6px;
        }
    }

    #gridItem1{
        grid-row: 1 / span 1;
        grid-column: 1 / span 1;
    }

    #gridItem2{
        grid-row: 1 / span 1;
        grid-column: 2 / span 1;
    }

    #gridItem3{
        grid-row: 2 / span 1;
        grid-column: 1 / span 1;
    }

    #gridItem4{
        grid-row: 2 / span 1;
        grid-column: 2 / span 1;

        .desktop-submit{
            top: 52px;
        }
    }
}

.dropdown{
    position: relative;
    width: 368px;
    height: 36px;
    background-color: #FFFFFF;
    border-radius: 18px;
    overflow: hidden;
    transition: 150ms ease-out;

    .dropbtn{
        position: relative;

        background-color: #FFFFFF;
        border: none;
        padding:0px;

        font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
        color: #404040;
        font-weight: normal;
        font-size: 16px;
        line-height: 22px;
        text-align: left;
        text-indent: 20px;
    }

    .dropbtn-main{
        width: 332px;
        height: 36px;
    }

    .dropbtn-option{
        top: -48px;
        width: 100%;
        height: 24px;
        opacity: 0;
    }

    img{
        position: relative;
        top:-36px;
        left: 332px;
        transform: scale(1, -1);
        transition: 150ms ease-out;
    }
}

.dropdown-hover{
    position: relative;
    width: 368px;
    height: 36px;
    background-color: #FFFFFF;
    border-radius: 18px;
    overflow: hidden;
    transition: 150ms ease-out;
    z-index: 1;

    .dropbtn{
        position: relative;

        background-color: #FFFFFF;
        border: none;
        padding:0px;

        font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
        color: #404040;
        font-weight: normal;
        font-size: 16px;
        line-height: 22px;
        text-align: left;
        text-indent: 20px;
    }

    .dropbtn-main{
        width: 332px;
        height: 36px;
    }

    .dropbtn-option{
        top: -48px;
        width: 100%;
        height: 24px;
        opacity: 1;
        text-decoration-line: underline;
        text-decoration-color: #00000000;
        text-decoration-thickness: 0px;
        transition: 200ms;
    }

    .dropbtn-option:hover{
        text-decoration-line: underline;
        text-decoration-color: #000000;
        text-decoration-thickness: 1px;
        transition: 200ms;
    }

    img{
        position: relative;
        top:-36px;
        left: 332px;
        transform: scale(1, 1);
        transition: 150ms ease-out;
    }
}

.mobile-course-selection-filter-bg{
    position: absolute;
    top: 1073px;
    left: 0px;
    width: 100%;
    height: 193px;
    background-color: #404040;
}

.mobile-course-selection-filter-grid{
    position: relative;
    display: grid;
    grid-template-columns: auto;
    grid-template-rows: auto auto auto auto;
    top:28px;
    left:20px;
    width: calc(100% - 40px);
    height: 338px;

    .grid-Item{
        position: absolute;
        display: block;
        width: 100%;
        height: 100%;
        font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
        font-weight: normal;
        font-size: 16px;
        line-height: 22px;

        p{
            position: relative;
            margin-top: 20px;
            margin-left: 20px;
            margin-bottom: 10px;
        }

        .dropdown{
            position: relative;
            width: 100%;
            height: 36px;
            background-color: #FFFFFF;
            border-radius: 18px;
            overflow: hidden;
            transition: 150ms ease-out;

            .dropbtn{
                position: relative;

                background-color: #FFFFFF;
                border: none;
                padding:0px;

                font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
                font-weight: normal;
                font-size: 16px;
                line-height: 22px;
                text-align: left;
                text-indent: 20px;
            }

            .dropbtn-main{
                width: calc(100% - 36px);
                height: 36px;
            }

            .dropbtn-option{
                top: -48px;
                width: 100%;
                height: 24px;
                opacity: 0;
            }

            img{
                position: relative;
                top:-36px;
                left: calc(100% - 36px);
                transform: scale(1, -1);
                transition: 150ms ease-out;
            }
        }

        .dropdown-hover{
            position: relative;
            width: 100%;
            height: 36px;
            background-color: #FFFFFF;
            border-radius: 18px;
            overflow: hidden;
            transition: 150ms ease-out;
            z-index: 1;

            .dropbtn{
                position: relative;

                background-color: #FFFFFF;
                border: none;
                padding:0px;

                font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
                font-weight: normal;
                font-size: 16px;
                line-height: 22px;
                text-align: left;
                text-indent: 20px;
            }

            .dropbtn-main{
                width: calc(100% - 36px);
                height: 36px;
            }

            .dropbtn-option{
                top: -48px;
                width: 100%;
                height: 24px;
                opacity: 1;
                text-decoration-line: underline;
                text-decoration-color: #00000000;
                text-decoration-thickness: 0px;
                transition: 200ms;
            }

            .dropbtn-option:hover{
                text-decoration-line: underline;
                text-decoration-color: #000000;
                text-decoration-thickness: 1px;
                transition: 200ms;
            }

            img{
                position: relative;
                top:-36px;
                left: calc(100% - 36px);
                transform: scale(1, 1);
                transition: 150ms ease-out;
            }
        }
    }

    #m_gridItem1{
        grid-row: 1 / span 1;
    }

    #m_gridItem2{
        grid-row: 3 / span 1;
    }

    #m_gridItem3{
        grid-row: 2 / span 1;
    }

    #m_gridItem4{
        grid-row: 4 / span 1;

        .mobile-submit{
            top: 52px;
        }
    }
}

.desktop-submit{
    position: relative;
    width: 368px;
    height: 36px;

    border-radius: 18px;
    overflow: hidden;

    #submitBtn{
        position: relative;
        width: 368px;
        height: 36px;

        background-color: #262626;
        border: none;
        padding:0px;

        color: #FFFFFF;
        font-family: 'Helvetica-Neue-LT-Pro-75-Bold';
        font-size: 16px;
        line-height: 22px;
        text-align: center;
    }
}

.mobile-submit{
    position: relative;
    width: 100%;
    height: 36px;

    border-radius: 18px;
    overflow: hidden;

    #m_submitBtn{
        position: relative;
        width: 100%;
        height: 36px;

        background-color: #262626;
        border: none;
        padding:0px;

        color: #FFFFFF;
        font-family: 'Helvetica-Neue-LT-Pro-75-Bold';
        font-size: 16px;
        line-height: 22px;
        text-align: center;
    }
}

.desktop-latest-news-container{
    position: absolute;
    z-index: 0;
    top: 1265px;
    left: 0px;
    width: 100%;
    height: 466px;
    background-color: #404040;

    @media only screen and (min-width: 1402px) {
        top:799px;
    }
}

.mobile-latest-news-container{
    position: absolute;
    z-index: 0;
    top: 1265px;
    left: 0px;
    width: 100%;
    height: 826px;
    background-color: #404040;
}

.desktop-subheader{
    font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
    font-size: 34px;
    line-height: 48px;

    position: relative;
    top: 60px; /*71*/
    left: 84px;
    height: 34px;
    width: calc(100% - 84px);

    text-wrap: nowrap;


    a{
        font: inherit;
        text-decoration: none;
        color: #000000;
    }

    .desktop-subheader-underline{
        width: 0%;
        height: 1px;
        opacity: 0;
        background-color: #000000;
        transition: 200ms ease-out;
    }
}

.mobile-subheader{
    font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
    font-size: 25px;
    line-height: 35px;

    position: relative;
    top: 60px; /*71*/
    left: 16px;
    height: 35px;
    width: calc(100% - 32px);

    text-wrap: nowrap;

    a{
        font: inherit;
        text-decoration: none;
        color: #000000;
    }

    .mobile-subheader-underline{
        width: 0%;
        height: 1px;
        opacity: 0;
        background-color: #000000;
        transition: 200ms ease-out;
    }
}

.desktop-subheader:hover{
    .desktop-subheader-underline{
        opacity: 1
    }
}

.moblie-subheader:hover{
    .mobile-subheader-underline{
        opacity: 1
    }
}

.desktop-latest-news-subheader{
    top: 109px;
    width: 306px;

    a{
        color: #FFFFFF;
    }

    .desktop-subheader-underline{
        background-color: #FFFFFF;
    }
}

.mobile-latest-news-subheader{
    a{
        color: #FFFFFF;
    }

    .mobile-subheader-underline{
        background-color: #FFFFFF;
    }
}

.desktop-latest-news-subheader:hover{
    .desktop-subheader-underline{
        opacity: 1;
        width: 190px;
    }
}

.mobile-latest-news-subheader:hover{
    .mobile-subheader-underline{
        opacity: 1;
        width: 140px;
    }
}

#newsCarousel{
    top: 202px;

    .carousel-arrow-btn{
        color: #FFFFFF;
    }
}

#newsList{
    position: relative;
    top: 114px;
}

.carousel-left-arrow-container{
    position: absolute;
    align-content: center;
    top: 0px;
    left: 0px;
    width: 86px;
    height: 100%;
}

.carousel-right-arrow-container{
    position: absolute;
    align-content: center;
    top: 0px;
    left: calc(100% - 86px);
    width: 86px;
    height: 100%;
}

.carousel-arrow-btn {
        width: 86px;
        height: 86px;
        font-family: 'Carousel-Button-Arrows';
        font-size: 60px;
        text-align: center;
        line-height: 42px;
        background-color: #00000000;
        color: #000000;
        border:none;
        margin-bottom: 0px;
}

.carousel-arrow-btn.left-btn{
    letter-spacing: -14px;
}

.carousel-arrow-btn.right-btn{
    letter-spacing: 24px;
}

.carousel-inner{
    position: absolute;
    top: 0px;
    left: 84px;
    width: calc(100% - 168px);
    height: 100%;
    overflow: hidden;
}

.carousel-item{
    position: absolute;
    display: flex;
    justify-content: center;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}

.carousel-content-item{
    display: flex;
}

.desktop-our-colleges-container{
    position: absolute;
    top: 2091px;
    height: 360px;
    width: 100%;
    left: 0px;

    @media only screen and (min-width: 606px) {
        top: 1731px;
    }

    @media only screen and (min-width: 1402px) {
        top: 1265px;
    }
}

.desktop-our-colleges-container .desktop-subheader{
    width: 198px;
}

.desktop-our-colleges-container .mobile-subheader{
    width: 198px;
}

.desktop-our-colleges-container .desktop-subheader:hover{
    .desktop-subheader-underline{
        opacity: 1;
        width: 200px;
    }
}

.desktop-our-colleges-container .mobile-subheader:hover{
    .mobile-subheader-underline{
        opacity: 1;
        width: 150px;
    }
}

.desktop-column-container{
    position: absolute;
    display: flex;
    top: 2451px;
    height: 440px;
    width: 100%;
    left: 0px;

    background-color: #D3D3D364;

    @media only screen and (min-width: 606px) {
        top: 2091px;
    }

    @media only screen and (min-width: 1402px) {
        top: 1625px;
    }
}

.desktop-small-column-container{
    position: absolute;
    display: grid;
    grid-template-columns: auto;
    grid-template-rows: auto auto;
    top: 2451px;
    height: 880px;
    width: 100%;
    left: 0px;

    background-color: #D3D3D364;

    @media only screen and (min-width: 606px) {
        top: 2091px;
    }

    @media only screen and (min-width: 1402px) {
        top: 1625px;
    }
}

.mobile-column-container{
    position: absolute;
    top: 2451px;
    height: 1608px;
    width: 100%;
    left: 0px;

    background-color: #D3D3D364;

    @media only screen and (min-width: 606px) {
        top: 2091px;
    }

    @media only screen and (min-width: 1402px) {
        top: 1625px;
    }
}

.desktop-column{
    width: 50%;
    display: grid;
    grid-template-columns: auto 300px;
    
}

.desktop-small-column{
    position: relative;
    left: 5%;
    width: 90%;
    height: 440px;
    display: grid;
    grid-template-columns: auto auto;
    
}

.mobile-column{
    position: relative;
    width: 100%;
    height: 804px;
}

.desktop-column-text{
    position: relative;
    top: 80px;
    left: 84px;
    width: calc(100% - 119px);

    font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
    font-weight: normal;
    font-size: 16px;
    line-height: 22px;
    color: #000000;

    p{
        max-height: 245px;
        overflow: hidden;
    }
}

.mobile-column-text-container{
    height: 378px;
}

.mobile-column-text{
    position: relative;
    top: 80px;
    left: 16px;
    width: calc(100% - 64px);
    height: 160px;

    font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
    font-weight: normal;
    font-size: 16px;
    line-height: 22px;
    color: #000000;

    p{
        max-height: 195px;
        margin: 0px;
        overflow: hidden;
    }
}

.desktop-column-text-btn{
    position: relative;
    width: 155px;
    height: 36px;
    border-radius: 18px;
    background-color: #404040;
    color: #FFFFFF;
    text-align: center;
    line-height: 36px;
}

.mobile-column-text-btn{
    position: relative;
    width: 134px;
    height: 32px;
    margin-top: 30px;
    border-radius: 18px;
    background-color: #404040;
    color: #FFFFFF;
    text-align: center;
    font-size: 14px;
    line-height: 32px;
}

.desktop-column-image{
    width: 300px;
    height: 100%;

    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.mobile-column-image-container{
    position: relative;
    width: calc(100% - 32px);
    left: 16px;
    margin-top: 48px;
    overflow: hidden;
}

.mobile-column-image{
    height: 350px;

    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

#historyImg{
    background-image: url('/Assets/Images/Homepage/Vintage_Reader_1200px.jpg');
}

#studyImg{
    background-image: url('/Assets/Images/Homepage/shutterstock_1868245723_1200px.jpg');
}

.desktop-partners-container{
    position: absolute;
    top: 3961px;
    height: 360px;
    width: 100%;
    left: 0px;

    @media only screen and (min-width: 606px) {
        top: 3601px;
    }

    @media only screen and (min-width: 776px) {
        top: 2971px;
    }

    @media only screen and (min-width: 1376px) {
        top: 2531px;
    }

    @media only screen and (min-width: 1402px) {
        top: 2065px;
    }
}

.desktop-partners-container .desktop-subheader{
    width: 133px;
}

.desktop-partners-container .desktop-subheader:hover{
    .desktop-subheader-underline{
        opacity: 1;
        width: 133px;
    }
}

.desktop-partners-container .mobile-subheader:hover{
    .mobile-subheader-underline{
        opacity: 1;
        width: 100px;
    }
}

.desktop-footer{
    position: absolute;
    top: 4322px;
    left: 0px;
    width: 100%;
    height: 600px;
    background-color: #262626;
    text-align: center;

    @media only screen and (min-width: 606px) {
        top: 3962px;
    }

    @media only screen and (min-width: 776px) {
        top: 3332px;
    }

    @media only screen and (min-width: 1376px) {
        top: 2892px;
    }

    @media only screen and (min-width: 1402px) {
        top: 2426px;
    }

    @media only screen and (max-width: 1000px) {
            height:673px;
    }

    .desktop-footer-logo {
        position: relative;
        top: 117px;
        width: 300px;
        height: 106px;
    }

    .desktop-footer-links{
        position: absolute;
        top: 293px;
        width: 100%;
        height:16px;

        @media only screen and (max-width: 1000px) {
            width: calc(100% - 64px);
            left: 32px;
            height:126px;
        }

        a{
            color: #D3D3D3;
            font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
            font-size: 16px;
            line-height: 22px;
            text-decoration: none;
            margin: 0px 20px;

            @media only screen and (max-width: 1000px) {
                display: block;
            }
        }
    }

    .desktop-footer-text{
        position: absolute;
        top: 349px;
        width: 100%;
        font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
        font-weight: normal;
        font-size: 14px;
        line-height: 24px;
        color: #FFFFFF;

        @media only screen and (max-width: 1000px) {
            top: 459px;
            font-size: 11px;
            line-height: 16px;
        }
    }
}

overlayBoldText{
    font-family: 'Helvetica-Neue-LT-Pro-75-Bold';
    font-weight: bold;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0px;
    color: #262626
}

.desktop-our-courses-page{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 4346px;
    background-color: #F0F0F0;

    @media only screen and (min-width: 860px) {
        height: 2753px;
    }

    @media only screen and (min-width: 1290px) {
        height: 2222px;
    }

    .desktop-subheader{
        top: 191px;
    }

    .page-text{
        position: relative;
        top: 221px;
        left: 81px;
        width: calc(100% - 168px);
        margin: 0px;

        font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
        font-weight: normal;
        font-size: 20px;
        line-height: 24px;
        color: #000000;
    }

    .our-courses-grid{
        position: relative;
        display: grid;
        justify-content: center;
        top: 251px;
        gap: 24px;

        .course-container{
            width: 408px;
            height: 507px;
            background-color: #FFFFFF;
        }

        @media only screen and (min-width: 0px) {
            width: 100%;
            grid-template-columns: auto;
            .course-container{
                width: 100%;
            }
        }

        @media only screen and (min-width: 408px) {
            grid-template-columns: auto;
            .course-container{
                width: 408px;
            }
        }

        @media only screen and (min-width: 860px) {
            grid-template-columns: auto auto;
        }

        @media only screen and (min-width: 1032px) {
            left: 81px;
            width: calc(100% - 168px);
            gap: 24px min(calc(100% - (2 * 408px)), 84px);
            grid-template-columns: auto auto;
        }

        @media only screen and (min-width: 1290px) {
            left: 0px;
            width: 100%;
            gap: 24px;
            grid-template-columns: auto auto auto;
        }

        @media only screen and (min-width: 1440px) {
            left: 81px;
            width: calc(100% - 168px);
            gap: 24px min(calc((100% - (3 * 408px)) / 2), 84px);
            grid-template-columns: auto auto auto;
        }

        .course-container-content{
            position:relative;
            height:100%;
        }

        .course-container-header {
            position: relative;
            top: 47px;
            left: 40px;
            width: 328px;
            font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
            font-size: 34px;
            line-height: 38px;
        }

        .course-container-text {
            position: relative;
            top: 67px;
            left: 40px;
            width: 324px;
            font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
            font-weight: normal;
            font-size: 16px;
            line-height: 22px;
            margin-bottom: 12px;
            color: #262626;
        }

        .course-container-btn {
            position: relative;
            top: 68px;
            left: 40px;
            width: 155px;
            height: 36px;
            font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
            font-size: 16px;
            line-height: 22px;
            background-color: #00000000;
            border: 1px solid;
            border-radius: 18px;
        }

        .course-container-footer{
            position: relative;
            top: -102px;
            left: 40px;
            width: 328px;
            height: 72px;
            color: #FFFFFF;
            text-transform: uppercase;

            .course-container-footer-left{
                position: absolute;
                top: 14px;
                left: 20px;
                font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
                font-weight: normal;
                font-size: 14px;
                line-height: 18px;
            }

            .course-container-footer-right{
                position: absolute;
                top: 14px;
                right: 20px;
                font-family: 'Helvetica-Neue-LT-Pro-75-Bold';
                font-size: 28px;
                line-height: 28px;
                text-align: right;
            }
        }
        
        #ACCContainer{
            .course-container-header{
                color: #326690;
            }

            .course-container-btn {
                color: #326690;
                border-color: #326690;
            }

            .course-container-footer{
                background-color: #326690;
            }
        }

        #CCPTContainer{
            .course-container-header{
                color: #008494;
            }
            
            .course-container-btn {
                color: #008494;
                border-color: #008494;
            }

            .course-container-footer{
                background-color: #008494;
            }
        }

        #RAContainer{
            .course-container-header{
                color: #C05978;
            }
            
            .course-container-btn {
                color: #C05978;
                border-color: #C05978;
            }

            .course-container-footer{
                background-color: #C05978;
            }
        }

        #HSTContainer{
            .course-container-header{
                color: #A3A332;
            }
            
            .course-container-btn {
                color: #A3A332;
                border-color: #A3A332;
            }

            .course-container-footer{
                background-color: #A3A332;
            }
        }

        #HCCContainer{
            .course-container-header{
                color: #739253;
            }
            
            .course-container-btn {
                color: #739253;
                border-color: #739253;
            }

            .course-container-footer{
                background-color: #739253;
            }
        }

        #BSYContainer{
            .course-container-header{
                color: #D29500;
            }
            
            .course-container-btn {
                color: #D29500;
                border-color: #D29500;
            }

            .course-container-footer{
                background-color: #D29500;
            }
        }
    }
}

.desktop-footer.our-courses {
    position: absolute;
    top: 3746px;

    @media only screen and (min-width: 860px) {
        top: 2153px;
    }

    @media only screen and (min-width: 1290px) {
        top: 1622px;
    }
}

.desktop-our-colleges-page{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 2461px;
    background-color: #FFFFFF;

    @media only screen and (min-width: 640px) {
        height: 1391px;
    }

    @media only screen and (min-width: 1070px) {
        height: 1741px;
    }

    .desktop-subheader{
        top: 191px;
    }

    .page-text{
        position: relative;
        top: 221px;
        left: 81px;
        width: calc(100% - 168px);
        margin: 0px;

        font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
        font-weight: normal;
        font-size: 20px;
        line-height: 24px;
        color: #000000;
    }

    .our-colleges-grid{
        position: absolute;
        display: grid;
        justify-content: center;
        top: 375px;
        width: 100%;
        grid-template-columns: auto;
        gap: 78px;

        .college-container{
            width: 300px;
            height: 250px;
        }

        @media only screen and (min-width: 640px) {
            grid-template-columns: auto auto;
            top: 429px;
            left: 0px;
            width: 100%;
            gap: 60px 30px;
        }

        @media only screen and (min-width: 812px) {
            left: 81px;
            width: calc(100% - 168px);
            gap: 60px min(calc(100% - (2 * 300px)), 84px);
            grid-template-columns: auto auto;
        }

        @media only screen and (min-width: 1070px) {
            left: 0px;
            width: 100%;
            gap: 60px 66px;
            grid-template-columns: auto auto auto;
        }

        @media only screen and (min-width: 1220px) {
            left: 84px;
            width: calc(100% - 168px);
            gap: 60px min(calc((100% - (3 * 300px)) / 2), 84px);
            grid-template-columns: auto auto auto;
        }

        .college-logo-container{
            position:relative;
            height:100px;
            background-repeat: no-repeat;
            background-size: contain;
            background-position: center;
        }

        #ACCContainer{
            .college-logo-container{
                background-image: url("/Assets/Images/OurColleges/College_Logos/AnimalCareCollege_Logo.svg");
            }
        }

        #CCPTContainer{
            .college-logo-container{
                background-image: url("/Assets/Images/OurColleges/College_Logos/Centre_for_C&P.svg");
            }
        }

        #RAContainer{
            .college-logo-container{
                background-image: url("/Assets/Images/OurColleges/College_Logos/RegentAcademy_Logo.svg");
            }
        }

        #HSTContainer{
            .college-logo-container{
                background-image: url("/Assets/Images/OurColleges/College_Logos/HST_Redrawn_Logo_1a.svg");
            }
        }

        #HCCContainer{
            .college-logo-container{
                background-image: url("/Assets/Images/OurColleges/College_Logos/HCC_Logo_2.jpg");
                height:140px;
            }
        }

        #BSYContainer{
            .college-logo-container{
                background-image: url("/Assets/Images/OurColleges/College_Logos/BSY_Logo.svg");
            }
        }

        .college-footer{
            position: relative;
            top: 30px;
            width: 100%;

            font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
            font-weight: normal;
            font-size: 16px;
            line-height: 22px;
            text-align: center;
            color: #8D8D8D;
        }

        .college-est{
            font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
        }

        .college-btn{
            position: relative;
            top: 10px;
            width: 92px;
            height: 28px;
            background-color: #8D8D8D;
            border: 0px;
            border-radius: 18px;

            color: #FFFFFF;
            font-size: 14px;
            line-height: 20px;
        }
    }
}

.desktop-footer.our-colleges {
    position: absolute;
    top: 2461px;

    @media only screen and (min-width: 640px) {
        position: absolute;
        top: 1391px;
    }

    @media only screen and (min-width: 1070px) {
        position: absolute;
        top: 1141px;
    }
}

.desktop-partners-page{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 4380px;
    background-color: #FFFFFF;

    @media only screen and (min-width: 640px) {
        height: 3140px;
    }

    @media only screen and (min-width: 1070px) {
        height: 2480px;
    }

    .desktop-subheader{
        top: 191px;
    }

    .page-text{
        position: relative;
        top: 221px;
        left: 81px;
        width: calc(100% - 168px);
        margin: 0px;

        font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
        font-weight: normal;
        font-size: 20px;
        line-height: 24px;
        color: #000000;
    }

    .partners-grid{
        position: absolute;
        display: grid;
        justify-content: center;
        top: 459px;
        width: 100%;
        grid-template-columns: auto;
        gap: 0px 78px;

        .partner-container{
            width: 100%;
            height: 250px;
        }

        @media only screen and (min-width: 390px) {
            .partner-container{
                width: 300px;
            }
        }

        @media only screen and (min-width: 640px) {
            grid-template-columns: auto auto;
            left: 0px;
            width: 100%;
            gap: 0px 30px;
        }

        @media only screen and (min-width: 812px) {
            left: 81px;
            width: calc(100% - 168px);
            gap: 0px min(calc(100% - (2 * 300px)), 84px);
        }

        @media only screen and (min-width: 1070px) {
            top: 399px;
            left: 0px;
            width: 100%;
            gap: 0px 66px;
            grid-template-columns: auto auto auto;
        }

        @media only screen and (min-width: 1220px) {
            left: 84px;
            width: calc(100% - 168px);
            gap: 0px min(calc((100% - (3 * 300px)) / 2), 84px);
            grid-template-columns: auto auto auto;
        }

        .partner-logo-container{
            position:relative;
            height:100px;
            left: 30px;
            width: 240px;
            background-repeat: no-repeat;
            background-size: contain;
            background-position: center;
        }

        #CGContainer{
            .partner-logo-container{
                background-image: url("/Assets/Images/Partners/Partner_Accred_Logos/City&Guilds_Logo_1a.svg");
            }
        }

        #RHSContainer{
            .partner-logo-container{
                background-image: url("/Assets/Images/Partners/Partner_Accred_Logos/RHS_logo_600px.jpg");
            }
        }

        #RFSContainer{
            .partner-logo-container{
                background-image: url("/Assets/Images/Partners/Partner_Accred_Logos/RFS_600px.jpg");
            }
        }

        #QLSContainer{
            .partner-logo-container{
                background-image: url("/Assets/Images/Partners/Partner_Accred_Logos/Quality_Licence_Scheme_Crop.svg");
            }
        }

        #TPEContainer{
            .partner-logo-container{
                background-image: url("/Assets/Images/Partners/Partner_Accred_Logos/The_Pet_Ed_Logo_400px.svg");
            }
        }

        #OCNContainer{
            .partner-logo-container{
                background-image: url("/Assets/Images/Partners/Partner_Accred_Logos/OCN_Redrawn_Logo_600px.svg");
            }
        }

        #TGBTContainer{
            .partner-logo-container{
                background-image: url("/Assets/Images/Partners/Partner_Accred_Logos/TheGuild_of_BeautyTherapists_600px.jpg");
            }
        }

        #AHCPContainer{
            .partner-logo-container{
                background-image: url("/Assets/Images/Partners/Partner_Accred_Logos/AHCP_HiRes_Logo_600px.jpg");
            }
        }

        #PETContainer{
            .partner-logo-container{
                background-image: url("/Assets/Images/Partners/Partner_Accred_Logos/Prisoners_Ed_Trust_Logo_600px.svg");
            }
        }

        #NEBOSHContainer{
            .partner-logo-container{
                background-image: url("/Assets/Images/Partners/Partner_Accred_Logos/NEBOSH_Logo_500px.jpg");
            }
        }

        #NCFEContainer{
            .partner-logo-container{
                background-image: url("/Assets/Images/Partners/Partner_Accred_Logos/NCFE_CACHE_Logo_600px_logo.jpg");
            }
        }

        #SEGContainer{
            .partner-logo-container{
                background-image: url("/Assets/Images/Partners/Partner_Accred_Logos/SEG_Awards_Logo.svg");
            }
        }

        #NCPSContainer{
            .partner-logo-container{
                background-image: url("/Assets/Images/Partners/Partner_Accred_Logos/NCPS_600px.jpg");
            }
        }

        .partner-footer{
            position: relative;
            top: 30px;
            width: 100%;

            font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
            font-weight: normal;
            font-size: 16px;
            line-height: 22px;
            text-align: center;
            color: #8D8D8D;
        }

        .partner-btn{
            position: relative;
            top: 10px;
            width: 92px;
            height: 28px;
            background-color: #8D8D8D;
            border: 0px;
            border-radius: 18px;

            color: #FFFFFF;
            font-size: 14px;
            line-height: 20px;
        }
    }
}

.desktop-footer.partners {
    position: absolute;
    top: 4380px;

    @media only screen and (min-width: 640px) {
        position: absolute;
        top: 2540px;
    }

    @media only screen and (min-width: 1070px) {
        position: absolute;
        top: 1880px;
    }
}

.desktop-our-history-page {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;

    .our-history-bracket-container {
        position: fixed;
        top:64px;
        left: calc(50% - 337.5px);
        width: 675px;
        height: 310px;
        background-image: url("/Assets/Images/OurHistory/SVGs/OurHistory_Top_CurlyBracket+Shape.svg");
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;

        @media only screen and (min-width: 1045px) {
            top: 119px;
        }

        z-index: 1;

        .our-history-header-text{
            position: absolute;
            top: 141px;
            width: 100%;;
            color: #FFFFFF;
            font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
            font-size: 54px;
            line-height: 76px;
            text-align: center;
        }
    }

    .our-history-stars{
        z-index: 3;
        position: fixed;
        top: 64px;
        left: calc(50% - 336.5px);
        width: 673px;
        height: 310px;

        @media only screen and (min-width: 1045px) {
            top: 119px;
        }

        .our-history-stars-lrg{
            z-index: 3;
            position: absolute;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100%;

            #our-history-stars-lrg-1{
                position: absolute;
                width: 51px;
                height: 51px;
                top: 140px;
                left: 94px;
            }

            #our-history-stars-lrg-2{
                position: absolute;
                width: 66px;
                height: 76px;
                top: 62px;
                left: 232px;
            }

            #our-history-stars-lrg-3{
                position: absolute;
                width: 70px;
                height: 70px;
                top: 149px;
                left: 494px;
            }
        }

        .our-history-stars-med{
            z-index: 3;
            position: absolute;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100%;

            #our-history-stars-med-1{
                position: absolute;
                width: 37px;
                height: 40px;
                top: 77px;
                left: 146px;
            }

            #our-history-stars-med-2{
                position: absolute;
                width: 46px;
                height: 52px;
                top: 32px;
                left: 461px;
            }
        }

        .our-history-stars-sml{
            z-index: 3;
            position: absolute;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100%;

            #our-history-stars-sml-1{
                position: absolute;
                width: 27px;
                height: 27px;
                top: 110px;
                left: 369px;
            }

            #our-history-stars-sml-2{
                position: absolute;
                width: 29px;
                height: 29px;
                top: 130px;
                left: 576px;
            }
        }
    }
    
    .our-history-section-1{
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 1575px;
        background-color: #262626;

        text-align: center;
        font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
        font-size: 20px;
        line-height: 24px;
        margin-bottom: 12px;
        color: #FFFFFF;

        .our-history-section-1-text-1{
            position: absolute;
            top: 523px;
            width: 100%;
        }

        .our-history-section-1-image-container {
            position: absolute;
            top: 700px;
            left: 0px;
            width: 100%;
            height: 586px;

            overflow: hidden;

            .our-history-section-1-image{
                position: absolute;
                box-shadow: rgba(38, 38, 38, 0.7) 8px 8px 32px;
            }

            #ourHistorySec1Img1{
                top: 40px;
                right: calc(50% + 120px);
            }

            #ourHistorySec1Img2{
                top: 20px;
                left: calc(50% + 120px);
            }

            #ourHistorySec1Img3{
                top: 240px;
                right: calc(50% + 28px);
            }

            #ourHistorySec1Img4{
                top: 260px;
                left: calc(50% + 220px);
            }
        }

        .our-history-section-1-text-2{
            position: absolute;
            top: 1336px;
            width: 100%;
            left: -10px;
        }
    }

    .our-history-section-2{
        position: absolute;
        top: 1535px;
        left: 0px;
        width: 100%;
        height: 875px;
        background-color: #FFFFFF;

        z-index: 1;

        text-align: center;
        font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
        font-size: 20px;
        line-height: 24px;
        margin-bottom: 12px;
        color: #404040;

        .our-history-section-2-text{
            position: absolute;
            top: 100px;
            width: 100%;
        }

        .our-history-section-2-image-container{
            position: absolute;
            top: 234px;
            left: calc(50% - min(528px, 50% - 158px));
            width: min(100% - 316px, 1056px);
            height: 514px;
            overflow: hidden;

            #ourHistorySec2Img{
                position: relative;
                top: -32px;
                left: calc(50% - (1056px / 2))
            }
        }
    }

    .our-history-section-3{
        position: absolute;
        top: 2410px;
        width: 100%;
        height: 700px;
        z-index: 1;
        background-color: #FFFFFF;
        overflow: hidden;

        .our-history-section-3-background-container{
            position: absolute;
            width: 100%;
            left: 0px;
            height: 140%;
            top: -40%;

            background-image: url("/Assets/Images/OurHistory/GardenDark2_2880px.jpg");
            background-position: center;
            background-size: cover;
            transition: 0ms;
        }

        .our-history-section-3-content-container{
            position: absolute;
            display: grid;
            grid-template-columns: auto auto;
            top: 212px;
            width: 100%;
            height: 377px;
            gap: 0px min(200px, max(calc(100% - 382px - 839px), 24px));
            justify-content: center;
            align-items: center;

            .our-history-section-3-content-text{
                max-width: 408px;

                font-family: 'Helvetica-Neue-LT-Pro-75-Bold';
                font-size: 20px;
                line-height: 24px;
                color: #FFFFFF;
            }
        }

        .our-history-faces-animation{
            position: absolute;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100%;

            .left-face-container{
                position: absolute;
                width: 50%;
                height: 100%;
                left: -50%;
                opacity: 0;
                background-color: #262626;
                overflow: hidden;

                .animation-face{
                    background-image: url("/Assets/Images/OurHistory/SVGs/Left_Curly_Face.svg");
                    background-position: right, 100%;
                }

                .animation-our-colleges{
                    color: #FFFFFF;
                }

                .animation-text{
                    color: #EFEFEF;
                }
            }

            .right-face-container{
                position: absolute;
                width: 50%;
                height: 100%;
                left: 100%;
                opacity: 0;
                background-color: #FFFFFF;
                overflow: hidden;

                .animation-face{
                    background-image: url("/Assets/Images/OurHistory/SVGs/Right_Curly_Face.svg");
                    background-position: left, 100%;
                }

                .animation-our-colleges{
                    color: #000000;
                }

                .animation-text{
                    color: #000000;
                }
            }

            .animation-face{
                position: absolute;
                top: 40px;
                width: 100%;
                height: 100%;
                background-size: contain;
                background-repeat: no-repeat;
            }

            .animation-our-colleges{
                position: fixed;
                text-align: center;
                top: 120px;
                width: 198px;
                height: 34px;
                font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
                font-size: 34px;
                line-height: 48px;
            }

            .animation-text{
                position: fixed;
                text-align:center;
                top: 190px;
                width: 624px;
                height: 44px;
                font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
                font-size: 20px;
                line-height: 24px;
            }

        }
    }

    .our-history-section-4{
        position: absolute;
        left: 0px;
        top: 3110px;
        width: 100%;
        height: 983px;
        background-color: #F2F2F2;
        z-index: 1;

        .our-history-section-4-line{
            position: absolute;
            left: calc(50% - 96px);
            top: 125px;
            width: 192px;
            height: 0px;
            border: 2px solid #404040;
        }

        .our-history-section-4-quote{
            position: absolute;
            top: 165px;
            width: 100%;
            font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
            font-size: 34px;
            line-height: 48px;
            text-align: center;
            color: #000000;
            text-wrap: balance;
            overflow: hidden;
        }

        .our-history-section-4-founders{
            position: absolute;
            top: 327px;
            left: calc(50% - 200px);
            width: 400px;
            height: 150px;

            #OHSec4BSY{
                position: absolute;
                left: 0px;
                top: 32px;
            }

            #OHSec4HCC{
                position: absolute;
                right: 0px;
                top: 0px;
                mix-blend-mode: multiply;
            }
        }

        .our-history-section-4-text{
            position: absolute;
            top: 537px;
            left: calc(50% - min(50%, 310px));
            width: min(100%, 620px);
            height: 92px;
            text-align: center;

            font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
            font-size: 20px;
            line-height: 24px;
            color: #000000;
        }

        #historyCarousel{
            position: absolute;
            top: 721px;
            height: 85px;
        }
    }

    .our-history-section-5{
        position: absolute;
        top: 4093px;
        width: 100%;
        height: 700px;
        background-image: url("/Assets/Images/OurHistory/Full_Web_Width_Tailor_2880px.jpg");
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        z-index: 1;

        .our-history-section-5-link{
            position: absolute;
            top: calc(50% - 18px);
            left: 84px;
            width: 278px;
            height: 36px;
            background-color: #FFFFFF;
            border: 1px solid #404040;
            border-radius: 18px;
            text-align: center;

            z-index: 2;

            a{
                display: block;
                width: 100%;
                height: 100%;
                font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
                font-size: 16px;
                color: #404040;
                text-decoration: none;
                line-height: 36px;
            }
        }

        #OHSec5CouLnk{
            left: calc(100% - 362px);
        }

        .our-history-section-logo{
            position: absolute;
            top: 284px;
            left: calc(50% - (min(372px, max(100% - 808px, 0px)))/2);
            width: min(372px, max(100% - 808px, 0px));
            height: 132px;
            background-image: url("/Assets/Images/1946Group_Logo_RGB_White.svg");
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
            pointer-events: none;
        }
    }

    .our-history-section-6{
        position: absolute;
        top: 4793px;
        width: 100%;
        height: 185px;
        background-color: #FFFFFF;
        color: #404040;
        font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
        font-size: 14px;
        line-height: 17px;
        text-align: center;
        text-wrap: balance;
        z-index: 1;

        p{
            position: relative;
            top: 56px;
            margin: 0px;

            boldText{
                font-family: 'Helvetica-Neue-LT-Pro-75-Bold';
            }
        }
    }
}

.desktop-footer.our-history{
    top: 4978px;
    z-index: 1;
}

.desktop-why-study-page {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;

    .why-study-bracket-container {
        position: fixed;
        top: 64px;
        left: calc(50% - 337.5px);
        width: 675px;
        height: 310px;
        background-image: url("/Assets/Images/WhyStudy/SVGs/WhyStudy_Top_CurlyBracket+Shape.svg");
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;

        z-index: 1;

        @media only screen and (min-width: 1045px) {
            top: 119px;
        }

        .why-study-header-text{
            position: absolute;
            top: 141px;
            width: 100%;;
            color: #404040;
            font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
            font-size: 54px;
            line-height: 76px;
            text-align: center;
        }
    }

    .why-study-stars{
        z-index: 3;
        position: fixed;
        top: 64px;
        left: calc(50% - 337.5px);
        width: 675px;
        height: 310px;

        @media only screen and (min-width: 1045px) {
            top: 119px;
        }

        .why-study-stars-lrg{
            z-index: 3;
            position: absolute;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100%;

            #why-study-stars-lrg-1{
                position: absolute;
                width: 66px;
                height: 76px;
                top: 62px;
                left: 232px;
            }

            #why-study-stars-lrg-2{
                position: absolute;
                width: 70px;
                height: 70px;
                top: 100px;
                left: 505px;
            }
        }

        .why-study-stars-med{
            z-index: 3;
            position: absolute;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100%;

            #why-study-stars-med-1{
                position: absolute;
                width: 37px;
                height: 40px;
                top: 77px;
                left: 146px;
            }
        }

        .why-study-stars-sml{
            z-index: 3;
            position: absolute;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100%;

            #why-study-stars-sml-1{
                position: absolute;
                width: 27px;
                height: 27px;
                top: 110px;
                left: 369px;
            }
        }
    }

    .why-study-section-1{
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 2657px;
        background-color: #FFFFFF;

        text-align: center;
        font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
        font-size: 20px;
        line-height: 24px;
        margin-bottom: 12px;
        color: #404040;

        .timeline{
            position: absolute;
            margin: 0px;
            width: 76px;
            height: 34px;

            font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
            font-size: 34px;
            line-height: 48px;
            color: #8D8D8D;
        }

        .why-study-section-1-image{
            position: absolute;
            box-shadow: rgba(38, 38, 38, 0.7) 8px 8px 32px;
        }

        .why-study-section-1-text-1{
            position: absolute;
            top: 523px;
            width: 100%;
        }

        .why-study-section-1-image-container-1 {
            position: absolute;
            top: 650px;
            left: 0px;
            width: 100%;
            height: 630px;

            overflow: hidden;

            #whyStudySec1-1Img1{
                top: 40px;
                right: calc(50% + 60px);
            }

            #whyStudySec1-1Img2{
                top: 130px;
                left: calc(50% + 60px);
            }

            #whyStudySec1-1Img3{
                top: 350px;
                right: calc(50% + 20px);
            }

            #whyStudySec1-1Img4{
                top: 320px;
                left: calc(50% + 140px);
            }

            .tl-1931{
                top: 217px;
                right: calc(50% + 400px)
            }

            .tl-1946{
                top: 518px;
                right: calc(50% - 500px)
            }
        }

        .why-study-section-1-text-2{
            position: absolute;
            top: 1281px;
            width: 100%;
            left: -10px;
        }

        .why-study-section-1-image-container-2 {
            position: absolute;
            top: 1420px;
            left: 0px;
            width: 100%;
            height: 540px;

            overflow: hidden;

            #whyStudySec1-2Img1{
                top: 40px;
                right: calc(50% + 15px);
            }

            #whyStudySec1-2Img2{
                top: 130px;
                left: calc(50% + 65px);
            }

            #whyStudySec1-2Img3{
                top: 310px;
                right: calc(50% + 200px);
            }

            #whyStudySec1-2Img4{
                top: 310px;
                left: calc(50% + 20px);
            }

            .tl-1982{
                top: 147px;
                right: calc(50% + 390px)
            }

            .tl-1990{
                top: 313px;
                right: calc(50% - 465px)
            }
        }

        .why-study-section-1-text-3{
            position: absolute;
            top: 1960px;
            width: 100%;
            left: -10px;
        }

        .why-study-section-1-image-container-3 {
            position: absolute;
            top: 2060px;
            left: 0px;
            width: 100%;
            height: 597px;

            overflow: hidden;

            #whyStudySec1-3Img1{
                top: 40px;
                right: calc(50% + 70px);
            }

            #whyStudySec1-3Img2{
                top: 80px;
                left: 50%;
            }

            #whyStudySec1-3Img3{
                top: 280px;
                right: calc(50% + 125px);
            }

            #whyStudySec1-3Img4{
                top: 355px;
                left: calc(50% + 235px);
            }

            .tl-2002{
                top: 75px;
                right: calc(50% + 380px)
            }

            .tl-2017{
                top: 195px;
                right: calc(50% - 500px)
            }
        }
    }

    .why-study-section-2{
        position: absolute;
        top: 2657px;
        left: 0px;
        width: 100%;
        height: 600px;
        background-color: #FFFFFF;
        z-index: 1;
        overflow: hidden;

        .why-study-section-2-background-container{
            position: absolute;
            top: -20%;
            left: 0px;
            width: 100%;
            height: 120%;
            background-image: url("/Assets/Images/WhyStudy/WhyStudy_Vocation+ExtraHeight.jpg");
            background-size: cover;
            background-position: center;
            transition: 0ms;
        }

        .why-study-section-2-content-container{
            position: absolute;
            top: 40px;
            height: 520px;
            left: max(84px, min(calc(50% - 450px), 192px));
            width: min(445px, calc(100% - 168px));

            color: #FFFFFF;

            .why-study-section-2-text{
                position: absolute;
                top: 120px;
                width: 100%;
                max-width: 445px;
                font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
                font-size: 20px;
                line-height: 24px;
            }

            .why-study-section-2-header{
                font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
                font-size: 34px;
                line-height: 30px;
            }

            a{
                display: block;
                width: 214px;
                height: 36px;
                color: #404040;
                font-size: 16px;
                line-height: 36px;
                text-align: center;
                text-decoration: none;
                background-color: #FFFFFF;
                border: 1px solid #404040;
                border-radius: 18px;
            }
        }
    }

    .why-study-section-3{
        position: absolute;
        top: 3257px;
        width: 100%;
        height: 600px;
        background-color: #F0f0f0;
        z-index: 1;
        overflow: hidden;

        .why-study-section-3-content-container{
            position: absolute;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100%;
            display: grid;
            grid-template-columns: auto auto;
            gap: max(24px, min(168px, calc(100% - 1000px)));
            align-items: center;

            .why-study-section-3-text{
                max-width: 408px;
                justify-self: right;
                color: #404040;
                font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
                font-size: 20px;
                line-height: 24px;

                a{
                    display: block;
                    width: min(278px, 100%);
                    height: 36px;
                    margin-top: 36px;
                    text-decoration: none;
                    font-size: 16px;
                    color: #FFFFFF;
                    line-height: 36px;
                    text-align: center;

                    border: 1px solid #404040;
                    background-color: #404040;
                    border-radius: 18px;
                }
            }

            .why-study-section-3-logos{
                display: grid;
                grid-template-columns: auto auto;
                gap: 40px;
                justify-self: left;
                justify-content: center;
                align-items: center;

                #hccLogo{
                    mix-blend-mode: multiply;
                }
            }
        }
    }

    .why-study-section-4{
        position: absolute;
        display: flex;
        justify-content: center;
        top: 3857px;
        width: 100%;
        height: 1014px;
        background-color: #262626;
        color: #FFFFFF;
        z-index: 1;
        overflow: hidden;

        .why-study-section-4-header{
            position: absolute;
            top: 121px;
            max-width: 408px;
            justify-self: center;
            text-align: center;

            font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
            font-size: 34px;
            line-height: 48px;
        }

        .sec-4-text{
            position: absolute;
            text-align: center;
            font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
            font-size: 20px;
            line-height: 24px;
        }

        .why-study-section-4-text-1{
            top: 186px;
            max-width: 624px;
        }

        .why-study-section-4-animations{

            width: 100%;
            height: 100%;

            #sec-4-bracket{
                position: absolute;
                left: calc(50% - 490px);
                bottom: 303px;
                opacity: 1;
            }

            .animation-container{
                position: absolute;
                top: 320px;
                width: 246px;
                height: 240px;
            }

            .anim-component{
                position:absolute;
            }
            
            .animation-text{
                position: relative;
                top: 200px;
                text-align: center;

                font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
                font-size: 16px;
                line-height: 24px;
                letter-spacing: 0.8px;
                text-transform: uppercase;
            }

            #circleAnim{
                right: calc(50% + 200px);

                .anim-component{
                    left: calc(50% - 88px);
                    width: 177px;
                    height: 177px;
                }
            }

            #starAnim{
                left: calc(50% - 123px);

                #starAnimStar1{
                    left: calc(50% - 25px);
                    width: 65px;
                    height: 71px;
                }

                #starAnimStar2{
                    top: 30px;
                    width: 93px;
                    height: 107px;
                }

                #starAnimStar3{
                    top: 35px;
                    right: 0px;
                    width: 95px;
                    height: 95px;
                }

                #starAnimStar4{
                    top: 70px;
                    left: calc(50% - 38px);
                    width: 75px;
                    height: 75px;
                    rotate: -40deg;
                }

                #starAnimStar5{
                    top: 130px;
                    left: 40px;
                    width: 65px;
                    height: 65px;
                    rotate: -40deg;
                }

                #starAnimStar6{
                    top: 135px;
                    right: 60px;
                    width: 47px;
                    height: 54px;
                }
            }

            #heartAnim{
                left: calc(50% + 200px);

                .anim-component{
                    top: 10px;
                    left: calc(50% - 95px);
                    width: 190px;
                }
            }
        }

        .why-study-section-4-text-2{
            top: 794px;
            max-width: 624px;
        }
    }

    .why-study-section-5{
        position: absolute;
        top: 4871px;
        width: 100%;
        height: 499px;
        z-index: 1;

        background-color: #FFFFFF;

        .section-5-line{
            position: absolute;
            top: 149px;
            width: 192px;
            height: 2px;
            left: calc(50% - 96px);

            background-color: #262626;
        }

        .why-study-section-5-text{
            position: absolute;
            top: 200px;
            width: min(1076px, 80%);
            text-align: center;
            left: calc(50% - (min(1076px, 80%) / 2));
            text-wrap-style: pretty;

            font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
            font-size: 34px;
            line-height: 48px;
            color: #262626;
        }
    }

    .why-study-section-6{
        position: absolute;
        top: 5370px;
        width: 100%;
        height: 700px;
        background-image: url("/Assets/Images/OurHistory/Full_Web_Width_Tailor_2880px.jpg");
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        z-index: 1;

        .why-study-section-6-link{
            position: absolute;
            top: calc(50% - 18px);
            left: 84px;
            width: 278px;
            height: 36px;
            background-color: #FFFFFF;
            border: 1px solid #404040;
            border-radius: 18px;
            text-align: center;

            z-index: 2;

            a{
                display: block;
                width: 100%;
                height: 100%;
                font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
                font-size: 16px;
                color: #404040;
                text-decoration: none;
                line-height: 36px;
            }
        }

        #WSSec6CouLnk{
            left: calc(100% - 362px);
        }

        .why-study-section-6-logo{
            position: absolute;
            top: 284px;
            left: calc(50% - (min(372px, max(100% - 808px, 0px)))/2);
            width: min(372px, max(100% - 808px, 0px));
            height: 132px;
            background-image: url("/Assets/Images/1946Group_Logo_RGB_White.svg");
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
            pointer-events: none;
        }
    }
}

.desktop-footer.why-study{
    top: 6070px;
    z-index: 1;
}

.desktop-latest-news-page{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 3034px;
    background-color: #F0F0F0;

    .latest-news-header{
        position: absolute;
        top: 191px;
        left: 84px;

        color: #000000;
        font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
        font-size: 34px;
        line-height: 48px;
    }

    .latest-article-container{
        position: absolute;
        top: 267px;
        left: 84px;
        width: calc(100% - 168px);
        height: 498px;
        background-color: #262626;
        color: #FFFFFF;

        .college-label{
            display: inline-block;
            position: relative;
            top: 60px;
            left: 40px;
            height: 25px;
            background-color: #D3D3D3;

            font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
            font-size: 12px;
            line-height: 25px;
            text-align: center;
            color: #262626;
            padding-left: 10px;
            padding-right: 10px;
        }

        .date-label{
            display: inline-block;
            position: relative;
            top: 60px;
            left: 50px;
            height: 25px;
            background-color: #5D5D5D;

            font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
            font-size: 12px;
            line-height: 25px;
            text-align: center;
            color: #F0F0F0;
            padding-left: 10px;
            padding-right: 10px;
        }

        .article-text{
            position: absolute;
            top: 128px;
            left: 40px;
            width: calc(50% - 80px);
            height: 340px;
            box-sizing: border-box;
            padding-bottom: 20px;
            overflow: hidden;
            display: flex;
            flex-direction: column;

            color: #FFFFFF;
            text-wrap-style: pretty;

            .article-header{
                flex: 0 0 auto;
                font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
                font-size: 34px;
                line-height: 38px;

                .header-text-mask{
                    display: none;
                }
            }

            .article-summary{
                position: relative;
                top: 0px;
                margin-top: 20px;
                flex: 1 1 auto;
                min-height: 0;

                font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
                font-size: 20px;
                line-height: 24px;
                overflow: hidden;
                
                .text-mask{
                    position: absolute;
                    bottom: 0px;
                    width: 100%;
                    height: 24px;
                    background-color: #262626;
                    mask-image: linear-gradient(to left, #000000 0%, #000000 5%, transparent 100%);
                }
            }

            #latestArticleLink{
                display: inline-block;
                position: relative;
                flex: 0 0 auto;
                width: 170px;
                height: 36px;
                top: 0px;
                margin-top: 24px;

                font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
                font-size: 16px;
                line-height: 36px;
                color: #404040;
                text-align: center;
                text-decoration: none;

                background-color: #FFFFFF;
                border-radius: 18px;
            }
        }

        .latest-article-image-container{
            
            position: absolute;
            top: 40px;
            right: 40px;
            width: calc(50% - 80px);
            height: 418px;
            overflow: hidden;
            align-content: center;
            display: flex;
            justify-content: center;
            
            #latestArticleHeroImage{
                height: 120%;
                transition: 150ms ease-out;
            }
        }
    }

    .latest-article-container:hover{
        background-color: #000000;
        transition: 150ms ease-in-out;
        cursor: pointer;

        #latestArticleLink{
            background-color: #D3D3D3;
        }

        #latestArticleHeroImage{
            height: 140%;
        }

        .header-text-mask{
            background-color: #000000 !important;
            transition: 150ms ease-in-out;
        }

        .text-mask{
            background-color: #000000 !important;
            transition: 150ms ease-in-out;
        }
    }

    .news-filters{
        position: absolute;
        top: 835px;
        left: 84px;
        width: calc(100% - 168px);

        .dropdown {
            position: absolute;
            width: 300px;

            .dropbtn-main{
                width: 300px;
            }

            img{
                left: 268px;
            }
        }

        .dropdown-hover{
            position: absolute;
            width: 300px;

            .dropbtn-main{
                width: 300px;
            }

            img{
                left: 268px;
            }
        }

        #OrderByDropdown.dropdown{
            background-color: #8D8D8D;

            .dropbtn{
                background-color: #8D8D8D;
                color: #FFFFFF;
            }
        }

        #OrderByDropdown.dropdown-hover{
            background-color: #8D8D8D;

            .dropbtn{
                background-color: #8D8D8D;
                color: #FFFFFF;
            }

            .dropbtn-option:hover{
                text-decoration-color: #FFFFFF;
            }
        }

        #CollegeFilterDropdown{
            left: 324px;
        }

        #CategoryFilterDropdown{
            left: 648px;
        }
    }

    .large-article-cards-container{
        display: flex;
        position: absolute;
        top: 911px;
        left: 84px;
        width: calc(100% - 168px);
        column-gap: 24px;
        justify-content: center;

        .large-article-card{
            position: relative;
            width:408px;
            height:508px;
            overflow: hidden;

            .large-article-image{
                position: absolute;
                height: 100%;
                width: 100%;
            }

            .large-article-card-content{
                position: absolute;
                bottom: 20px;
                left: 20px;
                width: 368px;
                height: 182px;
                background-color: #FFFFFFB2;
                backdrop-filter: blur(20px);
                transition: 200ms ease-out;

                .large-article-college-label{
                    display: inline-block;
                    position: relative;
                    top: 23px;
                    left: 30px;
                    height: 25px;
                    background-color: #FFFFFF;
                    transition: 200ms ease-out;

                    font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
                    font-size: 12px;
                    line-height: 24px;
                    text-align: center;
                    color: #000000;
                    padding-left: 10px;
                    padding-right: 10px;
                }

                .large-article-date-label{
                    display: inline-block;
                    position: relative;
                    top: 23px;
                    left: 40px;
                    height: 25px;
                    background-color: #F0F0F0;
                    transition: 200ms ease-out;

                    font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
                    font-size: 12px;
                    line-height: 25px;
                    text-align: center;
                    color: #000000;
                    padding-left: 10px;
                    padding-right: 10px;
                }

                .large-article-text{
                    position: absolute;
                    left: 30px;
                    top: 68px;
                    width: 318px;
                    transition: 200ms ease-out;

                    .large-article-title{
                        font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
                        font-size: 29px;
                        line-height: 34px;
                        color: #404040;
                    }

                    .large-article-summary{
                        position: relative;
                        top: 20px;
                        font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
                        font-size: 16px;
                        line-height: 22px;
                        color: #262626;
                        opacity: 0;
                        transition: 200ms ease-out;
                    }

                    .large-article-link{
                        position: fixed;
                        width: 170px;
                        height: 36px;
                        right: 20px;
                        bottom: 30px;
                        background-color: #404040;
                        border-radius: 18px;
                        transition: 200ms ease-out;

                        font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
                        font-size: 16px;
                        line-height: 36px;
                        color: #FFFFFF;
                        text-decoration: none;
                        text-align: center;

                        opacity: 0;
                        pointer-events: none;
                    }
                }
            }
        }

        .large-article-card:hover{

            .large-article-card-content{
                bottom: 0px;
                left: 0px;
                width: 100%;
                height: 100%;

                .large-article-college-label{
                    top:30px;
                }

                .large-article-date-label{
                    top:30px;
                }

                .large-article-text{
                    top: 75px;

                    .large-article-summary{
                        opacity: 1;
                    }

                    .large-article-link{
                        right: 40px;
                        bottom: 50px;
                        opacity: 1;
                        pointer-events: auto;
                    }
                }
            }
        }
    }

    .small-article-cards-container{
        position: absolute;
        display: grid;
        top: 1444px;
        left: 84px;
        width: calc(100% - 168px);
        gap: 24px;
        justify-content: center;

        .small-article-card{
            position: relative;
            width: 408px;
            height: 192px;
            overflow: hidden;
            background-color: #FFFFFF;

            .small-article-image{
                position: relative;
                height: 100%;
            }

            .small-article-card-content{
                display: inline-block;
                position: absolute;
                width: 264px;
                height: 100%;

                .small-article-college-label{
                    display: inline-block;
                    position: relative;
                    top: 20px;
                    left: 24px;
                    height: 25px;
                    background-color: #F0F0F0;

                    font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
                    font-size: 12px;
                    line-height: 24px;
                    text-align: center;
                    color: #000000;
                    padding-left: 10px;
                    padding-right: 10px;
                }

                .small-article-date-label{
                    display: inline-block;
                    position: relative;
                    top: 20px;
                    left: 34px;
                    height: 25px;
                    background-color: #D9D9D9;

                    font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
                    font-size: 12px;
                    line-height: 25px;
                    text-align: center;
                    color: #000000;
                    padding-left: 10px;
                    padding-right: 10px;
                }

                .small-article-title{
                    position: absolute;
                    top: 59px;
                    left: 24px;
                    width: 210px;

                    font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
                    font-size: 20px;
                    line-height: 24px;
                    color: #404040;
                    text-wrap-style: pretty;
                }

                .small-article-link{
                    position: absolute;
                    bottom: 32px;
                    left: 24px;
                    width: 97px;
                    height: 28px;
                    border: 1px solid #707070;
                    border-radius: 18px;

                    font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
                    font-size: 14px;
                    line-height: 28px;
                    text-align: center;
                    text-decoration: none;
                    color: #404040;
                }
            }
        }
    }

    .latest-news-links{
        display: inline-block;
        position: relative;
        width: 300px;
        left: calc(50% - 150px);
        text-align: center;
        
        a{
            display: inline-block;
            position: relative;
            height: 36px;
            font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
            font-size: 16px;
            line-height: 36px;
            text-decoration: none;
            border-radius: 18px;
        }

        #latest-news-our-colleges{
            width: 278px;
            border: 1px solid #404040;
            background-color: #FFFFFF;
            color: #404040;
        }

        #latest-news-our-courses{
            top: 30px;
            width: 215px;
            background-color: #404040;
            color: #FFFFFF;
        }
    }
}

.desktop-news-article-page{
    
    .news-article-back-button{
        position: fixed;
        display: block;
        top: 191px;
        left: 84px;
        background: none;
        border: none;
        color: #8D8D8D;

        font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
        font-size: 14px;

        img{
            position: relative;
            top: 2px;
            left: -4px;
            rotate: -90deg;
        }
    }

    .news-article-back-button:hover{
        cursor: pointer;
    }

    .desktop-news-article-header{
        position: fixed;
        top:235px;
        left:84px;
        width: calc(100% - 168px);

        .news-article-title{
            font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
            font-size: 54px;
            line-height: 76px;
            color: #262626;
        }

        .news-article-date{
            display: inline-block;
            font-family: 'Helvetica-Neue-Lt-Pro-75-Bold';
            font-size: 14px;
            line-height: 24px;
            letter-spacing: 0.56px;
            color: #8D8D8D;
            text-transform: uppercase;
        }

        .news-article-college{
            display: inline-block;
            font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
            font-size: 16px;
            line-height: 24px;
            letter-spacing: 0.64px;
            color: #000000;
        }

        .news-article-header-image{
            display: block;
            position: relative;
            top: 36px;
            width: 100%;
        }
    }
    
    .desktop-news-article-content-container{
        position: absolute;
        top:100%;
        left:84px;
        width:calc(100% - 168px);
        background-color: #FFFFFF;
        height: fit-content;
        padding-bottom: 366px;
        z-index: 1;
        
        .desktop-news-article-content{
            position: relative;
            top:70px;
            left:84px;
            width: calc(100% - 168px - 168px);
            padding: 0 84px;
            border-left: 2px solid #707070;
            background-color: #FFFFFF;
            color: #262626;
            text-wrap-style: pretty;
            font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
            font-size: 16px;
            line-height: 24px;

            h2{
                font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
                font-size: 20px;
                line-height: 24px;
            }

            h1{
                font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
                font-size: 34px;
                line-height: 48px;
            }

            img{
                width: 75%;
                padding: 30px 0px;
            }

            .horizontal-line{
                width: 192px;
                height: 0px;
                border: 2px solid #262626;
            }

            .news-article-content-links{

                #collegeButton{
                    width: 180px;
                    height: 36px;
                    margin-top: 30px;
                    background-color: #262626;
                    color: #FFFFFF;
                    border-radius: 18px;
                    line-height: 32px;
                    font-size: 16px;
                }

                #backButton{
                    margin-top:40px;
                    display: block;
                    position: relative;
                    background: none;
                    border: none;
                    color: #404040;

                    font-family: 'Helvetica-Neue-Lt-Pro-75-Bold';
                    font-size: 14px;

                    img{
                        display: inline;
                        position: relative;
                        top: 2px;
                        left: -4px;
                        width: 14px;
                        height: 14px;
                        rotate: -90deg;
                        padding: 0px;
                    }
                }

                #backButton:hover, #collegeButton:hover{
                    cursor: pointer;
                }
            }
        }
    }
}

.desktop-search-page{
    position: absolute;
    background-color: #F0F0F0;
    width: 100%;
    left: 0px;
    size: calc(fit-content + 1000px);

    .search-filter-container{
        position: relative;
        width: 449px;
        height: 474px;
        top: 190px;
        left: 43px;
        
        background-color: #D3D3D3;

        .search-filter-header{
            position: relative;
            top: 47px;
            left: 40px;

            font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
            font-size: 34px;
            line-height: 38px;
            color: #000000;
        }

        .search-filter{
            position: absolute;
            left: 40px;

            p{
                position: relative;
                left: 20px;

                font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
                font-size: 16px;
                line-height: 22px;
                color: #000000;
                margin-top: 0px;
                margin-bottom: 12px;
            }
        }

        #levelSearchFilter{
            top: 105px;
        }

        #goalSearchFilter{
            top: 197px;
        }

        #subjectSearchFilter{
            top: 289px;
        }

        .search-button{
            position: absolute;
            top: 391px;
            left: 40px;
            width: calc(100% - 80px);
            height: 36px;
            background-color: #262626;
            border: none;
            border-radius: 18px;

            font-family: 'Helvetica-Neue-Lt-Pro-75-Bold';
            font-size: 16px;
            line-height: 22px;
            color: #FFFFFF
        }

        .search-button:hover{
            cursor: pointer;
        }
    }

    .search-results-container{
        position: relative;
        display: grid;
        gap: 40px 24px;

        @media only screen and (min-width: 0px) {
            top: 214px;
            grid-template-columns: auto;
            justify-items: center;
        }
        @media only screen and (min-width: 950px) {
            grid-template-columns: 50% 50%;
            width: calc(100% - 86px);
            left:43px;
        }
        @media only screen and (min-width: 1450px) {
            top: -284px;
            left: 515px;
            width: auto;
            max-width: min(calc(100% - 720px), 900px);
        }

        .course-container{
            position: relative;
            max-width: 408px;
            background-color: #FFFFFF;
            color: #262626;

            .course-title{
                position: relative;
                margin-top: 47px;
                margin-left: 40px;
                font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
                font-size: 34px;
                line-height: 38px;
            }

            .ACC-title{color: #326690;}
            .BSY-title{color: #D29500;}
            .CCPT-title{color: #008494;}
            .HCC-title{color: #739253;}
            .RA-title{color: #C05978;}
            .HSTC-title{color: #A3A332;}

            .course-level{
                width: fit-content;
                margin-top: 10px;
                padding: 8px 15px;
                margin-left: 40px;
                margin: 10px 40px 0px;

                font-family: 'Helvetica-Neue-Lt-Pro-75-Bold';
                font-size: 14px;
                line-height: 20px;
                text-transform: uppercase;
            }

            .ACC-level{color: #326690; background-color: #32669033;}
            .BSY-level{color: #D29500; background-color: #D2950033;}
            .CCPT-level{color: #008494; background-color: #00849433;}
            .HCC-level{color: #739253; background-color: #73925333;}
            .RA-level{color: #C05978; background-color: #C0597833;}
            .HSTC-level{color: #A3A332; background-color: #A3A33233;}

            .course-summary-a{
                margin: 30px 40px 0px;
                font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
                font-size: 16px;
                line-height: 22px;
            }

            .course-points{
                margin: 16px 40px 16px 20px;
                font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
                font-size: 16px;
                line-height: 22px;
            }

            .course-summary-b{
                margin: 0px 40px 30px;
                font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
                font-size: 16px;
                line-height: 22px;
            }

            .course-link{
                margin: 0px 40px;
                border: 1px solid;
                border-radius: 18px;
                padding: 8px 20px ;

                font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
                font-size: 16px;
                line-height: 22px;
                text-decoration: none;
            }

            .ACC-link{color: #326690;}
            .BSY-link{color: #D29500;}
            .CCPT-link{color: #008494;}
            .HCC-link{color: #739253;}
            .RA-link{color: #C05978;}
            .HSTC-link{color: #A3A332;}

            .course-footer{
                display: flex;
                margin: 50px 40px 40px;
                padding: 20px;
                min-height: 32px;
                text-transform: uppercase;
                color: #FFFFFF;
                background-color: #888888;

                .college-long{
                    font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
                    font-size: 14px;
                    line-height: 18px;
                    width: calc(100% - 60px);
                }

                .college-short{
                    position: absolute;
                    right: 60px;
                    font-family: 'Helvetica-Neue-Lt-Pro-75-Bold';
                    font-size: 28px;
                    line-height: 28px;
                }
            }

            .ACC-footer{background-color: #326690;}
            .BSY-footer{background-color: #D29500;}
            .CCPT-footer{background-color: #008494;}
            .HCC-footer{background-color: #739253;}
            .RA-footer{background-color: #C05978;}
            .HSTC-footer{background-color: #A3A332;}
        }

        .show-more-container{
            justify-self: right;
            align-content: center;
            text-align: right;

            .show-more-link{
                font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
                position: relative;
                top: -15px;
                font-size: 20px;
                color: #404040;
            }

            p{
                display: inline;
                font-family: 'Menu-Button-Brackets';
                font-size: 80px;
            }
        }
    }

    .desktop-footer{
        position: relative;
        width:100%;
        top: 300px;
    }
}

.legal-header {
    font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
    font-size: 32px;
    margin-top: 140px;
    margin-bottom: 40px;
    padding-left: 16px;
    padding-right: 16px;
}

.legal-text {
    font-size: 18px;
    font-family: 'Helvetica-Neue-Lt-Pro-55-Roman';
    padding-left: 16px;
    padding-right: 16px;
    max-width: 760px;

    ol li {margin-bottom: 16px}

    h2 {
        font-family: 'Helvetica-Neue-Lt-Pro-65-Medium';
        font-size: 22px;
        line-height: 28px;
        margin: 28px 0 8px;
    }

    p {
        margin: 0 0 14px;
    }

    a {
        color: #262626;
    }
}

.desktop-footer.legal-footer{
    position: relative;
    top: 40px;
    left: 0;
    width: 100%;
}

.hidden{
    display: none;
}

/* Narrow layouts: keep the header graphic, copy, and pictures inside the viewport. */

@media (max-width: 759px) {
    body:has(.mobile-column-container) .desktop-partners-container {
        top: 4057px;
    }

    body:has(.mobile-column-container) .desktop-footer {
        top: 4418px;
    }
}

@media (min-width: 606px) and (max-width: 759px) {
    body:has(.mobile-column-container) .desktop-partners-container {
        top: 3697px;
    }

    body:has(.mobile-column-container) .desktop-footer {
        top: 4058px;
    }
}

html,
body {
    margin: 0;
    overflow-x: clip;
}

.desktop-our-history-page {
    position: relative;

    .our-history-bracket-container,
    .our-history-stars {
        transform-origin: top center;
        transform: scale(min(1, calc((100vw - 52px) / 675px)));
    }

    .our-history-bracket-container {
        left: calc(50% - 337.5px);
    }

    .our-history-stars {
        left: calc(50% - 336.5px);
    }

    .our-history-section-1,
    .our-history-section-2,
    .our-history-section-3,
    .our-history-section-4,
    .our-history-section-5,
    .our-history-section-6 {
        position: relative;
        top: auto;
        margin-bottom: 0;
        box-sizing: border-box;
    }

    .our-history-section-1 {
        display: flex;
        flex-direction: column;
        align-items: center;
        height: auto;
        padding: 523px 0 110px;

        .our-history-section-1-text-1,
        .our-history-section-1-text-2 {
            position: relative;
            top: auto;
            left: auto;
            width: min(920px, calc(100% - 32px));
            margin: 0;
        }

        .our-history-section-1-image-container {
            position: relative;
            top: auto;
            width: 100%;
            margin-top: 48px;
        }

        .our-history-section-1-text-2 {
            margin-top: 40px;
        }
    }

    .our-history-section-2 {
        display: flex;
        flex-direction: column;
        align-items: center;
        height: auto;
        margin-top: -40px;
        padding: 100px 0 120px;

        .our-history-section-2-text {
            position: relative;
            top: auto;
            left: auto;
            width: min(920px, calc(100% - 32px));
            margin: 0;
        }

        .our-history-section-2-image-container {
            position: relative;
            top: auto;
            left: auto;
            margin-top: 56px;
            width: min(1056px, calc(100% - 32px));
            height: min(514px, 62vw);
        }
    }

    .our-history-section-4 {
        display: flex;
        flex-direction: column;
        align-items: center;
        height: auto;
        padding: 125px 0 160px;

        .our-history-section-4-line {
            position: relative;
            top: auto;
            left: auto;
        }

        .our-history-section-4-quote {
            position: relative;
            top: auto;
            width: calc(100% - 32px);
            height: auto;
            margin-top: 40px;
            overflow: visible;
        }

        .our-history-section-4-founders {
            position: relative;
            top: auto;
            left: auto;
            margin-top: 64px;
            width: min(400px, calc(100% - 32px));
            max-width: calc(100% - 32px);
        }

        .our-history-section-4-text {
            position: relative;
            top: auto;
            left: auto;
            height: auto;
            margin-top: 60px;
            width: min(620px, calc(100% - 32px));
        }

        #historyCarousel {
            position: relative;
            top: auto;
            width: 100%;
            margin-top: 92px;
        }
    }

    .our-history-section-6 {
        height: auto;
        min-height: 185px;
        padding: 56px 0 80px;

        p {
            position: relative;
            top: auto;
            width: min(760px, calc(100% - 32px));
            margin: 0 auto;
        }
    }
}

.desktop-footer.our-history {
    position: relative;
    top: 0;
}

@media (max-width: 1027px) {
    .desktop-our-history-page,
    .desktop-why-study-page {
        --lockup-scale: min(1, calc((100vw - 52px) / 675px));
    }

    .desktop-our-history-page .our-history-bracket-container,
    .desktop-our-history-page .our-history-stars,
    .desktop-why-study-page .why-study-bracket-container,
    .desktop-why-study-page .why-study-stars {
        top: 52px;
    }

    .desktop-our-history-page .our-history-section-1,
    .desktop-why-study-page .why-study-section-1 {
        padding-top: calc(52px + (310px * var(--lockup-scale)) + 64px);
    }
}

@media (max-width: 1180px) {
    .desktop-our-history-page #ourHistorySec3Img {
        width: min(431px, 36vw);
        height: auto;
    }
}

@media (max-width: 1100px) {
    .desktop-our-history-page .our-history-section-3 {
        height: auto;
        min-height: 0;
    }

    .desktop-our-history-page .our-history-section-3 .our-history-section-3-content-container {
        position: relative;
        top: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        height: auto;
        padding: 96px 0 88px;
        gap: 32px;
    }

    .desktop-our-history-page .our-history-section-3 .our-history-section-3-content-container .our-history-section-3-content-text {
        width: min(640px, calc(100vw - 32px));
        max-width: min(640px, calc(100vw - 32px));
    }

    .desktop-our-history-page #ourHistorySec3Img {
        order: -1;
        width: min(220px, 42vw);
        height: auto;
    }
}

@media (max-width: 1240px) {
    .desktop-our-history-page .our-history-section-5,
    .desktop-why-study-page .why-study-section-6 {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 36px;
        height: auto;
        min-height: 560px;
        padding: 88px 16px;
    }

    .desktop-our-history-page .our-history-section-5 .our-history-section-5-link,
    .desktop-our-history-page .our-history-section-5 #OHSec5CouLnk,
    .desktop-why-study-page .why-study-section-6 .why-study-section-6-link,
    .desktop-why-study-page .why-study-section-6 #WSSec6CouLnk {
        position: relative;
        top: auto;
        left: auto;
    }

    .desktop-our-history-page .our-history-section-5 .our-history-section-logo,
    .desktop-why-study-page .why-study-section-6 .why-study-section-6-logo {
        position: relative;
        top: auto;
        left: auto;
        width: min(300px, 72vw);
        height: 110px;
    }
}

@media (max-width: 800px) {
    .desktop-our-history-page .our-history-section-6 {
        padding-bottom: 140px;
    }
}

.desktop-why-study-page {
    position: relative;
    overflow-x: clip;

    .why-study-bracket-container,
    .why-study-stars {
        transform-origin: top center;
        transform: scale(min(1, calc((100vw - 52px) / 675px)));
    }

    .why-study-bracket-container {
        left: calc(50% - 337.5px);
    }

    .why-study-stars {
        left: calc(50% - 337.5px);
    }

    .why-study-section-1,
    .why-study-section-2,
    .why-study-section-3,
    .why-study-section-4,
    .why-study-section-5,
    .why-study-section-6 {
        position: relative;
        top: auto;
        margin-bottom: 0;
        box-sizing: border-box;
    }

    .why-study-section-1 {
        display: flex;
        flex-direction: column;
        align-items: center;
        height: auto;
        padding: 523px 0 48px;

        .why-study-section-1-text-1,
        .why-study-section-1-text-2,
        .why-study-section-1-text-3 {
            position: relative;
            top: auto;
            left: auto;
            width: min(980px, calc(100% - 32px));
            margin: 0;
        }

        .why-study-section-1-image-container-1,
        .why-study-section-1-image-container-2,
        .why-study-section-1-image-container-3 {
            position: relative;
            top: auto;
            width: 100%;
            margin-top: 36px;
        }

        .why-study-section-1-text-2,
        .why-study-section-1-text-3 {
            margin-top: 24px;
        }
    }

    .why-study-section-5 {
        display: flex;
        flex-direction: column;
        align-items: center;
        height: auto;
        min-height: 499px;
        padding: 149px 0 140px;

        .section-5-line {
            position: relative;
            top: auto;
            left: auto;
        }

        .why-study-section-5-text {
            position: relative;
            top: auto;
            left: auto;
            width: min(1076px, calc(100% - 32px));
            margin-top: 48px;
        }
    }
}

.desktop-footer.why-study {
    position: relative;
    top: 0;
}

@media (max-width: 1280px) {
    .desktop-why-study-page .why-study-section-2 .why-study-section-2-content-container {
        left: 16px;
        width: min(445px, calc(100% - 32px));
    }

    .desktop-why-study-page .why-study-section-2 .why-study-section-2-content-container .why-study-section-2-text {
        width: 100%;
        max-width: 445px;
    }
}

@media (max-width: 1100px) {
    .desktop-why-study-page .why-study-section-2 {
        height: auto;
        min-height: 480px;
        overflow: visible;
    }

    .desktop-why-study-page .why-study-section-2 .why-study-section-2-content-container {
        position: relative;
        top: auto;
        left: 16px;
        width: calc(100% - 32px);
        height: auto;
        padding: 72px 0 64px;
    }

    .desktop-why-study-page .why-study-section-2 .why-study-section-2-content-container .why-study-section-2-text {
        position: relative;
        top: auto;
        width: 100%;
        max-width: 445px;
    }
}

@media (max-width: 900px) {
    .desktop-why-study-page .why-study-section-3 {
        height: auto;
        min-height: 600px;
    }

    .desktop-why-study-page .why-study-section-3 .why-study-section-3-content-container {
        position: relative;
        height: auto;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 36px;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        padding: 64px 16px 80px;
        overflow: hidden;
    }

    .desktop-why-study-page .why-study-section-3 .why-study-section-3-content-container .why-study-section-3-text {
        justify-self: stretch;
        width: min(760px, 100%);
        max-width: 100%;
    }

    .desktop-why-study-page .why-study-section-3 .why-study-section-3-content-container .why-study-section-3-logos {
        justify-self: stretch;
        width: min(760px, 100%);
        max-width: 100%;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 48px 32px;
        justify-items: center;
        align-items: center;
    }

    .desktop-why-study-page .why-study-section-3 .section-3-logo {
        width: 100%;
        height: 78px;
        max-width: 100%;
        object-fit: contain;
        object-position: center;
    }
}

@media (max-width: 1100px) {
    .desktop-why-study-page .why-study-section-4 {
        display: flex;
        flex-direction: column;
        align-items: center;
        height: auto;
        overflow: visible;
        padding: 40px 0 48px;
    }

    .desktop-why-study-page .why-study-section-4 .why-study-section-4-header,
    .desktop-why-study-page .why-study-section-4 .why-study-section-4-text-1,
    .desktop-why-study-page .why-study-section-4 .why-study-section-4-text-2 {
        position: relative;
        top: auto;
        left: auto;
        width: min(624px, calc(100% - 32px));
        max-width: min(624px, calc(100% - 32px));
    }

    .desktop-why-study-page .why-study-section-4 .why-study-section-4-text-1 {
        margin-top: 20px;
    }

    .desktop-why-study-page .why-study-section-4 .why-study-section-4-animations {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        width: min(250px, calc(100% - 32px));
        height: auto;
        margin: 12px 0 4px;
        scale: 1;
    }

    .desktop-why-study-page .why-study-section-4 .why-study-section-4-animations #sec-4-bracket {
        position: absolute;
        width: 430px;
        height: auto;
        left: calc(100% - 139px);
        bottom: auto;
        top: 50%;
        transform: translate(-50%, -50%) scaleX(-1) rotate(-90deg);
        pointer-events: none;
    }

    .desktop-why-study-page .why-study-section-4 .why-study-section-4-animations .animation-container {
        position: relative;
        top: auto;
        left: auto;
        right: auto;
        margin: 8px 0;
        zoom: 0.56;
    }

    .desktop-why-study-page .why-study-section-4 .why-study-section-4-animations #circleAnim,
    .desktop-why-study-page .why-study-section-4 .why-study-section-4-animations #starAnim,
    .desktop-why-study-page .why-study-section-4 .why-study-section-4-animations #heartAnim {
        left: auto;
        right: auto;
    }

    .desktop-why-study-page .why-study-section-4 .why-study-section-4-text-2 {
        margin-top: 28px;
    }
}

@media (max-width: 859px) {
    .desktop-latest-news-page {
        position: relative;
        height: auto;
        padding-top: 100px;
        padding-bottom: 24px;
    }

    .desktop-latest-news-page .latest-news-header {
        position: relative;
        top: auto;
        left: 16px;
        width: calc(100% - 32px);
        margin: 0 0 24px;
    }

    .desktop-latest-news-page .latest-article-container {
        display: flex;
        flex-direction: column;
        position: relative;
        top: auto;
        left: 16px;
        width: calc(100% - 32px);
        height: auto;
        margin: 0 0 36px;
        padding: 0;
        overflow: hidden;
    }

    .desktop-latest-news-page .latest-article-container .latest-article-image-container {
        position: relative;
        order: -1;
        top: 0;
        right: auto;
        width: 100%;
        height: 200px;
        margin: 0;
        flex: 0 0 auto;
    }

    .desktop-latest-news-page .latest-article-container .latest-article-image-container #latestArticleHeroImage {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .desktop-latest-news-page .latest-article-container .latest-article-text-container {
        padding: 22px 16px 24px;
    }

    .desktop-latest-news-page .latest-article-container .college-label,
    .desktop-latest-news-page .latest-article-container .date-label {
        top: 0;
        left: 0;
        margin: 0 10px 0 0;
    }

    .desktop-latest-news-page .latest-article-container .date-label {
        margin-right: 0;
    }

    .desktop-latest-news-page .latest-article-container .article-text {
        position: relative;
        top: auto;
        left: auto;
        width: 100%;
        height: auto;
        margin-top: 22px;
        padding-bottom: 0;
        overflow: visible;
    }

    .desktop-latest-news-page .latest-article-container .article-text .article-summary {
        flex: 0 1 auto;
        max-height: 168px;
    }

    .desktop-latest-news-page .latest-article-container .article-text #latestArticleLink {
        margin-top: 28px;
        margin-bottom: 4px;
    }

    .desktop-latest-news-page .news-filters {
        position: relative;
        top: auto;
        left: 16px;
        width: calc(100% - 32px);
        margin: 0 0 28px;
    }

    .desktop-latest-news-page .news-filters .dropdown,
    .desktop-latest-news-page .news-filters .dropdown-hover,
    .desktop-latest-news-page .news-filters #CollegeFilterDropdown,
    .desktop-latest-news-page .news-filters #CategoryFilterDropdown {
        position: relative;
        left: 0;
        display: block;
        width: min(300px, 100%);
        margin: 0 0 12px;
    }

    .desktop-latest-news-page .news-filters #CategoryFilterDropdown.hidden {
        display: none;
    }

    .desktop-latest-news-page .news-filters .dropbtn-main {
        width: 100%;
    }

    .desktop-latest-news-page .large-article-cards-container,
    .desktop-latest-news-page .small-article-cards-container {
        position: relative;
        top: auto;
        left: 16px;
        width: calc(100% - 32px);
        margin: 0 0 28px;
    }

    .desktop-latest-news-page .latest-news-links {
        position: relative;
        top: auto;
        left: auto;
        display: block;
        width: min(300px, calc(100% - 32px));
        margin: 12px auto 28px;
    }

    .desktop-footer.latest-news {
        position: relative;
        top: auto;
    }

    .desktop-latest-news-page .large-article-cards-container .large-article-card,
    .desktop-latest-news-page .small-article-cards-container .small-article-card {
        width: min(408px, calc(100vw - 32px));
        max-width: 100%;
    }

    .desktop-latest-news-page .small-article-cards-container .small-article-card .small-article-image {
        width: 34%;
        object-fit: cover;
    }

    .desktop-latest-news-page .small-article-cards-container .small-article-card .small-article-card-content {
        right: 0;
        width: 66%;
    }

    .desktop-latest-news-page .small-article-cards-container .small-article-card .small-article-card-content .small-article-title {
        width: calc(100% - 36px);
    }

    .desktop-latest-news-page .large-article-cards-container .large-article-card .large-article-card-content {
        left: 12px;
        right: 12px;
        bottom: 12px;
        width: auto;
        height: auto;
        min-height: 188px;
        box-sizing: border-box;
        padding: 18px 18px 20px;
    }

    .desktop-latest-news-page .large-article-cards-container .large-article-card .large-article-card-content .large-article-college-label,
    .desktop-latest-news-page .large-article-cards-container .large-article-card .large-article-card-content .large-article-date-label {
        top: 0;
        left: 0;
        margin: 0 8px 0 0;
    }

    .desktop-latest-news-page .large-article-cards-container .large-article-card .large-article-card-content .large-article-text {
        position: relative;
        left: 0;
        top: 16px;
        width: 100%;
    }

    .desktop-latest-news-page .large-article-cards-container .large-article-card .large-article-title {
        font-size: clamp(22px, 5.8vw, 29px);
        line-height: 1.2;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        overflow: hidden;
    }

    .desktop-latest-news-page .large-article-cards-container .large-article-card .large-article-card-content .large-article-text .large-article-summary {
        position: absolute;
        opacity: 0;
    }

    .desktop-latest-news-page .large-article-cards-container .large-article-card .large-article-card-content .large-article-text .large-article-link {
        position: fixed;
    }

    .desktop-latest-news-page .large-article-cards-container .large-article-card:hover .large-article-card-content {
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        min-height: 0;
        padding: 24px 20px 20px;
    }

    .desktop-latest-news-page .large-article-cards-container .large-article-card:hover .large-article-card-content .large-article-college-label,
    .desktop-latest-news-page .large-article-cards-container .large-article-card:hover .large-article-card-content .large-article-date-label {
        top: 0;
        left: 0;
    }

    .desktop-latest-news-page .large-article-cards-container .large-article-card:hover .large-article-card-content .large-article-text {
        top: 18px;
        left: 0;
        width: 100%;
    }

    .desktop-latest-news-page .large-article-cards-container .large-article-card:hover .large-article-card-content .large-article-text .large-article-summary {
        position: relative;
        top: 16px;
        opacity: 1;
        max-height: 220px;
        overflow: hidden;
    }

    .desktop-latest-news-page .large-article-cards-container .large-article-card:hover .large-article-card-content .large-article-text .large-article-link {
        position: fixed;
        right: 20px;
        bottom: 20px;
        opacity: 1;
        pointer-events: auto;
    }
}

@media (max-width: 1027px) {
    .desktop-why-study-page .why-study-section-1 {
        padding-top: calc(52px + (310px * var(--lockup-scale)) + 64px);
    }
}

html.overlay-open {
    overflow: hidden;
}

.college-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(27px);
    overscroll-behavior: none;
    z-index: 6;
}

.college-overlay-panel {
    position: absolute;
    top: clamp(56px, 12vh, 108px);
    left: clamp(12px, 6vw, 84px);
    width: calc(100% - (2 * clamp(12px, 6vw, 84px)));
    height: calc(100% - clamp(56px, 12vh, 108px) - clamp(16px, 8vh, 72px));
    box-sizing: border-box;
    display: grid;
    grid-template-columns: minmax(0, 520px) minmax(120px, 1fr);
    grid-template-rows: auto 1fr;
    align-content: start;
    align-items: stretch;
    column-gap: clamp(16px, 4vw, 72px);
    padding: clamp(16px, 4vh, 48px) clamp(16px, 3vw, 40px) clamp(16px, 3vh, 40px) clamp(16px, 8vw, 108px);
    background-color: #FFFFFF;
    box-shadow: 0px 0px 20px #00000029;
    overflow: hidden;
}

.college-overlay-copy {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
    min-height: 0;
    max-width: 520px;
    height: auto;
    max-height: 100%;
    align-self: start;
    display: flex;
    flex-direction: column;
    gap: clamp(12px, 2vh, 20px);
    padding-top: clamp(4px, 2vh, 36px);
    overflow: hidden;
}

.college-overlay-spacer {
    display: none;
}

.college-overlay-sheet {
    display: contents;
}

.college-overlay-logo {
    display: block;
    width: auto;
    max-width: min(260px, 100%);
    height: auto;
    max-height: clamp(64px, 16vh, 125px);
    object-fit: contain;
    object-position: left center;
    flex: 0 0 auto;
}

.college-overlay-est {
    width: 80px;
    height: 26px;
    border: 1px solid #8D8D8D;
    font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
    font-size: 14px;
    text-align: center;
    line-height: 26px;
    color: #8D8D8D;
    text-transform: uppercase;
    flex: 0 0 auto;
}

.college-overlay-body {
    flex: 0 1 auto;
    min-height: 0;
    overflow: hidden;
    font-family: 'Helvetica-Neue-LT-Pro-55-Roman';
    font-weight: normal;
    font-size: 16px;
    text-align: left;
    line-height: 22px;
    color: #262626;
}

.college-overlay-body p {
    margin: 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 8;
    overflow: hidden;
}

.college-overlay-button {
    grid-column: 1;
    grid-row: 2;
    justify-self: start;
    align-self: start;
    margin-top: clamp(16px, 2vh, 24px);
    flex: 0 0 auto;
    width: fit-content;
    max-width: 100%;
    height: 36px;
    padding: 0 18px;
    border-radius: 18px;
    font-family: 'Helvetica-Neue-LT-Pro-65-Medium';
    font-size: 16px;
    text-align: center;
    line-height: 36px;
    color: #FFFFFF;
    cursor: pointer;
}

.college-overlay-photo {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: stretch;
    min-width: 0;
    min-height: 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.college-overlay-close {
    position: absolute;
    top: calc(clamp(56px, 12vh, 108px) - 48px);
    right: calc(clamp(12px, 6vw, 84px) - 10px);
    width: 44px;
    height: 44px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: transparent url("/Assets/Images/NavBar/Overlay_Close.svg") center / 44px 44px no-repeat;
    color: #262626;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    z-index: 2;
}

@media (max-width: 700px) {
    .college-overlay {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: stretch;
        box-sizing: border-box;
        padding: 16px 12px;
        gap: 8px;
    }

    .college-overlay {
        overscroll-behavior: none;
    }

    .college-overlay-panel {
        position: relative;
        top: auto;
        left: auto;
        width: 100%;
        height: auto;
        max-height: min(540px, calc(100svh - 96px));
        min-height: 0;
        flex: 0 1 auto;
        display: flex;
        flex-direction: column;
        padding: 0;
        gap: 0;
        overflow: hidden;
        background-color: #FFFFFF;
    }

    .college-overlay-panel::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 72px;
        background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.72) 42%, #ffffff 68%);
        pointer-events: none;
        z-index: 2;
    }

    .college-overlay-photo {
        position: absolute;
        top: 0;
        left: 0;
        grid-column: auto;
        grid-row: auto;
        width: 100%;
        height: 180px;
        z-index: 0;
    }

    .college-overlay-copy {
        position: relative;
        z-index: 1;
        grid-column: auto;
        grid-row: auto;
        display: block;
        width: auto;
        max-width: none;
        height: auto;
        max-height: none;
        padding: 0;
        gap: 0;
        flex: 1 1 auto;
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        background: transparent;
    }

    .college-overlay-spacer {
        display: block;
        height: 168px;
    }

    .college-overlay-sheet {
        display: flex;
        flex-direction: column;
        gap: 12px;
        background-color: #FFFFFF;
        padding: 16px 16px 80px;
        box-shadow: 0 -10px 24px rgba(0, 0, 0, 0.08);
    }

    .college-overlay-body {
        font-size: 15px;
        line-height: 20px;
        overflow: visible;
        flex: 0 0 auto;
    }

    .college-overlay-body p {
        display: block;
        -webkit-line-clamp: unset;
        line-clamp: unset;
        overflow: visible;
    }

    .college-overlay-button {
        position: absolute;
        left: 16px;
        bottom: 16px;
        z-index: 3;
        grid-column: auto;
        grid-row: auto;
        height: 32px;
        padding: 0 14px;
        font-size: 14px;
        line-height: 32px;
        margin: 0;
        align-self: flex-start;
    }

    .college-overlay-logo {
        max-height: 72px;
    }

    .college-overlay-close {
        position: relative;
        top: auto;
        right: auto;
        align-self: flex-end;
        flex: 0 0 auto;
        order: -1;
        margin: 0 -4px 0 0;
    }
}

.desktop-search-page .search-filter-container .search-filter:has(.dropdown-hover) {
    z-index: 3;
}

@media (max-width: 860px) {
    .desktop-search-page .search-filter-container {
        width: calc(100% - 32px);
        max-width: none;
        left: 16px;
        top: 96px;
        height: 432px;
        padding: 0;
        box-sizing: border-box;
    }

    .desktop-search-page .search-filter-container .search-filter-header {
        top: 24px;
        left: 16px;
    }

    .desktop-search-page .search-filter-container .search-filter {
        left: 16px;
        right: 16px;
        width: auto;
    }

    .desktop-search-page #levelSearchFilter { top: 78px; }
    .desktop-search-page #goalSearchFilter { top: 164px; }
    .desktop-search-page #subjectSearchFilter { top: 250px; }

    .desktop-search-page .search-filter-container .search-filter p {
        left: 8px;
    }

    .desktop-search-page .search-filter-container .dropdown,
    .desktop-search-page .search-filter-container .dropdown-hover {
        width: 100%;
    }

    .desktop-search-page .search-filter-container .dropbtn-main {
        width: calc(100% - 36px);
    }

    .desktop-search-page .search-filter-container .dropdown img,
    .desktop-search-page .search-filter-container .dropdown-hover img {
        position: relative;
        top: -36px;
        left: calc(100% - 36px);
        right: auto;
        width: 36px;
        height: 36px;
    }

    .desktop-search-page .search-filter-container .search-button {
        top: 376px;
        left: 16px;
        width: calc(100% - 32px);
    }

    .desktop-search-page .search-results-container {
        top: 120px;
        left: 16px;
        width: calc(100% - 32px);
        justify-items: stretch;
    }

    .desktop-search-page .search-results-container .course-container {
        width: 100%;
        max-width: none;
    }
}

/* The collage is a fixed-width group, wide enough to hold every photo, then scaled to the viewport. */
.desktop-why-study-page .why-study-section-1 .why-study-section-1-image-container-1,
.desktop-why-study-page .why-study-section-1 .why-study-section-1-image-container-2,
.desktop-why-study-page .why-study-section-1 .why-study-section-1-image-container-3,
.desktop-our-history-page .our-history-section-1 .our-history-section-1-image-container {
    --cluster-width: 1200px;
    --cluster-scale: min(1, calc((100vw - 32px) / var(--cluster-width)));
    width: var(--cluster-width);
    max-width: none;
    flex-shrink: 0;
    align-self: center;
    transform: scale(var(--cluster-scale));
    transform-origin: top center;
}

.desktop-why-study-page .why-study-section-1-image-container-1 {
    margin-bottom: calc(630px * (var(--cluster-scale) - 1));
}

.desktop-why-study-page .why-study-section-1-image-container-2 {
    margin-bottom: calc(540px * (var(--cluster-scale) - 1));
}

.desktop-why-study-page .why-study-section-1-image-container-3 {
    margin-bottom: calc(597px * (var(--cluster-scale) - 1));
}

.desktop-our-history-page .our-history-section-1-image-container {
    margin-bottom: calc(586px * (var(--cluster-scale) - 1));
}

.desktop-news-article-page {
    --article-gutter: clamp(16px, 6vw, 84px);
}

.desktop-news-article-page .news-article-back-button {
    left: var(--article-gutter);
}

.desktop-news-article-page .desktop-news-article-header {
    left: var(--article-gutter);
    width: calc(100% - (2 * var(--article-gutter)));
}

.desktop-news-article-page .desktop-news-article-content-container {
    left: var(--article-gutter);
    width: calc(100% - (2 * var(--article-gutter)));
}

.desktop-news-article-page .desktop-news-article-content-container .desktop-news-article-content {
    left: var(--article-gutter);
    width: calc(100% - (4 * var(--article-gutter)));
    padding-left: var(--article-gutter);
    padding-right: var(--article-gutter);
    box-sizing: content-box;
}