:root {
    --primary-color: #1f4e99;
    --secondary-color: #f45661;
    /* --secondary-color: #cce7ff; */
}

/* font-family: 'Poppins', sans-serif; */
/* font-family: 'Open Sans', sans-serif; */
/* font-family: 'Noto Sans', sans-serif; */



body {
    margin: 0;
    overflow-x: hidden;
    /* font-family: 'Fredoka', sans-serif; */
}

a {
    text-decoration: none;
}

p,
a,
ul li,
span,
label,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Poppins', sans-serif;
}

/* Modal buttons design start here  */
.modal-header {
    background: var(--primary-color);
}

    .modal-header h5 {
        color: #fff;
    }

.modal-body {
    padding: 20px 20px 23px 20px !important;
}

.mdlYesBtn {
    background: var(--primary-color);
    color: #fff;
    font-family: 'Poppins', sans-serif;
    font-size: 18px;
}

.mdlNoBtn {
    background: var(--secondary-color);
    color: #fff;
    font-family: 'Poppins', sans-serif;
    font-size: 18px;
}

    .mdlYesBtn:hover,
    .mdlNoBtn:hover {
        color: #fff;
    }

.SmrtLrng_Tbl .mdlYesBtn,
.SmrtLrng_Tbl .mdlNoBtn {
    font-size: 14px;
}

/* Modal buttons design end here  */
.errSpn {
    display: block;
    color: red;
    font-size: 13px;
    float: left;
    font-weight: 450;
}

/* Button Design Start Here  */

.backBtn {
    font-family: 'Poppins', sans-serif;
    border: 1px solid rgba(0, 0, 0, .5);
}

.prevBtn,
.nextBtn {
    padding: .5rem 1rem;
    font-size: 18px;
}

.aspNetDisabled {
    background: linear-gradient(171deg, #e7dcdc, #afa9a9);
    cursor: not-allowed;
    border-radius: 50px;
    border: unset;
    color: gray;
}

    .aspNetDisabled:hover {
        color: gray;
    }

/* Navbar Start Here  */
/* Header-1 Start  */

section.top_header {
    background: #342e32;
    width: 100%;
    float: left;
    padding: 3px 0 2px 0;
}

.email_info ul {
    list-style: none;
    padding: 0;
    margin: 0 0 0 0;
}

    .email_info ul li {
        display: inline-block;
        margin-right: 10px;
    }

        .email_info ul li a {
            color: #fff;
            font-size: 13px;
            font-weight: 400;
            display: block;
            padding: 8px 12px;
        }

.email_info i {
    margin-right: 5px;
}

.btns_top {
    padding: 0;
    margin: 0;
}

    .btns_top li:first-child {
        margin-right: 1px;
    }

    .btns_top li {
        display: inline-table;
    }

#mobileSideMenu .nav-link {
    color: #fff;
}

.mobile_btn a {
    padding: 8px 9px;
    background: #b58c2c;
    display: inline-block;
    color: #fff;
    border-radius: 5px;
    font-size: 13px;
}

.mobile_btn ul {
    margin-bottom: 0;
}

.social_link ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .social_link ul li {
        display: inline-block;
        margin-right: 10px;
    }

.top_header .social_link ul li a {
    padding: 8px 0px;
}

.social_link ul li a {
    color: #fff;
    font-size: 13px;
    font-weight: 400;
    display: block;
    padding: 0px 0px;
}


/*===== After login popup =====*/
.afterLogin {
    position: fixed;
    background: #fff;
    display: none;
    width: 150px;
    border-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    z-index: 999999;
    text-align: left;
}

#log:hover .afterLogin {
    display: block;
}

.afterLogin #log1 {
    padding: 10px;
}

.afterLogin ul {
    float: unset;
    padding-left: 0;
}

    .afterLogin ul li {
        width: 100%;
        padding: 4px 0 4px 6px;
        margin: 0 0 5px 0;
    }

        .afterLogin ul li:hover {
            background: #f3f3f3;
        }

        .afterLogin ul li:nth-child(1) {
            border-bottom: 1px solid #95b4e6;
        }

        .afterLogin ul li a {
            background: unset;
            color: var(--primary-color);
            padding: 0;
            font-size: 14px;
        }

/*===== After login popup end=====*/

/* Navbar basics */
#modernNavbar {
    transition: background-color 0.4s ease, box-shadow 0.4s ease;
    width: 100%;
    float: left;
    box-shadow: none;
    padding: 10px 0;
    background: #003778;
}

    #modernNavbar .navbarLft,
    #modernNavbar .navbarRyt {
        width: 100%;
        float: left;
    }

    #modernNavbar .navbarRyt {
        margin: 18px 0 0 0;
    }

    #modernNavbar.fixed-top {
        top: 5% !important;
    }

    #modernNavbar.scrolled {
        background: white;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
        top: 0 !important;
    }

    #modernNavbar .navbar-brand {
        transition: color 0.4s ease;
    }

    #modernNavbar.scrolled .navbar-brand {
        color: #1f4e99;
    }

    #modernNavbar .nav-link {
        position: relative;
        color: #fff;
        font-weight: 600;
        transition: color 0.3s ease;
        font-family: 'Poppins', sans-serif;
    }

    #modernNavbar .nav-item {
        transition: all .2s ease-in-out;
    }

        #modernNavbar .nav-item:hover .dropdown-menu {
            display: block;
        }


    #modernNavbar .nav-link:hover,
    #modernNavbar .nav-link.active {
        color: #fff;
    }

    #modernNavbar.scrolled .nav-link {
        color: var(--primary-color);
    }

    #modernNavbar .navbar-toggler {
        border: none;
        outline: none;
        padding: 0;
        color: transparent;
        margin: -25px 0 0 0;
    }

    #modernNavbar.scrolled .navbar-toggler {
        color: transparent;
    }

/*#modernNavbar .navbar-toggler-icon {
        width: 30px;
        height: 3px;
        background-color: #fff;
        display: block;
        position: relative;
        transition: background-color 0.3s ease;
    }

    #modernNavbar.scrolled .navbar-toggler-icon {
        background-color: var(--primary-color);
    }

    #modernNavbar .navbar-toggler-icon::before,
    #modernNavbar .navbar-toggler-icon::after {
        content: "";
        width: 30px;
        height: 3px;
        background-color: #fff;
        position: absolute;
        left: 0;
        transition: all 0.3s ease;
    }

    #modernNavbar.scrolled .navbar-toggler-icon::before,
    #modernNavbar.scrolled .navbar-toggler-icon::after {
        background-color: var(--primary-color);
    }

    #modernNavbar .navbar-toggler-icon::before {
        top: -10px;
    }

    #modernNavbar .navbar-toggler-icon::after {
        bottom: -10px;
    }*/

.side-menu {
    position: fixed;
    top: 0;
    left: -100%;
    width: 75vw;
    height: 100vh;
    z-index: 1050;
    padding-top: 60px;
    transition: left 0.3s ease;
    overflow-y: auto;
}

    .side-menu.show {
        left: 0;
    }

/*======== Navbar-Ryt Design Start =========*/

/*.header_Rt{
	padding: 0px;
}
.header_Rt{
	float: left;
	width: 100%;
	position: relative;
	padding: 8px 0 0 0;
}
.navRight{
	float: left;
	width: 100%;
}
.navRight .navbar-nav{
	float: right;
}
.navRight .navbar-nav .nav-item:nth-child(1){
	padding-left: 0px;
}
.navRight .navbar-nav .nav-item{
	padding: 10px 0px 10px 34px;
}
.navRight .navbar-nav .nav-link{
	color: #fff;
	font-weight: bold;
	font-size: 20px;
	padding: 0px;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
}
.navRight .navbar-nav .nav-link:hover{
	color: #3c3c3c;
}
.navRight .Bootstrap_Nav{
	float: left;
	width: 100%;
	padding: 0 0 0 3%;
	display: block;
}
.navRight .dropdown-toggle::after{
	top: 4px;
	position: relative;
}
.navRight .dropdown-menu.show{
	border: none;
	background: #02b674;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	-ms-border-radius: 0px;
	-o-border-radius: 0px;
	border-radius: 0px;
	padding: 0px;
}
.navRight .dropdown-menu.show a{
	color: #fff;
	border-bottom: 1px solid #fff;
}
.navRight .dropdown-menu.show a:hover{
	color: #3c3c3c;
}*/


/* ****Updated Code**** */
/* Logo transition */
#mainLogo {
    transition: opacity 0.4s ease, transform 0.4s ease;
    /* width: 60%; */
}

#modernNavbar.scrolled #mainLogo {
    content: url("../images/Logo.png");
    /* new logo on scroll */
    transform: scale(0.95);
}

/*#mainLogo {
    transition: opacity 0.4s ease, transform 0.4s ease;
}

#modernNavbar.scrolled #mainLogo {
    content: url("../images/Logo.png");
    transform: scale(0.95);
}*/

/* Dropdown list code start here  */


/* 🔹 Disable underline hover ONLY on the dropdown toggle */
.no-underline-toggle:hover,
.no-underline-toggle:focus {
    text-decoration: none !important;
}

/* 🔹 Remove animated underline (::after) ONLY on the toggle */
.no-underline-toggle::after {
    display: none !important;
}

/* 🔹 BUT keep underline effect on dropdown items */
.dropdown-menu .dropdown-item:hover {
    text-decoration: underline !important;
}

.dropdown-item.active,
.dropdown-item:active {
    background-color: var(--primary-color);
}

/* Dropdown list code end here  */

/* Smooth logo animation */

#mainLogo {
    transition: opacity 0.3s ease, transform 0.3s ease;
    width: 48%;
}

#modernNavbar.scrolled #mainLogo {
    transform: scale(0.9);
}

.navbar-nav {
    margin: -6px 0 0 0;
}

/* Navbar End Here  */

