.pxl-slider-item-1, .pxl-slider-item-2{
	.pxl-slide-item-wrap{
		overflow: hidden;
		padding: 289px 0 298px;
		@media (max-width: 1280px) {
			padding: 230px 0;
		}
		@media (max-width: 1024px) {
			padding: 160px 0;
		}
		@media (max-width: 767px) {
			padding: 140px 0;
		}
		@media (min-width: $xl_min) and (max-width: 1280px){
			.container{
				max-width: 1024px;
			}
		}
		.slide-content-wrap{
			width: 100%;
			.sl-content{
				position: relative;
				@include d-flex();
				align-items:center;
				.sl-content-inner {
					width: 100%;
				}
			}
			.sl-content-right{
				@media (min-width: $md_min){
					flex: 0 0 50%;
					width: 50%;
				}
			}
		}
	}
	.pxl-slide-bg-video {
		overflow: hidden;
		height: 100vh;
		.pxl-overlay {
			background-color: rgba(30,31,34,.5);
		}
		video {
			height: 100%;
			object-fit: cover;
		}
		.pxl-overlay--gradient {        
			position: absolute;
			bottom: 0;
			width: 100%;
			height: 30%;
			background: linear-gradient(0deg, $body_bg_color 0%, rgba(255,255,255, 0.0) 100%);
		}
		.pxl-overlay--gradient-top {        
			position: absolute;
			top: 0;
			width: 100%;
			height: 30%;
			background: linear-gradient(180deg, $body_bg_color 0%, rgba(255,255,255, 0.0) 100%);
		}
	}
	.small-heading{
		position: relative;
		display: inline-block;
		font-weight: bold;
		color: #ffffff;
		letter-spacing: 0;
		border: solid 2px rgba(255, 255, 255, .25);
		padding: 1px 15px 1px 35px;
		border-radius: 30px;
		-moz-border-radius: 30px;
		-webkit-border-radius: 30px;
		margin-bottom: 24px;
		&:before {
			animation: blinkingText 1s infinite;
			content: '';
			position: absolute;
			width: 16px;
			height: 16px;
			background: $primary_color;
			border-radius: 20px;
			-moz-border-radius: 20px;
			-webkit-border-radius: 20px;
			top: 7.5px;
			left: 10px;		
			box-shadow: 0 0 10px 0px rgba($primary_color_hex, 1);
		}
	}
	.pxl-item--rating {
		margin-top: 31px;
		.pxl-item--star {
			margin: 0 1px;
			i {
				color: #F2B827;		
				&.empty {
					color: #706128 !important;
				}	
			}
		}	
		span {
			color: #fff;
			&.pxl-text {
				margin-left: 10px;
			}
		}
	}
	.large-heading{						
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		@include background-gradient-text(0deg, #888 0%, #fff 75%);  
		text-transform: uppercase;
		margin-bottom: 3px;
	}
	.desc{
		margin-bottom: 20px;
		p {
			max-width: 600px;
		}
	}
	.starting {
		display: block;
		margin-bottom: 5px;
		color: rgba(255, 255, 255, .75);
	}
	.btn {
		@include background-gradient-rotate(to right, $gradient_color_from, $gradient_color_to);    
		border: none;
		span {
			color: #fff;
		}		
	}
	.pxl-item--meta {
		align-items: baseline;
		display: flex;
		font-family: 'Outfit';
		font-weight: bold;		
		.pxl-item--price {
			font-size: 56px;
			-webkit-background-clip: text;
			-webkit-text-fill-color: transparent;
			@include background-gradient-text(0deg, #888 0%, #fff 75%); 
			margin-right: 15px;
			.pxl-item--currency {
				margin-right: 5px;
			}
		}
		.pxl-item--currency,.pxl-item--time {
			font-size: 16px;
			font-family: 'Inter';
			color: var(--secondary-color);			
			-webkit-text-fill-color: initial;	
		}
	}
}

.pxl-slider-item-2 {
	.slide-content-wrap {
		.sl-content-inner {
			display: flex;
			@include background-gradient-rotate(180deg, rgba(30,31,34,0.75) 0%, rgba(30,31,34,.0) 100%); 
			overflow: hidden;
			border-radius: 20px; 
			padding: 3rem;  	
			margin: 0 auto;
			max-width: 843px;
			color: rgba(255, 255, 255, .75);
			@media (max-width: 1024px) {
				flex-direction: column;
				@media (max-width: 767px) {
					padding: 3rem 15px;
				}
			}
			>div {
				@media (max-width: 1024px) {
					width: 100%;
					max-width: 100%;
					padding-left: 15px !important;
					padding-right: 15px !important;					
				}
			}
			.sl-content-inner-left {
				padding-left: 0;
			}
			.sl-content-inner-right {
				padding-right: 0;
				.btn {
					height: auto;
					padding: 3px 20px 2px 20px;
					margin-bottom: 29px;
				}
				.pxl-item--meta {
					flex-direction: column;
					margin-bottom: 19px;
					.pxl-item--price {
						margin-bottom: 4px;
					}
				}
				.pxl-item--location {
					.server-location {
						img {
							width: 32px;
							height: 32px;
							padding: 4px;
						}
					}
				}
			}
			.large-heading {
				letter-spacing: 0;
			}		
		}
	}
}

.pxl-slider-thumbs {
	display: flex;
	>.pxl-slider-container {
		width: 80%;
		overflow: hidden;
		@media #{$max-sm} {
			width: 100%;
		}
	}
	.pxl-sliders-thumbs {
		width: 20%;
		margin-left: 10px;
	}
}
.pxl-sliders-thumbs{
	margin-left: auto;
	margin-right: auto;
	position: relative;
	overflow: visible;
	z-index: 0;
	@media #{$max-sm} {
		&.mobile-hidden{
			display: none;
		}
	}
	.pxl-thumbs-wrapper{
		width: 100%;
		height: 100%;
		position: relative;
		z-index: 1;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;  
		flex-direction: column;
		-webkit-box-sizing: content-box;
		box-sizing: content-box;
		align-content: flex-end;
	}
	.thumb-item{
		@include d-flex();
		align-items: end;
		align-self: flex-end;
		cursor: pointer;
	} 
	.swiper-slide-thumb-active{
		.thumbs-wrap{
			opacity: 1;
			&:before{
				@include transform(translatey(100%));
			}
		}
	}
	.thumbs-wrap{
		width: 100%;
		height: 100%;		
		opacity: 0.75;
		padding: 0 15px 0 40px;
		position: relative;
		@include transition(opacity .3s linear);
		background-position: center;
		background-size: cover;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		@media (max-width: 1024px) {
			padding: 0;
		}
		.num{
			color: #ffffff;
			font-size: 12px;
			font-weight: bold;
			background: $primary_color;
			padding: 2px 10px;
			margin-bottom: 8px;
			border-radius: 30px;
			-moz-border-radius: 30px;
			-webkit-border-radius: 30px;
			@include transition(color .3s linear);
		}
		.title{
			font-size: 22px;
			color: #fff;
			@include transition(color .3s linear);
			margin-bottom: 0;
			@media (max-width: 991px) {
				font-size: 20px;
			}
		}
	}
}
.pxl-sliders-wrap{
	position: relative;
	overflow: hidden;
}
.pxl-slider-container{
	margin-left: auto;
	margin-right: auto;
	position: relative;
	overflow: visible;
	z-index: 0;
}

