@import url('https://fonts.googleapis.com/css2?family=Cherry+Bomb+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
/*font-family: Quicksand, sans-serif;*/
@import url('https://fonts.googleapis.com/css2?family=Handlee&family=Zeyada&display=swap'); /*font-family: "Handlee", cursive; ##font-family: "Zeyada", cursive;*/

@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,200..900;1,200..900&display=swap'); /*Source Sans 3", sans-serif*/

/*ARABIC LANG*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Naskh+Arabic:wght@400..700&display=swap');

/*override footer*/
footer {
    background-color: #ffffff;
}

.body-container-ui2 {
	width: 98vw;
    height: 100vh;
	display: flex;
	margin: 0;
	padding: 0;
}
.lrn-main-container-ui2{
	display: flex;
	flex-direction: column;
}
/*new ui parent*/
.lrn-main-container-ui2.new-ui-parent{
	display: flex;
	flex-direction: column;
	width: 100%;
}
.ui2-nav-cntr{
	height: 20vh;
	display: flex;
	width: 98vw;
	font-family: "Cherry Bomb One", system-ui;
	font-weight: 400;
	font-style: normal;
}
.ui2-usr-cntr{
	height: 28vh;
	display: flex;
	justify-content: center;
	align-items: center;
}
.ui2-subjects-cntr{
	height: 45vh;
	display: flex;
	justify-content: center;
	color: black;
	margin-top: 7vh; /*5vh*/
}


.arr-bkc-cntr{
	width: 11%;
	display: flex;
    justify-content: center; /* Center horizontally */
    align-items: center;     /* Center vertically */
}
.usr-pfl-cntr{
	width: 89%;
	display: flex;
	
}
.zoo-nav-cntr{
	width: 30%;
	display: flex;
    justify-content: center; /* Center horizontally */
    align-items: center;     /* Center vertically */
	position: relative;
}
.usr-lnr-nav-pfl-cntr{
	width: 70%;
	display: flex;
}
.usr-lrn-pnt-cntr{
	width: 30%;
	display: flex;
    justify-content: center; /* Center horizontally */
    align-items: center;     /* Center vertically */
	position: relative;
}
.usr-settings-cntr{
	width: 20%;
	background-color:coral;
}
.usr-profile-avatar-cntr{
	width: 70%;
	display: flex;
    justify-content: center; /* Center horizontally */
    align-items: center;     /* Center vertically */
	position: relative;
}
.sub-subjects-cntr{
	width: 74%;
    border: solid 6px #ffffff;
    border-radius: 15px;
    padding: 0% 2%; /*0% 2%*/
    background-color: #21304d96;
}
.sub-subjects-item-cntr{
	display: flex;
	justify-content: space-evenly;
}
.sub-subjects-item{
	width: 45%;
	display: flex;
	justify-content: space-evenly;
	align-items: center;
	background-color: #FFF;
	border-radius: 15px;
	padding: 2% 2%;
}
.sub-itm-img-cntr{
	width: 30%;
}
.sub-itm-ttl-cntr{
	width: 70%;
    height: 100%;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.sub-itm-ttl-cntr span{
	font-family: "Cherry Bomb One", system-ui;
	font-size: 2rem;
}
.zoo-ttl-cntr{
	background-color: #ffffff;
	height: 50%;
	border-radius: 36px;
	color: #21304D;
	box-shadow: 0 10px 7px 0px rgba(45, 71, 26, 0.902), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
	display: flex;
    justify-content: center; /* Center horizontally */
    align-items: center;     /* Center vertically */
	width: 80%;
	z-index: 10;
}
.zoo-ttl-cntr span{
	font-size: 2.5rem;
}

.lp-ttl-cntr{
    border: none;
    border-radius: 36px;
    color: white;
    cursor: pointer;
    background: linear-gradient(to bottom, #fda031, #da5d09);
    transition: all 0.3s ease;
    height: 50%;
    width: 90%;
	display: flex;
	justify-content: center; /* Center horizontally */
    align-items: center;     /* Center vertically */
	box-shadow: 0 10px 7px 0px rgba(111, 49, 0, 0.9), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
	z-index: 10;
}
.usr-pfl-cntr-itm{
	border: none;
    border-radius: 36px;
    color: #21304D;
    cursor: pointer;
    background: #FFF;
    transition: all 0.3s ease;
    height: 50%;
    width: 70%;
	display: flex;
	justify-content: center; /* Center horizontally */
    align-items: center;     /* Center vertically */
	/*box-shadow: 0 10px 7px 0px rgba(111, 49, 0, 0.9), 0 2px 4px -1px rgba(0, 0, 0, 0.06);*/
	z-index: 10;
}
.ui2-nav-cntr .usr-pfl-cntr-itm a{
    color: #21304D;	
	font-family: "Cherry Bomb One", system-ui;
}
.under-lay-cntr{
	background-color: #6f3000;
	height: 51%;
	width: 91%;
	position: absolute;
	z-index: 1;
    border-radius: 36px;
	top: 29%;
}
.under-lay-zoo-cntr{
	background-color: #2d471a;
	height: 51%;
	width: 82%;
	position: absolute;
	z-index: 1;
    border-radius: 36px;
	top: 29%;
}
.under-lay-prl-cntr{
	background-color: #5132ff;
	height: 51%;
	width: 72%;
	position: absolute;
	z-index: 1;
    border-radius: 36px;
	top: 29%;
}
.lp-img-cntr{
	width: 30%;
}
.lp-txt-cntr{
	width: 70%;
	font-size: 2.4rem;
	padding-left: 10%;
}

.coin {
	max-width: 100%; 
	height: auto;
	transition: transform 0.5s ease;
	animation: coinFlip 1s ease infinite;
}

/* Keyframe animation for coin flip */
@keyframes coinFlip {
	0% {
		transform: scale(1) rotateY(0);
	}
	50% {
		transform: scale(1.5) rotateY(180deg);
	}
	100% {
		transform: scale(1) rotateY(360deg);
	}
}

.chv-down-fnt-aws{
	width: 20%;
	font-size: 3rem;
}
.usr-pfl-itm-txt{
	width: 40%;
	font-size: 3rem;
}
.usr-pfl-itm-avatar{
	width: 30%;
	background-color: antiquewhite;
    border-radius: 50%;
	padding: 1% 2%;
}

.usr-pfl-itm-avatar .avatar-default{
	max-width: 100%;
	max-height: 100%;
}
.usr-dbd-identify{
	width: 70%;
	padding: 3% 0%;
	display: flex;
}
.usr-db-pfl-img-cntr{
	width: 30%;
	display: flex;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
	border-radius: 50%;
}
.usr-db-pfl-nm-cntr{
	width: 70%;
	position: relative;
	display: flex;
	justify-content: flex-start;
    align-items: center;     /* Center vertically */
}
.usr-db-pfl-img-cntr img{
	max-width: 67%;
	background-color: aliceblue;
    border-radius: 50%;
    padding: 2%;
	box-shadow: rgba(81, 91, 108, 1) 0px 12px 0px, rgba(81, 91, 108, 0.22) 0px 15px 12px;
}
.usr-db-pfl-nm-itm{
	border: none;
    border-radius: 36px;
    color: #FFF;
    cursor: pointer;
    background: #21304D;
    transition: all 0.3s ease;
    height: 100%;
    width: 70%;
	display: flex;
	justify-content: center; /* Center horizontally */
    align-items: center;     /* Center vertically */
	/*box-shadow: 0 10px 7px 0px rgba(111, 49, 0, 0.9), 0 2px 4px -1px rgba(0, 0, 0, 0.06);*/
	z-index: 10;
	padding: 2%;
	position: relative;
}
.under-lay-prl-nm-cntr{
	background-color: rgb(81, 91, 108);
    height: 96%;
    width: 74%;
    position: absolute;
    z-index: 1;
    border-radius: 36px;
    top: 24%;
}
.usr-db-pfl-nm-itm{
	font-size: 3rem;
	font-family: "Cherry Bomb One", system-ui;
	text-align: center;
}
.triangle {
    width: 0;
    height: 0;
    border-top: 50px solid transparent;
    border-bottom: 50px solid transparent;
    border-right: 100px solid #21304D;
	border-radius: 10px;
	position: absolute;
    left: -5%;    
    /* For a smoother effect on the left point */
    transform: rotate(0.1deg);
}
.fas-left-car{
	color: #21304D;
	position: absolute;
    left: -4%;
    font-size: 5rem;
}
.sub-subjects-heading{
	color: #ffd100;
	font-size: 2rem;
	font-weight: bold;
	font-family: 'Poppins', sans-serif;
	font-weight: 500;
	font-style: normal;
	margin-bottom: 3%;
}
.sub-itm-img-cntr img{
	max-width: 100%;
	height: auto;
}

.itm-sbj-img-cntr img{
	width: 50%;
	height: auto;
}

.start-cont-btn {
  animation: hover-pulse 1s linear infinite;
  cursor: pointer;
}

@keyframes hover-pulse {
  25% {
    transform: scale(1.1);
  }
  75% {
    transform: scale(0.9);
  }
}

/*SKILLS PAGES*/
.ui2-usr-lrnr-cntr{
	display: flex;
	align-items: center;
    justify-content: center;
	font-family: "Poppins", sans-serif;
	font-weight: 400;
	font-style: normal;
}

.ui2-lnr-qstn-cntr{
	width: 70%;
	background-color: #ebffe6;
	border: solid 13px #FFF;
    border-radius: 100px;
}
.skill-instr-cntr{
	display: flex;
	align-items: center;
}
.aud-cntr{
	width: 10%;
}
.aud-cntr img{
	max-width: 100%;
}
.txt-instr-cntr{
	width: 90%;
}
.txt-instr-cntr label{
	color: #21304D;
}
.ui2-lnr-qstn-cntr .lnr-img-cntr img { /*override*/
    width: 10%;
}

.ui2-lnr-qstn-cntr .grp-shp>div, .ui2-lnr-qstn-cntr .jqry_grp-shp>div { /*override*/
    width: 18%;
    height: 135px;
    padding: 1% 1%;
    border-radius: 7px;
}
.ui2-lnr-qstn-cntr .dv-cntr-dbl-arrw span.arr-sz {/*override*/
    font-size: 3rem;
}
.ui2-lnr-qstn-cntr .lnr-qstn-box {
    margin: 0% 0%;
}
.ui2-lnr-qstn-cntr .grp-shp, .ui2-lnr-qstn-cntr .jqry_grp-shp {
    margin-bottom: 2%;
}
.ui2-lnr-qstn-cntr  .lrn-sbt-resp{
	font-family: 'work sans', sans serif;
}


.modal-txt-ttl{
	font-size: 3rem;
	font-family: "Cherry Bomb One", system-ui;
	text-align: center;
	margin: 0%;
}
.modal-ttl-txt-cntr{
	display: flex;
    /*justify-content: center;
    /*align-items: center;*/
	position: absolute;
	width: 100%;
	height: 100%;
    z-index: 1010;
	flex-direction: column;
}
.mdl-txt-cntr{
	margin-top: 4%;    
}

.bounce-in-cls{
	animation: bounce-in-ui2 2s ease 1;
	transform-origin: center; /* Ensure the transform happens from the center */
}
  
@keyframes bounce-in-ui2 {
    0% {
        opacity: 0;
        transform: scale(.3);
    }
    50% {
        opacity: 1;
        transform: scale(1.3);
    }
    70% { transform: scale(.9); }
    100% { transform: scale(1); }
}

.modal-overlay {
	display: flex;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	justify-content: center;
	align-items: center;
	z-index: 1000;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}

.modal-overlay.active {
	opacity: 1;
	visibility: visible;
}

.modal-content{
	border-radius: 5px;
	width: 80%;
	height: 80%;
	overflow: hidden;
	position: relative;
	transform: scale(1);
	opacity: 1;
	/*transition: transform 0.3s ease, opacity 0.3s ease;*/
	background: red; /*rgb(187,237,255);*/
	background: radial-gradient(circle, rgba(187,237,255,1) 0%, rgba(142,226,255,1) 100%);
}/*
.plain-modal-content{
	border-radius: 5px;
	max-width: 80%;
	max-height: 80%;
	overflow: hidden;
	position: relative;
	transform: scale(1);
	opacity: 1;
	transition: transform 0.3s ease, opacity 0.3s ease;
	background: rgb(187,237,255);
	background: radial-gradient(circle, rgba(187,237,255,1) 0%, rgba(142,226,255,1) 100%);
	z-index: 1001;
}*/

.modal-overlay.active .modal-content {
	transform: scale(1);
	opacity: 1;
}

.close-button {
	position: absolute;
	top: 10px;
	right: 10px;
	font-size: 24px;
	cursor: pointer;
	z-index: 1020;
}

/*
Correct wrong modal animation
.modal-crt-bg img{
	animation: pulse 2s ease-in-out infinite;
}

@keyframes pulse {
	25% {
		transform: scale(1.1);
	  }
	  75% {
		transform: scale(0.9);
	  }
}
*/

.ui2-bg-white .lnr-img-cntr{
	background-color: #FFF;
	padding: 1% 0%;
	border-radius: 15px;
}

.ui2-mrg-btm-0 .lnr-nsr-box {
    margin: 6% 0% 0% 0%;
}

.ui2-lnr-qstn-cntr .objects-by-numbers>div h3, .ui2-lnr-qstn-cntr .crt-ans-1 h3, .ui2-lnr-qstn-cntr .lnr-ans-0 h3 {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: bold;
    text-align: center;
	margin-top: -10%;
}

.sml-fnt-cntr{
	font-family: 'Source Sans Pro', sans-serif;
    font-weight: bold;
    text-align: center;
}

.ui2-lnr-qstn-cntr .text-input-bx .lrn-usr-input-box input[type=text] {
    height: 100px;
}

.ui2-mrg-btm-0 .lnr-nsr-box.dv-mgn-ovr {
    margin: 3% 0% 2% 0%;
}
.ui2-lnr-qstn-cntr .shaded-part-object{
	background-color: #FFF;
}
.ui2-lnr-qstn-cntr .shaded-part-object img {
    max-width: 25%;
}
.ui2-lnr-qstn-cntr .bx-itms-cnt-nmbr{
	text-align: center;
	display: flex;
	justify-content: center;
}
.ui2-lnr-qstn-cntr .vertical-mat-dsp>div {
    width: 100%;
}
.ui2-lnr-qstn-cntr .lbl-bx-1-dgt{
	letter-spacing: 40px;
}
.vertical-mat-dsp .bx-itms-cnt-nmbr {
	width: 84%;
}
.ui2-lnr-qstn-cntr .lnr-qstn-info-cntr div label {
    font-size: 3rem;
}
.ui2-lnr-qstn-cntr .bx-itm-3 b{
	text-align: center;
}

.ui2-lnr-qstn-cntr .balance-scale-container {
    position: relative;
}

.ui2-lnr-qstn-cntr .balance-scale {
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0px;
    margin: 0 auto;
    position: relative;
	background-color: #ffffff;
}

.ui2-lnr-qstn-cntr .images_pool {
    width: 36%;
    height: auto;
    object-fit: contain;
}
.ui2-lnr-qstn-cntr .left-object-name{
    font-size: 20px;
    position: absolute;
    /* top: 10px;
    left: -50%; */
    top: 155%;
    left: -36%;
    /* transform: translateX(-50%); */
    padding: 5px 10px;
    border-radius: 5px;
    font-weight: bold;
    text-align: center;
    z-index: 1;
    background-color: #00fff3;
}
.ui2-lnr-qstn-cntr .right-object-name {
    position: absolute;
    /* top: 20px;
    left: 100%; */
    top: 150%;
    left: 0%;
    /* transform: translateX(-50%); */
    background-color: #00fff3;
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    z-index: 1; 
}

.ui2-lnr-qstn-cntr .left-pan, .ui2-lnr-qstn-cntr .right-pan {
    position: absolute;
    width: 20%;
    height: 20%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
.ui2-lnr-qstn-cntr .right-pan {
    right: 15%;
    top: 39%;
}
.ui2-lnr-qstn-cntr .right-pan-in-cntr, .ui2-lnr-qstn-cntr .left-pan-in-cntr{
    position: relative;
    text-align:center;
}
.ui2-lnr-qstn-cntr .right-pan .right-pan-in-cntr .image_pool{
    width: 82%;
}
.ui2-lnr-qstn-cntr .balanced-weights .left-pan {
    left: 27%;
    top: 55%;
}

.ui2-lnr-qstn-cntr .balanced-weights .right-pan {
    right: 38%;
    top: 54%;
}

.ui2-lnr-qstn-cntr .lnr-ans-bx-sel#answerOptions_Cntr a {
    width: 30%;
}
.ui2-lnr-qstn-cntr .balanced-weights .left-object-name{
    top: 150%;
    left: -16%;
    width: max-content;
}
.ui2-lnr-qstn-cntr .balanced-weights .right-object-name{
    top: 138%;
    left: 33%;
    width: max-content;
}
.ui2-lnr-qstn-cntr .balanced-weights .left-pan, .ui2-lnr-qstn-cntr .balanced-weights .right-pan {
    width: 18%;
    height: 14%;
}
.ui2-lnr-qstn-cntr .wgh-mn-img-cntr img{
	width: 70%;
	height: auto;
}
.ui2-lnr-qstn-cntr .text-input-bx.sml-25-width .lrn-usr-input-box input[type=text] {
    width: 25%;
    font-size: 2.5rem;
}
.ui2-lnr-qstn-cntr .lnr-mny-img-cntr {
    margin-top: 0%;
	background-color: #ffffff;
	padding: 1% 0%;
}

.ui2-lnr-qstn-cntr .lnr-clk-fc-qstn-cntr{
	background-color: #ffffff;
}

.ui2-aud-mn-cntr{
	padding: 1% 0%;
    text-align: center;
}
.ui2-lnr-qstn-cntr .esmk-aud-vsl{
    margin: 0% 0%;
}
.qst-html-aud-cntr{
	font-family: 'work sans', sans serif;
}

.error-on-audio{
	background-color: #fff4f0;
}
.ui2-lnr-qstn-cntr .stn-qstn-bdy-cntr{
	font-family: 'work sans', sans serif;
}
.cmp-cntr{
	font-size: 1.5rem;
}

.qst-spn-cntr{
	display: inline-block;
	min-width: 10%;
	border-bottom: solid 5px #004dff;
}

.mrn-tp-btm-5{
	margin: 5% 0%;
}
.ui2-lnr-qstn-cntr .qstn-bdy-cntr-51 {
    font-size: 2rem;
    font-weight: bold;
}

.pulse-txt-on-blank {
	animation: scaleAndPulse 2s ease-in-out forwards;
	display: inline-block;
	background-color: #b2dbff;
	border-radius: 10px;
  }

@keyframes scaleAndPulse {
	0% {
		transform: scale(1.5);
		opacity: 0;
	}
	50% {
		transform: scale(1);
		opacity: 1;
	}
	75% {
		transform: scale(1.05);
	}
	100% {
		transform: scale(1);
		opacity: 1;
	}
}
.ui2-lnr-qstn-cntr .chld-fnt-input input[type=text] {
    font-family: 'Andika', sans-serif !important;
}
.ui2-lnr-qstn-cntr .msn-vwl-cntr {
    margin-top: 0%;
}
  
.ui2-mrg-btm-0 .lnr-nsr-box.npt-mrg-btm-5 {
    margin: 3% 0% 5% 0%;
}
.open-qst-spn-cntr {
	width: fit-content;
	padding: 0% 1%;
}
.qst-html-hint-aud-cntr .hnt-cntr {
    padding: 3% 0% 1% 0%;

}

.ui2-lnr-qstn-cntr .ui2-aud-mn-cntr label, .ui2-lnr-qstn-cntr .lnr-qstn-box .msn-vwl-cntr label {
    font-size: 1.5rem;
    border-radius: 10px;
    display: inline-block;
    padding: .5% 3%;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    letter-spacing: 5px;
    font-family: 'Andika', sans-serif !important;
}
.ui2-lnr-qstn-cntr .lnr-qstn-box .msn-vwl-cntr label{
	font-size: 5rem;
}
.ui2-lnr-qstn-cntr .visual-loader {
	padding: 0;
}

.report-ttl-cntr{
	font-size: 2rem;
	font-family: "Cherry Bomb One", system-ui;
}
.dtc-rpt-mn-cntr{
	display: flex;	
	font-family: "Cherry Bomb One", system-ui;
}
.dl-cntr-scr{
	width: 40%;
	display: flex;
    align-content: center;
    justify-content: center;
    flex-direction: column;
}
.brk-dwm-cntr{
	width: 60%;
	font-size: 2rem;
}
.score-counter-cntr{
	width: 90%;              /* Set the width of the circle */
	height: 90%;             /* Set the height of the circle (same as width) */
	background-color: #ffffff; /* Just to see the circle */
	border-radius: 50%;        /* Make it a circle */

	display: flex;             /* Enable flexbox */
	justify-content: center;   /* Center horizontally */
	align-items: center;       /* Center vertically */

	text-align: center;
	font-size: 7rem;
	border-bottom: solid 10px #21304D;
	border-radius: 50%;
}
.scr-cat-cntr{
	display: flex;	
}
.cat-itm-tag{
	padding: 1% 3%;
	width: 70%;
}
.cat-itm-scr-tag{
	padding: 1% 3%;
	width: 30%;
}

.lit-scorecard .lnr-sub-ans-btn{
	font-family: "Cherry Bomb One", system-ui;
	font-weight: normal;
	font-size: 3rem;
	width: 85%;
	border-radius: 55px;
}
.ui2-lnr-qstn-cntr .lsn-audio-cntr-0 {
    border-radius: 100px;
}


/*COINS COUNTER*/

  .coin-counter-anim-wallet {
	/*width: 64px;
	height: 64px;*/
	position: relative;
	display: none;
  }
  
  .coin-counter-anim-icon {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: #0066ff;
	color: #fff;
	position: relative;
	z-index: 5001;
  }
  
  .coin-counter-anim-coin {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 5000;
	opacity: 0;
  }
  
  .coin-counter-anim-coin::after {
	content: "LP";
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	font-size: 20px;
	color: rgb(237, 196, 107);
	background: rgb(227, 162, 23);
	border: 2px solid rgb(237, 196, 107);
	border-radius: 50%;
	opacity: 0;
  }
  
  .coin-counter-anim-coin--animated,
  .coin-counter-anim-coin--animated::after {
	animation-delay: var(--coin-delay, 0s);
	animation-duration: var(--coin-duration, 1.5s);
	animation-direction: normal;
	animation-fill-mode: both;
	animation-play-state: running;
	animation-iteration-count: 1;
  }
  
  .coin-counter-anim-coin--animated {
	animation-name: coin-move;
	animation-timing-function: ease-in-out;
  }
  
  .coin-counter-anim-coin--animated::after {
	animation-name: coin-flip;
	animation-timing-function: linear;
  }
  
  @keyframes coin-move {
	0% { opacity: 0; transform: translate(-50%, -50%); }
	10% { opacity: 0.3;}
	30% { opacity: 0.7;}
	100% { opacity: 1; transform: translate(calc(-50% + var(--coin-to-x)), calc(-50% + var(--coin-to-y))); }
  }
  
  @keyframes coin-flip {
	0% { opacity: 1; transform: rotate3d(1, 1, 1, 0deg); }
	100% { opacity: 1; transform: rotate3d(1, 1, 1, 1080deg); }
  }

  @keyframes fastPulse {
	0%, 100% {
	  transform: scale(1);
	  opacity: 1;
	}
	50% {
	  transform: scale(1.2);
	  opacity: 0.7;
	}
  }
  
  .coin-pulse-element {
	animation: fastPulse 0.2s ease-in-out 5;
  }

.lnr-map-cntr{
	width: 100%;
	text-align: center;
}

#game_map{
	background-image: url("../images/assets/themes/default/game-map.svg");
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	width: 600px;
	height: 600px;
	border:solid 15px #FFF;
	border-radius: 20px;
}
#game-map-img{
	max-width: 19%;
	height: auto;
	border:solid 15px #FFF;
	border-radius: 20px;
	/*transform: rotate(-90deg);*/
}

.mn-class-topics-cntr{
	border:solid 28px #FFF;
	margin-left: 2%;
	border-radius: 88px;
    margin-top: 5%;
    padding: 2%;
	background-color: #21304ddb;
}
.tpc-mn-cntr-bdy{
	display: flex;
	align-items: center;
    justify-content: space-between;
	flex-wrap: wrap;
}
.tpc-itm-cntr{
	width: 30%;
	background-color: #ffffff;
	border-radius: 15px;
	margin-bottom: 4%;
}
.hd-tp-cntr{
	display: flex;
	margin-bottom: 2%;
	align-items: center;
}
.hdn-bdy-cntr{
	width: 70%;
	color: #FFF;
	font-family: "Cherry Bomb One", system-ui;
	font-weight: 400;
	font-size: 2.5rem;
}
.cls-sel-cntr{
	width: 30%;
	text-align: center;
}
.tpc-itm-cntr div img{
	width: 100%;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
}
.ttl-tpc-tag-bdy{
	font-family: "Cherry Bomb One", system-ui;
	text-align: center;
	font-size: 1.7rem;
	margin: 1% 0%;
}
.tpc-itm-cntr .ttl-btn-cntr{
	text-align: center;
}
.tpc-itm-cntr .ttl-btn-cntr img{
	width: 25%;
	height: auto;
}
.sel-cls-item{
	display: inline-block;
	position: relative;
	cursor: pointer;
}
.cls-itm-nm-tag{
	position: absolute;
	top: 44%;
    left: 3%;
    transform: translate(0%, -50%); /* Move the element back by half its size to center it */
	color: #FFF;
	font-family: "Cherry Bomb One", system-ui;
	font-size: 1.5rem;
}
.cls-selector-body{
	display: flex;
	flex-wrap: wrap;
	align-items: center;	
    justify-content: space-evenly;
	margin-top: 8%;
}
.cls-selector-item{
	width: 30%;
	margin-bottom: 8%;
	background-color: #21304D;
	text-align: center;
	font-family: "Cherry Bomb One", system-ui;
	font-size: 2.2rem;
	padding: 3% 0%;
	color: #FFF;
	border-radius: 100px;
	cursor: pointer;	
    border-bottom: solid 8px #ff8d0096;
	-webkit-user-select: none;
    user-select: none;
	-webkit-box-shadow: 0px 14px 18px -4px rgba(0,0,0,0.78); 
	box-shadow: 0px 14px 18px -4px rgba(0,0,0,0.78);
}
.mdl-txt-cntr{
	margin: 5% 0%;
}
.mn-str-sub-str-cntr{
	margin-left: 2%;
	padding: 3% 5%;
}
.sub-strand-mn-cntr{
	display: flex;
	border: solid 15px #FFF;
	padding:2% 3%;
	border-radius: 50px;
	background-color: #21304ddb;
}
.lft-img-cntr{
	width: 30%;
}
.itm-cntr-prg-cntr{
	width: 70%;
}
.lft-img-cntr div img{
	max-width: 70%;
	/*max-height: 100%;*/
	border-radius: 50%;
	border: solid 10px green;
}
.sub-strand-ttl-cntr{
	margin-bottom: 5%;
}
.outlined-text {
    font-weight: bold; /* Makes the text bold for better visibility */
    color: #21304D; /* Text color */
    /*text-shadow: 3px -4px 0 #FFF, /* Top-left *
	-3px -4px 0 #FFF,  /* Top-right *
	-3px 4px 0 #FFF,  /* Bottom-left *
	4px 5px 0 #FFF;   /* Bottom-right */
	text-shadow: 5px -6px 0 #FFF, -5px -6px 0 #FFF, -5px 6px 0 #FFF, 5px 6px 0 #FFF;
	font-family: "Cherry Bomb One", system-ui;
	font-size: 3.5rem;
}
.itm-cntr-prg-cntr .clf-itm-cntr a{
	font-family: "Cherry Bomb One", system-ui;
	display: block;
}
.itm-cntr-prg-cntr{
	display: flex;
	align-items: center;
    flex-wrap: wrap;
	justify-content: space-between;
}
.itm-cntr-prg-cntr .clf-itm-cntr{
	width: 30%;
	text-align: center;
	transition: transform 0.3s ease;
	padding: 1% 0%;
	border-radius: 25px;
}
.itm-cntr-prg-cntr .clf-itm-cntr:hover{
	box-shadow: rgb(255 255 255) 0px 5px 15px;
	transform: scale(1.1);
	/*position: relative;
	z-index: 100;
	background-color: #5f9ea0;*/
}
.counter-number-cntr{
	font-size: 4rem;
	display: inline-block;
	width: 50%;
	text-align: center;
	width: 90%;
}
.counter-number-cntr{
	position: relative;
}
.counter-number-cntr img{
	width: 100%;
	height: auto;
	border-radius: 30px;
}
.counter-number-cntr div{
	position: absolute;
	top: 12%;
    left: 35%;
	color: #FFF;
}
.itm-cntr-prg-cntr .title-txt-cntr{
	font-size: 1.5rem;
	color: #FFF;
}
.arr-bkc-cntr img{
	/*box-shadow: rgb(255 255 255) 0px 11px 12px, rgba(255, 255, 255, 9.22) 0px 17px 10px;*/
	box-shadow: 0px 0px 12px 11px rgb(255 255 255), 0px 0px 10px 17px rgba(255, 255, 255, 0.922);
	border-radius: 15px;
}
.lnr-sub-ans-btn {
    border-radius: 60px; /*Overridden for styles v1 */
}

.game-map-body-elem #game-container {
	position: relative;
	width: 90vw;
	height: 90vh;
	overflow: hidden;
}
.game-map-body-elem #game-map {
	width: 100%;
	height: 100%;
	background-image: url('../images/assets/themes/default/game-map.svg');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
