*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'DM Sans', sans-serif;
}
a{
    text-decoration: none !important;
}
.main-page-btn{
    border: none;
    background-color: #f7b538;
    color: white;
    padding: 10px;
    border-radius: 5px;
}
.main-page-btn a{
    color: white;
    text-decoration: none;
}
.main-heading{
    font-weight: bold;
    color: #3F3A64;
    line-height: 60px;
    font-size: 48px;
    letter-spacing: 2px;
}
.main-text-bg{
    font-size: 20px;
    line-height: 35px;
    margin: 10px 0px 20px 0px;
}
.main-sub-heading{
    font-family: 'DM Sans', sans-serif;
    font-weight: bold;
    font-size: 35px;
    color: #3F3A64;
    letter-spacing: 1px;
}
.main-card-heading{
    font-size: 22px;
    font-weight: bold;
}
.main-card-para{
    margin: 10px 0px 10px 0px;
    line-height: 25px;
}
.navbar-container{
    display: flex;
    justify-content: space-center;
}

.industry-img-sm{
    height: 250px;
    width: 250px;
}

.navbar-box{
    width: 80%;
}
.nav-container{
    width: 100%;
    display: flex;
    justify-content: center;
    box-shadow: rgba(193, 193, 193, 0.2) 0px 7px 29px 0px;
}
.navbar-img{
    width: 13%;
}
.navbar-img img{
    width: 100%;
}
.navbar-menu-active a{
    text-decoration: underline !important;
    color: #20AD96 !important;
}
.nav-item a{
    font-size: 18px;
    font-weight: bold;
    margin: 0px 0px 0px 20px;
    font-family: Arial, Helvetica, sans-serif;
    color: #171621;
}
.nav-item a:hover{
    text-decoration: underline !important;
    color: #20AD96 !important;
    width: fit-content!important;
}
.dropdown-menu{
    border: solid #20AD96 !important;
    border-width: 0px 0px 4px 0px !important;
    border-radius: 0px !important;
}
.dropdown:hover .dropdown-menu { 
    display: block; 
} 
.dropdown{
    outline: none;
}
.dropdown-menu{
    width: 270px !important;
}
.dropdown-item:hover{
    background-color: #ffffff !important;
}
.navbar-collapse{
    display: flex;
    justify-content:end !important;
}

