// COMMON IMPORTS
@import "../config/imports";

// Fonts
$font-secondary: "Poppins", sans-serif;

body {
	font-family: $font-secondary;
}

/*
* Container
*/
@media (min-width: 1240px) {
	.container {
		max-width: 1240px !important
	}
}

/*
* BG
*/
.custom-bg-color-lighter-grey {
	background: #fafafc !important;
}

.custom-bg-color-light-grey {
	background: #dde2ea !important;
}

/*
* Custom Button
*/
.custom-btn {
	height: 60px;
	line-height: 60px;
	text-align: center;
}

/*
* Half Section
*/
.col-half-section {
	max-width: 590px;
}

@media (max-width: 1199px) {
	.col-half-section {
		max-width: 455px;
	}
}

@media (max-width: 991px) {
	.col-half-section {
		max-width: 750px;
	}
}

@media (max-width: 767px) {
	.col-half-section {
		max-width: 570px;
	}
}

@media (max-width: 575px) {
	.col-half-section {
		max-width: 100%;
	}
}

/*
* Letter Spacing
*/
.custom-letter-spacing-1 {
	letter-spacing: -0.5px !important;
}

.custom-letter-spacing-2 {
	letter-spacing: -0.8px !important;
}

/*
* Font Size
*/
.custom-text-1 {
	font-size: 32px !important;
}

/*
* Line Pre
*/
.line-pre-title {
	width: 50px;
	height: 3px;
	margin-#{$right}: 20px;
	display: inline-block;
	vertical-align: middle;
}

html[dir="rtl"] {
	.slider-container {
		.line-pre-title {
			margin-right: 20px;
			margin-left: 0;
		}	
	}
}

/*
* Circular Bar
*/
.custom-circular-bar .circular-bar-chart {
	position: relative;
	overflow: hidden;
	height: 175px;
}

/*
* Card
*/
.card-accordion-our-services-container {
	border: 1px solid #eef0f4;
	.card-accordion-our-services {
		border: 9px solid #eef0f4;
		border-top: 0;
		margin: -2px -1px 0 -1px;
	}
}

.custom-cards {
	position: relative;

	&.custom-cards-slider {
		.cards-container {
			margin: side-values(-250px auto 0);
		}
	}

	@media (max-width: 1199px) {
		height: auto;
	}

	.cards-container {

		&:before {
			height: 100%;
			width: 100%;
			top: 0;
			#{$left}: 0;
		}

		@media (max-width: 1199px) {
			position: static;
			padding-bottom: 0;
		}

		> div {

			@media (max-width: 1199px) {
				&:nth-child(1),
				&:nth-child(2) {
					.card {
						margin-top: 0;
						padding-bottom: 0
					}
				}
			}
		}
		
		.card {
			padding: 70px 0;
			box-shadow: 0 0 50px rgba(0, 0, 0, 0.07);

			&:before {
				box-shadow: none !important;
			}

			.card-body {
				padding: 0 50px;
				border-#{$right}: 1px solid #eef0f4;

				@media (max-width: 1199px) {
					border-#{$right}: 0;
				}

				img {
					padding-bottom: 35px;
				}

				.card-title {
					font-size: 24px;
				}

				.card-text, .card-title {
					margin: 0;
				}
			}
		}
	}
}

/*
* Header
*/
.header-top {
	.header-top-phone {
		font-size: 16px !important;
		padding: side-values(6px 17px 6px 0) !important;

		> span {
			width: 34px;
			height: 34px;
			line-height: 31px;
			background-color: #dde2ea;
			border-radius: 50%;
			text-align: center;
			margin-#{$right}: 8px;
		}
	}

	.header-top-email,
	.header-top-opening-hours {
		font-size: 12px !important;
		letter-spacing: -0.3px;

		> span {
			width: 34px;
			height: 34px;
			line-height: 31px;
			background-color: #dde2ea;
			border-radius: 50%;
			text-align: center;
			margin-#{$right}: 6px;
		}
	}

	.header-top-email {
		margin-#{$right}: 15px;
	}

	.nav-item-header-top-socials {
		.header-top-socials {
			ul {
				li {
					margin-#{$right}: 30px;
	
					i {
						font-size: 15px !important
					}
				}
			}
		}
	}

	.header-top-button-make-as-appoitment {
		width: 230px;
		a {
			font-size: 12px;
			border-radius: corner-values(0 0 4px 4px);
		}
	}
}

