@charset "utf-8";
@font-face{
	font-family:'Gill Sans', 'Gill Sans MT', 'Myriad Pro', 'DejaVu Sans Condensed', Helvetica, Arial, 'sans-serif'
}
/* CSS Document */
*{
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: content-box;
	box-sizing: border-box;
	font-family: "Quantico-Regular";
}

body{
	font-size: 16px;
}

.imagen-top{
	background: #000;
	overflow: hidden;
	clear: both;
}

.imagen-top ul{
	display: flex;
	width: 500%;
	animation: cambio 60s alternate infinite;
}

@keyframes cambio{
	0% {margin-left: 0%;}
	10% {margin-left: 0%;}
	20% {margin-left: -100%;}
	30% {margin-left: -100%;}
	40% {margin-left: -200%;}
	50% {margin-left: -200%;}
	60% {margin-left: -300%;}
	70% {margin-left: -300%;}
	80% {margin-left: -400%;}
	90% {margin-left: -400%;}
	100% {margin-left: -400%;}
}

.imagen-top ul li{
	width: 100%;
	list-style: none;
}

.imagen-top img{
	width: 100%;
}

header .fa{
	text-decoration: none;
	float: right;
	font-size: 30px;
	padding: 10px
}

header .fa:hover{
	color: greenyellow;
}

.fa{
	color: white
}

.main{
	width: auto;
	background: #000;
}

.main .imagen-top img{
	width: 100%;
	vertical-align: top;
}

.main .ideal h2{
	margin-bottom: 20px;
	text-align: center;
	font-size: 30px;
}

.ideal{
	padding: 30px;
	overflow: auto;
	background: #fff;
}

.main .ideal p{
	text-align: center;
	font-size: 20px;
	width: auto;
}

.main .ideal .mencion{
	font-weight: bold;
}

.main .ideal img{
	width: 350px;
	height: auto;
	float: right;
	margin-left: 30px;
}

footer section{
	width: 100%;
	background: #000;
	color: #fff;
	padding: 15px;
	text-align: center;
	float: right;
	font-size: 16px;
	clear: both;
}

footer .fa{
	text-decoration: none;
	float: right;
	font-size: 20px;
	margin-right: 10px
}

footer .fa:hover{
	color: greenyellow;
}