@charset "utf-8";

@font-face {
    font-family: 'OpenSansReg';
    src: url('../fuentes/OpenSansReg/OpenSansReg.woff') format('woff'),
         url('../fuentes/OpenSansReg/OpenSansReg.otf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

body { margin: 0 0 0 0; background-color: #fff; font-family: 'OpenSansReg'!important; font-size: 13px!important; color: #333!important; overflow-y: scroll;}
.fluid { clear: both; margin-left: 0; width: 100%; float: left; display: block; } /* Elementos flotantes */
.centra { text-align:center; margin:0 auto; }

/* nav { width: 50%!important;} */
.navbar {padding-top:0;padding-bottom:0;} /* clase de bootstrap */
button {line-height:40px!important; padding-top:0!important; padding-bottom:0!important;}
hr{ opacity:0.2!important }

/* Botón general */
.hvr-fade {
    background-color: #e30613;
    color: #ffffff;
    font-size: 18px;
    text-align: center;
    padding: 20px 42px 20px 42px;
    cursor: pointer;
    border-radius: 3px;
    border: none;
    display: inline;
    line-height: 80%;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    overflow: hidden;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: color, background-color;
    transition-property: color, background-color;
    text-decoration: none;
    /* para que muestre aspecto en iOS */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    z-index: 1;
}
.hvr-fade:hover, .hvr-fade:focus, .hvr-fade:active {
    background-color: #333333;
    color: #fff;
    text-decoration: none;
}

/* Botón "Cambiar art" Agru. Prom. */
.hvr-fade-art-agruprom {
    background-color: #19488f;
    color: #ffffff;
    font-size: 15px;
    text-align: center;
    padding: 15px 23px 15px 23px;
    cursor: pointer;
    border-radius: 3px;
    border: none;
    display: inline;
    line-height: 80%;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    overflow: hidden;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: color, background-color;
    transition-property: color, background-color;
    text-decoration: none;
    /* para que muestre aspecto en iOS */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    z-index: 1;
}

    .hvr-fade-art-agruprom:hover, .hvr-fade-art-agruprom:focus, .hvr-fade-art-agruprom:active {
        background-color: #325ea0;
        color: #fff;
        text-decoration: none;
    }

/* botón general inactivo  */
.hvr-fade-inac {
    background-color: #ccc;
    color: #fff;
    font-size: 18px;
    text-align: center;
    padding: 20px 45px 20px 45px;
    /*cursor: pointer;*/
    border-radius: 7px;
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    overflow: hidden;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: color, background-color;
    transition-property: color, background-color;
    text-decoration: none;
}

/* Botón desconectar */
.hvr-fade-descon {
    background-color: #a70909;
    color: #ffffff;
    font-size: 11px;
    text-align: center;
    padding: 5px;
    cursor: pointer;
    border-radius: 3px;
    border: none;
    display: inline;
    line-height: 40px;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    overflow: hidden;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: color, background-color;
    transition-property: color, background-color;
    text-decoration: none;
    /* para que muestre aspecto en iOS */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.hvr-fade-descon:hover, .hvr-fade-descon:focus, .hvr-fade-descon:active {
    background-color: #676767;
    color: #fff;
    text-decoration: none;
}

/* Botón general */
.hvr-fade-ancla {
    background-color: #d4e4eb;
    color: #000000;
    font-size: 13px;
    text-align: center;
    padding: 5px 20px 5px 20px;
    margin-bottom: 10px;
    cursor: pointer;
    border-radius: 3px;
    border: none;
    display: inline;
    line-height: 40px;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    overflow: hidden;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: color, background-color;
    transition-property: color, background-color;
    text-decoration: underline;
    /* para que muestre aspecto en iOS */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.hvr-fade-ancla:hover, .hvr-fade-ancla:focus, .hvr-fade-ancla:active {
    color: #000000;
    text-decoration: none;
}
/* Botón VERDE '+' */
.hvr-fade-v {
    background-color: #51aa2e;
    color: #ffffff;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    padding: 6px 12px 6px 12px;
    margin-right: 5px;
    cursor: pointer;
    border-radius: 7px;
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    overflow: hidden;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: color, background-color;
    transition-property: color, background-color;
    text-decoration: none;
    /* para que muestre aspecto en iOS */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    user-select: none; /* no select text con doble click*/
}
.hvr-fade-v:hover, .hvr-fade-v:focus, .hvr-fade-v:active {
    background-color: #323946;
    color: white;
    text-decoration: none;
}

/* Botón ROJO '-' */
.hvr-fade-r {
    background-color: #dc3434;
    color: #ffffff;
    font-size: 20px;
    text-align: center;
    font-weight: bold;
    padding: 6px 14px 6px 14px;
    cursor: pointer;
    border-radius: 7px;
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    overflow: hidden;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: color, background-color;
    transition-property: color, background-color;
    text-decoration: none;
    /* para que muestre aspecto en iOS */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    user-select: none;
}
.hvr-fade-r:hover, .hvr-fade-r:focus, .hvr-fade-r:active {
    background-color: #323946;
    color: white;
    text-decoration: none;
}

/* Botón '+', '-' INAC */
.hvr-fade-masmenos-inac {
    background-color: #cccccc;
    color: #ffffff;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    padding: 6px 12px 6px 12px;
    margin-right: 5px;
    border-radius: 7px;
    display: inline-block;
    vertical-align: middle;
    text-decoration: none;
    /* para que muestre aspecto en iOS */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    user-select: none; /* no select text con doble click*/
}
.hvr-fade-masmenos-inac:hover, .hvr-fade-masmenos-inac:focus, .hvr-fade-masmenos-inac:active {
    color: white;
    text-decoration: none;
}

/* Botón carrito 'ver agru promoción' */
.hvr-fade-ver-promo {
    background-color: #51aa2e;
    color: #ffffff;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    padding: 8px 15px 8px 15px;
    margin-right: 10px;
    cursor: pointer;
    border-radius: 7px;
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    overflow: hidden;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: color, background-color;
    transition-property: color, background-color;
    text-decoration: none;
    /* para que muestre aspecto en iOS */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    user-select: none; /* no select text con doble click*/
}

    .hvr-fade-ver-promo:hover, .hvr-fade-ver-promo:focus, .hvr-fade-ver-promo:active {
        background-color: #323946;
        color: white;
        text-decoration: none;
    }

/* Botón ROJO '-' */
.hvr-fade-r-mini {
    background-color: #dc3434;
    color: #ffffff;
    font-size: 20px;
    text-align: center;
    font-weight: bold;
    padding: 8px 17px 8px 17px;
    cursor: pointer;
    border-radius: 7px;
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    overflow: hidden;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: color, background-color;
    transition-property: color, background-color;
    text-decoration: none;
    /* para que muestre aspecto en iOS */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    user-select: none;
}

.hvr-fade-r-mini:hover, .hvr-fade-r-mini:focus, .hvr-fade-r-mini:active {
    background-color: #323946;
    color: white;
    text-decoration: none;
}

.pointer { cursor:pointer; }
.ImgTextAlign{ vertical-align:middle; }
.tituloPagina { background-color:#0089bd; color:#fff; font-size:13px; font-weight:bold!important; text-transform: uppercase; padding:5px 10px 5px 10px; }
.SubtituloPagina { background-color:#999999; color:#fff; font-size:14px; font-weight:bold!important; text-transform: uppercase; padding:5px 5px 5px 5px; }
.margenSobreTituloPag {margin-top:20px;}
.margenBajoTituloPag {margin-bottom:5px;}
.margenInferiorPag {margin-bottom:50px;}
.textBox3Digit {width:80px;}
.margenBtnTabla{ margin:20px 20px 20px 20px; }
.loginFondo{ background-image: url("/img/loginfondo/img1.jpg");}
/*input { font-size:11px!important;line-height:10px!important; }*/

select {
    font-size: 11px !important;
    line-height: 30px !important;

    padding: 7px 40px 7px 12px;
    border: 1px solid #CCCCCC;
    border-radius: 5px;
    background: white;
    box-shadow: 0 1px 3px -2px #9098A9;

}
.fontMayus{ text-transform: uppercase;}
.divFlotante { position:fixed; bottom:0px; padding-bottom:20px; }
.imgVerticalText { vertical-align:text-bottom; }

/* Inicio menú general */
.AutoAjusMenu {
    padding-left: 0;
    text-align: center;
    margin-bottom: 0px;
    padding-bottom: 15px;
}

.AutoAjusMenu li {
    display: inline-block;
    width: 90%;
    text-align: center;
    margin: 0;
    padding: 5px;
}
.menuLine {
    text-decoration: none;
}
.menuFondoTexto {
    padding: 10px 15px 10px 15px;
    margin: auto;
    text-align: center;
}
.MenuImg {
    border-radius: 50%;
    background-color: #e30613;
    display: flex;
    width: 100%;
    height: 130px;
}
/* Texto menús efecto hover image (menu.aspx) */
.menu-texto {
    color: #ffffff;
    font-size: 16px;
    text-align: left;
    font-weight: bold;
}

.menu-texto:hover, .menu-texto:focus, .menu-texto:active {
    /*background-color: #325ea0;*/
    color: #fed02e; 
    opacity: 0.8;
}
/* fin menú general */

/* Autoajusta artículos en la ventana */
.AutoAjusArt {
    padding-left: 0;
    text-align: center;
    margin-bottom: 0px;
    padding-bottom: 0px;
}
.AutoAjusArt li {
	/*display: inline-block;*/
	/*display: inline-table;*/
	display: inline-block!important;
	/*padding: 20px;*/
	border: solid 1px #ccc;
	background-color: #EDEDED;
	width: 240px;
	height:500px;
	text-align: center;
	margin-right: 5px;
	margin-bottom: 10px;
	padding-bottom: 0px;
}

/* Autoajusta artículos de la condicion (FAM, CLA, FAB, etc) del artículo seleccionado a cambiar de la Agru Prom */
.AutoAjusArtAPCondi {
    padding-left: 0;
    text-align: center;
    margin-bottom: 0px;
    padding-bottom: 0px;
}

    .AutoAjusArtAPCondi li {
        /*display: inline-block;*/
        /*display: inline-table;*/
        display: inline-block !important;
        /*padding: 20px;*/
        border: solid 1px #ccc;
        background-color: #EDEDED;
        width: 240px;
        height: 300px;
        text-align: center;
        margin-right: 5px;
        margin-bottom: 10px;
        padding-bottom: 0px;
    }

/* Inicio efecto hover img lotes prom */
/* Autoajusta lotes promocionales */
.AutoAjusLotProm {
    padding-left: 0;
    text-align: center;
    margin-bottom: 0px;
    padding-bottom: 15px;
}

.tit_link {
    text-decoration: none;
}
.elemento {
    min-width: 250px;
    height: 150px;
    margin: 0;
    padding: 0;
    position: relative;
    display: flex;
}

.elemento .title {
    width: 100%;
    text-align: center;
    color: #ffffff;
    /*font-family: 'CreamCake';*/
    font-size: 20px;
    font-weight:bold;
    transition: all 0.3s ease;
    margin: 0;
    position: absolute;
    top: 38%;
    -ms-transform: translateY(-25%);
    transform: translateY(-25%);
}

.elemento .text {
    width: 80%;
    margin: 0 auto;
    text-align: center;
    margin-top: 10px;
    color: #ffffff;
    font-size: 18px;
    /*font-family: 'TulpenOne';*/
    opacity: 0;
    transition: all 0.3s ease;
    position: relative;
    top: 55%;
    -ms-transform: translateY(-40%);
    transform: translateY(-40%);
}

.elemento:hover {
    background-color: rgba(0,0,0,1);
}

.elemento:hover .info {
    height: 90%;
}

.elemento:hover .title { /* desplazamos el título */
    transition: all 0.3s ease;
    top: 20%;
}

.elemento:hover .text { /* mostramos el texto */
    opacity: 1;
    transition: all 0.5s ease;
    top: 55%;
}

.bkg_trans:hover {
    background-color: rgba(0,0,0,0.6);
    transition: all 0.3s ease;
}

.bkg_trans {
    background-color: rgba(0,0,0,0.7);
    transition: all 0.3s ease;
}

.tit_link {
    text-decoration: none;
}
/* Fin Inicio efecto hover img lotes prom */


.TituloCabecera {
    font-size: 18px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    background-color: #000000;
    margin-top:20px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.MenuGenBtn {
    padding: 10px 0px 0px 10px;
    cursor: pointer;
}

/* ini muestra mini carrito */
#AgregaPadre {
    position: absolute;
    width: 100%; /* ancho ventana lineas */
    top: 240px; /* altura ventana lineas*/
    left: 0px; /* donde empieza ventana lineas desde la izq. */
    border: 0px;
    border-top: solid 5px #639647; /* verde */
    border-bottom: solid 5px #639647;
    /* scroll carrito mini */
    height: 450px; /* alto area líneas */
    overflow-x: hidden;
    overflow-y: auto;
}

#AgregaHijo {
    position: absolute;
    width: 100%;
    height: 70%;
    /*top:20px;*/
    left: 0px;
    z-index: 9;
    border: 0px;
}

#AgregaVentana {
    display: block;
    width: 100%;
    z-index: 2;
    overflow: auto;
    background-color: #fff;
    color: #000;
    font-size: 12px;
    /*border-top:solid 5px #639647;
		border-bottom:solid 5px #639647;*/
    -webkit-box-shadow: -3px 5px 13px -2px rgba(0,0,0,0.75);
    -moz-box-shadow: -3px 5px 13px -2px rgba(0,0,0,0.75);
    box-shadow: -3px 5px 13px -2px rgba(0,0,0,0.75);
}
/* fin muestra mini carrito */

/* cajas input cantidades art. */
.CajasCant {
    height: 27px;
    width: 50px;
    outline: 0;
    border: solid;
    border-width: 1px;
    border-color: #CCCCCC;
    color: #666666;
    font-size: 13px;
    text-align: right;
    padding-right: 3px;
    margin-right: 3px;
}
.CajasCantDesac {
    background-color: #E8E8E8;
}
.ImgFiArt {
    width: 120px;
    max-height: 170px;
}

/* botón "eliminar linea" carrito */
.fa-trash-alt:before {
    content: "\f2ed";
}
table .btndelete {
    content: "\f2ed";
    color: tomato;
    cursor: pointer;
}

/* precio rebajado atípicos (tachado) */
.PrecioRebajado { 
    color: #ff0000;
    text-decoration: line-through;
    font-size: 13px;
}

.TieneAtipDes {
    color: #ff0000;
    font-size: 13px;
    font-weight: bold
}

.titulo1 {
    font-size: 24px;
    color: #333333;
    font-weight: bold;
    text-transform: uppercase;
    text-align:center;
}

/* scroll art agru. prom. (para que salgan todos los arts. en una sola lin horizontal) */
.ScrollArtsAgruProm {
    overflow: auto;
    /* white-space: nowrap; */
    white-space: nowrap;
}

/* formato barra scrollbar art. Agru Prom  */
#ArtsAgruProm::-webkit-scrollbar, #ArtsCondi::-webkit-scrollbar {
    /*width: 10px;*/
    height: 20px;
}

#ArtsAgruProm::-webkit-scrollbar-track, #ArtsCondi::-webkit-scrollbar-track { /* fondo */
    border-radius: 1px;
    background: #fff;
    -webkit-box-shadow: inset 0 0 1px rgba(255,255,255,1);
}

#ArtsAgruProm::-webkit-scrollbar-thumb, #ArtsCondi::-webkit-scrollbar-thumb { /* barra */
    border-radius: 1px;
    background: #E21416;
    -webkit-box-shadow: inset 0 0 1px rgba(255,255,255,1);
}

/* tabla final pedido (con las promociones ofertas) */
#tablaLins table, #tablaLins th, #tablaLins td {
    padding: 10px !important;
    border: 1px solid #999 !important;
}

#tablaLins th {
    font-size: 18px;
    font-weight: bold;
    color: #ffffff;
    text-transform: uppercase;
    background-color: #19488f;
}
.tdTablaLins {
    font-size: 18px;
    color: #000;
    font-weight:bold;
    vertical-align: middle;
    text-align: center;
}
.tdTablaSubLins {
    font-size: 13px;
    color:#666;
    font-weight: bold;
    vertical-align: middle;
    text-align: center;
}

