body {
	margin:auto;
	padding:0px;
	background:url('../images/fondo.jpg') no-repeat ;
	font-family:Notes;
}

#contenedor {
	margin:auto;
	width:80%;
	border:1px solid black;
	box-shadow:0px 20px 35px rgba(0,0,0,0.5);
	-ms-box-shadow:8px 20px 35px rgba(0,0,0,0.5);
	-webkit-box-shadow:8px 20px 35px rgba(0,0,0,0.5);
	-moz-box-shadow:8px 20px 35px rgba(0,0,0,0.5);
	-o-box-shadow:8px 20px 35px rgba(0,0,0,0.5);
	border-radius:15px;
}

@font-face {
	font-family:Regular;
	src:url('../fonts/Regular.ttf');
}

@font-face {
	font-family:Babe;
	src: url('../fonts/DJB What a Babe.ttf');
}

@font-face {
	font-family:Sleep;
	src:url('../fonts/Sleep.ttf');
}

@font-face {
	font-family:Notes;
	src:url('../fonts/Notes.otf');
}

#logo {
	float:left;
	width:50%;
	text-align:center;
	height:100%;
	vertical-align:middle;
	padding:0px;
	margin:0px;
	animation:late 5s;
	-webkit-transform:scale(1,1);
	-webkit-animation:late 5s;
	-webkit-animation-iteration-count:infinite;
}

@-webkit-keyframes late {
	0%{-webkit-transform:scale(1,1);}
	45%{-webkit-transform:scale(1,1);}
	47%{-webkit-transform:scale(0.9,0.9);}
	50%{-webkit-transform:scale(1.01,1.01);}
	53%{-webkit-transform:scale(0.9,0.9);}
	55%{-webkit-transform:scale(1,1);}
	100%{-webkit-transform:scale(1,1);}
}

#logotipo {
	font-size:0px;
	float:left;
	position:absolute;
	margin:0px;
	padding:0px;
}

#tipo{
	position:absolute;
	padding:0px;
	margin:0px;
	width:200%;
	font-size:48px;
	color:#F80707;
	text-shadow:2px 2px 5px rgba(0,0,0,0.5);
	font-family:Sleep;
	transform:tranlate(195px,0px);
	-webkit-transform:translate(195px,0px);
}

header {
	height:200px;
}

#login{
	padding:20px;
	float:right;
	width:50%;
	text-align:right;
	vertical-align:middle;
}

input {
	font-family:regular;
	font-size:17px;
	padding:5px;
	text-shadow:2px 2px 3px rgba(0,0,0,0.2);
	border:0px solid white;
	border-radius:5px;
	background: rgba(0,0,0,0.1);
	box-shadow: inset:0px 0px 0px rgba(0,0,0,0.2);
	-webkit-box-shadow: inset:0px 0px 3px rgba(0,0,0,0.2);
	transition: box-shadow 1s,background 1s;
	-webkit-transition: -webkit-box-shadow 1s,background 1s;
}

input:hover {
	box-shadow:0px 0px 15px rgba(0,0,0,0.5);
	-webkit-box-shadow:0px 0px 15px rgba(0,0,0,0.5);
	background:rgba(235,24,24,0.2);
}

a {
	text-decoration:none;
	color:rgba(0,0,0,1);
	font-size:130%;
	text-shadow:0px 0px 5px rgba(248,7,7,1);
	padding:10px;
	position:absolute;
	top:5%;
	right:11%;
}

footer {
	text-align:center;
	color:#F80707;
	font-size:150%;
	text-shadow:2px 2px 4px rgba(255,255,255,0.3);
	margin-bottom: 1px;
}

#presentacion {
	text-align:left;
	width:100%;
	height:0px;
	background:rgba(0,0,0,0.1);
	background:url('../images/music.jpg');
	background-size:1800px 600px;
	box-shadow: inset 0px 0px 25px rgba(0,0,0,0.2);
	-webkit-box-shadow: inset 0px 0px 25px rgba(0,0,0,0.2);
	-webkit-animation: esconde 25s;
	-webkit-animation-iteration-count:infinite;
}

