﻿
/*Recursos Para Toda la aplicacion*/
@font-face { font-family: 'RobotoRegular'; src: url('../../../Fuente/Roboto-Regular.ttf') format('truetype'); }
* { font-family: 'RobotoRegular', Verdana, Arial, sans-serif; }
/*PaginaLogin*/
html { overflow-x: hidden; font-size: 13px; }
.logoLogin img { height: 84px; }
.loginContainer { width: 100vw; height: 96vh; }
.nombreApp { font-size: 1.5rem; color: #00AFB9; font-weight: bold; }
#Login_imgLogo { display: none; }
table tr:nth-child(even) { background: white !important; }
textarea { font-size: 1.2rem !important; margin: 0 !important; border: 0px !important; }
.login-Icons img { height: 72px; }
.login-Icons { height: 75px; position: relative; right: -6px; }
.login-logoVacio-cont { background: #00AFB9; transform: translateX(-43px); transition: transform .5s, background .5s; transition-delay: .5s; }
.login-logo-ciel { transform: translateX(22px); transition: transform .5s; transition-delay: .5s; }
    .login-logo-ciel img { transition: clip-path .5s, transform .5s; clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%); }
.login-logo-CM { transform: translateX(24px); clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%); opacity: 0; transition: opacity .5s, clip-path 1s; transition-delay: 1s; }
.login-form { display: none; }
.login-footer { display: none; }
.img-logo { clip-path: polygon(0px 0px, 20% 0px, 20% 100%, 0% 100%); transition: clip-path .5s; }
.Usuario { width: 100%; background: none; }
    .Usuario span { width: 30%; background: none; padding: 5px 0px 5px 0px; float: left; }
    .Usuario input[type=text] { border: 1px solid #DDD !important; width: 70% !important; float: left  !important; background: none!important; font-size: 1.3rem !important; margin: 0 !important; }
.Contrasena { width: 100% !important; background: none; margin: 20px 0px 0px 0px; }
    .Contrasena span { width: 30%; padding: 5px 0px 5px 0px; background: none; float: left; }
    .Contrasena > input[type=password] { border: 1px solid #DDD !important; width: 70% !important; float: left !important; background: none !important; font-size: 1.3rem !important; margin: 0 !important; }
        .Contrasena > input[type=password]:focus { border: 1px solid #DDD; }
    .Contrasena > input[type=text] { width: 70% !important; float: left; background: none; font-size: 1.3rem !important; margin: 0 !important; border: 1px solid #DDD !important; }
        .Contrasena > input[type=text]:focus { border: 1px solid #DDD !important; }
.imgPassoword { width: 9%; padding: 7px 2px 7px 0px; float: left; cursor: pointer; border-bottom: 1px solid #DDD !important; border-right: 1px solid #DDD !important; border-left: 0px solid #DDD !important; border-top: 1px solid #DDD !important; }
.TipoLogin { width: 100% !important; margin: 5px 0px 0px 0px; text-align: center; }
.btnLogin input[type="submit"] { transition: 0.25s all; background: #848488; color: white; padding: 6px 11px !important; border: 0; margin: 15px 0px 10px 0px; cursor: pointer; }
/*notificacion*/
.Notificacion { margin-left: 30%; width: 100% !important; display: flex; }
#divFooter { height: 35px !important; font-size: .9rem; display: flex; align-items: center; justify-content: center; }
#Login_LoginButton:hover { background: #d1d1d1 !important; border-color: transparent; color: #646464 !important }
.NotificationError, .NotificationError .notificationClose { background: #D9031D; color: white; }
.NotificationWarning, .NotificationWarning .notificationClose { background: #EAC321; color: black; }
.NotificationInformation, .NotificationInformation .notificationClose { background: #105678; color: white; }
.NotificationSucess, .NotificationSucess .notificationClose { background: #379819; color: white; }
.NotificationError, .NotificationWarning, .NotificationInformation, .NotificationSucess { position: fixed; z-index: 101; width: 100%; padding: 5px; font-size: 12px; padding-left: 20px; background-position: 2px 7px; margin-top: 15px; bottom: 25px; }
    .NotificationError .notificationClose, .NotificationWarning .notificationClose, .NotificationInformation .notificationClose, .NotificationSucess .notificationClose { display: block; float: right; font-size: 8px; position: relative; bottom: -2px; left: 3px; padding: 0 2px; font-style: normal; cursor: pointer; cursor: pointer; font-size: 15px; font-weight: bold; margin-right: 5px; }
/*menu de formularios */
.menuEdicion a img { display: block; background: #c4c9cc; width: 40px; height: 40px; padding: 6px; border: none; margin-bottom: 4px; margin-top: 2px; transition: filter 500ms; border-radius: .3rem; transition: background .25s; }
.menuEdicion .nombre { display: block; text-align: center; width: 100%; border-bottom: 1px dotted #d4d3d5; }
.menuEdicion { padding-bottom: .75rem; }
    .menuEdicion a { transition: all .5s; min-width: 39px; min-height: 39px; color: #65646a; border-radius: .25rem; display: flex; text-decoration: none !important; overflow: hidden !important; align-items: center !important; flex-direction: column; margin-left: .5rem; margin-right: .5rem; text-align: center; line-height: 1.1rem; margin-bottom: .5rem; }
        .menuEdicion a:last-of-type { margin-right: 0; }
    .menuEdicion div.division { float: left; width: 1px; height: 40px; background-color: #c1c2c3; margin: 4px; }
    /*.menuEdicion span { display: block; text-overflow: ellipsis; margin-top: .25rem; font-size: .9rem; position: absolute; margin-top: 38px; }*/
    .menuEdicion span { display: block; text-overflow: ellipsis; font-size: .9rem; }
    .menuEdicion a.aspNetDisabled, .menuEdicion [disabled] { opacity: 0.4; }
    .menuEdicion a:hover img { background: #d1d1d1; text-decoration: none; filter: saturate(130%); }
    .menuEdicion a:hover { color: black; }
    .menuEdicion a:first-of-type { margin-left: 0; }
    .menuEdicion a:last-of-type { margin-right: 0; }
    .menuEdicion a.aspNetDisabled:active { position: static; }
    .menuEdicion a.aspNetDisabled:hover, .menuEdicion a[disabled]:hover { background-color: transparent; opacity: 0.5; box-shadow: none; border-color: transparent; }

/*Estilo de*/
fieldset {padding:10px!important; border-width: 1px !important; border-color: #d2d3d5 !important; border-style: solid !important; overflow: auto !important; border-radius: .3rem !important; }
    fieldset legend { color: #65646a !important;  font-size: 1.1rem !important; position: relative !important; }
/*Estilo de formularios */
.Formulario { }
* input[type=text] { width: 100% !important; margin: 5px 0px 5px 0px; border: none !important;}
    * input[type=text] *:focus { outline: none !important;border-color: #666; }
    * input[type=text]:hover { border: none; }
* input[type=password] { width: 100% !important; margin: 5px 0px 5px 0px; border: none !important; }
    * input[type=password] *:focus { outline: none !important; border-color: #666; }
    * input[type=password]:hover { border: none; }
* textarea { width: 100% !important; margin: 5px 0px 5px 0px; border: none !important; height: 170px !important; }
* select { width: 100% !important; margin: 5px 0px 5px 0px !important; border: none !important; }
agenda {overflow:scroll !important; }
   /* .boton:focus,
input[type="submit"]:focus,
 input[type="password"]:focus,
 input[type="button"]:focus,
 input[type=text]:focus,
 select:focus,
 input:focus-visible { }

input[type="password"][readonly]:focus, input[type="text"][readonly]:focus { border-color: #c9c9c9; width:100%; }
*, *:focus, *:hover { }
input, select, textarea, .boton, .btnMostrarAlarmas {  color: black; border: 1px solid #d0d1d3; }
    input[type=text]:focus {  }
body { background-color: white; color: #333; }

*/

.filtro > input[type=text] { width: 91% !important; float: left !important; padding:0!important; margin:0!important; }
.filtro > input[type=image] { width: 9% !important; float: left !important; border: none !important; background: #d2d3d5 !important; padding: 0px; margin: 0px; transition: 1s }
    .filtro input[type=image]:hover { width: 9%!important; float: left !important; border: none!important; background: #d2d3d5; padding: 0px; margin: 0px; transition: 1s }
.limpiarfiltro img { padding-left:5px; width: 60% !important; }
/*Pagina Usuarios*/
.contenedorRol { height: 590px !important; border: 1px solid #D9031D !important; }
.contenedorPermisos { height: 500px !important; border: 1px solid #D9031D !important; }
.contenedorRolUsuarios { height: 590px !important;}

/*Menu de configuracion*/
.grupo { /* border: 1px solid;*/ list-style: none; width: 100%; text-align: center; overflow: hidden; }
.list__arrow { /*border: 1px solid;*/ margin-left: auto; transition: transform .3s; }
.listaMenu { /*border: 1px solid yellow;*/  width: 100%;  list-style: none; transition: height .8s; height: 0; }
.SubMenu { /*border: 1px solid;*/ width: 100%; color: #303440; display: block; padding: 5px 0; text-decoration: none !important; }
    .SubMenu:hover { text-decoration: none !important; color: #303440; }
      
.submenuestilo { /* border: 1px solid;*/ padding-left: 20px; text-align: left; background: #E7E7E7 !important; }
    .submenuestilo:hover { /*border: 1px solid;*/ background: #c4c9cc !important;  color:none !important;}
.iconoflecha { cursor: pointer !important; transform: rotate(90deg) !important; }

.botonaccion .iconoflecha { /*border: 1px solid;*/   cursor:pointer !important;}
.estiloJavacript { background: #7A828A !important; }
    .estiloJavacript span { color: white; padding: 6px 0px 6px 10px; }

.procedimiento { color: #669a41 !important; }




.header { width: 100%; height: 88px; }
.headerFlotante { position: fixed; z-index: 100; width: 100%; }
.header { background-color: #FFF; border-bottom: 3px solid #96c83c }
    .header .navbar { justify-content: center !important; }
.headerNombreApp { font-size: 1.5rem; }
.headerSepFlow { height: 98px; _height: 0; }
.header img { border: none; }
.header .headerUserInfo { float: right; text-align: center; }
    .header .headerUserInfo span { font-size: 14px; }
    .header .headerUserInfo div { padding-top: 15px; }
    .header .headerUserInfo a { font-size: 14px; }
.header .AppInfo h3, .header .AppInfo span { color: #999; }
.header .AppInfo h3 { margin-bottom: 5px; }
.logoCiel { max-height: 50px; }
.logoCiel { margin: 0 0 0px 60px; }
.logoCiel { transition: margin 1s; }





.menuSuperior { background: #7A828A; display: block; }
    .menuSuperior ul li { border-style: none !important; }
.menuSuperior { border-color: #d0d1d3; display: none; }






.menu ul.level1 > li { display: inline-block; }
.menu ul { list-style-type: none !important; margin: 0; padding: 0; z-index: 1003; }
    .menu ul li { border-color: #333333; border-style: solid; border-width: 0px; }
        .menu ul li ul { height: auto; }
        .menu ul .hover, .menu ul li a.highlighted { background-color: #59595C; -webkit-transition: background-color 250ms; -moz-transition: background-color 250ms; -o-transition: background-color 250ms; -ms-transition: background-color 250ms; transition: background-color 250ms; }
.menu .level2.highlighted { background-color: #59595C; }
.menu ul li a { color: white; text-decoration: none; padding: 6px 8px 6px 8px; display: block; text-decoration: none; -webkit-transition: background-color 250ms; -moz-transition: background-color 250ms; -o-transition: background-color 250ms; -ms-transition: background-color 250ms; transition: background-color 250ms; }
    .menu ul li .hover, .menu ul li a:hover { text-decoration: none; }
.menu ul li ul li { background-color: #59595C; background-image: none; border-style: solid !important; white-space: nowrap; }
.menuSuperior { background: #7A828A; display: block; }
    .menuSuperior ul li { border-style: none !important; }
.menuSuperior { border-color: #d0d1d3; display: none; }

/******************Menú Iconos******************/
.menuIconos { display: flex; justify-content: center; }
    .menuIconos > div { display: flex; flex-wrap: wrap; justify-content: center; position: relative; }
.contenedorMenuIconos { margin: auto auto; justify-content: center; align-items: center; }
    .contenedorMenuIconos span.tituloSeccion { display: block; opacity: 0; transition: opacity .5s; background: #96c83c; font-size: 1.7rem; padding: 1.5rem; border-radius: .3rem; width: 100%; color: white; text-align: center; }
    .contenedorMenuIconos > div:first-of-type { margin: .3rem; }
.menuIconos a { color: #65646a; display: flex; flex-direction: column; align-items: center; justify-content: space-between; min-width: 85px; max-width: 85px; height: 85px; vertical-align: top; margin: .3rem; cursor: pointer; text-align: center; padding: 10px; background: #e5e5e5; border-radius: .3rem; transition: background .5s; }
    .menuIconos a:hover, .menuIconos a:active { color: black; text-decoration: none; background: #dfdbdb; }
        .menuIconos a:hover img { filter: brightness(0.7); }
.menuIconos img { width: 37px; height: 37px; border: none; transition: filter 500ms; }
.menuIconos span { display: block; flex-grow: 1; text-align: center; padding-top: 6px; line-height: 1rem; font-size: .9rem; display: flex; align-items: center; }
.menuIconos a { opacity: 0; animation-name: opacidad; animation-fill-mode: forwards; animation-duration: .5s; }
    .menuIconos a[itemnumber="0"] { animation-delay: .1s; }
    .menuIconos a[itemnumber="1"] { animation-delay: .2s; }
    .menuIconos a[itemnumber="2"] { animation-delay: .3s; }
    .menuIconos a[itemnumber="3"] { animation-delay: .4s; }
    .menuIconos a[itemnumber="4"] { animation-delay: .5s; }
    .menuIconos a[itemnumber="5"] { animation-delay: .6s; }
    .menuIconos a[itemnumber="6"] { animation-delay: .7s; }
    .menuIconos a[itemnumber="7"] { animation-delay: .8s; }
    .menuIconos a[itemnumber="8"] { animation-delay: 1s; }
    .menuIconos a[itemnumber="9"] { animation-delay: 1.1s; }
    .menuIconos a[itemnumber="10"] { animation-delay: 1.2s; }
    .menuIconos a[itemnumber="11"] { animation-delay: 1.3s; }
    .menuIconos a[itemnumber="12"] { animation-delay: 1.4s; }

.menuTopUsuario { font-size: 1.1rem; }
    .menuTopUsuario img { width: 18px; height: 18px; }
    .menuTopUsuario ul { list-style-type: none; margin: 0; padding: 0; display: none; position: fixed; right: 20px; }
        .menuTopUsuario ul li { display: block; background: #7a828a; width: 150px; text-align: right; }
            .menuTopUsuario ul li a { color: white; text-decoration: none; padding: 7px 8px 6px 8px; display: block; text-decoration: none; -webkit-transition: background-color 250ms; -moz-transition: background-color 250ms; -o-transition: background-color 250ms; -ms-transition: background-color 250ms; transition: background-color 250ms; }
                .menuTopUsuario ul li a:hover { background: #64842c; }

    .menuTopUsuario a { text-decoration: none; padding: 0.25rem; border-radius: .3rem; transition: all .5s; color: #636569; }
        .menuTopUsuario a:hover { text-decoration: none; background: #d1d1d1; color: #636569; }
.menuIconoInfoUsuario { border-radius: 50px; width: 30px; height: 30px; }
    .contextualUsuario { display:; z-index: 1004; min-width: 150px; border-radius: .25rem; position: absolute; background: white; right: 0; top: 60px; border: 1px solid #D3d3d3; padding: .75rem; }
.contextualUsuario a { font-size: 1rem; color: #217DAB; }
    .contextualUsuario img { height: auto; width: 40px; }

.spnmodal { font-size:23px; }
.spnNR { font-size: 14px; }
.contenedorModal { background-color: rgba(25,25,25,0.7); }
.estiloModal {text-align:center; padding:2%; align-items: center; justify-content: center; width: 30%; height: 45%; background: white; border-radius: 15px; border: 2px solid #96c83c; }

.estiloModal2 { text-align: center;
 padding: 2%; align-items: center;
 justify-content: center; 
width: 40%; height: 20%;
 background: white;
 border-radius: 15px;
 border: 2px solid #96c83c;
 position: fixed; z-index: 10002;
 left: 206.5px;
 top: 0.5px !important; }
@media (min-height: 450px) and (max-width: 767px) { }
.SelectTelerik { width: 100% !important; }
    .SelectTelerik a { /*background-image: url('../Imagenes/Iconos/flecha_abajo.png') !important;*/ margin: 0px 0px 0px !important; background-size: 100% !important; background-repeat: no-repeat; }
