.banner {
    position: relative;
    z-index:-1
}
.banner-bg {
    height: 100vh;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.banner-title {
    position: absolute;
    bottom: 47%;
    color: #fff;
    text-align: center;
    width: 100%;
    z-index:1
}
.banner-title p{font-size:1.5rem}
.banner-title h2{font-size:4rem}
.nav-tabs{background:#f5f7fa;display:flex;justify-content:center}
.nav-tabs a{
    color:#8e8e8e;
    font-size: 1.5rem;
        padding: 1.75rem 4rem;
}
.nav-tabs a.active{color: #fff;background: #be9562;}
.intro{padding:8rem 20%;text-align:center;background: #fff;}
.section-title{font-size:2rem;font-weight:bold}
.video video{width:100%;margin:3rem 0}
.desc{margin-bottom:1rem;text-align:justify;font-size:var(--small-font-size);line-height:1.75}
.mission-t {position: relative;padding:40vh 0}
.section-bg {
    background-repeat:no-repeat;
    background-position:center;
    background-size: cover;
    position: absolute;
    height: 100vh;
    width: 100%;
    z-index: -1;
    top: 0;
    left: 0;
}
.mission-t img{width:100%;}
.mission-c{padding:8rem 15%;text-align:right;background: #fff;}
.mission-c-t {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.mission-c-t img{width:45%;}
.mission-desc{width:50%;}
.mission-i-b{width:79%;margin-top:-5%}
.course{text-align:center;padding:10rem;background: #fff;}
.timeline {
    display: flex;
    justify-content: space-around;
    position: relative;
    color: #8e8e8e;
    margin: 6rem 0 3rem;
}
.timeline::after{
    content: "";
    position: absolute;
    width: 100%;
    border-top: 1px dashed #8e8e8e;
    top: 9px;
    z-index: 0;
}
.circular {
    width: 1.5rem;
    height: 1.5rem;
    border: 1px solid;
    display: inline-block;
    border-radius: 50%;
    position: relative;
    background: #fff;
    cursor:pointer
}
.circular::after{
    content: "";
    position: absolute;
    width: 1rem;
    height: 1rem;
    background: #8e8e8e;
    border-radius: 50%;
    left: 50%;
    margin-left: -.5rem;
    top: 50%;
    margin-top: -.5rem;
    z-index: 1;
}
.years.active .circular{background:#be9562;border-color:#be9562}
.years.active .circular::after{background:#be9562}
.years .year{font-weight:bold;font-size:1.5rem}
.years.active .year{color:#be9562}
.course .desc {
    text-align: center;
    color: #8e8e8e;
}
.history-desc .desc{display:none}
.history-desc .desc.active{display:block}
.years.active .history-desc{display:block}
.years{position:relative;z-index:1}
.history {
    position: relative;
    display:none
}
.history-show{margin-top:3rem}
.history.active{display:block}
.years.active .history{display:block}
.history img{width:35rem}
.history::after {
    content: "";
    position: absolute;
    height: 4rem;
    border-left: 1px dashed #8e8e8e;
    top: 105%;
    left: 50%;
    margin-left: -1px
}
.honour{background:#f5f7fa}
.honour img{
    width: 100%;
    margin: 4rem 0;
}
.know-More{display:flex;align-items:center;color:#be9562;width: max-content;}
.know-More:hover .arrow-line{width:40px}
.arrow-line {
    height: 1px;
    width: 15px;
    background: #be9562;
    margin-left: 10px;
    transition: width 0.3s ease-in-out;
    -webkit-transition: width 0.3s ease-in-out;
}
.arrow-right {
    width: 5px;
    height: 5px;
    border-top: 5px solid transparent;
    border-left: 5px solid;
    border-bottom: 5px solid transparent;
}
.strength{padding:10rem 0;text-align:center;background: #fff;}
.s-content{display:flex;flex-wrap:wrap;background:#05034b;margin-top:2rem}
.s-content>div{width:50%;}
.s-img{line-height:0}
.s-img>img{width:100%}
.s-text {
    color: #be9562;
    text-align: left;
    padding: 5rem;
    padding-right: 11rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.s-text .desc{
        padding-bottom: 3rem;
    margin-bottom: 0;
    border-bottom: 1px solid;
}
.s-text h2{font-size:var(--main-font-size);font-weight:bold}