@import url('https://fonts.googleapis.com/css?family=Lato');
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: middle;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
    margin: 0;
    padding: 0;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
    margin: auto;
}

.ui-datatable-footer{
    margin-bottom: 10px;   
}

.ui-datatable-header{
    margin-top: 10px;     
}

.ui-panel{
    margin: 10px auto;
}

.ui-panel table{
    margin: auto;
}

.ui-panel table.ui-selectmanycheckbox{
    display: block;
    width: 100%;
}

.ui-selectmanycheckbox tr{
    display: inline-block;
    width: 170px;
}

.ui-selectmanycheckbox td{
    border: 0px !important; 
    text-transform: capitalize;
}

.login_grid{
    margin-top: 5px;

}
#header{
    height: 50px;
}

#header #header_left{
    float: left;
    vertical-align: top;
    text-align: center;
    width: 20%;
}

#header #header_left img{
    height: 46px;
    margin: 2px;
    float: left;
    margin-left: 10px;
}

#header #header_middle{
    float: left;
    width: 60%;
}

#header #header_middle h1{
    text-align: center;
    font-size: 1.5em; 
    padding-top: 15px;
    font-family: 'Lato';
    color: white;
}

#header #header_right{
    float: left;
    vertical-align: top;
    width: 20%;
}

#header #header_right #datos_usuario{
    padding-top: 8px;
    text-align: center;
    font-weight: normal;
    font-size: 12px;
}

#content {
    margin: 10px auto;
    width: 990px;
}

.menu-contextual{
    margin: 15px 0px 5px 0px;
    width: 100%;
}

.ui-menu{
    margin-bottom: 10px;
}

td a{
    margin: 0px 5px;
}

.ui-paginator-top{
    display:none;
}

#form_curso\:grid_form_curso tr{
    height: 25px;
    line-height: 25px;
}

#form_curso\:grid_form_curso .col_izq{
    width: 227px;
}

#panel_inscripciones td{
    text-align: center;
}

#panel_inscripciones select{
    text-align: left;
    width: 400px;
}

#panel_inscripciones .filtro {
    width: 260px;
}

#panel_inscripciones .filtro select{
    width: 250px;
}

#pago_interno .ui-panel, #nuevo_recibo .ui-panel,#nueva_nota_credito .ui-panel {
    width: 937px;
}

#panel_notificacion{
    width: 936px;
}

.panel_resolucion{
    width: auto;
    border: none;
    margin: 0px;
    padding: 0px !important;
}

.panel_resolucion div{
    padding: 0px !important;
    vertical-align: top;
}

.panel_resolucion input[type=text]{
    margin-left: 8px;
}

#panel_notificacion{
    color: red;
    border-color: red;
    border-width: 3px;
    font-weight: bolder;
}

#panel_notificacion #panel_notificacion_content{
    color: red;
}

.grid_usuarios_der{
    width: 700px;
}

.grid_usuarios_der table{
    overflow: auto;
    width: 700px;
}

.jqplot-target{
    margin-top: 25px;
}

.jqplot-table-legend,.ui-panel .jqplot-table-legend{
    width: auto;
    margin-top: -40px
}

#ayuda_estadistica .ui-panel{
    width: 850px;
}

#ayuda_estadistica .ui-outputpanel,#ayuda_estadistica .ui-fieldset {
    margin-bottom: 10px;
}

.ui-picklist .ui-picklist-list {
    width:300px !important;
}

.ui-picklist .ui-picklist-filter{
    width:300px !important;
}

.ui-picklist .ui-picklist-caption{
    width:300px !important;
}

.ui-picklist .ui-picklist-filter-container{
    width:300px !important;
}

.ui-picklist .ui-picklist-list-wrapper{
    width:300px !important;
}

.customHeader th{
    background-color: white;
}

body { font-family:Arial, Helvetica, Sans-Serif; font-size:0.8em;}

#grado h4 { margin:0px; padding:0px;}
#grado img { float:right;}
#grado ul { margin:10px 0 10px 40px; padding:0px;}
#grado td { background:#48a0c9 none repeat-x scroll center left; color:#000; padding:7px 15px; }
#grado tr.padre td,#grado tr.nm4 td  { background:#fff repeat-x scroll center left; }
#grado td.click {cursor: pointer}
#grado div.arrow { background:#fff no-repeat scroll 0px -16px; width:16px; height:16px; display:block; margin: auto}
#grado div.up { background-position:0px 0px;}
#grado th{background-color: #48a0c9;color:white;font-weight: bold;}

#pregrado h4 { margin:0px; padding:0px;}
#pregrado img { float:right;}
#pregrado ul { margin:10px 0 10px 40px; padding:0px;}
#pregrado td { background:#48a0c9 none repeat-x scroll center left; color:#000; padding:7px 15px; }
#pregrado tr.padre td,#pregrado tr.nm4 td { background:#fff repeat-x scroll center left;}
#pregrado td.click {cursor: pointer}
#pregrado div.arrow { background:#fff no-repeat scroll 0px -16px; width:16px; height:16px; display:block; margin: auto}
#pregrado div.up { background-position:0px 0px;}
#pregrado th{background-color: #48a0c9;color:white;font-weight: bold;}

