body{

	width: 100%;

	margin-top: 0px;

	font-family: "calibri", "MS Comic Sans", verdana, arial;

	/*background:#eeeeee;*/

	}

header {

	background: #0000CC;

	margin:0px;

}

div.header{

	width:100%;

	margin:auto;

	max-width:850px;

	background: #0000cc;

}

div.header img{

	width: 100%;

	margin: 0;

}

img.banner{

	margin: 0 auto -20px auto;

	width:100%;

	max-width:1024px;

	/*padding-bottom:0px;*/

}

div.container {

	margin: 0 auto;

	height:auto;

	width:95%;

	max-width: 1024px; 

	/*border-left: solid 1px #dddddd; 

	border-right: solid 1px #dddddd;*/

	box-shadow: 2px 2px 5px #000000;

	background:#ffffff;

}

div.main{

	width:100%;

	margin: 0 auto;

	padding-bottom:1em;

	background:#ffffff;

}

#col-1, #col-2{

	margin-top:1em;

	padding-bottom:1em;}

article{

	padding-top:1em;

	width:90%;

	margin: 0 auto;

}

div.pres1{

	margin-top: 0px;

	width:60px;

	float:left;

}

div.pres2{

	margin-top: 0px;

	margin-left: 8px;

	width:72%;

	float:left;

}

div.pres3{

	margin-top: -10px;

}

div.pres1 img{

	width:100%;

	max-width:60px;

	margin: 0 auto;

	text-align:right;

}

div.foto{

	width: 48%;

	display:inline-block;

}

div.foto img{

	margin-left:20%;

	margin-right:20%;

	width:60%;

}

ul.inicio {

	list-style-type:square;

	color:#0000cc;

	margin-left:-10px;

}

ul.inicio li a:link, ul.inicio li a:visited{

	color:#ff6600;

	font-weight:bold;

}

ul.inicio li a:hover {

	color:#0000cc;

	font-weight:bold;

	text-decoration:none;

}

h1{

	font-variant:small-caps;

	color:#ff6600;

	/*text-shadow: 1px 1px 0px #cc0000;*/

}

h2{

	font-variant:small-caps;

	color:#0000cc;

}

h3{

	font-variant:small-caps;

	color:#ff6600;

	/*text-shadow: 1px 1px #dddddd;*/

	text-align:center;

}

p{

	color:#0000cc;

	text-align:justify;

}

img.icon{

	width:20px;

}

div.tfno1 p, div.tfno2 p{

	text-align: left;

	margin-top:5px;

	margin-bottom:5px;

}

div.mail{

	width:100%;

}

ul.bib {

	list-style-type:square;

	color:#0000cc;

}

ul.bib li{

	line-height:1.4em;

}

ul.bib li a:link, ul.inicio li a:visited{ 

	font-weight:bold;

	color:#ff6600;

}

ul.bib li a:hover {

	text-decoration:none;

	color:#0000cc;

}

ul.bib h2{

	margin-left:-20px;

}

div.rec{

	margin:0 auto;

	display:inline-block

}

div.rec div{

	margin:0 auto;

	width:70%;

	max-width:100px

}

div.rec img{

	width:100%;

	max-width:100px;

	border-radius: 15px;

}

div.rec h1{

	text-align:center;

	margin-top:0em;

}

a.rec:link{

	text-decoration:none;

}

a.rec:hover{

	text-decoration:none;

}

footer{

	width:100%;

	background: #0000cc;

	margin-top:5px;

	margin-bottom:0px;

}

div.contador{

	padding:10px;

	margin: 0px auto;

	text-align: center;

}

/* Clearfix */

.clearfix:before, .clearfix:after {

	content:"";

	display:table;

}

.clearfix:after {

	clear: both;	

}

.clearfix {

	*zoom:1;	

}	

/*Fin del Clearfix*/

/*Menú de navegación */

#menu {

	width:100%;

	max-width:1024px;

	height:40px;

	margin: 0 auto;

	background: #ffffff;

	font: small-caps 1em "calibri", "MS Comic Sans", arial, verdana;

	font-size: 1.1em;

	/*text-shadow: 1px 1px #dddddd;*/

		}

#menu ul {

	/*border-right: solid 1px #dddddd;*/

	/*border-left: solid 1px #dddddd;*/

	padding:0;

	height:auto;

	margin: auto;

	/*background:#ffffff;*/

}

