body {
    background: rgba(0, 0, 0, 0.88);
}

/***************************************************
                    Botones
***************************************************/
.crane-boton {
    background: #a7a7a7;
    color: #FFFFFF;
}

.crane-boton.active {
    background: gray;
    color: #FFFFFF;
}

.crane-boton-icono {
    border: 1rem solid #79ABB5;
    background: #FFFFFF;
    color: #79ABB5;
}

.crane-boton-icono:hover {
background: gray;
color: #FFFFFF;
}

.crane-boton-icono.readonly {
background: #f1f2f2;
color: #79abb5;
}

.crane-boton-icono.readonly.btn-activo {
    background: #d0cfcf;
    color: #31585E;
}

.crane-boton:hover {
    background: gray;
}

.crane-boton.active:hover {
    background: #79ABB5;
}

.crane-boton-deshabilitado,
.crane-boton-deshabilitado:hover {
    background: #C1C2C2;
    color: #FFFFFF;
}

.crane-boton.invert:hover {
    background: #74A3AD;
    color: #FFF;
}

.crane-boton.invert {
    background: #EFEFEF;
    color: #555;
}

.crane-boton-rectangular {
    background: #EFEFEF;
    border: 1rem solid #D0D0D0;
    color: #333333
}

    .crane-boton-rectangular:hover {
        background: #79ABB5;
        cursor: pointer;
        color: #FFF;
    }

.crane-boton-circular {
    background: #79abb5;
    color: #ffffff;
}


    .crane-boton-circular:hover {
        background: #31585E !important;
        color: #ffffff;
        cursor: pointer;
    }

/***************************************************
                    Paneles
***************************************************/
.crane-panel {
    background: white;
    border: 1rem solid #ddd;
}

.crane-panel-encabezado {
    background: #79ABB5;
    color: #FFFFFF;
}

.crane-panel-contenido {
    background: white;
}


.crane-panel-herramientas > a {
    background: white;
    color: #79ABB5;
}


    .crane-panel-herramientas > a:hover {
        background: #31585E;
        color: white;
    }

.crane-seccion {
    border: 1rem solid #ACCBD1;
}

/***************************************************
                    Formularios
***************************************************/

.crane-subtitulo {
    background-color: #EEE;
    border-bottom: 1.5rem solid #C1C2C2;
}

.crane-subtitulo-botones > .crane-subtitulo-boton {
    background: #ACACAD;
    color: white;
}

    .crane-subtitulo-botones > .crane-subtitulo-boton:hover {
        background: #666666;
        color: white;
    }

.crane-form-input.readonly {
    background: #f1f2f2;
    color: #000000;
}

.crane-contenedor-form {
    border: 1rem solid #ACCBD1;
    color: #31585E;
}

.crane-form-input {
    border: 1rem solid #a7a9ac;
    background: transparent;
    color: #000000;
}

    .crane-form-input:focus {
        border-color: #66afe9;
        -webkit-box-shadow: inset 0 1rem 1rem rgba(0,0,0,.075),0 0 8rem rgba(102,175,233,.6);
        box-shadow: inset 0 1rem 1rem rgba(0,0,0,.075),0 0 8rem rgba(102,175,233,.6);
    }

.crane-form-inputIcon {
    border: 1rem solid #a7a9ac;
    background: transparent;
}

.crane-form-input-icon {
    color: #555;
    background-color: #eee;
    border: 1rem solid #ccc;
}

.crane-form-label {
    color: white;
}

.crane-form-icon {
    color: #dbdde0;
}

.crane-form-textarea.readonly {
    background: #f1f2f2;
    color: #000000;
}

.crane-form-textarea {
    color: #000000;
}


/***************************************************
               Grupos de inputs
***************************************************/


.crane-input-group-lbl {
    color: #555;
    background-color: #eee;
    border: 1rem solid #ccc;
}

