﻿/*reseteando estilos por defecto*/
* {
margin: 0;
padding: 0;
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-ms-box-sizing:border-box;
}

#content img,.forms {
-ms-user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
cursor: default;
}

html,body{
height: 100%;
}

*,*:active,*:focus{
outline: none !important;
}

/*estilo contenedor principal de vistas*/
#containerMain {
background: white;
font-family: 'montserrat-regular';
height: 100%;
}
/*tipografias del sistema*/
@font-face {
font-family: "montserrat-regular";
src: url("fonts/Montserrat-Regular.ttf");
}
@font-face {
font-family: "montserrat-light";
src: url("fonts/Montserrat-Light.ttf");
}

.tituloE{
    color: rgb(234,83,83);
    font: 32pt 'montserrat-light';
    text-align: center;
    margin: 5px;
    text-transform: capitalize;
}

/*apariencia de notificacion tipo 1*/
#notif {
height: calc(100% - 79px);
text-align: center;
}
#notif span {
    background: #F5F5F5;
    padding: 5px;
    color: red; 
    font: 32pt 'montserrat-light'; 
    text-align: center; 
    text-transform: capitalize; 
    display:block;
    }

/*apariencia de la pagina de registro*/
.reg div {
margin: 5px;
}
.reg {
width: 850px;
overflow: auto;
margin: 15px auto;
padding: 5px;
}
 .reg label {
    user-select: none;
   -moz-user-select: none;
   -webkit-user-select: none;
   -ms-user-select: none;
   text-transform: capitalize;
   color: #989898; 
   font: 12pt 'montserrat-light'; 
    }
.reg .field-validation-error{
 display: block;
 text-transform: uppercase;
 background: rgb(254,210,211);
 border:1px solid rgb(220,148,159);
 color: rgb(155,60,67);
 text-align: justify;
 user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
text-align: center;
cursor: default;
 padding: 5px;
 width: 100%;
 margin-top: 1px;
 margin-bottom: 11px;
 font: 10pt 'montserrat-regular';
 -moz-animation: notifA 1s ease;
 -webkit-animation:notifA 1s ease;
 animation:notifA 1s ease;
        }

@-moz-keyframes notifA{
0% { -moz-transform: translate(2px, 1px); }
10% { -moz-transform: translate(-1px, -2px); }
20% { -moz-transform: translate(-3px, 0px); }
30% { -moz-transform: translate(0px, 2px); }
40% { -moz-transform: translate(1px, -1px); }
50% { -moz-transform: translate(-1px, 2px); }
60% { -moz-transform: translate(-3px, 1px); }
70% { -moz-transform: translate(2px, 1px); }
80% { -moz-transform: translate(-1px, -1px); }
90% { -moz-transform: translate(2px, 2px); }
100% { -moz-transform: translate(1px, -2px); }
}
@-webkit-keyframes notifA{
0% { -webkit-transform: translate(2px, 1px); }
10% { -webkit-transform: translate(-1px, -2px); }
20% { -webkit-transform: translate(-3px, 0px); }
30% { -webkit-transform: translate(0px, 2px); }
40% { -webkit-transform: translate(1px, -1px); }
50% { -webkit-transform: translate(-1px, 2px); }
60% { -webkit-transform: translate(-3px, 1px); }
70% { -webkit-transform: translate(2px, 1px); }
80% { -webkit-transform: translate(-1px, -1px); }
90% { -webkit-transform: translate(2px, 2px); }
100% { -webkit-transform: translate(1px, -2px); }
}
@keyframes notifA{
0% { transform: translate(2px, 1px); }
10% { transform: translate(-1px, -2px); }
20% { transform: translate(-3px, 0px); }
30% { transform: translate(0px, 2px); }
40% { transform: translate(1px, -1px); }
50% { transform: translate(-1px, 2px); }
60% { transform: translate(-3px, 1px); }
70% { transform: translate(2px, 1px); }
80% { transform: translate(-1px, -1px); }
90% { transform: translate(2px, 2px); }
100% { transform: translate(1px, -2px); }
}

.reg label{
    display: block !important;
    width: 275px !important;
    text-align: left !important;
    padding: 5px;
}
.reg form > div > div{
    display: inline-block;
    vertical-align: top;
    width: 261px;
}
 .reg input[type="submit"] {
background: rgb(9,46,110);
color: white;
border: 1px solid #2F5FB2;
text-transform: uppercase;
margin-top: 15px;
margin-bottom: 5px;
padding: 9px 3px;
font: 12pt 'montserrat-regular';
cursor: pointer;
width: 100%;
    }
 .reg input[type="submit"]:hover, .reg input[type="submit"]:focus {
     background: rgb(14,75,177);   
        }
.reg input[type="text"], .reg input[type="email"],.reg input[type="password"]{
width: 100%!important;
    }

/*apariencia de la pagina de login y  de registro*/
#login {
padding: 5px 10px;
width:475px;
border-radius: 5px;
position: relative;
left: calc( (100% - 475px) / 2);
text-align: center;
}
#login form > div{
    margin: 17.5px 0px!important;
}

#globalSeleccion {
padding: 25px 10px;
width:800px;
position: relative;
left: calc( (100% - 800px) / 2);
top: 25px;
text-align: center;
border: 1px solid #D9D9D9;
background: #F5F5F5;
box-shadow: 0px 0px 15px #D9D9D9;
}
#globalSeleccion * {
user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-webkit-user-select: none;
cursor: default;
    }