@media (min-width: 992px) {
	.header-container {
		.header-nav {
			.nav {
				li {
					> a {
						text-transform: none !important;
						font-size: 14px !important;
					}

					.dropdown-menu {
						a {
							font-size: 0.8em !important;                        
						}
					}

					&:hover {
						> a {
							background: #fff !important;

							&:before {
								border-bottom: 0 !important
							}

							& + ul {
								&.dropdown-menu {
									border-top: 0 !important;
									margin-top: -5px !important;
								}
							}
						}
					}
				}
			}
		}
	}
}

.header-column-search {
	flex-grow: 0.14 !important;

	@media (max-width: 1199px) {
		flex-grow: 0.3 !important;
	}

	@media (max-width: 991px) {
		order: 2;
		flex-grow: 0.1 !important;
		align-items: center !important;
	}
}

.header-column-logo {
	@media (max-width: 991px) {
		order: 1
	}
}

.header-column-nav-menu {
	@media (max-width: 991px) {
		order: 3;
		flex-grow: 0 !important;
	}
}

.header-nav-features {
	padding: 0 !important;
	margin: 0 !important;

	&:not(.header-nav-features-no-border) {
		&:before {
			display: none !important
		}
	}
}

/*
* Slider
*/
.slider-container {
	.custom-bottom-label {
		width: 200px;
		height: 60px;
		letter-spacing: -0.35px !important;
		font-size: 14px !important;
		line-height: 60px !important;
		border-radius: 4px !important;
	}

	.section-funnel-layer-bottom {
		position: absolute;
		bottom: 0;
		#{$left}: 0;
		width: 100%;
		padding: 6rem 0;
		transform: translate3d(0, 50%, 0);
		z-index: 20;

		.section-funnel-layer:nth-child(1) {
			transform: skewY(4.7deg);
			position: absolute;
			top: 0;
			#{$left}: 0;
			width: 100%;
			height: 100%;
			background: #FFF;
			z-index: 6;
		}
		
		.section-funnel-layer:nth-child(2) {
			transform: skewY(-4.7deg);
			position: absolute;
			top: 0;
			#{$left}: 0;
			width: 100%;
			height: 100%;
			background: #FFF;
			z-index: 6;
		}
	}

	.tparrows {
		background: transparent !important;

		&:hover {
			background: transparent !important;
		}

		&:before {
			color: #222529 !important;
			font-size: 22px;
			font-weight: 900;
		}
	}
}

.custom-slider-container {

	&:before {
		content: '';
		position: absolute;
		background-color: #fafafc;
		top: -75px;
		width: 200%;
		z-index: 21;
		height: 75px;
		transform: rotate(-1deg);

		@media (max-width: 1199px) {
			display: none;
		}
	}

	&:after {
		content: '';
		position: absolute;
		background-color: #fafafc;
		bottom: -75px;
		width: 200%;
		z-index: 21;
		height: 75px;
		transform: rotate(1deg);

		@media (max-width: 1199px) {
			display: none;
		}
	}

}

.custom-tp-caption-right-side {
	width: 50%;
}

.tp-bullet {
	width: 16px;
	height: 16px;
	box-shadow: 0 0 0 2px #222529 !important;
	opacity: .5;

	&.selected {
		opacity: 1;
		box-shadow: 0 0 0 2px #222529 !important;

		.tp-bullet-inner {
			display: block
		}
	}

	.tp-bullet-inner, .tp-bullet-inner:hover {
		transform: scale(0.5) !important;
	}

	.tp-bullet-inner {
		display: none
	}
}