.hero {
    background: linear-gradient(135deg, #1f4e99, #315faa);
    color: #fff;
    padding: 190px 15px 100px;
    text-align: center;
    overflow: hidden;
    position: relative;
    border-bottom-left-radius: 90px;
    border-bottom-right-radius: 90px;
}

.heroBtn {
    width: 20%;
    /* float: left; */
    /* margin: 10px 0 0 0; */
    display: inline-block;
}

.hero h1 {
    font-size: 3.75rem;
    font-weight: 800;
    text-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
    color: #fff;
}

.hero p {
    font-size: 1.35rem;
    opacity: 0.9;
    margin-top: 20px;
    max-width: 650px;
    margin-left: auto;
    margin-right: auto;
    color: #fff;
}

.btn-primary {
    /* margin-top: 30px; */
    /* font-weight: 700;
    border-radius: 50px;
    padding: 14px 40px;
    background: linear-gradient(45deg,
            #315faa,
            #173b73);
    box-shadow: 0 5px 20px rgba(49, 95, 170, 0.5);
    background: linear-gradient(135deg, #9d474d, #f45661) !important;
    border: none;
    border-color: #e1535d;
    transition: background 0.4s ease; */
    /*background: linear-gradient(135deg, #9d474d, #f45661) !important;*/
    background: linear-gradient(45deg, #ff5252, #ff867c) !important;
    border-color: #f45661;
    border-radius: 50px;
    font-family: 'Poppins', sans-serif;
    transition: all 0.3s ease;
}

    .btn-primary:hover {
        background: linear-gradient(45deg, #173b73, #315faa);
        /* box-shadow: 0 8px 30px rgba(23, 59, 115, 0.7); */
        box-shadow: unset;
    }

.btn-success {
    background: linear-gradient(135deg, var(--primary-color), #1e88e5);
    border-color: var(--primary-color);
    border-radius: 50px;
    font-family: 'Poppins', sans-serif;
    transition: all 0.3s ease;
    /* background-color: initial;
    background-image: linear-gradient(#f9f9f9, #d92c4b 50%);
    border-radius: 42px;
    box-shadow: 0 2px 2px rgba(57, 31, 91, .24), 0 8px 12px rgba(179, 132, 201, .4);
    border: 3px solid #e5082f; */
}

    .btn-success:hover {
        background-color: var(--primary-color);
        border-color: var(--primary-color);
    }

/* Services Section */
/* Section Titles */
h1.section-title,
h2.section-title {
    font-weight: 700;
    text-align: center;
    margin-bottom: 20px;
    color: var(--primary-color);
    letter-spacing: 0.08em;
    font-family: 'Poppins', sans-serif;
    position: relative;
    font-size: 32px;
}

    h1.section-title::after,
    h2.section-title::after {
        content: '';
        width: 90px;
        height: 4px;
        background: var(--primary-color);
        display: block;
        margin: 15px auto 0;
        border-radius: 3px;
        box-shadow: 0 2px 12px rgba(31, 78, 153, 0.6);
    }

.banner {
    width: 100%;
    float: left;
}

    .banner .carousel-control-prev,
    .banner .carousel-control-next {
        display: none;
    }

/* About-Us Section Start Here */

.AboutUs_Mn {
    width: 100%;
    float: left;
    padding: 60px 0 0 0;
    position: relative;
    overflow-x: hidden;
}

/* Animated Images */
.floating-img {
    position: absolute;
    width: 230px;
    opacity: 0;
    transition: 1.2s ease-in-out;
}

/* Left image */
.left-img {
    left: -200px;
    top: 80px;
}

/* Right image */
.right-img {
    right: -200px;
    bottom: 80px;
}

.floating-img.show {
    opacity: 1;
}

.left-img.show {
    left: 20px;
}

.right-img.show {
    right: 20px;
}

.shape_Our,
.shapes3 {
    width: 100%;
    height: auto;
}

/* About-Us Section End Here */
/* Services Section */
.OurServ {
    width: 100%;
    float: left;
    /* padding: 50px 0 70px 0; */
    padding: 0 0 0 0;
    background: #eef4ff;
}

.service-box {
    background: #fff;
    border-radius: 20px;
    padding: 40px 25px;
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.08);
    text-align: center;
    transition: transform 0.4s ease, box-shadow 0.4s ease;
    cursor: default;
}

    .service-box img {
        width: 25%;
    }

    .service-box:hover {
        transform: translateY(-15px) scale(1.05);
        box-shadow: 0 20px 45px rgba(31, 78, 153, 0.2);
        cursor: pointer;
    }

    .service-box i {
        font-size: 48px;
        color: var(--primary-color);
        margin-bottom: 18px;
        transition: color 0.3s ease;
    }

    .service-box:hover i {
        color: #ffdd57;
        transform: rotate(15deg);
        transition: transform 0.4s ease;
    }

    .service-box h4 {
        font-weight: 700;
        margin-bottom: 12px;
    }

    .service-box p {
        font-size: 15px;
        color: #555;
        min-height: 68px;
    }

/* Teacher's Manual Section Start Here */
.TeachMan,
.TeachManLft,
.TeachManRyt {
    width: 100%;
    float: left;
}

.TeachMan {
    background: #fff;
    padding: 0 0;
    /* background-image: url('../images/bgImg.png');
    background-repeat: no-repeat; */
}

.AnimateBg {
    position: absolute;
    opacity: .2;
    animation: phoneFloat 4s ease-in-out infinite;
    right: -260px;
    top: 10%;
}

.MainBg {
    position: relative;
}

    .MainBg::after {
        /* bottom: 0;
    background-size: contain; */
        /* background: url('../images/overlay-bottom.png') bottom center no-repeat; */
    }

    .MainBg::before,
    .MainBg::after {
        position: absolute;
        content: "";
        width: 100%;
        height: 85px;
        left: 0;
        z-index: 1;
    }

.TeachManLft {
    margin: 6% 0 0 0;
}

.TeachManRyt .owl-item img {
    width: 45% !important;
    margin: auto;
    border: 1px solid #d4d4d4;
    padding: 4px;
}

.TeachManRyt .owl-dots {
    display: none;
}

.TeachManRyt .owl-nav button {
    height: 30px;
    width: 30px;
    background: var(--primary-color) !important;
    color: #fff !important;
    border-radius: 50% !important;
    position: relative;
}

    .TeachManRyt .owl-nav button span {
        font-size: 31px !important;
        font-weight: 200;
        position: absolute;
        top: 43%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

.TeachManRyt1,
.TeachManRyt2 {
    width: 100%;
    float: left;
}

/* Best Product Section Design Start Here */

.BestProd {
    width: 100%;
    float: left;
    /*padding: 60px 0 0 0;*/
    background: #eef4ff;
}

.glass-card {
    box-shadow: 0 8px 30px rgba(27, 60, 120, 0.10);
    background: rgba(255, 255, 255, 0.68);
    overflow: hidden;
    transform: translateY(0);
    transition: transform .3s, box-shadow .3s;
    min-height: 440px;
}

    .glass-card:hover {
        transform: translateY(-7px) scale(1.027);
        box-shadow: 0 13px 40px rgba(27, 60, 120, 0.18);
    }

.glass-card-body {
    background: var(--primary-color);
}

.collection-img {
    height: 320px;
    object-fit: cover;
    transition: transform .4s;
    border: 1px solid rgba(0, 0, 0, .4);
}

.glass-card:hover .collection-img {
    transform: scale(1.09) rotate(-1.5deg);
}

.btn.shadow {
    box-shadow: 0 2px 10px rgba(27, 60, 120, 0.10);
}

.carousel-indicators [data-bs-target] {
    width: 13px;
    height: 13px;
    background-color: #174a9a;
    border-radius: 50%;
}

#collectionsCarousel {
    padding: 0 0 70px 0;
}

    #collectionsCarousel .owl-dots {
        display: none;
    }

    #collectionsCarousel .owl-nav .owl-prev,
    #collectionsCarousel .owl-nav .owl-next {
        height: 30px;
        width: 30px;
        border: 1px solid rgba(0, 0, 0, .12);
        border-radius: 50%;
        background: var(--primary-color);
        position: relative;
    }

    #collectionsCarousel .owl-nav {
        text-align: center;
        margin: 20px 0 0 0;
    }

        #collectionsCarousel .owl-nav .owl-prev {
            margin: 0 5px 0 0;
        }

        #collectionsCarousel .owl-nav .owl-next {
            margin: 0 0 0 5px;
        }

            #collectionsCarousel .owl-nav .owl-prev span,
            #collectionsCarousel .owl-nav .owl-next span {
                font-size: 30px;
                color: #fff;
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                font-weight: 500;
            }

    #collectionsCarousel .carousel-control-prev-icon {
        background-image: var(--primary-color) !important;
        position: relative;
    }

    #collectionsCarousel .carousel-control-next-icon {
        background-image: var(--primary-color) !important;
        position: relative;
    }

        #collectionsCarousel .carousel-control-prev-icon i,
        #collectionsCarousel .carousel-control-next-icon i {
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
        }

    #collectionsCarousel .carousel-control-prev {
        left: -12%;
    }

    #collectionsCarousel .carousel-control-next {
        right: -12%;
    }


/*Digital Support Section Start*/
.webSuportMn {
    width: 100%;
    float: left;
    position: relative;
    /*height: 35vw;*/
    width: 100%;
}

.webSuport {
    margin: 0 0 60px 0;
}

.webSuport_Lft,
.webSuport_Ryt {
    width: 100%;
    float: left;
}

.webSuport_Lft {
    margin: 8% 0 0 0;
}

.webSupImg {
    width: 15vw;
    height: 15vw;
    border-radius: 50%;
    left: 62%;
    top: 25%;
    cursor: pointer;
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175);
    text-align: center;
    background: #fff;
    position: absolute;
}

.webSupTxt {
    font-family: oswal;
    font-size: 1.7vw;
    font-weight: 700;
    color: #3e429b;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.treLearn {
    position: absolute;
    left: -48%;
    top: -47%;
    width: 195%;
    height: auto;
    opacity: .3;
    animation: animName 30s linear infinite;
    z-index: -1;
}

@keyframes animName {
    0% {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(1turn);
    }
}
/*Digital Support Section End*/

/* Login Step section start here */
.loginStep {
    width: 100%;
    float: left;
    /* padding: 40px 0 0 0; */
    padding: 60px 0 0 0;
    position: relative;
}

    .loginStep .AnimateBg {
        left: 0;
    }

.loginStepItm {
    width: 93%;
    float: left;
    box-shadow: rgba(90, 150, 234, 0.2) 0px 7px 29px 0px;
    border-radius: 10px;
    padding: 15px 0;
    position: relative;
    background: #fff;
}

    .loginStepItm::after {
        content: "\21E2";
        position: absolute;
        top: 50%;
        right: -38px;
        transform: translateY(-50%);
        font-size: 32px;
        color: #1f4e99;
        animation: arrowMove 1.5s infinite;
    }

/* Arrow animation */
@keyframes arrowMove {
    0% {
        transform: translate(0, -50%);
        opacity: 0.5;
    }

    50% {
        transform: translate(8px, -50%);
        opacity: 1;
    }

    100% {
        transform: translate(0, -50%);
        opacity: 0.5;
    }
}

.loginStepMn .col-xxl-3:last-child .loginStepItm::after {
    display: none;
}

.loginStepMn {
    width: 100%;
    float: left;
    margin: 0px 0 100px 0;
}

/* .loginStepItm:after{
    content: '.....>';
    color: var(--primary-color);
} */

.loginStepImg img {
    width: 30%;
}

.loginStepImg,
.loginStepTxt {
    width: 100%;
    float: left;
    text-align: center;
}

.loginStepTxt {
    width: 100%;
    float: left;
    margin-top: 8px;
}

    .loginStepTxt h3 {
        color: var(--primary-color);
        font-size: 18px;
        font-family: 'Poppins', sans-serif;
        font-weight: 550;
    }

    .loginStepTxt p {
        font-family: 'Poppins', sans-serif;
        font-size: 15px;
    }


/* Login Step section end here  */

