/* CSS Document */
/* Estilos de fuentes */
@font-face{
	font-family:fontBellavista;
	src:url("fonts/SonsieOne-Regular.otf");
}
@font-face{
	font-family:fontTitulo;
	src:url("fonts/freebooterscript-webfont.ttf");
}
@font-face{
	font-family:fontTituloIE;
	src:url("fonts/freebooterscript-webfont.eot");
}
/* ******* Estilos ******* */
/* ******* General ******* */
*, :after, *:before{
	margin:0px;
	padding:0px;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
.clearfix:after{
	content:"";
	clear:both;
	display:table;
}
/* ******* Body ******* */
body{
	margin:0px;
	padding:0px;
	background-color:rgba(255, 160, 122, 1);
}
/* ******* Cabecera ******* */
header{
	top:0px;
	width:100%;
	z-index:1500;
	position:fixed;
	
	background:#333333;
	background:-o-linear-gradient(top, #333333 0%,#1e1e1e 100%);
	background:-ms-linear-gradient(top, #333333 0%,#1e1e1e 100%);
	background:-moz-linear-gradient(top, #333333 0%, #1e1e1e 100%);
	background:linear-gradient(to bottom, #333333 0%,#1e1e1e 100%);
	background:-webkit-linear-gradient(top, #333333 0%,#1e1e1e 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#1e1e1e', GradientType=0);
}
#cabecera{
	height:100%;
	max-width:1024px;
	margin-left:auto;
	margin-right:auto;
}
header a{
	color:#FFF;
	border:none;
	text-decoration:none;
}
header a:hover{
	color:#CCC;
}
header #logo{
	float:left;
	text-align:center;
	border-radius:150px;
	box-shadow:3px 3px 7px #333;
}
header h2{
	float:left;
	color:#FFF;
	letter-spacing:3px;
	font-family:fontTitulo, fontTituloIE;
}
header nav{
	float:right;
	margin-top:3px;
}
header nav ul{
	margin:0px;
	padding:0px;
	float:right;
	list-style:none;
}
header nav li{
	color:#FFF;
	float:right;
	font-size:12pt;
	line-height:25px;
	text-align:center;
	font-family:fontBellavista;
}
header nav li.oculto{
	display:none;
}
/* ******* Cuerpo ******* */
main{
	max-width:1024px;
	margin-left:auto;
	margin-right:auto;
}
/* ******* Pie ******* */
footer{
	float:left;
	width:100%;
	z-index:1500;
	
	/* Temporal */
	/*
	bottom:0px;
	position:absolute;
	*/
	background:#333333;
	background:-o-linear-gradient(top, #333333 0%,#1e1e1e 100%);
	background:-ms-linear-gradient(top, #333333 0%,#1e1e1e 100%);
	background:-moz-linear-gradient(top, #333333 0%, #1e1e1e 100%);
	background:linear-gradient(to bottom, #333333 0%,#1e1e1e 100%);
	background:-webkit-linear-gradient(top, #333333 0%,#1e1e1e 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#1e1e1e', GradientType=0);
}
#foot{
	width:100%;
	height:100%;
	padding:17px;
	max-width:1024px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}
#foot .section{
	height:100%;
	display:inline-block;
}
#foot .section > div{
	display:inline-block;
}
#foot .hSection{
	width:90%;
	color:#FFF;
	float:left;
	height:25px;
	font-size:14pt;
	margin-left:5%;
	margin-right:5%;
	text-align:center;
	font-family:fontBellavista;
}
#foot .bSection{
	width:90%;
	color:#FFF;
	float:left;
	font-size:12pt;
	margin-left:5%;
	margin-right:5%;
	max-height:calc(100% - 25px);
	font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
}
#foot .bSection a{
	color:#FFF;
	text-decoration:none;
}
#foot .bSection ul{
	margin:7px;
	list-style:none;
	font-weight:bold;
	padding-left:0px;
}
#foot .bSection li{
	height:21px;
	text-align:left;
	line-height:21px;
	padding-left:7px;
	margin-bottom:6px;
	background-size:24px;
	background-position:left;
	background-repeat:no-repeat;
}
#foot .bSection span{
	font-size:10pt;
	margin-bottom:7px;
}
#foot .bSection span a{
	color:#CCC;
	font-weight:bold;
	text-decoration:underline;
}
#foot .bSection .redes{
	height:37px;
	cursor:pointer;
	border-radius:3px;
	display:inline-block;
	box-shadow:1px 1px 1px #333;
}
#foot .bSection .logo{
	float:left;
	height:24px;
	margin-top:-3px;
	margin-right:3px;
}
#foot .bSection .qualisys{
	float:left;
	width:100%;
	margin-top:11px;
	line-height:32px;
}
#foot .bSection .qualisys img{
	float:left;
	margin-right:3px;
}
/* CSS Footer:hover */
#foot .bSection .redes:hover{
	-webkit-transform:rotate(25deg);
	   -moz-transform:rotate(25deg);
			transform:rotate(25deg);
}
#foot .bSection .redes:active{
	margin-top:18px;
	-webkit-transform:rotate(25deg);
	   -moz-transform:rotate(25deg);
			transform:rotate(25deg);
	
}
#foot .bSection li:hover{
	cursor:pointer;
	font-style:italic;
}
#foot .bSection .qualisys:hover{
	color:#CCC;
}
#foot .bSection .qualisys:hover img{
	-ms-animation-name:bluclerotate;
	-ms-animation-timing-function:linear;
	-ms-animation-iteration-count:infinite;
	-ms-animation-duration:3.5s;
	
	-moz-animation-name:bluclerotate;
	-moz-animation-timing-function:linear;
	-moz-animation-iteration-count:infinite;
	-moz-animation-duration:3.5s;
	
    -webkit-animation-name:bluclerotate;
	-webkit-animation-timing-function:linear;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-duration:3.5s;
}
/* Animaciones */
/* Animación enlace Qualisys */
@-ms-keyframes bluclerotate{
	from{-ms-transform:rotateY(0deg);}
	to{-ms-transform:rotateY(-360deg);}
}
@-moz-keyframes bluclerotate{
	from{-moz-transform:rotateY(0deg);}
	to{-moz-transform:rotateY(-360deg);}
}
@-webkit-keyframes bluclerotate{
	from{-webkit-transform:rotateY(0deg);}
	to{-webkit-transform:rotateY(-360deg);}
}
/* Animación Botón Menú */
@-ms-keyframes menuActivo{
	0%{width:100px;}
  	50%{width:103px;}
  	100%{width:100px;}
}
@-moz-keyframes menuActivo{
	0%{width:100px;}
  	50%{width:103px;}
  	100%{width:100px;}
}
@-webkit-keyframes menuActivo{
	0%{width:100px;}
  	50%{width:103px;}
  	100%{width:100px;}
}