/* 
CSS para STPS 2010
yosif@slemanware.com
*/
/* Cajas */
/* Yellow Box */
.rbyellow {
    background: url(imagenes/yellow_background.gif) repeat;
}

.rbtopyellow div {
    background: url(imagenes/yellow_top_left.gif) no-repeat top left;
}

.rbtopyellow {
    background: url(imagenes/yellow_top_right.gif) no-repeat top right;
}

.rbbotyellow div {
    background: url(imagenes/yellow_bottom_left.gif) no-repeat bottom left;
}

.rbbotyellow {
    background: url(imagenes/yellow_bottom_right.gif) no-repeat bottom right;
}

    /* height and width details */
    .rbtopyellow div, .rbtopyellow, .rbbotyellow div, .rbbotyellow {
        width: 100%;
        height: 10px;
        font-size: 1px;
    }

.rbcontentyellow {
    margin: 0 11px;
    text-align: justify;
}

.rbyellow {
    width: 60%;
    margin: auto;
}

    .rbyellow p, #realcontentyellow .rbyellow p {
        padding: 0;
        margin: 0 0 0 0;
    }

/* Globo de ayuda */
/*Mod JC*/
.WrappingItem {
    white-space: normal;
}

.RedItem {
    background-color: red;
}


.estilomenu {
    background-color: red;
}

    .estilomenu a {
        background-color: Black;
    }

a.buscar {
    background-image: url("Imagenes/search.png");
    background-repeat: no-repeat;
    padding-left: 16px;
    color: #336699;
}

A:link {
    text-decoration: none;
    font-weight: bold;
    color: #828282;
}

A:visited {
    text-decoration: none;
    font-weight: bold;
}

A:active {
    text-decoration: none;
    font-weight: bold;
}

A:hover {
    text-decoration: none;
    font-weight: bold;
}


.qmenu A:link {
    text-decoration: none;
    color: #333;
    font-weight: bold;
    font-size: 9px;
}

.qmenu A:visited {
    text-decoration: none;
    color: #666;
    font-weight: bold;
    font-size: 9px;
}

.qmenu A:active {
    text-decoration: none;
    color: #333;
    font-weight: bold;
    font-size: 9px;
}

.qmenu A:hover {
    text-decoration: none;
    color: #666;
    font-weight: bold;
    font-size: 9px;
}

html {
    height: 100%;
}

body {
    margin: 0px 50px 0px 50px;
    height: 100%;
    padding: 0;
    background-color: #FCFCFC;
}

* {
    margin: 0;
    padding: 0;
}

img {
    border: 0;
}

#header {
    margin: 10px 10px 10px 10px; /*0px auto -1px auto;*/
    width: 100%; /*900px;*/
    align: center;
    background-color: #FFF;
}

.avanzadahdr {
    background: #df8547;
    background-image: url(imagenes/bg_header.jpg);
    background-repeat: repeat-x;
    width: 100%; /*770px;*/
    height: 27px;
    padding-left: 130px;
}

#headercat {
    margin: 0px 0px -1px 0px;
    width: 500px;
    align: center;
    background-color: #FFF;
}

.avanzadahdr {
    background: #bd2126;
    background-repeat: repeat-x;
    width: 100%; /*500px;*/
    height: 27px;
    padding-left: 0px;
}

#centerColumn {
    margin: 0px auto -1px auto;
    width: 100%; /*900px;*/
    voice-family: "\"}\"";
    voice-family: inherit;
    background: #FFF;
    background-repeat: no-repeat;
    background-position: 550px bottom;
}

html > body #centerColumn {
    margin: 0px auto -1px auto;
    width: 100%; /*900px;*/
    height: auto !important;
    height: 100%;
    min-height: 215px;
    voice-family: "\"}\"";
    voice-family: inherit;
    background: #FFF;
    background-image: url(imagenes/bg_vmjr.jpg);
    background-repeat: no-repeat;
    background-position: 500px bottom;
}

