/* Home Banner Area css
============================================================================================ */
.home-banner-area {
	background: #ffffff;
	position: relative;
	.logo {
		position: absolute;
		right: 24%;
		top: 30px;
		img {
			width: auto !important;
		}
		@media (max-width: 991px) {
			display: none;
		}
	}
	.owl-nav {
		right: 58%;
		position: absolute;
		bottom: 30px;
		@include flex();
		@include transform(translateX(-50%));
		@media (max-width: 991px) {
			display: none;
		}
		.owl-prev {
			@include transform(rotate(180deg));
			position: relative;
			top: 3px;
			margin-right: 40px;
		}
		.owl-prev,
		.owl-next {
			@include filter(brightness(0) invert(1));
			@include transition();
			opacity: .4;
			&:hover {
				opacity: 1;
			}
		}
	}

	.main_btn {
		font-size: 14px;
		position: absolute;
		right: 0%;
		bottom: 1px;
		overflow: hidden;
		min-width: 700px;
		border-radius: 0px;
		line-height: 100px;
		font-size: 18px;
		@media (max-width: 1199px) {
			min-width: 400px;
			line-height: 60px;
		}
		@media (max-width: 1024px) {
			font-size: 14px;
		}
		@media (max-width: 991px) {
			display: none;
		}
		img {
			width: auto !important;
			display: inline-block !important;
			@include filter(brightness(0) invert(1));
			margin-left: 32px;
			@include transition();
		}
		&:hover {
			img{
				margin-left: 50px;
			}
		}
	}
}

@media (max-width: 767px) {
	.fullscreen {
		height: 100% !important;
	}
}

.header-left {
	position: relative;
	padding-right: 0px;
	@media (max-width: 576px) {
		padding-right: 15px;
	}
}

.header-right {
	padding-left: 4%;
	padding-right: 48px;
	@media (max-width: 1440px) {
		padding-left: 11%;
	}
	@media (max-width: 1300px) {
		padding-left: 5%;
	}
	@media (max-width: 1199px) {
		margin-top: 60px;
		padding-left: 15px;
	}
	@media (max-width: 992px) {
		max-width: 720px;
		margin-left: 15px;
		margin-right: 15px;
	}
	h1 {
		font-size: 60px;
		line-height: 1;
		font-weight: 400;
		@media (max-width: 1440px) {
			font-size: 45px;
		}
		@media (max-width: 991px) {
			font-size: 35px;
		}
		br {
			@media (max-width: 1440px) {
				display: none;
			}
		}
	}
}

/* Blog Area css
============================================================================================ */
.home_slider {
	.swiper-slide {
		position: relative;
		.slider_text {
			position: absolute;
			left: 50%;
			top: 50%;
			transform: translateX(-50%) translateY(-50%);
			z-index: 5;
			opacity: 0;
			transition: all 4s ease;
			text-align: center;
			h1 {
				text-transform: capitalize;
				color: #ffffff;
				font-size: 80px;
				font-weight: 300;
				margin-bottom: 30px;
			}
			p {
				color: #ffffff;
				max-width: 516px;
				margin: 0 auto;
				font-size: 14px;
				margin-bottom: 50px;
			}
		}
		&.swiper-slide-active {
			.slider_text {
				opacity: 1;
			}
		}
	}
}
/* End Blog Area css
============================================================================================ */

/* Banner Area css
============================================================================================ */

.common_banner_area {
	position: relative;
	z-index: 1;
	min-height: 450px;
	@media (max-width: 1680px) {
		min-height: 398px;
	}
	@media (max-width: 1440px) {
		min-height: 340px;
	}
	.col-lg-8,
	.col-lg-4 {
		padding-left: 0;
		padding-right: 0;
	}
	.header-right {
		padding-left: 5%;
		@media (max-width: 991px) {
			padding-right: 50%;
			padding-top: 40px;
		}
		@media (max-width: 767px) {
			margin-bottom: 130px;
			padding-right: 10%;
		}
		h1 {
			font-size: 60px;
		}
		@media (max-width: 991px) {
			p {
				margin-bottom: 0;
			}
		}
	}
	.page_link {
		position: absolute;
		right: 0;
		bottom: 0;
		width: 35%;
		background: $baseColor;
		line-height: 100px;
		padding: 0 95px;
		@media (max-width: 1380px) {
			width: 33.3%;
		}
		@media (max-width: 991px) {
			width: 45%;
			bottom: 20px;
			padding: 0 80px;
		}
		@media (max-width: 767px) {
			width: 100%;
			bottom: 0px;
		}
		a {
			font-size: 14px;
			color: #fff;
			font-family: $text-font;
			margin-right: 30px;
			position: relative;
			text-transform: capitalize;
			&:before {
				content: "\f178";
				font: normal normal normal 14px/1 FontAwesome;
				position: absolute;
				right: -25px;
				top: 50%;
				transform: translateY(-50%);
			}
			&:last-child {
				margin-right: 0px;
				&:before {
					display: none;
				}
			}
		}
	}
}

/* End Banner Area css
============================================================================================ */