@-webkit-keyframes esconde {
	0%{height: 0px; background-size: 1800px 600px}
	50%{height:0px;}
	75%{height:200px;}
	80%{height:200px;}
	85%{height:200px}
	100%{height:0px; background-size: 1000px 400px}
}

#texto1 {
	position:absolute;
	font-family:Babe;
	color:rgba(248,7,7,0);
	text-shadow:3px 3px 5px rgba(0,0,0,0);
	font-size:30px;
	-webkit-transform:translate(150px,0px);
	-webkit-animation: efecto 5s;
	-webkit-animation-delay: 13.5s;
}

#texto2 {
	position:absolute;
	font-family:Babe;
	color:rgba(248,7,7,0);
	text-shadow:3px 3px 5px rgba(0,0,0,0);
	font-size:30px;
	-webkit-transform:translate(150px,0px);
	-webkit-animation: efecto 5s;
	-webkit-animation-delay: 17.7s;
}

@-webkit-keyframes efecto {
	0%{color:rgba(248,7,7,0); -webkit-transform:translate(-150px,0px); text-shadow:3px 3px 5px rgba(0,0,0,0);} 
	25%{color:rgba(248,7,7,1); -webkit-transform:translate(0px,0px); text-shadow:3px 3px 5px rgba(0,0,0,0.3);}
	50%{color:rgba(248,7,7,1); -webkit-transform:translate(0px,0px); text-shadow:3px 3px 5px rgba(0,0,0,0.3);}
	75%{color:rgba(248,7,7,1); -webkit-transform:translate(0px,0px); text-shadow:3px 3px 5px rgba(0,0,0,0.3);}
	100%{color:rgba(248,7,7,0); -webkit-transform:translate(150px,0px); text-shadow:3px 3px 5px rgba(0,0,0,0);} 
}

table {
	width:48%;
	float:left;
	margin:1%;
	border:1px solid rgba(255,255,255,1);
	border-radius:10px;
	background:rgba(255,255,255,0);
	box-shadow:0px 0px 10px rgba(0,0,0,0.4);
	-webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.4);
	-webkit-transform:scale(1,1);
	-webkit-transition: -webkit-transform 1s;
}

#trampa {
	opacity:0;
	-webkit-opacity:0;
}

table:hover {
	-webkit-transform:scale(1.05,1.05);
}

table th {
	font-size:30px;
	text-align:center;
	border:1px solid rgba(0,0,0,0.5);
	border-radius:10px;
	background:rgba(242,6,6,0.5);
	box-shadow:0px 0px 10px rgba(0,0,0,0.5);
	-webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.2);
	
}

table td {
	font-size:45px;
	border:0px solid white;
	text-shadow:2px 2px 4px rgba(255,255,255,0.3);
	color:rgba(248,7,7,1);
	text-align:center;
	font-size:20px;
}

#etiquetas {
	padding:10px;
}

#licencia {
	width:70px;
	height:25px;
	padding-top:3px;
}

#formulario {
	text-align:justify;
	font-family:regular;
	font-size:22px;
	padding:5px;
	border:0px solid white;
	border-radius:5px;
	background:rgba(255,255,255,0.5);
	box-shadow: inset:0px 0px 0px rgba(0,0,0,0);
	-webkit-box-shadow: inset:0px 0px 3px rgba(0,0,0,0);
	transition: box-shadow 1s,background 1s;
	-webkit-transition: -webkit-box-shadow 1s,background 1s;
}

input::-webkit-input-placeholder {
    color: black;
}

#formulario:hover {
	box-shadow:0px 0px 15px rgba(0,0,0,0.5);
	-webkit-box-shadow:0px 0px 15px rgba(0,0,0,0.5);
	background:rgba(235,24,24,0.5);
}

#regi {
	position:absolute;
	top:25%;
	width:80%;
	left:565px;
}