/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

::-webkit-scrollbar-track{
  margin: 35px 0;
  border-radius: 10px;
}
::-webkit-scrollbar{
	width: 5px;
}
::-webkit-scrollbar-thumb{
	background-color: #98B4F7;
	border-radius: 10px;
}
/* table */
table tbody tr:hover>td, table tbody tr:hover>th{
  background-color: transparent;
}
 table tbody>tr:nth-child(odd)>td, table tbody>tr:nth-child(odd)>th{
  background-color: transparent;
}
/* overlay */
.overlay{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 99999;
}
.topic-expired-notice{
	position: fixed;
    top: 20px;
    right: 20px;
    background: var(--e-global-color-primary);
    color: #fff;
    font-size: 13px;
    padding: 16px;
    border-radius: 10px;
    max-width: 320px;
    z-index: 9999;
}
.topic-expired-notice ul{
	margin: 8px 0 0;
	list-style: none;
    padding-left: 0;
}
.topic-expired-notice > a{
    position: absolute;
    top: -20px;
    right: -10px;
    color: var(--e-global-color-primary);
    font-size: 20px;
}

/* ========== HOME PAGE ========== */
.home .swiper-wrapper{
	width: auto;
	height: auto;
}

/* ========== Login / Registration page ========== */
#learndash-registration-wrapper .order-overview{
	display: none!important;
}
.learndash_form_header {
	display: grid;
	grid-template-columns: 65% 35%;
	margin-bottom: 30px;
	align-items: end;
}
.learndash_form_header h3 {
	font-size: 34px;
	font-weight: 700;
	color: #324DB2;
}
.learndash_form_header p {
	font-size: 14px;
	color: #55575D;
	font-weight: 400;
	line-height: 1.5;
}
.learndash_form_header img {
	height: 64px;
	width: auto;
	display: block;
	margin-left: auto;
}
.registration-login{
	text-align: center;
	margin-top: 10px;
	color: #191B24;
}
#loginform, #loginform > p{
	position: relative;
}
#loginform > a{
	color: #374151;
	font-size: 16px;
	font-weight: 600;
	position: absolute;
	right: 0;
	z-index: 1;
}
.ld-login-modal-form #loginform > a{
	display: none;
}
.registration-login-form #loginform .login-username:before,.registration-login-form #loginform .login-password:before{
	position: absolute;
	color: #55575D;
	top: 2.4em;
	left: 1em;
	font-size: 16px;
	font-family: "Font Awesome 5 Free";
}
.registration-login-form #loginform .login-username:before {
	content: '\f2bd';
}
.registration-login-form #loginform .login-password:before {
	content: '\f023';
	font-weight: 900;
}
#loginform .login-username label:after,#loginform .login-password label:after{
	content: " *";
	color: red;
}
.registration-login-form > .show-register-form {
	text-align: center;
	margin-top: 10px;
	color: #191B24;
}
.registration-login-form > .show-register-form > a, .registration-login-link {
	color: #3F60DE;
	font-weight: bold;
	position: relative;
}
.registration-login-form > .show-register-form > a:after, .registration-login-link:after {
	position: absolute;
	content: '';
	height: 1px;
	width: 100%;
	background-color: #3F60DE;
	left: 0;
	bottom: -3px;
}
#learndash_registerform label, #loginform label{
	color: #000;
	font-weight: bold;
	margin-bottom: 10px !important;
}
#learndash-registration-wrapper #learndash_registerform input[type=text], #learndash-registration-wrapper #learndash_registerform input[type=password], #learndash-registration-wrapper #loginform input[type=text], #learndash-registration-wrapper #loginform input[type=password] {
	color: #000;
	border: 1px solid #55575D;
	padding: 12px;
	border-radius: 6px;
}
#learndash-registration-wrapper #loginform input[type=text], #learndash-registration-wrapper #loginform input[type=password] {
	padding: 12px 2.5em;
}
#learndash_registerform input[type=text]:focus, #learndash_registerform input[type=password]:focus, #loginform input[type=text]:focus, #loginform input[type=password]:focus{
	border-color: #3f60de!important;
}
#learndash_registerform #wp-submit{
	margin-top: 10px!important;
}
#learndash_registerform #wp-submit, #loginform #wp-submit{
	padding: 20px;
	background: #3f60de;
	border-radius: 6px;
	color: #fff;
	display: block;
	width: 100%;
	font-size: 18px;
	text-transform: uppercase;
	font-weight: 500;
	cursor: pointer;
	margin: 0;
}
.learndash-registration-field{
	position: relative;
}
.show-password{
	position: absolute!important;
	padding: 5px;
	right: 1%;
	cursor: pointer;
	top: 1.9em;
}
.show-password:before{
	content: '\f06e';
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 16px;
}
.show-password.show:before{
	content: '\f070';
}
#learndash-registration-wrapper .registration-login-form {
	width: 70%;
	margin: auto;
	background: #fff;
	border-radius: 24px;
	padding: 40px;
	box-shadow: 0px 2px 21px 0px #0000001A;
}
.learndash_registerform_wrapper {
	width: 70%;
	margin: auto;
	padding: 40px;
	border-radius: 24px;
	background: #fff;
	box-shadow: 0px 2px 21px 0px #0000001A;
}
.learndash-registration-field.learndash-registration-field-first_name, .learndash-registration-field.learndash-registration-field-last_name {
	width: 48%;
	display: inline-block;
}
.learndash-registration-field.learndash-registration-field-first_name {
	float: right;
}
#user-course-form > *, #user-course-form label input[type="radio"]{
	display: none;
}
.enroll-state-wrapper{
	display: flex;
	justify-content: center;
	margin-bottom: 50px;
	align-items: center;
	gap: 20px;
	margin-left: -100px;
}
.enroll-state-wrapper .back-btn{
	font-size: 16px;
	text-transform: uppercase;
	color: #3F60DE;
	font-weight: 600;
	visibility: hidden;
	cursor: pointer;
}
.enroll-state-wrapper .enroll-state{
	height: 12px;
	width: 454px;
	background: #B2BFF2;
	border-radius: 100px;
}
.enroll-state-wrapper .enroll-state .progress{
	height: 100%;
	width:0;
	background: #3F60DE;
	display: block;
	border-radius: 100px;
	transition: all 1s;
}
.radio-button:hover {
	outline-color: transparent !important;
}
.radio-button.active {
	transform: scale(.97);
	transition: all .3s!important;
}
.enroll-steps.active{
	display: block!important;
}
#user-course-form > button.active, #user-course-form .confirm-checkbox.active{
	display: block;
	position: absolute;
	max-width: 600px;
	left: 50%;
	transform: translateX(-50%);
}
.enroll-course-container {
	position: relative;
	transition: height 1s;
}
.enroll-course-container .greeting {
	text-align: center;
	display: none;
	position: relative;
}
.enroll-course-container .greeting > p:first-child {
	color: #3F60DE;
	font-size: 20px;
	font-weight: 700;
	padding-bottom: 10px;
}
.enroll-course-container .greeting > p:nth-child(2) {
	color: #191B24;
	font-size: 26px;
	font-weight: 600;
	line-height: 1.3em;
}
.enroll-course-container .greeting > img {
	margin-top: 40px;
	width: 198px;
	margin: 40px auto;
	display: block;
}
.enroll-course-container .greeting > button {
	padding: 15px 20px;
	border: none;
	background: #3f60de;
	border-radius: 6px;
	color: #fff;
	font-weight: 600;
	text-transform: uppercase;
	cursor: pointer;
}
#user-course-form .enroll-steps{
	position: absolute;
	top: 0;
	width: 100%;
}
#user-course-form{
	display: block;
	margin: auto;
	position: relative;
}
#user-course-form > div > label{
	display: block;
	font-size: 34px;
	margin-bottom: 10px;
	color: #191B24;
	text-align: center;
	font-weight: 700;
	line-height: 1.3em;
}
#user-course-form label span{
	font-size: 12px;
	color: #666;
	display: inline-block;
	line-height: 1.3;
}
#user-course-form label p{
	font-size: 16px;
	color: #191B24;
	line-height: 1.3;
	font-weight: 500;
}
#user-course-form label p a{
	color: #3F60DE;
	font-weight: 700;
}
#user-course-form label.radio-button{
	border: 1px solid #3F60DE;
	padding: 8px 15px;
	border-radius: 6px;
	outline: 1px solid #7E8084;
	cursor: pointer;
	background: #fff;
	color: #191B24;
	font-size: 16px;
	transition: all .5s;
}
#user-course-form label.radio-button input{
	margin-right: 10px;
}
#user-course-form select{
	width: 100%;
	border: 1px solid #7E8084;
	padding: 8px 15px;
	background: #fff;
	color: #191B24;
	font-size: 16px;
	border-radius: 6px;
}
#user-course-form > div > div {
	margin: 40px auto 0;
	max-width: 600px;
	display: grid;
	gap: 20px;
}
#user-course-form > div:nth-child(3) > div {
	max-width: 100%;
	display: flex;
	flex-wrap: wrap;
	text-align: center;
	justify-content: center;
}
#user-course-form > div:nth-child(3) > div > label{
	width: 20%;
	padding: 20px;
	outline: none;
}
#user-course-form > div:nth-child(3) > div > label:hover{
	background-color: #F5F7FD;
}
#user-course-form > div:nth-child(3) > div > label img{
	height: 120px;
	display: block;
	margin: 0 auto 10px;
}
#user-course-form button, .thank-you a{
	margin-top: 20px;
	padding: 8px;
	background: #3f60de;
	border-radius: 6px;
	color: #fff;
	width: 100%;
	font-size: 16px;
	text-transform: uppercase;
	font-weight: 500;
	cursor: pointer;
	border: none;
	top: 12em;
}
.confirm-checkbox{
	font-weight: 500;
	color: #000;
	margin-top: 15px;
	display: block;
	top: 9em;
	line-height: 1.2em;
}
.confirm-checkbox.not-checked{
	color: #d10808;
}
.enroll-course-container .thank-you{
	display: none;
	max-width: 600px;
	margin: auto;
	text-align: center;
	align-content: center;
	padding: 50px 40px;
	box-shadow: 0px 6px 25px 0px #00000033;
	border-radius: 20px;
	background-color: #fff;
}
.enroll-course-container .thank-you h3{
	font-size: 26px;
	text-transform: capitalize;
	line-height: 1.3;
	font-weight: bold;
	color: #3f60de;
	margin-bottom: 10px;
}
.enroll-course-container .thank-you img{
	height: 170px;
	margin: 10px 0 30px;
}
.enroll-course-container .thank-you p{
	color: #333;
	font-size: 16px;
}
.enroll-course-container .thank-you a{
	display: block;
	width: max-content;
	text-transform: none;
	padding: 5px 30px;
	margin: 35px auto 0;
}
#user-course-form .loader{
	height: 8px;
	background: repeating-linear-gradient(-90deg, #3f60de 0 15px, #0000 0 20px) left / 200% 100%;
	width: 600px;
	animation: l3 15s infinite linear;
	top: 15.5em;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
}
@keyframes l3 {
	100% {
		background-position:right
	}
}
@keyframes zoom-in {
	0% {
		transform: scale(.6);
	}
	100% {
		transform: scale(1);
	}
}
@keyframes fade-in {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
@keyframes slide-in-left {
	from {
		opacity: 0;
		left: -30%;
	}
	to {
		opacity: 1;
		left: 0;
	}
}
@keyframes slide-out-left {
	from {
		opacity: 1;
		left: 0;
	}
	to {
		opacity: 0;
		left: -30%;
	}
}
@keyframes rotate {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0);
		-webkit-transform-origin: center center;
		transform-origin: center center 
	}
	50% {
		-webkit-transform: rotate(180deg);
		transform: rotate(180deg);
		-webkit-transform-origin: center center;
		transform-origin: center center 
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
		-webkit-transform-origin: center center;
		transform-origin: center center 
	}
}