#globalSeleccion > form > div {
display: inline-block;
vertical-align: middle;
margin: 0px 25px;
    }
    #globalSeleccion > form > div:last-child {
    display: block;
    }
#globalSeleccion > form > div > div {
margin: 25px 0px;
background: white;
    }


#globalSeleccion > form > div > div > h1 {
font: 900 14pt 'montserrat-light';
text-transform: uppercase;
color: #FA8C00;
letter-spacing: 1.5px;
margin: 0px 5px;
width: 350px;
    }
#globalSeleccion > form > div > div > label{
display: inline-block;
margin: 15px 0px;
text-transform: lowercase;
font: 12pt 'montserrat-regular'; 
cursor: pointer;
color: #2E92CF;
text-decoration: underline;
    }


#login label {
    display: block;
    text-align: left;
    user-select: none;
   -moz-user-select: none;
   -webkit-user-select: none;
   -ms-user-select: none;
   text-transform: uppercase;
   color: #989898;
   font: 12pt 'montserrat-light';
   text-align: center;
    }

#login input[type='text'], #login input[type='password'],.reg input[type='text'],.reg input[type='password'],.reg input[type="email"] {
width: 450px;
padding: 9px 3px;
border: 1px solid #D9D9D9;
background: rgb(244,245,249);     
    }
#login input[type='text']:focus, #login input[type='password']:focus,.reg input[type='text']:focus,.reg input[type='password']:focus,.reg input[type="email"]:focus {
outline: none;
box-shadow: none;      
    }
#login input[type="checkbox"]:checked + div > div{
    display: block;
    }



#login div {
user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
cursor: default;
}

.checkbox > input[type="checkbox"] {
display: none;
}
.checkbox > div{
    background: white;
    width: 17px !important;
    height: 17px !important;
    border: 1px solid #D9D9D9;
    margin: auto;
    padding: 2px;
}
 .checkbox div > div {
background: gray;
width: 100%;
height: 100%;
outline: none;
border: none;
display: none;
    }


#login form > div,#login > div{
margin: 5px 0px;
    }

/*apariencia de botones de login*/
#login input[type="submit"],#login input[type="button"] {
background: #4779CF;
color: white;
border: 1px solid #2F5FB2;
width: 450px;
padding: 9px 3px;
margin: 1.5px 0px;
text-transform: capitalize;
cursor: pointer;
font: 12pt 'montserrat-light';
}

.button-action{
    display: block!important;
    margin: 7.5px auto!important;
    font-size: 10pt!important;
}
.button,.buttonLink {
background: rgb(9,46,110);
color: white;
border: 1px solid #2F5FB2;
width: 350px;
padding: 9px 3px;
margin: 1.5px 0px;
text-transform: capitalize;
cursor: pointer !important;
font: 12pt 'montserrat-regular';
text-align: center;
}
.buttonOption{
    width: 47px!important;
    height: 37px!important;
    display: block!important;
    background: rgb(9,46,110);
    color: white;
    border: 1px solid #2F5FB2;
    cursor: pointer;
}
.buttonOption:hover{
    background: rgb(14,75,177);  
}

.buttonLink::first-letter{
    text-transform: uppercase;
}
.buttonLink{
    text-transform: lowercase;
    display: block;
    margin: 1.5px auto!important;
    text-decoration: none;
}
.button:hover, .button:focus,.buttonLink:hover,.buttonLink:focus {
background: rgb(14,75,177); 
    }
a.button:hover,a.buttonLink:hover{
    color: white!important;
    text-decoration: none!important;
}
a.button,a.buttonLink{
    text-transform: capitalize!important;
    padding: 11px 3.5px!important;
}
a.button *,a.buttonLink *{
    margin: 0px 5px!important;
    display: inline-block!important;
    vertical-align: middle!important;
}

#login input[type="submit"]:hover, #login input[type="button"]:hover, #login input[type="button"]:focus, #login input[type="submit"]:focus 
{
background: #6193E9;    
}


#login img {
margin: 5px;
user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
}

#login .field-validation-error{
 display: block;
 text-transform: uppercase;
 background: rgb(254,210,211) url("images/notifications/error.png") no-repeat center left;
 border:1px solid rgb(220,148,159);
 color: rgb(155,60,67);
user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
cursor:default;
text-align: center;
 font: 10pt 'montserrat-regular';
 padding: 9px 0px 9px 31px;
 width: 450px;
 margin: 2.75px auto 11px auto;
 -moz-animation: notifA 1s ease;
 -webkit-animation:notifA 1s ease;
 animation:notifA 1s ease;
}

/*apariencia de logos de encabezado*/
#logosEnc {
background: #3b77e0 url("images/cintillo.png") repeat-x bottom;
height: 119px;
}

#logosEnc img,#logosEnc h1{
    display: inline-block;
    vertical-align: middle;
}
#logosEnc h1{
    color: white;
    font: 24pt 'montserrat-regular';
    text-transform: capitalize;
}

#hideMenu{
    display: block;
    width: 38px!important;
    height: 38px!important;
    font-size: 18pt!important;
    background: transparent!important;
    text-align: center!important;
    float: right;
}

