@charset "utf-8";

body {
	background-color: #a5d1f3;
	font-family:arial, verdana, sans-serif;
	color:#606060;
	
}
	
A {text-decoration:none;color:#606060;FONT-SIZE:1em; FONT-FAMILY: tahoma, Arial, Helvetica, sans-serif;}
A:active {text-decoration:none;color:#FF6633 ;} 
A:hover {
	text-decoration:none;
	color:#3896df;
}

h1 { font-size:1em; font-weight:bold;  color:#84b2bf; text-align:center;}
h2 { font-size:1.2em; font-weight:bold;  color:#129fdb; text-align:center;}

.caja-txt a:link, .caja-txt a:visited, .caja-txt a:active  { font-family: tahoma, Arial, Helvetica, sans-serif;	font-size: 1em; color: #fff;}


.container {
	width: 68%;
	background: #d1e9fc;
	border-radius: 20px;
	margin: 0px auto;
	font-size:1em;
	border: thick solid #d1e9fc;
	}
	
	section,aside {
		padding: 10px;
		background:#ffffff;
		-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px;border-radius:5px;
	}
	section {
		float: left;
		width: 70%;
	}
	aside {
		float: right;
		width: 26%;
	}
	nav {
		overflow: hidden;
	}
	nav ul {
		list-style-type:none;
		float:left;
		padding:0px;
	}
	nav ul li {
		float:left;
		padding:15px 20px; 15px 20px;
		margin:2px;
		background:#88b658;
		-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px;border-radius:5px;
	}
	footer {
		margin:10px;
		text-align:center;
		clear:both;
	}
	
#columnas2sb {
	width: 270px;
	height: auto;
	background-color: ffffff;
	float: left;
	margin: 5px 5px 5px 5px;
	
	
	
}

#columnas2sb2 {
	width: 270px;
	height: 265px;
	background-color: ffffff;
	float: left;
	margin: 5px 5px 5px 5px;
	border-radius: 8px;
	border: thin solid #ffffff;
	border: medium solid #bad9f6;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
}

#columnas3sb {
	width: 200px;
	height: auto;
	background-color: ffffff;
	float: left;
	margin: 5px 5px 5px 5px;
}



#caja {
	width: 180px;
	height: 130px;
	float: left;
	margin: 5px 5px 5px 5px;
	border-radius: 8px;
	margin: 5px 10px 5px 14px;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	background-color: #9ec7d8;
	background-image: url("inferior-text.png");
}

#caja:hover {
	color: #ffffff;
	background-color: #b5e2ef;
	background-image: url("inferior-text.png");

}


#caja0 {
	width: 180px;
	height: 130px;
	float: left;
	margin: 5px 5px 5px 5px;
	border-radius: 8px;
	margin: 5px 10px 5px 14px;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	background-color: #a7cf54;
	background-image: url("inferior-text.png");
}

#caja0:hover {
	color: #ffffff;
	background-color: #b5e2ef;
	background-image: url("inferior-text.png");

}

#caja3 {
	width: 180px;
	height: 130px;
	float: left;
	margin: 5px 5px 5px 5px;
	border-radius: 8px;
	margin: 5px 10px 5px 14px;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	background-color: #d8b69b;
	background-image: url("inferior-text.png");
}

#caja3:hover {
	color: #ffffff;
	background-color: #b5e2ef;
	background-image: url("inferior-text.png");

}

#caja4 {
	width: 180px;
	height: 130px;
	float: left;
	margin: 5px 5px 5px 5px;
	border-radius: 8px;
	margin: 5px 10px 5px 14px;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	background-color: #f9a008;
	background-image: url("inferior-text.png");
}

#caja4:hover {
	color: #ffffff;
	background-color: #b5e2ef;
	background-image: url("inferior-text.png");

}

#caja5 {
	width: 180px;
	height: 130px;
	float: left;
	margin: 5px 5px 5px 5px;
	border-radius: 8px;
	margin: 5px 10px 5px 14px;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	background-color: #caa0e5;
	background-image: url("inferior-text.png");
}

#caja5:hover {
	color: #ffffff;
	background-color: #b5e2ef;
	background-image: url("inferior-text.png");

}

#caja6 {
	width: 180px;
	height: 130px;
	float: left;
	margin: 5px 5px 5px 5px;
	border-radius: 8px;
	margin: 5px 10px 5px 14px;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	background-color: #da805a;
	background-image: url("inferior-text.png");
}

