.superblockslider {
	position: relative;
}
.superblockslider__window, .superblockslider__track {
	height: 100%;
}
/* window */
.superblockslider__window {
	width: 100%;
	overflow: hidden;
}
/* track */
.superblockslider__track {
	width: 100%;
	display: flex;

	transition: all .7s ease-in-out;
}

.superblockslider__controls {
	display: flex;
	justify-content: space-between;
}
.superblockslider__buttons {
    position: absolute;
	z-index: 2;
    bottom: 3%;
    left: 50%;
    transform: translateX(-50%);
	align-items: center;
	min-height: 2rem;

	display: flex;
    width: 100%;
    justify-content: center;
}
.slide__button {
	display: inline-block;
}


.superblockslider__navigation {
	position: absolute;
	z-index: 1;
	top: 50%;

	width: 100%;
	height: 0;
	align-items: center;
}

.superblockslider__button, .superblockslider__button__navigation {
	// height: 100%;
	background-color: transparent !important;
	border: none;
	cursor: pointer;

	&:focus {
		outline-style: none;
	}
}
.superblockslider__button__title {
	margin: .5rem;
	line-height: 1em;
}
/* navigation arrows */
.superblockslider__button__navigation {
	padding: 0;
	opacity: .5;
	transition: all .5s;
	
	svg {
		transition: all .5s;
		width: 58px;
		height: 58px;
	}
	&:hover {
		opacity: 1;
	}
}

/* slide buttons */
.superblockslider__button {
	margin: 0 .1rem;
	padding: 0;
	opacity: .5;
	transition: all .5s;
	min-width: 2.5rem;
	cursor: pointer;

	span {
		transition: all .5s;
		display: flex;
    	justify-content: center;
		word-break: break-word;
	}
	svg {
		transition: all .5s;
		width: 1rem;
		height: 1rem;
	}
	&--active, &:hover {
		opacity: 1;
		svg {
			width: 1.5rem;
			height: 1.5rem;
		}
	}
}
/* slide */
.superblockslider__slide {
	position: relative;
	width: 100%;
	overflow: hidden;

	&.is-vertical-center {
		.superblockslider__slide_inner {
			justify-content: center;
		}
	}
	&.is-not-horizontal-center {
		.superblockslider__slide_inner {
			justify-content: initial;
		}
	}
	&.is-vertical-bottom {
		.superblockslider__slide_inner {
			justify-content: flex-end;
		}
	}
}
/* fade slider */
.superblockslider[data-transition-effect='fade'] .superblockslider__slide {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;

	opacity: 0;

	&.superblockslider__slide--active {
		z-index: 1;
		opacity: 1;
	}
}
.superblockslider__slide__bg, .superblockslider__slide__overlay {
	display: flex;
	position: absolute;
	width: 100%;
	height: 100%;

	& > img {
		height: 100%;
    	width: 100%;
		-webkit-backface-visibility: hidden;
	}
}
.superblockslider__slide_inner {
	display: flex;
	flex-direction: column;
	
	position: absolute;

	width: calc(100% - 58px * 2 - 10px * 2);
	height: 81%;
    top: 9%;
    left: calc(58px + 10px);

	padding-bottom: 32px;
	overflow: hidden;
}
.inner-blocks {
	overflow: auto;
	width: 100%;
}

.superblockslider__slide__link {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* responsive */
.visible--md,
.visible--lg,
.visible--xl
{
	display: none;
}

.visible--sm,
.visible--md.visible--sm {
	display: block;
}

@media (min-width: 768px) {
	.visible--sm,
	.visible--lg,
	.visible--xl,
	.visible--xl.visible--lg {
		display: none;
	}

	.visible--md,
	.visible--md.visible--lg {
		display: block;
	}

	.superblockslider__slide_inner {
		width: calc(100% - 68px * 2 - 15px * 2);
		height: 83%;
		top: 8.5%;
		left: calc(68px + 15px);
	}
	.superblockslider__buttons {
		bottom: 2.5%;
	}
	.superblockslider__button__navigation svg {
		width: 68px;
		height: 68px;

	}
}
@media (min-width: 1024px) {
	.visible--sm,
	.visible--md,
	.visible--xl,
	.visible--md.visible--sm
	{
		display: none;
	}

	.visible--lg,
	.visible--lg.visible--md,
	.visible--xl.visible--lg {
		display: block;
	}

	.superblockslider__slide_inner {
		width: calc(100% - 70px * 2 - 15px * 2);
		height: 86%;
		top: 6%;
		left: calc(70px + 15px);
	}
	.superblockslider__buttons {
		bottom: 2%;
	}
	.superblockslider__button__navigation svg {
		width: 70px;
		height: 70px;

	}
}

@media (min-width: 1280px) {
	.visible--sm,
	.visible--md,
	.visible--lg,
	.visible--lg.visible--md
	{
		display: none;
	}
	.visible--xl,
	.visible--xl.visible--lg {
		display: block;
	}

	.superblockslider__slide_inner {
		width: calc(100% - 85px * 2 - 15px * 2);
		height: 90%;
		top: 5%;
		left: calc(85px + 15px);
	}
	.superblockslider__buttons {
		bottom: 3%;
	}
	.superblockslider__button__navigation svg {
		width: 85px;
		height: 85px;
	}
}