.game-map-body-elem .game-object {
	position: absolute;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
.bounce {
	animation: bounce 2s infinite;
}
.rotate {
	animation: rotate 5s linear infinite;
}
.pulse-gmap {
	animation: pulse-gmap 1.5s ease-in-out infinite;
	width: 9%;
	height: 17%;border-radius: 15px;
	box-shadow: 0px 0px 12px 11px rgb(255 255 255), 0px 0px 10px 17px rgba(255, 255, 255, 0.922);
}

@keyframes bounce {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-20px); }
}
@keyframes rotate {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}
@keyframes pulse-gmap {
	0% { transform: scale(1); }
	50% { transform: scale(1.1); }
	100% { transform: scale(1); }
}
.ui2-mn-man-cntr-bdy{
   background-color: #000000a1;
}

.ui2-lnr-qstn-cntr .flex-right-align .bx-itms-cnt-nmbr {
    justify-content: flex-end;
}
.vertical-mat-npt .bx-npt-cntr.ui2-wid-sz {
    width: 100%;
}

.lnr-ans-bx-sel.opt-4-sml-fnt a {
    font-size: 1.4rem;
}
.ltr-box-item{
	display: inline-block;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	padding: 0% 5%;
	font-size: 6rem;
	font-family: 'Andika', sans-serif;
}
.usr-rsp-tag{
	margin-top: 3%;
	font-size: 1.2rem;
	display: inline-block;
	border: solid 5px #359cf6;
	padding: 1% 5%;
	text-align: center;
	border-radius: 15px;
	font-weight: normal;
}
.usr-rsp-tag span{
	font-weight: bold;
}
.ui-2-nav-bar-left a{
	display: flex;
	align-items: center;
}

.bba-content-body-container .bba-left-nav a.ui-2-help-desk{
	background-color: #377DB5;
	color:  #FFF !important;;
	display: flex;
	align-items: center;
	border: none;
}

.bba-content-body-container .bba-left-nav a.nav-active-group{
	background-color: #21304D;
	color:  #FFF !important;
	border: none;
}

.ui2-usr-hm-banner{
	background: rgb(179,228,252);
	background: linear-gradient(90deg, rgba(179,228,252,1) 0%, rgba(117,176,216,1) 10%, rgba(86,151,199,1) 15%, rgba(55,125,181,1) 20%, rgba(52,115,168,1) 30%, rgba(51,111,161,1) 34%, rgba(50,106,155,1) 39%, rgba(47,96,142,1) 48%, rgba(45,91,135,1) 53%, rgba(45,89,132,1) 55%, rgba(44,87,129,1) 58%, rgba(39,67,103,1) 76%, rgba(36,58,90,1) 86%, rgba(33,48,77,1) 100%);
	display: flex;
	align-items: center;
    justify-content: space-evenly;
	padding: 2% 2%;
	border-radius: 35px;
}
.lc-banner-image{
	width: 25%;
}
.lc-banner-text{
	width: 75%;
	color: #FFF;
}
.ui2-drd-header-cntr{
	display: flex;
	justify-content: space-between;
    align-items: center;
}
.ui2-add-chd-acc-btn-cntr{
	background-color: #da5d09;
	color: #FFF;
	padding:2% 2%;
	display: flex;
    align-items: center;
	border-radius: 15px;
	cursor: pointer;
	-webkit-user-select: none;
	user-select: none;
}
.ui2-db-usr-crd .ui2-dbr-img-cntr{
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.ui2-db-usr-crd .ui2-dbr-img-cntr>div{
	width: 150px;  /* Adjust size as needed */
	height: 150px;
	border-radius: 50%;
	overflow: hidden;  /* Ensures image stays within the circle */
	background-color: #E7EFF8;
	display: flex;
	justify-content: center;
	align-items: center;
}
.ui2-db-usr-crd .gt-lrng-btn-db{
    background-color: #377DB5;
	color: #FFF;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 5% 0% !important;
	margin-top: 6%;
}
.ui2-db-usr-crd{
	position: relative;
	z-index: 100;
}
.edt-prl-icon-cntr{
	position: absolute;
	right: 11%;
	top: 50%;
	z-index: 110;
	width: 18%;
}
.ui2-cls-cntr .esmk-acc-cntr-itm {
	-webkit-box-shadow: 0px 6px 18px -12px rgba(218,93,9,0.98); 
	box-shadow: 0px 6px 18px -12px rgba(218,93,9,0.98);
	border: none;
	border-radius: 22px;
	height: auto;
}
.ui2-db-usr-crd .lbl-usr-sts{
	margin-top: 6%;
	padding: 5% 0% !important;
}
.ui2-par-bdy-elem-cntr .bba-usr-itm.bba-usr-mcrs h3{
	text-transform: none;
}
.ui2-cls-cntr .esmk-acc-cntr-itm label {
    text-transform: none;
}
.ui2-cls-cntr .sb-item{
	display: flex;
    align-items: center;
}
.ui2-cls-cntr.esmk-std-acc-cntr {
    margin-top: 6%;
}

footer.ui2-ftr-main-cntr{
    background-color: #21304D;
}
.esmk-modal-wrapper.ui2-add-width-max-760{
	background: #00000080;
}
.ui2-add-width-max-760 .esmk-modal {
	width: 760px;
	height: 645px; /*Moved from 500*/
	left: 45%;
	border-radius: 25px;
	top: 35%; /*Added*/
}
.ui2-add-width-max-760 .esmk-head{
	display: flex;
	/* align-items: center; */
	background: none;
	width: 100%;
    height: 72px;
}
.ui2-add-width-max-760 .ui2-mdl-cntr-close{
	width: 20%;
}
.ui2-add-width-max-760 .ui2-hdr-cntr-modal{
	width: 80%;
}
/* .ui2-hdr-cntr-modal{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	position: relative;
} */
.ui2-hdr-cntr-modal{
	display: flex;
    align-items: center;
    justify-content: flex-start;
    position: relative;
    flex-direction: row;
	padding-left: 6%;
}
.on-brd-hdr-cntr-body{
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	width: 100%;
}
.on-brd-hdr-cntr-tag{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #787878;
	font-size: 0.95rem;
}
.lnr-det-cntr-brd{
	width: 36%;
}
.sch-det-cntr-brd{
	width: 40%;
	text-align: right;
}
.ui-obd-circle-cntr {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	border: solid 5px #21034D;
}
.line {
	width: 50%;
	height: 4px;
	background-color: #21034D;
}
.ui2-mdl-cntr-close .esmk-btn-close::before, .ui2-mdl-cntr-close .esmk-btn-close::after {
    content: '';
    width: 28px;
    height: 5px;
    display: block;
    background: #21034D;
}
.ui2-add-width-max-760 .esmk-content{
	padding: 0% 2% 1% 2%;
	margin-top: -2%;
}
/* Styles 1 duplicates:: start*/
.esk-gdr-slt, .esk-grade-slt, .esk-cnty-slt {
    display: inline-block;
    width: 30%;
    padding: 5px 14px;
    font-weight: bold;
    font-size: 1.3rem;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}
/*::end*/
.ui2-onboarding-btn-mn-ctr{
	display: flex;
	align-items: center;
    justify-content: space-around;
	margin-top: 9%;
}
.ui2-nxt-btn-onboard, .ui2-prv-btn-onboard{
	width: 25%;
	
}
.ui2-nxt-btn-onboard a, .ui2-prv-btn-onboard a{
	display: flex;
    align-items: center;
	position: relative;
	padding: 8% 8%;
	font-weight: bold;
    cursor: pointer;
    border-radius: 5px;
    -webkit-user-select: none;
    user-select: none;
}
.ui2-nxt-btn-onboard a {
	background-color: #da5d09;
	color: #ffffff !important;
}
.btn-lcs-xplr, .btn-lcs-assi-lcs {
    background-color: #da5d09;
	color: #ffffff !important;
}
.ui2-prv-btn-onboard{
	visibility: hidden;
}
.ui2-prv-btn-onboard a {
    background-color: #c7c7c7;
}
.inp-names .name-inp-cntr{
    display: inline-block;
    width: 70%;
}
.inp-names .name-inp-cntr input{
    display: block;
    width: 100%;
    padding: 5px 14px;
    font-weight: bold;
    font-size: 1.3rem;
}
.gender-inp-cntr, .grade-inp-cntr, .esk-cnty-slt {
    display: inline-block;
    width: 30%;
}
.gender-inp-cntr .esk-gdr-slt, .grade-inp-cntr .esk-grade-slt{
	width: 100%;
    padding: 5px 14px;
    font-weight: bold;
    font-size: 1.3rem;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
	font-family: 'Source Sans Pro', sans-serif;
}
.inp-names, .inp-gender, .inp-grade{
	display: flex;
	align-items: center;
}
.inp-names label, .inp-gender label, .inp-grade label {
    width: 30%;
    font-size: 1.1rem;
	font-family: "Poppins", sans-serif;
	font-weight: 400;
	font-style: normal;
}
.name-inp-cntr span{
	color: #3a3a3a;
	font-size: 1.0rem;
}
.non-js-err-notify {
    padding: 1.5% 1%;
    background-color: #f1cdcd5c;
    color: #813030;
    margin: 4% 0% -2% 0%;
	border-radius: 20px;
}
.non-js-success-notify {
    padding: 1.5% 1%;
    background-color: #b1ffc4;
    color: #383838;
    margin: 4% 0% -2% 0%;
	border-radius: 20px;
}
.ui2-notif-end{
	text-align: center;
	border-radius: 20px;
}
.acv-tag{
	background-color: #da5d09;
    border: none;
	transition: transform 2s ease-in;
	display: flex;
    align-items: center;
    justify-content: center;
}
.acv-tag-text{
	color: #da5d09;
	transition: transform 2s ease-in;
}
.ln-acv-elem{
	background-color: #da5d09;
	transition: transform 2s ease-in;
}
#data-sect-cntr-0, #data-sect-cntr-1, #data-sect-cntr-2, #data-sect-cntr-3, #data-sect-cntr-4, #data-sect-cntr-5, #data-sect-cntr-6 {
    display: none;
}
.ui2-onboarding-prc-cntr .lcs-btns-cntrl div {
    width: 42%;
}
.ui2-onboarding-prc-cntr .esmk-notif-tag, .ui2-checkout-card-cntr .esmk-notif-tag{
	border-radius: 20px;
	background-color: #ebf7ff;
	font-size: 1.0rem;
}
.ui2-mdl-licenses-mn .usr-prc-pckg-card .drn-tag-bdy{
    border: none;
    text-align: center;
    padding: 5% 2%;
   
}
.usr-prc-pckg-card>div>div {
    border: none;
    text-align: center;
    padding: 0% 2%; /*CHANGE TO 5 0*/
    border-radius: 7px;
}
.ui2-mdl-licenses-mn .usr-prc-pckg-card .usr-prc-pckg-itm-bdy {
	border: solid 3px #377db5;
	border-radius: 15px;
}
.ui2-mdl-licenses-mn .usr-prc-pckg-card .usr-prc-pckg-itm-bdy.usr-prc-pckg-itm-tml {
	background-color: #306e9f;
	color: #ffffff;
}
.dur-tag-lbl{
	margin-top: 6%;
}
.dur-tag-lbl span{
	border: solid 3px #000000;
	padding: 2% 0%;
	text-align: center;
	width: 70%;
	display: inline-block;
	border-radius: 10px;
}
.usr-prc-pckg-itm-tml .dur-tag-lbl span{
	border: solid 3px #ffffff;
}
.drn-tag-bdy .prc-tag {
    font-size: 1.7rem;
    color: #3a3a3a;
    display: block;
	font-weight: bold;
	padding: 0% 0%; /*CHANGE TO 15 0*/
}
.usr-prc-pckg-itm-tml .drn-tag-bdy .prc-tag {
    color: #ffffff;
}
.usr-prc-pckg-itm-bdy .mthly-tag .prc-btn-cntr a,
.usr-prc-pckg-itm-bdy .tmly-tag .prc-btn-cntr a,
.usr-prc-pckg-itm-bdy .yrly-tag .prc-btn-cntr a {
    background-color: #377db5;
    width: 90%;
    display: inline-block;
    cursor: pointer;
    border-radius: 10px;
    color: #ffffff !important;
    font-weight: bold;
    padding: 4% 0%;
	border: none;
	font-size: 1.15rem;
}
.usr-prc-pckg-itm-bdy .tmly-tag .prc-btn-cntr a{
	background-color: #ffffff;
	color: #377db5 !important;
}
.ui2-prc-crd-sml-tag{
	font-size: 1.0rem;
}
.ui2-checkout-card-cntr.usr-prc-pckg-card.checkout-card>div {
    width: 85%;
}
.ui2-checkout-card-cntr.checkout-card div .crd-itm-chk {
    padding: 1% 2%;
}
.ui2-checkout-card-cntr.checkout-card div .crd-itm-chk.ui2-app-cd-elem-cntr {
    padding: 0% 2%;
	border-bottom: solid thin #e9e9e9;
}
.ui2-app-cd-elem-cntr .btn-apl-cde, .ui2-app-cd-elem-cntr .btn-apl-cde:hover {
    padding: 3% 2%;
	background-color: #377db5;
	color: #ffffff;
}
.ui2-lcs-pay-btn-cntr{
	display: flex;
	align-items: center;	
    justify-content: space-between;
}
.ui2-lcs-pay-btn-cntr .change-pay-plan-btn{
	width: 40%;
	border: solid thin #d0d0d0;
	background-color: #ffffff;
	color: #000000 !important;
}
.ui2-lcs-pay-btn-cntr .cnt-pay-btn{
	width: 52%;
}
.ui2-lcs-pay-btn-cntr>a{
	font-family: "Poppins", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 1.1rem;
}
.ui2-checkout-card-cntr.checkout-card div .crd-itm-chk label {
	font-family: "Poppins", sans-serif;
	font-size: 1.0rem;
}

