.swiperNav {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 16px;
	margin-top: 32px;
	position: relative;
	z-index: 1;
}
.swiperCountDots [class*=swiper-button-],
.swiperNav [class*=swiper-button-] {
	position: static;
	width: 40px;
	height: 40px;
	margin: 0;
	outline: 0;
	border: 0;
	background: rgb(115, 98, 73, 0.08);
	border-radius: 100%;
	opacity: 1;
	transition: .25s cubic-bezier(0.645, 0.045, 0.355, 1);
	user-select: none;
}
.swiperNav [class*=swiper-button-next] {
	margin-right: -70px;
}
.swiperNav [class*=swiper-button-prev] {
	margin-left: -70px;
}
.swiperCountDots [class*=swiper-button-] img,
.swiperNav [class*=swiper-button-] img {
	width: 16px;
	transition: .25s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.swiperCountDots [class*=swiper-button-]:after,
.swiperNav [class*=swiper-button-]:after {
	display: none;
}
.swiperCountDots [class*=swiper-button-]:hover,
.swiperNav [class*=swiper-button-]:hover {
	background: rgb(115, 98, 73, 0.64);
	opacity: 1;
}
.swiperCountDots [class*=swiper-button-]:hover img,
.swiperNav [class*=swiper-button-]:hover img {
	filter: brightness(0) invert(1);
}
.swiperCountDots [class*=swiper-button-].swiper-button-disabled,
.swiperNav [class*=swiper-button-].swiper-button-disabled {
	opacity: .40;
	cursor: default;
}
.swiperCountDots {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	gap: 8px;
	margin-top: 32px;
	font-size: 1.125rem;
	color: var(--text-primary-solid-80);
	font-weight: 400;
	line-height: 0.75rem;
	position: relative;
	z-index: 2;
}
.swiperCountDots .current-slide {
	font-weight: 800;
}
.swiperCountDots .total-slides {
	font-weight: 400;
}
.swiperCountDots .swiper-pagination {
	position: static;
	width: auto;
}
.swiperCountDots .swiper-pagination .swiper-pagination-bullet {
	display: inline-block;
	width: 18px;
	height: 1px;
	margin: 0px 0;
	background: rgb(115 98 73 / 8%);
	border-radius: 0px;
	opacity: 1;
	transition: .25s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.swiperCountDots .swiper-pagination .swiper-pagination-bullet:first-child {
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
}
.swiperCountDots .swiper-pagination .swiper-pagination-bullet:last-child {
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
}
.swiperCountDots .swiper-pagination .swiper-pagination-bullet:hover,
.swiperCountDots .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background: #58524A;
	border-radius: 10px;
}

.swiperNav {
	display: flex;
	justify-content: space-between;
	width: 100%;
	margin-top: 0;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
}

.swiperNav [class*=swiper-button-] {
	width: 40px;
	height: 40px;
}

.swiperNav [class*=swiper-button-] img {
	width: 16px;
}

.swiperNav .swiper-button-prev {
	margin-left: -70px;
}

.swiperNav .swiper-button-next {
	margin-right: -70px;
}



/* #iPad Pro - Large Screens beyond 1024px
================================================== */
@media only screen and (min-width: 959px) and (max-width: 1180px) {
	.swiperNav .swiper-button-prev { margin-left: 0; }
	.swiperNav .swiper-button-next { margin-right: 0; }
}



/* #Tablet (Portrait)
================================================== */
/* Note: Design for a width of 768px */
@media only screen and (min-width: 768px) and (max-width: 959px) {
	.swiperNav { justify-content: center; top: 0; transform: translateY(0%); }
	.swiperNav .swiper-button-prev { margin-left: 0; }
	.swiperNav .swiper-button-next { margin-right: 0; }
}

@media (max-width: 959px) {
    .slider-with-nav {
        margin-top: 56px;
    }
}



/*  #Mobile (Portrait)
================================================== */
/* Note: Design for a width of 320px */
@media only screen and (max-width: 767px) {
	.swiperNav { justify-content: center; top: 0; transform: translateY(0%); }
	.swiperNav .swiper-button-prev { margin-left: 0; }
	.swiperNav .swiper-button-next { margin-right: 0; }
}
