@media screen
{
    /*----------------------------------------------------------
            The base color for this template is #5c87b2. If you'd like
            to use a different color start by replacing all instances of
            #5c87b2 with your new color.
            ----------------------------------------------------------*/
    body
    {
        font-size: .85em;
        font-family: "Trebuchet MS" , Verdana, Helvetica, Sans-Serif;
        margin: 0;
        padding: 0;
        color: #222;
        background-image: url('/Images/main/fondo.jpg');
        background-position: top;
        background-repeat: repeat-x;
        background-color: #FFF;
    }

    .box-link-menu
    {
        position: relative;
        top: 0px;
        left: 400px;
        width: 200px;
        height: 100%;
        background-color: transparent;
    }

    .box-link-menu a div
    {
        width: 100%;
        height: 100%;
        padding: 0px;
    }


    a:link
    {
        color: #034af3;
        text-decoration: underline;
    }

    a img
    {
        border: none;
    }

    a:visited
    {
        color: #505abc;
    }

    a:hover
    {
        color: #1d60ff;
        text-decoration: none;
    }

    a:active
    {
        color: #12eb87;
    }

    p, ul
    {
        margin-top: 5px;
        margin-bottom: 10px;
        line-height: 1.4em;
    }

    header, footer, nav, section
    {
        display: block;
    }

    /* HEADINGS   
            ----------------------------------------------------------*/
    h1, h2, h3, h4, h5, h6
    {
        font-size: 1.5em;
        color: #4682B4;
    }

    h1
    {
        font-size: 2em;
        padding-bottom: 0;
        margin-bottom: 0;
    }

    h2
    {
        padding: 0 0 10px 0;
        margin-bottom: 0px;
    }

    h3
    {
        font-size: 1.2em;
    }

    h4
    {
        font-size: 1.1em;
    }

    h5, h6
    {
        font-size: 1em;
    }

    /* PRIMARY LAYOUT ELEMENTS   
            ----------------------------------------------------------*/

    /* you can specify a greater or lesser percentage for the 
            page width. Or, you can specify an exact pixel width. */
    .page
    {
        width: 1024px;
        margin-left: auto;
        margin-right: auto;
        background-color: #5079AA;
    }

    header, #header
    {
        position: relative;
        margin-bottom: 0px;
        color: #000;
        padding: 0;
    }

    header div.logos
    {
        display: block;
        height: 90px;
        width: 100%;
        position: relative;
        background-image: url('/Images/main/logos.jpg');
        background-position: top;
        background-repeat: repeat-x;
        background-color: #FFF;
    }

    header h1, #header h1
    {
        font-weight: bold;
        padding: 5px 0;
        margin: 0;
        color: #fff;
        border: none;
        line-height: 2em;
        font-size: 32px !important;
        text-shadow: 1px 1px 2px #111;
    }

    #main
    {
        clear: both;
        padding: 30px 20px 35px 20px;
        background-color: #fff;
        border-left: 1px #666 solid;
        border-right: 1px #aaa solid;
        border-bottom: 1px #aaa solid;
        border-radius: 4px 0 0 0;
        -webkit-border-radius: 4px 0 0 0;
        -moz-border-radius: 4px 0 0 0;
    }

    footer, #footer
    {
        background-color: #fff;
        color: #999;
        padding: 10px 0;
        text-align: center;
        line-height: normal;
        margin: 0 0 30px 0;
        font-size: .9em;
        border-radius: 0 0 4px 4px;
        -webkit-border-radius: 0 0 4px 4px;
        -moz-border-radius: 0 0 4px 4px;
    }

    /* TAB MENU   
            ----------------------------------------------------------*/
    /*ul#menu {
                border-bottom: 1px #5C87B2 solid;
                padding: 0 0 2px;
                position: relative;
                margin: 0;
                text-align: right;
            }

            ul#menu li {
                display: inline;
                list-style: none;
            }

            ul#menu li#greeting {
                padding: 10px 20px;
                font-weight: bold;
                text-decoration: none;
                line-height: 2.8em;
                color: #fff;
            }

            ul#menu li a {
                padding: 10px 20px;
                font-weight: bold;
                text-decoration: none;
                line-height: 2.8em;
                background-color: #e8eef4;
                color: #034af3;
                border-radius: 4px 4px 0 0;
                -webkit-border-radius: 4px 4px 0 0;
                -moz-border-radius: 4px 4px 0 0;
            }

            ul#menu li a:hover {
                background-color: #fff;
                text-decoration: none;
            }

            ul#menu li a:active {
                background-color: #a6e2a6;
                text-decoration: none;
            }

            ul#menu li.selected a {
                background-color: #fff;
                color: #000;
            }*/

    /* FORM LAYOUT ELEMENTS   
            ----------------------------------------------------------*/

    fieldset
    {
        border: 1px solid #ddd;
        padding: 0 1.4em 1.4em 1.4em;
        margin: 0 0 1.5em 0;
    }

    legend
    {
        font-size: 1.2em;
        font-weight: bold;
    }

    textarea
    {
        min-height: 75px;
    }

    input[type="text"], input[type="password"]
    {
        border: 1px solid #ccc;
        padding: 2px;
        font-size: 1.2em;
        color: #444;
        width: 200px;
    }

    select
    {
        border: 1px solid #ccc;
        padding: 2px;
        font-size: 1.2em;
        color: #444;
    }

    input[type="submit"]
    {
        font-size: 1.2em;
        padding: 5px;
    }

    /* TABLE
            ----------------------------------------------------------*/

    table
    {
        border: none;
        border-collapse: collapse;
    }

    table td
    {
        padding: 5px;
        border: none;
    }

    table th
    {
        padding: 6px 5px;
        text-align: left;
        background-color: #e8eef4;
        border: solid 1px #e8eef4;
    }

    /* MISC  
            ----------------------------------------------------------*/
    .clear
    {
        clear: both;
    }

    .error
    {
        color: Red;
    }

    nav
    {
        width: 100%;
        background-color: #5079AA;
        display: block;
    }

    #menucontainer
    {
        margin-top: 40px;
    }

    div#title
    {
        display: block;
        float: left;
        text-align: left;
    }

    #logindisplay
    {
        font-size: 1.1em;
        display: block;
        text-align: right;
        margin: 10px;
        color: White;
    }

    #logindisplay a:link
    {
        color: white;
        text-decoration: underline;
    }

    #logindisplay a:visited
    {
        color: white;
        text-decoration: underline;
    }

    #logindisplay a:hover
    {
        color: white;
        text-decoration: none;
    }
    
    div.linkdescarga
    {
        padding: 5px;
        padding-left: 10px;
        padding-right: 10px;
    }
    
    div.linkdescarga:hover
    {
        background-color: rgba(200,210,230,0.5);
    }

    /* Styles for validation helpers
            -----------------------------------------------------------*/
    .field-validation-error
    {
        color: #ff0000;
    }

    .field-validation-valid
    {
        display: none;
    }

    .input-validation-error
    {
        border: 1px solid #ff0000;
        background-color: #ffeeee;
    }

    .validation-summary-errors
    {
        font-weight: bold;
        color: #ff0000;
    }

    .validation-summary-valid
    {
        display: none;
    }

    /* Styles for editor and display helpers
            ----------------------------------------------------------*/
    .display-label, .editor-label
    {
        margin: 1em 0 0 0;
    }

    .display-field, .editor-field
    {
        margin: 0.5em 0 0 0;
    }

    .text-box
    {
        width: 30em;
    }

    .text-box.multi-line
    {
        height: 6.5em;
    }

    .tri-state
    {
        width: 6em;
    }






    /* Tablas listas
            ----------------------------------------------------------*/
    table.lista
    {
        border: none;
        color: #222;
        border-collapse: collapse;
        font-size: 12px;
        width: 100%;
    }

    table.lista th
    {
        text-align: center;
        background-color: #222;
        color: White;
        border: none;
    }

    table.lista th.blanco
    {
        text-align: center;
        background-color: #FFF;
        color: White;
        border: none;
    }

    table.lista th.oscuro
    {
        text-align: center;
        background-color: #004;
        color: White;
        border: 1px #fff solid;
        border-bottom: 1px #004 solid;
    }

    table.lista td
    {
        border: 1px #444 solid; /*border-bottom: 1px #000 dashed;*/
    }

    table.lista td.numero
    {
        text-align: right;
    }

    img.tendencia
    {
        position: relative;
        top: 2px;
    }

    /* Textos Contenidos
            ----------------------------------------------------------*/
    div.contenido
    {
        text-align: justify;
    }

    span.rojo
    {
        color: Red;
        font-weight: bold;
    }

    span.verde
    {
        color: Green;
        font-weight: bold;
    }

    span.naranjo
    {
        color: Orange;
        font-weight: bold;
    }

    /* Selectores año/establecimiento
            ----------------------------------------------------------*/

    div.anio
    {
        float: left;
        padding-right: 10px;
    }

    div.destacado a
    {
        background-color: #447;
        text-decoration: none;
        color: #FFF;
    }

    div.selector
    {
        clear: both;
    }

    div.leyendaReporte
    {
        font-size: 11px;
        margin-top: 3em;
        clear: both;
    }
}

