@import url('https://fonts.googleapis.com/css?family=Oxygen');
@import url('https://fonts.googleapis.com/css?family=Roboto');
@import url('https://fonts.googleapis.com/css?family=Raleway');
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro');


body,
html {
    font-family: Oxygen, Roboto, Calibri, Arial;
    height: 100%;
    margin: 0;
    overflow: hidden;
    font-weight: 100;
}
.drop-box {
    background: #F8F8F8;
    border: 5px dashed #DDD;
    width: 200px;
    height: 65px;
    text-align: center;
    padding-top: 25px;
    margin: 10px;
}
.dragover {
    border: 5px dashed blue;
}


#sidebar {
    overflow: auto !important;
}

.error_falta_captura {
    color: #D8000C;
    /*background-color: #FFBABA;*/
    background-color: #fdc992;
    /*font-size: 10px;
    padding: 5px;*/
    text-align: center;
    /*border-radius: 5px;*/

    font-size: 9px;
    
    border-radius: 13px;
    width: 18px !important;
    float: left;
    height: 18px;
    margin-top: -3px;
    /* margin-left: 0px; */
    line-height: 2;
}

/*Listado principal,  prevalida1 y prevalida2 de  momento*/
.alerta_falta_procesar {
    color: black;
    /*background-color: #FFBABA;*/
    background-color: #99cdff;
    /*font-size: 10px;
    padding: 5px;*/
    text-align: center;
    /*border-radius: 5px;*/
    font-size: 9px;
    border-radius: 13px;
    width: 18px !important;
    float: left;
    height: 18px;
    margin-top: -3px;
    /* margin-left: 0px; */
    line-height: 2;
}

/*Texto invasivo en campos faltantes de pantalla operativa borrar*/
.error_falta_captura_anterior {
    color: #D8000C;
    /*background-color: #FFBABA;*/
    background-color: #fdc992;
    font-size: 10px;
    padding: 5px;
    text-align: center;
    border-radius: 5px;
    
}

.tooltip_valida_campos {
    height: auto;
    background-color: #fdc992  !important;
    color: black !important;
    font-size: 14px;
    border-radius: 5px;
    font-weight: bold;
    padding: 10px;
}
/* JERZ  adecuación de css para uigrid */
.ui-grid-header-cell-primary-focus {
    text-align: center;
    background-color: #0E6C88;
    color: #fff;
    padding: 10px;
    font-weight: 100;
}

.uigrid-Custom{
    width: 100%;
    font-size: 14px !important;
    border: 1px solid gray;
}

.ui-grid-menu-button {
    background: #0e6c88;
    border-left: 1px solid #f3f3f3;
    border-bottom: 1px solid #d4d4d4;
    cursor: pointer;
    padding-top: 8px;
    font-weight: normal;
    color: #f3f3f3;
    min-width: 32px;
    text-align: center;
    height: 41px;
}

    .ui-grid-menu-button .ui-grid-menu .ui-grid-menu-mid {
        overflow-x: hidden;
        overflow-y: scroll;
    }

   

/* Color del botón de exportar*/

.ui-grid-column-menu-button {
    position: absolute;
    right: 1px;
    top: 0;
    color: #ffffff;
    font-weight: bold;
}

/*Corrección de alto en controles de paginación ui-grid*/
div.ui-grid-pager-panel.ng-scope > div.ui-grid-pager-container > div.ui-grid-pager-control > input {
    height: 15px !important;
}

/* Tamaño del campo de filtrado en la tabla*/
input[type="text"].ui-grid-filter-input {
    padding: 4px 18px 4px 4px;
}


/* Personalizdos */
.veggie-option {
  float: left;
  box-sizing: border-box;
  padding: 0  8px; 
 margin-top:10px;
}

.veggie-option .md-item-text {
  font-size:12px;
  padding: 8px;
  background: #0E6C88;
  border-radius: 3px; 
  color: white;
}



.anonimo{
    font-size: 11px;
    display: inline;
    font-weight: bold;
}

.bola {
    border-radius: 50%;
    width: 20px;
    height: 20px; 
    display: inline-block;
}

.amarillo{
     background-color: yellow;   

}
.rojo{
 background-color: red;
}
.verde{
 background-color: green;
}

/* fin personalizado */
.contenedor-principal {
    width: 100%;
    float: left;
    height: 100%;
}
.encontrados{
    font-size: 12px;
    font-weight: bold;
    color: #333;
}

.menucolor{
    /*#ccc*/
    /*background-color: #eee;*/
}

.menucolor-principal{
        background-color: #fafafa;

}


/**** TABLAS DE DATOS ****/


.tabla-datos {
    width: 100%;
    font-size: 14px;
    border: 1px solid gray;   
    
}

.tabla-datos a {
    text-decoration: none;
    color: #fff;
}

.tabla-datos a:hover {
    color: #fff;
}

.tabla-datos th {
    text-align: center;
    background-color: #0E6C88;
    color: #fff;
    padding: 10px;
    font-weight: 100;
}

.tabla-datos td {
    padding: 5px;
}

.tabla-datos tbody tr:nth-child(odd) {
    background-color: #eee;
}

.tabla-datos td.derecha {
    text-align: right;
}

.tabla-datos td.izquierda {
    text-align: left;
}

.tabla-datos td.centrado {
    text-align: center;
}

.icono-tabla {
    float: left;
    padding: 0 6px 0 6px;
}


/**** CONTENEDOR GENERAL ***/

.container2 {
    /*background-color: #fafafa;*/
    
    position: relative;
    height: 100%;
    width: 100%;
    left: 0;
    top: 73px;
    -webkit-transition: left 0.4s ease-in-out;
    -moz-transition: left 0.4s ease-in-out;
    -ms-transition: left 0.4s ease-in-out;
    -o-transition: left 0.4s ease-in-out;
    transition: left 0.4s ease-in-out;
    -webkit-transition: width 0.4s ease-in-out;
    -moz-transition: width 0.4s ease-in-out;
    -ms-transition: width 0.4s ease-in-out;
    -o-transition: width 0.4s ease-in-out;
    transition: width 0.4s ease-in-out;
}

    .container2.open-sidebar {
        left: 220px;
        width: calc(100% - 220px) !important;
        -webkit-transition: width 0.3s ease-in-out;
        -moz-transition: width 0.3s ease-in-out;
        -ms-transition: width 0.3s ease-in-out;
        -o-transition: width 0.3s ease-in-out;
        transition: width 0.3s ease-in-out;
    }

