.slider-wrapper {
    overflow: hidden; /* hide overflowing cards */
    width: 100%;
}

.slider-track {
    display: flex;
    transition: transform 0.5s ease; /* smooth slide */
}

.slider-wrapper:active {
    cursor: grabbing;
}

/* Campus Life */
.ResponsiveCampusCard {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.ResponsiveCampusContent {
    flex-grow: 1;
}
/* Campus Life */



/* Top Banner */

.ResponsiveText {
    font-size: 20px; /* scales between 18px and 32px based on viewport */
}

.ResponsiveTitle {
    font-size: 32px;
}

/* General Media Queries */

/* Small Mobiles */
@media (max-width: 320px) {
    .ResponsiveText {
        max-width: 100%;
        font-size: calc(1vw + 1vh);
    }

    .ResponsiveTitle {
        font-size: calc(2vw + 2vh);
    }
}

/* Large Mobiles */
@media (min-width: 321px) and (max-width: 425px) {
    .ResponsiveText {
        max-width: 100%;
        font-size: calc(1vw + 1vh);
    }

    .ResponsiveTitle {
        font-size: calc(2vw + 2vh);
    }
}

/* Tablets */
@media (min-width: 426px) and (max-width: 768px) {
    .ResponsiveText {
        max-width: 100%;
        font-size: calc(1vw + 1vh);
    }

    .ResponsiveTitle {
        font-size: calc(2vw + 2vh);
    }
}

/* Small Laptops */
@media (min-width: 769px) and (max-width: 1024px) {
    .ResponsiveText {
        max-width: 100%;
        font-size: calc(1vw + 1vh);
    }

    .ResponsiveTitle {
        font-size: calc(2vw + 2vh);
    }
}
/* Large Laptops */
@media (min-width: 1025px) and (max-width: 1440px) {
    .ResponsiveText {
        max-width: 100%;
        font-size: calc(1vw + 1vh);
    }

    .ResponsiveTitle {
        font-size: calc(2vw + 2vh);
    }
}

/* Desktops */
@media (min-width: 1441px) {
    .ResponsiveText {
        max-width: 100%;
        font-size: calc(1vw + 1vh);
    }

    .ResponsiveTitle {
        font-size: calc(2vw + 2vh);
    }
}


/* General Media Queries */

/* Top Banner */

/* Events and Latest News */
html, body {
    height: 100%;
    font-size: 100%;
}

.ResponsiveSliderWrapper {
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.ResponsiveSliderTrack {
    display: flex;
    gap: 20px;
    transition: transform .5s ease;
    align-items: stretch;
    flex-wrap: nowrap;
    height: 100%;
}


/* Default: Desktop → 3 per row */
.ResponsiveSlideItem {
    flex: 0 0 33.333%;
    display: flex;
}

.ResponsiveSliderTrack .ResponsiveSlideItem {
    display: flex;
}
/* Tablet → 2 per row */
@media (max-width: 992px) {
    .ResponsiveSlideItem {
        flex: 0 0 50%;
    }
}

/* Mobile → 1 per row */
@media (max-width: 576px) {
    .ResponsiveSlideItem {
        flex: 0 0 100%;
    }
}

.ResponsiveBlogCard {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.ResponsiveBlogContent {
    flex-grow: 1;
}

.ResponsiveBlogImg {
    width: 100%;
    flex: 1 0 auto; /* grow with available space */
    overflow: hidden;
}

    .ResponsiveBlogImg img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 8px;
    }
/* Events and Latest News*/

/* Feature */


.ResponsiveFeatureCardWrap {
    display: flex;
}

.ResponsiveFeatureCard {
    flex: 1;
    display: flex;
    flex-direction: column;
}

    .ResponsiveFeatureCard a.th-btn {
        margin-top: auto;
    }

.ResponsiveFacultyBoxContent {
    padding: 10px 0px 2px 0px !important
}

.date-box {
    background: #ffffff;
    color: #002b5c;
    transition: 0.3s ease;
}

    .date-box:hover {
        background: #D3224D;
        color: #ffffff;
        cursor: pointer;
    }

    /* Force children (h4, span) to follow the hover color */
    .date-box * {
        color: inherit !important;
    }


@media (min-width: 2000px) {

    .ResponsiveSubTitle {
        font-size: calc(0.9vw + 0.9vh) !important;
        line-height: calc(1.5vw + 1.5vh) !important;
    }

    .ResponsiveSecTitle {
        font-size: calc(0.7vw + 0.7vh) !important;
        line-height: calc(0.7vw + 0.7vh) !important;
    }

    .ResponsiveSectionText {
        font-size: calc(0.6vw + 0.6vh) !important;
    }

    .ResponsiveBoxTitle {
        font-size: calc(1vw + 1vh) !important;
        line-height: calc(1vw + 1vh) !important;
    }

    .ResponsiveBoxText {
        font-size: calc(0.6vw + 0.6vh) !important;
        line-height: calc(0.8vh + 0.8vw) !important;
    }

    .ResponsiveAboutUsTitle {
        font-size: calc(1vw + 1vh) !important;
    }

    .ResponsiveAboutUsBoxText {
        font-size: calc(0.6vw + 0.6vh) !important;
        line-height: calc(0.8vh + 0.7vw) !important;
    }

    .ResponsiveThBtn {
        font-size: calc(0.5vw + 0.5vh) !important;
    }

    .ResponsiveBlogCard {
        display: flex !important;
        flex-direction: column !important;
        height: 100% !important;
        width: 100% !important;
    }

    .ContainerWidth {
        max-width: 75% !important;
    }

    .TopContainer {
        max-width: 95% !important;
    }

    .ResponsiveProfessorImage {
        width: 50% !important;
        height: 100% !important;
    }

    .ResponsiveContact {
        font-size: calc(0.4vh + 0.4vw) !important;
    }

    .ResponsiveEventCard {
        max-width: 100% !important;
        width: 100% !important;
    }

    .ResponsiveEventCardImage {
        max-width: 100% !important;
        width: 100% !important;
        flex: 1 !important;
    }

    .ResponsiveEventContent {
        max-width: 100% !important;
        max-height: 100% !important;
        flex: 1 !important;
    }

    .ResponsiveSecTitleWrap {
        max-width: 100% !important;
    }

    .ResponsiveBoxTextWrap {
        max-width: 100% !important;
    }

    .ResponsiveApplyStadiumWrap {
        font-size: calc(0.5vh + 0.5vw) !important;
    }

    .chancellor-titlebox .ResponsiveBoxText {
        max-width: 100% !important;
    }

    .ResponsiveSkillFeatureTitle {
        font-size: calc(0.5vh + 0.5vw) !important;
    }

    .ProgressValue {
        font-size: calc(0.4vw + 0.4vh) !important;
    }

    .ResponsiveFaqImageBox {
        max-width: 100% !important;
        left: 0% !important;
    }

    .ResponsiveImage1 {
        width: 100% !important;
    }

        .ResponsiveImage1 Img {
            width: 100% !important;
            height: 100% !important;
        }

    .ResponsiveImage2 {
        width: 100% !important;
    }

        .ResponsiveImage2 Img {
            width: 100% !important;
            height: 100% !important;
        }

    .ResponsiveSecTitle .split-line {
        text-align: left !important;
    }

    .ResponsiveAccordianButton {
        font-size: calc(0.5vh + 0.5vw) !important;
    }

    .ResponsiveFaqText {
        font-size: calc(0.4vh + 0.4vw) !important;
    }

    .ResponsiveFooterAuLogoBlock {
        width: 50% !important;
    }

    .ResponsiveFooterLogo {
        max-width: 100% !important;
    }

    .ResponsiveAuLogoSize {
        width: 50% !important;
        height: 50% !important;
    }

    .ResponsiveTitle {
        font-size: calc(0.5vh + 0.5vw) !important;
    }

    .ResponsiveWidgetTitle {
        font-size: calc(0.7vh + 0.7vw) !important;
    }

    .ResponsiveFooterAboutText {
        font-size: calc(0.4vh + 0.4vw) !important;
    }

    .ResponsiveTopNavBarSize {
        font-size: calc(0.7vw + 0.7vh) !important;
    }

    .ResponsiveTopNavBarDropDownSize {
        font-size: calc(0.5vw + 0.5vh) !important;
    }

    .ResponsiveBottomNavBarSize {
        font-size: calc(0.5vw + 0.5vh) !important;
    }

    .ResponsiveHeroTitle {
        font-size: calc(2vh + 2vw) !important;
    }

    .ResponsiveHeroStyle1 {
        max-width: 100% !important;
    }

    .ResponsiveHeroText {
        max-width: 100% !important;
        font-size: calc(1vh + 1vw) !important;
    }

    .ResponsiveTopContainerBlock {
        max-width: 100% !important;
        max-height: 100% !important;
        width: 50% !important;
        height: 100% !important;
    }

    .ResponsiveHeaderLogo {
        width: 100% !important;
        height: 100% !important;
    }

    .ResponsiveHeaderLogoSize {
        height: 50% !important;
        width: 50% !important;
    }

    .ResponsiveTopContainerBlock2 {
        width: 30% !important;
    }

    .ResponsiveHeaderInfoItem {
        width: 100% !important;
    }

    .ResponsiveHeaderInfoIcon {
        max-width: 100% !important;
        max-height: 100% !important;
        width: 30% !important;
        height: 100% !important;
    }

    .ResponsiveHeaderInfoIconSize {
        font-size: calc(1vh + 1vw) !important;
    }

    .ResponsiveHeaderInfoContent {
        max-width: 100% !important;
        max-height: 100% !important;
        width: 100% !important;
        height: 100% !important;
    }

    .ResponsiveHeaderInfoText {
        font-size: calc(0.3vh + 0.3vw) !important;
    }

    .ResponsiveHeaderInfoTitle {
        font-size: calc(0.3vh + 0.3vw) !important;
    }

    .ResponsiveWhyTitleBox {
        max-width: 100% !important;
    }

    .ResponsiveMegaMenu {
        max-width: calc(35vh + 35vw) !important;
        aspect-ratio: 1 / 1 !important;
    }

    .ResponsiveMegaMenuBox {
        width: 100% !important;
        height: 100% !important;
    }

    .ResponsiveMegaMenuImage {
        aspect-ratio: 16 / 9 !important; /* Makes all images equal shape */
        width: 100% !important;
        overflow: hidden !important;
    }

    .ResponsiveCampusImage {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }


    .ResponseNewsDay {
        font-size: calc(0.6vw + 0.6vh) !important;
        line-height: calc(0.8vh + 0.8vw) !important;
    }

    .ResponseNewsMonth {
        font-size: calc(0.6vw + 0.6vh) !important;
        line-height: calc(0.8vh + 0.8vw) !important;
    }

    .ResponsiveNewsTextSize {
        font-size: calc(0.6vw + 0.6vh) !important;
        line-height: calc(0.8vh + 0.8vw) !important;
    }

    .ResponseNewsViewDetail {
        font-size: calc(0.4vw + 0.4vh) !important;
        line-height: calc(0.8vh + 0.8vw) !important;
    }
    .ResponsiveCardTitle {
        font-size: calc(0.7vw + 0.7vh) !important;
        line-height: calc(1vw + 1vh) !important;
    }

    .ResponsiveCardText {
        font-size: calc(0.6vw + 0.6vh) !important;
        line-height: calc(0.8vh + 0.8vw) !important;
    }

}
@media (min-width: 1200px) and (max-width: 1645px) {


    .ResponsiveBottomNavBarFontSize {
        font-size: calc(0.5vw + 0.4vh) !important;
    }

    
}


    /* helper to make images cover the carousel area */
    .Slider-Linkages-object-fit-cover {
        object-fit: cover;
    }

    /* ensure carousel and inner items fill the available height */
    .Slider-Linkages-full-height-row {
        align-items: stretch;
    }
    /* applied to the row */
    .Slider-Linkages-col-stretch {
        display: flex;
        flex-direction: column;
    }
    /* make column a flex column */
    .Slider-Linkages-fill-remaining {
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
    }
    /* fill vertical space */
    .Slider-Linkages-height {
        height: 100%;
    }

    .Slider-Linkages-img {
        width: 100%;
        height: 100%;
        display: block;
    }
    /* remove vertical margins that break flex height calculations */
    .Slider-Linkages--no-vertical-margin {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    .blink-text {
        animation: blink 2s steps(1, start) infinite;
    }

    @keyframes blink {
        0%, 50%, 100% {
            opacity: 1;
        }

        25%, 75% {
            opacity: 0;
        }
    }

    .SoucitiesCarousel-container {
        width: 100%;
        overflow: hidden;
    }

    .SoucitiesCarousel-track {
        display: flex;
    }

    .SoucitiesCarousel-slide {
        flex: 0 0 20%; /* 5 slides visible at a time */
        display: flex;
        justify-content: center;
        align-items: center;
    }

        .SoucitiesCarousel-slide img {
            width: 90%;
            height: auto;
            object-fit: contain;
        }

    .AffiliatedInstitutesImageSize {
        width: 50% !important;
        height: 50% !important;
    }

    .New-header-links li:not(:last-child) {
        margin: 0 12px 0 0
    }

    /* Enable Bootstrap 5 submenu */
    /* Required for Bootstrap 5 submenus */


.AffiliatedImageBox {
    width: 100%;
    height: 160px; /* fixed height for all images */
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
    /* prevent stretching */
    background: #fff;
}

    .AffiliatedImageBox img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain; /* keeps original proportions */
        display: block;
    }

.ResponseNewsDay{
    font-size:15px;
}
.ResponseNewsMonth{
    font-size:15px;
}
.ResponsiveNewsTextSize{
    font-size:15px;
}
.ResponseNewsViewDetail{
    font-size:10px;
}

.AdmissionBtn {
    /*
        background-color: #c5a93c !important;
        transition: none !important;
     
    */

    background-color: var(--theme-color) !important;
    transition: none !important;
}
    

    .AdmissionBtn:before {
        background-color: #081933 !important;
    }
    .AdmissionBtn::after {
        background-color: #081933 !important;
    }
.CounterIcon-1 {
    width: 65px;
    height: 65px;
    background-color: var(--theme-color);
    mask: url('../images/counter-icon1-1.svg') center / contain no-repeat;
}

.CounterIcon-2 {
    width: 65px;
    height: 65px;
    background-color: var(--theme-color);
    mask: url('../images/Counter1.svg') center / contain no-repeat;
}
.CounterIcon-3 {
    width: 65px;
    height: 65px;
    background-color: var(--theme-color);
    mask: url('../images/counter-icon1-2.svg') center / contain no-repeat;
}
.CounterIcon-4 {
    width: 65px;
    height: 65px;
    background-color: var(--theme-color);
    mask: url('../images/counter-icon1-3.svg') center / contain no-repeat;
}
.CounterIcon-5 {
    width: 65px;
    height: 65px;
    background-color: var(--theme-color);
    mask: url('../images/counter-icon1-4.svg') center / contain no-repeat;
}
.CounterIcon-6 {
    width: 65px;
    height: 65px;
    background-color: var(--theme-color);
    mask: url('../images/Counter2-2.svg') center / contain no-repeat;
}

.AboutUs-1 {
    width: 50%;
    height: 50%;
    background-color: var(--theme-color);
    mask: url('../images/ab-users.svg') center / contain no-repeat;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20%;
}

    .AboutUs-1:hover {
        width: 50%;
        height: 50%;
        background-color: white;
        mask: url('../images/ab-users.svg') center / contain no-repeat;
        margin-left: auto;
        margin-right: auto;
        margin-top: 20%;
    }

.HoverAboutUs-1:hover .AboutUs-1 {
    width: 50%;
    height: 50%;
    background-color: white;
    mask: url('../images/ab-users.svg') center / contain no-repeat;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20%;
}
.AboutUs-2 {
    width: 50%;
    height: 50%;
    background-color: var(--theme-color);
    mask: url('../images/ab-message.svg') center / contain no-repeat;
    margin-left:auto;
    margin-right:auto;
    margin-top:20%;
}

    .AboutUs-2:hover {
        width: 50%;
        height: 50%;
        background-color: white;
        mask: url('../images/ab-message.svg') center / contain no-repeat;
        margin-left: auto;
        margin-right: auto;
        margin-top: 20%;
    }

.HoverAboutUs-2:hover .AboutUs-2 {
    width: 50%;
    height: 50%;
    background-color: white;
    mask: url('../images/ab-message.svg') center / contain no-repeat;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20%;
}

.AboutUs-3 {
    width: 50%;
    height: 50%;
    background-color: var(--theme-color);
    mask: url('../images/ab-users.svg') center / contain no-repeat;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20%;
}

    .AboutUs-3:hover {
        width: 50%;
        height: 50%;
        background-color: white;
        mask: url('../images/ab-users.svg') center / contain no-repeat;
        margin-left: auto;
        margin-right: auto;
        margin-top: 20%;
    }

.HoverAboutUs-3:hover .AboutUs-3 {
    width: 50%;
    height: 50%;
    background-color: white;
    mask: url('../images/ab-users.svg') center / contain no-repeat;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20%;
}

.Author {
    width: 60%;
    height: 60%;
    background-color: var(--theme-color);
    mask: url('../images/author-2.svg') center / contain no-repeat;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top:20%;
}

.AULogo {
    width: 300px;
    height: 50px;
    background-color: var(--theme-color);
    mask: url('../images/AULogo.svg') center / contain no-repeat;
    
}