@font-face{
	font-family:fuente1;
	src: url(../font/fuente1.ttf) format('truetype');
}
@font-face{
	font-family:fuente2;
	src: url(../font/fuente2.ttf) format('truetype');
}
body{
	font-family: fuente1;
	margin:auto;
	padding:0px;
	height:100%;
}
#Todo{
	margin:auto;
	width:90%;
	border:1px solid black;
	box-shadow:0px 20px 35px rgba(0,0,0,0.5);
	border-radius:15px;
}
header{
	background:rgba(255,255,255,0.5);
	height:170px;
	animation: late 2s;
	-webkit-animation: color 10s;
	-webkit-animation-iteration-count:infinite;
}
	@keyframes color{
	0%{background:#FFFFE0;}
	30%{background:#D2B48C;}
	40%{background:#FFFFE0;}
	65%{background:;#D2B48C;}
	100%{background:#FFFFE0;}
	}
	@-webkit-keyframes color{
	0%{background:#FFFFE0;}
	30%{background:#D2B48C;}
	40%{background:#FFFFE0;}
	65%{background:;#D2B48C;}
	100%{background:#FFFFE0;}
	}

footer{
	background:rgba(139,069,019,0.5);
	text-align:center;
	font-family:fuente2;
	font-size:14px;
}
#etiquetas{
padding:10px;
}
#logotipo{
	font-size:0px;
	float:left;
	position:absolute;
	margin:0px;
	padding:0px;
}
#tipo{
	position:absolute;
	padding:0px;
	margin:0px;
	font-size:40px;
	color:rgba(255,255,255,1);
	text-shadow:2px 2px 5px rgba(0,0,0,0.5);
	font-family:fuente2;
	transform:translate(150px,0px);
}
#logo{
	float:left;
	width:50%;
	text-align:center;
	height:100%;
	vertical-align:middle;
	position:relative;
	padding:0px;
	margin:0px;
	animation:movimiento 10s;
	-webkit-animation:movimiento 8s;
	-webkit-animation-iteration-count:infinite;
}
@keyframes movimiento{
	0% {left: 0px; top:0px;}
	20%{left: 150px;top:0px;}
	50%{left: 270px;top:0px;}
	75%{left:350px:top:0px;}
	100%{left:0px top:0px;}
}
@-webkit-keyframes movimiento{
	0% {left: 0px; top:0px;}
	20%{left: 150px;top:0px;}
	50%{left: 270px;top:0px;}
	75%{left:350px:top:0px;}
	100%{left:0px top:0px;}
}
#login{
padding:10px;
width:50%;
text-align:right;
vertical-align:middle;
position:absolute;
right:10%;
top:5%;
}
.clase{
	border:1px solid black;
	border-radius:8px;
	background: rgba(0,0,0,0.3);
	box-shadow: 0px 0px 0px rgba(0,0,0,0.1);
	-webkit-box-shadow:inset 2px 3px 3px rgba(0,0,0,0.1);
	font-family:fuente2;
	text-shadow:2px 3px 3px rgba(0,0,0,0.1);
	transition:box-shadow 2s,background 2s,border 1s;
	-webkit-transition:-webkit-box-shadow 2s,background 2s,border 1s;
}
input:hover{
	box-shadow:0px 0px 10px rgba(0,0,0,1);
	-webkit-box-shadow:0px 0px 10px rgba(0,0,0,1);
	background:rgba(112,112,112,0.6);
	border:2px solid gray;
}
a{
	text-decoration:none;
	color:rgba(84,84,84,1);
}
#registrate{
color:rgba(0,0,0,1);
font-size:2em;
text-shadow:0px 0px 20px rgba(139,090,043,1);
animation:registrate 2s;
-webkit-animation:registrate 2s;
-webkit-animation-iteration-count:infinite;
}
@keyframes registrate{
0%{text-shadow:0px 0px 20px rgba(0,0,0,0);}
50%{text-shadow:0px 0px 20px rgba(0,0,0,1);}
100%{text-shadow:0px 0px 20px rgba(0,0,0,0);}
}
@-webkit-keyframes registrate{
0%{text-shadow:0px 0px 20px rgba(0,0,0,0);}
50%{text-shadow:0px 0px 20px rgba(0,0,0,1);}
100%{text-shadow:0px 0px 20px rgba(0,0,0,0);}
}
#presentacion{
text-align:left;
width:100%;
height:0px;
background:rgba(0,0,0,0.1);
background:url('../imagenes/present.jpg') center center ;
background-size:300px 192px;
box-shadow:inset 0pxn 0px 5px rgba(0,0,0,0.5);
-webkit-box-shadow:inset 0pxn 0px 25px rgba(0,0,0,0.5);
-webkit-animation:esconde 25s;
}
@-webkit-keyframes esconde{
0%{height:200px;background-size:300px 192px;}
50%{height:200px;}
100%{height:0px;background-size:600px 384px;}
}
#animaciontexto1{
position:relative;
top:50%;
margin:0px;
padding:0px;
font-family:fuente2;
color:rgba(255,255,255,0);
text-shadow:3px 3px 5px rgba(0,0,0,0,0);
font-size:32px;
-webkit-transform:translate(150px,0px);
-webkit-animation: muevetexto1 8s;
}
@-webkit-keyframes muevetexto1{
0%{color:rgba(84,84,84,0);-webkit-transform:translate(30px,0px);text-shadow:3px 3px 5px rgba(0,0,0,0.0);}
25%{color:rgba(255,255,255,1);-webkit-transform:translate(0px,0px);text-shadow:3px 3px 5px rgba(0,0,0,0.3); }
50%{color:rgba(255,255,255,1);-webkit-transform:translate(120px,0px); text-shadow:3px 3px 5px rgba(0,0,0,0.3); }
75%{color:rgba(255,255,255,1);-webkit-transform:translate(0px,0px);text-shadow:3px 3px 5px rgba(0,0,0,0.3);  }
100%{color:rgba(255,255,255,0);-webkit-transform:translate(150px,0px);text-shadow:3px 3px 5px rgba(0,0,0,0.0); }
}
#animaciontexto2{
position:relative;
left:35%;
margin:0px;
padding:0px;
font-family:fuente2;
color:rgba(255,255,255,0);
text-shadow:3px 3px 5px rgba(0,0,0,0,0);
font-size:32px;
-webkit-transform:translate(150px,0px);
-webkit-animation: muevetexto1 10s;
-webkit-animation-delay:7s;
}
@-webkit-keyframes muevetexto2{
0%{color:rgba(84,84,84,0);-webkit-transform:translate(60px,0px);text-shadow:3px 3px 5px rgba(0,0,0,0.0);}
25%{color:rgba(255,255,255,1);-webkit-transform:translate(0px,0px);text-shadow:3px 3px 5px rgba(0,0,0,0.3); }
50%{color:rgba(255,255,255,1);-webkit-transform:translate(120px,0px); text-shadow:3px 3px 5px rgba(0,0,0,0.3); }
75%{color:rgba(255,255,255,1);-webkit-transform:translate(0px,0px);text-shadow:3px 3px 5px rgba(0,0,0,0.3);  }
100%{color:rgba(255,255,255,0);-webkit-transform:translate(180px,0px);text-shadow:3px 3px 5px rgba(0,0,0,0.0); }
}
table{
width:100%;
height:220px;
border:1px solid rgba(255,255,255,0.5);
box-shadow:0px 0px 20px rgba(0,0,0,0,0.6);
-webkit-box-shadow:0px 0px 30px rgba(0,0,0,1);
border-radius:20px;
background:rgba(255,246,143,0.1);
}
table th{
text-align:left;
width:100%;
font-family:fuente1;
border:1px solid rgba(0,0,0,0.8);
border-radius:10px;
background:rgba(139,069,019,0.8);
box-shadow:0px 0px 20px rgba(0,0,0,0,0.4);
-webkit-box-shadow:0px 0px 30px rgba(0,0,0,0.4);
}
table td{
border:0px solid white;
text-shadow:2px 2px 5px rgba(0,0,0,0.3);
}
#estrellas{
font-family:fuente1;
height:10%;
float:right;
}
.clase1{
position:absolute;
left:20%;
}
.clase2{
position:absolute;
left:25%;
}
input{
	border:1px solid black;
	border-radius:3px;
	background: rgba(0,0,0,0.1);
}
select{
	border:1px solid black;
	border-radius:3px;
	background: rgba(0,0,0,0.1);
}