.ui2-checkout-card-cntr .non-js-err-notify, .ui2-checkout-card-cntr .non-js-success-notify,
.ui2-checkout-card-cntr .ui2-fnt-0-8{
	font-family: "Poppins", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 0.8rem;
	margin-top: 0%;
	margin-bottom: 1%;
}
.fnt-size-135{
	font-size: 1.35rem;
}
.fnt-size-normal{
	font-size: 1.2rem;
}
.ui-icn-pass-cntr{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}
.ui-icn-pass-elem i{
	font-size: 11rem;
	color: #138422;
}
.ui-txt-pass-elem{
	margin-top: 2%;
}
.info-pck-item-body{
	display: flex;
	align-items: center;
	justify-content: center;
	border-bottom: solid thin #d8d8d8;
	margin-bottom: 5%;
}
.info-pck-item-body>div:first-child{
	width: 30%;
	text-align: center;
}
.info-pck-item-body>div:last-child{
	width: 57%;
	text-align: center;
}
.ui-pck-mn-info-cntr{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 10%;
}
.ui-pck-mn-info-cntr>div{
	width: 60%;
}
.ui-pck-gt-lrn-cntr{
	margin-top: 7%;
	display: flex;
	justify-content: center;
}
.ui-pck-gt-lrn-btn{
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #377db5;
    color: #ffffff !important;
	padding: 2% 8%;
    font-weight: bold;
    cursor: pointer;
    border-radius: 30px;
    -webkit-user-select: none;
    user-select: none;
	width: 50%;
}
.ui-pck-gt-lrn-btn span{
	margin-left: 5%;
}
.mdl-on-brd-header{
	display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    position: relative;
	margin-top: 7%;
}
.activate-accnt-h4-hdr{
	text-align: center;
	border-bottom: solid thin #e9e9e9;
}
.spn-tck-white i{
	color: #ffffff;
}
.opn-lrn-map-cntr{
	margin-top: 3%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.lrn-map-bdy{
	width:45%;
}
.lrn-map-bdy-itm{
	display: flex;
	padding: 4% 1%;
	background-color: #ffffff;
	text-align: center;
	border-radius: 20px;
	justify-content: center;
	align-items: center;
	font-family: "Cherry Bomb One", system-ui;
	font-size: 2rem;
}
.lrn-map-bdy-itm>div:first-child{
	width: 60%;
	line-height: 2;
}
.lrn-map-bdy-itm>div:last-child{
	width: 40%;
}
.lrn-map-bdy-itm img{
	width: 58%
}
.ui2-add-width-max-760 .esmk-content .mdl-not-cntr {
    font-family: "Cherry Bomb One", system-ui;
	font-weight: 400;
	font-style: normal;
    font-size: 1.8rem;
}
.ui2-diag-test-cntr{
	display: flex;
    align-items: center;
    justify-content: space-around;
    font-size: 2rem;
    text-align: center;
	margin-top: 13%;
}
.mt-dgt-test-btn-cntr, .lt-dgt-test-btn-cntr{
	background-color: #ffaa40;
	width: 45%;
	border-radius: 25px;
	box-shadow: rgb(99 99 99) 0px 8px 15px 7px;
}
.mt-dgt-test-btn-cntr a, .lt-dgt-test-btn-cntr a{
	padding: 2% 1%;
	color: #222222 !important;
	display: block;
	font-family: "Cherry Bomb One", system-ui;
	font-weight: 400;
	font-style: normal;
	text-decoration: none;
}

.mdl-diag-tst-grp{
	padding: 2% 0%;
    font-size: 1rem;
    margin-top: 7%;
	width: 35%;
	display: flex;
    align-items: center;
    justify-content: center;
    background-color: #377db5;
    color: #ffffff !important;
    font-weight: bold;
    cursor: pointer;
    border-radius: 30px;
    -webkit-user-select: none;
    user-select: none;
    font-family: 'Andika', sans-serif;
}
.mdl-diag-tst-grp span {
    margin-left: 5%;
}
.mdl-diag-tst-grp .material-symbols-outlined {
    font-size: 1.5rem;
}
.diag-tst-mdl-hdr{
	display:block;
	text-align:center;
	font-size: 2.5rem;
}
.ad-banner-cntr{
	padding: 1% 2%;
}
.ad-bnr-btn-cntr .prc-btn-cntr {
	margin: 0%;
	width: 55%;
	text-align: center;
}
.ad-bnr-btn-cntr{
	display: flex;
	align-items: center;
	justify-content: center;
}
.ad-banner-inr-cntr{
	padding: 2% 2%;
	border: solid thin red;
	margin: 0% 0%;
    margin-bottom: 6%;
}
.mdl-on-brd-header.cld-cng-avt-prg-trk{
	margin-top: -5%;
}
.cld-cng-avt-prg-trk .on-brd-hdr-cntr-tag {
    font-size: 1.5rem;
}
.ui2-avt-sel-cntr{
	display: flex;
	align-items: center;
	justify-content: space-around;
	margin: 5% 0% 0% 0%;
	flex-wrap: wrap;
}
.avt-itm-bdy{
	width: 20%;
	border-radius: 50%;
	background-color: #e7eff8;
	margin: 0% 2% 2% 2%;
}
.acv-avt-itm{
	background-image: 
		linear-gradient(to right, #e7eff8, #e7eff8), 
		linear-gradient(180deg, rgba(255,164,52,1) 0%, rgba(218,93,9,1) 100%);
	background-origin: border-box;
	background-clip: content-box, border-box;
	border: double 10px transparent;
	box-sizing: border-box;
}
.avt-itm-bdy img{
	max-width: 100%;
	max-height: 100%;
}
.ui-pck-set-avt-cntr{
	margin-top: 0%;
    display: flex;
    justify-content: center;
	align-items: center;
}
.mdl-avt-nxt-btn{
	padding: 2% 0%;
    font-size: 1rem;
    margin-top: 0%;
    width: 35%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border-radius: 30px;
    -webkit-user-select: none;
    user-select: none;
}
.mdl-avt-nxt-btn img{
    width: 100%;
}
.spn-tck-white i.sml-fnt {
    font-size: 1.2rem;
}
.ui2-theme-sel-cntr{
	display: flex;
	align-items: center;
	justify-content: space-around;
	margin: 5% 0% 0% 0%;
	flex-wrap: wrap;
}
.thm-itm-bdy{
	width: 28%;
	border-radius: 15px;
	background-color: #e7eff8;
	margin: 0% 2% 2% 2%;
}
.thm-itm-bdy img{
	max-width: 100%;
	max-height: 100%;
	border-radius: 15px;
}
.acv-thm-itm{
	background-image: 
		linear-gradient(to right, #e7eff8, #e7eff8), 
		linear-gradient(180deg, rgba(255,164,52,1) 0%, rgba(218,93,9,1) 100%);
	background-origin: border-box;
	background-clip: content-box, border-box;
	border: double 10px transparent;
	box-sizing: border-box;
}
.ui-pck-set-avt-cntr.sel-avt-thm {
    justify-content: space-evenly;
}
.bck-sel-avt-btn{
	display: flex;
    align-items: center;
	background-color: #c7c7c7;
    padding: 1% 3%;
	cursor: pointer;
    border-radius: 30px;
	font-family: "Cherry Bomb One", system-ui;
	font-weight: 400;
	font-style: normal;
	font-size: 1.7rem;
    -webkit-user-select: none;
    user-select: none;
}
.multi-div-progress-bar {
	width: 300px;
	height: 40px;
	background-color: rgba(255, 255, 255, 0.2);
	border-radius: 20px;
	padding: 5px;
	box-shadow: 0 0 10px rgba(255, 255, 255, 0.1);
	overflow: hidden;
}
.progress-segments {
	display: flex;
	height: 100%;
	width: 100%;
}
.segment {
	flex: 1;
	background-color: #da5d09;
	margin-right: 5px;
	border-radius: 10px;
	transform: scaleY(0);
	animation: fillUpAndDown 1.6s ease-in-out infinite;
}
.segment:last-child {
	margin-right: 0;
}
@keyframes fillUpAndDown {
	0%, 100% {
		transform: scaleY(0.1);
	}
	50% {
		transform: scaleY(1);
	}
}
.svn-avt-thm-prl-cntr{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}
.svn-avt-thm-prl-itm{
	width: 50%;
	margin-top: 2%;
	display: inline-block;
	text-align: center;
	font-size: 2rem;
}
.cntr-flx-clm{
	flex-direction: column;
}
/* Style for the placeholder option */
.sel-cntr-wth-plc-hldr select option[value=""][disabled] {
	display: none;
}

/* Style for the placeholder text */
.sel-cntr-wth-plc-hldr select:invalid {
	color: #757575;
	font-weight: normal;
}
.esmk-input-cntr .cca-notif-cntr{
	font-size: 1rem;
    margin-bottom: -7%;
}
.usr-pg-canvas-elem {
	position: absolute;
	/*top: 0;
	left: 0;
	/*width: 100%;
	height: 100%;*/
	background-color: #FFF;
	border-radius: 50%; /*as long as the canvas is a square*/
	box-shadow: rgba(81, 91, 108, 1) 0px 12px 0px, rgba(81, 91, 108, 0.22) 0px 15px 12px;
}
.sub-itm-ttl-cntr a {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
}
.mdl-js-fl-width{
	width: 100%;
}
.mdl-js-fl-width-blc{
	width: 100%;
	display: block;
}
.lcs-btns-cntrl-trl{
	margin-top: 4%; /*CHANGE TO 8*/
}
.trl-btn-cntr{
	margin-top: 5%;
    width: 100%;
    display: flex;
    justify-content: center;
	align-items: center;
}
.btn-lcs-day-trl-elem{
	background-color: #c7c7c7;
    padding: 1% 3%;
    cursor: pointer;
    border-radius: 30px;
    font-weight: 400;
    font-style: normal;
    font-size: 1.2rem;
    -webkit-user-select: none;
    user-select: none;
}
.elem-div-cntr{
	border-bottom: solid thin #00000036;
    line-height: 0;
	text-align: center;
}
.elem-div-cntr span{
	display: inline;
	padding: 1% 2%;
	border: solid thin #00000036;
	border-radius: 30px;
	background-color: #ffffff;
	font-size: 1rem;
    font-weight: bold;
}
.ui2-onboarding-prc-cntr .mrg-tp-ovd-1{
	margin-top: 1%;
}
.zoo-default{
	width: 61%;
    box-shadow: 0 10px 7px 2px rgba(45, 71, 26, 0.902), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    border-radius: 20px;

}
/*override*/
.zoo-ttl-cntr {
    background-color: transparent;
    box-shadow: none; /*0 10px 7px 0px rgba(45, 71, 26, 0.902), 0 2px 4px -1px rgba(0, 0, 0, 0.06);*/
}
.ui2-lnr-qstn-cntr .lnr-img-cntr img {
    width: 13%;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
	margin-bottom: 1%;
}
.lnr-img-cntr {
	background-color: white;
}
.ui2-lnr-qstn-cntr .grp-shp, .ui2-lnr-qstn-cntr .jqry_grp-shp {
	background-color: white;

}
.lnr-sub-ans-btn {
	margin-top: 5%;
}
.ui2-lnr-qstn-cntr.ui2-lng-cntr-ght .grp-shp>div, .ui2-lnr-qstn-cntr.ui2-lng-cntr-ght .jqry_grp-shp>div {
    height: 180px;
}
.ui2-lnr-qstn-cntr.ui2-lng-cntr-ght .lnr-img-cntr img {
	margin-bottom: 2%;
}

.ui2-lnr-qstn-cntr.adj-wd-img-cntr .grp-shp>div, .ui2-lnr-qstn-cntr.adj-wd-img-cntr .jqry_grp-shp>div {
    width: 34%;
}

.ctg-mn-sst-bdy{
	display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
}
.ctg-mn-sst-hdr{
	font-size: 2rem;
	background-color: #ffffff;
	color: #21304D;
	border-radius: 15px;
	padding-left: 2%;
}
.gv-mrg-tp-val{
	margin-top: 5%;
}
.pt-tg-qstn-cntr .bx-itm-2, .pt-tg-qstn-cntr .bx-itm-1
{
	width:30%;
}
.ui2-lnr-qstn-cntr .lnr-img-cntr img {
    width: 30%;
}
.ui2-lnr-qstn-cntr .lnr-img-cntr img {
    width: 13%;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
	margin-bottom: 1%;
}
.pt-tg-answer-bxs {
	margin-top: 1%;
    margin-bottom: 0%;
}
.ui2-lnr-qstn-cntr .bx-itm-cntr {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.ui2-lnr-qstn-cntr .pt-tg-ans-itm>div{
	display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-around;
}
.ls-wid-item-a.sel-10-cntr a {
    width: 4%;
}
.ui2-lnr-qstn-cntr .tka-html-txt {
	font-family: "Poppins", sans-serif;
	font-weight: 500;
	font-style: normal;
}
.ui2-lnr-qstn-cntr .tka-html-txt span{
	font-family: 'Source Sans Pro', sans-serif;
}
.ui2-lnr-qstn-cntr .lnr-img-cntr.l2-dd img{
	width: 13%;
}
.ui2-lnr-qstn-cntr .lnr-ans-bx-sel.ui2-cng-itm-wdt a {
	text-align: center;
	padding: 2% 2%;
	width: 5%;
}

.ui2-rmv-mrg-tp span.ply-btn-span {
    font-size: 8rem;
    cursor: pointer;
    color: #21304D;
}
.ui2-lnr-qstn-cntr .lnr-img-cntr.rprsnt-img-tally.t-tly-10 img {
    width: 20%;
	margin-right: 1%;
}
.ui2-lnr-qstn-cntr .lnr-img-cntr.rprsnt-img-tally.t-tly-50 img {
    width: 16%;
	margin-right: 1%;
}
.ui2-lnr-qstn-cntr .lnr-img-cntr.ui2-dd-plc-vl-img-cntr img {
    width: 15%;
}
.objects-by-numbers.ui2-plc-vl-cntr>div {
    width: 27%;
}
.ui2-lnr-qstn-cntr .objects-by-numbers.ui2-plc-vl-cntr>div h3{
	margin-top: -5%;
	margin-bottom: 0%;
}
.objects-by-numbers>div>div {
    border: solid 4px #cecece;
    text-align: center;
    border-radius: 29px;
}
.grp-shp.ui2-plc-vl-cntr>div img{
    max-width: 45%;
    text-align: center;
}
.nmbr-syl-wrd-item {
	font-family: 'Source Sans Pro', sans-serif;
	background-color: #ffffff;
}
.ui2-lnr-qstn-cntr .lnr-img-cntr.ui2-img-sz-10 img {
    width: 9%;
    margin-right: 1%;
}
.img-cntr-inline-text.ui2-lrg-itm-cntr-grp .nmbr-group-item-cntr {
    display: flex;
    width: 16%;
	justify-content: space-between;
}
.ui2-lnr-qstn-cntr .worded-problem-cntr {
    font-size: 2rem;
    font-family: 'Andika', sans-serif;
    margin-top: 2%;
}
.ui2-lnr-qstn-cntr .shaded-part-object.ui2-lrg-shd-rgn-img img {
    max-width: 40%;
}
.shaded-part-object.ui2-lrg-shd-rgn-img div {
    width: 50%;
    padding: 2% 0%;
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: center;
}
.ui2-mrg-btm-0 .lnr-nsr-box {
    margin: 2% 0% 0% 0%;
}
.ui2-ovr-mas-itm .ovr-wdt-mass {
    width: 14%;
	text-align: center;
}
.lnr-mny-img-cntr.ui2-ovr-mas-itm img {
    width: 75%;
}
.ui2-ovr-mas-itm .ovr-wdt-mass label {
    display: block;
}
.lnr-mny-img-cntr.ui2-ms-ovr-itm-2 {
    text-align: center;
	margin-bottom: 5%;
}
.lnr-mny-img-cntr.ui2-ms-ovr-itm-2 img {
    width: 60%;
}

.ui2-rsp-img-ovr-wdt .lnr-mny-img-cntr-ans div img{
	width: 50%;
}
.ui2-cap-img-cntr .sz-18-img .btl-img-item {
    width: 16%;
    margin-right: 4%;
    margin-bottom: 2%;
}
.ui2-cap-img-cntr.pt-tg-qstn-cntr .bx-itm-5 {
    width: 46%;
}
.ui2-cap-img-cntr.pt-tg-qstn-cntr .bx-itm-5 .lbl-bx-1-nmb{
	display: inline-block;
	width: 100%;
}
.ui2-cap-img-cntr.pt-tg-qstn-cntr .bx-itm-5 .lbl-bx-1-nmb img{
	display: inline-block;
	width: 50%;
}
.ui2-cap-img-cntr.pt-tg-qstn-cntr .bx-itm-1 img {
    width: 88%;
}
.ui2-mny-cntr-mn-elem.lnr-mny-img-cntr-v2 {
    flex-wrap: nowrap;
	font-family: 'Source Sans Pro', sans-serif;
}
.ui2-lnr-qstn-cntr .itm-4-sel-large a {
    width: 20%;
}
.sz-btn-smlr.dsp-flx-clmn-rvs a{
	width: 20%;
}
.ctg-mn-sst-cntr{
	width: 100%;
}
.q-tag-ft-sz{
	font-family: 'Work Sans', sans-serif;
}
.lnr-qstn-box .ui2-mn-resp-v4 label {
	display: inline-block;
}
.ui2-lnr-qstn-cntr .bx-itm-3 .fa-divide{
	font-size: 3rem;
}
.ui2-lnr-qstn-cntr .vlm-cntr .img-cntr-bdy-itm {
    margin-top: 4%;
}
.ui2-brd-btn-cntr{
	cursor: pointer;
}
.ui2-elem-cntr-lrn-map-info{
	display: flex;
	align-items: center;
	flex-flow: column;
	margin-top: 5%;
}
.ui2-elem-cntr-lrn-map-info>div{
	width: 100%;
	text-align: center;
}
.btn-cntr-opn-lrg-map{
	margin-top: 5%;
	width: 100%;
    text-align: center;
}
.btn-opn-lrg-map{
	background-color: #eb7d1c;
    padding: 2% 3%;
    cursor: pointer;
    border-radius: 30px;
    font-weight: 400;
    font-style: normal;
    font-size: 1.2rem;
    -webkit-user-select: none;
    user-select: none;
	font-weight: bold;
	color: #ffffff;
}
.kp-lrg-txt-cntr{
	font-size: 2rem;
}
.no-dig-tst-cntr{
	font-size: 1.5rem;
}
.ic-fl-dig-tst-cntr img{
	width: 20%;
}
.ui2-str-gt-lrn-cntr{
	margin-top: 0;
	display: flex;
	justify-content: space-around;
}
.ui2-str-gt-lrn-cntr .mdl-diag-tst-grp {
    font-size: 1.5rem;
}
.ui2-ac-btn-cntr{
	width: 24%;
    border-radius: 15px;
    background-color: #e7eff8;
    margin: 0% 2% 2% 2%;
	cursor: pointer;
}
.ui2-ac-btn-cntr img {
    max-width: 100%;
    max-height: 100%;
}
.ui2-ac-btn-cntr a{
	margin: 1% 0%;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 1.1rem;
	display: block;
	text-align: center;
}
.ui2-sgn-lcs-btn-cntr{
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 4%;
}
.ui2-sgn-lcs-btn-cntr .ui2-sgn-lcs-btn{
	background-color: #eb7d1c;
    padding: 2% 3%;
    cursor: pointer;
    border-radius: 30px;
    font-weight: 400;
    font-style: normal;
    font-size: 1.2rem;
    -webkit-user-select: none;
    user-select: none;
	font-weight: bold;
	color: #ffffff;
	width: 40%;
	text-align: center;
}
.ui2-err-info-cntr{
	display: flex;
    padding: 1% 2%;
    justify-content: center;
    align-items: center;
	visibility: hidden;
}
.ui2-err-info-bdy{
	background-color: #ffc6c6;
	color: #333333;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 1.1rem;
	display: block;
	text-align: center;
	width: 95%;
    border-radius: 20px;
    padding: 1% 2%;
}
.dft-btn-slt-skl{
	margin-top: 5%;
}
.ui2-skl-all-btn-cntr{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.ui2-skl-all-btn-elem{
	display: inline-block;
	background-color: #eb7d1c;
    padding: 2% 3%;
    cursor: pointer;
    border-radius: 30px;
    font-size: 3rem;
    -webkit-user-select: none;
    user-select: none;
	color: #ffffff;
	width: 40%;
	text-align: center;
	font-family: "Cherry Bomb One", system-ui;
	font-weight: 400;
	font-style: normal;
	animation: btn-pulse 1s linear infinite;
}


@keyframes btn-pulse {
	25% {
		transform: scale(1.1);
	}
	75% {
		transform: scale(0.9);
	}
}
.ui2-diag-test-mn .lnr-sub-ans-btn {
    margin-top: -2%;
}
.vertical-mat-dsp.cnt-cntr-2.dia-tst .bx-itms-cnt-nmbr label {
    width: 11.6%;
    font-size: 3rem;
}
.dia-tst .bx-hdr-tags label {
    width: 40%;
    text-align: center;
    font-size: 3rem;
	color: #585757;
}

.dia-tst .bx-hdr-tags label.cls-cnt-ce-1{
	text-align: right;
	display: inline-block;
}
.dia-tst .bx-hdr-tags label.cls-cnt-ce-2{
	text-align: left;
	display: inline-block;
}
.gry-hrd-elm .usr-inpt-tag {
    font-size: 2rem;
	color: #585757;
}
.multiply-ic-mat{
	font-size: 3rem;
	font-weight: bold;
}
.selected-img-cls{
	box-shadow: rgba(3, 108, 245, 0.65) 0px 3px 8px 8px;
}
.ui2-img-elem-item{
	cursor: pointer;
	border-radius: 15px;
}
.ui2-img-elem-item img{
	border-radius: 15px;
}
.fct-cntr-bdy{
	text-align: center;
	font-size: 3em;
}
.ui2-fraction-cntr {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	font-size: 1.2em;
}
.ui2-fraction-cntr > span {
	display: block;
	line-height: 1;
}
.ui2-fraction-cntr .numerator {
	border-bottom: 3px solid black;
	padding-bottom: 2px;
	width: 1.2em;
}
.ui2-fraction-cntr .denominator {
	font-size: 1.2em;
}
.ui2-lnr-qstn-cntr .lnr-img-cntr.img-wdt-30 img {
    width: 30%;
}
.ui2-lnr-qstn-cntr .lnr-qstn-box .tka-cco-img-cntr label {
    background-color: blue;
    display: inline-block;
    width: 0%;
    margin: 1% 2.5%;
    border-radius: 50%;
    padding: 2% 5.5%;
}
.in-dig-lrg-txt{
	font-size: 3rem;
}
.in-dig-alg-ctr{
	text-align: center;
}
.ui2-sentence-cntr{
	text-align: center;
	font-size: 2rem;
	margin: 3% 0%;
}
.ui2-sentence-cntr label{
	box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
	padding: 2% 3%;
	display: inline-block;
	background-color: #ffffff;
}
.text-input-bx .lrn-usr-input-box input[type=text].ui2-wdt-80-inp {
    width: 88%;
    font-size: 1.8rem;
	height: 74px;
}
.ui2-wht-bg{
	background-color: #ffffff;
}
.no-dig-tst-cntr {
    font-family: "Cherry Bomb One", system-ui;
    font-size: 2.5rem;
}
.ui2-mp-dia-lrn-btn-cntr{
    margin-top: -7%;
}
.ui2-txt-dsp-cntr{
	margin-top: 10%;
}
.ui2-lsn-bdy-mn-cntr{
	background-color: #ffffff;
}
.ui2-lsn-bdy-mn-cntr .esmk-cnt-hdr-tag{
	font-family: "Cherry Bomb One", system-ui;
	font-size: 3rem;
	text-align: center;
	color: #222222;
	letter-spacing: 3px;
}
.ui2-lsn-bdy-mn-cntr #alphabet-letters-container .mn-alpbt-ltr-cntr {
    width: 22%;
}
.content-lesson-bdy .lrn-cntr-0 {
    width: 90%;
}
.letter-drag-drop #ondrp-all a, .letter-drag-drop #drg-drp-answer-bxs a, .letter-drag-drop .jqry_grp-shp a {
	font-family: 'Andika', sans-serif;
}
.ui2-btn-cntr-edt-info{
	text-align: center;
}
.ui2-lnr-qstn-cntr .ui2-fnt-lrg .qstn-bdy-cntr-51{
	font-size: 5rem;
}
.ui2-lnr-qstn-cntr .wrd-tg-elem{
	font-size: 5rem;
}
.grp-shp.objects-by-words>div, .objects-by-words.jqry_grp-shp>div {
    height: 75px;
    padding: 1% 1%;
    border-radius: 7px;
}
.grp-shp.objects-by-words .drop-word-obj-cntr.lnr-wrd-cntr {
    justify-content: flex-start;
}
.grp-shp.objects-by-words>div {
    border: solid thin #cecece;
    width: 100%;
}
.ui2-lnr-qstn-cntr .drop-word-obj-cntr .word-obj-cntr {
    margin-right: 0.8%;
    display: flex;
    align-items: center;
}
.ui2-lnr-qstn-cntr .qstn-bdy-cntr-51.dv-qstn-bdy-mn-word {
    font-size: 5rem;
    font-weight: bold;
}
.lnr-nsr-box .itm-4-sml-sng.ui2-fln-gp-opt a {
    font-family: 'Andika', sans-serif !important;
	font-size: 3rem;
}
.ui2-lnr-qstn-cntr .ui2-lrg-wrd-fmt .qstn-bdy-cntr-51{
	font-family: 'Andika', sans-serif !important;
	font-size: 4rem;
}

.ui2-lnr-qstn-cntr .ui2-lrg-wrd-fmt .sel-3-large-cntr a{
	font-family: 'Andika', sans-serif !important;
	font-size: 3rem;
}
.ui2-lnr-qstn-cntr .ui2-nw-stc-fmt .qstn-bdy-cntr-51 {
	font-family: 'Andika', sans-serif !important;
	font-size: 2.5rem;
}
.ui2-lnr-qstn-cntr .ui2-nw-stc-fmt.stn-qstn-bdy-cntr{
	font-family: 'Andika', sans-serif !important;
	font-size: 2.5rem;
}
.qstn-sentence-mn-cntr {
    font-size: 2.5rem;
}
.rmv-brk-elm-by-mrg .qstn-bdy-cntr-51{
	margin-top: -10%;
}
.ui2-lnr-qstn-cntr .ui2-nw-stc-fmt .wrd-tg-elem {
    font-size: 2.5rem;
}
.ntf-hdr-cntr{
	font-size: 2rem;
}

.usr-pfl-cntr-itm.ovr-mn-cntr{
	width: 90%;
	padding: 0% 2%;
}
.under-lay-prl-cntr.ovr-mn-cntr{
	width: 90%;
	padding: 0% 2%;
}
.ovr-mn-cntr .usr-pfl-itm-txt {
    width: 75%;
    font-size: 2rem;
}
.story-elem-cntr{
	display: flex;
	justify-content: space-evenly;
	flex-wrap: wrap;
}
.story-elem-cntr a{
	background-color: #fff;
	border-radius: 15px;
	padding: 1% 2%;
	width: 22%;
	text-align: center;
	margin-bottom: 5%;
}
.story-elem-cntr a img{
	width: 85%;
}
.story-elem-cntr .hdr-ttl-itm span{
	display: block;
	margin-top: 5%;
}
.ovr-mn-cntr .usr-pfl-itm-txt a{
    font-size: 1em;
}
.bba-usr-dashboard-body-invite {
	margin-left: 0%;
	margin-top: 3%;
	padding: 0% 5%;
	border: none;
	display: flex;
	justify-content: center;
	
}

.nvt-mn-cntr{
	display: flex;
	width: 66%;
	align-items: center;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}
.sch-img-cntr{
	width: 40%;
	text-align: center;
}
.sch-img-cntr img{
	width: 100%;
}
.nvt-det-mn-cntr{
	width: 60%;
}
.nvt-bdy-hdr{
	font-size: 1.3rem;
	font-family: 'Inter', sans-serif;
	text-align: center;
	margin: 2% 0%;
}

/*invite part*/
.nvt-mn-cntr .container {
	max-width: 500px;
	padding: 2rem;
	background-color: #ffffff;
	border-radius: 8px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.nvt-mn-cntr form {
	width: 100%;
}
.nvt-mn-cntr .form-group {
	margin-bottom: 1.5rem;
}

.nvt-mn-cntr label {
	display: block;
	margin-bottom: 0.5rem;
	color: #555;
	font-weight: 600;
}

.nvt-mn-cntr input {
	width: 100%;
	padding: 0.75rem;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 1rem;
}

.nvt-mn-cntr input:disabled {
	background-color: #f5f5f5;
	cursor: not-allowed;
}

.nvt-mn-cntr input:focus {
	outline: none;
	border-color: #4A90E2;
	box-shadow: 0 0 0 2px rgba(74, 144, 226, 0.2);
}

.nvt-mn-cntr .password-container {
	position: relative;
}

.nvt-mn-cntr .password-toggle {
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	background: none;
	border: none;
	cursor: pointer;
	color: #666;
}

.nvt-mn-cntr button[type="submit"] {
	width: 100%;
	padding: 0.75rem;
	background-color: #21304D;
	color: white;
	border: none;
	border-radius: 4px;
	font-size: 1rem;
	cursor: pointer;
	transition: background-color 0.2s;
}

.nvt-mn-cntr button[type="submit"]:hover {
	background-color: #357ABD;
}
.nvt-mn-cntr .form-group.lst-frm-grp-cntr {
    margin-bottom: 0rem;
}
.nvt-notif-cntr{
	padding: 1% 1%;
    background-color: #fff0f0;
    color: #434343;
    border-radius: 10px;
    margin: 2% 0%;
	display: none;
}
.ui2-assignments-cntr{
	margin: 0% 0% 1% 0%;
	display: flex;
    justify-content: center;
	width: 30%;
}
.assignments-cntr{
	width: 96%;
	background-color: #ffffff;
	border-radius: 15px;
	display: flex;
    justify-content: center;
	align-items: center;
	padding: 1% 2%;
}
.assignments-cntr img{
	width: 15%;
}
.img-cntr{
	width: 100%;
}
.assignments-cntr a{
	text-align: center;
}
.assignments-cntr .txt-cntr{
	font-family: "Cherry Bomb One", system-ui;
    font-weight: 400;
    font-style: normal;
    font-size: 2rem;
}
.sb-hdr-elem{
	font-weight: bold;
}
.err-cntr-main{
	display: flex;
	justify-content: center;
}
.err-cntr-main .account-error-container {
	width: 50%;
	margin: 2rem auto;
	padding: 2rem;
	background: white;
	border-radius: 12px;
	box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
	text-align: center;
}

.err-cntr-main .error-icon {
	color: #ef4444;
	margin-bottom: 1rem;
}

.err-cntr-main .error-title {
	color: #1f2937;
	font-size: 1.5rem;
	font-weight: 600;
	margin-bottom: 0.75rem;
}

.err-cntr-main .error-message {
	color: #4b5563;
	line-height: 1.5;
	margin-bottom: 1.5rem;
	padding: 3% 0%;
}

.err-cntr-main .error-action {
	background: #3b82f6;
	color: white;
	padding: 0.75rem 1.5rem;
	border-radius: 6px;
	border: none;
	font-weight: 500;
	cursor: pointer;
	transition: background-color 0.2s;
}

.err-cntr-main .error-action:hover {
	background: #2563eb;
}
.ovrd-large-cntr{
	width: 100%;
	padding:2% 3%;
	font-family: 'Andika', sans-serif;
    font-weight: 400;
    font-size: 1.5rem;
}
.ovrd-large-cntr .cnt-hdr-mn-cntr{
	display: flex;
	align-items: center;
	margin-bottom: 1%;
}
.ovrd-large-cntr .cnt-hdr-mn-cntr img{
	width: 5%;
	margin-left: 5%;
}



















/* Base styles for the discount container */
.discount-badge {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 1rem;
    background: linear-gradient(135deg, #FF4E50, #F9D423);
    color: white;
    font-weight: bold;
    font-size: 1.3rem;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transform: rotate(-2deg);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Animated variant */
.discount-animated {
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% {
        transform: scale(1) rotate(-2deg);
    }
    50% {
        transform: scale(1.05) rotate(-2deg);
    }
    100% {
        transform: scale(1) rotate(-2deg);
    }
}

/* Modern flat style */
.discount-flat {
    background: #FF4E50;
    border-radius: 4px;
    padding: 0.75rem 1.5rem;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Hover effects */
.discount-badge:hover {
    transform: rotate(-2deg) scale(1.05);
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15);
}

/* Price emphasis */
.discount-price {
    font-size: 1.5rem;
    font-weight: 800;
    margin-right: 0.5rem;
}

.price-container {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	padding: 1.25rem;
	background: white;
	border-radius: 12px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
	margin: 1rem 0;
	border: 1px solid #f0f0f0;
}
@media (max-width: 640px) {
	.price-container {
		flex-direction: column;
		gap: 1rem;
		align-items: flex-start;
	}
}
.price-container>div:first-child{
	width: 40%;
	font-weight: bold;
	font-size: 1.3rem;
	color: #21304D;
}

/* Base styles for all spans */
.banner-container span {
    display: inline-block;
    font-size: 2.0rem;
    font-weight: 800;
    margin: 0 .5rem;
    padding: 0.5rem 1.5rem;
    position: relative;
    /*cursor: pointer;*/
    text-transform: uppercase;
    transition: all 0.3s ease;
}

/* Individual span styles */
.banner-container span:nth-child(1) {
    background: linear-gradient(45deg, #FF6B6B, #FFE66D);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1);
    /*animation: banner-bounce 2s infinite;*/
}

.banner-container span:nth-child(2) {
    background: linear-gradient(45deg, #4ECDC4, #556270);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    /*animation: banner-float 3s ease-in-out infinite;*/
}

.banner-container span:nth-child(3) {
    background: linear-gradient(45deg, #A8E6CF, #3EECAC);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    /*animation: banner-pulse 2s infinite;*/
}

/* Hover effects */
.banner-container span:hover {
    transform: scale(1.1);
    filter: brightness(1.1);
}

/* Underline effect on hover */
.banner-container span::after {
    content: '';
    position: absolute;
    width: 0;
    height: 4px;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    transition: width 0.3s ease;
    border-radius: 2px;
}

.banner-container span:nth-child(1)::after {
    background: #FF6B6B;
}

.banner-container span:nth-child(2)::after {
    background: #4ECDC4;
}

.banner-container span:nth-child(3)::after {
    background: #A8E6CF;
}

.banner-container span:hover::after {
    width: 80%;
}

/* Animations */
@keyframes banner-bounce {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px);
    }
}

@keyframes banner-float {
    0%, 100% {
        transform: translateY(0) rotate(-2deg);
    }
    50% {
        transform: translateY(-8px) rotate(2deg);
    }
}

@keyframes banner-pulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
    100% {
        transform: scale(1);
    }
}

/* Optional text shadow animation on hover */
@keyframes glowing {
    0% { text-shadow: 0 0 5px rgba(255,255,255,0.8); }
    50% { text-shadow: 0 0 20px rgba(255,255,255,0.8); }
    100% { text-shadow: 0 0 5px rgba(255,255,255,0.8); }
}

/* Media query for responsive design */
@media (max-width: 990px) {
    .banner-container span {
        font-size: 2.0rem;
        margin: 0 0.5rem;
        padding: 0.3rem 1rem;
    }
	.price-container>div:first-child {
		width: 100%;
	}
}

@media (max-width: 480px) {
    .banner-container span {
        font-size: 1.5rem;
        margin: 0 0.3rem;
        padding: 0.2rem 0.8rem;
    }
	.price-container>div:first-child {
		width: 100%;
	}
}

/* Optional container for better spacing */
.banner-container {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    padding: 0rem 2rem;
}
/* override to accommodate 3 subjects*/
.ovt-sbj-cnt-3{
	width: 94%;
}
.ovt-sbj-cnt-3 .sub-subjects-item {
    width: 28%;
}
.ovr-fnt-sz-3{
	font-size: 3.7rem;
	font-family: 'Andika', sans-serif;
}
.ovd-mrg-tp-0{
	margin-top: 0;
}
.grp-shp.objects-by-words.ovd-hgt-to-min-75>div{
    min-height: 102px;
	height: auto;
}
.ovrd-tp-to-1{
	margin-top: 1%;
}
.ovr-flx-align-center{
	align-items: center;
}
.lnr-qstn-box .ovr-flx-align-center label{
	display: block;
	font-size: 4rem;
}
#ondrp-all.ovr-flx-align-center .word-obj-cntr {
    margin-right: 0%;
}

.ltr-box-item.ovrd-fnt-sz-3 {
    font-size: 3rem;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	align-items: center;
	padding: 1% 0%;
}
.str-wrd-to-hglt{
	padding: .5% 1%;
	cursor: pointer;
	border-radius: 15px;
}
.hvr-elem-bkg-clr:hover{
	background-color: #dcdcdc;
}
.word-hlt-sel{
	background-color: #ff8282;
}
.sbm-anw-notif-cntr{
	visibility: hidden;
}
.ovd-a-mg-tp .lnr-sub-ans-btn {
    margin-top: 1%;
}
.mn-qstn-cntr-cph{
	background-color: #b6e3f7;
    margin-top: 2%;
    padding: 1% 0%;
	border-radius: 15px;
}
.upg-std-stg-lvl-t-nxt-cntr{
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 2% 0%;
	margin: 2% 0%;
	border: solid 2px green;
	border-radius: 15px;
	background-color: #00800026;
	font-size: 1.1rem;
}
.upd-cls-btn-cntr{
	width: 30%;
	margin-left: 5%;
}
.upd-cls-btn{
	font-size: 1.0rem;
	background-color: green;
	padding: 4% 6%;
	color: #ffffff;
	border-radius: 15px;
	cursor: pointer;
	-webkit-user-select: none;
    user-select: none;
}
/* Disable clicks and scrolls */
.disable-interaction {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0); /* Transparent overlay */
    z-index: 9999;
    pointer-events: none; /* Prevent interactions */
    overflow: hidden;
}

/* Disable scrolling */
body.disable-scroll {
    overflow: hidden;
}
.sch-nm-cntr-tag{
	font-weight: bold;
	padding: 5% 0% 0%;
	font-size: 1.5rem;
}
.no-asn-span-cntr{
	color: #ffffff;
	display: block;
	text-align: center;
}
.ic-fl-dig-tst-cntr{
	text-align: center;
}

/* Canvas Styles*/
.canvas-container {
	width: 100%;
	max-width: 500px;
	aspect-ratio: 3/4;
	margin: 0 auto;
}

#tracing-canvas {
	width: 100%;
	height: 100%;
	border: 2px solid #2c3e50;
	border-radius: 8px;
	background-color: white;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	touch-action:none
}
.pt-tg-qstn-cntr .trc-nmb-canvas-cntr{
	width: 25%;
}
.ovd-flx-to-clm{
	flex-direction: column;
}
.cntrl-nav-btns-cntr{
	margin-top: 5%;
	width: 70%;
	display: none;
	justify-content: center;
	justify-content: space-between;
}
.cntrl-nav-btns-cntr a{
	display: inline-block;
	font-size: 1.5rem;
	background-color: #ff8a00;
	padding: 2% 3%;
	color: #ffffff;
	border-radius: 15px;
	cursor: pointer;
	-webkit-user-select: none;
    user-select: none;
	box-shadow: rgb(0 0 0 / 67%) 0px 0px 8px 12px;
	font-weight: bold;
	font-family: 'Andika', sans-serif;
	letter-spacing: 1.5px;
}
.bck-next-modal-asn{
	margin-top: 5%;
    text-align: center;
    font-size: 1.7rem;
}
.bck-next-modal-asn img{
	max-width: 30%;
}
.dd-placehodler-1 {
    font-size: 3rem;
    padding: 1% 2%;
    color: #b7b7b7;
}
.spn-sml-wrd-cntr, 
.cma-itm-elem{
	font-size: 5rem;
}
.spn-sml-wrd-cntr{
	display: inline-block;
	margin-left: 4%;
	font-weight: bold;
}
.ui-scl-sgn-dom .lnr-ans-bx-sel a {
	font-size: 3rem;
}
.qstn-sml-gap{
	text-decoration: underline;
	color: #007bff;
}
.nbr-hld-cntr{
	position: relative;
}
.nbr-hld-match-cntr{
	position: absolute;
	z-index: 10;
	width: 100%;
	display: flex;
    justify-content: center;
    align-items: center;
    font-size: 5rem;
    color: #dfdfdf;
}
.drop-number{
	position: absolute;
	z-index: 20;
	width: 100%;
}
.schl-sgn-nly-cntr .ui2-assignments-cntr{
	width: 60%;
}
.schl-sgn-nly-cntr .assignments-cntr {
    padding: 5% 2%;
}
.schl-sgn-nly-cntr.ovt-sbj-cnt-3 {
    display: flex;
	align-items: center;
}
.schl-sgn-nly-cntr .sub-subjects-item-cntr{
	width: 100%;
}
.ui2-lnr-qstn-cntr .worded-problem-cntr.scl-lrg-stc-cntr{
	font-size: 4rem;
	font-family: "Handlee", cursive;
	text-align: center;
	font-weight: bold;
	padding: 2% 0%;
}
.multi-line-custom-drag-obj .draggable-div-cntr,
.mn-nmbr-drop{
	display: flex;
    align-items: center;
    justify-content: center;
	width: 20%;
}
.multi-line-custom-drag-obj .draggable-div-cntr{
	width: 17%;
    display: block;
    font-size: 4rem;
	box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
	text-align: center;
	font-weight: bold;
	padding: 1% 0%;
    position: relative;
    background-color: #ffffff;
}
.su-qst-html-cntr{
	font-size: 1.5rem;
}
.multi-line-custom-drag-obj .mn-nmbr-drop .draggable-div-cntr{
	width: 90%;
}
.multi-line-custom-drag-obj .objects-by-numbers>div>div{
	display: flex;
	align-items: center;
    justify-content: center;
}
.st-dsp-flx.lnr-ans-bx-sel a{
	display: flex	;
	justify-content: center;
	align-items: center;
}
.ovr-opt-cnt-2.lnr-ans-bx-sel a{
	width: 30%;
}
.qst-italics-stn{
	font-style: italic;
	font-weight: bold;
}
.img-wdt-40{
	display: flex;
	justify-content: center;
}
.img-wdt-40 img{
	width: 40% !important;
}
.stck-answer-cntr .lnr-ans-bx-sel{
	flex-direction: column;
}
.stck-answer-cntr .lnr-ans-bx-sel a {
    text-align: left;
    padding: 1% 2%;
    display: block;
    font-size: 2rem;
    width: 95%;
    margin-bottom: 2%;
	font-family: 'Andika', sans-serif !important;
}
.sng-drp-cntr{
	width: 10%;
	padding: 0% 2%;
}
.sng-drp-cntr .drop-word-obj-cntr{
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	background-color: #ffffff;
	height: 128px;
	-webkit-user-select: none;
    user-select: none;
}
.pre-filled-letter-cntr{
	padding: 0% 2%;
}
.pre-filled-letter-cntr span{
	font-size: 5rem;
	font-weight: bold;
	-webkit-user-select: none;
    user-select: none;
}
.lnr-wrd-cntr {
    align-items: center;
}

.pulsing-shadow {
    box-shadow: rgb(0 229 255) 0px 2px 20px 3px; /* Initial shadow */
    border-radius: 10px;
    animation: pulseShadow 1.5s infinite alternate ease-in-out;
}

@keyframes pulseShadow {
    0% {
        box-shadow: rgb(0 229 255) 0px 2px 20px 3px;
    }
    50% {
        box-shadow: rgb(0 229 255 / 70%) 0px 4px 30px 6px;
    }
    100% {
        box-shadow: rgb(0 229 255 / 30%) 0px 2px 15px 1px;
    }
}
.ui2-lnr-qstn-cntr .ovr-wdt-cntr-15>div{
	width: 90%;
}
.ui2-lnr-qstn-cntr .ovr-wdt-cntr-15{
    margin-bottom: 4%;
}
.ovr-wdt-cntr-15 .drop-word-obj-cntr.lnr-wrd-cntr {
    justify-content: space-evenly;
}
.ui2-lnr-qstn-cntr .ovr-wdt-cntr-15 .drop-word-obj-cntr .word-obj-cntr {
    width: 9%;
    justify-content: center;
}
.ui2-lnr-qstn-cntr .sng-drp-cntr .drop-word-obj-cntr .word-obj-cntr{
	justify-content: center;
}
.sng-drp-cntr .drop-word-obj-cntr .word-obj-cntr{
	width: 70%;
}
.ovr-wdt-cntr-15 .word-obj-cntr{
	font-size: 5rem;
}
.sng-drp-cntr .word-obj-cntr{
	font-size: 5rem;
}
.asn-dd-sgn-wrd-cntr .drop-word-obj-cntr.lnr-wrd-cntr{
	justify-content: center;
}

.ui2-lnr-qstn-cntr .ovr-wdt-cntr-15 .drop-word-obj-cntr .word-obj-cntr {
    margin-right: 2%;
}
.ui2-diag-test-mn .lnr-sub-ans-btn-cntr.add-mrg-tp-5 .lnr-sub-ans-btn{
	margin-top: 5%;
}
.ui2-diag-test-mn .sel-q-node-cntr{
	text-align: center;
}
.sel-word-diag-cntr span {
    display: inline;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    padding: .2% .5%;
    border-radius: 7px;
}
.sel-word-diag-cntr span:hover {
    background-color: #00f6ff;
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}
.sel-word-diag-cntr .wrd-clc-sel {
    background-color: #30adfa;
}
.sel-word-diag-cntr span.wrd-clc-sel:hover {
    background-color: #30adfa;
}
.img-dis-row{
	display: flex;
	justify-content: space-between;
	background-color: #fff;
	padding: 2% 2%;
}
.img-dis-row img{
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
	border-radius: 15px;
}
.qstn-cntr-text{
	text-align: center;
}
.bld-txt{
	font-weight: bold;
}
.nml-txt{
	font-weight: normal;
}
.fnt-sz-3{
	font-size: 3rem;
}
.fnt-sz-2{
	font-size: 2rem;
}
.fnt-sz-2-5{
	font-size: 2.5rem;
}
.fnt-fam-andika{
	font-family: 'Andika', sans-serif !important;
}
.itm-cntr-3-large.lnr-ans-bx-sel a {
    width: 26%;
}
.itm-cntr-2-large.lnr-ans-bx-sel a {
    width: 40%;
}
.span-gap-3 .qst-spn-cntr{
    min-width: 4%;
}
.fnt-sz-1-3{
	font-size: 1.3rem !important;
}
.img-wdt-60{
	text-align: center;
}
.img-wdt-60 img {
	text-align: center;
}
.ovrd-mrg-tp-2{
	margin-top: 8%;
}
.va-inf-fl{
	margin: 2% 0%;
	display: flex;
	justify-content: space-between;
}
.va-inf-fl a{
	width: 30%;
	background-color: #032e38;
	color: #fff !important;
	text-align: center;
	padding: 2% 0%;
}
.test-id-name{
	padding: 3% 0%;
	font-weight: bold;
}
.q-loop-counter{
	padding: 3% 0%;
	font-weight: bold;
}
.lnr-ans-bx-sel a.stn-clc-sel{
	background-color: #59b5ef;
}
.stck-answer-cntr.fnt-ovd-1-5 .lnr-ans-bx-sel a{
	font-size: 1.5rem;
}
.lnr-wrd-cntr.frc-no-wrap{
	flex-wrap: nowrap;
}
.lgn-itm-cntr{
	align-items: center;
}
.elem-clickable{
	cursor: pointer;
}
.elem-clickable:hover,
.elem-clickable.selected-item{
	box-shadow: rgb(0 227 255) 0px 1px 14px 10px
}
.img-dis-row.jst-spc-vly{
	justify-content: space-evenly;
}
.nbr-hld-match-cntr img{
	border-radius: 15px;
	opacity: 0.5;
}
.nbr-hld-match-cntr .img-cntr{
	display: flex;
    align-items: center;
    justify-content: center;
}
.drp-shp-cntr{
	display: flex;
    align-items: center;
    justify-content: center;
}
.drp-shp-cntr img{
	border-radius: 15px;
}
.img-ptn-cntr{
	background-color: #ffffff;
	display: flex;
	justify-content: center;
	align-items: center;
}
.img-ptn-cntr a{
	margin-right: 5%;
	display: inline-block;
}
.img-ptn-cntr a img{
	width: 80%;
}
.ui2-mrg-btm-0 .lnr-nsr-box.a-opt-img-cntr{
	background-color: #dedede;
	padding: 2% 0%;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 5%;
}
.a-opt-img-cntr a{
	margin-right: 5%;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 2% 1%;
	cursor: pointer;
}
.a-opt-img-cntr a:hover, .a-opt-img-cntr a.selected{
	box-shadow: rgb(0 227 255) 0px 1px 14px 10px
}
.a-opt-img-cntr a img{
	width: 80%;
	border-radius: 15px;
}
.a-opt-img-cntr a{
	border-radius: 15px;
	box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}
.in-qst-frac-cntr{
	width: 6%;
}
.itm-ovd-fnt-3{
	font-size: 3rem;
}
.jst-cnt-algn-ctr{
	display: flex;
	align-items: center;
	justify-content: center;
}
.ovd-qstn-bxs .pt-tg-qstn-cntr .bx-itm-3, .ovd-qstn-bxs .pt-tg-qstn-cntr .bx-itm-4 {
    width: 4%;
}
.ui2-lnr-qstn-cntr .bx-itm-cntr.ndv-nbr-item{
	font-size: 5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold;
}

.ui2-lnr-qstn-cntr .worded-problem-cntr.ovd-font-sz-4{
	font-size: 4rem;
}
.user-school-logo-cntr{
	display: flex;
	justify-content: center;
	align-items: center;
}
.user-school-logo-cntr>div{
	width: 35%;
}
.user-school-logo-cntr>div img{
	max-width: 100%;
}
.nmbr-cma-cntr span{
	font-size: 4rem;
}
.img-dis-row.max-width-30 img{
    max-width: 50%;
}
.img-dis-row  img{
	max-width: 78%;
}
.a-opt-img-cntr.rm-brd-rds-ovd a img,
.img-dis-row.rm-brd-rds-ovd img{
	border-radius: 0;
}
.img-dis-row.multiple-imgs-cntr{
	align-items: stretch;
}
.img-dis-row.multiple-imgs-cntr.cnt-img-3 img{
	max-width: 30%;
	margin-right: 5px;
}


/*custom drop downs for close test*/
/* Custom dropdown styling */
.custom-dropdown {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	margin: 0 4px;
}

.custom-dropdown select {
	display: none; /* Hide original select */
}

.dropdown-selected {
	background-color: #00fdff;
	color: var(--text-light);
	padding: 0px 16px;
	border-radius: 8px;
	cursor: pointer;
	min-width: 180px;
	display: inline-block;
	user-select: none;
	font-weight: 500;
	transition: all 0.3s ease;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	text-align: center;
}

.dropdown-selected:hover {
	background-color: #41b7ed;
}

.dropdown-selected:after {
	content: "\f0dd";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	margin-left: 10px;
	transition: transform 0.3s ease;
}

.custom-dropdown.open .dropdown-selected:after {
	transform: rotate(180deg);
}

.dropdown-items {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	background-color: #ffae00;
	border-radius: 8px;
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
	margin-top: 5px;
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	z-index: 10;
	transition: all 0.3s ease;
}

.custom-dropdown.open .dropdown-items {
	max-height: 250px;
	opacity: 1;
}

.dropdown-item {
	padding: 5px 16px;
	cursor: pointer;
	transition: background 0.2s;
}

.dropdown-item:hover {
	background-color: rgba(99, 102, 241, 0.1);
}
.qst-spn-cntr.sml-txt-gp{
	min-width: 2%;
    margin-left: 1%;
}
.img-wdt-13 img{
	width: 13% !important;
}
.in-text-frac-bdy{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
}
.in-text-frac-cntr{
	margin: 0% 3%;
	width: 30%;
}
.crt-ans-cntr, .crt-ans-cntr-std{
	font-size: 1.2rem;
	font-weight: bold;
	background-color: #c4ffb1;
	padding: 1% 2%;
	text-align: center;
}
.cga-hdr-cntr{
	width: 100%;
	text-align: center;
}
.cga-hdr-cntr>div{
	width: 50%;
	font-family: 'Andika', sans-serif;
}
.cga-notif-cntr{
	font-family: 'Andika', sans-serif;
}
.cga-lrn-prv-bdy{
	display: flex;
	justify-content: end;

}
.cga-lrn-prv-cntr{
	width: 40%;
}
.cga-lrn-prv-cntr a{
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #377db5;
    color: #ffffff !important;
	padding: 5% 0%;
    font-weight: bold;
    cursor: pointer;
    border-radius: 15px;
    -webkit-user-select: none;
    user-select: none;
	width: 100%;
}
.lnr-img-cntr {
    align-items: center;
}
.selected-answer-cls{
    box-shadow: rgb(251 130 0) 0px 1px 9px 7px;
}
.multiline-fnt-sz-a{
    display: block;
    font-size: 1.2rem;
    margin-bottom: 2%;
}
@keyframes bouncePulseRotateFluid {
	0% {
		transform: scale(0.97) rotate(0deg);
	}
	25% {
		transform: scale(1.2) rotate(15deg);
	}
	50% {
		transform: scale(0.96) rotate(-10deg);
	}
	75% {
		transform: scale(1.08) rotate(10deg);
	}
	100% {
		transform: scale(0.97) rotate(0deg);
	}
}

.img-cntr.alm-bl-cntr img {
	animation: bouncePulseRotateFluid 2s linear infinite;
	transform-origin: center center;
	will-change: transform;
}

/*override all fonts for reports*/
.bba-usr-dashboard-body.report-style-ovd{
	width: 90%;
}
.report-style-ovd .ui2-lnr-qstn-cntr {
    width: 90%;
}
.report-style-ovd,
.report-style-ovd .lnr-qstn-cntr .lnr-ans-bx-sel a,
.report-style-ovd .lnr-qstn-cntr .lnr-qstn-box label,
.report-style-ovd .ui2-lnr-qstn-cntr .worded-problem-cntr,
.report-style-ovd .crt-ans-cntr a
{
	font-size: 1.2rem;
	font-family: 'Andika', sans-serif;
}
.report-style-ovd .lnr-qstn-cntr .lnr-qstn-box label{
	margin: 0;
}
.report-style-ovd .aud-cntr{
	display: none;
}
.q-block-cntr-0, .grp-bx-answ-cntr-mrg-btm{
	margin-bottom: 3%;
	padding-bottom: 3%;
	border-bottom: solid 10px #a7a7a7;
}
.report-style-ovd .qstn-tag-lbl{
	font-size: 1.1rem;
	padding-bottom: 2%;
	color: #737373;
}
.u-gvn-ans-cntr{
	font-weight: bold;
    padding: 1% 2%;
    text-align: center;
}
.u-gvn-ans-cntr.wrg{
    background-color: #ffceb1;
}
.u-gvn-ans-cntr.crt{
	background-color: #c4ffb1;
}
.u-gvn-ans-cntr.partial-crt{
	background-color: #fff0b1;
}
.u-gvn-ans-cntr.dflt{
	background-color: #ffffff;
}
.ast-vw-ans-ai{
    font-size: 1rem;
    display: none;
}
.test-details>div{
	display: flex;
	align-items: center;
}
.test-details span{
	display: block;
	border-bottom: solid thin rgb(189, 189, 189);
	padding: 0.5% 0%;
}
.test-details span.ast-nm-tag{
	width: 20%;
	color: #5b5b5b;
}
.report-info-bdy{
	padding-left: 2%;
}

.ui2-prg-rpt-bdy{
	/*display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 5%;*/
	display: flex;
    justify-content: space-between;
    margin-bottom: 5%;
    flex-wrap: wrap;
}
.ui2-prg-rpt-bdy .esmk-rprt-chld-itm{
	box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    border: none;
    width: 24%;
	margin-right: 3%;	
    margin-bottom: 2%
}
.ui2-prg-rpt-bdy .esmk-rprt-chld-itm a {
    color: #2f2f2f !important;
    font-weight: bold;
    letter-spacing: 2px;
    display: block;
    background-color: #909090;
    padding: 5% 10%;
    text-align: center;
	border-radius: 15px;
	text-transform: none;
	font-size: 1rem;
	width: -webkit-fill-available;
}
.ui2-prg-rpt-bdy .esmk-rprt-chld-itm a.active-child-acc {
	background-color: #ff7300;
	color: #000000 !important;
}

.pagination {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 5%;
	user-select: none;
}

.pagination a {
	color: #555;
	text-decoration: none;
	padding: 8px 14px;
	margin: 0 4px;
	border-radius: 4px;
	transition: all 0.3s ease;
	font-size: 1.1rem;
	font-family: 'Andika', sans-serif;
}

.pagination a:hover:not(.active) {
	background-color: #f1f1f1;
}

.pagination a.active {
	background-color: #3f87b2;
	color: white;
	font-weight: bold;
}

.pagination .disabled {
	color: #ccc;
	pointer-events: none;
}

.page-content {
	padding: 20px 0;
	min-height: 200px;
	text-align: center;
}

@media (max-width: 600px) {
	.pagination {
		flex-wrap: wrap;
	}

	.pagination a {
		margin: 4px;
	}
}
.scl-rpr-aly-tbl i.fas{
	color: #6e6e6e;
}


.cls-ovr-vw-cntr{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
  }
  .cls-ovr-vw-cntr>div{
	background-color: #ffffff;
	width: 40%;
	border-radius: 15px;
	display: flex;
	align-items: center;
	padding: 1% 2%;
  }
  .cls-ovr-vw-cntr>div>div{
	display: flex;
	flex-direction: column;
  }
  .sch-std-img{
	width: 40%;
  }
  .sch-std-img img{
	max-width: 100%;
	height: auto;
  }
  .sch-std-counter-cntr{
	width: 60%;
  }
  .sch-std-cnt{
	display: block;
	text-align: center;
	font-weight: bold;
	font-size: 2.5rem;
  }
  .sch-std-tag{
	font-size: 0.9rem;
	display: block;
	text-align: center;
	color: #626262;
  }
  
  .cls-ovr-pfr-cntr{
	margin-top: 5%;
	background-color: #ffffff;
	border-radius: 15px;
  }
  .cls-ovr-pfr-bdy{
	display: flex;
	padding: 1% 2%;
	align-items: center;
  }
  .pfm-hdr-cntr{
	width: 30%;
  }
  .pfm-hdr-cntr span{
	font-weight: bold;
	color: #2c2c2c;
  }
  .pfm-sel-cntr{
	width: 70%;
	display: flex;
	justify-content: flex-end;
	align-items: center;
  }
.cht-key-mn-cntr{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	padding: 0% 2%;
  }
  .key-itm-cntr{
	  display: flex;
	width: 50%;
	background-color: #ddfeff;
	margin-bottom: 1.5%;
  }
  .key-itm-cntr label{
	  display: block;
	padding: 2% 0%;
	font-size: 0.8rem;
	color: #494949;
  }
  .key-itm-cntr label.lbl-value{
	  width: 30%;
  }
  .cht-key-mn-bdy{
	margin-top: 5%;
  }
.scl-rpr-aly-tbl td a{
	font-size: 1rem;
	font-family: 'Andika', sans-serif;
	color: #0056b3;
}
.pre-v-sgn-prf .lnr-sd-hdr{
	padding: 2% 0%;
}

.bba-usr-itm.bba-usr-mcrs.ui2-ovd-back {
    background-color: transparent;
    padding: 0.2% 0%;
    border-radius: 0px;
}
.no-data-message{
	display: inline-block;
	position: absolute;
	top: 30%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: rgb(234 234 234);
	padding: 3rem 20px;
	border-radius: 5px;
	font-weight: bold;
	color: rgb(51, 51, 51);
	width: 50%;
	text-align: center;
	z-index: 100;
  }
  .graph-pfm-cntr.ovrd-width-100--scl .no-data-message{
	width: 50%;
  }
  .ovrd-width-100--scl{
	position: relative;
  }

/*logo shimmer*/
.ui2-dsb-logo-bdy {
	text-align: center;
}

.ui2-dsb-logo-cntr {
	position: relative;
	width: 200px;
	height: 200px;
	margin: 0 auto;
}

.ui2-dsb-logo-cntr .logo-placeholder {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background: linear-gradient(90deg, #f0f0f0 25%, #f8f8f8 50%, #f0f0f0 75%);
	background-size: 200% 100%;
	animation: shimmer 1.5s infinite;
}

.ui2-dsb-logo-bdy .school-name-placeholder {
	height: 24px;
	width: 180px;
	margin: 20px auto 0;
	border-radius: 4px;
	background: linear-gradient(90deg, #f0f0f0 25%, #f8f8f8 50%, #f0f0f0 75%);
	background-size: 200% 100%;
	animation: shimmer 1.5s infinite;
}

@keyframes shimmer {
	0% {
		background-position: -200% 0;
	}
	100% {
		background-position: 200% 0;
	}
}
.ui2-schl-list{
	display: flex;
    align-items: center;
    justify-content: space-evenly;
}
.ui2-dsb-logo-cntr.ovd-h-w {
	position: relative;
	width: 100%;
	height: auto;
	margin: 0 auto;
}
.ui2-schl-list img{
	max-width: 60%;
}
.scl-nm-tag-cntr{
    font-weight: bold;
    font-family: 'Andika', sans-serif;
}
.usr-sel-opt{
	font-weight: bold;
}  
.usr-sel-opt i{
	font-size: 1.0rem;
	color: #000000;
}  
.usr-sel-opt.wrg{
	padding: 0% 0.5%;
	background-color: #ffceb1;
}
.usr-sel-opt.crt{
	padding: 0% 0.5%;
	background-color: #c4ffb1
}
.cls-ovd-spc{
	line-height: 2.5;
}
.crt-clz-tst-gp{
    font-weight: normal;
}


.option {
	padding: 15px 20px;
	border-bottom: 1px solid #f0f0f0;
	transition: background-color 0.2s;
}

.option:hover {
	background-color: #f9f9f9;
}

.option-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 8px;
}

.option-text {
	display: flex;
	align-items: center;
	font-weight: bold;
	color: #333;
}

.option-correct {
	color: #28a745;
}

.correct-badge {
	background-color: #e6f7ee;
	color: #28a745;
	font-size: 0.7rem;
	padding: 3px 8px;
	border-radius: 12px;
	margin-left: 10px;
}

.option-count {
	color: #666;
}

.option-count .count {
	font-weight: 600;
}

.option-count .percentage {
	font-size: 0.85rem;
	margin-left: 3px;
}

.progress-bar {
	width: 100%;
	height: 8px;
	background-color: #e9ecef;
	border-radius: 4px;
	overflow: hidden;
	margin-top: 8px;
}

.progress {
	height: 100%;
	border-radius: 4px;
	background-color: #ffb900;
}

.progress-correct {
	background-color: #28a745;
}

@media (max-width: 576px) {
	.option-header {
		flex-direction: column;
		align-items: flex-start;
	}
	
	.option-count {
		margin-top: 5px;
	}
}
.q-analysis-cntr{
	background-color: #ffffff;
	font-family: 'Andika', sans-serif;
	padding: 3% .5%;
}
.q-analysis-hdr-bdy{
	padding: 2% .5%;
	font-weight: bold;
	background-color: #ffbb004a;
	border-radius: 15px;
}

.rvs-qtn-btn-cntr{
	display: flex;
	margin-top: 1%;
	margin-bottom: 6%;
}
.esmk-revise-answer{
	padding: 2% 4%;
	font-weight: bold;
	width: 40%;
	background-color: #7fd9d8;
	border-radius: 15px;
	cursor: pointer;
}
.esmk-revise-answer span i{
	color: #ff0000a6;
}
.ovd-vdt-sgn-adm.ui2-lnr-qstn-cntr {
    border: solid 5px #9bd8fb;
	background-color: #ffffff;
}
h4.ovd-mdl-hdr{
	font-family: 'Andika', sans-serif;
	font-size: 1.2rem;
    margin-bottom: 5%;
}
.ovd-localized-lc-cntr .ui2-mdl-licenses-mn .usr-prc-pckg-card .usr-prc-pckg-itm-bdy {
    line-height: 3;
}
.ui2-fnt-0-8{
    margin-top: 1%;
}
.img-dis-row.ovd-5-img img{
	max-width: 17%;
}
.img-dis-row.ovd-brd-rds img{
	border-radius: 0px;
}
.tbl-fmt-lst-fnt-fml{
    font-family: 'Andika', sans-serif;
}
.tbl-fmt-lst-fnt-fml table td{
    font-size: 0.9rem;
}
.mdl-btn-upt-stl{
	display: flex;
	justify-content: center;
    align-items: center;
}
.esmk-cfm-mdl-btn{
	display: block;
    background-color: #ffd100;
    font-size: 1.5rem;
    font-family: 'Andika', sans-serif;
    font-weight: bold;
    padding: 2% 10%;
    border-radius: 10px;
    cursor: pointer;
}
.sng-drp-inline-cntr{
	margin: 0% 3% 2% 3%;
}
.sng-drp-inline-cntr .drop-word-obj-cntr {
	background-color: #ffffff;
    height: auto;
	width: 6em;
    -webkit-user-select: none;
    user-select: none;
}
.ovd-fnt-2{
	font-size: 2rem;
	line-height: 2;
	font-weight: bold;
}

.ui2-lnr-qstn-cntr .ovr-wdt-cntr-15 .drop-word-obj-cntr .word-obj-cntr.opt-dsp-stl {
    width: auto;
    justify-content: center;
	font-size: 3rem;
}
.vw-sgn-ovd .ovd-fnt-2 {
	font-size: 1.2rem;
    line-height: 1.5;
}
.vw-sgn-ovd .lnr-wrd-cntr {
    min-height: 50px;
    flex-wrap: wrap;
}
.ui2-lnr-qstn-cntr .vw-sgn-ovd .ovr-wdt-cntr-15 .drop-word-obj-cntr .word-obj-cntr.opt-dsp-stl {
    font-size: 2rem;
}
.mdl-snd-tst-v2{
	background-color: #21304D;
	color: #ffffff;
	font-size: 1.1rem;
	font-family: 'Andika', sans-serif;
	padding: 2% 5%;
	border-radius: 15px;
}
.modal-img-elem{
	width: 17%;
	height: auto;
}
.dsp-flx{
	display: flex;
}
.wrp-no-prop{
	flex-wrap: nowrap;
}
.jst-cnt-center{
	justify-content: center;
}
.aln-itm-center{
	align-items: center;
}
.mdl-h3-cntr>div{
	width: 50%;
}
.aln-txt-left{
	text-align: left;
}
.aln-txt-right{
	text-align: right;
}
.padding-right-2-pct{
	padding-right: 2%;
}
.padding-left-2-pct{
	padding-left: 2%;
}
.img-dis-row.ovd-jst-center{
    justify-content: center;
}
.gt-db-btn-ctr a{
    display: inline-block;
	align-items: center;
    position: relative;
    padding: 2% 8%;
	font-weight: bold;
    cursor: pointer;
    border-radius: 5px;
    -webkit-user-select: none;
    user-select: none;
	background-color: #da5d09;
	color: #ffffff !important;
}
.vw-sgn-sts-bdy-cntr{
	text-align: center;
}
.vw-sgn-sts-btn-cntr{
	margin-top: 3%;
	
}
.vw-sgn-sts-btn{
	display: inline-block;
	background-color: #da5d09;
	color: #ffffff !important;	
	padding: 2% 8%;
	border-radius: 15px;
	font-size: 1.0rem;
}
.a-opt-img-cntr a.rmv-flx-cls{
	display: block;
	text-align: center;
}
.ans-tp-div-cntr{
	font-weight: bold;
	font-size: 2.5rem;
}
.dd-in-html{
	text-align: center;
}
.lnr-wrd-cntr>div.mv-dd-z-index{
	z-index: 2000;
}

.opt-html-cntr img{
	max-width: 200px;
	height: auto;
}
.cntr-align{
	text-align: center !important;
}
.img-dis-row.cntr-align{
	justify-content: center;
}
.chl-grd-nm-tag{
	display: block;
    background-color: aliceblue;
    padding: 1% 2%;
    border-radius: 15px;
    font-size: 0.9rem;
}
/*override font*/
.ui2-cls-cntr .esmk-acc-cntr-itm{
	font-family: 'Andika', sans-serif;
}
.fl-id-input-cntr{
	display: flex;
	justify-content: center;
	margin-top: 10%;
	font-weight: bold;
}
.fl-id-input-cntr>div{
	width: 50%;
}
.fl-id-input-cntr input{
    display: block;
    width: 100%;
    padding: 5px 14px;
    font-weight: bold;
    font-size: 1.3rem;
}
.gm-init-dom{
	margin-top: 6%;
	display: flex;
	justify-content: center;
}
.gm-init-dom>div{
	width: 50%;
}
.img-wdt-30{
	flex-wrap: wrap;
}
.img-dis-row.img-wdt-30 img{
    max-width: 30%;
	margin-right: 3%;
}
.snapplify-sso-btn-cntr{
	margin-top: 5%;
	width: 54%;
	display: flex;
	justify-content: center;
}
.snapplify-login-button-cntr{
	display: flex;
	align-items: center;
	justify-content: center;
	border: solid thin rgb(133, 133, 133);
	padding: 2% 4%;
	border-radius: 5px;
}
.lgn-snp-txt-cntr{
	margin-left: 5%;
	width: 80%;
	font-size: 0.95rem;
	color: #21304D;
}
.lgn-snp-img-cntr{
	width: 20%;
}
.lgn-snp-img-cntr img{
	max-width: 50%;
	height: auto;
}

/* Override styles*/
.plugin-sign-ins {
    margin-top: 2%;
}
.bba-socials-btns {
    margin-top: 1%;
}
/* discount referral css */
.redemption-container {
	background: rgba(255, 255, 255, 0.95);
	backdrop-filter: blur(10px);
	border-radius: 20px;
	padding: 40px;
	max-width: 768px;
	width: 100%;
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.2);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.redemption-container:hover {
	transform: translateY(-5px);
	box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15);
}

.container-header {
	text-align: center;
	margin-bottom: 30px;
}

.container-header h2 {
	color: #333;
	font-size: 28px;
	font-weight: 700;
	margin-bottom: 8px;
	background: linear-gradient(135deg, #667eea, #764ba2);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.container-header p {
	color: #666;
	font-size: 16px;
	line-height: 1.5;
}

.code-types {
	display: flex;
	gap: 10px;
	margin-bottom: 25px;
}

.code-type-btn {
	flex: 1;
	padding: 12px 16px;
	border: 2px solid #e1e1e1;
	background: white;
	border-radius: 12px;
	cursor: pointer;
	transition: all 0.3s ease;
	font-weight: 600;
	color: #666;
	text-align: center;
}

.code-type-btn:hover {
	border-color: #667eea;
	color: #667eea;
	transform: translateY(-2px);
}

.code-type-btn.active {
	background: linear-gradient(135deg, #667eea, #764ba2);
	color: white;
	border-color: transparent;
	box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
}

.input-group-dct-cde {
	margin-bottom: 25px;
	position: relative;
}

.input-label {
	display: block;
	margin-bottom: 8px;
	color: #333;
	font-weight: 600;
	font-size: 14px;
}

.code-input-wrapper {
	position: relative;
}

.code-input {
	width: 100%;
	padding: 16px 20px;
	border: 2px solid #e1e1e1;
	border-radius: 12px;
	font-size: 16px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 2px;
	text-align: center;
	transition: all 0.3s ease;
	background: white;
}

.code-input:focus {
	outline: none;
	border-color: #667eea;
	box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
	transform: scale(1.02);
}

.code-input.success {
	border-color: #10b981;
	background: rgba(16, 185, 129, 0.05);
}

.code-input.error {
	border-color: #ef4444;
	background: rgba(239, 68, 68, 0.05);
	animation: shake 0.5s ease-in-out;
}

@keyframes shake {
	0%, 100% { transform: translateX(0); }
	25% { transform: translateX(-5px); }
	75% { transform: translateX(5px); }
}

.input-icon {
	position: absolute;
	right: 16px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 20px;
	opacity: 0;
	transition: all 0.3s ease;
}

.input-icon.show {
	opacity: 1;
}

.input-icon.success {
	color: #10b981;
}

.input-icon.error {
	color: #ef4444;
}

.redeem-btn {
	width: 100%;
	padding: 16px;
	background-color: #21304D;
	color: white;
	border: none;
	border-radius: 12px;
	font-size: 16px;
	font-weight: 700;
	cursor: pointer;
	transition: all 0.3s ease;
	position: relative;
	overflow: hidden;
}

.redeem-btn:hover:not(:disabled) {
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(102, 126, 234, 0.3);
}

.redeem-btn:active:not(:disabled) {
	transform: translateY(0);
}

.redeem-btn:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

.redeem-btn.loading {
	color: transparent;
}

.redeem-btn.loading::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 20px;
	height: 20px;
	border: 2px solid rgba(255, 255, 255, 0.3);
	border-top: 2px solid white;
	border-radius: 50%;
	animation: spin 1s linear infinite;
}

@keyframes spin {
	0% { transform: translate(-50%, -50%) rotate(0deg); }
	100% { transform: translate(-50%, -50%) rotate(360deg); }
}

.status-message {
	margin-top: 15px;
	padding: 12px 16px;
	border-radius: 8px;
	font-weight: 600;
	text-align: center;
	opacity: 0;
	transform: translateY(-10px);
	transition: all 0.3s ease;
}

.status-message.show {
	opacity: 1;
	transform: translateY(0);
}

.status-message.success {
	background: rgba(16, 185, 129, 0.1);
	color: #10b981;
	border: 1px solid rgba(16, 185, 129, 0.2);
}

.status-message.error {
	background: rgba(239, 68, 68, 0.1);
	color: #ef4444;
	border: 1px solid rgba(239, 68, 68, 0.2);
}

.status-message.info {
	background: rgba(59, 130, 246, 0.1);
	color: #3b82f6;
	border: 1px solid rgba(59, 130, 246, 0.2);
}

.code-format-hint {
	font-size: 12px;
	color: #888;
	text-align: center;
	margin-top: 8px;
}

@media (max-width: 480px) {
	.redemption-container {
		padding: 30px 20px;
	}
	
	.container-header h2 {
		font-size: 24px;
	}
	
	.code-types {
		flex-direction: column;
	}
}
.dsc-cde-cntr-main{
	display: flex;
	justify-content: center;
}
.dd-small-font{
	font-size: 1.5rem;
}
.img-cntr-cnt{
	justify-content: center;
}


.img-dis-row img.no-bdr-rds{
	border-radius: 0;
}

/* Special styles for in questions */
.drp-dwn-mn-cntr{
	display: flex;
	justify-content: space-between;
	margin-top: 2%;
}
.drp-dwn-cntr-lft, .drp-dwn-cntr-rght{
	width: 45%;
	padding: 2% 3%;
}
.drp-dwn-cntr-lft{
	border-right: solid thin rgb(156, 230, 255);
}
.drp-dwn-cntr-rght{
	border-left: solid thin rgb(156, 230, 255);
}
.drp-dwn-mn-cntr span.hdr-tg{
	display: block;
	text-align: center;
}
.drp-dwn-mn-cntr .dd-bdy-68 select {
	width: 100%;
	padding: 10px;
	border: 2px solid #6d6d6d;
	border-radius: 5px;
	font-size: 14px;
	background-color: white;
	transition: border-color 0.3s ease;
	margin: 2% 0%;
}

.drp-dwn-mn-cntr .dd-bdy-68 select:focus {
	outline: none;
	border-color: #007bff;
	box-shadow: 0 0 0 3px rgba(0,123,255,0.25);
}
.qst-spn-tag-ntf{
	font-size: 0.9rem;
	font-style: italic;
}
.cls-sgn-dpr-cntr{
	background-color: #ffffff;
	border-radius: 10px;
	margin-bottom: 5%;
}
.ui2-lnr-qstn-cntr .worded-problem-cntr.fnt-sz-1_2{
	font-size: 1.2rem;
}
.placeholder-selected{
	color: gray;
	font-style: italic;
}
.banner-btn-cntr{
	padding-left: 5%;
}
.banner-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 24px;
    border: none;
    border-radius: 8px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    text-align: center;
    min-width: 120px;
}

.ovd-fnt-1-2{
	font-size: 1.2 rem;
	line-height: 1.5;
}
.dbl-inpt-cntr-asg{
	display: flex;
	align-items: center;
}
.dbl-inpt-cntr-asg .usr-inpt-tag{
	margin-right: 2%;
	display: inline-block;
}


/*overrides 5656*/
.skill-instr-cntr {
    flex-direction: column;
	align-items: flex-start;
}
.aud-cntr {
    width: 100%;
}
.txt-instr-cntr {
    width: 100%;
	margin-top: 3%;
}
.lnr-qstn-box label.lbl-hdr-instr{
	margin: 0% 0%;
}
/*override end 5656*/

.qst-pro-sts-mn-cntr.stats {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1rem;
}

.qst-pro-sts-mn-cntr .completed {
	color: #ff8400;
	font-weight: 700;
	background: rgba(255, 132, 0, 0.1);
	padding: 1% 3%;
	border-radius: 20px;
	border: 1px solid rgba(255, 132, 0, 0.3);
	margin-right: 2%;
}

.qst-pro-sts-mn-cntr .remaining {
	color: #21304D;
	font-weight: 700;
	background: rgba(33, 48, 77, 0.1);
	padding: 1% 3%;
	border-radius: 20px;
	border: 1px solid rgba(33, 48, 77, 0.3);
}
.test-name{
	margin-top: -1%;
	margin-bottom: 2%;
	font-size: 1.1rem;
	font-weight: bold;
}
.test-name span{
	font-weight: normal;
	color: #222222;
}
.upd-grade{
	position: relative;
	display: flex;
    align-items: center;
    justify-content: space-evenly;
}
.upd-grade label{
	display: block;
	margin-bottom: 12px;
	font-weight: 600;
	color: #4a5568;
	font-size: 16px;
	letter-spacing: 0.5px;
}
.upd-grade .upd-grd-sel-cntr{
	width: 60%;
}
.esk-grade-slt-upd-v1{
	width: 100%;
	padding: 16px 20px;
	border: 2px solid #e2e8f0;
	border-radius: 12px;
	font-size: 16px;
	color: #2d3748;
	background: white;
	cursor: pointer;
	transition: all 0.3s ease;
	appearance: none;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
	background-position: right 12px center;
	background-repeat: no-repeat;
	background-size: 16px;
	padding-right: 50px;
}
.esk-grade-slt-upd-v1:focus {
	outline: none;
	border-color: #667eea;
	box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
	transform: translateY(-2px);
}

.esk-grade-slt-upd-v1:hover {
	border-color: #cbd5e0;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}
.upd-acc-mn-cntr{
	background: rgba(255, 255, 255, 0.95);
	backdrop-filter: blur(20px);
	border-radius: 20px;
	padding: 40px;
	/* box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.2); */
	width: 100%;
	transform: translateY(0);
	transition: all 0.3s ease;
	padding-bottom: 0;
}
.hdr-h3-mdl-ttl {
	text-align: center;
	margin-bottom: 30px;
	color: #21304D;
	font-size: 28px;
	font-weight: 700;
}
.cls-sts-info-cntr{
	width: 100%;
	margin-bottom: 4% !important; /* Force margin on class name*/
}
.upd-acc-mn-cntr .mod-det-btn-cntr a {
	padding: 2% 10%;
}
.cls-upd-post-notif.ui2-mn-notification{
	width: 100%;
	margin: 4% 2%;
}
.img-dis-row.img-wdt-50 img { /*Used for large width images and small height*/
    max-width: 50%;
}
.dbl-npt-cntr.text-input-bx .lrn-usr-input-box input[type=text] {
    width: 26%;
    font-size: 2.5rem;
}
.dbl-npt-cntr .dbl-inpt-cntr-asg{
	justify-content: space-evenly;
}
.pdn-tp-btm-5{
	padding: 5% 0% !important;
}
.id-match-dom>div{
	padding: 1% .5%;
	margin-left: 2%;
	margin-top: 1%;
	width: 25%;
}
.hdr-sct-vld-2{
	display: block;
	margin-top: 3%;
	background-color: #bbbbbb;
	padding: .5%;
	border-radius: 10px;
}
.id-mm-mtc{
	background-color: #aaff9d;
}
.id-mmi-mtc{
	background-color: #ffcc9d;
}
.id-mimi-mtc{
	background-color: #ffcc9d;
}
.int-fld-notif-cntr{
	margin-top: 5%;
}
.int-fld-notif-cntr .ui2-mn-notification{
	font-size: 1.1rem;
	font-family: 'Andika', sans-serif;
}
.int-fld-notif-cntr .ui2-mn-notification h3{
	text-align: center;
	font-size: 1.5rem;
}
input[type=text], input[type=password], input[type=number]{
	font-family: 'Andika', sans-serif !important;
}

/* PARENT ASSIGNMENTS BREAKDOWN*/
.rwd-table {
  margin: auto;
  min-width: 300px;
  max-width: 100%;
  border-collapse: collapse;
}

.rwd-table tr:first-child {
  border-top: none;
 /* background: #428bca;
  color: #fff;*/
}

.rwd-table tr {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  background-color: #f5f9fc;
}

.rwd-table tr:nth-child(odd):not(:first-child) {
  background-color: #ebf3f9;
}

.rwd-table th {
  display: none;
}

.rwd-table td {
  display: block;
}

.rwd-table td:first-child {
  margin-top: .5em;
}

.rwd-table td:last-child {
  margin-bottom: .5em;
}

.rwd-table td:before {
  content: attr(data-th) ": ";
  font-weight: bold;
  width: 70%;
  display: inline-block;
  color: #000;
}

.rwd-table th,
.rwd-table td {
  text-align: left;
}

.rwd-table {
  color: #333;
  border-radius: .4em;
  overflow: hidden;
}

.rwd-table tr {
  border-color: #bfbfbf;
}

.rwd-table th,
.rwd-table td {
  padding: .5em 1em;
}

.vtr-nm-prf-cntr{
	display: flex;
	align-items: center;
}
.vtr-nm-prf-cntr .img-cnt-prf{
	width: 30%;
}
.vtr-nm-prf-cntr .img-cnt-prf img{
	width: 60%;
}
@media screen and (max-width: 768px) {
  .rwd-table tr:nth-child(2) {
    border-top: none;
  }

	table.ovd-tbl-mobile tr td:not(:first-child),
	table.ovd-tbl-mobile tr th:not(:first-child) {
		transform: none;       /* reset */
		z-index: auto;         /* reset */
		transition: none;	   /* reset */
	}

	table.ovd-tbl-mobile tr td:not(:first-child){
        display: block;
    }
	table.ovd-tbl-mobile tr th:first-child {
        width: 100%;
        display: none;
    }
	table tr td:not(:first-child) {
        width: 100%;
	}

	.vtr-nm-prf-cntr .img-cnt-prf img{
		width: 60%;
	}
	.rwd-table tr td:first-child:before {
  		content: attr(data-th) "";
	}

}
@media screen and (min-width: 769px) {
  .rwd-table tr:hover:not(:first-child) {
    background-color: #d8e7f3;
  }
  .rwd-table td:before {
    display: none;
  }
  .rwd-table th,
  .rwd-table td {
    display: table-cell;
    padding: .25em .5em;
  }
  .rwd-table th:first-child,
  .rwd-table td:first-child {
    padding-left: 0;
  }
  .rwd-table th:last-child,
  .rwd-table td:last-child {
    padding-right: 0;
  }
  .rwd-table th,
  .rwd-table td {
    padding: 1em !important;
  }
}

.loading-text-cntr{
	font-family: "Quicksand", sans-serif;
	color: #7d7575;
	font-size: 0.9rem;
}
.txt-cnt-prf{
	font-weight: bold;
}
.ui2-usr-hm-banner.btm-ld-bnr{
	margin-top: 12%
}

.match-clr{
	background-color: #aaff9d;
}

.mis-match-clr{
	background-color: #ffab9d;
}

.nsw-mtc{
	padding: .5% 2%;
	font-weight: bold;
}
.mtc-tags-cntr{
	margin-top: 3%;
}

.input-txt-area-mn{
	width: 50%;
	height: 100px;
	padding: 1% 1%;
	font-size: 1.25rem;
	font-family: "Handlee", cursive;
	font-weight: bold;
	letter-spacing: 1px;
}

/*Modal Loader*/
.modal-loader,
.modal-loader::before,
.modal-loader::after {
  border-radius: 50%;
  border: 3px solid transparent;
  /* you can select color */
  /* border: 3px solid #fff; */
}

.modal-loader {
  width: 3rem;
  height: 3rem;
  border-left-color: #F44336;
  position: relative;
  /* This controls the speed of the animation of all elements */
  animation: rotate .7s linear infinite;
}

.modal-loader::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 2rem;
  height: 2rem;
  border-left-color: #ff5722;
  animation: modal-rotating 1.3s linear infinite;
}

.modal-loader::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 1rem;
  height: 1rem;
  border-left-color: #ffc107;
  animation: modal-rotating 1s linear infinite;
}

@keyframes modal-rotating {
  from {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}

.mdl-loader-cntr{
	display: flex;
	justify-content: center;
	margin-top: 5%;
}

/*Some basic override for score screen*/

.score-counter-cntr {
    width: 100%;
    height: 100%;
}
.report-ttl-cntr {
    text-align: center;
}
.dtc-rpt-mn-cntr {
    display: flex;
    font-family: "Cherry Bomb One", system-ui;
    justify-content: center;
}
/*End overrides*/

.usr-ans-fdbck{
	padding: 1% 2%;
	
}
.mlp-img-hlr>img{
	margin-right: 2%;
}
.grade-inp-cntr.no-edit-not{
	width: 72%;
}


/*PAGINATION STYLING*/
:root {
	--primary: #3b82f6;
	--primary-hover: #2563eb;
	--primary-light: #dbeafe;
	--border: #e5e7eb;
	--text-primary: #111827;
	--text-secondary: #6b7280;
	--radius: 10px;
	--shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
	--shadow-md: 0 4px 12px rgba(0,0,0,0.1);
	--shadow-lg: 0 8px 24px rgba(0,0,0,0.12);
}

.pagination-wrapper {
	display: flex;
	justify-content: center;
	margin-bottom: 2rem;
}

.pagination {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem;
	border-radius: 16px;
	background: rgba(255, 255, 255, 0.95);
	backdrop-filter: blur(10px);
	box-shadow: var(--shadow-lg);
	flex-wrap: wrap;
	border: 1px solid rgba(255, 255, 255, 0.5);
}

.page-arrow,
.page-btn {
	border: none;
	background: #fff;
	padding: 0.5rem 0.85rem;
	min-width: 2.5rem;
	height: 2.5rem;
	text-align: center;
	cursor: pointer;
	border-radius: var(--radius);
	font-size: 0.95rem;
	font-weight: 500;
	line-height: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--text-primary);
	position: relative;
	overflow: hidden;
	transition:
		background 0.3s cubic-bezier(0.4, 0, 0.2, 1),
		color 0.3s cubic-bezier(0.4, 0, 0.2, 1),
		transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
		box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.page-btn::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 0;
	height: 0;
	border-radius: 50%;
	background: var(--primary-light);
	color:#000;
	transform: translate(-50%, -50%);
	transition: width 0.6s cubic-bezier(0.4, 0, 0.2, 1), 
				height 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.page-btn:hover::before {
	width: 120%;
	height: 120%;
}

.page-btn > span {
	position: relative;
	z-index: 1;
}

.page-btn.active {
	background: linear-gradient(135deg, var(--primary) 0%, var(--primary-hover) 100%);
	color: #fff;
	box-shadow: 0 4px 12px rgba(59, 130, 246, 0.4);
	transform: scale(1.05);
}

.page-btn.active::before {
	display: none;
}

.page-arrow {
	background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%);
}

.page-arrow svg {
	width: 16px;
	height: 16px;
	transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.page-arrow:disabled {
	opacity: 0.3;
	cursor: not-allowed;
	transform: none !important;
}

.page-arrow:not(:disabled):hover {
	background: linear-gradient(135deg, #e5e7eb 0%, #d1d5db 100%);
	transform: translateY(-2px) scale(1.05);
	box-shadow: 0 6px 16px rgba(0,0,0,0.12);
}

.page-arrow:not(:disabled):hover svg {
	transform: scale(1.1);
}

.page-arrow:not(:disabled):active {
	transform: translateY(0) scale(0.98);
}

.page-btn:not(.active):hover {
	/*transform: translateY(-2px);
	/*box-shadow: 0 6px 16px rgba(0,0,0,0.1);*/
	/*color: #000;*/
}

.page-btn:not(.active):active {
	transform: translateY(0) scale(0.98);
}

/* Enhanced animations */
@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(8px) scale(0.95);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes pulse {
	0%, 100% {
		transform: scale(1);
	}
	50% {
		transform: scale(1.05);
	}
}

.page-btn {
	animation: fadeInUp 0.4s cubic-bezier(0.4, 0, 0.2, 1) backwards;
}

.page-btn:nth-child(1) { animation-delay: 0.05s; }
.page-btn:nth-child(2) { animation-delay: 0.1s; }
.page-btn:nth-child(3) { animation-delay: 0.15s; }
.page-btn:nth-child(4) { animation-delay: 0.2s; }
.page-btn:nth-child(5) { animation-delay: 0.25s; }

.page-btn.active {
	animation: fadeInUp 0.4s cubic-bezier(0.4, 0, 0.2, 1) backwards,
				pulse 0.6s cubic-bezier(0.4, 0, 0.2, 1) 0.4s;
}


/*Year selection tabs*/
.sel-tabs {
	background: white;
	border-radius: 8px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.1);
	margin-bottom: 24px;
	display: flex;
	border-bottom: 2px solid #e5e7eb;
	margin: 2% 0%;
}

.sel-tab {
	flex: 1;
	padding: 16px 24px;
	text-align: center;
	cursor: pointer;
	font-size: 1.1rem;
	font-weight: bold;
	color: #6b7280;
	background: white;
	border: none;
	transition: all 0.3s;
	position: relative;
}

.sel-tab:first-child {
	border-radius: 8px 0 0 0;
}

.sel-tab:last-child {
	border-radius: 0 8px 0 0;
}

.sel-tab:hover {
	background-color: #f9fafb;
	color: #1f2937;
}

.sel-tab.active {
	color: #2563eb;
	background-color: #eff6ff;
}

.sel-tab.active::after {
	content: '';
	position: absolute;
	bottom: -2px;
	left: 0;
	right: 0;
	height: 5px;
	background-color: #2563eb;
}
.btn-ai-report{
	width: fit-content;
	margin-top: .5%;
}
.btn-ai-report a{
	background-color: #ff8894;
	color: #000000;
	border: none; 
	padding: 8px 16px; 
	border-radius: 4px; 
	cursor: pointer; 
	font-weight: bold;
	font-size: 0.9rem;
	user-select: none;
	-webkit-user-select: none;
}
.ui2-add-width-max-760 .esmk-content .mdl-not-cntr.dft-fnt-fam{
	font-family: 'Work Sans', sans-serif; /*This is a font override for users*/
	font-size: 1rem;
}
.dft-fnt-fam-btn{
	font-family: 'Work Sans', sans-serif; /*This is a font override for users*/
	font-size: 1.2rem;
}

.ai-report-reason textarea {
  width: 100%;           /* fills the container */
  box-sizing: border-box;/* prevents overflow */
  resize: vertical;      /* optional: only allow up/down resize */
  min-height: 100px;     /* optional: better UX */
  padding: 10px;
  font-size: 14px;
  border-radius: 6px;
  border: 1px solid #ccc;
}
.ai-report-hint{
	font-size: 0.9rem;
	margin-top: 6%;
}
.ai-qstn-cntr-mn{
	background-color: #ffffff;
	padding: 1% 2%;
	margin-bottom: 2%;
}


/*This section is used by the subject selection box*/
.onbrd-fl-dsp-nw{
	flex-direction: column;
}
.onbrd-fl-dsp-nw img{
	width: 40%;
}
.onboarding-mng-btn-cntr{
  display: flex;
  justify-content: center;
  margin: 2% 0%;
}
.onboarding-mng-btn-cntr a{
  display: inline-flex;
  padding: 3% 0%;
  width: 50%;
  background-color: #da5d09;
  justify-content: center;
  border-radius: 15px;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  font-size: 1rem;
  color: #FFFFFF;
}
.onboarding-mng-btn-cntr a:hover, .onboarding-mng-btn-cntr a:visited{
	color: #FFFFFF;
}
.ndr-ntf-err .container{
	font-size: 0.95rem;
}

.sub-cls-sel-mn-cntr{
	display: flex;
	justify-content: center;
	margin-top: 2%;
}
.sub-cls-sel-mn-cntr .sub-cls-sel-container{
	width: 50%;
}
.hdr-cntr-sel-sub-cls{
	font-size: 1.2rem;
}
.hdr-cntr-sel-sub-cls-qst{
	font-size: 1.2rem;
	background-color: #106ba0;
	padding: 1% 2%;
	border-radius: 10px;
	margin: 10% 0% 2% 0%;
	font-weight: bold;
	color: #FFFFFF;
}


.sub-cls-sel-container {
	background: white;
	border-radius: 16px;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
	max-width: 600px;
	width: 100%;
	padding: 40px;
}

.sub-cls-sel-subtitle {
	color: #718096;
	text-align: center;
	font-size: 1rem;
	margin: 2% 0%;
}

.sub-cls-sel-subject-selection {
	display: grid;
	gap: 20px;
	margin-bottom: 30px;
}

.sub-cls-sel-subject-option {
	border: 2px solid #e2e8f0;
	border-radius: 12px;
	padding: 24px;
	cursor: pointer;
	transition: all 0.3s ease;
	position: relative;
	background: white;
}

.sub-cls-sel-subject-option:hover {
	border-color: #667eea;
	box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
	transform: translateY(-2px);
}

.sub-cls-sel-subject-option input[type="radio"] {
	position: absolute;
	opacity: 0;
	cursor: pointer;
}

.sub-cls-sel-subject-option.selected {
	border-color: #667eea;
	background: #f7fafc;
	box-shadow: 0 4px 16px rgba(102, 126, 234, 0.2);
}

.sub-cls-sel-radio-custom {
	width: 24px;
	height: 24px;
	border: 2px solid #cbd5e0;
	border-radius: 50%;
	position: absolute;
	right: 24px;
	top: 24px;
	transition: all 0.3s ease;
}

.sub-cls-sel-radio-custom::after {
	content: '';
	width: 12px;
	height: 12px;
	background: #667eea;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) scale(0);
	transition: transform 0.2s ease;
}

.sub-cls-sel-subject-option.selected .sub-cls-sel-radio-custom {
	border-color: #667eea;
}

.sub-cls-sel-subject-option.selected .sub-cls-sel-radio-custom::after {
	transform: translate(-50%, -50%) scale(1);
}

.sub-cls-sel-subject-title {
	font-size: 20px;
	font-weight: 600;
	color: #2d3748;
	margin-bottom: 8px;
	padding-right: 40px;
}

.sub-cls-sel-subject-description {
	color: #718096;
	font-size: 14px;
	line-height: 1.6;
	padding-right: 40px;
}

.sub-cls-sel-button-group {
	display: flex;
	gap: 12px;
	justify-content: space-between;
	margin-top: 15%;
}

.sub-cls-sel-button-group button {
	padding: 14px 32px;
	border-radius: 8px;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.3s ease;
	border: none;
}

.sub-cls-sel-btn-back {
	background: white;
	color: #667eea;
	border: 2px solid #667eea;
	flex: 1;
}

.sub-cls-sel-btn-back:hover {
	background: #f7fafc;
}

.sub-cls-sel-btn-continue {
	background: #667eea;
	color: white;
	flex: 2;
}

.sub-cls-sel-btn-continue:hover {
	background: #5568d3;
	box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
}

.sub-cls-sel-btn-continue:disabled {
	background: #cbd5e0;
	cursor: not-allowed;
	box-shadow: none;
}

@media (max-width: 768px) {
	.sub-cls-sel-container {
		padding: 24px;
	}

	.sub-cls-sel-subject-option {
		padding: 20px;
	}

	.sub-cls-sel-subject-title {
		font-size: 18px;
	}

	.sub-cls-sel-button-group {
		flex-direction: column;
	}
	.sub-cls-sel-mn-cntr .sub-cls-sel-container {
        width: 96%;
    }
}
.cca-log-inst-cntr .rec-pss-cntr-notif-v2{
	width: 40%;
}
.fill-details .rec-pss-cntr-notif-phn-v2,
.esm-signup-tag .tag-v2-cntr{
	width: 40%;
}
.cca-log-inst-cntr .btn-200{
	text-align: center;
}
.cca-log-inst-cntr .btn-200 a{
	font-size: 1rem !important;
}
.sign-in-frm-rec{
	display: flex;
	justify-content: space-between;
	margin-top: 5%;
}
.sign-in-frm-rec a{
	font-size: 1rem;
	color: #21304D;
}
.sign-in-frm-rec a:hover,
.sign-in-frm-rec a:visited
{
	color: #21304D;
}


.err-bk-to-db-btn-cntr{
	text-align: center;
}
.err-bk-to-db-btn-cntr a{
  display: inline-flex;
  padding: 3% 0%;
  width: 50%;
  background-color: #da5d09;
  justify-content: center;
  border-radius: 15px;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  font-size: 1rem;
  color: #FFFFFF;
  margin-top: 5%;
}
.err-bk-to-db-btn-cntr a:hover,
.err-bk-to-db-btn-cntr a:visited{
	color: #FFFFFF;
}
.sbt-ht-cntr{
	text-align: center;
    margin-top: 4%;
}
.submit-hint {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 1.2rem;
  color: #21304D;
  font-family: Quicksand, sans-serif;
}

.kbd {
  background: #f4f4f4;
  border: 1px solid #ddd;
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 1.1rem;
  font-family: monospace;
}

.q-bdy-italics{
	font-style: italic;
	font-size: 1rem;
	color: #505050;
}


.sch-ovr-cls-mrg .sch-dsb-mn-cntr.ovd-vw-ext-sgn{
	display: flex;
    justify-content: center;
}
.ovd-sn-elm-cnr-ext{
	display: flex;
    justify-content: center;
}
.ui2-lnr-qstn-cntr.ovd-sgn-ext .worded-problem-cntr{
	font-family: "Source Sans 3", sans-serif;
	font-size: 1.3rem;
}
.phr-qst-cntr{
	font-weight: bold;
}
.ovd-sgn-ext .stck-answer-cntr .lnr-ans-bx-sel a{
	font-family: "Source Sans 3", sans-serif !important;
	font-size: 1.3rem;
}
.ovd-sgn-ext .crt-ans-cntr{
	font-family: "Source Sans 3", sans-serif !important;
	font-size: 1.3rem;
}

.ovd-sgn-ext .ovd-stck-xtn .lnr-ans-bx-sel a {
    display: block;
    padding: 12px 18px;
    text-decoration: none;
    color: #2c2c2c;
    font-family: Georgia, serif;
    font-size: 1.2rem;
    border-radius: 6px;
    margin-bottom: 6px;
    transition: background 0.2s ease, transform 0.1s ease;
}

/* Alternating backgrounds */
.ovd-sgn-ext .ovd-stck-xtn .lnr-ans-bx-sel a:nth-child(odd) {
    background-color: #f8f9fa;
}

.ovd-sgn-ext .ovd-stck-xtn .lnr-ans-bx-sel a:nth-child(even) {
    background-color: #ffffff;
}

/* Hover state */
.ovd-sgn-ext .ovd-stck-xtn .lnr-ans-bx-sel a:hover {
    background-color: #d6e8ff;
    transform: translateX(4px);
    cursor: pointer;
}

/* Selected state */
.ovd-sgn-ext .ovd-stck-xtn .lnr-ans-bx-sel a.selected,
.ovd-sgn-ext .ovd-stck-xtn .lnr-ans-bx-sel a:focus {
    background-color: #cde8ff;
    border-left: 4px solid #3a7bd5;
    font-weight: 600;
    outline: none;
}

/*Inline answers*/
.sgn-vw-mn-cntr-html .inline-ovd-xtn .lnr-ans-bx-sel a {
    padding: 1% 1%;
    font-size: 1.5rem;
}
.inline-ovd-xtn  .itm-cntr-2-large.lnr-ans-bx-sel a {
    width: 40%;
}
.inline-ovd-xtn  .itm-cntr-2-large.lnr-ans-bx-sel {
    display: flex;
	justify-content: space-evenly;
	margin-bottom: 2%;
}
.inline-ovd-xtn  .itm-cntr-3-large.lnr-ans-bx-sel {
    display: flex;
	justify-content: space-evenly;
	margin-bottom: 2%;
}
.inline-ovd-xtn  .lnr-ans-bx-sel a {
    text-align: center;
    padding: 1.5% 1%;
    display: inline-block;
    font-size: 1.2rem;
    font-weight: bold;
    background-color: #8990a0;
    border-radius: 15px;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    color: #000 !important;
	font-family: Georgia, serif;
}

.ui2-lnr-qstn-cntr.ovd-sgn-ext {
    border-radius: 50px;
    padding: 2% 3%;
}
.qstn-tag-lbl{
	font-family: Georgia, serif;
}
.lrn-usr-input-box {
    text-align: center;
}
.ovd-sgn-ext .text-input-bx .lrn-usr-input-box input[type=text] {
    width: 50%;
    font-size: 1rem;
    height: 50px;
    border: 5px solid #21304d;
}
.ovd-sgn-ext .lnr-sub-ans-btn-cntr{
    text-align: center;
}
.ovd-sgn-ext .lnr-sub-ans-btn {
    display: inline-block;
    width: 30%;
    background-color: #c4c4c4;
    color: #FFF !important;
    font-weight: bold;
    font-size: 1.2rem;
    padding: 2%;
    border-radius: 60px;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    margin-top: 2%;
    margin-bottom: 1%;
}
.ovd-ifm-ctnr.body-container-ui2{
	justify-content: center;
}
.ovd-ifm-ctnr .lrn-main-container-ui2{
	width: 100vw;
}


.elem-tag-std-nm{
	font-size: 0.8rem;
	display: inline-block;
	margin-left: 2%;
}

.modal-actions {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 20px;
}

.modal-actions .btn-secondary {
    padding: 12px 30px;
    border: 1px solid #ccc;
    background: #fff;
    color: #555;
    border-radius: 5px;
    cursor: pointer;
    font-size: 14px;
}

.modal-actions .btn-secondary:hover {
    background: #f5f5f5;
}

.modal-actions .btn-primary {
    padding: 12px 60px;
    border: none;
    background: #21304D;
    color: #fff;
    border-radius: 5px;
    cursor: pointer;
    font-size: 14px;
}

.modal-actions .btn-primary:hover {
    background: #2e4370;
}

.modal-actions .btn-primary:disabled {
    background: #7a8ea8;
    cursor: not-allowed;
}

#default-deadline-001{
	display: contents;
}
.flatpickr-calendar {
    font-family: 'Andika', sans-serif;
}


/*QUESTION INPUT STACKED*/
.cntr-aln-sbl{
	display: flex;
	justify-content: center;
}
.question-q-stack {
	background: #ffffff;
	border-radius: 14px;
	border: 1px solid #e2e4ea;
	padding: 2rem 2.5rem 2.5rem;
	/*max-width: 420px;*/
	width: 60%;
	margin-bottom: 2%;
}

/* Column headers */
.question-q-stack .col-header-row {
	display: flex;
	/*justify-content: flex-end;*/
	margin-bottom: 4px;
}

.question-q-stack .ch {
	width: 40%;
	text-align: center;
	font-size: 1.3rem;
	color: #6b7080;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.question-q-stack .ch.op {
	width: 40px;
}

/* Rows */
.question-q-stack .digit-row {
	display: flex;
	align-items: center;
	margin-bottom: 2px;
}

.question-q-stack .cell {
	width: 40%;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.8rem;
	font-weight: 600;
	font-family: 'Courier New', monospace;
	color: #1e2130;
}

.question-q-stack .cell.op {
	width: 40px;
	color: #6b7080;
	font-size: 24px;
	font-family: 'Segoe UI', Arial, sans-serif;
}

/* Divider */
.question-q-stack .divider {
	border: none;
	border-top: 2px solid #c8ccd8;
	margin: 8px 0;
}

/* Answer inputs */
.question-q-stack .answer-cell {
	width: 40%;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.question-q-stack .answer-input {
	width: 70%;
	height: 44px;
	border: 4px solid #4cc9c2;
	border-radius: 8px;
	background: #ffffff;
	font-size: 22px;
	font-weight: 600;
	font-family: 'Courier New', monospace;
	color: #1e2130;
	text-align: center;
	outline: none;
	transition: border-color 0.15s, background 0.15s;
	-moz-appearance: textfield;
}

.question-q-stack .answer-input::-webkit-outer-spin-button,
.question-q-stack .answer-input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.question-q-stack .answer-input:focus {
	border-color: #185FA5;
	background: #ffffff;
}

.report-block{
	background-color: #ffff0040 !important;
	padding: 1% 2% !important;
	border-radius: 10px !important;
}

.ui2-add-width-max-760 .esmk-content .mdl-not-cntr .rvw-ctr-mdl{
	font-family: "Source Sans 3", sans-serif;
    font-size: 1.2rem;
	padding: 5% .2%;
}
.mdl-notification-cntr{
	display: none;
	font-family: "Source Sans 3", sans-serif !important;
    font-size: 1.2rem !important;
}

.pre-submit .esmk-nxt-dyk-btn{
	font-family: "Source Sans 3", sans-serif !important;
    font-size: 1.6rem !important;
	padding: 3% 1%;
	user-select: none;
	-webkit-user-select: none;
}
.pre-submit .esmk-cncl-btn{
	font-family: "Source Sans 3", sans-serif !important;
    font-size: 1.6rem !important;
	color: #2b2b2b;
	user-select: none;
	-webkit-user-select: none;
}
.pre-submit h3{
	font-family: "Source Sans 3", sans-serif !important;
    font-size: 1.6rem !important;
	font-weight: bold;
}

.prog-loader-q-counter{
	display:flex; 
	justify-content:space-between; 
	margin-bottom:8px;
	font-family: "Source Sans 3", sans-serif !important;
}
.prog-loader-q-counter .spn-itm-ctr{
	font-size:16px; 
	color:#666;
}

.prog-loader-q-counter .spn-cntr-lbl{
	font-size:16px; 
	font-weight: 500;
}

.prog-loader-q-bar{
	width:100%; 
	height:8px; 
	background:#eee; 
	border-radius:999px; 
	overflow:hidden;
}

.br-itm{
	height:100%; 
	width:0%; 
	background:#2563eb; 
	border-radius:999px; 
	transition:width 0.4s ease;
}
.tip-box{
	font-family: "Source Sans 3", sans-serif !important;
	margin-top: 15%;
	padding: 12px 14px;
	background: #f9f9f9;
	border-radius: 8px;
	border: 1px solid #eee;
	font-size: 17px;
	color: #666;
	min-height: 40px;
}

.tip-label {
	font-size: 13px;
	color: #aaa;
	margin-bottom: 4px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}
.mrk-lng-tim{
	font-family: "Source Sans 3", sans-serif;
    font-size: 1.0rem;
	margin-top: 1rem;
}

.fgt-btn-cntr{
    display: flex;
    justify-content: center;
}

a.fgt-lnk-btn{
    font-weight: bold;
    color: #f96806 !important;
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 1.05rem;
}

.on-guess h3{
	font-family: "Source Sans 3", sans-serif !important;
    font-size: 1.6rem !important;
	font-weight: bold;
}
.on-guess .esmk-cncl-btn{
	font-family: "Source Sans 3", sans-serif !important;
    font-size: 1.6rem !important;
	color: #2b2b2b;
	user-select: none;
	-webkit-user-select: none;
}

.mn-dsp-q-ctrl{
	display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    flex-direction: column;
	font-family: "Poppins", sans-serif;
}
.mdl-nln-ctr{
	background-color: #ffffff;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.15);
	width: 60%;
}

.mn-dsp-q-ctrl .esmk-content .mdl-not-cntr{
	font-family: "Poppins", sans-serif;
	font-size: 1.2rem;
}

.integrity-warning {
    background-color: #fff5f5;  /* light red tint */
    border-left: 4px solid #e53e3e;
    border-radius: 8px;
    padding: 12px;
}

.submission-success {
    background-color: #f0fff4;  /* light green tint */
    border-left: 4px solid #38a169;
    border-radius: 8px;
    padding: 12px;
}

.iml-btn-cntr{
	padding: 2% 0%;
	display: flex;
	justify-content: center;
}
.iml-btn-cntr .vw-rp-agn-btn{
	display: inline-block;
	align-items: center;
    position: relative;
    padding: 2% 8%;
	font-weight: bold;
    cursor: pointer;
    border-radius: 5px;
    -webkit-user-select: none;
    user-select: none;
	background-color: #da5d09;
	color: #ffffff !important;
}




.tmn-matching-arena {
	display: flex;
	align-items: flex-start;
	gap: 0;
	margin: 2% 0 5% 0;
	position: relative;
}
.tmn-col {
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex: 1;
}
.tmn-col-left {
    border-right: 2px dashed #e0e0e0;
    padding-right: 20px;
}

.tmn-col-right {
    padding-left: 20px;
}

.tmn-item {
	padding: 12px 16px;
	border: 3px solid #ccc;
    border-bottom: 6px solid #bbb;  /* lip */
	border-radius: 20px;
	text-align: center;
	font-size: 2em;
	font-weight: 600;
	cursor: pointer;
	background: #fff;
	transition: border-color 0.15s, background 0.15s, transform 0.1s;
	user-select: none;
	position: relative;
}
.tmn-item:hover:not(.tmn-used) {
	border-color: #888;
	background: #f5f5f5;
}
.tmn-item.tmn-selected {
	border-color: #1976D2;
	background: #E3F2FD;
	transform: scale(1.04);
}
.tmn-item.tmn-used {
	cursor: default;
	opacity: 0.88;
}
.tmn-actions {
	text-align: center;
	margin-top: 12px;
}
.tmn-reset-btn {
	padding: 8px 20px;
	border: 2px solid #ccc;
	border-radius: 20px;
	background: #fff;
	cursor: pointer;
	font-size: 0.9em;
	color: #555;
	transition: all 0.15s;
	font-weight: bold;
}
.tmn-reset-btn:hover {
	border-color: #F44336;
	color: #F44336;
}

.tmn-img-group {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: center;
    align-items: center;
}

.tmn-thumb {
    width: 32px;
    height: 32px;
    object-fit: contain;
	border-radius: 8px;
}

/*reset*/
table tr:nth-of-type(even) td {
    background-color: unset;
}
table tr.tmn-rpt-row-correct{
	background-color: #c4ffb1 !important;
}
table tr.tmn-rpt-row-wrong{
	background-color: #ffceb1 !important;
}



div.awtgn-lcns{
	background-color: unset;
}
.btn-pay {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 28px;
    border-radius: 12px;
    border: none;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    transition: transform 0.1s, box-shadow 0.1s;
	width: -webkit-fill-available;
	width: -moz-available;
}
.btn-pay:active { transform: scale(0.97); }
.btn-pay i { font-size: 18px; }

.btn-solid {
    background: #1a9e6e;
    color: #fff;
    border-bottom: 4px solid #127a52;
}
.btn-solid:hover { background: #178f62; }

.btn-learn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 28px;
    border-radius: 12px;
    border: none;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    transition: transform 0.1s, box-shadow 0.1s;
	width: -webkit-fill-available;
	width: -moz-available;
}
.btn-learn:active { transform: scale(0.97); }
.btn-learn i { font-size: 18px; }

.btn-learn-solid {
    background: #00ACC1;
    color: #fff;
    border-bottom: 4px solid #00897B;
}
.btn-learn-solid:hover { background: #0097A7; }

.esmk-acc-cntr-itm .card-name-itm {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
	line-clamp: 2; /* for non-webkit browsers */
    overflow: hidden;
    min-height: 2.6em;   /* reserves space even for single-line names */
	padding:1.5em 0;
}

.ui2-db-usr-crd div.gt-lrng-btn-db{
	background-color: unset;
}

.lcs-btn-lbl-tag{
	font-size: 0.9rem;
	padding: 1.5% 0%;
	background: #FFEBEE;
	border-radius: 12px;
	border: 1px solid #EF9A9A;
}
.lbl-usr-sts.trl-act{
	font-size: 0.9rem !important;
	text-align: center;
	padding: 1.5% 0%;
	background-color: #00897B;
	color: #fff;
}
.esmk-chl-acc-sts-cntr a.inactive-status {
    color: #C62828;
    text-decoration: none;
}
.bba-opt-chg-mtd {
    text-align: left;
    width: 95%;
}
.lnr-qstn-box i{
    font-size: 1.2rem;
    color: #00aeef;
}

.logo-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
}

/* Fixed-size box — normalizes all logos */
.logo-box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 130px;       /* same height for every logo */
  padding: 12px;
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 12px;
  box-sizing: border-box;
}

/* The key property */
.logo-box img {
  width: 100%;
  height: 100%;
  object-fit: contain; /* scales to fit, keeps aspect ratio */
}




































/*Very important styles*/
.ui2-rmv-mrg-tp{
	margin-top: 0%;
}

@media screen and (min-width: 1900px) {
    .default_theme{
		background-image: url("../images/assets/themes/default/mn-bck-gnd.webp");
	}
}
@media only screen and (max-width: 1400px){
	.ui2-lnr-qstn-cntr .balanced-weights .left-pan, .ui2-lnr-qstn-cntr .balanced-weights .right-pan {
        width: 20%;
        height: 14%;
    }
    .ui2-lnr-qstn-cntr .balanced-weights .right-pan {
        right: 21%;
        top: 50%;
    }
    .ui2-lnr-qstn-cntr .balanced-weights .left-pan {
        left: 15%;
        top: 50%;
    }
}
@media screen and (min-width: 1024px){
	.default_theme{
		background-image: url("../images/assets/themes/default/mn-bck-gnd.webp");
	}
	/*.forest_theme{
		background-image: url("../images/assets/themes/forest/mn-bck-gnd.svg");
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
		background-attachment: fixed;
	}*/
	/*THEMES*/
	.forest_theme.ui2-bdy-bg-theme,
	.desert_theme.ui2-bdy-bg-theme,
	.ocean_theme.ui2-bdy-bg-theme,
	.sky_theme.ui2-bdy-bg-theme,
	.default_theme.ui2-bdy-bg-theme
	{
		position: relative;
		min-height: 100vh; /* Ensure minimum height is full viewport */
	}
	.forest_theme.ui2-bdy-bg-theme::before,
	.desert_theme.ui2-bdy-bg-theme::before,
	.ocean_theme.ui2-bdy-bg-theme::before,
	.sky_theme.ui2-bdy-bg-theme::before,
	.default_theme.ui2-bdy-bg-theme::before{
		content: "";
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
		background-attachment: fixed;
		z-index: -2;
	}
	.forest_theme.ui2-bdy-bg-theme::after,
	.desert_theme.ui2-bdy-bg-theme::after,
	.ocean_theme.ui2-bdy-bg-theme::after,
	.sky_theme.ui2-bdy-bg-theme::after,
	.default_theme.ui2-bdy-bg-theme::after{
		content: "";
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		background-color: rgba(0, 0, 0, 0.4); /* Black overlay with 50% opacity */
		z-index: -1;
	}
	.forest_theme.ui2-bdy-bg-theme > *,
	.desert_theme.ui2-bdy-bg-theme > *,
	.ocean_theme.ui2-bdy-bg-theme > *,
	.sky_theme.ui2-bdy-bg-theme > *,
	.default_theme.ui2-bdy-bg-theme > * {
		position: relative;
		z-index: 1;
	}
	.forest_theme::before {
		background-image: url("../images/assets/themes/forest/mn-bck-gnd.svg");
	}
	.desert_theme::before {
		background-image: url("../images/assets/themes/desert/mn-bck-gnd.svg");
	}
	.ocean_theme::before {
		background-image: url("../images/assets/themes/ocean/mn-bck-gnd.svg");
	}
	.sky_theme::before {
		background-image: url("../images/assets/themes/sky/mn-bck-gnd.svg");
	}
	
	.ui2-cls-cntr .usr-prl-pic-cntr img {
        width: 100%;
        margin: 3% 0%;
    }
	.logo-grid {
		grid-template-columns: repeat(5, 1fr);
		gap: 20px;
	}
}

@media screen and (min-width: 768px){
	.ui2-cls-cntr .esmk-acc-cntr-itm {
        width: 28%;
    }
    .hdn-bdy-cntr {
        width: 97%;
    }
}


@media screen and (max-width: 768px){
	.forest_theme,
	.desert_theme,
	.ocean_theme,
	.sky_theme,
	.default_theme{
		position: relative;
		min-height: 100vh; /* Ensure minimum height is full viewport */
	}
	.forest_theme::before,
	.desert_theme::before,
	.ocean_theme::before,
	.sky_theme::before,
	.default_theme::before {
		content: "";
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh; /* Use viewport height instead of 100% */
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
		background-attachment: fixed;
		z-index: -2;
	}
	.default_theme{
		background-image: url("../images/assets/themes/default/mn-bck-gnd.webp");
	}
	.forest_theme::before {
		background-image: url("../images/assets/themes/forest/mn-bck-gnd.svg");
	}
	.desert_theme::before {
		background-image: url("../images/assets/themes/desert/mn-bck-gnd.svg");
	}
	.ocean_theme::before {
		background-image: url("../images/assets/themes/ocean/mn-bck-gnd.svg");
	}
	.sky_theme::before {
		background-image: url("../images/assets/themes/sky/mn-bck-gnd.svg");
	}
	.forest_theme::after,
	.desert_theme::after,
	.ocean_theme::after,
	.sky_theme::after,
	.default_theme::after {
		content: "";
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh; /* Use viewport height instead of 100% */
		background-color: rgba(0, 0, 0, 0.4); /* Black overlay with 50% opacity */
		z-index: -1;
	}
	.forest_theme > *,
	.desert_theme > *,
	.ocean_theme > *,
	.sky_theme > *,
	.default_theme > * {
		position: relative;
		z-index: 1;
	}
	.body-container-ui2 {
		width: 100vw;
	}
    .ui2-lnr-qstn-cntr .balance-scale {
        width: 100%;
		height: auto;
		padding: 7px;
    }
    .ui2-lnr-qstn-cntr .balance-scale>div img{
        max-width:100%;
    }
    .ui2-lnr-qstn-cntr .images_pool{
        position: relative;
    }
    .ui2-lnr-qstn-cntr .left-object-name.right-object-name{
        position: relative;
    }
    .ui2-lnr-qstn-cntr .balanced-weights .left-pan, .ui2-lnr-qstn-cntr .balanced-weights .right-pan {
        width: 26%;
        height: auto;
    }
    .ui2-lnr-qstn-cntr .left-object-name, .ui2-lnr-qstn-cntr .right-object-name {
        font-size: 1.2rem;
        padding: 2px 4px;
    }
    .ui2-lnr-qstn-cntr .balanced-weights .left-pan {
        left: 8%;
        top: 52%;
    }
    .ui2-lnr-qstn-cntr .balanced-weights .right-pan {
        right: 8%;
        top: 52%;
    }
	.ui2-nav-cntr .usr-pfl-cntr-itm a {
		font-size: 0.6em;
	}
	.zoo-default{
		width: 100%;
		box-shadow: 0 10px 7px 0px rgba(45, 71, 26, 0.902), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
		border-radius: 20px;		
        background-color: #60752f;
	}
	.under-lay-prl-cntr {
		width: 59%;
	}
	.usr-profile-avatar-cntr {
		justify-content: flex-end;
		width: 48%;
	}
	.usr-lrn-pnt-cntr {
		width: 47%;
	}
	.usr-pfl-cntr-itm {
		width: 100%;
		justify-content: flex-end;
		height: 85%;
	}
	.under-lay-prl-cntr {
		width: 100%;
		height: 69%;
	}
	.usr-pfl-itm-avatar {
		width: 50%;
	}
	.chv-down-fnt-aws {
		width: 40%;
	}
	.chv-down-fnt-aws a{
		display: block;
	}
	.usr-lnr-nav-pfl-cntr {
		justify-content: space-between;
	}
	.zoo-ttl-cntr {
		box-shadow: none;
	}
	.lp-txt-cntr {
		font-size: 1.5rem;
	}
	.lp-ttl-cntr {
		width: 86%;
		height: 52%;
	}
	.under-lay-cntr {
		width: 76%;
		height: 46%;
	}
	.zoo-nav-cntr {
		justify-content: flex-end;
	}
	.arr-bkc-cntr img {
		width: 100%;
	}
	.usr-dbd-identify {
		width: 100%;
	}
	.usr-db-pfl-nm-cntr {
		justify-content: flex-end;
	}
	.usr-db-pfl-nm-itm {
		font-size: 2.5rem;
		height: 84%;
    	width: 89%;
	}
	.under-lay-prl-nm-cntr {
		background-color: rgb(81, 91, 108);
		height: 78%;
		width: 93%;
	}
	.sub-subjects-cntr {
		width: 100%;
	}
	.sub-itm-ttl-cntr span {
		font-size: 1.6rem;
	}
	.sub-subjects-heading {
		font-size: 1.5rem;
	}
	/* below code is also copied for all displays */
	.sub-itm-ttl-cntr a{
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		height: 100%;
	}
	.sub-subjects-item-cntr {
		flex-direction: column;
		align-items: center;
	}
	.sub-subjects-item {
		width: 91%;
		margin-bottom: 5%;
	}
	.ui2-subjects-cntr {
		height: auto;
	}
	.ui2-nav-cntr {
		height: auto;
		
	}
	.ui2-usr-cntr {
		height: auto;
		margin-top: 10%;
	}
	.arr-bkc-cntr a{
		display: flex;
	}
	.usr-pg-canvas-elem {
		box-shadow: rgba(81, 91, 108, 1) 0px 7px 0px, rgba(81, 91, 108, 0.22) 0px 15px 12px;
	}
	.mn-class-topics-cntr {
		border: solid 4px #FFF;
		margin: 13% 1% 0% 1%;
		border-radius: 44px;
		padding: 2%;
		width: 90%;
	}
	.hd-tp-cntr {
		margin-bottom: 2%;
		align-items: center;
		flex-direction: column;
	}
	.hdn-bdy-cntr {
		width: 100%;
		text-align: center;
		font-size: 1.8rem;
		margin-bottom: 5%;
	}
	.tpc-mn-cntr-bdy {
		flex-direction: column;
	}
	.tpc-itm-cntr {
		width: 98%;
		margin-bottom: 6%;
	}
	.sub-strand-mn-cntr {
		display: flex;
		border: solid 10px #FFF;
		padding: 2% 3%;
		border-radius: 25px;
		flex-direction: column;
	}
	.lft-img-cntr {
		width: 46%;
		margin-bottom: 11%;
	}
	.itm-cntr-prg-cntr {
		flex-direction: column;
	}
	.itm-cntr-prg-cntr {
		width: 96%;
	}
	.itm-cntr-prg-cntr .clf-itm-cntr {
        width: 100%;
        text-align: center;
        transition: transform 0.3s ease;
        padding: 1% 0%;
        border-radius: 25px;
        margin-bottom: 17%;
        box-shadow: rgb(255 255 255) 1px -1px 6px 7px;
    }
	.counter-number-cntr img {
		width: 84%;
		height: auto;
		border-radius: 30px;
	}
	.outlined-text {
		font-size: 3rem;
		text-align: center;
	}
	.lft-img-cntr div img {
		display: none;
	}
	.ui2-lnr-qstn-cntr {
		width: 89%;
		background-color: #ebffe6;
		border: solid 13px #FFF;
		border-radius: 39px;
		margin-top: 9%;
	}
	.ui2-lnr-qstn-cntr .lnr-qstn-box {
		padding: 3%;
	}
	.lnr-sub-ans-btn {
        display: block;
        width: inherit;
    }
	.ui2-lnr-qstn-cntr .lnr-img-cntr img {
		width: 21%;
	}
	.ui2-lnr-qstn-cntr .grp-shp>div, .ui2-lnr-qstn-cntr .jqry_grp-shp>div {
		width: 42%;
		height: 103px;
		padding: 1% 1%;
		border-radius: 7px;
	}
	.lrn-map-bdy {
		width: 90%;
	}
	.ui2-usr-hm-banner {
		flex-direction: column;
	}
	.lc-banner-text {
		width: 90%;
		color: #FFF;
	}
	.ui2-drd-header-cntr {
		flex-direction: column-reverse;
	}
	.ui2-par-bdy-elem-cntr .bba-usr-itm.bba-usr-mcrs h3 {
		text-transform: none;
		margin-top: 17%;
	}
	.ui2-db-usr-crd .ui2-dbr-img-cntr {
		width: 48%;
		margin-top: 9%;
	}
	.esmk-acc-cntr-itm img {
        width: 87%;
    }
	.edt-prl-icon-cntr {
		position: absolute;
		right: 45%;
		top: 41%;
		z-index: 110;
		width: 18%;
	}
	.ui2-cls-cntr .esmk-acc-cntr-itm .itm-lbl-nm-cntr {
		text-transform: none;
		display: inline-block;
		width: 50%;
	}
	.esmk-chl-nm-lbl {
        position: absolute;
        top: 31%;
        right: 0%;
    }
	.esmk-acc-cntr-itm .add-chd-img {
        max-width: 44%;
    }
	.ui2-add-width-max-760 .esmk-modal {
		width: 358px;
		height: 597px;
		left: 83%;
		border-radius: 25px;
		top: 49%;
	}
	.inp-names, .inp-gender, .inp-grade {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	.inp-names label, .inp-gender label, .inp-grade label {
		width: 100%;
		font-size: 1.1rem;
		display: block;
		margin-top: 0%;
	}
	.inp-names .name-inp-cntr {
		display: block;
		width: 100%;
	}
	.fnt-size-135 {
		font-size: 1.2rem;
	}
	.gender-inp-cntr, .grade-inp-cntr, .esk-cnty-slt {
		display: block;
		width: 100%;
	}
	.ui2-nxt-btn-onboard, .ui2-prv-btn-onboard {
		width: 47%;
	}
	.mdl-js-fl-width{
		width: 100%;
	}
	.mdl-js-fl-width-blc{
		width: 47%;
		display: block;
	}
	.esmk-modal-wrapper.open .esmk-modal {
		overflow-y: auto;
	}
	.drn-tag-bdy .prc-tag {
		padding: 0% 0%;
	}
	.prc-btn-cntr {
		display: block;
		margin: 4% 7% 0%;
	}
	.ui2-mdl-licenses-mn .usr-prc-pckg-card .drn-tag-bdy {
		padding: 1% 2% 4%;
	}
	.lbl-pay-info-cntr{
		display: flex;
		align-items: center;
	}
	.ui-pck-mn-info-cntr>div {
		width: 100%;
	}
	.ui-pck-gt-lrn-btn {
		width: 91%;
	}
	.diag-tst-mdl-hdr {
		font-size: 1.7rem;
	}
	.ui2-diag-test-cntr {
		display: flex;
		align-items: center;
		justify-content: space-around;
		text-align: center;
		margin-top: 13%;
		flex-direction: column;
		font-size: 1.8rem;
	}
	.ui2-diag-test-cntr a{
		font-size: 1.8rem;
	}
	.mt-dgt-test-btn-cntr, .lt-dgt-test-btn-cntr {
		background-color: #ffaa40;
		width: 100%;
		border-radius: 25px;
		box-shadow: rgb(99 99 99) 0px 8px 15px 7px;
		margin-bottom: 9%;
	}
	.mdl-diag-tst-grp {
		padding: 3% 0%;
		font-size: 1rem;
		margin-top: 7%;
		width: 80%;
		font-family: 'Andika', sans-serif;
		text-align: center;
	}
	.avt-itm-bdy {
		width: 29%;
	}
	.acv-avt-itm {
		border: double 5px transparent;
	}
	.ui-pck-set-avt-cntr {
		margin-top: 13%;
		flex-direction: column-reverse;
	}
	.bck-sel-avt-btn {
		margin-top: 8%;
	}
	.acv-thm-itm {
		border: double 6px transparent;
	}
	.qst-btn-gt-nxt-qstn a {
        width: inherit;
    }
	.ui2-lnr-qstn-cntr .lnr-qstn-box.lit-scorecard {
        padding: 1%;
    }
	.dtc-rpt-mn-cntr {
		flex-direction: column;
	}
	.brk-dwm-cntr {
		width: 100%;
		font-size: 1.4rem;
		margin-top: 5%;
	}
	.dl-cntr-scr {
		width: 100%;
	}
	.score-counter-cntr {
		font-size: 5rem;
	}
	.lit-scorecard .lnr-sub-ans-btn {
		font-family: "Cherry Bomb One", system-ui;
		font-weight: normal;
		font-size: 2rem;
		width: inherit;
		border-radius: 53px;
	}
	.cls-selector-item {
		width: 47%;
		margin-bottom: 12%;
	}
	.mn-str-sub-str-cntr {
		margin-left: 0%;
		padding: 3% 1%;
	}
	.itm-cntr-prg-cntr .clf-itm-cntr a {
		font-family: "Cherry Bomb One", system-ui;
		display: block;
		padding: 3% 3%;
	}
	.game-map-body-elem #game-container {
		width: 100vw;
	}
	.lc-banner-text{
		text-align: center;
	}
	.ui2-lnr-qstn-cntr.ui2-lng-cntr-ght .grp-shp>div, .ui2-lnr-qstn-cntr.ui2-lng-cntr-ght .jqry_grp-shp>div {
		height: 135px;
	}
	.ui2-lnr-qstn-cntr.adj-wd-img-cntr .grp-shp>div, .ui2-lnr-qstn-cntr.adj-wd-img-cntr .jqry_grp-shp>div {
		width: 45%;
	}
	.ui2-lnr-qstn-cntr .lnr-ans-bx-sel a {
		text-align: center;
		padding: 3% 2%;
		width: 30%;
		margin-bottom: 3%;
	}
	.ui2-lnr-qstn-cntr .lnr-ans-bx-sel.ui2-cng-itm-wdt a {
		text-align: center;
		padding: 5% 2%;
		width: 18%;
		margin-bottom: 4%;
	}
	.ui2-lnr-qstn-cntr .pt-tg-qstn-cntr .bx-itm-2, .ui2-lnr-qstn-cntr .pt-tg-qstn-cntr .bx-itm-1 {
		width: 43%;
		margin-bottom: 2%;
	}
	.ui2-lnr-qstn-cntr .lnr-img-cntr.ptn-obj-tg-pg img {
        width: 30%;
    }
	.ui2-lnr-qstn-cntr .lnr-img-cntr.ui2-ad-wdt-img img {
        width: 49%;
    }
	.pt-tg-answer-bxs > div {
        width: 47%;
    }
	.ui2-lnr-qstn-cntr .num-cntr-mng-ptrn label span {
        font-size: 2.2rem;
    }
	.ui2-lnr-qstn-cntr .lnr-img-cntr.l2-dd img {
		width: 21%;
	}
	.ui2-lnr-qstn-cntr .lnr-img-cntr.rprsnt-img-tally.t-tly-10 img {
		width: 41%;
		margin-right: 4%;
	}
	.ui2-lnr-qstn-cntr .lnr-img-cntr.rprsnt-img-tally.t-tly-50 img {
		width: 38%;
		margin-right: 2%;
	}
	.ui2-lnr-qstn-cntr .lnr-img-cntr.ui2-dd-plc-vl-img-cntr img {
		width: 28%;
	}
	.grp-shp.ui2-plc-vl-cntr>div{
		height: 135px;
	}
	.ui2-lnr-qstn-cntr .objects-by-numbers.ui2-plc-vl-cntr>div h3 {
		margin-top: 3%;
		margin-bottom: 0%;
	}
	.lnr-ans-bx-sel.dsp-flx-clmn-rvs {
		flex-direction: column-reverse;
	}
	.ui2-lnr-qstn-cntr .lnr-ans-bx-sel.dsp-flx-clmn-rvs a {
        width: 96%;
    }
	.lnr-qstn-box .lrg-fnt-instr label {
        font-size: 1.5rem;
		display: inline-block;
        text-align: center;
    }
	.ui2-lnr-qstn-cntr .lnr-ans-bx-sel.dsp-flx-clmn-rvs a {
        margin-bottom: 8%;
    }
	.lnr-qstn-box .skl-cnt-obj-nmbrs.ui2-smr-fnt-v2 .bx-itms-cnt-nmbr label {
        font-size: 2.1rem;
    }
	.pt-tg-qstn-cntr .bx-itm-5 {
        background-color: #ffffff;
    }
	.ui2-lnr-qstn-cntr .nmbr-syl-wrd-item {
        font-size: 6rem;
    }
	.ui2-lnr-qstn-cntr .nmbr-syl-wrd-item.nmb-itm-fnt-sml{
        font-size: 4rem;
    }
	.ui2-lnr-qstn-cntr .text-input-bx.auto-hgt-itm .lrn-usr-input-box input[type=text] {
		height: auto;
	}
	.ui2-lnr-qstn-cntr .lnr-ans-bx-sel.ui2-lrg-btn-cntr a {
        padding: 4% 2%;
        width: 42%;
        margin-bottom: 8%;
    }
	.ui2-rsp-cntr .lnr-ans-0 label, .ui2-rsp-cntr .crt-ans-1 label {
		font-size: 1.5rem;
	}
	.ui2-lnr-qstn-cntr .lnr-img-cntr.ui2-img-sz-10 img {
		width: 16%;
		margin-right: 1%;
	}
	.img-cntr-inline-text.ui2-lrg-itm-cntr-grp .nmbr-group-item-cntr {
        width: 46%;
    }
	.ui2-lnr-qstn-cntr .shaded-part-object.ui2-lrg-shd-rgn-img img {
		max-width: 100%;
	}
	.lrn-usr-input-box.ui2-lrg-bx input[type=text], .lrn-usr-input-box.ui2-lrg-bx input[type=number] {
        width: 65%;
    }
	.ui2-ovr-mas-itm .ovr-wdt-mass {
		width: 22%;
		text-align: center;
	}
	.ui2-cap-img-cntr .img-mn-cntr {
		align-items: center;
	}
	.ui2-cap-img-cntr .img-ltr-cntr {
		align-items: center;
	}
	.ui2-cap-img-cntr .sz-18-img .btl-img-item {
		width: 32%;
		margin-right: 0;
	}
	.ui2-cap-img-cntr.pt-tg-qstn-cntr .bx-itm-5 .lbl-bx-1-nmb img {
		display: inline-block;
		width: 88%;
	}
	.ui2-cap-img-cntr .img-mn-cntr .btl-img-item {
		width: 83%;
	}
	.ui2-bg-white .lnr-img-cntr.ui2-cap-img-cntr {
		margin-top: -1%;
	}
	.ui2-mny-cntr-mn-elem.lnr-mny-img-cntr-v2 {
		flex-wrap: wrap;
	}
	.lnr-mny-img-cntr-v2 div.img-holder {
		width: 100%;
	}
	.lnr-mny-img-cntr-v2 div.img-holder.img-item-1 {
		justify-content: center;
	}
	.lnr-ans-bx-sel.ui2-shw-in-coln {
		flex-direction: column;
    	align-items: center;
		padding: 4% 2%;
	}
	.ui2-lnr-qstn-cntr .lnr-ans-bx-sel.ui2-shw-in-coln a {
        width: 80%;
        margin-bottom: 3%;
    }
	.ui2-resp-vrd .lnr-ans-0 label, .ui2-resp-vrd .lnr-ans-0 label .q-tag-ft-sz,
	.ui2-resp-vrd .crt-ans-1 label, .ui2-resp-vrd .crt-ans-1 label .q-tag-ft-sz{
		font-size: 1.2rem;
	}
	.ui2-resp-vrd-v2 .lnr-ans-0 label, .ui2-resp-vrd-v2 .lnr-ans-0 label .q-tag-ft-sz,
	.ui2-resp-vrd-v2 .crt-ans-1 label, .ui2-resp-vrd-v2 .crt-ans-1 label .q-tag-ft-sz{
		font-size: 1.5rem;
	}
	.ui2-resp-vrd-v3 .lnr-ans-0 label, .ui2-resp-vrd-v3 .lnr-ans-0 label .ftz-2-rem,
	.ui2-resp-vrd-v3 .crt-ans-1 label, .ui2-resp-vrd-v3 .crt-ans-1 label .ftz-2-rem {
        font-size: 1.5rem !important;
    }
	.ui2-lnr-qstn-cntr .lnr-ans-bx-sel.ui2-tm-img-elem a {
        width: 45%;
        margin-bottom: 5%;
    }
	.ui2-lnr-qstn-cntr .nmbr-syl-wrd-item.ui2-vrd-sly-itm {
        font-size: 5rem;
    }
	.ui2-lnr-qstn-cntr .nmbr-syl-wrd-item.ui2-vrd-sly-itm-2 {
        font-size: 3rem;
    }
	.text-input-bx .lrn-usr-input-box.ui2-lrg-bx-100 input[type=text] {
        width: 95%;
		height: auto;
    }
	.ui2-vrd-num-ptr-2{
		display: flex;
    	flex-wrap: wrap;
	}
	.lnr-qstn-box .ui2-vrd-num-ptr-2>label{
		display: inline-block;
		margin-bottom: 10% !important;
	}
	.lnr-qstn-box .skl-cnt-obj-nmbrs .bx-itms-cnt-nmbr label {
        font-size: 2rem;
    }
	.ui2-lnr-qstn-cntr .dv-3-dgt-cntr span {
		font-size: 1.5rem;
	}
	.ui2-lnr-qstn-cntr .lnr-qstn-box .dv-3-dgt-cntr label {
		font-size: 2rem;
	}
	.ui2-npt-bx-cntr .lrn-usr-input-box input[type=text], .ui2-npt-bx-cntr .lrn-usr-input-box input[type=number] {
		font-size: 1.5rem;
		padding: 7px 6px;
	}
	.ui2-lrg-msr-len-item .q-tag-ft-sz {
		font-size: 1.2rem;
	}
	.ui2-lnr-qstn-cntr .ui2-lrg-msr-len-item .bx-itms-cnt-nmbr {
		align-items: center;
	}
	.itms-qstn-pool-list .itm-cntr .cls-itm-vl, .itms-sel-pool-list .itm-cntr .cls-itm-vl {
		font-size: 1.5rem;
		width: 32%;
	}
	.ui2-lnr-qstn-cntr .itms-qstn-pool-list .itm-cntr, .ui2-lnr-qstn-cntr .itms-sel-pool-list .itm-cntr {
		align-items: center;
	}
	.itms-sel-pool-list.ui2-vrd-itm-wdt .itm-cntr .cls-itm-nm {
		width: 100%;
	}
	.vertical-mat-npt .bx-npt-cntr input[type=text] {
		font-size: 1.8rem;
        padding: 10px 3px;
    }
	.ui2-lnr-qstn-cntr .lnr-qstn-box .lnr-qstn-info-cntr.ui2-mn-nbr-bdy-cntr div label {
		font-size: 1.5rem;
		display: block;
		margin-bottom: 10% !important;
	}
	#ansr-nm-lst-cntr{
		margin-top: 8% !important;
	}
	.ui2-lnr-qstn-cntr .bx-itm-3 .fa-divide{
		font-size: 2rem;
	}
	.ui2-lnr-qstn-cntr .input-fraction input{
		padding: 10px 1px;
		font-size: 2rem !important;
	}
	.ui2-lnr-qstn-cntr .pt-tg-qstn-cntr div.ui2-mn-frc-cntr-bx {
		width: 58%;
		padding: 2% .5%;
	}
	.ui2-frc-cntr-mn-elem .fraction-container{
		width: 100%;
	}
	.ui2-mod-lyt-qstn-swr .txt-instr-cntr label{
		font-size: 1.5rem;
	}
	.ui2-mod-lyt-qstn-swr .lnr-nsr-box{
		margin-top: 15%;
	}
	.ui2-mrg-btm-0 .ui2-add-mrg-tp-val.lnr-nsr-box{
		margin-top: 10%;
	}
	.ui2-dec-cntr-mn-elem.container-decimal-mn .qstn-cntr-dcml{
		width: 100%;
	}
	.ui2-lnr-qstn-cntr .lnr-ans-bx-sel.ui2-fra-dec-mn-cntr a {
        padding: 3% .5%;
        width: 43%;
    }
	.ui2-lnr-qstn-cntr .sqr-1-per label.sd-1 {
		top: 43%;
		left: 80%;
	}
	.ui2-lnr-qstn-cntr .sqr-1-per label.sd-2 {
		top: 90%;
		left: 42%;
	}
	.ui2-lnr-qstn-cntr .sqr-1-per label.sd-3 {
		top: 40%;
		left: -3%;
	}
	.ui2-lnr-qstn-cntr .sqr-1-per label.sd-4 {
		top: 0%;
		left: 41%;
	}
	.ui2-lnr-qstn-cntr .rec-1-per label.sd-1 {
		top: 40%;
		left: 70%;
	}
	.ui2-lnr-qstn-cntr .rec-1-per label.sd-2 {
		top: 88%;
		left: 45%;
	}
	.ui2-lnr-qstn-cntr .rec-1-per label.sd-3 {
		top: 40%;
		left: 7%;
	}
	.ui2-lnr-qstn-cntr .rec-1-per label.sd-4 {
		top: 1%;
		left: 44%;
	}
	.ui2-lnr-qstn-cntr .tri-2-per label.sd-2 {
		top: 75%;
		left: 30%;
	}
	.ui2-lnr-qstn-cntr .tri-2-per label.sd-1 {
		top: 44%;
		left: 70%;
	}
	.ui2-lnr-qstn-cntr .tri-1-per label.sd-1 {
		top: 43%;
		left: 73%;
	}
	.ui2-lnr-qstn-cntr .tri-1-per label.sd-2 {
		top: 85%;
		left: 45%;
	}
	.ui2-lnr-qstn-cntr .tri-1-per label.sd-3 {
		top: 42%;
		left: 8%;
	}
	.ui2-lnr-qstn-cntr .rec-4-per label.sd-1 {
		top: 81%;
		left: 44%;
	}
	.ui2-lnr-qstn-cntr .rec-4-per label.sd-3 {
		top: 1%;
		left: 45%;
	}
	.ui2-lnr-qstn-cntr .rec-4-per label.sd-2 {
		top: 42%;
		left: 6%;
	}
	.ui2-lnr-qstn-cntr .rec-4-per label.sd-4 {
		top: 43%;
		left: 74%;
	}
	.ui2-lnr-qstn-cntr .rec-2-per label.sd-1 {
		top: 40%;
		left: 73%;
	}
	.ui2-lnr-qstn-cntr .rec-2-per label.sd-3 {
		top: 40%;
		left: 3%;
	}
	.ui2-lnr-qstn-cntr .tri-3-per label.sd-3 {
		top: 41%;
		left: 20%;
	}
	.ui2-lnr-qstn-cntr .rec-3-per label.sd-1 {
		top: 63%;
		left: 78%;
	}
	.ui2-lnr-qstn-cntr .rec-3-per label.sd-2 {
		top: 71%;
		left: 23%;
	}
	.ui2-lnr-qstn-cntr .rec-3-per label.sd-3 {
		top: 26%;
		left: -2%;
	}
	.ui2-lnr-qstn-cntr .rec-3-per label.sd-4 {
		top: 18%;
		left: 60%;
	}
	.ui2-lnr-qstn-cntr .sqr-1-img .width-label {
		bottom: 43%;
		left: 13%;
	}
	.ui2-lnr-qstn-cntr .sqr-1-img .length-label {
		top: -10%;
		left: 38%;
	}
	.ui2-lnr-qstn-cntr .rec-1-img .width-label {
		bottom: 43%;
		right: 6%;
	}
	.ui2-sml-fnt-cntr-itm-bdy .q-tag-ft-sz{
		font-size: 1.5rem;
	}
	.img-mini-cntr-shp div {
		text-align: center;
		margin-top: 19%;
	}
	.area-comp-cntr-img.vlm-cntr .img-mini-cntr-shp {
		width: 100%;
	}
	.area-comp-cntr-img.ui2-ngl-itm-mn .img-mini-cntr-shp {
		width: 65%;
	}
	.ui2-aud-mn-cntr .aud-cnt-vc-cntr{
		width: 100%;
	}
	.ui2-lnr-qstn-cntr .lsn-audio-cntr-0 {
		border-radius: 42px;
		margin-top: 7%;
	}
	.ui2-lnr-qstn-cntr .lnr-ans-bx-sel.vertical-answers-disp{
		margin-top: 6%;
	}
	.ui2-lnr-qstn-cntr .lnr-ans-bx-sel.vertical-answers-disp a {
        width: 96%;
		margin-bottom: 6%;
		text-align: left;
		margin-left: 2%;
    }
	.ui2-lnr-qstn-cntr .lnr-ans-bx-sel.ui2-2-hrz-items a {
        width: 44%;
    }
	.ui2-lnr-qstn-cntr .lnr-qstn-box.ui2-mltpl-itm-cntr .msn-vwl-cntr label {
		font-size: 2rem;
	}
	.lnr-qstn-box.ui2-mltpl-itm-cntr .pls-sgn-bl i, .explainer-tag-516 .pls-sgn-bl i {
		font-size: 2rem;
	}
	.lnr-nsr-box.ui2-vt-box-disp .lnr-ans-bx-sel{
		flex-direction: column;
	}
	.ui2-lnr-qstn-cntr .ui2-vt-box-disp .lnr-ans-bx-sel a {
        width: 96%;
		margin-bottom: 6%;
		text-align: left;
		margin-left: 3%;
    }
	.lrn-map-bdy-itm {
        font-size: 1.3rem;
    }
    .ui2-skl-all-btn-elem {
        padding: 7% 3%;
        font-size: 2rem;
        width: 80%;
    }
    .ui2-lnr-qstn-cntr .lnr-qstn-box .msn-vwl-cntr label {
        font-size: 3rem;
    }
    .ui2-lnr-qstn-cntr .lnr-qstn-box .pls-sgn-bl i, .ui2-lnr-qstn-cntr .explainer-tag-516 .pls-sgn-bl i {
        font-size: 2rem;
    }
    .no-dig-tst-cntr {
        font-size: 1.8rem;
    }
    .ui2-str-gt-lrn-cntr {
        margin-top: 0;
        display: flex;
        justify-content: space-around;
        flex-direction: column;
        align-items: center;
    }
    .ui2-str-gt-lrn-cntr .mdl-diag-tst-grp {
        font-size: 1.5rem;
        padding: 3% 3%;
    }
    .trg-save-btn{
        width: 70%;
    }
    .mng-acc-cntr .esmk-acc-cntr-itm {
        height: auto;
        display: flex;
        justify-content: center;
        text-align: center;
    }
    .mng-acc-cntr .esmk-acc-cntr-itm img {
        width: 50%;
    }
    .ui2-prf-cntr-bdy a img{
        width: 50%;
    }
    .ui2-par-bdy-elem-cntr .bba-usr-itm.bba-usr-mcrs.ui2-rm-mgr-tp h3{
        margin-top: 0;
    }
	.letter-drag-drop #ondrp-all a,  .letter-drag-drop .jqry_grp-shp a {
		font-size: 3rem;
		width: 19%;
		font-family: 'Andika', sans-serif;
	}
	.letter-drag-drop #drg-drp-answer-bxs a {
		width: 70%;
	}
	.ui2-lnr-qstn-cntr .aud-cnt-vc-cntr {
        width: 100%;
    }
	.mn-alpbt-ltr-cntr .letters {
        font-weight: bold;
        font-size: 3.5rem;
    }
	.mn-alpbt-ltr-cntr .letter-examples {
        font-size: 0.8rem;
    }
	.ui2-lsn-bdy-mn-cntr #alphabet-letters-container.dv-cntr-30-lrg .mn-alpbt-ltr-cntr{
		width: 30%;
	}
	.lit-rcmd-cntr {
		width: 84%;
	}
	.ui2-lsn-bdy-mn-cntr .esmk-cnt-hdr-tag {
		font-size: 2rem;
	}
	.ui2-lsn-bdy-mn-cntr .esmk-snd-itm-ltr label {
        display: inline-block;
        text-align: center;
    }
	.lnr-qstn-box .change-case-cntr label, .lnr-qstn-box .msn-vwl-cntr label {
		font-size: 3rem;
	}
	.ui2-lnr-qstn-cntr .lnr-qstn-box .msn-vwl-cntr label {
		font-size: 3rem;
	}
	.ui2-lnr-qstn-cntr .ui2-flx-clm{
		display: flex;
        flex-direction: column;
	}
	.ui2-lnr-qstn-cntr .ui2-flx-clm img{
		width: 50%;
	}
	.ui2-lnr-qstn-cntr .lnr-ans-bx-sel.chld-fnt-cntr.sml-fnt-dv-elem a{
		font-size: 3rem;
	}
	.ui2-lnr-qstn-cntr .lnr-ans-bx-sel.sml-fnt-dv-elem a {
        padding: 3% 0%;
        width: 29%;
	}
	.ui2-lnr-qstn-cntr .lnr-qstn-box .pls-sgn-bl i, .ui2-lnr-qstn-cntr .explainer-tag-516 .pls-sgn-bl i {
		font-size: 3rem;
	}
	.ui2-lnr-qstn-cntr .qstn-bdy-cntr-51.dv-qstn-bdy-mn-word {
		font-size: 3rem;
		font-weight: bold;
	}
	.ui2-lnr-qstn-cntr .ui2-ort-clm-dsp a{
		width: 80%;
	}
	.ui2-lnr-qstn-cntr .wrd-tg-elem {
		font-size: 3rem;
	}
	.ui2-lnr-qstn-cntr .grp-shp.objects-by-words>div, .ui2-lnr-qstn-cntr .grp-shp.objects-by-words>div {
        width: 97%;
        height: 150px;
        padding: 1% 1%;
        border-radius: 7px;
    }
	.ui2-lnr-qstn-cntr .drop-word-obj-cntr .word-obj-cntr {
		height: 45%;
	}
	.ui2-lnr-qstn-cntr .ui2-lrg-wrd-fmt .qstn-bdy-cntr-51 {
		font-family: 'Andika', sans-serif !important;
		font-size: 3rem;
	}
	/*.rmv-brk-elm-by-mrg .qstn-bdy-cntr-51 {
		/*margin-top: -30%;*
	}*/
	.story-elem-cntr {
		flex-direction: column;
	}
	.content-lesson-bdy.str-bdy-cntr .lrn-cntr-0 {
		width: 95%;
	}
	.story-elem-cntr a {
		width: 95%;
	}
	.story-elem-cntr a img {
		width: 65%;
	}
	.usr-profile-avatar-cntr.ovr-mn-cntr{
		width: 100%;
	}
	.err-cntr-main .account-error-container {
		width: 90%;
	}
	.ovrd-large-cntr .cnt-hdr-mn-cntr {
        flex-direction: column-reverse;
    }
    .ovrd-large-cntr .cnt-hdr-mn-cntr img {
        width: 15%;
        margin-left: 0%;
    }
    .ovrd-large-cntr .cnt-hdr-mn-cntr>div:last-child{
        text-align:center;
    }
    .ovt-sbj-cnt-3 .sub-subjects-item {
        width: 92%;
    }
	.bba-usr-dashboard-body-invite {
		padding: 0% 2%;
	}
	.nvt-mn-cntr {
		width: 100%;
		flex-direction: column;
	}
	.sch-img-cntr {
		width: 100%;
	}
	.nvt-det-mn-cntr {
		width: 100%;
	}
	.nvt-mn-cntr .container {
		max-width: 500px;
		padding: .5rem 0rem;
	}
	.cls-ovr-main-pp-banner{
		flex-direction: column;
	}
	.ui2-assignments-cntr {
		margin: 4% 0% 1% 0%;
		width: 96%;
	}
	.ic-fl-dig-tst-cntr.usr-asgn-dsb-cntr img {
        width: 50%;
    }
	.pt-tg-qstn-cntr .trc-nmb-canvas-cntr {
		width: 90%;
	}
	.cntrl-nav-btns-cntr{
    	flex-direction: column-reverse;
    	width: 90%;
    }
    .cntrl-nav-btns-cntr #nxt-btn-elem{
        margin-top: 14%;
        margin-bottom: 10%;
    }
    .cntrl-nav-btns-cntr #prev-btn-elem{
        margin-bottom: 10%;
    }
    .cntrl-nav-btns-cntr a{
        font-size: 1.3rem;
        padding: 4% 2%;
    }
	.ui-scl-sgn-dom.ui2-lnr-qstn-cntr .lnr-ans-bx-sel a{
		width: 90%;
	}
	.ui-scl-sgn-dom .frac-numerator, .ui-scl-sgn-dom .frac-denominator {
		font-size: 1.5rem;
	}
	.ui-scl-sgn-dom.ui2-lnr-qstn-cntr .shaded-part-object img {
		max-width: 55%;
	}
	.objects-by-numbers>div>div {
		height: 103px;
	}
	.img-lrg-70.grp-shp>div img, .img-lrg-70.jqry_grp-shp>div img {
        max-width: 70%;
    }
	.img-wdt-40 img{
		width: 40%;
	}
	.stck-answer-cntr .lnr-ans-bx-sel a {
		text-align: left;
		padding: 1% 0% 0% 7%;
		display: block;
		font-size: 1.7rem;
	}
	.user-school-logo-cntr>div {
        width: 65%;
    }
    .schl-sgn-nly-cntr .ui2-assignments-cntr {
        width: 96%;
    }
	.tooltip.center-top-mobile::before {
        top: 0%;
        left: 40%;
    }
	.img-dis-row.max-width-30 img{
        max-width: 90%;
    }
	.sng-drp-cntr {
		width: 32%;
        margin-bottom: 7%;
	}
	.pre-filled-letter-cntr span {
		font-size: 3rem; /*changed from 4*/
	}
	.sng-drp-cntr .drop-word-obj-cntr {
        height: 86px;
	}
	.sng-drp-cntr .word-obj-cntr {
        font-size: 3rem;
    }
	.pre-fld-fnt-sml-2 span {
        font-size: 2rem;
    }
	.sng-drp-cntr .word-obj-cntr {
		font-size: 4rem;
	}
	.ui2-lnr-qstn-cntr .asn-dd-sgn-wrd-cntr .grp-shp>div{
		width: 100%;
	}
	.ui2-lnr-qstn-cntr .ovr-wdt-cntr-15 .drop-word-obj-cntr .word-obj-cntr {
		width: 26%;
		margin-bottom: 5%;
	}
	.ovr-wdt-cntr-15 .word-obj-cntr {
		font-size: 3rem;
	}
	.dropdown-selected {
		min-width: 97px;
	}
	.ui2-lnr-qstn-cntr .worded-problem-cntr .clz-tst-cntr{
		font-size: 1.5rem;
	}
	.multi-line-custom-drag-obj .draggable-div-cntr{
		font-size: 2rem;
	}
	.ui2-lnr-qstn-cntr .worded-problem-cntr.ovd-font-sz-4 {
        font-size: 1.5rem;
    }
    .ui-scl-sgn-dom .lnr-ans-bx-sel a {
        font-size: 1.5rem;
    }
    .ui2-lnr-qstn-cntr .worded-problem-cntr {
        font-size: 1.5rem;
    }
    .cga-hdr-cntr>div {
        width: 90%;
    }
    .cga-lrn-prv-cntr {
        width: 77%;
        margin: 3% 0%;
    }
    .cga-lrn-prv-cntr a {
        padding: 7% 0%;
    }
    .va-inf-fl a {
        width: 46%;
        padding: 6% 0%;
    }
    .spn-sml-wrd-cntr, .cma-itm-elem {
        font-size: 2rem;
    }
    .fnt-sz-2-5 {
        font-size: 2rem;
    }
    .fnt-sz-3 {
        font-size: 2rem;
    }
    .img-dis-row img {
        max-width: 24%;
    }
    .ui2-lnr-qstn-cntr .worded-problem-cntr.scl-lrg-stc-cntr {
        font-size: 2rem;
    }
    .img-wdt-60 img {
        width: 100%;
    }
    .img-dis-row img {
        max-width: 100%;
        margin-bottom: 4%;
    }
    .img-dis-row {
        flex-wrap: wrap;
        flex-direction: column;
    }
    .ovd-wrap-def{
        flex-wrap: nowrap;
        flex-direction: row;
    }
    .ovd-wrap-def.img-dis-row img {
        max-width: 24%;
    }
    .test-details>div {
        flex-direction: column;
        align-items: flex-start;
    }
    .test-details span.ast-nm-tag {
        width: 90%;
    }
    .bba-usr-dashboard-body.report-style-ovd {
        width: 98%;
    }
    .report-style-ovd .ui2-lnr-qstn-cntr .lnr-ans-bx-sel a {
        width: 90%;
    }
    .report-style-ovd .stck-answer-cntr .lnr-ans-bx-sel a {
        padding: 2% 0% 2% 7%;
    }
    .ui2-prg-rpt-bdy {
        flex-wrap: wrap;
    }
    .ui2-prg-rpt-bdy .esmk-rprt-chld-itm {
        width: 90%;
        margin-right: 3%;
        margin-bottom: 5%;
    }
    .cls-ovr-vw-cntr>div {
        background-color: #ffffff;
        width: 97%;
        padding: 1% 5%;
        align-items: center;
        margin-bottom: 3%;
    }
    .ui2-par-bdy-elem-cntr.ovd-mrg-tp-rpt .bba-usr-itm.bba-usr-mcrs h3 {
        margin-top: 2%;
    }
    .pfm-hdr-cntr {
        width: 100%;
    }
    .ovd-localized-lc-cntr .ui2-mdl-licenses-mn .usr-prc-pckg-card .usr-prc-pckg-itm-bdy {
        line-height: 2;
    }
    .img-dis-row.ovd-5-img img{
    	max-width: 40%;
    }
    .dsp-flx {
		display: block; /*overridde for responsiveness*/
	}
	.mdl-h3-cntr>div {
		width: 100%;  /*overridde for responsiveness*/
	}
	.padding-right-2-pct, .padding-left-2-pct{
		padding-right: 0%; /*overridde for responsiveness*/
	}
	.aln-txt-right, .aln-txt-left {
		text-align: center;
	}
	.ovd-schl-dt-cntr.data-item .bba-pwd-toggle {
        margin-left: -15%;
    }
    .chl-grd-nm-tag {
        margin-top: 11%;
    }
    .snapplify-sso-btn-cntr {
        width: 90%;
    }
    .dd-small-font{
		font-size: 1.2rem;
	}
	.a-opt-img-cntr a.rmv-flx-cls {
        display: inline-block;
        width: 43%;
        margin-bottom: 5%;
    }
    .ui2-mrg-btm-0 .lnr-nsr-box.a-opt-img-cntr {
        flex-wrap: wrap;
    }
    .img-dis-row.img-wdt-30 img {
        max-width: 100%;
    }
	.banner-btn-cntr{
		padding-left: 1%;
	}
	
	.drp-dwn-mn-cntr {
		flex-direction: column;
	}
	.drp-dwn-cntr-lft, .drp-dwn-cntr-rght {
    	width: 94%;
	}
	.text-input-bx .lrn-usr-input-box.dbl-inpt-cntr-asg input[type=text] {
        width: 80%;
    }
	.dbl-inpt-cntr-asg{
		flex-wrap: wrap;
	}
	.txt-instr-cntr {
    	margin-top: 5%;
    }
	.upd-acc-mn-cntr {
		padding: 30px 10px 5px 0px;
	}
	.ui2-usr-cntr {
		flex-direction: column;
	}
	.img-dis-row.img-wdt-50 img { /*Used for large width images and small height*/
		max-width: 100%;
	}

	.lnr-qstn-box table tr td:not(:first-child),
	.lnr-qstn-box table tr th:not(:first-child) {
		transform: none;
        position: relative;
        z-index: 0;
	}
	.lnr-qstn-box table tr td:not(:first-child), .lnr-qstn-box table tr th:not(:first-child), .lnr-qstn-box table tr td:not(.total-val) {
        display: table-cell;
    }
	.img-dis-row.mlp-img-hlr img {
        max-width: 60%;
    }
	.grade-inp-cntr.no-edit-not{
		width: 100%;
		margin-top: 6%;
	}
	.cca-log-inst-cntr .rec-pss-cntr-notif-v2{
    	width: 98%;
    }
    .fill-details .rec-pss-cntr-notif-phn-v2,
    .esm-signup-tag .tag-v2-cntr{
    	width: 98%;
    }
    .input-txt-area-mn {
        width: 90%;
        height: 150px;
    }
    .body-container {
        height: unset !important;
        min-height: 100vh;   
    }
    .inline-ovd-xtn  .itm-cntr-2-large.lnr-ans-bx-sel,
    .inline-ovd-xtn  .itm-cntr-3-large.lnr-ans-bx-sel{
        flex-direction: column;
    }
	.question-q-stack {
		width: -webkit-fill-available;
	}
	.question-q-stack .answer-input {
		width: 90%;
	}

    table.rtn-dft-tbl tr th:not(:first-child),
	table.rtn-dft-tbl tr td:not(:first-child) {
        width: unset;
        transition: unset;
        transform: unset;
        position: unset;
        z-index: unset;
    }
	table.rtn-dft-tbl tr td:not(:first-child), table.rtn-dft-tbl tr th:not(:first-child), table.rtn-dft-tbl tr td:not(.total-val) {
       display: table-cell;
    }
	table.rtn-dft-tbl tr:nth-of-type(even) td:not(:first-child) {
		background-color: unset;
	}
	.img-dis-row.multiple-imgs-cntr.cnt-img-3 img{
		max-width: 100%;
		margin-bottom: 5px;
	}
	
	.logo-grid {
		grid-template-columns: repeat(3, 1fr);
    	gap: 8px;
	}
}