/* App linking Start Desgin Start Here  */
.AppLink {
    width: 100%;
    float: left;
    background: #eef4ff;
    /* background: linear-gradient(180deg, #eef5ff, #ffffff); */
    /* border-radius: 40px; */
    padding: 70px 0 80px 0;
    position: relative;
}

.AppLink_Mn {
    /* background: var(--primary-color); */
}

.AppLink_L,
.AppLink_R {
    width: 100%;
    float: left;
}

    .AppLink_L img {
        width: 78%;
        /* animation: phoneFloat 4s ease-in-out infinite; */
    }

/* Phone Mockup Animation  */
@keyframes phoneFloat {

    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-15px);
    }
}

.AppLink_R {
    margin: 8% 0 0 0;
}

    .AppLink_R h2.section-title {
        text-align: left;
        color: var(--primary-color);
    }

        .AppLink_R h2.section-title::after {
            margin: 15px 0 0 0;
            background: var(--primary-color);
        }

    .AppLink_R p {
        color: var(--primary-color);
    }

/* .AppLink_L .circle {
    position: relative;
    margin: 20px;
    height: 600px;
    width: 600px;
    border-radius: 50%;
    position: absolute;
    margin: 20px;
    height: 550px;
    width: 550px;
    border-radius: 50%;
    top: 0;
    left: 0;
}

.AppLink_L .circle::before {
  position: absolute;
  content: '';
  height: calc(100% + 10px);
  width: calc(100% + 10px);
  border: 5px dotted var(--primary-color);
  top: 0;
  left: 0%;
  border-radius: inherit;
  animation: spin 100s linear infinite;
} */

/* App linking Start Desgin End Here  */

/* Footer Start Here  */
.footer-link3 {
    color: #b6bfd6;
}

.footer-link4 {
    color: #b6bfd6;
    text-decoration: none;
    transition: color .18s;
}

    .footer-link4:hover,
    .footer-link4:focus {
        color: #61d0ff;
        text-decoration: underline;
    }

.footer-social4 {
    width: 32px;
    height: 32px;
    background: #243245;
    color: #a8d8fa;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    transition: background .18s, color .18s, transform .16s;
}

    .footer-social4:hover {
        background: #61d0ff;
        color: #16202c;
        transform: translateY(-2px) scale(1.13);
    }

.footer-newsletter {
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
}

.footer-modern-bg,
.footer-content {
    background: none;
    width: 100%;
    float: left;
}

    /* .footer-content {
    background: linear-gradient(135deg, #1f4e99, #163c78, #102a56);
} */

    .footer-modern-bg img {
        width: 58%;
    }

select.form-select {
    color: #4a4747;
    opacity: 1;
}

input.form-control::placeholder,
select.form-select::placeholder {
    color: #999;
    opacity: 1;
}

@media (max-width: 768px) {
    .footer-newsletter {
        border-radius: 0;
    }
}

/* Login Page Design Start Here  */
.LoginMn.wrapper {
    width: 100%;
    float: left;
    /* height: 100vh; */
    background: #eef4fd;
    padding: 50px 0 90px 0;
    position: relative;
    overflow: hidden;
    /* background-image: url('../images/TechBg.png');
    background-repeat: no-repeat; */
    /* animation: mover 1s infinite alternate; */
    /* display: table-cell;
    vertical-align: middle;
    font-family: 'Dosis', sans-serif; */
}

    .LoginMn.wrapper::before {
        content: "";
        position: absolute;
        inset: 0;
        background-image: url("../images/TechBg.png");
        /* image-2 */
        background-size: 120%;
        background-repeat: no-repeat;
        background-position: center;
        animation: bgFloat 25s linear infinite;
        opacity: 0.07;
        z-index: 0;
    }

@keyframes bgFloat {
    0% {
        background-position: 0% 50%;
        transform: scale(1);
    }

    50% {
        background-position: 100% 50%;
        transform: scale(1.1);
    }

    100% {
        background-position: 0% 50%;
        transform: scale(1);
    }
}

.sign-panels {
    /* width: 650px; */
    background: #fff;
    /* padding: 40px 40px; */
    /* padding: 25px; */
    /* margin: 40px auto; */
    /*border-radius: 20px;*/
    text-align: center;
}

.login,
.signup,
.recover-password {
    position: relative;
}

.LoginMn .title {
    color: #9f9f9f;
}

.LoginMn label {
    float: left;
    font-weight: 500;
    width: 100%;
    text-align: left;
    font-size: 14px;
}

.LoginMn .title span {
    display: block;
    font-size: 27px;
    font-weight: 550;
    color: var(--primary-color);
    text-transform: uppercase;
}

.LoginMn .title p {
    font-size: 20px;
    font-weight: 500;
}

.LoginMn .btn-face,
.LoginMn .btn-twitter {
    color: #fff;
    display: inline-block;
    width: 200px;
    font-size: 20px;
    height: 50px;
    border-radius: 50px;
    text-decoration: none;
    padding: 11px 0;
    font-weight: 500;
}

    .LoginMn .btn-face .fa,
    .LoginMn .btn-twitter .fa {
        margin-right: 5px;
    }

.LoginMn .btn-face {
    background: #5397d7;
    margin-right: 25px;
}

.LoginMn .btn-twitter {
    background: #40b9e0;
}

.LoginMn .or {
    margin: 35px 0;
    font-weight: 600;
    color: #9f9f9f;
}

    .LoginMn .or:after {
        content: '';
        display: block;
        width: 100%;
        height: 1px;
        background: #cecece;
        position: absolute;
        margin-top: -10px;
        z-index: 0;
    }

    .LoginMn .or span {
        display: block;
        background: #fff;
        width: 50px;
        margin: auto;
        position: relative;
        z-index: 2;
    }

.LoginMn .sign-panels .form-select,
.LoginMn .sign-panels .form-control {
    /* width: 100%;
    display: block;
    margin-bottom: 15px;
    height: 50px;
    border-radius: 50px;
    border: none;
    background: #ededed;
    text-align: left;
    padding: 15px;
    font-size: 15px;
    color: #7c7c7c;
    font-weight: 500; */
    height: 48px;
    border-radius: 12px;
    border: 1px solid #d0d7e1;
    transition: all .3s ease;
}

.LoginMn .sign-panels input::placeholder,
.LoginMn .sign-panels select::placeholder {
    text-align: left;
    float: left;
    font-family: 'Poppins', sans-serif;
    font-size: 14px;
}

.LoginMn .sign-panels input:focus {
    outline: none;
}

/* .LoginMn .sign-panels input[type="checkbox"] {
    display: none;
} */

/*.LoginMn .sign-panels input[type="checkbox"] + label {
    display: block;
    width: 50%;
    text-align: left;
    padding-left: 60px;
    cursor: pointer;
    color: #828282;
    font-weight: 500;
    margin-top: 10px;
    float: left;
    height: 50px;
    padding-top: 15px;
}*/

/*.LoginMn .sign-panels input[type="checkbox"] + label:before {
        content: '';
        display: block;
        width: 15px;
        height: 15px;
        background: #dbdbdb;
        position: absolute;
        left: 30px;
        border-radius: 50%;
        border: 2px solid white;
        box-shadow: 0 0 0 5px #ededed;
        -webkit-transition: all .3s ease;
        transition: all .3s ease;
    }*/

.LoginMn .sign-panels input[type="checkbox"]:checked + label:before {
    background: #FF5722;
    box-shadow: 0 0 0 5px #FF5722;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
}

.LoginMn .btn-signin {
    display: inline-block;
    width: 50%;
    margin-top: 10px;
    height: 50px;
    background: #ec581e;
    border-radius: 50px;
    padding: 11px;
    font-size: 20px;
    color: #fff;
    text-decoration: none;
    font-weight: 500;
    border: none;
    box-shadow: none;
    cursor: pointer;
}

.LoginMn .btn-reset,
.LoginMn .btn-member,
.LoginMn .btn-fade {
    font-size: 16px;
    font-weight: 500;
    /* text-decoration: none; 
    color: #9f9f9f;
    display: block; */
    /*width: 210px;*/
    /* margin: 30px auto 0;
}

.LoginMn .btn-member {
    /* margin-top: 15px; */
}

    .LoginMn .btn-reset .fa,
    .LoginMn .btn-member .fa {
        margin-left: 6px;
    }

.LoginMn .notification p {
    font-size: 20px;
    font-weight: 600;
    color: #9f9f9f;
}

.LoginMn .notification span {
    color: #ec581e;
}

.LoginMn .error {
    display: block;
    color: #ec581e;
    font-size: 20px;
    font-weight: 600;
    margin: 15px 0;
}

.LoginMn .radioBtn {
    width: auto;
    float: left;
    padding: 0 5px;
}

    .LoginMn .radioBtn input {
        margin: 0 0 3px 0;
    }

    .LoginMn .radioBtn label {
        margin: 0 0 0 2px;
    }

/* New code start */
.loginLft,
.loginRyt {
    width: 100%;
    float: left;
}

.loginLft {
    position: relative;
    background: #fff;
}

    /* .loginLft::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("../images/.png");
    background-size: 120%;
    background-repeat: no-repeat;
    background-position: center;
    animation: bgFloat 25s linear infinite;
    opacity: 0.07;
    z-index: 0;
} */

    .loginLft img,
    .PassLft img {
        width: 60%;
        margin: 7% 0 0 0;
        /* animation: mover 1s infinite alternate; */
    }

.loginRyt,
.PassRyt {
    padding: 30px 30px 0 30px;
    border-left: 1px solid #c1d4f1;
    background: #fff;
}

    .loginRyt img,
    .PassRyt img,
    .signupRyt img {
        width: 15%;
    }

/* .loginLft img:nth-child(1) {
    animation: mover 1s infinite alternate;
    position: absolute;
    left: -7%;
    top: -44px;
    width: 75%;
    height: auto !important;
    opacity: .08;
}

.loginLft img:nth-child(2) {
    width: 50%;
} */

@keyframes mover {
    0% {
        transform: translateY(0);
    }

    to {
        transform: translateY(-10px);
    }
}

.sign-panels .SignInBtn {
    margin: 45px auto 0 auto !important;
    width: 27% !important;
    display: block;
}

/* New code end */

/* Sign-up section start here  */
.signup,
.signupLft,
.signupRyt {
    width: 100%;
    float: left;
}

.signup {
    background: #fff;
}

.signupLft {
    margin: 24% 0 0 0;
}

    .signupLft img {
        width: 65%;
    }

.signupRyt {
    padding: 30px 30px 0 30px;
    border-left: 1px solid #c1d4f1;
}

    .signupRyt h5 {
        font-size: 16px;
    }

/*.signupRyt img {
        width: 8%;
    }*/