#footer {
    margin: 0px auto -1px auto;
    width: 100%; /*900px;*/
    height: 30px;
    voice-family: "\"}\"";
    voice-family: inherit;
    background: #FFF;
    color: #666;
    text-align: center;
    font-weight: bold;
    background-image: url(imagenes/footer.jpg);
}

html > body #footer {
    margin: 0px auto -1px auto;
    width: 100%; /*900px;*/
}

/* 
Correccion IE6
 */
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {
    display: inline-table;
}

/* Oculta de IE-mac \*/
* html .clearfix {
    height: 1%;
}

.clearfix {
    display: block;
}
/* Termina Oculta de IE-mac */


/* 
Menus
 */

.menu {
    /*width:98%;*/ /*900px;*/ /*688px;*/
    /*height:52px;*/ /*33px;*/
    position: relative;
    z-index: 100;
}
/* hack to correct IE5.5 faulty box model */
* html .menu {
    width: 100%;
}
    /*{width:698px; w\idth:687px;}*/
    /* remove all the bullets, borders and padding from the default list styling */
    .menu ul {
        padding: 0;
        margin: 0;
        list-style-type: none;
    }

        .menu ul ul {
            padding: 0;
            margin: 0;
            list-style-type: none;
        }
    /* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
    .menu li {
        float: left; /*width:100px;*/
        position: relative;
    }
    /*{float:left;width:137px;position:relative;}*/
    /* style the links for the top level */
    .menu a, .menu a:visited {
        display: block;
        font-size: 11px;
        font-weight: bold;
        text-decoration: none;
        color: #FFF;
        height: 55px; /*width:100px; background-image: url("imagenes/menu.jpg");*/
        padding-top: 2px;
        padding-left: 6px;
        padding-right: 6px; /*line-height:15px;*/
        text-align: center;
    }
    /* a hack so that IE5.5 faulty box model is corrected */
    /** html .menu a, * html .menu a:visited {width:100px; }*/ /*{width:122px; w\idth:122px;}*/

    /* style the second level background */
    .menu ul ul a.drop, .menu ul ul a.drop:visited {
        background: #dbdbdb;
    }
        /* style the second level hover */
        .menu ul ul a.drop:hover {
            background: #5e5e5e;
        }

    .menu ul ul :hover > a.drop {
        background: #5e5e5e;
    }
    /* style the third level background */
    .menu ul ul ul a, .menu ul ul ul a:visited {
        background: #e1e1e1;
    }
        /* style the third level hover */
        .menu ul ul ul a:hover {
            background: #b2ab9b;
        }


    /* hide the sub levels and give them a positon absolute so that they take up no room */
    .menu ul ul {
        visibility: hidden;
        position: absolute;
        height: 0;
        top: 33px;
        left: 0;
        width: 105px;
        border-top: 1px solid #000;
    }
    /* another hack for IE5.5 */
    * html .menu ul ul {
        top: 33px;
        t\op: 33px;
    }

        /* position the third level flyout menu */
        .menu ul ul ul {
            left: 105px;
            top: -1px;
            width: 105px;
        }

            /* position the third level flyout menu for a left flyout */
            .menu ul ul ul.left {
                left: -105px;
            }

    /* style the table so that it takes no ppart in the layout - required for IE to work */
    .menu table {
        position: absolute;
        top: 0;
        left: 0;
        border-collapse: collapse;
    }

    /* style the second level links */
    .menu ul ul a, .menu ul ul a:visited {
        background: #9cadaa;
        color: #FFF;
        height: auto;
        line-height: 1em;
        padding: 5px 6px;
        width: 105px;
        border-width: 0 1px 1px 1px;
        text-align: left;
    }
        /* yet another hack for IE5.5 */
        * html .menu ul ul a, * html .menu ul ul a:visited {
            width: 105px;
            w\idth: 105px;
        }

    /* style the top level hover */
    .menu a:hover, .menu ul a:hover {
        color: #333;
        background-image: url("imagenes/menu_over.jpg");
    }

    .menu :hover > a, .menu ul :hover > a {
        color: #333;
        background-image: url("imagenes/menu_over.jpg");
    }

    /* style the second level hover */
    .menu a:hover, .menu ul ul a:hover {
        color: #333;
        background-image: url("imagenes/menu_over.jpg");
    }

    .menu :hover > a, .menu ul ul :hover > a {
        color: #333;
        background-image: url("imagenes/menu_over.jpg");
    }

    /* make the second level visible when hover on first level list OR link */
    .menu ul li:hover ul,
    .menu ul a:hover ul {
        visibility: visible;
    }
    /* keep the third level hidden when you hover on first level list OR link */
    .menu ul :hover ul ul {
        visibility: hidden;
    }
    /* make the third level visible when you hover over second level list OR link */
    .menu ul :hover ul :hover ul {
        visibility: visible;
    }