/* ========== Login popup ========== */
.learndash-wrapper .ld-alert .ld-alert-icon.ld-icon-alert{
	line-height: 1.3em;
	font-size: 30px;
	width: 40px;
	height: 40px;
	align-content: center;
	margin: 0;
}
.learndash-wrapper .ld-alert .ld-alert-icon.ld-icon-alert:before{
	margin: 2px;
}
.learndash-wrapper .ld-alert .ld-alert-messages{
	color: #000;
	line-height: 1.5em;
}
.ld-modal{
	z-index: 100000!important;
	position: fixed !important;
}
.ld-modal-heading{
	font-weight: 600!important;
}
.ld-login-modal-form #loginform{
	text-align: left;
}
.ld-login-modal-form #loginform > p:before {
	color: #3f60de;
}
.ld-login-modal-form #loginform label{
	color: #000!important;
	font-weight: 500!important;
	display: flex;
	gap: 3px;
}
.ld-login-modal-form #loginform input[type=text], .ld-login-modal-form #loginform input[type=password]{
	color: #000;
	background: transparent;
	border: 1px solid #ccc;
	border-radius: 5px;
	padding: 12px 2.5em;
}
.ld-login-modal-form #loginform input[type=text]:focus, .ld-login-modal-form #loginform input[type=password]:focus{
	border-color: #3f60de;
}
.ld-login-modal-form #loginform .login-password, .registration-login-form .login-password{
	padding: 0;
	position: relative;
}
.ld-login-modal-form #loginform #wp-submit{
	margin: 10px 0;
	padding: 10px 20px;
}
.learndash-wrapper .ld-login-modal .ld-login-modal-register .ld-button{
	transition: all .5s;
}
.learndash-wrapper .ld-login-modal .ld-login-modal-register .ld-button:hover{
	box-shadow: 0 0 0 3px #fff !important;
}
/* ========== Favourites ========== */
.simplefavorite-button{
	cursor: pointer;
}
/* ========== CHECKOUT PAGE ========== */
.woocommerce-checkout #payment{
    background-color: rgba(218,228,252,0.5);
}
.woocommerce-checkout #payment div.payment_box{
    background-color: #DAE4FC;
}
.woocommerce-checkout #payment div.payment_box:before{
    border-bottom-color: #DAE4FC;
}
#place_order{
    background-color: var(--e-global-color-primary);
}