/* Tablas reportes
    ----------------------------------------------------------*/
table.reporte
{
    border: none;
    color: #222;
    border-collapse: collapse;
    font-size: 11px; /*border-right: 1px #000 solid;     border-left: 1px #000 solid;*/
    -webkit-print-color-adjust: exact;
}

table.reporte th
{
    text-align: center;
    background-color: #246;
    color: White;
    border: 1px #333 solid;
    border-collapse: collapse;
}

table.reporte th.blanco
{
    text-align: center;
    background-color: #FFF;
    color: White;
    border: none;
}

table.reporte th.oscuro
{
    text-align: center;
    background-color: #222;
    color: White;
    border: 1px #000 solid;
    border-bottom: 1px #004 solid;
}

table.reporte th.depoficial
{
    background-color: #289;
}

table.reporte td
{
    border: 1px #444 dotted;
    border-bottom: 1px #004 solid; /*border-bottom: 1px #000 dashed;*/
}

table.reporte td.primera
{
    background-color: #ADB3E1;
}

table.reporte td.total
{
    background-color: #3442B5;
    color: White;
}

table.reporte td.numero
{
    text-align: right;
}

table.reporte td.destacado
{
    font-weight: bold;
}

table.reporte td.sep_izq
{
    border-left: 2px #000 solid;
}