.container2 i.menus {
    float: right;
    margin-right: 20px;
}

/*correccion de estilos para el menu dinamico  FELIPE*/
.container2 span.textoMenu {
    margin-left: -999px;
}

.container2.open-sidebar span.textoMenu {
    margin-left: 0px;
}

/*--------------------*/

.container2.open-sidebar i.menus {
    float: left;
    margin-right: 0px;
}

.anchocontenido {
    width: calc(100% - 220px) !important;
    transition: width .5s ease-in-out;
}


/*** BARRA LATERAL ***/

.swipe-area {
    position: absolute;
    width: 55px;
    left: 0;
    top: 0;
    height: 100%;
    background: #0E6C88;
    z-index: 0;
}

#sidebar {
    background: #0E6C88;
    position: absolute;
    width: 290px;
    height: 100%;
    left: -220px;
    z-index: 2;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    top:-3px;
}

.menuPadre {
    background-color:#17596d;
}

#sidebar ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

#sidebar ul li {
    margin: 0;
}

#sidebar ul li a {
    padding: 15px 20px;
    font-size: 16px;
    font-weight: 100;
    color: white;
    text-decoration: none;
    display: block;
    border-bottom: 1px solid #dbdbdb;
    -webkit-transition: background 0.3s ease-in-out;
    -moz-transition: background 0.3s ease-in-out;
    -ms-transition: background 0.3s ease-in-out;
    -o-transition: background 0.3s ease-in-out;
    transition: background 0.3s ease-in-out;
}

#sidebar ul li:hover a {
    background: #0c576d;
}


/*** CONTENIDO CENTRAL ***/

.contenido-central {
    font-size: 16px;
    display: block;
    width: 100%;
    height: 100%;
    padding: 0px;
    padding-left: 60px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    position: relative;
    /* cambio */
    height: calc(100% - 75px);
    overflow: auto;
}

    .contenido-central .contenido {
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        padding-left: 20px;
        padding-right: 20px;
        width: 100%;
        margin-bottom: 65px;
    }

.contenido-central .contenido h1 {
    font-weight: 600;
    font-size: 25px;
    line-height: 25px;
    margin-top: 15px;
    margin-bottom: 15px;
    color: #0E6C88;
    font-family:'Helvetica', 'Arial', 'sans-serif';
}

.contenido-central .contenido h3 {
    font-weight: 100;
    font-size: 20px;
    line-height: 20px;
    margin-top: 20px;
    margin-bottom: 10px;
}

.contenido-central .contenido p {
    width: 100%;
    line-height: 160%;
}


/*** BOTONES ***/

/*.btn-formulario {
    font-family: Oxygen, Roboto, Calibri, Arial;
    border: 0px;
    padding: 8px 0px;
    width: auto;
    background-color: #0E6C88;
    color: #fff;
    width: 100%;
    border-radius: 6px;
    -moz-border-radius: 5px;
    cursor: pointer;
}

.btn-formulario:hover {
    border: 0;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, .5);
}

.btn-cancelar {
    font-family: Oxygen, Roboto, Calibri, Arial;
    border: 0px;
    padding: 8px 0px;
    width: auto;
    background-color: #666;
    color: #fff;
    width: 100%;
    border-radius: 6px;
    -moz-border-radius: 5px;
    cursor: pointer;
}

.btn-cancelar:hover {
    border: 0;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, .5);
}*/


/*Boton despliega menu */

.btn-display-menu {
    padding-top: 28px;
    display: block;
    float: left;
    width: 3%;
    min-width: 35px;
    height: auto;
}

.etiquetas-semaforo {
    box-sizing: border-box;
    width: 93px;
    float: left;
    font-family: Oxygen, Roboto, Calibri, Arial;
    font-size: 11px;
    border: 1px solid #d8d8d8;
    padding: 7px 6px;
    cursor: pointer;
    color: #000;
    background-color: #fefefe;
    margin: 0 3px;
}

.etiqueta-semaforo-verde {
    border-left: 12px solid #468966;
}

.etiqueta-semaforo-amarillo {
    border-left: 12px solid #E7A117;
}

.etiqueta-semaforo-rojo {
    border-left: 12px solid #A42127;
}

.etiquetas-estilos {
    box-sizing: border-box;
    float: left;
    font-family: Oxygen, Roboto, Calibri, Arial;
    font-size: 11px;
    border: 1px solid #d8d8d8;
    padding: 7px 6px;
    cursor: pointer;
    color: #000;
    background-color: #fefefe;
    margin: 0 3px;
    width: 93px;
}

.etiquetas-estilos i {
    font-size: 14px;
    padding-right: 8px;
}

.etiquetas-estilo1 {
    color: #700961;
}

.etiquetas-estilo2 {
    color: #43498E;
}

.etiquetas-estilo3 {
    color: #4B2B30;
}

.etiquetas-estilo4 {
    color: #C9182B;
}

.etiquetas-estilo5 {
    color: #3B5B5D;
}

.etiquetas-estilo6 {
    color: #A2C11C;
}

.etiquetas-estilo7 {
    color: #680097;
}

.etiquetas-estilo8 {
    color: #64868E;
}

.etiquetas-estilo9 {
    color: #F85A16;
}

.etiquetas-estilo10 {
    color: #AA9979;
}

.etiquetas-estilo11 {
    color: #7B9F8A;
}

.etiquetas-estilo12 {
    color: #F40968;
}

.etiquetas-estilo13 {
    color: #FF80F3;
}

.etiquetas-estilo14 {
    color: #27E1CE;
}

