/*-----------------------------------------------------------------------------------

    Template Name: 
    Template URI: 
    Description: This Is Education Landing Page HTML5 Template.
    Author: Rayhan Khan
    Author URI: 
    Support: admin@gmail.com
    Version: 1.0

-----------------------------------------------------------------------------------

    CSS INDEX
    ===================

    1. preloader area here css
    2. top up button area css
    3. header area here css
    4. hero area here css
    5. logo carousel area here
    6. about area here
    7. testimonial video area here css
    8. online course area here css
    9. register area here css
    10. testimonial area here css
    11. product area here css
    12. blog area here css
    13. footer area here css
    14. about us page area here
    15. course page area here
    16. courses details page area here
    17. blog page area here
    18. blog details page area here
    19. contact us page area here
    20. home 2 area here
    21. home 3 area here
    
-----------------------------------------------------------------------------------*/




/* 
--------------------------
1. preloader area here css
--------------------------
*/

html {
  scroll-behavior: smooth;
}

.preloder {
	width: 100%;
	height: 100vh;
	position: fixed;
	background: var(--gradient);
	top: 0;
	left: 0;
	z-index: 10000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.pre-loading {
	position: relative;
	width: 70px;
	height: 70px;
	background: transparent;
	border: 10px solid var(--black);
	border-top: transparent;
	border-bottom: transparent;
	border-radius: 50%;
	animation: loading 1.2s linear infinite;
}

@keyframes loading {
	25% {
		background: transparent;
	}

	to {
		transform: rotate(360deg);
	}
}

/* 
--------------------------
2. top up button area css
--------------------------
*/
.topUp-btn {
	display: none;
	position: fixed;
	bottom: 36px;
	right: 28px;
	z-index: 1000;
	border: transparent;
	background: var(--Primary-color);
	width: 50px;
	height: 50px;
	border-radius: 50%;
	box-shadow: 0 0 15px rgb(238 40 91 / 50%);
    transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
}
.topUp-btn:hover {
	background: var(--black);
}

.topUp-btn i {
    font-size: 24px;
    font-weight: 600;
    color: var(--white);
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
}
.topUp-btn:hover i {
	color: var(--Primary-color);
}



/* 
--------------------------
3. header area here css
--------------------------
*/
.mobile-menu {
	display: none;
}
.off-canvas-menu{
	display: none;
}
/* header  */
.header-area {
    height: 100px;
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    background: #fff;
}
.header-wrapper {
	width: 100%;
}

.header-navigation ul {
	display: flex;
}

.header-icons ul {
	display: flex;
}

.header-content {
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
}

/* sticky header  */
.header-area.sticky {
    left: 0;
    right: 0;
    margin: auto;
    position: fixed;
    top: 0;
    width: 100%;
    height: 60px;
    z-index: 999;
    padding: 0px 0;
    background: #fff;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
    animation: 600ms ease-in-out 0s normal none 1 running fadeInDown;
    -webkit-animation: 600ms ease-in-out 0s normal none 1 running fadeInDown;
}
.sticky .header-navigation a {
    padding: 16px 0px;
}
/* logo  */
.header-logo a {
    max-width: 180px;
	display: inline-block;
}
/* nav  */
.header-navigation li {
    margin-left: 20px;
    margin-right: 20px;
    position: relative;
}
.header-navigation a {
    font-family: 'Roboto', sans-serif;
    font-size: 18px;
    font-weight: 700;
    text-transform: capitalize;
    line-height: 28px;
    letter-spacing: -0.1px;
    padding: 36px 0px;
    display: inline-block;
    color: var(--gray);
    transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
}
.header-navigation a i {
    font-size: 14px;
    margin-left: 6px;
}
.header-navigation li a.active,
.header-navigation li a:hover {
	color: var(--black);
}
/* icon  */
.header-icons li {
	line-height: 0;
	margin-left: 24px;
}

.header-icons li a {
	display: inline-block;
	line-height: 0;
}

.header-icons li a i {
	font-size: 16px;
	line-height: 100%;
	color: #8E8F9D;
}
.header-icons li a:hover i {
	color: var(--black);
}
/* sub menu  */
.sub-menu {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 120%;
    left: 0;
    width: 240px;
    padding: 24px 0px;
    background: white none repeat scroll 0 0;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
    border-top: 4px solid var(--Primary-color);
    border-bottom: 4px solid var(--Primary-color);
    visibility: hidden;
    opacity: 0;
    z-index: -2;
    transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
}
.main-menu li:hover .sub-menu {
    top: 100%;
    visibility: visible;
    opacity: 1;
	z-index: 100;
}
.sub-menu li a {
    padding: 8px 0px !important;
    font-size: 14px;
    line-height: 24px;
}

/* 
--------------------------
4. hero area here css
--------------------------
*/
.hero-area {
    background: var(--main-bg);
    position: relative;
    overflow: hidden;
    margin-top: 100px;
}
.hero-img {
	display: inline-block;
	position: absolute;
	bottom: 0;
	z-index: 1;
	width: 530px;
	left: calc(52% + 150px); 
}
/* .hero-img::after {
	content: '';
	position: absolute;
	width: 113%;
	height: 100%;
	top: 26%;
	left: 0;
	background: url('../img/pattern/hero-pattern.png');
	background-repeat: no-repeat;
	background-size: 100%;
	z-index: -1;
} */
.hero-items {
	padding: 110px 0px;
}
.hero-main-content h1 {
	font-weight: 800;
	font-size: 80px;
	line-height: 75px;
	letter-spacing: 0.05em;
	margin-bottom: 30px;
}
.hero-main-content h1 span {
	color: var(--Primary-color);
}

.hero-main-content p {
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
	font-size: 20px;
	line-height: 40px;
	margin-bottom: 64px;
}
/* btn  */
.get-started-btn {
	display: inline-block;
}
.get-started-btn a {
    font-weight: 500;
    font-size: 18px;
    line-height: 32px;
    display: flex;
    align-items: center;
    text-transform: capitalize;
}
.get-started-btn a:hover {
	color: var(--Primary-color);
}

.get-started-btn span i {
    font-size: 18px;
    transform: rotate(-45deg);
}

.get-started-btn span {
	width: 60px;
	height: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--gradient);
	border-radius: 50%;
	color: #fff;
	margin-left: 27px;
}
/* counter up  */
.hero-counter {
	background: var(--gradient);
}

.hero-counter-items {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 220px;
}

.counter {
    font-weight: 600;
    font-size: 44px;
    line-height: 54px;
    color: #fff;
    margin-bottom: 4px;
}

.sigle-counter-box p:nth-child(2) {
	font-weight: 500;
	font-size: 20px;
	line-height: 30px;
	color: #fff;
}

/* 
--------------------------
5. logo carousel area here
--------------------------
*/
.owl-carousel .owl-item img {
    width: auto;
    max-width: 100%;
}

/* 
--------------------------
6. about area here
--------------------------
*/
.about-area {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

/* patterns  */
.patterns {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0%;
    z-index: -1;
}
.patterns img{
    position: absolute;
}


.about-pattern img {
    bottom: 0;
    right: 0;
    max-width: 39%;
}
.about-big-img {
	padding-right: 49px;
}

.about-big-img img {
	width: 100%;
}
.upgrade-content h1, .about-content h1 {
    margin-bottom: 24px;
    line-height: 45px;
    font-size: 40px;
}
.about-content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 0px 27px;
	height: 100%;
}
.about-content h1{
    margin-bottom: 24px;
}
.about-content p {
	font-size: 18px;
	line-height: 32px;
}
.about-small-img {
	display: flex;
	justify-content: end;
	align-items: center;
	height: 100%;
}

