:root {
	--margin: 8px;
}

.s15-content {
	width: 100%;
    text-align: center;
	margin-top: 60px;
}
.s15-border {
    position: absolute;
    border: 5px solid #c6aa73;
    width: 100%;
    height: 80%;
    top: 0px;
	z-index: 1;
}
.s15-hs_container {
	z-index: 1000;
	position: relative;
	margin: 0 20px;
}
.s15-box {
	background-color: #fff;
	display: inline-block;
	width: 24%;
	padding: 0 8px;
	z-index: 1000;
	position: relative;
	overflow: hidden;
    margin: -2px;
}
.s15-box .inner_img,
.s15-box img {
	width: 100%;
	height: auto;
	display: block;
	object-fit: contain;
}
.s15-box_content {
	position: absolute;
	background-color: #f8f8f8;
	width: calc(100% - 15px);
	/* opacity: 0; */
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
	transition-duration: .3s;
	-webkit-transition-duration: .3s;
	-o-transition-duration: .3s;
	-moz-transition-duration: .3s;
	color: #c6aa73;
}
.touch .s15-box_content {
	opacity: 1;
    /* bottom: 8px; */
	transform: translateY(calc(-100% - 6px));
}
.s15-box:hover .s15-box_content {
	opacity: 1;
    /* bottom: 8px; */
	transform: translateY(calc(-100% - 6px));
}

/* Nessun position/height qui: manteniamo lo stesso contenitore di riferimento
   dell'originale, così la cornice .s15-border resta identica alla griglia. */
.s15-swiper {
	z-index: 1000;
	position: relative;
	margin: 0 5px;
	max-width: 96%;
}
.s15-swiper .swiper-slide.s15-box {
	width: auto;
	margin: 0;
	height: auto;
	box-sizing: border-box;
}
.s15-swiper .swiper-button-prev,
.s15-swiper .swiper-button-next {
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background-color: #c6aa73;
	color: #fff;
	box-shadow: 0 2px 10px rgba(0,0,0,.25);
	transition: background-color .2s ease, transform .2s ease;
	--swiper-navigation-size: 20px;
}
.s15-swiper .swiper-button-prev:hover,
.s15-swiper .swiper-button-next:hover {
	background-color: #a98c53;
	transform: scale(1.08);
}
.s15-swiper .swiper-button-prev::after,
.s15-swiper .swiper-button-next::after {
	font-weight: 700;
}
.s15-swiper .swiper-button-prev {
	left: 6px;
}
.s15-swiper .swiper-button-next {
	right: 6px;
}
.s15-swiper .swiper-button-disabled {
	opacity: .35;
}
.s15-swiper .swiper-pagination-bullet-active {
	background: #c6aa73;
}

.s15-title {
	font-family: OldStandard;
	font-style: italic;
	font-size: 28px;
	margin: 10px 0 0;
}
.s15-subtitle {
	font-family: Palanquin;
	margin: 0 0 10px;
}

@media screen and (max-width: 787px) {
	.s15-border {
		border-width: 3px;
	}
	.s15-box_content {
		opacity: 1;
		transform: translateY(calc(-100% - 6px));
	}
	.s15-title {
		font-size: 20px;
	}
	.s15-subtitle {
		font-size: 14px;
	}
}

@media screen and (max-width: 480px) {
	.s15-box_content {
		opacity: 1;
		/* bottom: 8px; */
		transform: translateY(calc(-100% - 6px));
	}
	.s15-box {
		width: 49%;
	}
}