table.interlineado tr:nth-child(even)
{
    background-color: #CCC;
}

table.reporte tr.interlineado
{
    background-color: #CCC;
}

table.reporte tr.filacomparadoalumno td.alumno
{
    background-color: #FFF;
}

table.reporte tr.filacomparadoalumno td.establecimiento
{
    background-color: #CCF;
}

table.reporte tr.filacomparadoalumno td.dependencia
{
    background-color: #CCC;
}

@media print
{
    h1, h2, h3, h4, h5, h6
    {
        font-size: 1.5em;
        color: #4682B4;
    }

    header
    {
        display: none;
    }

    section#main
    {
        display: block;
    }

    div.anio
    {
        display: none;
    }

    div.anio.destacado
    {
        display: block;
    }

    input
    {
        display: none;
    }

    a
    {
        text-decoration: none;
    }

    .noprint
    {
        display: none;
    }
}

.alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}

.alert-success {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}

.alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1
}

.progress-bar {
    float: left;
    width: 0;
    height: 100%;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    text-align: center;
    background-color: #337ab7;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
    -webkit-transition: width .6s ease;
    -o-transition: width .6s ease;
    transition: width .6s ease;
}

.progress-bar-success {
    background-color: #5cb85c
}

.progress-bar-info {
    background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
    background-image: -o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
    background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent)
}

.progress-bar-danger {
    background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
    background-image: -o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
    background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent)
}