.form-control {
    color: white;
}
/***************************************************
              Tabuladores
***************************************************/
.crane-tab-seccion {
    background: #FFFFFF;
    border: 2rem solid #79ABB5;
}

.crane-tab-nav {
    background: #79ABB5;
}

    .crane-tab-nav:after {
        background: #FFFFFF;
    }

.crane-tabnav-icon {
    color: #6e6767;
}

    .crane-tabnav-icon:hover {
        color: rgba(0,0,0,.5);
    }

.crane-tab-articulo:before {
    color: rgba(255,255,255,.45);
}

.crane-tabnav-icon.activo, .crane-Activo
/*.crane-tab:checked ~ nav label*/ {
    color: #79ABB5;
}

.crane-tab-deshabilitado,
.crane-tab-deshabilitado:hover {
    background: #F1F2F2 !important;
    color: #95AAAA !important;
}


/***************************************************
              Panel Checbox/radio
***************************************************/

.crane-panelseleccion-label {
    color: #BCBEC0;
}

.crane-panelseleccion-checkbox:checked + .crane-panelseleccion-label .crane-panelseleccion-inner:before {
    background-color: #79ABB5;
}

.crane-panelseleccion-checkbox:not(:checked) + .crane-panelseleccion-label .crane-panelseleccion-inner:after {
    background-color: #EEE;
}

.crane-panelseleccion-checkbox:checked + .crane-panelseleccion-label .crane-panelseleccion-icon,
.crane-panelseleccion-checkbox:checked + .crane-panelseleccion-label .crane-panelseleccion-label-text {
    color: #fff !important;
}

.digitales-icono-eliminar {
    border: 1rem solid #79ABB5;
    background: #79ABB5;
    color: #fff;
}

/***************************************************
             Notificacion
***************************************************/

.crane-notificacion {
    -webkit-box-shadow: 0 0 24rem -1rem rgba(56, 56, 56, 1);
    -moz-box-shadow: 0 0 24rem -1rem rgba(56, 56, 56, 1);
    -ms-box-shadow: 0 0 24rem -1rem rgba(56, 56, 56, 1);
    box-shadow: 0 0 24rem -1rem rgba(56, 56, 56, 1);
}

    .crane-notificacion.mensaje {
        background-color: #969595;
        color: #F0F0F0;
    }

    .crane-notificacion.error {
        background-color: orangered;
        color: #F0F0F0;
    }




/************* panel loader  *************/
.crane-loader {
    background-color: rgba(255, 255, 255, 0.22);
}

.crane-loader-progress {
    background-color: #AFC5DA;
}


/***************************************************
             Tablero Camas
***************************************************/


.crane-tablero-elemento-cama .cama-icono {
    color: #fff;
}

.crane-tablero-elemento-cama .cama-texto {
    color: #9D9C9C;
}

.crane-tablero-totales {
    background: #F0F0F0;
    color: #969595;
    border-left: 1rem solid #D8D9D9
}

.crane-tablero-elemento-cama .cama-icono.vestida, .crane-tablero-elemento-cama .cama-icono.libre {
    background-color: #5cb85c;
    border-color: #4cae4c;
}

.crane-tablero-elemento-cama .cama-icono.reservada {
    background-color: #7E408E;
    border-color: #7E408E;
}

.crane-tablero-elemento-cama .cama-icono.sincolchon {
    background-color: #071E3A;
    border-color: #071E3A;
}

.crane-tablero-elemento-cama .cama-icono.limpia {
    background-color: #75A3AD;
    border-color: #75A3AD;
}

.crane-tablero-elemento-cama .cama-icono.contaminada {
    background-color: #BA2B2B;
    border-color: #BA2B2B;
}

.crane-tablero-elemento-cama .cama-icono.mujeres {
    background-color: #AA1556;
    border-color: #AA1556;
}

.crane-tablero-elemento-cama .cama-icono.sucia {
    background-color: #A27421;
    border-color: #A27421;
}