/* 
--------------------------
7. testimonial video area here css
--------------------------
*/
.testimonial-video-area {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.tva-left-overlay {
	position: absolute;
	width: 56%;
	height: 100%;
	top: 0;
	left: 0;
	background: var(--gradient);
	z-index: -1;
}

.tva-right-overlay {
	position: absolute;
	width: 44%;
	height: 100%;
	top: 0px;
	right: 0px;
	background: url("../img/photo/video-img.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	z-index: -1;
}

.testimonial-video-area .container {
	padding-left: 0;
	padding-right: 0;
}

.tva-content {
	padding: 90px 0px;
}

.tva-content h3 {
	font-weight: 500;
	font-size: 36px;
	line-height: 46px;
	color: var(--white);
	padding-right: 171px;
	margin-bottom: 48px;
}

.tva-content p {
	font-size: 24px;
	font-weight: bold;
	line-height: 36px;
	color: #fff;
	padding-left: 46px;
}

.tva-content p:nth-child(2) {
	position: relative;
}

.tva-content p:nth-child(2)::after {
	content: '';
	position: absolute;
	width: 30px;
	height: 1px;
	background: var(--white);
	top: 50%;
	left: 0;
	margin-top: -1px;
}

.tva-content p:nth-child(3) {
	font-size: 18px;
	font-weight: 500;
	line-height: 32px;
	opacity: 0.8;
	margin-top: 8px;
}
/* video  */
.tva-video {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: end;
	align-items: center;
}

.tva-video a {
	width: 92px;
	height: 92px;
	background: rgba(255, 255, 255, 0.1);
	border: 3px solid #FFFFFF;
	box-sizing: border-box;
	backdrop-filter: blur(30px);
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	position: relative;
}

.tva-video a i {
	font-size: 26px;
	color: #fff;
}

.tva-video a::after,
.upgrade-video a::after {
    content: '';
    position: absolute;
	opacity: 0;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border: 1px solid #fff;
    animation: spin 1000ms linear infinite;
    -webkit-animation: spin 1000ms linear infinite;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

@keyframes spin {
    0% {
        opacity: 1;
        transform: scale(1);
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        -moz-transform: scale(1);
}

    100% {
        opacity: 0;
        transform: scale(1.4);
        -webkit-transform: scale(1.4);
        -ms-transform: scale(1.4);
        -o-transform: scale(1.4);
        -moz-transform: scale(1.4);
}
}

/* 
--------------------------
8. online course area here css
--------------------------
*/
.section-title  h1 {
	margin-bottom: 64px;
}

.online-team-area {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.ota-pattern img {
    right: 0%;
    bottom: 12%;
    max-width: 8%;
}
.ota-items {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-gap: 30px;
}

.ota-item {
    position: relative;
    background: #fff;
    overflow: hidden;
}

.ota-thumb-img {
	width: 100%;
	height: 163px;
	background-repeat: no-repeat;
	background-size: cover;
}

.ota-thumb-img1 {
	background-image: url("../img/course/online1.jpg");
}
.ota-thumb-img2 {
	background-image: url("../img/course/online2.jpg");
}
.ota-thumb-img3 {
	background-image: url("../img/course/online3.jpg");
}

.ota-thumb-img4 {
	background-image: url("../img/course/online4.jpg");
}
.ota-thumb-img5 {
	background-image: url("../img/course/online5.jpg");
}

.ota-thumb-img6 {
	background-image: url("../img/course/online6.jpg");
}
.ota-thumb-img7 {
	background-image: url("../img/course/online7.jpg");
}
.ota-thumb-img8 {
	background-image: url("../img/course/online8.jpg");
}
.ota-thumb-img9 {
	background-image: url("../img/course/online2.jpg");
}
.ota-items .pricing {
	width: 64px;
	height: 64px;
	background: var(--gradient);
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	position: absolute;
	margin-top: -32px;
	right: 23px;
}
.ota-items .pricing p {
	color: var(--white);
	font-size: 16px;
	line-height: 18px;
	font-weight: 700;
}
.ota-items .pricing p span {
	font-size: 12px;
}
.ota-reating {
	display: flex;
}

.ota-reating li {
	display: block;
	line-height: 0;
}

.ota-reating a {
	display: inline-block;
	padding-right: 6px;
}
.ota-reating li a i {
	color: #FFB60A;
}
.ota-content {
	padding: 20px 24px 24px 24px;
	
	border-top: none;
}
.ota-heading {
    margin-top: 12px;
}
.ota-heading a {
	font-weight: 600;
	font-size: 24px;
	line-height: 36px;
	letter-spacing: -0.1px;
	display: block;
	transition: inherit;
	-webkit-transition: inherit;
	-moz-transition: inherit;
	-ms-transition: inherit;
	-o-transition: inherit;
}
.ota-content hr {
	margin: 12px 0px;
	color: inherit;
	background-color: #F5F5F5;
	border: 0;
	opacity: 1;
}
.ota-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.ota-meta li:first-child {
    margin-right: 30px;
}

.ota-meta a {
	color: var(--gray);
    display: flex;
    align-items: center;
	font-size: 16px;
	line-height: 28px;
	font-weight: 400;
}

.ota-meta a span {
	margin-left: 8px;
}
.ota-meta a i {
	color: var(--Primary-color);
}

/* ota-overlay   */
.ota-overlay {
    position: absolute;
    background: var(--gradient);
    height: 100%;
    width: 100%;
    top: 0;
    left: -104%;
    z-index: 2;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    visibility: hidden;
    opacity: 0;
    transition: all .4s ease;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
}
.ota-overlay .pricing {
    position: relative;
    right: inherit;
    margin: 0;
    padding: 0;
    margin-bottom: 30px;
}
.ota-overlay .ota-content {
    padding: 0px 24px;
    border: none;
    border-top: none;
}
.ota-overlay .ota-reating {
    justify-content: center;
}
.ota-overlay .ota-reating a {
    padding: 0px 4px;
}
.ota-overlay .ota-reating li a i {
    color: var(--white);
}
.ota-overlay .ota-heading a {
	color: var(--white);
	transition: inherit;
	-webkit-transition: inherit;
	-moz-transition: inherit;
	-ms-transition: inherit;
	-o-transition: inherit;

}
.ota-overlay .ota-content hr {
    opacity: 0.2;
	margin-top: 24px;
}
.ota-overlay .ota-heading {
    margin-top: 14px;
}
.ota-overlay .ota-meta {
    justify-content: center;
}
.ota-overlay .ota-meta li:first-child {
    margin-right: 12px;
}
.ota-overlay .ota-meta li:last-child {
    margin-left: 12px;
}
.ota-overlay .ota-meta a span {
    color: var(--white);
}
.ota-overlay .ota-meta a i {
    color: var(--white);
}
.ota-item:hover .ota-overlay {
	left: 0;    
    visibility: visible;
    opacity: 1;
}
.ota-overlay .ota-meta a{
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
}
.ota-overlay .ota-meta a:hover{
	opacity: .5;
}
.ota-overlay .ota-heading a{
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
}
.ota-overlay .ota-heading a:hover{
	opacity: .5;
}

/* 
--------------------------
9. register area here css
--------------------------
*/
.register-area {
	background-color: var(--main-bg);
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.register-pattern img {
    left: 0;
    bottom: 0;
    max-width: 47%;
}
.register-counter {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.register-counter h4 {
	font-size: 24px;
	line-height: 36px;
	font-weight: 600;
	margin-bottom: 16px;
}
.register-counter h4 span {
	background: var(--gradient);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.register-counter h1 {
	font-weight: 700;
	font-size: 52px;
	line-height: 58px;
}

.register-counter ul {
	margin-top: 56px;
}
/* form  */
.register-form {
	padding: 64px 40px;
	background: var(--white);
}

.register-form h4 {
	font-size: 24px;
	font-weight: 600;
	line-height: 36px;
	margin-bottom: 24px;
}
.register-form form input {
    font-size: 16px;
    line-height: 28px;
    font-weight: 400;
    text-transform: capitalize;
    background: #FFFFFF;
    border: 1px solid rgba(48, 48, 49, 0.1);
    padding: 13px 24px 13px 23px;
    margin-bottom: 16px;
    width: 100%;
}

.register-form form input:focus {
	outline: none !important;
}

.register-form form input::placeholder {
	color: var(--gray);
}

.register-form form .form-group:nth-child(3) input {
	margin-bottom: 0px;
}
/* main button  */
.main-btn {
    font-weight: 500;
    font-size: 18px;
    line-height: 36px;
    text-transform: capitalize;
    color: var(--white) !important;
    background: var(--gradient);
    padding: 20px;
    display: inline-block;
    letter-spacing: 1px;
    padding: 10px 20px;
}

.main-btn:hover {
	color: var(--black) !important;
}

.register-btn {
	margin-top: 24px;
}

span#clock {
	color: #fff;
	font-size: 40px;
}

.countdown-wrap {
	display: flex;
	align-items: center;
	justify-content: start;
}

.countdown-wrap > span {
	padding-right: 28px;
	padding-left: 28px;
}

.single-count {
	font-weight: 600;
	font-size: 30px;
	line-height: 30px;
	color: var(--Primary-color);
	position: relative;
}

.single-count::after {
	content: "";
	position: absolute;
	right: 0;
	top: 14px;
	width: 1px;
	height: 36px;
	background: var(--black);
	opacity: .5;
}

.single-count:last-child::after {
	display: none;
}

.single-count:nth-child(1) {
	padding-left: 0;
}

.single-count:nth-child(4) {
	padding-right: 0;
}

.single-count span {
	text-transform: capitalize;
	margin: 0;
	font-weight: 500;
	font-size: 16px;
	line-height: 28px;
	color: var(--black);
}



/* 
--------------------------
10. testimonial area here css
--------------------------
*/
.students-testimonial {
	position: relative;
	overflow: hidden;
	z-index: 1;
}
.st-pattern img {
    bottom: 0;
    right: 0;
    max-width: 27%;
}
.st-item {
	padding-right: 40px;
}

.st-student-content {
	position: relative;
	z-index: 1;
	margin-bottom: -45px;
}

.st-icon {
	position: absolute;
	z-index: -1;
	top: 0;
	left: -36px;
}

.st-student-content h4 {
	font-weight: 500;
	font-size: 18px;
	line-height: 30px;
	color: var(--black);
	margin-bottom: 80px;
}

.st-student-info {
	display: flex;
	align-items: center;
}

.st-desc {
	margin-left: 16px;
}

.st-desc h4 {
	font-weight: 500;
	font-size: 24px;
	line-height: 36px;
}

.st-desc p {
	font-size: 18px;
	line-height: 32px;
	color: var(--gray);
}


/* 
--------------------------
11. product area here css
--------------------------
*/
.product-area {
	background: var(--main-bg);
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.product-pattern img {
    bottom: 0;
    left: 0;
    max-width: 38%;
}
.product-area .section-title {
	margin-bottom: 60px;
}

.product-area .section-title h1 {
	margin-bottom: 0px;
}

.product-list li {
	display: inline-block;
	margin-bottom: 16px;
	margin-right: 40px;
}

.product-list a {
	font-weight: 600;
	font-size: 18px;
	line-height: 32px;
}

.product-list a i {
	margin-right: 8px;
	color: var(--Primary-color);
}

.product-thumb {
	margin-right: 26px;
	height: 236px;
}

.product-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.product-item {
	display: flex;
}

.product-info {
	margin-top: 20px;
}

.product-info .ota-reating {
	margin-bottom: 12px;
	margin-top: 16px;
}

/* prices  */
.product-prices p {
	font-size: 18px;
	line-height: 16px;
	font-weight: 700;
	color: var(--Primary-color);
}

.product-prices p span {
	font-size: 12px;
}

.product-content h4 {
	font-weight: 600;
	font-size: 20px;
	line-height: 30px;
	margin-bottom: 24px;
}

.product-content .get-started-btn a {
	font-weight: 500;
	font-size: 18px;
	line-height: 32px;
	text-transform: capitalize;
}

.product-content .get-started-btn a span {
	width: 40px;
	height: 40px;
	margin-left: 16px;
}

.product-content .get-started-btn a i {
    font-size: 14px;
}

.product-btn {
	text-align: center;
	margin-top: 60px;
}

.product-btn a {
	padding: 10px 18px;
}

/* 
--------------------------
12. blog area here css
--------------------------
*/
.blog-area {
	position: relative;
	overflow: hidden;
	z-index: 1;
}
.blog-pattern img {
    right: 0;
    bottom: 0;
    max-width: 29%;
}

.col-12.blog-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 64px;
}
.col-12.blog-top h1 {
	margin-bottom: 0;
}
.blog-btn a {
	padding: 12px 19px;
}
.blog-area a.blog-item-link{
	display: block;
}
.blog-thumb {
    width: 100%;
    height: 167px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
}
.blog-thumb::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 0%;
	height: 100%;
	background: rgba(236,100,55, .4);
	transition: .3s ease;
	-webkit-transition: .3s ease;
	-moz-transition: .3s ease;
	-ms-transition: .3s ease;
	-o-transition: .3s ease;
}
.blog-area a:hover .blog-thumb::before{
	width: 100%;
}

.blog-thumb1 {
	background-image: url("../img/blog/b1.jpg");
}
.blog-thumb2 {
	background-image: url("../img/blog/b2.jpg");
}
.blog-thumb3 {
	background-image: url("../img/blog/b3.jpg");
}
.blog-thumb4 {
	background-image: url("../img/blog/b4.jpg");
}
.blog-thumb5 {
	background-image: url("../img/blog/b5.jpg");
}
.blog-thumb6 {
	background-image: url("../img/blog/b6.jpg");
}
.blog-thumb7 {
	background-image: url("../img/blog/b7.jpg");
}
.blog-thumb8 {
	background-image: url("../img/blog/b8.jpg");
}
.blog-thumb9 {
	background-image: url("../img/blog/b2.jpg");
}

.blog-info {
	padding: 20px 24px;
}
.blog-info .meta p {
	font-weight: 500;
	font-size: 16px;
	line-height: 28px;
	color: var(--Primary-color);
	margin-bottom: 12px;
}

.blog-info h4 {
	font-weight: 600;
	font-size: 24px;
	line-height: 36px;
}


/* 
--------------------------
13. footer area here css
--------------------------
*/
footer.footer-area {
	background: var(--black);
}

.footer-logo {
	margin-bottom: 24px;
}

.footer-logo a {
	display: inline-block;
}

.footer-content p {
	font-size: 18px;
	line-height: 32px;
	color: var(--white);
}

.footer-widget1 {
	padding-right: 30px;
}

.footer-social-icons {
	display: flex;
	margin-top: 40px;
}

.footer-social-icons li {
	line-height: 0;
	margin-right: 24px;
}

.footer-social-icons a {
	display: inline-block;
}

.footer-social-icons i {
	color: var(--white);
	font-size: 16px;
}

.footer-social-icons a:hover i {
	color: var(--Primary-color);
}

.footer-widget2 {
	padding-left: 40px;
}

.footer-menu li, 
.footer-address li {
	margin-bottom: 18px;
}
.footer-menu li a {
	font-size: 18px;
	color: var(--white);
	text-transform: capitalize;
	font-weight: 400;
	line-height: 26px;
	transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
}

.footer-menu li a:hover,
.footer-address li a:hover {
	color: var(--Primary-color);
}

.footer-address p {
	font-size: 18px;
	color: var(--white);
	text-transform: capitalize;
	font-weight: 400;
	margin-bottom: 20px;
	line-height: 26px;
}

.footer-address li a {
	font-size: 18px;
	color: var(--white);
	text-transform: capitalize;
	font-weight: 400;
}

/* inner-hero area here  */
.inner-hero {
    margin-top: 100px;
    background: var(--gradient);
    overflow: hidden;
    position: relative;
}
.inner-hero-content {
    height: 300px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.inner-hero-title h2 {
    font-weight: bold;
    font-size: 44px;
    line-height: 54px;
    color: var(--white);
    text-transform: capitalize;
    margin-bottom: 12px;
    text-align: center;
}
.inner-hero-menu li:nth-child(2) span {
    padding: 0px 10px;
}
.inner-hero-menu li span,
.inner-hero-menu li a {
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 28px;
    color: var(--white);
    text-transform: capitalize;
}

.inner-hero-menu {
    display: flex;
}
.inner-hero-menu a{
	position: relative;
}
.inner-hero-menu a::before{
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 0%;
	height: 1px;
	background: var(--white);
	transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
}
.inner-hero-menu a:hover:before{
	width: 100%;
}



/* 
--------------------------
14. about us page area here
--------------------------
*/
/* upgrade area here   */
.about-us-body {
    overflow: hidden;
    position: relative;
	z-index: 1;
}
.upgrade-video {
    background: url("../img/aboutUs/upgrade.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 450px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.upgrade-video a {
    width: 92px;
    height: 92px;
    background: rgba(255, 255, 255, 0.1);
    border: 3px solid #FFFFFF;
    box-sizing: border-box;
    backdrop-filter: blur(30px);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    position: relative;
}
.upgrade-video a i {
    color: var(--white);
    font-size: 16px;
}
.upgrade-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    margin-left: 80px;
}
.upgrade-content h1 {
    margin-bottom: 24px;
}
.upgrade-content p {
    font-size: 18px;
    line-height: 32px;
    margin-bottom: 48px;
}
/* about us area here  */
.about-us-area .about-content h1 span {
    background: var(--gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.about-us-area .about-content {
    padding-left: 80px;
}

.about-us-area-btn {
    margin-top: 48px;
}

.about-us-body-pattern img {
    max-width: 8%;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
/* ab-counter area here  */
.ab-counter{
	background: var(--main-bg);
}

.ab-counter .hero-counter-items {
	height: 328px;
}

.ab-counter .counter {
    background: var(--gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.ab-counter .sigle-counter-box p:nth-child(2) {
    color: var(--black);
}

/* 
--------------------------
15. course page area here
--------------------------
*/
/* course area here  */
.course-menu {
    display: flex;
    justify-content: space-between;
    margin-bottom: 40px;
	position: relative;
	z-index: 1;
}
.courses-filter-box {
    position: relative;
}
.course-para {
    font-weight: 400;
    font-size: 20px;
    line-height: 32px;
    display: inline-block;
}
.course-para span {
    color: var(--black);
    font-weight: 600;
}
.courses-filter-btn {
	font-weight: 500;
	font-size: 18px;
	line-height: 30px;
	text-transform: capitalize;
	color: var(--white) !important;
	background: var(--gradient);
	padding: 10px 20px;
	border: none;
}
.courses-filter-btn i {
    font-size: 14px;
    margin-left: 4px;
}
.courses-filter-list {
	position: absolute;
	list-style-type: none;
	padding: 15px 20px;
	background-color: #fff;
	background: var(--gradient);
	top: 50px;
	right: -100%;
	opacity: 0;
    z-index: 99;
	visibility: hidden;
	transition: all .4s ease;
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-ms-transition: all .4s ease;
	-o-transition: all .4s ease;
}
.courses-filter-list.courses-filter-list-actives{
    right: 0;
	opacity: 1;
	visibility: visible;
}
.courses-filter-list label {
    color: var(--white);
    text-transform: capitalize;
    font-weight: 500;
    font-size: 18px;
    line-height: 32px;
    font-family: 'Poppins', sans-serif;
}

.courses-filter-list label input {
    width: 12px;
    height: 12px;
    margin-right: 4px;
}
.course-online-team-area .get-started-btn {
    margin-top: 60px;
}
/* pattern img  */
.course-ota-pattern img {
    top: 50% !important;
    right: 0;
    transform: translateY(-50%);
}



/* 
--------------------------
16. courses details page area here
--------------------------
*/
/* courses-details-inner-hero area here  */
.courses-details-inner-hero .inner-hero-menu li:nth-child(4) span{
	padding: 0px 10px;
}
/* courses-details area here  */
.courses-details {
    position: relative;
    overflow: hidden;
}
.courses-details-area {
    margin-right: 30px;
}
.courses-details-tab-menu {
    margin-bottom: 24px;
}
.courses-details-tab-menu li {
    margin-right: 33px;
}
.courses-details-tab-menu li a {
    font-weight: 600;
    font-size: 24px;
    padding-bottom: 12px;
    line-height: 40px;
    text-transform: capitalize;
    display: inline-block;
    position: relative;
    color: var(--gray);
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
}
.courses-details-tab-menu li a::before {
    content: "";
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 0%;
    height: 1px;
    background: var(--gradient);
	transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
}
.courses-details-tab-menu li a.active,
.courses-details-tab-menu li a:hover{
	color: var(--Primary-color);
}
.courses-details-tab-menu li a.active::before,
.courses-details-tab-menu li a:hover::before{
	width: 100%;
}
/* overview area here  */
.cd-overview .content h4 {
    font-weight: 500;
    font-size: 24px;
    line-height: 36px;
    margin-bottom: 16px;
}
.cd-overview .content p {
    font-size: 18px;
    line-height: 32px;
    margin-bottom: 20px;
}

.cd-overview .content p:last-child {
    margin-bottom: 0;
}
.cd-overview .thumb {
	margin: 32px 0px;
}
.cd-overview-inner{
    position: relative;
}
.cd-buttons {
    display: flex;
    justify-content: space-between;
    margin-top: 40px;
}
.cd-buttons li {
    width: 45%;
}
.cd-buttons .main-btn {
    text-align: center;
    width: 100%;
}

/* courses-details-sidebar */
.courses-details-sidebar .widget-item {
    background: inherit;
    padding: 0;
}

/* widget searchbox */
.cd-searchbox form input {
    border: none;
    background: #F5F5F5;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    text-transform: capitalize;
    width: 100%;
    padding: 16px 50px 16px 24px;
}
.cd-searchbox form input:focus{
	outline: none;
}
.cd-searchbox form .form-group {
    position: relative;
}
.cd-searchbox form button {
    border: none;
    position: absolute;
    right: 0;
    height: 100%;
    width: 56px;
    font-size: 20px;
    background: transparent;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.cd-searchbox form button img{
    transition: all .3S ease;
    -webkit-transition: all .3S ease;
    -moz-transition: all .3S ease;
    -ms-transition: all .3S ease;
    -o-transition: all .3S ease;
}
.cd-searchbox form button:hover img{
    opacity: .5;
}

/* widget recent post */
.cd-recent-post h4.title {
    font-weight: 500;
    font-size: 24px;
    line-height: 36px;
    margin-bottom: 24px;
}
.cd-recent-courses-post {
    display: flex;
    padding: 16px;
    border: 0.5px solid rgba(48,48,49, .2);
    margin-bottom: 16px;
    align-items: center;
}
.widget-body .cd-recent-courses-post:last-child {
    margin-bottom: 0;
}
.cd-recent-courses-post .thumb a {
    display: block;
    position: relative;
	overflow: hidden;
}
.cd-recent-courses-post .thumb a::before{
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(236,100,55, .4);
	transform: scale(0);
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-ms-transform: scale(0);
	-o-transform: scale(0);
	transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
}
.cd-recent-courses-post .thumb:hover a::before{
	transform: scale(1);
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
}
.cd-recent-courses-post .thumb a {
    display: block;
    position: relative;
}
.cd-recent-courses-post .thumb img {
    max-width: 140px;
}
.cd-recent-courses-post .content {
    margin-left: 16px;
}
.cd-recent-courses-post .content p {
    font-size: 16px;
    font-weight: 700;
    line-height: 18px;
    background: var(--gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 8px;
}
.cd-recent-courses-post .content p span {
    font-size: 12px;
}
.cd-recent-courses-post .content h5 {
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
}



/* curriculum-lecture  */
.cd-curriculum {
    border: 0.5px solid #D8D8D8;
    margin-bottom: 32px;
}
.cd-curriculum-inner .cd-curriculum:nth-child(3) {
    margin-bottom: 0;
}
.cd-curriculum .icon i {
    color: var(--gray);
}
.cd-curriculum ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
}
.cd-curriculum ul:nth-child(even) {
    background: #D8D8D8;
}
.cd-curriculum-lecture h5 {
    font-weight: 600;
    background: var(--white);
}

.cd-curriculum-left a {
    color: var(--gray);
}

.cd-curriculum-left a,
.cd-curriculum-right .question p,
.cd-curriculum-right .timer{
    font-weight: normal;
    font-size: 14px;
    line-height: 24px;

}
.cd-curriculum-left .chapter-name {
	margin-left: 4px;
	transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
}
.cd-curriculum-left .chapter-name:hover {
    opacity: .5;
}
.cd-curriculum-right {
    display: flex;
    align-items: center;
}
.cd-curriculum-right .question {
    margin-right: 60px;
}
.cd-curriculum-right .question p {
    background: var(--gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.cd-curriculum-right .timer {
    color: var(--black);
    margin-right: 4px;
}


/* instructor area here  */
.cd-instructor-inner {
    padding-top: 36px;
    text-align: center;
}
.cd-instructor .thumb {
    margin-bottom: 20px;
}
.cd-instructor .content h4 {
    font-weight: 600;
    font-size: 24px;
    line-height: 36px;
    margin-bottom: 4px;
}
.cd-instructor .content span {
    font-weight: 500;
    font-size: 18px;
    line-height: 32px;
	color: var(--gray);
	margin-bottom: 18px;
    display: block;
}
.cd-instructor .content p {
    font-weight: normal;
    font-size: 18px;
    line-height: 36px;
	margin-bottom: 24px;
}
.cd-instructor .icons {
    display: flex;
    justify-content: center;
}
.cd-instructor .icons li {
    margin: 0px 8px;
}
.cd-instructor .icons li a {
    width: 48px;
    height: 48px;
    border: 1px solid var(--Primary-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.cd-instructor .icons li a:hover {
    opacity: .5;
}
.cd-instructor .icons li a i {
    font-size: 18px;
}


.cd-instructor-inner .cd-buttons {
    margin-top: 60px;
}

/* reviews area here  */
.cd-reviews-inner .row>* {
    padding: 0;
}
.cd-reviews-inner .title h5 {
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 12px;
}
.average-rating {
    background: var(--gradient);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 214px;
}
.average-rating h1 {
    font-weight: bold;
    font-size: 54px;
    line-height: 60px;
    color: var(--white);
    margin-bottom: 16px;
}
.star-rating {
    display: flex;
}
.average-rating .star-rating {
    margin-bottom: 4px;
}
.average-rating .star-rating a {
    display: block;
    color: var(--white);
    padding: 0px 3.5px;
}
.average-rating p {
    font-weight: 500;
    font-size: 16px;
    line-height: 28px;
    color: var(--white);
}
.cd-reviews-inner .row .col-md-4 {
    padding-right: 30px;
}

.detailed-rating .detailed-star {
    display: flex;
	margin-bottom: 16px;
}
.detailed-rating .detailed-star:last-child {
	margin-bottom: 0px;
}
.detailed-rating .detailed-star li {
    margin-right: 10px;
}
.detailed-rating .detailed-star li:last-child {
    margin-right: 0px;
}

.detailed-rating .detailed-star li a {
    display: block;
    color: #CCC4C4;
    font-size: 16px;
    line-height: 30px;
}
.detailed-rating .detailed-star li a.yellow-star{
	color: #FDC83C;
}
.detailed-rating .detailed-star li span {
    font-size: 18px;
    line-height: 30px;
    margin-left: 8px;
    color: var(--gray);
}

.detailed-rating .detailed-star li:nth-child(6) {
    width: 250px;
    max-width: 100%;
    display: flex;
    align-items: center;
}
.detailed-rating .progress {
    height: 8px;
    width: 100%;
    margin-left: 10px;
	background: #F5F5F5;
}
.detailed-rating .bg-danger {
	background: var(--gradient);
}
/* .cd-author-reviews  */
.cd-author-reviews{
    margin-top: 48px;
}
.cd-author-review {
    display: flex;
    border-bottom: 1px solid #D8D8D8;
    padding-bottom: 24px;
    margin-bottom: 24px;
}
.cd-author-reviews .cd-author-review:last-child {
	border: none;
    padding-bottom: 0px;
    margin-bottom: 0px;
}
.cd-author-review .thumb {
    margin-right: 16px;
}
.cd-author-review .thumb img {
    max-width: 40px;
}
.cd-author-review-info .author {
    display: flex;
    justify-content: space-between;
}
.cd-author-review-info .name h4 {
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    margin-bottom: 12px;
    text-transform: uppercase;
}
.cd-author-review-info .name span {
    color: var(--gray);
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
}
.cd-author-review-info .star-rating {
    align-items: center;
}
.cd-author-review-info .star-rating li {
    margin-left: 4px;
}
.cd-author-review-info .star-rating li a {
    color: #FFB60A;
    font-size: 16px;
    line-height: 30px;
}

.cd-author-review-info p {
    margin-top: 8px;
}
.cd-reviews-inner .cd-buttons {
    margin-top: 60px;
}



/* 
--------------------------
17. blog page area here
--------------------------
*/
/* blog-page-area  */
.blog-page-area .get-started-btn {
    margin-top: 20px;
}
.blog-page-area .blog-item {
    margin-bottom: 40px;
}
.blog-page-area .blog-pattern img {
    right: 0;
    bottom: inherit;
    max-width: 8%;
    top: 50%;
    transform: translateY(-50%);
}

/* 
--------------------------
18. blog details page area here
--------------------------
*/
/* blog details area here  */
.blog-details {
    position: relative;
    overflow: hidden;
}
.blog-details .blog-pattern img {
    right: 0;
    bottom: inherit;
    max-width: 8%;
    top: 480px;
}
.blog-details-post {
    margin-right: 100px;
}
.bdp-content h2 {
    font-weight: 700;
    font-size: 40px;
    line-height: 50px;
    margin-bottom: 20px;
}
.bdp-content .meta {
    display: flex;
    align-items: center;
    margin-bottom: 40px;
}
.bdp-content .meta li {
    margin-right: 32px;
}
.bdp-content .meta li, 
.bdp-content .meta li a {
    display: flex;
    align-items: center;
    font-weight: normal;
    font-size: 14px;
    line-height: 26px;
    color: var(--gray);
}
.bdp-content .meta li a{
	margin-left: 4px;
}
.bdp-content .meta li a:hover {
    color: var(--Primary-color);
}
.bdp-content .meta li .icon {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 0.5px solid rgba(48, 48, 49, 0.2);
    font-size: 12px;
    color: var(--gray);
    margin-right: 8px;
}
.bdp-content > .thumb {
    margin-bottom: 40px;
}

.bdp-content p {
    font-weight: normal;
    font-size: 18px;
    line-height: 32px;
    margin-bottom: 30px;
}

/* figure  */
.bdp-content figure {
    display: flex;
    align-items: center;
    margin-bottom: 30px;
}
.bdp-content figure p {
    margin-left: 45px;
    margin-bottom: 0;
}
.bdp-content > h4 {
    font-weight: 600;
    font-size: 24px;
    line-height: 36px;
    margin-bottom: 16px;
}

.bdp-content p:nth-child(8) {
    margin-bottom: 40px;
}

.bdp-content blockquote {
    margin-top: 0;
    margin-bottom: 40px;
}
.bdp-content blockquote::before {
    content: "\f10d";
    font-family: "Font Awesome 5 Free";
    color: var(--black);
    font-weight: 900;
    left: 0;
    opacity: 1;
}
.bdp-content blockquote p {
    font-style: normal;
    margin-left: 20px;
    margin-bottom: 0;
}

/* tag  */
.bdp-tags {
    background: #fbfbfb;
    padding: 20px 5px;
    margin-bottom: 40px;
}
.bdp-post-tag span {
    font-weight: 500;
    font-size: 18px;
    line-height: 32px;
}
.bdp-post-tag a {
    font-weight: 400;
    font-size: 18px;
    line-height: 32px;
}
.new-post-share-icon {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: end;
}
.new-post-share-icon a {
    display: inline-block;
    margin-left: 16px;
    line-height: 0;
}
.new-post-share-icon a img{
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
}
.new-post-share-icon a:hover img{
    opacity: .5;
}

/* comments  */
.bdp-post-comment li {
    margin-bottom: 40px;
}
.bdp-post-comment .author {
    display: flex;
    align-items: center;
}
.bdp-post-comment .avatar img {
    max-width: 96px;
}
.bdp-post-comment .name {
    margin-left: 16px;
}
.bdp-post-comment .name  h5 {
    font-weight: bold;
    font-size: 18px;
    line-height: 24px;
    margin-bottom: 4px;
}
.bdp-post-comment .name  span {
    font-weight: normal;
    font-size: 14px;
    line-height: 26px;
    color: var(--gray);
}
.bdp-post-comment .comment-text p {
    margin-top: 16px;
    margin-bottom: 24px;
}
.bdp-post-comment .reply {
    font-weight: bold;
    font-size: 14px;
    line-height: 16px;
    color: var(--black);
    padding: 0px 5px 9px 5px;
    display: inline-block;
    position: relative;
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
}
.bdp-post-comment .reply::before{
	content: "";
	position: absolute;
	bottom: 0;
	left: 0%;
	width: 0%;
	height: 1px;
	background: var(--Primary-color);
	transition: all .3s ease;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
}
.bdp-post-comment .reply:hover::before{
    width: 100%;
}
.bdp-post-comment .children {
    padding-left: 50px;
    border-left: 1px solid rgba(48, 48, 49, 0.2);
}

/* comments-form  */
.bdp-post-comments-form .title h4 {
    font-weight: 600;
    font-size: 24px;
    line-height: 36px;
    margin-bottom: 24px;
}

.bdp-post-comments-form-item .row>*{
	padding: 0;
}
.bdp-post-comments-form-item .col-md-6:nth-child(1){
	padding-right: 8px;
}
.bdp-post-comments-form-item .col-md-6:nth-child(2){
	padding-left: 8px;
}
.bdp-post-comments-form-item textarea,
.bdp-post-comments-form-item input,
.contactUs-form input,
.contactUs-form textarea {
    font-weight: normal;
    font-size: 16px;
    line-height: 26px;
    background: #FFFFFF;
    border: 1px solid rgba(48, 48, 49, 0.2);
    padding: 15px 20px;
    width: 100%;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}
.bdp-post-comments-form-item textarea::placeholder,
.bdp-post-comments-form-item input::placeholder,
.contactUs-form input::placeholder,
.contactUs-form textarea::placeholder{
	color: var(--gray);
}
.bdp-post-comments-form-item textarea{
	margin-top: 16px;
}

.bdp-post-comments-form-item button,
.contactUs-form form button,
.register-form form button {
	font-weight: 500;
	font-size: 18px;
	line-height: 36px;
	text-transform: capitalize;
	color: var(--white);
	background: var(--gradient);
	padding: 20px;
	display: inline-block;
	letter-spacing: 1px;
	padding: 10px 20px;
	margin-top: 30px;
	border: none;
	border-radius: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	-ms-border-radius: 0;
	-o-border-radius: 0;
	transition: all .3s ease;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
}
.bdp-post-comments-form-item button:hover,
.contactUs-form button:hover,
.register-form button:hover {
    color: var(--black);
}

/* blog-details-sidebar  */
.widget-item {
    margin-bottom: 32px;
    background: #FBFBFB;
    padding: 40px 24px;
}
.widget-title {
    margin-bottom: 20px;
}
.bd-post-title h4,
.blog-post-title .title{
    font-weight: 600;
    font-size: 24px;
    line-height: 36px;
}

/* search-box  */
.bd-search-box .form-group {
    position: relative;
}
.bd-search-box input {
    font-weight: normal;
    font-size: 18px;
    line-height: 32px;
    border: none;
    background: #fff;
    width: 100%;
    text-transform: capitalize;
    padding: 17px 46px 17px 16px;
}
.bd-search-box input::placeholder{
	color: var(--gray);
}
.bd-search-box .form-group button {
	border: none;
	position: absolute;
	right: 0;
	top: 0;
	width: 40px;
	height: 100%;
	color: var(--gray);
	background: transparent;
	font-size: 20px;
	padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.bd-search-box .form-group button img{
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
}
.bd-search-box .form-group button:hover img{
    opacity: .5;
}

/* latest-post  */
.widget-blog-post {
    border-bottom: 1px solid rgba(48, 48, 49, 0.1);
    margin-bottom: 16px;
}
.widget-blog-post .thumb a {
    display: block;
	position: relative;
}
.widget-blog-post .thumb a::before{
	content: "";
	position: absolute;
	width: 0%;
	height: 100%;
	/*background: rgba(236,100,55, .4);*/
	background: rgba(233,225,223, .4);
	transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
}
.widget-blog-post:hover .thumb a::before{
	width: 100%;
}
.widget-blog-post .content {
    padding-top: 12px;
    padding-bottom: 16px;
}
.widget-blog-post .content h4 {
    font-weight: 500;
    font-size: 20px;
    line-height: 30px;
}

/* category  */
.bd-category-body li {
    display: flex;
    border-bottom: 1px solid rgba(48, 48, 49, 0.1);
    padding-bottom: 16px;
    margin-bottom: 16px;
}

.bd-category-body li a,
.bd-category-body li span {
    font-weight: 500;
    font-size: 20px;
    line-height: 30px;
}
.bd-category-body li a:hover{
	color: var(--Primary-color);
}
.bd-category-body li span {
	margin-left: 8px;
}

.bd-category-body li:last-child {
    border: none;
    padding: 0;
    margin: 0;
}
/* tag  */
.bd-tag-body li a {
	font-weight: normal;
	font-size: 16px;
	line-height: 26px;
	text-transform: capitalize;
	background: var(--white);
	padding: 10px 16px;
	display: inline-block;
	transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
}
.bd-tag-body li a:hover{
	color: var(--white);
	background: var(--Primary-color);
}
.bd-tag-body li {
    display: inline-block;
    margin-bottom: 16px;
    margin-right: 12px;
}
.bd-tag-body li:last-child{
    margin-bottom: 0px;
}



/* 
--------------------------
19. contact us page area here 
--------------------------
*/

/* contact us area here  */
.contactUs-area{
	position: relative;
	overflow: hidden;
}
.contactUs-wrapper .row:first-child {
    margin-bottom: 60px;
}
.contactUs-pattern img {
    bottom: 0;
    right: 0;
    max-width: 55%;
}
.contactUs-info .thumb {
    margin-bottom: 16px;
}
.contactUs-info .thumb span {
    width: 72px;
    height: 72px;
	background: var(--gradient);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}
.contactUs-info .content h4 {
    font-weight: 600;
    font-size: 24px;
    line-height: 36px;
    margin-bottom: 4px;
}
.contactUs-info .content p,
.contactUs-info .content a {
    font-weight: normal;
    font-size: 18px;
    line-height: 32px;
	color: var(--gray);
}
/* contactUs-map  */
.contactUs-map {
    height: 100%;
}
.contactUs-map iframe {
    width: 100%;
    height: 100%;
}

.contactUs-wrapper .row:last-child{
	padding-left: 15px;
	padding-right: 15px;
}

/* contactUs-form  */
.contactUs-form {
    background: #FBFBFB;
    padding: 48px 64px;
}
.contactUs-form .title h4 {
    font-weight: 600;
    font-size: 24px;
    line-height: 36px;
    margin-bottom: 24px;
}
.contactUs-form .form-group {
    margin-bottom: 16px;
}
.contactUs-form .form-group:nth-child(4){
    margin-bottom: 24px;

}
.contactUs-form .form-group:last-child{
    margin-bottom: 0px;
}
.contactUs-form button {
    margin: 0;
}
/*################## 
--------------------------
- Homepage area ends here
--------------------------
##################*/




/*********************
--------------------------
20. home 2 area here
--------------------------
**********************/

/* 
--------------------------
index 2 preloader area here
--------------------------
*/
.preloder2 {
	width: 100%;
	height: 100vh;
	position: fixed;
	background: var(--primary);
	top: 0;
	left: 0;
	z-index: 10000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.pre-loading2 {
	position: relative;
	width: 70px;
	height: 70px;
	background: transparent;
	border: 10px solid var(--secondary);
	border-top: transparent;
	border-bottom: transparent;
	border-radius: 50%;
	animation: loading2 1.2s linear infinite;
	-webkit-animation: loading2 1.2s linear infinite;
}

@keyframes loading2 {
	25% {
		background: transparent;
	}

	to {
		transform: rotate(360deg);
	}
}



/* 
--------------------------
index 2 top up button area
--------------------------
*/
.topUp-btn2 {
	display: none;
	position: fixed;
	bottom: 40px;
	right: 40px;
	z-index: 1000;
	border: transparent;
	background: var(--primary);
	width: 40px;
	height: 40px;
	border-radius: 50%;
	box-shadow: 0 0 15px rgba(42, 38, 24, 0.9);
	transition: all .4s ease;
	-o-transition: all .4s ease;
	-ms-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-webkit-transition: all .4s ease;
}

.topUp-btn2:hover {
	background: var(--secondary);
}

.topUp-btn2:hover i {
	color: var(--white);
}

.topUp-btn2 i {
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 18px;
	font-weight: 600;
	color: var(--white);
	display: block;
	transition: all .4s ease;
	-o-transition: all .4s ease;
	-ms-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-webkit-transition: all .4s ease;
}


/* 
--------------------------
index 2 header area here
--------------------------
*/
.off-canvas-menu2{
    display: none;
}
/* mobile-menu-bar  */
.mobile-menu2 {
    display: none;
}
.header-section2 {
    display: flex;
    align-items: center;
    background: var(--white);
    height: 100px;
    position: absolute;
    top: 0;
    width: 100%;
}
.sticky2 {
	left: 0;
	right: 0;
	margin: auto;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 999;
	padding: 0px 0;
	box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
    animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
  -webkit-animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
}
.header-wrapper2 {
    width: 100%;
}
.header-main-area2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.header-main-area2 .sub-menu{
    border-top: 4px solid var(--primary);
    border-bottom: 4px solid var(--primary);
}
.header-main-area2 .main-menu li a {
    color: var(--black)
}
.header-main-area2 .main-menu li a:hover{
    color: var(--black2);
}
.header-actions2 {
    display: flex;
    align-items: center;
}
.header-search2 {
    margin-right: 40px;
}

.header-logo2 a,
.header-profile2 a {
    display: block;
}
.header-search-main2{
    position: relative;
}
.header-toggle-search2 {
    position: absolute;
    right: 0;
    top: 30px;
    visibility: hidden;
    opacity: 0;
    z-index: -1;
    transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -webkit-transition: all 0.6s ease-in-out;
}
.header-search-main2:hover .header-toggle-search2{
    z-index: 999;
    visibility: visible;
    opacity: 1;
}
#searchbox2 .form-group {
    position: relative;
}
#searchbox2 .form-group input {
    border: none;
    font-size: 24px;
    line-height: 46px;
    text-transform: capitalize;
    background: var(--primary);
    padding-left: 20px;
    padding-right: 50px;
    color: #A99796;
}
#searchbox2 .form-group input:focus{
    outline: none;
}
#searchbox2 .form-group input::placeholder{
    color: #A99796;
}
#searchbox2 .form-group button{
    position: absolute;
    width: 40px;
    height: 100%;
    top: 0;
    right: 0;
    border: none;
    background: var(--primary);
}



/* 
--------------------------
index 2 hero area here
--------------------------
*/
.hero-section2 {
    position: relative;
    overflow: hidden;
    background: var(--heroBg);
    z-index: 1;
    padding: 67px 0px;
    margin-top: 100px;
}
.hero-items2 {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.hero-content2 p {
    font-weight: 500;
    font-size: 30px;
    line-height: 40px;
}
.hero-content2 .normal {
    font-size: 92px;
    line-height: 120px;
}
.hero-content2 .stroke {
    font-size: 120px;
    line-height: 120px;
}
.hero-content2 .stroke {
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: var(--innerBorder);
}
.hero-buttons2 {
    margin-top: 50px;
}

/* main-buttons  */
.main-buttons2 a {
    font-weight: 500;
    font-size: 18px;
    line-height: 28px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    background: var(--primary);
    color: var(--white);
    width: 222px;
    height: 76px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.main-buttons2 a:hover{
    background: var(--secondary);
}

/* vector  */
.vector2 {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.vector2 img{
    position: absolute;
}
.hero-vector2 img:nth-child(1) {
    right: 0;
    bottom: 0;
    max-width: 6%;
}
.hero-vector2 img:nth-child(2) {
    right: 0;
    top: 0;
    max-width: 30%;
}



/* 
--------------------------
index 2 services area here
--------------------------
*/
.title2 {
    text-align: center;
}
.title2 p {
    font-weight: bold;
    font-size: 30px;
    line-height: 40px;
    text-transform: capitalize;
    color: var(--secondary);
}
.title2 .stroke,
.callTo-content .stroke{
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke-width: 1.5px;
    -webkit-text-stroke-color: var(--primary);
}

.services-section2 {
    overflow: hidden;
    position: relative;
}
.services-title2 {
    margin-bottom: 80px;
}

.services-cont2 {
    padding: 0px 18px;
}
.services-cont2 img {
    margin-bottom: 24px;
}

.services-cont2 h3 {
    margin-bottom: 16px;
}


/* 
--------------------------
index 2 video area here
--------------------------
*/
.video-section2 {
    position: relative;
    overflow: hidden;
    z-index: 1;
}
.video-items2 {
    background: url("../img/art/bg/video.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 700px;
    display: flex;
    align-items: center;
    justify-content: center;
	position: relative;
}
.video-items2 a {
    position: relative;
    display: flex;
    width: 150px;
    height: 150px;
    background: var(--white);
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
.video-items2 a:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    border: 1px solid #fff;
    -webkit-animation: spin 1000ms linear infinite;
    -o-animation: spin 1000ms linear infinite;
    animation: spin 1000ms linear infinite;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

@keyframes spin {
    0% {
        opacity: 1;
        transform: scale(.9);
        -webkit-transform: scale(.9);
        -ms-transform: scale(.9);
        -o-transform: scale(.9);
        -moz-transform: scale(.9);
}

    100% {
        opacity: 0;
        transform: scale(1.4);
        -webkit-transform: scale(1.4);
        -ms-transform: scale(1.4);
        -o-transform: scale(1.4);
        -moz-transform: scale(1.4);
}
}
.video-vector2 {
    max-width: 13%;
    position: absolute;
    right: -11%;
    top: 50%;
    z-index: -1;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}



/* 
--------------------------
index 2 course area here
--------------------------
*/
.course-section2 {
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.course-vector2 img {
    top: 27%;
    max-width: 13%;
}
.course-title2 {
    margin-bottom: 60px;
}
.course-items2 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 30px;
}
.course-thumb2 a {
    cursor: auto;
}
.course-content2 {
    padding: 30px;
}
.course-meta2 {
    display: flex;
    justify-content: space-between;
    margin-bottom: 16px;
}
.course-meta-title2 {
    display: inline-block;
}
.course-meta-price2 {
    display: block;
    padding: 4px 21px;
    background: var(--primary);
    color: var(--white);
    font-weight: bold;
    font-size: 30px;
    line-height: 40px;
    transition: all 0.4s ease-out;
    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -ms-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
}
.course-item2:hover .course-meta-price2{
    background: var(--secondary);
    color: var(--white);
}
.course-meta-title2 h3{
    transition: all 0.4s ease-out;
    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -ms-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
}
.course-meta-title2 h3:hover{
	text-decoration: underline;
}
.course-meta-link2 {
    display: flex;
}
.course-meta-link2 li {
    transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
}
.course-meta-link2 li:hover {
    opacity: .5;
}
.course-meta-link2 li:nth-child(1) {
    margin-right: 40px;
}
.course-meta-link2 li a {
    font-weight: bold;
    font-size: 18px;
    line-height: 28px;
    color: rgba(42, 38, 24, 0.9);
    display: flex;
    align-items: center;
    text-transform: capitalize;
}
.course-meta-link2 li a span {
    padding-right: 10px;
    margin-left: -26px;
}
.course-buttons2 {
    display: flex;
    justify-content: center;
    margin-top: 60px;
}


.course-thumb2 {
    position: relative;
    overflow: hidden;
}
.course-thumb2 img{
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
}
.course-item2:hover .course-thumb2 img{
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);

}


/* 
--------------------------
index 2 testimonial area here
--------------------------
*/
.testimonial-section2 {
    position: relative;
    background: var(--testimonialBg);
    z-index: 1;
    overflow: hidden;
}
.testimonial-vector2 img:nth-child(1) {
    top: 148px;
    left: 0;
    max-width: 6%;
}
.testimonial-vector2 img:nth-child(2) {
    bottom: 205px;
    right: 0;
    max-width: 6%;
}
.testimonial-title2 {
    margin-bottom: 104px;
}
.testimonial-content2 {
    padding-left: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}
.testimonial-icon2 i {
    font-size: 40px;
    color: var(--primary);
    margin-bottom: 24px;
}
.testimonial-content2 p {
    font-weight: 500;
    font-size: 30px;
    line-height: 52px;
    color: var(--black);
}
.testimonial-desc2 {
    display: flex;
    margin-top: 30px;
}
.testimonial-desc2 li {
    font-weight: bold;
    font-size: 20px;
    line-height: 30px;
    text-transform: capitalize;
    position: relative;
}
.testimonial-desc2 li:first-child {
    margin-right: 28px;
}
.testimonial-desc2 li:first-child::after {
    position: absolute;
    content: "-";
    right: -19px;
}
.testimonial-thumb2 {
    text-align: center;
}
.testimonial-thumb-img2 {
    position: relative;
    display: inline-block;
    z-index: 1;
}
.testimonial-thumb-img2 img:nth-child(2) {
    position: absolute;
    left: -9%;
    bottom: -11%;
    z-index: -1;
    max-width: 38%;
}
.testimonial-thumb-img2 img:nth-child(3) {
    position: absolute;
    top: -14%;
    right: -12%;
    max-width: 28%;
}


/* 
--------------------------
index 2 blog area here
--------------------------
*/
.blog-section2{
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.blog-vector2 img:nth-child(1) {
    left: 0;
    bottom: 230px;
    max-width: 3%;
}
.blog-vector2 img:nth-child(2) {
    right: 0;
    top: 244px;
    max-width: 10%;
}

.blog-title2 {
    margin-bottom: 70px;
}
.blog-ite2 {
    overflow: hidden;
}
.blog-item-title2 {
    margin-bottom: 30px;
}
.blog-item-title2 h3 a {
    font-weight: 600;
    font-size: 30px;
    line-height: 40px;
    font-family: 'Montserrat', sans-serif;
    transition:none;
    -webkit-transition:none;
    -moz-transition:none;
    -ms-transition:none;
    -o-transition:none;
}
.blog-item-title2 h3 a:hover{
    text-decoration: underline;
}

.blog-ite2 .blog-thumb2 {
    position: relative;
}
.blog-ite2 .blog-thumb2 a {
    display: block;
    cursor: auto;
}
.blog-ite2 .blog-thumb2 img {
    width: 100%;
}
.blog-ite2 .blog-thumb2 p {
    position: absolute;
    top: 13%;
    left: 0;
    background: var(--primary);
    color: var(--white);
    text-transform: capitalize;
    padding: 4px 25px;
    transition: all 0.4s ease-out;
    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -ms-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
}

.blog-ite2:hover .blog-thumb2 p{
    background: var(--secondary);
}

.blog-content2 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 24px;
    padding: 0px 30px;
}
.blog-author2 {
    display: flex;
    position: relative;
    cursor: auto;
    align-items: center;
}
.blog-author2::before {
    content: "";
    position: absolute;
    left: -4px;
    top: -4px;
    background: url("../img/art/blog/shap.png");
    width: 43px;
    height: 40px;
    z-index: -1;
}
.blog-author2 span {
    color: var(--blackRgba);
    margin-left: 10px;
}
.blog-content2 span.date {
    color: var(--blackRgba);
}
.blog-content2 a.read {
    font-weight: 500;
    font-size: 18px;
    line-height: 28px;
    color: var(--primary);
    text-decoration: underline;
    text-transform: uppercase;
}
.blog-content2 a.read:hover{
    opacity: .5;
}



/* 
--------------------------
index 2 event area here
--------------------------
*/
.event-section2 {
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.event-vector2 img:nth-child(1) {
    left: 0;
    bottom: 40%;
    max-width: 7%;
}
.event-vector2 img:nth-child(2) {
    right: 0;
    top: 240px;
    max-width: 12%;
}
.event-title2 {
    margin-bottom: 70px;
}
.enent-item2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}
.enent-date2 {
    margin-bottom: 24px;
}
.enent-date2 p {
    font-weight: 500;
    font-size: 24px;
    line-height: 34px;
    display: inline-block;
    background: var(--primary);
    color: var(--white);
    padding: 4px 16px;
}
.enent-content2 h3 a {
    font-size: 29px;
    line-height: 40px;
    font-family: 'Montserrat', sans-serif;
    transition: none;
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
    font-weight: bold;
    text-decoration: none;
    text-transform: inherit;
    color: var(--black);
}
.enent-content2 p {
    color: var(--blackRgba);
    margin-bottom: 30px;
    margin-top: 8px;
}
.enent-content2 a:nth-child(3) {
    font-weight: 500;
    font-size: 18px;
    line-height: 28px;
    letter-spacing: 0.05em;
    text-decoration-line: underline;
    text-transform: uppercase;
    color: var(--primary);
}
.enent-content2 a:nth-child(3):hover {
    opacity: .5;
}
.event-buttons2 {
    display: flex;
    justify-content: center;
    margin-top: 60px;
}
.enent-item2:hover .enent-date2 p{
    background: var(--secondary);
    transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
}
.enent-content2 h3:hover {
    text-decoration: underline;
}


/* 
--------------------------
index 2 callTo area here
--------------------------
*/
.callTo-section2 {
    background: var(--secondary);
    padding-top: 70px;
    padding-bottom: 70px;
    overflow: hidden;
}
.callTo-content2,
.callTo-form2{
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.callTo-form2 .form-group {
    position: relative;
}

.callTo-form2 .form-group input {
    display: block;
    width: 100%;
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--black2);
    padding-bottom: 16px;
    text-transform: capitalize;
    padding-right: 150px;
}
.callTo-form2 .form-group input:focus{
    outline: none;
}
.callTo-form2 .form-group input::placeholder{
    color: var(--black2);
}
.callTo-form2 .form-group .login-btn {
    position: absolute;
    top: 0;
    right: 0;
    color: var(--primary);
    font-weight: 500;
    font-size: 18px;
    line-height: 28px;
    text-align: center;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 0;
    border: none;
    background: none;
    transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
}
.callTo-form2 .form-group .login-btn:hover{
    opacity: .5;
}
.callTo-form2 button:focus {
    outline:0;
}

.callTo-thumb2 {
    text-align: center;
}



/* 
--------------------------
index 2 footer area here
--------------------------
*/
.footer-section2 {
    background: #000000;
    padding: 150px 0px;
    position: relative;
    overflow: hidden;
    z-index: 1;
}
.footer-vector2 img:nth-child(1) {
    top: 22px;
    left: 0;
    max-width: 8%;
}
.footer-vector2 img:nth-child(2) {
    bottom: 45px;
    right: 0;
    max-width: 3%;
}
.footer-copyRight2 {
    margin-top: 50px;
}
.footer-copyRight2 p,
.footer-contact-info2 li a,
.footer-list2 li a,
.footer-address2, 
.footer-icon2 li a{
    color: var(--white);
}
.footer-list2 li a {
    font-weight: normal;
    font-size: 20px;
    line-height: 40px;
    text-transform: capitalize;
    position: relative;
}
.footer-list2 li a::before{
    content: '';
    position: absolute;
    width: 0%;
    height: 1px;
    background: var(--white);
    bottom: 0;
    left: 0;
    transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
}
.footer-list2 li a:hover::before{
    width: 100%;
}
.footer-section2 .footer-widget1 {
    display: flex;
}
.footer-section2 .footer-widget1 .footer-list2:last-child{
    margin-left: 60px;
}
.footer-address2 {
    font-size: 20px;
    line-height: 30px;
    margin-bottom: 16px;
}
.footer-contact-info2 li a {
    font-size: 20px;
    line-height: 30px;
    display: inline-block;
}
.footer-contact-info2 li:first-child{
    margin-bottom: 16px;
}
.footer-icon2 {
    display: flex;
    margin-top: 26px;
}
.footer-icon2 li {
    display: inline-block;
    line-height: 0;
    margin-right: 26px;
}
.footer-icon2 li a {
    line-height: 0;
    display: block;
}
.footer-icon2 li a i {
    font-size: 20px;
}
.footer-icon2 li:hover a{
    transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
}

/*################## 
--------------------------
- Homepage 2 area ends here
--------------------------
##################*/



/*********************
--------------------------
21. home 3 area here
--------------------------
**********************/

/* 
--------------------------
index 3 preloader area here css
--------------------------
*/
.preloder3 {
    width: 100%;
    height: 100vh;
    position: fixed;
    background: var(--primaryFont);
    top: 0;
    left: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
}
.pre-loading3 {
	position: relative;
	width: 70px;
	height: 70px;
	background: transparent;
	border: 10px solid var(--buttonBg);
	border-top: transparent;
	border-bottom: transparent;
	border-radius: 50%;
	animation: loading3 1.2s linear infinite;
	-webkit-animation: loading3 1.2s linear infinite;
}

@keyframes loading3 {
	25% {
		background: transparent;
	}

	to {
		transform: rotate(360deg);
	}
}

/* 
--------------------------
index 3 top up button area css
--------------------------
*/
.topUp-btn3 {
    display: none;
    position: fixed;
    bottom: 40px;
    right: 40px;
    z-index: 1000;
    border: transparent;
    background: var(--primaryFont);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    box-shadow: 0 0 15px rgba(40, 69, 11, 50%);
    transition: all .5s ease;
    -o-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -webkit-transition: all .5s ease;
}

.topUp-btn3:hover {
	background: var(--buttonBg);
}

.topUp-btn3:hover i {
	color: var(--white);
}

.topUp-btn3 i {
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 24px;
	font-weight: 600;
	color: var(--white);
	display: block;
	transition: all .5s ease;
	-o-transition: all .5s ease;
	-ms-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-webkit-transition: all .5s ease;
}
/* 
--------------------------
index 3 header area here css
--------------------------
*/
.mobile-menu-bar3 {
    display: none;
}
.off-canvas-menu3 {
    display: none;
}
.header-area3 {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 998;
}
.header-wrapper3 {
    width: 100%;
}
.header-area3.sticky {
    left: 0;
    right: 0;
    margin: auto;
    position: fixed;
    top: 0;
    width: 100%;
    height: 80px;
    z-index: 999;
    padding: 0px 0;
    background: var(--white);
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);    
    animation: 600ms ease-in-out 0s normal none 1 running fadeInDown;
    -webkit-animation: 600ms ease-in-out 0s normal none 1 running fadeInDown;
}
.header-logo3 {
    display: flex;
    align-items: center;
    height: 100%;
}
.main-nav3 {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    width: 103%;
    margin-left: -3%;
}

.header-area3 .header-navigation ul li a {
    color: var(--fontMain);
}
.header-area3 .header-navigation ul li a:hover{
    color: var(--primaryFont);
}
.header-area3.sticky .header-navigation > ul > li > a {
    padding: 26px 0px  !important;
}
.main-nav3 .sub-menu{
    border-top: 4px solid var(--primaryFont);
    border-bottom: 4px solid var(--primaryFont);
    
}

.header-button3 {
    display: flex;
    align-items: center;
}
.header-button3 li {
    margin-left: 18px;
}
.header-button3 li:first-child {
    margin-left: 0;
}
.header-button3 li a {
    font-weight: 400;
    font-size: 18px;
    line-height: 32px;
    text-transform: capitalize;
    display: inline-block;
    padding: 12px 37px;
}
.header-button3 li a:hover,
.header-button3 li.active a{
    background: var(--primaryFont);
	color: var(--white);
}

.main-nav3 .nav li {
    margin-right: 32px;
}
.main-nav3 .nav li a {
    font-weight: 500;
    font-size: 18px;
    line-height: 32px;
    color: var(--primaryFont);
    display: inline-block;
    position: relative;
}
.main-nav3 .nav li a::after {
    content: '';
    position: absolute;
    bottom: 6px;
    left: 0;
    width: 0%;
    height: 2px;
    background-color: var(--primaryFont);
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
}
.main-nav3 .nav li:hover a::after{
    width: 80%;
}


/* 
--------------------------
index 3 hero area here css
--------------------------
*/
.hero-section3 {
    background: var(--bgMain);
    position: relative;
    overflow: hidden;
    z-index: 1;
}
.hero-area3 {
    padding: 160px 0px 120px;
    position: relative;
    z-index: 1;
}
.hero-content3 {
    padding-right: 20px;
}
.hero-content3 h1 {
    margin-bottom: 32px;
}
.hero-content3 p:nth-child(2) {
    margin-bottom: 60px;
}
.hero-content3 form {
    margin-bottom: 20px;
}
.hero-content3 .form-group {
    position: relative;
}
.hero-content3 .form-group input {
    border: none;
    width: 100%;
    padding: 24px 0px 24px 28px;
    padding-right: 205px;
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
}
.hero-content3 .form-group input:focus { 
    outline: none !important;
    box-shadow: 0 0 10px var(--buttonBg);
 }
.hero-content3 .form-group input::placeholder{
	color: var(--fontMain);
}
.hero-content3 .form-group .main-button3 {
    position: absolute;
    top: 0px;
    right: 0px;
    background: var(--buttonBg);
    width: 202px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    line-height: 32px;
    font-weight: 700;
    color: var(--white) !important;
    padding: 0;
    border: 1px solid transparent;
}
.hero-content3 .form-group .main-button3:hover {
    color: var(--primaryFont) !important;
    background: transparent;
    border: 1px solid var(--buttonBg);
}
.hero-carousel3 {
    margin-top: 128px;
}
.hero-img3 {
    height: 100%;
    width: 100%;
    padding-left: 16px;
}
.hero-img3 img {
    max-width: 100%;
    width: 100%;
}

/* patterns  */
.hero-patterns3 img:nth-child(1) {
    left: 80px;
    top: 0;
    max-width: 9%;
}
.hero-patterns3 img:nth-child(2) {
    top: 66px;
    right: 77px;
    max-width: 8%;
}
.hero-patterns3 img:nth-child(3) {
    top: 584px;
    right: 289px;
}
.hero-patterns3 img:nth-child(4) {
    left: 289px;
    bottom: 220px;
}



/* why area  */
.why-area3 {
    position: relative;
    z-index: 1;
}
.why-content3 {
    padding-top: 50px;
    padding-left: 16px;
}
.why-content3 h2 {
    font-weight: 700;
    font-size: 52px;
    line-height: 58px;
    margin-bottom: 32px;
}
.why-counter-items3 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 48px;
}
.why-area3 .sigle-counter-box .counter {
    font-weight: 700;
    font-size: 36px;
    line-height: 46px;
    color: var(--primaryFont);
}

.why-area3 .sigle-counter-box p {
    font-weight: 400;
    font-size: 18px;
    line-height: 36px;
    color: var(--fontMain);
}


/* main button  */
.why-buttons3 .main-button3 {
    color: #fff !important;
    background: var(--buttonBg);
    font-weight: 700;
    font-size: 18px;
    line-height: 32px;
    display: inline-block;
    padding: 20px 30px;
    border: 1px solid transparent;
    text-transform: capitalize;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
}
.why-buttons3 .main-button3:hover{
    color: var(--primaryFont) !important;
    background: transparent;
    border: 1px solid var(--buttonBg);
}

.why-buttons3 {
    margin-top: 60px;
}

/* why-patterns  */
.why-patterns3 img:nth-child(1) {
    top: 0;
    left: 81px;
    max-width: 45%;
}
.why-patterns3 img:nth-child(2) {
    bottom: 0;
    left: 0;
    max-width: 31%;
}
.why-patterns3 img:nth-child(3) {
    bottom: 0;
    right: 0;
    max-width: 15%;
}

/* vector */
.vector3 {
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}
.vector3 img{
    position: absolute;
}
.hero-vector3 img {
    bottom: 220px;
    left: 0;
    max-width: 25%;
}



/* 
--------------------------
index 3 Product area here css
--------------------------
*/
.product-area3 {
    position: relative;
    overflow: hidden;
    z-index: 1;
    padding: 130px 0px 142px 0px;
}
.product-top-items3 {
    display: flex;
    justify-content: space-between;
    align-items: end;
    margin-bottom: 55px;
}
.product-button3 .light-buttons3{
    width: 180px;
    height: 68px;
}
.light-buttons3 {
    font-weight: 400;
    font-size: 18px;
    line-height: 32px;
    background: transparent;
    border: 1px solid var(--buttonBg);
    color: var(--primaryFont);
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: capitalize;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
}
.light-buttons3:hover{
    background: var(--buttonBg);
    border: 1px solid transparent;
    color: var(--white);
}
.light-buttons3 i {
    margin-left: 20px;
    transition: none;
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
}
.product-item3 {
    background: var(--white);
    padding: 24px;
    border: 1px solid rgba(40, 69, 11, 0.1);
}
.product-item3 hr {
    margin: 0;
}
.product-info3 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    margin: 20px 0px 20px;
}
.product-thumb3 {
    overflow: hidden;
}
.product-thumb3 a {
    display: block;
}
.product-thumb3 img {
    width: 100%;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
}
.product-item3:hover .product-thumb3 img{
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
}
.product-desc3 {
    padding-right: 20px;
}
.product-desc3 p {
    font-size: 14px;
    line-height: 100%;
}
.product-reating3 {
    display: flex;
    margin: 10px 0px;
}
.product-reating3 li:first-child {
    margin-right: 8px;
}
.product-reating3 li {
    margin-left: 1px;
}
.product-reating3 a {
    font-weight: normal;
    font-size: 14px;
    line-height: 100%;
}
.product-reating3 .fas.fa-star{
    color: var(--buttonBg);
}
.product-reating3 li:first-child a,
.product-reating3 li:last-child a {
    color: var(--fontMain);
}
.product-meta3 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
}
.product-meta3 a {
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    color: var(--primaryFont);
}
.product-meta3 p {
    font-weight: bold;
    font-size: 20px;
    line-height: 100%;
    color: var(--buttonBg);
}
.product-item3 hr {
    background: rgba(39, 54, 75, 0.1);
}
.product-patterns3 img:nth-child(1) {
    bottom: 0;
    left: 80px;
    max-width: 11%;
}
.product-patterns3 img:nth-child(2) {
    top: 56px;
    right: 100px;
    max-width: 8%;
}
.product-vector3 img {
    bottom: 0;
    right: 0;
    max-width: 18%;
}


/* 
--------------------------
index 3 callUs area here css
--------------------------
*/
.call-us-area3 {
    background-image: url("../img/etutor/photo/help-baneer.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
    z-index: 2;
}
.call-us-item3 {
    position: relative;
    height: 577px;
    text-align: right;
}
.call-us-item3 a {
    display: inline-block;
    margin-top: 194px;
    z-index: 1;
}


/* 
--------------------------
index 3 clients area here css
--------------------------
*/
.clients-area3 {
    background: var(--bgMain);
    padding: 186px 0px 120px;
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.clients-patterns3 img:nth-child(1) {
    bottom: 0;
    left: 101px;
    max-width: 11%;
}
.clients-patterns3 img:nth-child(2) {
    top: 0;
    right: 191px;
    max-width: 62%;
}
.clients-title3 {
    margin-bottom: 60px;
}
.clients-content3 {
    position: relative;
}
.clients-content3 h4 {
    margin-bottom: 20px;
}
.clients-content3 p {
    font-size: 16px;
    line-height: 28px;
    margin-bottom: 24px;
}
.clients-item3 {
    background: var(--white);
    padding: 56px 60px;
}
.clients-item-inner3 {
    padding-left: 36px;
}
.clients-icon3 {
    position: absolute;
    max-width: 100%;
    left: -36px;
}
.clients-icon3 i{
    font-size: 24px;
    color: var(--buttonBg);
}
.clients-info3 {
    display: flex;
    align-items: center;
}
.clients-thumb3 {
    margin-right: 16px;
}
.clients-desc3 h6 {
    text-transform: capitalize;
}
.clients-desc3 p {
    font-size: 14px;
    line-height: 24px;
}
.clients-slider3 .slick-slide,
.blog-slider3 .slick-slide {
    margin-right: 32px !important;
}
.clients-slider3 .slick-list.draggable{
    width: 152%;
}
.slick-arrow i{
    transition: all 0s ease;
    -webkit-transition: all 0s ease;
    -moz-transition: all 0s ease;
    -ms-transition: all 0s ease;
    -o-transition: all 0s ease;
}
.slick-arrow {
    position: absolute;
    top: -124px;
    right: 0;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    cursor: pointer;
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
}
.clients-slider3 .slick-arrow {
    background: var(--white);
    color: var(--primaryFont);
}
.priv_arrow.slick-arrow {
    right: 76px;
}
.blog-slider3 .slick-arrow {
    background: #f3f3f3;
    color: var(--primaryFont);
}
.slick-arrow:hover{
    background: var(--buttonBg);
    color: var(--white);
}

/* 
--------------------------
index 3 Blog area here css
--------------------------
*/
.blog-area3 {
    position: relative;
    overflow: hidden;
    padding: 130px 0px;
    z-index: 1;
}
.blog-item3 .blog-item-inner {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 500px;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: end;
    padding: 48px;
}
.blog-item-inner1{
    background-image: url("../img/etutor/photo/blog1.png");
}
.blog-item-inner2{
    background-image: url("../img/etutor/photo/blog2.png");
}
.blog-item-inner3{
    background-image: url("../img/etutor/photo/blog3.png");
}
.blog-item3 .blog-item-inner::after{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(22, 45, 0, 0.8) 23.66%, rgba(12, 10, 46, 0) 100%);
    z-index: -1;
}
.blog-content3 p {
    font-size: 14px;
    line-height: 24px;
    color: var(--white);
}
.blog-content3 h4 {
    color: var(--white);
    margin-top: 4px;
}
.blog-item3 .main-button3 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 150px;
    height: 0px;
    color: #fff !important;
    background: var(--buttonBg);
    font-weight: 700;
    font-size: 18px;
    line-height: 32px;
    border: 1px solid transparent;
    text-transform: capitalize;
    visibility: hidden;
    opacity: 0;
    transform: scale(0);
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transition: all .3s ease !important;
    -webkit-transition: all .3s ease !important;
    -moz-transition: all .3s ease !important;
    -ms-transition: all .3s ease !important;
    -o-transition: all .3s ease !important;
}
.blog-item3:hover .main-button3 {
    margin-top: 28px;
    height: 50px;
    visibility: visible;
    opacity: 1;
    transform: scale(1);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
}
.blog-item3 .main-button3:hover {
    background-color: transparent;
    border: 1px solid var(--buttonBg);
}

/* blog-slider  */
.blog-slider3 .slick-list.draggable {
    width: 130%;
}

/* blog-patterns  */
.blog-patterns3 img {
    top: 58px;
    left: 79px;
    max-width: 10%;
}


/* 
--------------------------
index 3 footer area here css
--------------------------
*/
.footer-area3 {
    background: var(--bgMain);
    padding: 115px 0px 48px 0px;
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.footer-items3 {
    display: flex;
    justify-content: space-between;
}
.footer-item3 h4 {
    margin-bottom: 31px;
}
.footer-menu3 li a {
    font-weight: normal;
    font-size: 18px;
    line-height: 40px;
    mix-blend-mode: normal;
    color: var(--fontMain);
    display: inline-block;
    position: relative;
}
.footer-menu3 li a::after{
    content: '';
    position: absolute;
    bottom: 9px;
    left: 0;
    width: 0%;
    height: 2px;
    background-color: var(--primaryFont);
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
}
.footer-menu3 li:hover a::after {
    width: 70%;
}
.footer-menu3 li a:hover{
    color: var(--primaryFont);
}
.footer-top3 hr {
    margin: 48px 0px 50px;
}
.footer-bottom-items3 {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.footer-bottom-items3 .footer-bottom-logo3 {
    display: inline-block;
    line-height: 0;
}
.fbi-social-menu3 {
    display: flex;
}
.fbi-social-menu3 li {
    margin-left: 12px;
}
.fbi-social-menu3 li:hover a{
    opacity: .7;
}
.fbi-social-menu3 li:first-child{
    margin-left: 0px;
}
.fbi-social-menu3 li a {
    display: block;
}
.copyRight3 {
    line-height: 26px;
}
.footer-patterns3 img:nth-child(1) {
    top: 0;
    left: 90px;
    max-width: 8%;
}
.footer-patterns3 img:nth-child(2) {
    bottom: 0;
    right: 81px;
    max-width: 9%;
}
.footer-patterns3 img:nth-child(3) {
    top: 121px;
    right: 142px;
}
/*################## 
--------------------------
- Homepage 3 area ends here
--------------------------
##################*/


/* =====================15 feb========================== */
/* .hero-items h1.homepageMainHeader, .section-title.aos-init.aos-animate h1 {
    font-size: 80px !important;
    line-height: 80px;
} */
.blog-area .buttonorange{
    background-color: #000;
}
.st-wrapper h1 {
    margin-top: 40px;
}
.blog-area .buttonorange:hover{
    background-color: #ec6438 !important;
} 
.online-team-area .ota-items .ota-item{
border: 1px solid rgba(48,48,49, 0.2);
}
.ota-wrapper h1 {
    margin-top: 40px;
}
button.courses-filter-btn.aos-init.aos-animate {
    width: 100%;
}

.codeless-add-purchase-button {
    position: fixed;
    bottom: 105px;
    right: 19px;
    height: 70px;
    background: rgba(137, 189, 73, .25);
    border: none;
    -webkit-box-shadow: 0 2px 4px rgb(0 0 0 / 7%);
    box-shadow: 0 2px 4px rgb(0 0 0 / 7%);
    -webkit-border-radius: 100%;
    border-radius: 100%;
    color: #fff;
    padding: 0;
    padding-right: 10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    z-index: 99;
    font-size: 0;
    font-weight: bold;
    color: #fff !important;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}
.codeless-add-purchase-button i.icon {
    height: 50px;
    width: 50px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: #5fd64f;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    margin: 10px 0 10px 10px;
    -webkit-transition: all cubic-bezier(.4, 0, .2, 1) .4s;
    -o-transition: all cubic-bezier(.4, 0, .2, 1) .4s;
    transition: all cubic-bezier(.4, 0, .2, 1) .4s;
}
.codeless-add-purchase-button i.icon svg {
    height: 30px;
    position: relative;
    bottom: 1px;
}
.codeless-add-purchase-button i.icon:after {
    content: "";
    position: fixed;
    display: block;
    height: 70px;
    width: 70px;
    background: rgb(155 230 145 / 40%);
    z-index: -1;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -webkit-animation: 3s ease-in-out infinite pulse;
    animation: 3s ease-in-out infinite pulse;
}
.codeless-add-purchase-button i.icon svg path {
    fill: #fff;
}

img.icon.mobile-icon {
    height: 30px;
    width: auto;
}

img.icon.mobile-icon-cancel {
    height: 15px;
    width: auto;
}

@-webkit-keyframes pulse {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0
    }
    25% {
        -webkit-transform: scale(1.4);
        transform: scale(1.4);
        opacity: 1
    }
    55% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0
    }
}

@keyframes pulse {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0
    }
    25% {
        -webkit-transform: scale(1.4);
        transform: scale(1.4);
        opacity: 1
    }
    55% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0
    }
}

.reduce-padding{
	padding-top: 0px;
}

.reduce-padding-2{
	padding-top: 20px;
}