/**** COLORES ****/
:root { /* Coolors Exported Palette - coolors.co/ee6352-08b2e3-efe9f4-57a773-484d6d */
    --naranja: rgba(238, 99, 82, 1);
    --azul: rgba(8, 178, 227, 1);
    --azul-oscuro: rgba(72, 77, 109, 1); /*aņadido*/
    --blanco-roto: rgba(242, 242, 242, 1); /*original rgba(239, 233, 244, 1);*/
    --verde: rgba(87, 167, 115, 1);
    --verde-oscuro: rgba(44, 84, 58, 1); /*aņadido*/
    --gris-trans: rgba(0, 0, 0, 0.2);
    --alturaTit: 265px;
    --fs-1: 12px;
    --fs-2: 13px;
    --fs-3: 14px;
    --fs-4: 15px;
    --fs-5: 16px;
    --fs-6: 17px;
}

body { margin: 0; background-color: var(--blanco-roto); font-family: Arial, sans-serif; font-size: var(--fs-2); }
pre, input, textarea { font-family: Arial, sans-serif; font-size: var(--fs-2); }
a:link, a:visited { color: #007bff; text-decoration: none; }
a:hover { color: #0056b3; text-decoration: underline; }

/* Estructura */
#container {
    display: grid;
    grid-template-areas:
        "header"
        "content"
        "nav"
        "footer";
    position: relative;
    margin: 0px auto;
    width: 750px;
}
header {
    grid-area: header;
    min-height: 85px;
    height: 85px;
    background-image: url('../cimjobs_imagenes/inicio_portal_empleo.jpg');
    text-align: right;
}
nav {
    grid-area: nav;
    min-height: 500px;
    height: auto !important;
    height: 500px;
    background-color: #FFF;
}
article {
    grid-area: content;
    min-height: 500px;
    height: auto !important;
    height: 500px;
    padding-left: 5px;
}
footer {
    grid-area: footer;
    color: #FFF;
    text-align: center;
    padding: 15px;
    background-color: var(--azul-oscuro);
}

@media (min-width: 750px) {
    #container {
        grid-template-columns: 160px 1fr;
        grid-template-areas:
            "header     header"
            "nav        content"
            "footer     footer";
    }
}

/* Clases */
.ad-header { position: relative; margin-top: 5px; margin-right: 5px; float: right; max-width: 468px; }
    .ad-header img { max-width: 100%; }
.bGris { background-color: var(--gris-trans);}
.TituloSeccion { color: white; font-weight: bold; font-size: var(--fs-3); background-color: var(--azul-oscuro); padding: 5px; }
.tablaDatos { margin-bottom: 0; }
    .tablaDatos thead tr:first-child th:first-child { border-top-left-radius: .5em; padding-left: .5em; }
    .tablaDatos thead tr:first-child th:last-child { border-top-right-radius: .5em; }
    .tablaDatos tfoot tr:last-child td { border-radius: 0 0 .5em .5em; }
    .tablaDatos tbody tr:nth-child(odd) { background-color: rgba(0,0,0,.05); }
    .tablaDatos tbody tr:nth-child(even) { background-color: #FFF; }
    .tablaDatos tbody tr:hover { background-color: rgba(0,0,0,.075); }
nav .elementoMenu { width: 100%; padding: 3px 5px; }
nav .elementoMenu a { font-weight: bold; }
nav .btnAmpliar { cursor: pointer; font-weight: bold; border: thin solid #FFFFFF; padding: 0px 1px; }
article.content { background-color: #FFF; padding: 0 1em;}
    article.content .TituloSeccion { margin: 0 -1em; padding-left: 1em; width: inherit; }
footer a:link, footer a:visited { color: #FFF;}
hr.separator {background-color: var(--verde); height: 2px; width: 100%; }

/* Clases comunes */
.Titulo3b, .Titulo4b, .Titulo5b {
    color: white;
    font-weight: bold;
}
.Titulo3b { font-size: var(--fs-3); }
.Titulo4b { font-size: var(--fs-4); }
.Titulo5b { font-size: var(--fs-5); }
.Titulo2n , .Titulo3n, .Titulo4n, .Titulo5n, .Titulo6n { font-weight: bold; }
.Titulo2n { font-size: var(--fs-2); }
.Titulo3n { font-size: var(--fs-3); }
.Titulo4n { font-size: var(--fs-4); }
.Titulo5n { font-size: var(--fs-5); }
.Titulo6n { font-size: var(--fs-6); }
.Contenido2a { color: Blue; font-size: var(--fs-2);}
.Contenido2n { font-size: var(--fs-2); }
.Contenido3n { font-size: var(--fs-3); }
.Cursiva1n, .Cursiva2n, .Cursiva3n, .Cursiva4n, .Cursiva5n { font-style: italic; }
.Cursiva1n { font-size: var(--fs-1); }
.Cursiva2n { font-size: var(--fs-2); }
.Cursiva3n { font-size: var(--fs-3); }
.Cursiva4n { font-size: var(--fs-4); }
.Cursiva5n { font-size: var(--fs-5); }
.Warning2, .Warning3, .Warning4, .Warning5, .Warning6 { color: red; font-weight: bold; }
.Warning2 { font-size: var(--fs-2);}
.Warning3 { font-size: var(--fs-3);}
.Warning4 { font-size: var(--fs-4);}
.Warning5 { font-size: var(--fs-5);}
.Warning6 { font-size: var(--fs-6);}
.lblCV { background-position: -1px 0px; margin-top: 10px; width: inherit; padding: 0 15px 15px 15px;
    border: solid 1px #CCCCCC; background-color: #FFFFFF; }
    .lblCV .clip { position: relative; top: -11px; left: -15px; }