.banner-container{
    background-color: #f9efe7;
    display: flex;
    justify-content: center;
    padding: 60px;
    font-family: 'DM Sans', sans-serif;
}
.banner{
    width: 80%;
    display: flex;
    justify-content: space-between;
}
.banner-text{
    width: 55%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.banner-img{
    width: 40%;
}

.experts-container{
    display: flex;
    justify-content: center;
    margin: 50px 0px 50px 0px;
}
.experts{
    width: 80%;
}
.expert-txt-1{
    width: 60%;
    font-size: 20px;
    line-height: 35px;
}
.expert-txt-2{
    width: 30%;
}
.experts-text{
    display: flex;
    justify-content: space-between;
    margin: 50px 0px 50px 0px;
}
a{
    color: #f7b538;
    text-decoration: none;
}
.experts-count{
    font-weight: bold;
    font-size: 30px;
    color: #20AD96;
}
.career-container{
    display: flex;
    justify-content: center;
    padding: 60px;
}
.career{
    width: 80%;
    /* margin: 30px 0px 30px 0px; */
}
.career-heading{
    text-align: center;
}
.span-item{
    color: #f7b538;
}
.career-cards{
    display: flex;
    justify-content: space-between;
    padding: 30px 0px 10px 0px;
}
.career-card{
    border-radius: 5px;
    width: 23%;
    padding: 20px;
    text-align: center;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}
.career-card img{
    width: 100px;
    margin: 10px 0px 10px 0px;
}
.companies-container{
    width: 100%;
    display: flex;
    height: 100%;
    justify-content: center;
    margin: 70px 0px 100px 0px;
}
.companies-content{
    width: 80%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.companies-logo-container{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.companies-logo-container div{
    width: 21%;
    height: 20% !important;
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
}
.companies-logo-container div img{
    width: 80% !important;
    height: 100% !important;
    object-fit: contain;
}
.companies-book-btn{
    margin-top: 150px;
}
.graduate-container{
    width: 100%;
    display: flex;
    justify-content: center;
}
.graduate{
    width: 80%;
    display: flex;
    justify-content: space-between;
}
.graduate-img{
    width: 40%;
}
.graduate-text{
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.img1, .img2{
    width: 100%;
    height: 400px;
}
.img1>img, .img2>img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.png-container-1{
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 50px 0px 50px 0px;
    /* padding: 100px 0px 100px 0px; */
}
.graduate-text p{
    font-size: 18px;
    margin: 23px 0px 20px 0px;
}

.png-container{
    background-color: #f9efe7;
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 50px 0px 50px 0px;
    padding: 100px 0px 100px 0px;
}
.png-content{
    width: 80%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 15px;
    font-size: 18px;
    font-family: 'Nunito Sans', sans-serif;
}

.slider-class{
    width: 100%;
    display: flex;
    justify-content: center;
}
.slider{
    width: 100%;
}
.slider-card{
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    width: 100%;
    padding: 20px;
    height: 450px !important;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    border-radius: 5px;
    background-color: white;
}
.student-name{
    display: flex;
    flex-direction: column;
}
.student-name h6{
    font-weight: bold;
}
.slider div{
    width: 100%;
    /* margin-left: 10px; */
    /* height: 150px; */
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.slider div img{
    width: 100%;
    height: 150px;
    object-fit: contain;
}
.slick-prev:before,
.slick-next:before {
    color: black !important;
}

.career-slider-card{
    padding: 10px;
    font-size: 15px;
}

.counter{
    margin: 50px 0px 100px 0px;
    width: 100%;
    display: flex;
    justify-content: space-evenly;
}
.counter-num{
    font-weight: bold;
    color: #f7b538;
}
.counter-text{
    font-size: 20ppx;
    font-weight: bold;
}

.mobile{
    display: flex;
    justify-content: center;
    padding: 10px;
    margin: 0px 0px 30px 0px;
}
.mobile-container{
    width: 80%;
    display: flex;
    justify-content: space-between;
}
.mobile-text{
    width: 50%;
    padding: 10px;
    font-family: 'DM Sans', sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
}
.mobile-title{
    letter-spacing: 1.5px;
    font-size: 18px;
    font-weight: bold;
}
.mobile-text h1{
    color: #f7b538;
    letter-spacing: 1px;
    font-weight: 200;
    margin: 10px 0px 10px 0px;
    font-size: 50px;
}
.mobile-content{
    margin: 20px 0px 20px 0px;
    line-height: 30px;
    font-size: 20px;

}
.mobile-image{
    width: 50%;
    height: 500px;
}
.mobile-image img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.mobile-image-sm{
    display: none;
}

.footer-container{
    font-family: "Montserrat", Sans-serif;
    background-color: #171621;
    margin-top: 50px;
    color: #ccc;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items:  center;
}
.footer-content{
    width: 80%;
    display: flex;
    justify-content: space-between;
    padding: 100px 0px 100px 0px;
} 
.address ul{
    padding: 0px;
}
 .explore ul li, .info ul li{
    list-style-type: none;
    margin: 0px 0px 10px 0px;
    font-size: 14px;
    line-height: 25px;
}
.app-icons{
    cursor: pointer;
}
.app-icons a{
    color: white;
}
.address ul li{
    list-style-type: none;
    font-size: 14px;
    line-height: 25px;
}
.explore ul li a, .info ul li a{
    text-decoration: none;
    color: white;
}
.address{
    width: 40%;
}
.explore, .info{
    width: 25%;
}
.address-section{
    display: flex;
    align-items: center;
}
.address-section p{
    margin-top: 13px;
}
.address-icon{
    padding: 0px 10px 0px 0px;
}
.apps-icon{
    width: 50%;
    display: flex;
    justify-content: space-between;
    margin: 30px 0px 0px 0px;
}
.app-icons{
    font-size: 20px;
}

.copy-rights p{
    padding: 30px 0px 100px 0px;
}
.img1-sm, .img2-sm{
    display: none;
}
.expert-txt-2 a{
    color: #f7b538;
    font-weight: bold;
    text-decoration: none;
}
.navbar-collapse{
    justify-content: start;
}

/* 0-480, 481-768,769-1279, 1280+ */
.text-pages{
    padding: 30px;
    margin: 30px;
}

@media screen and (min-width: 320px) and (max-width : 481px) {
    .login{
        margin: 0px 0px 0px 20px !important;
    }
    .graduate-text p{
        font-size: 16px;
        margin: 15px 0px 20px 0px;
    }
    .navbar-box{
        width: 100%;
    }
    .navbar-img{
        width: 40%;
    }
    .banner-img{
        display: none;
    }
    .banner{
        width: 100%;
    }
    .banner-text{
        width: 100%;
        text-align: center;
    }
    .banner-container{
        padding: 50px 20px 50px 20px;
    }
    .main-heading{
        letter-spacing: 0px;
        font-size: 30px;
        line-height: 45px;
    }
    .main-text-bg{
        font-size: 18px;
        line-height: 30px;
    }
    .career-container{
        padding: 20px;
    }
    .career{
        width: 100%;
    }
    .career-cards{
        flex-direction: column;
    }
    .career-card{
        width: 100%;
        margin-bottom: 30px;
    }
    .main-sub-heading{
        font-size: 25px;
    }
    .career-heading p{
        font-size: 15px;
    }
    .experts{
        width: 100%;
    }
    .main-sub-heading{
        text-align: start;
    }
    .experts-text{
        flex-direction: column;
        margin: 30px 0px 0px 0px;
    }
    .expert-txt-1, .expert-txt-2{
        width: 100%;
    }
    .experts-para{
        font-size: 18px;
        line-height: 25px;
    }
    .experts-container{
        margin-top: 20px;
        padding: 15px;
    }
    .counter{
        flex-wrap: wrap;
        justify-content: space-between;
        margin: 40px 0px 40px 0px;
        text-align: center;
    }
    .counter>div{
        width: 40%;
    }
    .png-content{
        width: 100%;
    }
    .mobile-container{
        width: 100%;
    }
    .mobile-text{
        width: 100%;
    }
    .mobile-text>div{
        width: 100%;
    }
    .mobile-image{
        display: none;
    }
    .mobile-image-sm{
        display: block;
        width: 100%;
        height: 400px;
        margin-top: 20px;
    }
    .mpobile-title{
        font-size: 15px;
    }
    .mobile-text div h1{
        font-size: 35px;
    }
    .png-container{
        padding: 10px;
    }
    .slider-class{
        width: 80%;
    }
    .career-heading{
        font-size: 15px;
    }
    .graduate{
        flex-direction: column;
        width: 100%;
    }
    .graduate-container{
        padding: 15px;
    }
    .graduate-img{
        width: 100%;
    }
    .graduate-text{
        width: 100%;
    }
    .img1, .img2{
        display: none;
    }
    .img1-sm, .img2-sm{
        display: block;
        width: 100%;
        height: 80%;
    }
    .img1-sm>img, .img2-sm>img{
        width: 100%;
        height: 100%;
    }
    .footer-container{
        padding: 15px;
    }
    .footer-content{
        flex-direction: column;
        width: 100%;
    }
    .address, .explore, .info{
        width: 100%;
    }
    .explore>ul, .info>ul{
        padding: 0px !important;
        margin: 40px 0px 0px 0px !important;
    }
}
@media screen and (min-width: 481px) and (max-width : 650px) {
    .banner-container{
        width: 100%;
        padding: 30px;
    }
    .banner{
        width: 100%;
    }
    .banner-img{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .banner-img img{
        width: 100%;
    }
    .main-heading{
        font-size: 25px;
        line-height: 35px;
        letter-spacing: 1px;
    }
    .career{
        width: 100%;
    }
    .career-cards{
        flex-wrap: wrap;
    }
    .career-card{
        width: 45%;
        margin-bottom: 20px;
    }
    .career-container{
        width: 100%;
        padding: 30px;
    }
    .career-card img{
        width: 35%;
    }
    .main-card-heading{
        font-size: 20px;
    }
    .main-card-para{
        font-size: 15px;
        line-height: 22px;
    }
    .main-sub-heading{
        font-size: 25px;
    }
    .experts-container{
        padding: 30px;
        margin-top: 0px;
    }
    .experts{
        width: 100%;
    }
    .main-text-bg{
        font-size: 16px;
        line-height: 30px;
        margin: 0px;
    }
    .experts-text{
        margin: 20px 0px 0px 0px;
    }
    .experts-count{
        font-size: 20px;
    }
    .graduate-container{
        padding: 30px;
    }
    .graduate{
        width: 100%;
    }
    .graduate-img{
        display: none;
    }
    .graduate-text div{
        width: 100%;
    }
    .graduate-text{
        width: 100% !important;
    }
    .png-container{
        padding: 30px;
    }
    .png-content{
        width: 100%;
    }
    .counter{
        margin: 20px 0px 20px 0px;
    }
    .counter-num{
        font-size: 25px;
    }
    .slider-card div p{
        font-size: 13px;
    }
    .companies-container{
        padding: 30px;
        margin: 0px;
    }
    .companies-content{
        width: 100%;
    }
    .png-container-1{
        padding: 30px;
        margin-bottom: 0px;
    }
    .mobile{
        padding: 30px;
        padding-top: 0px;
    }
    .mobile-container{
        width: 100%;
    }
    .mobile-text div h1{
        font-size: 35px;
    }
    .main-page-btn{
        margin-top: 5px;
    }
    .navbar-img{
        width: 25%;
    }
}

@media screen and (min-width: 650px) and (max-width : 769px) {
    .banner-container{
        width: 100%;
        padding: 30px;
    }
    .banner{
        width: 100%;
    }
    .banner-img{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .banner-img img{
        width: 100%;
    }
    .main-heading{
        font-size: 25px;
        line-height: 35px;
        letter-spacing: 1px;
    }
    .main-text-bg{
        font-size: 18px;
        line-height: 30px;
    }
    .main-sub-heading{
        font-size: 28px;
    }
    .main-card-heading{
        font-size: 20px;
    }
    .main-card-para{
        font-size: 15px;
        line-height: 22px;
    }
    .career{
        width: 100%;
    }
    .career-cards{
        flex-wrap: wrap;
    }
    .career-card{
        width: 45%;
        margin-bottom: 20px;
    }
    .career-container{
        width: 100%;
        padding: 30px;
    }
    .career-card img{
        width: 35%;
    }
    .experts-container{
        padding: 30px;
        padding-bottom: 0px;
        margin: 0px;
    }
    .experts{
        width: 100%;
    }
    .main-text-bg{
        font-size: 18px;
        line-height: 32px;
        margin: 0px;
    }
    .experts-text{
        margin: 20px 0px 0px 0px;
    }
    .expert-txt-1{
        display: flex;
        justify-content: space-evenly;
        flex-direction: column;
    }
    .expert-txt-2 p{
        margin-bottom: 10px;
    }
    .experts-count{
        font-size: 30px !important;
    }
    .experts-count{
        font-size: 20px;
    }
    .graduate-img{
        width: 45%;
    }
    .graduate-container{
        padding: 30px;
        padding-top: 0px;
    }
    .graduate{
        width: 100%;
    }
    .graduate-text div{
        width: 100%;
    }
    .graduate-text{
        width: 50% !important;
    }
    .graduate-text p{
        font-size: 16px;
        margin: 18px 0px 18px 0px;
    }
    .png-container{
        margin-top: 0px;
        padding: 30px;
    }
    .png-content{
        width: 100% !important;
    }
    .counter{
        margin: 20px 0px 20px 0px;
    }
    .companies-container{
        margin-top: 20px;
        padding: 30px;
    }
    .companies-content{
        width: 100%;
    }
    .png-container-1{
        padding: 30px;
        margin-bottom: 0px;
    }
    .mobile{
        padding: 30px;
    }
    .mobile-container{
        width: 100%;
    }
    .footer-container{
        padding: 30px;
    }
    .footer-content{
        width: 100%;
        padding: 0px;
    }
    .main-page-btn{
        margin-top: 15px;
    }
}

@media screen and (min-width: 769px) and (max-width : 1024px){
    .banner-container{
        width: 100%;
        padding: 30px;
    }
    .banner{
        width: 100%;
    }
    .banner-img{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .banner-img img{
        width: 100%;
    }
    .main-heading{
        font-size: 40px;
        line-height: 50px;
        letter-spacing: 1px;
    }
    .main-text-bg{
        font-size: 18px;
        line-height: 30px;
    }
    .main-sub-heading{
        font-size: 28px;
    }
    .main-card-heading{
        font-size: 20px;
    }
    .main-card-para{
        font-size: 15px;
        line-height: 22px;
    }
    .career{
        width: 100%;
        padding: 15px;
    }
    .career-cards{
        flex-wrap: wrap;
        width: 100%;
    }
    .career-card{
        width: 23%;
        margin-bottom: 20px;
    }
    .career-container{
        width: 100%;
        padding: 30px;
    }
    .career-card img{
        width: 35%;
    }
}
@media screen and (min-width: 1024px) and (max-width : 1279px){
    .banner{
        width: 100%;
    }
    .banner-img img{
        width: 100%;
    }
    .career{
        width: 100%;
    }
    .png-content{
        width: 95%;
    }
    .counter{
        margin: 20px;
    }
}