.pxl-slider-wrapper{
	position: relative;
	width: 100%;
	height: 100%;
	z-index: 1;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-transition-property: -webkit-transform;
	transition-property: -webkit-transform;
	-o-transition-property: transform;
	transition-property: transform;
	transition-property: transform,-webkit-transform;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
}
.pxl-slider-item-1{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-negative: 0;
	flex-shrink: 0;
	width: 100%;
	height: 100%;
	position: relative;
	&.swiper-slide-active {
		opacity: 1 !important;
	}
	>div{
		width: 100%;
	}
	.pxl-slide-bg{
		width: 100%;
		height: 100%;
		background-position: 50%;
		background-size: cover;
		background-position: center center;
		.pxl-overlay {
			background: rgba(30,31,34,.25);
		}
	}
	.pxl-btn{
		position: relative;
		z-index: 1;
	}
}

.pxl-slider-arrow-wrap{
	@include d-flex();
	z-index: 2;
	&.pos-absolute{
		&.wrap{
			position: absolute;	
			left: 48%;
			bottom: 30px;
		}
		&.separate{
			.pxl-slider-arrow-prev{
				position: absolute;	
				left: 22px;
				top: 50%;
				@include transform(translatey(-50%));
			}
			.pxl-slider-arrow-next{
				position: absolute;	
				right: 22px;
				top: 50%;
				@include transform(translatey(-50%));
			}

		}
	}
	&.pos-df{
		margin-top: 30px;
		>div{
			margin: 0 10px;
		}
		&.wrap{
			justify-content: center;
		}
	}

	&.separate{
		justify-content: space-between;
	}

}