.crane-tablero-elemento-cama .cama-icono.descompuesta {
    background-color: #DCCA76;
    border-color: #DCCA76;
}

.crane-tablero-elemento-cama .cama-icono.hombres {
    background-color: #35599F;
    border-color: #35599F;
}

.crane-tablero-elemento-cama .cama-icono.pediatricos {
    background-color: rgb(255, 255, 0);
    border-color: #35599F;
}

.crane-tablero-elemento-cama .cama-icono.otros {
    background-color: rgb(255, 204, 153);
    border-color: #000;
}

.crane-tablero-elemento-cama .cama-icono.prealta {
    background-color: rgb(223, 141, 38);
    border-color: #000;
}

.crane-tablero-elemento-cama .cama-icono.alta {
    background-color: rgb(102, 0, 102);
    border-color: #000;
}

/***************************************************
             Lista Camas
***************************************************/

.crane-listaCamas {
    color: #7BA9B9;
}

.crane-contenedor {
    border: 1rem solid #ACCBD1;
}

.btn-activo {
    background: #79ABB5;
    color: #FFF;
}

.lista-row-panel-camas > div {
    background: #E6E7E8;
}

.lista-row-panel-camas:nth-child(odd) > div {
    background: #F1F2F2;
}

.lista-row-panel-camas:hover > div {
    background: #79ABB5;
    color: #FFF;
}

.lista-row-panel-camas.seleccionada > div {
    background: #79ABB5;
    color: #FFF;
}

.lista-estado-pediatrico {
    background: #78B5F2;
    color: white;
    font-size: 10rem;
}

.lista-estado-panel-camas {
    color: white;
}

.lista-estado-cama-libre, .lista-estado-cama-vestida {
    background: #5cb85c; /*background: #026376;*/
}

.lista-estado-cama-reservada {
    background: #7E408E;
}

.lista-estado-cama-sincolchon {
    background: #071E3A;
}

.lista-estado-cama-limpia {
    background: #75A3AD;
}

.lista-estado-cama-contaminada {
    background: #BA2B2B;
}

.lista-estado-cama-mujeres {
    background: #AA1556;
}

.lista-estado-cama-sucia {
    background: #A27421;
}

.lista-estado-cama-descompuesta {
    background: #DCCA76;
}

.lista-estado-cama-hombres {
    background: #35599F;
}

.lista-estado-cama-ocupada {
    background: #026376;
}

.lista-miniatura-panel-camas > div.icono {
    background: #BCBEC0;
    color: #fff;
}

.lista-miniatura-panel-camas > div.iconoNoInfo {
    color: #fff;
    color: #7ba9b9;
}


/***************************************************
             Tareas
***************************************************/
.tareaInfoContainer:hover {
    color: #31585E;
    cursor: pointer;
    background: #E6E7E8;
}


/************************************/
/*           ANIMACIONES            */
/************************************/

@keyframes idigitales-latidoslight {
    0% {
        box-shadow: none;
    }

    10% {
        box-shadow: 0 0 5rem 5rem rgba(121,171,181,.2);
    }

    20% {
        box-shadow: 0 0 5rem 5rem rgba(121,171,181,.4);
    }

    30% {
        box-shadow: 0 0 5rem 5rem rgba(121,171,181,.6);
    }

    40% {
        box-shadow: 0 0 5rem 5rem rgba(121,171,181,.8);
    }

    50% {
        box-shadow: 0 0 5rem 5rem rgba(121,171,181,1);
    }

    60% {
        box-shadow: 0 0 5rem 5rem rgba(121,171,181,.8);
    }

    70% {
        box-shadow: 0 0 5rem 5rem rgba(121,171,181,.6);
    }

    80% {
        box-shadow: 0 0 5rem 5rem rgba(121,171,181,.4);
    }

    90% {
        box-shadow: 0 0 5rem 5rem rgba(121,171,181,.2);
    }

    100% {
        box-shadow: none;
    }
}

/***************************************************
           Checkbox Switchs
***************************************************/

