@import 'https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css';
@import url('https://fonts.googleapis.com/css?family=Francois+One'); /* nav */
@import url('https://fonts.googleapis.com/css?family=Roboto'); /* pie */
@import url('https://fonts.googleapis.com/css?family=Oswald'); /* fafar */
@import url('https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700'); /* cuerpo */

*{
    margin: 0;
    padding: 0;
}

a				{ text-decoration:none; color:#543790;}
a:hover			{ text-decoration:none; color:#336699;}

.desactivado 	{ pointer-events:none; cursor:default;}

.invisible		{ display:none;}
.invisiblee		{ display:none;}
.fijo 			{ position:fixed;}
.actual			{ border:1px solid #fff; box-shadow: 0 0 0 2px #0075d5; }
.alaizquierda	{ display:inline-block; float:left; margin:0 10px 0 0;}
.alcentro		{ text-align:center;}

.socialcomparte	{ display:inline-block;}
.masaltura		{ min-height:400px;}


/* SIN CONTENIDO */
.parrafosincontenido	{ display:table; height:20vh; text-align:center; float:auto; text-align:auto; margin:0 auto}
.mensajesincontenido	{ display:table-cell; vertical-align:middle; font-weight:700; line-height: 1.4em; font-size:190%; color:#ddd;}
.sincontenido:before	{ content:"Parece que no hay nada por aquí. Perdona las molestias"}
.nodisponible:before	{ content:"Este contenido no está disponible en este momento. Perdona las molestias."}
.pronto:before			{ content:"Estamos trabajando para terminar esta parte. Sentimos las molestias"}


/*Preloader*/
.loader 					{ background:#fff; bottom:0; height:100%; left:0; position:fixed; right:0; top:0; width:100%; z-index:10000;}
.loader-inner 				{ left:0; position:absolute; top:50%; width:100%; text-align:center; transform:translateY(-50%);}
.loading-spinner 			{ width:7.5rem; height:7.5rem; animation:spinner-rotate 2s ease-in-out infinite;}
.spinner 					{ animation: spinner-color 8s ease-in-out infinite, spinner-dash 2s ease-in-out infinite; stroke-linecap: round;}
@keyframes spinner-rotate 	{ 100% { transform: rotate(360deg);}}
@keyframes spinner-color 	{ 0%, 100% { stroke:#336699;}}
@keyframes spinner-dash 	{ 0% { stroke-dasharray: 1, 200; stroke-dashoffset: 0;}
     				50% 	{ stroke-dasharray: 90, 200; stroke-dashoffset: -35px;}
     				100% 	{ stroke-dasharray: 90, 200; stroke-dashoffset: -125px;}}
/*End preloader*/


h1, h2, h3, h4, h5, h6, h7 { font-family: 'Roboto', sans-serif; font-weight: 300;}
h1 			{ font-size: 1.70rem; color: #444; line-height:1.2em; margin: 0 0 25px 0;}
h2 			{ font-size: 1.3rem; line-height: 1.9rem; margin: 0 0 1rem 0;}
h4 			{ font-size: 1rem; line-height: 1.5rem; margin: 0 0 .5rem 0;}

hr				{ display:block; margin-top: 0.5em; margin:30px 0 30px 0; border-style:solid; border-width: 0.5px; color:#ddd;}

.lista			{ display:block; margin:0 5px 0 0; text-decoration:none; overflow:hidden;}
.lista:before	{ display:inline-block; float:left; content: "\f105"; font-family: FontAwesome; margin:3px 10px 0 0; color:#543790}

img				{ margin:0 auto; text-align:center; overflow:hidden}

div 		{ transition:all 0.4s ease;}

/* Ajusta el texto a 16px para Mozilla*/
body 		{ font-size: 16px;}
body 		{ position:relative; color:#666; font-family: 'Poppins', sans-serif; font-weight:300; font-weight:400;}

#todo	 	{ position:relative; width:1030px; margin:0px auto; padding:0px;}
#contenido	{ position:relative; width:63.4%; float:left; clear:left;}
#lateral	{ position:relative; width:32%; min-height:440px; float:right; clear:right; padding:0px; overflow:hidden;}
#pie		{ clear:both; margin:0; padding:45px 0 20px 0; background:#444; color:#f3f3f3; font-family: 'Roboto', sans-serif; overflow:hidden;}
#izquierda	{ width:32%; display:inline-block; float:left; overflow:hidden;}
#derecha	{ width:65%; display:inline-block; float:right; overflow:hidden;}

.cajamigadepan			{ clear:both; float:none; text-align:left; border-bottom:1px solid #ddd;}
.cajamigadepan2			{ clear:both; float:none; text-align:left; border-top:1px solid #ddd;}
.textomigadepan			{ display:inline-block; margin:0px 3px 0 0px; padding:25px 0px 25px 0px; color:#999; font-size:100%; text-decoration:none;}
.textomigadepan a		{ border:none; color:#}
.textomigadepan:hover	{ border:none; color:#131f1b}
.textomigadepan:before	{ display:inline-block; padding: 0 5px 0 0; content: "\f105"; font-family: FontAwesome;}
.home::before			{ content: ""; margin:0px 0px 0px 0px; padding:0px 0px 5px 0px;}

.ciencien			{ position:relative; width:100%; clear:both; margin:0 0 0 0; padding:50px 0; overflow:hidden}
.fondouno			{ background:#ffffff;}
.fondodos			{ background:#f8f9fa;}

.caja			{ position:relative; display:auto; min-height:; margin:0 0px 0px 0; padding:35px; background:#FFF; border:1px solid #e1e1e1; border-bottom:2px solid #e1e1e1; border-radius:5px; overflow:hidden;}
.caja a:hover	{ box-shadow: 0px 0px 7px 2px #e1e1e1;}

/* SEPARADORES	 */
.lineadd		{ clear:both; border-bottom: 1px solid #ddd; margin-bottom:30px; padding-top:20px;}
.separador		{ clear:both;}
.s10			{ height:10px;}	
.s15			{ height:15px;}
.s20			{ height:20px;}


/* AVISOCORTO */
#avisodecolor			{ background:#374790; padding:15px 15%; text-align:center; color:#fff; }
.avisodecolor			{ color:#fff; line-height:1.5em; text-decoration:none;}
.avisodecolor a			{ color:#fff; border-bottom:1px solid #fff; text-decoration:none;}
.avisodecolor a:hover	{ color:#ff9933; border-bottom:1px solid #ff9933; text-decoration:none;}
.avisodecolor:before	{ content:"\f130"; font-family:FontAwesome; display:inline-block; float:auto; margin-right:7px;}

/* TITULON	 */
#titulon				{ position:relative; margin:10px 0; padding-left:10px; border-left:2px solid #543790; overflow:hidden;}
.titulon				{ font-family: 'Francois One', sans-serif; font-size:170%; line-height:1.3em; color:#444;}
.tituloninterior		{ font-family: 'Francois One', sans-serif; font-size:130%; line-height:1.3em; color:#444;}

/* BOTONES	 */
.botonerac, .botonerai	{ position:relative; z-index:1; margin-top:20px; font-size:100%; }
.botonerai				{ border-top:1px solid #DDD; padding:30px 0 0 0;}
.botonerai				{ clear:both; text-align:left; overflow:hidden}
.botonerac				{ clear:both; text-align:center; overflow:hidden}
.botoneraficha			{ z-index:1; position:absolute; right:20px; bottom:0; text-align:right}

.previoboton	{ position:relative; display:inline-block; margin:0 0 5px 0; padding:10px 16px; text-align:center; text-decoration:none; line-height:1.5em;}
.leeloen:after	{ content:"Puedes verlo completo en:"; margin:0 5px 0 0;}
.boton			{ position:relative; display:inline-block; margin:0 0 5px 0; padding:8px 14px; text-align:center; text-decoration:none; font-size:80%; line-height:1.5em;}
.boton			{ border-radius:5px; background:#374790; color:#fff;}
.boton:hover	{ border:none; color:#fff; background:#543790;}

/* SECCIONES */
.imageninterior		{ position:relative; max-height:px; margin:0 0 30px 0; overflow:hidden}
.fotointerior		{ top:50%; transform: translateY(-20%);}
.textosecciones		{ position:relative; padding:0 0 30px 0; text-align:justify; overflow:hidden}

blockquote 			{ display:block; background:#374790; color:#fff; padding:35px; margin:1.5em 0; position:relative;}
blockquote:before 	{ content: "\f10d"; font-family: FontAwesome; font-size:120%; padding:15px 20px; color:#374790;  position:absolute; top:-30px; left:45%; background:#fff; text-align:center;}
blockquote:before 	{ border:1px solid #ddd; border-radius:100%; overflow:hidden;}
blockquote:after 	{ content: "\2013 \2003" attr(cite); display: block; text-align:right; font-size:0.875em; font-style:italic; color: #f3f3f3;}

.titulo					{ font-size:120%; color:#666; padding:4px 0; line-height:1.5em; font-weight:700; overflow:hidden}
.texto					{ display:block; font-size:115%; color:#666; padding:4px 0; line-height:1.5em; overflow:hidden}
.separadorsecciones		{ clear:both; border-bottom: 1px solid #ddd; padding:0px 0 0 0; margin: 0 0 0px 0;}


/* VIDEOS */
.contenedor-video { position: relative; padding-bottom: 56.25%; margin:25px 0; height: 0; overflow: hidden;}
.contenedor-video iframe,
.contenedor-video object,
.contenedor-video embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}


/* MAPA */
#contenedormapa 	{ position:relative; padding-top:50%; width:100%; margin:0 auto;}
#mapa 				{ position:absolute; width:100%; height:100%; top:0;}


/* ICONOS */
.code::before		{ content: "\f121"; font-family: FontAwesome; margin:0 5px 0 0}
.oficial::before	{ content: "\f0a3"; font-family: FontAwesome; margin:0 5px 0 0}
.enlace::before		{ content: "\f0ac"; font-family: FontAwesome; margin:0 5px 0 0}	
.facebook::before	{ content: "\f09a"; font-family: FontAwesome; margin:0 5px 0 0}
.youtube::before	{ content: "\f16a"; font-family: FontAwesome; margin:0 5px 0 0}	
.externo::before	{ content: "\f14c"; font-family: FontAwesome; margin:0 5px 0 0}
.play::before		{ content: "\f04b"; font-family: FontAwesome; margin:0 5px 0 0}


.scrollup {
  display: none;
  position: fixed;
  bottom: 80px;
  right: 30px;
  background: #444;
  border-radius:3px;
  color: #fff;
  opacity: 1;
  z-index: 9999;
  width: 40px;
  height: 40px;
  line-height: 35px;
  font-size:180%;
  text-align: center;
  text-decoration: none;
}

.scrollup:before	{ content: "\f106"; font-family: FontAwesome;}
.scrollup:hover 	{ opacity: 1; text-decoration:none; border-radius:100%; color:#fff; border:none; transition:all 0.4s ease;}


/************************************************************************************
MEDIA QUERIES
*************************************************************************************/
@media only screen and (min-width: 1900px) {
#todo	 	{ width:74%; }


}
/* (1024x768) iPad 1 & 2, Landscape */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
.sticky 	{ width:320px}
#todo	 	{ width:98%; }

}
/* for 980px or less */
@media screen and (max-width: 980px) {
.sticky 	{ width:70%;}
#todo	 	{ width:96%; }

}
/* for 700px or less */
@media screen and (max-width: 768px) {
.col-1-3 	{ width: 50%;}
.sticky 	{ position:relative; top:0; width:100%;}
.masaltura	{ min-height:auto; height:auto;}
#todo	 	{ width:94%; }
#contenido	{ width:auto; min-height:auto; height:auto; float:none; clear:both;}
#lateral	{ width:auto; float:none; min-height:auto; height:auto; clear:both;}

.avisodecolor:before	{ display:none; font-size:135%; float:none; clear:both; margin-bottom:7px;}
}
/* for 568px or less */
@media screen and (max-width: 568px) {
.col-1-3 	{ width:100%;}
#contenido	{ padding-bottom:40px;}
#sobrepie	{ margin-top:0}
#pie		{ position:relative;}

}
/* for 480px or less */
@media screen and (max-width: 480px) {
.invisiblee	{ display:block}
.invisiblem	{ display:none}

#izquierda	{ width:auto; display:block; float:none}
#derecha	{ width:auto; display:block; float:none}

.caja		{ margin-bottom:-22px; border-radius:0px;}

/* SECCIONES */
.textosecciones		{ text-align:left;}

/* BOTONES	 */
.botoneraficha			{ position:relative; right:0; left:0; float:none; text-align:center; margin:20px 0 0 0; padding:20px 0 0 0; border-top:1px solid #ddd;}
}