/*apariencia de notificacion de error*/
.errorMessage {
display: block;
margin: 3px 0;
border:1px solid rgb(220,148,159);
color: rgb(155,60,67);
user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
text-align: center;
cursor: default;
font:11pt 'montserrat-regular';
text-transform: capitalize;
padding: 5px 0px 5px 33px;
background: rgb(254,210,211) url("images/notifications/error.png") no-repeat center left;
}
/*apariencia de menu de opciones del sistema*/
#sub {
background:#3b77e0 url("images/cintillo.png") repeat-x bottom;
height: 129px;
}
#sub .logotipo{
    float: left;
    margin-top: 9.5px;
}
#sub .logotipo a{
    text-decoration: none;
    color: white;
    font: 24pt 'montserrat-regular';
    text-transform: capitalize;
}
#sub .logotipo a,#sub .logotipo img{
    display: inline-block!important;
    vertical-align: middle!important;
}
#sub .login-info{
    clear: both;
    text-align: right;
    position: absolute;
    width: 100%;
    top: 76px;
}
#sub .login-info div,#sub .login-info a{
    display: inline-block!important;
    vertical-align: middle!important;
}

.errorMessage > span > span,.notificacionSistema > span > span,.successMessage > span > span{
    counter-increment: childs;
}

.errorMessage > span > span::before,.notificacionSistema > span > span::before,.successMessage > span > span::before{
    content: counter(childs,square);
}

.errorMessage > span > span,.notificacionSistema > span > span,.successMessage > span > span{
    text-align: left;
    display: block;
    width: 55%;
    margin: auto;
}






#cont {
height: calc( 100% - 129px);
}
#menu {
overflow-x: hidden;
overflow-y: auto;
}

#menu, #contain {
float: left;
height: 100%;
}
#contain{
    overflow: auto;
}
#contain {
width: calc(100% - 371px);
padding: 5px;
}
#menu {
width: 371px;
background:#F4F4F4;
}
.hide-main{
    display: inline-block!important;
    cursor: pointer;
    width: 32px;
    height: 32px;
    margin-left: 322px;
    vertical-align: bottom;
    text-align: center;
    color: white;
    padding: 6px;
    font-size: 24px;
}

    
#menu ul {
list-style-position: inside;
list-style-type: none;
    }

#menu > ul > li > a {
 text-transform: uppercase;   
    }

#menu ul li a{
display: block;
padding: 3px 5px;
font: 11pt 'montserrat-light';
text-decoration: none;
white-space: nowrap;
text-align: justify;
color: #6a6a6a;
-moz-transition: all 1s ease-in-out;
-ms-transition: all 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
    }

    #menu ul li a img {
    display: inline-block;
    vertical-align: middle;
    margin: 0px 5px 0px 0px;
    }

#menu ul li a:hover,.optionHover,.active,.menu-active{
background: #E5E5E5;
    }

.submenu {
display: none;
list-style-type: none !important;
color: #6a6a6a;
}
.submenu > li > a {
display: block !important;
margin: 2.5px 0px !important;
text-align: left !important;
padding: 5px !important;
-moz-transition: all 1s ease-in-out;
-ms-transition: all 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
cursor: pointer;
padding-left: 32px !important;
    }

.submenu li a:hover,.optionActive {
background: rgb(211,211,211);
    }

/*apariencia de tablas*/
.tableResume{
    table-layout: fixed;
}
.tableResume td{
    overflow: hidden;
    text-overflow:ellipsis;
}
.tableSystem table tbody tr td, .tableSystem2 table tbody tr td, .tableControl table tbody tr td {
    background: transparent !important;
}

.tableSystem input[type='file'],.tableSystem2 input[type='file'],.tableControl input[type='file']{
    display: none;
}

.tableSystem label[for], .tableSystem2 label[for], .tableControl label[for]{
    display: block;
    width: 47px!important;
    height: 33px!important;
    margin: auto!important;
    background: rgb(9,46,110);
    color: white;
    border: 1px solid #2F5FB2;
    cursor: pointer;
    text-align:center;
    font: 18pt 'montserrat-regular';
}
.tableSystem label[for]:hover, .tableSystem2 label[for]:hover, .tableControl label[for]:hover{
background: rgb(14,75,177);
}

.tableSystem label[for]:before, .tableSystem2 label[for]:before, .tableControl label[for]:before{
    content: "+";
}

.tableSystem,.tableSystem2,.tableSystem3,.tableControl {
width: 100%;
border-spacing: 0px;
background:#F4F4F4;
margin: 35px 0px;
}
.tableSystem3 span,.tableSystem3 a{
    display:inline-block!important;
    vertical-align: middle!important;
    margin:7.5px 3.5px!important;
}
.tableSystem > tbody > tr:nth-child(odd),.tableSystem2 > tbody > tr:nth-child(odd),.tableControl > tbody > tr:nth-child(odd){
     background: rgb(219,219,219);
    }
.tableSystem > tbody > tr:nth-child(even),.tableSystem2 > tbody > tr:nth-child(even),.tableControl > tbody > tr:nth-child(even){
      background: rgb(231,231,231);
    }
.not-color-cell > td{
        background: rgb(219,219,219)!important;
}

.tableSystem3 thead tr th{
text-transform: uppercase;
font:14pt 'montserrat-light';
padding: 9px 5px;
background: rgb(9,46,110);
color: white;
text-align: left;
}

