/* Fonts */

@font-face {
    font-family: 'Inter';
    src: url('../fonts/inter.ttf') format('truetype');
}

/* Global */

body {
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    position: relative;
}

ul {
    list-style: none;
    margin: 0;
    /* padding: 0; */
}

a {
    text-decoration: none;
}

.wid-2 {
    width: 50%;
}

.wid-3 {
    width: 33%;
}

.wid-23 {
    width: 67%;
}

.wid-5 {
    width: 20%;
}

.z-1 {
    z-index: 1;
}

.z-2 {
    z-index: 2;
}

.z-3 {
    z-index: 3;
}

.list-style-disc {
    list-style: disc;
}

.list-style-disc li::marker {
    font-size: calc(var(--dimension-ratio) *20px);
}

.c-white {
    color: #fff;
}

.c-black {
    color: #000;
}

.c-black {
    color: #000;
}

.c-gray {
    color: #414141;
}

.c-light-gray {
    color: #5e5e5e;
}

.c-light-gray2 {
    color: #818287;
}

.c-light-dark-blue{
    color: #2A487F;
}

.c-light-gray-blue{
    color: #174CAB;
}
.c-green {
    color: #219b3b;
}

.c-blue {
    color: #144295;
}

.c-sky-blue {
    color: #0C99FF;
}

.c-dark-blue {
    color: #091143;
}

.c-gray-blue {
    color: #2B3C5A;
}

.c-light-blue {
    color: #3070E3;
}

.c-light-blue2 {
    color: #2d5aa5;
}

.c-muted-blue {
    color: #3A4D6F;
}

.c-periwinkle {
    color: #979BF2;
}

.c-red {
    color: #F91E22;
}

.c-light-red {
    color: #D20C0C;
}

.c-inferno-red {
    color: #F20A0A;
}

.c-orange {
    color: #FE9802;
}

.c-gray {
    color: #8A8A89;
}

.c-gray2 {
    color: #555555;
}

.c-dark-gray {
    color: #8591A8;
}

.c-slate-blue {
    color: #394D70;
}

.c-rich-blue {
    color: #0B2451;
}

.bg-red {
    background: #f94f4f;
}

.bg-light-red {
    background: #D20C0C;
}

.bg-blue {
    background: #144295;
}

.bg-blue2 {
    background: #1976D2;
}

.bg-orange {
    background: #F57C00;
}

button.bg-blue,
a.bg-blue {
    border: calc(var(--dimension-ratio) *1px) solid #144295;
}

button.bg-blue:hover,
a.bg-blue:hover {
    border: calc(var(--dimension-ratio) *1px) solid #144295;
    background-color: #fff;
    color: #144295;
}

.bg-light-blue {
    background: #424b56;
}

.bg-light-blue2 {
    background-color: #4170dc;
}

.bg-green {
    background: #219b3b;
}

.bg-dark-green {
    background: #388E3C;
}

.bg-ice-blue {
    background-color: #E4ECFB;
}

.bg-light-gray {
    background-color: #FCFCFC;
}

.border-blue {
    border: calc(var(--dimension-ratio) *1px) solid #144295;
}

button.border-blue:hover,
a.border-blue:hover {
    border-color: transparent;
    background-color: #144295;
    color: #fff;
}

.pointer {
    cursor: pointer;
}

.right-vw {
    right: 100vw;
}

