@charset "utf-8";
/* CSS Document */
* { padding: 0; box-sizing: border-box; font-family: 'corbel';}
@font-face { font-family: 'corbel'; src: url('../fonts/corbel.eot'); src: local(''), url('../fonts/corbel.woff') format('woff'), url('../fonts/corbel.ttf') format('truetype'), url('../fonts/corbel.svg') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'corbel-bold'; src: url('../fonts/corbel-bold.eot'); src: local(''), url('../fonts/corbel-bold.woff') format('woff'), url('../fonts/corbel-bold.ttf') format('truetype'), url('../fonts/corbel-bold.svg') format('svg'); font-weight: normal; font-style: normal; }
html { width: 100%; margin: 0px; padding:0px; }
body {width: 100%; margin: 0px; padding:0px; background-color: #f1f1f1; font-family: 'corbel', Verdana, sans-serif; font-size: 16px}
.fondobody {background-color: #F1F1F1}
.bodyblanco {background-color: #ffffff}
.masinfo {width: 22%}
.masinfo:hover {box-shadow: 0px 0px 8px 3px #666; transition: all 0.3s ease; filter: grayscale(100%)}
.inscripcion {width: 100%; height: auto}
.inscripcion:hover {box-shadow: 0px 0px 8px 3px #666; transition: all 0.3s ease; filter: grayscale(100%)}
.division {border-bottom: 2px solid #002E5A; width: 30%; margin:auto}

#contenedor { position: absolute; width: 100%; height: auto; z-index: 3; top: 0px; margin-right: auto; margin-left: auto; left: 0px; right: 0px; }
header {position:fixed; width:100%; height:90px; background:#fff; z-index:12; box-shadow: 0px 0px 5px 3px rgba(0,0,0,.3); }
/* menu */
header { height: 90px; background: #fff; color: #000; display: flex; justify-content: flex-end;}
#btn-menu { display: none;}
header label { font-size: 30px; cursor: pointer; display: none;}
.menu ul { background: #fff; display: flex; list-style: none;}
.menu ul ul { display: none;}
.menu a { display: block; padding: 15px 10px; color: #cc2121; text-decoration: none; line-height: 32px; font-weight: 700;}
.menu a:hover { background: #444; color: #fff}
.menu a i { margin-left: 10px;}
.menu ul li:hover ul { transition: all 0.3s ease; display: block; position: absolute;}
.submenu ul li a {padding: 4px 15px 4px 15px;}
@media (max-width: 768px) {
  header label { display: block; padding-top: 16px; padding-right: 16px; transition: all 0.4s ease;}
  .menu { position: absolute; top: 64px; left: 0; width: 70%; transform: translateX(-100%); transition: all 0.3s;}
  .menu ul { flex-direction: column; display: block;}
  .menu ul li:hover ul { display: none; position: static;}
  .menu a i { position: absolute; right: 16px; line-height: 32px;}
  #btn-menu:checked ~ .menu { transform: translateX(0%);}
}

.textoFotoH1 {font-size:70px !important; color:white !important}
.textoFotoH2 {font-size:20px !important; color:white !important}
.textosFoto {position:absolute; top: 0px; width:90%} 

/* texto encima de imagen */
.cajaFoto {position:relative; width: 100%; height: auto;margin:auto}
.cajaFoto img {width: 100%; height: auto}
.cajaTextoDentroFoto {position:absolute; top: 50%; left: 1%;  transform: translate(0, -50%);; background-color: rgba(0,0,0,.4); border-radius: 6px; width:50%}
/* fin texto encima de imagen */

.cajarestaurante {width: 45%; float: left; margin: 1%; border:1px solid #ccc; padding: 1%; text-align: center;}
.cajarestaurante img {width: 100%; height: auto}
.cajarestaurante img:hover {opacity: .7}
.platos {width: 23%; height: auto; margin: 0.5%; float: left}
.enlace:hover {color: #002E5A !important; text-decoration: underline; font-weight: bold}
.caja_productos {vertical-align:top; padding:1%; width: 24%; float: left; text-align: center; margin-bottom: 30px; height: 400px}
.caja_productos h1 {margin:0px; text-align:left}
.caja_productos h2 {font-size:16px; margin:0px; text-align:left}
.caja_productos_detail {vertical-align:top; padding:1%; width: 100%; float: left; text-align: center; margin-top: 120px; margin-bottom: 20px; border: 1px #ccc}
.productos-foto {vertical-align:top; width:99%; position: relative}
.productos-foto img {max-width:100%; max-height:380px; width:auto; height:auto}
.img-contenedor {overflow:visible}
.img-contenedor:hover a img {box-shadow: 0px 0px 5px 3px rgba(0,0,0,.2); background-color: #fafafa; }
.productos-descripcion {vertical-align:top; width:99%; margin-left: 3%}
.productos-descripcion a:link, .productos-descripcion a:visited, .productos-descripcion a:active {color: #333 !important}
.productos-descripcion a:hover {color: #002E5A !important; text-decoration: none}
.centro {text-align: center !important}
.preciosIncludes {font-size:16px !important}
.precios {font-size:14px !important}
.precio {font-size: 26px;font-weight: normal; font-style: normal}
h2, h3 {font-size: 16px; margin-top: 15px; margin-bottom: 10px; text-align:left;font-weight: normal; font-style: normal}
.fondoBlanco {background-color: #fff !important;}
.caja_contenido {text-align:center; border:0px; background-color: #fafafa}
.caja_contenido h1 {font-size:26px; margin:0px; text-align:left}
.caja_contenido td {padding:10px} 
#ficha-foto {vertical-align:top; float:left; width:55%; position: relative}
#ficha-foto img {width:98%; height:auto; max-width: 520px}
.imagenok {padding-bottom: 10px; margin: 3px; float:none}
.tablaPetita {width: 90%; max-width: 600px; height: auto}
#ficha-detalles {vertical-align:top; float: left; width:40%; margin-left: 2%}
#ficha-detalles p {text-align:left}
.euro {font-size:20px; text-decoration: none;font-weight: normal; font-style: normal}
.caja {padding: 1%; width:95%}
#contenedor2 {position: relative; max-width: 1400px; width:97%; height: auto; z-index: 3; top: 10px; margin-right: auto; margin-left: auto; left: 0px; padding: 1%}
.cajaDescripcion {border-top: 1px solid #ccc; width: 45%; text-align: left; height: auto; padding: 3%; float: left}
.cajaFormato {border-top: 1px solid #ccc; width: 45%; text-align: left; height: auto; padding: 3%; float: left}
.cajaTabla {border-top: 1px solid #ccc; width: 90%; text-align: left; height: auto; padding: 3%}
#ocultoDistribuidor {visibility: hidden;}
#ocultoTaller {visibility: hidden;}
.cajaAddImagen {float: left; width: 15%; height: auto;}
.cajaAddImagen img {width: 95%; height: auto;}
.cajaAddTexto {float: left; width: 60%; height: auto; }
.cajaAddTexto p {line-height: 110% !important; }
.imagenHeader {width: 100%; height: auto; }
.imagenHeader img {width: 100%; height: auto; overflow: hidden;}
.tituloHeader { font-size:40px !important; font-weight: bold; color: #fff !important }
nav { float:right; margin-top: 0px;}
.anchoTercio {width: 30% !important; margin-right: 1%; text-align: left; z-index: 20;}
.anchoMitad {width: 45% !important; margin-right: 1%; text-align: left; z-index: 20;}
.anchoQuinto {width: 18% !important; margin-right: 1%; text-align: left; z-index: 20;}
.anchoQuinto h6 {font-size: 14px;}
.anchoQuinto p {font-size: 13px;}
.anchoTercio h6 {font-size: 14px;}
.anchoTercio p {font-size: 13px;}
.carrito {height: 30px; width: auto; }
.max100px {max-width:100px;}
.max200px {max-width:200px;}
.max250px {max-width:250px;}
.max300px {max-width:300px;}
.max350px {max-width:350px;}
.max400px {max-width:400px;}
.max450px {max-width:450px;}
.max500px {max-width:500px;}
.max550px {max-width:550px;}
.max600px {max-width:600px;}
.max650px {max-width:650px;}
.max700px {max-width:700px;}
.max800px {max-width:800px;}
.max900px {max-width:900px;}
.max1000px {max-width:1000px;}
.max1200px {max-width:1200px;}
.max1400px {max-width:1400px;}
.imgListado {margin: 15px;}
.formulario {background-color: #ffffff;}
.error {background-color: #002E5A; color: white;}
.flota_right {float: right;}
textarea {width: 95%; height: 250px;}
.instagram {width: 80%; margin: auto;}
.instagramTextArea {width: 95%; height: 250px;}
.limpiar {clear: both;}
.cookies {padding-left:5px;text-decoration:none;color:#ffffff;}
.cerrarh {width:20px; margin-top: 2px; cursor:pointer; float: right;}
.text_right {text-align: right;}
.text_left {text-align: left !important;}
.text_center {text-align: center;}
.laboratoriosTexto {width: 67%; float: left; padding: 2%;}
.laboratoriosImagenes {width: 27%; float: left; padding: 2%;}
.laboratoriosImagenes img {width: 100%; height: auto;}
.centrar {text-align: center; }
.ecoembes {position: relative; width: 200px; height: auto; margin-left: 0; margin-right: 0; margin: auto; float: right}
#mapa {width:100%; height: 400px; border: 2px solid #ccc; }
.campo_formulario { max-width: 600px; width:100%; background-color: rgba(250,250,250,1); color: #444;  border: 1px #999 solid; padding: 6px; border-radius: 3px ;  }
.campo_formulario_buscar { width:60%; background-color: rgba(255,255,255,1); color: #444;  border: 1px #999 solid; padding: 6px; border-radius: 3px;  }
.fotoIndex {width: 18%; margin: 1%; float: left; height: auto; padding: 0px;}
.fotoIndex:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,.3); }
.fotoIndex a {padding: 0px;}
.fotoIndex img {width: 100%; height: auto;}
.catalogo {max-width: 400px; width: 30%; height: auto; float: left; margin-right: 20px;}
.catalogo:hover {opacity: .7;}
.catalogoHome {max-width: 150px; width: 30%; height: auto; float: left; margin-left: 60px; margin-bottom: 200px}
.catalogoHome:hover {opacity: .7;}
.calidad {width: 50%; max-width: 450px;  height: auto; margin-left: 40px; margin-bottom: 80px;}
#cabecera {position:relative; width:100%; height:55px; max-width: 1400px;margin-left: auto; margin-right: auto; }
.logoempresa {position:absolute; left: 30px; border:0px; width: auto; height:90px; float:left; margin-top:0; }
.logo {height:100%; width:auto }
.botonmenu { margin: 20px 10px 10px 20px; border:0px; height:0px; width:0px; float:right; cursor:pointer; z-index:200; visibility:hidden;}

.bodyContacto {background-color: rgba(61,61,61,1); width: 95%; }
.tituloSubMenu {font-size: 16px; color:#000000; font-weight: bold;}
.opcionMenu {font-size: 16px; color:#000; margin-right: 10px; font-weight: bold;}
.opcionMenu:hover {color:#002E5A; cursor: pointer; }
.botoncerrar {float:right;color:#FBFBFB; margin: 2px; padding:0px;}
.botoncerrar img { width:20px; height:auto; cursor:pointer;}
.flotar { float: left; }
.enana { font-size: 12px; margin-top: -20px; color: #888888;}
.miel {width: 0px; height: 0px; overflow: hidden;}
.width1000px {max-width: 1000px;}
.width1200px {max-width: 1200px;}
.width700px {max-width: 700px;}
.cajaAnuncio {border: 1px solid #aaaaaa; padding: 10px; }
.icono {width: 14px; height: auto;}
.video_container {width: 95%; height: auto; float: left; margin: 1%; margin-left: 10%; max-width: 700px;}
.video { position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0; }
.video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.items {font-weight: bold; line-height: 26px; font-size: 16px; padding:10px 20px 10px 20px; margin: 2px; background-color: #002E5A !important; color: #fff !important; border: 1px solid #002E5A !important;}
.items:hover {font-weight: bold; line-height: 26px; font-size: 16px; padding:10px 20px 10px 20px; margin: 2px; background-color: #fff !important; color: #000 !important; border: 1px solid #002E5A !important;}
.items2 { font-weight: bold; line-height: 26px; font-size: 16px; padding:10px 20px 10px 20px; margin: 2px; background-color: #82101b; color: #fff !important; }
.items2:hover {font-weight: bold; line-height: 26px; font-size: 16px; padding:10px 20px 10px 20px; margin: 2px; background-color: #002E5A; color: #fff !important;}
.items3 {font-weight: bold; line-height: 26px; font-size: 16px; padding:10px; margin: 2px; background-color: #002E5A; color: #fff !important;}
.items3:hover { font-weight: bold; line-height: 26px; font-size: 16px; padding:10px; margin: 2px; background-color: #82101b; color: #fff !important; }
#guasap a { position: fixed; z-index: 9999; right: -25px; float: right; bottom: 20px; margin-top: -25px; cursor: pointer; width: 180px; max-width: 250px; color: #fff !important; font-size: 16px; text-align: left; padding: 10px 10px 10px 5px; margin: 0 auto 0 auto; background: #20B038;transition: All 0.5s ease; text-decoration: none; }	
#guasap a:hover { right: 0px; cursor:pointer; color: #666; text-align: center; text-decoration: none; background: #333;}	
#guasap2 a {text-align: center; z-index: 9999; right: -25px; cursor: pointer; width: 180px; max-width: 250px; color: #fff !important; font-size: 16px; padding: 10px; margin: 0 auto 0 auto; background: #20B038; transition: All 0.5s ease; text-decoration: none; }	
#guasap2 a:hover, #guasap2:hover { right: 0px; cursor:pointer; color: #666; text-align: center; background: rgba(0,130,251,1.00); text-decoration: none !important;}	
#sms2 a {z-index: 9999; right: -25px; cursor: pointer; width: 180px; max-width: 250px; color: #fff !important; font-size: 16px; text-align: center; padding: 10px; margin: 0 auto 0 auto; background: rgba(0,130,251,1.00); transition: All 0.5s ease; text-decoration: none; }	
#sms2 a:hover { right: 0px; cursor:pointer; color: #666; text-align: center; text-decoration: underline;}	
#presupuesto {cursor:pointer; width:100px; height:45px; background-color: #002E5A; opacity:1; position:fixed; top: 70px; right: 0; z-index:2; transition: all .9s ease; text-align: center; font-size:16px; font-weight:bold; padding: 4px; color:#fff; text-decoration:none;}
#cajacontacto { position:absolute; width:0px; background-color: rgba(61,61,61,1) ; height:2000px; max-width:480px; top: 55px; right: 0px; visibility:hidden; z-index:6; padding-top: 20px; transition: all 0.6s ease; } 
#contactoiframe {border: 0px; width:95%; height:98%; padding: 0; }
.redessociales { z-index: 8; width: 100%; height: 100px; margin-bottom: 20px;}
.redessociales img { border-width:0px; height:auto; filter: grayscale(100%); opacity:1; }
.redessociales img:hover { border-width:0px; height:auto; filter: grayscale(0%); opacity:1;}
.redsociallogo {width: 35px; height: auto; opacity:1; border:0; margin-top: 80px;}
.redsociallogo:hover {opacity:.8; }
.pagos { z-index: 8; width: 100%; height: 200px; }
.pagos img { border-width:0px; height:auto; }
.pagos img:hover {opacity:.8; }
.unpixel {width: 1px; height: 1px; overflow: hidden; }
#viruta { z-index: 8; width: 90%; height: auto; max-width: 400px;}
#viruta p img {width: 90%;}
#principal { width:100%; height: auto;  margin-left:auto; margin-right:auto; position: relative; max-width: 1920px; top: 90px; margin-bottom: 180px;}
#principal .numero {color: #666666; font-size: 16px; text-align: right; line-height: 150%; margin-top: 15px; margin-bottom: 15px; font-weight: normal; font-style: normal; }
.img650 { max-width: 650px; width: 100%; height: auto; }
#principal h1 {	color: #404040; font-size: 30px; margin: 60px 10px 10px 0px; font-weight: 600; font-style: normal; line-height: 110%; text-align:center; margin-left: 10%; margin-right: 10%; }
#principal h2 { color: #404040; font-size: 24px; font-weight: 600; font-style: normal; line-height: 110%; text-align: center; margin-left: 10%; margin-right: 10%; }
#principal h3 { color: #555; font-size: 16px; line-height: 110%; margin-top: 15px; margin-bottom: 10px; font-weight: 400; text-align:center; margin-left: 10%; margin-right: 10%; }
#principal h4 { color: #555; font-size: 16px; line-height: 150%; margin-top: 15px; margin-bottom: 15px; font-weight: 400; font-style: normal; text-align:center; margin-left: 10%; margin-right: 10%;}
#principal h5 { color: #555; font-size: 16px; text-align: center; line-height: 150%; margin-top: 0px; margin-bottom: 0px; font-weight: 400; font-style: normal; padding: 0px 0px 0px 20px; margin-left: 10%; margin-right: 10%;}
#principal h6 { color: #373126; font-size: x-small; text-align: right; font-weight: 400; font-style: normal;margin-left: 10%; margin-right: 10%; }
#principal p { color: #555; font-size: 16px; line-height: 150%; margin-top: 15px; margin-bottom: 15px; font-weight: 400; font-style: normal; margin-left: 10%; margin-right: 10%;}
#principal ul { color: #769D00; font-size: 16px; text-align: left; line-height: 150%; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-left: 10%; margin-right: 10%;}
#principal ol { color: #769D00; font-size: 16px; text-align: left; line-height: 150%; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-left: 10%; margin-right: 10%;}
#principal li { margin-left: 60px; padding: 0px; color: #444; font-size: 16px; text-align: left; line-height: 150%; white-space: normal; }
#principal a:link, #principal a:visited, #principal a:active { color: #002E5A; text-decoration: none; text-align: right; padding: 0px;}
#principal a:hover { color: #000; text-decoration: underline !important; }
.divfotocentral { text-align:center;}
.divfotocentral img { width: 100%; height:auto; margin-bottom: 20px; }
.fototexto { margin-left: auto; margin-right: auto; margin-top: 20px;margin-bottom: 20px; border:0px; text-align: center; float: none; clear: both; width: 100%; height: auto;}
.columnas2 { text-align: justify !important; column-count: 2; column-gap: 40px; margin-bottom: 30px; }
.columnas3 { text-align: justify !important; column-count: 3; column-gap: 20px; margin-bottom: 30px; }
.columnas4 { text-align: justify !important; column-count: 4; column-gap: 10px; margin-bottom: 30px; }
.columnas2 p, .columnas3 p, .columnas4 p {margin-top: 0px !important;}
.imagenesAnchas {width: 100%;}
.portfolioimagen {width:75%; float:left; max-width:640px; margin-left: 2%;}
.portfolioimagen img {width:100%; max-width:600px; height:auto;}
.portfolioclear {clear:both; margin-bottom:40px;}
.portfoliotexto {width:25%; float:left; text-align: left !important;}
.portfoliotexto h2 {width:100%; max-width:340px; text-align: left !important; margin-bottom: 10px; }
#masTrabajos { width: 100%; z-index: 60; margin-left:auto; margin-right:auto; max-width: 1400px; text-align:center; margin-bottom: 80px; }
#masTrabajos h3 { color: #555; font-size: 22px; line-height: 110%; margin-top: 10px; margin-bottom: 10px; font-weight: 400; }
#masTrabajos h5 { color: #555; font-size: 16px; line-height: 150%; margin-top: 15px; margin-bottom: 15px; font-weight: 400; font-style: normal; }
#masTrabajos p { color: #555; font-size: 16px; line-height: 150%; margin-top: 15px; margin-bottom: 15px; font-weight: 400; font-style: normal; }
#masTrabajos img {margin:5px; width:23%; height:auto; }
#lateral { width: 100%; font-size: 16px; text-align:center; margin-bottom:60px; }
#lateral h4 { color: #555; font-size: 16px; text-align: center; line-height: 150%; font-weight: normal; }
#lateral ul { color: #769D00; font-size: 16px; text-align: center; line-height: 150%; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; }
#lateral li { margin: 0px; padding: 0px; color: #769D00; font-size: 16px; text-align: center; white-space: normal; font-weight: normal; }
#lateral a:link, #lateral a:visited, #lateral a:active { color: #555555; text-decoration: none; text-align: center; }
#lateral a:hover { text-decoration: underline; color: #000000; }
#lateral a:hover img {	background-color: #fff !important; text-decoration:none; opacity:0.6; }
#piedepagina { width:100%; margin-left:auto; margin-right:auto; height: auto; color: #000; font-size: 14px; text-align: center; clear: both; background-color: #444; box-shadow: 0px 0px 5px 3px rgba(0,0,0,.3) inset; }
#piedepagina img {margin-top: 20px; vertical-align: top; }
#piedepagina ul a:link, #piedepagina ul a:visited, #piedepagina ul a:active { color: #FFF; text-decoration: none; text-align: right; margin: 4px; padding: 4px; line-height: 160%;}
#piedepagina ul a:hover { text-decoration: underline; color: #F8E800; margin: 4px; padding: 4px; line-height: 160%; font-weight: bold}
.pieInterior {width: 80%; margin-left:auto; margin-right:auto;}
#formulario_contacto { color: #000; font-size: 16px; margin-top: 0px; margin-left: 15px; font-weight: normal; font-style: normal; }
#formulario_contacto a:link, #formulario_contacto a:visited, #formulario_contacto a:active { color: #002E5A; text-decoration: none; text-align: center; }
#formulario_contacto a:hover { text-decoration: underline; color: #fff; }
#formulario_contacto table { width:100%; }
#formulario_contacto td {font-size:16px; vertical-align: top; }
/*
#formulario_contacto input {background-color: #ffffff; width:100%; font-size: 16px; padding: 4px; border: 1px solid #eee !important;}
*/
#formulario_contacto textarea {color: #222; border: 1px solid #eee; background-color: #ffffff; width:100%; height:300px; font-size: 16px; font-weight: normal; font-style: normal; font-family: 'corbel', Verdana, sans-serif; }
#formulario_contacto select {background-color: #ffffff; width:60%; font-size: 16px; padding: 4px; border: 1px solid #888 !important;}
.check { font-size: 22px; background-color: red !important; width: auto !important;}
#slidescma {padding: 0px; margin: 0px; width:98%; overflow:hidden; max-height: 315px; z-index:0; }
#slidescma img {padding: 0px; float:none; margin: auto; width:100%; }
#slidescma ul {margin:0; padding:0; list-style-type:none;}
#slidescma li {margin:0; padding:0;}
#sliderhome {float:left; text-align: left; height:auto;; width:50%; max-width:500px; margin-bottom:200px;}
#textohome{float:right; text-align:right; width:100%; margin-bottom:200px;}
#textohome h1 {text-align: right!important; }
#barritaloca {position:fixed; left:0px; right:0px; bottom:0px; width:100%; min-height:50px; z-index: 99999; background: #444; color:#fafafa; display: block; } 
#barrita_buscar {visibility: hidden; position: fixed; width: 600px; margin: auto; height: 60px;}
.barrita_buscar_input {font-size:16px; width: 60%; padding:1px; border-radius:4px; background-color:#cccccc;} 
.barritaloca_texto {position: relative; width:75%; text-align:center; float: left; top: 20px; padding-left: 1%;}
.barritaloca_texto a {color: #fafafa;}
.barritaloca_boton { position: relative; width:10%; margin-left:1%; text-align:center; float: left; top: 10px;}
.barritaloca_ok { position: relative; padding:20px; text-decoration:none; background:#002E5A; color:#fff; top:15px; cursor:pointer;}
.barritaloca_ok:hover { background:#ffffff; color:#002E5A; text-decoration: none !important; cursor:pointer;}
.barritaloca_info {padding-left:5px; text-decoration:none; color:#ffffff;}

.link { cursor: pointer; font-size: 15px; position: relative; white-space: nowrap; color: #333 !important; color: #000 !important;}
.link:hover {color: #002E5A !important;}
.link::before, .link::after { position: absolute; width: 100%; height: 3px; background: currentColor; top: 100%; left: 0; pointer-events: none; }
.link::before { content: ''; } 
.link--metis::before { transform-origin: 100% 50%; transform: scale3d(0, 1, 1); transition: transform 0.4s; }
.link--metis:hover::before { transform-origin: 0% 50%; transform: scale3d(1, 1, 1); }


.button, .button:visited, .button:active, input.button, input.button:visited, input.button:active {display: inline-block; padding: 3px 15px !important; text-decoration: none !important; border: 0px; position: relative; cursor:pointer; transition: all 0.1s ease; border-bottom: 1px solid rgba(0,0,0,0.25); top: 1px; border-radius: 5px; font-size: 14px; border: 1px solid #ccc; font-size: 16px}
a:hover {text-decoration: none !important}
.green, .green:visited, .green:active {color: #fff !important; background-color:#8cc45b; border: 1px solid #8cc45b }
.green:hover {color: #8cc45b !important; background-color: #fff !important; border: 1px solid #8cc45b; text-decoration: none !important}
.blue, .blue:visited, .blue:active {color: #fff !important; background-color:#002E5A; }
.blue:hover {color: #002E5A !important; background-color: #fff !important; border: 1px solid #002E5A; text-decoration: none !important}
.orange, .orange:visited, .orange:active {color: #fff !important; background-color:#f9c319; }
.orange:hover {color: #fff !important; background-color: #8cc45b !important; border: 1px solid #8cc45b; text-decoration: none !important}
.grey, .grey:visited, .grey:active {color: #fff !important; background-color:#9C9C9A; }
.grey:hover {color: #fff !important; background-color: #666 !important; border: 1px solid #f9c319; text-decoration: none !important}
.violet, .violet:visited, .violet:active {color: #fff !important; background-color:#8a2be2; }
.violet:hover {color: #8a2be2 !important; background-color: #fff !important; border: 1px solid #8a2be2; text-decoration: none !important}
.red, .red:visited, .red:active {color: #fff !important; background-color:#EF4444; border: 1px solid #EF4444}
.red:hover {color: #EF4444 !important; background-color:#fff !important; border: 1px solid #EF4444; text-decoration: none !important}
.purple, .purple:visited, .purple:active {color: #fff !important; background-color:#E22BBD; }
.purple:hover {color: #E22BC3 !important; background-color: #fff !important; border: 1px solid #E22BBD; text-decoration: none !important}
.grande, .grande:hover, .grande:active, .grande:visited {padding: 12px !important; height: 45px !important}
.derecha {float: right}
.anchofijo {min-width: 200px !important; text-align: center;}
select { appearance: none; -webkit-appearance: none; -moz-appearance: none; background-color: white; border: 1px solid #ccc; padding: 5px; border-radius: 4px; width: 100%; box-sizing: border-box; background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 10 10"%3E%3Cpath fill="black" d="M0 0l5 5 5-5H0z"/%3E%3C/svg%3E'); background-repeat: no-repeat; background-position: right 10px center; background-size: 10px; cursor: pointer; }

.sombra { border: #ccc 0px solid; background: #FFFFFF; }
#principalTpv { width:100%; margin-left:auto; margin-right:auto; top: 80px; position:relative; max-width: 1400px; margin-bottom:120px;}
.tpvEntrada {padding: 4px; background-color: #fff; color: #333; }
#miFrame { border: 0px solid #FF6699; width: 80%; height: 900px; margin-left: 5%; }
#myBtn { display: none; position: fixed; bottom: 65px; right: 5px; z-index: 99; cursor: pointer; width: 80px; height: auto; transition: ease .4s all; opacity: .6;}
#myBtn:hover { opacity: 1; transition: ease .4s all;}
.logoCobre {width: 118px;}
.logoAenor {width: 40px;}


/* MEDIA QUERIES */
@media only screen and (max-width: 1100px) {
.botonmenu {margin: 10px; border:0px; height:30px; width:auto; float:right; cursor:pointer; z-index:200; visibility:visible; }
#menuprincipal {position:absolute; top:76px; left:-300px; padding:2%; width: 400px; max-width: 96%; height:auto; background-color: rgba(0,0,0,1) ; z-index:10; visibility:hidden; overflow:visible; transition: all 0.6s ease;}
#menuprincipal h2 { font-size:16px; height:auto; }
.menu {float:none; margin-left:5px; }
.submenu {height:0; position:relative; top:0px; left:0px; width:100%; visibility:hidden; padding: 2px; overflow:hidden;}
.submenu li { margin-bottom:10px; height: auto; margin-top: 3px; }
.submenu a {font-size:16px; }	
.botoncerrar { visibility:hidden;}
#barritaloca {height:90px; line-height:20px;}
.flotar { float: none; width: 99% !important;}
.portfolioimagen {width:95%; float:none; max-width:640px;}
.portfoliotexto {width:85%; float:none; text-align: left !important;}  
#masTrabajos img { width:150px; height:auto; }	
.columnas2 { text-align: justify !important; column-count: 2; column-gap: 40px; }
.columnas3 { text-align: justify !important; column-count: 2; column-gap: 20px; }
.columnas4 { text-align: justify !important; column-count: 2; column-gap: 10px; }
#animate img { width: 300px; height: auto; }
#animate2 img { width: 600px; height: auto; }
#animate3 img { width: 400px; height: auto; }
.video_container {width: 95%; height: auto; float: left; margin: 1%; margin-left: 2%;}
.anchoQuinto {width: 90% !important; margin-right: 1%;} 
    #contenedor2 {width: 98%}
    /* texto encima de imagen */
.cajaFoto {position:relative; width: auto; height: 90%; margin:auto; overflow: hidden; align-items: center;}
.cajaFoto img {width: auto; height: 90%; overflow: hidden; align-items: center;}
.cajaTextoDentroFoto {position:absolute; top: 50%; left: 50%;  transform: translate(-50%, -50%); background-color: rgba(0,0,0,.4); border-radius: 6px; width:90%}
/* fin texto encima de imagen */
#piedepagina {padding:20px;}
}
@media only screen and (max-width: 768px) {
.logoempresa { border:0px; height:90px; width:auto; float:left; margin-top:0; }
#menuprincipal {position:absolute; top:76px; left:-300px; padding:2%; width: 400px; max-width: 96%; height:auto; background-color: rgba(0,0,0,1) ; z-index:10; visibility:hidden; overflow:visible; transition: all 0.6s ease;	}
#menuprincipal h2 { font-size:16px; height:auto; }
.submenu li { margin-bottom:2px; height: auto; margin-top: 3px; }
.submenu a {font-size: 16px; }
#principal h1 {	font-size: 22px; }
#principal .fototexto { float: none; width:100%; max-width: 95%;  }
#lateral {float: none;}
#barritaloca {height:90px; line-height:17px;}
#sliderhome {float:none; width:98%; height:auto; margin-bottom:20px;}
#textohome {float:none; width:98%; margin-bottom:20px;}
.flotar { float: none; width: 99% !important;}
#presupuesto { top: 70px; position:absolute; }
.portfolioimagen {width:95%; float:none; max-width:640px;}
.portfoliotexto {width:85%; float:none; text-align: left !important;}  
#masTrabajos img { width:150px; height:auto; }
.columnas2 { text-align: justify !important; column-count: 1; column-gap: 40px; }
.columnas3 { text-align: justify !important; column-count: 1; column-gap: 20px; }
.columnas4 { text-align: justify !important; column-count: 1; column-gap: 10px; }
#animate img { width: 200px; height: auto; }
#animate2 img { width: 400px; height: auto; animation: rotate5 4s ease ; }
#animate3 img { width: 200px; height: auto; }
#viruta { z-index: 8; width: 80%; height: auto; }
.pagos a img {width: 90%;}
    
.caja_productos {width: 98%}   
.productos-foto {float:none; width:100%; text-align:center} 
.productos-descripcion {float: none; width:98%}
.precio {font-size: 20px}
h1, .caja_contenido h1 {font-size: 20px}
#ficha-foto {float:none; width:95%; text-align:center}
#ficha-foto img {margin-bottom: 15px; width:98%}    
#ficha-detalles {float:none; width:100%; text-align:center}    
.euro {font-size: 16px; font-weight:bold}    
#contenedor2 {width: 98%}   
.textosFoto {position:absolute; top: 50px; width:90%}    
.textoFotoH1 {font-size:40px !important; color:white !important}
.textoFotoH2 {font-size:12px !important; color:white !important}   
    
/* texto encima de imagen */
.cajaFoto {position:relative; width: auto; height: 90%; margin:auto; overflow: hidden;}
.cajaFoto img {width: auto; height: 90%; overflow: hidden}
.cajaTextoDentroFoto {position:absolute; top: 50%; left: 50%;  transform: translate(-50%, -50%); background-color: rgba(0,0,0,.6); border-radius: 6px; width:100%}
/* fin texto encima de imagen */
    
}
@media (max-width: 480px){
  .caja_productos {width: 98%}   
  .preciosIncludes {font-size: 16px !important}  
  h1, .caja_contenido h1 {font-size: 20px}   
  #ficha-foto {float:none; width:95%; text-align:center}
  #ficha-foto img {margin-bottom: 15px; width:98%}    
  #ficha-detalles {float:none; width:100%; text-align:center}   
  #contenedor2 {width: 95%}   
}