/**/

.menuDg {
    width: 100%; /*688px;*/
    height: 52px; /*33px;*/
    position: relative;
    z-index: 100;
}
/* hack to correct IE5.5 faulty box model */
* html .menuDg {
    width: 100%;
}
    /*{width:698px; w\idth:687px;}*/
    /* remove all the bullets, borders and padding from the default list styling */
    .menuDg ul {
        padding: 0;
        margin: 0;
        list-style-type: none;
    }

        .menuDg ul ul {
            width: auto;
        }
    /* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
    .menuDg li {
        float: left;
        width: 114px;
        position: relative;
    }
    /* style the links for the top level */
    .menuDg a, .menuDg a:visited {
        display: block;
        font-size: 11px;
        font-weight: bold;
        text-decoration: none;
        color: #FFF;
        width: auto;
        height: 52px;
        background-image: url("imagenes/menu.jpg");
        padding-top: 2px;
        padding-left: 6px;
        padding-right: 6px;
        line-height: 15px;
        text-align: center;
    }
        /* a hack so that IE5.5 faulty box model is corrected */
        * html .menuDg a, * html .menuDg a:visited {
            width: 114px;
            w\idth: 114px;
        }

    /* style the second level background */
    .menuDg ul ul a.drop, .menuDg ul ul a.drop:visited {
        background: #dbdbdb;
    }
        /* style the second level hover */
        .menuDg ul ul a.drop:hover {
            background: #5e5e5e;
        }

    .menuDg ul ul :hover > a.drop {
        background: #5e5e5e;
    }
    /* style the third level background */
    .menuDg ul ul ul a, .menuDg ul ul ul a:visited {
        background: #e1e1e1;
    }
        /* style the third level hover */
        .menuDg ul ul ul a:hover {
            background: #b2ab9b;
        }


    /* hide the sub levels and give them a positon absolute so that they take up no room */
    .menuDg ul ul {
        visibility: hidden;
        position: absolute;
        height: 0;
        top: 33px;
        left: 0;
        width: 105px;
        border-top: 1px solid #000;
    }
    /* another hack for IE5.5 */
    * html .menuDg ul ul {
        top: 33px;
        t\op: 33px;
    }

        /* position the third level flyout menu */
        .menuDg ul ul ul {
            left: 105px;
            top: -1px;
            width: 105px;
        }

            /* position the third level flyout menu for a left flyout */
            .menuDg ul ul ul.left {
                left: -105px;
            }

    /* style the table so that it takes no ppart in the layout - required for IE to work */
    .menuDg table {
        position: absolute;
        top: 0;
        left: 0;
        border-collapse: collapse;
    }

    /* style the second level links */
    .menuDg ul ul a, .menuDg ul ul a:visited {
        background: #9cadaa;
        color: #FFF;
        height: auto;
        line-height: 1em;
        padding: 5px 6px;
        width: 105px;
        border-width: 0 1px 1px 1px;
        text-align: left;
    }
        /* yet another hack for IE5.5 */
        * html .menuDg ul ul a, * html .menuDg ul ul a:visited {
            width: 105px;
            w\idth: 105px;
        }

    /* style the top level hover */
    .menuDg a:hover, .menuDg ul a:hover {
        color: #333;
        background-image: url("imagenes/menu_over.jpg");
    }

    .menuDg :hover > a, .menuDg ul :hover > a {
        color: #333;
        background-image: url("imagenes/menu_over.jpg");
    }

    /* style the second level hover */
    .menuDg a:hover, .menuDg ul ul a:hover {
        color: #333;
        background-image: url("imagenes/menu_over.jpg");
    }

    .menuDg :hover > a, .menuDg ul ul :hover > a {
        color: #333;
        background-image: url("imagenes/menu_over.jpg");
    }

    /* make the second level visible when hover on first level list OR link */
    .menuDg ul li:hover ul,
    .menuDg ul a:hover ul {
        visibility: visible;
    }
    /* keep the third level hidden when you hover on first level list OR link */
    .menuDg ul :hover ul ul {
        visibility: hidden;
    }
    /* make the third level visible when you hover over second level list OR link */
    .menuDg ul :hover ul :hover ul {
        visibility: visible;
    }
