body
{

    font-family: 'Ubuntu', sans-serif;
    color      : #000000;

}

a
{

    text-decoration: none;
    outline        : 0;
    color          : #000000;

}

li
{

    list-style: none;

}

#cabecera
{

    height     : 130px;
    padding-top: 20px;

}

#empresaServicios
{

    height          : 70px;
    background-color: #FFFFFF;
    opacity         : 0.9;
    filter          : alpha(Opacity=90);

}

#empresa
{

    float        : left;
    margin-left  : 50px;
    margin-bottom: 20px;
    line-height  : 70px;
    font-size    : 42px;

}

#servicios
{

    float       : right;
    margin-right: 50px;
    line-height : 70px;
    font-size   : 14px;
    font-style  : italic;

}

#menu
{

    clear: left;

}

#menu ol
{

    margin-left: 10%;

}

#menu ol li
{

    float           : left;
    border-right    : 1px solid #FFFFFF;
    line-height     : 40px;
    text-align      : center;
    font-size       : 16px;
    background-color: #000000;
    color           : #FFFFFF;
    opacity         : 0.8;
    filter          : alpha(Opacity=80);

}

#menu ol a:last-child li
{

    border-right: 0;

}

#menu ol li:hover
{

    opacity: 1;
    filter : alpha(Opacity=100);

}

#inicio #carrusel .imagen
{

    margin-top: 10px;

}

#inicio #carrusel .imagen img
{

    display: block;
    margin : auto;

}

#folletoCATLOW
{

    position        : absolute;
    top             : 155px;
    right           : 1%;
    padding         : 5px;
    line-height     : 28px;
    background-image: url('./../img/titulo_fondo.jpg');

}

#categorias
{

    float       : left;
    margin-left : 1%;
    margin-top  : 5px;
    margin-right: 1%;
    width       : 17%;

}

#categorias ol li
{

    margin-bottom   : 5px;
    border          : 1px solid #000000;
    padding         : 5px;
    line-height     : 24px;
    font-size       : 14px;
    background-image: url('./../img/categorias_fondo.jpg');

}

#categorias ol > li
{

    background-color: #000000;
    background-image: none;
    color           : #FFFFFF;
    text-align      : center;

}

#categorias .logoCATLOW
{

    padding         : 0;
    height          : 34px;
    background-color: #FFFFFF;

}

#categorias ol li.seleccionada
{

    background-color: #FFA75C;
    background-image: none;
    color           : #000000;
    font-style      : italic;
    text-decoration : underline;
    font-weight     : bold;
    cursor          : default;

}

#categorias ol a:last-child li
{

    margin-bottom: 0;

}

#productos
{

    width       : 80%;
    margin-right: 1%;
    margin-top  : 5px;
    float       : right;

}

#productos #titulo
{

    margin-left     : 30%;
    margin-bottom   : 5px;
    padding         : 5px;
    width           : 40%;
    font-size       : 20px;
    font-weight     : bold;
    line-height     : 28px;
    text-align      : center;
    background-image: url('./../img/titulo_fondo.jpg');

}

#productos .producto
{

    margin-bottom   : 10px;
    border          : 1px solid #000000;
    padding         : 10px;
    border-radius   : 5px;
    background-image: url('./../img/producto_fondo.jpg');

}

#productos .producto:hover
{

    box-shadow: 0 0 5px #000000;

}

#productos .producto .resaltado
{

    font-weight: bold;

}

#productos .producto .fondoImagen
{

    position        : absolute;
    width           : 180px;
    height          : 180px;
    border          : 1px solid #000000;
    background-color: #FFFFFF;

}

#productos .producto .imagen
{

    position: absolute;
    width   : 180px;
    height  : 180px;
    border  : 1px solid #000000;

}

#productos .producto .imagen:hover
{

    box-shadow: 0 0 5px #000000;

}

#productos .producto .nombre
{

    margin-bottom : 5px;
    padding-left  : 200px;
    padding-top   : 5px;
    padding-bottom: 5px;
    line-height   : 24px;
    font-size     : 18px;

}

#productos .producto .codigo
{

    margin-bottom: 5px;
    padding      : 5px;
    padding-left : 200px;
    line-height  : 22px;
    font-size    : 16px;
    font-style   : italic;

}

#productos .producto .descripcion
{

    padding-left: 200px;
    height      : 106px;
    font-size   : 15px;
    overflow-y  : auto;

}

#productos .producto .descripcion .resaltado
{

    font-size: 16px;

}

#notificacionCatalogoVacio
{

    margin-left: 30%;
    margin-top : 10px;
    width      : 40%;
    font-size  : 30px;

}

#nombreSeccion
{

    margin-left     : 30%;
    margin-top      : 10px;
    margin-bottom   : 10px;
    padding         : 5px;
    width           : 40%;
    font-size       : 20px;
    font-weight     : bold;
    line-height     : 28px;
    text-align      : center;
    background-image: url('./../img/titulo_fondo.jpg');

}

#contacto
{

    width       : 750px;
    margin-left : auto;
    margin-right: auto;

}

#contacto .empresa
{

    font-size: 30px;

}

#contacto .empresa span
{

    background-color: #F8F2EA;

}

#contacto .servicios
{

    font-size: 22px;

}

#contacto .servicios span
{

    background-color: #F8F2EA;

}

#contacto hr
{

    border-top: 1px solid;

}

#contacto .domicilio
{

    margin-top   : 5px;
    margin-bottom: 5px;
    text-align   : center;
    font-size    : 18px;

}

