/* =====  HOME ===== */
.notification-icon
{
    position:relative;
}
.notification-icon .badge
{
    background-color:red;
    position:absolute;
    right:-20px;
}

.banner_cuponera
{ 
    border-radius:3px;
    position:relative;
}

    .banner_cuponera p
    {
        position:absolute;
        right:10px;
        top:11px;
        font-size:1.8em;
        font-weight:700;
        font-family:BebasNeue;
    }
    .banner_cuponera a.link
    {
        position:absolute;
        bottom:10px;
        right:10px;
        background-color:red;
        font-weight:bold;
    }

.select_home > button
{
    font-family:BebasNeue;
    font-size:1.8em;
    text-transform:uppercase;
}

.boton_buscador
{
    
	font-family:BebasNeue;
	padding:5px 30px 5px 30px;
	font-size:1.8em;
}


/*===== SELECTOR ===== */
.select_selector > button
{
    font-family:BebasNeue;
    font-size:1.3em;
    text-transform:uppercase;
}

h1.selector
{
    font-family:tungstensemibold;
	font-size:2.5em;
}
#grupos
{
     padding:0px;
}
#grupos a
{
    display:block;
	text-align:left;
	text-transform:uppercase;
    padding:10px;
	border-bottom:1px solid #CCC;
}

#grupos a:nth-child(2n), #subgrupos a:nth-child(2n) {
	background-color:#FBFBFB;
}
#grupos a:last-child, #subgrupos a:last-child{
	border-bottom:none
}

#subgrupos
{
     padding:0px;
}
#subgrupos .subgrupo
{
	text-align:left;
	text-transform:uppercase;
    padding:10px;
}
#subgrupos .subgrupo .encabezado
{
     box-shadow:0 0 5px #ebebeb;
}

#subgrupos .laminas
{
    
    padding:10px;
}

#subgrupos .lamina, #laminas .lamina
{
    
    padding:0px;
    
}
#subgrupos .lamina p, #laminas .lamina p
{
    color:#808080;
    margin:0px;
    font-size:1em;
}
#subgrupos .lamina a, #laminas .lamina a
{
    color:#808080;
    text-decoration:none;
    display:block;
    padding:5px;
    background-color:white;
}

#subgrupos .lamina img, #laminas .lamina img
    {
        border-radius:5px;
        border:1px solid #ccc;
        display:block;
        height:auto;
        height:180px;

    }




