:root {
    --borde: rgb(73,112,138);
    --bg : #FFF;
    --obscuro: rgb(73,112,138);
    --medio:  rgb(136,171,194);
    --claro:  rgba(208,224,235, 1);
    --claro_trans : rgba(208,224,235, 0.5);
    --fuentes: rgb(0,43,51);
    --claro_trans: rgba(208,224,235, 0.5);
}
@media print
{    
    .no-print, .no-print *
    {
        display: none !important;
    }
}

fieldset {
    background-color: var(--claro_trans); 
    border: groove 2px var(--borde);
    -moz-border-radius:5px;
    -khtml-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

.titulo{
    border-width: 0px 1px 0px 1px;
    border-color: rgba(0, 0, 0, .20);
    border-style: ridge;
    font-weight:bold;
    background-color: rgba(255, 255, 255, .2);
}

input:invalid { 
    border: 2px solid red;
}

body,h1,h2,h3,p,quote,small,form,input,ul,li,ol,label{margin:0px;padding:0px;}
.clear {clear: both;height: 0;line-height: 0;}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearfix {display: inline-block;}
* html .clearfix {height: 1%;}
.clearfix {display: block;}
*.clearfix {height: 1%;}
html, body{height: 100%;overflow: hidden;}
body{font-family: sans-serif; font-size: 14px; color: var(--fuentes); background: var(--bg) no-repeat fixed; background-size: cover;}
.box {    display: flex;    flex-flow: column;    height: 100%;}

.box .header {
    flex: 0 1 auto;
    text-align: center;
    font-size: 2em;
    font-weight: 800;
}

.box .content {
    flex: 1 1 auto;
    overflow-y:auto;
}

.box .footer {
    flex: 0 0 10px;
    background-color: #FFF; 
    color: var(--fuentes); 
    border-top: 5px ridge var(--obscuro);
    line-height: 10px; 
    padding:10px;
    z-index:99
}

table input {
    font-size:1em; !important
}

h1{
    /*    color: var(--fuentes); */
    font-weight: 900;
}

.container {
    margin-top:20px;	
    border:2px solid var(--borde);
    background: var(--claro);
    padding:15px;
    position:relative;
    margin:10px auto;
    -moz-border-radius:5px;
    -khtml-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    width: 90%;
}

input:read-only{
    background: rgba(0,0,0,0.2);
}

input, button {
    color: var(--fuentes);
    /*min-width: 100px;*/
    font-size: 1em;
    padding:5px;
    -moz-border-radius:5px;
    -khtml-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

input:focus, button:focus{
    outline: none;
}

.block{
    position: fixed;
    left: 0px;
    top: 0px;
    width:100%;
    height:100%;
    background :rgba(16, 56, 72, .6);
}

.block span{
    display: block;
    text-align: center;
    position:relative;
    border-color: var(--obscuro);
    border-style:solid;
    border-width: 5px 0px 5px 0px;
    padding: 10px;
    font-size: 2em;
    background: #ffffff;
    top:45%;
    margin: auto;
}

#login{
    top:40px;
    text-align: center;
}


#logo{
    width:250px;
    position:relative;
    vertical-align: middle;
    margin:auto;
}

.bloque_inicio{
    background: var(--medio);
    transition: all 0.3s cubic-bezier(0.18, 0.89, 0.32, 1.28) 0s;
    cursor: pointer;
    padding:40px;
    width: 30vw;
    height: 20vh;
    position:relative;  
    margin-top:50px;
}

.bloque_inicio.izquierda{
    left:5px; 
}

.bloque_inicio.derecha{
    float: right;
    right: 5px;
    margin-top: -180px
}

.bloque_inicio.izquierda:hover {
    background: none repeat scroll 0 0 var(--obscuro);
    color: #FFF !important;
    left: 25px; 
}

.bloque_inicio.derecha:hover {
    background: none repeat scroll 0 0 var(--obscuro);
    color: #FFF !important;
    right: 25px; 
}

.bloque_inicio p{
    font-size:0.9em;
}

.hidden {
    padding: 0px;
    visibility: hidden;
    opacity: 0;
    height: 0px;
    transition: all 0s 1s, opacity 1s linear;
    margin-top: 10px !important;
}

#contenedor_principal{
    transition: all 0s 1s, opacity 1s linear;
}   

.seleccionado {
    background: none repeat scroll 0 0 #8DBF41 !important;
}

#mainw button {
    font-size:1em !important;
}



.grow {transition: all .2s ease-in-out; }
.grow:hover {transform: scale(1.02); }
img.grow:hover {transform-origin: 0% 0%; transform: scale(2) !important; }
.up:after {content: " ▼ ";}
.down:after {content: " ▲ ";}

.tabla {display: table;border:0px;padding:0px;margin:5px; width:95%; position:relative; background-color:var(--claro)_trans}
.tabla .deac {display: table-cell;border:0px;line-height: 3.5vmin;margin:0px; background-color: #999 !important;}
.tabla .td {display: table-cell;border:0px;line-height: 3.5vmin;margin:0px; }
.tabla .th {display: table-header-group; font-weight:bold; background-color: var(--obscuro) !important; color: var(--claro); cursor:cell !important; padding:10px;}
.tabla .th .td:hover{color: var(--medio) !important;}
.tabla .tr {display:table-row; cursor:pointer;}
.tabla .tr:hover {cursor:pointer ;background-color: var(--medio) !important; color:#FFF; }
.tabla .tr:active {background-  color: var(--obscuro) !important; }
.tabla .tr:nth-child(even) {background-color: var(--claro);}
.tabla .seleccionable {cursor: pointer;}
.tabla .seleccionable:active {background-color: var(--medio) !important; }


.tabla .head{
    display: table-row;
    padding:4px;
    background-color: var(--medio);
}

.celda{
    display:table-cell;
    padding:10px;
}

.fila:hover{
    background-color: var(--obscuro);
    color:white;
    cursor: pointer;
}
.fila{
    display:table-row;
    padding-top:4px;
    padding-left:2px;
    padding-right:2px;
}

.autocomplete {
    position: fixed;
    border-width: 0px 2px 2px 2px;
    border-color: var(--obscuro);
    border-style: solid;
    background-color: white;
}

.autocomplete span {
    display:block;
}

.autocomplete span:hover{
    background-color: var(--medio);
    color: var(--claro);
    cursor: pointer;
}
.is-selected .pika-button{color:#333;font-weight:bold;background:#3af;box-shadow:inset 0 1px 3px #178fe5;border-radius:3px}.is-inrange .pika-button{background:#d5e9f7}.is-startrange .pika-button{color:#fff;background:#6cb31d;box-shadow:none;border-radius:3px}.is-endrange .pika-button{color:#fff;background:#3af;box-shadow:none;border-radius:3px}.is-disabled .pika-button,.is-outside-current-month .pika-button{pointer-events:none;cursor:default;color:#999;opacity:.3}.pika-button:hover{color:#fff;background:#ff8000;box-shadow:none;border-radius:3px}.pika-table abbr{border-bottom:0;cursor:help}