.sign-panels .nav-tabs {
    justify-content: center;
    border-bottom: 1px solid var(--primary-color);
    margin: 0 0 30px 0;
}

    .sign-panels .nav-tabs .nav-item.show .nav-link,
    .sign-panels .nav-tabs .nav-link.active {
        color: #fff !important;
        background: linear-gradient(135deg, var(--primary-color), #1e88e5);
        ;
    }

    .sign-panels .nav-tabs .nav-link:active {
        color: #fff !important;
    }

    .sign-panels .nav-tabs .nav-link {
        /* background-color: initial;
    background-image: linear-gradient(#f9f9f9, #d92c4b 50%);
    border-radius: 42px;
    box-shadow: 0 2px 2px rgba(57, 31, 91, .24),
        0 8px 12px rgba(179, 132, 201, .4); */
        border: 3px solid #e5082f;
        color: #000;
        margin: 0 10px 20px 0;
        font-weight: 500;
        font-family: 'Poppins', sans-serif;
        border: 1px solid #ebebeb;
        padding: 7px 16px;
        border-radius: 50px;
        background: #f1f1f1;
        box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, .075);
    }

.recover-password,
.PassLft,
.PassRyt {
    width: 100%;
    float: left;
}

/* Sign-up section end here  */

/* About-us page design start here  */
.Cancellation {
    width: 100%;
    float: left;
    padding: 50px 0;
}

.AllSameTxt {
    float: left;
    width: 100%;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 8px 30px rgba(33, 37, 41, 0.06);
    border: 1px solid rgba(31, 78, 153, 0.06);
    padding: 20px;
}

.AllSameTxt p,
.AllSameTxt ul li,
.AllSameTxt ol li {
    float: left;
    width: 100%;
    color: #2c2c2c;
    font-size: 16px;
    line-height: 30px;
    font-weight: 400;
    text-align: justify;
}

/* Abount-us page design end here */

/* Teacher Dashboard Design Start Here */
.DashboardMn {
    width: 100%;
    float: left;
    padding: 50px 0;
}

.dashboard-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2rem;
    max-width: 1200px;
    margin: 0 auto 40px;
    /*box-shadow: 0 14px 38px rgba(13, 116, 245, 0.15);*/
    padding: 20px 0;
}

    .dashboard-row .module-card {
        background: #fff;
        border-radius: 14px;
        box-shadow: 0 4px 24px rgba(33, 38, 59, 0.10);
        padding: 30px 20px 26px;
        min-width: 250px;
        max-width: 320px;
        text-align: center;
        transition: box-shadow .22s, transform .22s;
        border: none;
        cursor: pointer;
        border: 1.5px solid transparent;
    }

        .dashboard-row .module-card:hover {
            box-shadow: 0 14px 38px rgba(13, 116, 245, 0.15);
            transform: translateY(-6px) scale(1.06);
            border: 1.5px solid var(--primary-color);
        }

    .dashboard-row .mod-icon {
        font-size: 2.8rem;
        color: var(--primary-color);
        margin-bottom: 14px;
        transition: color .18s;
    }

        .dashboard-row .mod-icon img {
            width: 30%;
        }

    .dashboard-row .module-card:hover .mod-icon {
        color: #EA5455;
    }

    .dashboard-row .mod-title {
        font-size: 1.22rem;
        font-weight: 600;
        color: #333;
        margin-bottom: 8px;
        font-family: 'Poppins', sans-serif;
    }

    .dashboard-row .mod-desc {
        font-size: 15px;
        color: #7A7A7A;
        margin-bottom: 16px;
        font-family: 'Poppins', sans-serif;
    }

    .dashboard-row .mod-btn {
        border-radius: 23px;
        border: none;
        font-weight: 500;
        background: #EA5455;
        color: #fff;
        padding: 7px 24px;
        transition: background 0.16s;
    }

    .dashboard-row .module-card:hover .mod-btn {
        background: var(--primary-color);
    }

@media (max-width: 900px) {
    .dashboard-row {
        flex-direction: column;
        align-items: center;
        gap: 1.2rem;
    }
}

/* Smart-Learning Page Design Start Here  */
.allSec_Hero {
    width: 100%;
    float: left;
    padding: unset !important;
}

    /* .allSec_Hero .hero {
    padding: 40px 15px 100px;
} */

    .allSec_Hero .hero h1 {
        font-size: 35px;
    }

    .allSec_Hero .section-title,
    .section-title {
        width: 100%;
        float: left;
    }

.hero-search .form-control {
    width: 50%;
    margin: auto;
    border-radius: 25px;
    padding: 10px 15px;
}

/* CLASS TAGS */
.class-tag {
    background: white;
    border: 1px solid #d9dfea;
    padding: 10px 22px;
    margin: 6px;
    border-radius: 30px;
    color: var(--primary-color);
    font-size: 14px;
    transition: 0.3s;
    cursor: pointer;
    display: inline-block;
}

    .class-tag:hover {
        background: var(--primary-color);
        color: white;
        transform: translateY(-2px);
        box-shadow: 1px solid #e0e6f3;
    }

/* SUBJECT CARDS */
.subject-card {
    background: white;
    padding: 25px;
    border-radius: 16px;
    text-align: center;
    border: 1px solid var(--primary-color);
    transition: 0.3s;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    min-height: 190px;
}

    .subject-card h6 a,
    .book-card h6 a {
        color: #212529 !important;
    }

    .subject-card:hover {
        transform: translateY(-8px);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
    }

.subject-icon {
    width: 75px;
    height: 75px;
    border-radius: 50%;
    /* background: var(--primary-color); */
    color: white;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 30px;
    margin-bottom: 12px;
}

    .subject-icon img {
        width: 100%;
    }

/* BOOK CARDS */
.book-card {
    background: white;
    border-radius: 16px;
    padding: 18px;
    border: 1px solid #e0e6f3;
    transition: 0.3s;
    text-align: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    width: 262px;
    height: 428px;
}

    .book-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.18);
    }

    .book-card img {
        width: 198px;
        height: 267px;
        border-radius: 10px;
        object-fit: cover;
    }

/* .explore-btn {
    background: var(--primary-color);
    color: white;
    border-radius: 25px;
    padding: 8px 20px;
    font-weight: 600;
} */

/* Smart-Learning-Chapter-List Page Design Start Here */
.SmrtLrng_ChptLst {
    width: 100%;
    float: left;
}

    .SmrtLrng_ChptLst .main-card {
        margin: 40px 0 60px 0;
    }

    /* CHAPTER ITEM */
    .SmrtLrng_ChptLst .chapter-item {
        background: #fff;
        border: 1px solid #d9e5ff;
        border-radius: 14px;
        padding: 16px 20px;
        margin-bottom: 15px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        transition: 0.3s ease;
        cursor: pointer;
    }

        .SmrtLrng_ChptLst .chapter-item:hover {
            transform: translateX(6px);
            box-shadow: 0px 10px 18px rgba(0, 0, 0, 0.12);
            border-color: var(--primary-color);
        }

    .SmrtLrng_ChptLst .chapter-info {
        display: flex;
        align-items: center;
        gap: 14px;
    }

    .SmrtLrng_ChptLst .chapter-icon {
        width: 48px;
        height: 48px;
        /* background: var(--primary-color); */
        border: 2px solid var(--primary-color);
        color: white;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 22px;
        transition: 0.3s;
    }

        .SmrtLrng_ChptLst .chapter-icon img {
            width: 70%;
        }

    .SmrtLrng_ChptLst .chapter-item:hover .chapter-icon {
        transform: scale(1.1);
    }

    .SmrtLrng_ChptLst .chapter-title {
        font-size: 16px;
        font-weight: 550 !important;
        color: var(--primary-color);
    }

    .SmrtLrng_ChptLst .chapter-progress {
        font-size: 13px;
        opacity: 0.8;
        color: #db1919;
    }

    /* ACCESS BUTTON */
    .SmrtLrng_ChptLst .access-btn {
        background: var(--primary-color);
        color: white;
        padding: 7px 16px;
        border-radius: 20px;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 1px;
        border: none;
        transition: 0.3s;
    }

        .SmrtLrng_ChptLst .access-btn:hover {
            background: #173f7d;
            transform: scale(1.07);
        }

/* Smart-Learning-Chapter-Details Page Design Start Here  */
/* Page Container */
.page-wrapper {
    max-width: 1100px;
    margin: auto;
    padding-bottom: 50px;
}

/* Content Card */
.content-card {
    background: #fff;
    padding: 30px;
    border-radius: 18px;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.08);
    border: 1px solid #e6e6e6;
    animation: fadeIn 0.7s;
}

/* Sidebar Topics */
.topic-btn {
    background: #fff;
    border: 2px solid #dfe7f5;
    padding: 15px 20px;
    border-radius: 15px;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    transition: 0.25s;
    cursor: pointer;
}

    .topic-btn a {
        font-size: 14px;
        font-weight: 400;
    }

    .topic-btn:hover {
        background: #f7faff;
        border-color: #1f4e99;
        transform: translateX(5px);
    }

    .topic-btn i {
        color: #1f4e99;
        font-size: 20px;
        margin-right: 12px;
    }

    .topic-btn img {
        width: 20%;
    }

/* Animations */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Progress Bar */
.progress-container {
    /*background: #dce6f8;*/
    height: 12px;
    border-radius: 20px;
    overflow: hidden;
    margin-top: 10px;
    width: 50%;
    margin: auto;
}

.progress-bar-custom {
    background: #1f4e99;
}

/* Smart-Learning-Chapter-Details Page Design End Here  */

/* Smart-Learning-Practice-Type Page Design Start Here  */
/* header */
.hero {
    background: var(--primary-color);
    color: #fff;
    padding: 44px 18px;
    text-align: center;
    border-bottom-left-radius: 60px;
    border-bottom-right-radius: 60px;
    box-shadow: 0 8px 30px rgba(31, 78, 153, 0.12);
    position: relative;
}

    .hero h1 {
        font-size: 28px;
        font-weight: 700;
        /*margin: 0 0 14px;*/
    }

.search-pill {
    display: inline-flex;
    align-items: center;
    width: clamp(320px, 60%, 780px);
    max-width: 900px;
    background: #fff;
    border-radius: 30px;
    padding: 8px 14px;
    box-shadow: 0 6px 18px rgba(31, 78, 153, 0.12);
    gap: 10px;
}

    .search-pill input {
        border: 0;
        outline: none;
        flex: 1;
        padding: 10px 6px;
        font-size: 14px;
    }

    .search-pill .btn {
        background: var(--primary-color);
        border-radius: 20px;
        padding: 6px 14px;
        border: 0;
        color: #fff;
        box-shadow: 0 4px 12px rgba(31, 78, 153, 0.18);
    }

.hero .btn-primary {
    display: block;
    width: 14%;
    margin: 15px auto 0 auto;
}


/* top small nav chip */
.top-chip {
    max-width: 1100px;
    margin: -28px auto 22px;
    padding: 0 12px;
    display: flex;
    align-items: center;
    gap: 12px;
    transform: translateY(0);
    transition: transform .28s ease;
    z-index: 30;
}

.chip-left {
    background: #fff;
    border-radius: 12px;
    padding: 10px 12px;
    display: flex;
    /* justify-content: center; */
    gap: 10px;
    box-shadow: 0 8px 30px rgba(33, 37, 41, 0.06);
    border: 1px solid rgba(31, 78, 153, 0.06);
    flex: 1;
    align-items: center;
}