/* Mobile: fewer columns, smaller boxes */
@media (max-width: 480px) {
  .logo-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }
  .logo-box {
    height: 60px;
    padding: 8px;
  }
}

/*font styles*/
.poppins-regular {
	font-family: "Poppins", sans-serif;
	font-weight: 400;
	font-style: normal;
}

.poppins-medium {
	font-family: "Poppins", sans-serif;
	font-weight: 500;
	font-style: normal;
}

.poppins-semibold {
	font-family: "Poppins", sans-serif;
	font-weight: 600;
	font-style: normal;
}

.poppins-bold {
	font-family: "Poppins", sans-serif;
	font-weight: 700;
	font-style: normal;
}
.andika-fnt-fml{
	font-family: 'Andika', sans-serif;
}

/* OVERRIDING STYLES :: This styles are set using PHP Vars*/ 
.esmk-content.parent_modal_font .mdl-not-cntr.team-disp-ovrd {
    font-family: 'Work Sans', sans-serif;
    font-size: 1.1rem;
}
a.fnt-grp-1{
	font-size: 0.9em;
}
/* Base notification styles */
.ui2-mn-notification {
    display: inline-flex;
    align-items: center;
    padding: 0.75rem 1.25rem;
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.5;
    margin: 0.5rem;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    animation: slideIn 0.3s ease-out;
}
/*override above*/
@media screen and (max-width: 768px){
	.ui2-mn-notification {
		align-items: center;
		padding: 0.5rem 0.25rem;
	}
}




