.site-main-banner-container{
    display: flex;
}

.right-site-main-banner{
    width: 50%;
    background: #af4c34;
    color: white;
    padding-top: 5rem;
}
.site-main-banner {
    width: 50%;
    height: 100vh;
    position: relative;
    @include respond(md) {
        height: 100vh;
    }
    video {
        position: absolute;
        width: 50%;
        height: 100%;
        object-fit: cover;
        display: block;
    }
    &::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: url("#{$theme-imgpath}/banner-gradient-bg.png") no-repeat
            center center;
        background-size: cover;
        z-index: 1;
    }
    &::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba($color: #292929, $alpha: 0.3);
        z-index: 2;
    }
    .banner-content {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 9;
        .inner-banner-content {
            color: #fff;
            h5 {
                text-transform: uppercase;
                letter-spacing: 0.1rem;
                margin: 0 0 1rem;
                @include respond(md) {
                    letter-spacing: 0.3rem;
                }
            }
            h1 {
                font-size: 3.2rem;
                margin: 0 0 2rem;
                @include respond(md) {
                    font-size: 5.2rem;
                    line-height: 7.2rem;
                }
            }
            a {
                i {
                    margin-left: 1rem;
                }
                &:hover {
                    color: #fff;
                }
            }
        }
    }
    .user-control-bar {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        z-index: 9;
        .social-media-control {
            background: #fff;
            padding: 0.9rem 0;
            position: relative;
            @include respond(md) {
                padding: 2.35rem 6rem 2.35rem 0;
                &::after {
                    content: "";
                    position: absolute;
                    top: 50%;
                    right: 0;
                    width: 3rem;
                    border-bottom: 0.1rem solid $primary-color;
                }
            }
            @include respond(lg) {
                padding: 2.35rem 10rem 2.35rem 0;
                &::after {
                    width: 5.5rem;
                }
            }
            h5 {
                margin: 0;
                text-transform: uppercase;
                font-size: 1.2rem;
                letter-spacing: 0.1rem;
            }
            .info-social-media {
                li {
                    a {
                        @include respond(md) {
                            font-size: 2.2rem;
                        }
                    }
                }
            }
            &::before {
                content: "";
                position: absolute;
                top: 0;
                left: -100vw;
                height: 100%;
                width: 100vw;
                background: #fff;
                z-index: -9;
            }
        }
        .scroll-down {
            color: #fff;
            position: relative;
            @include respond(md) {
                padding-left: 2rem;
                &::before {
                    content: "";
                    position: absolute;
                    top: 50%;
                    left: -3rem;
                    width: 3rem;
                    border-bottom: 0.1rem solid #fff;
                }
            }
            @include respond(lg) {
                padding-left: 6rem;
                &::before {
                    width: 5.5rem;
                }
            }
            a {
                font-size: 1.4rem;
                font-weight: 600;
                color: #fff;
                @include respond(md) {
                    font-size: 1.6rem;
                }
                .mousey {
                    width: 1.8rem;
                    height: 2.5rem;
                    border: 0.2rem solid #fff;
                    border-radius: 1rem;
                    position: relative;
                    @include respond(md) {
                        width: 2.2rem;
                        height: 3rem;
                    }
                }
                .scroller {
                    position: absolute;
                    top: 0.3rem;
                    left: 50%;
                    margin-left: -0.1rem;
                    width: 0.2rem;
                    height: 0.6rem;
                    background: #fff;
                    animation: scroll 1.2s cubic-bezier(0.15, 0.41, 0.69, 0.94)
                        infinite;
                    -webkit-animation: scroll 1.2s
                        cubic-bezier(0.15, 0.41, 0.69, 0.94) infinite;
                    -moz-animation: scroll 1.2s
                        cubic-bezier(0.15, 0.41, 0.69, 0.94) infinite;
                    @include respond(md) {
                        top: 0.6rem;
                    }
                }
                &:hover {
                    color: $primary-color;
                }
            }
        }
    }
}

