#contenido{
	display: inline-flex;
	overflow-y: hidden;
	position: absolute;
	margin-right: auto;
	margin-left: -36.6%;
	margin-top: 3.8%;
}

#audio{
	display: none
}

.vista_1{
	overflow-y: hidden;
	background: 	#C0392B;
	padding: 15px;
	width: 7%;
	max-height: 270px;
	min-height: 270px;
	border-right: none;
	border-top: none;
	border-bottom: none;
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
	-webkit-box-shadow: inset 4px 0px 250px -180px rgba(0,0,0,1);
	-moz-box-shadow: inset 4px 0px 250px -180px rgba(0,0,0,1);
	box-shadow: inset 4px 0px 250px -180px rgba(0,0,0,1);
}

.vista_2{
	overflow-y: hidden;
	background: 	#C0392B;
	padding: 15px;
	width: 7%;
	max-height: 270px;
	min-height: 270px;
	border-left: 1px solid #A3A3A3;
	border-right: none;
	border-top: none;
	border-bottom: none;
	-webkit-box-shadow: inset 4px 0px 250px -180px rgba(0,0,0,1);
	-moz-box-shadow: inset 4px 0px 250px -180px rgba(0,0,0,1);
	box-shadow: inset 4px 0px 250px -180px rgba(0,0,0,1);
}


.vista_3{
	overflow-y: hidden;
	background: 	#C0392B;
	padding: 15px;
	width: 7%;
	max-height: 270px;
	min-height: 270px;
	border-left: 1px solid #A3A3A3;
	border-right: none;
	border-top: none;
	border-bottom: none;
	-webkit-box-shadow: inset 4px 0px 250px -180px rgba(0,0,0,1);
	-moz-box-shadow: inset 4px 0px 250px -180px rgba(0,0,0,1);
	box-shadow: inset 4px 0px 250px -180px rgba(0,0,0,1);
}

.vista_4{
	overflow-y: hidden;
	background: 	#C0392B;
	padding: 15px;
	width: 7%;
	max-height: 270px;
	min-height: 270px;
	border-left: 1px solid #A3A3A3;
	border-right: none;
	border-top: none;
	border-bottom: none;
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
	-webkit-box-shadow: inset 4px 0px 250px -180px rgba(0,0,0,1);
	-moz-box-shadow: inset 4px 0px 250px -180px rgba(0,0,0,1);
	box-shadow: inset 4px 0px 250px -180px rgba(0,0,0,1);
}

.number_1{
	font-family: 'Impact', arial;
	color: #fff;
	background: transparent;
	border:none;
	width: 90%;
	height: auto;
	font-size: 2em;
	text-align: center;
	margin-top: 65%;
	padding: 0px;

}

.number_2{
	font-family: 'Impact', arial;
	color: #fff;
	background: transparent;
	border:none;
	width: 90%;
	height: auto;
	font-size: 2em;
	text-align: center;
	margin-top: 65%;
	padding: 0px;

}


.number_3{
	font-family: 'Impact', arial;
	color: #fff;
	background: transparent;
	border:none;
	width: 90%;
	height: auto;
	font-size: 2em;
	text-align: center;
	margin-top: 65%;
	padding: 0px;

}


.number_4{
	font-family: 'Impact', arial;
	color: #fff;
	background: transparent;
	border:none;
	width: 90%;
	height: auto;
	font-size: 2em;
	text-align: center;
	margin-top: 65%;
	padding: 0px;

}



.img_logo{
	width: 20%;
	height: auto;
	position: absolute;
	margin-top: -16%;
	margin-left: 16%;
}


@keyframes example {
	0%{
		margin-top: -80%;
	}

	50%{
		margin-top: 50%;
	}

	100%{
		margin-top: 200%;
	}
}

/* The element to apply the animation to */
.animacion_1 {
	animation-name: example;
	animation-duration: 0.2s;
	animation-iteration-count: infinite;
	animation-delay: 0.9s;
}

.animacion_2 {
	animation-name: example;
	animation-duration: 0.2s;
	animation-iteration-count: infinite;
	animation-delay: 0.6s;
}

.animacion_3 {
	animation-name: example;
	animation-duration: 0.2s;
	animation-iteration-count: infinite;
	animation-delay: 0.3s;
}

.animacion_4 {
	animation-name: example;
	animation-duration: 0.2s;
	animation-iteration-count: infinite;
}