/* Animation keyframes */
@keyframes slideIn {
    from {
        transform: translateY(-10px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Notification variants */
.ui2-mn-notification-info {
    background-color: #EBF5FF;
    color: #1E40AF;
    border-left: 4px solid #3B82F6;
}

.ui2-mn-notification-success {
    background-color: #ECFDF5;
    color: #065F46;
    border-left: 4px solid #10B981;
}

.ui2-mn-notification-warning {
    background-color: #FFFBEB;
    color: #92400E;
    border-left: 4px solid #F59E0B;
}

.ui2-mn-notification-error {
    background-color: #FEF2F2;
    color: #991B1B;
    border-left: 4px solid #EF4444;
}

/* Optional icon styles */
.ui2-mn-notification::before {
    content: '';
    width: 3em;
    height: 3em;
    margin-right: 0.75rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.ui2-mn-notification-info::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%233B82F6'%3E%3Cpath fill-rule='evenodd' d='M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z' clip-rule='evenodd'/%3E%3C/svg%3E");
}

.ui2-mn-notification-success::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%2310B981'%3E%3Cpath fill-rule='evenodd' d='M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z' clip-rule='evenodd'/%3E%3C/svg%3E");
}

.ui2-mn-notification-warning::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23F59E0B'%3E%3Cpath fill-rule='evenodd' d='M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z' clip-rule='evenodd'/%3E%3C/svg%3E");
}

.ui2-mn-notification-error::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23EF4444'%3E%3Cpath fill-rule='evenodd' d='M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z' clip-rule='evenodd'/%3E%3C/svg%3E");
}