@keyframes scroll {
    0% {
        opacity: 0;
    }
    10% {
        transform: translateY(0);
        opacity: 1;
    }
    100% {
        transform: translateY(0.9rem);
        opacity: 0;
    }
}

.program-academics-section {
    background: $default-text-color;
    color: #fff;
    .section-title-wrap {
        margin: 0 0 2rem;
        @include respond(md) {
            margin: 0 0 6rem;
        }
    }
    .section-title-block {
        .heading-bg-title {
            color: rgba($color: #fefefe, $alpha: 0.03);
        }
        .heading-title {
            color: #fff;
            @include respond(md) {
                top: 1rem;
                font-size: 3.8rem;
            }
            @include respond(xxl) {
                top: 2rem;
                font-size: 4.2rem;
            }
            i {
                color: $primary-color;
            }
        }
    }
    .programs-block {
        background: #fff;
        color: $default-text-color;
        padding: 3rem;
        @include respond(md) {
            padding: 5rem;
        }
        &.graduate-program {
            background: $primary-color;
            .site-btn {
                &:hover {
                    i {
                        color: #fff;
                    }
                    &::after {
                        border-color: #fff;
                    }
                }
            }
        }
        h2 {
            @include respond(md) {
                font-size: 2.8rem;
            }
        }
        p {
            font-size: 1.6rem;
            line-height: 2.4rem;
        }
        ul {
            list-style-type: none;
            margin: 0 0 3rem;
            @include respond(md) {
                min-height: 9.7rem;
                margin: 0 0 4rem;
            }
            li {
                a {
                    color: $default-text-color;
                    font-family: $title-font;
                    font-weight: 600;
                    position: relative;
                    &::before {
                        content: "";
                        position: absolute;
                        bottom: 0;
                        left: 0;
                        width: 100%;
                        border-bottom: 0.1rem solid $secondary-color;
                        opacity: 0;
                        @include transition();
                    }
                    &:hover {
                        color: $secondary-color;
                        &::before {
                            opacity: 1;
                        }
                    }
                    i {
                        margin-left: 1rem;
                    }
                }
                &:not(:last-child) {
                    margin: 0 0 0.8rem;
                }
            }
        }
    }
}

.our-values-section {
    position: relative;
    .our-values-block-wrap {
        @include respond(xl) {
            padding: 0 0 0 3rem;
        }
        @include respond(xxl) {
            padding: 0 0 0 6rem;
        }
        .our-values-block {
            background: #fafafa;
            padding: 3rem;
            @include respond(md) {
                padding: 6rem 4rem;
            }
            @include respond(xl) {
                min-height: 45rem;
            }
            .icon-box {
                @include respond(md) {
                    margin: 0 0 3.6rem;
                }
            }
            h3 {
                @include respond(md) {
                    margin: 0 0 3rem;
                }
            }
            p {
                font-size: 1.6rem;
                line-height: 2.4rem;
                margin: 0;
            }
        }
        [class^="col-"] {
            &:nth-of-type(2) {
                .our-values-block {
                    background: #f1f1f1;
                }
            }
        }
    }
    &::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        background: $primary-color;
        z-index: -1;
        @include respond(xl) {
            height: 100%;
            width: 43vw;
        }
    }
}

.sports-activities-section {
    .sports-activities-block {
        @include respond(xl) {
            padding-right: 6rem;
        }
        @include respond(xxl) {
            padding-right: 8.5rem;
        }
        p {
            margin: 0 0 3rem;
            @include respond(md) {
                margin: 0 0 5rem;
            }
        }
        ul {
            list-style-type: none;
            li {
                span {
                    position: relative;
                    padding: 0 0 0 4rem;
                    font-family: $title-font;
                    font-weight: 600;
                    font-size: 1.6rem;
                    margin: 0 0 1.5rem;
                    display: block;
                    @include respond(md) {
                        margin: 0 0 2rem;
                    }
                    i {
                        position: absolute;
                        top: 0;
                        left: 0;
                        font-size: 2.2rem;
                    }
                }
            }
        }
    }
    .thumbnail-img {
        height: 30rem;
        @include respond(md) {
            height: 50rem;
        }
        @include respond(xl) {
            margin: -21rem 0 0;
            height: 68.7rem;
        }
        img {
            height: 30rem;
            @include respond(md) {
                height: 50rem;
            }
            @include respond(xl) {
                height: 68.7rem;
            }
        }
    }
}