.tableSystem3 > tbody tr td:first-child{
text-transform: uppercase;
font:bold 10pt 'montserrat-regular' !important;
text-align: left;
padding: 5px;
background: transparent !important;
color: black !important;
width:19%;
}
.tableSystem3 > tbody > tr:nth-child(odd) td:last-child{
    background: rgb(219,219,219);
    padding: 5px;
}
.tableSystem3 > tbody > tr:nth-child(even) td:last-child{
    background: rgb(231,231,231);
    padding: 5px;
}


.tableSystem tbody tr td a ,.tableSystem2 tbody tr td a,.links,.tableControl tbody tr td a{
display: inline-block;
margin: 0px 5px;
color: #2E92CF;
text-transform: uppercase;
text-align: center;
font: 9pt 'montserrat-regular';
vertical-align: top;    
    }

.tableSystem tbody tr td:last-child,.tableSystem2 tbody tr td:last-child,.tableControl tbody tr td:last-child{
text-align: center;
}
.tableSystem thead tr:first-child th,.tableControl thead tr:first-child th{
text-transform: uppercase;
font:14pt 'montserrat-light';
padding: 9px 5px;
background: rgb(9,46,110);
color: white;
text-align: left;
    }

.tableSystem thead,.tableSystem2 thead,.tableControl thead{
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none;
cursor: default;
}
.tableSystem thead tr:last-child th,.tableSystem2 thead tr th,.tableControl thead tr:last-child th{
text-transform: uppercase;
font:bold 10pt 'montserrat-regular' !important;
text-align: left;
padding: 5px;
background: transparent !important;
color: black !important;
    }

.tableSystem tbody tr td,.tableSystem2 tbody tr td,.tableControl tbody tr td {
font: 11pt 'montserrat-light';
padding: 3px;
text-align: left !important;
    }

 .tableControl tbody tr td:last-child {
 width: 150px;
 text-align: center!important;
        }

/*apariencia de enlaces*/
.links {
display: block !important;
font: 12pt 'montserrat-light' !important;
margin: 15px 0px !important;
text-align: center !important;
}

/*apariencia de formulario de busqueda*/
.busquedas {
margin: 25px 0px;
text-align: left;
}

.busquedas-break > div,.busquedas-break form > div{
    display: block !important;
}
.busquedas-break > div > label,.busquedas-break form > div > label{
    width: 95px !important;
    display: inline-block !important;
    margin: 11px 3px !important;
}
.busquedas-break input[type="submit"],.busquedas-break input[type="button"]{
    margin:9px 0px 9px 110px !important;
}

.grupoBusquedas div{
    width: 24%!important;
    vertical-align: bottom!important;
}
.grupoBusquedas div input,.grupoBusquedas div select{
    height: 35px!important;
}
.formsModal form{
    width: 595px!important;
}

.formsModal form > div label{
    width: 175px!important;
}

.formsModal form input[type="submit"]{
    margin-left: 187px!important;
}
.formsModal form .field-validation-error{
    display: block !important;
    margin: 3px 0px 3px 187px !important;
    width: 395px !important;
}

.forms input[list],.busquedas input[list]{
    -moz-appearance: none!important;
    -webkit-appearance: none!important;
    -ms-appearance: none!important;
    appearance: none!important;
}

.forms input[type="button"],.forms input[type="file"]{
width: 100%!important;
height: 40px !important;
    }
.forms input[readonly] {
    background: rgb(240,240,240) !important;
    color: rgb(109,109,109) !important;
    border: 1px solid rgb(217,217,217) !important;    
}

    .busquedas > div {
    display: inline-block;
    vertical-align: bottom;
    margin: 0px 2.5px;
    padding: 0px!important;
    }
    .busquedas > div *{
        margin: 0px!important;
    }
    .busquedas > div:first-child{
        width: 45%;
    }
    .busquedas > div:not(:first-child)
    {
        width: 25%;
    }


.busquedas input[type='text'], .busquedas select{
padding: 6.5px 3px!important;
border: 1px solid #D9D9D9;
background: url("images/ico_busqueda.png") no-repeat right center;
width: 100%!important;
}
.busquedas select{
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
}

.busquedas label {
    margin: 5px;
    color: #989898;
    text-transform: uppercase;
}


    .busquedas input[type="button"],.busquedas input[type="submit"] {
    height: 35px !important;
    padding: 2px !important;
    background: -webkit-linear-gradient(top,rgb(242,242,242),rgb(206,206,206));
    background: -moz-linear-gradient(top,rgb(242,242,242),rgb(206,206,206));
    background: -ms-linear-gradient(top,rgb(242,242,242),rgb(206,206,206));
    background: linear-gradient(top,rgb(242,242,242),rgb(206,206,206));
    color: rgb(90,90,90);
    border: 1px solid rgb(198,198,198);
    padding: 9px 3px;
    width: 100%!important;
    text-transform: uppercase;
    cursor: pointer;
    font:  12pt 'montserrat-regular';
    }
 .busquedas input[type="button"]:hover, .busquedas input[type="button"]:focus, .busquedas input[type="submit"]:hover, .busquedas input[type="submit"]:focus 
 {
         background: rgb(239,239,239);
 }

  .busquedas select {
 height: 35.5px;
        }

  /*personalizacion de control de seleccion*/
.forms select{
    border: 1px solid #D9D9D9;
    padding: 6.5px 3px!important;
    font-family: 'montserrat-regular';
    background: rgb(244,245,249);  
}
select optgroup {
color: black !important;
font: 900 12pt 'montserrat-regular';
padding: 1.5px !important;
}
select option{
    font: 12pt 'montserrat-regular';
    color: black !important;
    text-align: left !important;
    padding: 1.5px !important;
}
/*apariencia de formularios*/
.forms form > div ,.forms form > div > div{
        text-align: left;
        }