.py-1rem {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.ml-negative {
    margin-left: calc(var(--dimension-ratio) *-10px);
}

.mt-6 {
    margin-top: 6rem;
}

.mt-7 {
    margin-top: 7rem;
}

.mt-8 {
    margin-top: 8rem;
}

.mt-9 {
    margin-top: 9rem;
}

.mt-10 {
    margin-top: 10rem;
}

.mt-11 {
    margin-top: 11rem;
}

.mb-2 {
    margin-bottom: 2rem;
}

.mb-3 {
    margin-bottom: 3rem;
}

.mb-4 {
    margin-bottom: 4rem;
}

.ms-6 {
    margin-left: 6rem;
}

.fs-10px {
    font-size: calc(var(--dimension-ratio) *10px);
}

.fs-12px {
    font-size: calc(var(--dimension-ratio) *12px);
}

.fs-14px {
    font-size: calc(var(--dimension-ratio) *14px);
}

.fs-16px {
    font-size: calc(var(--dimension-ratio) *16px);
}

.fs-16px-all {
    font-size: 16px;
}

.fs-18px {
    font-size: calc(var(--dimension-ratio) *18px);
}

.fs-20px {
    font-size: calc(var(--dimension-ratio) *20px);
}

.fs-20px-all {
    font-size: 20px;
}

.fs-25px {
    font-size: calc(var(--dimension-ratio) *25px);
}

.fs-22px {
    font-size: calc(var(--dimension-ratio) *22px);
}

.fs-24px {
    font-size: calc(var(--dimension-ratio) *24px);
}

.fs-26px {
    font-size: calc(var(--dimension-ratio) *26px);
}

.fs-30px {
    font-size: calc(var(--dimension-ratio) *30px);
}

.fs-32px {
    font-size: calc(var(--dimension-ratio) *32px);
}

.fs-40px {
    font-size: calc(var(--dimension-ratio) *40px);
}

.fs-50px {
    font-size: calc(var(--dimension-ratio) *50px);
}

.fs-60px {
    font-size: calc(var(--dimension-ratio) *60px);
}

.flex-1 {
    flex: 1;
}

.text-left {
    text-align: left;
}

.dir-left {
    direction: ltr;
}

.d-none {
    display: none !important;
}

@media (min-width: 1px) {
    .d-xs-none {
        display: none;
    }
}
.embed-responsive{
    /* width: calc(var(--dimension-ratio) *1050px); */
    height: calc(var(--dimension-ratio) *576px);
    position: relative;
}
.h100{
    height: 100%;
}
.disabled {
    opacity: 0.7;
    cursor: not-allowed !important;
    pointer-events: none;
    /* background-color: #c0baba !important; */
}

.container {
    max-width: 90%;
}

img {
    vertical-align: middle;
    max-width: 100%;
    height: auto;
    display: inline-block;
}

.main-btn {
    background-color: #144295;
}

.form-group {
    margin-bottom: calc(var(--dimension-ratio) *20px);
}

.edu-section-gap {
    padding: calc(var(--dimension-ratio) *40px) 0 !important;
}

.dir-ltr {
    direction: ltr;
}

.form-control:focus {
    border: calc(var(--dimension-ratio) *1px) solid #1565D8;
}

.form-control::placeholder {
    color: #8692A6;
    font-weight: 500;
    font-size: calc(var(--dimension-ratio) *12px);
}

.line-below::after {
    content: "";
    position: absolute;
    bottom: -10%;
    width: 100%;
    height: calc(var(--dimension-ratio) *1px);
    background-color: #fff;
    left: 0;
}

.filepond-container {
    border: calc(var(--dimension-ratio) *2px) dashed #D0D0D0;
    min-height: calc(var(--dimension-ratio) *150px);
    display: flex;
    justify-content: center;
    align-items: center;
}

.filepond--root {
    width: 100%;
}

/* Header */

.navbar-area {
    border-bottom: calc(var(--dimension-ratio) *1px) solid #D9D9D9;
    box-shadow: 0 4px 4px 0 #CFCFCF40;
}

/* .logo {
    width: 50%; 
    width: 250px;
} */

.header_area{
    background-color: transparent;
    transition: background-color 0.3s ease;
}

.user-dropdown {
    position: absolute;;
    min-width: calc(var(--dimension-ratio) *220px);
    border: 1px solid #AEABE2;
    background-color: #F2F6FD;
    border-radius: calc(var(--dimension-ratio) *11px);
    width: calc(var(--dimension-ratio) *220px);
    height: calc(var(--dimension-ratio) *240px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    top: calc(var(--dimension-ratio) *110px);
    transition: top 0.3s ease;
}

.language-dropdown {
    position: absolute;;
    border: 1px solid #AEABE2;
    background-color: #F2F6FD;
    border-radius: calc(var(--dimension-ratio) *11px);
    width: calc(var(--dimension-ratio) *134px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    top: calc(var(--dimension-ratio) *110px);
    transition: top 0.3s ease;
}


.user-dropdown-scrolled{
    top: calc(var(--dimension-ratio) *85px);
}
.language-dropdown-nav{
    height: calc(var(--dimension-ratio) *40px) !important;
}

.language-dropdown-nav a span{
    font-size: calc(var(--dimension-ratio) *14px) !important;
}

.drop-down-nav{
    border-bottom: 0.5px solid #C7C4C4;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
    height: calc(var(--dimension-ratio) *60px);
    padding-inline: calc(var(--dimension-ratio) *18px);
}
.drop-down-nav a{
    display: flex;
    gap: calc(var(--dimension-ratio) *10px);
    color: #3A4D6F;
    font-size:calc(var(--dimension-ratio) *16px);
}
.drop-down-nav a span{
    display: flex;
    align-items: center;
}
.last-nav{
    border-bottom:0px;
    align-items: center;
}

.user-img {
    display: inline-flex;
    width: calc(var(--dimension-ratio) *48px);
    height: calc(var(--dimension-ratio) *48px);
    background-color: #D9D9D9;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    font-size: calc(var(--dimension-ratio) *20px);
}


.user-dropdown li:not(:last-of-type) {
    border-bottom: 1px solid #C7C4C4;
    padding-bottom: calc(var(--dimension-ratio) *5px);
}

.user-dropdown li a {
    padding: 1rem;
}

.user-dropdown .logout {
    color: #BE1A1A;
    border: calc(var(--dimension-ratio) *1px) solid #E75C5C;
    border-radius: calc(var(--dimension-ratio) *15px);
    width: calc(var(--dimension-ratio) *180px);
    height: calc(var(--dimension-ratio) *32px);
    display: flex;
    justify-content: center;
    align-items: center;
}
.certification-container{
    width: calc(var(--dimension-ratio) *1488px);
    height: calc(var(--dimension-ratio) *184px);
    border: 0.5px solid #E7E7E7;
    box-shadow: 4px 4px 15px 0px #ADADAD40;
    background-color: #FFFFFF;
    border-radius: calc(var(--dimension-ratio) *24px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding-inline: calc(var(--dimension-ratio) *30px);
    gap: calc(var(--dimension-ratio) *30px);
}
.pdf-data{
    display: flex;
    gap: calc(var(--dimension-ratio) *20px);
    align-items: center;
}

.pdf-data img{
    width: calc(var(--dimension-ratio) *136px);
    height: calc(var(--dimension-ratio) *136px);
}
.pdf-desc{ 
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: calc(var(--dimension-ratio) *10px);
}

.pdf-desc h4{ 
    margin: 0;
    font-weight: 600;
    font-size: calc(var(--dimension-ratio) *32px);
    line-height: 136%;
    letter-spacing: 0%;
    vertical-align: middle;
    color: #144295;
}

.pdf-desc p{ 
    margin: 0;
    font-weight: 400;
    font-size: calc(var(--dimension-ratio) *24px);
    line-height: calc(var(--dimension-ratio) *32px);
    letter-spacing: 0%;
    color: #3A4D6F;
}



.header_area .nav-item .nav-link {
    font-weight: 600;
    font-size: calc(var(--dimension-ratio) *17px);
    position: relative;
    color: #81A8EE;
}
.language-switch{
    width: calc(var(--dimension-ratio) *134px);
    height: calc(var(--dimension-ratio) *40px);
    border-radius: calc(var(--dimension-ratio) *12px);
    border: 1px solid #D1D1D1;
    margin-inline: calc(var(--dimension-ratio) *25px);
}
.language-switch span{
    font-size: calc(var(--dimension-ratio) *14px) !important;
}

.user-name{
    font-weight: 500;
    font-size: calc(var(--dimension-ratio) *20px);
    line-height: calc(var(--dimension-ratio) *25px);
    letter-spacing: 0.17px;
    vertical-align: middle;
    color: #FFFFFF;
}
.user-name-scrolled{
    color: #173263;
}
.profile-arrow{
    color: #FFFFFF;
    transition: transform 0.6s ease,color 0.3s ease;
}
.rotated {
    transform: rotate(180deg);
}
.profile-arrow-scrolled{
    color: #173263 !important;
}

.toggle-user{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: calc(var(--dimension-ratio) *10px);
}
.flag-img{
    width:  calc(var(--dimension-ratio) * 24px);
    height:  calc(var(--dimension-ratio) * 19.5px);
    border-radius:  calc(var(--dimension-ratio) * 7px);
}
.navbar-container{
    position: fixed;
    top: 0;
    z-index: 100;
    width:100% ;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background-color 0.3s ease, height 0.3s ease,box-shadow 0.3s ease, border-bottom 0.3s ease;
}
.navbar-container nav{
    width: 95%;
}

.auth-btns{
    gap: calc(var(--dimension-ratio) * 20px);
}

.login-nav, .register-nav{
    width:  calc(var(--dimension-ratio) * 145px);
    height:  calc(var(--dimension-ratio) * 48px);
    border-radius:  calc(var(--dimension-ratio) * 8px);
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
    font-size: calc(var(--dimension-ratio) * 16px);
    line-height: calc(var(--dimension-ratio) * 19px);
    letter-spacing: 0%;
}

.login-nav{
    background-color: transparent;
    border: 1px solid #FFFFFF;
    color: #FFFFFF;
    transition: background-color 0.3s ease, border 0.3s ease , color 0.3s ease;
}

.register-nav{
    background-color: #FFFFFF;
    color: #091E43;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.login-nav-scrolled{
    background-color: transparent;
    border: 1px solid #144295;
    color: #144295;
    
}

.register-nav-scrolled{
    background-color: #144295;
    color: #FFFFFF;
}

.navbar-link{
    color: #C0C3C9;
    position: relative;
    font-size: calc(var(--dimension-ratio) * 23px);
    font-weight: 500;
    line-height: calc(var(--dimension-ratio) * 28px);
    text-align: start;
    display: inline-block;
    margin-inline-start:  calc(var(--dimension-ratio) * 60px);
    transition: color 0.3s ease;
}

.navbar-link-active{
    color: #FFFFFF !important;
    font-weight: 600 !important;
    transition: color 0.3s ease;
}

.scrolled-navbar {
    background-color: #FFFFFF !important;
    box-shadow: 4px 4px 4px 0px #00000040;
    border-bottom: 1px solid #CACACA;
}

.scrolled-link {
    color: #81A8EE !important;
}

.scrolled-link-active{
    color: #144295 !important;
}

.scrolled-link-active::after {
    background-color: #144295 !important;
}

.navbar-link-active::after {
    content: '';
    display: block;
    width: 50%;
    height:  calc(var(--dimension-ratio) * 3px);
    background-color:  white;
    position: absolute;
    bottom: calc(var(--dimension-ratio) * -10px);
    inset-inline-start: 0;
    border-radius: calc(var(--dimension-ratio) * 5px);
}

.live-course-card{
    height: calc(var(--dimension-ratio) *686px);
}
.recorded-course-card{
    height: calc(var(--dimension-ratio) *686px);
}
.course-card-img{
    width: calc(var(--dimension-ratio) *443px);
    height: calc(var(--dimension-ratio) *279px);
}
.card-button{
    height: calc(var(--dimension-ratio) *64px);
    width: 100%;
    max-width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}
.hero-section {
    width: 100%;
    height: auto;
}

.hero-score {
    top: 35%;
    left: 7%;
    width: calc(var(--dimension-ratio) *190px);
    padding: 0.5rem 1rem;
    box-shadow: 0 1px 29px 0 rgba(0, 0, 0, 0.2);
}
.overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.35); 
    pointer-events: none; 
}
.hero-score::after {
    content: "";
    position: absolute;
    bottom: -30%;
    right: 15%;
    border: calc(var(--dimension-ratio) *15px) solid transparent;
    border-top-color: #fff;
}

.hero-users {
    padding: 0.5rem 1rem;
    width: calc(var(--dimension-ratio) *190px);
    bottom: 17%;
    box-shadow: 0 1px 29px 0 rgba(0, 0, 0, 0.2);
}

.hero-books {
    padding: 0.5rem 1rem;
    width: calc(var(--dimension-ratio) *190px);
    top: 50%;
    left: 75%;
    box-shadow: 0 1px 29px 0 rgba(0, 0, 0, 0.2);
}

.hero-img-bg {
    width: calc(var(--dimension-ratio) *600px);
    height: calc(var(--dimension-ratio) *600px);
    background-color: #3070E3;
    border: calc(var(--dimension-ratio) *50px) solid #CAE2FC;
    left: 5%;
    bottom: 0;
    /*transform: translateX(-50%);*/
}

.hero-stats {
    width: calc(var(--dimension-ratio) *1036px);
    height: calc(var(--dimension-ratio) *200px);
    left: 50%;
    transform: translateX(-50%);
    border-radius: calc(var(--dimension-ratio) *18px);
    box-shadow: 0 20px 50px 0 #E2D9DC4D;
    z-index: 3;
    bottom: calc(var(--dimension-ratio) *-100px);
    display: flex;
    padding: calc(var(--dimension-ratio) *20px) 0;
    background-color: #fff;
    z-index:1;
    display: flex;
    justify-content: center;
    align-items: center;
}

.hero-header{
    font-weight: 600;
    font-size: calc(var(--dimension-ratio) *56px);
    line-height: calc(var(--dimension-ratio) *62px);
    letter-spacing: 2%;
    text-align: center;
    vertical-align: middle;
    color: #FFFFFF;
    top: 50%;
    margin: auto;
    left: 50%;
    transform: translateX(-50%);
    width: calc(var(--dimension-ratio) *1283px);
}

.hero-desc{
    font-weight: 500;
    font-size: calc(var(--dimension-ratio) *32px);
    line-height: calc(var(--dimension-ratio) *40px);
    letter-spacing: 2%;
    text-align: center;
    vertical-align: middle;
    color: #DDE0E3;
    top: 60%;
    margin: auto;
    left: 50%;
    transform: translateX(-50%);
    width: calc(var(--dimension-ratio) *1183px);
}
.instructors-sec{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: calc(var(--dimension-ratio) *170px);
    gap: calc(var(--dimension-ratio) *25px);
}
.instructors-sec h1{
    font-weight: 600;
    font-size: calc(var(--dimension-ratio) *40px);
    line-height: calc(var(--dimension-ratio) *55px);
    letter-spacing: 1px;
    text-align: center;
    color: #144295;
}
.navbar-toggler-burger {
    padding: var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);
    font-size: var(--bs-navbar-toggler-font-size);
    line-height: 1;
    color: var(--bs-navbar-color);
    background-color: transparent;
    border: var(--bs-border-width) solid var(--bs-navbar-toggler-border-color);
    border-radius: var(--bs-navbar-toggler-border-radius);
    transition: var(--bs-navbar-toggler-transition);
    display: none;
}

.side-bar{
    display: none;
}

@media screen and (max-width: 991px) {
    .side-bar{
        display: flex;
        flex-direction: column;
        height: 100vh;
        width: 30vw;
        position: fixed;
        right: 0;
        padding-top: 80px;
        background-color: #FFFFFF;
        z-index: 90;
        gap: 42px;
        top: 42px;
        overflow: hidden; 
        transform: translateX(100%); 
        transition: transform 0.3s ease;
    }
}
.live-courses, .recorded{
    display: flex;
    flex-direction: column;
    gap: calc(var(--dimension-ratio) *30px); 
}
.instructor-card{        
    height: 100%;
    padding: 1rem;
    border-radius: 0.3rem;
    border: 1px solid #D9D9D9;
    box-shadow: 4px 4px 4px 0px #1442950D;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    font-size: calc(var(--dimension-ratio) *32px);
    transition: width 0.3s ease, font-size 0.3s ease, border 0.3s ease, box-shadow 0.3s ease;
}
.instructor-card:hover {
    font-size: calc(var(--dimension-ratio) *35px);
    border: 1px solid #1976D2;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}
.instructor-card img{
    width: 65%;
    height: 41%;
    border-radius: 50%;
}
.instructor-name{
    font-weight: 500;
    font-size: 95%;
    line-height: calc(var(--dimension-ratio) * 30px);
    letter-spacing: 1px;
    vertical-align: middle;
    color: #144295;
    margin: 0;
}
.instructor-name::after{
    content: "";
    position: absolute;
    left: 0;
    bottom: -3px;
    background-color: #A5C1F2;
    width: 40%;
    height: calc(var(--dimension-ratio) * 3px);
    border-radius: 10%;
}
.instructor-address{
    font-weight: 400;
    font-size: 75%;
    line-height: calc(var(--dimension-ratio) *20px);
    letter-spacing: 1px;
    text-align: center;
    vertical-align: middle;
    color: #2A3D60;
    margin: 0;
}
.instructor-sep{
    background-color: #A5C1F2;
    width: 40%;
    height: calc(var(--dimension-ratio) *3px);
    border-radius: 10%;
}
.login-cover{
    width: calc(var(--dimension-ratio)* 708px);
    height: calc(var(--dimension-ratio)* 784px);
    filter: drop-shadow(38px 34px 16px #999999);
}
.instructor-desc{
    font-weight: 400;
    font-size: calc(var(--dimension-ratio) *28px);
    line-height: calc(var(--dimension-ratio) *40px);
    letter-spacing: 1px;
    text-align: center;
    vertical-align: middle;
    color: #21478C;
    margin: 0;
}

/* .join-us{
    width: calc(var(--dimension-ratio) *475px);
    height: calc(var(--dimension-ratio) *475px);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: calc(var(--dimension-ratio) *15px);
} */
.card-text-topic{
    height: calc(var(--dimension-ratio) *128px);
    overflow: hidden;
}
.stat:not(:last-of-type) {
    padding: 0 1rem;
    border-right: 1px solid #174CAB;
}
.stat{
    width:  33%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.stat h2, .stat p{
    margin: 0;
}

.card-container {
    background-color: #fff;
    border: 1px solid #E7E7E7;
    box-shadow: 4px 4px 15px 0 #ADADAD40;
    border-radius: calc(var(--dimension-ratio) *25px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding: calc(var(--dimension-ratio) *20px);    
}

/* Equal height within Bootstrap columns */
.row .col.d-flex > .w-100 { height: 100%; display: flex; }
.row .col.d-flex > .w-100 > .card-container { height: 100%; display: flex; flex-direction: column; }
.row .col.d-flex > .w-100 > .card-container .card-button { margin-top: auto; }
.hero-img{
    width: 100%;
    height:auto;
}

.m-0{
    margin: 0;
}

.nav-logo{
    width: 44%;
    transition: width 0.3s ease, max-width 0.3s ease, height 0.3s ease;
}

.card-container .card {
    border: 0;
}

.card-container .card-body {
    padding-right: 0;
    padding-left: 0;
}

.testimonials {
    background-color: #EDF3FD;
    padding: 4rem 0;
    /* padding: 2rem; */
}

.testimonial-card {
    box-shadow: 0 8px 38px 0 #0909091A;
}

.rating-star {
    color: #FF9345;
}

.contact-wrapper {
    background-color: #E9E9E9;
    border: 1px solid #A4A4A4;
    padding: 2rem;
}

.location-map {
    height: calc(var(--dimension-ratio) *319px);
    width: calc(var(--dimension-ratio) *611px);
    border-radius: calc(var(--dimension-ratio) *10px);
}

/* Scroll Top */

.progress-wrap {
	position: fixed;
	right: 30px;
	bottom: 30px;
	height: 50px;
	width: 50px;
	cursor: pointer;
	display: block;
	border-radius: 50px;
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);
	z-index: 10000;
	opacity: 0;
	visibility: hidden;
	transform: translateY(15px);
	-webkit-transition: all 300ms ease;
    transition: all 300ms ease;
}
.progress-wrap.active-progress {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.progress-wrap:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(102, 126, 234, 0.6);
}
.progress-wrap::after {
	position: absolute;
	content: '↑';
	text-align: center;
	line-height: 50px;
	font-size: 20px;
	font-weight: bold;
	color: white;
	left: 0;
	top: 0;
	height: 50px;
	width: 50px;
	cursor: pointer;
	display: block;
	z-index: 1;
	-webkit-transition: all 200ms linear;
    transition: all 200ms linear;
}
.progress-wrap:hover::after {
	color: #f8f9fa;
	transform: scale(1.1);
}
.progress-wrap svg path { 
	fill: none; 
}
.progress-wrap svg.progress-circle path {
	stroke: rgba(255, 255, 255, 0.3);
	stroke-width: 3;
	box-sizing: border-box;
	-webkit-transition: all 200ms linear;
    transition: all 200ms linear;
}


/* Breadcramb */

.ptb--60 {
    padding: calc(var(--dimension-ratio) *40px) 0 !important;
}

.edu-breadcrumb-area {
    background-image: url(../images/breadcrumb-bg.jpg);
    margin-top: calc(var(--dimension-ratio) *100px);
}

.liststyle {
    list-style: none;
    margin: 0;
    padding: 0;
}

.breadcrumb-style-1 .edu-breadcrumb {
    align-items: center;
}

.breadcrumb-style-1 .edu-breadcrumb i {
    vertical-align: middle;
}

.breadcrumb-style-1 .edu-breadcrumb li.breadcrumb-item {
    color: #6f6b80;
}

.breadcrumb-style-1 .edu-breadcrumb li {
    margin: 0;
}

.breadcrumb-item.active {
    color: #6c757d;
}

.edu-breadcrumb-area .shape-image.shape-image-1 {
    left: calc(var(--dimension-ratio) *-50px);
    top: calc(var(--dimension-ratio) *-30px);
}

.edu-breadcrumb-area .shape-image.shape-image-2 {
    left: 60%;
    top: calc(var(--dimension-ratio) *-10px);
}

.edu-breadcrumb-area .shape-image.shape-image-3 {
    right: calc(var(--dimension-ratio) *40px);
    top: calc(var(--dimension-ratio) *-24px);
}

.edu-breadcrumb-area .shape-image.shape-image-4 {
    bottom: calc(var(--dimension-ratio) *-39px);
    right: calc(var(--dimension-ratio) *270px);
}

.edu-breadcrumb-area .shape-image.shape-image-5 {
    bottom: calc(var(--dimension-ratio) *-28px);
    left: 35%;
}

.edu-breadcrumb-area .shape-image.shape-image-6 {
    bottom: calc(var(--dimension-ratio) *-30px);
    left: calc(var(--dimension-ratio) *-40px);
}


/* Contact Us */


/* Contact Us */

.contact-address-card-1 {
    background: #fff;
    border-radius: calc(var(--dimension-ratio) *5px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, .06);
    padding: calc(var(--dimension-ratio) *50px) calc(var(--dimension-ratio) *20px);
    text-align: center;
    transition: .4s;
    min-height: calc(var(--dimension-ratio) *250px);
}

.contact-address-card-1:hover {
    background: #f86f03;
    background: var(--color-secondary);
    -webkit-transform: translateY(calc(var(--dimension-ratio) *-15px));
    transform: translateY(calc(var(--dimension-ratio) *-15px));
}

.contact-address-card-1 .inner .icon {
    align-items: center;
    background: rgba(82, 95, 225, .1);
    border-radius: 100%;
    display: flex;
    height: calc(var(--dimension-ratio) *50px);
    justify-content: center;
    margin: 0 auto;
    transition: .4s;
    width: calc(var(--dimension-ratio) *50px);
}

.contact-address-card-1 .inner .icon i {
    color: #525fe1;
    color: var(--color-primary);
    font-size: calc(var(--dimension-ratio) *24px);
    transition: .4s;
}

.contact-address-card-1.phone .inner .icon i {
    color: #f86f03;
    color: var(--color-secondary);
}

.contact-address-card-1.email .inner .icon i {
    color: #ffa41b;
}

.contact-address-card-1 .inner .content p {
    margin-bottom: 0;
    transition: .4s;
}

.contact-address-card-1 .inner .content p a {
    color: #6f6b80;
    color: var(--color-body);
    transition: .4s;
}

.contact-address-card-1.phone .inner .icon {
    background: rgba(251, 124, 86, .1);
}

.contact-address-card-1.email .inner .icon {
    background: rgba(255, 164, 27, .1);
}

.contact-address-card-1:hover .inner .icon {
    background: #fff;
    background: var(--color-white);
}

.contact-address-card-1:hover .inner .icon i {
    color: #f86f03;
    color: var(--color-secondary);
}

.contact-address-card-1:hover .inner .content .title,
.contact-address-card-1:hover .inner .content p,
.contact-address-card-1:hover .inner .content p a {
    color: #fff;
    color: var(--color-white);
}

.rwt-dynamic-form .form-group input {
    background: #f5f5f5;
    border: 1px solid transparent;
    border-radius: calc(var(--dimension-ratio) *5px);
    box-shadow: none;
    font-size: calc(var(--dimension-ratio) *16px);
    font-weight: 500;
    height: calc(var(--dimension-ratio) *60px);
    line-height: calc(var(--dimension-ratio) *26px);
    outline: none;
    padding: 0 calc(var(--dimension-ratio) *30px);
    transition: .4s;
}

.rwt-dynamic-form .form-group textarea {
    background: #f5f5f5;
    border: 1px solid transparent;
    border-radius: calc(var(--dimension-ratio) *5px);
    box-shadow: none;
    font-size: calc(var(--dimension-ratio) *16px);
    font-weight: 500;
    line-height: calc(var(--dimension-ratio) *26px);
    min-height: calc(var(--dimension-ratio) *308px);
    outline: none;
    padding: calc(var(--dimension-ratio) *17px) calc(var(--dimension-ratio) *30px);
    transition: .4s;
}

.eduvibe-contact-us .shape-image {
    position: absolute;
    z-index: -1;
}

.eduvibe-contact-us .shape-image.shape-image-1 {
    left: calc(var(--dimension-ratio) *-40px);
    top: calc(var(--dimension-ratio) *150px);
}

.eduvibe-contact-us .shape-image.shape-image-2 {
    right: calc(var(--dimension-ratio) *-59px);
    top: calc(var(--dimension-ratio) *95px);
}

.eduvibe-contact-us .shape-image.shape-image-3 {
    bottom: calc(var(--dimension-ratio) *79px);
    right: calc(var(--dimension-ratio) *-70px);
}

.google-map.alignwide iframe {
    width: 100%;
}

/* Courses */

.courses {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Global search (front lists) */
.courses-search {
    margin-bottom: 2rem;
}
.courses-search .search-pill {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .5rem 1rem;
    border-radius: 9999px;
    background: #fff;
    border: 1px solid #D9D9D9;
    box-shadow: 0 2px 10px rgba(0,0,0,.06);
}
.courses-search .search-pill input[type="text"]{
    border: 0;
    outline: 0;
    background: transparent;
    width: 100%;
}
.courses-search .search-pill button{
    border-radius: 9999px;
    padding: .375rem 1rem;
    font-weight: 600;
}

/* Front site search pill (used in live/recorded pages) */
.dm-search{
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .5rem 1rem;
    border-radius: 9999px;
    background: #fff;
    border: 1px solid #D9D9D9;
    box-shadow: 0 2px 10px rgba(0,0,0,.06);
}
.dm-search input{
    border: 0;
    outline: 0;
    background: transparent;
    width: 100%;
}
.dm-search button{
    border-radius: 9999px;
    padding: .375rem 1rem;
    font-weight: 600;
}

.course {
    max-width: calc(var(--dimension-ratio) *405px);
}

.course_item {
    overflow: hidden;
    --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    border-radius: 0.75rem;
    margin-top: calc(var(--dimension-ratio) *32px);
    margin-bottom: calc(var(--dimension-ratio) *32px);
    --tw-bg-opacity: 1;
    background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
}

.course-files {
    color: #3333b5;
    text-decoration: underline;
}

.download-file:hover {
    background: #f94f4f;
    color: #fff;
}

.download-file{
    width: calc(var(--dimension-ratio) *260px);
    height: calc(var(--dimension-ratio) *64px);
    border-radius: calc(var(--dimension-ratio) *12px);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(var(--dimension-ratio) *24px);
    color: #FFFFFF;
    background-color: #144295;
    font-weight: 500;
    font-size: calc(var(--dimension-ratio) *28px);
    line-height: calc(var(--dimension-ratio) *24px);
    letter-spacing: 0%;
    vertical-align: middle;
}
.certifications-container{
    display: flex;
    flex-direction: column;
    gap: calc(var(--dimension-ratio) *48px);
}

/* Modal */

.book-modal {
    position: fixed; 
    z-index: 10; 
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    overflow: auto;
}

.book-modal-content {
    width:  1149px;
    height:  596px;
    padding:  40px;
    position: relative;
    top: 290px;
    left: 50%;       
    transform: translateX(-50%);
    background-color: #FFFFFF;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    border-radius: 16px;
    box-shadow: 0px 12px 37px 0px #080F3426;
    backdrop-filter: blur(28.650466918945312px);
}

.book-close-image{
    position: absolute;
    top: 35px;
    right: 35px;
    z-index: 1;
    width: 61px;
    height: 61px;
    cursor: pointer;
}
.book-modal-header{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    gap: 30px;
}

.book-success-image{
    width: 164px;
    height: 164px;
}
.book-modal-title{
    font-weight: 600;
    font-size: 28px;
    line-height: 32px;
    letter-spacing: 0%;
    vertical-align: middle;
    color: #144295;
}
.book-modal-body{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
}
.book-modal-body-title{
    font-weight: 500;
    font-size: 24px;
    line-height: 32px;
    letter-spacing: -2%;
    margin-bottom: 0;
    color: #144295;
}

.book-modal-body-content{
    font-weight: 500;
    font-size: 20px;
    line-height: 40px;
    letter-spacing: 0%;
    margin-inline-start: 50px;
    margin-bottom: 0;
    color: #3A4D6F;
}

/* Survey */

.survey-page .form_wrapper {
    box-shadow: 4px 4px 4px 0 rgb(18, 7, 82, 0.25);
    border: 0;
    border-radius: calc(var(--dimension-ratio) *20px);
}

/* Course */

.course-page {
    background-color: #FCFCFC;
}

.for-free {
    background-color: #CCFAD6;
    color: #388E3C;
    padding: 0.3rem 0.5rem;
    font-size: calc(var(--dimension-ratio) *18px);
    border-radius: calc(var(--dimension-ratio) *20px);
    height: calc(var(--dimension-ratio) *40px);    
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.c-orange{
    color: #E65100;
}

.subscribed {
    background-color: #CCDCFA;
    color: #1976D2;
    padding: 0.3rem 0.5rem;
    font-size: calc(var(--dimension-ratio) *18px);
    border-radius: calc(var(--dimension-ratio) *20px);
    display: flex;
    justify-content: space-around;
    align-items: center;
    height: calc(var(--dimension-ratio) *40px);
    width: calc(var(--dimension-ratio) *156px);
}
.subscribed img{
    height: calc(var(--dimension-ratio) *20.5px);
    width: calc(var(--dimension-ratio) *20.5px);
}
.course-badge {
    border: 1px solid #EAEAEA;
    color: #555555;
    margin-right: 1rem;
}

.course-arrow {
    background-color: #F5F5F5;
    border-radius: 50%;
    color: #9D9D9D;
    width: calc(var(--dimension-ratio) *30px);
    height: calc(var(--dimension-ratio) *30px);
    text-align: center;
    vertical-align: middle;
}

.course-page .comments .disabled {
    background-color: transparent !important;
}

.course-page .comments .page-link {
    border-radius: 50%;
    margin-left: 1rem;
    margin-right: 1rem;
    width: calc(var(--dimension-ratio) *40px);
    height: calc(var(--dimension-ratio) *40px);
    text-align: center;
    vertical-align: middle;
    border-color: #EAEAEA;
    color: #979BF2;
}

.course-page .comments .disabled .page-link {
    background-color: #c0baba;
}

.course-page .comments .active .page-link {
    background-color: #144295;
    color: #fff;
}

.comment-textarea {
    border: 1px solid #9D9D9D;
}

.comment-textarea::placeholder {
    color: #9D9D9D;
}

.pay-option{
    background-color: #F2F6FD;
    padding: 1rem;
    border-radius: 1.5rem
}

.course-page .accordion-button {
    background-color: #2862CB !important;
    color: white !important;
    font-weight: bold;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.course-page .accordion-button::after {
    content: "\ea4e";
    /* Remix Icon arrow-down */
    font-family: "remixicon";
    color: white !important;
    position: absolute;
    right: calc(var(--dimension-ratio) *15px);
    transform: rotate(0deg);
    background-image: none;
}

.course-page .accordion-button:not(.collapsed)::after {
    transform: rotate(180deg);
}

.course-page .accordion-button:focus {
    box-shadow: none;
}

.chapter-title {
    font-size: 1.1rem;
    font-weight: bold;
}

.chapter-info {
    font-size: 0.9rem;
    font-weight: normal;
    opacity: 0.8;
}

.course-page .accordion-collapse {
    background-color: #EFEFEF;
}

.lesson {    
    padding: calc(var(--dimension-ratio) *10px);
    border-bottom: 1px solid #ddd;
    display: flex;
    flex-direction: column;
    /* justify-content: space-between; */
    /* align-items: center; */
    color: #7284A3;
}

.resources-dropdown {
    position: relative;
    display: inline-block;
}

.resources-menu {
    display: none;
    position: absolute;
    right: 0;
    background: white;
    border: 1px solid #ddd;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    z-index: 10;
    width: calc(var(--dimension-ratio) *150px);
}

.resources-menu a {
    display: block;
    padding: calc(var(--dimension-ratio) *8px);
    color: black;
    text-decoration: none;
}

.resources-menu a:hover {
    background-color: #f1f1f1;
}

.resources-dropdown:hover .resources-menu,
.resources-dropdown:focus-within .resources-menu {
    display: block;
}

/* Profile */

.profile-section {
    box-shadow: 0 12px 37px 0 rgba(8, 15, 52, 0.15);
    padding: 3rem 2rem;
}

.profile-img {
    width: calc(var(--dimension-ratio) *100px);
    height: calc(var(--dimension-ratio) *100px);
    font-size: calc(var(--dimension-ratio) *40px);
}

.profile-page .iti {
    width: 100%;
}

.picture-modal {
    background-color: #FCFCFC;
    box-shadow: 0 28px 42px -7px rgba(0, 0, 0, 0.1);
    border-radius: calc(var(--dimension-ratio) *12px);
}

.profile-page .modal-header,
.profile-page .modal-footer {
    border: 0;
}

.profile-modal-close {
    border-radius: 50%;
    color: #144295;
    /* background: transparent; */
    background-color: #EFEFEF;
    border: 0;
}

.filepond--credits {
    display: none;
}

.filepond--root .profile-upload-icon {
    font-size: calc(var(--dimension-ratio) *50px);
    color: #BBBBBB;
}

.filepond--label-action {
    color: #144295;
    border-bottom: 1px solid #144295;
    text-decoration: none;
}

/* Accordion */

.accordion {
    --bs-accordion-color: #000;
    --bs-accordion-bg: #fff;
    --bs-accordion-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;
    --bs-accordion-border-color: var(--bs-border-color);
    --bs-accordion-border-width: 1px;
    --bs-accordion-border-radius: 0.375rem;
    --bs-accordion-inner-border-radius: calc(0.375rem - 1px);
    --bs-accordion-btn-padding-x: 1.25rem;
    --bs-accordion-btn-padding-y: 1rem;
    --bs-accordion-btn-color: var(--bs-body-color);
    --bs-accordion-btn-bg: var(--bs-accordion-bg);
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='var%28--bs-body-color%29'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    --bs-accordion-btn-icon-width: 1.25rem;
    --bs-accordion-btn-icon-transform: rotate(-180deg);
    --bs-accordion-btn-icon-transition: transform 0.2s ease-in-out;
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230c63e4'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    --bs-accordion-btn-focus-border-color: #86b7fe;
    --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    --bs-accordion-body-padding-x: 1.25rem;
    --bs-accordion-body-padding-y: 1rem;
    --bs-accordion-active-color: #0c63e4;
    --bs-accordion-active-bg: #e7f1ff
}

.accordion-button {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    padding: var(--bs-accordion-btn-padding-y) var(--bs-accordion-btn-padding-x);
    font-size: 1rem;
    color: var(--bs-accordion-btn-color);
    text-align: left;
    background-color: var(--bs-accordion-btn-bg);
    border: 0;
    border-radius: 0;
    overflow-anchor: none;
    transition: var(--bs-accordion-transition)
}

@media (prefers-reduced-motion:reduce) {
    .accordion-button {
        transition: none
    }
}

.accordion-button:not(.collapsed) {
    color: var(--bs-accordion-active-color);
    background-color: var(--bs-accordion-active-bg);
    box-shadow: inset 0 calc(var(--bs-accordion-border-width) * -1) 0 var(--bs-accordion-border-color)
}

.accordion-button:not(.collapsed)::after {
    background-image: var(--bs-accordion-btn-active-icon);
    transform: var(--bs-accordion-btn-icon-transform)
}

.accordion-button::after {
    flex-shrink: 0;
    width: var(--bs-accordion-btn-icon-width);
    height: var(--bs-accordion-btn-icon-width);
    margin-left: auto;
    content: "";
    background-image: var(--bs-accordion-btn-icon);
    background-repeat: no-repeat;
    background-size: var(--bs-accordion-btn-icon-width);
    transition: var(--bs-accordion-btn-icon-transition)
}

@media (prefers-reduced-motion:reduce) {
    .accordion-button::after {
        transition: none
    }
}

.accordion-button:hover {
    z-index: 2
}

.accordion-button:focus {
    z-index: 3;
    border-color: var(--bs-accordion-btn-focus-border-color);
    outline: 0;
    box-shadow: var(--bs-accordion-btn-focus-box-shadow)
}

.accordion-header {
    margin-bottom: 0
}

.accordion-item {
    color: var(--bs-accordion-color);
    background-color: var(--bs-accordion-bg);
    border: var(--bs-accordion-border-width) solid var(--bs-accordion-border-color)
}

.accordion-item:first-of-type {
    border-top-left-radius: var(--bs-accordion-border-radius);
    border-top-right-radius: var(--bs-accordion-border-radius)
}

.accordion-item:first-of-type .accordion-button {
    border-top-left-radius: var(--bs-accordion-inner-border-radius);
    border-top-right-radius: var(--bs-accordion-inner-border-radius)
}

.accordion-item:not(:first-of-type) {
    border-top: 0
}

.accordion-item:last-of-type {
    border-bottom-right-radius: var(--bs-accordion-border-radius);
    border-bottom-left-radius: var(--bs-accordion-border-radius)
}

.accordion-item:last-of-type .accordion-button.collapsed {
    border-bottom-right-radius: var(--bs-accordion-inner-border-radius);
    border-bottom-left-radius: var(--bs-accordion-inner-border-radius)
}

.accordion-item:last-of-type .accordion-collapse {
    border-bottom-right-radius: var(--bs-accordion-border-radius);
    border-bottom-left-radius: var(--bs-accordion-border-radius)
}

.accordion-body {
    padding: var(--bs-accordion-body-padding-y) var(--bs-accordion-body-padding-x)
}

.accordion-flush .accordion-collapse {
    border-width: 0
}

.accordion-flush .accordion-item {
    border-right: 0;
    border-left: 0;
    border-radius: 0
}

.accordion-flush .accordion-item:first-child {
    border-top: 0
}

.accordion-flush .accordion-item:last-child {
    border-bottom: 0
}

.accordion-flush .accordion-item .accordion-button {
    border-radius: 0
}

.accordion h6 {
    color: #fff;
}

.accordion .collapse:not(.show) {
    display: none
}

/* Login */

.login-row,
.register-row {
    border: 1px solid #EEEEEE;
    box-shadow: 4px 4px 20px 0 rgba(19, 37, 149, 0.4);
}

.login-quotes,
.register-quotes {
    color: #00DAF7;
}

.login-arrow,
.register-arrow {
    transform: rotate(30deg);
    bottom: -25%;
}

.login-page .form-control:focus,
.register-page .form-control:focus {
    box-shadow: none;
    border-color: #007bff;
}

.btn-blue {
    background-color: #007bff;
    color: white;
}

.btn-blue:hover {
    background-color: #0056b3;
}

.divider {
    display: flex;
    align-items: center;
    text-align: center;
    color: #BABABA;
}

.divider::before,
.divider::after {
    content: '';
    flex: 1;
    border-bottom: 1px solid #CCCACA;
}

.divider::before {
    margin-right: .25em;
}

.divider::after {
    margin-left: .25em;
}

.show-password {
    right: 2%;
}
/* .section-container{
    opacity: 0; 
    transform: translateY(100px); 
    transition: opacity 1s ease, transform 1s ease;
}

.section-container.visible {
    opacity: 1;
    transform: translateY(0);
} */

.social-login{
    border: 1px solid #EEEEEE;
    box-shadow: 4px 4px 10px 0 rgba(27, 13, 134, 0.4);
    color: #144295;
    height: calc(var(--dimension-ratio) *64px);
    display: flex;
    justify-content: center;
    align-items: center;
    gap: calc(var(--dimension-ratio) *20px);
    border-radius: calc(var(--dimension-ratio) *6px);
    font-weight: 500;
    font-size: calc(var(--dimension-ratio) *24px);
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
}

.social-login img{
    width: calc(var(--dimension-ratio) *32px);
    height: calc(var(--dimension-ratio) *32px);
}

.no-account {
    color: #334058;
}

/* Register */

.register-row .iti {
    width: 100%;
}

/* New Login */

.login-container {
    background-color: #fcfafb;
}

.login-container .form-section {
    background-color: #569ccd;
    border-bottom-left-radius: 1rem;
    border-bottom-right-radius: 1rem;
    padding: 1rem;
    padding-top: 15rem;
    padding-bottom: 5rem;
}

.login-container .form-container {
    margin: auto;
    width: 70%;
    border: 2px solid #fff;
    /* box-shadow: 0 0 5px 5px #000; */
}

.login-form {
    width: 50%;
    margin: auto;
}

.underline-input {
    background-color: transparent;
    border: 0;
    padding-left: 2rem;
    border-bottom: 2px solid #fff;
    width: 100%;
    display: block;
}

.underline-input::placeholder {
    color: #fff;
}

.login-container .social-container {
    flex-direction: column;
}

.login-submit {
    color: #569ccd;
    width: 100%;
}

/* 404 */

.edu-error-style {
    padding-bottom: calc(var(--dimension-ratio) *100px);
}

.eduvibe-404-page {
    background-image: url(../images/404.jpg);
}

.mb--60 {
    margin-bottom: calc(var(--dimension-ratio) *60px) !important;
}

.edu-error-style .content .title {
    margin-bottom: calc(var(--dimension-ratio) *20px);
}

.edu-error-area img {
    max-width: 100%;
}

.eduvibe-404-page .shape-image {
    position: absolute;
    z-index: -1;
}

.eduvibe-404-page .shape-image.shape-image-1 {
    top: calc(var(--dimension-ratio) *220px);
    left: calc(var(--dimension-ratio) *-21px);
}

.eduvibe-404-page .shape-image.shape-image-2 {
    top: calc(var(--dimension-ratio) *250px);
    right: calc(var(--dimension-ratio) *-27px);
}

.eduvibe-404-page .shape-image.shape-image-3 {
    top: calc(var(--dimension-ratio) *520px);
    right: calc(var(--dimension-ratio) *50px);
}

.eduvibe-404-page .shape-image.shape-image-4 {
    bottom: calc(var(--dimension-ratio) *-61px);
    right: calc(var(--dimension-ratio) *-10px);
}

.eduvibe-404-page .shape-image.shape-image-5 {
    left: calc(var(--dimension-ratio) *40px);
    bottom: calc(var(--dimension-ratio) *-63px);
}

.eduvibe-404-page .shape-image.shape-image-6 {
    bottom: calc(var(--dimension-ratio) *180px);
    left: calc(var(--dimension-ratio) *-200px);
}

/* Map */

.edu-contact-map-area {
    margin-bottom: calc(var(--dimension-ratio) *50px);
}

.map-wrapper {
    border: 4px solid #231f40;
}

/* Footer */

.footer {
    background-color: #F4F4F4;
}

.social-icon {
    width: 2.5rem;
    height: 2.5rem;
}

.facebook-icon {
    fill: #1877F2;
}

.instagram-icon {
    fill: #C13584;
}


.whatsapp-icon {
    fill: #25D366;
}

.youtube-icon {
    fill: #CD201F;
}

.hoverContent {
    position: relative;
    z-index: 2; 
}
.float-content {
    display: none; 
    border: 1px solid #ccc;
    padding: calc(var(--dimension-ratio) *10px);
    background-color: #f9f9f9;
    position: absolute; 
    z-index: 1000; 
    max-width: calc(var(--dimension-ratio) *300px);
    color: var(--secondary-color);
}

.course-nav{
    max-height: calc(var(--dimension-ratio) *576px);
    /* width: calc(var(--dimension-ratio) *411px); */
    overflow: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: calc(var(--dimension-ratio) *8px) 0px;
    border: 1px solid #A0A1A9;
    box-shadow: 4px 4px 4px rgba(42, 17, 125, 0.25);
    border-radius: calc(var(--dimension-ratio) *15px);
    flex: none;
    order: 1;
    flex-grow: 1;
    box-sizing: border-box;
}

.course-nav-item{
    width: 100%;
    height: calc(var(--dimension-ratio) *80px);
    display: flex;
    align-items: center;
    padding: calc(var(--dimension-ratio) *16px) calc(var(--dimension-ratio) *24px);
    box-sizing: border-box; 
    background-color: #F6F9FE;
    border-bottom: 0.5px solid #144295; 
    flex: none;
    order: 1;
    align-self: stretch;
    flex-grow: 0;
    gap: calc(var(--dimension-ratio) *20px);
}
/* lesson 1 : Vorem ipsum dolor sit ametuet o */
.course-nav-title{
    margin: 0;
    /* width: calc(var(--dimension-ratio) *281px); */
    height: calc(var(--dimension-ratio) *48px);
    font-style: normal;
    font-weight: 500;
    font-size: calc(var(--dimension-ratio) *20px);
    line-height: calc(var(--dimension-ratio) *24px);
    color: #144295;
    flex: none;
    order: 0;
    flex-grow: 0;
}
.course-nav-duration{
    /* width: calc(var(--dimension-ratio) *70px); */
    height: calc(var(--dimension-ratio) *15px);
    font-style: normal;
    font-weight: 400;
    font-size: calc(var(--dimension-ratio) *18px);
    line-height: calc(var(--dimension-ratio) *15px);
    color: #3A4D6F;
    flex: none;
    order: 0;
    flex-grow: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: calc(var(--dimension-ratio) *7px);
}
.video-icon{
    width: calc(var(--dimension-ratio) *19.5px);
    height: calc(var(--dimension-ratio) *19.5px);
}

.comment-img{
    width: calc(var(--dimension-ratio) *60px);
    height: calc(var(--dimension-ratio) *60px);
}

.comment-container{
    border-bottom: 1px solid  #EAEAEA;
    padding-bottom: calc(var(--dimension-ratio) *20px);
}

.comments-container{
    display: flex;
    flex-direction: column;
    gap: calc(var(--dimension-ratio) *30px);
    padding: calc(var(--dimension-ratio) *30px);
    border-radius: calc(var(--dimension-ratio) *12px);
    border-width: 1px, 1px, 0px, 1px;
    border: 1px solid #CFCFCF;
    width: calc(var(--dimension-ratio) *1114px);
    margin: auto;
}

.w100{
    width: 100%;
}
.resources{
    margin-top: calc(var(--dimension-ratio) *20px);
}
.resources-header{
    font-weight: 500;
    font-size: calc(var(--dimension-ratio) *24px);
    line-height: 150%;
    letter-spacing: 0%;
    vertical-align: middle;
    color: #144295;
}
.links{
    display: flex;
    flex-direction: column;
}
.resources-sub-header{
    font-weight: 500;
    font-size: calc(var(--dimension-ratio) *16px);
    line-height: 150%;
    letter-spacing: 0%;
    vertical-align: middle;
    color:  #3C72D2;
}
.links{
    margin-bottom: calc(var(--dimension-ratio) *20px) ;
}
.link-element{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: calc(var(--dimension-ratio) *20px);
}
.link-element img{
    width: calc(var(--dimension-ratio) *24px);
    height: calc(var(--dimension-ratio) *24px);
}
.link-element a{
    font-weight: 500;
    font-size: calc(var(--dimension-ratio) *16px);
    line-height: 150%;
    letter-spacing: 0%;
    color: #3A4D6F;
}
.files-container{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: calc(var(--dimension-ratio) *20px);
}
.file-element{
    width: calc(var(--dimension-ratio) *133px);
    height: calc(var(--dimension-ratio) *106px);
    border-radius: calc(var(--dimension-ratio) *12px);
    background-color: #F2F2F2;
    border: 0.5px solid #E5E5E5;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: calc(var(--dimension-ratio) *5px);
}
.file-element p{
    font-weight: 400;
    font-size: calc(var(--dimension-ratio) *14px);
    line-height: 150%;
    letter-spacing: 0%;
    vertical-align: middle;
    margin: 0;
}
.file-element img{
    width: calc(var(--dimension-ratio) *33.33px);
    height: calc(var(--dimension-ratio) *40px);
}

.lectures-nav{
    width: calc(var(--dimension-ratio) *990px);
    height: calc(var(--dimension-ratio) *171px);
    margin: auto;
    margin-bottom: calc(var(--dimension-ratio) *40px);
}
.lectures-nav-item{
    height: 100%;
    gap: calc(var(--dimension-ratio) *20px);
    border-radius: calc(var(--dimension-ratio) *20px);
}
.lectures-nav-side p{
    font-weight: 400;
    font-size: calc(var(--dimension-ratio) *18px);
    line-height: 150%;
    letter-spacing: 0%;
    color: #555555;
}
.lectures-nav-side {
    width: calc(var(--dimension-ratio) *348px);
    gap: calc(var(--dimension-ratio) *10px);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.lectures-nav-side h6{
    font-weight: 500;
    font-size: calc(var(--dimension-ratio) *24px);
    line-height: 150%;
    letter-spacing: 0%;
    color: #3A4D6F;
}
.card-description{
    height: calc(var(--dimension-ratio) *96px);
    width: 100%;
}
.testimonial-author-text{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}
.testimonial-author img{
    height: calc(var(--dimension-ratio) *56px);
    width: calc(var(--dimension-ratio) *56px);
}
.hero-image-con{
    overflow: hidden;
    height: calc(var(--dimension-ratio) *800px);
}
.testimonials-row{
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-wrap: wrap;
    gap: calc(var(--dimension-ratio) *30px);
}
.contact-input::placeholder{
    font-size: calc(var(--dimension-ratio) *22px)
}
.contact-text::placeholder{
    font-size: calc(var(--dimension-ratio) *22px)
}
.testimonial-card{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    box-sizing: border-box;
    padding: calc(var(--dimension-ratio) *20px);
    width: calc(var(--dimension-ratio) *475px);
    /* height: calc(var(--dimension-ratio) *378px); */
    gap: calc(var(--dimension-ratio) *20px);
    border-radius: calc(var(--dimension-ratio) *12px);
    background-color: #FFFFFF;
}
.testimonial-author{
    display: flex;
    gap: calc(var(--dimension-ratio) *15px);
}
.testimonials-text{
    font-weight: 600;
    font-size: calc(var(--dimension-ratio) *24px);
    line-height: calc(var(--dimension-ratio) *40px);
    letter-spacing: 0%;
    color: #3A4D6F;
}
.testimonial-name{
    font-weight: 400;
    font-size: calc(var(--dimension-ratio) *17.27px);
    line-height: calc(var(--dimension-ratio) *25px);
    letter-spacing: -2%;
    vertical-align: middle;
    color: #3A4D6F;
    margin: 0;
}
.testimonial-des{
    font-weight: 700;
    font-size: calc(var(--dimension-ratio) *17.27px);
    line-height: calc(var(--dimension-ratio) *25px);
    letter-spacing: -2%;
    vertical-align: middle;
    color: #0B2451;
    margin: 0;
}
.contact-container{
    width: calc(var(--dimension-ratio) *1318px);
    height: calc(var(--dimension-ratio) *615px);
    padding: calc(var(--dimension-ratio) *40px);
    background: #EDF3FD;
    border: 1px solid #A4A4A4;
    border-radius: calc(var(--dimension-ratio) *12px);
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
}
.contact-input{
    /* width: calc(var(--dimension-ratio) *579px); */
    height: calc(var(--dimension-ratio) *65px);
    border-radius: calc(var(--dimension-ratio) *8px);
    font-size: calc(var(--dimension-ratio) *22px);
    color: #969AA2;
}
.contact-text{
    /* width: calc(var(--dimension-ratio) *579px); */
    width: 100%;
    height: calc(var(--dimension-ratio) *247px);
    border-radius: calc(var(--dimension-ratio) *8px);
    font-size: calc(var(--dimension-ratio) *22px);
    color: #969AA2;
}
.contact-form{
    width: 45%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
}
.contact-form form{
    margin: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}
.contact-map{
    width: 50%;
}
.contact-button{
    width: calc(var(--dimension-ratio) *579px);
    height: calc(var(--dimension-ratio) *72px);
    border-radius: calc(var(--dimension-ratio) *15px);
    font-size: calc(var(--dimension-ratio) *32px);
    display: flex;
    justify-content: center;
    align-items: center;
}
.login-container{
    width: calc(var(--dimension-ratio) *1440px);
    height: calc(var(--dimension-ratio) *1023px);
    border-radius: calc(var(--dimension-ratio) *30px);
    box-shadow: 4px 4px 20px 0px #13259540;
    border: 1px solid #EEEEEE
}
.register-container{
    width: calc(var(--dimension-ratio) *1440px);
    height: calc(var(--dimension-ratio) *1414px);
    border-radius: calc(var(--dimension-ratio) *30px);
    box-shadow: 4px 4px 20px 0px #13259540;
    border: 1px solid #EEEEEE 
}
.corner{
    width: calc(var(--dimension-ratio) *33px);
    height: calc(var(--dimension-ratio) *33px);
    float: right;
}
.login-text{
    font-weight: 400;
    font-size: calc(var(--dimension-ratio) *20px);
    line-height: calc(var(--dimension-ratio) *38px);
    letter-spacing: 0%;
    vertical-align: middle;
    width: calc(var(--dimension-ratio) *470px);
    margin-top: calc(var(--dimension-ratio) *30px) ;
}
.building-container{
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    padding-top: calc(var(--dimension-ratio) *40px) ;
}

.login-form-container{
    box-sizing: border-box;
    /* padding: calc(var(--dimension-ratio) *100px); */
    width: calc(var(--dimension-ratio) *492px);
    justify-content: center;
    display: flex;
    flex-direction: column;
    margin: auto;
}
.forget-password{
    font-weight: 700;
    font-size: calc(var(--dimension-ratio) *16px);
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;
    color: #144295;
    display: flex;
    justify-content: flex-end;
    margin: 10px 0px 20px 0px;
}
.social-container{
    display: flex;
    width: 100%;
}
.login-btn{
    height: calc(var(--dimension-ratio) *64px);
    border-radius: calc(var(--dimension-ratio) *8px) !important;
}
.auth-input{
    height: calc(var(--dimension-ratio) *64px);
    border-radius: calc(var(--dimension-ratio) *8px);
    box-shadow: 0px 4px 10px 3px #0000001C;
}
label{
    font-weight: calc(var(--dimension-ratio) *500px) !important;
}
.checkbox-auth-group{
    font-weight: 400;
    font-size: calc(var(--dimension-ratio) *16px);
    line-height: calc(var(--dimension-ratio) *28px);
    letter-spacing: 0%;
    vertical-align: middle;
    color: #3A4D6F;
    display: flex;
    align-items: center;
    gap: calc(var(--dimension-ratio) *20px);
    margin-bottom: calc(var(--dimension-ratio) *20px);
}
.forget-success{
    width: calc(var(--dimension-ratio) *164px);
    height: calc(var(--dimension-ratio) *164px);
    margin-inline: auto;
    margin-bottom: calc(var(--dimension-ratio) *50px);
}
.continue-a{
    display: flex;
    justify-content: center;
    align-items: center;
}
.profile-icon-demo{
    width: calc(var(--dimension-ratio) *112px);
    height: calc(var(--dimension-ratio) *112px);
}
.checkbox-auth-group p{
    line-height: calc(var(--dimension-ratio) *25px);
    margin: 0;
    margin-top: calc(var(--dimension-ratio) *15px);
}
.checkbox-auth-group input{
    width: calc(var(--dimension-ratio) *24px);
    height: calc(var(--dimension-ratio) *24px);
}

.live-contact{
    width: calc(var(--dimension-ratio) *1488px);
    height: calc(var(--dimension-ratio) *394px);
    border-radius: calc(var(--dimension-ratio) *20px);
    border: 1px solid #D4D4D4;
    box-shadow: 0px 4px 4px 0px #4A48DD26;
    background-color: #FFFFFF;
    display: flex;
    overflow: hidden;
    margin: auto;
}
.live-contact-content{
    height: 100%;
    width: 60%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: calc(var(--dimension-ratio) *35px);
    justify-content: space-between;
}

/* Footer Styles */
.eduvibe-footer-one {
    background: #231f40;
    position: relative;
    overflow: hidden;
}

.footer-top {
    padding: 80px 0 0;
    position: relative;
}

.footer-logo .logo a {
    display: inline-block;
}

.footer-logo .logo a img {
    max-width: 100%;
    height: auto;
}

.explore-widget .footer-link {
    list-style: none;
    padding: 0;
    margin: 0;
}

.explore-widget .footer-link li {
    margin-bottom: 15px;
}

.explore-widget .footer-link li a {
    color: #fff;
    text-decoration: none;
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
    font-size: 16px;
}

.explore-widget .footer-link li a:hover {
    color: #525fe1;
    transform: translateX(5px);
}

.explore-widget .footer-link li a i {
    margin-right: 10px;
    font-size: 18px;
}

.widget-information .information-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.widget-information .information-list li {
    margin-bottom: 15px;
    display: flex;
    align-items: flex-start;
}

.widget-information .information-list li a {
    color: #fff;
    text-decoration: none;
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
    font-size: 16px;
}

.widget-information .information-list li a i {
    margin-right: 10px;
    font-size: 18px;
}

.widget-information .information-list li i {
    margin-right: 10px;
    font-size: 18px;
    color: #fff;
    margin-top: 2px;
}

.widget-information .information-list li p {
    margin: 0;
    color: #6f6b80;
    font-size: 16px;
    line-height: 1.6;
}

.social-container {
    display: flex;
    gap: 15px;
    margin-top: 20px;
}

.widget-information .information-list .social-icon {
    width: 40px;
    height: 40px;
    color: white;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all 0.3s ease;
    font-size: 18px;
}

.social-icon:hover {    
    transform: scale(1.1);
}

.shape-dot-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 1;
}

.shape-image {
    position: absolute;
}

.shape-image-1 {
    top: 20%;
    right: 10%;
    opacity: 0.1;
}

.shape-image-2 {
    bottom: 20%;
    left: 10%;
    opacity: 0.1;
}

.shape-image img {
    max-width: 100px;
    height: auto;
}

.copyright-area {
    background: #231f40;
    padding: 25px 0;
    position: relative;
    z-index: 2;
}

.copyright-area .inner p {
    margin: 0;
    color: #fff;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.copyright-area .inner p i {
    margin-right: 8px;
    font-size: 18px;
}

/* Responsive adjustments */
@media (max-width: 991px) {
    .footer-top {
        padding: 60px 0 0;
    }
    
    .footer-logo {
        text-align: center;
        margin-bottom: 30px;
    }
    
    .explore-widget,
    .widget-information {
        margin-bottom: 30px;
    }
}

@media (max-width: 767px) {
    .footer-top {
        padding: 40px 0 0;
    }
    
    .social-container {
        justify-content: center;
    }
}
.live-contact img{
    height: 100%;
    width: 40%;
}
.live-contact-head{
    font-weight: 600;
    font-size: calc(var(--dimension-ratio) *32px);
    line-height: 100%;
    letter-spacing: 0%;
    color: #ED2812;
    margin: 0;
}
.live-contact-body{
    font-weight: 500;
    font-size: calc(var(--dimension-ratio) *24px);
    line-height: calc(var(--dimension-ratio) *32px);
    letter-spacing: 0%;
    color: #3A4D6F;
    margin: 0;
}
.live-contact-content a{
    border-radius: calc(var(--dimension-ratio) *30px);
    height: calc(var(--dimension-ratio) *64px);
    width: calc(var(--dimension-ratio) *217px);
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
    font-size: calc(var(--dimension-ratio) *24px);
    line-height: 100%;
    letter-spacing: 0%;
}

.video_iframe{
    width: 100%;
    height: 100%;
    border-radius: calc(var(--dimension-ratio) *10px);
    background-color: #FFFFFF;
    display: block;
}

/* Ensure the sidebar nav matches iframe height */
.course-nav{
    max-height: calc(var(--dimension-ratio) *576px);
    height: calc(var(--dimension-ratio) *576px);
}

.lecture-duration{
    width:calc(var(--dimension-ratio) *30px);
    margin: 0;
    font-weight: 400;
    font-size: calc(var(--dimension-ratio) *18px);
    line-height: calc(var(--dimension-ratio) *30px);
    color: #3A4D6F;
}
/* Responsiveness */