/* tabla totales pedido*/
.tablaTotLinsCab {
    font-size: 14px!important;
}

.fontBlanco { color:#ffffff;}
.fontNegrita {font-weight:bold!important;}

/* ventana Dialogo detalle Lote Prom. */
.MudTableCab {background-color:#e30613; color:#ffffff!important; font-weight:bold!important;}

/* botón mostrar/ocultar menú familias */
.BtnMuesOculMenuFam{font-size:14px; font-weight:normal; color:#e30613; cursor:pointer;}

/* Buscador flotante */
.BuscadorFloat {
    position: absolute;
    right: -320px; /* cuanto asoma */
    transition: 0.3s;
    padding: 15px;
    width: 380px;
    text-decoration: none;
    font-size: 15px;
    color: white;
    border-radius: 5px 0px 0px 5px;
    top: 270px;
    background-color: #a70909;
    position: fixed;
    z-index: 100; /* flotante */
    /* sombra */
    -webkit-box-shadow: -5px -4px 3px -1px rgba(0,0,0,0.27);
    -moz-box-shadow: -5px -4px 3px -1px rgba(0,0,0,0.27);
    box-shadow: -5px -4px 3px -1px rgba(0,0,0,0.27);
}
.BuscadorFloat:hover {
    right: -40px; /* cuanto asoma todo el bloque */
}
.BuscadorBox {
    height: 25px;
    color: #000 !important;
    font-size: 14px;
    margin-bottom: 8px;
    padding-right: 10px;
    padding-left: 10px;
    border-radius: 3px;
    box-shadow: 0 0 0 2px black, 0 0 0 4px white;
}
/* botton icon buscar */
.hvr-fade-buscadorBtn {
    background-color: #000;
    font-size: 13px;
    color: #fff;
    text-align: center;
    padding: 5px;
    cursor: pointer;
    border-radius: 7px;
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    overflow: hidden;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: color, background-color;
    transition-property: color, background-color;
    text-decoration: none;
    /* para que muestre aspecto en iOS */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.hvr-fade-buscadorBtn:hover, .hvr-fade-buscadorBtn:focus, .hvr-fade-buscadorBtn:active {
    background-color: #333;
    color: #fff;
    text-decoration: none;
}
 /* Pie de página */
.pie {
    font-size: 12px;
    color: #fff;
    text-align: center;
    padding: 15px;
    margin-top: 50px;
    background-color: #666666;
}

/* Paginacion productos */
.PagAutoAjus {
    padding-left: 0;
    text-align: center;
    margin-bottom: 35px;
}

.PagAutoAjus li {
    display: inline-block;
    border-left: 0px;
    width: 45px;
    height: 40px;
    text-align: center;
    padding-left: 0px;
    margin: 0 1px 10px 5px;
}

/* botones paginación productos */
.Pag-hvr-fade {
    background-color: #e30613;
    font-size: 16px;
    color: #ffffff;
    padding: 10px 14px 9px 14px;
    cursor: pointer;
    border-radius: 3px;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    overflow: hidden;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: color, background-color;
    transition-property: color, background-color;
}
.Pag-hvr-fade:hover, .Pag-hvr-fade:focus, .Pag-hvr-fade:active {
    background-color: #333333;
    color: #ffffff;
    text-decoration: none;
}

.Pag-hvr-fade-inac {
    font-size: 16px;
    color: #ffffff;
    padding: 11px 8px 11px 8px;
    background-color: #cccccc;
    border-radius: 3px;
}







/* ##### CSS visualización MOVIL/TABLETS: resolución hasta 780px ##### */
@media only screen and (max-width: 700px) {
    /* Columnas fluidas */
    /* dos columnas cabecera páginas */
    .DosCol8020Cab_1 { width: 50%; clear: none; text-align: center; padding-bottom:20px; padding-left:0;}
    .DosCol8020Cab_2 { width: 50%; clear: none; text-align: right; }
    .DosCol8020Cab_3 { width: 100%; clear: none; text-align: right; }

    .DosCol5050_1 { width: 100%; clear: none; text-align: left; }
    .DosCol5050_2 { width: 100%; clear: none; text-align: left; }

    .DosCol3070_1 { width: 100%; clear: none; text-align: left;}
    .DosCol3070_2 { width: 100%; clear: none; text-align: left; }

    .TresCol303030_1 { text-align: left; padding: 10px 0 10px 0; }
    .TresCol303030_2 { text-align: left; padding: 10px 0 10px 0; }
    .TresCol303030_3 { text-align: left; padding: 10px 0 10px 0; }

    /* Otros */
    .LoginHeightCol1 { padding-top: 20px; }
    .LoginHeightCol2 { padding-top: 60px; }
    .btnFam{display:block;} /* btn mostrar menú */
    .gridContainer { margin-left: auto; margin-right: auto; width: 100%; clear: none; float: none;	} /* cuerpo web */
    #ColumMenu { width: 100%; clear: both; } /* columna menú */
    #ColumCuerpo { width: 100%; clear: both; padding-top: 0; padding-left:20px; } /* columna cuerpo */
    #MenuVert { display: none; right: 0; z-index: 300; } /* menú vertical */
    /*#abrir {display:none;}*/ /* Botón menú siempre oculto en versión móvil */
    /*#logoNavmenu{display:block;}
    #logoCabCuerpo{display:none;}*/

    /* Inicio menú general */
    .AutoAjusMenu li {
        display: inline-block;
        width: 100%;
        /*height:200px;*/
        text-align: center;
        margin: 0;
        padding: 10px;
    }
    .MenuImg {
        border-radius: 20px;
        background-color: #e30613;
        display: flex;
        width: 100%;
        height: 100px;
    }
    /* fin menú general */

    #CatalogoMenus {
        width: 100%;
        clear: both;
    }
    #CatalogoArt {
        width: 100%;
        clear: both;
        padding-top: 0;
    }
    /* muestra (Pc y tablet) o no (movil) columna vacía de la cesta, al no caber columna en móvil */
    .cestaColum {
        display: none;
    }

    .AutoAjusLotProm li {
        display: inline-table;
        width: 90%;
        height: 150px;
        text-align: center;
        margin: 0;
        margin-bottom: 30px;
        margin-right: 5px;
        /*padding:5px;*/
    }

    .CarritoLins { width:90%;}

    /* botón mostrar/ocultar menú familias */
    .BtnMuesOculMenuFam {display:block;}

    /* Muestra/oculta menú familias al pulsar botón "mostrar/ocultar" (MuesOculMenuFam) */
    .visible { display: block; }
    .invisible { display: none; }

    .MisOfertasBtnCab {width:200px;}

    .AgruPromTit {font-size:20px;}

}



/* ##### CSS visualización PC baja resolución: resolución a partir de 700px ##### */
@media only screen and (min-width: 700px) {
    /* Columnas fluidas */
    /* dos columnas cabecera páginas */
    .DosCol8020Cab_1 { width: calc(40% - 20px); clear: none; margin-right:20px; text-align: left; padding-left:10px;}
    .DosCol8020Cab_2 { width: 30%; clear: none; text-align: right; }
    .DosCol8020Cab_3 { width: 30%; clear: none; text-align: right; }

    .DosCol5050_1 { width: calc(50% - 20px); clear: none; margin-right:20px; text-align: left; }
    .DosCol5050_2 { width: 50%; clear: none; text-align: left; }

    .DosCol3070_1 { width: calc(30% - 20px); clear: none; margin-right:20px; text-align: left; }
    .DosCol3070_2 { width: 70%; clear: none; text-align: left; }
    
    .TresCol303030_1 { width: calc(33% - 10px); clear: none; margin-right:10px; }
    .TresCol303030_2 { width: calc(33% - 10px); clear: none; margin-right:10px; }
    .TresCol303030_3 { width: 33%; clear: none; }

    /* Otros */
    .LoginHeightCol1 { padding-top: 40px; }
    .LoginHeightCol2 { padding-top: 60px; }
    .btnFam{display:none;}
    .gridContainer { width: 100%; clear: none; float: none; }
    #ColumMenu { width: 30%; clear: none; margin-left: 0px; }
    #ColumCuerpo { width: 70%; clear: none; margin-left: 0px; padding-top: 0;  padding-left:20px; }
    #MenuVert { display: block; right: 0; z-index: 300; }
    #abrir {display:block;}
    /*#logoNavmenu{display:none;}
    #logoCabCuerpo{display:block;}*/

    /* Inicio menú general */
    .AutoAjusMenu li {
        display: inline-block;
        width: 250px;
        /*height:200px;*/
        text-align: center;
        margin: 0;
        padding: 10px;
    }
    .MenuImg {
        border-radius: 20px;
        width: 250px;
        height: 100px;
    }
    /* fin menú general */

    #CatalogoMenus {
        width: 20%;
        clear: none;
        margin-left: 0px;
    }

    #CatalogoArt {
        width: 80%;
        clear: none;
        margin-left: 0px;
        padding-top: 0;
    }

    #AgregaPadre {
        position: absolute;
        width: 100%;
        top: 100px;
        left: 0px;
        border: 0px;
        border-top: solid 5px #639647;
        border-bottom: solid 5px #639647;
    }

    #AgregaHijo {
        position: absolute;
        width: 100%;
        height: 70%;
        /*top:0px;*/
        left: 0px;
        z-index: 2;
        border: 0px;
    }

    #AgregaVentana {
        display: block;
        width: 100%;
        z-index: 1;
        overflow: auto;
        background-color: #fff;
        border: solid 1px #ccc;        
        /*border-top:solid 5px #639647;
		border-bottom:solid 5px #639647;*/
        -webkit-box-shadow: -3px 5px 13px -2px rgba(0,0,0,0.75);
        -moz-box-shadow: -3px 5px 13px -2px rgba(0,0,0,0.75);
        box-shadow: -3px 5px 13px -2px rgba(0,0,0,0.75);
    }
    .cestaColum {
        display: block;
    }
    .TotCarrio {
        background-color: #639647;
        text-align: center;
        font-size: 12px;
        color: #fff;
        font-weight: bold;
    }

    /* incio efecto hover img lotes prom */
    .AutoAjusLotProm li {
        display: inline-table;
        width: 250px;
        height: 250px;
        text-align: center;
        margin: 0;
        /*padding:10px;*/
        margin-right:5px;
        margin-bottom: 30px;
    }
    
    .elemento {
        min-width: 250px;
        height: 250px;
    }

    .elemento .title {
        top: 40%;
        -ms-transform: translateY(-40%);
        transform: translateY(-40%);
    }

    .elemento .text {
        top: 55%;
        -ms-transform: translateY(-55%);
        transform: translateY(-55%);
    }

    .elemento:hover .title { /* desplazamos el título */
        transition: all 0.3s ease;
        top: 20%;
    }

    .elemento:hover .text { /* mostramos el texto */
        opacity: 1;
        transition: all 0.5s ease;
        top: 55%;
    }
    /* fin efecto hover img lotes prom */

    .CarritoLins { width:60%;}    
    .BtnMuesOculMenuFam {display:none;}
    .MisOfertasBtnCab {width:251px;}
    .AgruPromTit {font-size:38px;}

}