/*
* Social Icons
*/
.custom-social-icons {
	li {
		box-shadow: none !important;
		margin: side-values(-1px 13px 0 0);

		a {
			width: 38px;
			height: 38px;
			line-height: 41px;
		}

		&:hover {
			a {
				color: #333 !important;
				> i[class*="text-color-"] {
					color: #FFF !important;
				}
			}
		}
	} 
}

/*
* Circular Bar
*/
.circular-bar {
	strong {
		top: 49%;
		font-size: 22px !important;
		transform: translateY(-50%);
	}
}

/*
* Custom Counters
*/
.custom-counters {
	.counter {
		&:first-child {
			margin-#{$right}: 70px !important;
		}

		strong {
			font-size: 40px !important
		}

		label {
			font-size: 15px
		}
	}
}

/*
* Our Services
*/
.col-img-our-services {
	&:before {
		content: '';
		position: absolute;
		display: block;
		background-color: #fafafc;
		top: -78px;
		#{$left}: -10px;
		width: 200%;
		z-index: 21;
		height: 75px;
		transform: rotate(-2deg);
	}

	&:after {
		content: '';
		position: absolute;
		display: block;
		background-color: #fafafc;
		bottom: -78px;
		#{$left}: -10px;
		width: 200%;
		z-index: 21;
		height: 75px;
		transform: rotate(2deg);
	}

	@media (max-width: 991px) {
		display: none;
	}
}

.our-services {
	background-position-y: center;
	background-repeat: no-repeat;
	background-size: auto;
	height: auto;
	position: relative;
	overflow: hidden;
	@include if-rtl() {
		background-position: right;
	}

	@media (min-width: 1200px) {
		min-height: 850px;
	}

	@media (max-width: 991px) {
		background: none !important;
	}

	&:after {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		#{$right}: 0;
		width: 50%;
		height: 100%;
		background-color: #fff;
		z-index: 0;
	}
}

/*
* Coaching Consulting
*/
.coaching-consulting {
	
	.col-coaching-consulting-imgs {
	
		.card {
			position: absolute;

			&:nth-child(1) {
				z-index: 1;
				top: 0;
				#{$right}: 20px;
			}
		
			&:nth-child(2) {
				z-index: 3;
				bottom: 30px;
				#{$left}: 60%;
				transform: translateX(-50%);
			}
		
			&:nth-child(3) {
				z-index: 2;
				#{$left}: 40px;
				bottom: 10%;
			}
		}

		@media (max-width: 991px) {
			.card {
				position: relative;
				max-width: 30%;
				margin-top: 30px;
				transform: none !important;
				top: 0 !important;
				#{$left}: 0 !important;
				bottom: 0 !important;
				#{$right}: 0 !important;
				float: left;
				margin-#{$right}: 3.33%;
			}
		}

	}
}

/*
* Real Word Stories
*/
.real-word-stories {
	&:before {
		content: '';
		position: absolute;
		display: block;
		background-color: #fafafc;
		top: -75px;
		width: 200%;
		z-index: 21;
		height: 75px;
		transform: rotate(-1deg);

		@media (max-width: 1199px) {
			display: none;
		}
	}

	.owl-dots {
		display: flex;
		margin-top: 30px !important;
		position: absolute;
		#{$left}: 50%;
		transform: translateX(-50%);

		button {
			border: 2px solid #222529 !important;
			width: 15px;
			height: 15px;
			border-radius: 50%;
			line-height: 15px !important;
			text-align: center;
			position: relative;
			margin-#{$right}: 4px;

			&:last-child {
				margin-#{$right}: 0
			}

			span {
				display: none !important;
				margin: 0 auto !important;
				width: 7px !important;
				height: 7px !important;
				background-color: #222529 !important;
			}

			&.active {
				span {
					display: block !important;
				}
			}
		}
	}

	.custom-testimonial-container {
		width: 72.5%;
		padding-#{$right}: 150px;

		@media (max-width: 1199px) {
			padding-#{$right}: 200px;
		}

		@media (max-width: 991px) {
			padding-#{$right}: 200px;
		}

		@media (max-width: 767px) {
			padding-#{$right}: 120px;
		}

		@media (max-width: 575px) {
			width: 100%;
			padding-#{$right}: 40px;
		}

		.custom-testimonial {
			padding: side-values(45px 0 45px 40px);
			blockquote {
				p, h4 {
					font-family: Poppins
				}
			}
			.testimonial-author {
				strong {
					font-size: 18px
				}
		
				img {
					max-width: 70px;
					max-height: 70px;
				}
			}
			.custom-testimonial-right {
				width: 45%;
				height: 210px;
				#{$right}: 30px;
				top: 65px;
				box-shadow: 0 0 30px rgba(0, 0, 0, 0.08);

				img {
					max-width: 130px;
					height: auto;
				}

				.custom-button-testimonial-right {
					width: 165px;
					height: 50px;
					line-height: 50px;
					bottom: -25px;
				}
			}
		}
	}
}

