/******* custom css start here *********/
html {scroll-behavior: smooth;}
body {overflow-x: hidden; font-size: 16px; color: #666; background-color: #ffffff; font-family: "Outfit", sans-serif; font-weight: 300;}
img {max-width: 100%;}
* {margin: 0px; padding: 0px; word-break: break-word; white-space: initial;}
p {font-size: 16px; color: #666; font-weight: 300;}
h1 {font-size: 58px !important;}
h2 {font-size: 50px !important;}
h3 {font-size: 36px !important;}
h4 {font-size: 24px !important; line-height: 43px;}
h5 {font-size: 20px !important;}
h6 {font-size: 16px;}
.fs-18 {font-size: 18px !important;}
.fs-16 {font-size: 16px !important;}
.fw-300 {font-weight: 300;}
.fw-400 {font-weight: 400;}
.fw-400 {font-weight: 500;}
.fw-600 {font-weight: 600;}
.fw-700 {font-weight: 700;}
.pt-8 {padding-top: 80px;}
.mt-8 {margin-top: 80px;}
a:hover {text-decoration: none;}
.uppercase {text-transform: uppercase;}
.black{color: #000;}
.white {color: #fff;}
ul {list-style: none;}
.fs-11 {font-size: 14px !important;}
.fs-14 {font-size: 14px !important;}
.fs-16 {font-size: 16px !important;}
.fs-18 {font-size: 18px !important;}
.fs-20 {font-size: 20px !important;}
.fs-24 {font-size: 24px !important;}
.fs-26 {font-size: 26px !important;}
.fs-28 {font-size: 28px !important;}
.fs-30 {font-size: 30px !important;}
.fs-32 {font-size: 32px !important;}
.fs-36 {font-size: 36px !important;}
.fs-46 {font-size: 46px !important;}
.fs-50 {font-size: 50px !important;}
.fs-60 {font-size: 60px !important;}
.mr-22 {margin-right: 22px;}
.white-space-nowrap{white-space: nowrap;}
a{text-decoration: none;}
.blue{color: #3d6ef5 !important;}
.yellow-btn, .blue-btn:hover {font-size: 16px;background: #FFD335; color: #000; padding: 10px 25px; border-radius: 5px;}
button#cartdropdownMenu {padding: 10px !important;}
.bg-yellow{background:#FFD335;}
.bg-blue{background:#3d6ef5;}
.blue-btn, .yellow-btn:hover {font-size: 16px; background: #3d6ef5; color: #fff; padding: 10px 25px; border-radius: 5px;}
.hover-white:hover {background: #fff;}
.error{ color:#F00;}
.yellow{color:#FFD335;}
.dark-grey{color: #333333;}
.custom-list li {
  position: relative;
  padding: 0 10px;
}

.custom-list li:not(:last-child)::after {
  content: "•";  
  position: absolute;
  right: -8px;   
  color: #000;  
  font-size: 28px;
  line-height: 1; 
}

/*******nav bar start here ********/
section.main-nav {position: fixed; width: 100%; top: 0; z-index: 99;}
.login-register button, .login-register a {line-height: 20px; display: inline-block; border: none;}
section.main-nav .navbar-nav li.navbar-side-item a {padding: 0px 20px; color: #000; font-size: 16px; transition: all 0.5s ease;  text-decoration: none;}
section.main-nav .navbar-nav li.navbar-side-item a:hover {color: #3d6ef5;}
section.main-nav .navbar-nav li.navbar-side-item a span.btn {padding: 0px;}
section.main-nav ul.navbar-nav li.navbar-side-item a.side-link.active {color: #000;}
section.main-nav ul.navbar-nav li.navbar-side-item a.side-link:hover {color: #3d6ef5;}
section.main-nav.fixed ul.navbar-nav li.navbar-side-item a.side-link:hover {color: #ffd335;}
section.main-nav.fixed ul.navbar-nav li.navbar-side-item a.side-link.active {color: #ffd335;}
section.main-nav .navbar-nav li.navbar-side-item .dropdown-menu .dropdown-item {color: #000 !important;}
section.main-nav .navbar-nav li.navbar-side-item .dropdown-menu .dropdown-item:active, section.main-nav .navbar-nav li.navbar-side-item .dropdown-menu .dropdown-item:hover {background: none;
  color: #ffd335 !important;}
section.main-nav ul.navbar-nav ul.dropdown-menu {background: #ffd335; border: none; top: 20px;}
.login-register li {list-style: none;}
.relative{position: relative;}
section.main-nav .navbar-nav li.navbar-side-item .dropdown-menu .dropdown-item a {display: block; padding: 0px; font-weight: 300; white-space: nowrap;}
.login-register ul.dropdown-menu,.register-login-mob ul.dropdown-menu{background: #3d6ef5;right: 0;}
.login-register ul.dropdown-menu li a, ul.dropdown-menu ul.dropdown-menu li a{font-size: 14px; font-weight: 300; color: #fff;}
.login-register ul.dropdown-menu li a:hover{background: #ffd335; color: #000;}
.login-register .dropdown button:focus {box-shadow: none; background: #3d6ef5;}
section.main-nav .navbar-nav li.navbar-side-item a.active {color: #3d6ef5 !important;}
.register-login-mob a.blue-btn {margin: 5px 0px; color: #fff !important; padding: 8px !important;}
img.dashboard-banner-img {margin-bottom: -600px; z-index: 999; position: relative; margin-top: 30px;}

/*********** banner home start here **************/
.banner-home{width: 100%; position: relative; background: url(../images/bannner-bg.png) no-repeat; background-size: cover; padding: 130px 0px;}
.banner-home .row .carousel-caption {position: relative; left: inherit; right: inherit; bottom: inherit; top: inherit; padding-left: 80px; padding-right: 30px;}
.banner-home .carousel-indicators button.active {background-color: #3d6ef5;}
section.banner-home {position: relative; z-index: 9;}
img.text-shape-banner {position: absolute; left: 0; top: -70px;}
.banner-img-1 {padding-top: 40px;}
.banner-img-2 {padding-bottom: 40px;}
img.banner-dots {position: absolute; left: -138px; bottom: 0;}
img.line-shape {position: absolute; left: -40px; top: 0px;}
.banner-home .carousel-indicators{bottom: -80px;}

a.next-sec {width: 60px; height: 60px; display: flex; background: #fff; align-items: center; justify-content: center; border-radius: 50%; position: absolute; left: 0;
  right: 0; margin: 0 auto; bottom: -30px;  box-shadow: 0px 0px 30px 10px rgba(0, 0, 0, 0.05);}
img.wave-shape-banner {position: absolute; bottom: 0px; left: 0; width: 100%;}
/*************** abut sec start here ****************/
section.about-grid.text-center {margin-top: 490px; padding-bottom:40px;}
.sec-space { padding: 80px 0;}
.single-grid-abt{border-radius: 30px; padding: 40px 20px !important;}
img.about-dots-right {position: absolute; max-width: 100px; right: 0; top:30%;}
a.more-a {transition: all 0.5s ease; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; margin: 0 auto;}
a.more-a:hover{background: #3d6ef5; color: #fff;}
.about-sec{width: 100%; position: relative; padding: 20px 0px 120px ;}
.rbt-40-hour{width: 100%; position: relative; padding: 80px 0px 120px; margin-bottom: 80px;}
.about-img-2 {position: absolute; left: -130px; bottom: -200px;}
.rbt-img-2{position: absolute; left: -130px; bottom: -130px;}
img.about-dots {position: absolute; left: -30px; bottom: 130px;}
img.about-waves {position: absolute; left: -150px; top: 80px;}

/********* bestseller start here *************/
.best-seller{background: #FFF9F7; position: relative;}
img.book-icon {position: absolute;left: 20px;top: 220px; z-index:0}
img.dotted-icon {position: absolute; right: 30px; bottom: 100px;}
.bestseller-spacing {margin-top:0px;}
.bestseller-text {border-radius: 20px;}
.bestseller-text p {min-height: 170px;}
.single-img-sec {width: 100%; height: 290px;}
.single-img-sec img {width: 100%; max-width: 100%; height: 100%; object-fit: cover; border-radius: 15px;}
.bestseller-text h4 {display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;}

/************* howit-works start here *************/
.how-it-works{width: 100%; position: relative; background-image: url(../images/rays-top.png), url(../images/rays-bottom.png); background-position: top left, bottom right; background-repeat: no-repeat; position: relative;
z-index: 9;}
.ready-to-start {border-radius: 30px; margin-top: 40px; margin-bottom: -100px; padding: 90px 70px;}
.single-step{margin-bottom: 30px;}
span.step-count {display: flex; min-width: 90px; height: 90px; align-items: center; justify-content: center; background: #fff; border-radius: 50%; z-index: 9; position: relative;}
.step-text {position: relative; border-radius: 15px;}
span.contact-icon {display: inline-block; min-width: 30px; height: 30px; background: #3c6df2; color: #fff; border-radius: 50%; padding: 3px 5px; margin-right: 5px; }
.step-text::before {content: ''; width: 0; height: 0; border-top: 8px solid transparent; border-right: 16px solid #fff; border-bottom: 8px solid transparent; left: -16px;position: absolute;
top: 50px;}
.steps::before {content: ''; position: absolute; width: 3px; height: 90%; background: #fff; left: 44px; top: 5%; z-index: 0;}
.get-touch{border-radius: 30px;}
.contact-ul li a, .contact-ul li {display: flex; align-items: center;}
.contact-ul li span.circle-white {width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; background: #fff; border-radius: 50%; margin-right: 10px;}
.loc-map{border: 5px solid #fff !important;}
/******* footer start here *********/
footer {padding: 100px 0px 15px 0px; display: block; width: 100%; text-align: center; background:#FFD335;}
footer .svg-shape {margin-top: 0px; transform: rotate(0deg);}
footer p, footer ul li, footer .social-head ul li, footer .social-head ul li a, footer a, footer span, footer {margin-bottom: 0px; font-size: 16px; color: #000; display: inline-block; transition: all 0.5s ease;}
footer .social-head ul li a:hover, footer a:hover{color: #fff !important;} 
footer ul {padding: 15px 0px 15px 0px; margin-bottom: 0px;}
.logo-footer {margin-bottom: 10px;}
a.logo-footer {max-width: 240px;}
footer ul li {padding: 0px 2px; font-weight: 400;}
ul.navbar-footer li.navbar-side-item {padding: 0px 15px;}
footer a:hover {color: #fff;}
footer span {padding: 0px 10px;}
.footer-menu li a{font-weight: 400;}
.footer-menu li a:hover{color: #fff;}
footer .social-head ul.text-right {justify-content: flex-end; margin-bottom: 0px;}
footer hr {border-top: 1px solid rgba(255, 255, 2555, 0.2);}
img.footer-curl {position: absolute; left: 80px; top: 100px;}
img.footer-book { position: absolute; top: 50px; right: 100px;}
footer ul.social li a{ width: 32px; border: 1px solid #fff; height: 32px; display: flex; justify-content: center; align-items: center; border-radius: 4px; transition: all 0.5s ease;}
footer ul.social li a:hover{background: #FFD335; color: #3d6ef5;}
footer ul li a:hover{color: #FFD335;}
footer ul.social {display: flex; justify-content: center;gap: 5px;}
section.main-nav.fixed {background: #fff; box-shadow: 0px 0px 30px 15px rgba(0, 0, 0, 0.1);}
section.main-nav.fixed a.navbar-brand img {max-width: 130px;}
section.main-nav.fixed nav {padding: 0px;}
.navbar-nav .nav-link {color: #fff;}
.dropdown-menu.show { -webkit-animation: fadeIn 0.3s alternate; /* Safari 4.0 - 8.0 */animation: fadeIn 0.3s alternate;}
.nav-item.dropdown.dropdown-mega {position: static;}
.nav-item.dropdown.dropdown-mega .dropdown-menu {width: 90%; top: auto; left: 5%;}
.navbar-toggler { border: none; padding: 0; outline: none;}
.navbar-toggler:focus { box-shadow: none;}
.navbar-toggler .hamburger-toggle {position: relative; display: inline-block; width: 50px; height: 50px; z-index: 11; float: right;}
.navbar-toggler .hamburger-toggle .hamburger { position: absolute; transform: translate(-50%, -50%) rotate(0deg); left: 50%; top: 50%; width: 50%; height: 50%; pointer-events: none;}
.navbar-toggler .hamburger-toggle .hamburger span { width: 100%; height: 4px; position: absolute; background: #333; border-radius: 2px; z-index: 1; transition: transform 0.2s cubic-bezier(0.77, 0.2, 0.05, 1), background 0.2s cubic-bezier(0.77, 0.2, 0.05, 1), all 0.2s ease-in-out;
left: 0px;}
.navbar-toggler .hamburger-toggle .hamburger span:first-child { top: 10%; transform-origin: 50% 50%; transform: translate(0% -50%) !important;}
.navbar-toggler .hamburger-toggle .hamburger span:nth-child(2) {top: 50%; transform: translate(0, -50%);}
.navbar-toggler .hamburger-toggle .hamburger span:last-child { left: 0px; top: auto; bottom: 10%; transform-origin: 50% 50%; }
.navbar-toggler .hamburger-toggle .hamburger.active span {position: absolute; margin: 0;}
.navbar-toggler .hamburger-toggle .hamburger.active span:first-child { top: 45%; transform: rotate(45deg);}
.navbar-toggler .hamburger-toggle .hamburger.active span:nth-child(2) {left: 50%; width: 0px;}
.navbar-toggler .hamburger-toggle .hamburger.active span:last-child {top: 45%; transform: rotate(-45deg); }
.icons {display: inline-flex; margin-left: auto;}
.icons a {transition: all 0.2s ease-in-out; padding: 0.2rem 0.4rem; color: #ccc !important; text-decoration: none;}
.icons a:hover {color: white; text-shadow: 0 0 30px white;}
section.main-nav .navbar-nav li.dropdown-item.dropend ul.dropdown-menu li a:hover{color:#3d6ef5 !important;}
.about-page-sec .about-img-1 img.about-img-1 {width: 80%;}
.about-page-sec .about-img-2 {position: absolute; left: 0;  bottom: -100px;}
.what-we-offer p {min-height: 50px;}
.what-we-offer .bestseller-spacing{margin-bottom: 30px !important; margin-top: 0px !important;}
.what-we-offer .bestseller-text svg {font-size: 50px; color: #ffd335;}

/************ Store start here **************/
.available-positions {margin-top: 60px !important;}
.shop-box-items .book-thumb {background-color: #f5f5f5; padding: 10px; border-radius: 10px; position: relative; overflow: hidden; height: 292px; max-width: 336px; margin: 0 auto;}
.short-description p {overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; min-height: 48px;}
.short-description p span {background: transparent !important;}
.shop-box-items .book-thumb img {width: 100%; height: 100%; object-fit: cover; border-radius: 10px; margin: 0 auto; display: block;}
.shop-content h3 a { font-size: 20px; color: #000;}

/*********** product-detail  start here ****************/

section.product-detail {margin-top:50px !important;  margin-bottom: 50px;}
.underline{text-decoration: underline;}
.img-wrapper{/* height: auto; */ padding: 30px; background: #f1f1f1; border-radius: 20px;  display: flex; margin: 10px auto;}
.img-wrapper .left, .img-wrapper .right {flex: 1 1 auto;}
.img-wrapper .left {display: flex; justify-content: center; align-items: center;}
.img-wrapper .left > img {width: 100%; height: auto; pointer-events: none;}
.img-wrapper .right {position: absolute; right: -100%;  top: 0; overflow: hidden; display: none; width: 100%; height: 100%; border: 1px solid #eee; border-radius: 15px;
  box-shadow: 0px 0px 20px 10px rgba(0,0,0,0.1); z-index: 99999; background: #fff;}
.img-wrapper:hover .right {display: block;}
.breadcrumb-custom {margin-top: 104px;}
.img-wrapper .inner {position: absolute; width: 400%; height: 400%; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; justify-content: center; align-items: center;}
.img-wrapper .inner > img {width: 100%; height: auto;}

/******** product detail tabs ***********/

.product-detail-tabs .nav-tabs { border: 0;}
.product-detail-tabs .nav-tabs .nav-link.active {border: 0;}
.product-detail-tabs li.nav-item .nav-link:hover, .product-detail-tabs li.nav-item .nav-link.active {  border: 0; margin-bottom: 0; background-color: #FFD335; color: #000;}
.product-detail-tabs li.nav-item .nav-link {border: 0;margin-bottom: 0;}
.product-detail-tabs li.nav-item .nav-link { color: #000;}

/************** cart quantity custom **************/

.shopping-cart-items {width: 300px;}
.shopping-cart-items {max-height: 300px; overflow-y: auto;}
.shopping-cart-items img {max-width: 80px;}
.ctrl {flex: 0 0 auto; display: inline-flex; align-items: flex-start; border-bottom: 1px solid #D5DCE6; background-color: #fff; border-radius: 5px; font-size: 20px;}
.ctrl__counter { position: relative; width: 120px; height: 46px; color: #333C48; text-align: center; overflow: hidden; background: #eee;}
.ctrl__counter.is-input .ctrl__counter-num {visability: hidden; opacity: 0; transition: opacity 100ms ease-in;}
.ctrl__counter.is-input .ctrl__counter-input {visability: visible; opacity: 1; transition: opacity 100ms ease-in; }
.ctrl__counter-input {width: 100%; margin: 0; padding: 0; position: relative; z-index: 2; box-shadow: none; outline: none; border: none; color: #333C48;font-size: 14px;
line-height: 46px; text-align: center; visability: hidden; opacity: 0; transition: opacity 100ms ease-in;}
.ctrl__counter-num {position: absolute;  z-index: 1; top: 0; left: 0; right: 0; bottom: 0; line-height:46px; visability: visible; opacity: 1; transition: opacity 1000ms ease-in;}
.ctrl__counter-num.is-increment-hide {opacity: 0; transform: translateY(-50px); -webkit-animation: increment-prev 100ms ease-in; animation: increment-prev 100ms ease-in;}
.ctrl__counter-num.is-increment-visible {opacity: 1; transform: translateY(0); -webkit-animation: increment-next 100ms ease-out; animation: increment-next 100ms ease-out;}
.ctrl__counter-num.is-decrement-hide {opacity: 0; transform: translateY(50px); -webkit-animation: decrement-prev 100ms ease-in; animation: decrement-prev 100ms ease-in;}
.ctrl__counter-num.is-decrement-visible {opacity: 1; transform: translateY(0); -webkit-animation: decrement-next 100ms ease-out; animation: decrement-next 100ms ease-out;}
.ctrl__button {width: 46px; line-height: 46px; text-align: center; color: #fff; cursor: pointer; background-color: #3d6ef5; transition: background-color 100ms ease-in;}
.ctrl__button:hover {background-color:#FFD335; transition: background-color 100ms ease-in;}
.ctrl__button:active {background-color: #778996; transition: background-color 100ms ease-in;}
.ctrl__button--decrement {border-radius: 5px 0 0 5px;}
.ctrl__button--increment {border-radius: 0 5px 5px 0;}

@-webkit-keyframes decrement-prev {
from {
  opacity: 1;
  transform: translateY(0);
}
}

@keyframes decrement-prev {
from {
  opacity: 1;
  transform: translateY(0);
}
}
@-webkit-keyframes decrement-next {
from {
  opacity: 0;
  transform: translateY(-50px);
}
}
@keyframes decrement-next {
from {
  opacity: 0;
  transform: translateY(-50px);
}
}
@-webkit-keyframes increment-prev {
from {
  opacity: 1;
  transform: translateY(0);
}
}
@keyframes increment-prev {
from {
  opacity: 1;
  transform: translateY(0);
}
}
@-webkit-keyframes increment-next {
from {
  opacity: 0;
  transform: translateY(50px);
}
}
@keyframes increment-next {
from {
  opacity: 0;
  transform: translateY(50px);
}
}

.available-positions a svg {font-size: 16px !important;}
.what-we-offer .bestseller-text .yellow-btn svg{color: #000;}

/************** dushyant **************/
.proceed {background: #6a8ef4 !important; border-radius: 4px 4px 0px 0px;}
.valeted { background: #fbbe40; width: 100%;}
.card {border-radius: 4px;}
.encrypted {background-image: url('/public/assets/front-end/images/credit-card-icon.png'); background-repeat: no-repeat; background-position: left 15px center; background-size: 27px;
  padding-left: 50px;}
.secure img {width: 93px; height: 93px; object-fit: contain; border-radius: 5px;}
button#submit:hover {background-color: #3d6ef5;}
.components { /* background: rgb(231, 155, 115); background: linear-gradient(0deg, rgb(191 148 126) 23%, rgb(61 110 245 / 78%) 66%); */padding: 16px;margin: 0 auto;
  border-radius: 4px;}
.walented {font-size: 14px;}
.sipping hr:not([size]) {height: 2px; background: white;}
.triuble input#cardholder-name {font-size: 14px;}
.courses-sec .shop-content h3 {line-height: 16px; margin-top: 10px; min-height: 45px;}
.inventiable-btn {background: #026c02; color: white;}
.better {z-index: -2222222;}
.corner-ribbon {position: absolute; top: 7px; left: 7px; height:104px; width: 104px; padding: 8px;}
.corner-ribbon .cr-inner {position: absolute; inset: 0; background: #3d6ef5; color: white; border-radius: 16px 8px 0 8px; -webkit-clip-path: polygon(0 0, 100% 0, 0 100%); clip-path: polygon(0 0, 100% 0, 0 100%);}
.paid-course-tag{background: #FFD335 !important ;}
.paid-course-tag .cr-text{color: #000;}
.corner-ribbon .cr-text {display: block; font-weight: bold; font-size: 12px; text-align: center; line-height: 1.3;transform: rotate(-45deg) translateY(-0.2em) translateX(-2.2em);}
.corner-ribbon .cr-text strong {display: block; font-weight: normal;text-transform: uppercase;}
.corner-ribbon::before, .corner-ribbon::after {content: ""; position: absolute; background: #47469B; z-index: -1;}
.corner-ribbon::before {top: calc(100% - 8px); left: 0; height: 8px; width: 3px; border-radius: 0 0 0 50%;}
.corner-ribbon::after {left: calc(100% - 8px); top: 0; width: 8px; height: 3px; border-radius: 0 50% 0 0;}
.privacy-sec ul {list-style: disc;}

/************** new pages css start here **************/

select#categorySelect {max-width: 85px;}
select#categorySelect:focus{box-shadow: none;}
.bg-yellow-color{background-color: #ffd335;}
#searchButton:hover{color: #01009f;}
.text-left{text-align: left;}
.hover-yellow:hover, .hover-yellow:focus{background-color: #ffd335; color: #000;}
.filter-btn::after{position: absolute; right: 15px; top: 15px;}
.filter-sidebar {position: sticky; top: 75px;}

/************ cat page css start here *************/
.cart__collaterals-wrap {border: 1px solid #ebebeb; border-radius: 0; padding:30px; margin-left: 50px;}
.cart__collaterals-wrap .title {font-size: 1.5rem; font-weight: 700; text-transform: uppercase; padding-bottom: .9375rem; border-bottom: .9375rem; border-bottom: 1px solid #ebebeb; margin-top: 0px;}
.cart__collaterals-wrap .list-wrap {padding-bottom: .9375rem;}
.cart__collaterals-wrap .list-wrap li {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px; justify-content: space-between;
  border-bottom: 1px solid #ebebeb; color: #161439; font-size: 15px; font-weight: 600; padding: 12px 5px;}
.cart__collaterals-wrap .list-wrap li span {color: #6d6c80; font-weight: 400;}
.cart__table .product__thumb img {max-width: 70px;}
.cart__table tbody td {padding: 12px 17px; text-align: left; line-height: 1.1; border: none; border-top: 1px solid #ebebeb; vertical-align: middle; color:#6d6c80;}
div#content .accordion-button {display: flex; justify-content: space-between; align-items: center;}
div#content .accordion-button::after{display: none;}
div#content .accordion-toggle {cursor: pointer; padding: 0 10px;}
div#content .accordion-toggle:before {font-family: "Font Awesome 6 Free"; /* Specify the Font Awesome font family */ font-weight: 900; /* Use the appropriate weight (900 for solid icons) */
  content: "\f107"; /* Unicode for the 'angle-up' icon */ color: #000;}
div#content .accordion-toggle[aria-expanded="true"]:before {font-family: "Font Awesome 6 Free"; /* Specify the Font Awesome font family */ font-weight: 900; /* Use the appropriate weight (900 for solid icons) */
  content: "\f106"; /* Unicode for the 'angle-up' icon */ color: #ffd335;}
div#content .accordion-item {background: none !important; border: none;}
div#content button.accordion-button {background: none; border: none !important; box-shadow: none; border-radius: 0px; border-bottom: 1px dashed #aaa !important;  padding-left: 0px !important; padding-right: 0px !important;
  color: #000;}
.text-gray-600 {color: #78829d !important;}
.text-gray-700 {color: #4b5675 !important;}
.fs-7 {font-size:14px !important;}
div#content .accordion-body{padding-left: 0px !important; padding-right: 0px !important;}
.timeline-icon {width: 38px; height: 38px; margin-right: 10px; border: 1px dashed #fff; display: flex; align-items: center; justify-content: center; border-radius: 50%; color: #fff;
background: #ffd335;}
.lesson-quiz-section.px-5.py-5 {min-height: calc(100vh - 300px); padding-top: 140px !important;}
.timeline-content a {font-size: 14px;}
.embed-responsive {position: relative; display: block; width: 100%; padding: 0; overflow: hidden; }
.embed-responsive-16by9::before {padding-top: 56.25%; display: block; content: "";}
.embed-responsive iframe{position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; border: 0;}
.bg-gray-100{background: #d4e0fc;}
.text-gray-600 {color: #78829d !important;}
.min-h-400px {min-height: 400px !important;}
.w-200px {width: 200px !important;}
.form-label .required:after {content: "*"; position: relative; font-size: inherit; color: var(--bs-danger); padding-left: .25rem; font-weight: 600;}
.btn.btn-outline-dashed {border: 1px dashed #dbdfe9; padding: 7px 15px !important;}
.btn.btn-outline-dashed:hover {color: #3d6ef5; border-color: #3d6ef5; background-color: #e9f3ff;}
.btn.btn-outline-dashed span.fs-5 {font-size: 16px !important; font-weight: 400 !important;}
.btn.btn-outline-dashed:hover  span.fs-5{ color: #3d6ef5 !important;}
.btn.btn-outline-dashed input.form-check-input {margin-left: 0px;}
.form-check-input:checked {background-color: #3d6ef5; border-color: #3d6ef5;}
.stats-circle svg circle[stroke]:first-child {stroke: #eee !important;}
.form-check:not(.form-switch) .form-check-input[type=checkbox] {background-size: 60% 60%;}
.form-check-input[type=checkbox] {border-radius: .45em; width: 22px; height: 22px;}
.border-light{ border-color: #f5f5f5 !important;}
.btn.btn-bg-light {border-color: #d4e0fc; background-color: #d4e0fc;}
.bg-grey-light{background: rgba(212, 224, 252, 0.3);}
.active-lesson .lesson-title a {color: #3d6ef5 !important;}
.wrong-answer,.wrong-answer:hover,.wrong-answer:focus {background-color: #fbb4b4 !important;}
.correct-answer, .correct-answer:hover, .correct-answer:focus {background-color: #a8e3a8 !important;}
.border-dashed{border-style: dashed !important;}
.bg-light-success {background-color: #dfffea !important;}
.h-8px {height: 8px !important;}
.result-right .bg-success {background-color:#17c653 !important;}
.timer{text-align: center; min-width: 60px;}
.calculator-modal .modal-body {background: #edf1f4; padding: 50px 15px;}
div.calc div button:last-child {margin-right: 0px !important;}
div.calc {position: relative; width: 323px; padding: 20px; border-radius: 20px; box-shadow: 15px 15px 20px rgba(0, 0, 0, 0.1), -15px -15px 20px #fffb; margin: 0 auto;}
div.calc button {font-size: 15px; border: none; margin: 8px; transition: 0.2s; display: inline-block; width:54px; text-align: center; padding: 9px 10px; cursor: pointer; transition: border-color .2s ease-in-out, background-color .2s, box-shadow .2s;
background: #edf1f4; border: 2px solid #edf1f4; box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1), -5px -5px 10px #fff; border-radius: 10px;}
div.calc button:hover {background-color: #FFE1D4;}
button:focus {outline: none;}
div.calc textarea:focus{border: none; outline: none;}
div.calc textarea {position: relative; grid-column: span 4; user-select: none; overflow: none; width: 100%; text-align: end; color:#3d6ef5; height: 100px; line-height: 100px;
box-shadow: inset 5px 5px 20px rgba(0, 0, 0, 0.1), inset -5px -5px 20px #fff; border-radius: 10px; margin-bottom: 12px; padding: 0 20px; font-size: 2em; font-weight: 500;
border: none; resize: none;}
div.calc button:hover{background:#3d6ef5; color: #fff;}
div#calculatorModal .modal-header h1 {font-size: 22px !important;}
.course-icon-single{color:#d4e0fc !important;}
.icon-box-cousrse .active-icon-blue{color: #61a1fe !important;}
div.calc button#backspace {background:#f44336;  color: #fff;}
div.calc button#backspace:hover{background:#cb1609;  color: #fff;}
div.calc button#equal {background:#31a935;  color: #fff;}
div.calc button#equal:hover{background:#117a15;  color: #fff;}
div.calc button#clear, div.calc button#para1, div.calc button#para2 {background:#FFD335;  color: #fff;}
div.calc button#clear:hover, div.calc button#para1:hover, div.calc button#para2:hover{background:#3d6ef5;  color: #fff;}
div.calc button#add,div.calc button#subtract,div.calc button#multiply{background:#3d6ef5;  color: #fff;}
div.calc button#add:hover,div.calc button#subtract:hover,div.calc button#multiply:hover{background:#1a42af;  color: #fff;}
.quiz-right .form-check-custom input.form-check-input {min-width: 22px; min-height: 22px;}
.quiz-right .form-check-custom span {text-align: left;}
.categories-checkboxes .form-check label.form-check-label {margin-left: 10px; font-weight: 400 !important; font-size: 14px !important; color: #666;}
.rounded-10px{border-radius: 10px;}
.home-form input{height: 54px; font-size: 14px;}
.home-form textarea{font-size: 14px;}
.home-form .yellow-btn:hover{background:#fff !important; color: #000;}
.shop-box-items .shop-content .short-description {min-height: 50px;}
.price-rating {min-height: 53px;}
.cursor-auto{cursor: auto !important;}
.fs-12{font-size: 12px;}
.capitalize{text-transform: capitalize;}

.quiz-box .options-container .btn-outline-dashed .img-thumbnail {
    aspect-ratio: 1 / 1;
    object-fit: cover;
    width: 100px;
}

.table.table-row-gray-300 tr {
  border-bottom-color: #e4e6ef;
}

.table-row-dashed tr {border-bottom-width: 1px; border-bottom-style: dashed !important; border-bottom-color: #eff2f5;}

.highlight {
  color:#3d6ef5;
}

.aba-img-small{position:absolute; right: 150px; bottom: 50px; max-width: 200px;}

.aba-serice-ul{ padding-left: 0px;}
.aba-serice-ul li{position: relative; padding:5px 0px;}
.aba-serice-ul li::before {
  font-family: "Font Awesome 6 Free"; /* or "Font Awesome 6 Pro" */
  content: "\f00c"; /* Unicode for fa-heart */
  font-weight: 900; /* 900 = solid, 400 = regular */
  color: #3d6ef5 !important;
  margin-right: 5px;
}

.aba-left-right {
  margin-bottom: 0px;
  padding-bottom: 0px;
}
.aba-left-right-bottom{padding-bottom: 0px !important;}

section.aba-center .slick-arrow {display: none !important;}
img.footer-ace {max-width: 60px;}

.fixed-right-appointment {
    position: fixed;
    right: -50px;
    top: 50%;
    z-index: 999999999;
    transform: rotate(-90deg);
    box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.3);
}

.slots-card-box {
    max-height: 300px;
    overflow-y: auto;
}


/* Page section spacing */
.secure {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

/* Cards (scoped to this page) */
.secure .card {
  background: var(--color-surface);
  border: 1px solid rgba(15, 23, 42, 0.08) !important;
  border-radius: 16px;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
}
.secure .card.bg-light {
  background: var(--color-surface) !important;
}

/* Headings in cards */
.secure .card h6 {
  color: var(--color-text);
  font-weight: 700;
  letter-spacing: 0.02em;
}

/* Form labels */
.secure .form-label {
  color: var(--color-text);
  font-weight: 600;
  margin-bottom: 0.5rem;
}

/* Selects and inputs (Stripe mounts inside a container, so we style the wrapper) */
.secure .form-select,
.secure .form-control {
  color: var(--color-text);
  background-color: var(--color-surface);
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 12px;
  padding: 0.75rem 0.875rem;
  min-height: 48px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.05s ease;
}
.secure .form-select:focus,
.secure .form-control:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.15);
  outline: none;
}

/* Stripe payment element container (cannot style inner iframe content) */
#ap-payment-element {
  background: var(--color-surface);
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 12px;
  padding: 0.75rem 0.875rem;
  min-height: 48px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
#ap-payment-element:focus-within {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.15);
}

/* Helper text and errors */
.small.text-muted,
#ap-payment-errors {
  font-size: 0.875rem;
}
#ap-payment-errors {
  color: #dc2626; /* Using a red tone for errors is acceptable; keep usage minimal */
}

/* Primary action button (scoped to this page via id) */
#ap-pay.btn {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--color-surface);
  font-weight: 700;
  border-radius: 12px;
  min-height: 48px;
  padding: 0.75rem 1rem;
  transition: transform 0.05s ease, box-shadow 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.22);
}
#ap-pay.btn:hover {
  background: #3d6ef5; /* Slightly darker of primary */
  border-color: #3d6ef5;
  transform: translateY(-1px);
  color:#fff;
  box-shadow: 0 10px 22px rgba(37, 99, 235, 0.28);
}
#ap-pay.btn:active {
  transform: translateY(0);
  box-shadow: 0 6px 14px rgba(37, 99, 235, 0.22);
}
#ap-pay.btn:disabled,
#ap-pay.btn[disabled] {
  opacity: 0.6;
  cursor: not-allowed;
  box-shadow: none;
}

/* Slots container */
.slots-card-box {
  margin-top: 0.25rem;
}

/* Slot items: robust selectors to handle different renderers (buttons, links, divs) */
#ap_slots > div,
#ap_slots .slot,
#ap_slots .slot-item,
#ap_slots button,
#ap_slots a {
  /* layout reset for children of .row */
}

#ap_slots .slot,
#ap_slots .slot-item,
#ap_slots button,
#ap_slots a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  background: var(--color-surface);
  color: var(--color-text);
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 12px;
  padding: 0.75rem 0.875rem;
  min-height: 44px;
  text-decoration: none;
  cursor: pointer;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.05s ease, color 0.2s ease, background-color 0.2s ease;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05);
}

/* Hover and focus for slots */
#ap_slots .slot:hover,
#ap_slots .slot-item:hover,
#ap_slots button:hover,
#ap_slots a:hover {
  border-color: var(--color-primary);
  box-shadow: 0 6px 16px rgba(37, 99, 235, 0.12);
  transform: translateY(-1px);
}
#ap_slots .slot:focus,
#ap_slots .slot-item:focus,
#ap_slots button:focus,
#ap_slots a:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.15);
}

/* Active/selected state for slots (JS can toggle .active or .selected) */
#ap_slots .slot.active,
#ap_slots .slot.selected,
#ap_slots .slot-item.active,
#ap_slots .slot-item.selected,
#ap_slots button.active,
#ap_slots button[aria-pressed="true"],
#ap_slots a.active {
  background: rgba(6, 182, 212, 0.08); /* accent tint */
  border-color: var(--color-accent);
  color: var(--color-text);
  box-shadow: 0 6px 16px rgba(6, 182, 212, 0.18);
}

/* Disabled/unavailable slot state */
#ap_slots .slot.disabled,
#ap_slots .slot[disabled],
#ap_slots .slot-item.disabled,
#ap_slots .slot-item[disabled],
#ap_slots button.disabled,
#ap_slots button[disabled],
#ap_slots a.disabled {
  opacity: 0.55;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}

/* Accent badges or time pills inside slot */
#ap_slots .pill,
#ap_slots .time {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(6, 182, 212, 0.12); /* accent tint */
  color: var(--color-text);
  font-size: 0.85rem;
  font-weight: 600;
}

/* Subtle link and muted text adjustments */
.text-muted {
  color: rgba(15, 23, 42, 0.65) !important;
}

/* Utility: uppercase styling refinement (if used) */
.uppercase {
  letter-spacing: 0.08em;
}

/* Service card */
  .service-figure {
    background: var(--color-surface);
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 16px;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
    overflow: hidden;
    transition: transform 0.08s ease, box-shadow 0.25s ease, border-color 0.2s ease;
  }
  .service-figure:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
    border-color: rgba(15, 23, 42, 0.12);
  }
  .service-figure:focus-within {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.15), 0 6px 18px rgba(15, 23, 42, 0.10);
  }

  /* Media with modern aspect ratio and cover */
  .service-media {
    position: relative;
    background: var(--color-bg);
    aspect-ratio: 16 / 9;
  }
  .service-media img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
  }

  /* Caption */
  .service-caption {
    padding: 1rem 1rem 1.25rem;
  }
  .service-title {
    color: var(--color-text);
    font-weight: 700;
    letter-spacing: 0.02em;
  }
  .service-desc {
    color: rgba(15, 23, 42, 0.70);
  }

  /* Optional accent pill (use inside caption if needed) */
  .service-pill {
    display: inline-flex;
    align-items: center;
    height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: rgba(6, 182, 212, 0.12);
    color: var(--color-text);
    font-size: 0.85rem;
    font-weight: 600;
  }

/* Responsive tweaks */
@media (max-width: 991.98px) {
  .secure .card {
    border-radius: 14px;
    box-shadow: 0 3px 12px rgba(15, 23, 42, 0.06);
  }
  #ap-pay.btn {
    width: 100%;
  }

   .service-figure { border-radius: 14px; }
}
/************** responsive start here **************/

@media screen and (min-width: 1600px) {
  
  .container {max-width: 1400px;}

}
@media (max-width: 1580px) {

  .lesson-quiz-section .lesson-title {font-size: 14px !important;}
}
  
@media (max-width: 1400px) {

  img.text-shape-banner{top: -30px;} 
  h1{font-size: 42px !important;}
  img.about-waves {left: -90px;}
  img.about-dots {left: -100px; max-width: 80px;}
  .aba-img-small {right: 80px;}

}


  @media (max-width: 1280px) {
    .rbt-40-hour div{transform: inherit !important;}
  }

    @media (max-width: 1199px) {
    
    .img-wrapper:hover .right{display: none;}
    a.navbar-brand {max-width: 150px;}
    .breadcrumb-custom {margin-top: 82px;}
    .shop-button .theme-btn.yellow-btn{margin-top: 10px !important;}
    img.dashboard-banner-img {margin-bottom: -400px;}
    section.about-grid.text-center {margin-top: 300px;}
    img.about-dots-right{display: none;}
    .fs-46 {font-size: 36px !important;}
    section.behavior-therapy {padding-top: 0px !important; margin-top: 0px !important;}
   
  }

@media (max-width: 991px) {

.navbar-side .dropdown-menu {display: none;}
.navbar-side .dropdown-menu.show {display: block;  }
.aos-init {transform: inherit !important;}
.main-nav nav.navbar ul.login-register {display: none !important;}
section.main-nav ul.navbar-nav .mob-login-register {display: block;}
.toggle-ul {display: block;}
.navbar-side {min-height: 100vh; width: 280px !important; font-size: 1.6rem; position: fixed; top: 0; right: 0; left: initial; padding: 0; list-style: none; background: linear-gradient(to top, #FFD335 0%, #FFD335 100%);
overflow-y: auto; z-index: 1000;  }
div#navbarSide .navbar-toggler {margin-top: 20px; margin-left: -20px; width: 100%; text-align: right;}
#close {outline: none !important; border: none;}
.fixed {position: fixed !important; top: 0; background: rgba(0, 0, 0, .7); width: 100%; z-index: 999999; height: auto !important;}
.fixed a.navbar-brand {max-width: 100px;}
.fixed a.navbar-brand img {max-height: 50px;}
.fixed .navbar {padding-top: 5px; padding-bottom: 5px;}
.navbar-side .social-head {position: absolute; bottom: 20px; left: 15px;}
.navbar-side-item {margin-bottom: .2rem; font-weight: 300;}
.navbar-side-item {padding: 1.3rem 0rem 1.3rem 0; font-size: 40px; font-weight: 400; text-align: left;}
.navbar-side-item {height: auto; padding-top: 0.5rem; line-height: 20px; padding-bottom: 0.5rem;}
.navbar-side-item a {display: inline-block;}
.side-link {padding-left: 1.7rem; padding-right: 1.2rem; color: #fff; transition: all 0.5s ease;}
.side-link:active,.side-link:hover {text-decoration: none; color: #000;}
.navbar-side {-webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); -webkit-transition: 400ms ease; transition: 400ms ease;}
.reveal {-webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); -webkit-transition: 400ms ease; transition: 400ms ease;}
.overlay {position: fixed; display: none; top: 0;  left: 0; right: 0; bottom: 0; cursor: pointer; background-color: #5f5f5f; opacity: .6; z-index: 990; min-height: 100vh;}
button#navbarSideButton {border: none; outline: none; transition: all 0.5s ease; width: 26px;}
button#navbarSideButton img {width: 100%; height: 20px; transition: all 0.5s ease;}
button#navbarSideButton:hover img {transform: scaleX(1.2);}
nav.navbar {padding-top: 10px; padding-bottom: 10px;  }
.scroller-right {position: fixed; width: 40px; height: 100vh; right: 0; top: 0; z-index: 999;}
.scroller-right a {font-size: 15px; height: 14.3vh; color: #3d6ef5; width: 100%; display: flex; align-items: center; justify-content: center;}
section.main-nav {position: absolute; width: 100%; z-index: 9999; transform: initial !important;}
div#navbarSide .navbar-toggler i { font-size: 36px; color: #fff;}
.banner-home .row .carousel-caption {padding-left: 15px; padding-right: 15px;}
.ready-to-start {margin-bottom: 30px !important;}
.single-best-seller {margin-bottom: 30px;}
.single-best-seller img {text-align: center; width: 100%;}
.about-sec h2 {text-align: left !important;}
.about-img-2{display: none;}
.about-img {margin-top: 30px;}
.about-sec {padding: 20px 0px 20px;}
.register-login-mob .dropdown .dropdown-toggle {font-size: 12px; width: 38px;  padding: 5px;  height: 32px;  background: #ffd335;  border: 1px solid #ffd335;  color: #000;}
.register-login-mob ul.dropdown-menu {right: 0px !important; left: inherit; padding: 10px;}
.register-login-mob ul.dropdown-menu li:last-child a {border-bottom: 0px;}
.register-login-mob ul.dropdown-menu li a {font-size: 14px; padding: 5px 0px; display: block; color: #fff; border-bottom: 1px solid #eee;}
.ctrl__button {width: 32px; line-height: 32px;}
.ctrl__counter {position: relative; width: 80px; height: 32px;}
.ctrl__counter-num{line-height: 32px;}
.ctrl__counter-input{line-height: 32px;}
section.main-nav .navbar-nav li.navbar-side-item a:focus, section.main-nav.fixed ul.navbar-nav li.navbar-side-item a.side-link:hover{color: #000;}
.fs-46 {font-size: 36px !important;}
.single-grid-abt {padding: 15px !important;}
.rbt-img-2 {left: 0px; }
.aba-left-right, .aba-left-right-bottom {padding: 40px 0px 40px;}
.aba-left-right-bottom .about-img {margin-top: 0px;}

}


@media (max-width: 767px) {

.course-sidebar{height: auto !important; min-height: inherit !important; max-height: inherit !important;}
.register-login-mob ul.dropdown-menu {right: 0px !important; left: inherit; padding: 10px;}
.banner-home .container {width: 100% !important; max-width: 100% !important;}
img.dashboard-banner-img {margin-bottom: -300px;}
section.about-grid.text-center {margin-top: 180px;}
h1 {font-size: 32px !important;}
img.text-shape-banner {top: 0;}
.banner-home .carousel-item .row {flex-direction: column-reverse;}
.sec-space {padding: 40px 0;}
.sec-space .banner-right-images {padding-top: 40px;}
h2 {font-size: 32px !important;}
h3 {font-size: 24px !important;}
h4 {font-size: 20px !important; line-height: 24px;}
.best-seller {margin-top: 40px !important;}
.best-seller img.dotted-icon{bottom: 0;}
.single-step {flex-wrap: wrap;}
.step-text {margin-left: 0px !important;}
span.step-count {margin: 0 auto; margin-bottom: 20px;}
.steps::before{display: none;}
.step-text::before {top: -16px; left: 0; right: 0; margin: 0 auto; transform: rotate(90deg);}
.ready-to-start {border-radius: 30px; margin-top: 40px; margin-bottom: -100px; padding: 30px 30px;}
footer .container {position: relative; z-index: 999;}
img.footer-curl {left: 10px; top: 40px;}
img.footer-book {top: 30px; right: 10px;}
.about-page-sec .about-img-1 img.about-img-1 {width: 100%; margin: 0 auto;}
.single-best-seller .bestseller-spacing {padding: 0px !important;}
section.product-detail {margin-top: 20px !important; }
h5 {font-size: 16px !important;}
.price-rating {font-size: 14px;}
.shop-button {flex-wrap: wrap; row-gap: 10px;}
a.navbar-brand {max-width: 150px;}
span.contact-icon {display: flex; max-width: 30px; justify-content: center; align-items: center; margin: 0 auto;}
ul.navbar-footer li{width: 100%; text-align: center; font-size: 14px; margin-bottom: 10px;}
.quiz-right svg.inline-block {max-width: 120px; width: 100%; text-align: center !important;}
.quiz-right .stats-results {margin-top: 0px !important;}
table.table.cart__table {min-width: 680px;}
.cart-sec .book-icon{display: none;}
.cart-sec .cart__collaterals-wrap {width: 100%; margin-left: 0px; margin-top: 30px;}
.cart-sec img.dotted-icon {display: none;}
button#cartdropdownMenu-mobile {padding: 5px !important;}
.shop-box-items .book-thumb {max-width: 100%; margin: 0 auto; aspect-ratio: 1 / 1; height: auto;}
.rbt-img-2 {left: -60px;}
div#content .accordion-button{flex-wrap: wrap !important;}
.aba-left-right-bottom {padding: 20px 0px 20px !important;}
.aba-left-right {padding: 20px 0px 20px !important;}
.main-nav nav.navbar a.navbar-brand img {max-width: 180px;}
.aba-img-small{display: none;}
img.aba-img-1 {width: 100%;}
}

@media (max-width: 667px) {

.banner-home {padding: 100px 0px 50px;}
h5 {font-size: 14px !important;}
.quiz-right svg.inline-block {max-width:100px;}
img.about-dots-right{display: none;}
img.book-icon{display: none;}
ul.footer-menu {flex-wrap: wrap; gap:10px !important;}
ul.footer-menu li{width: 100%;}
.home-form input { height: 40px; }
.home-form textarea {height: 100px !important;}
.fs-46{font-size: 26px !important;}
.fs-30{font-size: 20px !important;}
.fs-20{font-size: 16px !important;}
img.dashboard-banner-img {margin-bottom: -120px;}
section.about-grid.text-center {margin-top: 100px;}
section.best-seller {margin-top: 0px !important;}
.rbt-40-hour {padding: 50px 0px 100px;}
section.home-form {padding: 0px !important;}
footer {padding: 60px 0px 15px 0px;}
.rbt-img-2{left: 0;}
.aba-left-right-bottom {padding: 20px 0px 20px !important;}
.aba-left-right {padding: 20px 0px 20px !important;}
}

@media (max-width: 400px) {

.fs-46{font-size: 24px !important;}
.fs-30{font-size: 28px !important;}
.fs-20{font-size: 16px !important;}
.fs-16{font-size: 14px;}
body{font-size: 14px !important;}

}

.slot-clickable:hover {
  border: 1px solid #0d6efd !important;
}

.slot-clickable {
  cursor: pointer !important;
}