.forms form > div > div{
    display: inline-block!important;
    width: 33%!important;
}
#observacionesInfo > div,.forms div.lista-observs > div{
    display:block!important;
    width: 100%!important;
}
.forms form div > div > label{
    display: block!important;
    width:100%!important;
}

.forms form > div  > div > label,
.forms form > div > div > select,
.forms form > div > div > textarea,
.forms form > div > div > input[type='text'],
.forms form > div > label,
.forms form > div > select,
.forms form > div > textarea,
.forms form > div > input[type='text'],
.forms .field-validation-error{
   vertical-align: middle !important;
   margin: 0px 2.5px !important;
}

.forms form{
    text-align: left!important;
}
.forms form > div {
    width: 24.55%!important;
    display: inline-block!important;
    vertical-align: top;
}

.forms form{
width: 93%;
margin: auto;
margin-bottom: 9px;
}

.forms form > div:last-child{
    display: block!important;
    position: relative;
    left: calc(100% - 24.55%);
    padding: 0px!important;
    margin: 0px!important;
}
.forms form > div:last-child input[type="submit"],.forms form > div:last-child input[type="button"]{
    margin: 0px!important;
    }

.forms form > div.fix-reg:last-child{
    width: 450px!important;
    left: calc(100% - 450px)!important;
}
.forms form > div.fix-reg:last-child input[type="submit"],.forms form > div.fix-reg:last-child input[type="button"]{
    width: 49.5%!important;
    display: inline-block!important;
}


.forms > form + form * {
margin-top: 0px!important;
}
.forms > form + form {
padding-top: 0px!important;
}
span.validationStyle{
display: block;
width: 100%;
text-transform: capitalize;
background: rgba(254,210,211,0.83) url("images/notifications/error.png") no-repeat center left;
border:1px solid rgb(220,148,159);
text-align: center;
cursor: default;
padding: 9px 0px 9px 31px;
margin: 1.15px 2.5px!important;
color: rgb(155,60,67);
cursor:default;
font: 10pt 'montserrat-regular';
-moz-animation: notifA 1s ease;
-webkit-animation:notifA 1s ease;
animation:notifA 1s ease;
user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
height: 49.9px;
overflow: auto;
}
input.validationStyle{
    border: 1px solid red!important;
}
.forms .field-validation-error{
 display: inline-block;
 text-transform: uppercase;
 background: rgb(254,210,211) url("images/notifications/error.png") no-repeat center left;
 border:1px solid rgb(220,148,159);
 color: rgb(155,60,67);
 text-align: center;
 cursor: default;
 padding: 9px 0px 9px 33px;
 height: 49.9px;
 width: 100%!important;
 overflow: auto;
 margin: 2.75px 2.5px!important;
 font: 10pt 'montserrat-regular';
 -moz-animation: notifA 1s ease;
 -webkit-animation:notifA 1s ease;
 animation:notifA 1s ease;
 user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
}


.forms form > div > div,.forms form > div{
margin: 5px 0px;
}

.forms form > div label {
padding: 5px;
width: 100%!important;
display: block;
font: 14pt 'montserrat-light';
text-transform: lowercase;
color: #989898;
}
    .forms form > div label::first-letter {
    text-transform: uppercase;
    }

.forms form > div{
    margin: 9px 0px !important;
}
.forms form{
padding: 5px;
text-align: center;
}

.forms form input[type="submit"],.forms form input[type="button"] {
   background: rgb(9,46,110);
   color: white;
   display: block;
   padding: 5px 3px;
   width: 100%!important;
   text-transform: uppercase;
   border: 1px solid #2F5FB2;
   cursor: pointer;
   font:  12pt 'montserrat-regular';
   height: 35.5px !important;  
   margin: 1.5px 1.75px!important;
    }

.forms form input[type="submit"]:hover,.forms form input[type="submit"]:focus,.forms form input[type="button"]:hover,.forms form input[type="button"]:focus {
    background: rgb(14,75,177);
    }

 .forms form label {
 text-align: left;
 user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 -webkit-user-select: none;
 }
.reg form select{
    width: 255px!important;
    border: 1px solid #D9D9D9;
    padding: 5px;
}
.forms form div input[type="text"], .forms form div input[type="password"], .forms form div textarea, .forms form div select,input[required],select[required],.forms form div input[type="email"],.forms input[type="datetime"],.forms input[type="file"],.forms input[type="number"] {
width: 100%!important;
padding: 9px 3px;
height: 33px;
border: 1px solid #D9D9D9;
background: rgb(244,245,249);
color: black!important;
text-align: left!important;  
}
.forms input[type="file"] {
border: none;
background: rgb(229,229,229);    
padding: 0;
}
.forms form div textarea {
height: 127px !important;
    }
.forms h2 ,.titulo,.titulo2{
text-align: center;
text-transform: uppercase;
color: rgb(129,135,165);
margin: 15px 0px;
}
.titulo2 {
color: rgb(66,139,202)!important;
}

.titulo,.forms h2 {
padding: 5px;
font: 18pt 'montserrat-light';
}