#caja6:hover {
	color: #ffffff;
	background-color: #b5e2ef;
	background-image: url("inferior-text.png");

}

#caja7 {
	width: 180px;
	height: 130px;
	float: left;
	margin: 5px 5px 5px 5px;
	border-radius: 8px;
	margin: 5px 10px 5px 14px;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	background-color: #6aa9c3;
	background-image: url("inferior-text.png");
}

#caja7:hover {
	color: #ffffff;
	background-color: #b5e2ef;
	background-image: url("inferior-text.png");

}


#caja8 {
	width: 180px;
	height: 130px;
	float: left;
	margin: 5px 5px 5px 5px;
	border-radius: 8px;
	margin: 5px 10px 5px 14px;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	background-color: #c6b418;
	background-image: url("inferior-text.png");
}

#caja8:hover {
	color: #ffffff;
	background-color: #b5e2ef;
	background-image: url("inferior-text.png");

}











#caja2 {
	width: 140px;
	height: 140px;
	background-color: ffffff;
	float: left;
	margin: 5px 5px 5px 5px;
	border-radius: 8px;
	border: medium solid #bad9f6;
	margin: 5px 11px 5px 11px;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
}

#caja-cabecera { 
text-align:center;
font-size:1.4em;
	font-family:arial, verdana, sans-serif;
	color:#ffffff;
	background:#62aecc;
	width: 96%;
	height: auto;
	float: left;
	margin: 5px 5px 20px 5px;
	border-radius: 5px;
	padding-top: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
}

#caja-cabecera-lateral { 
text-align:center;
font-size:1.4em;
	font-family:arial, verdana, sans-serif;
	color:#ffffff;
	background:#8cb9ca;
	width: 92%;
	height: auto;
	float: left;
	margin: 5px 5px 20px 5px;
	border-radius: 5px;
	padding-top: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
}

#caja-neutra {
	width: 140px;
	height: 100px;
	float: left;
	margin: 3px 3px 3px 3px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

#caja-neutra2 {
	width: 140px;
	height: 140px;
	float: left;
	margin: 3px 3px 3px 3px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