.back-btn {
    /* width: 60px;
    height: 46px;
    background: var(--primary-color);
    box-shadow: 0 6px 18px rgba(31, 78, 153, 0.12);
    border-radius: 50%; */
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform .18s ease;
}

    .back-btn a {
        color: #fff;
        width: 50px;
        height: 50px;
        background: var(--primary-color);
        box-shadow: 0 6px 18px rgba(31, 78, 153, 0.12);
        border-radius: 50%;
        position: relative;
        text-align: center;
    }

        .back-btn a i {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            font-size: 18px;
        }

    .back-btn:hover {
        transform: translateX(-4px);
    }

.section-title {
    font-weight: 600;
    color: var(--primary-color);
    /*margin-left: 8px;*/
}

/* layout container */
.page {
    max-width: 1100px;
    margin: 28px auto 70px auto;
    padding: 0 18px;
    min-height: 40vh;
    /*min-height: 40vh;
    max-height: 100vh;*/
}

/* card */
.card-surface {
    background: #fff;
    border-radius: var(--card-radius);
    padding: 22px;
    box-shadow: 0 10px 50px rgba(31, 78, 153, 0.06);
    border: 1px solid rgba(31, 78, 153, 0.06);
    overflow: hidden;
}

/* accordion look (pill items) */
.quiz-item {
    background: #fafbff;
    border-radius: 10px;
    border: 1px solid rgba(31, 78, 153, 0.06);
    padding: 12px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
    margin-bottom: 12px;
    cursor: pointer;
}

    .quiz-item:hover {
        transform: translateY(-4px);
        box-shadow: 0 10px 30px rgba(31, 78, 153, 0.06);
        background: #fff;
    }

.quiz-left {
    display: flex;
    align-items: center;
    gap: 12px;
}

.quiz-index {
    background: #fff;
    color: var(--primary-color);
    border-radius: 10px;
    padding: 8px 10px;
    min-width: 46px;
    text-align: center;
    font-weight: 700;
    border: 1px solid rgba(31, 78, 153, 0.08);
}

.quiz-title {
    font-weight: 600;
    color: #111;
}

.quiz-actions .btn {
    border-radius: 20px;
    padding: 6px 14px;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(180deg, var(--primary-color), #15386f);
    border: 0;
    box-shadow: 0 6px 18px rgba(31, 78, 153, 0.14);
}

/* expanded content */
.item-body {
    margin-top: 10px;
    padding: 14px;
    border-radius: 10px;
    background: #fbfdff;
    border: 1px solid rgba(31, 78, 153, 0.04);
    display: none;
    animation: fadeSlide .28s ease forwards;
}

@keyframes fadeSlide {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Smart-Learning-Practice-Type Page Design End Here */

/* Smart-Learning-Practice Page Design Start Here */

/* Question Card */

.question-wrapper {
    background: #fff;
    padding: 25px;
    border-radius: 15px;
    border: 1px solid #e8f0ff;
    animation: fadeIn 0.6s ease;
    width: 100%;
    float: left;
    margin: 0 0 70px 0;
}

    .question-wrapper h5 {
        font-size: 16px;
    }

/* Custom Radio Buttons */
.custom-radio {
    /* display: flex; */
    display: table;
    align-items: center;
    font-size: 16px;
    margin-bottom: 15px;
    cursor: pointer;
    position: relative;
    padding-left: 35px;
}

    .custom-radio input {
        position: absolute;
        opacity: 0;
    }

.radio-mark {
    width: 20px;
    height: 20px;
    border: 2px solid #1f4e99;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 2px;
    transition: 0.3s;
}

.custom-radio input:checked + .radio-mark {
    background: #1f4e99;
}

/* Animation */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Wrong and Correct Answer Animated Label  */
.answer-label {
    padding: 12px 20px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 16px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    opacity: 0;
    transform: translateY(10px);
    transition: 0.4s ease;
}

/* Green - Correct */
.correct-label {
    background: rgba(34, 197, 94, 0.15);
    border-left: 5px solid #22c55e;
    color: #0d8d43;
}

/* Red - Wrong */
.wrong-label {
    background: rgba(239, 68, 68, 0.15);
    border-left: 5px solid #ef4444;
    color: #b71c1c;
}

/* Fade-In Animation */
.animate-label.show {
    opacity: 1;
    transform: translateY(0);
}



/* Smart-Learning-Practice Page Design End Here */
/* DataEntry-QAnswer page design start here  */
.DataEntry {
    width: 100%;
    float: left;
    padding: 50px 0;
}

.DataEntry_Mn {
    width: 100%;
    float: left;
    background-color: #ffffff;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    overflow-x: hidden;
}

    .DataEntry_Mn .form-select,
    .DataEntry_Mn .form-control {
        border-radius: 12px;
        padding: 12px;
        border: 2px solid #e0e0e0;
        transition: all 0.3s;
    }

    .DataEntry_Mn label,
    .DataEntry_Mn label {
        color: var(--primary-color);
        font-family: 'Poppins', sans-serif;
        margin: 0 0 0 5px;
        font-weight: 500;
        /*width:100%;*/
    }

    .DataEntry_Mn .gender-group {
        display: flex;
        gap: 1.5rem;
        flex-wrap: wrap;
    }

    .DataEntry_Mn .gender-option {
        display: flex;
        align-items: center;
        gap: 10px;
        cursor: pointer;
        font-weight: 500;
        position: relative;
        padding: 6px 10px;
        border-radius: 10px;
        transition: .25s ease;
    }

        .DataEntry_Mn .gender-option:hover {
            background: rgba(31, 78, 153, 0.06);
            transform: translateY(-3px);
        }

        .DataEntry_Mn .gender-option input {
            display: none;
        }

    .DataEntry_Mn table tr .btn {
        font-size: 15px;
    }

    /* Custom circular radio */
    .DataEntry_Mn .checkmark {
        width: 16px;
        height: 16px;
        border-radius: 50%;
        border: 2px solid var(--primary-color);
        position: relative;
        transition: .25s ease;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        /* Inner animated dot */
        .DataEntry_Mn .checkmark::after {
            content: "";
            width: 8px;
            height: 8px;
            background: var(--primary-color);
            border-radius: 50%;
            transform: scale(0);
            transition: .25s cubic-bezier(.2, .9, .3, 1);
        }

    /* Checked State */
    .DataEntry_Mn .gender-option input:checked + .checkmark::after {
        transform: scale(1);
    }

    .DataEntry_Mn .gender-option input:checked + .checkmark {
        box-shadow: 0 0 10px rgba(31, 78, 153, 0.3);
        transform: scale(1.15);
    }

/*Smart-Learning-Test page design start*/

.SmrtLrngTst_chip .back-btn {
    display: inline-block;
    vertical-align: middle;
}

.SmrtLrngTst_chip .section-title {
    width: 75%;
    display: inline-block;
    vertical-align: middle;
    float: unset;
}

.SmrtLrngTst_chip .heroBtn {
    width: 18%;
    display: inline-block;
    vertical-align: middle;
}

/* Generate-Chapter-Test page design start here  */
.GnrtChptr_Tst {
    width: 100%;
    float: left;
    padding: 60px 0;
}

.GnrtChptr_TstMn {
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
    width: 100%;
    float: left;
}

/* Generate-Chapter-Test page design end here  */

/* Select-Chapter-Test page design start here  */
.gnrt_Chptr_Tst {
    width: 100%;
    float: left;
    padding: 50px 0 70px 0;
}

.slctChptrQuesInr {
    width: 100%;
    float: left;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
    padding: 20px;
}

.smartLrng_PrctHdr {
    width: 100%;
    float: left;
    background: var(--primary-color);
    padding: 15px 15px 15px 15px;
}

.CreatTst {
    background: #163c78;
    color: #fff;
    padding: 5px;
    font-family: 'Poppins', sans-serif;
    border: 1px solid rgba(255,255,255,.3);
}

    .CreatTst:hover {
        color: #fff;
    }

.smartLrng_PrctHdrM {
    width: 100%;
    float: left;
    text-align: center;
}

.smartLrng_PrctHdr h2 {
    color: #fff;
    font-size: 22px;
    font-family: 'Poppins', sans-serif;
    margin-bottom: 0 !important;
    text-transform: uppercase;
    margin: 6px 0 0 0;
}

.smartLrng_PrctHdr .smartLrng_PrctHdrR {
    width: 100%;
}

.smartLrng_PrctHdrR .btn-action {
    float: right;
}

.slctChptr,
.slctChptrBdy {
    width: 100%;
    float: left;
}

.slctChptrBdy {
    padding: 13px;
    border-bottom: 1px solid rgba(0, 0, 0, .15);
    border-left: 1px solid rgba(0, 0, 0, .15);
    border-right: 1px solid rgba(0, 0, 0, .15);
    text-align: center;
}

    .slctChptrBdy span {
        font-family: 'Poppins', sans-serif;
        font-weight: 600;
        color: #000;
        font-size: 14px;
        text-transform: capitalize;
    }

.slctChptrQuesTtlInr {
    width: 100%;
    float: left;
    padding: 10px;
    text-align: right;
    border-left: 1px solid rgba(0, 0, 0, .12);
    border-right: 1px solid rgba(0, 0, 0, .12);
}

    .slctChptrQuesTtlInr .btn-primary,
    .slctChptrQuesTtlInr .btn-success {
        margin: 2px 0 2px 0;
    }

.slctChptrQues-mid.setTimeRow {
    background: var(--primary-color);
    padding: 10px;
    border-top: 1px solid rgba(255, 255, 255, .5);
}

.slctChptrQues-mid {
    width: 100%;
    float: left;
}

.slctChptrQues-midRyt {
    text-align: right;
}

    .slctChptrQues-midRyt label {
        color: #fff;
        font-family: 'Poppins', sans-serif;
    }

.slctChptrQues-btm {
    width: 100%;
    float: left;
    padding: 15px 20px;
    background: white;
    border: 1px solid rgba(0, 0, 0, .12);
}

.slctChptrQues-btmTp {
    width: 100%;
    float: left;
    padding: 6px 15px 0 15px;
}

.slctChptrQues-btmTpL,
.slctChptrQues-btmTpM,
.slctChptrQues-btmTpR {
    width: 100%;
    float: left;
}

.slctChptrQues-btmTp span {
    display: inline-block;
}

.slctChptrQues-btmTpM {
    text-align: center;
}

.slctChptrQues-btm h4 {
    font-weight: 600;
    font-family: 'Poppins', sans-serif;
    font-size: 25px;
    text-decoration: underline;
}

.slctChptrQues-btmTpM h4 {
    text-transform: capitalize;
    font-weight: 550;
    font-size: 25px;
}

.slctChptrQues-btmTpR {
    text-align: right;
}

.slctChptrQues-btmTtl {
    width: 100%;
    float: left;
    text-align: center;
}

    .slctChptrQues-btmTtl h5 {
        text-transform: capitalize;
        font-family: 'Noto Sans', sans-serif;
        font-weight: 500;
        font-size: 18px;
    }

    .slctChptrQues-btmTtl .slctChptr_Adrs {
        font-size: 20px;
    }

    .slctChptrQues-btmTtl .slctChptr_Ttl {
        font-size: 15px;
    }

    .slctChptrQues-btmTtl .slctChptr_Chptr {
        font-size: 14px;
    }

.slctChptr_Inst {
    width: 100%;
    float: left;
    padding: 10px;
    border-top: 2px solid var(--primary-color);
    border-bottom: 2px solid var(--primary-color);
}

    .slctChptr_Inst p {
        font-weight: bold;
        font-family: 'Poppins', sans-serif;
        margin-bottom: 5px;
    }

    .slctChptr_Inst span {
        font-family: 'Poppins', sans-serif;
        font-size: 15px;
    }

.slctChptr_Tbl {
    width: 100%;
    float: left;
    padding: 20px;
    display: block;
}

    .slctChptr_Tbl tr td {
        font-size: 15px;
    }

    .slctChptr_Tbl tbody,
    .slctChptr_Tbl tbody tr,
    .slctChptr_Tbl tbody tr td {
        width: 100%;
        float: left;
    }

    .slctChptr_Tbl .question {
        width: 100%;
        float: left;
    }

.ques-ttl {
    width: 99%;
    float: left;
    margin: 0 0 10px 0;
}

    .ques-ttl span.ques {
        display: inline-block;
    }

        .ques-ttl span.ques:nth-child(2) {
            float: right;
        }

.ques-checkTbl input[type="checkbox"] {
    margin: 4px 4px 0 0;
    vertical-align: top;
    width: 15px;
}

.ques-checkTbl label {
    vertical-align: top;
    width: 96%;
    font-size: 15px;
}

.saveTstBtn {
    width: 50% !important;
}

.test-btn {
    width: 100%;
    float: left;
    padding: 10px 0 0 0;
    text-align: right;
}

    .test-btn span {
        margin: 2px;
        width: auto;
        float: left;
    }

.genRandTest-Btm {
    width: 100%;
    float: left;
    background: #fff;
    padding: 20px 20px 20px 20px;
    margin-top: 30px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
    /* border: 1px solid rgba(0,0,0,.12); */
    border-radius: 25px;
}

.btn-check:active + .btn-success,
.btn-check:checked + .btn-success,
.btn-success.active,
.btn-success:active,
.show > .btn-success.dropdown-toggle {
    color: #fff;
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color);
}

.btn-check:active + .btn-primary:focus,
.btn-check:checked + .btn-primary:focus,
.btn-primary.active:focus,
.btn-primary:active:focus,
.show > .btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 .25rem #f45661 !important;
    background-color: #f45661 !important;
    border-color: #f45661 !important;
}

.btn-check:focus + .btn-success,
.btn-success:focus {
    color: #fff;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25);
}

.RndmTst-Ques p,
.question span,
.question labe {
    font-size: 15px;
}

.RndmTst-QuesMrks span {
    font-weight: 550;
    font-size: 15px;
}

/* Select-Chapter-Test page design end here  */

/* Admin-Query-Con page design start here  */
/* CARD */

.AdminQry_Con {
    width: 100%;
    float: left;
    padding: 25px 0 25px 0;
}

    .AdminQry_Con .question-card,
    .AdminQry_Con .answer-card {
        background: #fff;
        border-radius: 18px;
        padding: 25px;
        margin-bottom: 25px;
        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);
        animation: fadeInUp 0.6s ease;
        width: 95%;
        margin: 0 auto 2% auto;
    }

    .AdminQry_Con .question-card {
        border-left: 6px solid #e1625b;
    }

    .AdminQry_Con .answer-card {
        border-left: 6px solid #2fbe8a;
    }