.ui-datatable thead th, .ui-datatable tbody td, .ui-datatable tfoot td {
    border-style: none;
}

.B {
    text-decoration: line-through;
    color: #CCCCCC;
}

.ui-inputfield[disabled], .ui-inputfield[disabled].ui-state-focus{
    border: 0 !important;
    opacity: 1 !important;
    box-shadow: none !important;
    outline: 0 !important;
}

.boton-menu{
    border: none !important;
    background-color: transparent !important;
    width: 100%;
    text-align: left !important;
    background-image: none !important;
}

.boton-menu:hover{
    background-color: gainsboro !important;
}

.label-referencias{
    margin-left: 10px;
    font-size: 18px !important;
    font-family: 'Lato';
}

.boton-mapa{
    width: auto !important;
    font-family: 'Lato' !important;
    font-size: 18px !important;
    position: relative !important;
    top: 4px !important;
    float: right !important;
    /*color: #00b2ef !important;*/
}

.boton-mapa:hover{
    /*color: #ff00ff !important;*/
}

.boton_menu_open {
    font-size: 28px;
    position: relative;
    top: 10px;
    left: -48px;
    display: inline-block;
    color: white;
}

.boton_menu_open:hover{
    color: gray;
}

.boton_cerrar_sesion {
    font-size: 28px;
    position: relative;
    display: inline-block;
    float: right;
    top: 10px;
    color: white;
}

.boton_cerrar_sesion:hover{
    color: gray;
}

.boton_menu_close {
    font-size: 28px;
    display: inline-block;
    margin-left: 55%;
    margin-top: 6px;
    color: white;
}

.boton_menu_close:hover{
    color: gray;
}

.boton_trazabilidad_web{
    display: inline-block !important;
}

.boton_trazabilidad_cel{
    display: none !important;
}

.color-block{
    width: 25px; 
    height: 25px; 
    border: 3px solid black; 
    margin: 0 auto; 
}

.table_header_title {
    font-weight: bold;
    background: #fff;
    font-size: 18px;
    font-weight: 500;
    border-color: #f4f4f4;
    background-color: transparent;
    display: block;
/*    position: relative;
    top: 10px;*/
}

.btn-export{
    padding:8px; 
    background-color:#007ad9; 
    color:white; 
    position: relative; 
    top:7px; 
    right:5px;
    text-transform: uppercase;
}

.btn-export:hover{
    background-color: #e32a84;
    color:white;
}

.pl-0{
    padding-left: 0;
}

.pr-0{
    padding-right: 0;
}

.ui-datatable{
    padding: .571em 1em;
}

@media  screen and  (max-width: 992px) {
    .boton_menu_open {
        left: 0px;
    }
}

@media  screen and  (max-width: 568px) {
    .boton_trazabilidad_web{
        display: none!important;
    }

    .boton_trazabilidad_cel{
        display: inline-block !important;
    }
}

.banner_title {
    width: 100%; 
    text-align: center; 
    padding: 12px; 
    font-size: 24px; 
    font-family: 'Lato', sans-serif; 
}

.menu-cel{
    /*visibility: hidden;*/
    display: none !important;
}

.boton_panel_menu{
    float: right; 
    position: absolute !important; 
    top: 55px !important; 
    right: 5px !important;
}

.boto_acciones { 
    width: 20px !important;
    height: 20px !important;
    font-size: 10px !important;
}

.table_header_title {
    font-weight: bold;
    background: #fff;
    font-size: 16px;
    font-weight: 500;
    border-color: #f4f4f4;
    background-color: transparent;
}

.boton_extra {
    background-color: white !important;
    color: #007ad9 !important;
}

.boton_extra:hover {
    background-color: #005b9f !important;
    color: white !important;
}

.boton_panel_menu_cel{
    display: none !important;
}

body .ui-panelgrid .ui-panelgrid-cell {
    border: 1px solid #c8c8c8;
    background-color: transparent;
    color: #333;
    padding: .571em 1em;
}

.ui-datatable {
     padding: 0px;
     padding-left: 1px;
     padding-left: 1px;
}

@media(max-width: 767px){
    .menu-cel{
        display: inline-block !important;
    }

    .menu-desk{
        display: none;
    }

    .boton_panel_menu{
                top: 50px !important; 
        /*display: none !important;*/
    }

    .boton_panel_menu_cel{
        float: right; 
        position: absolute !important; 
        top: 50px !important; 
        right: 5px !important;
        display: inline-block !important;
    }

    .table_header_title {
/*        position: relative;
        top: 2px;*/
    }
}