// .high-wrap {
//     max-width: 127rem;
//     margin: 0 auto;
        
//     }
//     .high-content {
//         @include respond(xl) {
//             padding: 0 5rem 0 5rem;
//         }
//         @include respond(xxl) {
//             padding: 0 8rem 0 10rem;
//         }
//         p {
//             margin: 0 0 2.5rem;
//             @include respond(md) {
//                 margin: 0 0 3.5rem;
//             }
//         }
//         h3 {
//             line-height: 2.4rem;
//             margin: 0;
//             span {
//                 display: block;
//                 font-size: 1.4rem;
//                 font-weight: 500;
//             }
//         }
//     }
//     .custom-high-nav {
//         position: relative;
//         z-index: 1;
//         padding: 3rem 0 0;
//         @include respond(lg) {
//             margin: -2rem 0 0;
//             padding: 0;
//         }
//         .btn {
//             padding: 0;
//             border: none;
//             font-size: 2rem;
//             margin: 0 1rem;
//             box-shadow: none;
//             line-height: 0;
//             @include respond(md) {
//                 margin: 0 2rem 0 0;
//             }
//             @include respond(xl) {
//                 margin: 0 1rem;
//             }
//             &:hover {
//                 color: #000;
//             }
//         }
//     }

.count-section {
    .section-title-block {
        margin: 0 0 2rem;
        @include respond(md) {
            max-width: 101rem;
            margin: 0 auto 4rem;
            text-align: center;
        }
        .heading-title {
            @include respond(md) {
                text-align: left;
                left: 50%;
                margin-left: -30rem;
                top: 5rem;
            }
            @include respond(xxl) {
                top: 7.5rem;
            }
        }
    }
    .count-block {
        text-align: center;
        h1 {
            margin: 0;
            font-size: 5.8rem;
            @include respond(md) {
                font-size: 9.2rem;
            }
            span {
                display: block;
                font-size: 1.6rem;
                text-transform: uppercase;
                letter-spacing: 0.12rem;
            }
        }
    }
    [class^="col-"] {
        &:not(:last-child) {
            .count-block {
                margin: 0 0 3rem;
                @include respond(md) {
                    margin: 0;
                }
            }
        }
    }
    .thumbnail-img {
        margin: 3rem 0 0;
        height: 20rem;
        @include respond(md) {
            margin: 15rem auto -27rem;
            height: 35rem;
            max-width: 127rem;
            position: relative;
            z-index: 1;
        }
        @include respond(lg) {
            height: 40rem;
        }
        @include respond(xl) {
            height: 55rem;
        }
        img {
            height: 20rem;
            @include respond(md) {
                height: 35rem;
            }
            @include respond(lg) {
                height: 40rem;
            }
            @include respond(xl) {
                height: 55rem;
            }
        }
        .heading-bg-title {
            position: absolute;
            bottom: -0.5rem;
            left: -0.5rem;
            @include respond(xl) {
                left: 12rem;
            }
        }
    }
}

.student-life-section {
    background: $default-text-color;
    color: #fff;

    @include respond(md) {
        padding-top: 31rem;
    }
}