/* ===== APLICACIONES =====*/
.grad{ width:100px;height:100px;border:20px solid #505050;border-radius:50px;background-color:#2167AD/*#9A0105*/;margin:0px auto;box-shadow:#F2ECE1 0 0 3px;}
            .grad i {
                color:white;
                display:block;
                margin:15px auto;
                text-align:center;
                font-size:2.3em;
            }
            .grad:hover {
                border-color:white;
            }
            .grad.dos {
                background-color:#cf1435;
                border-color:#FBAC1C;
            }
                .grad.dos:hover {
                    border-color:white;
                }
            .grad.tres {
                border-color:#FBAC1C;
            }
                .grad.tres:hover {
                    border-color:white;
                }
        .text_grad{font-family: 'Open Sans', sans-serif; font-weight:100; font-size:1.3em; color:white; text-align:center;margin-top:10px;}




/*===== LAMINAS =====*/

#laminas
{
    padding:10px;
}

.indicador-posicion
{
    font-family:Verdana;
    font-size:1.5em;
    text-align:right;
    padding-right:5px;
}
    .indicador-posicion label
    {
        font-weight:normal;
    }

.ruta_actual
{
    font-size:0.8em;
    display:block;
    vertical-align:middle;
    padding-top:5px;
}
.table_responsive
{
    width:100%;
    padding:1% 1% 1% 1%;
}
.bloque_estructura_visual {
        display:block;
        text-align:right;
        margin:0 1% 0 1%;
}

#lamina .lamina_imagen
{
    text-align:center;
    cursor:zoom-in;
}
#lamina .lamina_imagen.out
{
    cursor:zoom-out;
}
#lamina .lamina_imagen.in
{
    cursor:zoom-in;
}

#lamina .imagen
{
    padding: 5px;
    border: 1px solid #EBEBEB;
    border-radius: 5px;
    margin: 5px;
    width: 100%;
    text-align:center;
}
    #lamina .imagen.vertical
    {
        width:60%;
    }
.tabla-lamina
{
    font-size:0.7em;
    width:100%;
}

    .tabla-lamina th {
        padding: 5px;
        text-transform: uppercase;
        color: #2167AD;
        border-bottom: 2px solid #CCC;
    }

        .tabla-lamina td a
        {
            color: black;
        }

        .tabla-lamina td {
            border-bottom:1px solid #CCC;
            vertical-align:middle;
            padding:4px;
        }

    .tabla-lamina th:nth-child(2n+1), td:nth-child(2n+1)
    {
        background-color: #f8f8f8;
    }

        
.laminas-en-subgrupo {
        padding:20px;
        height:auto;
        margin-left:1%;
        margin-top:20px;   
        border:1px solid #ccc;     
        border-radius:3px;
    }

    .laminas-en-subgrupo .col-md-3
    {
        padding:0px;
    }
    .laminas-en-subgrupo .laminaEnSubgrupo
    {
        border:1px solid;
            padding:5px;
            margin:5px;
    }
    .laminas-en-subgrupo .laminaEnSubgrupo:hover
    {
        background-color:#ccc;
    }

        .laminas-en-subgrupo .laminaEnSubgrupo .codigo
        {
            font-family:BebasNeue;
            font-size:1.5em;
            text-align:right;
            color:#333333;
            background-color:white;
        }
        .laminas-en-subgrupo .laminaEnSubgrupo .imagen
        {
            background-color:white;
        }
        .laminas-en-subgrupo .laminaEnSubgrupo .imagen img
        {
            height:130px;
            text-align:center;
            margin:0px auto;
            display:block;
        }

/* ===== PROMOCIONES =====*/

#catalogo_promociones .promocion
{
    padding:10px;
}
#catalogo_promociones .promocion:hover
{
    background-color:#ccc;
}
#catalogo_promociones .visualizador-promocion
{
    
    width:100%;
    height:100%;
    margin:0px auto;
    position:fixed;
    top:0;
    left:0;
    z-index:99999;
    background: rgba(51, 51, 51, 0.74);
}

    #catalogo_promociones .visualizador-promocion img
    {
        width:100%;
    }




/* ===== CUPONES ===== */

.cupon
    {
        background-color:white; 
        border-radius:5px; 
        border:1px solid #CCC;
        padding:10px 20px 10px 20px;
        margin-bottom:5px;
    }
        .cupon .razonSocial
        {
            font-size:0.8em;
            color:#ccc;
            padding-right:10px;
        }
        .cupon .titulo
        {
            color:#0067B1;
            font-family:tungstensemibold;
            font-size:1.7em;
            text-transform:uppercase;
            padding:0px;
        }
        .cupon .imagen
        {
            padding:20px 0px 0px 0px ;
        }
        .cupon .descripcion
        {
            font-size:1em;
            padding-top:10px;
            padding-bottom:20px;
            min-height:100px;
        }
        .cupon .vigencia
        {
            font-size:0.8em;
            color:#808080;
            padding:0px;
        }
        .cupon .presentacion
        {
            font-size:0.8em;
            color:#808080;
            padding:0px;
        }
        .cupon .precio_anterior
        {
            font-size:0.8em;
            color:#808080;
            padding:0px;
            
        }
            .cupon .precio_anterior label
            {
                text-decoration:line-through;
                font-weight:normal;
                padding:0px;
            }
        .cupon .terminos
        {
            font-size:0.65em;
            color:#808080;
            
            min-height:40px;
        }
        .cupon .precio
        {
            font-size:1.45em;
            color:red;
            padding:10px 0px 0px 0px;
            text-align:center;
        }
    .cupon label
    {
        font-weight:normal !important;
    }

#gestion_cupones .windowOnTop
{
    
    width:100%;
    height:100%;
    margin:0px auto;
    position:fixed;
    top:0;
    left:0;
    z-index:99999;
    background: rgba(51, 51, 51, 0.74);
}

#lamina .windowOnTop
{
    width:100%;
    height:100%;
    margin:0px auto;
    position:fixed;
    top:0;
    left:0;
    z-index:99999;
    background: rgba(51, 51, 51, 0.74);
}



.windowOnTopBuscador
{
    
    width:100%;
    height:100%;
    margin:0px auto;
    position:fixed;
    top:0;
    left:0;
    z-index:99999;
    background: rgba(51, 51, 51, 0.74);
}

/* ===== ANIMACION ===== */

.glyphicon.slow-right-spinner {
    -webkit-animation: glyphicon-spin-r 3s infinite linear;
    animation: glyphicon-spin-r 3s infinite linear;
}

@-webkit-keyframes glyphicon-spin-r {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}

@keyframes glyphicon-spin-r {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}


/*===== ESTILOS DINAMICOS =====*/
/* DEFAULT */

    #encabezado.estilo-default{
        background-color:initial;
    }
    #encabezado.estilo-default .menu > li > a {
        color:initial;
    }
    #encabezado.estilo-default .menu > li > .dropdown > a{
        color:initial;
    }

    #cuerpo.estilo-red .filtros_laminas{
        background-color:initial;
    }

    #cuerpo.estilo-red .filtros_laminas{
        color:initial;
    }
    #cuerpo.estilo-default .indicador-posicion i{
        color:initial;
    }

    #cuerpo.estilo-default .tabla-lamina th{
        color:#A8011F;
    }

    #cuerpo.estilo-default .laminas-en-subgrupo .laminaEnSubgrupo .codigo {
        color:initial;
    }

    #cuerpo.estilo-default .laminas-en-subgrupo .laminaEnSubgrupo:hover {
        background-color:#CCC;
    }
    /*ROJO*/
    #encabezado.estilo-red{
        background-color:#740923;
    }
    #encabezado.estilo-red .menu > li > a {
        color:white;
    }
    #encabezado.estilo-red .menu > li > .dropdown > a{
        color:white;
    }
    #cuerpo.estilo-red .filtros_laminas{
        background-color:#740923;
    }

    #cuerpo.estilo-red .selector{
        color:#740923;
    }
    #cuerpo.estilo-red .indicador-posicion i{
        color:#740923;
    }
    #cuerpo.estilo-red .tabla-lamina th{
        color:#740923;
    }
    #cuerpo.estilo-red .laminas-en-subgrupo .laminaEnSubgrupo .codigo {
        color:#740923;
    }
    #cuerpo.estilo-red .laminas-en-subgrupo .laminaEnSubgrupo:hover {
        background-color:#740923;
    }

    /*GRIS*/
    #encabezado.estilo-gray{
        background-color:gray !important;
    }
    #encabezado.estilo-gray .menu > li > a {
        color:white;
    }
    #encabezado.estilo-gray .menu > li > .dropdown > a{
        color:white;
    }

    #cuerpo.estilo-gray .filtros_laminas{
        background-color:gray;
    }

    #cuerpo.estilo-gray .selector{
        color:gray;
    }
    #cuerpo.estilo-gray .indicador-posicion i{
        color:gray;
    }
    #cuerpo.estilo-gray .tabla-lamina th{
       color:gray;
    }
    #cuerpo.estilo-gray .laminas-en-subgrupo .laminaEnSubgrupo .codigo {
        color:gray;
    }
    #cuerpo.estilo-gray .laminas-en-subgrupo .laminaEnSubgrupo:hover {
        background-color:gray;
    }

    /*NEGRO*/
    #encabezado.estilo-black{
        background-color:#222222;
    }
    #encabezado.estilo-black .menu > li > a {
        color:white;
    }
    #encabezado.estilo-black .menu > li > .dropdown > a{
        color:white;
    }

    #cuerpo.estilo-black .filtros_laminas{
        background-color:#222222;
    }

    #cuerpo.estilo-black .selector{
        color:#222222;
    }
    #cuerpo.estilo-black .indicador-posicion i{
        color:#222222;
    }
    #cuerpo.estilo-black .tabla-lamina th{
        color:#222222;
    }
    #cuerpo.estilo-black .laminas-en-subgrupo .laminaEnSubgrupo .codigo {
        color:#222222;
    }
    #cuerpo.estilo-black .laminas-en-subgrupo .laminaEnSubgrupo:hover {
        background-color:#222222;
    }