/*notificacion de usuario*/
#messageUsuario {
color: white;
font: 12pt 'montserrat-regular';
position: relative;
user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
cursor: default;
display: block!important;
text-align: right;
}
#messageUsuario p,#messageUsuario a{
    display: inline-block!important;
    border: 1px solid red;
    vertical-align: central!important;
}

#botonSalir{
    display: inline-block!important;
    width: 32px;
    height: 32px;
    background: url("images/iconos/salir_hover.png");
}


.tituloL {
text-transform: uppercase;
font:20pt 'montserrat-regular';
color: #17529E;
margin: 5px;
text-align: center;
}

.elemento {
display: none;
}
/*apariencia de notificacion de informacion*/
.notificacionSistema {
background: rgb(188,229,247) url("images/notifications/information.png") no-repeat center left;
text-align: center;
padding-left: 35px;
color: rgb(16,67,86);
border: 1px solid rgb(106,139,158);
font: 11pt 'montserrat-regular';
text-transform: capitalize;
margin: 19px 0px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
cursor: default;
}
/*apariencia de notificacion de advertencia*/
.warningMessage {
background: rgb(254,240,179) url("images/notifications/warning.png") no-repeat center left;
text-align: center;
padding: 5px 0px 5px 33px;
color: rgb(175,159,84);
border: 1px solid rgb(195,175,138);
font: 12pt 'montserrat-regular';
text-transform: capitalize;
margin: 19px 0px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
cursor: default;
}


/*barra de progreso*/
#progressbar {
    width: 320px;
    height: 25px;
    border: 1px solid silver;
    display: inline-block;
    color: black;
    text-shadow: 0px 0px 15px gray,0px 15px 35px silver;
    position: relative;
    left: calc((100% - 320px) / 2);
}
#progressbar p {
position: absolute;
z-index: 1001;
text-align:center;
width: 100%;
    }
#progressbar .progress{
    position: relative;
    background: -moz-linear-gradient(top, #4779CF,#416CB5);
    background: -webkit-linear-gradient(top, #4779CF,#416CB5);
    background: -ms-linear-gradient(top, #4779CF,#416CB5);
    background: linear-gradient(top, #4779CF,#416CB5);
    width: 0%;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    height: 100%;
    padding: 0 !important;
    margin:0 !important;
    display: block !important;
    border-radius: 0px!important;
}
/*boton de regreso*/

.buttonBack {
text-align: center;
text-decoration: none;
color: white;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none;
cursor: pointer;
background: #4779CF;
margin: 25px 0px 0px calc(100% - 350px) !important;
display: block;
width: 350px;
padding: 9px 5px;
font: 14pt 'montserrat-light';
border: 1px solid #2F5FB2;
text-transform: uppercase;
}
.buttonBack:focus,.buttonBack:hover {
    background: rgb(14,75,177);
    color: white;
    text-decoration: none;
    }

.successMessageN {
background: rgb(224,239,216) url("images/notifications/success.png") no-repeat center left;
border: 1px solid rgb(215,232,198);
font: 14pt 'montserrat-regular';
text-transform: capitalize;
color: rgb(71,136,72);
text-align: center;
padding: 5px 0px 5px 33px;
margin: 25px 5px;
}

.successMessage {
background: rgb(224,239,216) url("images/notifications/success.png") no-repeat center left;
border: 1px solid rgb(215,232,198);
font: 11pt 'montserrat-regular';
text-transform: capitalize;
color: rgb(71,136,72);
text-align: center;
padding-left: 35px;
margin: 25px 5px;
}
@keyframes muestra {

    from{
    opacity: 0;
    height: 0px;
    }
    to {
    opacity: 1;
    }

}
@-moz-keyframes muestra {

    from {
    opacity: 0;
    }
    to {
    opacity: 1;
    }

}

@-webkit-keyframes muestra {

      from {
    opacity: 0;
    }
    to {
    opacity: 1;
    }
}


/*apariencia de notificacion de lista de errores*/
.errorsMessages {
background: rgb(254,210,211) url("images/notifications/error.png") no-repeat top left;
border:1px solid rgb(220,148,159);
color: rgb(155,60,67);
font: 14pt 'montserrat-regular';
padding: 5px 0px 5px 33px;
margin: 35px 0px;
-ms-user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
cursor: default;
}
.errorsMessages::before 
{
  content: "Errores Encontrados: ";
  font-weight:900;
}
 .errorsMessages ul {
 list-style-position: inside;
 font-size: 12pt;
 margin: 15px 0px;
 text-align: justify;
 text-transform: capitalize;
 list-style-type: square;
        }

 /*ventana modal*/
#modal {
position:fixed;
width: 100%;
height:100%;
top: 0px;
left: 0px;
margin: 0;
background: rgba(19,19,19,0.6);
display: none;
z-index: 1011;
}

.alert div.window{
    width: 800px !important;
    height: auto !important;
    margin: 0px !important;
    top: calc((100% - 150px) / 2)!important;
    left: calc((100% - 800px) / 2)!important;
    padding: 0px !important;
    background: transparent !important;
    box-shadow: none !important;
}
 .alert div.window > div {
    top: calc((100% - 75px) / 2)!important;
    }

.alert .notificacionSistema, .alert .successMessage, .alert .errorMessage,.alert .warningMessage {
    font: 18pt 'montserrat-light' !important;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    cursor: default;
    -moz-animation: none !important;
    -webkit-animation: none !important;
     animation: none !important;
     margin: 0px !important;
}

.alert .successMessage {
    box-shadow:  0px 0px 9px rgb(224,239,216);
}
.alert .errorMessage {
    box-shadow:  0px 0px 9px rgb(254,210,211);
}

.alert .notificacionSistema {
    box-shadow: 0px 0px 9px  rgb(188,229,247);
}
.alert .warningMessage {
box-shadow: 0px 0px 9px rgb(254,240,179);
}

div.window {
background: white;
width: 975px;
position: relative;
height: 550px;
padding: 35px;
margin: 50px 0px;
left: calc( (100% - 975px) / 2);
box-shadow: 0px 0px 15px gray;
border:none;
overflow:hidden;
    }

div.window > div {
position: relative;
top: calc(  (100% - 75px) / 2);
border-radius: 15px;
    }

div.window > iframe{
    width: 100%;
    height: 100%;
}


div.window #close {
cursor: pointer;
display: block;
position: absolute;
top: 5px;
width: 21px;
height: 21px;
left: calc(100% - 32px);
    }


#notificacionMessage {
position: fixed;
bottom: 39px;
right: 0px;
padding: 15px 25px;
cursor: default;
}