.etiquetas-estilo15 {
    color: #F6B61E;
}

.etiquetas-estados {
    box-sizing: border-box;
    float: left;
    font-family: Oxygen, Roboto, Calibri, Arial;
    font-size: 11px;
    border: 1px solid #d8d8d8;
    padding: 7px 6px;
    cursor: pointer;
    color: #fff;
    margin: 0 3px;
    width: 93px;
}

.etiqueta-Capturado {
    background-color: #1293B8;
}

.etiqueta-Proceso {
    /*background-color: #0E6C88;*/
    background-color: #bae9f8;
}

.etiqueta-Terminado {
    background-color: #094455;
}

.etiqueta-Administrador {
    background-color: #094455;
}

.etiqueta-Supervisor {
    background-color: #0E6C88;
}

.etiqueta-Operador {
    background-color: #1293B8;
}

.mnu-barras {
    font-size: 18px;
    padding: 0 2px 0 2px;
    color: #666;
}

.mnu-barras:hover {
    color: #0E6C88;
}


/* Boton + flotante */

.btn-flotante {
    display: inline-block;
    /*background-color: #0E6C88;*/
    margin: 0px 0px 10px 10px;
    border-radius: 50%;
    position: fixed;
    z-index: 49;
    bottom: 6px;
    right: 50px;
    width: 60px;
    height: 60px;
    box-shadow: 0px 3px 8px #ddd;
}

.btn-flotante:hover {
    box-shadow: 0px 5px 6px 1px #c2c2c2;
    cursor: pointer;
}

.btn-flotante-texto {
    width: 100%;
    color: #fff;
    font-size: 17px;
    text-align: center;
    /*margin-top: calc(50% - 8.5px);*/
    margin-top: 0;
}


 /*.main-content #sidebar-toggle {
	background: #d4d4d4; /* #0E6C88;  
	border-radius: 3px;
	display: block;
	position: relative;
	padding: 7px 7px;
}*/ 


/*** SUBMENUS DESPLEGABLES ***/



#accordian {
    background: transparent;
    width: 290px;
    margin: 5px -10px -10px 0px;
    color: white;
}

    #accordian h3 {
        margin-bottom: 0px;
        margin-top: 0px;
        background: transparent;
        background: transparent;
    }

        #accordian h3 a {
            padding: 0 10px;
            font-size: 12px;
            line-height: 18px;
            display: block;
            color: white;
            text-decoration: none;
        }

        #accordian h3:hover {
            text-shadow: 0 0 1px rgba(255, 255, 255, 0.7);
        }

i {
    margin-right: 10px;
}

#accordian li {
    list-style-type: none;
}

#accordian ul ul li a,
#accordian h4 {
    color: white;
    text-decoration: none;
    line-height: 27px;
    display: block;
    padding: 0 15px;
    transition: all 0.15s;
    position: relative;
}

    /*#accordian ul ul li a:hover {
        border-left: 5px solid transparent;
    }*/

#accordian ul ul {
    display: none;
}

#accordian li.active > ul {
    display: block;
}

#accordian ul ul ul {
    margin-left: 15px;
    border-left: 1px dotted rgba(0, 0, 0, 0.5);
}

#accordian a:not(:only-child):after {
    content: "\f104";
    font-family: fontawesome;
    position: absolute;
    right: 20px;
    top: 0;
    font-size: 14px;
}

#accordian .active > a:not(:only-child):after {
    content: "\f107";
}

/*anterior*/
/*#accordion {
    list-style: none;
    padding: 0 0 0 0;
}

#accordion li {
    display: block;
    margin: 1px;
    cursor: pointer;
    padding: 5px 5px 5px 7px;
}

#accordion ul {
    list-style: none;
    padding: 0 0 0 0;
    display: none;
}

#accordion ul li {
    cursor: auto;
    padding: 0 0 0 13px;
}

#accordion a {
    text-decoration: none;
}

#accordion a:hover {
    text-decoration: none;
}*/


/*** ICONOS FONT AWESOME ***/

/*.fa {
    font-size: 20px;
}

i {
    float: left;
}

.fa-calendar {
    color: #0E6C88;
}

.fa-calendar:hover {
    color: #333;
}

.fa-calendar:active {
    color: #333;
}*/


/*** LOGO PRINCIPAL ***/

.logo {
    color: #fff;
    display: block;
    font-size: 24px;
    white-space: nowrap;
    float: left;
    width: 10%;
    width: 118px;
    margin-right: 30px;
}

.logo img {
    min-width: 88px;
}

.logo :hover {
    cursor:pointer;
    opacity: 0.7;
}




/*** MENU SUPERIOR ***/

.page-top {
    background-color: #fff;
    position: fixed;
    z-index: 904;
    box-shadow: 2px 0 3px rgba(0, 0, 0, .5);
    width: 100%;
    min-width: 404px;
    padding: 0 0 0 15px;
    height: auto;
    display: block;
    float: clear;
}

.mnu-superior {
    border: 0px solid;
    height: 100%;
    margin-top: 4px;
    display: block;
    float: right;
    min-width: 200px;
    padding-right: 5%;
}


/*** ICONO NOTIFICACIONES (CAMPANA) ***/

.icono-notificaciones {
    position: relative;
    border: 0px solid;
    float: right;
    padding-top: 20px;
    font-size: 28px;
    color: #333;
}

.icono-notificaciones:hover {
    color: #0E6C88;
    text-shadow: .055em .055em #ccc;
}

.numero-notificaciones {
    font-size: 13px;
    width: 10px;
    display: block;
    text-align: center;
    padding-top: 2px;
}

.circulo-numero-notificaciones {
    border: 1px solid #B20000;
    display: inline-block;
    background-color: #B20000;
    margin-top: 12px;
    padding: 0px 0px 5px 5px;
    border-radius: 50%;
    position: relative;
    float: right;
    z-index: 1;
    text-align: center;
    color: #fff;
    bottom: 5px;
    right: 15px;
    width: 15px;
    height: 15px;
}


/*** CONTENIDO DE NOTIFICACIONES ***/