.pxl-slider-arrow{
	text-rendering: auto;
	text-rendering: optimizespeed;
	z-index: 2;
	text-align: center;
	cursor: pointer;
	width: 44px;
	height: 60px;
	line-height: 60px;
	border-radius: 50%;
	@include transition(all .3s ease);
	&.swiper-button-disabled{
		cursor: not-allowed;
	}
	.arrow-text{
		font-size: 16px;
		position: relative; 
	}
	.swiper-button-disabled .arrow-text:after{
		display: none;
	}
	svg {
		margin-top: 3px;
	}
	.pxl-icon{
		font-size: 44px;
		width: 27px;
		height: 44px;
		line-height: 44px;
		border-radius: 50%;
		display: block;
		z-index: 2;
		text-align: center;
		background-color: transparent;
		color: #fff;
		@include transition(all .3s ease);
		&:hover{
			background-color: rgba(255, 255, 255, .2);
		}

		&.swiper-button-disabled {
			cursor: not-allowed;
		}
	} 
	
}

.layout-square-thums{
	.pxl-slider-arrow{
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center center;
		position: relative;
		overflow: hidden;
		&:before{
			content: "";
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background-color: #{'rgba(var(--primary-color-rgb),0.21)'};
			@include transition(all .3s ease);
		}
		&:hover:before{
			background-color: rgba(#000000,0.3);
		}
		.pxl-icon{
			font-size: 36px;
			width: 92px;
			height: 116px;
			line-height: 116px;
			position: relative;
			background-color: transparent;
			&:hover{
				background-color: transparent;
			}
		}
	}
}
.layout-thums-title{
	background-color: #fff;
	width: 40.6%;
	overflow: hidden;
	.thums-title-wrap{
		&:before{
			content: "";
			width: 97px;
			height: 1px;
			background-color: #7dc001;
			position: absolute;
			top: 25px;
			left: calc(42% - 70px);
			z-index: 1;
		}
	}
	.pxl-slider-arrow{
		@include d-flex-align-center();
	}
	.thums-title-next,
	.thums-title-prev{
		overflow: hidden;
	}
	.thums-title-prev{
		@include transform(translatey(100%));
		@include transition(transform .3s $cubic);
	}
	.thums-title-next{
		@include transform(translatey(0));
		@include transition(transform .3s $cubic);
	}
	.pxl-icon{
		font-size: 42px;
		width: 106px;
		height: 186px;
		line-height: 186px;
		position: relative;
		background-color: #fff;
		color: #000;
		&:hover{
			background-color: transparent;
		}
	}
	.thums-title-img{
		width: 42%;
		height: 186px;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center center;
		position: relative;
		overflow: hidden;
	}
	
	.thums-title-title{
		padding-left: 45px;
		text-align: left;
		.sub-title{
			font-size: 12px;
			text-transform: uppercase;
			color: #201d1d;
			letter-spacing: 0.05em;
			font-weight: 500;
		}
		.custom-title{
			font-size: 32px;
			line-height: 1.1429;
			font-family: $heading_font_family;
			font-weight: 700;
			color: $heading_color;
		}
	}
	.pxl-slider-arrow-prev{
		&:hover +.thums-title-wrap{
			.thums-title-prev{
				@include transform(translatey(0));
			}
			.thums-title-next{
				@include transform(translatey(-100%));
			}
			
		}
	}
	&.dark{
		background-color: #080808;
		.pxl-slider-arrow{
			background-color: #080808;
			.pxl-icon{
				background-color: #080808;
				color: #fff;
			}
		}
		.thums-title-title .sub-title{
			color: #b7b7b7;
		}
		.thums-title-title .custom-title{
			color: #fff;
		}
	}
}
.pxl-slider-left {
	position: absolute;
	right: 40px;
	bottom: 32px;
	z-index: 1;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	@media (max-width: 1200px) {
		bottom: 32px;
	}
}
.pxl-slider-dots1 {
	z-index: 1;	
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: baseline;
	font-size: 20px;
	font-weight: 400;	
	line-height: 42px;	
	transition: .5s;		
	flex-direction: row;
	.slidenumber {
		font-size: 40px;
		color: #fff;
		margin-right: 5px;
		margin-bottom: 5px;
	}
}
.pxl-slider-dots{
	z-index: 1;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	&:not(.absolute){
		margin-top: 20px;	
	}
	&.style-bullets{
		.pxl-slider-pagination-bullet {
			flex: 0 0 18px;
			width: 18px;
			height: 18px;
			padding: 0 17px;
			line-height: 18px;
			text-align: center;
			background: transparent;
			cursor: pointer;
			@include opacity(1);
			position: relative;
			&:before {
				content: '';
				width: 10px;
				height: 10px;
				border: 2px solid rgba(#1a1a1a, 0.2);
				background: transparent;
				border-color: #ffffff;
				display: block;
				position: absolute;
				top: 50%;
				left: 50%;
				@include transform(translate(-50%, -50%));
				@include border-radius(50%);
				@include box-shadow(0 0 0 8px rgba(255, 255, 255, 0));
				@include transition( all .5s);
			}
			&:after {
				content: '';
				width: 10px;
				height: 10px;
				display: block;
				background: transparent;
				position: absolute;
				top: 50%;
				left: 50%;
				background-color: #ffffff;
				visibility: hidden;
				@include transform(translate(-50%, -50%));
				@include border-radius(50%);
				@include box-shadow(0 0 0 10px rgba(255, 255, 255, 0));
				@include transition( all .5s);
			}

			&:hover,
			&.swiper-pagination-bullet-active {
				&:after {
					opacity: 1;
					visibility: visible;
				}
			}
		}
	}
	&.style-squared{
		.pxl-slider-pagination-bullet {
			flex: 0 0 12px;
			width: 12px;
			height: 12px;
			line-height: 12px;
			margin: 4px;
			text-align: center;
			cursor: pointer;
			@include opacity(1);
			position: relative;
			background-color: $primary_color;
			@include transition(background-color .3s ease);
			&:hover,
			&.swiper-pagination-bullet-active {
				background-color: $white;
			}
		}
	}
	&.vertical-line-true{
		&:before{
			content: "";
			width: 1px;
			height: 619px;
			position: absolute;
			top: -636px;
			left: 50%;
			background-color: $primary_color;
			@media (max-width: $lg_max){
				top: -470px;
				height: 453px;
			}
			@media (max-width: $md_max){
				top: -370px;
				height: 353px;
			}
			@media (max-width: $xs_max){
				top: 50%;
				left: calc(100% + 15px);
				width: calc(50vw - 60px);
				height: 1px;
			}
		}
		&:after{
			content: "";
			width: 1px;
			height: 42px;
			position: absolute;
			top: calc(100% + 8px);
			left: 50%;
			background-color: $primary_color;
			@media (max-width: $xs_max){
				display: none;
			}
		}
	}
	&.style-fraction{
		@include d-flex-align-center();
		font-size: 14.5px;
		font-weight: 300;
		color: #ffffff;
		line-height: 42px;	
		transition: .5s;	
		>*{
			margin: 0 1px;
		}
		.swiper-pagination-current {
			font-size: 24px;
		}
	}
}

.buttons{
	display: flex;
	z-index: 1;
	width: 54px;
	height: 42px;
	justify-content: center;
	&.play {
		#pause-slider {
			display: none;
		}
	}
	&.pause {
		#play-slider {
			display: none;
		}
	}
	button {
		background: white;
		color: black;
		border: none;
		position: relative;
		padding: 2px 8px 2px;
		min-width: 50px;
		transition: .5s;
		opacity: .5;
		top: -4px;
		left: -15px;
	}
	#play-slider {
		background: url(../img/play.png) center no-repeat;
	}
	#pause-slider {
		background: url(../img/pause.png) center no-repeat;
	}
}

