.hero-banner {
	width: 100%;
	height: 810px;
}

.swiper {
	width: 100%;
	height: 100%;
}

.swiper-slide img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.autoplay-progress span {
	/* background-color: aqua; */
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	outline: 1px solid #fff;
	outline-style: inset;
	border-radius: 50px;
	padding: 5px;
}

.autoplay-progress {
	position: absolute;
	right: 16px;
	bottom: 16px;
	z-index: 10;
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-transform: uppercase;
	padding: 5px !important;
	color: #fff;
	font-size: 12px;
	padding: 5px;
}

.autoplay-progress svg {
	--progress: 0;
	position: absolute;
	left: 0;
	top: 0px;
	z-index: 10;
	width: 50px;
	height: 50px;
	stroke-width: 2px;
	stroke: #fff;
	fill: none;
	stroke-dashoffset: calc(125.6px * (1 - var(--progress)));
	stroke-dasharray: 125.6;
	transform: rotate(-90deg);
}

.hero-group p.d-block {
	margin: 15px 0 10px 0
}

.hero-group h1 {
	margin-bottom: 10px;
}


/* .swiper-slide{position: relative;} */
.overlay-content {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #00000080;
	z-index: 999;
	top: 0;
}

.hero-group p {
	color: white;
	margin-bottom: 0;
}

.hero-group h1 {
	text-align: center;
	color: white;
}

.hero-group h1 span {
	color: var(--green);
}

.hero-group .primary-theme-btn {
	margin-top: 25px;
}

.wind-circle {
	bottom: 5%;
	animation: rotate-animation 1.2s infinite linear !important;
}

/* .wind-circle svg{} */
.wind-circle:hover,
.prefix-circle:hover {
	animation: none;
}

.prefix-circle {
	animation: rotate-animation 2s infinite linear;
}

.scroll-down-arrow {
	bottom: 10px;
	left: 49.5%;
	transform: translate(-50%, 0%);
	animation: mover 1s infinite alternate;
}

.scroll-down-title {
	left: 50%;
	transform: translate(-50%);
}

@keyframes rotate-animation {
	0% {
		transform: rotate(0deg);
	}

	50% {
		transform: rotate(180deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

@keyframes mover {
	0% {
		transform: translateY(0);
	}

	100% {
		transform: translateY(-5px);
	}
}

@media (max-width:1366px) {
	.hero-banner {
		height: 640px;
	}
}

@media (max-width:991px) {
	.hero-banner {
		height: 500px;
	}

	.wind-circle {
		display: none;
	}

	.scroll-down-title {
		display: none;
	}
}

@media (max-width:575px) {
	.hero-container {
		width: 100%;
	}

	.hero-group {
		width: 100%;
	}
}