#menu li {

	display:inline;

	float:left;

	/*background:#ffffff;*/

}

#menu li a {

	width:100%;

	/*border: 1px solid #ff6600;*/

	color: #ff6600;

	/*background:#ffffff;*/

	display: inline-block;

	text-align:center;

	text-decoration:none;

	line-height:40px;

	/*text-shadow: 1px 1px 0px silver;*/

	font-weight: bold;

	-webkit-box-sizing:border-box; /*integra la medida del borde en el ancho, pero necesita prefijos para los siguientes navegadores*/

	-moz-box-sizing: border-box;

	-ms-box-sizing: border-box;

	box-sizing: border-box;

}

/* para decir que el último elemento no tenga el borde de la derecha */

/*#menu li:last-child a {

	border-right:0;

}*/

#menu a:link{

	background-color: #ffffff;

	color: #ff6600;

}

#menu a:hover /*#menu a:active, #menu a:visited */{

	background-color: #ff6600;

	color: #ffffff;

}

/* Para que no se vea la palabra menu*/

#menu a#pull{

	display:none;

	}

/*Fin del menú de navegación*/



/* Media Queries de CSS3 */

@viewport{

	zoom: 1.0;

	width: device-width;

}

@media screen and (max-width: 320px) {

#col-1{

	width:100%;

	margin-left:auto;

	margin-right:auto;

	/*border-top: solid 1px #dddddd;*/

	/*box-shadow: 2px 3px 3px #dddddd;*/

}

#col-2{

	width:100%;

	margin-left:auto;

	margin-right:auto;

	border-top: solid 1px #dddddd;

	/*box-shadow: 2px 3px 3px #dddddd;*/

}

h1{

	font-size:1.2em;

}

h2{

	font-size:1em;

}

h3{

	font-size:1em;

}

p{

	font-size:0.9em;

	line-height:1.3em;

	}

div.tfno1{

	width:100%;

}

div.tfno2{

	width:100%;

}

div.mail p{

	width:100%;

	margin-top:5px;

}

ul.inicio {

	font-size: 0.9em;

}

ul.inicio li{

	line-height:1.6em;

}

ul.bib li{

	line-height:1.5em;

}

div.rec{

	width:49%;

}

div.rec h1{

	font-size:1.1em;

}

#menu {

		border-bottom:0;

	}

#menu ul {

		display:none;

		height: auto;

		width: 100%;

		/*background: #ffffff;*/

	}

#menu li{

		width:50%;

		float:left;

		position:relative;

		background: #ffffff;}

#menu li a {

		width:100%;

		margin: 0 auto;

		/*border: 1px solid #ff6600;*/

		}

/* Una vez haya cargado la etiqueta pull, */

#menu a#pull:after {

		content:"";

		background: url('../images/nav-icon2.png') no-repeat;

		width:30px;

		height:30px;

		display:inline-block;

		position:absolute;

		right:25px;

		top:10px;

}

#menu a#pull {

		display:block;

		padding-top: 10px;

		width: 100%;

		height:30px;

		margin-top: 0px;

		position:relative;

		text-align:left;

		text-indent:25px;

		font-weight: bold;

		font-size:1.2em;

		color:#ff6600;

		text-decoration:none;

		background: #ffffff;

}

}

@media screen and (min-width: 321px) and (max-width: 480px) {

#col-1{

	width:100%;

}

#col-2{

	width:100%;

	border-top: solid 1px #dddddd;

}

h1{

	font-size:1.2em;

}

h2{

	font-size:1em;

}

h3{

	font-size:1.2em;

}

p{

	font-size:0.9em;

	line-height:1.3em;

}

div.tfno1{

	width:120px;

	float:left;

}

div.tfno2{

	margin-left:5px;

	width:120px;

	display:inline-block;

}

ul.inicio {

	font-size: 0.9em;

}

ul.inicio li{

	line-height:1.5em;

}

ul.bib li{

	line-height:1.6em;

}