#contacto .mapa
{

    width        : 400px;
    margin-left  : auto;
    margin-right : auto;
    margin-bottom: 5px;

}

#contacto .telefono
{

    margin-top: 5px;
    text-align: center;
    font-size : 18px;

}

#contacto .email
{

    margin-top: 5px;
    text-align: center;
    font-size : 18px;

}

#contacto .email a:hover
{

    text-decoration: underline;

}

#superposicion
{

    position: fixed;
    top     : 0;
    left    : 0;
    width   : 100%;
    height  : 100%;
    z-index : 5;
    display : none;

}

#dialogoModal
{

    position: fixed;
    z-index : 10;
    display : none;

}

#dialogoModal.cargando
{

    border: 1px solid;

}

#dialogoModal.cargando img
{

    float: left;

}

#dialogoModal.imagen
{

    border: 5px solid;

}

#dialogoModal.imagen img
{

    float : left;
    border: 1px solid;
    /*cursor: pointer;*/

}

#dialogoModal.confirmacion
{

    width : 400px;
    height: 400px;

}

#dialogoModal.confirmacion .cabecera
{

    height: 42px;

}

#dialogoModal.confirmacion .cabecera p
{

    float      : left;
    margin-left: 5px;
    margin-top : 5px;
    line-height: 32px;
    font-size  : 18px;

}

#dialogoModal.confirmacion .cabecera img[src="./img/signo_de_exclamacion_cierre.png"]
{

    float      : left;
    margin-left: 5px;
    margin-top : 5px;

}

#dialogoModal.confirmacion .cabecera img[title="Cerrar"]
{

    position: absolute;
    top     : 5px;
    right   : 5px;
    cursor  : pointer;

}

#dialogoModal.confirmacion .advertencia
{

    position  : absolute;
    top       : 60px;
    width     : 390px;
    height    : 200px;
    padding   : 5px;
    text-align: center;

}

#dialogoModal.confirmacion .advertencia .resaltado
{

    font-weight: bold;

}

#dialogoModal.confirmacion .irreversible
{

    position   : absolute;
    top        : 270px;
    width      : 100%;
    line-height: 24px;
    text-align : center;
    font-size  : 14px;
    font-weight: bold;
    font-style : italic;

}

#dialogoModal.confirmacion .pregunta
{

    position   : absolute;
    top        : 294px;
    width      : 100%;
    line-height: 24px;
    text-align : center;
    font-size  : 14px;
    font-weight: bold;

}

#dialogoModal.confirmacion .si, #dialogoModal.confirmacion .no
{

    position   : absolute;
    bottom     : 5px;
    width      : 25px;
    line-height: 25px;
    text-align : center;
    cursor     : pointer;

}

#dialogoModal.confirmacion .si
{

    right: 35px;

}

#dialogoModal.confirmacion .no
{

    right: 5px;

}

#dialogoModal.formulario
{

    width      : 800px;
    height     : 390px;
    padding-top: 10px;

}

#dialogoModal.formulario .cerrar
{

    position: absolute;
    top     : 5px;
    right   : 5px;
    cursor  : pointer;

}

#dialogoModal.formulario input, #dialogoModal.formulario select, #dialogoModal.formulario textarea
{

    width: 64%;

}

#dialogoModal.formulario .aceptar, #dialogoModal.formulario .cancelar
{

    position   : absolute;
    bottom     : 5px;
    width      : 125px;
    line-height: 25px;
    text-align : center;
    cursor     : pointer;

}

#dialogoModal.formulario .aceptar
{

    right: 135px;

}

#dialogoModal.formulario .cancelar
{

    right: 5px;

}

#superposicion
{

    background-color: #000000;
    opacity         : 0.9;
    filter          : alpha(Opacity=90);

}

#dialogoModal.cargando
{

    border-color: #FFFFFF;

}

#dialogoModal.imagen
{

    border-color: #FFFFFF;

}

#dialogoModal.imagen:hover
{

    border-color: #FF6600;

}

#dialogoModal.imagen img
{

    border-color: #000000;

}

#dialogoModal.confirmacion
{

    background-color: #FFFFFF;

}

#dialogoModal.confirmacion .cabecera
{

    background-color: #FFA75C;

}

#dialogoModal.confirmacion .cabecera img[src="./img/signo_de_exclamacion_cierre.png"]
{

    background-color: #FF0000;

}


#dialogoModal.confirmacion .cabecera img[title="Cerrar"]
{

    background-color: #000000;

}

#dialogoModal.confirmacion .cabecera img[title="Cerrar"]:hover
{

    background-color: #666666;

}

#dialogoModal.confirmacion .irreversible
{

    background-color: #FF0000;
    color           : #FFFFFF;

}

#dialogoModal.confirmacion .si, #dialogoModal.confirmacion .no
{

    background-color: #000000;
    color           : #FFFFFF;

}

#dialogoModal.confirmacion .si:hover, #dialogoModal.confirmacion .no:hover
{

    background-color: #666666;

}

#dialogoModal.formulario
{

    background-color: #FFFFFF;

}

#dialogoModal.formulario .cerrar
{

    background-color: #000000;

}

#dialogoModal.formulario .cerrar:hover
{

    background-color: #666666;

}

#dialogoModal.formulario .aceptar, #dialogoModal.formulario .cancelar
{

    background-color: #000000;
    color           : #FFFFFF;

}

#dialogoModal.formulario .aceptar:hover, #dialogoModal.formulario .cancelar:hover
{

    background-color: #666666;

}