/* Hover effect */
.ui2-mn-notification:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: all 0.2s ease;
}

/* Optional close button */
.ui2-mn-notification-close {
    margin-left: auto;
    width: 16px;
    height: 16px;
    opacity: 0.5;
    cursor: pointer;
    transition: opacity 0.2s ease;
}

.ui2-mn-notification-close:hover {
    opacity: 1;
}

.ui2-mn-notification a, .ui2-mn-notification b{
	font-family: 'Andika', sans-serif;
	display: contents;
	font-size: 0.9rem;;
}

/*Notification Banner container CSS*/
@media screen and (max-width: 768px){
	.ui2-mn-notification{
		position: relative;
	}
	.ui2-mn-notification::before {
		position: absolute;
    	top: -30px;
	}
}

/* TOOL TIP CSS*/
/* Common Tooltip Styles */
.tooltip-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 2rem;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 1rem;
    backdrop-filter: blur(10px);
}

.tooltip-trigger {
	display: none;
    position: relative;
    padding: 0.8rem 1.5rem;
    border: none;
    border-radius: 0.5rem;
    background: transparent;
/*     color: white; */
    cursor: pointer;
    font-size: 1rem;
    transition: all 0.3s ease;
}

.tooltip {
    position: absolute;
    bottom: calc(100% + 10px);
    left: 50%;
    transform: translateX(-50%);
    padding: 0.8rem 1.2rem;
    border-radius: 0.5rem;
    font-size: 0.9rem;
    white-space: nowrap;
    color: white;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 1000;
}

