@font-face {
    font-family: 'ClashGrotesk-Extralight';
    src: url('../fonts/ClashGrotesk-Extralight.woff2') format('woff2'),
         url('../fonts/ClashGrotesk-Extralight.woff') format('woff'),
         url('../fonts/ClashGrotesk-Extralight.ttf') format('truetype');
    font-weight: 200;
    font-display: swap;
    font-style: normal;
  }
  @font-face {
    font-family: 'ClashGrotesk-Light';
    src: url('../fonts/ClashGrotesk-Light.woff2') format('woff2'),
         url('../fonts/ClashGrotesk-Light.woff') format('woff'),
         url('../fonts/ClashGrotesk-Light.ttf') format('truetype');
    font-weight: 300;
    font-display: swap;
    font-style: normal;
  }
  @font-face {
    font-family: 'ClashGrotesk-Regular';
    src: url('../fonts/ClashGrotesk-Regular.woff2') format('woff2'),
         url('../fonts/ClashGrotesk-Regular.woff') format('woff'),
         url('../fonts/ClashGrotesk-Regular.ttf') format('truetype');
    font-weight: 400;
    font-display: swap;
    font-style: normal;
  }
  @font-face {
    font-family: 'ClashGrotesk-Medium';
    src: url('../fonts/ClashGrotesk-Medium.woff2') format('woff2'),
         url('../fonts/ClashGrotesk-Medium.woff') format('woff'),
         url('../fonts/ClashGrotesk-Medium.ttf') format('truetype');
    font-weight: 500;
    font-display: swap;
    font-style: normal;
  }
  @font-face {
    font-family: 'ClashGrotesk-Semibold';
    src: url('../fonts/ClashGrotesk-Semibold.woff2') format('woff2'),
         url('../fonts/ClashGrotesk-Semibold.woff') format('woff'),
         url('../fonts/ClashGrotesk-Semibold.ttf') format('truetype');
    font-weight: 600;
    font-display: swap;
    font-style: normal;
  }
  @font-face {
    font-family: 'ClashGrotesk-Bold';
    src: url('../fonts/ClashGrotesk-Bold.woff2') format('woff2'),
         url('../fonts/ClashGrotesk-Bold.woff') format('woff'),
         url('../fonts/ClashGrotesk-Bold.ttf') format('truetype');
    font-weight: 700;
    font-display: swap;
    font-style: normal;
  }




* {
    margin: 0px;
    padding: 0px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

html,
body {
    scroll-behavior: smooth;
    font-family: 'ClashGrotesk-Regular';

}


/* =============================
        Preloader
================================*/
#preloader {
    position: fixed;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #ffffff;
    z-index: 9999;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.preloader-bubblingG {
    text-align: center;
    width: 78px;
    height: 49px;
    margin: auto;
}
.preloader-bubblingG span {
    display: inline-block;
    vertical-align: middle;
    width: 10px;
    height: 10px;
    margin: 24px auto;
    background: #3899c6;
    border-radius: 49px;
    -o-border-radius: 49px;
    -ms-border-radius: 49px;
    -webkit-border-radius: 49px;
    -moz-border-radius: 49px;
    animation: bubblingG 1s infinite alternate;
    -o-animation: bubblingG 1s infinite alternate;
    -ms-animation: bubblingG 1s infinite alternate;
    -webkit-animation: bubblingG 1s infinite alternate;
    -moz-animation: bubblingG 1s infinite alternate;
}
.preloader-bubblingG #bubblingG_1 {
    animation-delay: 0s;
    -o-animation-delay: 0s;
    -ms-animation-delay: 0s;
    -webkit-animation-delay: 0s;
    -moz-animation-delay: 0s;
}
.preloader-bubblingG #bubblingG_2 {
    animation-delay: 0.45s;
    -o-animation-delay: 0.45s;
    -ms-animation-delay: 0.45s;
    -webkit-animation-delay: 0.45s;
    -moz-animation-delay: 0.45s;
}
.preloader-bubblingG #bubblingG_3 {
    animation-delay: 0.9s;
    -o-animation-delay: 0.9s;
    -ms-animation-delay: 0.9s;
    -webkit-animation-delay: 0.9s;
    -moz-animation-delay: 0.9s;
}

@keyframes bubblingG {
    0% {
        width: 10px;
        height: 10px;
        background-color: #3899c6;
        transform: translateY(0);
    }
    100% {
        width: 23px;
        height: 23px;
        background-color: white;
        transform: translateY(-20px);
    }
}
@-webkit-keyframes bubblingG {
    0% {
        width: 10px;
        height: 10px;
        background-color: #3899c6;
        -webkit-transform: translateY(0);
    }
    100% {
        width: 23px;
        height: 23px;
        background-color: white;
        -webkit-transform: translateY(-20px);
    }
}
.more:hover {
    cursor: pointer;
}

/* =============================
			Default Css
  ============================== */
a {
    text-decoration: none;
    outline: 0 !important;
}

a:hover {
    text-decoration: none;
}