.specialAlign {
margin: 0 !important;
position: relative;
z-index: 1001;
padding: 3px !important;
width: 100% !important;
top: -100%;
animation: animarSlide 2.5s 2 ease-in alternate;
-webkit-animation: animarSlide 2.5s 2 ease-in alternate;
-moz-animation: animarSlide 2.5s 2 ease-in alternate;
}
.effect {
 -moz-animation: notifA 1s ease;
 -webkit-animation:notifA 1s ease;
 animation:notifA 1s ease;
}
.specialAlign > div, .specialAlign ul {
margin: 9px !important;
padding: 0!important;
    }


@-moz-keyframes animarSlide {
    0% {
    top: -100%;
    }
    20% {
        top: -75%;
    }
    40% {
        top: -50%;
    }
    60% {
    top: -25%;
    }

    80% {
    top: 0%;
    }
    100% {
    top: 0%;
    }
   
}
@-webkit-keyframes animarSlide {
    0% {
    top: -100%;
    }
    20% {
        top: -75%;
    }
    40% {
        top: -50%;
    }
    60% {
    top: -25%;
    }

    80% {
    top: 0%;
    }
    100% {
    top: 0%;
    }
   
}

@keyframes animarSlide 
{
    0% {
    top: -100%;
    }
    20% {
        top: -75%;
    }
    40% {
        top: -50%;
    }
    60% {
    top: -25%;
    }

    80% {
    top: 0%;
    }
    100% {
    top: 0%;
    }
   
}

/*paginacion estilo*/
.pageNavigation {
width: 100%;
position: relative;
}
.pageNavigation > .pagecount > a,.pageNavigation .prev,.pageNavigation .next{
    width: 37px;
    height: 33px;
    display: inline-block;
    background: -webkit-linear-gradient(top,rgb(242,242,242),rgb(206,206,206));
    background: -moz-linear-gradient(top,rgb(242,242,242),rgb(206,206,206));
    background: -ms-linear-gradient(top,rgb(242,242,242),rgb(206,206,206));
    background: linear-gradient(top,rgb(242,242,242),rgb(206,206,206));
    color: rgb(90,90,90);
    border: 1px solid rgb(198,198,198);
    margin: 2.5px;
    text-align: center;
    font: 18pt 'montserrat-regular';
    text-decoration: none;
    cursor: pointer;
    }

.pageNavigation > .pagecount > a:not(.prev),.pageNavigation > .pagecount > a:not(.next){
    font-size: 14pt!important;
    padding: 5px 0px!important;
}
.pageNavigation .next,.pageNavigation .prev,.pagecount{
    display: inline-block;
    vertical-align: middle;
}
.pagecount > a:hover,.activoPag{
    background: rgb(239,239,239)!important; 
}
.pagecount > a{
    clear: both;
    display: inline-block;
    vertical-align: middle;
    -webkit-user-select: none!important;
    -moz-user-select:none!important;
    user-select:none!important;
    -webkit-user-drag:none!important;
}

.pageNavigation a.next:before{
    content:">";
}

.pageNavigation a.prev:before{
    content:"<";
}
.pageNavigation a.prev,.pageNavigation a.next{
    font: 20pt 'montserrat-regular'!important;
}
.pageNavigation a.prev:hover,.pageNavigation a.next:hover{
    background: rgb(239,239,239);
}

.erase {
background: url("images/iconos/borrar.png") no-repeat top left;
width: 24px;
height: 24px;
display: inline-block;
}

.details {
background: url("images/iconos/detalles.png") no-repeat top left;
width: 24px;
height: 24px;
display: inline-block;
}

.print {
background: url("images/iconos/imprimir.png") no-repeat top left;
width: 24px;
height: 24px;
display: inline-block;
}
.update {
background: url("images/iconos/mod.png") no-repeat top left;
width: 24px;
height: 24px;
display: inline-block;
}

.notificacionSistema > a, .errorMessage > a {
display: block!important;
font:900 9pt 'montserrat-light' !important;
}
.notificacionSistema > span,.successMessage > span,.errorMessage > span{
    margin: 25px 0px;
    display: block;
}

.successMessage, .errorsMessages {
-moz-animation: 1.5s muestra ease-in-out;
-webkit-animation: 1.5s muestra ease-in-out;
animation: 1.5s muestra ease-in-out;
}
.buttonGroup{
    text-align: center;
    padding: 7.5px!important;
}