div.rec{

	width:49%;

}

	#menu ul {

		display:none;

		height: auto;

		width: 100%;

	}

	#menu li{

		width:50%;

		float:left;

		position:relative;

		background: #ffffff;

		}

	#menu li a {

		/*width:100%;*/

		margin: 0 auto;

		border-bottom: 1px solid white;

		border: 1px solid #ff6600;

	

	}

	/* Una vez haya cargado la etiqueta pull, */

	#menu a#pull:after {

		content:""; /* Esto debe aparecer siempre para que funcione. lo ponemos vacío porque lo que queremos cargar es una imagen */

		background: url('../images/nav-icon2.png') no-repeat;

		width:30px;

		height:30px;

		display:inline-block;

		position:absolute;

		right:25px;

		top:10px;

	}

	#menu a#pull {

		display:block;

		padding-top: 10px;

		width: 100%;

		height:30px;

		margin-top: 0px;

		position:relative;

		text-align:left;

		text-indent:25px;

		color:#ff6600;

		font-weight: bold;

		text-decoration:none;

		background:#ffffff;

		

	}

	

}

@media screen and (min-width: 481px) and (max-width: 767px) {

#col-1 {

	width:59%;

	display: inline-block;

}

#col-2 {

	width:37%;

	float:right;

	display:inline-block;

	border-left: solid 2px #dddddd;

	margin-right:2%;

}

h1{

	font-size:1.2em;

}

h2{

	font-size:1em;

}

h3{

	font-size:1em;

}

p{

	font-size:0.9em;

	line-height:1.3em;

}

ul.inicio {

	font-size: 0.9em;

}

ul.inicio li{

	line-height:1.5em;

}

ul.bib li{

	line-height:1.6em;

}

div.rec{

	width:32%;

}

#menu {

		border-bottom:0;

	}

	#menu ul {

		display:none;

		height: auto;

		width: 100%;

	}

	#menu li{

		width:50%;

		float:left;

		position:relative;

		background: #ffffff;

		}

	#menu li a {

		margin: 0 auto;

		/*border-bottom: 1px solid white;*/

		border: 1px solid #ff6600;

	

		}

	/* Una vez haya cargado la etiqueta pull, */

	#menu a#pull:after {

		content:""; /* Esto debe aparecer siempre para que funcione. lo ponemos vacío porque lo que queremos cargar es una imagen */

		background: url('../images/nav-icon2.png') no-repeat;

		width:30px;

		height:30px;

		display:inline-block;

		position:absolute;

		right:25px;

		top:10px;

	}

	#menu a#pull {

		display:block;

		padding-top: 10px;

		width: 100%;

		height:30px;

		margin-top: 0px;

		position:relative;

		text-align:left;

		text-indent:25px;

		color:#ff6600;

		text-decoration:none;

		background: #ffffff;

		font-weight:bold;

		}

}

@media screen and (min-width: 768px) and (max-width:1024px) {

#col-1 {

	width:59%;

	float:left;

	display: inline-block;

}

#col-2 {

	width:40%;

	display:inline-block;

	border-left: solid 2px #dddddd;

}

h1{

	font-size:1.3em;

}

h2{

	font-size:1.1em;

}

p{

	font-size:1em;

	line-height:1.4em;

}

div.tfno1{

	width:120px;

	float:left;

}

div.tfno1 p, div.tfno2 p{

	font-size:0.9em;

}

div.tfno2{

	margin-left:5px;

	width:120px;

	display:inline-block;

}

ul.inicio {

	font-size: 1em;

	}

ul.inicio li{

	line-height:1.5em;



}

ul.bib li{

	line-height:1.8em;

}

div.rec{

	width:24%;

}

div.rec h1{

	font-size:1.2em;

}

#menu li a {

	margin: 0px 10px 0px 10px;

	background:transparent;

	}

}

@media screen and (min-width: 1025px) {

#col-1 {

	width:59%;

	float:left;

	display:inline-block;

}

#col-2 {

	width:40%;

	display:inline-block;

	border-left: solid 2px #dddddd;

}

h1{

	font-size:1.4em;

}

h2{

	font-size:1.2em;

}

p{

	font-size:1em;

	line-height:1.4em;

}

div.tfno1{

	width:130px;

	float:left;

}

div.tfno1 p, div.tfno2 p{

	font-size:1em;

}

div.tfno2{

	margin-left:5px;

	width:130px;

	display:inline-block;

}

ul.inicio {

	font-size: 1em;

}

ul.inicio li{

	line-height:1.8em;

}

ul.bib li{

	line-height:1.8em;

}

div.rec{

	width:24%;

}

div.rec h1{

	font-size:1.2em;

}

#menu li a {

	margin: 0px 10px 0px 10px;

	}

}

/* Media Query de CSS3 para Retina */

@media only screen and (-webkit-min-device-pixel-ratio: 2) {

	#imagenes

}