:focus {
    outline: 0 !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

img {
    max-width: 100%;
    height: auto;
}

h1,
h2,
h3,
h4,
h5,
h6,
ul,
p {
    margin: 0px;
    padding: 0px;
}

ul {
    list-style-type: none;
}
.custom-container {
    padding: 0px 50px;
}
header {
    padding: 0px 0;
    box-shadow: 0px 10px 14px 0px #3697C51F;
    background: #FFFFFF;
}

.header-social-icons {
    display: flex;
    align-items: center;
    gap: 21px;
}
.header-social-icons img {
    width: 29px;
}
.header-social-icons a {
    position: relative;
    border: 2px solid hsla(0, 0%, 100%, 1);
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: hsla(0, 0%, 100%, 1);
transition: 0.3s ease-in-out;

}
.header-social-icons a:hover {
transform: translateY(-10px);
transition: 0.3s ease-in-out;

}
.header-social-icons a span {
    position: absolute;
    right: -11px;
    top: 2px;
    width: 18px;
    display: flex;
    height: 18px;
    border-radius: 50%;
    background-color: #4FCFE5;
    color: #fff;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font: normal normal 600 11px/0px Outfit;
}
.logo a img {
    width: 108px;
}
.stellarnav.mobile > ul > li > a.dd-toggle {
    width: 100%;
}
.stellarnav a.dd-toggle .icon-plus {
    right: -38%;
}
.stellarnav {
    z-index: 99;
}
.stellarnav li a {
    text-align: right;
    position: relative;
    font: normal normal 400 16px/22px Outfit;
    letter-spacing: 0px;
    color: #000000;
    text-transform: uppercase;
}

.stellarnav li a:hover {
color:#000 !important;
}
.stellarnav ul {
    margin: 0;
    padding: 0;
    text-align: left;
}
.stellarnav a {
    color: #000 !important;
}
.header-right {
    display: flex;
    align-items: center;
    gap: 52px;
    justify-content: flex-end;
    /* width: 100%; */
}
.stellarnav li.has-sub > a:after {
    content: '';
    margin-left: 7px;
    border-left: unset;
    border-right: unset;
    border-top: unset;
    display: inline-block;
    top: -3px;
    position: relative;
    background-image: url(../images/drpdwn.png);
    height: 6px;
    width: 9px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.stellarnav ul {
    text-align: right;
}
.stellarnav  ul  li > a {
    padding: 10px 12px 10px 12px;
    font-family: 'ClashGrotesk-Medium';
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 500;
    line-height: 43px;
    letter-spacing: 0.05em;
    text-align: left;
    color: #3697C5 !important;
    border-bottom: 2px solid transparent;
}
.stellarnav ul li.active a {
    color: #333333 !important;
    border-bottom: 2px solid #893A3F;
}
.stellarnav li li {
    display: block !important;
    width: 100% !important;
}
.stellarnav.desktop li.has-sub ul li a {
    padding: 10px;
    color: #000 !important;
    font-size: 16px;
    /* border-top: 1px solid #0000; */
    border-bottom: 1px solid #CECECE;
    text-align: left;
}
.stellarnav.desktop li.has-sub ul li:first-child a {
    border-radius: 10px 10px 0 0;

}
.stellarnav.desktop li.has-sub ul li:last-child a {
    border-radius: 10px 10px 0 0;
    border-bottom: 0;

}

.stellarnav.desktop li.has-sub ul li a:hover{
background-color: #F5F8F9 !important;
color: #529BBB !important;
}

.stellarnav.desktop li.has-sub ul li:last-child:hover a{
border-radius: 0 0 10px 10px;

}
.stellarnav.desktop li.has-sub ul {
    padding-top: 0;
    background-color: #fff;
    box-shadow: 0px 12px 25px #0000000A;
    border-radius: 10px;
}


.header-left {
    display: flex;
    align-items: center;
    gap: 20px;
}
.category {
    display: flex;
    position: relative;
    align-items: center;
}
.login-btn a {
    font-size: 18px;
    font-weight: 500;
    line-height: 43px;
    letter-spacing: 0.05em;
    text-align: center;
    font-family: 'ClashGrotesk-Medium';
    color: #3697C5;
    border: 1px solid #51BCE2;
    padding: 10px 20px;
    border-radius: 32px;
}
/* go-to */
.go-top {
    position: fixed;
    cursor: pointer;
    bottom: 100px;
    right: 20px;
    border-radius: 50%;
    background-color: #3a63c7;
    color: #000;
    z-index: 999;
    width: 40px;
    text-align: center;
    height: 40px;
    opacity: 0;
    visibility: hidden;
    font-size: 25px;
    -webkit-transition: var(--transition);
    -webkit-transition: 0.5s;
    transition: 0.5s;
    -webkit-box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
}
.go-top  img {
    transform: rotate(180deg);
}
.go-top.active {
    opacity: 1;
    visibility: visible;
    bottom: 25px;
    -webkit-animation: top-bottom 5s infinite linear;
    animation: top-bottom 5s infinite linear;
}

.go-top i {
    position: absolute;
    right: 0;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.go-top:hover {
    color: #000000;
    -webkit-transition: all 0.5s linear;
    transition: all 0.5s linear;
    background-color: #3a63c7;
    border: 1px solid #3a63c7;
}
.go-top.active svg {
    font-size: 19px;
}




/*=============== footer================= */
footer h4 {
    text-transform: uppercase;
    padding-bottom: 10px !important;
    font-family: Roboto;
    font-size: 18px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.01em;
    text-align: left;
    padding-bottom: 28px;
    color: #263238;
}
.quick-link ul li a, .quick-return ul li a {
    font-size: 16px;
    font-weight: 400;
    line-height: 35px;
    letter-spacing: -0.01em;
    text-align: left;
    font-family: 'ClashGrotesk-Medium';
    color: #666666;
}

.card-ft {
    display: flex;
    align-items: center;
    gap: 10px;
}

.quick-access ul li a, .quick-access ul li {
    display: flex;
    gap: 14px;
    align-items: center;
    padding-bottom: 12px;
    word-break: break-all;
    font: normal normal normal 15px/19px Outfit;
    letter-spacing: 0px;
    color: #DFDCDD;
}
.footer-logo img {
    width: 275px;
}

footer {
    padding: 71px 0 0 0;
    background: rgba(250, 250, 250, 1);
}
.footer-logo a {
    font: normal normal normal 32px/28px DM Serif Display;
    letter-spacing: 1.6px;
    color: #FFFFFF;
}
.social-all p {
    font: normal normal 300 14px/24px Outfit;
    letter-spacing: 0px;
    color: #DFDCDD;
    padding: 17px 0 24px 0;
}
.newslatter h5 {
    font: normal normal normal 20px/22px DM Serif Display;
    letter-spacing: 1.2px;
    color: #FFFFFF;
    text-transform: uppercase;
    padding: 10px 0 20px 0;
}
.newslatter input[type="email"] {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border-radius: 7px;
    font: normal normal normal 16px/24px Outfit;
    letter-spacing: 0px;
    color: #111111;
    padding: 10px 54px 10px 10px;
    border: 0;
    width: 100%;
}
.social-icons {
    display: flex;
    gap: 10px;
    margin: 26px 0;
}
.newslatter button {
    background: #F99F3E 0% 0% no-repeat padding-box;
    border-radius: 0px 7px 7px 0px;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    padding: 11px;
    border: 0;
}
.newslatter form {
    position: relative;
}
.footer-copyright {
    display: flex;
    justify-content: space-between;
}
.card-ft img {
    width: 38px;
}
.quick-link {
    padding-left: 0;
}


.socila-media ul li a {
    background-color: #fff;
    display: flex;
    border: 2px solid #fff;
    height: 37px;
    width: 37px;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    color: #F99F3E;
    transition: 0.3s ease-in-out;
    font-size: 16px;
}
.socila-media ul li a:hover {
   transform: translateY(-10px);
}
.socila-media ul {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 19px;
}


.ft-cntnt {
}
.ft-cntnt p {
    font-size: 15px;
    font-weight: 400;
    line-height: 17.58px;
    text-align: center;
    color: #263238;
    font-family: 'ClashGrotesk-Medium';
}
.ft-cntnt p a {
    color: #263238;
}
.footer-bottom {
    padding: 20px 0;
    margin-top: 77px;
    text-align: center;
    border-top: 0.25px solid #2632387A;
}
.quick-link ul li,.quick-return ul li {
    position: relative;
    padding-left: 0;
}
.quick-link ul li::after,.quick-return ul li::after {
    position:absolute;
    left: 0;
    top: 16px;
    content: "";
    width: 16px;
    height: 16px;
    background-image: url(../images/arrow.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}   


/* ===============banner============== */
/* ===========posimg========== */
.word {
    display: none;
    color: #231F20;
    text-transform: capitalize;
 /* Initially hide all words */
}
.search-text {
    position: absolute;
    left: 130px;
    color: #231F20;
    font-weight: 400;
    font-size: 22px;
    line-height: 43px;
    pointer-events: none;
}
img.rectangle-big-top {
    position: absolute;
    top: 48px;
    width: 51px;
    left: 27px;
    animation: falling 30s infinitelinear;
    animation: falling 30s infinite linear;
}
img.rectangle-small {
    position: absolute;
    left: 0;
    bottom: 35%;
    width: 40px;
}
img.rectangle-small-btm {
    position: absolute;
    right: 0;
    bottom: 10px;
    width: 56px;
    animation: falling 30s infinite linear;
}
img.rectangle-medium-mid {
    position: absolute;
    right: 56%;
    top: 30%;
    width: 37px;
    z-index: 999;
    animation: falling 30s infinite linear;
}
img.cup {
    position: absolute;
    left: 0;
    width: 86px !important;
    z-index: 9;
    top: -71px;
    animation: falling 30s infinite linear;
}
img.cap {
    position: absolute;
    right: 0;
    width: 86px !important;
    z-index: 99999999;
    top: -71px;
    animation: falling 30s infinite linear;
}
/* ===========posimg========== */

.banner {
    position: relative;
    background: #51BCE20F;
    overflow: hidden;
}
.banner-left h1 {
    font-family: 'ClashGrotesk-Semibold';
    font-size: 54px;
    line-height: 110%;
    letter-spacing: 0.02em;
    text-align: left;
    min-width: 500px;
    max-width: 592px;
}
.banner-left h6 {
    font-family: Roboto;
    font-size: 23px;
    font-weight: 600;
    line-height: 30px;
    text-align: left;
    color: hsla(221, 100%, 63%, 1);
    padding: 16px 0;
}
.banner-left p {
    font-size: 19px;
    font-weight: 600;
    line-height: 29px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #666666;
    font-family: 'ClashGrotesk-Light';
    padding: 30px 0;
}
.cmmn-btn a {
    font-family: Roboto;
    font-size: 16px;
    font-weight: 600;
    line-height: 21px;
    text-align: left;
    color: hsla(0, 0%, 100%, 1);
    background: hsla(136, 53%, 43%, 1);
    padding: 14px 27px;
    border-radius: 34px;
    margin-top: 20px;
    display: flex;
    width: fit-content;
    justify-content: center;
    align-items: center;
    text-transform: capitalize;
    border: 2px solid transparent;
}
.cmmn-btn a:hover {
    background: #fff;
    border: 2px solid hsla(136, 53%, 43%, 1);
    color: hsla(136, 53%, 43%, 1);
    transition: 0.3s ease-in-out;
}

.banner-left h1 span {
    background-image: url(../images/text-bg.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    width: 100%;
    display: inline;
    padding: 0 0px 0 0;
}
.banner-right {
    /* padding-left: 48px; */
    padding: 40px 0 0 48px;
}
.banner .owl-dots {
    position: absolute;
    top: 33%;
    right: -41px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transform: rotateZ(90deg);
}
.banner button.owl-dot.active span {
    border: 1px solid #000;
    width: 13px;
    height: 13px;
    border: 1px solid hsla(136, 53%, 43%, 1)
}
.banner button.owl-dot span {
    border: 1px solid #000;
    width:5px;
    height: 5px;
    padding: 3px;
    display: block;
    background: hsla(0, 0%, 100%, 1);
    border-radius: 50%;
    border: 1px solid hsla(0, 0%, 45%, 1);
}
.banner-right img {
    height: 439px;
    position: relative;
    object-fit: contain;
    /* position: absolute !important; */
    /* left: 50%; */
    /* transform: translate(-50%,-0%); */
    bottom: 0;
    z-index: 99;
    border-radius: 0 0 181px 216px;
    /* position: relative; */
    /* top: -13px; */
    margin-top: -52px;
}
.banner-left {
    padding: 130px 0 130px 36px;
}


.bnr-pos1 {
    position: absolute;
    left: 30px;
    top: 59px;
}
.position-div.banner-pos-img img {
    width: 203px;
}
.bnr-pos2 {
    position: absolute;
    right: 5px;
    top: 50%;
}
.bnr-pos3 {
    position: absolute;
    left: 49px;
    bottom: 27%;
}

.common-left {
    padding: 40px 0;
}
.common-pos-img {
    background: #FFFFFF;
    padding: 10px;
    border-radius: 41px;
    display: flex;
    align-items: center;
    gap: 10px;
    width: fit-content;
    box-shadow: 0px 0px 25px 0px #34A8531C;
}
.auto-text {
    position: absolute;
    left: 130px;
}



@keyframes falling {
    0% {
        opacity: 1;
        transform: translateY(0) rotate(-5deg);
    }

    20% {
        opacity: 1;
        transform: translateY(15px) translateX(-20px) rotate(20deg);
    }

    40% {
        transform: translateY(25px) translateX(20px) rotate(-5deg);
    }

    60% {
        transform: translateY(35px) translateX(-40px) rotate(55deg);
    }

    80% {
        transform: translateY(40px) translateX(45px) rotate(-5deg);
    }

    100% {
        opacity: 1;
        transform: translateY(60px) translateX(-50px) rotate(35deg);
    }
}
/* =========================about-banner==================== */


@-webkit-keyframes simple-square-to-circle {
    100% {
      -webkit-border-radius: 45% 35% 40% 45% / 39% 46% 41% 51%;
    }
  }
  
  @keyframes simple-square-to-circle {
    100% {
        -webkit-border-radius: 65% 45% 50% 55% / 49% 66% 41% 51%;


    }
  }
/* ======================================= */
.video-play-btn.ripple {
    position: relative;
}

    .play-btn ,.bnr-right-img{
        position: relative;
        text-align: center;
    }
    .bnr-right-img::before{
        /* text-align: center; */
        position: absolute;
        content: "";
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        bottom: 0;
        background: #3697C5;
        height: 371px;
        z-index: -1;
        width: 388px;
        margin: 0 auto;
        background-repeat: no-repeat;
        background-position: bottom;
        border-radius: 55% 45% 40% 65% / 39% 36% 61% 61%;
        animation: simple-square-to-circle 2s 0s linear infinite alternate, simple-scale 1s 1s linear infinite alternate;
    }
    .circle-container {
        position: absolute;
        transform: translate(-50%, -50%);
        left: 50%;
        top: 50%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        z-index: -1;
    }
    .circle {
        width: 300px;
        height: 300px;
        border: 2px solid #3697C5;
        border-radius: 50%;
        position: absolute;
        opacity: 0;
        animation: pulse 2s infinite;
    }
    
    .circle:nth-child(2) {
        width: 350px;
        height: 350px;
        animation-delay: -1s;
    }
    
    .circle:nth-child(3) {
        width: 400px;
        height: 400px;
        animation-delay: -0.5s;
    }
    
    .circle:nth-child(4) {
        width: 450px;
        height: 450px;
        animation-delay: 0s;
    }
    
    @keyframes pulse {
        0%, 100% {
            opacity: 0;
            transform: scale(1);
        }
        50% {
            opacity: 1;
            transform: scale(1.2);
        }
    }

/* ======================new-css=================== */

.margin-top {
    margin-top: 89px;
}

.play-btn.without-before::before{
    position: unset !important;
    content: unset;
}
.play-btn.without-before img {
    border-radius: unset !important;
}

.trusted-finace .play-btn.without-before img {
    border-radius: unset !important;
    width: 290px;
}
.teams-professionals {
    padding: 100px 0 33px 0;
    overflow: hidden;
}

.bg-common {
    background-image: url(../images/common-bg.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    overflow: hidden;
}
.experties {
    display: flex;
    align-items: center;
    gap: 10px;
    box-shadow: 0px 0px 25px 0px hsla(136, 53%, 43%, 0.11);
    background: hsla(0, 0%, 100%, 1);
    padding: 6px 6px;
    border-radius: 50px;
    width: fit-content;
}
.experties p {
    font-family: Roboto Condensed;
    font-size: 15px;
    font-weight: 500;
    line-height: 23.44px;
    text-align: left;
    color: hsla(200, 19%, 18%, 1);
    padding-right: 39px;
}
.experties.img-1 {
    position: absolute;
    top: 84px;
    left: -103px;
}
.experties.img-2 {
    position: absolute;
    right: -76px;
    top: 41%;
}
.experties.img-3 {
    position: absolute;
    left: -84px;
    bottom: 1%;
}
.tailor-finance {
    background: hsl(20deg 100% 99% / 48%);
    background-repeat: no-repeat;
    background-size: cover;
}

.smarter-tool {
    background-image: url(../images/blue-backgrnd.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border-radius: 25px;
    padding: 20px 40px 0 40px;
}
.smarter-tool .common-left h3 {
    color: hsla(0, 0%, 100%, 1);
}
.smarter-tool .common-left h6 {
    line-height: 28px;
    color: hsla(0, 0%, 100%, 1);
}
.smarter-tool .common-left p {
    color: hsla(0, 0%, 100%, 1);
}
.smarter-tool .cmmn-btn a {
    background: hsla(51, 100%, 50%, 1);
    color: hsla(0, 0%, 0%, 1);
}
.tool-img {
    text-align: center;
}
.tool-img img {
    width: 306px;
    margin: 0 auto;
}
.common-sec.finance-solution {
    overflow: hidden;
    padding: 100px 0 38px 0;
}

.your-security {
    position: relative;
}

.your-security .experties.img-1 {
    position: absolute;
    top: 75px;
    left: unset;
    right: -6%;
}
.your-security .experties.img-2 {
    position: absolute;
    right: -37%;
    top: 40%;
}
.your-security .experties.img-3 {
    position: absolute;
    left: unset;
    bottom: 28%;
    right: -36%;
}
.experties  img {
    width: 37px;
}




/* ============testimonial============ */
.common-top h2 {
    font-family: Roboto;
    font-size: 46px;
    font-weight: 700;
    line-height: 50px;
    text-align: center;
    color: hsla(200, 19%, 18%, 1);
    text-transform: capitalize;
}
.common-top h6 {
    font-family: Roboto;
    font-size: 19px;
    font-weight: 500;
    line-height: 1;
    text-align: center;
    color: hsla(214, 82%, 51%, 1);
    padding: 10px 0;
}
.common-top p {
    font-family: Roboto;
    font-size: 21px;
    font-weight: 400;
    line-height: 24px;
    color: hsla(214, 16%, 29%, 1);
    width: 94%;
    display: block;
    max-width: 100%;
    margin: 0 auto;
    padding: 20px 0 50px 0;
    text-align: center;
    color: hsla(0, 0%, 0%, 1);
    color: #666666;
}
.testi-top img {
    width: 55px !important;
    height: 55px;
    border-radius: 50%;
}
.testi-top {
    display: flex;
    align-items: center;
    gap: 13px;
}
.testi-card {
    padding: 20px;
    box-shadow: 0px 0px 35px 0px hsla(0, 0%, 0%, 0.05);
    background: hsla(0, 0%, 100%, 1);
    border-radius: 20px;
    position: relative;
}
.pos-img img {
    width: 50px !important;
}
.pos-img {
    position: absolute;
    right: 22px;
    top: 19px;
}
.testi-cntnt h6 {
    font-family: Roboto;
    font-size: 16px;
    font-weight: 500;
    line-height: 28px;
    text-align: left;
    color: hsla(200, 19%, 18%, 1);
}
.star-all .checked {
    color: hsla(51, 100%, 50%, 1);
}
.star-all {
    font-size: 15px;
}
.star-all  {
color: hsla(0, 0%, 80%, 1);
}
.testimonial {
    padding: 50px 0px 50px 54px;
    overflow: hidden;
}
.testi-card p {
    font-family: Inter;
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    text-align: left;
    color: hsla(200, 19%, 18%, 1);
    padding-top: 17px;
    height: auto;
}
.testimonial-carousel  .owl-stage {
    margin: 20px 10px;
}
/* ======================creditsin-community=================== */



.cmn-animate{
    display: block;
    /* animation: falling 30s infinite linear; */
}

.common-pos-img img {
    width: 34px !important;
}
.common-pos-img {
    background: #FFFFFF;
    padding: 10px;
    border-radius: 41px;
    display: flex;
    align-items: center;
    gap: 10px;
    width: fit-content;
}
header.hdr.scroll {
    width: 100%;
    display: block;
    position: fixed;
    top: 0;
    z-index: 999;
}
.scroll .logo a img {
    width: 69px;
}
.stellarnav a.dd-toggle .icon-plus:after,.stellarnav a.dd-toggle .icon-plus:before ,.stellarnav .icon-close:before,.stellarnav .icon-close:after{
    border-bottom: solid 3px #fff;
}

.stellarnav li {
    margin-right: 28px;
}
.stellarnav li:last-child {
    margin-right: 0;

}
.common-sec .common-left ul li {
    font-family: Roboto;
    font-size: 14px;
    font-weight: 400;
    line-height: 23px;
    text-align: left;
    color: hsla(214, 16%, 29%, 1);
}
.common-sec .common-left ul {
    list-style-type: decimal;
    padding-left: 20px;
}

.common-sec .common-left .dot-list {
    list-style-type: disc;
    padding-left: 20px;
}
.available-at img {
    width: 146px;
}
.testimonial h6 {
    padding-top: 18px;
}

.scroll .stellarnav  ul  li > a {
    font-size: 15px;
}
.auto-text span {
    font-weight: 500;
    font-size: 30px;
    line-height: 1;
    color: #231F20;
}
.search-here input[type="text"],.search-here input[type="email"] {
    font-size: 20px;
    font-weight: 400;
    line-height: 1;
    text-align: left;
    font-family: 'ClashGrotesk-Medium';
    border: 0;
    width: 100%;
    padding: 20px 87px 20px 20px;
    border-radius: 71px;
    color: #231F2080;
}
.search-here {
    border-radius: 47px;
    border: 0;
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
}


/* ==================== */
/* ======================== */
.right-arw {
    position: absolute;
    right: 9px;
}
.right-arw img {
    width: 55px;
    padding: 5px;
    height: 55px;
    background: #35B79E;
    border: 5px solid #C6FFF740;
    border-radius: 50%;
}

span.bold {
    color: #000;
    font-family: 'ClashGrotesk-Semibold';
}
span.green {
    color: #35B79E;
    font-family: 'ClashGrotesk-SemiBold';
}


/* ====================popular================ */
.popular-card.active {
    background: #489bd5;
}
.popular-card.active h6{
    color: #fff;
}
.popular-card.active img {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(188deg) brightness(270%) contrast(103%);
}
.popular-card img {
    width: fit-content !important;
    height: 25px;
}
.popular-card h6 {
    font-size: 19px;
    font-weight: 500;
    line-height: 29.52px;
    text-align: left;
    color: #2D8ABA;
    font-family: 'ClashGrotesk-Medium';
}
.popular-card {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 3px solid #3697C54D;
    padding: 7px 10px;
    border-radius: 40px;
    justify-content: center;
}
.owl-carousel .owl-dots.disabled, .owl-carousel .owl-nav.disabled {
    display: block;
    width: 100%;
}
.popular-carousel {
    position: relative;
}
.owl-nav.disabled {
    position: absolute;
    top: 15%;
    transform: translate(-0%, -50%);
    left: 0;
}
button.owl-prev img ,button.owl-next img {
    width: 12px;
}
button.owl-prev  {
    position: absolute;
    left: -30px;
    font-size: 47px;
    color: #893A3F;
}
button.owl-next  {
    position: absolute;
    right:-30px;
    font-size: 47px;
    color: #893A3F;
}
.most-popular {
    position: relative;
    padding: 40px 0;
} 
 .most-popular {
    position: relative;
    padding: 40px 0;
}
/* ===========================pupular-card======================= */
.popolar-card-section {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: space-between;
}
.card-top {
    display: flex;
    align-items: center;
    gap: 15px;
}
.card-top h6 {
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    color: #893A3F;
    font-family: 'ClashGrotesk-Semibold';
    border: 1.5px solid #893A3F;
    border-radius: 40px;
    padding: 3px 20px;
}
.popular-card-div h4 {
    font-weight: 500;
    font-size: 17px;
    line-height: 21px;
    font-family: 'ClashGrotesk-Medium';
    padding: 10px 0 0 0;
    margin-bottom: 10px;
}

.popular-card-div h4  {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;


    @supports (-webkit-line-clamp: 2) {
      
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: initial;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      
    }
  }
.next-batch p {
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    font-family: 'ClashGrotesk-Medium';
    display: flex;
    align-items: center;
    gap: 20px;
}
.next-batch p span {
    color: #893A3F;
    font-family: 'ClashGrotesk-Medium';
    font-size: 18px;
}
.card-duration {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
}
.card-duration-left {
    display: flex;
    align-items: center;
    gap: 10px;
}
.card-duration-left h6 {
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    font-family: 'ClashGrotesk-Medium';
    color: #FFFFFF;
    background: #2D8ABA;
    padding: 10px 10px;
    border-radius: 29px;
}
.card-duration-left h6.active {
    background: #2D8ABA;
    color: #fff;
}
.card-duration-left h6 {
    font-weight: 500;
    font-size: 13px;
    line-height: 14px;
    font-family: 'ClashGrotesk-Medium';
    background: #fff;
    padding: 6px 10px;
    border-radius: 29px;
    color: #2D8ABA;
    border: 2px solid #2D8ABA;
}
.card-duration-right a {
    font-weight: 500;
    font-size: 16px;
    line-height: 21px;
    font-family: 'ClashGrotesk-Medium';
    color: #428BC1;
    text-decoration: underline;
}
.card-bottom-left p {
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    font-family: 'ClashGrotesk-Medium';
    color: #666666;
}
.card-bottom-left h5 {
    color: #893A3F;
    font-weight: 500;
    font-size: 20px;
    line-height: 21px;
    font-family: 'ClashGrotesk-Medium';
}
.card-bottom-right a {
    font-weight: 500;
    font-size: 16px;
    line-height: 17.22px;
    font-family: 'ClashGrotesk-Medium';
    color: #1FAF38;
}
.card-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.popular-card-div {
    border: 1px solid #DBEDED;
    padding: 10px;
    border-radius: 20px;
    width: 24%;
    margin-bottom: 10px;
}
.load-more p {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
    font-weight: 400;
    font-size: 20px;
    line-height: 29.52px;
    text-align: center;
    font-family: 'ClashGrotesk-Medium';
    color: #00000054;
    text-transform: capitalize;
}
.load-more {
    text-align: center;
    padding: 30px 0 0 0;
    cursor: pointer;
}


/* ===============most-popular-teacher-============== */
.teachers-card-bottom  h6 {
    font-weight: 500;
    font-size: 23px;
    line-height: 36.9px;
    text-align: center;
    font-family: 'ClashGrotesk-Medium';
}
.start-all .fa-star {
    color: #000;
}
.start-all .fa-star.checked {
    color: rgba(242, 178, 0, 1);
}
.teachers-card-bottom p {
    font-weight: 500;
    font-size: 19px;
    line-height: 29.52px;
    text-align: center;
    font-family: 'ClashGrotesk-Medium';
    color: rgba(66, 139, 193, 1);
}
.start-all {
    text-align: center;
}
.most-popular-teacher {
    background: rgba(236, 247, 253, 1);
    padding: 50px 0;
}
.most-popular-teacher .common-top p {
    font-weight: 400;
    font-size: 19px;
    line-height: 30px;
    text-align: center;
    font-family: 'ClashGrotesk-Medium';
    color: rgba(102, 102, 102, 1);
}
.most-popular-teacher {
    background: rgba(236, 247, 253, 1);
    padding: 50px 0 80px 0;
    position: relative;
}
.teachers-card-bottom {
    box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.05);
    background: #fff;
    padding: 20px 0;
    position: relative;
    margin-bottom: 19px;
    border-radius: 0 0 10px 10px;
}
.teachers-card-img::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 227px;
    background: rgba(81, 189, 227, 1);
    /* top: 0; */
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    /* clip-path: circle(50% at 50% 6%); */
    border-radius: 240px 240px 0 0;
}

.yellow .teachers-card-img::before {
    background: #FFCA6ED9;
}
.purple .teachers-card-img::before {
    background: #6666B3;
}
.green .teachers-card-img::before {
    position: absolute;
    background: #00A990;
}
 .teachers-card-img{
    position: relative;
    margin-bottom: -49px;
}
.teachers-card-img img {
    width: 100% !important;
    height: 331px;
    margin: 0 auto;
    object-fit: contain;
}

.teacher-carousel {
    width: 87%;
    margin: 0 auto;
}

.most-popular-teacher .common-top p {
    padding-bottom: 45px;
}
.owl-carousel button  span {
    background: #00A990;
    background: #00A9904D;
    width: 10px;
    height: 10px;
    display: block;
    border-radius: 50%;
}

button.owl-dot.active span {
    background: #00A9904D;
    width: 30px;
    height: 10px;
    border-radius: 20px !important;
    background: #00A990;
    }
    .owl-dots {
        display: flex;
        align-items: center;
        gap: 5px;
        position: absolute;
        transform: translate(50%, 0);
        left: 50%;
        bottom: -30px;
    }
    .popolar-card-section-all {
        padding: 40px 0 0 0;
    }

    /* ========================exam-by-state=========== */
    .statetab-inner-content .popular-card-div {
        width: 100%;
        margin-bottom: 20px;
    }
 .exam-state-inner .nav-link {
        font-weight: 400;
        font-size: 18px;
        line-height: 25px;
        font-family: 'ClashGrotesk-Medium';
        color: #00000080 !important;
        text-align: left;
        padding: 0 20px;
        margin-bottom: 15px;
    }
 .exam-state-inner .nav-pills .nav-link.active,.exam-state-inner .nav-pills .show>.nav-link {
        background-color: unset;
        color: #000000 !important;
        position: relative;
        padding: 0 20px;
        margin-bottom: 15px;
    }
 .exam-state-inner .nav-pills .nav-link.active::before,.exam-state-inner .nav-pills .show>.nav-link::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    background: #51BDE3;
width: 2px;
height: 100%;

 }
    /* .exam-state-left {
        height: 490px;
        overflow-y: scroll;
    } */
/* ===========scroll============= */
    /* width */

    ::-webkit-scrollbar {
        width: 7px;
      }
      
      /* Track */
      ::-webkit-scrollbar-track {
        background: #f1f1f1;
      }
      
      /* Handle */
      ::-webkit-scrollbar-thumb {
        background: #2D8ABA;
    
    
      }
      
      /* Handle on hover */
      ::-webkit-scrollbar-thumb:hover {
        background: #2D8ABA;
    
      }

/* ===========scroll============= */
.exam-state .nav {
    display: block;
}

.exam-state-left .nav {
    width: 100%;
    height: 538px;
    overflow-y: scroll;
    margin: 10px 0 !important;
    /* box-shadow: 20px 0px 34px 0px #00000008; */
}

.view-all a {
    font-weight: 400;
    font-size: 20px;
    line-height: 29.52px;
    text-align: center;
    font-family: 'ClashGrotesk-Medium';
    border: 1px solid #2D8ABA;
    padding: 10px;
    border-radius: 43px;
    min-width: 200px;
    width: fit-content;
    display: block;
    margin: 0 auto;
    color: #2D8ABA;

}
.exam-state {
    padding: 50px 0;
}
/* 
.tutor-images {
    display: flex;
    align-items: center;
    width: -webkit-fill-available;
}
.tutor-images img {
    width: 218px;
}
img.tutor-2 {
    width: 353px;
} */

.tutor-images img {
    width: 100%;
}
.become-tutor {
    background: #ECF7FD;
    padding: 0 40px;
}


/* ====================custom-select============= */
.dropdown-custm-drpdwn {
    position: relative;
    display: inline-block;
}


.custm-drpdwn .dropdown-button {
    background-color: #3BAFDA; 
    border: none;
    color: white;
    padding: 10px 20px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 25px; 
    outline: none;
    display: flex;
    align-items: center;
}

.dropdown-button .icon {
    margin-right: 8px; 
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #fff;
    min-width: 300px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    border-radius: 20px;
    box-shadow: 0px 14px 34px 0px #00000026;
    max-height: 400px;
    overflow-y: scroll;
}


.dropdown-content li {
    border-bottom: 1px solid #00000026;
}

.dropdown-content li:hover {
    background-color: #f1f1f1; /* Highlight on hover */
}

.selected .icon   img{
    filter: invert(100%) sepia(3%) saturate(12%) hue-rotate(46deg) brightness(354%) contrast(105%);}
.dropdown-content-top {
    display: flex;
    align-items: center;
}

.dropdown-content-top img {
    width: 30px; /* Adjust icon size */
    height: 30px; /* Adjust icon size */
}
 .dropdown {
    position: relative;
    display: inline-block;
}
.dropdown.custm-drpdwn {
    border: 0;
    padding: 0;
}

.dropdown-content-top h6 {
    font-weight: 500;
    font-size: 17px;
    color: #333333;
    font-family: Roboto Condensed;
}
.dropdown-content-inr p {
    font-weight: 400;
    font-size: 13px;
    line-height: 20px;
    color: #666666;
    padding-top: 8px;
    font-family: 'ClashGrotesk-Medium';
}
.dropdown-content li {
    border-bottom: 1px solid #00000026;
    padding: 14px;
    cursor: pointer;
}
.dropdown-content li:last-child{
    border: 0;
}
.dropdown-content-top {
    display: flex;
    align-items: center;
    gap: 10px;
}
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {
    background-color: #f1f1f1; 
}
.dropdown-content.show {
    display: block;
}

.category-button {
    display: flex;
    align-items: center;
    background-color: #3b9ed8 !important;
    color: white;
    border: none;
    border-radius: 20px;
    padding: 10px 15px;
    transition: background-color 0.3s;
    font-weight: 400;
    font-size: 18px;
    line-height: 20px;
    letter-spacing: 1;
    text-align: center;
    font-family: 'ClashGrotesk-Medium';
    gap: 2px;
    border-radius: 35px;
    min-width: 161px;
}
.category-button:hover {
    background-color: #3292c2; 
}

.category-button .icon {
    margin-right: 8px; 
    width: 20px;
}

.category-button .arrow {
    margin-left: auto; 
}


/* ===============================become-tutor============= */
.become-tutor-left h6,.easy-download-left h6 {
    font-weight: 600;
    font-size: 46px;
    line-height: 59.04px;
    color: #333333;
    font-family: 'ClashGrotesk-Medium';
}
.become-tutor-left p,.easy-download-right p {
    font-weight: 400;
    font-size: 20px;
    line-height: 31px;
    color: #666666;
    font-family: 'ClashGrotesk-Medium';
    padding: 20px 0;
}
.view-all.green-bg a {
    background: #00A990;
    color: #fff;
    text-transform: capitalize;
    margin: 0;
    min-width: 241px;
}
.testimonial-carousel  button.owl-prev span {
    display: none;
}

.testi-para {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;

    @supports (-webkit-line-clamp: 4) {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: initial;
      display: -webkit-box;
      -webkit-line-clamp: 5;
      -webkit-box-orient: vertical;
      
    }
  }
  .download-here {
    display: flex;
    align-items: center;
    gap: 10px;
}
.download-here img {
    width: 193px;
}

/* =================download-app=============== */
.easy-download-right p {
    color: #3E4956;
}
.easy-download-right {
    padding-left: 40px;
}

.easy-download {
    padding: 50px 40px;
}


.hand {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 9;
}
.hand img {
    width: 180px;
}
.finacial-tab {
    width: 78%;
    max-width: 100%;
    padding-top: 40px;
}
.finacial-tab .tab-content {
    height: 550px;
    overflow-y: scroll;
}
.ques-1 {
    position: absolute;
    bottom: 31%;
    right: 54px;
}
.ques-2 {
    position: absolute;
    top: 15%;
    right: 0%;
}
.ques-1 img {
    width: 192px;
}
.ques-2 img {
    width: 156px;
}
.finacial-tab h5 {
    font-size: 22px;
    font-weight: 600;
    line-height: 28.13px;
    letter-spacing: 1px;
    text-align: left;
    color: hsla(200, 19%, 18%, 1);
    padding-bottom: 30px;
    font-family: 'ClashGrotesk-Medium';
}
.finacial-tab .nav-pills .nav-link {
    background: 0 0;
    border: 0;
    border-radius: .25rem;
    font-size: 15px;
    font-weight: 400;
    line-height: 21.09px;
    letter-spacing: 0.02em;
    text-align: left;
    color: hsla(214, 16%, 29%, 1);
    width: 243px;
    max-width: 100%;
    font-family: 'ClashGrotesk-Medium';
}
.finacial-tab .nav-pills .nav-link.active,.finacial-tab .nav-pills .show>.nav-link {
    background-color: unset;
    position: relative;
    color: #00A990;
}

.finacial-tab .nav-pills .nav-link.active::before,.finacial-tab  .nav-pills .show>.nav-link::before {
    position: absolute;
    content: "";
    right: -4px;
    background: hsla(136, 53%, 43%, 1);
    width: 100px;
    height: 3px;
    top: 15px;
}
.finacial-tab  button.accordion-button {
    font-size: 15px;
    font-weight: 500;
    line-height: 21.09px;
    text-align: left;
    color: hsla(200, 19%, 18%, 1);
    padding-left: 42px;
    font-family: 'ClashGrotesk-Medium';
}
.finacial-tab  .accordion-body {
    font-size: 16px;
    font-weight: 400;
    line-height: 25px;
    text-align: left;
    letter-spacing: 0px;
    color: hsla(0, 0%, 45%, 1);
    font-family: 'ClashGrotesk-Medium';
    padding-left: 30px;
}
.finacial-tab  .accordion-button:not(.collapsed) {
    color: #0c63e4;
    background-color: unset;
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.125);
    color: hsla(200, 19%, 18%, 1);
}
.finacial-tab  .accordion-button::after {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    /* margin-left: auto; */
    content: "";
    background-image: url("../images/Add.png");
    background-repeat: no-repeat;
    background-size: 1.25rem;
    transition: transform .2s ease-in-out;
    position: absolute;
    left: 0;
    top: 16px;
}
.finacial-tab  .accordion-button:not(.collapsed)::after {
    background-image: url("../images/minus.png");
    transform: rotate(-180deg);
}

.finacial-question .common-top h2 {
    text-align: left;
}
.finacial-question .common-top h6 {
    text-align: left;
}
.finacial-question .common-top p {
    width: 94%;
    margin: unset;
    text-align: left;
}
.finacial-question .common-top {
    width: 86%;
    max-width: 100%;
    margin-bottom: 30px;
}
.contact-us {
    box-shadow: 0px 0px 25px 0px hsla(0, 0%, 0%, 0.06);
    display: flex;
    align-items: center;
    gap: 20px;
    width: fit-content;
    padding: 10px 24px;
    border-radius: 35px;
    background: hsla(0, 0%, 100%, 1);
    margin-top: 24px;
    flex-wrap: wrap;
}
.contact-us a {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: Roboto;
    font-size: 16px;
    font-weight: 500;
    line-height: 24.31px;
    letter-spacing: -0.01em;
    text-align: left;
    color: hsla(200, 19%, 18%, 1);
}
.brdr-radius-none img{
    border-radius: unset !important;
}
.available-at {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
}

.question-simplified {
    padding: 50px 0;
}
.accordion-flush .accordion-item .accordion-button {
    border-radius: 0;
    padding-left: 30px;
}
.question-simplified  .common-top {
    width: 80%;
}
.question-simplified .common-top h2 {
    text-align: left;
}
.question-simplified .common-top p {
    text-align: left;
    max-width: 100%;
    margin: 0;
    color: #666666;
}


/* ============login--model============== */

/*------------*/
.common-mdl .modal-title {
    font-weight: 700;
    font-size: 20px !important;
    line-height: 26px;
    text-align: center;
    color: #333333;
    letter-spacing: 1px;
}
.intl-tel-input,
.iti{
  width: 100%;
}
.common-mdl .modal-header {
    border-bottom: 0;
}
 .modal-content.common-mdl {
    padding: 33px 61px;
    border-radius: 15px;
}
.common-mdl .modal-body p {
    font-weight: 400;
    font-size: 19px;
    line-height: 22.14px;
    text-align: center;
    color: #666666;
}
 input#mobile_code,.auto-otp input[type="text"] {
    box-shadow: 0px 0px 25px 0px #83BF4F47;
    border: 1px solid #00A990;
    padding: 10px 24px 10px 92px !important;
    letter-spacing: 4px;
    color: #666666;
    font-weight: 500 !important;
    font-size: 20px;
}
.auto-otp {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
}
.auto-otp input[type="text"] {
    width: 64px !important;
    padding: 14px 10px !important;
    border-radius: 10px !important;
    text-align: center;
}
 .iti--separate-dial-code .iti__selected-flag {
    background-color: unset !important;
    border-right: 1px solid #CCCCCC;
}
.common-mdl input[type="text"]{
    border-radius: 20px;
}
.btnTheme {
    background: #00A990 !important;
    border: 0;
    padding: 14px 23px;
    border-radius: 40px;
    font-weight: 500;
    font-size: 18px;
    line-height: 1;
    letter-spacing: 1px;
    color: #fff;
    text-transform: capitalize;
    min-width: 200px;
}
.common-button {
    text-align: center;
    margin: 40px 0 0 0;
}
.common-mdl form {
    margin-top: 30px;
}

.modal-body h4 {
    font-weight: 700;
    font-size: 19px !important;
    line-height: 1;
    text-align: center;
    color: #333333;
    letter-spacing: 1px;
}

.edit-icon {
    cursor: pointer;
    margin-left: 5px;
}
  .edit-icon {
        cursor: pointer;
        margin-left: -15px;
    }
    .edit-number input[type="text"] {
        border: none;
        transition: border 0.3s;
        padding: 7px 10px;
        margin-top: 10px;
        max-width: 116px;
    }
  input[type="text"].editable {
        border: 1px solid #007BFF; /* Change to your desired border color */
        border-radius: 4px; /* Optional: add border radius */
           background: none;
        outline: none;
    }
    .edit-number p {
        display: flex;
        align-items: center;
        width: 182px;
        justify-content: center;
        margin: 0 auto;
        gap: 10px;
    }
    .time-remaining {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        padding: 36px 0 0 0;
    }


/* ============login--model============== */





/* ================================================
================student-panel======================= */
.dashboard-profile-div {
    position: relative;
}
img.crcl-bg-image {
    width: 64px;
}
.profile-image {
    position: absolute;
    width: 47px;
    transform: translate(-50%, -50%);
    left: 50%;
    top: 50%;
}

.dashboard-content {
    display: flex;
    gap: 34px;
    width: 100%;
}
.dashborad-left {
    width: 380px;
    background: #ECF7FD;
    border-radius: 20px;
}
.dashboard-profile {
    display: flex;
    align-items: center;
    gap: 30px;
    padding: 20px 20px;
    /* margin-bottom: 25px; */
}

.dashboard-profile-img {
    position: relative;
}
img.flag-img {
    position: absolute;
    right: 0;
    bottom: 0;
}
.dashboard-profile-number h4 {
    font-weight: 700;
    font-size: 22px;
    line-height: 1;
    text-align: left;
    color: #333333;
}
.dashboard-profile-number p {
    font-weight: 400;
    font-size: 16px;
    line-height: 19.68px;
    accent-color: #666666;
    padding-top: 5px;
}

.dashborad-navigation ul li a {
    font-weight: 500;
    font-size: 19px;
    line-height: 1;
    color: #1b1b1b;
    letter-spacing: 1px;
}
.dashborad-navigation ul li {
    padding: 28px 20px 28px 40px;
    border-radius: 10px;
    position: relative;
}
.dashborad-navigation ul li.active::before {
    position: absolute;
    content: "";
    right: -16px;
    top: 50%;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 11px solid #51BDE3;
    transform: translate(-50%, -50%);
}
.dashborad-navigation ul li.active {
    background: #51BDE3;
}
.dashborad-navigation ul li.active a{
    color: #FFFFFF;
}



/* ===========dashbord-right=========== */
ul.upper-details {
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0px 0px 34px 0px #00000014;
    background: #fff;
    box-shadow: 0px 0px 34px 0px #00000014;
    padding: 5px 10px;
    border-radius: 20px;
    margin-bottom: 38px;
}
ul.upper-details li.active {
    background: #ECF7FD;
    color: #2D8ABA;    font-size: 24px;
    line-height: 1;
}

ul.upper-details li {
    background: #fff;
    padding: 18px 47px;
    border-radius: 20px;
    color: #666666;
    font-weight: 500;
    font-size: 24px;
    line-height: 1;
}

.dashboard-right {
    width: 73%;
}
.input-box {
    display: flex;
    align-items: center;
    gap: 0px;
    box-shadow: 0px 0px 25px 0px #83BF4F47;
    border-radius: 10px;
    border: 1px solid #D4D4D4;
    background: #fff;
}

.input-box input[type="text"],input[type="email"] {
    border-left: 1px solid #D4D4D4;
    border-radius: 0;
    padding: 10px 20px;
    background: unset;
}
.input-box img {
    width: 48px;
    padding: 10px;
}
.common-form label {
    font-weight: 400;
    font-size: 21px;
    line-height: 1;
    margin-bottom: 16px;
}

.common-form label span {
    color: #51BDE3;
    font-weight: 700;
}
.form-height {
    min-height: 430px;
    padding: 0 21px;
}
.view-all.green-bg.text-right {
    text-align: right;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.back-button {
    border: 2px solid #00aa91 !important;
    padding: 2px 10px;
    border-radius: 32px;
    min-width: 100px;
    color: #00aa91;
    font-weight: 900;
    font-size: 20px;
    letter-spacing: 1px;
}
button {
    border: 0 !important;
    background: unset !important;
}

.dropdown {
    border: 1px solid #51BCE2;
    padding: 10px;
    max-width: 100%;
    width: 205px;
    border-radius: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 9px 10px;
}

/* ==================my-profile-preference================= */
.out-language {
    min-width: 200px;
    position: relative;
}
.language-div {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
.out-language {
    min-width: 200px;
    border: 1px solid #00000033;
    padding: 12px;
    border-radius: 20px;
    position: relative;
    overflow: hidden;
}
.out-language h5 {
    color: #51BDE3;
    font-weight: bolder;
    font-size: 79px;
    line-height: 1;
    font-family: 'ClashGrotesk-Bold';
}
.language-div h6 {
    font-weight: 500;
    font-size: 26px;
    line-height: 1;
    color: #333333;
}
.out-language .form-check {
    position: absolute;
}

.out-language .form-check {
    position: absolute;
    right: 12px;
    top: 6px;
}
.form-check-input{
    border-radius: 50% !important;
    padding: 11px;
}

.form-check-input:checked {
    background-color: #0d6efd;
    border-color: #00A990;
    background: #00A990;
    border-radius: 50%;
    padding: 11px;
}
.out-language.active,.out-language:hover {
    border: 1px solid #00aa91;
}
img.lang-bg {
    position: absolute;
    right: 0;
    top: 0;
    /* z-index: 999; */
    /* width: 50%; */
    height: 127px;
}
.state-cstm {
    min-width: 190px;
    border: 1px solid #00000033;
    padding: 12px;
    border-radius: 20px;
    position: relative;
    height: 146px;
}
img.state-bg {
    position: absolute;
    top: 50%;
    width: 100%;
    height: 127px;
    object-fit: contain;
    transform: translate(-50%, -50%);
    left: 50%;
}
.state-cntnt {
    position: absolute;
    top: 50%;
    width: 100%;
    transform: translate(-50%, -50%);
    left: 50%;
    text-align: center;
}
.state-cntnt h6 {
    font-weight: 500;
    font-size: 24px;
    line-height: 36.9px;
    text-align: center;
    color: #333333;
    word-wrap: break-word;
    padding: 0 10px;
}
.state-cstm .form-check {
    position: absolute;
    right: 14px;
    z-index: 9;
    top: 10px;
}
.state-cstm.active, .state-cstm:hover,.department-cstm.checked {
    border: 1px solid #00aa91;
}
.state-div-flex {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
 .form-check .form-check-input[type=checkbox]{
cursor: pointer !important;
}

/* ============ */
.state-cstm {
    /* Default styles for the state-cstm */
    transition: border 0.3s ease; /* Smooth transition for the border */
}

.state-cstm.checked,.out-language.checked {
    border: 2px solid #00aa91;
}
.department-cstm {
    border: 1px solid #00aa91;
    width: 197px;
    position: relative;
    height: auto;
    border-width: 1px;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.2);
    border-image: initial;
    padding: 13px;
    border-radius: 20px;
}
.department-div {
    display: none;
}
.department-cstm h5 {
    font-weight: 500;
    font-size: 24px;
    line-height: 16px;
    color: #333333;
    padding: 11px 0;
}
.department-cstm p {
    color: #666666;
    font-weight: 500;
    font-size: 15px;
    line-height: 20px;
    letter-spacing: 0px;
}
.department-cstm  .form-check {
    position: absolute;
    right: 10px;
    top: 010px;
}
.dropdown-toggle {
    display: flex;
    align-items: center;
    gap: 5px;
    /* flex-wrap: wrap; */
}
.department-div-flex {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.department-cstm img {
    width: 26px;
}
/* ================================================
================student-panel end======================= */



/* =================classes============== */

.class-section {
    display: flex;
    align-items: flex-start;
}
.class-section-left {
    width: 30%;
    padding: 30px 0px 0 30px;
    background: #FAFAFA;
}
.class-section-right {
    width: 68%;
    padding: 40px 30px 30px 30px;
}
.search-form {
    display: flex;
    align-items: center;
    max-width: 300px;
    border: 1px solid #CCCCCC;
    border-radius: 10px;
    padding: 10px;
    gap: 10px;
    height: 46px;
    min-width: 250px;
}

.class-top-right {
    display: flex;
    align-items: center;
    gap: 30px;
}
.class-section-right-top {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
    align-items: flex-start;
}
/* ==================filter-left=========== */
.class-section-left h1 {
    color: #000000;
    font-weight: 500;
    font-size: 28px;
    line-height: 100%;
    letter-spacing: normal;
    text-align: left;
    font-family: 'ClashGrotesk-Medium';
    padding-bottom: 20px;
    padding-left: 50px;
}
    .class-section-left {
    width: 30%;
    padding: 40px 0px 0 00px;
}
.left-sticky button.accordion-button {
    font-weight: 500;
    font-size: 20px;
    line-height: 15px;
    letter-spacing: normal;
    text-transform: capitalize;
    font-family: 'ClashGrotesk-Medium';
    color: #666667 !important;
}
.left-sticky .accordion-item {
    border: 0;
    margin-bottom: 20px;
}

.left-sticky .accordion-item {
    border: 0;
    margin-bottom: 20px;
    background: unset;
}
.left-sticky .accordion-button:not(.collapsed) {
    box-shadow: unset;
    color: #00A990 !important;
}
.exam-content {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px;
}

.exam-content p {
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: normal;
    padding: 8px 10px;
    border-radius: 32px;
    background: #fff;
    border: 1px solid #666666;
}
.exam-content p.active {
    border: 1px solid #893A3F;
    background: #893A3F;
    color: #FFFFFF;
}

.accordion-button:not(.collapsed)::after ,.accordion-button::after{
    background-image: url(../images/drpdown.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto;
    max-width: 20px;
    height: 20px;
}

.accordion-item.active {
    background: #ECF7FD;
    border: 0;
}

.class-top-left h1 {
    color: rgba(51, 51, 51, 1);
    font-size: 39px;
    line-height: 1;
    letter-spacing: normal;
    font-family: 'ClashGrotesk-Semibold';
}
.class-top-left p {
    font-weight: 400;
    font-size: 20px;
    line-height: 1;
    letter-spacing: normal;
    color: rgba(102, 102, 102, 1);
    padding-top: 5px;
}
.search-form input[type="text"] {
    color: #666666;
    font-weight: 400;
    font-size: 20px;
    line-height: 1;
    letter-spacing: normal;
    border: 0;
    width: 100%;
}
.select-here select.form-select {
    border: 1px solid #CCCCCC;
    padding: 10px 39px 10px 13px;
    color: #666666;
    font-weight: 400;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: normal;
    height: 46px;
    border-radius: 10px;
    min-width: 140px;
}

.class-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0px 0px 24px 0px #0000001A;
    padding: 20px;
    border-radius: 10px;
    margin-bottom: 15px;
    position: relative;
}
.class-card-top {
    display: flex;
    align-items: center;
    gap: 20px;
}
ul.class-duration {
    display: flex;
    align-items: center;
    gap: 20px;
}
.class-duration li span {
    color: #2D8ABA;
    font-size: 16px;
    line-height: 1.2;
    letter-spacing: normal;
    border: 1px solid #2D8ABA;
    padding: 5px 10px;
    border-radius: 20px;
    font-family: 'ClashGrotesk-Medium';
    display: inline-block;
}
.class-duration li:last-child span {
    border: 0;
    text-decoration: underline;
}
.class-duration li.active span {
    color: #893A3F;
    border: 1px solid #893A3F;
}
.class-card-top img {
    max-width: 40px;
}
h6.target-batch {
    color: #333333;
    font-size: 25px;
    line-height: 27px;
    letter-spacing: normal;
    font-family: 'ClashGrotesk-Medium';
    padding: 13px 0;
}

p.next-batch {
    color: #666666;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: normal;
    font-family: 'ClashGrotesk-Medium';
}
p.next-batch span{
color: #893A3F;
}
.class-card-right {
    border-left: 1px solid #00000021;
    padding-left: 30px;
}
.class-card-right {
    border-left: 1px solid #00000021;
    padding-left: 30px;
    max-width: 316px;
}
.class-card-right p {
    color: #666666;
}
.class-card-right p {
    color: #666666;
    font-size: 18px;
    line-height: 24px;
    letter-spacing: normal;
    font-family: 'ClashGrotesk-Medium';
}   
.price {
    color: #2D8ABA;
}
.class-card-right a {
    font-size: 18px;
    line-height: 24px;
    letter-spacing: normal;
    font-family: 'ClashGrotesk-Medium';
    color: #1FAF38;
}

.class-card-left {
    width: 80%;
    max-width: 100%;
}
.sidebar-bottom {
    border-top: 1px solid #00000021;
    display: flex;
    align-items: center;
    gap: 36px;
    justify-content: flex-end;
    padding: 30px 30px 30px 30px;
}
.clear-all {
    font-weight: 400;
    font-size: 21px;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: #676067;
    text-transform: capitalize;
}
.apply {
    background: #00A990 !important;
    font-weight: 400;
    font-size: 21px;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    text-transform: capitalize;
    color: #FFFFFF;
    padding: 13px 10px;
    border-radius: 10px;
    min-width: 112px;
}
.left-sticky {
    min-height: 608px;
    padding-left: 50px;
}



/* ===================class-list==================== */
.class-banner-inner-left h1 {
    color: #333333;
    font-weight: 600;
    font-size: 39px;
    line-height: 45px;
    letter-spacing: normal;
    max-width: 746px;
    padding: 16px 0;
    font-family: 'ClashGrotesk-Semibold';
}
.class-list-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.class-banner-inner {
    display: flex;
    align-items: flex-start;
    background: #F3F9FC;
    padding: 30px 30px;
    border-radius: 10px;
    margin: 20px 0 0px 0;
}
.class-banner-inner-left {
    max-width: 70%;
    padding-right: 40px;
}
.class-banner-inner-right {
    max-width: 30%;
    border-left: 1px solid #0000001C;
    padding-left: 40px;
}
.start-date h6 {
    color: #666666;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    letter-spacing: normal;
    display: flex;
    align-items: center;
    gap: 10px;
}   
.start-date h6 span {
    color: #893A3F;
    font-weight: 600;
    font-size: 22px;
    line-height: 24px;
    letter-spacing: normal;
}
.copy img {
    max-width: 24px;
}
.class-banner-inner-right > img {
    max-width: 40px;
}
.class-banner-inner-right h5 {
    color: #000000;
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    padding-top: 10px;
}
h6.price {
    color: #666666;
    font-weight: 500;
    font-size: 22px;
    line-height: 25px;
    letter-spacing: normal;
    padding: 12px 0;
}
.class-banner-inner-right p {
    font-weight: 400;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: normal;
    color: #000000;
    padding: 10px 0 20px 0;
}
.class-banner-inner-right p span {
    color: #2D8ABA;
    font-family: 'ClashGrotesk-Semibold';
    font-size: 30px;
}

.class-bnr-btn .btnTheme {
    border-radius: 10px;
    max-width: 200px;
}
.class-banner-inner-left .deleteIcon{
    max-width: 30px;
}
.assessment-left .nav-link h6 {
    display: flex;
    align-items: center;
    gap: 20px;
    font-weight: 500;
    font-size: 21px;
    line-height: 25px;
    letter-spacing: normal;
    color: #666666;
    padding: 10px;
    border-radius: 5px;
    padding: 25px 30px;
    position: relative;
    font-family: 'ClashGrotesk-Medium';
    text-transform: capitalize;
}
.nav-link{
    padding: 0;
    margin-bottom: 20px;
}

.assessment-left .nav-link.active h6 {
    background: #DDEEF5;
}
.assessment-left .nav-link h6 img {
    max-width: 26px;
}

.assessment-left .nav-link.active h6::before {
    position: absolute;
    content: "";
    right: -16px;
    top: 50%;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 11px solid #DDEEF5;
    transform: translate(-50%, -50%);
}
.assessment-left {
    padding-top: 20px;
    background: #FFFFFF;
}
.assessment-left .nav {
    box-shadow: 0px 4px 34px 0px #00000014;
    min-height: 785px;
}
.assesment-top-common h5 {
    color: #2D8ABA;
    line-height: 28px;
    letter-spacing: normal;
    font-size: 25px;
    font-family: 'ClashGrotesk-Medium';
    padding-bottom: 10px;
}
.assesment-top-common p {
    color: #666666;
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    letter-spacing: normal;
}
.assment-card {
    border: 1px solid #51BDE38A;
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 15px;
    border-radius: 10px;
}
.assment-card img {
    max-width: 67px;
}
.assment-card p {
    color: #333333;
    font-weight: 400;
    font-size: 21px;
    line-height: 25px;
    letter-spacing: normal;
}
.assesment-top-common {
    padding-bottom: 60px;
}

.assesment-top-common .teachers-card-img {
    position: relative;
    margin-bottom: -87px;
}

.assesment-top-common .teachers-card-img img {
    height: 288px;
}

.assessment-right {
    padding-top: 40px;
}

.assesment-top-common   .teacher-carousel {
    width: 100%;
    margin: 20px auto 0 auto;
}

.assessment-left .nav-link.active h6 {
    color: #00A990;
}

/* =============class-tab-2=========== */
.subject-card h6 {
    font-weight: 400;
    font-size: 15px;
    line-height: 100%;
    letter-spacing: normal;
    color: #666666;
    border: 1px solid #666666;
    padding: 10px 4px;
    border-radius: 20px;
    text-align: center;
    min-width: 120px;
}
.subject-card.active h6 {
    background: #893A3F;
    border: 1px solid #893A3F;
    color: #fff;
}

.sub-classification-banner {
    background: #ECF7FD;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 10px;
    margin-top: 20px;
}
.chapters-download {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 0;
}
.chapters-download h6 {
    color: #2D8ABA;
    font-weight: 500;
    font-size: 26px;
    line-height: 24px;
    font-family: 'ClashGrotesk-Medium';
}
.chapters-download p {
    color: #00A990;
    font-size: 18px;
    line-height: 24px;
    letter-spacing: normal;
    font-family: 'ClashGrotesk-Medium';
    display: flex;
    align-items: center;
    gap: 10px;
    text-transform: capitalize;
}
.chapters-download p img {
    max-width: 20px;
}
.subject-classification {
    background: #ECF7FD38;
    padding: 20px;
    margin-top: 20px;
    border-radius: 10px;
}
.chapter-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0px 0px 14px 0px #0000000A;
    background: #fff;
    padding: 15px 20px;
    border-radius: 10px;
    margin-bottom: 20px;
}
.chapter-card-left h5,.chapter-card-right p {
    color: #000000;
    font-weight: 400;
    font-size: 18px;
    line-height: 23px;
    letter-spacing: normal;
    max-width: 590px;
}
.chapter-card-right p {
    max-width: unset !important;
    padding-top: 6px;
    font-family: 'ClashGrotesk-Medium';
    color: #666666;
}
.chapter-card-right {
    text-align: center;
}
.chapter-card-right img{
   max-width: 30px;
}
.owl-carousel.owl-theme.subject-carousel{
    max-width: 96%;
    margin: 0 auto;
}

.join-now .chapter-card-right p {
    max-width: unset !important;
    padding-top: 6px;
    color: #00A990;
}
.join-now
.chapter-card-right p{
    color: #00A990;

}





/*============== CSS Start 19-03-2025 =============*/
.mockExam-block{
    padding: 40px 0;
    margin: 0;
}
.mockExam-block h4{ 
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 28px;
    line-height: 1.2;
    color: #2D8ABA;
    padding: 0;
    margin: 0 0 20px;
}
.mockExam-block h5{
    font-family: 'ClashGrotesk-Regular';
    font-weight: 400;
    font-size: 24px;
    line-height: 1.2;
    color: #666666;
    padding: 0;
    margin: 0 0 30px;
}
.mockExamList{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px;
    margin: 0 0 20px;
    border-radius: 10px;
    box-shadow: 0px 0px 14px 0px #0000000A;
}

.mockExamList .text p{
    font-family: 'ClashGrotesk-Regular';
    font-weight: 400;
    font-size: 20px;
    line-height:1.2;
    letter-spacing: 1.2;
    color: #000000;
    padding: 0;
    margin: 0;
}
.mockExamList .goBtn a{
    display: flex;
    justify-content: center;
    width: 32px;
    height: 32px;
    align-items: center;
    background: #51BDE3;
    border-radius: 50%;
    color: #fff;
    /* border: 2px solid rgba(81, 189, 227, 0.25); */
    outline: 3px solid rgba(81, 189, 227, 0.25) !important;
}

.blurBlock{
    position: relative;
}

.blurBlock.disable:after {
    content: '';
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,.5);
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    backdrop-filter: blur(2px);
    z-index: 1;
}
.blurBlock .joinBlock{
    position: absolute;
    width: 100%;
    max-width: 278px;
    background: rgba(230, 248, 254, 1);
    border-radius: 20px;
    padding: 0px 30px 30px;
    z-index: 2;
    top: 50%;
    left: 0;
    right: 0;
    margin: 0 auto;
    transform: translatey(-50%);
    text-align: center;
    display: none;
}
.blurBlock .joinBlock .textBox{
    padding: 0;
    margin: 0;
}
.blurBlock .joinBlock .textBox h3{
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 16px;
    line-height: 1.2;
    letter-spacing: 1px;
    color: #000000;
    padding: 0;
    margin: 0;
}
.blurBlock .joinBlock .textBox p{
    font-family: 'ClashGrotesk-Regular';
    font-weight: 400;
    font-size: 12px;
    line-height: 1.6;
    text-align: center;
    color: #000;
    padding: 0;
    margin: 0 0 20px;
}
.blurBlock .joinBlock .textBox a{
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 16px;
    line-height: 1.2;
    letter-spacing: 1px;
    background: #2D8ABA;
    display: inline-block;
    padding: 16px 40px;
    border-radius: 27px;
    color: #fff;
    transition: all 300ms ease-in-out;
}
.blurBlock .joinBlock .textBox a:hover{
    background: #00A990;
}
.blurBlock .joinBlock .icon {
    width: 105px;
    height: 105px;
    border: 2px solid #fff;
    border-radius: 50%;
    overflow: hidden;
    padding: 19px;
    margin: -50px auto 20px;
    background: #E6F8FE;
}
.blurBlock.disable .joinBlock{
    display: block;
}
.qustion-assessment-sec{
    padding: 60px 0;
    margin: 0;
}

.qustion-assessment-sec .qustion-type-info{
    display: flex;
    justify-content: space-between;
    padding: 0 30px 40px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.25);
    margin: 0 0 20px;
}

.qustion-assessment-sec .qustion-type-info .resultDetails{
    min-width: 280px;
}
.qustion-assessment-sec .qustion-type-info .resultDetails ul{
    padding: 0;
    margin: 0;
}
.qustion-assessment-sec .qustion-type-info .resultDetails ul li{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 0 10px;
    padding: 0;
}
.qustion-assessment-sec .qustion-type-info .resultDetails ul li:last-child{
    margin-bottom: 0;
}
.qustion-assessment-sec .qustion-type-info .resultDetails ul li span{
    font-family: 'ClashGrotesk-Regular';
    font-weight: 400;
    font-size: 16px;
    line-height: 1.2;
    color: #666666;
    padding: 0;
    margin: 0;
}
.qustion-assessment-sec .qustion-type-info .resultDetails ul li strong{
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 20px;
    line-height: 1.2;
    display: inline-block;
}
.qustion-assessment-sec .qustion-type-info .resultDetails ul li strong.total{
    color: #893A3F;
}
.qustion-assessment-sec .qustion-type-info .resultDetails ul li strong.correct{
    color: #00A990;
}
.qustion-assessment-sec .qustion-type-info .resultDetails ul li strong.wrong{
    color: #FF5A5A;
}
.qustion-type-info .info{
    padding: 0;
    margin: 0;
}
.qustion-type-info .info .infoTop{
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0 0 30px;
}

.infoChipwrap{
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 0;
    padding: 0 0 0 30px;
}
.infoChipwrap li{
    font-family: 'ClashGrotesk-Regular';
    font-weight: 400;
    font-size: 18px;
    line-height: 1.2;
    letter-spacing: 1px;
    color: rgba(102, 102, 102, 1);
    padding: 8px 28px;
    border: 1px solid rgba(102, 102, 102, 1);
    border-radius: 27px;
}
.infoChipwrap li.active{
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    color:rgba(137, 58, 63, 1);
    border-color: rgba(137, 58, 63, 1);
}
.qustion-type-info .info .ttl{
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 0;
    margin: 0 0 10px;
}
.qustion-type-info .info .ttl h2{
    font-family: 'ClashGrotesk-Semibold';
    font-weight: 600;
    font-size: 48px;
    line-height: 1.2;
    color: #333333;
    padding: 0;
    margin: 0 0 0px;
}
.qustion-type-info .info .ttl span{
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 16px;
    line-height:1;
    color: #fff;
    display: inline-block;
    background: #893A3F;
    padding: 10px 28px;
    border-radius: 27px;
}

.qustion-type-info .info h5{
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 28px;
    line-height: 1.2;
    color: #2D8ABA;
    padding: 0;
    margin: 0 0 10px;
}
.qustion-type-info .info p{
    font-weight: 400;
    font-size: 20px;
    line-height: 1.2;
    color: #666666;
    padding: 0;
    margin: 0;
}


.qustion-assessment-sec .qustion-list{
    padding: 0 30px;
}

.qustion-assessment-sec .qustion-list .ttl{
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 0 0 30px;
    padding: 0;
}
.qustion-assessment-sec .qustion-list .ttl h3{
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 38px;
    line-height: 1.2;
    color: #000;
    padding: 0;
    margin: 0;
}
.qustion-assessment-sec .qustion-list .ttl span{
    display: inline-block;
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 18px;
    line-height: 1;
    background: #893A3F;
    color: #fff;
    border-radius: 27px;
    padding: 10px 30px;
    margin: 0;
}
.qustion-assessment-sec .qustion-list h6{
    font-family: 'ClashGrotesk-Regular';
    font-weight: 400;
    font-size: 24px;
    line-height: 1.2;
    color: #333333;
    padding: 0;
    margin: 0 0 20px;
}

.ansOptionWrap{
    padding: 0;
    margin: 0;
}
.ansOptionWrap .ansOption{
    
    margin: 0 0 15px;
}
.ansOptionWrap .ansOption input[type="radio"]{
    display: none;
}





.ansOptionWrap .ansOption input[type="radio"]:checked,
.ansOptionWrap .ansOption input[type="radio"]:not(:checked) {
    position: absolute;
    left: -9999px;
}
.ansOptionWrap .ansOption input[type="radio"]:checked + label,
.ansOptionWrap .ansOption input[type="radio"]:not(:checked) + label
{
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    background: #E6F8FE;
    padding: 12px 26px 12px 50px;
    border-radius: 27px;
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 18px;
    line-height: 1.2;
    color: #666666;
    transition: all 300ms ease-in-out;
}
.ansOptionWrap .ansOption input[type="radio"]:checked + label:before,
.ansOptionWrap .ansOption input[type="radio"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 20px;
    top: 12px;
    width: 20px;
    height: 20px;
    border: 1px solid #666666;
    border-radius: 100%;
    background: transparent;
}
.ansOptionWrap .ansOption input[type="radio"]:checked + label:after,
.ansOptionWrap .ansOption input[type="radio"]:not(:checked) + label:after {
    content: '';
    width: 22px;
    height: 22px;
    background: url(../images/qu-check-icon.png) no-repeat center center;
    position: absolute;
    left: 19px;
    top: 11px;
    border: 1px solid #fff;
    border-radius: 100%;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.ansOptionWrap .ansOption input[type="radio"]:checked + label{
    background: #2D8ABA;
    color: #fff;
    transition: all 300ms ease-in-out;
}


.ansOptionWrap .ansOption input[type="radio"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
.ansOptionWrap .ansOption input[type="radio"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
.quSavebtnWrap{
    display: flex;
    justify-content: flex-end;
    gap: 20px;
}
.quSavebtnWrap .btn{
    background: #00A990 !important;
    padding: 12px 40px;
    border-radius: 27px;
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 18px;
    line-height: 1.2;
    color: #fff;
    border: 1px solid #00A990 !important;
    outline: none;
    box-shadow: none;
    transition: all 300ms ease-in-out;
}
.quSavebtnWrap .btn:hover{
    background: transparent !important;
    color: #00A990;
}


.result-listBlock{
    padding:  0 0px;
    margin: 0 0 15px;
}
.result-listBlock .resultPanel{
    padding: 0 30px 15px;
    margin: 0 0 15px;
    border-bottom: 1px solid #00000040;
}
.result-listBlock .resultPanel .qBox{
    padding: 0;
    margin: 0 0 10px;
}
.result-listBlock .resultPanel .qBox p{
    font-family: 'ClashGrotesk-Regular';
    font-weight: 400;
    font-size: 24px;
    line-height: 1.4;
    color: #333333;
    padding: 0;
    margin: 0;
}
.result-listBlock .resultPanel .ansBox p{
    font-family: 'ClashGrotesk-Regular';
    font-weight: 400;
    font-size: 18px;
    line-height: 22px;
    color: #00A990;
    padding: 0;
    margin: 0;
}
.result-listBlock .resultPanel .ansBox p strong{
    font-family: 'ClashGrotesk-Medium';
    font-weight: 400;
    color: #666666;
}

.quSavebtnWrap .btn.retest{
    background: transparent !important;
    color: #2D8ABA;
    border-color: #2D8ABA !important;
}
.quSavebtnWrap .btn.retest:hover{
    background: #2D8ABA  !important;
    color: #ffff;
    border-color: #2D8ABA !important;
}
/*============== CSS End 19-03-2025 =============*/

/*============== CSS Start 21-03-2025 =============*/
.fullscreenDiv{
    background: #FAFAFA;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 30px 15px;
}
.fullscreenDiv .loginformwrap{
    width: 100%;
    max-width: 604px;
    margin: 0 auto;
}
.fullscreenDiv .loginformwrap .loginLogo{
    text-align: center;
    margin: 0 0 40px;
}
.fullscreenDiv .loginformwrap .lrformBox{
    background: #fff;
    border-radius: 20px;
    padding: 50px 98px 60px;
}
.fullscreenDiv .loginformwrap .lrformBox h3{
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 34px;
    line-height: 1.2;
    letter-spacing: 1px;
    text-align: center;
    padding: 0 0 0;
    margin: 0 0 30px;

}
.fullscreenDiv .loginformwrap .lrformBox .form-group label{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.2;
    color: #666666;
    padding: 0;
    margin: 0 0 15px;
}
.fullscreenDiv .loginformwrap .lrformBox .form-group label sup{
    color: red;
}
.fullscreenDiv .loginformwrap .lrformBox .form-group #mobile_code.form-control {
    border: 1px solid #CCCCCC;
    box-shadow: none;
    border-radius: 10px;
    font-family: "Poppins", sans-serif !important;
    font-weight: 400 !important;
    font-size: 20px;
    line-height: 1.2;
    letter-spacing: normal;
    padding-left: 100px !important;
    height: 66px;
}
.fullscreenDiv .loginformwrap .lrformBox .form-group .iti__flag-container .iti__selected-flag {
    z-index: 1;
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0 20px;
}
.fullscreenDiv .loginformwrap .lrformBox .form-group #mobile_code.form-control::placeholder {
    color: rgba(0, 0, 0, 0.20);
    opacity: 1; 
    /* Firefox */
  }
  
  .fullscreenDiv .loginformwrap .lrformBox .form-group #mobile_code.form-control::-ms-input-placeholder { 
    /* Edge 12 -18 */
    color: rgba(0, 0, 0, 0.20);
  }

.fullscreenDiv .loginformwrap .lrformBox .form-group .iti__flag-container{
    border-right: 1px solid #CCCCCC;
    z-index: 1;
}

.saveConbtn {
    text-align: center;
    padding: 30px 0 0;
}
.saveConbtn .btn{
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 18px;
    line-height: 1.2;
    letter-spacing: 1px;
    text-align: center;
    text-transform: uppercase;
    border: none;
    box-shadow: none;
    padding: 14px 60px;
    border-radius: 27px;
    color: #fff;
    background: #00A990 !important;
    border: 1px solid #00A990 !important;
    transition: all 300ms ease-in-out;
}
.saveConbtn .btn:hover{
    background: transparent !important;
    color: #00A990;
}

.regpara{
    text-align: center;
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 20px;
    line-height: 1.2;
    color: #000;
    padding: 0;
    margin: 30px 0 0;
}
.regpara a{
    color: #00A990;
    border-bottom: 2px solid #00A990;
}


.registerPage{
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0;
}
.registerPage .registerSide{
    width: 550px;
    background: #ECF7FD;
    height: 100vh;
    overflow-y: auto;
    padding: 40px 20px;
}
.registerPage .registerFormBox{
    width: calc(100% - 550px);
    background: #FAFAFA;
    padding: 30px 40px;
    height: 100vh;
    overflow-y: auto;
}
.registerFormWrap{
    background: #fff;
    border-radius: 20px;
    padding: 30px;
}
.registerFormWrap .ttl h3{
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 28px;
    line-height: 100%;
    color: #202020;
    padding: 0;
    margin: 0 0 30px;
}

.registerFormWrap  .form-group label{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.2;
    color: #666666;
    padding: 0;
    margin: 0 0 10px;
}
.registerFormWrap  .form-group .field{
    border: 1px solid #CCCCCC;
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.2;
    border-radius: 10px;
    height: 56px;
    padding: 10px;
    width: 100%;
}
.registerFormWrap  .form-group{
    margin: 0 0 20px;
}
.attachField {
    display: flex;
    padding: 0;
    margin: 0;
}
.attachField .attselec{
    border: 1px solid #CCCCCC;
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.2;
    border-radius: 10px;
    height: 56px;
    padding: 10px;
    padding-right: 20px;
}
.attachField input[type="text"].attselec{
    padding: 10px;
}
.attachField .attselec{
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: 0;
}
.registerFormWrap .form-group .attfield.field{
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.registerFormWrap {

}








.registerForm .form-group #mobile_code.form-control {
    border: 1px solid #CCCCCC;
    box-shadow: none;
    border-radius: 10px;
    font-family: "Poppins", sans-serif !important;
    font-weight: 400 !important;
    font-size: 20px;
    line-height: 1.2;
    letter-spacing: normal;
    padding-left: 100px !important;
    height: 56px;
}
.registerForm .form-group .iti__flag-container .iti__selected-flag {
    z-index: 1;
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0 20px;
}
.registerForm .form-group #mobile_code.form-control::placeholder,
.registerFormWrap  .form-group .field::placeholder,
.attachField input[type="text"].attselec::placeholder {
    color: rgba(0, 0, 0, 0.20);
    opacity: 1; 
    /* Firefox */
  }
  
  .registerForm .form-group #mobile_code.form-control::-ms-input-placeholder,
  .registerFormWrap  .form-group .field::-ms-input-placeholder,
  .attachField input[type="text"].attselec::-ms-input-placeholder { 
    /* Edge 12 -18 */
    color: rgba(0, 0, 0, 0.20);
  }

.registerForm .form-group .iti__flag-container{
    border-right: 1px solid #CCCCCC;
    z-index: 1;
}


.ganderpanel ul{
    display: flex;
    align-items: center;
    gap: 20px;
}




.genderselect input[type="radio"]:checked,
.genderselect input[type="radio"]:not(:checked) {
    position: absolute;
    left: -9999px;
    display: none;
}
.genderselect input[type="radio"]:checked + label,
.genderselect input[type="radio"]:not(:checked) + label
{
    font-weight: 400;
    font-size: 18px;
    line-height:1.2;
    padding: 16px 30px;
    margin: 0;
    border: 1px solid #CCCCCC;
    border-radius: 10px;
    color: #666666;
    display: flex;
    gap: 10px;
    align-items: center;

}
.genderselect input[type="radio"]:checked + label{
    background: #2D8ABA;
    border-color: #2D8ABA;
    color: #fff;
}

.registerSide-logo{
    padding: 0;
    margin: 0 0 30px;
    text-align: center;
}

.registerPage .registerSide ul li {
    display: flex;
    align-items: center;
    cursor: pointer;
    margin: 0 0 20px;
    background: transparent;
    border-radius: 49px;
    padding: 6px;
}

.registerPage .registerSide ul li.active{
background: #fff;
}
.registerPage .registerSide ul li:last-child{
    margin-bottom: 0;
}
.registerPage .registerSide ul li .icon {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #99cae2;
    border: 5px solid #c3e0ee;
}
.registerPage .registerSide ul li.done .icon{
    background: #00a990;
    border-color:#9eddd9;
}
.registerPage .registerSide ul li .icon img {
    max-width: 24px;
}
.registerPage .registerSide ul li .text{
    padding: 0 0 0 20px;
}
.registerPage .registerSide ul li .text p{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 22px;
    line-height: 1.2;
    padding: 0;
    margin: 0 0 2px;
}
.registerPage .registerSide ul li .text span{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.2;
    color: #666666;
    padding: 0;
    margin: 0;
}






.regradiowrap{
    display: flex;
    align-items: center;
    gap: 30px;
}
.regradiolist [type="radio"]:checked,
.regradiolist [type="radio"]:not(:checked) {
    position: absolute;
    left: -9999px;
}
.regradiolist [type="radio"]:checked + label,
.regradiolist [type="radio"]:not(:checked) + label
{
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    display: inline-block;
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.2;
    color: #000;
    margin: 0;
}
.regradiolist [type="radio"]:checked + label:before,
.regradiolist [type="radio"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 22px;
    height: 22px;
    border: 1px solid #706F6F;
    border-radius: 100%;
    background: #fff;
}
.regradiolist [type="radio"]:checked + label:before{
    border: 1px solid #2D8ABA;
}
.regradiolist [type="radio"]:checked + label:after,
.regradiolist [type="radio"]:not(:checked) + label:after {
    content: '';
    width: 12px;
    height: 12px;
    background: #2D8ABA;
    position: absolute;
    top: 5px;
    left: 5px;
    border-radius: 100%;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
    border: 1px solid #2D8ABA;
}
.regradiolist [type="radio"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
.regradiolist [type="radio"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
.resuUploadBox.fullH{
    height: 300px;
}
.resuUploadBox.helfH {
    height: 143px;
}
.resuUploadBox.helfH.fr{
    margin-bottom: 14px;
}
.resuUploadBox{
    background: #CCCCCC2E;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;

}
.resuUploadBox input[type="file"]{
    display: none;
}
.resuUploadBox label{
    text-align: center;
}
.resuUploadBox label span{
    display: block;
}
.resuUploadBox label .icon{
    max-width: 30px;
    margin: 0 auto 15px;
}
.resuUploadBox.helfH label .icon{
    max-width: 60px;
}
.resuUploadBox label .upttl{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 15px;
    line-height: 1.2;
    color: #0000009E;
    padding: 0;
    margin: 0;
}
.resuUploadBox label small{
    color: #0000009E;
}
.pryvc {
    max-width: calc(100% - 330px);
    display: flex;
    text-align: left;
    gap: 15px;
}
.pryvc label{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 15px;
    line-height: 1.2;
    color: #333333;
    padding: 0;
    margin: 0;
}
.pryvc label a{
    color: #2D8ABA;
    transition: all 300ms ease-in-out;
}
.pryvc label a:hover{
    color: #893A3F;
}

/*============== CSS End 21-03-2025 =============*/









/*============== CSS Start 24-03-2025 Dashboard =============*/
.tdashboard{
    padding: 0 0 0 260px;
    margin: 0;
    background: #fafafa;
}
.tdashboard .tsidebar{
    width: 100%;
    max-width: 260px;
    background: #fff;
    padding: 20px 20px;
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    z-index: 999;
}
.tdashboard .tsidebar .logo{
    padding: 0 0;
    margin: 0 0 30px;
}

.tdashboard .tsidebar .sidebarmenu ul li{
    position: relative;
    padding: 0;
    margin: 0 0 10px;
}
.tdashboard .tsidebar .sidebarmenu ul li:last-child{
    margin-bottom: 0;
}
.tdashboard .tsidebar .sidebarmenu ul li a{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.2;
    letter-spacing: 0.46px;
    color: #5B4A5C;
    padding: 10px 15px;
    border-radius: 27px;
    display: flex;
    transition: all 300ms ease-in-out;
    align-items: center;
    gap: 10px;
}
.tdashboard .tsidebar .sidebarmenu ul li a .icon{
    line-height: 0;
}
.tdashboard .tsidebar .sidebarmenu ul li a:hover .icon img,
.tdashboard .tsidebar .sidebarmenu ul li.active a .icon img{
    filter: brightness(0) invert(1);
}
.tdashboard .tsidebar .sidebarmenu ul li .menucount{
    background: #00A990;
    display: inline-block;
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 1.2;
    border-radius: 27px;
    color: #fff;
    padding: 4px 8px;
    margin: 0;

}
.tdashboard .tsidebar .sidebarmenu ul li.active a,
.tdashboard .tsidebar .sidebarmenu ul li a:hover{
    background: #2D8ABA;
    color: #fff;
}


.tdashboard .tmain{
    height: 100vh;
    overflow-y: auto;
    padding: 90px 20px 30px;
    position: relative;
}
.tdashboardHeader{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 20px 20px 20px 280px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    z-index: 99;
    background: #fafafa;
}
.tdashboardHeader .ttl{
    padding: 0;
    margin: 0;
}
.tdashboardHeader .ttl h3{ 
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 24px;
    line-height:1.2;
    letter-spacing: 0.46px;
    color: #1F1E1E;
    padding: 0;
    margin: 0;
}
.tdashboardHeader .rt-side{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.tdashboardHeader .rt-side .srcbox{
    width: 100%;
    min-width: 400px;
    position: relative;
    margin: 0 15px 0 0;
}
.tdashboardHeader .rt-side .srcbox .srcfield{
    background: #FFFFFF;
    padding: 6px 10px 6px 40px;
    border: none;
    box-shadow: none;
    outline: none;
    border-radius: 27px;
    width: 100%;
    height: 46px;
}
.tdashboardHeader .rt-side .srcbox span{
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
    color: #FF9F81;
}
.tdashboardHeader .rt-side .setNot{
    padding: 0 15px 0 0;
    margin: 0 15px 0 0;
    border-right: 1px solid #C7C6C2; 
}
.tdashboardHeader .rt-side .setNot ul {
    display: flex;
    gap: 10px;
    padding: 0;
    margin: 0;
}
.tdashboardHeader .rt-side .setNot ul li a{
    width: 40px;
    height: 40px;
    border-radius: 27px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: #2D8ABA;
}
.tdashboardHeader .rt-side .setNot ul li a .count{
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #FF4545;
    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-size: 10px;
    line-height: 17.5px;
    letter-spacing: 0.46%;
    text-align: center;
    color: #fff;
    position: absolute;
    top: 0;
    right: 0;
}
.tdashboardHeader .rt-side .hduser{
    display: flex;
    align-items: center;
    min-width: 200px;
}
.tdashboardHeader .rt-side .hduser .icon{
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
    padding: 0;
    margin: 0;
    box-shadow: 0px 2px 6px 2px #00000026;
    box-shadow: 0px 1px 2px 0px #0000004D;
}
.tdashboardHeader .rt-side .hduser .icon img{
    width: 100%;
    height: 100%;
}

.tdashboardHeader .rt-side .hduser .info{
    width: calc(100% - 40px);
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 0 0 10px;
}
.tdashboardHeader .rt-side .hduser .info p{
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height:1.2;
    color: #1F1E1E;
    padding: 0;
    margin: 0;
}

.verificationPop{
    position: absolute;
    background: #00000008;
    backdrop-filter: blur(83px);
    position: absolute;
    width: 100%;
    height:calc(100% - 90px);
    border-radius: 20px;
    z-index: 1;
    left: 0;
    right: 0;
    bottom: 0;
    display: none;
}
.verificationPop.active{
    display: flex;
    justify-content: center;
    align-items: center;
}
.verificationPopWrap{
    width: 100%;
    max-width: 550px;
    border-radius: 20px;
    background: #fff;
    padding: 40px;
    text-align: center;
    margin: 0 auto;
}
.verificationPopWrap .tham{
    max-width: 200px;
    margin: 0 auto 0px;
    padding: 0;
}
.verificationPopWrap .text{
    text-align: center;
}
.verificationPopWrap .text p{
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 1.4;
    text-align: center;
    color: #666666;
    padding: 0;
    margin: 0;
}
.tdashboard .tsidebar .btn{
    padding: 0;
    margin: 0 0 20px;
}
/*============== CSS End 24-03-2025 =============*/


/*============== CSS start 26-03-2025 =============*/
.liveclassStart {
    height: calc(100vh - 120px);
    display: flex;
    align-items: center;
    justify-content: center;
}
.liveclassStartwrap {
    background: #fff;
    border-radius: 30px;
    max-width: 460px;
    width: 100%;
    text-align: center;
    margin: 0 auto;
    padding: 30px;
}

.liveclassStartwrap h3 {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 26px;
    line-height: 1.2;
    text-align: center;
    color: #2D8ABA;
    padding: 0;
    margin: 0 0 10px;
}
.liveclassStartwrap .icon {
    max-width: 120px;
    margin: 0 auto;
}
.liveclassStartwrap p {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.2;
    text-align: center;
    color: #333333;
}
.liveclassStartwrap h6 {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 1.2;
    color: #51BDE3;
    padding: 0;
    margin: 10px 0;
}
.liveclassStartwrap h5 {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.2;
    text-align: center;
    color: #893A3F;
    padding: 0;
    margin: 0 0 20px;
}
.liveclassStartwrap a{
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height:1.2;
    text-align: center;
    background: #00A990;
    color: #fff;
    display: inline-block;
    padding: 10px 30px;
    border-radius: 27px;
    border: 1px solid #00A990;
}
.liveclassStartwrap a:hover{
    background: transparent;
    color: #00A990;
}

.dashboard-footer {
    position: fixed;
    width: 100%;
    bottom: 0;
    right: 0;
    padding: 6px 30px 6px 0;
    margin: 0;
    text-align: right;
    background: #fafafa;
}
.dashboard-footer p{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height:1.2;
    text-align: right;
    text-transform: capitalize;
    color: #666666;
}






.tdashboardHeader .rt-side .hduser{
    position: relative;
}
.tdashboardHeader .rt-side .hduser .dropdownmenu-content{
    position: absolute;
    right: 0;
    box-shadow: 0px 0px 14px 0px #00000014;
    background: #fff;
    border-radius: 10px;
    min-width: 133px;
    top: 40px;
}
.tdashboardHeader .rt-side .hduser .dropdownmenu-content ul{
    padding: 10px;
    margin: 0;
}
.tdashboardHeader .rt-side .hduser .dropdownmenu-content ul li{
    list-style: none;
    padding: 0;
    margin: 0;
    border-bottom: 1px solid #fafafa;
}
.tdashboardHeader .rt-side .hduser .dropdownmenu-content ul li:last-child{
    border-bottom: none;
}
.tdashboardHeader .rt-side .hduser .dropdownmenu-content ul li a{
    font-family: "Poppins", sans-serif;
    font-weight: 300;
    font-size: 14px;
    line-height: 1.2;
    color: #666666;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    transition: all 300ms ease-in-out;
}
.tdashboardHeader .rt-side .hduser .dropdownmenu-content ul li a:hover{
    color: #2D8ABA;
}
.tdashboardHeader .rt-side .hduser .dropdownmenu-content ul li:last-child a,
.tdashboardHeader .rt-side .hduser .dropdownmenu-content ul li:last-child a:hover{
    color: #FF4545;
}


.classListwarp{
    background: #fff;
    border-radius: 20px;
    min-height: calc(100vh - 120px);
    padding: 15px;
}
.classListwarp .ttlFilter{
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    margin: 0 0 20px;
}
.classListwarp .ttlFilter h3{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 24px;
    line-height: 1.2;
    color: #000;
    padding: 0;
    margin: 0;
}
.classListwarp .ttlFilter .datefilter {
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0;
    gap: 10px;
    flex-wrap: wrap;
}
.classListwarp .ttlFilter .datefilter .datefilterwrap {
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0;
    gap: 0px;
}
.classListwarp .ttlFilter .datefilter span{
    color: #666666;
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.2;
    padding: 0;
    margin: 0;
}

.classListwarp .ttlFilter .datefilter .datefilterwrap .datebox .form-control{
    border: 1px solid #CCCCCC;
    outline: none;
    box-shadow: none;
}
.classListwarp .ttlFilter .datefilter .datefilterwrap .datebox:first-child .form-control{
    border-radius: 10px 0 0 10px;
}
.classListwarp .ttlFilter .datefilter .datefilterwrap .datebox:last-child .form-control{
    border-radius: 0 10px 10px 0;
    border-left: 0;
}

.classListwarp .ttlFilter .subjectSrc{
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
}
.classListwarp .ttlFilter .subjectSrc .subfield{
    min-width: 160px;
}
.classListwarp .ttlFilter .subjectSrc .subfield .form-control{
    -webkit-appearance: listbox;
}
.classListwarp .ttlFilter .subjectSrc .form-control {
    font-family: "Poppins", sans-serif;
    font-size: 14px;
    line-height: 1.2;
    border: 1px solid #CCCCCC;
    border-radius: 8px;
    min-height: 36px;
}
.classListwarp .ttlFilter .subjectSrc .srcfield{
    min-width: 300px;
}


.dateStatus{
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0;
    flex-wrap: wrap;
}
.dateStatus p{
    padding: 0 10px 0 0;
    margin: 0 10px 0 0;
    border-right: 1px solid #0000003B;
}
.dateStatus p:last-child{
    padding-right: 0;
    margin-right: 0;
    border-right: 0;
}
.class-duration li:last-child span.studentStatus{
    font-size: 14px;
    line-height: 1.2;
    color: #666666;
    text-decoration: none;
}
.class-duration li:last-child a{
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height:1.2;
    text-decoration: underline;
    color: #00A990;
    display: inline-block;
}

.classListwarp .classListbox .class-card{
    background: #ECF7FD80;
    box-shadow: none;
}
.classListwarp .classListbox .class-card .class-card-left{
    width: calc(100% - 328px);
}
.classListwarp .classListbox .class-card .class-card-left{
    width: calc(100% - 290px);
}
.nextClassBox{
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 0;
    margin: 0;
    position: relative;
    min-width: 280px;
}
/* Styles for the anchor tag inside the classDaytag div */
.nextClassBox .classDaytag a {
    /* Apply the visual styles from your .classDaytag rules */
    border: 1px solid #00A990;
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 10px;
    line-height: 1.2;
    text-align: center;
    display: inline-block; /* Or block if you want it to fill the container */
    padding: 4px 12px;
    border-radius: 17px;
    background: #fff; /* White background */
    color: #00A990; /* Green text color */
    text-decoration: none; /* Remove underline */
    /* Add any other desired styles, e.g., transitions */
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Optional: Style for the disabled state (when showing timer) */
.nextClassBox .classDaytag a.disabled {
    opacity: 0.7; /* Make it slightly transparent */
    cursor: default; /* Change cursor */
    /* Keep background/color as per the base style, or change if needed for disabled look */
    background: #f8f9fa; /* Light grey background for disabled */
    color: #6c757d; /* Muted text color for disabled */
    border-color: #6c757d; /* Muted border for disabled */
}

/* Optional: Style for the active/hover state (when showing Join Now) */
.nextClassBox .classDaytag a:not(.disabled):hover {
    background-color: #00A990; /* Green background on hover */
    color: #fff; /* White text on hover */
}


/* Keep the original positioning and display for the parent div if needed */
.nextClassBox .classDaytag {
    position: absolute;
    right: -11px;
    top: -35px;
    /* You might still need display: inline-block; or similar here depending on layout */
}

.nextClassBox .icon{
    max-width: 60px;
}
.nextClassBox .text{
    padding: 0;
    margin: 0;
}
.nextClassBox .text p{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.2;
    color: #000;
    padding: 0;
    margin: 0;
}
.nextClassBox .text h5{
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 24px;
    line-height: 1.2;
    color: #51BDE3;
    padding: 0;
    margin: 0;
}
.nextClassBox .text span{
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 12px;
    line-height: 1.2;
    text-align: center;
    color: #893A3F;
}

.subjectDetailsBox{
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0;
}
.subjectDetailsBox .subName{
    padding: 0;
    margin: 0 60px 0 0;
}
.subjectDetailsBox .subName p{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.2;
    padding: 0;
    margin: 0 0 6px;
}
.subjectDetailsBox .subName h4{
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 24px;
    line-height:1.2;
    color: #2D8ABA;
    padding: 0;
    margin: 0;
}
.subjectDetailsBox .subdetailsBtn a{
    display: inline-block;
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.2;
    border: 1px solid #00A990;
    color: #00A990;
    background: #fff;
    padding: 8px 36px;
    border-radius: 27px;
}
.classlistoption{
    position: absolute;
    right: 10px;
    top: 10px;
}
.classlistoption button{
    background: transparent;
    border: none;
    box-shadow: none;
    outline: none;
}

.classListbox.classListDetails .class-card.class-cardDetails{
    margin-bottom: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}



.classDetailsInfo .nav.nav-tabs{
    background: #ECF7FD;
    justify-content: space-between;
    padding: 0 20px;
    margin: 0;
    border-bottom: none;
}
.classDetailsInfo .nav.nav-tabs .nav-link{
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height:1.2;
    color: #000;
    padding: 14px 10px;
    margin: 0;
    border-radius: 0;
    border: none;
}
.classDetailsInfo .nav.nav-tabs .nav-link.active{
    background: #51BDE3 !important;
    color: #fff;
}

.cldetilascard {
    padding: 15px;
    margin: 0;
}
.cldetilascardWrap {
    padding: 15px;
    background: #D9D9D91A;
    border-radius: 10px;
}
.cldetilascardWrap .ttl {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0;
    margin: 0 0 20px;
}
.cldetilascardWrap .ttl h4 {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 1.2;
    text-transform: capitalize;
    padding: 0;
    margin: 0;
}
.addnewCl .addnewBtn {
    padding: 0;
    margin: 0;
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.2;
    text-transform: capitalize;
    color: #00A990;
}

.addnewCl .addnewThreadBtn {
    padding: 0;
    margin: 0;
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.2;
    text-transform: capitalize;
    color: #00A990;
}

.accordion.classDetailsAccor .accordion-item{
    border: none;
    padding: 0 20px;
    position: relative;
    box-shadow: 0px 0px 24px 0px #0000000D;
    border-radius: 10px;
    margin: 0 0 20px;
}
.accordion.classDetailsAccor .accordion-item .accordiOption {
    position: absolute;
    right: 10px;
    top: 14px;
    cursor: pointer;
}
.accordion.classDetailsAccor .accordion-item .accordion-header .accordion-button{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.2;
    color: #000000;
    padding-left: 0;
    padding-right: 0;
}
.accordion.classDetailsAccor .accordion-item .accordion-header .accordion-button .count{
    display: inline-block;
    margin: 0 15px 0 0;
    color: #2D8ABA;
}
.accordion.classDetailsAccor .accordion-item .accordion-header .accordion-button:not(.collapsed){
    border-bottom: 1px solid #CCCCCC !important;
    box-shadow: none;
}



.accordion.classDetailsAccor .accordion-item .accordion-body{
    padding-left: 26px;
}
.accordion.classDetailsAccor .accordion-item .accordion-body ul li{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.6;
    list-style: inside;
    color: #654E63;
    padding: 0;
    margin: 0;
}


.captersuploadvideo {
    max-width: 450px;
    padding: 0;
    margin: 30px 0 0;
    position: relative;
}
.captersuploadvideo img{
    width: 100%;
    height: 100%;
    border-radius: 10px;
    object-fit: cover;
}
.captersuploadvideo .imgDelete{
    position: absolute;
    top: 15px;
    right: 15px;
}
.captersuploadvideo .imgDelete .romoveimg{
    display: flex;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    background-color: #fff !important;
    border: none;
    outline: none;
    color: #FF5A5A;
    font-size: 14px;
    line-height: 1.2;
}

.assesssetpanel{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 20px;
    margin: 0 0 15px;
    box-shadow: 0px 0px 14px 0px #0000000A;
    border-radius: 10px;
}
.assesssetpanel:last-child{
    margin-bottom: 0;
}
.assesssetpanel .box p{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height:1.2;
    letter-spacing: .2px;
    color: #000;
}
.assesssetpanel .box.markbox{
    width: 260px;
}
.assesssetpanel .box.cpname{
    width: calc(100% - 300px);
}


.earningInfotableeWrap{
    padding: 0;
    margin: 0;
}
.earningInfotableeWrap .erningInfotableacc .accordion-header .accordion-button{
    display: flex;
    align-items: center;
    padding: 10px 0;
    margin: 0;
}

.earningInfotableeWrap .erningInfotableacc .accordion-item{
    border: none;
    border-bottom: 1px solid #ccc;
    padding: 10px 0;
}
.earningInfotableeWrap .erningInfotableacc .accordion-header .accordion-button:not(.collapsed){
    border-bottom: 1px solid #CCCCCC !important;
    box-shadow: none;
}
.earningInfotableeWrap .erningInfotableacc .accordion-header .accordion-button:not(.collapsed){
    background-color: #fff;
}
.earningInfotableeWrap .erningInfotableacc .accordion-header .accordion-button .weekstatus span{
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 12px;
    line-height: 1.2;
    color: #000;
    display: inline-block;
    border-radius: 27px;
    padding: 6px 14px;
    background: #CCCCCC;
}
.earningInfotableeWrap .erningInfotableacc .accordion-item.currentItem .accordion-header .accordion-button .weekstatus span{
    background: #FFD700;
}

.earningInfotableeWrap .erningInfotableacc .accordion-header .accordion-button .priceWticon figure{
    max-width: 40px;
    margin: 0;
}
.earningInfotableeWrap .erningInfotableacc .accordion-header .accordion-button .commtbox{
    display: inline-block;
    width: 33.333333%;
}
.earningInfotableeWrap .erningInfotableacc .accordion-header .accordion-button .commtbox p{
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 18px;
    line-height: 1.2;
    color: #263238;
    padding: 0;
    margin: 0;
}
.earningInfotableeWrap .erningInfotableacc .accordion-header .accordion-button .priceWticon{
    display: flex;
    align-items: center;
}
.earningInfotableeWrap .erningInfotableacc .accordion-header .accordion-button .priceWticon strong{
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-size: 28px;
    line-height: 1.2;
    padding: 0;
    margin: 0;
    color: #00A990;
    color: #2D8ABA;
}
.earningInfotableeWrap .erningInfotableacc .accordion-item.currentItem .accordion-header .accordion-button .priceWticon strong{
    color: #00A990;
}
.earningTablewrap{
    background: #D9D9D93B;
    padding: 8px;
    border-radius: 10px;
}
.earningTablewrap table tr td{
    border-bottom: none;
    background: #fff;
    font-weight: 500;
    font-size: 14px;
    line-height: 1.2;
    font-family: 'ClashGrotesk-Medium';
}
.earningTablewrap table tr:nth-child(odd) td{
    background: #ECF7FD;
}
.earningTablewrap .table{
    margin-bottom: 0;
}
/*============== CSS End 26-03-2025 =============*/


 /*============== Upcoming class CSS  04/04/2025 =============*/
.classpanel {
    padding: 21px 10px;
    box-shadow: 0px 2px 14px 0px #0000000F;
    background: #fff;
    border-radius: 20px;
    margin-bottom: 14px;
}
.classpanel .teimfo{
    display: flex;
    align-items: center;
    margin: 0px 0px;
    padding: 11px 0px 11px 7px;
}

.classpanel .teimfo .tham{
    width: 66px;
    height: 66px;
    border-radius: 50%;
    background: #51BDE3;
}
.classpanel .teimfo .tham img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.classpanel .teimfo .text{
    width: calc(100% - 66px);
    padding: 0 0 0 10px;
}
.classpanel .teimfo .text h5{
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 17px;
    line-height: 1.2;
    color: #000000;
    padding: 0;
    margin: 0 0 5px;
}
.classpanel .teimfo .text ul {
    display: flex;
    gap: 8px;
    align-items: center;
}
.classpanel .teimfo .text ul li{
    font-size: 12px;
    color: #F2B200;
}
.subBox {
	margin: 0px 0px;
	padding: 17px 0px 0px 11px;
	position: relative;
}
.classpanel .subBox h5 {
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 23px;
    line-height: 20px;
    color: #2D8ABA;
    padding: 0;
    margin: 0 0 7px;
}
.classpanel .subBox p {
	font-family: 'ClashGrotesk-Medium';
	font-weight: 500;
	font-size: 15px;
	line-height: 1.2;
	color: #893A3F;
	padding: 0;
	margin: 0 0 10px;
}
.perform-box {
	display: flex;
	align-items: center;
	justify-content: start;
	gap: 12px;
}
.perform-box a{
    font-family: 'ClashGrotesk-Medium';
	font-weight: 500;
	font-size: 14px;
	line-height: 1.2;
	color: #428BC1;
	padding: 0;
	margin: 0 0 10px;
    display: block ruby;
    text-decoration: underline;
}
.perform-box a:hover{
	color: #428BC1;
    text-decoration: none;
}
.joinBox {
	text-align: center;
    }
.joinbtn {
    margin: 0px 0px;
    padding: 11px 21px;
    position: relative;
    background: #00A990;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none !important;
    color: #fff !important;
    border-radius: 22px;
}
.joinbtn:hover {
    background: #02ddbc;
    }
.joinBox .icon {
    margin: 0px auto 10px auto;
    padding: 0px 0px;
    position: relative;
    width: 41px;
    }
.joinBox .disabled {
        opacity: 0.6;
        cursor: not-allowed;
      }
    .progress {
        width: 88px;
        height: 88px;
        font-size: 22px;
        color: #000;
        border-radius: 50%;
        overflow: hidden;
        position: relative;
        background: #F2F2F2;
        text-align: center;
        line-height: 93px;
        margin: 0px;
        font-weight: 600;
    }
    .showprogressbar{
        margin-bottom: 10;
    }
    .showprogressbar .progress {
        width: 100%;
        height: 8px;
        border-radius: 6px;
        margin-bottom: 10px;
        margin-top: 10px;
    }
/* .progress::after {content: "%";} */
    
    .progress .title {
        position: relative;
        z-index: 100;
        width: 100%;
        font-size: 16px;
        font-weight: 700;
        }
.progress span::after {
    content: "%";
    position: absolute;
    font-size: 16px;
  }
    .progress .overlay {
        width: 50%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
        background-color: #F2F2F2;
    }
    
    .progress .left, .progress .right {
        width: 50%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        border: 4px solid #00a990;
        border-radius: 100px 0px 0px 100px;
        border-right: 0;
        transform-origin: right;
    }
    
    .progress .left {animation: load1 1s linear forwards;}
    
    .progress:nth-of-type(2) .right, .progress:nth-of-type(3) .right {animation: load2 .5s linear forwards 1s;}
    
    .progress:last-of-type .right, .progress:first-of-type .right {animation: load3 .8s linear forwards 1s;}
    
    @keyframes load1 {
        0% {transform: rotate(0deg);}
    
        100% {transform: rotate(180deg);}
    }
    
    @keyframes load2 {
        0% {z-index: 100;transform: rotate(180deg);}
    
        100% {z-index: 100;transform: rotate(270deg);}
    }
    
    @keyframes load3 {
        0% {z-index: 100;transform: rotate(180deg);}
    
        100% {
            z-index: 100;transform: rotate(315deg);}
    }

 /*============== Video class page CSS  =============*/
   .videosection{
    margin: 0px 0px;
    padding: 0px 0px;
    position: relative;
    width: 100%;
   }
   .videocard{
    padding: 14px 12px;
    box-shadow: 0px 1px 9px 4px #0000000F;
    background: #fff;
    border-radius: 10px;
    margin-bottom: 14px;
   }
.videoheader{
    margin: 0px 0px 3px 0px;
    padding: 0px 0px;
    position: relative;
    display: flex;
    justify-content: space-between;
    width: 100%;
    }
.videoheader-left h4 {
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 16px;
    line-height: 1.2;
    color: #000000;
    padding: 0;
    margin: 0 0 5px;
    }
.videoheader-left h5 {
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 16px;
    line-height: 1.2;
    color: #893A3F;
    padding: 0;
    margin: 0 0 5px;
    }
.videoheader-right h6 {
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 18px;
    line-height: 23px;
    color: #2D8ABA;
    padding: 0;
    margin: 0 0 5px;
    }
.videoheader-right h6 span {
    font-size: 12px;
    color: #428BC1;
    display: block;
    }
.videoheader-right {
    text-align: right;
    }
.videoimg {
    margin: 0px 0px;
    padding: 0px 0px;
    position: relative;
    width: 100%;
    height: 140px;
    overflow: hidden;
    border-radius: 10px;
    }
.videoimg #overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0;
    right: 0;
    bottom: 0;
    cursor: pointer;
    background: #0009;
}
.proicons_pdf {
	position: absolute;
	left: 44%;
	bottom: 36%;
	z-index: 9;
	width: 33px;
    } 

/*==== Vedio Button Area CSS =====*/
.welcome-video{
    margin: 0px 0px;
    padding: 0px 0px;
    position: relative;
    width: 100%;
    height: 140px;
    border-radius: 10px;
    overflow: hidden;
    }
.welcome-video img{
    width: 100%;
    height: 100%;
    }
.welcome-video #overlay {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0;
	right: 0;
	bottom: 0;
	cursor: pointer;
	background: #0009;
	z-index: 9;
	}
.videosect-bg{
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    width: 100%;
    height: 100%;
    }
.videosect-bg img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    }
.play-button {
    position: absolute;
    top: 50%;
    left: 48%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 40px;
    height: 40px;
    z-index: 999;
	}
	
.play-button a::before {
	content: '';
	width: 7%;
	height: auto;
	border-radius: 50%;
	background: transparent;
	border: 1px solid transparent;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	-webkit-animation: video-play 3s infinite linear;
	animation: video-play 3s infinite linear;
	border-radius: 14px;
	}
.play-button a i {
	width: 100px;
	height: 100px;
	border-radius: 50%;
	padding-left: 5px;
	display: inline-flex;
	border: 1px solid #F1F6FF;
	position: relative;
	font-size: 20px;
	}

.play-button a i {
	color: #ffffff;
	font-size: 30px;	
	}
	
	@-webkit-keyframes top-bottom {
		0% {
			-webkit-transform: translateY(0px);
			transform: translateY(0px)
		}
	
		50% {
			-webkit-transform: translateY(10px);
			transform: translateY(10px)
		}
	}
	
	@keyframes top-bottom {
		0% {
			-webkit-transform: translateY(0px);
			transform: translateY(0px)
		}
	
		50% {
			-webkit-transform: translateY(10px);
			transform: translateY(10px)
		}
	}
	
	@-webkit-keyframes half-spin {
		0% {
			-webkit-transform: rotate(0);
			transform: rotate(0);
			-webkit-transform-origin: center;
			transform-origin: center
		}
	
		50% {
			-webkit-transform: rotate(90deg);
			transform: rotate(90deg);
			-webkit-transform-origin: center;
			transform-origin: center
		}
	}
	
	@keyframes half-spin {
		0% {
			-webkit-transform: rotate(0);
			transform: rotate(0);
			-webkit-transform-origin: center;
			transform-origin: center
		}
	
		50% {
			-webkit-transform: rotate(90deg);
			transform: rotate(90deg);
			-webkit-transform-origin: center;
			transform-origin: center
		}
	}
	
	@-webkit-keyframes video-play {
		0% {
			width: 50%;
			height: 50%
		}
	
		100% {
			width: 100%;
			height: 100%
		}
	}
	
	@keyframes video-play {
		0% {
			width: 50%;
			height: 50%
		}
	
		100% {
			width: 100%;
			height: 100%
		}
	}
	
/*==== Vedio Button Area CSS =====*/


/*==== Job List Area CSS 08/04/2025 =====*/
.govtjobs-section{
    margin: 0px 0px;
    padding: 0px 0px;
    position: relative;
    width: 100%;
   }
.govtjob-card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	box-shadow: 0px 0px 24px 0px #0000001A;
	padding: 20px;
	border-radius: 10px;
	margin-bottom: 15px;
	position: relative;
    }
.govtjob-cardright{
    margin: 0px 0px;
    padding: 0px 0px;
    position: relative;
    width: auto;
   }
.govtjob-cardleft{
    margin: 0px 0px;
    padding: 0px 0px;
    position: relative;
    width: auto;
   }
.govtjob-cardleft h3 {
	color: #333333;
	font-size: 24px;
    font-weight: 500;
	line-height: 27px;
	letter-spacing: normal;
	font-family: 'ClashGrotesk-Medium';
	padding: 6px 0px;
    }
.govtjob-cardright .viewdetail{
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 16px;
    line-height: 1.2;
    color: #2D8ABA;
    padding: 0;
    margin: 0 0 10px;
    display: block ruby;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 6px;
    }
.govtjob-cardright .viewdetail svg{
    font-size: 13px;
    }
.govtjob-cardright .viewdetail:hover{
    color: #38a6dd;
    text-decoration: underline;
    }
.jobsfound-card{
    margin: 0px 0px;
    padding: 0px 0px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 53px;
    }
.govtjob-cardleft h6 {
    margin: 0px 0px;
    padding: 0px 0px;
    position: relative;    
    font-family: 'ClashGrotesk-Medium';
    color: #666666;
    font-size: 17px;
    font-weight: 500;
    line-height: 27px;
    }
.govtjob-cardleft h6 span{
    color: #2D8ABA;
    font-size: 17px;
    font-weight: 600;
    padding-left: 8px;
    }

.jobdetails-section{
    margin: 0px 0px;
    padding: 50px 0px;
    position: relative;
    width: 100%;
    }
.jobdetails-section h2 {
    margin: 0px 0px 14px 0px;
    padding: 0px 0px;
    font-family: 'ClashGrotesk-Semibold';
    position: relative;
    color: #333333;
    font-size: 40px;
    font-weight: 700;
    line-height: 33px;
    }
.jobdetails-section h5 {
    margin: 0px 0px 9px 0px;
    padding: 0px 0px;
    font-family: 'ClashGrotesk-Medium';
    position: relative;
    color: #666666;
    font-size: 36px;
    line-height: 41px;
    font-weight: 400;
    }
.jobdetails-section h5 span {
    font-family: 'ClashGrotesk-Semibold';
    color: #2D8ABA;
    font-size: 36px;
    font-weight: 600;
    }
 .jobdetails-section h6 {
    margin: 0px 0px 48px 0px;
    padding: 0px 0px;
    font-family: 'ClashGrotesk-Regular';
    position: relative;
    color: #333333;
    font-size: 23px;
    line-height: 30px;
    font-weight: 500;
    } 
.jobdetails-section h6 span {
    font-family: 'ClashGrotesk-Medium';
    font-weight: 600;
    }
.jobdetail-head{
    margin: 0px 0px;
    padding: 8px 27px;
    background: #d3eff8;
    font-family: 'ClashGrotesk-Medium';
    font-size: 26px;
    color: #000000;
    font-weight: 500;
    border-radius: 6px
    }
.jobdetail-card {
    margin: 0px 0px;
    padding: 15px 30px;
    position: relative;
    width: 100%;
    } 
.jobdetail-card p {
    margin: 0px 0px;
    padding: 8px 0px;
    position: relative;
    font-family: 'ClashGrotesk-Regular';
    color: #4d4b4b;
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    } 
.jobdetail-card p a {
    color: #428BC1;
    text-decoration: underline;
    } 
.jobdetail-card p a:hover {
    color: #428BC1;
    text-decoration: none;
    } 
.newclasse-section{
    margin: 0px auto;
    padding: 50px 0px;
    position: relative;
    width: 520px;
    }
.newclasse-section h3 {
    margin: 0px 0px 45px 0px;
    padding: 0px 0px;
    font-family: 'ClashGrotesk-Medium';
    position: relative;
    color: #333333;
    font-size: 40px;
    font-weight: 600;
    line-height: 33px;
    text-align: center;
    }
.usercard-img{
    margin: 0px 0px;
    padding: 0px 0px;
    background: #51BDE3;
    position: relative;
    width: 90px;
    height: 90px;
    overflow: hidden;
    border-radius: 50%;
    }
.usercard-img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    }

.newclasse-usercard {
    margin: 0px 0px;
    padding: 0px 0px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 17px;
    }   
.usercard-text h4 {
    margin: 0px 0px;
    padding: 0px 0px;
    font-family: 'ClashGrotesk-Medium';
    position: relative;
    color: #000000;
    font-size: 21px;
    line-height: 24px;
    font-weight: 500;
    } 
.usercard-text h6 {
    margin: 0px 0px;
    padding: 0px 0px;
    font-family: 'ClashGrotesk-Medium';
    position: relative;
    color: #2D8ABA;
    font-size: 21px;
    line-height: 24px;
    font-weight: 500;
    } 
.usercard-text h6 span {
    font-size: 16px;
    color: #893A3F;
    display: block;
    }
.newclasse-section p {
    margin: 41px 0px 0px 0px;
    padding: 0px 0px;
    font-family: 'ClashGrotesk-Medium';
    position: relative;
    color: #676067;
    font-size: 20px;
    line-height: 24px;
    text-align: center;
    font-weight: 400;
    width: 100%;
    } 
.starcard {
    margin: 8px auto;
    width: 200px;
    text-align: center;
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    }
.starcard a {
    color: #F2B200;
    }
 .starcard a .bg-light{
    color: #d5d1d1;
 }
 .form-checkcard{
    margin: 12px auto;
    width: 469px;
    text-align: center;
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    }
.form-checkcard .form-check-input {
    padding: 8px;
    }
.form-checkcard .form-check-label {
    gap: 5px;
    display: flex;
    justify-content: start;
    }
.newclasse-section .form-control {
    margin: 22px 0px 33px 0px;
    padding: 12px 15px;
    display: block;
    width: 100%;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 8px;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.feedback-btn {
    margin: 0px 0px;
    padding: 8px 25px;
    position: relative;
    background: #00A990;
    font-size: 18px;
    font-weight: 500;
    text-decoration: none !important;
    color: #fff !important;
    border-radius: 22px;
    font-family: 'ClashGrotesk-Medium';
}
.feedback-btn:hover {
    background: #02ddbc;
}


.class-banner.checkOut {
    padding: 30px 0;
    margin: 0;
}
.class-banner.checkOut .class-banner-inner{
    flex-direction: column;
    margin-top: 0;
}

.class-banner.checkOut .class-banner-inner .class-banner-inner-left{
    width: 100%;
    max-width: 100%;
    padding-right: 0;
}
.class-banner.checkOut .class-banner-inner .class-banner-inner-left .datehurry{
    display: flex;
    align-items: flex-end;
    gap: 60px;
    padding: 0;
    margin: 0;
}
.class-banner.checkOut .class-banner-inner .class-banner-inner-left .start-date{
    display: flex;
    gap: 60px;
    padding: 0;
    margin: 0;
}
.class-banner.checkOut .class-banner-inner .class-banner-inner-left .start-date h6{
    display: block;
    font-size: 18px;
}
.class-banner.checkOut .class-banner-inner .class-banner-inner-left .start-date span{
    display: block;
}
.class-banner.checkOut .class-banner-inner .class-banner-inner-left .class-list-top .class-card-top .class-duration li:last-child span{
    color: #666666;
}
.class-banner.checkOut .class-banner-inner .class-banner-inner-right{
    padding-left: 0;
    border-left: 0;
    display: flex;
    align-items: flex-end;
    gap: 10px;
    margin: 30px 0 0;
    max-width: 100%;
}
.class-banner.checkOut .class-banner-inner .class-banner-inner-right h6{
    padding: 0;
}
.class-banner.checkOut .class-banner-inner .class-banner-inner-right p{
    padding: 0;
}


.priceSummerybox{
    background: #FFFFFF;
    border: 1px solid #ECF7FD;
    border-radius: 10px;
    padding: 15px;
}

.priceSummerybox .coupon-ttl{
    display: flex;
    gap: 15px;
    align-items: center;
    padding: 0;
    margin: 0 0 20px;
}
.priceSummerybox .coupon-ttl .icon{
    max-width: 40px;
}
.priceSummerybox .coupon-ttl .icon img{
    max-width: 100%;
}
.priceSummerybox .coupon-ttl .textBox h4{
    font-family: 'ClashGrotesk-Medium';
    font-size: 20px;
    line-height: 1.2;
    font-weight: 500;
    color: #000000;
    padding: 0;
    margin: 0;
}
.priceSummerybox .coupon-ttl .textBox p{
    font-family: 'ClashGrotesk-Regular';
    font-size: 16px;
    line-height: 1.2;
    font-weight: 400;
    color: #666666;
    margin: 0;
    margin: 0;
}


.couponField{
    position: relative;
    padding: 0;
    margin: 0 0 20px;
}
.couponField .form-control{
    border: 1px solid #00A990;
    padding: 6px 100px 6px 10px;
    border-radius: 10px;
    height: 48px;
    outline: none;
    box-shadow: none;
    margin: 0;
}
.couponField .btn{
    font-family: 'ClashGrotesk-Medium';
    font-size: 16px;
    line-height: 1.2;
    font-weight: 500;
    border: 1px solid #2D8ABA !important;
    background: #2D8ABA !important;
    color: #fff !important;
    position: absolute;
    right: 0;
    top: 0;
    border-radius: 10px 10px 10px 10px;
    height: 48px;
    padding: 6px 20px;
    margin: 0;
}

.priceSummerybox .priceInfo{
    padding: 0;
    margin: 0;
}

.priceSummerybox .priceInfo h4{
    font-family: 'ClashGrotesk-Medium';
    font-size: 20px;
    line-height: 1.2;
    font-weight: 500;
    color: #000;
    padding: 0 0;
    margin: 0 0 15px;
}
.priceSummerybox .priceInfo .priceInfoPanel{
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px dashed #A9A9A96B;
    padding: 10px 0;
    margin: 0;
}
.priceSummerybox .priceInfo .priceInfoPanel:last-child{
    border-bottom: none;
}
.priceSummerybox .priceInfo .priceInfoPanel p{
    font-family: 'ClashGrotesk-Regular';
    font-weight: 400;
    font-size: 16px;
    line-height: 1.2;
    color: #000;
    padding: 0;
    margin: 0;
}
.priceSummerybox .priceInfo .priceInfoPanel span{
    font-family: 'ClashGrotesk-Regular';
    font-weight: 400;
    font-size: 16px;
    line-height: 1.2;
    color: #000;
    padding: 0;
    margin: 0;
}
.priceSummerybox .priceInfo .priceInfoPanel strong{
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 16px;
    line-height: 1.2;
    color: #000;
    padding: 0;
    margin: 0;
}
.priceSummerybox .priceInfo .priceInfoPanel .pricebox{
    min-width: 140px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.decrease{
    color: #F71212 !important;
}
.increase{
    color: #00A990 !important;
}
.proccedBtn{
    margin-top: 20px;
}
.proccedBtn .btn {
    font-family: 'ClashGrotesk-Semibold';
    font-weight: 600;
    font-size: 20px;
    line-height: 1.2;
    letter-spacing: 1.2px;
    background: #00A990 !important;
    color: #fff !important;
    width: 100%;
    border-radius: 27px;
    padding: 14px 10px;
}

.paymentSelect{
    padding: 0;
    margin: 0 0 30px;
}

.paymentSelect ul{
    display: flex;
    align-items: center;
    justify-content: space-between;
}


.paymentradio [type="radio"]:checked,
.paymentradio [type="radio"]:not(:checked) {
    position: absolute;
    left: -9999px;
}
.paymentradio [type="radio"]:checked + label,
.paymentradio [type="radio"]:not(:checked) + label
{
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    display: inline-block;
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 16px;
    line-height: 1.2;
    color: #000;
}
.paymentradio [type="radio"]:checked + label:before,
.paymentradio [type="radio"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    border: 1px solid #666666;
    border-radius: 100%;
    background: #fff;
}
.paymentradio [type="radio"]:checked + label:after,
.paymentradio [type="radio"]:not(:checked) + label:after {
    content: '';
    width: 12px;
    height: 12px;
    background: #00A990;
    position: absolute;
    top: 3px;
    left: 3px;
    border-radius: 100%;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
.paymentradio [type="radio"]:checked + label:before{
    border-color: #00A990;
}
.paymentradio [type="radio"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
.paymentradio [type="radio"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}

.dbcard{
    background: #fff;
    padding: 10px;
    border-radius: 10px;
}

.dbtankyou {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0;
    margin: 0;
}
.dbtankyou .desc{
    max-width: 60%;
}
.dbtankyou .desc h3{
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 22px;
    line-height: 1.2;
    color: #1F1E1E;
    letter-spacing: 0.1px;
    padding: 0;
    margin: 0 0 6px;
}
.dbtankyou .desc h4{
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 18px;
    line-height: 1.2;
    color: #00A990;
    letter-spacing: 0.1px;
    padding: 0;
    margin: 0 0 6px;
}
.dbtankyou .desc p{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 1.6;
    color: #1F1E1E;
    letter-spacing: 0.1px;
    padding: 0;
    margin: 0 0 0px;
    max-width: 420px;
}

.dbtankyou .posterbox{
    display: flex;
    background: #E6F8FE;
    padding: 30px 10px 0 0;
    border-radius: 10px;
}
.dbtankyou .posterbox .text h4{
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-size: 22px;
    line-height: 1;
    color: #00A990;
    padding:26px 0 0;
    margin: 0;
    max-width: 130px;
}
.dbearningTtl{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0;
    margin: 0 0 20px;
}
.dbearningTtl h3{
    font-weight: 600;
    font-size: 24px;
    line-height: 1.2;
    color: #1F1E1E;
    padding: 0;
    margin: 0;
}
.dbearningTtl .erselect{
    min-width: 175px;
}
.dbearningTtl .erselect .field{
    border: none;
    border-bottom: 1px solid #666666;
    outline: none;
    box-shadow: none;
    width: 100%;
}


.dbearningPanel {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
}
.dbearningPanel .dbearningBox{
    width: 50%;
    display: flex;
    align-items: center();
    padding: 0;
    margin: 0;
    border-right: 1px solid #00000033;
}
.dbearningPanel .dbearningBox:last-child{
    border-right: 0;
    padding-left: 30px;
}
.dbearningPanel .dbearningBox .icon{
    max-width: 60px;
}
.dbearningPanel .dbearningBox .icon img{
    max-width: 100%;
}
.dbearningPanel .dbearningBox .textblock{
    padding: 0 0 0 15px;
    margin: 0;
}
.dbearningPanel .dbearningBox .textblock h4{
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.2;
    color: #263238;
    padding: 0;
    margin: 0;
}
.dbearningPanel .dbearningBox .textblock .procePanel{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0;
    margin: 10px 0 0;
}
.dbearningPanel .dbearningBox .textblock .procePanel strong{
    font-family: "Poppins", sans-serif;
    display: inline-block;
    font-weight: 700;
    font-size: 24px;
    line-height: 1.2;
    color: #00A990;
    padding: 0;
    margin: 0;
}

.dbearningPanel .dbearningBox .textblock .procePanel .wkstatus{
    display: inline-block;
    background: #CCCCCC;
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 10px;
    line-height: 1.2;
    padding: 6px 10px;
    border-radius: 27px;
}
.dbearningPanel .dbearningBox .textblock .procePanel .wkstatus.current{
    background: #FFD700;
}

.nxtclass{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0;
    margin: 0;
}

.nxtclass .icon{
    max-width: 80px;
}
.nxtclass .icon img{
    max-width: 100%;
}
.nxtclass .info{
    padding: 0;
    margin: 0;
}
.nxtclass .info p{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.2;
    color: #000000;
    padding: 0;
    margin: 0 0 10px;
}
.nxtclass .info .subjectDate{
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0;
    margin: 0 0 10px;
}
.nxtclass .info .subjectDate h5{
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 1;
    color: #51BDE3;
    padding: 0;
    margin: 0;
}
.nxtclass .info .subjectDate span{
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 1;
    color:#893A3F;
    padding: 0;
    margin: 0;
}

.nxtclass .info a{
    font-family: 'ClashGrotesk-Medium';
    font-weight: 500;
    font-size: 14px;
    color: #fff;
    line-height: 1;
    background: #00A990;
    padding: 12px 16px;
    border-radius: 27px;
    display: inline-block;
    margin: 0;
}


/*================= 25-04-2025 ==============*/
.modalBtn{
    font-weight: 500;
    font-size: 16px;
    line-height: 14px;
    font-family: 'ClashGrotesk-Medium';
    background: #2D8ABA !important;
    padding: 10px 30px;
    border-radius: 29px;
    color: #fff;
    border: 2px solid #2D8ABA !important;

}




/*============== 06 - 05 - 2025 ===============*/
.flBtnWrap{
    display: flex;
    align-items: center;
    gap: 10px;
}

.common-primary-btn{
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 1.2;
    letter-spacing: 1px;
    text-transform: uppercase;
    box-shadow: none;
    padding: 9px 25px;
    border-radius: 27px;
    color: #fff !important;
    background: #00A990 !important;
    border: 1px solid #00A990 !important;
    transition: all 300ms ease-in-out;      
}
.common-primary-btn:hover{
    background: transparent !important;
    color: #00A990 !important;
}

.common-secondary-btn{
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 1.2;
    letter-spacing: 1px;
    text-transform: uppercase;
    box-shadow: none;
    padding: 9px 25px;
    border-radius: 27px;
    background: #fff !important;
    color: #00A990 !important;
    border: 1px solid #00A990 !important;
    transition: all 300ms ease-in-out;  
}
.common-secondary-btn:hover{
    color: #fff !important;
    background: #00A990 !important;
}


.modal-header .btn-close{
    color: red;
    line-height: 1;
}

.addContentModal .modal-body{
    background: #fafafa;
}

.addContentModal .modal-body .card{
    overflow: hidden;
}
.addContentModal .accordion-header button {
    padding: 15px !important;
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 20px;
    line-height: 1.2;
    color: #2D8ABA;
}

.addContentModal .accordion-body{
    padding-left: 0;
    padding-right: 0;
}
.addTimeRangeBtn{
    color: #00A990 !important;
    font-size: 30px !important;
    line-height: 1.2 !important;
}
.removeTimeRangeBtn{
    color:red !important;
    font-size: 30px !important;
    line-height: 1.2 !important;
}

#contentPreview{
    text-align: center;
}
#contentPreview img{
    max-width: 200px;
    margin: 0 auto;
}

#contentPreview iframe {
    width: 100%;
}
#contentPreview iframe body img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.btn.deleteContent{
    color: red;
}
.btn.viewContent{
    color: #51BDE3;
}


.cldetilascardWrap .fc-header-toolbar.fc-toolbar {
    /* justify-content: flex-start; */
    /* gap: 20px; */
}
.cldetilascardWrap .fc-header-toolbar.fc-toolbar .fc-toolbar-title{
    border: 1px solid #CCCCCC;
    padding: 10px 20px;
    border-radius: 10px;
    font-weight: 400;
    font-size: 18px;
    line-height:1.2;
    letter-spacing: 0%;
    text-transform: capitalize;
    color: #00A990;
}
.cldetilascardWrap .fc-header-toolbar.fc-toolbar .fc-toolbar-chunk button{
    color: #000 !important;
}

.fc-col-header th{
    background: #ECF7FD;
    color: #000;
}
.fc-col-header th a{
    color: #000;
}
.fc-scrollgrid-sync-table td{
    background: #fff;
}




/* 26-06 */
.setNot{
    position: relative;
}
.main_drop{
    background-color: #FFF;
    border: 1px solid #2d8aba;
    padding: 10px;
    border-radius: 12px;
    min-width: 260px;
    position: absolute;
    top: 100%;
    display:none;
    max-height: 230px;
    overflow-x: auto;
}

.main_drop{
    list-style: none;
    margin-bottom: 10px;
    display: flex;
   justify-content: space-between;
   align-items: end;
   flex-direction: column;
}
.main_drop {
    width: 100%;
}
.main_drop a{
    font-size: 13px;
    font-weight: 400;
    color: #00A990;
    transition: 0.2s;
    line-height: 15px;
    width: 78%;
    display: inline-block;
    margin-bottom: 10px;
}

.main_drop span{
    color: #666666;
    font-size: 12px;
    font-weight: bold;
}

.btnView a{
   background-color: #2D8ABA;
   color: #FFF;
   padding: 5px 10px;
   border-radius: 10px;
   text-align: center;
}

.btnView{
    display: flex;
    justify-content: center;
    width: 100%;
}