/*
* Are You Lookng For
*/
.are-you-looking-for {
	padding: 70px 0;

	.are-you-looking-for-phone { 
		margin-#{$right}: 37px;

		> span {
			width: 48px;
			height: 48px;
			line-height: 46px;
			background-color: #dde2ea;
			border-radius: 50%;
			text-align: center;
			margin-#{$right}: 8px;
		}
	}
}

/*
* Page Header
*/
.custom-page-header {

	padding: 75px 0;
	margin: 0;
	overflow: hidden;

	@media (max-width: 1199px) {
		padding: 35px 0;
	}

	&:before {
		content: '';
		position: absolute;
		background-color: #fafafc;
		top: -75px;
		width: 200%;
		z-index: 21;
		height: 75px;
		transform: rotate(-1deg);

		@media (max-width: 1199px) {
			display: none;
		}
	}

	&:after {
		content: '';
		position: absolute;
		background-color: #fafafc;
		bottom: -75px;
		width: 200%;
		z-index: 21;
		height: 75px;
		transform: rotate(1deg);

		@media (max-width: 1199px) {
			display: none;
		}
	}

}

/*
* Contact Form
*/
.custom-form-style-1 {
	.form-control {
		border: 0;
		padding: 1.2rem;
		box-shadow: none !important;
		height: auto;
		background: #fafafc !important;
	}
}

/*
* Footer
*/
#footer {

	font-size: 1em;

	&:before {
		content: '';
		position: absolute;
		display: block;
		background-color: #fafafc;
		top: -75px;
		width: 200%;
		z-index: 21;
		height: 75px;
		transform: rotate(-1deg);

		@media (max-width: 1199px) {
			display: none;
		}
	}

	.custom-container-info-socials {
		@media (min-width: 1200px) and (max-width: 1240px) {
			justify-content: flex-end !important;
		}
	}

	.footer-nav-phone {
		font-size: 16px !important;
		padding: side-values(0 17px 0 0) !important;

		> span {
			width: 34px;
			height: 34px;
			line-height: 31px;
			background-color: #dde2ea;
			border-radius: 50%;
			text-align: center;
			margin-#{$right}: 8px;
		}
	}

	.footer-nav-email,
	.footer-nav-opening-hours {
		font-size: 12px !important;
		letter-spacing: -0.3px;

		> span {
			width: 34px;
			height: 34px;
			line-height: 31px;
			background-color: #dde2ea;
			border-radius: 50%;
			text-align: center;
			margin-#{$right}: 6px;
		}
	}

	.footer-nav-email {
		margin-#{$right}: 15px;
	}

	.footer-nav-opening-hours {
		margin-#{$right}: 20px;
	}

	.footer-copyright {
		border-top: 1px solid #ced6e1;
		padding: 60px 0;
	}

	.footer-column-get-in-touch {
		@media ( max-width: 991px ) {
			margin: 1rem 0
		}
	}

	.nav-footer {
		> ul {
			padding: 0;

			li {
				list-style: none
			}
		}

		.dropdown-secondary {
			a {
				font-size: 14px;
			}
		}
	}

	.custom-row-footer {
		padding-top: 150px !important;

		@media (max-width: 1199px) { 
			padding-top: 60px !important;			
		}

		.custom-footer-column-logo {
			img {
				margin-bottom: 35px;
			}
		}
	}
}