.notificaciones {
    border: 0px solid #dedede;
    height: 100%;
    width: 50px;
    display: block;
    float: right;
}

#listanotif {
    box-shadow: 2px 2px 3px rgba(0, 0, 0, .5);
    display: none;
    position: absolute;
    width: 280px;
    margin-left: -140px;
    top: 72px;
    z-index: 999;
    height: auto;
    background-color: #dedede;
}

#listanotif ul {
    list-style: none;
    padding: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    width: 280px;
}

#listanotif li {
    font-size: 15px;
    padding: 15px 10px;
    border-bottom: 1px solid #fff;
}

#listanotif li:hover {
    background-color: #cacaca;
    cursor: pointer;
}

.titulonotif {
    background-color: #0E6C88;
    color: #fff;
    padding: 10px;
    text-align: center;
}

.contenidonotif {
    color: #0E6C88;
}

.notificaciones:hover > .circulo-numero {
    background-color: #fff;
    color: #B20000;
    border: 1px solid #B20000;
}


/*** CONTENIDO DEL MENU USUARIO ***/

#mnuusuario {
    box-shadow: 2px 2px 3px rgba(0, 0, 0, .5);
    display: none;
    position: absolute;
    width: 180px;
    top: 72px;
    z-index: 999;
    height: auto;
    background-color: #dedede;
}

#mnuusuario ul {
    list-style: none;
    padding: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    width: 180px;
}

#mnuusuario li {
    padding: 8px 10px;
    border-bottom: 1px solid #fff;
    font-size: 15px;
}

#mnuusuario ul a i {
    padding: 10px 8px 0 12px;
}

#mnuusuario ul a {
    color: black;
}

#mnuusuario ul a:hover {
    color: #0E6C88;
}

#mnuusuario li:hover {
    background-color: #cacaca;
}

#mnuusuario ul a {
    text-decoration: none;
}

.contenedor-mnuusuario {
    border: 0px solid green;
    height: 100%;
    display: block;
    float: right;
    width: 150px;
}

.contenedor-mnuusuario:hover {
    cursor: pointer;
}

.nombre-usuario {
    display: table-cell;
    vertical-align: bottom;
    height: 45px;
    width: 240px;   /*105*/
    float: left;
    text-align: right;
    padding-top: 16px;
    font-size: 14px;
}

.foto-usuario img {
    padding-top: 8px;
    margin: 1px;
    margin-left: 9px;
    background-color: #fff;
    border-radius: 50%;
    float: left;
    width: 35px;
}


/**** INDICADORES DE MENUS SUPERIORES (NOTIFICACIONES Y USUARIO) ***/

.indicador-mnu-azul {
    position: absolute;
    z-index: -10;
    margin-left: 47%;
    top: -5px;
    width: 30px;
    height: 30px;
    background-color: #0E6C88;
    -ms-transform: rotate(45deg);
    /* IE 9 */
    -webkit-transform: rotate(45deg);
    /* Safari */
    transform: rotate(45deg);
}

.indicador-mnu-gris {
    position: absolute;
    z-index: -10;
    margin-left: 47%;
    top: -5px;
    width: 30px;
    height: 30px;
    background-color: #dedede;
    -ms-transform: rotate(45deg);
    /* IE 9 */
    -webkit-transform: rotate(45deg);
    /* Safari */
    transform: rotate(45deg);
}


/*** CONTENEDORES (COLUMNAS Y FILAS) ***/


/*.col-iconos {
    width: 287px;
}

.row {
    float: left;
    width: 100%;
    margin: 5px 0;
}

.row:after,
.row:before {
    display: table;
    content: " "
}

.col1 {
    width: 6.5%;
}

.col2 {
    width: 15%;
}

.col3 {
    width: 23.5%;
}

.col4 {
    width: 32%;
}

.col5 {
    width: 40.5%;
}

.col6 {
    width: 49%;
}

.col7 {
    width: 57.5%;
}

.col8 {
    width: 66%;
}

.col9 {
    width: 74.5%;
}

.col10 {
    width: 83%;
}

.col11 {
    width: 91.5%;
}

.col12 {
    width: 100%;
}

.ultimo {
    margin-right: 0;
}

.col1,
.col2,
.col3,
.col4,
.col5,
.col6,
.col7,
.col8,
.col9,
.col10,
.col11,
.col12 {
    box-sizing: border-box;
    float: left;
    padding: 4px 4px 0 4px;
}*/

.texto-izquierda {
    text-align: left;
}

.texto-derecha {
    text-align: right;
}

.texto-centrado {
    text-align: center;
}


/**** CONTROLES DEL FORM (INPUTS, LABELS) ***/

.control {
    border: none;
    box-shadow: none;
    display: block;
    width: 100%;
    height: 30px;
    padding: 2px 2px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fafafa;
    background-image: none;
    border-radius: 0;
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: all 0.3s;
    text-transform:uppercase;
    background-color: transparent;
    border-bottom: 1px solid #9e9e9e !important;
    outline: none;
}

.control:focus:not([readonly]) {
    border-bottom: 1px solid #0E6C88;
    box-shadow: 0 1px 0 0 #0E6C88;
}

.control-textarea {
    font-size: 16px;
    border: none;
    box-shadow: none;
    display: block;
    width: 100%;
    padding: 2px 2px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fafafa;
    background-image: none;
    border-radius: 0;
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: all 0.3s;
    /*text-transform: uppercase;*/
    background-color: transparent;
    border-bottom: 1px solid #9e9e9e;
    outline: none;
}

.control-textarea:focus:not([readonly]) {
    border-bottom: 1px solid #0E6C88;
    box-shadow: 0 1px 0 0 #0E6C88;
}

::-webkit-input-placeholder {
    color: #d1d1d1;
}

:-moz-placeholder {
    /* Firefox 18- */
    color: #d1d1d1;
}

::-moz-placeholder {
    /* Firefox 19+ */
    color: #d1d1d1;
}

:-ms-input-placeholder {
    color: #d1d1d1;
}


/****** CALENDARIO *****/