.buttonGroup button{
    display: inline-block!important;
    vertical-align: middle!important;
}
.buttonFormField {
background: rgb(9,46,110);
color: white;
border: 1px solid #2F5FB2;
padding: 9px 3px;
text-transform: capitalize;
cursor: pointer !important;
font: 12pt 'montserrat-regular';
display: block !important;
margin: 35px 3.5px 0px 3.5px;
text-decoration: none !important;
text-transform: uppercase !important;
width: auto;
text-align:center;
}
.buttonFormField:hover, .buttonFormField:focus {
background: rgb(14,75,177);      
    }

.infoDetails
{
    width: 480px;
    margin: 5px auto;
}

.infoDetails >  div b,.infoDetails > div p{
    display: inline-block;
    vertical-align: middle;
    margin: 3px 0px;
}
.infoDetails > div b{
    width: 250px;
    font-family: 'montserrat-regular';
    font-size: 11pt;
}
.infoDetails b::first-letter{
    text-transform: uppercase;
}
.listados > div {
counter-increment: listaN;
display: inline-block;
margin: 3px 5px;
font-size: 11pt;
}
.listados > div::before{
    content: counter(listaN)".-";
    font-weight: 900;
}
/*estilo miniaturas*/
.miniaturas{
    width: 172px;
    height: 192px;
}
.ui-datepicker{
	width: auto!important;
}

.hide-content{
    display: none!important;
}

.lighthing{
    width: 24px!important;
    height: 24px!important;
    display: block!important;
    border-radius: 50%!important; 
    margin: auto!important;
    cursor: default;
}
.lighthing-off {
background: red!important;
}
.lighthing-on {
background: lime!important;
}
.lighthing-process{
    background: yellow!important;
}
.lighthing-stop{
    background: orange!important;
}
.precarga{
    display: block;
    margin: auto;
}
/*seccion de visor cartografico*/
    #visor{
        height: 100%;
    }

   #visor #map{
        width: 100%;
        height: 100%;
    }
        #visor #panel {
            margin: 0 !important;
            padding: 2.75px !important;
            background: rgba(255,255,255,0.69);
            position: fixed;
            z-index: 1009;
            width: 29%;
            height: calc(100% - 129px);
        }
    .pac-container {
        position: absolute!important;
        z-index: 1010!important;
    }

   #panel label{
       display: block;
       text-transform: uppercase;
   }
   #panel > div{
       margin: 7.5px 0px;
   }
   #panel input,#panel select{
       width: 100%;
       padding: 5.5px 1.5px;
       display: block;
       border: 1px solid silver;
   }

        #capasCargar label {
            font: 11pt 'montserrat-light'!important;
            text-align: center!important;
            text-transform: capitalize!important;
            display: block!important;
            width: 100%!important;
        }
    #capasCargar {
        background: rgba(255,255,255,0.69);
        position: absolute;
        top: 129px;
        right: 0px;
        z-index: 1009;
        width: 15%;
        height: calc(100% - 129px);
        overflow: auto;
        display: none;
    }
        #capasCargar div table tr td:first-child{
            width: 165px!important;
        }
    button {
        font: 14pt 'montserrat-regular'!important;
        text-transform: uppercase!important;
        background: #4779CF;
        color: white!important;
        text-decoration:none!important;
        border: 1px solid #2F5FB2;
        width: 100%;
        display: block;
        margin: 0.25px 0px;
        padding: 7.5px 2.5px;
    }
        button:hover {
            background: #6193E9;
        }
    button span{
        display: inline-block;
        margin: 0px 1.75px;
        vertical-align: middle;
    }
    #navegadorMapa {
        display: block;
        width: 48px;
        height: 48px;
        font-size: 28pt;
        color: white;
        position: fixed;
        text-align: center;
        z-index: 1019;
        bottom: 0px;
        background: #4779CF;
    }
    div[class^="layer_"]{
        border: 1px solid silver;
        margin-bottom: 3.75px;
    }
      div[class^="layer_"] *{
        user-select: none;
        -webkit-user-select: none;
        -moz-user-select: none;
    }
            div[class^="layer_"] input,div[class^="layer_"] label{
                cursor: pointer;
            }

.notif-message{
    display:block!important;
    border-radius:50%!important;
    width:48px!important;
    height:48px!important;
}
.icon-system-table{
    font-size: 21pt!important;
    color: rgb(9,46,110)!important;
    -moz-transition: all 1s linear;
    -webkit-transition: all 1s linear;
     transition: all 1s linear;
}
.icon-system-table:hover {
    color: rgb(59,119,224)!important;
}
.modal-img{
    display: flex!important;
    align-items:center;
    justify-content:center;
    position:fixed;
    width:100%!important;
    height: 100%!important;
    background: rgba(0,0,0,0.65);
    z-index:0;
    top:0%;
    left:0%;
    -moz-transition: all 0.5s linear!important;
    -webkit-transition: all 0.5s linear!important;
    transition: all 0.5s linear!important;
    margin: 0!important;
}

.modal-img .img-active{
    display: block!important;
    width: 71vw!important;
    height: 59vh!important;
    margin: 0!important;
    cursor:default!important;
}
.modal-img img{
    display:none!important;
}
.image-inf img{
    margin: 7.5px 3.5px; 
    display:inline-block;
    vertical-align:middle;
}