*{
	border: 0;
	margin: 0;
	/*padding: 0;*/
}

article, figcaption, figure, footer, header, hgroup, nav, section{
	display: block;
}

html, body{
	background: #415864 url(../images/fondo1.jpg);
	/*margin: 8px;
	color: #000;*/
	font-family : arial, 'lucida grande',tahoma,verdana,arial,sans-serif;/*Courier*/
	font-size: 1em;
	height: 97%;
	outline: 0;
	/*overflow-x: hidden;*/
}
body:hover{cursor: default;}

a{text-decoration: none; color: #066a9f;}
a:hover{color: #10252e;}
.enlacesPrincipales a, header a, footer a, nav{
	color: #57ABB8;
	font-weight: bold;
}

.enlacesPrincipales a:hover, footer a:hover{
	color: #820b2b;	
}

figcaption{
	font-size: 0.85em;
	padding: 0.25em;
	text-align: center;
}

img, video{
	max-width: 100%; /*imagenes flexibles*
	text-shadow: 0 0 0.2em #fff, 0 0 0.2em #fff, 0 0 0.2em #fff;
	box-shadow: 2px 2px 5px #fff;*/
}

#contenedor, footer, .examen{
	background-color: #6e98ae;
	box-shadow: -0.3em 0.2em 0.3em #10252e, 0.3em 0.2em 0.3em #10252e;
	margin: 0 auto;
	max-width: 90%;
	text-align: center;
}
#contenedor, .examen{
	min-height:100%;
	height: auto!important;
	height:100%;
}
.examen{background-color: #fff;}

header, nav{
	width: 100%;
}
header{text-align: right;}

nav, footer{
	background: #10252e;/*#2f434e;*/	
	padding: .1em 0;
}

footer{padding: .5em 0; color: #fff;}

header{
	background: rgb(16,37,46); /* Old browsers idea de http://www.colorzilla.com/gradient-editor/ */
	background: -moz-linear-gradient(top, rgba(16,37,46,1) 0%, rgba(65,88,100,1) 99%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(16,37,46,1)), color-stop(99%,rgba(65,88,100,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(16,37,46,1) 0%,rgba(65,88,100,1) 99%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(16,37,46,1) 0%,rgba(65,88,100,1) 99%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgba(16,37,46,1) 0%,rgba(65,88,100,1) 99%); /* IE10+ */
	background: linear-gradient(to bottom, rgba(16,37,46,1) 0%,rgba(65,88,100,1) 99%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#10252e', endColorstr='#415864',GradientType=0 ); /* IE6-9 */
}


header h1, section#vanner{
	display: inline-block;
	max-width: 100%;
	vertical-align: middle;/*a la mitad del obgeto que comparte*/
}

.logoCobit{
	position: absolute;
	/*padding: 0 2%;*/
	/*-webkit-animation: animeLogo 8s ease-in-out infinite;*/
	
	width: 25%;
	/*left: 2%;*/
	text-align: left;
	z-index: 1;
}

.vannerOut{
	position: absolute;
	right: 0;
	top: 0;
}

.rotarLogo{
	animation: animeLogo 8s ease-in-out infinite;
	-moz-animation: animeLogo 8s ease-in-out infinite;
}


.pt-page-moveFromRight {
	animation: moveFromRight 2s ease both;
}


@keyframes moveFromRight {	from { transform: translateX(-70%); }}


/*@-webkit-keyframes animeLogo {	50%{-webkit-transform: rotate3d(0, 1, 0, 360deg);}}/*
@-moz-keyframes rightLeft {}*/
@keyframes animeLogo {	50%{ transform: rotate3d(0, 1, 0, 360deg); }}
@-moz-keyframes animeLogo {	50%{ transform: rotate3d(0, 1, 0, 360deg); }}

.contenidoV{
	position: absolute;
	width: 5%;
	z-index: 1;
	left: 30%;
}

.logoV{
	position: relative;
	animation: elevar ease 5s infinite;
}

.logoV img{
	border-radius: 50%;
	/*box-shadow: 0 0 1em #fff, 0 0 0.5em #fff, 0 0 0.5em #fff, 0 0 0.5em #fff;/*eje x, eje y, sombreado, color*/
}

.sombraV{
	background-color: #fff;
	box-shadow: 0 0 1em #fff, 0 0 0.5em #fff, 0 0 0.5em #fff, 0 0 0.5em #fff;
	width: 100%;
	height: 1%;
	border-radius: 50%;
	margin: 0.7em 0 0 0;
	opacity: 0.1;
	animation: sombras ease 5s infinite;
}

@keyframes elevar{ 50%{transform: translateY(20%); } }
@keyframes sombras{ 50%{opacity:0.3;} }

nav ul{
	list-style: none;
	padding: 0;
	/*position: relative; /*para centrear http://www.cristalab.com/tutoriales/centrar-menu-de-ancho-variable-con-css-c104838l/*/
    /*left: 50%;*/
}

nav li{
	display: inline-block;
	padding: 0.1em;
	vertical-align: top;
	/*position: relative; /*para centrear http://www.cristalab.com/tutoriales/centrar-menu-de-ancho-variable-con-css-c104838l/*/
    /*right: 50%;*/
}

nav a{
	background: #fffeff;
	border: 0.1em solid #b6def3;
	/*border-radius: 0.25em;*/
	color: #10252e;
	display: block;
	font-family: Calibri;
	font-size: 1.2em;
	padding: 0 0.5em;
	/*-ms-transition: all 0.5s ease-in;
	-moz-transition: all 0.5s ease-in;
	-o-transition: all 0.5s ease-in;
	-webkit-transition: all 0.5s ease-in;*/
	transition: all 0.5s ease-in;
}

nav a:hover{
	background: #10252e;
	border: 0.1em dashed #b6def3;
	/*border-radius:0.5em 0.5em 0 0;*/
	color: #DDD;
	/*-ms-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;*/
	transition: all 0.5s ease-out;
}


#principal, aside{
	background-color: #fff;
	border-radius: 0.5em;
	box-shadow: 0 0 1em #2f434e, 0 0 0.5em #2f434e, 0 0 0.5em #2f434e, 0 0 0.5em #2f434e;/*eje x, eje y, sombreado, color*/
	display: inline-block;
	margin: 0.6% auto;
	max-width: 100%;
	padding: 0.5em;
	vertical-align: top;
	width: 74%;
	position: relative;
}

#principal{margin: 0.6% 0.6% 0.6% 0.6%}
aside{
	/*text-align: left;*/
	width: 20%;
}
aside ul{
	list-style: none;
}


.transicion{
	/*-ms-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	-webkit-transition: all 0.5s;*/
	transition: all 0.5s;
}

.vinculo a{
	background: #fffeff;
	border-bottom: 2px solid #a71f4d;
	color: #10252e;
	font-size: 0.8em;
	display: block;
	padding: 0.5em;
	/*-ms-transition: all 0.5s ease-in;
	-moz-transition: all 0.5s ease-in;
	-o-transition: all 0.5s ease-in;
	-webkit-transition: all 0.5s ease-in;*/
	transition: all 0.5s ease-in;
	text-indent: 5%;
}

.vinculo a:hover{
	background: #10252e;
	border-bottom: 0.1em solid #b6def3;
	color: #DDD;
	/*-ms-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;*/
	transition: all 0.5s ease-out;
}

.navTitulos{
	color: #a71f4d;
	display: block;	
	padding: 0.2em 0;
	font-weight: bold;
}
.desvanecer{
	opacity: 1;
	filter: alpha(opacity=10);
	/*-ms-transition: all 0.5s ease-in;
	-moz-transition: all 0.5s ease-in;
	-o-transition: all 0.5s ease-in;
	-webkit-transition: all 0.5s ease-in;*/
	transition: all 0.5s ease-in;
}

.desvanecer:hover{
	 opacity: 0.7;
	filter: alpha(opacity=7);
	/*-ms-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;*/
	transition: all 0.5s ease-out;
}

.reAparece{
	opacity: 0.7;
	filter: alpha(opacity=7);
	/*-ms-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;*/
	transition: all 0.5s ease-out;}

.reAparece:hover{
	opacity: 1;
	filter: alpha(opacity=10);
	/*-ms-transition: all 0.5s ease-in;
	-moz-transition: all 0.5s ease-in;
	-o-transition: all 0.5s ease-in;
	-webkit-transition: all 0.5s ease-in;*/
	transition: all 0.5s ease-in;}

.referencias{
	background: #fff;
	border-radius: .2em;
	display: inline-block;
	margin: .3em;
	/*max-width: 10%;*/
	max-height: 4em;
}

.enlacesPrincipales{
	display: inline-block;
	text-align: center;
}


.contenedorIcono{
	display: inline-block;
	height: 180px;
	padding: 0.5em;
	position: relative;
	vertical-align: top;
	width: 140px;
}

.hoverIcono{
	left: 0;
	top: 0;
	opacity: 0.7;	
	position: absolute;
	width: 140px;
}
.hoverIcono:hover{
	cursor: pointer;
	left: -5px;
	opacity: 1;
	top: -5px;
	width: 160px;
}

.icono{width: 100%;}

.texto{
	color: #10252e;
	font-size: .9em;
	text-align: left;
	font-weight: normal;
}

#principal h1{font-size: 1.5em; margin: .5em 0; text-align: center;}
#principal h2{font-size: 1.3em; margin: .5em 0;}
#principal h3{font-size: 1.1em; margin: .5em 0;}
#principal h4{font-style: italic; margin: .5em 0;}

.sliderVanner { 
	position: relative;	
}

/**************ayuda de navegacion*************/
#ayudaNav, #conceptoOC{
	background: #89d0f6;
	border: 1px solid #BFBFBF;
	float: left;
	font-size: 0.7em;
	max-width: 200px;
	padding: 0.5em 0.5em 0.5em 0.5em;
	position: absolute;
	z-index: 100;
}

#conceptoOC{max-width: 50em; font-size: 0.8em;}

.rounded{
	/*-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-o-border-radius: 4px;*/
	border-radius: 4px;
}

/************* mostrando vanner ******************/
.overbox section.slider , .overboxdiv.controls{
	display: inline-block;
	max-width: 100%;
	position: relative;
	vertical-align: top;
	width: 100%;	
}
.vanner{
	display: none;
	text-align: right;

}
.cuadro{display: none;}


.flex-caption {background:none; -ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); zoom: 1;}
.flex-caption {width: 96%; padding: 2%; position: absolute; left: 0; bottom: 0; /*background: rgba(0,0,0,0); */color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.8); font-size: 30px; line-height: 18px; text-shadow: 0 0 0.3em #10252e, 0 0 0.2em #10252e, 0 0 0.2em #10252e;}
.vanner a{color: #fff;}

.botonSubir {
  background: #ffcc01;
  bottom: 1.2em;
  cursor: pointer;
  display: none;
  padding: .25em .5em;
  position: fixed;
  right: 1.5em;
}

input[type="submit"], .boton{
	background-color: #415764;
	/*border: 2px outset #415764;*/
	border-radius: 4px;
	border: 2px solid #555;
	box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.15);
	cursor: pointer;
	color: #fff;
	display: inline-block;
	font-weight: bold;
	font-size: 1em;	
	margin: 1em .5em;
	padding: .2em 1em;
}
input[type="submit"]:hover, .boton:hover{
	background-color: #ddd;
	border: 2px solid #ddd;
	color: #000;
}