.ui-datepicker {
    width: 17em;
    padding: .2em .2em 0;
    display: none;
    border-radius: 6px;
    background-color: #ececec;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, .5);
}

.ui-datepicker .ui-datepicker-header {
    border-radius: 5px;
    position: relative;
    padding: .2em 0;
    background-color: #0E6C88;
    color: #fff;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    position: absolute;
    top: 2px;
    width: 1.8em;
    height: 1.8em;
}

.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
    top: 1px;
}

.ui-datepicker .ui-datepicker-prev {
    left: 2px;
}

.ui-datepicker .ui-datepicker-next {
    right: 2px;
}

.ui-datepicker .ui-datepicker-prev-hover {
    left: 1px;
}

.ui-datepicker .ui-datepicker-next-hover {
    right: 1px;
}

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
    display: block;
    position: absolute;
    left: 50%;
    margin-left: -8px;
    top: 50%;
    margin-top: -8px;
}

.ui-datepicker .ui-datepicker-title {
    margin: 0 2.3em;
    line-height: 1.8em;
    text-align: center;
}

.ui-datepicker .ui-datepicker-title select {
    font-size: 1em;
    margin: 1px 0;
}

.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
    width: 45%;
}

.ui-datepicker table {
    width: 100%;
    font-size: .9em;
    border-collapse: collapse;
    margin: 0 0 .4em;
}

.ui-datepicker th {
    border-radius: 4px;
    padding: .7em .3em;
    text-align: center;
    font-weight: bold;
    border: 1px solid #fff;
    color: #3f3f3f;
    background-color: #d1d1d1;
}

.ui-datepicker td {
    border: 0;
    padding: 1px;
}

.ui-datepicker td span,
.ui-datepicker td a {
    display: block;
    padding: .2em;
    text-align: right;
    text-decoration: none;
}

.ui-datepicker .ui-datepicker-buttonpane {
    background-image: none;
    margin: .7em 0 0 0;
    padding: 0 .2em;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
}

.ui-datepicker .ui-datepicker-buttonpane button {
    float: right;
    margin: .5em .2em .4em;
    cursor: pointer;
    padding: .2em .6em .3em .6em;
    width: auto;
    overflow: visible;
}

.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
    float: left;
}

.ui-datepicker .ui-icon {
    display: block;
    text-indent: -99999px;
    overflow: hidden;
    background-repeat: no-repeat;
    left: .5em;
    top: .3em;
}

a.ui-state-default {
    text-align: center;
    color: #333;
    text-decoration: none;
}

a.ui-state-default:hover {
    background-color: #ddd;
}

.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited {
    color: #dedede;
    text-decoration: none;
}


/**** FORMA PARA REPORTE DE USUARIOS ****/

.reportes-usuario {
    z-index: 100;
    position: absolute;
    display: none;
    background-color: #fff;
    width: 450px;
    box-shadow: 0px 3px 8px #ddd;
    left: calc(50% - 225px);
    top: calc(35% - 150px);
}

.reportes-usuario .col12 {
    padding: 5px 14px;
}

.titulo-reportes {
    background-color: #0E6C88;
    color: #fff;
    padding: 10px;
    text-align: center;
}

.titulo-reportes:hover {
    cursor: move;
}

.fondoModal {
    position: fixed;
    top: 0;
    left: 0;
    display: none;
    height: 100%;
    z-index: 99;
    width: 100%;
    background-color: #bbb;
    opacity: 0.7;
}


/***** CONTENEDOR LOGIN *****/

.contenedor-principal-login {
    background-color: #ccc;
    width: 100%;
    float: left;
    height: 100%;
}

.contenedor-login {
    position: relative;
    top: calc(35% - 200px);
    left: calc(45% - 175px);
    float: left;
    padding: 20px;
    background-color: #fefefe;
    border-radius: 10px;
    width: 350px;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, .5);
    border:1px solid darkgray;


}

#nav-appname {
    display: block;
    border: 0px solid;
    float: left;
}