.testimonial-wrap {
    max-width: 127rem;
    margin: 0 auto;
    .testimonial-profile {
        max-width: 30rem;
        margin: 0 auto;
        position: relative;
        @include respond(md) {
            max-width: 37rem;
            padding: 0 2rem 2rem 0;
        }
        @include respond(lg) {
            max-width: 39rem;
            padding: 0 3rem 3rem 0;
        }
        &::before {
            @include respond(md) {
                content: "";
                position: absolute;
                bottom: 0;
                right: 0;
                width: 20rem;
                height: 13rem;
                background: $primary-color;
                z-index: -1;
            }
        }
        .thumbnail-img {
            height: 30rem;
            @include respond(md) {
                height: 45rem;
            }
            img {
                height: 30rem;
                @include respond(md) {
                    height: 45rem;
                }
            }
        }
    }
    .testimonial-content {
        @include respond(xl) {
            padding: 0 5rem 0 5rem;
        }
        @include respond(xxl) {
            padding: 0 8rem 0 10rem;
        }
        p {
            margin: 0 0 2.5rem;
            @include respond(md) {
                margin: 0 0 3.5rem;
            }
        }
        h3 {
            line-height: 2.4rem;
            margin: 0;
            span {
                display: block;
                font-size: 1.4rem;
                font-weight: 500;
            }
        }
    }
    .custom-testi-nav {
        position: relative;
        z-index: 1;
        padding: 3rem 0 0;
        @include respond(lg) {
            margin: -2rem 0 0;
            padding: 0;
        }
        .btn {
            padding: 0;
            border: none;
            font-size: 2rem;
            margin: 0 1rem;
            box-shadow: none;
            line-height: 0;
            @include respond(md) {
                margin: 0 2rem 0 0;
            }
            @include respond(xl) {
                margin: 0 1rem;
            }
            &:hover {
                color: $primary-color;
            }
        }
    }
}

.news-events-section {
    .news-event-block {
        background: #fff;
        box-shadow: 0 1rem 4rem 0 rgba($color: $default-text-color, $alpha: 0.1);
        @include transition();
        .thumbnail-img {
            height: 25rem;
            @include respond(xxl) {
                height: 35rem;
            }
            img {
                height: 25rem;
                @include respond(xxl) {
                    height: 35rem;
                }
            }
        }
        a {
            color: $default-text-color;
        }
        .news-event-text {
            padding: 2.5rem 3rem;
            @include respond(md) {
                padding: 4rem;
            }
            h2 {
                margin: 0 0 1rem;
                @include respond(md) {
                    margin: 0 0 1.5rem;
                }
            }
            p {
                margin: 0;
                font-size: 1.4rem;
            }
        }
        &:hover {
            background: $primary-color;
            .thumbnail-img {
                img {
                    transform: scale(1.1);
                    -webkit-transform: scale(1.1);
                    -moz-transform: scale(1.1);
                }
            }
        }
    }
}

.campus-experience-banner {
    height: 30rem;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    margin: -8rem 0 0 0;
    @include respond(md) {
        height: 65rem;
    }
    @include respond(xxl) {
        height: 75rem;
    }
    a {
        color: #fff;
        font-size: 6.2rem;
        @include respond(md) {
            font-size: 9.2rem;
        }
        &:hover {
            color: $primary-color;
        }
    }
}

.campus-experience {
    margin: -5rem 0 0 0;
    background: #fff;
    @include respond(md) {
        margin: -15rem 0 0 0;
        background: none;
    }
    .campus-experience-content {
        max-width: 127rem;
        margin: 0 auto;
        @include respond(md) {
            padding: 10rem 0 0;
            background: #fff;
        }
    }
}

.our-partners {
    .partners-wrap {
        margin: 0 -1.5rem;
    }
    .partners-block {
        padding: 0 1.5rem;
        &:not(:last-child) {
            margin: 0 0 3rem;
            @include respond(sm) {
                margin: 0;
            }
        }
        a {
            filter: grayscale(100%);
            &:hover {
                filter: grayscale(0%);
            }
        }
        img {
            max-width: 15rem;
            @include respond(lg) {
                max-width: inherit;
            }
        }
    }
}