@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.AdminQry_Con .profile-img {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: #e3ebff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 26px;
    color: #1f4e99;
}

.AdminQry_Con .vote-box i {
    font-size: 24px;
    cursor: pointer;
    transition: 0.3s;
    color: var(--primary-color);
}

    .AdminQry_Con .vote-box i:hover {
        color: #1f4e99;
        transform: scale(1.2);
    }

.AdminQry_Con .expert-label {
    color: #1f4e99;
    font-weight: 700;
}

.query-table .row-card {
    background: #fff;
    margin-bottom: 8px;
    padding: 20px;
    border-radius: 12px;
    transition: all 0.3s ease;
    border-left: 5px solid #93bcde !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
    margin: 0 0 25px 0;
    cursor: auto;
}

.query-table .btn {
    font-size: 16px;
}

.badge-views {
    background: #e3f2fd;
    color: #0d6efd;
}

.badge {
    border-radius: 15px;
    padding: 5px 10px;
    font-size: 0.8rem;
}

.badge-answers {
    background: #e6f4ea;
    color: #198754;
}

.query-title a {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--primary-color);
    text-transform: capitalize;
    cursor: unset;
}

.query-meta {
    font-size: 0.9rem;
    color: #555;
}

.queryBodyD1 {
    width: 100%;
    float: left;
    margin: 10px 0 10px 0;
    background: #f7f7f7;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    border-left: 4px solid #27b03d;
}

.queryBodyQues {
    border-left: 4px solid #e1625b;
}

.D1Hdr {
    width: auto;
    float: left;
    padding: 10px 15px 7px 15px;
    background: #cfe2ff;
    font-size: 0.75rem;
    padding: 6px 15px;
    border-radius: 20px;
    color: var(--primary-color);
}

    .D1Hdr span {
        display: inline-block;
    }

        .D1Hdr span p, .D1Hdr1 span p {
            font-size: 13px;
            font-weight: 550;
            margin: 0;
            color: var(--primary-color);
        }

            .D1Hdr1 span p a {
                color: var(--primary-color);
            }

.D1Hdr1 {
    width: auto;
    float: right;
    background: #cfe2ff;
    font-size: 0.75rem;
    padding: 6px 15px;
    border-radius: 20px;
    color: var(--primary-color);
}

.D1Bdy {
    width: 100%;
    float: left;
    padding: 20px 5px 0 20px;
}

    .D1Bdy .card-header-info {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .D1Bdy .user-info {
        display: flex;
        align-items: center;
        margin-bottom: 10px;
    }

    .D1Bdy .user-avatar {
        width: 42px;
        height: 42px;
        border-radius: 50%;
        color: #fff;
        background: var(--primary-color);
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: bold;
        font-size: 18px;
        margin-right: 12px;
    }

    .D1Bdy .vote-buttons {
        text-align: center;
    }

.file-upload-area {
    border: 2px dashed #0d6efd;
    padding: 25px 20px 10px 20px;
    border-radius: 12px;
    background-color: #f9fbff;
    transition: background 0.3s ease, border-color 0.3s ease;
}

    .file-upload-area .AskExprtTxt {
        float: right;
    }

.AskExprtBtn {
    text-align: right;
    margin: 12px 0 0 0;
}

.queryBdy {
    width: 100%;
    float: left;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    border: 1px solid rgba(0, 0, 0, .12);
    padding: 20px 20px 20px 20px;
}

.quesBtn {
    display: block;
    width: 30%;
    margin: 10px auto 10px auto;
}


/* Admin-Query-Con page design end here */

/* Query-View page design start here */
.userTime {
    font-size: 13px;
}

.queryView {
    width: 100%;
    float: left;
}

    .queryView .filter-card {
        background: #fff;
        border-radius: 12px;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
        transition: .3s;
    }

        .queryView .filter-card:hover {
            transform: translateY(-3px);
        }

    /* Clear Button */
    .queryView .clear-btn {
        background: #ff4d4f;
        border: none;
        color: #fff;
        padding: 2px 10px;
        border-radius: 25px;
        font-size: 12px;
        font-family: 'Poppins', sans-serif;
    }

/* Table Card */
.table-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
}

.table-header {
    background: #1f4e99;
    color: #fff;
}

.table tbody tr:hover {
    background: #eaf1ff;
    cursor: pointer;
}

.table tbody tr th,
.table tbody tr td {
    font-family: 'Poppins', sans-serif;
    font-size: 14px;
    cursor: auto;
}

/* Query-View page design end here */

/* Ask-Query page design start here */
.askQueryMn {
    width: 100%;
    float: left;
    padding: 20px 0 20px 20px;
}

    .askQueryMn .form-card {
        background: #ffffff;
        border-radius: 20px;
        padding: 35px;
        box-shadow: 0px 6px 25px rgba(0, 0, 0, 0.1);
        /*animation: fadeInUp 0.8s;*/
    }

    .askQueryMn .input-box {
        background: #f6faff;
        padding: 14px 18px;
        border-radius: 12px;
        border: 1px solid #dce9ff;
        display: flex;
        align-items: center;
        gap: 10px;
        transition: 0.3s;
    }

        .askQueryMn .input-box:hover {
            border-color: #1f4e99;
            background: #eef4ff;
        }

        .askQueryMn .input-box i {
            font-size: 18px;
            color: #1f4e99;
        }

        .askQueryMn .input-box select,
        .askQueryMn .input-box input {
            border: none;
            background: transparent;
            width: 100%;
            outline: none;
            font-size: 15px;
        }

    .askQueryMn textarea {
        border-radius: 12px !important;
        border-color: #dce9ff !important;
    }

/* .submit-btn {
    background: #1f4e99;
    padding: 10px 28px;
    color: white;
    border-radius: 30px;
    font-size: 17px;
    transition: .3s;
} */

.submit-btn:hover {
    background: #153a74;
    transform: scale(1.05);
}

.query-table tr:nth-child(1),
.query-table tr:last-child {
    display: none;
}

.query-table,
.query-table tr,
.query-table tr td {
    border: unset;
}

    .query-table tbody tr:hover {
        background: unset;
    }

/* RECENT QUERIES */
.recent-card {
    background: #ffffff;
    border-radius: 20px;
    padding: 25px;
    box-shadow: 0px 6px 25px rgba(0, 0, 0, 0.1);
    animation: fadeIn 1s;
}

.recent-title {
    font-size: 22px;
    font-weight: 700;
    color: #1f4e99;
    margin-bottom: 15px;
}

.recent-list a {
    text-decoration: none;
    color: #1f4e99;
    display: block;
    padding: 6px 0;
    border-bottom: 1px dashed #dedede;
    transition: 0.2s;
}

    .recent-list a:hover {
        padding-left: 8px;
        color: #153a74;
    }

/* @keyframes fadeInUp {
    from {
        transform: translateY(30px);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes fadeInDown {
    from {
        transform: translateY(-30px);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
} */

/* Ask-Query page design end here */

/* Error Page Design Start Here  */

.error {
    width: 100%;
    float: left;
    padding: 90px 0;
    position: relative;
}

.float-item {
    position: absolute;
    width: 70px;
    opacity: 0.25;
    animation: float 6s infinite ease-in-out;
}

.item1 {
    top: 8%;
    left: 12%;
    animation-delay: 0s;
}

.item2 {
    top: 70%;
    left: 8%;
    animation-delay: 1s;
}

