.slider {
	overflow: hidden;
	position: relative;
	height: 100vh;
}
.slider__slides {
	z-index: 1;
	position: relative;
	height: 100%;
}
.slider__control {
	z-index: 2;
	position: absolute;
	top: 50%;
	left: 5%;
	width: 60px;
	height: 60px;
	margin-left: -30px;
	margin-top: -30px;
	border-radius: 50%;
	background: rgba(15, 81, 111, .7);
	-webkit-transition: background-color 0.3s;
	transition: background-color 0.3s;
	cursor: pointer;
}
.slider__control--right {
	left: 95%;
}
.slider__control:hover {
	background-color:#0F516F;
}
.slider__control-line {
	position: absolute;
	left: 23px;
	top: 50%;
	width: 3px;
	height: 14px;
	-webkit-transform-origin: 50% 0;
					transform-origin: 50% 0;
	-webkit-transform: rotate(-45deg);
					transform: rotate(-45deg);
}
.slider__control-line:nth-child(2) {
	-webkit-transform: translateY(1px) rotate(-135deg);
					transform: translateY(1px) rotate(-135deg);
}
.slider__control--right .slider__control-line {
	left: 37px;
	-webkit-transform-origin: 1px 0;
					transform-origin: 1px 0;
	-webkit-transform: rotate(45deg);
					transform: rotate(45deg);
}
.slider__control--right .slider__control-line:nth-child(2) {
	-webkit-transform: translateY(1px) rotate(135deg);
					transform: translateY(1px) rotate(135deg);
}
.slider__control-line:after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #e2e2e2;
	-webkit-transition: background-color 0.3s;
	transition: background-color 0.3s;
}
.slider__control:hover .slider__control-line:after {
	background-color: #fff;
}
.slider__control.a--rotation .slider__control-line:after {
	-webkit-animation: arrowLineRotation 0.49s;
					animation: arrowLineRotation 0.49s;
}
.slider__control.a--rotation .slider__control-line:nth-child(1):after {
	-webkit-animation: arrowLineRotationRev 0.49s;
					animation: arrowLineRotationRev 0.49s;
}

@-webkit-keyframes arrowLineRotation {
	to {
		-webkit-transform: rotate(180deg);
						transform: rotate(180deg);
	}
}

@keyframes arrowLineRotation {
	to {
		-webkit-transform: rotate(180deg);
						transform: rotate(180deg);
	}
}
@-webkit-keyframes arrowLineRotationRev {
	to {
		-webkit-transform: rotate(-180deg);
						transform: rotate(-180deg);
	}
}
@keyframes arrowLineRotationRev {
	to {
		-webkit-transform: rotate(-180deg);
						transform: rotate(-180deg);
	}
}
.slide {
	overflow: hidden;
	position: absolute;
	left: 50%;
	top: 50%;
	width: 150vmax;
	height: 150vmax;
	-webkit-transform: translate(-50%, -50%);
					transform: translate(-50%, -50%);
	border-radius: 50%;
	-webkit-transition: -webkit-clip-path 0s 0.91s;
	transition: -webkit-clip-path 0s 0.91s;
	transition: clip-path 0s 0.91s;
	transition: clip-path 0s 0.91s, -webkit-clip-path 0s 0.91s;
	-webkit-clip-path: circle(30px at 120vw 50%);
					clip-path: circle(30px at 120vw 50%);
}
.slide.s--prev {
	-webkit-clip-path: circle(30px at 30vw 50%);
					clip-path: circle(30px at 30vw 50%);
}
.slide.s--active {
	z-index: 1;
	-webkit-transition: -webkit-clip-path 1.3s;
	transition: -webkit-clip-path 1.3s;
	transition: clip-path 1.3s;
	transition: clip-path 1.3s, -webkit-clip-path 1.3s;
	-webkit-clip-path: circle(120vmax at 120vw 50%);
					clip-path: circle(120vmax at 120vw 50%);
}
.slide.s--active.s--active-prev {
	-webkit-clip-path: circle(120vmax at 30vw 50%);
					clip-path: circle(120vmax at 30vw 50%);
}

.slide__inner {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 100vw;
	height: 100vh;
	margin-left: -50vw;
	margin-top: -50vh;
	background-size: cover;
	background-position: center center;
}
.slide__inner:before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, .4);
	background-image: url(grid_green50.png);
}
.slide__content {
	left: 0;
	top: 35%;
	margin-top: 40px;
	color:#fff;
	position: absolute;
	text-align: center;
	width: 100%;
}
.imagen {
	background: rgba(255, 255, 255, .7);
	padding: 10px;
}
.imagen img {max-width:50%;}
.slide__heading {
	text-align: center;
	line-height:50px;
	font-size: 50px;
}
.slide__text {
	background: rgba(15, 81, 111, .7);
	font-size: 20px;
	padding: 10px;
}
.slide__text a {
	color: inherit;
}
.flecha {
	background: url(down2.png) no-repeat center #FF5108;
	border-radius: 50%;
	height: 30px;
	margin: 0 auto;
	margin-top: 20px;
	width: 30px;
	z-index: 2;
	position: absolute;
	bottom: 10%;
	left: 50%;
}