.mobile{display: none;}
.banner-sec{position: relative; height: 100%;} 
.banner-box img{
    height: 100%;
}
.banner-sec .mySwiper{height: 100%;position: relative;}
.banner-text { position: absolute;bottom: 8rem;left: 18rem;width: 71rem;padding: 3rem;background: #000000b8;}
.banner-text h2{color: var(--color-white);}
.swiper-pagination-clickable .swiper-pagination-bullet { cursor: pointer; background-color: var(--color-black); }
.banner-sec .swiper-button-prev{ position: absolute; left: 1rem; background: #00000000; border: 1px solid #fff; color: #fff; }
.banner-sec .swiper-button-next{ position: absolute; right: 1rem; background: #00000000; border: 1px solid #fff; color: #fff; }
.banner-sec .swiper-button-prev:hover, .banner-sec .swiper-button-next:hover{ background-color: var(--color-c4) !important; color: #fff !important; }

/************* saga *************/
.saga-text{margin-bottom: 3rem;}
.saga-text p{margin: 3.5rem 0;}
.logo-box{background-color: var(--color-white); padding: 8rem;}
.logo-box img{    width: 70%;margin: 0 auto;}
.vasudhaiva-box {display: grid;grid-template-columns: repeat(2, 1fr);gap: 3rem;     margin: 3rem 0;}
.motto-box {background-color: #e4e4e4; text-align: center;display: flex;flex-direction: column;align-items: center;justify-content: center;padding: 0 6rem;}
.motto-box h5{letter-spacing: 3.6px; color:var(--color-c4);font-weight: 500;     margin-bottom: 2rem;}
.motto-box h2{color: var(--color-c4);font-size: var(--font-36);    line-height: 1.4;}
.motto-box h2 span{font-family: var(--font-Noto-Sans); font-size: var(--font-36); display: block; font-weight: 200; line-height: 6rem;}
.motto-box h3{color: var(--color-c4);font-size: var(--font-42); margin-top: 1.5rem;}
.experience-text{margin: 3rem 0;}
.experience-text h5{color: var(--color-c4); font-weight: 600;}
.experience-list {display: grid;grid-template-columns: repeat(4, 1fr);gap: 4rem; margin-top: 3rem;}
.experience-box { padding: 3rem; border-bottom: 1px solid var(--color-c4); position: relative; border: 1px solid #66666630;transition: transform 0.5s ease;}
.experience-box span{font-size: var(--font-42); font-family: var(--font-Domine-serif);line-height: var(--line-height-48);color: var(--color-c4);font-weight: normal;position: absolute;top: 0;left: 5rem;}
.experience-box h2{ margin-bottom: 2.3rem; font-weight: 800; font-size: var(--font-60);}
/* .experience-box:hover{ background-color: var(--color-c4); }
.experience-box:hover h2, .experience-box:hover h5{color: var(--color-white);} */
.home-fax{grid-template-columns: repeat(1, 40% auto);    gap: 5rem;}
.home-sec1{overflow: hidden;}
.right-motto {
    display: inline-block;
    overflow: hidden;
}
.motto-box h3 {
    color: var(--color-c4);
    font-size: var(--font-36);
    margin-top: 1.5rem;
}

.fax-slide {
    padding: 0 3rem;
}
.home-fax1{
grid-template-columns: repeat(1, 31% 31% 31%);
     gap: 4rem; 
}
.motto-box1{
        margin-bottom: 0;
    height: 100%;
}

.fax-slide1 {
    padding: 5rem;
    background: var(--color-c4);
    display: flex;
    justify-content: center;
    align-items: center;
}
.fax-slide1 .experience-box {
    text-align: center;
       border: 1px solid #66666600;
    border-bottom: 1px solid var(--color-c4);

 
}

.fax-slide1 .experience-box h2 {
  font-weight: 800;
    font-size: 6.5rem;
    color: var(--color-white);
}
.fax-slide1 .experience-box h5{
    color: var(--color-white);
}



/************* LEADERSHIP *************/
.home-sec2{padding: 0;}
.founder-text {height: 100%;display: flex;flex-direction: column; justify-content: center;padding-inline: 7rem 10rem;}
.founder-text h5{letter-spacing: 3.6px;margin-bottom: 1.8rem;}
.founder-text h3{margin-bottom: 1rem;}
.founder-text span{font-family: var(--font-Noto-Sans); font-size: var(--font-16);
    color: var(--color-1f);}
.founder-text p{margin-block: 3.4rem;}
.founder-text .cus-btn{width: 31%;}  
.founder-text .cus-btn:hover{width: 33%;}   
/************* school *************/
.school-list { display: grid;grid-template-columns: repeat(3, 1fr); gap: 3rem;} 
.school-box {position: relative;background-color: var(--color-white);}
.school-text {padding-inline: 4.3rem;padding-block: 0 4rem;position: relative;  display: flex; flex-direction: column; justify-content: space-between;height: 46%;overflow: hidden;}
.school-text h3{
        font-size: var(--font-24);
    line-height: var(--line-height-30);
}
.cus-school-text {background-color: var(--color-c4);}
.school-text .cus-btn{ width: 37%; }
.school-box:hover .cus-btn{color: var(--color-black);}
.cus-school-text h5 { letter-spacing: 3.6px;color: var(--color-white);}
.cus-school-text {background-color: var(--color-c4);display: inline-block; padding: .4rem 1rem;    margin-inline: 4rem 0; margin-block: -1rem 4rem;position: relative;}
.school-text p{padding-block: 2.5rem;}
/************* SYMBIOSIS MUSEUM *************/
.home-sec4{background-color: var(--color-06);position: relative;z-index: 1;}
.stories-text{padding-inline: 10rem 5rem; margin-bottom: 6rem;}
.stories-text h5{color: var(--color-white); letter-spacing: 3.6px;}
.stories-text h3{color: var(--color-white);margin-block: 3rem 4rem;}
.stories-text .cus-btn{color: var(--color-white); border-bottom: 1px dashed var(--color-white);}
.cultural-list{background-color: var(--color-white);    margin-inline: 4rem 5rem; padding: 5rem 6rem;}
.cultural-box {display: flex;padding: 3rem 0;border-bottom: 1px dashed var(--color-c4); justify-content: space-between; position: relative;}
.cultural-text h5{color: var(--color-c4); font-weight: normal;}
.cultural-link{}
.cultural-list .cus-btn1 {background-color: var(--color-c4);}
.cultural-list .cus-btn1 img{filter: brightness(0) invert(1);}

.memorial-img{position: relative;}
.memorial-img::before{content: '';background-color: #ffffffbd;width: 25rem;position: absolute;bottom: -1rem;height: 2rem; right: 5rem;z-index: 9;display: none;}
.memorial-img::after{content: '';background-color: #c4161ca6; width: 12rem;position: absolute;bottom: -2rem;height: 2rem;right: 5rem;z-index: 9;display: none;}

.health-box{padding-inline: 8rem 13rem;}
.health-img{overflow: hidden; height: 100%;}
.health-img figure{height: 100%;}
.health-img figure img{height: 100%; object-fit: cover;}
.health-text {position: relative;}
.health-text h5{color: var(--color-white); letter-spacing: 3.6px;}
.health-text h3{color: var(--color-white); margin-block: 2rem;}
.health-text p{color: var(--color-white); margin-bottom: 4rem;}
.health-text .cus-btn{color: var(--color-white); border-bottom: 1px dashed var(--color-white);}
.home-sec4::after{content: '';background-color: var(--color-f6);width: 100%; position: absolute;bottom: 0;height: 30rem; z-index: -1;}
.hospital-box { margin-top: 7rem;}
.hospital-box .cultural-box{border-bottom: 1px dashed var(--color-1f);}
.hospital-box .cultural-text h5{color:var(--color-c4);}

/************* SYMBIOSIS INITIATIVES *************/
.home-sec5{background-color: var(--color-af);}
.research-list {display: grid;grid-template-columns: repeat(2, 1fr);gap: 4rem;}
.research-box-home{position: relative;}
.research-text {background-color: var(--color-white);  padding: 4.5rem 6rem;}
.research-text h5{color: var(--color-c4); letter-spacing: 3.6px;}
.research-text h3{color: var(--color-c4); margin-block: 2rem; font-size: var(--font-24); line-height: var(--line-height-30);}
.research-text p{color: var(--color-c4); margin-bottom: 3rem;}
.research-text .cus-btn{color: var(--color-c4);}
/* .research-box-home:nth-child(2n) .research-text{background-color: var(--color-c4);} */
.research-box-home:hover .cus-btn{color: var(--color-black);}
/************* SYMBIOSIS FOUNDATION *************/
.home-sec6{position: relative; padding: 10rem 0;}
.society-box{position: relative; padding-left: 9rem; z-index: 1;}
.society-text, .society-btn {position: relative;}
.society-text h5{letter-spacing: 3.6px;}
.society-text h2 { margin-block: 2rem 1rem; font-size: var(--font-36);}
.society-img {margin-block: 4rem 0;}
.society-img1, .society-img2{height:auto;margin-bottom:2rem;} 
.society-img1 figure, .society-img2 figure{height: 100%;} 
.society-img1 figure img, .society-img2 figure img{height: 100%; object-fit: cover;} 
.society-box::before{content: '';background-color: var(--color-white);position: absolute;width: 52rem; z-index: 0;height: 76rem;left: 3.5rem;}
.scholarship-box {padding-inline: 3rem 0; position: relative;     padding-block: 0rem 0;}
.society-text{ padding-block: 5rem 0; }
.scholarship-text {padding: 2rem 4rem 0 4rem;}
.scholarship-text h5{    color: var(--color-c4);font-weight: 600;margin-bottom: 3rem;}
.scholarship-year { margin-block: 4rem; border-top: 1px dashed var(--color-black); padding-block: 3rem 0;}
.scholarship-year p{font-size: var(--font-16); font-style: italic; color: var(--color-1f);}
.society-box:hover .cus-btn{color: var(--color-black);}


/************* New Faces New Friends *************/
.home-sec7{padding: 3rem 0 8rem;}
.new-text{margin-bottom: 4rem;}
.new-friend-box{padding-inline: 0 3rem; position: relative;}
.new-friend-img {position: relative;}
.new-friend-text {position: absolute; background: transparent linear-gradient(180deg, #00000000 0%, #000000 100%) 0% 0% no-repeat padding-box;bottom: 0;width: 100%; padding: 10rem 0 0 0;display: flex;justify-content: space-between;     align-items: center;}
.left-new-text{    padding-inline: 4rem 0;}
.left-new-text h4{color: var(--color-white);}
.right-new-text{background-color: var(--color-c4); padding: 3rem 4rem;}
.right-new-text blockquote{font-size: var(--font-21); font-family: var(--font-Noto-Sans); color: var(--color-white); font-weight: 600; margin-bottom: 0;}
.right-new-text p{font-size: var(--font-18); color:var(--color-white); font-style: italic;}
.friend-img{position: relative;}
.friend-text{background: transparent linear-gradient(180deg, #00000000 0%, #000000 100%) 0% 0% no-repeat padding-box;position: absolute;bottom: 0;padding: 4rem 1.3rem 1.5rem;width: 100%;}
.friend-text h6{color: var(--color-white);}
.new-friend-list {display: flex;flex-direction: column;justify-content: space-between;}
.cus-friend-box{position: relative;}
.cus-friend-box::before{ content: '';background-color: var(--color-c4);height: .5rem; width: 16.5rem;position: absolute;top: 0;z-index: 1;}
.cus-friend-box::after{content: '';background-color: var(--color-c4); height: .5rem;width: 16.5rem; position: absolute; bottom: -.5rem;z-index: 1;}


/* -----------------------new face new Friend section -------------------------- */
.new-faces{padding-top: 0rem}
.new-faces img{max-width: 100%; width: 100%; height: 100%; object-fit: cover;}
/* .new-faces :where(.thumbslider, .swiper){height: 100%; max-height: 100%;} */
.new-faces .thumbslider{--slide-height: 255px; --slides: 3; --gap: 3.5rem; height:calc((var(--slide-height) * var(--slides)) + (var(--slides) - 1) * var(--gap))}
.new-faces .thumbslider img{height: var(--slide-height);}
.new-faces .thumbslider .swiper{height:100%}
.new-faces .thumbslider .swiper-slide{height:var(--slide-height)}

.new-faces figure{display: grid; align-items: end; position: relative;}
.new-faces figure>*{grid-area: 1/1;}
.new-faces figure::before{content: ''; position: absolute; inset: 0; background: transparent linear-gradient(180deg, #00000000 0%, #000000 100%) 0% 0% no-repeat padding-box; opacity: .59;}
.new-faces .main-slider figure::before{content: ''; position: absolute; inset: 0; top: auto; height: 30%; background: transparent linear-gradient(180deg, #00000000 0%, #000000 100%) 0% 0% no-repeat padding-box; opacity: .51;}
.new-faces figure figcaption{position: relative; padding: 2rem 2.3rem}
.new-faces figure iframe{ width: 100%;height: 100%;}
.new-faces .faces-slider .swiper-slide{height: auto;}
.new-faces .faces-slider figure{height: 100%; aspect-ratio: 1.71 / 1;}
.new-faces.index-2 .faces-slider figure{height: 100%; aspect-ratio: unset}
.new-faces.index-2 :where(.faces-slider, .main-slider){height: 100%;} 

.new-faces p{color:var(--color-white); }
.new-faces .main-slider figcaption{padding: 0 0rem 0rem 4.8rem; display: flex; justify-content: space-between; column-gap: 3rem;     align-items: center;}
.new-faces .main-slider figcaption h4{color: var(--color-white);    font-weight: 300;}
.new-faces .main-slider p{font-family: var(--family-noto); font-weight: 200;}
.new-faces .main-slider p{padding: 3.5rem 6rem; background: var(--color-c4); font-weight: 700; font-size: var(--text-21); white-space: nowrap;     font-size: var(--font-21);
    font-family: var(--font-Noto-Sans);
    color: var(--color-white);
    font-weight: 600;
    margin-bottom: 0;}
.new-faces .main-slider p span{display: block; font-weight: 300; font-size:var(--font-18); font-style: italic; }
.new-faces .swiper-thumbs .swiper-slide{position: relative;cursor: pointer;}
.new-faces .swiper-thumbs .swiper-slide::after,
.new-faces .swiper-thumbs .swiper-slide::before{ content: ''; position: absolute; height: .5rem; width: 40%; background-color: var(--color-c4); left: 0; z-index: 1; transition: .4s all; -webkit-transition: .4s all; -moz-transition: .4s all; -ms-transition: .4s all; -o-transition: .4s all; opacity: 0;}
.new-faces .swiper-thumbs .swiper-slide-thumb-active::after,
.new-faces .swiper-thumbs .swiper-slide-thumb-active::before{opacity: 1;}
.new-faces .swiper-thumbs .swiper-slide::after{top: 100%;}
.new-faces .swiper-thumbs .swiper-slide::before{top: 0%;}
.new-faces .link-with-icon{margin-top: 6rem}
.new-faces.index-2 .inner-container{max-width: 73%;}
@media (max-width: 2199px){
    .new-faces .thumbslider{--slide-height: 228px;}
    .life-at-siu .scroller-container .row{--bs-gutter-x: 11rem}
}
@media (max-width: 1999px){
    .new-faces .thumbslider{--slide-height: 185px;}
}
@media (max-width: 1699px){
    .new-faces .thumbslider{--slide-height: 165px; --gap: 1.5rem}
    .new-faces .main-slider p:last-child{padding: 2.5rem 4.5rem}
    .new-faces .swiper-thumbs .swiper-slide::after,
    .new-faces .swiper-thumbs .swiper-slide::before{height: 3px;}
    .life-at-siu .scroller-container .row{--bs-gutter-x: 6rem}
}
@media (max-width: 1399px){
    .new-faces .thumbslider{--slide-height: 145px; --gap: 1rem}
    .new-faces figure figcaption{padding: 1rem}
    .new-faces .main-slider p:last-child{padding: 1.5rem 3rem}
    .new-faces .swiper-thumbs .swiper-slide::after,
    .new-faces .swiper-thumbs .swiper-slide::before{height: 2px;}
}
/* -----------------------new face new Friend section end-------------------------- */

.home-sec7 .view-btn{    margin-top: 4rem;}
.home-sec7 .view-btn img{    width: 2.5rem;
    height: 2.5rem;    object-fit: contain;}
/************* news *************/
.home-sec8{background-color: var(--color-c4); padding-inline: 10rem;}
.news-menu{margin-bottom: 4rem;}
.news-menu ul{}
.news-menu ul li{display: inline-block;  padding: 0 2rem; border-right: 1px solid #ffffff75; }
.news-menu ul li:last-child{border-right:0px}
.news-menu ul li a{}
.news-menu ul li.active a{    color: var(--color-white);opacity: 1;}

.news-box {display: grid;grid-template-columns: repeat(1, 49% auto); border: 1px solid #D35256; position: relative;}
.news-text {display: flex;flex-direction: column;height: 100%;justify-content: center;padding-inline: 6rem;}
.news-text h3{color: var(--color-white);}
.news-text p{color: var(--color-white);padding-block: 2.5rem;}
.news-text .cus-btn{color: var(--color-white);     border-bottom: 1px dashed var(--color-white);     width: 31%;}
.more-news {display: grid;grid-template-columns: repeat(3, 1fr); gap: 2rem; margin-top: 5rem;}
.news-box-list {display: flex; background-color: var(--color-white);    padding: 1.5rem 1.5rem 2.2rem; position: relative;}
.news-box-text { width: 100%; padding: 0 1.5rem; display: flex; flex-direction: column; justify-content: space-between;}
.news-box-img {width: 50%;    height: 100%; overflow: hidden;}
.news-box-img figure{height: 100%;}
.news-box-img figure img{height: 100%; object-fit: cover;}
.news-box-text p{margin-bottom: 1.5rem;}
.news-box-text h5{font-weight: 600; color: var(--color-c4); margin-bottom: 2.5rem;}
.featured-event{position: relative; height: 100%;}
.featured-box{position: relative; height: 100%;}
.featured-box figure{height: 100%;}
.featured-box figure img{height: 100%; object-fit: cover; opacity: .7;}
.events_details .featured-box figure img{opacity: 1;}
.events_details .featured-box figure{ position: relative;}
.events_details .featured-box figure::before{ content: ""; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0, 0, 0, .4), transparent); }
.news_filter .dropdown-container{ margin-top: 7rem; margin-inline: 2.3rem;}
.news-box-text .cus-btn{
        width: 35%;
}
.home-gallery {
    margin-top: 5rem;
}

.featured-text{    position: absolute;top: 5rem;left: 4rem;}
.featured-text h5{color: var(--color-white); letter-spacing: 3.6px;} 
.featured-heading {position: absolute; bottom: 0;padding: 5rem;     width: 100%;}
.featured-heading h3{color: var(--color-white); font-size: var(--font-28);}
.featured-heading p{color: var(--color-white);margin-block: 2rem;}
.home-gallery .gallery_grid{    grid-template-columns: repeat(3, 1fr);  }


/************* Social *************/
.social-text{position: relative;}
.social-text h5{ font-weight: 600; letter-spacing: 3.6px;}
.social-text h5 span{color: var(--color-c4);}
.social-feed {display: grid;grid-template-columns: repeat(4, 1fr); gap: 3rem; margin-top: 4rem;}
.social-feed-box{ position: relative;}
.social-icon {position: relative;
    z-index: 9;}
.social-icon img{ width: 5rem; display: block; margin: 0 auto -2rem;position: relative; box-shadow: 0px 0px 6px #66666647; border-radius: 10rem;} 
.social-feed-img {  box-shadow: 0px 0px 6px #66666647; position: relative;}
.social-feed-text {
    background: transparent linear-gradient(0deg, #00000000 0%, #000000 100%) 0% 0% no-repeat padding-box;
    position: absolute;
    width: 100%;
padding: 3rem 1rem 1rem 2rem;
    top: 0;

}
.social-feed-text p{color: var(--color-white); font-size: var(--font-16); font-weight: 400; display: flex;}
.social-feed-text p img{width: 3.5rem;
    height: 3.5rem;
    background: #fff;
    border-radius: 10rem;
    padding: .5rem;
    margin-right: 1rem;}
.all-news {
    padding: 3.5rem 0 0 3rem;
}

.all-news .cus-btn{
        color: var(--color-white);
        border-bottom: 1px dashed #fff;
     
}
    
.merchandise-btn{
position: fixed;
    top: 210px;
    right: 8px;
    background-color: var(--color-c4);
    color: white;
    border: none;
    border-radius: 8px;
    padding: 8px 20px;
    font-size: 16px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
    cursor: pointer;
    z-index: 1000;
    transition: background-color 0.3s;
    font-family: var(--font-Noto-Sans);
    text-align: center;
    z-index: 1;
}
.all-gallery{
    padding: 3rem 0 0 0;
}
.all-gallery .cus-btn{
    color: var(--color-white);
    border-bottom: 1px dashed #fff;
}
.marquee-slide{
padding: 2rem 0;
    background-color: var(--color-c4);
    margin-top: -.6rem;
}
.marquee-slide marquee{
    font-family: var(--font-Noto-Sans);
    color: var(--color-white);
    font-size: var(--font-21);
}

@media(max-width:1799px) {
.founder-text .cus-btn {
    width: 33%;
}
.hospital-box {
    margin-top: 5rem;
}
.cultural-box{    padding: 2rem 0;}
.home-sec4::after{    height: 25rem;
}
.news-text .cus-btn{    width: 31%;}
.society-box::before{height: 70rem;     width: 48rem;

}
.wp-friend-box {
    margin-top: 2rem;
}
.new-friend-img {
    position: relative;
    height: 100%;
}
.new-friend-img figure{
    height: 100%;
}
.new-friend-img figure img{
    height: 100%;
    object-fit: cover;
}
}

@media(max-width:1560px) {
    .founder-text .cus-btn {
        width: 30%;
        white-space: nowrap;
    }
    .news-text .cus-btn {
        width: 34%;
    }
        .society-box::before {
        height: 63rem;
        width: 48rem;
    }
    .hospital-box .cultural-text h5 br{display: none;}

}
@media(max-width:1450px) {
.cultural-list { padding: 3rem 5rem; }
.news-text .cus-btn { width: 38%; }
 .banner-text{ width: 60rem; left: 11rem; }
}

@media(max-width:1366px) {
      .news-text .cus-btn {
        width: 43%;
    }
    .banner-text {
    bottom: 6rem;
    left: 11rem;
    width: 50rem;
    padding: 2rem;
}

}
@media(max-width:1280px) {
     .news-text .cus-btn {
        width: 40%;
    }
    .news-text {
    padding-inline: 4rem;
}



}
@media(max-width:1170px) {


}
.news-menu ul.tabs li.active{
    color: var(--color-white);
}