:root {
  --color-font: #808291;
  --color-primary: #3ed2a7;
  --color-secondary: #ffb09f;
  --color-link: #a7a9b8;
  --color-link-hover: #181b31;
  --color-gradient-start: #4fda91;
  --color-gradient-stop: #34dbc5;
  --color-img-holder: #efefef;
}

.truncate-2 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Chivo:wght@300;400;700;900&display=swap');
/* ===================================== Basic CSS ==================================== */


* {margin: 0px; padding: 0px; list-style: none;}
a {text-decoration: none; outline: none; color: #444;}
a:hover {color: #444;}
ul {margin-bottom: 0; padding-left: 0;}
a:hover,
a:focus,
input,
textarea { text-decoration: none; outline: none; border-radius: 0px;}
.center { text-align: center;}
.left {text-align: left;}
.right {text-align: right;}
.cp {cursor: pointer;}
html,
body {height: 100%;}
p {margin-bottom: 0px;}
.no-padding {padding: 0px;}
img {max-width: 100%;}
.no-margin {margin: 0px;}
.hid {display: none;}
.top-mar {margin-top: 15px;}
.h-100 {height: 100%;}
.mb-0{ margin-bottom: 0px;}
.mb-5{ margin-bottom: 5px;}
.mb-10{ margin-bottom: 10px;}
.mb-15{ margin-bottom: 15px;}
.mb-20{ margin-bottom: 20px;}
.mb-25{ margin-bottom: 25px;}
.mb-30{ margin-bottom: 30px;}
.mb-35{ margin-bottom: 35px;}
.mb-40{ margin-bottom: 40px;}
.mb-45{ margin-bottom: 45px;}
.mb-50{ margin-bottom: 50px;}
.mb-60{ margin-bottom: 60px;}
.mb-70{ margin-bottom: 70px;}
.mb-80{ margin-bottom: 80px;}
.mb-90{ margin-bottom: 90px;}
.mb-100{ margin-bottom: 100px;}

.mt-0{ margin-top: 0px;}
.mt-5{ margin-top: 5px;}
.mt-10{ margin-top: 10px;}
.mt-15{ margin-top: 15px;}
.mt-20{ margin-top: 20px;}
.mt-25{ margin-top: 25px;}
.mt-30{ margin-top: 30px;}
.mt-35{ margin-top: 35px;}
.mt-40{ margin-top: 40px;}
.mt-45{ margin-top: 45px;}
.mt-50{ margin-top: 50px;}
.mt-60{ margin-top: 60px;}
.mt-70{ margin-top: 70px;}
.mt-80{ margin-top: 80px;}
.mt-90{ margin-top: 90px;}
.mt-100{ margin-top: 100px;}

.pb-0{ padding-bottom: 0px;}
.pb-5{ padding-bottom: 5px;}
.pb-10{ padding-bottom: 10px;}
.pb-15{ padding-bottom: 15px;}
.pb-20{ padding-bottom: 20px;}
.pb-25{ padding-bottom: 25px;}
.pb-30{ padding-bottom: 30px;}
.pb-35{ padding-bottom: 35px;}
.pb-40{ padding-bottom: 40px;}
.pb-45{ padding-bottom: 45px;}
.pb-50{ padding-bottom: 50px;}
.pb-60{ padding-bottom: 60px;}
.pb-70{ padding-bottom: 70px;}
.pb-80{ padding-bottom: 80px;}
.pb-90{ padding-bottom: 90px;}
.pb-100{ padding-bottom: 100px;}

.pt-0{ padding-top: 0px;}
.pt-5{ padding-top: 5px;}
.pt-10{ padding-top: 10px;}
.pt-15{ padding-top: 15px;}
.pt-20{ padding-top: 20px;}
.pt-25{ padding-top: 25px;}
.pt-30{ padding-top: 30px;}
.pt-35{ padding-top: 35px;}
.pt-40{ padding-top: 40px;}
.pt-45{ padding-top: 45px;}
.pt-50{ padding-top: 50px;}
.pt-60{ padding-top: 60px;}
.pt-70{ padding-top: 70px;}
.pt-80{ padding-top: 80px;}
.pt-90{ padding-top: 90px;}
.pt-100{ padding-top: 100px;}

::placeholder {color: #747f8a !important; font-size: 13px; opacity: 0.5 !important;}
.container-fluid {padding: 0px;}
h1,
h2,
h3,
h4,
h5,
h6 {font-family: 'Chivo', sans-serif;}
strong {font-family: 'Chivo', sans-serif;}
.overlay-dark{ position: relative;}
.overlay-dark::before,
.overlay-dark::before{content:""; position: absolute; left: 0; top: 0; width: 100%; height: 100%;  background:rgba(40, 167, 69, 0.9);}
.overlay1{ position: absolute; left: 0; top: 0; height: 100%; width: 100%;}
.overlay-black{ position: relative;}
.overlay-black::before,
.overlay-black::before {content:""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8);}
.overlay-white {position: relative;}
.overlay-white::before,
.overlay-white::before {content:""; position: absolute;left: 0; top: 0; width: 100%; height: 100%; background: rgb(255, 253, 253, 0.9);}
.overlay-light{ position: relative;}
.overlay-light::before,
.overlay-light::before{ content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%;  background:rgba(240, 241, 242, 0);}
.overlay1{ position: absolute; left: 0; top: 0; height: 100%; width: 100%;}

/* crystal hover effect  */

figure { margin:0; padding:0; background:transparent; overflow:hidden;}
figure:hover+span {bottom: -36px; opacity: 1;}
.crystal-hover figure {position: relative;}
.crystal-hover figure::before { position: absolute; top: 0; left: -75%; z-index: 2; display: block; content: ''; width: 50%; height: 100%; background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%); background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%); -webkit-transform: skewX(-25deg); transform: skewX(-25deg);}
.crystal-hover figure:hover::before { -webkit-animation: shine .75s; animation: shine .75s;}
@-webkit-keyframes shine {
	100% {
		left: 125%;
	}
}
@keyframes shine {
	100% {
		left: 125%;
	}
}

/***** crystal hover effect  ******/