form input{
	background-color: #d5ebf6;
	border: 2px inset #d5ebf6;
	cursor: default;	
}

form input[type="image"]{
	background-color: transparent;
	border: none;
	cursor: pointer;
	padding: 0;
	margin: 0;
}

/*td{vertical-align: top;}*/

table #eliminarUsuario{margin: 0 auto;}
#eliminarCuenta input:hover[type="submit"]{background-color: red;}

textarea{
	background-color: #eeeeee;
	border: 2px inset #eeeeee;
	width: 98%;
	height: 7em;
}

.extendido{
	width: 100%;
}

input[type="submit"].botonPDF, .botonImprimir{
	background-color: #c43d3d;
	/*border: 2px outset #415764;*/
	border-radius: 3px;
	border: 2px solid #bd3232;
	box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.15);
	cursor: pointer;
	color: #fff;
	display: inline-block;
	vertical-align: middle;
	font-weight: bold;
	font-size: .8em;	
	margin: 1em .1em;
	padding: .2em .4em;
	top: 0;
}

input[type="submit"].botonPDF:hover{background-color: #b02524; color: #fff;}

.botonImprimir{background-color: #6e98ae; border: 2px solid #6f98ae;}
.botonImprimir:hover{background-color: #2d5972; color: #fff;}
.iconPDF{width: 1.5em;}

#busqueda{
	border-bottom: 3px solid #10252e;
	display: block;
	padding: .5em 0;
	text-align: center;
	width: 95%;
}

#busqueda input[type="text"]{
	background-color: #d5ebf6;
	border: 2px inset #d5ebf6;
	border-radius: .5em 0 0 .5em;
	height: 20px;
	margin: 0;
	vertical-align: top;
	width: 70%
}

#busqueda input[type="image"]{
	border: solid 2px #6e98ae;
	border-radius: 0 .5em .5em 0;
	height: 22px;
	margin: 0;
	width: 10%
}

@media(min-width:400px){
	section#vanner{
		text-align: right;
		width: 60%;
	}
}

@media(max-width: 1100px){
	nav li{
		font-size: 0.95em;
	}
	#principal, aside{ margin: 0.3%;}
	#principal{width: 72%;}
	input[type="submit"].botonPDF, .botonImprimir{font-size: .7em;}
}

@media(max-width: 1000px){
	nav li{
		font-size: 0.85em;
	}
	input[type="submit"].botonPDF, .botonImprimir{font-size: .6em;}
}
@media(max-width: 825px){
	nav li{
		font-size: 0.8em;
	}
}
@media(max-width: 800px){
	.flex-caption {font-size: 20px;}
	/*nav li{
		font-size: 0.8em;
	}*/
	header h1 img{padding: 0;}
	#principal, aside{ margin: 0.2%;}
	.texto, .navTitulos{font-size: 80%;}
	.contenedorIcono{
		height: 120px;
		width: 100px;
	}
	.hoverIcono{width: 100px;}
	.hoverIcono:hover{width: 120px;}

	input[type="submit"].botonPDF, .botonImprimir{font-size: .5em;}
}


@media(max-width: 600px){
	#contenedor, footer, .examen{min-width: 550px;}
	footer{font-size: .8em;}
}