
@font-face {font-family:'DancingScript-Regular';
src:local('DancingScript-Regular'),
url(fonts/DancingScript-Regular.woff) format('woff');
}

@font-face {font-family:'Politik';
src:local('Politik'),
url(fonts/Politik.otf) format('otf');
}

@font-face {font-family:'HelveticaNeueTStd-Md';
src:local('HelveticaNeueTStd-Md'),
url(fonts/HelveticaNeueTStd-Md.otf) format('otf');
}

.DancingScript{font-family: 'DancingScript-Regular';}
.Politik{font-family: 'Politik';}
.Helvetica{font-family: 'HelveticaNeueTStd-Md';}

body {width:100% !important;margin:0 !important; font-family:'Roboto Mono', monospace, "Roboto", "Helvetica", "Arial", sans-serif !important; background-color: #fff;}
.row::after {
    content: "";
    clear: both;
    display: table;
}
[class*="col-"] {
    float: left;
}
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}


/*..................................................................*/
.fechador{color:black;font-size:x-small;font-weight:normal;top:2px; width:210px; height:14px;}
.centrado{display:block;margin-left: auto;margin-right: auto;}	
.centrado-porcentual {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
 a{text-decoration: none;}
.zoom {transition: transform .2s; margin: 0 auto;}
.zoom:hover {transform: scale(1.1);}
.left{float:left;}
.right{float:right;}
.auto{width:100%;padding-bottom:1px;display:block;}
p{line-height:1.5;}
header{margin-bottom:0;}
section{clear:both;width:100%;display:block;}
*, *::after, *::before {box-sizing: content-box !important;}
label{color:red; margin-left:5%;}
#googleIframe{width:90%;margin:0;}
iframe{border:1px solid #fff;padding:1% 1%;width:100%;margin:0 5% 0 5%;}
/*=================================== HEADER  ===========================*/
header{color:white;font-weight:bold;background-image:url("../img/fachadaHD.jpg"); background-repeat:no-repeat;background-position:right top;background-attachment:fixed;width:100%;}
#logo{width:50%;float:left;}
#logo a{ float:left;width:100%;}
#logo p{font-family:'Montserrat', sans-serif;color: #031D96;font-size:1.2em;font-weight:bold;line-height:18px;text-align:center;text-shadow:2px 2px 2px #484C50;margin: 1% 0 1% 0;}
#logoFront{width:70%;margin:0 15% 1% 15%;}
#logoFront2 {width:70%;margin:1% 15% 4% 15%;}
#botonMenu{width:20%;display:block;position:absolute; top:4%; right:4%; }
#botonMenu button{display: none;}

.webActiva{width:100%;height:35px;margin:2% 0 2% 0;float:left;}
.webActiva p{
font-family:'HelveticaNeueTStd-Md', sans-serif;color:#2c6cbe;font-size:1.7em;font-weight:bold;width:100%;height:100%;line-height:35px;margin:0;text-shadow:1px 1px 2px #2c6cbe;text-align:center;}
/*================================ FIN HEADER  =========================*/

/*==================================  NAV  =============================*/
#nav1{width:30%;z-index:999;}
nav {display:block;width:25%;min-height:40px;clear:both; position:absolute; top:1%; right:0;margin-top:1%;z-index:999;}
nav a{color:#000;}
.botonNav {vertical-align:middle;display: inline-block;background-color:#f9ad16 ;border:none;color: #000;text-align: center;font-size: 0.9em;padding: 5px; width:80%;transition: all 0.5s;cursor: pointer; margin: 1px;box-shadow: 1px 1px 1px #484650; opacity:0.9;border-radius:5px;}
.botonNav span {cursor: pointer; display: inline-block; position: relative;transition: 0.5s;}
.botonNav span:after {content: '\00bb';position: absolute;opacity: 0;top: 0;right: -20px;transition: 0.5s;}
.botonNav:hover {background-color: #0071cd;box-shadow: 3px 3px 3px #484C50;color:#0071cd;}
.botonNav:hover span {padding-right:25px;color: #FFF;}
.botonNav:hover span:after {opacity: 1; right: 0;}
.botonNav:visited{color:#000;}

/********************************* boton *****************************************/
.boton {vertical-align:middle;display: inline-block;background-color:#f9ad16;border:none;color: #000;text-align: center;font-size: 0.9em;padding: 6px; width:95%;transition: all 0.5s;cursor: pointer; margin: 1px;box-shadow: 1px 1px 1px #484650; opacity:0.9;border-radius:5px;}
.boton span {cursor: pointer; display: inline-block; position: relative;transition: 0.5s;}
.boton span:after {content: '\00bb';position: absolute;opacity: 0;top: 0;right: -20px;transition: 0.5s;}
.boton:hover {background-color: #0071cd;box-shadow: 3px 3px 3px #484C50;color:#0071cd;}
.boton:hover span {padding-right:25px;color: #FFF;}
.boton:hover span:after {opacity: 1; right: 0;}
.boton:visited{color:#000;}
/********************************* subboton**************************************/
.subboton {vertical-align:middle;display: inline-block;background-color: #f9ad16;border:none;color: #FFFFFF;text-align: center;font-size: 0.9em;padding: 3px; width:100%;transition: all 0.5s;cursor: pointer; margin: 1% 0;box-shadow: 3px 3px 4px #484C50;}
.subboton span {cursor: pointer; display: inline-block; position: relative;transition: 0.5s;}
.subboton span:after {content: '\00bb';position: absolute;opacity: 0;top: 0;right: -20px;transition: 0.5s;}
.subboton:hover {background-color: #0071cd;box-shadow: 3px 3px 3px #484C50;}
.subboton:hover span {padding-right: 25px;color: #F5F5F5;}
.subboton:hover span:after {opacity: 1; right: 0;}
.subboton:visited{color:white;}
.whatsapp{width:0;background-color: transparent;box-shadow: 3px 3px 4px #fff;}
.whatsapp:hover{background-color:transparent;box-shadow: 3px 3px 4px transparent;opacity:0.6;}
/********************************* boton2 **************************************/
.boton2 {vertical-align:middle;display: inline-block;background-color:#f9ad16;border:none;color: #000;text-align: center;font-size: 1em;width:80%;transition: all 0.5s;cursor: pointer; margin: 1px;box-shadow: 4px 4px 4px #484C50;}
.boton2 span {cursor: pointer; display: inline-block; position: relative;transition: 0.5s;}
.boton2 span:after {content: '\00bb';position: absolute;opacity: 0;top: 0;right: -20px;transition: 0.5s;}
.boton2:hover {background-color: #0071cd;box-shadow: 3px 3px 3px #484C50;}
.boton2:hover span {padding-right: 25px;color: #F5F5F5;}
.boton2:hover span:after {opacity: 1; right: 0;}
.boton2:visited{color:#000;}

/*============================== FIN NAV  ============================*/

/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX CONTENIDO  XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

             REFERIRSE A LA HOJA DE ESTILO PERSONALIZADA DE CADA PAGINA
			 
XXXXXXXXXXXXXXXXXXXXXXXXXXXXX  FIN DE CONTENIDO  XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/

/*===================================  FOOTER  ===============================*/
footer{width:100%;	border-top-color:transparent;border-top-width:thin;border-top-style:solid;clear:both;}
#footer1{width:100%;margin-bottom:15px;}
#footer1{display:block;height:45px;color:white;box-shadow: 3px 3px 3px #484C50;background-image:url("../img/azulReverse.png")!important; background-repeat:repeat;background-position:top;text-shadow:1px 1px 2px #484C50;}
#footer12{width:100%;height:45px;}
#footer12 a{font-family: 'Montserrat', sans-serif;color:#0071CD;font-size:0.8em;font-weight:normal;height:45px;line-height:45px;text-decoration:none;text-align:center;float:left;width:20%;}
#footer12 a:hover{text-decoration:underline;}

.flexbox-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}
.flexbox-container-column {
  display: flex;
  flex-direction: column;
  flex-wrap:wrap;
  justify-content: center;
  align-items: center;
  align-content: space-around;
}
#cookieAviso{width:98%;display:block;}
/*=================================== FIN FOOTER  ===============================*/

/* _________________ MEDIA QUERIS ____________________________________________*/

/*----------------------------------------- MEDIA QUERIS   1260PX --------------*/
@media screen and (max-width:1260px){
#nav1{width:25%;}
.boton{padding:2px;}

/*----------------------------------------- MEDIA QUERI   1176PX ---------------*/
@media screen and (max-width:1176px){
}
/*----------------------------------------- MEDIA QUERI   799PX -----------------*/
@media screen and (max-width:799px){
header{background-image:none;}
.webActiva{background-color:#0071cd;height:auto;margin-top:8%;}
.webActiva p{font-size:1.5em;color:#ffffff;}
#secLogo{height:auto;padding: 7% 0;}
#logo{margin:0;width:100%;float:right; background-repeat:no-repeat;background-position:center top;background-attachment:fixed;height:200px; }

#logoFront{width:50%;margin:-5% 25% 1% 25%;}
#logoFront2 {width:50%;margin:1% 25% 1% 25%;}
#botonMenu{left:2%;}	
#logo p{font-size:0.9em;}
#slogan{margin-left:0px;width:100%;float:right;}
#slogan p{font-size:1.1em;text-align:center;}
#slogan ul{font-family:'Montserrat', sans-serif;color: #000;font-size:1.2em;font-weight:bold;width:100%;line-height:24px;text-align:left;text-shadow: 1px 1px 2px #484C50;margin:2% 0 2% 0%;}

nav {width:100%;}
#nav1{width:100%;height:100%;display:none;position:absolute;top:31%;left:0;z-index:99;background:white;z-index:999;}

.botonNav{width:76%;margin: 1% 12% 1% 10%;padding:20px;font-size: 1.2em;}
#botonMenu p{font-size:0.9em;padding-top:5px;}
#botonMenu #button1 {display:block; background:transparent; width:50px;height:50px; margin: -24px 0 0 -10px; border:0;transition:all 500ms ease-in-out;padding:0;}
#botonMenu #button1 img{ width:50px;height:45px;position:absolute; top:4%;}
#botonMenu #button1:hover{opacity:0.7;}
#footer1{display:inline-block;width:100%;height:auto;margin:15px 0;}
#footer12 a{width:100%;clear:both;height:30px;line-height:15px;}
.subboton{width:24%;margin: 0px 8px 8px 1px;padding:10px;font-size: 1.2em;}
}
/*-----------------------------------------  MEDIA QUERI  599X  ---------------------*/
@media screen and (max-width:599px){
/*.boton{width:93%;margin: 0 8px 10px 1px;padding:10px;font-size: 1.2em;}	*/
#nav1{top:28%;}
.subboton{width:93%;margin: 0px 2px 8px 2px;padding:10px;font-size: 1.2em;}
#logoFront{width:60%;margin:-3% 20% 0 20%;}
#logoFront2 {width:60%;margin:3% 20% 1% 20%;}
}
/*-----------------------------------------  MEDIA QUERI  499PX  --------------------*/
@media screen and (max-width:499px){
	
#nav1{top:32%;}
#logoFront{width:70%;margin:3% 15% 0 15%;}
#logoFront2 {width:70%;margin:3% 15% 1% 15%;}
}
/*-----------------------------------------  MEDIA QUERI  328X  ---------------------*/
@media screen and (max-width:328px){

}