/* .tooltip::before {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 8px solid transparent;
} */
.tooltip::before {
    content: "";
    position: absolute;
    bottom: 100%;  /* Moves arrow to the top of the tooltip */
    left: 50%;
    transform: translateX(-50%);
    border: 8px solid transparent;
    
}
.tooltip.right-arrow::before {
    top: 50%;  /* Move the arrow vertically to the center */
    left: 100%; /* Position it at the right side of the tooltip */
    transform: translateY(-50%); /* Center it vertically */
}
.tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(-5px);
}
/* Neon Tooltip */
.neon .tooltip {
    background: #ff8400;
    box-shadow: 0 0 20px #21304D;
    border: 1px solid #ff5400;
}

.neon .tooltip::before {
	border-bottom-color: #21304D;  /* Change from `border-top-color` */
	border-left-color: transparent;
}
.neon .tooltip.right-arrow::before{
	border-left-color: #21304D;
	border-bottom-color: transparent;
}
.neon-glow {
    position: absolute;
    inset: 0;
    border-radius: 0.5rem;
    box-shadow: 0px 4px 8px 8px #21304D;
    animation: neon-pulse 1.5s ease-in-out infinite;
}

@keyframes neon-pulse {
    0%, 100% { opacity: 0.5; }
    50% { opacity: 1; }
}
/* MEDIA FOR TOOLTIP*/
@media screen and (max-width: 768px){
	.tooltip::before {
		top: 50%;  /* Center vertically */
		left: -6%; /* Default (Arrow on the right) */
		transform: translateY(-50%);
	}
	
	.tooltip.left-arrow::before {
		border-right-color: #21304D; /* Arrow color */
		border-left-color: transparent; /* Hide right border */
	}
	
	/* Fix border color */
	.neon .tooltip::before {
		border-bottom-color: #21304D;
		border-left-color: transparent;
	}
	
	.neon .tooltip.left-arrow::before {
		border-left-color: transparent; /* Set left arrow color */
		border-bottom-color: transparent; /* Remove bottom color */
	}
	.tooltip.right-arrow::before {
		top: 50%;
		left: 81%;
		transform: translateY(-50%);
	}
	.tooltip.neon-tip i{
		font-size: 1.5rem;
	}
	
}

/*OVERRIDE CHILD FONT CONTAINER IN SCHOOL ASSIGNEMNT*/
.ui-scl-sgn-dom,
.ui-scl-sgn-dom a {
	font-family: "Handlee", cursive;
}

#developer-error-log {
	background-color: #ffefef;
	border: 1px solid #ff4d4d;
	padding: 10px;
	margin-top: 10px;
	overflow-y: scroll;
	height: 200px;
	white-space: pre-wrap;
	font-family: monospace;
}

/* orange loader*/
.vw-asgn-loader {
    width: 100%;
    text-align: center;
    display: inline-block;
    vertical-align: top;
}

.vw-asgn-loader svg path,
.vw-asgn-loader svg rect{
	fill: #FF6700;
}
.disp-elem-none{
	display: none;
}
.fit-avl-spc{
	width: -webkit-fill-available;
}
.sys-ntf-all-col-span {
  grid-column: 1 / -1;
}



.noto-naskh-arabic-nml {
  font-family: "Noto Naskh Arabic", serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}
.arabic-text{
    font-size: 1.4rem;
    direction: rtl;
  	unicode-bidi: isolate;
}
.arb-fnt-2-5{
    font-size: 2.5rem;
}

.mn-tp-3{
    margin-top: 5%;
}