@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&family=Red+Hat+Display:ital,wght@0,300..900;1,300..900&display=swap');



body {
    font-family: "Inter", sans-serif;
}
html {
    scroll-behavior: smooth;
}
a {
    color: #1C2539 !important;
}
    a:hover {
        color: #214695;      
    }
.topshadow {
    box-shadow: 0px 4px 40px 0px #273D711A;
}

nav {
    font-family: "Nunito Sans", sans-serif;
    font-weight:700;
    font-size:16px;    
}
.active {
    color: #EF452C !important;
}

ul.navbar-nav.ml-auto {
    display: flex;
    align-items: center;
}
li.nav-item {
    padding: 0px 14px;
}
.custbtn {
    width: 140px;
    Height: 50px;
    border-radius: 30px;
    background: #214695;
    color: #fff !important;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Nunito Sans", sans-serif;
    font-weight: 400;
}
 .custbtn:hover {
   color: #fff !important;
  }

.sltop {
    margin-top: 122px;
}
.fnt20 {
    font-family: "Inter", sans-serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 22px;
    color: #EF452C;
    display:block;
}
.fnt185 {
    font-family: "Inter", sans-serif !important;
    font-weight: 400 !important;
    font-size: 18px !important;
    line-height: 30px;
    color: #666666 !important;
    display: block;
}
.int16 {
    font-family: "Inter", sans-serif;
    font-weight: 600 !important;
    font-size: 16px !important;
    line-height: 38px;
    color: #214695;
    display: block;
}
.vepa {
    margin-top: 100px !important;
}
.yindian {
    /*top: 55px;*/
    position: relative;
    left: -40px;
}
.pdbx {
    padding: 99px 0px;
}
.bgframe {
    /*position: absolute;
    left: -50px;
    top: 142px;
    height: 477px;
    width: 784.67px !important;
    object-fit: contain;*/
    position: absolute;
    left: -50px;
    top: 185px;
    width: unset;
    object-fit: contain;
}
img.youngind {    
    position: relative;
    width: 485px;
    height: 554px;
    object-fit: contain;
    top:5px;
}
.frame {
    position: absolute;
    top: 366px;
    left: 0px;
    bottom: 0px;
    z-index: -1;
}
.fnt64 {
    font-family: "Red Hat Display", sans-serif;
    font-size: 64px !important;
    font-weight: 700;
    line-height: 74px;
    color: #1C2539;
    display: block;
}
.fnt32 {
    font-family: "Red Hat Display", sans-serif;
    font-size: 32px !important;
    font-weight: 900;
    line-height: 28px;
    color: #214695;
    display: block;
}
.learnmore {
    width: 180px;
    height: 52px;
    border-radius: 5px;
    border: 1px solid #214695;
    background: #fff;
    font-family: "Red Hat Display", sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 22px;
    margin-right: 20px;
    color: #214695;
}
.joinepay {
    width: 180px;
    height: 52px;
    border-radius: 5px;
    border: 1px solid #214695;
    background: #214695;
    color:#fff;
    font-family: "Red Hat Display", sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 22px;
    margin-right: 20px;
}