.carousel-progress {
	z-index: 5;
	position: fixed;
	bottom: 0px;
	left: 0;
	height: 4px;
	width: 100%;
}
.swiper-hero-progress {
	position: absolute;
	height: 4px;
	background-color: rgba(255, 255, 255, .2);
	animation-name: progress;
	animation-duration: 5.2s;
	animation-timing-function: linear;
	animation-iteration-count: 1;
}

.image-right {
	.sl-content {
		display: flex;
		width: 100%;
		flex: 2;
		@media (max-width: 767px) {
			flex-direction: column;
			flex: none;
			align-items: flex-start !important;
			justify-content: center;
		}
		.sl-content-inner {
			width: auto;
			flex: 1;
			padding-right: 60px;
			@media (max-width: 1200px) {
				padding-right: 0;
				@media (max-width: 767px) {
					flex: none;		
					margin-bottom: 30px;			
				}
			}
		}
		.pxl-slide-bg-right {
			display: flex;
			height: 100%;
			width: auto;
			flex: 1;
			background-position: center;
			background-size: cover;
			width: 596px;
			height: 397px;
			min-width: 596px;
			@media (max-width: 1200px) {
				min-width: auto;
				max-width: 100%;
				@media (max-width: 767px) {
					flex: none;
				}
			}
		}
	}
}

.swiper-slide {
	z-index: -1;
	&.swiper-slide-active {
		z-index: 1;
	}
}