/* CSS FOR REVIEW PAGE */
.mobiletitle { display: none; }
.reviewsContainer {	display: flex; width: 100%; }
.rightSide { width: 70%; padding-inline: 50px; }
.leftSide { width: 30%; align-content: center; text-align: center; }
.leftSide img{ border-radius: 140px; background: #D9D9D9; }
.reviewsCourse { color: #fff; padding: 20px 0; background-color: #0665BB; }
.reviewsCourse h2 {	color: #FFF; text-align: center; font-family: Martel; font-size: 32px; font-style: normal; font-weight: 900; line-height: 42px; /* 131.25% */ text-transform: capitalize; }
.reviewsCourse .text { color: #FFF !important; text-align: center !important; font-family: "Open Sans" !important; font-size: 16px !important; font-style: normal !important; font-weight: 400 !important; line-height: 22px !important; /* 137.5% */ padding-block: 15px !important; }
.reviewsCourse .author { color: #FFF !important; text-align: center !important;	font-family: "Open Sans" !important; font-size: 18px !important; font-style: normal !important;	font-weight: 700 !important; line-height: 25px !important; /* 138.889% */ padding-top: 40px !important; }

/* Carousel Reviews */
.reviewsContainer button:focus, .reviewsContainer button:active, .reviewsContainer button:focus-visible {background: none !important; box-shadow: none !important;}
.reviewsCourse { position: relative; }
.carousel { overflow: hidden; position: relative; width: 100%; }
.carousel-wrapper { display: flex; transition: transform 0.5s ease; }
.carousel-slide { min-width: 100%; /* Show one slide at a time */ box-sizing: border-box; padding: 10px 100px; text-align: center; }
.carousel-controls { position: absolute; top: 45%; width: 100%; display: flex; justify-content: space-between; transform: translateY(-50%); }
.reviewsContainer button { background: none; color: #fff;  border: none; font-size: 3rem; cursor: pointer; color: #FFF; /* Default color for active buttons */ }
.reviewsContainer button:hover { color: rgba(255, 255, 255, 0.40);}
.reviewsContainer button:hover svg path { stroke: #E7D0D0; /* Change stroke color on hover */ }
.reviewsContainer button.inactive { background: none; color: rgba(255, 255, 255, 0.40); cursor: not-allowed; }
.reviewsContainer button.inactive svg path { stroke: rgba(255, 255, 255, 0.40); }
.carousel-dots { text-align: center; }
.reviewsCourse .carousel-dots button { border: none; background: rgba(255, 255, 255, 0.80); /* Inactive dot color */ border-radius: 50%; width: 2px !important; height: 2px !important; margin: 0 10px; cursor: pointer; transition: background 0.3s; padding: 6px; }
.reviewsCourse .carousel-dots button.active { background: #fff; /* Active dot color */ }

@media only screen and ( max-width: 1000px ) {
	.mobiletitle { display: block; text-align: center; }
	.desktoptitle { display: none; }
}
@media only screen and ( max-width: 900px ) { 
	.rightSide { width: 60%; padding-inline: 20px; }
	.leftSide {	width: 40%; }
	.carousel-slide { padding: 10px 50px; }
}
@media only screen and ( max-width: 600px ) { 
	.reviewsContainer {	display: flex; flex-direction: column; width: 100%; }
	.rightSide { width: 100%; padding-inline: 0px; padding-top: 20px;}
	.leftSide {	width: 100%; }
	.mobiletitle { display: none; }
	.desktoptitle { display: block; text-align: center;}
}
/* CSS FOR ELEMENTS/EXAM DETAILS SECTION */
	#edition-details-one .element#exam-details { margin: 30px 0 40px; }

	.element#exam-details { margin: 30px 0 0; }
	.element#exam-details .boxed { max-width: 830px; margin: 0 auto; padding: 40px 50px; box-shadow: 0 2px 9px rgb(0 0 0 / 10%); border-radius: 8px; overflow: hidden; background-color: #fff; }
	.element#exam-details .boxed h3 { text-align: center; color: #484468; margin: 0 0 10px; padding: 0; font-size: 30px; font-weight: bold; }
	.element#exam-details .boxed p { text-align: center; font-size: 20px; }
	.element#exam-details .boxed ol { margin: 30px 20px 30px 80px; }
	.element#exam-details .boxed ol li { font-size: 18px; margin-bottom: 12px; font-weight: 600; }
	.element#exam-details .boxed .actions a { display: inline-block; margin: 10px 10px 0;  }


	@media only screen and ( max-width: 820px ) {
		.element#exam-details .boxed ol { margin: 30px 20px 15px; }
		.element#exam-details .boxed ol li { margin-bottom: 10px; }
	}

	@media only screen and ( max-width: 610px ) {
		.element#exam-details .boxed .actions a { width: 100%; margin: 0 0 15px 0; display: block; }
	}

	@media only screen and ( max-width: 575px ) {
		.element#exam-details .boxed h3 { font-size: 24px; }
		.element#exam-details .boxed p { font-size: 18px; }
		.element#exam-details .boxed ol { margin-top: 15px; margin-bottom: 10px; padding: 20px;}
		.element#exam-details .boxed ol li { font-size: 18px;}
		
	}
	@media only screen and ( max-width: 475px ) {
		.element#exam-details { margin: 15px 0; }
		.element#exam-details .boxed { padding: 25px; }
		.element#exam-details .boxed h3 { font-size: 21px; }
		.element#exam-details .boxed p { font-size: 16px; }
		.element#exam-details .boxed ol li { font-size: 16px;}
	}

/* CSS FOR NEW PRODUCT CARD */

	@media only screen and ( min-width: 2300px ) { 
		.newProdCardFooter { padding: 11px 7vw 11px 7vw !important; }
	}
	.element.hero.acls {margin-bottom: 40px; }
	.newProductCard { background-color: #F7F7F7; border-radius: 36px;}
	
	.newProdCardHeader { text-align: center; padding-block: 40px; display: flex; justify-content: center;}
	.newProdCardHeader a:first-child { margin-right: 10px; }
	.newProdCardHeader a { text-decoration: none; display: block; width: 326px !important; height: 42px; background-color: #FFF; border: 2px solid #122E7C;	color: #122E7C;	border-radius: 21px; font-weight: bold; align-content: center !important;}
	.newProdCardHeader a.active, .newProdCardHeader a:hover { background-color: #122E7C !important; color: #FFF; transition: none !important; }
	
	.imgCard img { filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.25)); }
	.newProdCardBody { display: none; }
	.newProdCardBody.active { display: block; padding-inline: 50px;	padding-bottom: 30px; }
	.newProdCardBody.active { display: flex; }
	.newProdCardBody.active > div { width: 50%; }
	.newProdCardBody.active > div:nth-child(2) {	text-align: center;	}
	.newProdCardBody h5 { color: #000000 !important; padding: 0px 0px 0px 0px !important; }
	.newProdCardBody h1{ color: #000000; padding: 0px 0px 0px 0px !important; line-height: 1.3 !important; }
	.newProdCardBody .dollarSign { font-size: 20px;	vertical-align: super; }
	.newProdCardBody .priceCircle {	width: 75px; height: 75px; border-radius: 50%; font-size: 30px; color: #fff; text-align: center; background: #767676; display: inline-block; font-weight: 700; }
	.newProdCardBody #certificationProdPrice, .newProdCardBody #recertificationProdPrice { line-height: 75px; }
	.newProdCardBody .productInfo { display: flex; margin-top: 10px; }
	.newProdCardBody ul li{ font-weight: bold; line-height: 20px; }
	.newProdCardBody .productList { margin-left: 15px; }
	.newProdCardBody .green { background-color: #00A326 !important; text-align: center; width: 326px !important; height: 42px !important; align-content: center !important; text-transform: none !important; }
	.newProdCardBody .green:hover {	background-color: #1F7714 !important; }
	
	.newProdCardFooter { background-color: #484468;	color: #FFF; padding: 11px 10vw 11px 10vw; border-radius: 0px 0px  36px 36px; display: flex; justify-content: space-between; }
	.newProdCardFooter ul {	list-style: none; padding-bottom: 0px !important; }
	.newProdCardFooter ul li { padding-bottom: 0px !important; font-weight: bolder; }
	.popup { position: fixed; bottom: -100px; left: 0; width: 100%; justify-content: center; align-items: center; transition: bottom 0.5s ease-in-out, opacity 0.5s ease-in-out; display: flex; opacity: 0; z-index: 99999;}
	.popup.show { bottom: 15px; opacity: 1; }
	.popup-content { display: flex;	justify-content: space-between;	align-items: center; background-color: #122E7C;	color: #FFF; width: 640px; height: 90px; border-radius: 45px; font-weight: bolder; padding-inline: 2vw;	}
	.popup-content p { padding-bottom: 0px !important;	font-weight: bold !important; }
	.popup-addtocart { color: #fff; background: #00A326; border-color: #00A326; border: solid 2px #FFF; border-radius: 21px; font-size: 16px; text-align: center; line-height: 1;	font-weight: bold; text-decoration: none !important; display: inline-block;	width: 184px; height: 42px; align-content: center; }
	.popup-addtocart:hover { text-decoration: none !important; background-color: #1F7714 !important; color: #FFF !important; transition: none !important; cursor: pointer; }
	.popup-content p:nth-child(2) { padding-inline: 20px; }


	@media only screen and ( max-width: 1220px ) { 
		.newProdCardBody h1 { line-height: 1.4 !important; }
	}
	@media only screen and ( max-width: 1135px ) { 
		.newProdCardBody h1{ font-size: 35px !important; }
	}
	@media only screen and ( max-width: 990px ) { 
		#content .chat-button { display: none !important; }
	}
	@media only screen and ( max-width: 970px ) { 
		.newProdCardFooter { padding: 11px 5vw 11px 5vw; }
	}
	@media only screen and ( max-width: 900px ) { 
		.newProdCardHeader a { width: 42vw !important; }
		.newProdCardBody.active { padding-inline: 40px; }
	}
	@media only screen and ( max-width: 864px ) { 	
		.newProductCard { position: relative; }
		.imgCard { position: absolute; bottom: 10px; left: -18vw; }
		.imgCard img { width: 265px !important; }
		.newProdCardFooter { flex-direction: column; align-items: flex-end; }
		.newProdCardBody.active > div { width: 90%; }
		.newProdCardBody .productList { margin-left: 0px; padding-block: 10px; }
		.priceCircle { position: absolute; right: 4vw; top: 150px;	}
		.productList ul { display: grid; grid-template-columns: 1fr 1fr; column-gap: 35px; padding-bottom: 40px !important; }
		.newProdCardBody.active { padding-bottom: 50px;	}
		.newProdCardBody .green { position: absolute; margin-top: 10px; left: 50%; transform: translate(-50%, -50%); display: block; width: 395px !important; }
		.newProdCardFooter > div { width: 290px; }
		.popup-content { padding-inline: 4vw; }
		.newProdCardBody .productInfo { margin-top: 0px; }
	}
	@media only screen and ( max-width: 700px ) { 	
		.newProdCardBody h1{ font-size: 32px !important; }
		.newProdCardBody.active { padding-inline: 30px; }
		.newProdCardFooter > div { width: 281px; }
		.popup-content { padding-inline: 5vw; }
	}
	@media only screen and ( max-width: 650px ) {
		.element#hero-products { padding: 0px !important; }
		.priceCircle { display: none !important; }
		.newProdCardHeader { flex-direction: column; justify-content: center; align-items: center; gap: 15px; }
		div#course-page .element .w { padding: 0px !important; }
		.newProductCard { border-radius: 0px !important; }
		.newProdCardHeader { padding-block: 20px; }
		.newProdCardHeader a { width: 90% !important; }
		.productList ul { display: grid; grid-template-columns: 1fr; }
		.newProdCardHeader a:first-child { margin-right: 0px; }
		div#quality-guarantee { padding: 30px !important; }
		
	}
	@media only screen and ( max-width: 600px ) {
		.element.hero.acls {margin-bottom: 0px; }
		.newProdCardBody.active { padding-bottom: 120px; }
		.newProdCardBody.active > div {	width: 100%; }
		.imgCard { position: absolute; bottom: 190px; left: 0vw; }
		.newProdCardFooter { align-items: center; padding-top: 120px; border-radius: 0px !important;}
		.newProdCardBody .green { width: 90% !important; padding: 10px !important;}
		.popup-content { border-radius: 0px; }		
		.popup.show { bottom: 0px; opacity: 1; }
	}
	@media only screen and ( max-width: 565px ) {
		.popup-content span { font-size: 16px !important; }
	}
	@media only screen and ( max-width: 520px ) {
		.popup-content { flex-wrap: wrap; text-align: center; justify-content: center; padding-block: 5px; }
		.popup-content p:nth-child(3) { padding-top: 0px; }
		.popup-content { height: 130px !important; padding-top: 10px; padding-bottom: 25px;}
		.popup-content p:nth-child(2) { padding-inline: 0px; }
	}
	@media only screen and ( max-width: 490px ) {
		.popup-addtocart { width: 305px; height: 42px; }
	}


	.newProdCardBody .sale .dollarSign { font-size: 18px !important;}
	.newProdCardBody .sale .priceCircle { font-size: 22px !important; }
	span.smallDec { font-size: 14px !important; }
	a.button.green span.smallDec { font-size: 10px !important; }
	.products span.smallDec { font-size: 25px !important; }