.bgabt {
    background: #F9F9F9 !important;
}
.abtepay {
    font-family: "Red Hat Display", sans-serif;
    font-weight: 500;
    font-size: 16px;
    color:#EF452C;
    display:block;
}
.fnt48 {
    font-family: "Red Hat Display", sans-serif;
    font-weight: 700;
    font-size: 48px;
    line-height: 58px;
    display: block;
    color: #000000;
}
.abtfnt {
    font-family: "Nunito Sans", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    display: block;
    color: #616161;
}
.abtfnt20{
    font-family: "Red Hat Display", sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 26px;
    display: block;
    color:#1C2539;
    display:block;
}
.gatefnt32 {
    font-family: "Red Hat Display", sans-serif;
    font-weight: 700;
    font-size: 32px;
    line-height: 40px;
    display: block;
    color: #000000;
}
.gatefnt16 {
    font-family: "Nunito Sans", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    display: block;
    color: #616161;
}
.gateprfnt16 {
    font-family: "Nunito Sans", sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
    display: block;
}
.whyfnt16 {
    font-family: "Nunito Sans", sans-serif;
    font-weight: 700;
    font-size: 16px;
    line-height: 22px;
    color: #534C4C;
    display: block;
}
.parfnt20 {
    font-family: "Nunito Sans", sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 26px;
    color: #1C2539;
    display: block;
}
.ffnt14 {
    font-family: "Nunito Sans", sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 22.4px;
    color: #1C2539;
    display: block;
}
.fofnt14 {
    font-family: "Nunito Sans", sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 22.4px;
    color: #1C2539;
    display: block;
}
.bgrfs {
    background: #214695;
}
.rfsfnt48 {
    font-family: "Red Hat Display", sans-serif;
    font-weight: 700;
    font-size: 48px;
    line-height: 28px;
    display: block;
    color: #fff;
}
.rfsfnt16 {
    font-family: "Red Hat Display", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 28px;
    display: block;
    color:#fff;
}
.rfs500fnt16 {
    font-family: "Red Hat Display", sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 22.4px;
    display: block;
    color: #fff;
}
.rfsfnt481 {
    font-family: "Red Hat Display", sans-serif;
    font-weight: 700;
    font-size: 48px;
    line-height: 22.4px;
    display: block;
    color: #fff;
}
.mt50{
    margin-top:60px;
}
.rfnt48 {
    font-family: "Red Hat Display", sans-serif;
    font-weight: 700;
    font-size: 48px;
    line-height: 58px;
    display: block;
    color: #000000;
}
.rdtfnt24 {
    font-family: "Red Hat Display", sans-serif;
    font-weight: 700;
    font-size: 24px;
    line-height: 36px;
    display: block;
    color: #000000;
}

.rdtfnt20 {
    font-family: "Red Hat Display", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 54px;
    display: block;
    color: #EF452C;
}
.ret16 {
    font-family: "Red Hat Display", sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height:22.4px;
    color: #EF452C;
    display: block;
    text-transform:uppercase;
}
.opbg {   
    background: url('../img/opbg.jpg') !important;
    background-position:center;
    object-fit:contain;
}
.cnbg {
    background: url('../img/cnbg.jpg') !important;
    background-position: center;
    object-fit: contain;
}
.cross {
    position: absolute;
    top: -1px;
    right: 10px;
}
.line {
    width: 770px;
    position: absolute;
    left: 15%;
    top: 8%;
}
.ourparnter {
    background: #EF452C;
}
.opfnt32 {
    font-family: "Red Hat Display", sans-serif;
    font-weight: 700;
    font-size: 32px;
    line-height: 22px;
    display: block;
    color: #ffffff;
}
.nav-link.active {
    color: #ff5733 !important; /* Example active color */
    font-weight: bold;
    transition: color 0.3s ease, font-weight 0.3s ease; /* Transition for color and font-weight */
}
.nav-link {
    transition: color 0.3s ease, font-weight 0.3s ease; /* Transition when hovering or clicking */
}
.oppd{
    padding:30px 20px;
}
.cardbox{
    border-top-left-radius:30px !important;
    border-top-right-radius:30px !important;
}
.cardbtm{
    border-bottom-left-radius: 30px !important;
    border-bottom-right-radius: 30px !important;
}
.btn-link:hover {
    color: #214695 !important;
    text-decoration: none !important;
}
.btn-link {
    color: #214695 !important;
    text-decoration: none !important;
}