.item3 {
    top: 20%;
    right: 10%;
    animation-delay: 0.5s;
}

.item4 {
    bottom: 12%;
    right: 18%;
    animation-delay: 1.5s;
}

@keyframes float {
    0% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-18px);
    }

    100% {
        transform: translateY(0px);
    }
}

/* Main container with torn paper illusion */
.error-box {
    background: #ffffff;
    width: 90%;
    max-width: 750px;
    padding: 60px 40px;
    text-align: center;
    border-radius: 25px;
    box-shadow: 0px 15px 45px rgba(0, 0, 0, 0.15);
    position: relative;
    animation: pop 0.9s ease-out;
    margin: auto;
}

    .error-box img {
        width: 45%;
    }

@keyframes pop {
    from {
        transform: scale(0.8);
        opacity: 0;
    }

    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* Torn paper hole */
.tear-hole {
    width: 200px;
    margin-bottom: 25px;
    animation: tearFloat 3s infinite ease-in-out;
}

@keyframes tearFloat {
    0% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-10px);
    }

    100% {
        transform: translateY(0px);
    }
}

/* .title {
    font-size: 4.5rem;
    font-weight: 800;
    color: #1f4e99;
    margin-bottom: 10px;
} */

.error-box h4 {
    color: var(--primary-color);
}

.sub {
    font-size: 17px;
    margin-bottom: 20px;
    color: #444;
}


.logo {
    width: 140px;
    margin-bottom: 20px;
}

/* Error Page Design End Here  */

/* Smart-Learning-Practice-FillUp Page Design Start Here  */
.quiz-question {
    font-size: 1.1rem;
    font-weight: 500;
    margin-bottom: 25px;
    color: #333;
    text-align: left;
    width: auto;
    display: inline-block;
}

.Revw-img11 {
    width: auto;
    display: inline-block;
}

.quiz-question .Sques {
    font-weight: 400;
    font-size: 16px;
}

/*.SmartLrng_Prctc_Btn {
    width: 100%;
    padding: 25px;
    text-align: center;
    float: left;
    border-top: 1px solid var(--primary-color);
}*/

.options .moreOption {
    border: 2px solid var(--primary-color);
    background: #fff;
    color: var(--primary-color);
    border-radius: 8px;
    padding: 10px 20px;
    margin: 10px 8px;
    font-weight: 600;
    transition: all 0.3s;
}

.blank-box {
    background: #e9ecef;
    border-radius: 6px;
    padding: 4px 10px;
    min-width: 120px;
    display: inline-block;
    text-align: center;
    font-weight: 600;
    color: var(--primary-color);
    background: #e6edf5;
    border: 2px dashed #88B6D7;
}

.SmartLrng_Prctc_Btn {
    width: 100%;
    padding: 25px 0;
    text-align: center;
    float: left;
    border-top: 1px dashed var(--primary-color);
}

#exampleModal .option-card {
    background: #fff;
    border-radius: 16px;
    padding: 30px 20px;
    text-align: center;
    transition: all 0.3s ease;
    border: 1px solid rgba(136, 182, 215, 0.3);
    box-shadow: 0 5px 15px rgba(39, 51, 94, 0.15);
}

    #exampleModal .option-card img {
        width: 25%;
    }

.RsltTblHdr h3 {
    font-size: 14px;
    font-weight: bold;
}

.TableDtaCrt span,
.TableDtaCrt a {
    font-size: 14px;
}

.radio-group {
    width: 100%;
    float: left;
}

    .radio-group label {
        margin-right: 18px;
        font-weight: 500;
        color: #333;
        width: auto;
        margin-left: 5px;
        float: right;
    }

.teacher-link {
    background: #f3f6fc;
    padding: 12px;
    border-radius: 12px;
    font-size: 14px;
    font-family: 'Poppins', sans-serif;
    text-align: left;
}

    .teacher-link a {
        color: var(--primary-color);
        font-weight: 600;
    }

.signin-text {
    text-align: center;
    margin-top: 12px;
    font-size: 14px;
}

    .signin-text a {
        color: var(--primary-color);
        font-weight: 600;
    }

.bottom-text {
    text-align: center;
    margin-top: 15px;
    font-size: 14px;
}

.link-right {
    float: right;
    font-size: 14px;
}

/* Class Section in Teacher Registration in Login Page  */
/* .checkbox-section {
    background: #f4f7f8;
    padding: 25px;
    border-radius: 15px;
    margin-top: 25px;
}

.checkbox-title {
    font-weight: 700;
    color: #1f4e99;
    font-size: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 15px;
}

.checkbox-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px 20px;
}

.checkbox-grid label {
    font-size: 15px;
    color: #444;
    cursor: pointer;
}

.checkbox-grid input {
    margin-right: 6px;
} */

.checkbox-section {
    background: #f4f7f8;
    padding: 25px;
    border-radius: 15px;
    /* margin-top: 25px; */
}

.checkbox-title {
    font-weight: 700;
    color: #1f4e99;
    font-size: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 15px;
}

/*.checkbox-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px 20px;
}*/

/* ✅ Proper alignment for checkbox + text */
.checkbox-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 15px;
    color: #444;
    cursor: pointer;
}

    .checkbox-item input[type="checkbox"] {
        width: 16px;
        height: 16px;
        margin: 0;
        /* removes default misalignment */
    }

.action_btns {
    border-top: 1px dashed var(--primary-color);
    padding: 15px 0 0 0;
    margin: 15px 0 0 0;
}

    .action_btns .btn {
        width: 40%;
    }

/* Smart-Learning-Practice-FillUp Page Design End Here  */

/* Contact-us page design start here  */
/* Contact Section */
.contact-container {
    margin-top: -50px;
    z-index: 9;
    position: relative;
    margin-bottom: 60px;
}

.contact-card {
    background: white;
    border-radius: 20px;
    padding: 40px;
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.08);
    animation: fadeInUp 0.8s ease;
}

/* Animation */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.info-box {
    background: #ffffff;
    border-radius: 15px;
    padding: 25px;
    margin-bottom: 20px;
    box-shadow: 0px 10px 25px rgba(0, 0, 0, 0.07);
    transition: all 0.3s ease;
}

    .info-box:hover {
        transform: translateY(-5px);
        box-shadow: 0px 15px 30px rgba(0, 0, 0, 0.1);
    }

    .info-box i {
        font-size: 30px;
        color: #1f4e99;
    }

    /* .info-box .form-control {
    border-radius: 12px;
    padding: 12px;
    border: 1px solid #d6dce5;
}

.info-box .form-control:focus {
    border-color: #1f4e99;
    box-shadow: 0 0 8px rgba(31, 78, 153, 0.3);
} */

    .info-box .info_img {
        width: 50px;
        height: 50px;
        display: inline-block;
        vertical-align: top;
        border: 1px solid rgba(0, 0, 0, .2);
        border-radius: 50%;
        text-align: center;
        position: relative;
    }

        .info-box .info_img img {
            width: 70%;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
        }

    .info-box .info_txt {
        width: 80%;
        display: inline-block;
        vertical-align: top;
        margin: 0 0 0 2px;
    }

        .info-box .info_txt h5 {
            color: var(--primary-color);
            font-weight: 550;
            font-size: 17px;
            margin: unset;
        }

        .info-box .info_txt p {
            font-size: 14px;
        }

.submit-btn {
    background: #1f4e99;
    color: white;
    padding: 12px 25px;
    border-radius: 12px;
    border: none;
    font-weight: 600;
    transition: 0.3s;
}

    .submit-btn:hover {
        background: #163a73;
        transform: translateY(-3px);
    }

@media(max-width: 768px) {
    .contact-card {
        padding: 25px;
    }
}

.glass-card {
    width: 290px;
    margin: auto;
}

.SbLstMnImg {
    float: left;
    width: 100%;
    position: relative;
    overflow: hidden;
    padding: 15px 0;
    height: 310px;
    background: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, .12);
    text-align: center;
}

.sLrngMnImg1 img {
    width: 188px;
    height: 257px;
    width: 198px;
    height: 267px;
}

.SbLstMn-1 img {
    transform: scale(0.9);
    transition: all .5s ease-in-out;
}

.SbLstMnImg img {
    display: inline-block;
    width: 208px;
    height: 280px;
    -webkit-box-shadow: 6px 6px 19px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 6px 6px 19px rgba(0, 0, 0, 0.3);
    -ms-box-shadow: 6px 6px 19px rgba(94, 26, 26, 0.3);
    -o-box-shadow: 6px 6px 19px rgba(0, 0, 0, 0.3);
    box-shadow: 6px 6px 19px rgba(0, 0, 0, 0.3);
}

.SbLstMnDtl {
    float: left;
    width: 100%;
    background: #fff;
    padding: 20px 16px;
    max-height: 228px;
    position: relative;
    padding: 12px 16px 0 16px;
    min-height: 130px;
    max-height: 240px;
}

    .SbLstMnDtl h5 {
        color: var(--primary-color);
        font-size: 16px;
        font-weight: 500;
    }

/*.SbLstMnDtl h5 a.btnTxt {
    color: #212529;
    width: 100%;
    font-weight: 500;
    font-size: 15px;
    float: left;
}*/

.sLrngLstMn .SbLstMnDtl {
    min-height: 130px;
    height: unset;
}

.SbLstMnDtl h5 .SmrtLrng_txt {
    color: var(--primary-color);
}

/* Contact-us page design end here  */

/* Teacher-Handbook Page Design Start Here  */
.teach_HandBk {
    width: 100%;
    float: left;
    padding: 0 0 70px 0;
}

    /* ============== TABS ============== */
    .teach_HandBk .nav-pills .nav-link {
        color: var(--primary-color);
        font-weight: 500;
        border-radius: 25px;
        padding: 4px 12px;
        margin: 5px;
        border: 1px solid var(--primary-color);
        font-size: 14px;
    }

        .teach_HandBk .nav-pills .nav-link.active {
            background: #1f4e99;
            color: #fff;
        }

    /* Prevent page flicker for single accordion */
    /* === Fix flicker for single accordion === */
    .teach_HandBk,
    .teach_HandBk main,
    .teach_HandBk .page {
        min-height: 20vh;
        max-height: 100vh;
    }


        /* ============== BOOK ITEM ============== */
        .teach_HandBk .book-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 12px 20px;
            border-bottom: 1px dashed #dbe3f3;
        }

            .teach_HandBk .book-row .book-name {
                font-size: 14px;
                font-family: 'Poppins', sans-serif;
            }

            .teach_HandBk .book-row:last-child {
                border-bottom: none;
            }

            .teach_HandBk .book-row:hover {
                background: #f7faff;
            }

            .teach_HandBk .book-row .btn-success {
                font-size: 13px;
            }

/* =========== */
.teach_HandBkItm {
    border: none;
    border-radius: 14px;
    margin-bottom: 15px;
    overflow: hidden;
    box-shadow: 0 10px 25px rgba(31, 78, 153, 0.12);
}

