.sslider {
	position: relative;
	margin: 0 3rem 2.2rem 3rem;
}

.sslider img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	position: absolute;
	opacity: 0;
	transition: opacity .75s ease;
}

.sslider img.sslider-active {
	opacity: 1;
}

.sslider-icon {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 3rem;
	width: calc((3rem + 7%)/2);
}

.sslider-icon-prev {
	left: -3rem;
}

.sslider-icon-next {
	right: -3rem;
}

.sslider-icon>svg {
	width: 100%;
	height: 100%;
	transition: stroke .3s ease-in-out;
}

.sslider-icon>svg:hover {
	stroke: gray;
	cursor: pointer;
}

.sslider-marker-container {
	position: absolute;
	bottom: -2.5rem;
	bottom: calc((-2.5rem - 2vw)/2);
	width: 100%;
	display: flex;
	justify-content: center;
}

.sslider-marker-container svg {
	width: .6rem;
	width: calc((.6rem + .6vw)/2);
	padding: .25rem .3rem;
	transition: fill .25s ease-in-out;
	box-sizing: unset;
}

.sslider-marker-container svg:hover {
	fill: #3b3b3b;
	cursor: pointer;
}

.sslider-marker-active svg {
	fill: black;
}