@media (max-width: 1100px) {
    #nav-appname h2{
        font-size: 1.2em !important;
    }

}

    /**** DISPOSITIVOS ANCHOS DE PANTALLA MENORES ****/


    @media (max-width: 930px) {
        .col-iconos {
            width: 100px;
        }

        .col1,
        .col2,
        .col3,
        .col4,
        .col5,
        .col6,
        .col7,
        .col8,
        .col9,
        .col10,
        .col11,
        .col12 {
            width: 100%;
        }

        .texto-derecha {
            text-align: left;
            margin-top: 6px;
        }

        .col-ocultable2 {
            display: none;
        }

        #nav-appname {
            display: none;
        }
    }

    /**** DISPOSITIVOS ANCHOS DE PANTALLA MENORES ****/

    @media (max-width: 640px) {
        .col-ocultable1 {
            display: none;
        }

        .col-iconos {
            width: 100px;
        }
    }
    /* chko */

    .angular-google-map-container {
        width: 100%;
        height: 480px;
        border: 1px solid #aaa;
    }


    /* fix for Twitter Bootstrap handling of responsive images */

    .angular-google-map img {
        max-width: none;
    }

    .angular-google-map {
        top: 80px;
    }


    input {
        /*text-transform: uppercase;*/
    }

    .input_disabled {
        background-color: #eee;
    }


    .switch_grid {
        width: 45px;
        margin: auto;
    }



    .page-top-usuario {
        height: 100%;
        float: right;
        margin-right: 10px;
        cursor: pointer;
        padding-top: 10px;
        width: 300px; /*180*/
    }

        .page-top-usuario .nombre-usuario {
            width: 200px;
            display: inline-block;
        }

        .page-top-usuario .foto-usuario {
            display: inline-block;
            margin-left: 10px;
        }

            .page-top-usuario .foto-usuario img {
                width: 35px;
                height: 35px;
            }

        .page-top-usuario:hover .page-top-usuario-list {
            opacity: 1;
            transition: opacity .5s ease-in-out;
            top: 70px;
            float: right;
            margin-left: 50px;
        }

        .page-top-usuario:hover {
            color: #016988;
        }

    .page-top-usuario-list {
        box-shadow: 2px 2px 3px rgba(0,0,0,.5);
        position: absolute;
        background-color: #dedede;
        top: -1000px;
        opacity: 0;
        color: #000;
    }

        .page-top-usuario-list ul {
            list-style: none;
            padding: 0px;
            margin-top: 0px;
            margin-bottom: 0px;
            width: 180px;
        }

        .page-top-usuario-list li {
            padding: 8px 10px;
            border-bottom: 1px solid #fff;
            font-size: 15px;
        }

        .page-top-usuario-list ul a i {
            padding: 10px 8px 0 12px;
        }

        .page-top-usuario-list ul a {
            color: black;
        }

            .page-top-usuario-list ul a:hover {
                color: #0E6C88;
            }

        .page-top-usuario-list li:hover {
            background-color: #cacaca;
        }

        .page-top-usuario-list ul a {
            text-decoration: none;
        }


    .page-top-alert {
        height: 100%;
        width: 50px;
        position: relative;
        float: right;
        margin-right: 10px;
        cursor: pointer;
        padding-top: 20px;
    }

        .page-top-alert #divnotificacionesalerta {
            position: absolute;
            left: 15px;
            top: 5px;
            height: 25px;
            width: 25px;
            background-color: #B20000;
            border-radius: 50%;
            color: #fff;
            /*border: 1px solid #B20000;*/
            text-align: center;
            padding-top: 2px;
        }

        .page-top-alert span {
            display: block;
            font-size: 30px;
            color: #000;
        }

        .page-top-alert label {
            font-size: 12px;
        }

        .page-top-alert:hover {
            color: #016988;
        }


    .notificaciones-alert {
        animation: pulsecolor 1s infinite;
        animation-direction: reverse;
        cursor: pointer;
    }

        .notificaciones-alert label {
            cursor: pointer;
        }
    /*
@keyframes pulsecolor {
  0% {
        background-color: #016988;
  }
  100% {
     background-color: #B20000;
  }
}
*/

    .panelauxiliar {
        position: absolute;
        top: -1500px;
        left: 50px;
        right: 0;
        z-index: 50;
        background-color: #fff;
        transition: .7s top ease-in-out;
    }

    #chkpanelauxiliar:checked ~ .panelauxiliar {
        top: 0px;
    }

    .ventanaMod {
        width: 800px;
        height: 100%;
    }


    .centrado-porcentual {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate( -50%, -50%);
        -webkit-transform: translate(-50%, -50%);
    }


    /*Botones efecto*/
    .boton_primary {
        /*color : rgb(49, 46, 46);*/
        color: white !important;
        /*background-color: rgba(255, 222, 121, 0.96);*/
        background-color: #0E6C88 !important;
        /*border-radius: 10px 0 0 10px;*/
        font-size: 14px;
    }

        .boton_primary:not([disabled]):hover {
            background-color: #105367 !important;
            color: white;
        }

        .boton_primary[disabled] {
            color: rgb(187, 187, 187);
            background-color: rgba(230, 230, 229, 0.96) !important;
        }

    .boton_warn {
        /*color : rgb(49, 46, 46);*/
        color: white !important;
        /*background-color: rgba(255, 222, 121, 0.96);*/
        background-color: #9a1616 !important;
        /*border-radius: 10px 0 0 10px;*/
        font-size: 14px;
    }

        .boton_warn:not([disabled]):hover {
            background-color: #c41313 !important;
            color: white;
        }

        .boton_warn[disabled] {
            color: rgb(187, 187, 187);
            background-color: rgba(230, 230, 229, 0.96) !important;
        }

    /*Sobreescribe colores*/
    .semaforo-verde {
        background-color: #4f880e !important;
        width: 35px !important;
        height: 35px !important;
    }

    /*.semaforo-verde > md-icon,
.semaforo-amarillo > md-icon,
.semaforo-rojo > md-icon
 {
    margin-top:-2px;
    margin-left:-2px;
}*/

    .semaforo-rojo {
        background-color: #9a1616 !important;
        width: 35px !important;
        height: 35px !important;
    }

        .semaforo-rojo:not([disabled]):hover {
            background-color: #c60606 !important;
            color: white;
        }

    .semaforo-amarillo {
        background-color: #F6B61E !important;
        width: 35px !important;
        height: 35px !important;
    }

    /*Sobreescribe los valores param ellipse switch*/
    md-switch.md-default-theme.md-checked.md-warn .md-thumb, md-switch.md-checked.md-warn .md-thumb {
        background-color: #B20000;
    }

        md-switch.md-default-theme.md-checked.md-warn .md-thumb, md-switch.md-checked.md-warn .md-thumb md-switch.md-default-theme.md-checked.md-warn .md-ink-ripple, md-switch.md-checked.md-warn .md-ink-ripple {
            background-color: #9a1616;
        }

    md-switch[disabled].activeDisabled .md-container > div {
        cursor: default;
        background: lightgray;
    }

        md-switch[disabled].activeDisabled .md-container > div > div {
            background: #cbe1ff;
        }
    /*md-switch.md-default-theme.md-checked.md-warn .md-ink-ripple, md-switch.md-checked.md-warn .md-ink-ripple {
    color:red;
}*/





    /*      CARDS                */
    /*.colorsdemoBasicUsage .card-media {
  margin-right: 16px;
  border-radius: 50%;
  overflow: hidden; }

.colorsdemoBasicUsage .md-subhead.description {
  color: rgba(255, 255, 255, 0.7); }

.colorsdemoBasicUsage .card-media md-icon {
  width: 40px;
  height: 40px;
  color:   rgba(255, 255, 255, 0.87); 
}

.colorsdemoBasicUsage span.card-title {
  padding-left: 15px;
  margin-top: 20px; }

.colorsdemoBasicUsage code.css {
  background-color: #fffcc2; }

.colorsdemoBasicUsage p.footnote code {
  font-size: 0.85em; }

.colorsdemoBasicUsage p.footnote {
  font-size: 0.85em;
  margin: 30px;
  padding: 5px;
  background-color: rgba(205, 205, 205, 0.45); }*/



    /*Controla los menus inactivos*/

    /*ul li.active {
  background: red;
}*/

    ul li[disabled] {
        opacity: .3;
        cursor: default;
        pointer-events: none;
    }


    /*--------        Sobre-escribe estilo de tabs      --------------*/
    md-tabs md-ink-bar {
        color: rgb(255,64,129);
        background: #0E6C88;
    }

    .md-tab.md-active {
        cursor: default;
        background-color: lightgray;
        font-weight: bold;
        border-radius: 5px;
    }

    md-tabs.md-default-theme .md-tab, md-tabs .md-tab {
        color: rgba(0,0,0,0.54);
    }


    /*-------              Sobre-escribe paginación      -------------*/

    .pagination {
        display: block;
        margin-top: 0;
        margin-bottom: 0;
        padding: 0 0 3px 0;
        border: 1px solid darkgray;
        /*height:36px;*/
    }


        .pagination li {
            display: inline-block;
            font-size: 1.2rem;
            padding: 0 10px;
            line-height: 30px;
            border-radius: 2px;
            text-align: center;
        }

            .pagination li a {
                color: #444;
            }

            .pagination li.active a {
                color: #fff;
            }

            .pagination li.active {
                background-color: #0c576d;
            }

            .pagination li.disabled a {
                cursor: default;
                color: #999;
            }

            .pagination li i {
                font-size: 2.2rem;
                vertical-align: middle;
            }

            .pagination li.pages ul li {
                display: inline-block;
                float: none;
            }

    @media only screen and (max-width: 992px) {
        .pagination {
            width: 100%;
        }

            .pagination li.prev,
            .pagination li.next {
                width: 10%;
            }

            .pagination li.pages {
                width: 80%;
                overflow: hidden;
                white-space: nowrap;
            }
    }



    a {
        text-decoration: none;
    }


    /*!
 * Waves v0.6.0
 * http://fian.my.id/Waves
 *
 * Copyright 2014 Alfiana E. Sibuea and other contributors
 * Released under the MIT license
 * https://github.com/fians/Waves/blob/master/LICENSE
 */
    .waves-effect {
        position: relative;
        cursor: pointer;
        display: inline-block;
        overflow: hidden;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-tap-highlight-color: transparent;
        vertical-align: middle;
        z-index: 1;
        will-change: opacity, transform;
        transition: all .3s ease-out;
    }

        .waves-effect .waves-ripple {
            position: absolute;
            border-radius: 50%;
            width: 20px;
            height: 20px;
            margin-top: -10px;
            margin-left: -10px;
            opacity: 0;
            background: rgba(0, 0, 0, 0.2);
            transition: all 0.7s ease-out;
            transition-property: opacity, -webkit-transform;
            transition-property: transform, opacity;
            transition-property: transform, opacity, -webkit-transform;
            -webkit-transform: scale(0);
            transform: scale(0);
            pointer-events: none;
        }

        .waves-effect.waves-light .waves-ripple {
            background-color: rgba(255, 255, 255, 0.45);
        }

        .waves-effect.waves-red .waves-ripple {
            background-color: rgba(244, 67, 54, 0.7);
        }

        .waves-effect.waves-yellow .waves-ripple {
            background-color: rgba(255, 235, 59, 0.7);
        }

        .waves-effect.waves-orange .waves-ripple {
            background-color: rgba(255, 152, 0, 0.7);
        }

        .waves-effect.waves-purple .waves-ripple {
            background-color: rgba(156, 39, 176, 0.7);
        }

        .waves-effect.waves-green .waves-ripple {
            background-color: rgba(76, 175, 80, 0.7);
        }

        .waves-effect.waves-teal .waves-ripple {
            background-color: rgba(0, 150, 136, 0.7);
        }

        .waves-effect input[type="button"], .waves-effect input[type="reset"], .waves-effect input[type="submit"] {
            border: 0;
            font-style: normal;
            font-size: inherit;
            text-transform: inherit;
            background: none;
        }

    .waves-notransition {
        transition: none !important;
    }

    .waves-circle {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
    }

    .waves-input-wrapper {
        border-radius: 0.2em;
        vertical-align: bottom;
    }

        .waves-input-wrapper .waves-button-input {
            position: relative;
            top: 0;
            left: 0;
            z-index: 1;
        }

    .waves-circle {
        text-align: center;
        width: 2.5em;
        height: 2.5em;
        line-height: 2.5em;
        border-radius: 50%;
        -webkit-mask-image: none;
    }

    .waves-block {
        display: block;
    }

    /* Firefox Bug: link not triggered */
    a.waves-effect .waves-ripple {
        z-index: -1;
    }


    /*----------------------------------- grid dashboard */


    md-grid-tile {
        border-radius: 5px;
    }

    md-grid-tile-footer {
        text-align: center;
    }

    md-grid-tile p {
        color: black;
        text-align: center;
        font-size: x-large;
        font-weight: bold;
        margin-bottom: 70px;
    }

    .gridListdemoBasicUsage md-grid-list {
        /*margin: 8px;*/
    }

    .gridListdemoBasicUsage .gray {
        border-radius: 5px;
        background: #f5f5f5;
    }

    .gridListdemoBasicUsage .green {
        border-radius: 5px;
        background: #b9f6ca;
    }

    .gridListdemoBasicUsage .yellow {
        border-radius: 5px;
        background: #ffff8d;
    }

    .gridListdemoBasicUsage .blue {
        border-radius: 5px;
        background: #84ffff;
    }

    .gridListdemoBasicUsage .purple {
        border-radius: 5px;
        background: #b388ff;
    }

    .gridListdemoBasicUsage .red {
        border-radius: 5px;
        background: #ff8a80;
    }



    /*Tabla para aviso de diferencias*/
    table.blueTable {
        border: 1px solid #1C6EA4;
        background-color: #EEEEEE;
        width: 100%;
        text-align: left;
        border-collapse: collapse;
    }

        table.blueTable td, table.blueTable th {
            border: 1px solid #AAAAAA;
            padding: 3px 2px;
        }

        table.blueTable tbody td {
            font-size: 13px;
        }

        table.blueTable tr:nth-child(even) {
            background: #D0E4F5;
        }

        table.blueTable thead {
            background: #1C6EA4;
            background: -moz-linear-gradient(top, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
            background: -webkit-linear-gradient(top, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
            background: linear-gradient(to bottom, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
            border-bottom: 2px solid #444444;
        }

            table.blueTable thead th {
                font-size: 15px;
                font-weight: bold;
                color: #FFFFFF;
                border-left: 2px solid #D0E4F5;
            }

                table.blueTable thead th:first-child {
                    border-left: none;
                }

        table.blueTable tfoot {
            font-size: 14px;
            font-weight: bold;
            color: #FFFFFF;
            background: #D0E4F5;
            background: -moz-linear-gradient(top, #dcebf7 0%, #d4e6f6 66%, #D0E4F5 100%);
            background: -webkit-linear-gradient(top, #dcebf7 0%, #d4e6f6 66%, #D0E4F5 100%);
            background: linear-gradient(to bottom, #dcebf7 0%, #d4e6f6 66%, #D0E4F5 100%);
            border-top: 2px solid #444444;
        }

            table.blueTable tfoot td {
                font-size: 14px;
            }

            table.blueTable tfoot .links {
                text-align: right;
            }

    .td_red {
        color: #DF3A01;
    }


    /*-------------Sobre-escribe css del select2 original*/
    /*importante que los select2 alterados, estén dentro de un div con clase divSelect2 */
    /* <div class="divSelect2" style="..."  ></>  */
    .divSelect2 > .select2-container--default .select2-selection--single {
        
        border-left: 0 !important;
        border-right: 0 !important;
        border-top: 0 !important;
        border-bottom: 1px solid gray !important;
        border-radius: 0 !important;        
        border-color:gray !important;
        /*color: rgba(0,0,0,0.87);*/
        border-color:  rgba(0,0,0,0.12) !important;
            
    }   
    

    .divSelect2 > .select2-container--focus{
        
        border-left: 2px solid blue !important;
        border-right: 0 !important;
        border-top: 0 !important;
        border-bottom: 1px solid blue !important;
        border-radius: 0 !important;        
        border-color:blue !important;
    }   

    .divSelect2 > .ng-invalid + .select2-container--default .select2-selection--single {
        border-left: 2px solid #ff0000 !important;
        background-color: #FFEBD6 ;
    }

.lblSelect2 {
    font-size: 14px;
    /*color: #aaa;*/   /*gris*/
    color: #555;   /*sincronizado con lbl_black,  lbl_switch*/
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 4px;
    transform: translateY(-50%);
    transition: all 0.2s ease 0s;
}

    .lblSelect2.selected {
        top: -10px;
        font-size: 11px;
        transform: translateY(0);
        left: 3px;
    }

    /*-------------<<<<<<<<<<<<<<<<<<<<<<<<*/


.columna_manual {
    padding: 5px;
    background: #0e6c88;
    color: #fdfdfd;
}


.clsTextArea1 {
    height: 215px !important;
    /*height: 100% !important;*/
    overflow-y: scroll;
    /*height: 100px;*/
    resize: none; /* Remove this if you want the user to resize the textarea */
}

.clsTextArea2 {
    height: 160px !important;
    /*height: 100% !important;*/
    overflow-y: scroll;
    /*height: 100px;*/
    resize: none; /* Remove this if you want the user to resize the textarea */
}
/* texto reporte avaluo */
.clsTextArea3 {
    height: 500px !important;
    /*height: 100% !important;*/
    overflow-y: scroll;
    /*height: 100px;*/
    resize: none; /* Remove this if you want the user to resize the textarea */
}

.clsTextArea4 {
    height: 400px !important;
    /*height: 100% !important;*/
    overflow-y: scroll;
    /*height: 100px;*/
    resize: none; /* Remove this if you want the user to resize the textarea */
}

.controlObs {
    background-color: rgba(255, 216, 0, 0.10) !important; /*0.15*/
    
}





    /* CSS PARA ALERTAS TOAST */

    md-toast {    
        top: 9%;    
        }



        md-toast.md-success-toast-theme div.md-toast-content {
            color: white !important;
            /*#0E6C88*/
            /*#179ac2   Azul mas claro*/
            background-color: #0E6C88 !important;
            border-radius: 10px;
            margin-right: 25px;
        }

        md-toast.md-warning-toast-theme div.md-toast-content {
            color: black !important;
            /*#ffffb3*/
            background-color: #ffa400 !important;
            border-radius: 10px;
            margin-right: 25px;
        }

    md-toast.md-error-toast-theme div.md-toast-content {
        color: white !important;
        background-color: red !important;
        border-radius: 10px;
        margin-right: 25px;
    }








/*EStilo para boton de filtros*/
    .filtroCon{
        min-height:0; 
        min-width:0; 
        width:40px !important;
        height:40px !important;  
        border-radius:2px; 
        margin:2px;
        background-color:#0E6C88 !important;
    }



    .filtroSin{
        min-height:0; 
        min-width:0; 
        width:40px !important;
        height:40px !important;  
        border-radius:2px; 
        margin:2px;
        background-color:#179ac2 !important;
    }



    /*Celdas ui-grid*/
    .celdasUIGRID {
        text-transform: uppercase;
    }

    .celdasUIGRID_Numero {
        text-align: right;
    }

    .celdasUIGRID_Centrada {
        text-align: center;
    }
    /*se quita de av_General.html y aPeritoExtSolFol.html*/
    .todasCeldas {
        /*max-height: 55px !important;
            height: 55px !important;*/
        vertical-align: middle;
    }

    .todasCeldasBold {
        /*max-height: 55px !important;
                height: 55px !important;*/
        vertical-align: middle;
        font-weight:bold;
        color:blue;
    }