﻿* { box-sizing: border-box; font-family: 'Roboto Condensed', sans-serif; }
html, body { margin: 0; padding: 0; height: 100%; }

body { background: #333; /*background: #37271d; background-image: url(../img/fondo.jpg);*/ background-size: cover; background-position: center center; padding: 115px 1rem 1rem 1rem; /*160px 2rem 2rem 2rem;*/ }


header { background: #000; color: #fff; position: fixed; top: 0; left: 0; width: 100%; z-index: 11; }
header > div { display: table; width: 100%; }
header > div > div.divLogo { width: 1%; padding: 0; }
header > div > div.divLogo img{height:80px}
header > div > div.divCarta { width: 99%; padding: 0; text-align: center; text-align:right; padding-right:1rem }
header > div > div.divTitulos { min-width: 310px; }
header > div > div.divCarta a { display: inline-block; margin-right: 10px; padding: 15px 50px; color: rgba(255,255,255,.5); text-decoration: none; font-size: 2.2rem; border: solid 2px transparent; border-radius: 6px; font-weight: bold; }

header > div > div.divCarta a:hover { border-color: rgba(255,255,255,.5); color: rgba(255,255,255,.7) }
header > div > div.divCarta a.activo { color: #000; background: #fff; border-color: #fff }
header > div > div { display: table-cell; padding: 1rem 2rem 1rem 1rem; vertical-align: middle; }
header a { border: none; font-size: 0; display: block; padding: .5rem 0 .5rem 2rem; }
h1 { font-family: 'Nixie One', serif; font-size: 2.2rem; text-align: right; margin: 0; white-space: nowrap; text-overflow: ellipsis; width: 100%; overflow: hidden; /*max-width: 320px;*/ }
h2 { text-transform: uppercase; font-size: 1rem; text-align: right; margin-bottom: 0; }

.spanDescripcion{display:block; clear:both}
.spanDescripcion p { margin-bottom: 0 }

#secVinos:not(.activo){display:none}
#secVinos .secFiltros input[type="search"], #secVinos .secFiltros select, #btnMasFiltros { width: 100%; padding: .5rem; border: none; color: #fff; transition: background-color .2s; background: rgba(0,0,0,.4); font-size: 1.2rem; outline: none; border-radius: 4px; width: 100%; margin-bottom: 1rem; }
#secVinos .secFiltros input[type="search"]:hover,#secVinos .secFiltros select:hover, #btnMasFiltros:hover{background: rgba(0,0,0,.8);  }
#secVinos .secFiltros input[type="search"]:focus,#secVinos .secFiltros select:focus, #btnMasFiltros:active { background: #000; }
#secVinos .secFiltros select{cursor:pointer}
#secVinos .secFiltros a { display: block; padding: .2rem 0; color: #fff; text-decoration: none; font-size: 1.2rem; color: rgba(255,255,255,.8); border-radius: 4px; margin-bottom: .2rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
#secVinos .secFiltros a.activo { background: rgba(0,0,0,.8); color: #fff; }
#secVinos .secFiltros a:before { content: '\f10c'; font-family: FontAwesome; margin: 0 .5rem; color: rgba(255,255,255,.5); font-size: 22px; }
#secVinos .secFiltros a:hover { color: rgba(255,255,255,.9); }
#secVinos .secFiltros a.activo:before { content: '\f05d'; color: #fff; }
#secVinos #secCentralVinos { min-height: 310px; width: 100%; height: 100%; border-radius: 4px; background: #fff; position:relative }
#secVinos .secFiltros div.divChecks { height: 100%; overflow-y: auto;  }
#form1 { height: 100%; }
.preciosSinIva #secVinos #secCentralVinos:after, .preciosSinIva #secCarta .secCentralCarta:after { content: 'Precios sin IVA'; position: absolute; right: 10px; bottom: 10px; color: #555; font-size: 13px }


#secCarta:not(.activo) { display: none }
#secCarta .secFiltros input[type="search"], #secCarta .secFiltros select, #btnMasFiltros { width: 100%; padding: .5rem; border: none; color: #fff; transition: background-color .2s; background: rgba(0,0,0,.4); font-size: 1.2rem; outline: none; border-radius: 4px; width: 100%; margin-bottom: 1rem; }
#secCarta .secFiltros input[type="search"]:hover, #secCarta .secFiltros select:hover, #btnMasFiltros:hover { background: rgba(0,0,0,.8); }
#secCarta .secFiltros input[type="search"]:focus, #secCarta .secFiltros select:focus, #btnMasFiltros:active { background: #000; }
#secCarta .secFiltros select { cursor: pointer }
#secCarta .secFiltros a { display: block; padding: .5rem 0; color: #fff; text-decoration: none; font-size: 2.5rem; color: rgba(255,255,255,.8); border-radius: 4px; margin-bottom: .2rem; }
#secCarta .secFiltros a.activo { background: rgba(0,0,0,.8); color: #fff; }
#secCarta .secFiltros a:before { content: '\f10c'; font-family: FontAwesome; margin: 0 1rem; color: rgba(255,255,255,.5); font-size: 35px; }
#secCarta .secFiltros a:hover { color: rgba(255,255,255,.9); }
#secCarta .secFiltros a.activo:before { content: '\f05d'; color: #fff; }
#secCarta .secCentralCarta { min-height: 310px; width: 100%; height: 100%; border-radius: 4px; background: #fff; position: relative; padding:2rem; overflow-y:auto }
#secCarta .secCentralCarta h3 { font-family: 'Nixie One', serif; font-size: 1.8rem; background: #f5f5f5; padding: 1rem; border-radius: 4px; border-bottom: solid 2px #ddd; text-align: center; margin: -2rem -2rem 0 -2rem; }
#secCarta .secCentralCarta h4 {  margin: 0 0 1rem 0; font-family: 'Nixie One', serif; font-size: 1.6rem; }
#secCarta .secFiltros div.divChecks { height: 100%; overflow-y: auto; }



#secMenu:not(.activo) { display: none }
#secMenu .secFiltros input[type="search"], #secMenu .secFiltros select, #btnMasFiltros { width: 100%; padding: .5rem; border: none; color: #fff; transition: background-color .2s; background: rgba(0,0,0,.4); font-size: 1.2rem; outline: none; border-radius: 4px; width: 100%; margin-bottom: 1rem; }
#secMenu .secFiltros input[type="search"]:hover, #secMenu .secFiltros select:hover, #btnMasFiltros:hover { background: rgba(0,0,0,.8); }
#secMenu .secFiltros input[type="search"]:focus, #secMenu .secFiltros select:focus, #btnMasFiltros:active { background: #000; }
#secMenu .secFiltros select { cursor: pointer }
#secMenu .secFiltros a { display: block; padding: .5rem 0; color: #fff; text-decoration: none; font-size: 1.8rem; color: rgba(255,255,255,.8); border-radius: 4px; margin-bottom: .2rem; }
#secMenu .secFiltros a.activo { background: rgba(0,0,0,.8); color: #fff; }
#secMenu .secFiltros a:before { content: '\f10c'; font-family: FontAwesome; margin: 0 .5rem; color: rgba(255,255,255,.5); font-size: 22px; }
#secMenu .secFiltros a:hover { color: rgba(255,255,255,.9); }
#secMenu .secFiltros a.activo:before { content: '\f05d'; color: #fff; }
#secMenu .secCentralCarta { min-height: 310px; width: 100%; height: 100%; border-radius: 4px; background: #fff; position: relative; padding: 2rem; overflow-y: auto }
/*#secMenu .secCentralCarta h3 { margin: 0 0 1rem 0; font-family: 'Nixie One', serif; font-size: 2rem; background: #f5f5f5; padding: 1rem; border-radius: 4px; border-bottom: dashed 3px #ddd; text-align: center }*/
#secMenu .secCentralCarta h3 { font-size: 0;  }
#secMenu .secCentralCarta h3:not(:first-child) { border-bottom: dashed 3px #ddd; margin: 2rem 0; }
#secMenu .secCentralCarta h4 { margin: 0 0 1rem 0; font-family: 'Nixie One', serif; font-size: 1.6rem; }
#secMenu .secFiltros div.divChecks { height: 100%; overflow-y: auto; }


/******************PANELES********************/
.tituloFiltro { color: #fff; font-size: 1.5rem; padding: 10px; cursor: pointer; }
.tituloFiltro .fa-angle-right{transition:all .3s linear;}
.fa-angle-right.open{transform:rotate(90deg)}
.panel{display:none;}
/*.panelActivo{display:block; height:auto; opacity:1}*/
.masFiltros.sinTitulos .tituloFiltro{display:none}
.masFiltros.sinTitulos .panel{display:block;}
/******************FIN PANELES********************/

.slick-dotted.slick-slider { margin-bottom: 0 !important; height: 100%; }
.slick-next:before, .slick-prev:before { color: #000 !important; }
.slick-prev { left: 25px !important; z-index: 10; }
.slick-next { right: 25px !important; z-index: 10; }
.slick-dots { bottom: 0 !important; z-index: 10;white-space: nowrap; overflow-x: auto;position:relative!important  }
.slick-dots li { width: 10px; height: 10px; margin: 0 5px; }
.slick-list { padding: 0 0 40px 0; }
.slick-slide { border-radius: 4px; padding: 0 2rem; height: 100%; outline: none; }
.slick-list, .slick-track, .slick-slide { height: 100%; }

#divSlider{opacity:0; transition:opacity .5s ease-out;padding:1rem 1rem 2.5rem 1rem}
#divSlider.slick-initialized, .modoLista #divSlider{opacity:1}
.divTextoVino{  padding: 1rem 0; font-weight:lighter;}
.divTextoVino strong.strongNombre { font-family: 'Nixie One', serif; font-size: 2rem; }

.modoLista {padding:3.5rem 1rem 1rem 1rem;}

.modoLista #divVista{margin-top:-3.5rem}
.modoLista .divSlideInt { display: table; width: 100%; padding-bottom: 1rem; margin-bottom: 1rem; outline: none; min-height: 200px; border-bottom: dashed 1px #eee; }
.modoLista .divSlideInt>div{ display:table-cell; vertical-align:middle}
.modoLista .divImgVino{background-size:cover;position:relative; background-position:center center; background-repeat:no-repeat; width:120px}
.cartaDeCocteles .modoLista .divImgVino { width: 200px; }
.cartaDeCocteles .divImgBotella { display:none; }
.cartaDeCocteles .divPrecioExt{height:80px;}
.cartaDeCocteles .divSpanPrecio { padding: 0 20px 10px; }
.cartaDeCocteles .divTextoVino{padding-left:20px;}
.modoLista .divTextoVino { padding-right: 1rem }
.slick-initialized .divSlideInt { height: 100%;  width: 100%;font-size:0;cursor: grab; cursor: -moz-grab; cursor: -webkit-grab; }
.slick-initialized .divSlideInt:active { cursor: grabbing; cursor: -moz-grabbing; cursor: -webkit-grabbing; }
.slick-initialized .divSlideInt > div { height: 100%;  }
.slick-initialized .divTextoVino { width:75%;float:left;padding:1rem 0 2.5rem 0;opacity:0; transform:translateY(30px); transition:transform .3s .35s ease-out, opacity .5s .35s ease-out }
.slick-initialized .divTextoVino > div { display:table; height:100% }
.slick-initialized .divTextoVino > div >div{display:table-cell; vertical-align:middle;}
.slick-initialized .divTextoVino > div > div > div {overflow-y:auto;max-height:100% }
.slick-initialized .divImgVino {width: 25%;float:left;height: 100%; display: inline-block; text-align: center; background: #fff; white-space: normal;background-size: cover; background-position: center center; background-repeat: no-repeat;  }
.slick-initialized .slick-active .divTextoVino{transform:translateY(0); opacity:1}
.slick-initialized .slick-active .divImgVino{transition:transform 1.3s .3s ease-out, opacity 1.8s .3s ease-out;transform:scale(1); opacity:1; position:relative}



.divTextoVino.recomendado .strongNombre:after{background:#F0C730; font-weight:bold; content:'Recomendado'; text-transform:uppercase; font-family:'Roboto Condensed', sans-serif; border-radius:4px; display:inline-block; font-size:.8rem;color:#fff; padding:.5rem 1rem; vertical-align:top;margin-left:.5rem}
.slick-initialized .divTextoVino.recomendado > div > div > div{border-left-color:#F0C730}
.modoLista .divImgVino.recomendado:before{content:'';top:50%; margin-top:-45px;margin-left:60px; width:50px; height:75px; background:url(../img/recomendado.png); background-repeat:no-repeat; background-size:contain; position:absolute}
.modoLista .divImgVino.fondoBodega:after{content:'';bottom:0; margin-bottom:30px;margin-left:0px; width:115px; height:30px; background:url(../img/fondoBodega2.png); background-repeat:no-repeat; background-size:contain; position:absolute}

/***************ETIQUETAS DE PRECIOS******************/
.pEtiqueta{font-size:1.2rem; font-weight:600; display:inline-block; margin:.5rem 0 0 0}
.pEtiqueta:not(:last-child){margin-right:1rem}
.divPrecioExt{display:inline-block; height:150px; margin-right: 10px; margin-top: 20px;vertical-align:top}
.divPrecioInt{background-color:#f5f5f5;display:table; height:100%; border-radius:5px;}
.divPrecioInt>div{vertical-align:middle;}
.divImgBotella, .divImgCopa{display:table-cell; width:60px; border-right: 1px dashed #ddd;}
.divSpanPrecio { display:table-cell;position:relative; padding:0 20px;}
.preciosConIva .divSpanPrecio:after { content: 'IVA incluido'; position: absolute; font-size: .8rem; bottom: 10px; right:0; width:100%; text-align:center;color:#999 }

.spanImgPrecio{height:80px; width:100%; display:block;background-repeat: no-repeat; background-position: center center;}
.spanImgPrecioBotella{background-image: url(../img/wine-bottle.png); opacity:.3;}
.spanImgPrecioCopa{background-image: url(../img/copa.png); opacity:.3;}
.spanTxtPrecio{display:block; text-align:center; font-size:.7rem;}
.spanPrecio{ font-family: 'Nixie One', serif; font-size: 2rem; font-weight:bold; min-width:50px;display:inline-block;}
.spanPrecio>span{font-size:1.2rem;font-family: 'Nixie One', serif;}

.spanPrecio.tachado { color:#aaa; text-decoration:line-through;margin-right:1rem}
.spanPrecio.oferta{color:#a00; position:relative;}
.spanPrecio.oferta:before { content: 'oferta'; position: absolute; top: -13px; left: 0; width: 100%; text-align: center; font-size: 13px; font-weight: bold; font-family: roboto condensed; text-transform: uppercase; background: #a00; color: #fff; border-radius: 3px; }
/***************FIN ETIQUETAS DE PRECIOS******************/

/*.divSeparadorPrecios{height:100px; vertical-align:top; display:inline-block; width:5px; background-color:#eee; margin:0 4rem;}
.divSeparadorPrecios:before { content: ""; background-image: url(../img/botella.png); background-size: 20px auto; height: 80px; width: 40px; display: inline-block; background-repeat: no-repeat; position: relative; right: 35px; top: 8px;}
.divSeparadorPrecios:after { content: ""; background-image: url(../img/copa.png); background-size: 20px auto; height: 80px; width: 40px; display: inline-block; background-repeat: no-repeat; position: relative; right: -20px; top: -65px;}
.botellaSeparador, .copaSeparador{display:inline-block;vertical-align:bottom;position:relative;}
.botellaSeparador { margin-right:-50px;}
.copaSeparador { margin-left:-50px;}*/

#divVista a{background:rgba(255,255,255,.8);  color:#999; text-decoration:none; padding:.5rem; display:inline-block; border:solid 1px #999; border-radius:4px; font-size:.9rem}
#divVista a .fa{margin-right:.5rem}
#divVista a.activo{background:#999; color:#fff}

div.sinResultados { text-align: center; font-size: 2rem; margin-top: -18px; font-weight: lighter; position: absolute; top: 50%; width: 100%;left:0; }

.divParteMenu:not(.activo){display:none}

.divParteMenu table, .divParteMenuDia table{width:100%}
.divParteMenu table td, .divParteMenuDia table td { vertical-align: middle; padding-bottom: 1.5rem; border-bottom: solid 1px #eee; padding-top: .75rem; }
.divParteMenu strong, .divParteMenuDia strong { font-size: 1.7rem; font-family: 'Nixie One' }
.divParteMenu .nombreIngles, .divParteMenuDia .nombreIngles{ color: #666; font-size: 1.2rem; }
.divParteMenu table td:last-child:not(:first-child),
.divParteMenu table td:last-child:not(:first-child) *,
.divParteMenuDia table td:last-child:not(:first-child),
.divParteMenuDia table td:last-child:not(:first-child) * { white-space: nowrap; text-align: center; font-size: 1.8rem; font-family: 'Nixie One', serif; font-weight: bold; }
.divParteMenu p, .divParteMenuDia p{ margin: 0 0 .5rem 0 }
.divParteMenu .alergenos, .divParteMenuDia .alergenos { display: inline-block; padding: 4px 10px; background: #eee; border-radius: 10px; margin-left: 10px; }


.divParteMenu table tr:last-child td, .divParteMenuDia table tr:last-child td { padding-bottom: 0; border-bottom: none }


.divParteMenu h1, .divParteMenuDia h1 { text-align: left; padding: 1.5rem 0 .5rem 0; display: block }

.divParteMenu p, .divParteMenuDia p { font-style: italic; color: #555; margin-top: .5rem; font-size: 1.2rem; }

.spanAlergeno{font-size:18px; line-height:32px;  display:inline-block; padding-right:1rem}

.spanAlergeno img { width: 32px; vertical-align: middle }

@media only screen and (min-height:700px) { 
    /*body { padding: 184px 2rem 2rem 2rem; }
    header a { padding: 1rem 0 1rem 2rem; }*/
    #secVinos .secFiltros a { display: block; padding: .3rem 0; }
    #secCarta .secFiltros a { display: block; padding: 1.5rem 0; }
    #secMenu .secFiltros a { display: block; padding: 1.5rem 0; }
}
@media only screen and (min-height:800px) {
    #secVinos .secFiltros a { padding: .6rem 0; }
    #secCarta .secFiltros a { padding: 2rem 0; }
    #secMenu .secFiltros a {  padding: 2rem 0; }
}
@media only screen and (min-height:900px) {
    #secVinos .secFiltros a { padding: .7rem 0; }
    #secCarta .secFiltros a { padding: 1.3rem 0; }
    #secMenu .secFiltros a {  padding: 1.3rem 0; }
}

@media only screen and (max-width:1023px) {
    header > div > div.divCarta a{font-size:1.1rem; padding:15px 6px}
    .divTitulos { display: none }
    .divChecks { display: none; }
    body { padding: 145px 1rem 1rem 1rem !important; }
    #secVinos #secCentralVinos{margin-bottom:1rem}
    header a { padding: 1rem 0 1rem 1rem; }
    header a img { width: 150px; }
    h1 { font-size: 1.5rem; }
    #divVista { padding: 1rem 0 0 0; width: 100%; text-align: center; }
    #divVista a { font-size: 1.2rem; }
    .masFiltros { display: none; }
    #btnMasFiltros { margin-bottom: 1rem !important; padding: .4rem 0 !important; }
    #btnMasFiltros .fa { transition: transform .5s; margin-right: .5rem; }
    #btnMasFiltros.activo .fa { transform: rotate(90deg); }
    #btnMasFiltros:before { content: '' !important; }
     #divSlider.slick-initialized { height: 450px; }
    .slick-slide { padding: 0 1rem; }
    .divTextoVino { font-size: .9rem; }
    .divTextoVino > div > div > div { border-left: 0; padding-left: .6rem; }
    .divTextoVino strong.strongNombre { font-size: 1.4rem; }
    .pEtiqueta { font-size: .9rem; }
    .divChecks.masFiltros { padding-bottom: 1rem; }
    .slick-initialized .divTextoVino > div > div > div { padding-left: 1rem; }

    .slick-initialized .divImgVino.recomendado:before { content: ''; top: 50%; margin-top: -45px; margin-left: 0; width: 50px; height: 75px; background: url(../img/recomendado.png); background-repeat: no-repeat; background-size: contain; position: absolute; }
    .slick-initialized .divImgVino.fondoBodega:after { content: ''; bottom:0; margin-bottom: 0; margin-left: -70px; width: 130px; height: 55px; background: url(../img/fondoBodega2.png); background-repeat: no-repeat; background-size: contain; position: absolute; }
    
}

@media only screen and (min-width:1024px) {
    .spanPrecio {  font-size: 2.5rem; }
    .modoLista #divSlider{height:100%; overflow-y:scroll}
    #btnMasFiltros { display: none !important; }
    .masFiltros { display: block !important; }
    #secVinos { height: 100%; padding-left: 300px; position: relative; }
    #secVinos .secFiltros { width: 300px; height: 100%; display: inline-block; float: left; margin-left: -300px; padding-right: 2rem; padding-top: 55px; }
    #secVinos .secFiltros a:hover:before { content: '\f05d'; }

    #secCarta { height: 100%; padding-left: 300px; position: relative; }
    #secCarta .secFiltros { width: 300px; height: 100%; display: inline-block; float: left; margin-left: -300px; padding-right: 2rem; padding-top: 10px; }
    #secCarta .secFiltros a:hover:before { content: '\f05d'; }
    
    #secMenu { height: 100%; position: relative; }
    #secMenu .secFiltros {display:none!important; width: 300px; height: 100%; display: inline-block; float: left; margin-left: -300px; padding-right: 2rem; padding-top: 10px; }
    #secMenu .secFiltros a:hover:before { content: '\f05d'; }

    .divCombos { margin-top: -55px; }
    #divVista { position: absolute; padding: .5rem; right: 0; z-index: 2; }

    .slick-initialized .divImgVino.recomendado:before {margin-top: -70px; margin-left: 0; width: 60px; height: 90px; opacity: 0; transform: scale(.5); transition: opacity .3s .7s ease-out, transform .3s .7s ease-out; content: ''; top: 50%;  background: url(../img/recomendado.png); background-repeat: no-repeat; background-size: contain; position: absolute; }
    .slick-initialized .slick-active .divImgVino.recomendado:before { opacity: 1; transform: scale(1); }
    .slick-initialized .divTextoVino > div > div > div { border-left: solid 10px #999; padding-left: 2rem; }
    .slick-initialized .divImgVino.fondoBodega:after { margin-bottom:0; margin-left: -105px; width: 200px; height: 50px; opacity: 0; transform: scale(.5); transition: opacity .3s .7s ease-out, transform .3s .7s ease-out; content: ''; bottom:0;  background: url(../img/fondoBodega2.png); background-repeat: no-repeat; background-size: contain; position: absolute; }
    .slick-initialized .slick-active .divImgVino.fondoBodega:after { opacity: 1; transform: scale(1); }
        

    .divTextoVino { font-size: 1rem; }
}

@media only screen and (min-width:1200px) {
    .slick-initialized .divTextoVino { font-size: 1.2rem; }

}

@media only screen and (min-width:1400px) {
    .slick-initialized .divTextoVino { font-size: 1.2rem;padding:2rem 0; }

    .slick-initialized .divImgVino.recomendado:before { margin-top: -95px; margin-left: 0; width: 100px; height: 150px; }
    .slick-initialized .divTextoVino > div > div > div { border-left: solid 10px #999; padding-left: 2rem; }
    .slick-initialized .divImgVino.fondoBodega:after { margin-bottom:0; margin-left: -115px; width: 230px; height: 60px; }
    
}




::selection { background: #c0001f; color: #fff; }
::-webkit-scrollbar-track { background-color: transparent; }
::-webkit-scrollbar { width: 6px;height:6px }
::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,.5); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #000; }