/**/


.titulo {
    padding-left: 50px;
}

.bullet {
    background: url("imagenes/titlebullet.gif") no-repeat 35px 2px transparent;
}
/**/

.extra_a {
    padding-left: 30px;
}


/***tablas**/

/* Tabla2 */
.tabla2 #tab2 {
    padding: 0;
    margin: 0;
}

.tabla2 caption {
    padding: 0 0 5px 8px;
    width: auto;
    text-align: left;
}

.tabla2 th {
    font: bold;
    color: #FFFFFF;
    border-right: 0px solid #d9d7c1;
    border-bottom: 0px solid #d9d7c1;
    border-top: 0px solid #d9d7c1;
    border-left: 0px solid #d9d7c1;
    text-align: center;
    font-size: 11px;
    padding: 4px 4px 4px 8px;
    background: #b7b489 url(imagenes/tabla4.jpg) repeat-x;
}

.tabla2 td {
    border-right: 0px solid #d9d7c1;
    border-bottom: 0px solid #d9d7c1;
    border-left: 0px solid #d9d7c1;
    text-align: left;
    text-valign: top;
    background: #fff;
    padding: 8px 2px 2px 8px;
    color: #000;
    font-size: 12px;
}


    .tabla2 td.alt {
        text-align: center;
    }

    .tabla2 td.alt2 {
        text-align: center;
        white-space: nowrap;
    }

    .tabla2 td.alt3 {
        text-align: left;
        padding-left: 30px;
    }

    .tabla2 td.alt4 {
        text-align: right;
    }
/**/


/* Tabla3 */
.tabla3 #tab3 {
    table-layout: fixed;
    padding: 0;
    margin: 0;
}

.tabla3 caption {
    padding: 0 0 5px 0;
    width: auto;
    text-align: left;
}

.tabla3 th {
    font: bold;
    color: #FFFFFF;
    border-right: 1px solid #d9d7c1;
    border-bottom: 1px solid #d9d7c1;
    border-top: 1px solid #d9d7c1;
    border-left: 1px solid #d9d7c1;
    text-align: center;
    font-size: 11px;
    padding: 4px 4px 4px 8px;
    /*background: #b7b489 url(imagenes/tabla4.jpg) repeat-x;*/
    background: rgba(178,189,165,1);
    background: -moz-linear-gradient(top, rgba(178,189,165,1) 0%, rgba(76,143,124,1) 83%, rgba(76,143,124,1) 95%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(178,189,165,1)), color-stop(83%, rgba(76,143,124,1)), color-stop(95%, rgba(76,143,124,1)));
    background: -webkit-linear-gradient(top, rgba(178,189,165,1) 0%, rgba(76,143,124,1) 83%, rgba(76,143,124,1) 95%);
    background: -o-linear-gradient(top, rgba(178,189,165,1) 0%, rgba(76,143,124,1) 83%, rgba(76,143,124,1) 95%);
    background: -ms-linear-gradient(top, rgba(178,189,165,1) 0%, rgba(76,143,124,1) 83%, rgba(76,143,124,1) 95%);
    background: linear-gradient(to bottom, rgba(178,189,165,1) 0%, rgba(76,143,124,1) 83%, rgba(76,143,124,1) 95%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b2bda5', endColorstr='#4c8f7c', GradientType=0 );
}