/****** Pre Loader ******/
#loader-wrapper { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; }
#loader-wrapper .loader-section { position: fixed; top: -500%; width: 101%; height: 1000%;background: #fff; z-index: 1000; transform: translateX(0);}
#loader-wrapper .loader-section.section-left {left: -50%;}
#loader-wrapper .loader-section.section-right {right: -50%;}
@keyframes spin {
0% {
  transform: rotate(0deg);
}
100% {
  transform: rotate(360deg);
}
}
.loaded #loader-wrapper .loader-section.section-left {transform: translateX(-100%);}
.loaded #loader-wrapper .loader-section.section-right {transform: translateX(100%);}
.loaded .loading { opacity: 0; transition: all 0.4s3s ease-out;}
.loaded #loader-wrapper {visibility: hidden;}
.loading { z-index: 1001; display: inline-block; position: fixed; left: 50%; top: 50%; width: 70px; height: 70px; margin-top: -35px; margin-left: -35px;}
body {background-color: #f0f1f2 !important; font-family: 'Chivo', sans-serif; color: #6a6a6a;overflow-x: hidden;}
.session-title { padding: 30px; margin: 0px;}
.session-title h3 { width: 100%; text-align: center; font-family: 'Chivo', sans-serif; font-weight: 700; font-size: 35px; margin-bottom: 4px; color: #4e4e4e;}
.session-title p { max-width: 800px; text-align: center; float: none; margin: auto; font-weight: 400; font-size: 15px;}
.session-title span { float: right; font-style: italic;}
.inner-title { padding: 20px; padding-left: 0px; margin: 0px; margin-bottom: 10px; padding-bottom: 0px; border-bottom: 1px solid #ccccccc4; display: block; padding-right: 0px;}
.inner-title h2 { width: 100%; text-align: center; font-size: 1rem; font-weight: 600; text-align: left; border-bottom: 1px solid #863dd9; padding-bottom: 10px; margin-bottom: 0px; width: 300px;}
.inner-title p {width: 100%; text-align: center;}
.inner-title .btn { float: right;margin-top: -38px; font-weight: 600; font-size: 0.8rem; }
.page-nav {padding: 40px; text-align: center; padding-top: 160px;}
.page-nav ul { float: none; margin: auto;}
@media screen and (max-width: 576px) {.page-nav {padding-top: 186px;}}
@media screen and (max-width: 356px) {.page-nav {padding-top: 206px;}}
.page-nav h2 { font-size: 36px; width: 100%;color: #444;}
@media screen and (max-width: 600px) {.page-nav h2 {font-size: 26px;}}
.page-nav ul li { float: left;margin-right: 10px; margin-top: 10px; font-size: 16px;}
.page-nav ul li i { width: 30px;text-align: center;color: #444;}
.page-nav ul li a {color: #444;}
.collapse.show {display: block !important;}
.form-control:focus {box-shadow: none; border: 2px solid #0b4d70 !important;}
.form-control { background-color: #f8f8f8; margin-bottom: 20px; border-radius: 0px; font-size: 0.9rem;}
.form-control:focus { background-color: #fff;border-color: #ccc;}
.container {max-width: 1340px;}
@media screen and (max-width: 575px) {.container {padding: 10px 15px;}}
/* ===================================== Buttons CSS ==================================== */
.btn-success {background-color: #0b4d70; border-color: #0b4d70; transition: 0.5s; box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);border-radius: 4px;}
.btn-success:hover {background-color: transparent !important; color: #0b4d70; transform: translateY(-4px); border-color: #0b4d70 !important; box-shadow: none;border-radius: 4px;}
header .btn-options ul li .btn:hover{box-shadow: none;}
.btn-success:active { background-color: #0b4d70 !important; border-color: #0b4d70 !important;}
.btn-success:focus { background-color: #0b4d70 !important; border-color: #0b4d70 !important; box-shadow: none !important;}
.active {color: #0b4d70;}
/* ===================================== Header CSS ================================== */
.header-nav {padding: 5px 20px;}
header { background-color: #fff; box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);}
header .logo {padding: 13px 10px;}
header .logo img {width: 65px;}
header .logo i { padding: 10px; background-color: #0b4d70; color: #fff; margin-right: 10px; box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12); border-radius: 2px; float: right; margin-top: 10px;}
@media screen and (max-width: 402px) {header .logo i {margin-right: 0px;}}
header .logo .fa-search {margin-right: 20px;}
@media screen and (max-width: 402px) {header .logo .fa-search {margin-right: 10px;}}
@media screen and (max-width: 1153px) {header .btn-options {padding-left: 0px;}}
header .btn-options ul {margin-top: 7px;}
header .btn-options ul li {float: left;padding: 10px; padding-left: 2px;}
@media screen and (max-width: 1153px) {header .btn-options ul li {padding: 12px 4px;} header .btn-options ul li .btn {font-size: 0.8rem;}}
@media screen and (max-width: 991px) {header .btn-options ul li {padding: 10px;font-size: 0.9rem;}}
header .btn-options ul li .btn { font-weight: 600;box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);}
header .btn-options ul li .btn-default {background-color: #fff;}
header .search-row {padding-top: 6px;}
header .search-row .input-group-text {border-radius: 0px;background-color: #f8f8f8;}
header .search-row .input-group {margin-bottom: 0px !important;}
header .search-row input {border-radius: 0px;margin-bottom: 0px;height: 32px;}
@media screen and (max-width: 767px) {header .search-row input {border-right: 1px solid #ccc !important;}}
header .location i {color: #929292bd;font-size: 0.8rem;margin-top: 2px;}
header .location .input-group-text {border-right: 0px;padding: 10px;height: 32px;}
header .location input {border-left: 0px; padding-left: 5px; height: 32px;}
header .location input:focus {border: 1px solid #fff !important; background-color: #fff; border-left: 0px !important; border-right: 0px !important;}
@media screen and (max-width: 767px) {header .location {margin-bottom: 5px !important;}}
header .category input:focus {border: 1px solid #fff !important;background-color: #fff; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); border-right: 0px !important;}
header .category .fa-bars {position: absolute; right: 9px;top: 10px; font-size: 13px; color: #a0a0a0;}
@media screen and (max-width: 767px) {header .category {margin-bottom: 5px !important;}}
header .search input {border-right: 0px !important;}
header .search .input-group-text {background-color: #0b4d70;}
header .search .input-group-text i {font-size: 0.9rem;color: #fff;}
@media screen and (max-width: 991px) {header .searchcol {position: absolute; padding: 15px; padding-top: 10px; background-color: #fff; margin-top: 60px;} header .searchcol .search-row {margin: 0px;padding-top: 0px;}}
.location-drop-down {width: 500px; background-color: #fff; height: 350px; position: absolute; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); z-index: 99; margin-top: 7px; padding: 20px; display: none; }
.course-tags h3{font-size: 18px;margin-top: 20px;}
.course-tags{margin-top: 20px;}
.location-drop-down input {border-left: 1px solid #ccc !important;}
.location-drop-down input:focus {border: 1px solid #0b4d70 !important;}
.location-drop-down .fa-search {position: absolute;margin-top: -21px;right: 29px;font-size: 12px;}
.location-drop-down ul {margin-top: 20px;}
.location-drop-down ul li {float: left;width: 50%;padding: 3px;font-size: 0.85rem;}
.location-drop-down ul li i {margin-right: 5px;font-size: 15px;color: #444;}
.location-group {box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);}
.location-group .input-group-text {background-color: #fff !important;border: 1px solid #fff !important;}
.location-group input {background-color: #fff !important;border: 1px solid #fff !important;}
.location-group input:focus {background-color: #fff !important;}
.location-group::after { content: ""; position: absolute; left: 0px; top: 23px; width: 100%; height: 35px; background: #ffffff; z-index: 999; }
header .location .location-drop-down input {border-left: 1px solid #ccc !important;}
header .location .location-drop-down input:focus {border: 1px solid #0b4d70 !important;}
.cat-drop-down{ width: 270px; background-color: #fff; display: none; position: absolute; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); z-index: 99; margin-top: 7px; padding-top: 20px; }
.cat-drop-down input {border-left: 1px solid #ccc !important;}
.cat-drop-down input:focus {border: 1px solid #0b4d70 !important;}
.cat-drop-down ul li { padding: 8px 15px; font-size: 0.85rem; font-weight: 500; border-bottom: 1px solid #cccccc4d; }
.cat-drop-down ul li i { width: 20px; text-align: center; margin-right: 10px; }
.cat-drop-down ul li .fa-chevron-right { float: right; margin-right: 0px; width: auto; padding-top: 5px; display: none; color: #909090; }
.location-drop-down ul li a svg {display: none;}
.drop-catgory li a svg {margin-left: 2px;}
.cat-drop-down ul li:hover{ background-color: #0b4d70; color: #fff;}
.cat-drop-down ul li:hover a {color: #fff !important;}
.cat-drop-down ul li:hover .fa-chevron-right {color: #fff !important;}
.search-cat input { border: 1px solid #fff !important; background-color: #fff; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); border-right: 0px !important; }
.search-cat::after {content: "";position: absolute;left: 0px;top: 23px;width: 100%;height: 35px;background: #ffffff;z-index: 999;}
.login-options {text-align: right;padding-top: 12px;padding-right: 30px;}
.login-options img { width: 40px; margin-right: 3px; box-shadow: 0 2px 6px 0 rgba(218, 218, 253, 0.65), 0 2px 6px 0 rgba(206, 206, 238, 0.54); border-radius: 50px; background-color: #fff; padding: 2px; }
.login-options .dropdown-menu {width: 200px;border-radius: 0px;box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);border: 0px;margin-top: 15px;}
.login-options .dropdown-menu .dropdown-item {padding-left: 13px;}
.login-options .dropdown-menu .dropdown-item i { width: 20px;text-align: left;}
.login-options .dropdown-toggle {display: flex;margin: auto;float: right;}
.login-options .dropdown-toggle span { padding-top: 9px;margin-left: 5px;}
.login-options .dropdown-toggle::after {margin-top: 18px;}
@media screen and (max-width: 525px) {.login-options .dropdown-toggle::after {display: none;}}
.header-top {background-color: #fafafa;padding: 6px 20px;box-shadow: 0 0 0 0px rgb(0 0 0 / 15%), 0 1px 3px rgb(0 0 0 / 15%);}
.header-top .contact-lk ul li {float: left;padding: 10px;font-size: 15px;font-weight: 700;display: flex;align-items: center;}
.header-top .contact-lk ul li svg {font-size: 0.9rem;margin-right: 8px;}
.header-top .social-lk ul li {font-size: 0.9rem;float: left;padding: 10px;}
.header-2 { position: absolute;z-index: 999;}
.header-2 .scroll-to-fixed-fixed {background-color: #fff;box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);}
.nav-lik {float: right;}
.nav-lik li {float: left;padding: 23px;font-weight: 600;font-size: 0.95rem;}
.nav-lik li .main-aro {margin-left: 5px;padding-top: 3px;}
.nav-lik li:hover .inner-menu {display: block;}
.nav-lik li .inner-menu { position: absolute; display: none; background-color: #fff; margin-top: 15px; min-width: 200px; margin-left: -20px; box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04); }
.nav-lik li .inner-menu ul li { float: none; padding: 12px 20px; border-bottom: 1px solid #cccccc94; font-size: 0.9rem; }
.nav-lik li .inner-menu ul li .aro-right { float: right; padding-top: 4px;}
.nav-lik li .inner-menu ul li:hover .child-menu {display: block;}
.nav-lik li .inner-menu ul li .child-menu { position: absolute; display: none; left: 190px; margin-top: -30px; background-color: #fff; box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04); min-width: 200px; }
/* ===================================== Slider CSS ================================== */
.slider-home {background-image: url("/assets/images/bg-blue.jpg");height: 520px;overflow: hidden;background-size: 100%;}
@media screen and (max-width: 1026px) {.slider-home { height: 430px;}.slider-home h2 {margin-top: 50px !important;}}
@media screen and (max-width: 402px) {.slider-home {height: 600px;} .slider-home h2 {margin-top: 30px !important;}}
@media screen and (max-width: 649px) {.slider-home {height: 550px;}}
@media screen and (max-width: 991px) {.slider-home .slide-cont {text-align: center;}}
.slider-home .slide-cont h2 {margin-top: 90px;font-weight: 700;font-size: 3rem;color: #fff;margin-bottom: 30px;line-height: 65px;}
@media screen and (max-width: 548px) {.slider-home .slide-cont h2 { font-size: 2rem;}}
.slider-home .slide-cont p {font-size: 1rem;margin-bottom: 10px;font-weight: 600;color: #fff;font-size: 1rem;}
.slider-home .slide-cont p a {color: #fff;margin-right: 10px;font-size: 0.96rem;}
.slider-home .fre {margin-top: 50px;}
@media screen and (max-width: 991px) {.slider-home .fre {display: block;text-align: center;}}
.slider-home .fre .btn {font-size: 1rem;font-weight: 700;padding: 10px 30px;box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);}
@media screen and (max-width: 392px) {.slider-home .fre .btn {padding: 10px 12px;}}
.slider-home .fre .btn-light {margin-left: 25px;}
@media screen and (max-width: 392px) {.slider-home .fre .btn-light {margin-left: 10px;}}
.slider-home .image-part {padding: 0px;}
.slider-home .image-part img {margin-top: 33px;}
@media screen and (max-width: 1132px) {.slider-home .image-part img {margin-top: 50px;}}
@media screen and (max-width: 1098px) {.slider-home .image-part img {margin-top: 80px;}}
@media screen and (max-width: 1026px) {.slider-home .image-part img {margin-top: 120px;margin-top: 20px;}}
/* ===================================== Slider_2 CSS ================================== */
.slider-home-2 {background-image: url(assets/images/banner/slider-4.jpg);padding-top: 130px;background-repeat: no-repeat;background-size: cover;background-position: center center;}
.slider-home-2 .carousel-caption {bottom: 215px;left: 6%;right: 8%;}
.slider-home-2 .text-slid {text-align: left;}
.slider-home-2 .text-slid h2 {font-weight: 700;font-size: 2.5rem;color: #fff;margin-bottom: 30px;}
.slider-home-2 .text-slid h2 span {color: #fff;}
.slider-home-2 .text-slid p {font-size: 1rem;color: #fff;font-weight: 400;}
.slider-home-2 .btn-row {display: block;text-align: left;margin-top: 30px;margin-left: 0;}
.slider-home-2 .btn-row .btn {box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),0 1px 5px 0 rgba(0, 0, 0, 0.12);border-radius: 2px;padding-right: 15px;padding-left: 15px;font-weight: 600;}
.slider-home-2 .btn-row .btn-light {background-color: #fff;margin-left: 8px;}
.slider-home-2 .carousel-control-prev { width: 10%; opacity: 0.9;}
.slider-home-2 .carousel-control-next { width: 10%;opacity: 0.9;}
.slider-home-2 .prev {background-color: #0b4d70;color: #fff;box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);padding: 10px;width: 45px;height: 45px;padding-top: 11px;}
.slider-home-2 .carousel-control-next-icon {background-color: #0b4d70;color: #fff;box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);padding: 5px;width: 29px;height: 40px;}
/* ===================================== Slider-search CSS ================================== */
.slider-home-search {background-image: url(/assets/images/slider/slid_1.jpg);background-size: 100;padding: 100px;padding-top: 180px;padding-bottom: 120px;text-align: center;}
@media screen and (max-width: 767px) {.slider-home-search {padding-top: 160px;padding-bottom: 100px;}}
.slider-home-search .slider-title h2 {font-weight: 700;width: 100%;text-align: center;margin-bottom: 10px;font-size: 2.5rem;}
.slider-home-search .slider-title p {margin-bottom: 40px;}
.slider-home-search .search-box-card {width: 100%;background-color: #fff;padding: 20px;box-shadow: 3px 3px 10px 1px rgba(0, 0, 0, 0.14);border-radius: 5px;}
.slider-home-search .search-box-card .form-control {margin-bottom: 0px !important;}
.slider-home-search .search-box-card .input-group {margin-bottom: 0px !important;}
.slider-home-search .search-box-card .input-group-text {background-color: #0b4d70;color: #fff;font-weight: 600;}
.slider-home-search .search-box-card .input-group-text i {font-size: 0.9rem;margin-right: 5px;}
/* ===================================== post_card_1 CSS ================================== */
.post-card_1 {box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);background-color: #fff;border-radius: 4px;margin-bottom: 30px;transition: 0.4s;}
.post-card_1:hover {transform: translate(-4px,-10px) rotate(1deg);transition: 0.4s;}
#popular .post-card_1:hover {transform:none !important;transition: 0.4s;}
.post-card_1 .user-avt {width: 50px;border-radius: 50px;background-color: #fff;padding: 3px;border: 1px solid #cccccc85;margin-left: 15px;margin-top: -25px;}
.post-card_1 .badge {float: right;margin-right: 10px;margin-top: -35px;position: relative;padding: 8px 17px;}
.post-card_1 .post-detail {padding: 15px 10px;}
.post-card_1 .post-detail h2 {font-weight: 200;font-size: 16px;margin-bottom: 4px;}
.post-card_1 .post-detail h4 {font-size: 1rem;font-weight: 600;margin-bottom: 4px;}
.post-card_1 .post-detail ul {margin-top: 8px;}
.post-card_1 .post-detail ul li {font-size: 0.9rem;font-weight: 600;padding: 2px;}
.post-card_1 .post-detail ul li i {margin-right: 5px;font-size: 0.9rem;}
.post-card_1 .post-detail ul li a,product-detail ul li a {color: #00bcd2;font-weight: 600;}
.post-card_1 .foot-ro {padding: 5px 10px;border-top: 1px solid #cccccc85;}
.post-card_1 .foot-ro a {font-size: 0.9rem;}
.post-card_1 .foot-ro a svg {margin-right: 5px;}
.post-card_1 .foot-ro a .fa-map-marker-alt {color: #0b4d70;}
.post-card_1 .foot-ro .heart {float: right;padding-top: 5px;}
.post-card_1 .foot-ro .heart:hover {color: #ff6258;}
.post-card_1 .foot-ro .actheart {color: #f71e4b;}
.post-card_1:hover {box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);border: 0px;}
/* ===================================== post_card_2 CSS ================================== */
.product-2-card {background-color: #fff;margin-bottom: 30px;}
.product-2-card .product-detail {padding: 20px 15px;}
.product-2-card .product-detail .span {font-size: 0.8rem;}
.product-2-card .product-detail .span i {color: #009cff;margin-right: 3px;}
.product-2-card .product-detail h4 {margin-top: 10px;font-size: 0.96rem;font-weight: 700;line-height: 21px;}
.product-2-card .product-detail h2 {font-size: 0.9rem;font-weight: 600;color: #0b4d70;margin-top: 10px;}
.product-2-card .product-detail .heart {float: right;margin-top: -20px;cursor: pointer;}
.product-2-card .product-detail .actheart {color: #f71e4b;}
.product-2-card:hover {box-shadow: 3px 3px 10px 1px rgba(0, 0, 0, 0.14);transition: all 300ms ease-in-out;}
/* ===================================== footer CSS ================================== */
footer {background-color:#32393f;padding-top: 80px;}
.section-padding.desk-row.grey-bg.books-category-holder{padding-bottom: 0;}
footer .footer-top {border-bottom: 1px solid #cccccc38;}
footer .footer-top .cvb {border-right: 1px solid #cccccc38;}
footer .footer-top .footer-card {display: flex;padding: 30px 0px;}
footer .footer-top .footer-card .iconp {padding: 15px;}
footer .footer-top .footer-card .iconp i {font-size: 1.5rem;}
.disc-list {list-style: disc !important;}
footer .footer-top .footer-card .icdetail {margin: auto 0;padding-left: 10px;}
footer .footer-top .footer-card .icdetail h2 {font-size: 1rem;font-weight: 700;margin-bottom: 10px;}
footer .footer-top .footer-card .icdetail p {font-size: 0.85rem;font-weight: 500;}
footer .br-o {border-right: 0px !important;}
.aligner-column {display: flex;flex-direction: column;justify-content: center;}
footer .footer-bottom .cvb {border-right: 1px solid #cccccc38;padding-top: 30px;padding-bottom: 30px;}
footer .footer-bottom .fabh {font-size: 0.97rem;font-weight: 700;margin-bottom: 20px;}
footer .footer-bottom .loca-ro {display: flex;margin-bottom: 15px;}
footer .footer-bottom .loca-ro .icon {padding: 10px;}
footer .footer-bottom .loca-ro .icon i {font-size: 0.9rem;}
footer .footer-bottom .loca-ro .detail {padding-left: 10px;font-size: 0.85rem;}
footer .footer-bottom .topc li {font-size: 0.85rem;padding: 4px;}
footer .footer-bottom .topc li svg {margin-right: 4px;font-size: 0.7rem;}
footer .footer-bottom .soc-link {margin-top: -7px;}
footer .footer-bottom .soc-link li {float: left;margin-right: 13px;}
footer .footer-bottom .soc-link li:last-child {margin-right: 0 !important;}
footer .footer-bottom .sdfg {margin-top: 20px;font-size: 0.85rem;}
footer .subcrib input {border-radius: 0px;background-color: #fff;}
footer .subcrib .input-group-append {border-radius: 0px;}
footer .subcrib .input-group-text {border-radius: 0px;background-color: #0b4d70;}
footer .subcrib .input-group-text svg {color: #fff;}
footer .subcrib .input-group {box-shadow: 0 2px 6px 0 rgba(218, 218, 253, 0.65),0 2px 6px 0 rgba(206, 206, 238, 0.54);}
.copy {background-color: #32393f;}
.copy .copy-row {padding: 20px;border-top: 1px solid #cccccc38;}
.copy .copy-row p {text-align: center;font-size: 0.85rem;color: #fff;}
.copy .copy-row p a {color: #fff;font-weight: 600;}

/* ===================================== navigation CSS ================================== */
.nav-container {padding: 50px;background-image: url("/assets/images/nav-bg.jpg");background-size: 100%;background-repeat: no-repeat;background-color: #e9e9e9;padding-top: 30px;padding-bottom: 30px;}
@media screen and (max-width: 940px) {.nav-container {padding: 30px 10px;}}
.nav-container .path li {float: left;padding: 5px 15px;font-weight: 600;font-size: 0.9rem;}
.nav-container .path li svg {font-size: 13px;margin-left: 10px;padding-top: 2px;}
.nav-container .title-row h2 {padding: 10px;font-weight: 700;font-size: 1.6rem;margin-bottom: 3px;}
.nav-container .title-row p {margin-top: -10px;padding-left: 10px;font-size: 0.9rem;font-weight: 400;}
.nav-container .list-tile p {padding: 10px 0px;}
/* ===================================== pagination CSS ================================== */
.pagination-list {margin-bottom: 30px;background-color: #fff;box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);}
.pagination-list .prn {padding: 10px 17px;}
.pagination-list .prn svg {color: #ccc;}
.pagination-list .prn:hover {background-color: #0b4d70;color: #fff;}
.pagination-list .prn:hover a {color: #fff;}
.pagination-list .bgnj {text-align: right;}
.pagination-list .pag-nav {border-left: 1px solid #cccccc6e;border-right: 1px solid #cccccc6e;flex: 1;}
.pagination-list .pag-nav p {text-align: center;margin: auto;padding: 10px 0px;}
.pagination-list .pag-nav p a {margin-left: -5px;padding: 0px 10px;border-right: 1px solid #ccc;border: 1px solid #fff;}
.pagination-list .pag-nav p a:last-child {border-right: 0px;}
.pagination-list .pag-nav p a:hover {background-color: #0b4d70;color: #fff;border-radius: 2px;}
.pagination-list .pag-nav p a:hover a {color: #fff;}
.pagination-list .pag-nav p .act {background-color: #0b4d70;color: #fff;border-right: 0px;border-radius: 2px;}
.pagination-list .pag-nav p .act a {color: #fff;}
/* ===================================== post_list CSS ================================== */
.listing-list {box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);background-color: #fff;margin-bottom: 20px;}
.listing-list .image {padding: 0px;}
.listing-list .detail {padding: 20px;}
.listing-list .detail h2 {font-weight: 600;font-size: 1.1rem;line-height: 28px;}
.listing-list .detail strong {font-weight: 800;}
.listing-list .detail .catmnu {float: right;margin-top: -3px;}
.listing-list .detail .catmnu li {float: left;padding: 3px 7px;font-weight: 500;font-size: 0.85rem;}
.listing-list .detail .catmnu li svg {font-size: 0.9rem;margin-left: 7px;}
.listing-list .detail .icons {text-align: right;}
.listing-list .detail .icons .heart {margin-left: 10px;}
.listing-list .detail .icons .actheart {color: #f71e4b !important;}
.listing-list .detail .icons .iki {width: 35px;height: 35px;background-color: #fff;box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),0 1px 5px 0 rgba(0, 0, 0, 0.12);border-radius: 2px;border-radius: 50px;padding: 11px;padding-right: 14px;font-size: 14px;color: #777575;}
.listing-list .detail .icons p {margin-top: 30px;font-size: 0.8rem;}
.listing-list .detail .icons p svg {margin-right: 3px;}
.listing-list .detail .detail-bottom {padding-top: 15px;margin-top: 10px;border-top: 1px solid #cccccca6;}
.listin-list-cont {margin-top: 10px;}
/* ===================================== Top Category CSS ================================== */
.catogery-top {background-color: #fff;width: 100%;overflow: hidden;}
.catogery-top .cat-detail {display: flex;padding: 10px;border-right: 1px solid #ccc;border-bottom: 1px solid #ccc;min-height: 92px;}
.catogery-top .cat-detail .detail {margin: auto 0px;}
.catogery-top .cat-detail .detail h4 {font-size: 1rem;font-weight: 700;color: #444;margin-bottom: 0px;padding-top: 5px;}
.catogery-top .cat-detail .detail span {font-size: 0.8rem;}
.catogery-top .cat-detail .icon {padding: 5px;margin-right: 5px;}
.catogery-top .cat-detail .icon img {width: 50px;padding: 10px;}
.catogery-top .owl-theme .owl-controls {display: none !important;}

/* ===================================== Best Platform CSS ================================== */
.best-platform {padding: 50px;background-color: #fff;background-position: center;background-size: cover;background-repeat: no-repeat;}
@media screen and (max-width: 940px) {.best-platform {padding: 30px 10px;}
}
.best-platform .df-image {text-align: right;}
@media screen and (max-width: 767px) {
  .best-platform .df-image {
    text-align: center;
  }
}
.best-platform .df-detail {text-align: left;padding-right: 100px;padding-top: 40px;}
@media screen and (max-width: 1296px) {
  .best-platform .df-detail {
    padding-right: 0px;
  }
}
.best-platform .df-detail h2 {font-size: 2.6rem;margin-bottom: 20px;}
.best-platform .df-detail p {font-size: 0.95rem;}
.best-platform .df-detail .btn-row {margin-top: 20px;}
.best-platform .df-detail .btn-row .btn {margin-right: 8px;font-weight: 700;}
@media screen and (max-width: 968px) {
  .best-platform .df-detail {
    padding-top: 0px;
  }
  .best-platform .df-detail h2 {
    font-size: 2rem;
  }
}
@media screen and (max-width: 767px) {
  .best-platform .df-detail {
    text-align: center;
  }
}

.features {padding: 50px;background-color: #fff;}
@media screen and (max-width: 940px) {
  .features {
    padding: 30px 10px;
  }
}
.features .ker-featur-row {margin-top: 20px;}
.features .featurecol .single-feature {margin-bottom: 35px;display: flex;}
.features .featurecol .single-feature .icon {margin: auto;}
.features .featurecol .single-feature .icon svg {width: 60px;height: 60px;background-color: red;text-align: center;color: #fff;padding: 15px;border: 4px solid #fff;box-shadow: 0 1px 15px 1px rgba(69, 65, 78, 0.1);border-radius: 50px;}
.features .featurecol .single-feature .detail {
  text-align: left;
  padding-left: 20px;
}
@media screen and (max-width: 977px) {
  .features .featurecol .single-feature .detail {
    flex: 1;
  }
}
.features .featurecol .single-feature .detail p {font-size: 0.9rem; line-height: 19px; font-weight: 400; }
.features .featurecol .single-feature .detail h6 {font-weight: 700; font-size: 1.1rem; }
.features .featurecol .single-feature svg {font-size: 1.5rem; }
.features .featurecol .single-feature h6 {margin-top: 5px; margin-bottom: 5px; font-weight: 400; font-size: 1.2rem; }
.features .featurecol .single-feature p {font-weight: 300;font-size: 1rem;color: #000;}
.features .feature-right .single-feature .detail {text-align: right;padding-right: 20px;}
.features .featur-image {padding-top: 15px;text-align: center;}
.features .featur-image img {margin-top: -150px;}
@media screen and (max-width: 977px) {
  .features .featur-image img {
    margin-top: 0px;
  }
}
.features .c2 {background-color: #37b0ff !important;}
.features .c3 {background-color: #ffd515 !important;}
.features .c4 {background-color: #02dce5 !important;}
.features .c5 {background-color: #42e017 !important;}
.features .c6 {background-color: #6144ff !important;}

/* ===================================== All Category CSS ================================== */
.catogery {padding: 70px 50px;}
@media screen and (max-width: 940px) {
  .catogery {
    padding: 30px 10px;
  }
}
.catogery .ro-catogery {margin-top: 30px;}
.catogery .ro-catogery .cat-card {background-color: #fff;padding: 25px 8px;text-align: center;box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);margin-bottom: 30px;min-height: 165px;}
.catogery .ro-catogery .cat-card img {margin-bottom: 10px;}
.catogery .ro-catogery .cat-card h4 {font-weight: 700;font-size: 1rem;margin-bottom: 3px;}
.catogery .ro-catogery .cat-card span {font-size: 0.85rem;}
.catogery .ro-catogery .cat-card:hover .over-lay {display: block;}
.catogery-top #owl-demo .owl-wrapper-outer .owl-wrapper .owl-item {width: 370px !important;}
.catogery .ro-catogery .cat-card .over-lay {background-color: rgba(255, 255, 255, 0.95);width: 85%;height: 84%;top: 0px;position: absolute;margin-left: -4%;display: none;padding-top: 40px;}
.catogery .ro-catogery .cat-card .over-lay p {margin-bottom: 5px;}
.catogery .ro-catogery .cat-card .over-lay .btn {font-weight: 700;font-size: 0.8rem;padding-bottom: 2px;box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);}
.catogery .view-all {text-align: center;}
.catogery .view-all p {font-size: 0.9rem;font-weight: 600;}
.catogery .view-all p a {color: #0b4d70;font-weight: 700;font-size: 0.85rem;padding-left: 5px;}
.catogery .view-all p a:hover {text-decoration: underline;}

/* ===================================== Featured Post CSS ================================== */
.featured {padding: 50px;background-color: #ffffffa8;padding-bottom: 100px;}
@media screen and (max-width: 940px) {
  .featured {
    padding: 30px 10px;
  }
}
.featured .featir-ro {margin-top: 30px;}

/* ===================================== Best Deals CSS ================================== */
.best-deals {background-image: url(/assets/images/bbg.jpg);background-size: 100%;background-position: bottom;background-repeat: no-repeat;background-color: #25b95b;}
.best-deals .bs-detail {padding-top: 50px;}
.best-deals .bs-detail h2 {color: #fff;font-weight: 700;}
.best-deals .bs-detail p {color: #fff;font-size: 0.9rem;text-indent: 20px;font-weight: 600;}
.best-deals .bs-image {text-align: center;}
.best-deals .bs-image img {margin-top: -100px;}
.best-deals .info-row {margin-top: 40px;}
.best-deals .info-row svg {color: #fff;font-size: 2.5rem;}
.best-deals .info-row h5 {color: #fff;margin-top: 30px;font-weight: 700;font-size: 1.1rem;}
.best-deals .info-row .infleft {border-right: 1px solid #fff;text-align: center;}
.carousel-caption .slideInLeft.text-slid {display: flex;flex-direction: column;justify-content: center;}
.banner-slider-images img {margin-left: 35%;}
.best-deals .info-row .infright {padding-left: 25px;text-align: center;}
.more-information {background-image: url(../images/why-choose/choose-bg.jpg);background-attachment: fixed;background-position:center;background-repeat: no-repeat;background-size: cover;}
.more-information .more-layy{background-color: rgba(40, 167, 69, 0.8);text-align: center;color: #fff;padding: 50px;padding-top: 80px;padding-bottom: 80px;}
@media screen and (max-width: 940px) {
  .more-information .more-layy {
    padding: 30px 10px;
  }
}
.more-information .more-layy .info-det h2 {font-size: 2rem;font-weight: 700;margin-bottom: 20px;}
.more-information .more-layy .info-det p {font-weight: 600;font-size: 1rem;}
.more-information .more-layy .info-row {margin-top: 60px;}
.more-information .more-layy .info-row .infright {display: flex;}
.more-information .more-layy .info-row .infright .icon {padding: 0 20px;}
.more-information .more-layy .info-row .infright .icon svg {font-size: 47px;}
.more-information .more-layy .info-row .infright .detail {text-align: left;}
.more-information .more-layy .info-row .infright .detail h5 {font-weight: 700;font-size: 1.5rem;}
.more-information .more-layy .info-row .infright .detail p {font-size: 0.9rem;font-weight: 700;}

/* ===================================== Latest Post CSS ================================== */
.latest-products {padding: 70px 50px 20px 50px;}

@media screen and (max-width: 940px) {
  .latest-products {padding: 30px 10px; }
}
.latest-products .latestp-row {margin-top: 30px;}
/* ===================================== Testimonial CSS ================================== */
.testimonial-cont {background-color: #f0f1f2;padding: 0px 0px;}
@media screen and (max-width: 940px) {
  .testimonial-cont {padding: 30px 10px;}
}
.testimonial-cont .owl-carousel {margin-top: 30px;overflow: hidden;}
.testimonial {margin: 0 20px 40px;}
.testimonial .owl-carousel {margin-top: 20px;}
#testimonial-slider2 .testimonial {margin: 0 50px 40px !important;}
.testimonial .testimonial-content {padding: 35px 25px 35px 50px;margin-bottom: 35px;background: #fff;border: 1px solid #f0f0f0;position: relative;}
.testimonial .testimonial-content:after {content: "";display: inline-block;width: 20px;height: 20px;background: #fff;position: absolute;bottom: -10px;left: 22px;transform: rotate(45deg);}
.testimonial-content .testimonial-icon {width: 50px;height: 45px;background: #0b4d70;text-align: center;font-size: 22px;color: #fff;line-height: 42px;position: absolute;top: 37px;left: -19px;}
.testimonial-content .testimonial-icon:before {content: "";border-bottom: 16px solid #0b4d70;border-left: 18px solid transparent;position: absolute;top: -16px;left: 1px;}
.testimonial .description {font-size: 15px;font-style: italic;color: #8a8a8a;line-height: 23px;margin: 0;}
.testimonial .title {display: block;font-size: 18px;font-weight: 700;color: #525252;text-transform: capitalize;letter-spacing: 1px;margin: 0 0 5px 0;}
.testimonial .post {display: block;font-size: 14px;color: #0b4d70;}
.owl-theme .owl-controls {margin-top: 20px;}
.owl-theme .owl-controls .owl-page span {background: #ccc;opacity: 1;transition: all 0.4s ease 0s;}
.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span {background: #0b4d70;}
.test-avta {display: flex;}
.test-avta .user-imag {padding-right: 10px;}
.test-avta .user-imag img {width: 55px !important;border-radius: 50px;border: 3px solid #fff;box-shadow: 0 2px 6px 0 rgba(218, 218, 253, 0.65),
    0 2px 6px 0 rgba(206, 206, 238, 0.54);}
.test-avta .detail {padding-left: 5px;margin: auto 0px;}
.test-avta .detail h3 {margin-bottom: 1px;}
/* ===================================== mobile_app CSS ================================== */
.mobile-app {background-image: url(/assets/images/app_bg.jpg);padding: 50px;background-size: 100%;padding-top: 50px;padding-bottom: 110px;}
@media screen and (max-width: 940px) {
  .mobile-app {padding: 30px 10px;}
}
.mobile-app .app-content {color: #fff;text-align: center;}
.mobile-app .app-content h2 {margin-bottom: 30px;}
.mobile-app .app-content p {margin-bottom: 40px;}
.mobile-app .app-content .btn-ro {margin-top: 20px;}
.mobile-app .app-content .btn-ro .btn {background-color: #fff;border-radius: 0px;box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);margin-bottom: 30px;margin-right: 15px;padding: 10px 30px;font-weight: 600;}
.mobile-app .app-content .btn-ro .btn svg {margin-right: 3px;color: #14a933;font-size: 1rem;}
.ad-slot {text-align: center;margin-bottom: 15px !important;}
/* ===================================== search_any CSS ================================== */
.search-any-thing {padding: 50px;padding-top: 90px;padding-bottom: 90px;}
@media screen and (max-width: 940px) {
  .search-any-thing {padding: 30px 10px;}
}
.search-any-thing .text-detail {color: #fff;}
.search-any-thing .text-detail h6 {font-size: 2.3rem;font-weight: 600;}
.search-any-thing .text-detail p {font-size: 0.9rem;font-weight: 500;margin-bottom: 20px;}
.search-any-thing .text-detail .btn {font-weight: 700;box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);font-size: 0.85rem;padding-left: 30px;padding-right: 30px;}
.search-any-thing .card-detail {padding-top: 30px;}
.search-any-thing .card-detail .card-res {background-color: #fff;box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);text-align: center;border-radius: 5px;padding: 20px 0px;margin-bottom: 20px;}
.search-any-thing .card-detail .card-res h2 {margin-bottom: 0px;font-size: 1.4rem;font-weight: 700;}
.search-any-thing .card-detail .card-res p {font-weight: 600;margin-top: 9px;font-size: 0.85rem;}
/* ===================================== List Page Layout CSS ================================== */
.product-list {background-color: #e9e9e9;}
.product-list .lsdpok p {padding-top: 12px;font-size: 0.8rem;font-weight: 600;}
@media screen and (max-width: 767px) {
  .product-list .lsdpok {padding-top: 10px;padding-bottom: 10px;}
}
@media screen and (max-width: 767px) {
  .product-list .list-col .right-filter {padding-top: 10px;padding-bottom: 10px;}
}
.product-list .list-col .right-filter ul {float: right;}
.product-list .list-col .right-filter ul li {float: left;padding: 10px;padding-top: 0px;padding-left: 5px;}
.product-list .list-col .right-filter ul li select {margin-bottom: 0px;background-color: #fff;margin-top: 0px;border-radius: 0px;font-size: 0.8rem;}
.product-list .list-col .right-filter ul li svg {background-color: #fff;box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
    0 1px 5px 0 rgba(0, 0, 0, 0.12);border-radius: 2px;padding: 8px;font-size: 0.9rem;}
/* ===================================== Left Side CSS ================================== */
.list-filter {box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);background-color: #fff;margin-bottom: 13px;}
.list-filter .cat-list h4 {padding: 15px;font-size: 1rem;font-weight: 700;margin-bottom: 0px;}
.list-filter .cat-list h4 svg {float: right;margin-top: -2px;font-size: 0.8rem;}
.list-filter .cat-list .search {padding: 0px 15px;}
.list-filter .cat-list .search input {border-radius: 0px;margin-bottom: 0px;}
.list-filter .cat-list .search svg {position: absolute;right: 39px;margin-top: 10px;font-size: 0.85rem;color: #ccc;}
.list-filter .cat-list .c-list ul {margin-bottom: 0px;margin-top: 13px;margin-left: 10px;width: 100%;margin-bottom: 10px;}
.list-filter .cat-list .c-list ul li {padding: 3px;font-size: 0.9rem;font-weight: 500;width: 100%;}
.list-filter .cat-list .c-list ul li span {float: right;margin-right: 8px;font-size: 0.8rem;}
.list-filter .cat-list .c-list ul li label {width: 100%;}
.list-filter .no-search h4 {padding-bottom: 0px;}
.list-filter .rang-list {padding: 30px 20px;}
.list-filter .select-list {padding: 0px 15px;}
.list-filter .select-list select {border-radius: 0px;margin-bottom: 15px;}
.custom-control-label::before {width: 0.9rem;height: 0.9rem;background-color: #ffffff;border: 1px solid #ccc;border-radius: 2px !important;}
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {background-color: #0b4d70;}
.irs--flat .irs-bar {background-color: #0b4d70;}
.irs--flat .irs-from,
.irs--flat .irs-to,
.irs--flat .irs-single {background-color: #0b4d70;}
.irs--flat .irs-handle > i:first-child {background-color: #0b4d70;}
.irs--flat .irs-min,
.irs--flat .irs-max {font-size: 12px;}
.irs--flat .irs-from,
.irs--flat .irs-to,
.irs--flat .irs-single {font-size: 12px;}
.irs--flat .irs-from:before,
.irs--flat .irs-to:before,
.irs--flat .irs-single:before {border-top-color: #0b4d70;}
.custom-radio .custom-control-label::before {border-radius: 50px !important;}
.custom-radio .custom-control-label::after {top: 0.21rem !important;left: -1px !important;}
.custom-checkbox .custom-control-label::after {top: 0.21rem !important;left: -1px !important;}
.custom-radio .custom-control-input:checked ~ .custom-control-label::before {background-color: #0b4d70;}
/* ===================================== Product Page Layout CSS ================================== */
.single-product {
  background-color: #e9e9e9;
  padding-bottom: 30px;
}

.single-product .product-slider {
  background-color: #fff;
  box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);
  margin: auto;
  padding: 20px;
}

.single-product .product-slider .show {
  text-align: center;
}

.single-product .product-slider .show img {
  width: auto !important;
  height: auto !important;
  max-width: 100%;
}

.single-product .details {
  padding-top: 25px;
  padding-left: 20px;
  padding-right: 20px;
}

.single-product .details ul {
  width: 100%;
}

.single-product .details ul li {
  float: left;
  padding: 5px 20px;
  font-size: 0.9rem;
}

.single-product .details h1 {
  font-size: 1.6rem;
  font-weight: 700;
  margin-top: 15px;
  margin-bottom: 15px;
}

.single-product .details p {
  font-size: 0.93rem;
}

.single-product .details .frow {
  margin-top: 20px;
}

.single-product .details .frow strong {
  font-size: 1.6rem;
  font-weight: 600;
  color: #0b4d70;
}

.single-product .details .frow svg {
  float: right;
  font-size: 1.2rem;
  margin-top: 7px;
}

.product-detail {
  background-color: #fff;
  box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);
  padding: 30px;
}

@media screen and (max-width: 499px) {
  .product-detail {
    padding: 10px;
    margin-top: 20px;
  }
}

.product-detail h4 {
  font-size: 1.2rem;
  font-weight: 700;
}

.product-detail .product-info ul li {
  padding: 5px;
  float: left;
  width: 50%;
}

.product-detail .product-info ul li .inner {
  padding: 5px 10px;
  background-color: #cccccc47;
}

@media screen and (max-width: 499px) {
  .product-detail .product-info ul li .inner {
    font-size: 0.85rem;
  }
}

.product-detail .product-info ul li .inner .desc {
  float: right;
}

.product-detail .list-info ul {
  margin: 10px 0px;
  margin-left: 20px;
}

.product-detail .list-info ul li {
  padding: 3px;
  font-size: 0.9rem;
  list-style: disc;
}

.single-side-rit {
  background-color: #fff;
  box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);
  padding: 10px;
}

.single-side-rit .contact-inf {
  background-color: #e2f3fb;
  padding: 15px;
  display: flex;
}

.single-side-rit .contact-inf .icon {
  padding: 10px;
  padding-right: 18px;
}

.single-side-rit .contact-inf .icon svg {
  font-size: 2.5rem;
}

.single-side-rit .contact-inf .detail {
  margin: auto 0;
}

.single-side-rit .contact-inf .detail h6 {
  font-weight: 700;
  margin-bottom: 2px;
}

.single-side-rit .email-info {
  background-color: #fef4ea;
}

.single-side-rit .profile-card {
  padding: 20px;
  text-align: center;
  padding-top: 50px;
}

.single-side-rit .profile-card img {
  width: 70px;
  border-radius: 50%;
}

.single-side-rit .profile-card h4 {
  font-size: 1.2rem;
  font-weight: 600;
  margin-bottom: 0px;
  margin-top: 26px;
}

.single-side-rit .profile-card p {
  margin-bottom: 30px;
  font-size: 0.85rem;
}

.single-side-rit .profile-card .btn-ro .btn {
  margin-right: 10px;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

.single-side-rit .profile-card .btn-ro .btn-default {
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 0px;
  box-shadow: none;
  width: 45%;
  font-size: 0.85rem;
  font-weight: 600;
  padding-top: 10px;
  padding-bottom: 10px;
}

.single-side-rit .post-shar {
  padding: 20px 10px;
  background-color: #cccccc3b;
  border-radius: 5px;
  margin-top: 30px;
}

.single-side-rit .post-shar ul {
  float: right;
  margin-top: -34px;
}

.single-side-rit .post-shar ul li {
  float: left;
  padding: 10px;
}

.single-side-rit .post-shar ul li svg {
  font-size: 1.5rem;
}

.single-side-rit .post-shar ul li .fa-facebook-square {
  color: #3b5998;
}

.single-side-rit .post-shar ul li .fa-twitter-square {
  color: #00acee;
}

.single-side-rit .post-shar ul li .fa-linkedin {
  color: #0e76a8;
}

.single-side-rit .post-shar ul li .a-tumblr-square {
  color: #34526f;
}

.safty-tips {
  background-color: #fff;
  box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);
  margin-top: 20px;
  padding: 10px;
}

.safty-tips h4 {
  padding: 15px;
  font-weight: 600;
}

.safty-tips ul {
  margin-left: 10px;
  margin-bottom: 15px;
}

.safty-tips ul li {
  padding: 5px;
}

.safty-tips ul li svg {
  margin-right: 6px;
  color: #0b4d70;
}

.ad-slot-1 {
  text-align: center;
  margin-top: 20px;
}

/* ===================================== Dashboard CSS ================================== */
.user-dashboard {
  background-color: #e9e9e9;
  padding-bottom: 50px;
}

@media screen and (max-width: 767px) {
  .user-dashboard .container {
    padding: 0px;
  }
}

.user-dashboard .user-row {
  margin-left: 7.5%;
}

@media screen and (max-width: 991px) {
  .user-dashboard .user-row {
    margin-left: 0px;
  }
}

@media screen and (max-width: 767px) {
  .user-dashboard .user-row {
    margin: 0px;
  }
}

.user-dashboard .side-card {
  background-color: #fff;
  box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);
}

.user-dashboard .side-card .user-prof {
  padding: 10px;
  margin: 0px;
  background-color: #fcfcfc;
}

.user-dashboard .side-card .user-prof .image {
  padding: 5px;
}

.user-dashboard .side-card .user-prof .image img {
  border-radius: 50px;
  background-color: #fff;
  padding: 3px;
  box-shadow: 0 2px 6px 0 rgba(218, 218, 253, 0.65),
    0 2px 6px 0 rgba(206, 206, 238, 0.54);
}

.user-dashboard .side-card .user-prof .detail {
  padding-left: 8px;
  margin: auto;
}

.user-dashboard .side-card .user-prof .detail h6 {
  margin-bottom: 0px;
  font-weight: 700;
  padding-top: 13px;
}

.user-dashboard .side-card .user-prof .detail p {
  font-size: 0.85rem;
}

.user-dashboard .side-card .user-menu {
  border-top: 1px #cccccc6b;
  margin: 0px;
}

.user-dashboard .side-card .user-menu ul {
  width: 100%;
}

.user-dashboard .side-card .user-menu ul li {
  padding: 9px 15px;
  border-bottom: 1px solid #cccccc6b;
  font-weight: 600;
  font-size: 0.88rem;
}

.user-dashboard .side-card .user-menu ul li svg {
  margin-right: 8px;
}

.user-dashboard .side-card .user-menu ul li:hover {
  background-color: #fcfcfc;
}

.user-dashboard .side-card .user-menu ul li a {
  color: #444444d1;
}

.user-dashboard .side-card .user-menu ul .act {
  background-color: #fcfcfc;
}

.user-info {
  margin-bottom: 25px;
}

.user-info .user-widg {
  background-color: #fff;
  border-radius: 5px;
  display: flex;
  box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);
}

.user-info .user-widg .icon {
  padding: 10px 12px;
}

.user-info .user-widg .icon svg {
  font-size: 2.5rem;
}

.user-info .user-widg .detail {
  padding-top: 12px;
  padding-left: 2px;
}

.user-info .user-widg .detail h6 {
  margin-bottom: 0px;
  font-weight: 700;
}

.user-info .user-widg .detail p {
  font-size: 0.85rem;
}

@media screen and (max-width: 767px) {
  .user-info .user-widg {
    margin-bottom: 15px;
  }
}

.my-ads .card-header {
  font-weight: 700;
  font-size: 1rem;
}

.my-ads .card-header .btn {
  font-weight: 700;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  float: right;
}

.my-ads .card-body {
  padding: 0px;
}

.my-ads .card-body table {
  margin-bottom: 0px;
}

.my-ads .card-body tr {
  border-bottom: 1px solid #cccccc80;
}

.my-ads .card-body tr:last-child {
  border-bottom: 0px;
}

.my-ads .card-body tr th {
  padding: 10px;
}

.my-ads .card-body tr td {
  border-top: 0px;
}

.my-ads .card-body tr .post {
  padding: 10px;
  display: flex;
  margin: auto;
}

.my-ads .card-body tr .post img {
  width: 60px;
  margin-right: 8px;
  border: 1px solid #ccc;
  box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
    0 1px 5px 0 rgba(0, 0, 0, 0.12);
  border-radius: 2px;
  border-radius: 13px;
}

@media screen and (max-width: 655px) {
  .my-ads .card-body tr .post img {
    display: none;
  }
}

.my-ads .card-body tr .post b {
  height: 10px;
  margin-bottom: 0px;
  margin-top: 1px;
  font-weight: 600;
}

.my-ads .card-body tr .post p {
  margin-top: 23px;
  margin-left: -37px;
  font-size: 0.87rem;
  font-weight: 600;
}

.my-ads .card-body tr .status {
  padding-top: 19px;
}

.my-ads .card-body tr .status span {
  font-size: 0.75rem;
  font-weight: 600;
  color: #fff;
  border-radius: 8px;
  padding-left: 6px;
  padding-right: 6px;
}

.my-ads .card-body tr .action {
  padding-top: 23px;
  font-size: 0.8rem;
  font-weight: 600;
}

.my-ads .card-body tr .action i {
  margin-right: 4px;
}

.my-ads .card-body tr .action .edit {
  margin-right: 5px;
  color: #00bcd5;
}

.my-ads .card-body tr .action .delet {
  margin-left: 5px;
  color: #ff544d;
}

.my-ads .card-footer {
  padding: 0px;
}

.my-ads .card-footer .pagination-list {
  background-color: #fcfcfcc7;
}

.user-page-nav .row {
  margin-left: 8%;
}

@media screen and (max-width: 767px) {
  .user-page-nav .row {
    margin-left: 0px;
  }
}

/* ===================================== user ad post CSS ================================== */
.ad-post {
  background-color: #e9e9e9;
  padding-bottom: 50px;
}

.ad-post .post-new-ad {
  background-color: #fff;
  box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);
}

.ad-post .post-new-ad .ad-body {
  padding: 30px 60px;
}

.ad-titl {
  margin: 0px;
  text-align: center;
  padding: 20px 15px;
  border-bottom: 1px solid #cccccc80;
  background-color: #cccccc0d;
}

.ad-titl h2 {
  width: 100%;
  text-align: center;
  font-weight: 700;
  font-size: 1.5rem;
  margin-bottom: 5px;
}

.ad-titl p {
  width: 100%;
  text-align: center;
  font-size: 0.9rem;
}

.form-row label {
  padding-top: 12px;
  font-weight: 700;
  font-size: 0.9rem;
}

.form-row .rihy {
  float: right;
  font-weight: 700;
  padding-top: 8px;
  margin-right: 3px;
}

.form-row .radio-col {
  padding-top: 5px;
  font-size: 0.9rem;
  margin-bottom: 20px;
}

.form-row .radio-col input {
  margin-left: 8px;
}

.form-row .upload-img {
  margin-bottom: 20px;
}

.form-row .upload-img .upload-col {
  background-color: #f4f4f4;
  padding: 20px;
  text-align: center;
}

.form-row .upload-img .upload-col svg {
  font-size: 21px;
  color: #b3b1b1;
  padding-top: 3px;
}

.form-row .upload-img input {
  height: 80px;
  width: 80px;
  opacity: 0;
  position: absolute;
}
.form-row .upload-img img {
  margin-top: -245px;
}

.wrap-custom-file {
  position: relative;
  display: inline-block;
  width: 100px;
  height: 100px;
  margin: 0 0.5rem 0.1rem;
  text-align: center;
}

.wrap-custom-file input[type="file"] {
  position: absolute;
  top: 0;
  left: 0;
  width: 2px;
  height: 2px;
  overflow: hidden;
  opacity: 0;
}

.wrap-custom-file label {
  z-index: 1;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  overflow: hidden;
  padding: 0 0.5rem;
  cursor: pointer;
  background-color: #cccccc57;
  border-radius: 4px;
  -webkit-transition: -webkit-transform 0.4s;
  transition: -webkit-transform 0.4s;
  transition: transform 0.4s;
  transition: transform 0.4s, -webkit-transform 0.4s;
}

.wrap-custom-file label svg {
  padding-top: 1rem;
  font-size: 20px;
  margin-bottom: 5px;
  color: #ccc;
}

.wrap-custom-file label span {
  display: block;
  font-size: 0.8rem;
  font-weight: 400;
  color: #777;
  -webkit-transition: color 0.4s;
  transition: color 0.4s;
}

.wrap-custom-file label:hover span {
  color: #333;
}

.wrap-custom-file label.file-ok span {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 0.3rem;
  font-size: 1.1rem;
  color: #000;
  background-color: rgba(255, 255, 255, 0.7);
}

.file-ok {
  background-size: 100%;
  background-repeat: no-repeat;
}

.file-ok svg {
  display: none;
}

.file-ok span {
  font-size: 0.8rem !important;
}

/* ===================================== User messages CSS ================================== */
@media screen and (max-width: 767px) {
  .chat-div {
    padding: 30px;
  }
}

.product-chat {
  background-color: #fff;
  height: 433px;
}

@media screen and (max-width: 767px) {
  .product-chat {
    height: auto;
  }
}

.product-chat .chat-user {
  display: flex;
  padding: 11px;
  border-bottom: 1px solid #ccc;
}

.product-chat .chat-user i {
  position: absolute;
  right: 10px;
  margin-top: -40px;
  font-size: 0.5rem;
}

.product-chat .chat-user .ofline {
  color: #ff544d;
}

.product-chat .chat-user .online {
  color: #0b4d70;
}

.product-chat .chat-user .profil-img img {
  width: 40px;
  border-radius: 50px;
}

.product-chat .chat-user .profil-det {
  padding-left: 10px;
  margin: auto 0;
}

.product-chat .chat-user .profil-det h5 {
  margin-bottom: 2px;
  font-weight: 700;
  font-size: 0.96rem;
}

.product-chat .chat-user .profil-det p {
  font-size: 0.8rem;
}

.product-chat .chat-col4 {
  border-right: 1px solid #ccc;
}

.product-chat .chat-cover {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.product-chat .chat-cover .chat-head {
  display: flex;
  padding: 9px;
  border-bottom: 1px solid #ccc;
  background-color: #cccccc1c;
}

.product-chat .chat-cover .chat-head .product-img img {
  width: 60px;
  border-radius: 5px;
}

.product-chat .chat-cover .chat-head .product-det {
  padding-left: 10px;
  margin: auto 0;
  flex: 1;
}

.product-chat .chat-cover .chat-head .product-det h5 {
  margin-bottom: 2px;
  font-weight: 700;
  font-size: 0.96rem;
}

.product-chat .chat-cover .chat-head .product-det p {
  font-size: 0.8rem;
}

.product-chat .chat-cover .chat-head .delete {
  padding: 10px;
}

.product-chat .chat-cover .chat-body {
  padding: 8px;
  height: 319px;
  display: flex;
  overflow: auto;
  -webkit-flex-direction: column-reverse;
}

.product-chat .chat-cover .chat-body p {
  font-size: 0.9rem;
  font-weight: 600;
}

.product-chat .chat-cover .chat-body .msg-rit {
  flex-direction: row-reverse;
}

.product-chat .chat-cover .chat-body .text-rit {
  float: right;
  max-width: 80%;
  text-align: right;
  background-color: #ccc;
  margin-bottom: 10px;
  padding: 10px;
  background-color: #0b4d70;
  color: #fff;
  border-radius: 5px;
}

.product-chat .chat-cover .chat-body .text-left {
  float: right;
  max-width: 80%;
  text-align: right;
  margin-bottom: 10px;
  padding: 10px;
  background-color: #cccccc2e;
  color: #444;
  border-radius: 5px;
}

@media screen and (max-width: 767px) {
  .product-chat .chat-cover {
    margin-top: 20px;
  }
}

.messag-box {
  padding: 10px;
  background-color: #cccccc26;
}

.messag-box input {
  margin-bottom: 0px;
  background-color: #fff;
}

.messag-box .btn {
  width: 100%;
  border: 1px solid #ccc;
  background-color: #fff;
}

.messag-box .btn i {
  font-size: 0.75rem;
  margin-right: 5px;
}

@media screen and (max-width: 767px) {
  .my-ads {
    margin-top: 20px;
  }
}

.payment-r .post {
  padding: 8px !important;
}

.payment-r .post p {
  font-weight: 500 !important;
  margin-top: 2px !important;
  margin-left: 0px !important;
}

.payment-r .fa-receipt {
  padding: 9px 12px;
  font-size: 1.5rem;
  color: #0b4d70;
}
.user-set {
  padding-top: 10px;
  padding-bottom: 10px;
}

.user-set input {
  margin-bottom: 0px;
}

.user-set p {
  margin-bottom: 15px;
  font-size: 0.95rem;
}

.settings-ad {
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .settings-ad {
    margin-top: 20px;
  }
}

.settings-ad .pswd-chang-row {
  padding-top: 20px;
}

.settings-ad .pv-set {
  padding: 20px;
}

.settings-ad .pv-set .bgnj {
  padding: 8px 0px;
  font-size: 0.95rem;
  font-weight: 500;
}
.switch {
  position: relative;
  display: inline-block;
  width: 49px;
  height: 17px;
  margin-bottom: 2px;
  margin-right: 5px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 10px;
  width: 10px;
  left: 6px;
  bottom: 4px;
  background-color: #fff;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

input:checked + .slider {
  background-color: #0b4d70;
}

input:focus + .slider {
  box-shadow: 0 0 1px #0b4d70;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

.pridul-set-body {
  padding-top: 15px !important;
}

/* ===================================== User pacakges CSS ================================== */
.packages .card-body {
  padding: 20px;
  background-color: #fff !important;
  background-color: #fcfcfc;
}

.packages .card-body .pricing-row {
  margin-top: 20px;
  margin-bottom: 20px;
}

.packages .card-body .pricing-cover {
  background-color: #f7f7f78f;
  border: 1px solid #ccc;
}

@media screen and (max-width: 991px) {
  .packages .card-body .pricing-cover {
    margin-bottom: 20px;
  }
}

.packages .card-body .pricing-cover .pricing-head {
  padding: 30px;
  text-align: center;
  border-bottom: 1px solid #ccc;
}

.packages .card-body .pricing-cover .pricing-body {
  padding: 30px 20px;
  text-align: center;
}

.packages .card-body .pricing-cover .pricing-body ul li {
  padding: 10px;
}

.packages .card-body .pricing-cover .pricing-body h2 {
  margin-top: 20px;
}

.packages .card-body .pricing-cover .pricing-footer {
  padding: 30px;
  padding-top: 0px;
  text-align: center;
}

.packages .card-body .pricing-cover .pricing-footer .btn {
  background-color: #0b4d70;
  color: #fff;
}

.packages .card-body .popular {
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  background-color: #fff;
  position: absolute;
  z-index: 99;
  border: 0px;
  border-top: 4px solid #0b4d70;
}

.packages .card-body .bl-0 {
  border-left: 0px;
}

.packages .card-body .br-0 {
  border-right: 0px;
}

/* ===================================== about us CSS ================================== */
.about-us {
  background-color: #e9e9e9;
  padding-bottom: 50px;
}

.about-card {
  background-color: #fff;
  padding: 30px;
  box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);
}

.about-card .about-detail {
  padding-top: 30px;
}

.about-card .about-detail h4 {
  margin-top: 20px;
  font-weight: 600;
  font-size: 1.1rem;
}

.about-card .about-detail p {
  font-size: 0.95rem;
}

.about-card .about-detail .progress {
  height: 0.5rem;
}

.about-card .about-detail .progrss-col label {
  margin-bottom: 2px;
  margin-top: 15px;
  font-size: 0.93rem;
  font-weight: 600;
}

.about-card .about-detail .progrss-col .progress-bar {
  background-color: #0b4d70;
}

.about-card .count {
  margin-top: 80px;
  text-align: center;
}

.about-card .count svg {
  width: 75px;
  height: 75px;
  color: #fff;
  border-radius: 50px;
  font-size: 2rem;
  text-align: center;
  padding-top: 23px;
}

.about-card .count .fa-heart {
  background-color: #d5658d;
}

.about-card .count .fa-address-card {
  background-color: #53b9c5;
}

.about-card .count .fa-cubes {
  background-color: #a0bd2d;
}

.about-card .count h2 {
  font-weight: 700;
  font-size: 1.5rem;
  margin-top: 20px;
}

.about-card .count h4 {
  font-weight: 600;
  margin: 10px;
  margin-top: 20px;
  font-size: 1.3rem;
}

.about-card .count p {
  margin-top: 15px;
}

/* ===================================== Testimonial Style  ================================== */
.customer-serv {
  background-color: #cccccc36;
  margin-top: 60px;
  padding: 45px;
}

.customer-serv .sec-title {
  text-align: center;
  display: block;
}

@media screen and (max-width: 554px) {
  .customer-serv {
    padding: 40px 20px;
  }
}

@media screen and (max-width: 1063px) {
  .customer-serv {
    padding: 40px 20px;
  }
}

@media screen and (max-width: 348px) {
  .customer-serv {
    padding: 30px 10px !important;
  }
}

.customer-serv .ro-clo {
  padding: 40px 0px;
  padding-top: 60px;
}

.customer-serv .card-b::after {
  box-sizing: border-box;
  background-color: #fff;
  content: "";
  position: absolute;
  z-index: 100;
  height: 25px;
  left: 35px;
  top: 108px;
  transform: rotate(135deg);
  width: 25px;
}

.customer-serv .card-b {
  box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);
  padding: 20px;
  text-align: center;
  font-size: 14px;
  background: url(../images/quotes.png) no-repeat bottom right;
  background-color: rgba(0, 0, 0, 0);
  background-position-x: right;
  background-position-y: bottom;
  background-size: auto auto;
  background-color: #fff;
  background-size: 40px;
  background-position: right 10px bottom 5px;
}

.customer-serv .an-mtc {
  padding-top: 23px;
}

.customer-serv .stars {
  padding-top: 33px;
}

.customer-serv .stars li {
  list-style: none;
  color: #f8b739;
  float: right;
  font-size: 13px;
  margin-left: 4px;
}

.customer-serv .img-circl {
  margin-top: 20px;
  text-align: center;
}

.customer-serv .img-circl img {
  width: 80%;
  border-radius: 50%;
}

.customer-serv .star-par {
  padding-left: 0px;
}

@media screen and (max-width: 1013px) {
  .customer-serv .stars li {
    font-size: 12px;
  }
}

@media screen and (max-width: 991px) {
  .customer-serv .card-b::after {
    display: none;
    margin-top: 20px;
  }
  .customer-serv .col-12 {
    margin-top: 20px;
  }
}

/* ===================================== contact us CSS ================================== */

.contact-card iframe {
  width: 100%;
  height: 350px;
}

.contact-card .contact-form .sec-title {
  text-align: center;
  margin-bottom: 30px;
  display: block;
}

.contact-card .contact-form .contactdiv {
  padding-top: 50px;
}

.contact-card .contact-form .contactdiv .btn {
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  font-weight: 700;
}

.contact-info {
  margin-top: 30px;
}

.contact-info .cinfo {
  box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);
  background-color: #fff;
  padding: 18px;
}

.contact-info .cinfo label {
  margin-bottom: 0px;
}

.contact-info .cinfo h5 {
  font-weight: 700;
  font-size: 1rem;
}

@media screen and (max-width: 767px) {
  .contact-info .cinfo {
    margin-bottom: 20px;
  }
}

/* ===================================== term conditions CSS ================================== */
.terms-condition {
  box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);
  background-color: #fff;
}

.terms-condition .term-header {
  padding: 25px;
  display: block;
  text-align: center;
  background-color: #f4f4f4;
}

.terms-condition .term-header h3 {
  margin-bottom: 0px;
  font-size: 1.6rem;
  font-weight: 600;
}

.terms-condition .term-detail {
  padding: 30px;
  border-bottom: 1px solid #cccccc9e;
}

.terms-condition .term-detail p {
  font-size: 0.9rem;
}

/* ===================================== account login CSS ================================== */
.login-container {
  background-color: #e9e9e9;
  padding: 50px;
}

@media screen and (max-width: 940px) {
  .login-container {
    padding: 30px 10px;
  }
}

.login-container .login-card {
  background-color: #fff;
  box-shadow: 0 4px 20px 1px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.04);
  margin-bottom: 30px;
}

.login-container .login-card .nav-tabs {
  background-color: #f9f9f9;
}

.login-container .login-card .nav-tabs .nav-item a {
  border-radius: 0px;
  font-weight: 600;
  font-size: 0.9rem;
}

.login-container .login-card .login-ro {
  padding: 40px 20px;
}

.login-container .login-card .login-ro h4 {
  font-weight: 700;
  font-size: 1rem;
  margin-bottom: 20px;
}

.login-container .login-card .login-ro .login-details {
  border-right: 1px solid #ccc;
  padding: 0px 30px;
}

.login-container .login-card .login-ro .login-details .btn {
  font-weight: 600;
  border-radius: 0px;
  padding-left: 30px;
  padding-right: 30px;
  float: right;
}

.login-container .login-card .login-ro .login-details a {
  font-size: 0.8rem;
  position: absolute;
  margin-top: 15px;
  color: #0b4d70;
}

.login-container .login-card .login-ro .login-details a:hover {
  text-decoration: underline;
}

.login-container .login-card .login-ro .social-btns {
  padding: 0px 30px;
}

@media screen and (max-width: 767px) {
  .login-container .login-card .login-ro .social-btns {
    margin-top: 20px;
  }
}

.login-container .login-card .login-ro .social-btns .btn {
  color: #fff;
  margin-bottom: 15px;
  font-size: 0.9rem;
  font-weight: 600;
}

.login-container .login-card .login-ro .social-btns .btn span {
  font-size: 1rem;
}

/* ===================================== Catogery CSS ================================== */
.cat-cotaienr {
  padding: 50px;
  background-color: #e9e9e9;
}

@media screen and (max-width: 940px) {
  .cat-cotaienr {
    padding: 30px 10px;
  }
}

.category-row .cate-card {
  background-color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  margin-bottom: 30px;
}

.category-row .cate-card .cat-title {
  display: flex;
  border-bottom: 1px solid #ccc;
  padding: 10px;
}

.category-row .cate-card .cat-title .image img {
  max-width: 25px;
  margin-right: 8px;
}

.category-row .cate-card .cat-title .text h4 {
  font-weight: 700;
  font-size: 1rem;
  padding-top: 3px;
  margin-bottom: 0px;
}

.category-row .cate-card .cat-body {
  padding: 10px;
}

.category-row .cate-card .cat-body ul li {
  padding: 5px;
  font-size: 0.9rem;
  font-weight: 600;
}

.category-row .cate-card .cat-body ul li span {
  float: right;
  font-weight: 400;
  font-size: 0.8rem;
}

/* ===================================== responsive CSS ================================== */
@media screen and (max-width: 974px) {
  .slider-home-search {
    padding-left: 20px;
    padding-right: 20px;
  }
}

@media screen and (max-width: 974px) {
  .slider-home-search .search-box-card .selcmk {
    margin-bottom: 20px !important;
  }
}

@media screen and (max-width: 1170px) {
  .nav-lik li {
    padding: 23px 15px;
  }
}

@media screen and (max-width: 1110px) {
  .nav-lik li {
    font-size: 0.9rem;
  }
}

@media screen and (max-width: 767px) {
  .nav-lik {
    float: left;
    width: 100%;
  }

  .nav-lik li {
    float: none;
    width: 100%;
  }

  .nav-lik li .inner-menu {
    position: relative;
    width: 100%;
  }

  .nav-lik li .inner-menu ul {
    width: 100%;
  }

  .nav-lik li .inner-menu ul li {
    width: 100%;
  }


  .slider-home-2 .carousel-caption {
    height: 215px;
  }
}

@media screen and (max-width: 1200px) {
  .slider-home-2 .carousel-caption {
    bottom: 30px;
  }
}

@media screen and (max-width: 1056px) {
  .slider-home-2 .carousel-caption h2 {
    font-size: 2rem;
  }
  .slider-home-2 .carousel-caption img {
    margin-top: 50px;
  }
}

@media screen and (max-width: 998px) {
  .slider-home-2 .carousel-caption {
    bottom: 10px;
  }
  .slider-home-2 .carousel-caption img {
    margin-top: 80px;
  }
}

@media screen and (max-width: 991px) {
  .slider-home-2 .carousel-caption {
    text-align: center;
    bottom: 40px;
  }
  .slider-home-2 .carousel-caption h2 {
    text-align: center;
  }
  .slider-home-2 .carousel-caption p {
    text-align: center;
  }
  .slider-home-2 .carousel-caption .btn-row {
    display: block;
    text-align: center;
  }
}

@media screen and (max-width: 869px) {
  .slider-home-2 .carousel-caption {
    bottom: 20px;
  }
}

@media screen and (max-width: 789px) {
  .slider-home-2 .carousel-caption h2 {
    margin-bottom: 10px;
  }
  .slider-home-2 .carousel-caption p {
    margin-bottom: 10px;
  }
  .slider-home-2 .carousel-caption .btn-row {
    margin-top: 10px;
  }
}

@media screen and (max-width: 696px) {
  .slider-home-2 .carousel-caption {
    bottom: -20px !important;
  }
  .slider-home-2 .carousel-caption h2 {
    font-size: 1.2rem;
  }
  .slider-home-2 .carousel-caption p {
    font-size: 0.9rem;
  }
}
@media screen and (max-width: 575px) {
  .slider-home-2 {
    padding-top: 62px;
    height: 300px;
  }

  .slider-home-2 .carousel-caption {
    bottom: 10px !important;
    height: 300px;
  }

  .carousel-item {
    height: 320px;
  }
}
@media screen and (max-width: 400px) {
  .slider-home-2 {
    padding-top: 62px;
    height: 360px;
  }

  .slider-home-2 .carousel-caption {
    bottom: 10px !important;
    height: 360px;
  }

  .carousel-item {
    height: 400px;
  }
}
@media screen and (max-width: 400px) {
  .slider-home-2 .carousel-caption .btn-row {
    display: none;
  }
}
/* ===================================== account login CSS ================================== */
.demo-slider {
  background-image: url(/assets/images/demo_bg.jpg);
}
.demo-slider .demo-layy {
  padding: 100px 50px;
  background-color: RGBA(55, 160, 0, 0.9);
  color: #fff;
  text-align: center;
}
@media screen and (max-width: 530px) {
  .demo-slider .demo-layy {
    padding: 50px 20px;
  }
  .demo-slider .demo-layy h2 {
    font-size: 2rem;
  }
  .demo-slider .demo-layy p {
    font-size: 1rem;
  }
}
.demo-slider .demo-layy .demo-row {
  display: block;
}
.demo-slider .demo-layy .demo-row .demo-logo {
  width: 100%;
  text-align: center;
}
.demo-slider .demo-layy .demo-row .demo-logo img {
  background-color: #fff;
  border-radius: 50px;
  margin-bottom: 30px;
}
.demo-slider .demo-layy .demo-row h2 {
  font-weight: 700;
  font-size: 2.8rem;
  margin-bottom: 30px;
  margin-top: 15px;
}
.demo-slider .demo-layy .demo-row p {
  font-weight: 600;
  font-size: 1.5rem;
  text-transform: capitalize;
}

.demo-section {
  padding: 50px;
  background-color: #ffffff9e;
  padding-bottom: 70px;
}
@media screen and (max-width: 940px) {
  .demo-section {
    padding: 30px 10px;
  }
}
.demo-section .demo-row {
  margin-top: 30px;
}
.demo-section .demo-row .demo-card {
  background-color: #fff;
  box-shadow: 0 20px 30px rgba(0, 0, 0, 0.1);
  padding: 15px;
  border-radius: 0px;
  margin-bottom: 30px;
}
.demo-section .demo-row .demo-card .demo-image {
  height: 400px;
  overflow: hidden;
  background-size: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
  transition: background-position 1.5s ease-out 0.5s;
  background-position: top center;
  background-size: 100% auto !important;
  background-repeat: no-repeat;
  border: 1px solid #cccccc7d;
}
.demo-section .demo-row .demo-card .demo-image:hover {
  background-position: bottom center !important;
  transition: background-position 3s linear 0s;
}
.demo-section .demo-row .demo-card .demo-detail {
  padding-top: 15px;
}
.demo-section .demo-row .demo-card .demo-detail h4 {
  font-weight: 600;
  font-size: 1rem;
  margin-bottom: 0px;
}
.demo-section .demo-row .demo-card .demo-detail .btn {
  float: right;
  margin-top: -25px;
  font-weight: 600;
  box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
    0 1px 5px 0 rgba(0, 0, 0, 0.12);
  border-radius: 2px;
}
.demo-section .demo-row .demo-card .s1 {background-image: url(/assets/screen_short/s1.jpg);}
.demo-section .demo-row .demo-card .s2 {background-image: url(/assets/screen_short/s2.jpg);}
.demo-section .demo-row .demo-card .s3 {background-image: url(/assets/screen_short/s3.jpg);}
.demo-section .demo-row .demo-card .s4 {background-image: url(/assets/screen_short/s4.jpg);}
.demo-section .demo-row .demo-card .s5 {background-image: url(/assets/screen_short/s5.jpg);}
.demo-section .demo-row .demo-card .s6 {background-image: url(/assets/screen_short/s6.jpg);}
.demo-section .demo-row .demo-card .s7 {background-image: url(/assets/screen_short/s7.jpg);}
.demo-section .demo-row .demo-card .s8 {background-image: url(../screen_short/s8.jpg);}
.demo-section .demo-row .demo-card .s9 {background-image: url(/assets/screen_short/s9.jpg);}
.demo-section .demo-row .demo-card .s10 {background-image: url(/assets/screen_short/s10.jpg);}
.demo-section .demo-row .demo-card .s11 {background-image: url(/assets/screen_short/s11.jpg);}
.demo-section .demo-row .demo-card .s12 {background-image: url(/assets/screen_short/s12.jpg);}
.demo-section .demo-row .demo-card .s13 {background-image: url(/assets/screen_short/s13.jpg);}
.demo-section .demo-row .demo-card .s14 {background-image: url(/assets/screen_short/s14.jpg);}
.demo-section .demo-row .demo-card .s15 {background-image: url(/assets/screen_short/s15.jpg);}
.demo-section .demo-row .demo-card .s17 {background-image: url(/assets/screen_short/s17.jpg);}
.demo-section .demo-row .demo-card .s16 {background-image: url(/assets/screen_short/s16.jpg);}
.demo-section .demo-row .demo-card .s18 {background-image: url(/assets/screen_short/s18.jpg);}
.justify-end {justify-content: flex-end;}rate {
  flex-direction: row-reverse;
  margin-left: 0px;
  display: flex;
  font-size: 18px;
  margin-right: 5px;
}

.card-stars p {
  font-size: 8px !important;
  margin-top: 7px;
}

.card-stars h5{
  font-size: 11px;
  margin-bottom: 0;
  font-weight: 600;
}

.rate:not(:checked) > input {
  position:absolute;
}

.rate:not(:checked) > label {
  cursor:pointer;
  color:#ccc;
  margin: 0;
}

.rate:not(:checked) > label:before {
  content: '★ ';
}

.rate > input:checked ~ label {
  color: #ffc700;    
}

.rate:not(:checked) > label:hover,
.rate:not(:checked) > label:hover ~ label {
  color: #deb217;  
}

.rate > input:checked + label:hover,
.rate > input:checked + label:hover ~ label,
.rate > input:checked ~ label:hover,
.rate > input:checked ~ label:hover ~ label,
.rate > label:hover ~ input:checked ~ label {
  color: #c59b08;
}

.star-yellow {
  color:#ffc700 !important;
}


.rate:not(:checked) > input {
  display: none;
}

#popular .slick-track {
  margin: 60px 0px;
}

#popular .slick-current.slick-active {
  opacity: 1 !important;
  backface-visibility: hidden;
  transform: scale(1.2) !important;
  transition: all 0.5s ease-in-out 0s !important;
  overflow: hidden;
}

#popular .slick-list .slick-slide {
  opacity: 0.5;
  margin: 0px 45px;
  transition: all 0.5s ease-in-out 0s;
  
}

#popular .post-card_1 img {
  width: 100%;
  border-radius: 4px;
}

.popular-courses {
  padding: 40px 0px 50px 0px;
  background-color: #0e36b1;
}

#popular .slick-dots li {
  height: 11px;
  width: 11px;
  border-radius: 100%;
  margin-right: 10px;
  padding: 0 !important;
  background-color: #d6d6d6;
}

#popular .slick-dots li {
  color: #FFF;
  opacity: 1;
  font-size: 16px;
}

#popular .slick-dots li.slick-active {
  background-color: #0b4d70;
}

#popular .slick-dots {
  display: flex;
  position: absolute;
  bottom: 5%;
  width: 100%;
  align-items: center;
  justify-content: center;
}

#popular .slick-dots:hover {
  cursor: pointer;
}

.course-card-tilte h2 {
  font-size: 30px;
  color: #333;
  font-weight: 700;
  margin: 0 0 5px 0;
  display: inline-block;
}

.course-card-tilte p {
  font-size: 16px;
  font-weight: 300;
  line-height: 1.4;
  margin-bottom: 7px;
}

.courses-card-holder figure {
  position: relative;
  overflow: hidden;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  border-radius: 3px;
  width: 100%;
  height: 100%;
}

.courses-card-holder .info {
  position: absolute;
  width: 100%;
  z-index: 9;
  display: block;
  padding: 35px 15px 0 15px;
  color: #fff;
  left: 0;
  bottom: 0;
  background: transparent;
  background: -webkit-linear-gradient(top, transparent, #000);
  background: linear-gradient(to bottom, transparent, #000);
  box-sizing: border-box;
}

.courses-card-holder figure img {
  transition: all 0.3s ease-in-out;
  width: 100%;
  height: 100%;
  position: absolute;
}

.courses-card-holder {
  position: relative;
}

.courses-card-holder a:hover figure img {
  transform: translate(1%, -1%) scale(1.08);
}

.courses-card-holder .grid_item.small {
  height: 170px;
}

.courses-card-holder .grid_item {
  display: block;
  margin-bottom: 30px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  border-radius: 3px;
  overflow: hidden;
  height: 200px;
}

.courses-card-holder .rate {
  justify-content: flex-end;
}

.courses-card-holder h3 {
  font-size: 17px;
}

.aligner-end {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
}

.aligner-end a svg {
  margin-left: 10px;
  font-size: 14px;
}

.aligner-end a:hover {
  color: rgba(40, 167, 69, 0.9);
}

.p-relative {
  position: relative;
}

.blog-card-body {
  padding: 20px 15px;
}

.blog-card-body h2 {
  line-height: 26px;
  margin: 11px 0px 15px 0px;
  font-size: 18px;
  font-weight: 700;
}

.blog-card-footer p svg {
  margin-right: 7px;
}

.blog-card-footer p {
  margin: 0px;
}

.blog-card-img a figure::before {
  content: "";
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 57.2%;
  position: absolute;
  top: 0;
  left: 0;
  border-radius:5px 5px 0px 0px;
  opacity: 0;
}

.blog-card-img a figure.overlay-1::before {
  height: 61.2%;
}

.blog-card-holder:hover .blog-card-img a figure::before {
  opacity: 0.5;
}

.blog-card-holder{
  transition: 0.5s;
}

.bg-white {
  background-color: #fff;
}

.blog-card-holder:hover {
  transform: translate(0, -7px);
  box-shadow: 1px 2px 11px -7px rgb(0 0 0 / 61%);
  transition: 0.5s;
}

.share-icon a {
  height: 3.125rem;
  width: 3.125rem;
  line-height: 2.5rem;
  border: 5px solid #fff;
  position: absolute;
  text-align: center;
  right: 1.875rem;
  bottom: 150px;
  z-index: 1;
  background-color: #28a745;
}

.blog-card-body .text-primary {
  color: #00bcd2 !important;
}

.share-icon a:hover {
  background-color:#00262b;
}

.share-icon a svg {
  color: #fff;
}

.blog-card-body {
  border: 1px solid #f3f3f3;
}

.blog-card-img a figure {
  height: 190px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  width: 100%;
  margin: 0;
  border-radius: 5px 5px 0px 0px;
}

.why-choose-holder .infright .icon img{
  width: 220px;
}

.why-choose-holder .infright.last-icon .icon img{
  width: 120px;
}

.islamic-book-card-banner{
  overflow: hidden;
}

.islamic-books-holder li {
  display: inline-block;
  margin-right: 20px;
}
  
.islamic-books-holder .slick-list .slick-slide {
  margin: 0 !important;
}

.course-cards-list.islamic-books-holder .slick-list .slick-slide{
  margin: 0px 20px !important;
}
  
.course-card-tilte .btn-success {
  padding: 9px 21px;
}

.course-card-tilte .btn-success svg {
  margin-left: 5px;
  margin-top: 3px;
}

#course-cards .slick-prev,
#course-cards .slick-next,
#course-cards2 .slick-prev,
#course-cards2 .slick-next,
#course-cards3 .slick-prev,
#course-cards3 .slick-next {
  background-color: #eee;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgb(0, 0, 0);
  cursor: pointer;
  height: 35px;
  border-radius: 100%;
  width: 35px;
  font-size: 20px;
}

#course-cards .slick-prev,
#course-cards2 .slick-prev,
#course-cards3 .slick-prev {
  margin-right: 10px;
}

#course-cards .slider-nav {
  display: flex;
  position: absolute;
  bottom: -30px;
  right: 0;
}

#course-cards2 .slick-prev,
#course-cards .slick-prev,
#course-cards3 .slick-prev {
 bottom: -28px;
 right: 40px;
 position: absolute;
}

#course-cards2 .slick-next,
#course-cards .slick-next,
#course-cards3 .slick-next {
  position: absolute;
  right: 0px;
  bottom: -28px;
}


.islamic-book-card {
  border-radius: 10px;
  padding: 10px;
  border: 1px solid transparent;
  height: 200px;
  transition: 0.3s;
}

.islamic-book-card:hover {
  transform: translate(-5px,-18px) rotate( 1deg);
  transition: 0.3s;
}

#islamic-books .slick-track {
  height: 240px;
  padding-top: 30px;
}

.islamic-books-section {
  background-color: #fff;
}
 
.latest-products .card {
	background-color: #fafafa;
	border-radius: 6px;
	border: 1px solid #eaeaea;
	padding: 25px;
}

.latest-products .card h3 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 20px;
}

.latest-products .kids-icon span {
	background: linear-gradient(0deg, rgba(14,99,170,1) 0%, rgba(12,95,163,1) 100%);
	height: 45px;
	width: 45px;
	border-radius: 50%;
	color: #fff;
	align-items: center;
	justify-content: center;
}

.latest-products .card .text-danger {
	font-weight: 500;
}

.latest-products .card .text-danger svg {
	margin-left: 6px;
}

.video-card {
	height: 300px;
	flex-direction: column;
	justify-content: flex-end;
}

.video-card a {
	align-items: center;
}

.video-card a span {
	border: 1px solid red;
	height: 40px;
	width: 40px;
	border-radius: 50%;
	justify-content: center;
	align-items: center;
	margin-right: 10px;
}

.height-500 {
	height: 500px;
}

.kids-vector img {
	max-width: 80px;
}

.full-height {
  height: 100%;
}

.latest-products .kids-icon span {
  background: linear-gradient(0deg
, rgba(14,99,170,1) 0%, rgba(12,95,163,1) 100%);
  height: 45px;
  display: flex;
  width: 45px;
  border-radius: 50%;
  color: #fff;
  align-items: center;
  justify-content: center;
}

.of-h {
  overflow: hidden;
}
.align-center {
  align-items: center;
}
.pd-0 {
  padding: 0 !important;
}

.video-gallery-holder .slick-list .slick-slide {
	margin: 0 15px;
}

.video-gallery-holder li img {
	border-radius: 5px;
}

.galler-video-list {
	position: relative;
}

.galler-video-icon {
	top: 118px;
	left: 0;
	right: 0;
	margin: 0 auto;
	color: #fff;
	background: rgba(210, 50, 40, 0.5);
	font-weight: 500;
	border-radius: 50%;
	height: 100px;
	width: 100px;
	align-items: center;
}

.galler-video-icon span {
	background: #d23228;
	height: 70px;
	width: 70px;
	margin: 0 auto;
	border-radius: 50%;
	align-items: center;
	justify-content: center;
}

.galler-video-icon span a svg {
	color: #fff;
}

.gallery-img {
	height: 100%;
}

.gallery-holder .nav-pills .nav-link.active {
	background-color: transparent;
	color: #0b4d70;
	border-bottom: 2px solid #0b4d70;
}

.gallery-holder .video-detail h3{
  font-size: 13px;
  color: #333333;
}

.gallery-tabs h2 a {
  font-size: 14px;
  font-weight: 700;
}

.br-4 {
  border-radius: 4px;
}

.gallery-holder .nav-pills .nav-link {
	border-radius: 0px !important;
	border-bottom: 2px solid transparent;
	color: #989898;
  padding: 0;
}

.gallery-holder .nav-pills .nav-item {
	margin-right: 12px;
}

.gallery-holder .video-detail h3 {
	margin-bottom: 6px;
}

.gallery-holder .video-detail h3 span {
	font-size: 10px;
	opacity: 0.6;
}

.gallery-tabs h2 {
	margin-bottom: 7px;
}

.gallery-tabs h2 a {
	color: #323434;
	text-decoration: underline;
	overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}

.gallery-tabs p {
	line-height: 18px;
  color: #333333;
	margin-bottom: 7px;
}

.aligner {
  display: flex;
  justify-content: center;
  align-items: center;
}

.gallery-tabs .video-time p svg {
	margin-right: 8px;
}

.video-time {
	border-bottom: 1px solid #eee;
	padding-bottom: 8px;
}

.gallery-tabs .video-detail {
	padding: 7px 10px 0px 10px;
}

.galler-video-list img {
	min-width: 100%;
}

#video-gallery .slick-list {
	margin: 0 -21px;
}

.gallery-cover-img,
.artical-bg-img {
	background-image: url(assets/images/image&videogallery/3.jpg);
	background-size: cover;
	background-position: top;
	background-repeat: no-repeat;
	transition: all 1.5s ease-out;
}

.gallery-cover-img:hover+span,
.artical-bg-img:hover+span{
	bottom: -36px;
	opacity: 1;
}

.g-img-lg {
	min-height: 310px;
}

.g-img-md {
	min-height: 155px;
}

.g-img-sm {
	min-height: 120px;
}

.gallery-heading h3 {
  font-size: 15px;
}

.gallery-holder .nav-pills .nav-link {
  border-radius: 0px !important;
  border-bottom: 2px solid transparent;
  color: #989898;
}

.scroller-tabs {
  max-height: 680px;
}

.scroller-tabs {
  overflow-y: scroll;
}

#style-2::-webkit-scrollbar-track
{
	border-radius: 10px;
	background-color: #F5F5F5;
}

#style-2::-webkit-scrollbar
{
	width: 8px;
	background-color: #F5F5F5;
}

#style-2::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	background-color: rgb(231, 229, 229);
}

.search-any-thing {
  background-position:center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}

/******* Theme  style *******/
.major-course-card-body p,
.major-course-card-body h4 span,
.major-course-card-footer .btn,
.gallery-tabs .video-time p,
.artical-detail .date-text,
.include-holder span  {
	font-size: 12px;
}

.mini-card p span,
.mobile-major-course .nav-pills .nav-link,
.major-course-header h3,
.gallery-holder .nav-pills .nav-link,
.gallery-holder .video-detail h3,
.gallery-tabs p,
.grey-bg-span,
.popular-card-footer .text-secondary {
	font-size: 13px;
}

.why-choose-card p,
.gallery-holder .nav,
.books-category-holder .main-heading h3 svg,
.major-course-card-footer a,
.gallery-tabs h2 a,
.artical-detail p,
.popoular-all-course,
.artical-detail h3,
.testimonial-bg-detail .test-detail{
	font-size: 14px;
}


.qutba-text p,
.banner-courses ul li p,
.major-course-card-body h4,
.kids-holder .card .text-danger,
.gallery-heading h3,
.mobile-menu-icon svg,
.rigth-reserved-mobile p,
.mobile-nav-reserved p,
.mini-card p,
.book-category-list li a,
.welcome-pargraph p  {
	font-size: 15px;
}

.rate #star6{
  display: none;
}

.rate:nth-child(10){
  display: none;
}

.header-nav .navbar a,
.banner-caption p,
.main-heading p,
.why-choose-card h3,
.popular-card-footer-btn .btn svg,
.mini-card a {
	font-size: 16px;
}

.Course-categories-holder li h3,
.major-course-header h2,
.qutba-text .text-left p,
.qutba-text .text-right p {
	font-size: 17px;
}

.banner-courses ul li h3,
.footer-holder .get-in-touch ul li svg {
	font-size: 18px;
}

.our-mission-info h4,
.qutba-text .header-ayat p {
	font-size: 19px;
}

.cta-heading h3,
.sidenav a,
.popular-header .header-card-title {
	font-size: 20px;
}

.banner-caption span {
	font-size: 22px;
}

.our-mission-info h4,
.Course-categories-holder li img,
.mini-card h3 {
	margin-bottom: 20px;
}

.qutba-text p,
.banner-courses ul li p,
.header-nav .navbar .nav-link,
.header-nav .navbar .navbar-brand,
.main-banner hr,
.main-heading p,
.about-us-more-detail p,
.major-course-header h2,
.major-course-header h3,
.major-course-card-body p,
.major-course-card-body .text-danger,
.major-course-duration p,
.s-marathon-slider .slick-list .slick-slide,
.Course-categories-holder li p,
.gallery-holder .nav-pills .nav-item:last-child,
.gallery-tabs .video-time p,
.testimonial-icon .span-bg p,
.books-category-holder .main-heading h3,
.book-category-list,
.book-category-list li:last-child,
.footer-links ul li:last-child,
.footer-holder .get-in-touch ul li,
.footer-links ul,
.footer-holder .get-in-touch ul li p,
.footer-logo-detail p,
.copy-right-holder p,
.rigth-reserved-mobile p,
.side-nav-list-menu ul,
.mobile-sidebar-footer .footer-link .footer-icon,
.popoular-all-course,
.important-links li:last-child {
	margin: 0;
}

.header-nav .navbar .nav-link,
.header-nav .navbar,
.header-nav .navbar .navbar-brand,
.gallery-holder .nav-pills .nav-link,
.book-category-list,
.mobile-sidebar-footer .footer-link .footer-icon,
.side-nav-list-menu ul {
	padding: 0;
}

.major-border,
.commom-hover-effect .gallery-cover-img::before,
.commom-hover-effect .artical-bg-img::before {
	display: block;
}

.banner-courses ul li,
.Course-categories-holder .slick-prev,
.Course-categories-holder .slick-next,
.release-books .slick-prev,
.release-books .slick-next,
.kids-holder .kids-icon span,
.video-card,
.video-card a,
.video-card a span,
.why-choose-holder .why-choose-card,
.galler-video-list,
.galler-video-icon,
.galler-video-icon span,	
.side-nav-list-menu,
.mobile-menu-list,
.mobile-col,
.popular-articles,
.popular-header,
body.home .mini-card-grid {
	display: flex;
}

#banner-slider .slick-list,
.major-course-body-img a,
.slick-list,
.islamic-book-card-banner,
.gallery-cover-img,
.artical-bg-img,
.side-nav-list-menu {
  overflow: hidden;
}

.banner-icon,
.banner-icon-2,
.banner-icon-3,
.banner-icon-4,
.banner-icon-7,
.banner-icon-6,
.banner-icon-8,
.laptop-img,
.tab-img,
.mobile-img,
.major-bg-vector,
.major-bg-vector1,
.kids-bg-vector,
.kids-vector-bg-1,
.kids-vector-bg-2,
.prayer-beads-vector,
.quran-move-vector,
.major-border,
.major-course-body-img a::before,
.top-vector-lamp img,
.top-vector-lamp-left,
.galler-video-icon,
.grey-bg-span,
.testimonial-icon,
.sidenav .closebtn,
.popular-header:before,
.popular-header:after,
.bubble-toggle,
.bubble-container,
.particle {
  position: absolute;
}

.course-detail-holder .banner-search-bar  {
  display: flex;
  align-items: center;
  justify-content: center;
}

.course-detail-holder .banner-search-bar .input-group {
  width: 40%;
}

.banner-search-bar .input-group-append {
	height: 46px;
}

.welcome-pargraph {
	padding: 0px 60px 0px 0px;
}

.mini-card {
	background-color:var(--white-bg) ;
}

/****** Major courses *****/
.major-bg-vector {
	top: 0;
	right: 0;
}

.major-bg-vector1 {
	left: 0;
	bottom: 0;
}

.kids-bg-vector {
	bottom: 0;
	right: 20px;
}

.kids-vector-bg-1 {
	left: 60px;
	top: 0;
}

.kids-vector-bg-2 {
	top: 190px;
	right: 140px;
}

.prayer-beads-vector {
	top: 25%;
	right: 29%;
}

.quran-move-vector {
	bottom: 40%;
	left: 50px;
}

.kids-vector-bg-1 img,
.kids-vector-bg-2 img,
.prayer-beads-vector img,
.quran-move-vector img {
	opacity: 0.8;
	max-width: 70px !important;
	position: relative;
	animation: mymove 4s infinite;
  animation-timing-function: linear;
}

@keyframes mymove {
	from {top: 40px;}
	to {top: 0px;}
}

.major-bg-vector1 img{
	opacity: 0.8;
	max-width: 550px;
}

.major-bg-vector img {
	max-width: 350px;
	opacity: 0.8;
}

.kids-bg-vector img {
	max-width: 500px;
	opacity: 0.6;
}

.major-border {
	height: 2px;
	width: 33%;
	background: #e0e0e0;
	margin: 0 auto;
	left: 0;
	right: 0;
	top: 45px;
}

.courses-category-tabs-holder .major-border {
  width: 97%;
  left: 24px;
}

.courses-category-tabs-holder {
  padding-top: 160px;
}

.major-course-holder .nav-pills .nav-link.active,
 .nav-pills .show > .nav-link {
	color: var(--primary-color);
	background-color: transparent;
	border-bottom: 4px solid #0d5aa5;
	border-radius: 0 !important;
}

.mobile-major-course .nav-pills .nav-link {
	padding: 0px 10px 12px 10px !important; 
}

.major-course-holder .nav-pills .nav-link {
	border-bottom: 4px solid transparent;
	color: #666666;
	padding: 0px 30px 20px 30px; 
	border-radius: 0px;
}

.justify-content-start.courses-category-tabs-holder .nav-pills.major-course-header h2{
  justify-content: flex-start !important;
}

.major-course-card {
	border: 1px solid #eaeaea;
	background-color: var(--white-color);
	box-shadow: 0px 0px 15px rgb(0 0 0 / 5%);
	border-radius: 4px;
	border-bottom: 2px solid #f7cd83 ;
  min-height: 370px !important;
}

.major-course-card:hover {
	border-bottom: 2px solid #0d5aa5;
  transform: translate(-5px,-18px) rotate(1deg);
  transition: 0.3s;
}

.major-course-header{
	padding: 20px;
}

.major-course-card-body {
	padding: 10px 15px 10px 15px;
}

.major-course-card-footer {
	padding: 12px 10px;
}

.major-course-header h2 {
	font-weight: 600;
  color: #333333;
}

.major-course-header h3 {
	opacity: 0.6;
}

.major-course-holder .nav {
	position: relative;
	z-index: 1;
  justify-content: center;
}

.cour-category-holder.nav{
  justify-content: flex-start !important;
}
.release-book-detail h3 {
  font-size: 18px;
}

.major-course-card-body h4 {
	margin: 0px;
  color: #333333;
}

.major-course-card-body p {
	line-height: 11px;
  color: #0c5fa3 !important;
}

.major-course-card-body h4 span {
	opacity: 0.4;
	font-weight: 400;
}

.major-course-duration p {
	color: #989898;
}

.major-course-duration svg {
	margin-right: 8px;
}

.gallery-holder-main {
  padding-top: 220px !important;
}


.major-course-card-footer {
	border-top: 1px solid #e0e0e0;
}

.major-course-body-img a {
	-webkit-transition: .35s ease;
	transition: .35s ease;
	position: relative;
}

.major-course-body-img a::before {
	content: '';
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	z-index: 1;
	-webkit-transition: .35s ease;
	transition: .35s ease;
	background: rgba(0, 0, 0, 0.5);
	-webkit-transform: translate(-50%, -50%) scale(0);
	transform: translate(-50%, -50%) scale(0);
	opacity: 0;
}
.recommended-courses-holder a img {border-radius: 4px 4px 0px 0px;}
.major-course-card-footer .btn {padding: 9px 8px;}
.recommended-courses-holder .major-course-header {padding: 11px;}
/******* Course-categories-slider *******/
.top-vector-lamp img {top: 0; right: 20px;}
.top-vector-lamp-left {top: 0; left: 20px;}
.top-vector-lamp img,
.top-vector-lamp-left img {opacity: 0.8 !important; max-height: 300px;}
.Course-categories-holder .slick-track,
.release-books .slick-track {padding: 20px 0px;} 
.slick-list { margin: 0 -15px;}
.slick-list .slick-slide { margin: 0 20px; outline: none; top: 5px;  position: relative;}
.Course-categories-holder li,
.release-books li,
.video-gallery-holder li,
.testimonial-slider-holder li,
.mobile-testimonial-slider-holder li,
.artical-slider-holder .artical-slider-holder-list,
.banner-slider-holder .artical-slider-holder-slide { display: inline-block; text-align: center;}
.Course-categories-holder li img {display: inline-block;}
.Course-categories-holder li h3 {margin-bottom: 5px; color: var(--heading-color);}
.Course-categories-holder li {padding: 20px 15px;}
.Course-categories-holder li:hover {background:var(--white-bg); box-shadow: -1px 7px 12px -12px rgb(35 29 29 / 52%); padding: 20px 15px;}
.Course-categories-holder li:hover h3 {color:var(--danger-color) ;}
.Course-categories-holder .slick-prev,
.Course-categories-holder .slick-next,
.release-books .slick-prev,
.release-books .slick-next {position: absolute;background: var(--white-color); border-radius: 50%; border: 1px solid #e9e5e5; height: 35px; width: 35px; justify-content: center; align-items: center;}
.Course-categories-holder .slick-prev {top: 85px; left: -30px;}
.Course-categories-holder .slick-next {right: -35px; top: 85px;}
.release-books .slick-next {right: 15px; bottom: -40px;}
.release-books .slick-prev {right: 57px; bottom: -41px;}
.release-books .slick-prev,
.release-books .slick-next {border: 2px solid var(--dark-bg); cursor: pointer;}
.release-books .slick-prev:hover,
.release-books .slick-next:hover {background: var(--dark-bg);}
.release-books .slick-prev:hover svg,
.release-books .slick-next:hover svg {color: #fff;}
/******** islamic Course *********/
.islamic-courses-holder {background-repeat: no-repeat; background-size: cover; width: 100%; padding-bottom: 300px; position: relative; background-attachment: fixed;}
/******** Recommended Course *********/
.recommended-courses-holder {position: relative; margin-top: -250px;}
.recommended-courses-holder .section-padding {border-radius: 10px; padding: 70px 50px !important;}
.section-padding {padding: 100px 0px;}
.recommended-courses-holder .major-course-card-body {padding-top: 3px !important;}
/********** About Us ************/
.why-choose-holder {background-position: center; background-repeat: no-repeat; background-attachment: fixed; background-size: cover;}
.why-choose-holder .why-choose-card {flex-direction: column; justify-content: center; align-items: center; opacity: 0.9;}
.why-choose-card img {max-width: 80px;}
.why-choose-card h3 {margin-bottom: 7px;}
/******* Artical ******/
.artical-card {border: 1px solid #f1f1f1; border-radius: 5px; background: var(--white-bg);}
#artical-slider .slick-list .slick-track {margin: 0px 0px 10px 0px;}
.artical-bg-img {border-radius: 5px 5px 0px 0px;}
.artical-detail {padding: 10px; border-bottom:2px solid #0c5fa4;}
.artical-card:hover {transform: translate(0, -7px); box-shadow: 1px 2px 11px -7px rgb(0 0 0 / 61%);}
.artical-card:hover .artical-detail {border-bottom: 2px solid #f7cd83; }
.artical-detail .date-text {opacity: 0.7}
.artical-detail h3 {margin: 0px 0px 10px 0px;}
.artical-detail p {line-height: 18px;margin: 0 0 10px 0px;}
/******** call To Action *******/
.call-action {background-image: url(assets/images/cta-images/cta-bg-img.jpg); background-repeat: no-repeat; background-size: cover; background-position:center center; background-attachment: fixed; box-shadow: inset -12px 16px 40px -12px #000;}
.cta-heading h3 {margin: 0 0 7px; font-weight: 500; line-height: 44px; color: var(--white-color);}
.cta-heading h2 {font-size: 44px; color: var(--white-color); margin: 0 0 40px 0; font-weight: 700; line-height: 54px; text-shadow: 0px 0px 3px rgb(0 0 0 / 50%);}
/******** Books Category ********/
.books-category-holder hr {margin: 0 auto; margin-top: 0; margin-bottom: 0; width: 100%;}
.book-category-list li {margin-bottom: 12px;} 
.book-category-list li a,
.important-links li a {color: #ededed;}
.important-links li {margin-bottom: 12px;}
.book-category-list li a:hover{color: #0c58a5;}
/******* Footer ******/
.yt-i-color {color: #dc2e2e;}
.in-i-color {color:#db4377;}
.footer-logo-detail h3 {margin-bottom: 4px; font-size: 18px; font-weight: 600; color: #fff;}
.footer-logo-detail p { font-weight: 600; margin: 0; font-size: 15px; color: #fff;}
.footer-logo-detail {margin-left: 10px;}
.footer-links ul li {float: left; margin-right: 10px;}
.footer-logo,
.welcome-pargraph {margin-bottom: 25px;}
.footer-logo img {max-width: 90px;}
.footer-holder .get-in-touch ul li svg {margin-right: 14px; margin-top: 2px; color: var(--danger-color);}
.footer-holder .get-in-touch ul li {margin-bottom: 23px;}
/******1*** responsive style ********/
.mobile-donate-btn,
.mobile-logo,
.mobile-row,
.mobile-none {display: none !important;}
/******* Responsive Navbar ******/
.sidenav {height: 100%;width: 0;position: fixed;z-index: 1;top: 0;left: 0;background: linear-gradient(0deg, rgba(15,49,152,1) 0%, rgba(15,93,171,1) 100%);overflow-x: hidden;transition: 0.5s;z-index: 10;}
.mobile-nav-item {min-width: 320px;margin: 0 auto;}
.sidenav a {padding: 15px 0px;text-decoration: none;color: var(--white-color);transition: 0.3s;}
.btn-outline-primary-mb {padding: 12px 15px !important;border-color: var(--white-color);}
.sidenav .closebtn {top: 0;right: 25px;font-size: 36px;margin-left: 50px;}
@media screen and (max-height: 100%) {
.sidenav { padding-top: 15px;} .sidenav a {font-size: 18px;}}
.rigth-reserved-mobile p {color: var(--white-color);float: right;padding-right: 40px;}
.mobile-menu-icon svg {color: var(--white-color);}
.side-nav-list-menu .side-nav-list li a {padding: 30px;}
.side-nav-list-menu .side-nav-list li a:hover {text-decoration: underline;}
.side-nav-list-menu .side-nav-list li:hover {transition: 0.5s;transform: translateY(-5px) scale(1.02);}
.side-nav-list-menu .side-nav-list li {margin-right: 0;transition: 0.5s;}
.side-nav-list-menu {justify-content: center;height: 45%;}
.mobile-menu-list {justify-content: center;align-items: center;flex-direction: column;height: 90%;}
.mobile-list-holder {text-align: center;}
.mobile-list-holder li {margin-bottom: 20px;}
.mobile-nav-reserved p {color: var(--white-color);margin-bottom: 0;}
.grey-mb {margin-bottom: 70px;}
.mobile-nav-reserved {min-width: 320px;margin: 0 auto;}
.mobile-banner-img img {max-width: 60%;}
.mobile-col {justify-content: flex-end;padding-right: 50px;}
.mobile-menu-icon {border: 1px solid var(--white-color);padding: 8px 12px;border-radius: 3px;cursor: pointer;}
.mobile-menu-icon i {color: var(--white-color);}
.mobile-main-header {padding: 50px 0px;}
.side-nav-list-menu ul {list-style-type: none;width: 100%;}
.side-nav-list-menu ul li {display: inline-block;}
.mobile-sidebar-footer .footer-link .footer-icon {list-style-type: none;}
.mobile-sidebar-footer .footer-link .footer-icon li {float: left;margin-right: 13px;}
.footer-links ul li {list-style: none;}
.footer-links ul li a {position: relative;width:45px;height:45px;display:block;text-align:center;margin:0 10px;border-radius: 50%;padding: 6px;box-sizing: border-box;text-decoration:none;box-shadow: 0 10px 15px rgba(0,0,0,0.3);background: linear-gradient(0deg, #ddd, #fff);transition: .5s;}
.footer-links ul li a:hover {box-shadow: 0 2px 5px rgba(0,0,0,0.3);text-decoration:none;}
.footer-links ul li a svg {height:100%; border-radius: 50%; font-size:18px; color: #262626; transition: .5s;}
.footer-links ul li:nth-child(1) a:hover svg {color: #3b5998;}
.footer-links ul li:nth-child(2) a:hover svg {color: #00aced;}
.footer-links ul li:nth-child(3) a:hover svg {color: #dd4b39;}
.footer-links ul li:nth-child(4) a:hover svg {color: #007bb6;}
.footer-links ul li:nth-child(5) a:hover svg{color: #e4405f;}
/*** Popular Courses ***/
.popular-courses-section {background-repeat: no-repeat; background-size: cover; background-position: center;}
.popular-card-footer .text-secondary {margin-left: 10px;}
.popular-articles {box-sizing: content-box;margin: 0 0 var(--gap); position: relative} 
@media(max-width:1200px) {
  .popular-articles {scrollbar-color: #666 #201c29; padding-bottom: var(--gap); padding-left: 5px; overflow-x: scroll; -webkit-overflow-scrolling: touch; -ms-scroll-snap-points-x: repeat(250px);
    scroll-snap-points-x: repeat(250px); -ms-scroll-snap-type: mandatory; scroll-snap-type: mandatory}
  .popular-articles::-webkit-scrollbar {width: 10px; height: 10px}
  .popular-articles::-webkit-scrollbar-track {background: linear-gradient(90deg, #434343, #434343 1px, #262626 0, #262626)}
  .popular-articles .mini-card {scroll-snap-align: start}}
@media(max-width:800px) {.popular-articles {padding-left: .5rem}}
.popular-header {margin-top: 3rem; flex: 0 0 250px; margin-right: 1rem; position: relative; flex-direction: column; justify-content: flex-end; padding: 1.5rem; transform: translateY(-10px)}
.popoular-all-course {color: var(--white-color);}
.popular-card-footer-btn .btn svg {margin-left: 4px;}
.popular-header:before {content: ""; background: linear-gradient(130deg, #0e35b1, #0c5fa3 41.07%, #f8cf85 76.05%); top: -5px; left: -5px; width: calc(100% + 10px); height: calc(100% + 10px); z-index: 1; border-radius: 12px}
.popular-header:after {content: ""; top: 0; left: 0; width: 100%; height: 100%; background: rgb(14,54,177);background: linear-gradient(0deg, rgba(14,54,177,1) 0%, rgba(12,95,163,1) 100%);z-index: 2; border-radius: 8px}
.popular-header>* {position: relative; z-index: 3}
.mini-card-grid {display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); margin: 0 0 1.5rem; position: relative}
body.home .mini-card-grid {scrollbar-color: #666 #201c29;scrollbar-gutter: always; padding: 3rem 0 3rem 2rem; margin: 0; overflow-x: scroll; -webkit-overflow-scrolling: touch}
body.home .mini-card-grid::-webkit-scrollbar {width: 10px; height: 10px}
body.home .mini-card-grid::-webkit-scrollbar-thumb {
	background: rgb(14,54,177);
    background: linear-gradient(
0deg
, rgba(14,54,177,1) 0%, rgba(12,95,163,1) 100%);
	border-radius: 10px;
}
@media(max-width:1200px) {body.home .mini-card-grid {overflow-x: visible; padding: 0; }}
.mini-card {padding: 1.5rem; border-radius: 7px; box-shadow: 0px 0px 15px rgb(0 0 0 / 5%); border: 1px solid #e0e0e0;color: var(--black-color); flex-direction: column; transition: .2s; margin: 0; position: relative;}
body.home .mini-card {min-width: 300px;}
body.home .mini-card:focus-within,
body.home .mini-card:hover {transform: translateY(-1rem) rotate(3deg)}
body.home .mini-card:focus-within~.mini-card,
body.home .mini-card:hover~.mini-card {transform: translateX(130px)}
body.home .mini-card:first-child:focus-within,
body.home .mini-card:first-child:hover {transform: translate(-.5rem, -1rem) rotate(3deg)}
body.home .mini-card:not(:first-child) {margin-left: -130px; box-shadow: -2rem 0 3rem -3rem #000;}

@media(max-width:1200px) {
  body.home .mini-card {
    min-width: 220px
  }
  body.home .mini-card:not(:first-child) {
    margin-left: -30px
  }
  body.home .mini-card:hover {
    transform: translateY(-1rem)
  }
  body.home .mini-card:hover~.mini-card {
    transform: translateX(30px)
  }
}

@media(max-width:800px) {
  body.home .mini-card {
    min-width: 190px
  }
  body.home .mini-card:not(:first-child) {
    margin-left: -10px
  }
  body.home .mini-card:hover {
    transform: translateY(-1rem)
  }
  body.home .mini-card:hover~.mini-card {
    transform: translateX(10px)
  }
}

.mini-card p {
	color: var(--black-color);
	font-weight: 400;
	margin-bottom: 10px;
}

.mini-card a {
	color: var(--black-color);
}

.mini-card a:hover {
	color: var(--black-color);
}

.mini-card img {
	border-radius: 4px;
}

.mini-card .card-stars {
  margin: 7px 0px;
}

.mini-card .card-stars .rate {
  margin-left: 0 !important;
}

/****** banner bubble particals *****/
.bubble-toggle {
  top: 10px;
  right: 10px;
  padding: 10px;
  background: rgba(255, 255, 255, 0.5);
  font-family: sans-serif;
  font-size: 13px;
  color: #333;
}

.bubble-toggle:hover {
  background: rgba(255, 255, 255, 0.75);
}

.bubble-container {
  bottom: 0;
  will-change: transform;
  -webkit-animation: bubblerise 4s infinite ease-in;
  -moz-animation: bubblerise 4s infinite ease-in;
  -ms-animation: bubblerise 4s infinite ease-in;
  animation: bubblerise 4s infinite ease-in;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
}

.bubble {
  width: 6px;
  height: 6px;
  margin: 0 auto;
  border: 1px solid rgba(240, 239, 239, 0.5);
  background: var(--white-bg);
	opacity: 0.5;
  will-change: transform;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  -webkit-animation: bubblewobble 0.4s infinite linear;
  -moz-animation: bubblewobble 0.4s infinite linear;
  -ms-animation: bubblewobble 0.4s infinite linear;
  animation: bubblewobble 0.4s infinite linear;
}

@-webkit-keyframes bubblerise {
  0% {
    bottom: 0;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
  }
  5% {
    bottom: 0;
    filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
    opacity: 1;
  }
  99% {
    filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
    opacity: 1;
  }
  100% {
    bottom: 100%;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
  }
}
@-moz-keyframes bubblerise {
  0% {
    bottom: 0;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
  }
  5% {
    bottom: 0;
    filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
    opacity: 1;
  }
  99% {
    filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
    opacity: 1;
  }
  100% {
    bottom: 100%;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
  }
}
@-ms-keyframes bubblerise {
  0% {
    bottom: 0;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
  }
  5% {
    bottom: 0;
    filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
    opacity: 1;
  }
  99% {
    filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
    opacity: 1;
  }
  100% {
    bottom: 100%;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
  }
}
@keyframes bubblerise {
  0% {
    bottom: 0;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
  }
  5% {
    bottom: 0;
    filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
    opacity: 1;
  }
  99% {
    filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
    opacity: 1;
  }
  100% {
    bottom: 100%;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
  }
}
@-webkit-keyframes bubblewobble {
  0% {
    margin-left: 0;
  }
  50% {
    margin-left: 2px;
  }
}
@-moz-keyframes bubblewobble {
  0% {
    margin-left: 0;
  }
  50% {
    margin-left: 2px;
  }
}
@-ms-keyframes bubblewobble {
  0% {
    margin-left: 0;
  }
  50% {
    margin-left: 2px;
  }
}
@keyframes bubblewobble {
  0% {
    margin-left: 0;
  }
  50% {
    margin-left: 2px;
  }
}
/****** banner bubble particals *****/
.particle {
  border-radius: 50%;
}

@-webkit-keyframes particle-animation-1 {
  100% {
    transform: translate3d(13vw, 81vh, 27px);
  }
}

@keyframes particle-animation-1 {
  100% {
    transform: translate3d(13vw, 81vh, 27px);
  }
}
.particle:nth-child(1) {
  -webkit-animation: particle-animation-1 60s infinite;
          animation: particle-animation-1 60s infinite;
  opacity: 0.93;
  height: 7px;
  width: 7px;
  -webkit-animation-delay: -0.2s;
          animation-delay: -0.2s;
  transform: translate3d(42vw, 55vh, 74px);
  background: #26d94a;
}

@-webkit-keyframes particle-animation-2 {
  100% {
    transform: translate3d(3vw, 2vh, 23px);
  }
}

@keyframes particle-animation-2 {
  100% {
    transform: translate3d(3vw, 2vh, 23px);
  }
}
.particle:nth-child(2) {
  -webkit-animation: particle-animation-2 60s infinite;
          animation: particle-animation-2 60s infinite;
  opacity: 0.19;
  height: 7px;
  width: 7px;
  -webkit-animation-delay: -0.4s;
          animation-delay: -0.4s;
  transform: translate3d(29vw, 88vh, 32px);
  background: #26d929;
}

@-webkit-keyframes particle-animation-3 {
  100% {
    transform: translate3d(53vw, 33vh, 57px);
  }
}

@keyframes particle-animation-3 {
  100% {
    transform: translate3d(53vw, 33vh, 57px);
  }
}
.particle:nth-child(3) {
  -webkit-animation: particle-animation-3 60s infinite;
          animation: particle-animation-3 60s infinite;
  opacity: 0.21;
  height: 9px;
  width: 9px;
  -webkit-animation-delay: -0.6s;
          animation-delay: -0.6s;
  transform: translate3d(47vw, 32vh, 32px);
  background: #d94a26;
}

@-webkit-keyframes particle-animation-4 {
  100% {
    transform: translate3d(52vw, 24vh, 55px);
  }
}

@keyframes particle-animation-4 {
  100% {
    transform: translate3d(52vw, 24vh, 55px);
  }
}
.particle:nth-child(4) {
  -webkit-animation: particle-animation-4 60s infinite;
          animation: particle-animation-4 60s infinite;
  opacity: 0.73;
  height: 6px;
  width: 6px;
  -webkit-animation-delay: -0.8s;
          animation-delay: -0.8s;
  transform: translate3d(82vw, 39vh, 83px);
  background: #d93226;
}

@-webkit-keyframes particle-animation-5 {
  100% {
    transform: translate3d(21vw, 15vh, 78px);
  }
}

@keyframes particle-animation-5 {
  100% {
    transform: translate3d(21vw, 15vh, 78px);
  }
}
.particle:nth-child(5) {
  -webkit-animation: particle-animation-5 60s infinite;
          animation: particle-animation-5 60s infinite;
  opacity: 0.59;
  height: 8px;
  width: 8px;
  -webkit-animation-delay: -1s;
          animation-delay: -1s;
  transform: translate3d(72vw, 82vh, 53px);
  background: #26d96e;
}

@-webkit-keyframes particle-animation-6 {
  100% {
    transform: translate3d(20vw, 87vh, 32px);
  }
}

@keyframes particle-animation-6 {
  100% {
    transform: translate3d(20vw, 87vh, 32px);
  }
}
.particle:nth-child(6) {
  -webkit-animation: particle-animation-6 60s infinite;
          animation: particle-animation-6 60s infinite;
  opacity: 0.28;
  height: 10px;
  width: 10px;
  -webkit-animation-delay: -1.2s;
          animation-delay: -1.2s;
  transform: translate3d(19vw, 27vh, 42px);
  background: #ca26d9;
}

@-webkit-keyframes particle-animation-7 {
  100% {
    transform: translate3d(13vw, 49vh, 44px);
  }
}

@keyframes particle-animation-7 {
  100% {
    transform: translate3d(13vw, 49vh, 44px);
  }
}
.particle:nth-child(7) {
  -webkit-animation: particle-animation-7 60s infinite;
          animation: particle-animation-7 60s infinite;
  opacity: 0.4;
  height: 7px;
  width: 7px;
  -webkit-animation-delay: -1.4s;
          animation-delay: -1.4s;
  transform: translate3d(63vw, 37vh, 66px);
  background: #56d926;
}

@-webkit-keyframes particle-animation-8 {
  100% {
    transform: translate3d(48vw, 4vh, 11px);
  }
}

@keyframes particle-animation-8 {
  100% {
    transform: translate3d(48vw, 4vh, 11px);
  }
}
.particle:nth-child(8) {
  -webkit-animation: particle-animation-8 60s infinite;
          animation: particle-animation-8 60s infinite;
  opacity: 0.42;
  height: 10px;
  width: 10px;
  -webkit-animation-delay: -1.6s;
          animation-delay: -1.6s;
  transform: translate3d(13vw, 51vh, 22px);
  background: #d98026;
}

@-webkit-keyframes particle-animation-9 {
  100% {
    transform: translate3d(79vw, 41vh, 96px);
  }
}

@keyframes particle-animation-9 {
  100% {
    transform: translate3d(79vw, 41vh, 96px);
  }
}
.particle:nth-child(9) {
  -webkit-animation: particle-animation-9 60s infinite;
          animation: particle-animation-9 60s infinite;
  opacity: 0.71;
  height: 10px;
  width: 10px;
  -webkit-animation-delay: -1.8s;
          animation-delay: -1.8s;
  transform: translate3d(19vw, 17vh, 17px);
  background: #26d9d9;
}

@-webkit-keyframes particle-animation-10 {
  100% {
    transform: translate3d(74vw, 47vh, 73px);
  }
}

@keyframes particle-animation-10 {
  100% {
    transform: translate3d(74vw, 47vh, 73px);
  }
}
.particle:nth-child(10) {
  -webkit-animation: particle-animation-10 60s infinite;
          animation: particle-animation-10 60s infinite;
  opacity: 0.9;
  height: 10px;
  width: 10px;
  -webkit-animation-delay: -2s;
          animation-delay: -2s;
  transform: translate3d(54vw, 8vh, 98px);
  background: #d926c4;
}

@-webkit-keyframes particle-animation-11 {
  100% {
    transform: translate3d(80vw, 44vh, 73px);
  }
}

@keyframes particle-animation-11 {
  100% {
    transform: translate3d(80vw, 44vh, 73px);
  }
}
.particle:nth-child(11) {
  -webkit-animation: particle-animation-11 60s infinite;
          animation: particle-animation-11 60s infinite;
  opacity: 0.87;
  height: 6px;
  width: 6px;
  -webkit-animation-delay: -2.2s;
          animation-delay: -2.2s;
  transform: translate3d(25vw, 51vh, 42px);
  background: #7a26d9;
}

@-webkit-keyframes particle-animation-12 {
  100% {
    transform: translate3d(4vw, 74vh, 61px);
  }
}

@keyframes particle-animation-12 {
  100% {
    transform: translate3d(4vw, 74vh, 61px);
  }
}
.particle:nth-child(12) {
  -webkit-animation: particle-animation-12 60s infinite;
          animation: particle-animation-12 60s infinite;
  opacity: 0.86;
  height: 6px;
  width: 6px;
  -webkit-animation-delay: -2.4s;
          animation-delay: -2.4s;
  transform: translate3d(53vw, 43vh, 49px);
  background: #d92635;
}

@-webkit-keyframes particle-animation-13 {
  100% {
    transform: translate3d(7vw, 84vh, 94px);
  }
}

@keyframes particle-animation-13 {
  100% {
    transform: translate3d(7vw, 84vh, 94px);
  }
}
.particle:nth-child(13) {
  -webkit-animation: particle-animation-13 60s infinite;
          animation: particle-animation-13 60s infinite;
  opacity: 0.79;
  height: 6px;
  width: 6px;
  -webkit-animation-delay: -2.6s;
          animation-delay: -2.6s;
  transform: translate3d(19vw, 59vh, 72px);
  background: #8226d9;
}

@-webkit-keyframes particle-animation-14 {
  100% {
    transform: translate3d(16vw, 54vh, 78px);
  }
}

@keyframes particle-animation-14 {
  100% {
    transform: translate3d(16vw, 54vh, 78px);
  }
}
.particle:nth-child(14) {
  -webkit-animation: particle-animation-14 60s infinite;
          animation: particle-animation-14 60s infinite;
  opacity: 0.53;
  height: 6px;
  width: 6px;
  -webkit-animation-delay: -2.8s;
          animation-delay: -2.8s;
  transform: translate3d(46vw, 77vh, 67px);
  background: #88d926;
}

@-webkit-keyframes particle-animation-15 {
  100% {
    transform: translate3d(74vw, 64vh, 68px);
  }
}

@keyframes particle-animation-15 {
  100% {
    transform: translate3d(74vw, 64vh, 68px);
  }
}
.particle:nth-child(15) {
  -webkit-animation: particle-animation-15 60s infinite;
          animation: particle-animation-15 60s infinite;
  opacity: 0.92;
  height: 9px;
  width: 9px;
  -webkit-animation-delay: -3s;
          animation-delay: -3s;
  transform: translate3d(70vw, 2vh, 87px);
  background: #8b26d9;
}

@-webkit-keyframes particle-animation-16 {
  100% {
    transform: translate3d(61vw, 16vh, 29px);
  }
}

@keyframes particle-animation-16 {
  100% {
    transform: translate3d(61vw, 16vh, 29px);
  }
}
.particle:nth-child(16) {
  -webkit-animation: particle-animation-16 60s infinite;
          animation: particle-animation-16 60s infinite;
  opacity: 0.55;
  height: 7px;
  width: 7px;
  -webkit-animation-delay: -3.2s;
          animation-delay: -3.2s;
  transform: translate3d(60vw, 61vh, 57px);
  background: #26d977;
}

@-webkit-keyframes particle-animation-17 {
  100% {
    transform: translate3d(29vw, 68vh, 22px);
  }
}

@keyframes particle-animation-17 {
  100% {
    transform: translate3d(29vw, 68vh, 22px);
  }
}
.particle:nth-child(17) {
  -webkit-animation: particle-animation-17 60s infinite;
          animation: particle-animation-17 60s infinite;
  opacity: 0.6;
  height: 7px;
  width: 7px;
  -webkit-animation-delay: -3.4s;
          animation-delay: -3.4s;
  transform: translate3d(27vw, 63vh, 36px);
  background: #26d93b;
}

@-webkit-keyframes particle-animation-18 {
  100% {
    transform: translate3d(8vw, 21vh, 6px);
  }
}

@keyframes particle-animation-18 {
  100% {
    transform: translate3d(8vw, 21vh, 6px);
  }
}
.particle:nth-child(18) {
  -webkit-animation: particle-animation-18 60s infinite;
          animation: particle-animation-18 60s infinite;
  opacity: 0.94;
  height: 10px;
  width: 10px;
  -webkit-animation-delay: -3.6s;
          animation-delay: -3.6s;
  transform: translate3d(17vw, 1vh, 8px);
  background: #26d95f;
}

@-webkit-keyframes particle-animation-19 {
  100% {
    transform: translate3d(58vw, 69vh, 82px);
  }
}

@keyframes particle-animation-19 {
  100% {
    transform: translate3d(58vw, 69vh, 82px);
  }
}
.particle:nth-child(19) {
  -webkit-animation: particle-animation-19 60s infinite;
          animation: particle-animation-19 60s infinite;
  opacity: 0.15;
  height: 10px;
  width: 10px;
  -webkit-animation-delay: -3.8s;
          animation-delay: -3.8s;
  transform: translate3d(75vw, 76vh, 58px);
  background: #7ad926;
}

@-webkit-keyframes particle-animation-20 {
  100% {
    transform: translate3d(71vw, 90vh, 71px);
  }
}

@keyframes particle-animation-20 {
  100% {
    transform: translate3d(71vw, 90vh, 71px);
  }
}
.particle:nth-child(20) {
  -webkit-animation: particle-animation-20 60s infinite;
          animation: particle-animation-20 60s infinite;
  opacity: 0.07;
  height: 7px;
  width: 7px;
  -webkit-animation-delay: -4s;
          animation-delay: -4s;
  transform: translate3d(9vw, 44vh, 32px);
  background: #bed926;
}

@-webkit-keyframes particle-animation-21 {
  100% {
    transform: translate3d(78vw, 73vh, 46px);
  }
}

@keyframes particle-animation-21 {
  100% {
    transform: translate3d(78vw, 73vh, 46px);
  }
}
.particle:nth-child(21) {
  -webkit-animation: particle-animation-21 60s infinite;
          animation: particle-animation-21 60s infinite;
  opacity: 0.51;
  height: 10px;
  width: 10px;
  -webkit-animation-delay: -4.2s;
          animation-delay: -4.2s;
  transform: translate3d(32vw, 39vh, 20px);
  background: #0b4d70;
}

@-webkit-keyframes particle-animation-22 {
  100% {
    transform: translate3d(63vw, 21vh, 40px);
  }
}

@keyframes particle-animation-22 {
  100% {
    transform: translate3d(63vw, 21vh, 40px);
  }
}
.particle:nth-child(22) {
  -webkit-animation: particle-animation-22 60s infinite;
          animation: particle-animation-22 60s infinite;
  opacity: 0.58;
  height: 9px;
  width: 9px;
  -webkit-animation-delay: -4.4s;
          animation-delay: -4.4s;
  transform: translate3d(27vw, 46vh, 7px);
  background: #d926b5;
}

@-webkit-keyframes particle-animation-23 {
  100% {
    transform: translate3d(85vw, 3vh, 23px);
  }
}

@keyframes particle-animation-23 {
  100% {
    transform: translate3d(85vw, 3vh, 23px);
  }
}
.particle:nth-child(23) {
  -webkit-animation: particle-animation-23 60s infinite;
          animation: particle-animation-23 60s infinite;
  opacity: 0.21;
  height: 9px;
  width: 9px;
  -webkit-animation-delay: -4.6s;
          animation-delay: -4.6s;
  transform: translate3d(81vw, 86vh, 73px);
  background: #d926d0;
}

@-webkit-keyframes particle-animation-24 {
  100% {
    transform: translate3d(44vw, 68vh, 70px);
  }
}

@keyframes particle-animation-24 {
  100% {
    transform: translate3d(44vw, 68vh, 70px);
  }
}
.particle:nth-child(24) {
  -webkit-animation: particle-animation-24 60s infinite;
          animation: particle-animation-24 60s infinite;
  opacity: 0.88;
  height: 7px;
  width: 7px;
  -webkit-animation-delay: -4.8s;
          animation-delay: -4.8s;
  transform: translate3d(41vw, 45vh, 93px);
  background: #d92644;
}

@-webkit-keyframes particle-animation-25 {
  100% {
    transform: translate3d(11vw, 39vh, 34px);
  }
}

@keyframes particle-animation-25 {
  100% {
    transform: translate3d(11vw, 39vh, 34px);
  }
}
.particle:nth-child(25) {
  -webkit-animation: particle-animation-25 60s infinite;
          animation: particle-animation-25 60s infinite;
  opacity: 0.53;
  height: 6px;
  width: 6px;
  -webkit-animation-delay: -5s;
          animation-delay: -5s;
  transform: translate3d(73vw, 17vh, 76px);
  background: #d93826;
}

@-webkit-keyframes particle-animation-26 {
  100% {
    transform: translate3d(1vw, 76vh, 75px);
  }
}

@keyframes particle-animation-26 {
  100% {
    transform: translate3d(1vw, 76vh, 75px);
  }
}
.particle:nth-child(26) {
  -webkit-animation: particle-animation-26 60s infinite;
          animation: particle-animation-26 60s infinite;
  opacity: 0.5;
  height: 10px;
  width: 10px;
  -webkit-animation-delay: -5.2s;
          animation-delay: -5.2s;
  transform: translate3d(43vw, 24vh, 8px);
  background: #d98b26;
}

@-webkit-keyframes particle-animation-27 {
  100% {
    transform: translate3d(37vw, 56vh, 62px);
  }
}

@keyframes particle-animation-27 {
  100% {
    transform: translate3d(37vw, 56vh, 62px);
  }
}
.particle:nth-child(27) {
  -webkit-animation: particle-animation-27 60s infinite;
          animation: particle-animation-27 60s infinite;
  opacity: 0.81;
  height: 6px;
  width: 6px;
  -webkit-animation-delay: -5.4s;
          animation-delay: -5.4s;
  transform: translate3d(35vw, 31vh, 2px);
  background: #2694d9;
}

@-webkit-keyframes particle-animation-28 {
  100% {
    transform: translate3d(43vw, 4vh, 60px);
  }
}

@keyframes particle-animation-28 {
  100% {
    transform: translate3d(43vw, 4vh, 60px);
  }
}
.particle:nth-child(28) {
  -webkit-animation: particle-animation-28 60s infinite;
          animation: particle-animation-28 60s infinite;
  opacity: 0.14;
  height: 8px;
  width: 8px;
  -webkit-animation-delay: -5.6s;
          animation-delay: -5.6s;
  transform: translate3d(73vw, 62vh, 83px);
  background: #2665d9;
}

@-webkit-keyframes particle-animation-29 {
  100% {
    transform: translate3d(78vw, 90vh, 52px);
  }
}

@keyframes particle-animation-29 {
  100% {
    transform: translate3d(78vw, 90vh, 52px);
  }
}
.particle:nth-child(29) {
  -webkit-animation: particle-animation-29 60s infinite;
          animation: particle-animation-29 60s infinite;
  opacity: 0.49;
  height: 7px;
  width: 7px;
  -webkit-animation-delay: -5.8s;
          animation-delay: -5.8s;
  transform: translate3d(5vw, 11vh, 70px);
  background: #d9267a;
}

@-webkit-keyframes particle-animation-30 {
  100% {
    transform: translate3d(72vw, 88vh, 89px);
  }
}

@keyframes particle-animation-30 {
  100% {
    transform: translate3d(72vw, 88vh, 89px);
  }
}
.particle:nth-child(30) {
  -webkit-animation: particle-animation-30 60s infinite;
          animation: particle-animation-30 60s infinite;
  opacity: 0.01;
  height: 8px;
  width: 8px;
  -webkit-animation-delay: -6s;
          animation-delay: -6s;
  transform: translate3d(82vw, 68vh, 17px);
  background: #d92650;
}

.scroller-tabs {
  max-height: 680px;
}

.scroller-tabs {
  overflow-y: scroll;
}

#style-2::-webkit-scrollbar-track
{
	border-radius: 10px;
	background-color: #28a745;
}

#style-2::-webkit-scrollbar
{
	width: 8px;
	background-color: #28a745;
}

#style-2::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	background-color: rgb(231, 229, 229);
}

#style-3::-webkit-scrollbar-track
{
	border-radius: 10px;
	background-color: #28a745;
}

#style-3::-webkit-scrollbar
{
	width: 8px;
	background-color: #F5F5F5;
}

#style-3::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	background-color: rgb(187, 185, 185);
}

.rate {
  display: flex;
  flex-direction: row-reverse;
  margin-left: 8px;
}

.rate:not(:checked) > input {
  position:absolute;
  display: none;
}

.rate:not(:checked) > label {
  cursor:pointer;
  font-size:20px;
  color:#ccc;
  margin: 0;
}

.rate:not(:checked) > label:before {
  content: '★ ';
}

.rate > input:checked ~ label {
  color: #ffc700;    
}

.rate:not(:checked) > label:hover,
.rate:not(:checked) > label:hover ~ label {
  color: #deb217;  
}

.rate > input:checked + label:hover,
.rate > input:checked + label:hover ~ label,
.rate > input:checked ~ label:hover,
.rate > input:checked ~ label:hover ~ label,
.rate > label:hover ~ input:checked ~ label {
  color: #c59b08;
}

.star-yellow {
  color:#ffc700 !important;
}

.card-stars p{
margin:  7px 0px 0px 0px;
padding-right: 10px;
}

.cta-footer-btn .btn-danger {
  margin-right: 10px;
}

.btn-donate {
    background: rgb(247,201,124);
    background: linear-gradient(
0deg
, rgba(247,201,124,1) 0%, rgba(254,238,174,1) 100%);
    color: #3b2d11;
    border: 1px solid #e4b76b;
}
/********* Contact Us Page *********/
.conatct-wrapper .banner-bg {background: #0f5dab;height: 350px;}
.gallery-wrapper .banner-bg{background: #0f5dab;}
.contact-banner-heading {height: 120px;display: flex;flex-direction: column;justify-content: flex-end;}
.contact-banner-heading h2 {font-size: 30px;margin-bottom: 10px;color: #000;}
.contact-banner-heading p {color: #000;font-size: 19px;margin: 0;}
.contact-page-list h3 {font-size: 17px;margin-bottom: 3px;font-weight: 600}
.contact-page-list p {font-size: 15px;margin: 0;}
.contact-form .form-control {background: #fbfbfb;border: 1px solid #e2e2e2 !important;}
.contact-form .form-control:focus {background-color: #fbfbfb;border-bottom: 1px solid #0c5fa4 !important;border-top: 2px solid transparent;border-left: 2px solid transparent;border-right: 2px solid transparent;}
.contact-form textarea {border-radius: 4px !important;}
.contact-form textarea {background-color: #fbfbfb;border: 1px solid #e2e2e2 !important;}
.prev-slider,
.next-slider {position: fixed;top: 34%;width: 15%;height: 20%;display: flex;align-items: center;justify-content: center;text-decoration: none;z-index: 1300;color: rgba(255,255,255,.5);font-size: 8rem;font-family: 'Open Sans',sans-serif;transition: all .2s;}
.video-bn-pd {padding-top:128px ;}
.prev-slider:hover,
.next-slider:hover {color: rgba(255,255,255,.8);}
.prev-slider {left: -25%;}
.next-slider {right: -25%;}
.active .prev-slider {left: 0;}
.active .next-slider {right: 0;}
.images-gallery-holder .container {display: grid;grid-gap: 5px;grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));grid-auto-rows: 250px;grid-auto-flow: dense;}
.images-slider-holder {text-align: center;padding: 1rem 0;color: white;font-size: 3rem;text-transform: uppercase;background: rgba(0,0,0,.2);overflow: hidden;padding: 0;display: flex;align-items: stretch;justify-content: center;}
.images-slider-holder img {width: 100%;height: 100%;display: block;object-fit: cover;object-position: center;transition: all .5s;}
.images-slider-holder.show::before {content: '';display: block;position: fixed;z-index: 1100;width: 100vw;height: 100vh;top: 0; left: 0;background: rgba(0,0,0,.9);}
.images-slider-holder.show img {position: fixed;top: 0; left: 0;margin: 30px;align-self: center;object-fit: contain;z-index: 1200;width: calc(100% - 60px);height: calc(100% - 60px);filter: drop-shadow(0 3px 15px black);cursor: url(close-button.png), grab;}
.images-slider-holder:not(.show):hover img {cursor: pointer;transform: scale(1.3);}
.horizontal {grid-column: span 2;}
.vertical {grid-row: span 2;}
.big {grid-column: span 2;grid-row: span 2;}
.active .images-slider-holder:not(.show) img {filter: blur(3px);}
.gallery-overlay {background-color: rgba(0, 0, 0, 0.5);padding: 15px 10px;position: absolute;width: 100%; opacity: 0;}
.gallery-overlay p {margin: 0;color: #fff;font-size: 10px;text-align: left;padding-left: 50px;margin-top: -11px;}
.gallery-overlay .gallery-overlay-title {display: flex;}
.gallery-overlay .gallery-overlay-title img {max-width: 40px; margin-right: 9px;}
.gallery-overlay .gallery-overlay-title h3 {color: #fff; font-size: 12px;margin: 0;}
.images-slider-holder:hover .gallery-overlay {opacity: 1; padding-left: 20px;}
.images-slider-holder.show .gallery-overlay {display: none;}
.gallery-overlay-title a {display: flex !important;}
.item-overlay {background: rgba(0, 0, 0, 0.5);position: absolute;bottom: 0;padding: 20px 10px;width: 93.1%;}
.item-overlay h3 {font-size: 16px;margin-bottom: 2px;color: #fff;}
.item-overlay p {color: #fff;font-size: 14px;margin: 0;}
.dark-grey-bg{background-color: #303030;}
.tiles .items .item figure {overflow: hidden;}
.section-title {color: #fff;}
.t-black {color: rgba(0,0,0,.9);}
.course-detail-holder .main-heading h2 .t-black {font-size: 40px;font-weight: 400;line-height: 1.16667;margin-bottom: 0px}
.about-us-main .course-detail-holder {padding-top: 200px;}
.our-story-ab {padding-top: 70px !important;padding-bottom: 0px !important;}
.course-detail-holder .main-heading h2 {margin-bottom: 12px;}
.course-detail-holder .main-heading h2 a:hover {text-decoration: underline !important;color: rgba(0,0,0,.9);}
.courses-detail-wrapper .qutba-text,
.islamic-book-wrapper .qutba-text {background: #353637;border-bottom: 1px solid #2c2f31;}
.courses-detail-wrapper .header-nav .navbar .nav-link,
.islamic-book-wrapper .header-nav .navbar .nav-link{color: #424040;}
.kids-banner-cover .banner-bg .banner-header {box-shadow: 0 0 0 0px rgb(0 0 0 / 15%), 0 1px 3px rgb(0 0 0 / 15%);background: #fff;}
.kids-banner-cover .banner-bg {background: none;}
.kids-banner-cover .banner-bg .banner-icon-1 {position: absolute;top: 16%;left: -150px;}
.kids-banner-cover .marathon-slide .marathon-text-left {left: 39%;bottom: 0;top: auto;}
.kids-banner-cover .marathon-slide .marathon-text-left img {max-width: 100%;}
.kids-banner-cover .banner-icon img {max-width: 100%;}
.kids-banner-cover .banner-icon-3 {left: 0%;bottom: -7px;top: auto;}
/**** Main banner style *****/
.banner-icon {top: 10%; left: 5%;}
.banner-icon-2 {bottom: 16%; left: 2%;}
.banner-icon-3 {top: 40%; left: 2%;}
.banner-icon-4 {top: 3%;right: 15%;}
.banner-icon-7 {bottom: 50%; right: 8%;}
.banner-icon-6 {bottom: 12%;right: 5%;}
.banner-icon-8 {top: 14%; right: 50%;}
.banner-icon img,
.banner-icon-2 img,
.banner-icon-3 img,
.banner-icon-4 img,
.banner-icon-6 img,
.banner-icon-7 img,
.banner-icon-8 img {max-width: 55px;}
.main-banner,
.main-banner-kids {background-image: url(assets/images/banner-vectors/banner-bg.png); background-repeat: no-repeat; background-size: cover; background-position: center; width: 100%; height: 100vh;}
.slider-banner-bg {background-image: url(assets/images/banner-vectors/banner-bg.png);background-repeat: no-repeat;background-size: cover;background-position: center;width: 100%;height: 100%;padding-top: 180px;}
.main-banner-kids {background-image: none !important;background-color: var(--dark-bg);}
.popular-container-holder .container-fluid {max-width: 95%;}
.kids-banner-cover .banner-bg .banner-icon-2 {top: 27%;right: 70px;left: auto;}
.kids-banner-cover .banner-icon {top: 4%;left: 15%;}
.kids-banner-cover .marathon-slide .slider-location {top: 4%;}
.kids-banner-cover .banner-icon-6 {bottom: -2%;right: -2%;}
.kids-banner-cover .banner-icon-8 img {max-width: 70%;}
.kids-banner-cover .banner-icon-8 {top: 10%;right: 50%;}
.kids-banner-cover .banner-icon-3 img {max-width: 75%;}
.kids-banner-cover .banner-icon-7 {bottom: 5%;right: 4%;}
.kids-banner-cover .banner-icon-7 img {max-width: 100%;}
.kids-banner-cover .banner-bg {height: 100vh !important;box-shadow: none !important;}
.islamic-book-wrapper .banner-bg  {background: #f3f6f8;height: 460px;box-shadow: 0 0 0 0px rgb(0 0 0 / 15%), 0 1px 3px rgb(0 0 0 / 15%);}
.text-dark-grey {color: #424040;}
.course-banner-detail p {font-size: 15px;margin-bottom: 0px;}
.course-detail-avtar {position: relative;}
.course-detail-avtar .avtar-1,
.course-detail-avtar .avtar-2,
.course-detail-avtar .avtar-3 {position: absolute;} 
.course-detail-avtar .avtar-2 {left: 18px;}
.course-detail-avtar .avtar-3 {left: 37px;} 
.course-detail-avtar span img {max-width: 30px;}
.active-person {position: absolute;top: 5px;left: 15%;font-size: 13px;}
.course-detail-btn .btn-primary {margin-right: 15px;}
.courses-detail-video {background-repeat: no-repeat;background-size: cover;background-position: center;height: 310px;opacity: 0.8;border-radius: 6px 10px 6px 6px;}
.include-holder ul,
.include-holder ul li:last-child {margin: 0;}
.include-holder ul li {margin-bottom: 18px;display: flex;align-items: center;font-weight: 500;}
.include-holder ul li img {max-width: 25px;margin-right: 9px;}
.morecontent span {display: none;}
.morelink {display: block;color: #0e35b1;text-align: center;margin-top: 20px;}
.morelink.less {color: #0e35b1;}
.courses-side-bar {-webkit-box-shadow: 0 0 0 1px rgb(0 0 0 / 15%), 0 2px 3px rgb(0 0 0 / 20%);box-shadow: 0 0 0 1px rgb(0 0 0 / 15%), 0 2px 3px rgb(0 0 0 / 20%); -webkit-transition: -webkit-box-shadow 83ms;transition: -webkit-box-shadow 83ms;transition: box-shadow 83ms;transition: box-shadow 83ms, -webkit-box-shadow 83ms;background: #fff;margin-top: 16px;}
.courses-side-bar-accordian .accordion .card {background: transparent;border:none;border-bottom: 1px solid rgba(0, 0, 0, 0.125) !important;}
.courses-side-bar-accordian .accordion .card .card-header button {color: #212529;}
.courses-side-bar-accordian .accordion .card .card-header .btn:focus {box-shadow: none;text-decoration: none;}
.courses-side-bar-accordian .accordion .card .card-header button:hover {text-decoration: none;}
.review_section body {background-color: #fdfdfd;margin: 0;position:relative;}
.review_section h2 {display: inline-block;font-size: 18px;margin: 0;}
.review_section #review-add-btn {padding: 0;font-size: 15px;cursor: pointer;}
/* ====================== Review Form ====================== */
.review_section #modal {position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 3;display: flex;flex-direction: column;border: 1px solid #666;border-radius: 10px;opacity: 0;transition: all .3s;overflow: hidden;background-color: #fffdfd;display: none;}review_section #modal.show {opacity: 1;display: flex;}
.review_section .modal-overlay {width: 100%;height: 100%;z-index: 2;background-color: #000;opacity: 0;transition: all .3s;position: fixed;top: 0;left: 0;display: none;margin: 0;padding: 0;}
.review_section .modal-overlay.show {display: block;opacity: 0.5;  }
.review_section #modal .close-btn {align-self: flex-end;margin: 8px 8px 0;padding: 0 8px;cursor: pointer;}
.review_section form {width:50vw;padding: 0 20px 20px 20px;}
.review_section button {color: #fff;background-color: #0062cc !important;border-color: #005cbf !important;}
.review_section input,
.review_section select,.review_section .rate, .review_section textarea, .review_section button {background: #f9f9f9;border: 1px solid #e2e2e2;border-radius: 3px;font-size: 16px;padding: 8px;}
.review_section input[type="radio"] {box-shadow: none;outline:0 !important;}
.review_section button {min-width: 48px;min-height: 48px;}
.review_section button:hover {border: 1px solid #ccc;background-color: #fff;}
.review_section button#review-add-btn, 
.review_section button.close-btn, 
.review_section button#submit-review-btn {min-height: 35px;}
.review_section button#submit-review-btn {font-weight: bold;cursor: pointer;padding: 0 16px;}
.review_section .fieldset {margin-top: 20px;}
.review_section .right {align-self: flex-end;}
.review_section #review-form-container {width: 100%;padding: 0 20px 26px;color: #333;overflow-y: auto;}
.review_section #review-form-container h2 {margin: 0 0 30px 6px;}
.review_section #review-form {display: flex;flex-direction: column;background: #fff;border: 1px solid #e5e5e5;border-radius: 4px;}
.review_section #review-form label, .review_section #review-form input {display: block;}
.review_section #review-form label {font-weight: 500;margin-bottom: 10px;}
.review_section #review-form .rate label,.review_section  #review-form .rate input,
.review_section #review-form .rate1 label,.review_section  #review-form .rate1 input {display: inline-block;}
.review_section .rate {height: 36px;display: inline-flex;flex-direction: row-reverse;align-items: flex-start;justify-content: flex-end;margin-left: 0 !important;}
.review_section #review-form .rate > label {margin-bottom: 0;margin-top: 2px;height: 30px;font-size: 20px;}
.review_section #review-form .rate > label:focus {outline: none;box-shadow: none;border: none;}
.review_section .rate:not(:checked) > input {top: -9999px;margin-left: -24px;width: 20px;padding-right: 14px;z-index: -10;}
.review_section .rate:not(:checked) > label {float:right;width:1em;overflow:hidden;white-space:nowrap;cursor:pointer;font-size:30px;color:#ccc;}
.review_section .rate2 {float: none;}
.review_section .rate:not(:checked) > label::before {content: '★ ';position: relative;top: -10px;left: 2px;}
.review_section .rate > input:checked ~ label {color: #ffc700;}
.review_section .rate > input:checked:focus + label, .review_section .rate > input:focus + label {outline: -webkit-focus-ring-color auto 5px;}
.review_section .rate:not(:checked) > label:hover,
.review_section .rate:not(:checked) > label:hover ~ label {color: #deb217;}
.rate > input:checked + label:hover,
.rate > input:checked + label:hover ~ label,
.rate > input:checked ~ label:hover,
.rate > input:checked ~ label:hover ~ label,
.rate > label:hover ~ input:checked ~ label {color: #c59b08;}
.review_section #submit-review {align-self: flex-end;}
.review_section input,.review_section textarea{width:100%;font-size: 14px;}
.review_section input:focus {border: none;outline: none;box-shadow: none;}
.blog-card {display: flex;flex-direction: column;margin: 5px 0;box-shadow: 0 3px 18px 1px rgb(0 0 0 / 10%);margin-bottom: 1.6%;background: #fff;line-height: 1.4;font-family: 'Open Sans',sans-serif;border-radius: 5px;overflow: hidden;z-index: 0;}
 .blog-card a {color: inherit;}
.blog-card .meta {position: relative;z-index: 0;height: 180px;}
 .blog-card .photo {height:200px;width:200px;margin:0;}
 .blog-card .description {padding: 1rem;background: #fff;position: relative;z-index: 1;}
 .blog-card .description h1 {line-height: 1;margin: 0;font-size: 17px;font-weight: 500;margin-bottom: 10px;}
 .blog-card .description h2 {font-size: 13px;font-weight: 300;text-transform: uppercase;color: #a2a2a2;margin-top: 9px;margin-bottom: 5px;}
 .blog-card p:first-of-type {margin-top: 23px;font-size: 14px;}
 .blog-card p:first-of-type:before {content: "";position: absolute;height: 3px;background: linear-gradient(0deg, rgba(14,99,170,1) 0%, rgba(12,95,163,1) 100%);width: 35px;margin-top:-15px;border-radius: 3px;}
 @media (min-width: 640px) {
	 .blog-card {flex-direction: row;max-width: 700px;}
	 .blog-card .meta {flex-basis: 0%;height: 200px;}
	 .blog-card .description {flex-basis: 95%;}
  .blog-card .description:before {content: "";background: #fff;width: 30px;position: absolute;left: -10px;top: 0;bottom: 0;z-index: -1;}
	 .blog-card.alt {flex-direction: row-reverse;}
	 .blog-card.alt .details {padding-left: 25px;}}
.checked {color: orange;}
.review_section button:focus{outline: none;}
.Course-description p {padding-right: 60px;}
.related-courses-detail {border-bottom: 1px solid #d4d4d4;padding-bottom: 15px;}
.related-courses-detail h3 {font-size: 15px;margin-bottom: 10px;margin-top: 5px;}
.related-courses-detail h3 a {color: #333333;}
.related-courses-detail p {margin: 0;}
.related-courses img {margin-top: 7px;border-radius: 4px;}
.fieldset button:hover {color: #fff;background-color: #c82333;border-color: #bd2130;}
.course-detail-holder .form-control:focus {border: 1px solid #eee;box-shadow: none;} 
.banner-tags h3 {margin-right: 10px;}
.banner-tags a {margin-right: 10px;}
.banner-tags a:last-child {margin-right: 0px;}
/****** About Story Styling *******/
.our-story-caption h1 {font-size: 30px;font-weight: 700;}
.our-story-caption h4{font-size: 20px;font-weight: 600;margin-bottom: 30px;line-height: 28px;}
.about-us-img img {max-width: 80%;border-radius: 5px;}
.our-vision-card .dark-bg {background-color:#0b4d70;}
.our-vision-card .dark-bg h2 {font-size: 32px;line-height: 36px;margin-bottom: 40px;}
.our-vision-card .vision-card {padding: 45px;}   
.vision-card {min-height: 300px;display: flex;position: relative;overflow: hidden;flex-direction: column;align-items: center;justify-content: center;border: 1px solid #e0e0e0;transition: 0.5s;}
.trans-bg-card:hover {background-color: #0b4d70;transition: 0.5s;}
.trans-bg-card:hover::after{opacity: 1;}
.trans-bg-card::after{content: "";position: absolute;height: 100px;width: 100px;background-color: #296f05;top: -20px;right: -20px;opacity: 0;border-radius: 100%;overflow: hidden;}
.trans-bg-card:hover h3,
.trans-bg-card:hover p {color: #fff;}
.choose-card img {max-width: 60px;margin-right: 20px;align-self: flex-start;}
.choose-card h3 {font-weight: 500;font-size: 22px;}
.choose-card p {font-size: 16px;line-height: 25px;}
.choose-detail {padding: 0px 30px 0px 0px;}
.testimonial-img {margin-left: 60px;}
.team-detail {padding: 20px 0px;}
.team-detail strong {color:#556575;}
.video-holder .container-fluid {max-width: 1850px;}
.video-banner .container-fluid {max-width: 98%;}
.video-footer h3 {font-size: 17px; font-weight: 500;line-height: 23px; color: #333333; margin-bottom: 5px;}
.course-detail-pd {padding-top: 230px;}
.contact-banner-main {padding-top: 140px;}
.contact-us-holder .main-heading h2 {font-size: 30px;font-weight: 700;color: var(--heading-color);line-height: 39px;margin-bottom: 23px;}
.video-footer p {margin: 0;color: #333333;font-size: 14px;}
.video-footer {padding: 8px 3px;}
.purchase-card {border: 1px solid #e2e9ee;padding: 20px;}
.purchase-card-header h2 {font-size: 20px;font-weight: 800;line-height: 30px;color: #333333;margin-bottom: 0;}
.purchase-card-body h3 {font-size: 18px;color: #333333;font-weight: 800;}
.purchase-card-header .rate {justify-content: flex-end;margin-left: 0;}
.purchase-card-header {border-bottom:1px solid #ccd4da;}
.purchase-card-header p {font-size: 12px;}
.purchase-card-header p span a {display: inline-block;}
/* -- quantity box -- */
.quantity {display: inline-block; }
.quantity .input-text.qty {width: 65px;height: 39px;font-size: 14px;font-weight: 500;padding: 0 5px;text-align: center;background-color: transparent;border: 1px solid #efefef;}
 .quantity.buttons_added {text-align: left;position: relative;white-space: nowrap;vertical-align: top; }
 .quantity.buttons_added input {display: inline-block;margin: 0;vertical-align: top;box-shadow: none;}
 .quantity.buttons_added .minus,
 .quantity.buttons_added .plus {padding: 7px 10px 8px;height: 41px;background-color: #ffffff;border: 1px solid #efefef;cursor:pointer;}
 .quantity.buttons_added .minus {border-right: 0; }
 .quantity.buttons_added .plus {border-left: 0; }
 .quantity.buttons_added .minus:hover,
 .quantity.buttons_added .plus:hover {background: #eeeeee; }
 .quantity input::-webkit-outer-spin-button,
 .quantity input::-webkit-inner-spin-button {-webkit-appearance: none;-moz-appearance: none;margin: 0; }
.quantity.buttons_added .minus:focus,
.quantity.buttons_added .plus:focus {outline: none; }
.boxed label {display: inline-block;width: 180px;padding: 8px;border: solid 1px #ccc;transition: all 0.3s;border-radius: 4px;font-size: 13px;}
.boxed input[type="radio"] {display: none;}
.boxed input[type="radio"]:checked + label {border: solid 1px var(--dark-bg);}
.purchase-price {margin: 5px 0px 33px 0px ;}
/*********  download islamic books *******/
.download-books-holder .sidebar {background: #f8f8f8; border: 1px solid #eee; border-radius: 4px;}
.download-books-holder .sidebar h4 {font-weight: bold; border-bottom: 1px solid #f8f8f8; padding: 15px; margin: 0; background: #f8f8f8; font-size: 16px; border-bottom: 1px solid #eee; margin-bottom: 10px;}
.download-books-holder .nav-pills .nav-link.active, .nav-pills .show > .nav-link {color: #fff; background: linear-gradient(0deg, rgba(14,99,170,1) 0%, rgba(12,95,163,1) 100%);}
.download-books-holder .nav-pills .nav-link{color: var(--heading-color); margin-bottom: 10px;}
.books-heading {border-bottom: 1px solid #eee; margin-bottom: 30px; margin-left: 20px; padding-left: 0; }
.product-hover {opacity: 0; transition: 0.5s; position: absolute; bottom: 20px; right: 0; left: 0; margin: 0 auto;}
.download-book-img:hover .product-hover {opacity: 1; transition: 0.5;}
.download-book-img {position: relative; border: 2px solid #eee; padding: 12px; border-radius: 10px; text-align: center;}
.download-book-img:hover::before {opacity: 0.8;}
.download-book-img::before {content: ""; background-color: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; position: absolute; top: 0; left: 0; border-radius: 5px 5px 0px 0px; opacity: 0;}
.download-book-img:hover .btn {opacity: 1; transition: 0.5s;}
.download-book-img .btn{position: absolute; top: 53%; left: 0; right: 0; margin: 0 auto; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); opacity: 0; transition: 0.5;}
.books-banner-cover .main-heading {height: 270px; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end;}
.books-banner-cover .main-heading span {font-size: 15px;font-weight: 500;margin-bottom: 10px;}
.books-cover-img img {max-width: 90%;}
.bg-light-purple {background-color: #faf1ff !important;}
.bg-light-yellow {background-color: #faf4eb !important;}
.bg-light-chilli {background-color: #f4e6e5 !important;}
.bg-light-blue {background-color: #e6f2f4 !important;}
.bg-light-red {background-color: #fff6f6 !important;}
.product-category {display: flex;justify-content: space-between;}
.product-category li {padding: 40px;border-radius: 5px;}
.product-category li img {max-width: 50px;margin-bottom: 20px;}
.product-category li h3 {margin-bottom: 10px;font-weight: 500;font-size: 19px;}
.product-category li a {color: #333333;}
.best-books-card-holder {display: flex;}
.best-books-card-holder li,
.release-books li {border: 1px solid #eae8e4;padding: 40px 30px;transition: 0.5s;margin-right: 4px;border-radius: 4px;width: 100%;}
.best-card-detail h3 {font-size: 18px;}
.release-books li {padding: 20px;}
.best-books-card-holder li:last-child {margin-right: 0;}
.best-books-card-holder li:hover,
.release-books li:hover {border: 1px solid #000;box-shadow: 0px 0px 40px 0px rgb(22 22 25 / 10%);transition: 0.5;}
.best-books-card-holder li:hover .best-card-detail {transform: translateY(-44px);}
.best-books-card-holder li:hover .download-btn-hover {opacity: 1;}
.best-card-detail {background: #fff;padding: 10px 0px 0px 0px;}
.best-card-detail span,
.release-book-detail span {font-weight: 500;font-size: 12px;}
.release-book-img {float: left;max-width: 30%;}
#release-books .slick-list .slick-slide {margin: 0px 4px;}
.release-book-detail {text-align: left;height: 107px;display: flex;flex-direction: column;justify-content: flex-end;}
.best-card-detail h3,
.release-book-detail h3 {font-weight: 400;margin: 5px 0px;}
.best-card-detail b,
.release-book-detail b {color: #636363;font-weight: 600;}
.download-btn-hover {position: absolute;bottom: 29px;left: 28px;opacity: 0;}
.kids-banner-cover .s-marathon-slider {background-color: #bfedeb;margin-top: -1px;}
.event-list-wrapper .banner-bg {background-repeat: no-repeat;background-size: cover;background-position:center;height: 400px;}
.event-banner-cover {z-index: 1;height: 159px;display: flex;align-items: flex-end;position: relative;}
.event-banner-cover h2 {font-size: 30px;font-weight: 600;margin: 0;color: var(--white-color);}
.event-card {background-color:var(--white-color);padding: 15px;margin-bottom: 20px;border: 1px solid #f0f0f0;display: flex;border-radius: 4px;box-shadow: 0px 0px 15px rgb(0 0 0 / 5%);}
.event-card:hover {border: 1px solid var(--primary-color);box-shadow: none;}
.event-date {position: absolute;top: 0;left: 0;background: var(--banner-bg);height: 70px;width: 70px;display: flex;align-items: center;justify-content: center;flex-direction: column;}
.event-img {max-width: 50%;}
.event-img img {max-height: 190px;max-width: 280px;}
.event-date h3 {color: var(--white-color);margin-bottom: 0px;font-size: 20px;font-weight: 700;}
.event-date p {font-size: 17px;color: var(--white-color);margin: 0;text-align: center;}
.event-detail {display: flex;justify-content: center;flex-direction: column;padding: 0 0 0 40px;}
.event-detail h3 {font-size: 18px;line-height: 25px;margin-bottom: 10px;}
.event-description {margin: 0;font-size: 15px;line-height: 22px;}
.event-banner-img img {width: 100%;}
.event-banner-img:hover .item-overlay {opacity: 1;}
.event-banner-img .item-overlay {width: 100%;opacity: 0;transition: 0.5s;background-color: rgba(0, 0, 0, 0.7);height: 100%;}
.event-banner-img .item-overlay .item-title {position: absolute;bottom: 20px;left: 20px;}
.event-banner-img .item-overlay .item-title .event-detail {padding: 0;}
.event-banner-img .item-overlay .item-title .event-detail h3 {margin: 0;}
.event-banner-img.event-img {max-width: 100%;min-height: 100%;}
.event-banner-img.event-img img {max-width: 100%;max-height: 100%;}
.banner-header .navbar-nav .nav-item .dropdown-menu .dropdown-item {margin-bottom: 3px;font-size: 15px;font-weight: 500;}
.banner-header .navbar-nav .nav-item .dropdown-menu .dropdown-item:last-child{margin-bottom: 0;}
.banner-header .navbar-expand-lg .navbar-nav .dropdown-menu {margin-top: 10px;padding: 20px 0px;}
.testimonial-img img {max-width: 80%;}
.courses-detail-wrapper .mobile-menu-icon,
.islamic-book-wrapper .mobile-menu-icon {border: 1px solid #000;}
.courses-detail-wrapper .mobile-menu-icon svg,
.islamic-book-wrapper .mobile-menu-icon svg {color: #000;}
.share-1 a{margin-bottom: -59px ;}
.share-2 a {bottom: 115px ;}
.share-3 a {bottom: 90px ;}
.about-us-banner,
.contact-banner-holder {height: 340px;}
.Logo img,
.banner-logo img {max-width: 70px;}
.event-banner {height: 450px !important;}
.Course-description h3,
.artical-pill h3 {font-size: 18px;color: #333333;font-weight: 800;}
.artical-pill h3 {margin-top: 20px;}
.sp-pd-t {padding-top: 170px !important;}
.course-detail-holder.section-padding {padding-top: 200px;}
.courses-category-banner {height: 430px !important;}
.video-banner-holder {padding-top: 128px;}
.pagination-holder {width: 100%;display: flex;justify-content: center;}
.mb-none {display: none;}
.course-offer-list {margin: 20px 0px;}
.course-offer-list li {margin-bottom: 8px;font-size: 17px;list-style: disc;}
.footer-holder-1 .container-fluid {max-width: 1600px;}
.footer-holder-1 {background-color: #fff;}
.footer-holder-1 .books-category-holder {background-color: #384047;}
/*********  Kids Section *********/
.kids-holder .card {background-color: #fafafa;border-radius: 6px;border: 1px solid #eaeaea;padding: 25px;}
.kids-holder .kids-icon span {background: linear-gradient(0deg, rgba(14, 99, 170, 1) 0%, rgba(12, 95, 163, 1) 100%);height: 45px;width: 45px;border-radius: 50%;color: var(--white-color);align-items: center;justify-content: center;}
.kids-holder .kids-icon span svg {color: #fff;}
.kids-holder .card .text-danger {font-weight: 500;}
.kids-holder .card .text-danger svg {margin-left: 6px;}
.kids-holder .card h3 {font-size: 18px;}
.dark-card {background-color: var(--heading-color) !important;}
.video-card {height: 300px;flex-direction: column;justify-content: flex-end;}
.video-card a {align-items: center;}
.video-card a span {border: 1px solid red;height: 40px;width: 40px;border-radius: 50%;justify-content: center;align-items: center;margin-right: 10px;}
.height-500 {height: 500px;}
.kids-vector img {max-width: 110px;}
.m-of-h.pt-80.pb-80.gallery-holder{background-color: #fff;}
.hover01 figure img {-webkit-transform: scale(1); transform: scale(1); -webkit-transition: .3s ease-in-out;transition: .3s ease-in-out;height: 100%;}
.hover01 figure:hover img {-webkit-transform: scale(1.3);transform: scale(1.3);}
.image-collage-holder .container {max-width: 1500px;}
.image-collage-holder {background-color: #fff;padding: 100px 0px 50px 0px ;}
.image-collage-img {position: relative;height: 100%;}
.image-collage-img figure {position: relative;z-index: 1;height: 100%;}
.image-collage-img .overlay {position: absolute; top: 0;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;text-align: center;}
.overlay-detail h3 {color: #fff;font-size: 36px;line-height: 46px;font-weight: 400;}
.overlay-detail .btn-success {padding: 14px 35px;}
.overlay-detail {height: 100%;display: flex;flex-direction: column;justify-content: space-between;align-items: center;padding: 30px 0px;}
.image-collage-holder .col-pd{padding: 0px 10px !important;}
.w3_megamenu .dropdown a,
.w3_megamenu .dropdown-menu  a {color:#656565;}
.w3_megamenu .dropdown-menu > li > a {padding:6px 15px;}
.w3_megamenu .navbar-nav > li > .dropdown-menu {margin-top:1px;}
.w3_megamenu i {color:#BFBFBF}
.w3_megamenu .dropdown-menu {box-shadow:none;border:1px solid #efefef;padding:0;}
.w3_megamenu .form-control {margin-top:10px;border:1px solid #efefef;}
.w3_megamenu .btn {margin:10px 0 20px}
.w3_megamenu video {max-width: 100%;height: auto;}
.w3_megamenu iframe,
.w3_megamenu embed,
.w3_megamenu object {max-width: 100%;}
.w3_megamenu .google-map {width:100%;border:1px solid rgba(255, 255, 255, 0.5);min-height:200px;}
.w3_megamenu div.google-map {background:rgba(255, 255, 255, 0.5);background: #ffffff;height: 200px;margin: 0 0 0px 0;width: 100%;}
#googlemaps img{max-width:none;}
.w3_megamenu .dropdown-menu .withoutdesc{margin-top:0;padding:15px 20px;display: block;text-align: left;text-transform: none;width: 100%;}
.w3_megamenu a:hover {text-decoration:none}
.w3_megamenu .dropdown-menu .withoutdesc ul li {padding:3px 10px;}
.w3_megamenu .dropdown-menu .withoutdesc ul li:hover,
.w3_megamenu .dropdown-menu .withoutdesc ul li:focus{color:#262626;text-decoration:none;background-color:#f5f5f5 !important}
.w3_megamenu .dropdown-menu .withoutdesc li:last-child {border-bottom:0 solid #fff;}
.w3_megamenu .w3_megamenu-content.withdesc a:after {color: #CFCFCF;content: attr(data-description);display: block;font-size: 11px;font-weight: 400;line-height: 0;margin: 10px 0 15px;text-transform: uppercase;}
.w3_megamenu .dropdown-submenu{position:relative;}
.w3_megamenu .dropdown-submenu>.dropdown-menu{top:0; left:100%; margin-top:0; margin-left:-1px; -webkit-border-radius:0 6px 6px 6px;-moz-border-radius:0 6px 6px 6px; border-radius:0 6px 6px 6px;}
.w3_megamenu .dropdown-submenu:hover>.dropdown-menu{display:block;}
.w3_megamenu .dropdown-submenu>a:after{display:block;content:" ";float:right;width:0;height:0;border-color:transparent;border-style:solid;border-width:5px 0 5px 5px;border-left-color:#cccccc;margin-top:5px;margin-right:-10px;}
.w3_megamenu .dropdown-submenu:hover>a:after{border-left-color:#ffffff;}
.w3_megamenu .dropdown-submenu.pull-left{float:none;}
.w3_megamenu .dropdown-submenu.pull-left>.dropdown-menu{left:-100%; margin-left:10px; -webkit-border-radius:6px 0 6px 6px; -moz-border-radius:6px 0 6px 6px; border-radius:6px 0 6px 6px;}
.w3_megamenu p {font-family: 'Open Sans',sans-serif;font-size: 13px;color:#656565;}
.w3_megamenu .nav,
.w3_megamenu .collapse,
.w3_megamenu .dropup,
.w3_megamenu .dropdown {position: static;}
.w3_megamenu .half {width: 50%;left: auto !important;right: auto !important;}
.w3_megamenu .container {position: relative;}
.w3_megamenu .dropdown-menu {left: auto;}
.w3_megamenu .nav.navbar-right .dropdown-menu {left: auto;right: 0;}
.w3_megamenu .w3_megamenu-content {padding: 15px 25px;background:#fafafa;}
.w3_megamenu .dropdown.w3_megamenu-fw .dropdown-menu {left: 0;right: 0;}
.w3_megamenu .title {font-size:13px;font-weight:bold;margin-top:15px;text-transform:uppercase;border-bottom:1px solid #efefef;padding-bottom:10px;}
.w3_megamenu ul {list-style:none;padding-left:0px;}
/* Responsive Menu */
.responive-nav{ background: #fff; padding: 40px 0; overflow: auto; z-index: 1000;}
.respoinve-nav-list li a{ padding: 20px 30px; border-bottom: 1px solid rgba(255,255,255,0.1);}
.respoinve-nav-list li a:hover{ background: rgba(0,0,0,0.1);}
.respoinve-nav-list > li:last-child > a{ border-bottom: 0;}
.respoinve-nav-list li ul{ margin: 0 0 0 30px;}
.respoinve-nav-list li ul li a{ padding: 15px; margin: 0 0 0 30px;}
.responsive-btn{ display: block; padding: 10px 0; position: absolute; bottom: -57px; z-index: 1; right: 50px;}
.responsive-btn{ display: none;}
/* Logo */
.logo{ float: left;}
/* Navigation */
.navigation > ul > li{ float: left; position: relative;}
.navigation > ul > li:first-child::before{ display: none;}
.navigation > ul > li > a{ font-size: 17px; border-bottom: 2px solid transparent; font-weight: 500; color: #333; text-align: center;
position: relative;}
.navigation > ul > li a i{ position: absolute; top: 0; left: 50%; font-size: 16px; margin: 0 0 0 -10px; color: #636363;}
.navigation>ul>li {margin-right: 25px;}
.navigation>ul>li:last-child{
  margin-right: 0;
}
.navigation > ul > li > a:hover{
  color: #0b4d70;
  border-bottom: 2px solid #0b4d70;
}
/* Dropdown */
.navigation ul li > ul{ list-style: none; margin: 0; padding: 0; top: 80%; border-radius: 0 0 4px 4px; position: absolute; width: 230px; 
visibility: hidden; opacity: 0; background: #fff; z-index: 100; border-bottom: 3px solid;
-webkit-box-shadow: inset 0px 2px 3px 0px rgba(50, 50, 50, 0.24);
-moz-box-shadow: inset 0px 2px 3px 0px rgba(50, 50, 50, 0.24);
box-shadow: inset 0px 2px 3px 0px rgba(50, 50, 50, 0.24);}
.navigation ul li ul li{ position: relative; float: none; border-bottom: 1px solid #e8e8e8;}
.navigation ul li ul li:last-child{ border: 0;}
.navigation ul li ul li a {width: 100%;position: relative;color: #464242;padding: 15px 30px;font-size: 13px;text-transform: uppercase;text-transform: capitalize;text-align: left;line-height: 23px;}
.navigation ul li ul li a:hover {
  color: #0b4d70;}
.navigation ul li ul li a::before{ z-index: -1; content: ""; position: absolute; left: 0; height: 100%; width: 0; top: 0;}
.navigation ul li ul li a:hover::before{ width: 100%;}
.navigation ul li ul li .mega-dropdown a{ padding: 0;}
.navigation ul li ul li a i{ color: #666; position: absolute; right: 10px; top: 50%; margin: -7px 0 0;}
.navigation ul li:hover > ul{ visibility: visible; opacity: 1; top: 100%;}
/* Sub Menu */
.navigation ul li > ul li ul{ left: 110%; top: 0!important;}
.navigation ul li ul li:hover > ul{ visibility: visible; opacity: 1; left: 100%;}
/* Maga Dropdown */
.mega-dropdown-wrapper{ position: relative;}
.mega-dropdown-holder{ position: initial!important;}
.mega-dropdown-holder > ul{ width: 160%!important; top: 80px!important; left: -170px;
-webkit-box-shadow: inset 0px 2px 3px 0px rgba(50, 50, 50, 0.24);
-moz-box-shadow: inset 0px 2px 3px 0px rgba(50, 50, 50, 0.24);
box-shadow: inset 0px 2px 3px 0px rgba(50, 50, 50, 0.24);}
.mega-dropdown-holder:hover > ul{ top: 50px!important;}
.mega-dropdown{ padding: 50px 30px 30px; background: #fff;
-webkit-box-shadow: inset 0px 2px 5px 0px rgba(0,0,0,0.12);
-moz-box-shadow: inset 0px 2px 5px 0px rgba(0,0,0,0.12);
box-shadow: inset 0px 2px 5px 0px rgba(0,0,0,0.12);}
.categories-list h6{ font-weight: bold; text-transform: uppercase; margin-bottom: 20px;} 
.categories-list a{ margin: 0 0 10px; display: block; padding: 0; text-align: left;
text-transform: capitalize; font-size: 12px;}
.categories-list a:last-child{ margin: 0;}
.mega-dropdown .s-product{ text-align: center;}
.mega-dropdown .s-product .s-product-img{ margin: 0 0 10px;}
/* Search Bar */
.search-bar{ float: right; margin: 20px 0 0;}
.search-bar a{ height: 34px; width: 34px; line-height: 32px; text-align: center; border-radius: 100%; color: #fff;
background: #0c2c40; border: 0;}
.search-bar .sub-btn:hover{ color: #fff;}
/* Theme transition Effect */
*:after,
*:before,
a,
p,
h1,
h2,
h3,
h4,
h5,
h6,
button,
.adds-book,
.owl-prev,
.owl-next,
.aurthor-timeline .tabs-nav li.active a i,
.footer-links li,
.plus-icon,
.product-cart-option,
.product-cart-option li,
.s-product-hover,
.service-icon,
.overlay,
.view-page-overlay,
.view-page,
.navigation ul li ul,
.heart-batch,
.service-column.style-2,
.team-column .overlay-padding,
.address-column .address-icon { -webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}
.categories-list h6 {font-weight: bold;text-transform: uppercase;color: #1e293d;}
.col-lg-3.d-none.d-lg-block.btn-options {display: flex !important;justify-content: flex-end;} 
.secure-wallet-list ul {padding-left: 50px;}
.secure-wallet-list ul li {display: inline-block;width: 43%;background: #ffffff;padding: 35px;margin-right: 20px;margin-bottom: 35px;box-shadow: 0px 7px 7px 0px rgb(0 0 0 / 10%);text-align: center;}
.secure-wallet-list ul li img {width: 70px;margin-bottom: 25px;}
.secure-wallet-list ul li h4 {margin-bottom: 0px;font-size: 18px;font-weight: 600;}
.secure-wallet-list ul li:nth-child(2) {transform: translate(0px, 82px);}
.we-offer-course-section {background-position: center;background-repeat: no-repeat;background-size: cover;background-attachment: fixed;border: 1px solid #eee;}
.secure-wallet-detail ul li {font-size: 20px;margin-bottom: 20px;display: flex;align-items: center;}
.secure-wallet-detail ul li:last-child{margin-bottom: 30px;}
.secure-wallet-detail ul li span {background: #727b6c;color: #fff;height: 40px;width: 40px;font-size: 25px;border-radius: 100%;display: flex;align-items: center;justify-content: center;margin-right: 10px;}
.top-header-btn-group {display: flex;justify-content: flex-end;}
.top-header-btn-group ul li {margin-left: 10px;}
	/******* Responsive Navbar ******/
	.sidenav {height: 100%;width: 0;position: fixed;z-index: 1;top: 0;left: 0;background-color: #132034;overflow-x: hidden;transition: 0.5s;z-index: 500;}
	.mobile-nav-item {min-width: 320px;margin: 0 auto;}
	.sidenav a {padding: 15px 0px;text-decoration: none;color: #fff;transition: 0.3s;}
	.btn-outline-primary-mb {padding: 12px 15px !important;border-color: #fff;}
	.sidenav .closebtn {top: 0;right: 25px;font-size: 36px;margin-left: 50px;}
	@media screen and (max-height: 100%) {
	  .sidenav {padding-top: 15px;}
	  .sidenav a {font-size: 18px;}}
	.rigth-reserved-mobile p {color: #fff;float: right;padding-right: 40px;}
	.mobile-menu-icon svg {color: #000;}
	.side-nav-list-menu .side-nav-list li a {padding: 30px;}
	.side-nav-list-menu .side-nav-list li a:hover {text-decoration: underline;}
	.side-nav-list-menu .side-nav-list li:hover {transition: 0.5s;transform: translateY(-5px) scale(1.02);}
	.side-nav-list-menu .side-nav-list li {margin-right: 0;transition: 0.5s;}
	.side-nav-list-menu {justify-content: center;height: 45%;}
	.mobile-nav-reserved p {color: #fff;margin-bottom: 0;}
	.mobile-nav-item {min-width: 320px;margin: 0 auto;}
	.mobile-nav-reserved {min-width: 320px;margin: 0 auto;}
	.sidenav .closebtn {position: absolute;}
	.mobile-header {padding: 0px 20px;border-bottom: 1px solid #cdd9e5;box-shadow: 0px 1px 9px 0px rgb(0 0 0 / 20%);}
  .mobile-banner-slider-text {text-align: center;}
  .mobile-banner {background-color: #0f5dab;height: 380px;}
  .mobile-banner{display: none;}
  .mobile-banner-slider-text h2 {font-size: 30px !important;margin: 20px 0px;} 
  .mobile-banner-slider-text p{font-size: 13px;padding: 0px 20px;margin-bottom: 20px;}
  .dawateislami-logo img {max-width: 50px;}
  .instructions {text-align: center;font-size: 20px;margin: 15vh;}
  .backgroundOverlay {position: fixed;top: 0;right: 0;bottom: 0;left: 0;height: 100%;width: 100%;margin: 0;padding: 0;background: #000000;opacity: .85;filter: alpha(opacity=85);moz-opacity: .85;z-index: 101;display: none;}
  .delayedPopupWindow {display: none;position: fixed;width: auto;max-width: 480px;height: 310px;top: 50%;left: 50%;margin-left: -260px;margin-top: -180px;background-color: #fff;border-radius: 10px;border: 2px solid #333;z-index: 102;padding: 10px 20px;}
  #btnClose {width: 100%;display: block;text-align: right;text-decoration: none;color: #BCBCBC;}
  #btnClose:hover {color: #c90c12;}
  #delayedPopup>div.formDescription {float: left;display: block;width: 44%;padding: 1% 3%;font-size: 18px;color: #666;clear: left;}
  #delayedPopup>div.formDescription h2 {color: #444444;font-size: 36px;line-height: 40px;}
  /*   This is the signup form body  */
  #delayedPopup #mc_embed_signup {float: left;width: 47%;padding: 1%;display: block;font-size: 16px;color: #666;margin-left: 1%;}
  #delayedPopup #mc-embedded-subscribe-form input {width: 95%;height: 30px;font-size: 18px;padding: 3px;margin-bottom: 5px;}
  #delayedPopup #mc-embedded-subscribe-form input:hover {border: solid 2px #40c348;box-shadow: 0 1px 3px #AAAAAA;}
  #delayedPopup #mc-embedded-subscribe-form input:focus {border: solid 2px #40c348;box-shadow: none;}
  #delayedPopup #mc-embedded-subscribe {width: 100% !important;height: 40px !important;margin: 10px auto 0 auto;background: #5D9E62;border: none;color: #fff;}
  #delayedPopup #mc-embedded-subscribe:hover {background: #40c348;color: #fff;box-shadow: none !important;cursor: pointer;}
  #btnClose svg {font-size: 32px;color: #0b4d70;}
  .custom-modal-header img {max-width: 60px;margin-bottom: 20px;}
  .custom-modal-header h3 {font-size: 24px;color: #383434;margin: 0;font-weight: 600;}
  .custom-modal-header p {font-size: 17px;color: #000;margin: 8px 0px 20px;}
  .banner-icon-qaida img{width: 350px;}
  .banner-icon-qaida {position: absolute;right: 23%;top: 14%;}
  .banner-icon-quran img{max-width: 32%;position: absolute;right: 17%;top: 18%;}
  .marathon-text-left{padding-top: 70px;}
  .custom-modal-header {padding-top: 60px;}
  .course-tags .btn-secondary {color: #353434;background-color: #f3f3f3;border-color: #585c61;}
  .secure-wallet-list ul li:hover {background-color: #0b4d70;color: #fff !important;transition: 0.5s;border-radius: 10px;}
  .secure-wallet-list ul li:hover .simple-img{display: none !important;}
  .secure-wallet-list ul li:hover .white-img-hover {display: initial !important;}
  .white-img-hover{display: none;}
  .section-padding.coming-soon-video-holder{padding-top: 200px;}
  .coming-sooon-heading h2 {font-size: 50px;margin-bottom: 0; }
  .footer-course-heading h3 {font-size: 20px;font-weight: 700;color: #fff;margin-bottom: 20px;}
.course-category-footer ul li a{font-size: 18px;font-weight: 500;color: #fff;}
.course-category-footer li:nth-child(3){margin-bottom: 40px;}
.course-category-footer ul li {margin-bottom: 15px;}
  .view-all-course a {color: #507deb !important;}
  .view-all-course a svg {margin-left: 5px;padding-top: 2px;}
  .all-quran-course{padding-bottom: 60px !important;}
  .all-quran-course-holder{background-color: #fff;}
  .important-links li:nth-child(2){display: none;}
  .cen.drop-catgory li a {font-weight: 800;}
  .testimonial-cont .col-md-12{max-width: 75% ;}
  .major-course-card-body h4,
  .major-course-card-body .text-primary {display: none;}
  .m-of-h.section-padding.desk-row.grey-bg.books-category-holder{border-top: 1px solid #eee;}
  .books-category-holder .col-lg-2 .book-category-list li:last-child,
  .books-category-holder .col-lg-6 .book-category-list li:last-child {display: none;}
  .truncate-2.text-center.mb-0.fnt-15{font-size: 12px;line-height: 16px;margin-bottom: 0px;}
  .teach-card span {border: 1px solid #bbb9b9;padding: 15px;border-radius: 100px;margin-bottom: 15px;}
  .teach-card span img {max-width: 40px;}
  .teach-card h4 {font-size: 23px;font-weight: 600;color: #3e3e3e;}
  .teach-card p{font-size: 15px;line-height: 25px;}
  .why-choose-card {box-shadow: 0 4px 20px 1px rgb(0 0 0 / 3%), 0 1px 4px rgb(0 0 0 / 4%);padding: 20px;background-color: #fff;display: flex;min-height: 190px;border-radius: 6px;}
  .why-choose-card .choose-icon {margin-right: 20px;}
  .why-choose-card .choose-icon img {max-width: 50px;}
  .why-choose-card .choose-detail h3{font-size: 22px;font-weight: 600;color: #2d2a2a;}
  .why-choose-card .choose-detail p{font-size: 15px;color: #777;}
  .kids-banner-bg{height: 500px;background-repeat: no-repeat;background-size: cover;}
  .books-category-holder hr {border-top: 1px solid #777b7e;width: 100%;margin: 40px 0px;}
  .get-in-touch ul li svg,
  .social-icon-list li a svg {margin-right: 10px;} 
  .download-app-list li a img {max-width: 130px;}
  .catogery.container-fluid.pt-60 {padding-bottom: 0;}
  .books-category-holder .mb-20{margin-bottom: 8px !important;}
  .social-icon-list .mb-10{margin-bottom: 5px !important;}
  .m-of-h.pb-70.grey-bg.footer-holder {padding: 20px 0px !important;}
  .m-of-h.section-padding.desk-row.books-category-holder{padding: 50px 0px;}
  .course-detail-page-v2{height: 130px;}
  .detail-v2-banner-caption{padding: 80px 0px;}
  .detail-v2-banner-caption-heading p {font-size: 16px; margin: 0px 0px 30px 0px;color: #3a343a;line-height: 25px;}
  .course-detail-body{background-color: #fff !important;}
  .detail-v2-banner-caption-heading h1{color: #3a343a;font-size: 38px;}
  .detail-v2-banner-caption-heading .btn-success {padding: 8px 25px;margin-right: 10px;font-size: 15px;}
  .detail-v2-banner-caption-heading span {color: #3a343a;font-size: 18px;}
  .course-v2-detail {display: flex;justify-content: space-between;}
  .course-v2-detail li{display: flex;align-items: center;padding-right: 90px;border-right:1px solid #e4b76f;}
  .course-v2-detail li:last-child{margin: 0;padding: 0;border:0;}
  .course-v2-detail li .course-v2-img{margin-right: 10px;}
  .course-v2-detail li .course-v2-img img {width: 40px;}
  .course-v2-heading-detail p {font-size: 14px; color: #0b4d70;}
  .course-v2-heading-detail span {color: #3a343a;font-weight: 700;}
  .course-des-holder {padding: 10px 0px;background: #efb957;border: 1px solid #e4b76f;}
  .course-des-holder .nav-pills .nav-item .nav-link{border-radius: 0;border-bottom: 2px solid transparent;color: #000; padding-bottom: 5px;font-size: 18px;font-weight: 500;}
  .course-des-holder .nav-pills .nav-item {margin-right: 10px;}
  .course-des-holder .nav-pills .nav-item:last-child{margin-right: 0;}
  .course-des-holder .nav-pills .nav-item .nav-link.active {background: transparent;color: #ddd;border-bottom: 2px solid #007bff;border-radius: 0;}
  .course-overview-holder h2,
  .more-courses-like-title {color: #3a343a;margin-bottom: 20px;line-height: 35px;font-size: 28px;}
  #topic-we-cover .topic-heading{color: #fff;}
  .course-overview-main{padding: 50px 0px;}
  .course-overview-holder p {color: #3a343a;font-size: 15px;margin-bottom: 20px;line-height: 24px;}
  .topic-we-cover-holder{background-size: cover; background-position: center; background-repeat: no-repeat;}
  .topic-cover-list h4{color: #3a343a;}
  .topic-cover-list li,
  .course-for-list li {list-style: disc;margin-left: 30px;margin-bottom: 8px;color: #121212;font-size: 18px;}
  #topic-we-cover .course-text-list li {color: #fff;}
  .topic-cover-list li:nth-child(2){margin-top: 20px;}
  .what-we-achieve-holder .topic-cover-list li {list-style: none;display: flex;}
  .what-we-achieve-holder .topic-cover-list li:nth-child(2){margin-top: 0;}
  .achive-text h4 {font-size: 18px;margin-left: 7px;color: #000;line-height: 25px;}
  .achive-img img {width: 22px;}
  .course-for-heading{font-size: 18px !important;}
  .share-this-course{background-color: #000;}
  .share-course-icon li {margin-right: 20px;}
  .share-course-icon li:last-child {margin-right: 0;}
  .share-course-icon li a {font-size: 20px;}
  .share-course-icon {margin-bottom: 20px;}
  .course-detail-textarea p {font-size: 18px;line-height: 28px;font-weight: 500;color: #000;}
  .course-text-list strong{font-size: 18px;color: #000;display: flex;margin-bottom: 13px;}
  .course-text-list li {margin-bottom: 5px;font-size: 18px;color: #000;}
  .course-text-list li:last-child{margin-bottom: 0;}
  .topic-heading{font-size: 33px;font-weight: 600;color: #000;}
  .course-hashtag{color: #005cbf;font-size: 18px;}
  .course-hashtag-text{font-size: 18px !important;margin-bottom: 0px !important;color: #fff !important;line-height: 29px !important;}
  .detail-v2-banner-image::after{content: "";display: block;height: 125px;width: 129px;position: absolute;top: 30px;right: 0px;border-top: 5px solid #0b4d70;border-right: 5px solid #0b4d70;transform: translateX(-40px);transition: 0.3s !important;opacity: 0;}
  .detail-v2-banner-image::before{content: "";display: block;height: 125px;width: 129px;position: absolute;bottom: 31px;left: 2px;border-left: 5px solid #0b4d70;transform: translateX(40px);border-bottom: 5px solid #0b4d70;transition: 0.3s !important;opacity: 0;}
  .detail-v2-banner-image:hover::before{content: "";opacity: 1;bottom: -11px;transform: translateY(0);transition: 0.3s !important;}
  .detail-v2-banner-image:hover::after{content: "";opacity: 1;top: -11px;transition: 0.3s !important;transform: translateY(0);}
  .detail-v2-banner-image img {position: relative;z-index: 99;}
  .section-padding.course-overview-holder.share-this-course h2{color: #fff;}
  .share-course-icon.justify-content-center.d-flex li a {background-color: #0b4d70; height: 45px; border-radius: 100%; width: 45px; display: flex; align-items: center; justify-content: center; color: #fff;}