body{ background-color: #737373; height:100%; width: 100%; font-family: sans, verdana; overflow:hidden; margin-top:0; margin-bottom:0; } a{ text-decoration:none; } h1,h2,h3{ width:100%; background-color:#9a9a9a; color: #000; font-weight: bold; padding: 0.6em 0.7em 0.6em 0; text-align:center; font-size: 0.9em; display: block; margin:0; margin-top:12px; } h4,h5,h6{ color: #fff; margin:0 0 0.5em 0; } #page{ background-color: #cdcdcd; width:90%; margin: 0 auto 0 5%; height:100%; position: absolute; } #page2{ background-color: #000; width:17%; height:100%; opacity: 0.5; position: absolute; margin-left: 76%; } #sello{ float:left; width:25%; position:absolute; z-index:1; left: 81%; top: 8%; } #header{ width: 100%; height: 8.5em; } #header-menu-up{ height: 1.5em; background-color: #303030; text-align: right; padding-right:6.5%; position:relative; z-index:1000; } .lang{ font-family: verdana; font-size: 70%; color: #6d6d6d; padding-right:0.7%; padding-left:0.7%; position: relative; top: 2px; } .lang:hover{ font-family: verdana; font-size: 70%; color: #cbcbcb; padding-right:0.7%; padding-left:0.7%; position: relative; top: 2px; } #header-content{ width:100%; color: #fff; background-color: #000; } #header-content-image{ width:"100%"; height: 6.5em; } #header-content-image img{ margin-left: 10%; } #header-content-slogan{ width: 100%; } #header-content-slogan span{ margin-left: 11%; font-family: sans; font-style: italic; font-size: 1.3em; } /*CONTAIN-------------------------------------------------------------------------------*/ #contain{ width: 100%; height: 72%; } #colizq{ float:left; width: 79%; min-width:125px; height: 98%; } #colizq_content{ background-color: #e7e7e7; width: 95%; height: 87%; margin: 2% 2em 1em 2%; border: 3px solid #50442a; } #colizq_menu{ float: left; width: 20%; height: 100%; } #colizq_menu_content, #colizq_fondo_content{ width: 97.5%; height: 97%; margin: 8px 8px; background-color: #fafafa; font-weight: bold; } #colizq_menu_content{ background: url("../images/fondo_vinos.png"); background-size: cover; } #colizq_fondo_content{ background: url("../images/landing_vinos.jpg"); background-size: cover; color: #9a9a9a; overflow:auto; font-family: "Times New Roman"; font-size: 10pt; } #colizq_fondo{ float: left; width: 80%; height: 100%; } .elem-submenu-contain{ font-size:90%; line-height:35px; font-family: "Times New Roman"; } .elem-submenu-contain a{ color: #eee; display:inline-block; width: 100%; } .elem-submenu-contain a:hover{ color: #000; display:inline-block; background-color:#fff; opacity:0.5; font-weight: bold; } #bfincamoncloa, #bfincamoncloa:hover, #brota, #brota:hover, #bbarricas, #bbarricas:hover{ width: 80%; height: 20%; display:block; background-size:contain; background-repeat:no-repeat; } * #bfincamoncloa, #bfincamoncloa:hover, #brota, #brota:hover, #bbarricas, #bbarricas:hover{ width: 8em; height: 100px; } #bfincamoncloa{ background-image:url("../images/bfincamoncloa.png"); } #brota{ background-image:url("../images/brota.png"); } #bbarricas{ background-image:url("../images/bbarricas.png"); } #bfincamoncloa:hover{ background-image:url("../images/bfincamoncloa_hover.png"); } #brota:hover{ background-image:url("../images/brota_hover.png"); } #bbarricas:hover{ background-image:url("../images/bbarricas_hover.png"); } .colizq_menu_item{ margin-top: 0.1em; } #colder{ float:left; width: 21%; height: 95%; } #colder_content{ width: 90%; height: 100%; position: relative; z-index:1; text-align:center; } #colder_menu{ margin-top: 3.5em; } .colder_menu_item{ font-family: serif; font-size: 1.3em; color:#cecece; display:block; margin-top: 1.5em; text-align: center; } .colder_menu_item:hover{ font-family: serif; font-size: 1.3em; color:#b3b3b3; } #direccion{ margin-top: 40%; font-size: 1rem; } #direccion, #phone{ color: #b3b3b3; font-family: sans; text-align: center; } #folleto a{ background:url("../images/folleto.png"); } #folleto a:hover{ background:url("../images/folleto_hover.png"); } #folleto a, #folleto a:hover{ width:150px; height: 63px; background-size:contain; background-repeat: no-repeat; margin-top: 1em; margin-bottom: 10%; display:block; } #comprar, #comprar:hover{ width: 90px; height: 45px; display:block; background-size:contain; background-repeat:no-repeat; } #ficha, #ficha:hover,#premios, #premios:hover{ width: 50px; height: 90px; display:block; background-size:contain; background-repeat:no-repeat; } #ficha{ background-image:url("../images/ficha_es.png"); } /*#ficha:hover{ background-image:url("../images/ficha_hover_es.png"); }*/ #premios{ background-image:url("../images/premios.png"); } #premios:hover{ background-image:url("../images/premios_hover.png"); } #comprar{ background-image:url("../images/comprar_es.png"); } #comprar:hover{ background-image:url("../images/comprar_hover_es.png"); } #footer{ font-family: sans, verdana; line-height: 1.5; width: 100%; height: 6.5em; background-color: #969696; position: relative; top: -5.5%; border-top: 1px solid #333333; border-bottom: 1px solid #333333; z-index:100; } /*#footer img{ width: 65px; position:relative; top:-1em; left: 6.5%; border:1px solid #fff; } #footer img:hover{ border:1px solid #aaa; }*/ .right{ float: right; } #page3{ display:none; } * .iemaridaje{ height:80px; } * .iefoto{ width: 100px; height: 300px; } #footer-left{ float:left; width:55%; } #footer-left-moderation{ float:left; width:51%; } #footer-right{ float:left; width:45%; } #pagoshidden{ display:none; } .priv{ font-family: sans, verdana; color:#656565; font-weight:bold; font-size:0.6em } .priv:hover{ color: #333; } #pagoimg{ width:60px; border:2px solid #fff; } #pagoimg:hover{ width:65px; border:1px solid #aaa; } @media (min-width:320px) and (max-width:800px){ body{ width:100%; margin:0; font-family: "Times New Roman"; background-color: #333; touch-action: pan-y; overflow-y:scroll; } h1,h2,h3{ margin:0; margin-top:1em; color:#b2b2b2; background-color:#303030; font-size: 12pt; } h4{ font-size:11pt; } #page, #page2, #sello img{ display:none; } #page3{ display:block; margin:0; } #header{ height: 1.5em; margin:0; } #header-menu-up{ height: 1.5em; } #header-content{ height:4em; border-bottom: 2px solid #fff; position:relative; } #header-menu-down{ height: 4em; background-color:#000; opacity:0.7; position:relative; } #header-content-image img{ position:relative; top: 10px; height:45%; width:55%; margin-left: 5%; } #header-content-image2 { position:relative; top: -50%; width: 100%; left: 10%; height: 85%; } #insignia{ display:block; position:relative; z-index:1; left:30%; text-align:center; width: 95px; height:95px; position: relative; top: -6em; background-image:url("../images/insignia.png"); background-size:contain; margin:auto; } #header-content-slogan{ height: 1.5em; width: 100%; background-color: #666666; color:#aaa; font-size: 0.5em; text-align: center; } #header-content-slogan span{ margin:0; } .menu_item_up{ color:#fff; padding: 0.3em 0em 0.3em 0em; border-radius:15px; border:3px solid #333; float:left; margin-left: 5%; width:55%; min-width: 6em; text-align:center; } .third{ float:left; width:33%; } #content-main{ background: url("../images/fondo_vinos.png"); background-size: cover; width:100%; height:100%; margin-top:6px; } #col1{ float:left; width: 65%; } #col2{ float:left; width: 35%; background-color:#000; opacity:0.5; } #bfincamoncloa, #bfincamoncloa:hover, #brota, #brota:hover, #bbarricas, #bbarricas:hover{ width: 180px; height: 72px; display:block; margin-bottom:1em; background-size:contain; background-repeat:no-repeat; } .col2_fill{ height: 72px; display:block; margin-bottom:1em; } .vino-col1{ width: 60%; float:left; } .vino-col2{ width: 40%; float:left; padding-top:1em; } .maridaje{ } .footer{ } .description{ padding:0.3em; color: #aaa; font-size: 10pt; font-weight: bold; } .comprar, .comprar:hover{ width: 120px; height: 50px; display:block; background-size:contain; background-repeat:no-repeat; } .comprar{ background-image:url("../images/comprar_es.png"); } .comprar:hover{ background-image:url("../images/comprar_hover_es.png"); } .foto2 img{ width: 100%; } .title{ padding: 1em 0 1em 0; background-color: #b3b3b3; } .ficha, .ficha:hover,.premios, .premios:hover{ width: 100%; height: 80px; display:block; background-size:contain; background-repeat:no-repeat; } .ficha{ background-image:url("../images/ficha_es.png"); } .ficha:hover{ /*background-image:url("../images/ficha_hover.png");*/ background-image:url("../images/ficha_es.png"); } .premios{ background-image:url("../images/premios.png"); } .premios:hover{ background-image:url("../images/premios_hover.png"); } }