.crane-checkboxswitch input[type="checkbox"]:checked + label .crane-switch {
    background: rgb(191, 218, 224);
}

.crane-checkboxswitch input[type="checkbox"] + label .crane-switch {
    background: transparent;
}

.crane-switch .crane-toggle {
    box-shadow: 1rem 2rem 5rem rgba(0, 0, 0, 0.5);
}

.crane-switch .crane-toggle {
    background: #78aab5;
}

.crane-switch {
    border: 1rem solid #bbbbbb;
}

.crane-toggle-button > div {
    background: #EFEFEF;
    color: #969696;
}

    .crane-toggle-button > input[type=radio]:checked + div,
    .crane-toggle-button > input[type=checkbox]:checked + div,
    .crane-toggle-button > div:hover {
        background: #74A3AD;
        color: white;
    }

/***************************************************
           Range
***************************************************/

input[type=range] {
    border: 1px solid white;
}

    /* GrupBox - Estilos para Navegadores Opera Safari Chrome */
    input[type=range]::-webkit-slider-runnable-track {
        background: #ddd;
    }

    input[type=range]::-webkit-slider-thumb {
        background: #79ABB5;
    }

    input[type=range]:focus::-webkit-slider-runnable-track {
        background: #ccc;
    }

    /*  GrupBox - Estilos para Firefox */
    input[type=range]::-moz-range-track {
        background: #ddd;
    }

    input[type=range]::-moz-range-thumb {
        background: #79ABB5;
    }

    /*hide the outline behind the border*/
    input[type=range]:-moz-focusing {
        outline: 1rem solid white;
    }

    input[type=range]::-ms-track {
        /*remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead */
        background: transparent;
        /*leave room for the larger thumb to overflow with a transparent border */
        border-color: transparent;
        /*remove default tick marks*/
        color: transparent;
    }

    /* GrupBox -  Estilos para Explorer */
    input[type=range]::-ms-fill-lower {
        background: #777;
    }

    input[type=range]::-ms-fill-upper {
        background: #ddd;
    }

    input[type=range]::-ms-thumb {
        background: #79ABB5;
    }

    input[type=range]:focus::-ms-fill-lower {
        background: #888;
    }

    input[type=range]:focus::-ms-fill-upper {
        background: #ccc;
    }

input:checked + .slider {
    background-color: #79ABB5;
}

input:focus + .slider {
    box-shadow: 0 0 1rem #79ABB5;
}

/***************************************************
           tabs izquierda
***************************************************/
.crane-navTab > label {
    color: #f1f2f2;
}

.crane-navTab {
    background: #79ABB5;
}

    .crane-navTab > input[type=radio]:checked + label {
        color: #79ABB5;
        background: #fff;
    }

.crane-bodyTab {
    background: #fff;
}

/***************************************************
           Fieldset
***************************************************/


.crane-fielset {
    border: 1rem solid #bcbec0;
}

.crane-fielset-title {
    border-bottom: 1px solid #d3d3d3;
    background-color: #EEE;
}

    .crane-fielset-title > label {
        color: #577E84;
    }


.crane-fielset-titleBtns > div {
    background: #ACACAD;
    color: #fff;
}

.crane-fielset-title-tools-minimize:before,
.crane-fielset-title-tools-maximize:before {
    color: #bcbec0;
}


/***************************************************
         alertify
***************************************************/

.ajs-commands button.crane-btnAlertify {
    background: #79ABB5 !important;
    color: #ffffff;
}


.ajs-content .panelFormDataAlertify {
    border: 1rem solid #BCBEC0;
}



/************** estilo item listasconfig **************/

.crane-itemListConfig {
    color: #000;
}

    .crane-itemListConfig > div,
    .crane-itemListConfig > label {
        border: 2rem solid #d3d3d3;
        background-color: #f1f2f2;
    }

    .crane-itemListConfig > input:checked + label {
        border: 2px solid #79abb5;
    }