/* ##### CSS visualización PC alta resolución: resolución a partir de 1500px ##### */
@media only screen and (min-width: 1500px) {
    /* Columnas fluidas */
    /* dos columnas cabecera páginas */
    .DosCol8020Cab_1 { width: calc(30% - 20px); clear: none; margin-right:20px; text-align: left; padding-left:10px;}
    .DosCol8020Cab_2 { width: 40%; clear: none; text-align: center; }
    .DosCol8020Cab_3 { width: 30%; clear: none; text-align: right; }

    .DosCol5050_1 { width: calc(50% - 20px); clear: none; margin-right:20px; text-align: left; }
    .DosCol5050_2 { width: 50%; clear: none; text-align: left; }

    .DosCol3070_1 { width: calc(30% - 20px); clear: none; margin-right:20px; text-align: left; }
    .DosCol3070_2 { width: 70%; clear: none; text-align: left; }

    .TresCol303030_1 { width: calc(33% - 10px); clear: none; text-align: right; }
    .TresCol303030_2 { width: calc(33% - 10px); clear: none; }
    .TresCol303030_3 { width: 73%; clear: none; }

    /* Otros */
    .LoginHeightCol1 { padding-top: 40px; }
    .LoginHeightCol2 { padding-top: 60px; }

    .btnFam{display:none;} 
    .gridContainer { width: 100%; clear: none; float: none; }
    #ColumMenu { width: 30%; clear: none; margin-left: 0px; }
    #ColumCuerpo { width: 70%; clear: none; margin-left: 0px; padding-top: 0; padding-left:20px; }
    #MenuVert { display: block; right: 0; z-index: 300; }
    #abrir {display: block;}
    #logoNavmenu{display:none;}
    #logoCabCuerpo{display:block;}

    /* Inicio menú general */
    .AutoAjusMenu li {
        display: inline-block;
        width: 250px;
        /*height:200px;*/
        text-align: center;
        margin: 0;
        padding: 10px;
    }
    .MenuImg {
        border-radius: 20px;
        width: 250px;
        height: 100px;
    }
    /* fin menú general */

    #CatalogoMenus {
        width: 20%;
        clear: none;
        margin-left: 0px;
    }f

    #CatalogoArt {
        width: 80%;
        clear: none;
        margin-left: 0px;
        padding-top: 0;
    }

    #AgregaPadre {
        position: absolute;
        width: 100%;
        top: 100px;
        left: 0px;
        border: 0px;
        border-top: solid 5px #639647;
        border-bottom: solid 5px #639647;
    }

    #AgregaHijo {
        position: absolute;
        width: 100%;
        height: 70%;
        /*top:0px;*/
        left: 0px;
        z-index: 2;
        border: 0px;
    }

    #AgregaVentana {
        display: block;
        width: 100%;
        z-index: 1;
        overflow: auto;
        background-color: #fff;
        border: solid 1px #ccc;
        /*border-top:solid 5px #639647;
		border-bottom:solid 5px #639647;*/
        -webkit-box-shadow: -3px 5px 13px -2px rgba(0,0,0,0.75);
        -moz-box-shadow: -3px 5px 13px -2px rgba(0,0,0,0.75);
        box-shadow: -3px 5px 13px -2px rgba(0,0,0,0.75);
    }
    .cestaColum {
        display: block;
    }

    /* incio efecto hover img lotes prom */
    .AutoAjusLotProm li {
        display: inline-table;
        width: 250px;
        height: 250px;
        text-align: center;
        margin: 0;
        /*padding:10px;*/
        margin-bottom: 30px;
        margin-right: 5px;
    }

    .elemento {
        min-width: 250px;
        height: 250px;
    }

    .elemento .title {
        top: 40%;
        -ms-transform: translateY(-40%);
        transform: translateY(-40%);
    }

    .elemento .text {
        top: 55%;
        -ms-transform: translateY(-55%);
        transform: translateY(-55%);
    }

    .elemento:hover .title { /* desplazamos el título */
        transition: all 0.3s ease;
        top: 20%;
    }

    .elemento:hover .text { /* mostramos el texto */
        opacity: 1;
        transition: all 0.5s ease;
        top: 55%;
    }
    /* fin efecto hover img lotes prom */

    .CarritoLins {
        width: 70%;
    }

    .BtnMuesOculMenuFam {
        display: none;
    }

    .MisOfertasBtnCab {
        width: 251px;
    }

    .AgruPromTit {font-size:38px;}




}
.mud-dialog {
    max-height: 100%;
    overflow-y: auto;
}