.tabla3 td {
    border-right: 1px solid #d9d7c1;
    border-bottom: 1px solid #d9d7c1;
    border-left: 1px solid #d9d7c1;
    text-align: left;
    text-valign: top;
    background: #fff;
    padding: 6px 6px 6px 6px;
    color: #000;
    font-size: 11px;
}


    .tabla3 td.alt {
        text-align: center;
    }

    .tabla3 td.alt2 {
        text-align: center;
        white-space: nowrap;
    }

    .tabla3 td.alt3 {
        text-align: left;
        padding-left: 30px;
    }

    .tabla3 td.alt4 {
        text-align: right;
    }
/**/

/* Tabla4 */
.tabla4 #tab4 {
    width: auto;
    padding: 0;
    margin: 0;
}

.tabla4 caption {
    padding: 0 0 5px 0;
    width: auto;
    text-align: left;
}

.tabla4 th {
    font: bold;
    color: #FFFFFF;
    border-right: 1px solid #d9d7c1;
    border-bottom: 1px solid #d9d7c1;
    border-top: 1px solid #d9d7c1;
    border-left: 1px solid #d9d7c1;
    text-align: center;
    font-size: 8px;
    padding: 4px 4px 4px 8px;
    background: #b7b489 url(imagenes/tabla4.jpg) repeat-x;
}

.tabla4 td {
    border-right: 1px solid #d9d7c1;
    border-bottom: 1px solid #d9d7c1;
    border-left: 1px solid #d9d7c1;
    text-align: center;
    text-valign: top;
    background: #fff;
    padding: 2px 2px 2px 4px;
    color: #000;
    font-size: 8px;
}


    .tabla4 td.alt {
        text-align: left;
    }


/**/

/* Tabla5 */
.tabla5 #tab5 {
    padding: 0;
    margin: 0;
}

.tabla5 caption {
    padding: 0 0 5px 0;
    width: auto;
    text-align: left;
}

.tabla5 th {
    font: bold;
    color: #FFFFFF;
    border-right: 1px solid #d9d7c1;
    border-bottom: 1px solid #d9d7c1;
    border-top: 1px solid #d9d7c1;
    border-left: 1px solid #d9d7c1;
    text-align: center;
    font-size: 10px;
    padding: 4px 4px 4px 8px;
    background: #b7b489 url(imagenes/tabla4.jpg) repeat-x;
}

.tabla5 td {
    border-right: 1px solid #d9d7c1;
    border-bottom: 1px solid #d9d7c1;
    border-left: 1px solid #d9d7c1;
    text-align: left;
    text-valign: top;
    background: #fff;
    padding: 2px 2px 2px 4px;
    color: #000;
    font-size: 10px;
}


    .tabla5 td.alt {
        text-align: center;
    }

    .tabla5 td.alt2 {
        text-align: center;
        white-space: nowrap;
    }

    .tabla5 td.alt3 {
        text-align: left;
        padding-left: 30px;
    }

    .tabla5 td.alt4 {
        text-align: right;
    }
/**/

/* tabla6 */
.tabla6 #tab6 {
    padding: 0;
    margin: 0;
}

.tabla6 caption {
    padding: 0 0 5px 0;
    width: auto;
    text-align: left;
}