#cont {
	width: 96%;
	height: auto;
	float: left;
	margin: 5px 5px 20px 5px;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	border: medium solid #bad9f6;
	border-radius: 20px;
}


 
	/* para 980px o menos */
	@media screen and (max-width:980px) {
		.container {
			width:98%;
		}
		section {
			width:68%;
		}
	}
 
	/* para 700px o menos */
	@media screen and (max-width:700px) {
		aside,section {
			float:none;
			width:96%;
		}
		nav, section {
			font-size:1.2em;
		}
		aside {
			margin-top:5px;
		}
		nav ul {
			float:none;
			clear:both;
		}
	}
 
	/* para 480px o menos */
	@media screen and (max-width:480px) {
		
		nav, section {
			font-size:1.5em;
		}
		section {
			width:94%;
		}
		nav ul {
			float:left;
			clear:none;
			width:50%;
		}
		nav ul li {
			float:none;
		}
	}
	
	@import url(http://fonts.googleapis.com/css?family=Raleway);
#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #menu-button {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  line-height: 1;
  display: block;
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#cssmenu:after,
#cssmenu > ul:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
#cssmenu #menu-button {
  display: none;
}
#cssmenu {
  width: auto;
  font-family: Raleway, sans-serif;
  line-height: 1;
}
#cssmenu > ul {
  background: #3db2e1;
}
#cssmenu > ul > li {
  float: left;
  -webkit-perspective: 1000px;
  -moz-perspective: 1000px;
  perspective: 1000px;
}
#cssmenu.align-center > ul {
  font-size: 0;
  text-align: center;
}
#cssmenu.align-center > ul > li {
  display: inline-block;
  float: none;
}
#cssmenu.align-right > ul > li {
  float: right;
}
#cssmenu > ul > li > a {
  padding: 16px 20px;
  font-size: 14px;
  color: #ffffff;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none;
  background: #3db2e1;
  -webkit-transition: all .3s;
  -moz-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s;
  -webkit-transform-origin: 50% 0;
  -moz-transform-origin: 50% 0;
  transform-origin: 50% 0;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
}
#cssmenu > ul > li.active > a {
  color: #dff2fa;
}
#cssmenu > ul > li:hover > a,
#cssmenu > ul > li > a:hover {
  color: #dff2fa;
  -webkit-transform: rotateX(90deg) translateY(-23px);
  -moz-transform: rotateX(90deg) translateY(-23px);
  transform: rotateX(90deg) translateY(-23px);
  -ms-transform: none;
}
#cssmenu > ul > li > a::before {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: -1;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  padding: 16px 20px;
  color: #dff2fa;
  background: #19799f;
  content: attr(data-title);
  -webkit-transition: background 0.3s;
  -moz-transition: background 0.3s;
  transition: background 0.3s;
  -webkit-transform: rotateX(-90deg);
  -moz-transform: rotateX(-90deg);
  transform: rotateX(-90deg);
  -webkit-transform-origin: 50% 0;
  -moz-transform-origin: 50% 0;
  transform-origin: 50% 0;
  -ms-transform: translateY(- -18px);
}
#cssmenu > ul > li:hover > a::before,
#cssmenu > ul > li > a:hover::before {
  background: #3db2e1;
}
#cssmenu.small-screen {
  width: 100%;
}
#cssmenu.small-screen > ul,
#cssmenu.small-screen.align-center > ul {
  width: 100%;
  text-align: left;
}
#cssmenu.small-screen > ul > li,
#cssmenu.small-screen.align-center {
  float: none;
  display: block;
  border-top: 1px solid rgba(100, 100, 100, 0.1);
}
#cssmenu.small-screen > ul > li:hover > a,
#cssmenu.small-screen > ul > li > a:hover {
  color: #dff2fa;
  -webkit-transform: none;
  -moz-transform: none;
  transform: none;
  -ms-transform: none;
}
#cssmenu.small-screen > ul > li > a::before {
  display: none;
}
#cssmenu.small-screen #menu-button {
  display: block;
  padding: 16px 20px;
  cursor: pointer;
  font-size: 14px;
  text-decoration: none;
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: 1px;
  background: #3db2e1;
}
#cssmenu.small-screen #menu-button:after {
  content: "";
  position: absolute;
  right: 20px;
  top: 17px;
  display: block;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  border-top: 2px solid #ffffff;
  border-bottom: 2px solid #ffffff;
  width: 22px;
  height: 3px;
}
#cssmenu.small-screen #menu-button.menu-opened:after {
  border-top: 2px solid #dff2fa;
  border-bottom: 2px solid #dff2fa;
}
#cssmenu.small-screen #menu-button:before {
  content: "";
  position: absolute;
  right: 20px;
  top: 27px;
  display: block;
  width: 22px;
  height: 2px;
  background: #ffffff;
}
#cssmenu.small-screen #menu-button.menu-opened:before {
  background: #dff2fa;
}




/*Código para modificar el aviso de cookies*/

#cookieChoiceInfo {
background: #62aecc !important; /*Fondo de la barra*/
color: #fff !important;
font-size: 18px !important; /*Tamaño fuente botones, modifica el tamaño final*/
font-weight:normal !important; /*Estilo de fuente: normal, cursiva, negrita*/
top: auto !important;
bottom: 0 !important;/*Posición de la barra: abajo*/
border-top: 10px #86c1dd solid !important; /*Borde de la barra, anchura, color y estilo*/
padding: 40 !important;
box-sizing: border-box;

transform:scale(1.0,1.0);
opacity: 1.0; /*Transparencia de 0 a 1*/
}


.cookie-choices-text {
display: inline-block !important;
vertical-align: middle !important;
font-size: 18px !important; /*Tamaño de la fuente del aviso*/
margin: 5px 10px !important;
color: #fff !important; /*Color de la fuente del aviso*/
max-width: 800px !important;
text-align: left !important;
line-height: 40px !important;

}

#cookieChoiceInfo a {
display: inline-block;
background: #e7eaeb; /*Fondo del botón*/
padding: 8px;
border-radius: 8px; /*Borde redondeado*/
box-shadow: 1px 1px 8px #737576; /*Sombra del botón*/
border: 2px #fff solid; /*Borde del botón, anchura, color y estilo*/
text-shadow: 1px 1px 2px #bcd8e5; /*Sombra del texto del botón*/
}
#cookieChoiceInfo a:nth-child(2) {
background: #aad2e4; /*Fondo del segundo botón*/

/*Si quieres que el segundo botón sea diferente del primero modifica aquí*/
}
.cookie-choices-button {
font-weight: normal;
text-transform: none !important;
white-space: nowrap;
color: #fff;
margin-left: 8px;
padding: 0 10px;
text-decoration: none;
}