/* Slider Button */
.htslider-slider-area {
	position: relative;
}
.htslider-slider .slick-arrow {
	font-size: 22px;

	position: absolute;
	z-index: 9;
	top: 50%;
	left: 20px;

	width: 60px;
	height: 60px;
	margin: 0;
	padding: 0;

	transition: 0.4s;
	transform: translateY(-50%);
	text-align: center;

	opacity: 1;
	border: 1px solid #E1E1E1;
	border-radius: 100%;
	background: #FFFFFF none repeat scroll 0 0;
}
.htslider-slider .slick-arrow.slick-next {
	right: 20px;
	left: auto;
}
.htslider-slider .slick-arrow:hover {
	color: #FFFFFF;
	border-color: #1F2226;
	background: #1F2226;
}

.htslider-slider .slick-dots {
	position: absolute;
	bottom: 0;
	left: 50%;

	display: flex;

	margin: 0;
	padding: 0;

	list-style: outside none none;

	transform: translateX(-50%);
}
.htslider-slider .slick-dots li {
	line-height: 12px;

	margin: 0 4px;
}
.htslider-slider .slick-dots li button {
	line-height: 13px;

	width: 13px;
	height: 13px;
	padding: 0;

	text-indent: -9999px;

	border: 1px solid #4E4F4F;
	border-radius: 50px;
	background-color: transparent;
}
.htslider-slider-area .hero-slider-controls .slick-arrow i,
.htslider-slider .slick-arrow i {
	opacity: 1;
	color: #282828;
}
.htslider-slider .slick-dots li.slick-active button {
	border-color: #282828;
	background-color: #282828;
}
.slick-dots button:focus,
.slick-arrow:focus {
	outline: none;
}

/* Navigation Style Two */
.htslider-slider-area .hero-slider-controls {
	position: absolute;
	z-index: 99;
	top: 50%;
	right: 50px;

	width: 50px;
	padding: 60px 0;

	transform: translateY(-50%);
	text-align: center;
}
.htslider-slider-area .hero-slider-controls .slick-arrow {
	font-size: 20px;

	position: absolute;
	top: 0;
	left: 0;

	width: 50px;
	height: 50px;

	transition: 0.4s;
	transform: rotate(90deg);

	opacity: 1;
	border: medium none;
	border-radius: 100%;
	background-color: #FFFFFF;
}
.htslider-slider-area .hero-slider-controls .slick-arrow:hover {
	color: #FFFFFF;
	background: #1F2226;
}
.htslider-slider-area .hero-slider-controls .slick-arrow {
	padding: 0;
}
.htslider-slider-area .hero-slider-controls .slick-arrow.slick-next {
	top: auto;
	bottom: 0;
}
.htslider-slider-area .hero-slider-controls .slick-dots {
	margin: 0;
	padding: 0;
}
.htslider-slider-area .hero-slider-controls .slick-dots li {
	line-height: 12px;

	display: block;

	margin: auto auto 8px;
}
.htslider-slider-area .hero-slider-controls .slick-dots li:last-child {
	margin: 0;
}
.htslider-slider-area .hero-slider-controls .slick-dots li.slick-active button {
	border-color: #282828;
	background-color: #282828;
}
.htslider-slider-area .hero-slider-controls .slick-dots li button {
	line-height: inherit;

	width: 13px;
	height: 13px;
	padding: 0;

	text-indent: -9999px;

	border: 1px solid #4E4F4F;
	border-radius: 50px;
	background-color: transparent;
}

.htslider-slider-area.navigation-style-3 .hero-slider-controls {
	top: auto;
	bottom: 50px;
	left: 50px;

	transform: translateY(0px);
}

.htslider-slider-area .slick-prev::before,
.htslider-slider-area .slick-next::before {
	display: none;
}
.slider-area.htslider-slider .slingle-slider a {
	text-decoration: none;
}

.elementor-widget-htslider-slider-addons {
	width: 100%;
}

/*end*/

.htslider-slider-area.loading {
	overflow: hidden;

	height: 600px;

	background-color: #FAFAFA;
}
.htslider-slider-area.loading .htslider-slider {
	opacity: 0;
}
.htslider-slider-area.loading::before {
	position: absolute;
	top: 50%;
	left: 50%;

	width: 50px;
	height: 50px;
	margin-top: -25px;
	margin-left: -25px;

	content: '';
	-webkit-animation: loading 1s linear infinite both;
	        animation: loading 1s linear infinite both;

	border-width: 4px;
	border-style: solid;
	border-color: #000000 #000000 #000000 transparent;
	border-radius: 50%;
	background-color: transparent;
}
@-webkit-keyframes loading {
	0% {
		-webkit-transform: rotate(0);
		        transform: rotate(0);
	}
	100% {
		-webkit-transform: rotate(360deg);
		        transform: rotate(360deg);
	}
}
@keyframes loading {
	0% {
		-webkit-transform: rotate(0);
		        transform: rotate(0);
	}
	100% {
		-webkit-transform: rotate(360deg);
		        transform: rotate(360deg);
	}
}