.tabla6 th {
    font: bold;
    color: #FFFFFF;
    border-right: 1px solid #d9d7c1;
    border-bottom: 1px solid #d9d7c1;
    border-top: 1px solid #d9d7c1;
    border-left: 1px solid #d9d7c1;
    text-align: center;
    font-size: 11px;
    padding: 4px 4px 4px 8px;
    background: #b7b489 url(imagenes/tabla4.jpg) repeat-x;
}

.tabla6 td {
    border-right: 1px solid #d9d7c1;
    border-bottom: 1px solid #d9d7c1;
    border-left: 1px solid #d9d7c1;
    text-align: left;
    text-valign: top;
    background: #fff;
    padding: 1px 1px 1px 1px;
    color: #000;
    font-size: 11px;
}


    .tabla6 td.alt {
        text-align: center;
    }

    .tabla6 td.alt2 {
        text-align: center;
        white-space: nowrap;
    }

    .tabla6 td.alt3 {
        text-align: left;
        padding-left: 30px;
    }

    .tabla6 td.alt4 {
        text-align: right;
    }
/**/

/* Tabla7 */
.tabla7 #tab7 {
    padding: 0;
    margin: 0;
    border: 1;
    font-size: 12px;
}

.tabla7 caption {
    font-size: 12px;
    text-align: left;
    font-family: Arial;
    word-wrap: break-word;
}

.tabla7 td {
    text-align: left;
    text-valign: top;
    color: #000;
    font-size: 12px;
    word-wrap: break-word;
}


    .tabla7 td.alt {
        text-align: left;
        color: #000;
    }

    .tabla7 td.alt2 {
        text-align: left;
        color: #000;
        word-wrap: break-word;
        overflow: hidden;
        width: 10px;
    }

    .tabla7 td.alt3 {
        text-align: left;
        padding-left: 30px;
    }

    .tabla7 td.alt4 {
        text-align: right;
    }
/**/

/**Botones incorporar medidas**/
a.buttonmed {
    background: url(imagenes/button.gif) no-repeat;
    display: block;
    color: #FFF;
    font-weight: bold;
    height: 30px;
    line-height: 14px;
    text-decoration: none;
    width: 115px;
    text-align: right;
    margin-right: 20px;
    padding-right: 3px;
    float: right;
}

a:hover.buttonmed {
    color: #000;
}


.addmed {
    background: url(imagenes/add.gif) no-repeat 10px 8px;
    text-indent: 30px;
    display: block;
}

.alertmed {
    background: url(imagenes/alert.gif) no-repeat 10px 8px;
    text-indent: 30px;
    display: block;
}

.campomedida {
    background-color: #FEF1A7;
    border: 2px dashed;
    border-left: none;
    border-right: none;
    border-top: none;
    border-color: #F90;
    width: 70px;
    height: 13px;
    color: #999;
    font-size: 9px;
    text-align: center;
}
/* Calendario */
.cal #calendario {
    padding: 0;
    margin: 0;
    background: url(imagenes/calendario.gif) no-repeat;
    width: 445px;
    height: 376px;
}

.cal caption {
    padding: 0 0 5px 0;
    width: auto;
    text-align: left;
}

.cal th {
    font: bold;
    color: #FFFFFF;
    border-right: 1px solid #d9d7c1;
    border-bottom: 1px solid #d9d7c1;
    border-top: 1px solid #d9d7c1;
    border-left: 1px solid #d9d7c1;
    text-align: center;
    font-size: 8px;
    padding: 4px 4px 4px 8px;
    background: #b7b489 url(imagenes/tabla2.jpg) repeat-x;
}

.cal td {
    border-right: 1px solid #d9d7c1;
    border-bottom: 1px solid #d9d7c1;
    border-left: 1px solid #d9d7c1;
    text-align: left;
    text-valign: top;
    padding: 2px 2px 2px 4px;
    color: #000;
    font-size: 10px;
}


    .cal td.alt {
        text-align: center;
        font-size: 14px;
        font-weight: bold;
        background: url(imagenes/calendariov.png);
    }