.teach_HandBkHdr {
    background: #1f4e99;
    color: #fff;
    padding: 7px 20px;
    width: 100%;
    float: left;
}

    .teach_HandBkHdr span:nth-child(1) {
        margin: 9px 0 0 0;
        display: inline-block;
        font-family: 'Poppins', sans-serif;
    }

    .teach_HandBkHdr span:nth-child(2) {
        float: right;
        font-size: 14px;
    }

/* Teacher-Handbook Page Design End Here  */

/* Teacher-Handbook-1 Design Start Here  */

.teach_hBook {
    width: 100%;
    float: left;
    padding: 60px 0;
    min-height: 70vh;
    max-height: 100vh;
}

.hndBk-lft,
.hndBk-ryt {
    width: 100%;
    float: left;
}

.handBkRow,
.hndBk-lft {
    background: linear-gradient(135deg, var(--primary-color), #446bab);
}

.teach_hBookList .accordion-item {
    margin: 0 0 15px 0;
    border: none !important;
}

.teach_hBookList .accordion-body {
    background: #fff;
    /* border-left: 4px solid #1e88e5; */
    border-left: 4px solid var(--primary-color);
    padding: 20px;
    border-radius: 0 0 10px 10px;
    /* animation: fadeIn 0.4s ease-in-out; */
}

.teach_hBookList .file-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px dashed #ddd;
}

.teach_hBookList .file-name {
    font-size: 15px;
    font-weight: 500;
    color: #333;
}

.teach_hBookList .file-size {
    font-size: 13px;
    color: #e53935;
}

.teach_hBookList .download-link {
    color: #1e88e5;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: 0.3s;
}

.teach_hBookList .accordion-button {
    background: linear-gradient(135deg, var(--primary-color), #446bab);
    color: #fff;
    font-family: 'Noto Sans', sans-serif;
    font-weight: 550;
}

.teach_hBookList .accordion-body {
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.teach_hBookList .nested-accordion .accordion-button {
    background: #eaf6ff;
    color: var(--primary-color);
}

    .teach_hBookList .nested-accordion .accordion-button:focus {
        background: var(--primary-color);
        color: #fff;
    }

/* Teacher-Handbook-1 Design End Here  */

/* Smart-Learning-Test-Result Page Design Start Here  */
.smrtLrng_Rslt .chip-left {
    box-shadow: unset;
    background: unset;
    border: unset;
}

.smrtLrng_RsltItm {
    width: 100%;
    float: left;
    background: #fff;
    border-radius: 16px;
    padding: 18px;
    text-align: center;
    box-shadow: 0 12px 30px rgba(31, 78, 153, 0.1);
}

    .smrtLrng_RsltItm p {
        margin-bottom: 6px;
        color: #6c757d;
        font-weight: 500;
        font-size: 15px;
    }

    .smrtLrng_RsltItm h2 {
        color: #1f4e99;
        font-weight: 700;
    }

.smrtLrng_RsltLft,
.smrtLrng_RsltRyt {
    width: 100%;
    float: left;
    background: #fff;
    /* border-radius: 18px; */
    padding: 25px;
    /* box-shadow: 0 18px 40px rgba(31, 78, 153, 0.12); */
}

.smrtLrng_RsltRyt {
    border-left: 1px solid rgba(0, 0, 0, .12);
}

.smrtLrng_RsltLft .card-title {
    font-weight: 600;
    color: #1f4e99;
    margin-bottom: 20px;
    font-size: 20px;
    text-align: center;
}

.smrtLrng_RsltLft .chart-circle {
    width: 180px;
    height: 180px;
    /*border-radius: 50%;
    background: conic-gradient(#dc3545 100%, #28a745 0%);*/
    margin: 0 auto 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 36px;
    font-weight: 700;
    animation: pop 1s ease;
}

    .smrtLrng_RsltLft .chart-circle small {
        font-size: 14px;
        font-weight: 400;
    }

.smrtLrng_RsltLft .legend {
    display: flex;
    justify-content: center;
    gap: 20px;
}

    .smrtLrng_RsltLft .legend .dot {
        width: 10px;
        height: 10px;
        display: inline-block;
        border-radius: 50%;
    }

.dot.green {
    background: #28a745;
}

.dot.red {
    background: #dc3545;
}

.smrtLrng_RsltRyt .card-title {
    font-weight: 600;
    color: #1f4e99;
    margin-bottom: 20px;
    font-size: 20px;
    text-align: center;
}

.smrtLrng_RsltRyt .analysis-list {
    list-style: none;
    padding: 0;
}

    .smrtLrng_RsltRyt .analysis-list li {
        display: flex;
        justify-content: space-between;
        padding: 10px 0;
        border-bottom: 1px dashed #dee2e6;
    }

    .smrtLrng_RsltRyt .analysis-list span {
        color: #6c757d;
    }

.smrtLrng_RsltRyt .progress-block {
    margin-top: 18px;
}

.smrtLrng_RsltRyt .progress {
    height: 8px;
    border-radius: 10px;
}

.smrtLrnc_RsltMsg {
    width: 100%;
    float: left;
}

    .smrtLrnc_RsltMsg .motivation h4 {
        color: #1f4e99;
        font-weight: 700;
    }

/* Smart-Learning-Test-Result Page Design End Here  */

/*DataEntry-SmartLearning Page Design Start Here*/
.dtaEntry_SLrngHdr {
    width: 100%;
    float: left;
    background: var(--primary-color);
}

    .dtaEntry_SLrngHdr span {
        display: inline-block;
    }

    .dtaEntry_SLrngHdr h5 {
        color: #fff;
        font-size: 21px;
        font-weight: 500;
        text-transform: uppercase;
        margin-top: 13px;
    }

    .dtaEntry_SLrngHdr span:last-child {
        float: right;
        margin: 8px 0 0 0;
    }

.dtaEntry_SLrngHdr {
    padding: 0 15px 8px 15px;
}

.dataEntryFrm-1 {
    width: 100%;
    float: left;
    border: 1px solid rgba(0, 0, 0, .15);
    padding: 10px 15px 16px 15px;
}

.qAnsTbl th {
    background: var(--primary-color);
    color: #fff;
    font-weight: 500;
}

.tblBtns .btn {
    font-size: 14px;
    margin: 2px 0 2px 0;
}

.gridPagination tr td {
    background: var(--primary-color);
    color: #fff;
    margin: 0 3px;
    display: inline-block;
    height: 30px;
    width: 30px;
    text-align: center;
    padding: 4px 0 0 0;
}

    .gridPagination tr td a {
        color: #fff !important;
    }

/*DataEntry-SmartLearning Page Design End Here*/

/*My Account Page Design Start Here*/

/* Sidebar */
.MyAcc .sidebar {
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    border-radius: 16px;
    padding: 10px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);
    animation: slideLeft 1s ease;
}

    .MyAcc .sidebar ul li img {
        width: 15%;
    }

.MyAcc .sidebar-title {
    font-weight: 600;
    margin-bottom: 15px;
    color: #0d47a1;
}

.MyAcc .sidebar .nav-link {
    color: #333;
    padding: 12px 15px;
    border-radius: 10px;
    margin-bottom: 8px;
    transition: all 0.3s ease;
}

    .MyAcc .sidebar .nav-link i {
        margin-right: 10px;
    }

    .MyAcc .sidebar .nav-link:hover,
    .MyAcc .sidebar .nav-link.active {
        background: linear-gradient(45deg, #1f4e99, #4e6fa4);
        color: #fff;
        transform: translateX(5px);
    }

/* Profile Card */
.MyAcc .profile-card {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(12px);
    border-radius: 18px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
    animation: fadeUp 1s ease;
}

.MyAcc .profile-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--primary-color);
    padding: 15px 10px;
}

    .MyAcc .profile-header img {
        width: 7%;
    }

    .MyAcc .profile-header h4 {
        margin: 0;
        font-weight: 500;
        font-size: 17px;
        color: #fff;
    }

    .MyAcc .profile-header p {
        margin: 0;
        font-size: 14px;
        color: #777;
    }

.MyAcc .btn-edit {
    background: linear-gradient(45deg, #ff5252, #ff867c);
    color: #fff;
    border-radius: 30px;
    padding: 8px 18px;
    border: none;
    transition: 0.3s;
}

    .MyAcc .btn-edit:hover {
        transform: scale(1.05);
    }

.MyAcc .profile-body table tr,
.MyAcc .profile-body table tr td {
    border: unset;
}

.MyAcc .profile-body table tr {
    border-bottom: 1px dashed rgba(31, 78, 153, .25);
}

    .MyAcc .profile-body table tr .ClassTbl tr {
        border-bottom: unset;
    }

    .MyAcc .profile-body table tr td {
        padding: 16px;
    }

        .MyAcc .profile-body table tr td label {
            margin: 0 0 0 5px;
        }

.MyAcc .profile-body table tbody tr td:nth-child(1) {
    color: var(--primary-color);
    opacity: .7;
}

.MyAcc .profile-body .ClassTbl tr td:nth-child(1) {
    color: var(--primary-color);
    opacity: 1;
}

.MyAcc .profile-body table tbody tr td {
    color: var(--primary-color);
    font-weight: 600;
    cursor: auto;
}

.MyAcc .profile-body .form-select,
.MyAcc .profile-body .form-control {
    border-radius: 12px;
    padding: 11px 8px;
    border: 1px solid #e0e0e0;
    font-size: 14px;
    font-weight: 400;
    transition: all 0.3s;
    color: #6a6363;
}

    .MyAcc .profile-body .form-control::placeholder {
        color: #6a6363;
    }
/* Info Boxes */
.MyAcc .info-box {
    margin-bottom: unset;
    background: unset;
    box-shadow: unset;
    padding: 0 10px;
}

    .MyAcc .info-box span {
        font-size: 13px;
        color: #888;
    }

    .MyAcc .info-box p {
        background: #f5f8ff;
        padding: 12px 15px;
        border-radius: 10px;
        font-weight: 500;
        margin-top: 5px;
        transition: 0.3s;
    }

        .MyAcc .info-box p:hover {
            background: #e3f2fd;
        }

/* Animations */
@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeDown {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideLeft {
    from {
        opacity: 0;
        transform: translateX(-40px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.form-select:disabled {
    background: #e9ecef !important;
}
/*My Account Page Design End Here*/

/*Test-Generator-Record page design start here*/
.CartTblHdr {
    background: var(--primary-color);
    color: #fff;
    padding: 7px 15px 2px 15px;
    text-align: center;
    font-size: 13px;
    width: 100%;
    margin: auto;
}

.saveTstTbl {
    font-size: 13px;
    width: 100%;
    float: left;
    margin: 0 0 70px 0;
    border: 1px solid rgba(0,0,0,.12);
}

.CartItmRow {
    padding: 10px 10px 10px 10px;
    text-align: center;
    width: 100%;
    border-bottom: 1px solid rgba(0,0,0,.12);
    margin: auto;
}

    .CartItmRow .mdlYesBtn,
    .CartItmRow .mdlNoBtn {
        font-size: 13px;
        margin: 2px 0 2px 0;
    }

/*Test-Generator-Record page design end here*/