.pp {
    font-family: Inter;
    font-size: 40px;
    font-weight: 700;
    color: #214695;
}
.bgadv {
    background: #F9F9F9;
}
.subad {   
    padding: 20px !important;
    border-radius: 10px !important;
    border: 1px solid #EAEAEA !important;
    display: flex;
    align-items: center;
}
.adint16 {
    font-family: "Inter", sans-serif;
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 19px;
    color: #000000;
    display: block;
}
.growthfnt48 {
    font-family: "Red Hat Display", sans-serif;
    font-size: 48px;
    font-weight: 900;
    line-height: 40px;
    color: #484848;
    display: block;
    margin-bottom:100px;
}
.growthbox {
    background: #F8FBFF;
}
.grofnt16 {
    font-family: "Red Hat Display", sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
    color:#666666;
}
.grobfnt16 {
    font-family: "Red Hat Display", sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
    color: #000000 !important;
}
.triangle-up {
    width: 0;
    height: 0;
    position: absolute;
    top: 25%;
    left: 9%;
    border-left: 25px solid transparent;
    border-right: 25px solid transparent;
    border-bottom: 50px solid #F8FBFF;
}
.arrow {
    position: absolute;
    top: 17%;
    width: 1140px;
    left: 1%;
    padding: 0px 40px;
    object-fit: cover;
}

.counter {
    opacity: 0;
    transition: opacity 1s ease-in-out;
}

.cfnt16 {
    font-family: "Nunito Sans", sans-serif;
    font-weight: 700;
    font-size: 16px;
    line-height: 26px;
    color: #1C2539;
    display: block;
}

.cfnt416 {
    font-family: "Nunito Sans", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #616161;
    display: block;
}

.cpd {
    padding: 5px;
    height: 90px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cpdadd {
    padding: 5px;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.pdbxc {
    padding: 99px 0px;
}
@media(max-width:768px){
    .rfsfnt48 {
        font-family: "Red Hat Display", sans-serif;
        font-weight: 700;
        font-size: 28px !important;
        line-height: 28px;
        display: block;
        color: #fff;
    }
    .rfsfnt481 {
        font-family: "Red Hat Display", sans-serif;
        font-weight: 700;
        font-size: 28px !important;
        line-height: 22.4px;
        display: block;
        color: #fff;
    }
    .growthfnt48 {
        font-family: "Red Hat Display", sans-serif;
        font-size: 48px;
        font-weight: 900;
        line-height: 40px;
        color: #484848;
        display: block;
        margin-bottom: 40px !important;
        margin-top: 20px !important;
    }
    .triangle-up {
        width: 0;
        height: 0;
        position: absolute;
        top: 15% !important;
        left: 9%;
        border-left: 25px solid transparent;
        border-right: 25px solid transparent;
        border-bottom: 50px solid #F8FBFF;
    }
    .sltop {
        margin-top: 32px !important;
    }
    .pdbxc {
        padding: 19px 30px !important;
    }
    .cpd {
        padding: 5px;
        height: 100px !important;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .cpdadd {
        padding: 5px;
        height: 140px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
}


/*@media (min-width: 768px) and (max-width: 1024px) {
    .line {
        width: 470px !important;
        position: absolute !important;
        left: 15%;
        object-fit: cover;
        top: 8%;
    }
}
@media (min-width: 1025px) and (max-width: 1200px) {
    .line {
        width: 670px !important;
        position: absolute !important;
        left: 15%;
        object-fit: cover;
        top: 8%;
    }
}*/

@media only screen and (min-width: 768px) {
    .line {
        width: 470px !important;
        position: absolute !important;
        left: 15%;
        object-fit: cover;
        top: 8%;
    }
    .rfsfnt481 {
        font-family: "Red Hat Display", sans-serif;
        font-weight: 700;
        font-size: 32px;
        line-height: 22.4px;
        display: block;
        color: #fff;
    }    

   
}
@media only screen and (min-width: 992px) {
    .line {
        width: 670px !important;
        position: absolute !important;
        left: 15%;
        object-fit: cover;
        top: 8%;
    }
    .rfsfnt481 {
        font-family: "Red Hat Display", sans-serif;
        font-weight: 700;
        font-size: 38px;
        line-height: 22.4px;
        display: block;
        color: #fff;
    }
}
@media only screen and (min-width: 1200px) {
    .line {
        width: 770px !important;
        position: absolute !important;
        left: 15%;
        object-fit: cover;
        top: 8%;
    }
    .rfsfnt481 {
        font-family: "Red Hat Display", sans-serif;
        font-weight: 700;
        font-size: 38px;
        line-height: 22.4px;
        display: block;
        color: #fff;
    }

}