:root { --Naranja-color: #F9A826; --Gris-color: #C1C1C1; --Gris-Oscuro: #6d6d6d; --Verde-color: #8A9A5B; --Verde-degradado: #8A9A5B36; } /* -------------------------------------- COLORES que combinan: aranja Claro: Un tono cálido y suave. Hex: #F4C580. Naranja Medio: Un tono más vibrante y saturado. Hex: #F2A350. Naranja Intenso: Un tono más oscuro y profundo. Hex: #E78A23. Naranja Oscuro: Un tono casi marrón, ideal para acentos fuertes. Hex: #D47400. Blanco: Proporciona un contraste limpio y fresco. Hex: #FFFFFF Gris Claro: Suave y versátil, perfecto para fondos o texto. Hex: #E0E0E0 Gris Oscuro: Añade sofisticación y puede ser utilizado para textos o elementos decorativos. Hex: #4A4A4A Azul Marino: Proporciona un contraste elegante y se combina bien con tonos cálidos. Hex: #1C3D72 Turquesa Claro: Aporta un toque fresco y vibrante, equilibrando la calidez de los naranjas. Hex: #4EB5B6 Verde Salvia: Un tono suave y relajante que complementa los tonos cálidos. Hex: #8A9A5B Oro: Un color metálico que puede añadir un toque de lujo y sofisticación. Hex: #DAA520 Rojo Granate: Un color rico y profundo que puede añadir dramatismo y profundidad. Hex: #800020 -------------------------------------- */ .JLMarca { border-style: dashed; border-width: 1px;} .enVertical label, .enVertical input, .enVertical scan { display:block;} /*.SoloLectura {background: #EDF3FF;}*/ .numero {text-align:right;} .centrado {text-align: center;} /*html{font-size: 13.5px;}*/ /*.page__content h1, .page__content h2, .page__content h3, .page__content h4, .page__content h5,.page__content label{font-weight: 600;}*/ .page__content h1{font-size: 2rem; letter-spacing: -0.5px; margin-top: 2.5rem;} .page__content h2{font-size: 1.3rem; margin: 2.5rem 0 1.3rem;} .page__content h3{font-size: 1rem; margin-bottom: 0.5rem;} .page__content h4{font-size: 0.8rem; margin-bottom: 0.4rem;} .page__content label{font-size: 0.9rem; margin-bottom: 0.3rem;} /*.page__content h2:first-child{margin-top: 1rem;}*/ .toolbar-button, .back-button {color: var(--Gris-Oscuro);} .back-button__icon {fill: var(--Gris-Oscuro);} .select-input--underbar:disabled {opacity: 1; background-color: #EDF3FF;} a{color: #1B8ADC;} .page__content{padding: 1rem 1.1rem;} /*.page__content ul{padding-left: 21px;}*/ .page, .page__background, .page__content{background: #fff;} .notification{background: #E51946;} img{max-width: 100%; height: auto;} .img-rounded{border-radius: 2rem;} /* Estilos básicos para la tabla */ .jl_table { width: 100%; border-collapse: collapse;} .jl_table th, .jl_table td { padding: 8px 12px; text-align: left; border-bottom: 1px solid #ddd; } .jl_table thead, .jl_table thead tr{ background-color: #f2f2f2;} /* Fondo para filas impares .jl_table tbody tr:nth-child(odd) { background-color: var(--Verde-degradado)} */ .jl_table .impar { background-color: var(--Verde-degradado)} /* Fondo para filas pares .jl_table tbody tr:nth-child(even) {background-color: #ffffff;} */ .jl_table .par {background-color: #ffffff;} /* Media query para pantallas de menos de 400px de ancho */ @media (max-width: 600px) { .jl_table, .jl_table thead, .jl_table tbody, .jl_table th, .jl_table td, .jl_table tr {display: block;} .jl_table thead tr { display: none;} /*.jl_table tr {margin-bottom: 15px;}*/ .jl_table td {text-align: right; padding-left: 35%;position: relative; font-size: 0.9em; min-height: 14px;} .jl_table td::before { content: attr(data-label); position: absolute; left: 0; width: 35%; padding-left: 10px; font-weight: bold; text-align: left; font-size: 0.8em; } } .panel_Titulo {width: 100%; height: 50px; color: var(--Naranja-color);} .TextoLargo {white-space: nowrap; text-overflow: ellipsis; overflow: hidden;} .panel_Usuario {width: 100%; height: 70px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color);} .panel_FotoUsuario {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} .FotoUsuario {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} .NombreUsuario {float:left; width: calc(100% - 75px); height: auto; font-size: 1.1em; margin-left: 5px; margin-top: 10px;} .UsuarioActual {float:left; width: calc(100% - 75px); height: 30px; font-size: 0.8em; margin-left: 5px;} .panel_Residente {width: 100%; height: 70px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color);} .panel_FotoResidente {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} .FotoResidente {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} .NombreResidente {float:left; width: calc(100% - 75px); height: 25px; font-size: 1.1em; margin-left: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} .HabitacionCama {float:left; width: calc(100% - 75px); height: 20px; font-size: 0.8em; margin-left: 5px;} .EdadTipologia {float:left; width: calc(100% - 75px); height: 20px; font-size: 0.8em; margin-left: 5px;} .Observ{width: 100%; padding: 0 1%; text-align: justify; border: 1px solid #000000;} .sTarea{color: black;} .sIniciada{background-color: #FC5353!important;} .sSubTarea{background-color: #E0E0E0;} .sActividad{color: #0088bb;} .sControl{color: #F44336;} .verde{color: green;} .ColorBoton { background-color: var(--Naranja-color);} /* -------------------------------------- LOGIN -------------------------------------- */ #Login #panel_Pagina { display: grid; grid-template-rows: auto 50px; height: 100%} #Login #panel_Login {width: 76%; margin-left: 12%; margin-right: 12%; margin-top: 20px; text-align: center;} #Login #Login_Titulo {text-align: center; font-size: 30px; font-weight: bold; margin-bottom: 5vh; } #Login #panel_Login img {max-width: 70%;} #Login #Login_Datos { text-align: center;} #Login #panel_Login input{width: 100%; font-size: 1rem;} #Login #panel_Login input{font-size: 1rem; font-weight: 500;} #Login #Login_NombreResidencia {width:100%; height: 20px; font-size: 1rem; display: none;} #Login #panel_Login .button{width: 100%; background-color: var(--Naranja-color);} #Login #copyright{width: 100%; text-align: center; font-weight: 500; font-size: 0.9rem;} #Login #copyright img{position: relative; top: 6px;} /* Para dispositivos en modo horizontal (landscape) */ @media (orientation: landscape) { #Login #panel_Login {display: grid; grid-template-columns: 1fr 1fr; align-items: center; width: 100%; height: 100%; margin-top: 0; margin-left: 0; margin-right: 0; } #Login #Login_Titulo, #Login #logo { grid-column: 1; justify-self: center; margin-right: 10%; margin-bottom: 0;} #Login #Login_Datos {grid-column: 2; justify-self: start; margin-left: 10%;} } /* -------------------------------------- INICIO -------------------------------------- */ #Inicio .toolbar{height: 200px;} #Inicio .toolbar + .page__background {top: 200px;} #Inicio .page__content { top: 200px !important; padding-bottom: 26px; } #Inicio .toolbar__left {display: none;} #Inicio .toolbar__title {display: none;} #Inicio .toolbar__right {display: none;} #Inicio #MenuPrincipal_PanelCabecera {width: 100%; height: 200px; filter: drop-shadow(0px 4px 20px rgba(3, 0, 0, 0.25));} #Inicio #MenuPrincipal_PanelImagen {width: 100%; height: 95px; background-image: URL(../img/FondoCabecera.png); background-size: cover;} #Inicio #MenuPrincipal_idCerrarSesion {position: absolute; left: 15px; top:10px; width: 40px; height: 40px; border-radius: 50%;} #Inicio #MenuPrincipal_idNotificacion {position: absolute; left: calc(100% - 60px); top:10px; width: 40px; height: 40px; border-radius: 50%;} #Inicio .notification {margin-left: -17px;} #Inicio #MenuPrincipal_Ambito {width: 100%; height: 20px; text-align: center; font-size: 1.0em;} #Inicio #MenuPrincipal_PanelUsuarioProfesional {width: 100%; height: 25px; text-align: center; font-size: 1.0em;} #Inicio #MenuPrincipal_PanelFechaTrabajo {width: 100%; height: 20px; text-align: center; font-size: 1.0em; font-style: italic;} #Inicio #MenuPrincipal_PanelFechaTrabajo span{font-style: normal;} #Inicio #MenuPrincipal_panelidFoto {width: 110px; height: 110px; margin: -86px auto 5px; overflow: hidden; border: 3px solid #fff; border-radius: 100%; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); vertical-align: middle; border-style: none; text-align: center;} #Inicio #MenuPrincipal_idFoto {width: 100%; height: 100%; border-radius: 50%; object-fit: scale-down; background-color: #fff;} #Inicio #MenuPrincipal_PanelNombreResidencia {float:left;width: 100%; margin-top: 15px; height: 40px; text-align: center; font-size: 1.0em; font-style: italic;} /*#Inicio .panel_Opcion {float:left; width: 130px; height: 130px; margin: 5vw 0 0vw 5vw; background-color: #fff; border-radius: 5px; cursor: pointer; filter: drop-shadow(0px 4px 20px rgba(3, 0, 0, 0.25)); padding: 0.5rem; }*/ #Inicio #OpcionesMenu { display: flex; flex-wrap: wrap; /* Permite que los elementos se ajusten a la siguiente línea si no caben */ justify-content: flex-start; /* Alinea los elementos al inicio del contenedor */ gap: 2.5vw; /* Espacio entre los elementos */ padding: 0 2vw; /* Espacio en los lados del contenedor */ margin-top: 25px; justify-content: space-around; } #Inicio .panel_Opcion { flex: 0 1 130px; /* Los elementos tienen un ancho base de 130px */ height: 130px; background-color: #fff; border-radius: 5px; cursor: pointer; filter: drop-shadow(0px 4px 20px rgba(3, 0, 0, 0.25)); padding: 0.5rem; display: flex; /* Para centrar el contenido dentro del panel */ justify-content: center; align-items: center; } #Inicio .panel_OpcionImagen {width: calc(100% - 10px); height: 65px; padding: 5px;} #Inicio .panel_Opcion .panel_OpcionImagen{background-size: contain; background-repeat: no-repeat; padding: 0;} #Inicio #Opcion99 .panel_OpcionImagen{background-image: url('../img/Ambito_QR.jpg');} #Inicio #Opcion1 .panel_OpcionImagen{background-image: url('../img/Residentes.jpg');} #Inicio #Opcion2 .panel_OpcionImagen{background-image: url('../img/RegistroTrabajo.jpg');} #Inicio #Opcion3 .panel_OpcionImagen{background-image: url('../img/ControlesRealizados.jpg');} #Inicio #Opcion4 .panel_OpcionImagen{background-image: url('../img/TareasRealizadas.jpg');} #Inicio #Opcion5 .panel_OpcionImagen{background-image: url('../img/ActividadesRealizadas.jpg');} #Inicio #Opcion6 .panel_OpcionImagen{background-image: url('../img/UlcerasCaidas.jpg');} #Inicio #Opcion7 .panel_OpcionImagen{background-image: url('../img/IncidenciasGenerales.jpg');} #Inicio #Opcion8 .panel_OpcionImagen{background-image: url('../img/VisitasSalidas.jpg');} #Inicio #Opcion11 .panel_OpcionImagen{background-image: url('../img/Seguimientos.jpg');} #Inicio #Opcion9 .panel_OpcionImagen{background-image: url('../img/Agenda.jpg');} #Inicio #Opcion10 .panel_OpcionImagen{background-image: url('../img/Protocolos.jpg');} #Inicio #Opcion50 .panel_OpcionImagen{background-image: url('../img/Update.jpg');} #Inicio #Opcion51 .panel_OpcionImagen{background-image: url('../img/Salir.jpg');} #Inicio .panel_OpcionImagen{width: 100%; height: 100%; display: block;} /*.landscape #Inicio .toolbar{height: 14rem;} .landscape #Inicio .page__content{top: 14rem !important;}*/ /*.landscape #Inicio .panel_Opcion{width: 16vw; height: 16vw; margin: 2vw 0 2vw 5vw;}*/ #Inicio #copyright{float:left; width: 100%; height: 30px; display: flex; justify-content: center; align-items: center; font-size:11px; margin-top: 15px; } /* -------------------------------------- CONFIGURACION -------------------------------------- */ #Configuracion .toolbar {background: var(--Naranja-color);} #Configuracion .panel_PasosCarrousel {float:left; width: 30%; height: auto; margin-left: calc(35% - 1rem); margin-right: 35%; overflow: hidden; position: relative; z-index: 100; -webkit-box-pack: justify!important; -ms-flex-pack: justify!important; justify-content: space-between!important; display: -webkit-box!important; display: -ms-flexbox!important; display: flex!important; margin-bottom: 50px;} #Configuracion .panel_PasosCarrousel div{border: 1px solid #ccc; color: #ccc; border-radius: 50%; width: 1rem; height: 1rem; display: inline-block; text-align: center; line-height: 2rem; background: #fff; z-index: 100; position: relative;} #Configuracion .panel_PasosCarrousel div.done{color: #fff; background: #000;} #Configuracion .panel_Comentario{text-align: center !important; width: 70% !important; margin: 1rem auto 1rem !important; font-size: 1.1rem ;} #Configuracion .panel_Comentario h5{margin: 1rem auto 0;} #Configuracion .panel_Datos{float:left; width: 79%; height: 50px; margin-left: 10%; margin-right: 10%;} #Configuracion .panel_Carrusel {width: calc(100% - 10px); height: auto; margin-left: 5px; margin-right: 5px; margin-top: 30px; margin: 0; width: 100%; background-size: cover;} #Configuracion .bloques {float:left; width: 100%; height: 245px; overflow: hidden; position: relative;} #Configuracion .bloque2 {position: absolute; height: auto; min-height: 100px; left: 6vw; top: 0;} #Configuracion .bTipoUbicacion{margin: auto; width: 70vw; height: 47vw; background-repeat: no-repeat; background-size: cover; border: 0; background-position: center;} #Configuracion .lTipoUbicacion {width: 100%; text-align: center; color: #980321; font-size: 1.5rem; line-height: 1.7rem;} #Configuracion .tvResidencia .bTipoUbicacion{background-image: url('../img/Residencia.png');} #Configuracion .tvUnidadConvivencia .bTipoUbicacion{background-image: url('../img/UnidadConvivencia.png');} #Configuracion .tvHabitacion .bTipoUbicacion{background-image: url('../img/Habitacion.png');} #Configuracion .tvResidente .bTipoUbicacion{background-image: url('../img/Ambito_Residente.png');} /* #Configuracion #opcion-residencia .tvHabitacion, #Configuracion #opcion-residencia .tvUnidadConvivencia, #Configuracion #opcion-habitacion .tvResidencia, #Configuracion #opcion-habitacion .tvUnidadConvivencia, #opcion-unidadconvivencia .tvHabitacion, #opcion-unidadconvivencia .tvResidencia {opacity: 0.5} */ #Configuracion #opcion-residencia .tvResidencia .bTipoUbicacion, #Configuracion #opcion-habitacion .tvHabitacion .bTipoUbicacion, #Configuracion #opcion-unidadconvivencia .tvUnidadConvivencia .bTipoUbicacion, #Configuracion #opcion-Residente .tvResidente .bTipoUbicacion {width: 79vw; height: 200px; left: 6vw; background-size: contain;} #Configuracion .panel_Datos {width: 79%; height: 55px; margin-left: 10%; margin-right: 10%;} #Configuracion #idAmbito {width: 100%; text-align: center;} #Configuracion #panel_FechaTrabajo {margin: auto; max-width: 600px;} #Configuracion #panel_FechaTrabajo .ui-datepicker{border-radius: 0 !important;} #Configuracion #panel_FechaTrabajo .ui-datepicker td{text-align: center;} #Configuracion #panel_FechaTrabajo > div {margin: auto;} #Configuracion #panel_FechaTrabajo .ui-datepicker td a {border: 1px solid #fff; background: #fff; border-radius: 50%; text-align: center; padding: 0; width: 8vw; height: 8vw; line-height: 8vw; font-size: 3.5vw; display: inline-block; margin: 1vw 0;} #Configuracion #panel_FechaTrabajo .ui-datepicker { font-size: 2vw; width: auto;} #Configuracion #panel_FechaTrabajo .ui-datepicker table{font-size: 3vw;} #Configuracion #panel_FechaTrabajo .ui-widget-header {border: 1px solid #fff; background:var(--Naranja-color); color:white; font-weight: bold; font-size: 4vw;} @media (min-width: 501px) { #Configuracion #panel_FechaTrabajo .ui-datepicker td a {border: 1px solid #fff; background: #fff; color: #000; border-radius: 50%; text-align: center; padding: 0; width: 4vw; height: 4vw; line-height: 4vw; font-size: 3.5vw; display: inline-block; margin: 1vw 0;} #Configuracion #panel_FechaTrabajo .ui-datepicker { font-size: 1.2vw; width: auto;} #Configuracion #panel_FechaTrabajo .ui-datepicker table{font-size: 1.5vw;} #Configuracion #panel_FechaTrabajo .ui-widget-header {border: 1px solid #fff; background:var(--Naranja-color); color:white; font-weight: bold; font-size: 3vw;} } @media (min-width: 801px) { #Configuracion #panel_FechaTrabajo .ui-datepicker td a {border: 1px solid #fff; background: #fff; color: #000; border-radius: 50%; text-align: center; padding: 0; width: 35px; height: 35px; line-height: 35px; font-size: 30px; display: inline-block; margin: 9px 0;} #Configuracion #panel_FechaTrabajo .ui-datepicker { font-size: 30px; width: auto;} #Configuracion #panel_FechaTrabajo .ui-datepicker table{font-size: 30px;} #Configuracion #panel_FechaTrabajo .ui-widget-header {border: 1px solid #fff; background:var(--Naranja-color); color:white; font-weight: bold; font-size: 30px;} } #Configuracion #panel_FechaTrabajo td.ui-datepicker-today a { border: 0px solid #fff !important;} #Configuracion .fondo_Agenda a {background-color: #c4eedc !important; background-image: none !important;} #Configuracion #panel_FechaTrabajo .ui-datepicker .fondo_FechaSistema a {background-color: var(--Naraja-color) !important; background-image: none !important; } #Configuracion #panel_FechaTrabajo .ui-datepicker .fondo_FechaTrabajo a {background-color: #3BBF8B !important; background-image: none !important; color: #fff !important;} /* -------------------------------------- NOTIFICACIONES -------------------------------------- */ #Notificaciones .toolbar {background: var(--Naranja-color);} #Notificaciones ons-tabbar {top: 80px !important} #Notificaciones .list-item__thumbnail{font-size: 35px; color: #3bbf8b; height: auto;} #Notificaciones .negrita {font-weight: bold;} #Notificaciones .list-item__center {width: 90%;} #Notificaciones .list-item__title {-webkit-flex-basis: 90%; flex-basis: 90%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-size: 14px;} #Notificaciones .list-item__subtitle {-webkit-flex-basis: 90%; flex-basis: 90%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } #Notificaciones :checked + .tabbar__button {color: #fff; background-color: var(--Verde-color);} #Notificaciones .tabbar__button {background-color: var(--Verde-degradado);} #Notificaciones .incTipo1{color: #F40707;} #Notificaciones .incTipo2{color: #08A7F7;} #Notificaciones .incTipo3{color: #4DF009;} #Notificaciones .incTipo4{color: #F0CB07;} #Notificaciones .incTipo5{color: #F07A0A;} #Notificaciones .incTipo6{color: #A907F0;} #Notificaciones .incTipo7{color: #0A48F7;} #Notificaciones .incTipo8{color: #F96A0B;} /*#Notificaciones .panel_Usuario::before { content: ''; position: absolute; top: 0px; Mueve la imagen hacia arriba left: 0px; Mueve la imagen hacia la izquierda width: 100%; Ancho mayor que el del div height: 300px; Alto mayor que el del div background-image: URL(../img/FondoCabecera.png);; background-size: cover; background-position: center; background-repeat: no-repeat; z-index: -1; Envía el pseudo-elemento detrás del contenido del div }*/ /* -------------------------------------- MANTNOTIFICACION -------------------------------------- */ #MantNotificacion .toolbar {background: var(--Naranja-color);} #MantNotificacion .panel_Personal {width: 100%; height: 70px; border-width: 1px; border-bottom-style: solid; border-color: #F6F4F4; margin-top: 5px; display: none;} #MantNotificacion .panel_FotoPersonal {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantNotificacion .FotoPersonal {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantNotificacion .NombrePersonal {float:left; width: calc(95% - 70px); height: 30px; margin-top: 5px; font-size: 1.2em; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;} #MantNotificacion .CategoriaPersonal {float:left; width: calc(95% - 70px); height: 35px; font-size: 0.7em; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;} #MantNotificacion #botonGrabar {display: none;} #MantNotificacion #botonContestar {display: none;} #MantNotificacion #fNotificacion {margin-top: 15px;} #MantNotificacion #panel_CodUsuario {float:left; width: 100%; height: 60px; display: none;} #MantNotificacion #DB04_CodUsuario {width: calc(100% - 42px);} #MantNotificacion .jlboton {width: 30px;} #MantNotificacion #panel_FechaNotificacion {float:left; width: 50%; height: 50px;} #MantNotificacion #DB04_FechaNotificacion {width: 105px;} #MantNotificacion #panel_Hora {float:left; width: calc(50% - 50px); height: 50px;} #MantNotificacion #Hora {width: 75px;} #MantNotificacion #panel_PDF {float:right; width: 50px; height: 50px;} #MantNotificacion #Img_PDF{width:45px; height: 45px; display: none;} #MantNotificacion #panel_TextoNotificacion {float:left; width: 100%; min-height: 200px; height: calc(50vh - 110px); } #MantNotificacion #DB04_TextoNotificacion {width: 100%; height: calc(100% - 30px);;} #MantNotificacion #panel_Nota {float:left; width: 100%; min-height: 200px; height: calc(50vh - 110px);} #MantNotificacion #DB04_Nota {width: 100%; height: calc(100% - 30px);;} #MantNotificacion #panel_Seleccion {width:calc( 90% - 10px); height: auto; margin: auto; padding: 5px; background-color: white; border-radius: 5px; } #MantNotificacion #idSeleccion {display: none;} #MantNotificacion #item-list {height: calc(100vh - 220px); overflow: scroll; margin-bottom: 15px; } .jlboton {padding: 0px!important; text-align: center;} /* -------------------------------------- RESIDENTES -------------------------------------- */ #Residentes .toolbar {background: var(--Naranja-color);} #Residentes #panel_Buscar {display:flex; width: 100%; height: 50px; margin: 15px 0; justify-content:center; align-items:center; border: 1px solid #000; } #Residentes #panel_Buscar {background-color: var(--Gris-color);} #Residentes #Residentes_Buscar {width: 100%;} #Residentes_idList { display: flex; flex-wrap: wrap; gap:5px;} #Residentes_idList .list-item {margin-bottom: 12px; padding: 0px; border: 1px solid var(--Verde-color);} @media (min-width: 800px) {#Residentes_idList .list-item { width: calc(50% - 5px);}} #Residentes_idList .notification{position: absolute; top: 10px; right: 10px; font-size: 0.9rem} #Residentes_idList .list-item__title{font-weight: bold;} #Residentes_idList .list-item__subtitle{font-size: 0.9rem; margin-top: 0.2rem; color: var(--Verde-color);} #Residentes_idList .list-item__center {flex: 1;} #Residentes_idList .list-item__left {width: 45px; height: 45px; padding: 0px; margin-right: 15px;} #Residentes_idList .list-item__thumbnail {width: 45px; height: 45px; border-radius: 50%;} #Residentes_idList img {object-fit: cover;} /* -------------------------------------- MANTRESIDENTE -------------------------------------- */ #MantResidente .toolbar {background: var(--Naranja-color);} #MantResidente ons-tabbar {top: 80px !important} #MantResidente :checked + .tabbar__button {color: #fff; background-color: var(--Verde-color);} #MantResidente .tabbar__button {background-color: var(--Verde-degradado); font-size: 11px;} /* Pestaña Valoracion */ #Valoracion label {font-size: 0.9rem; color: var(--Verde-color); margin-bottom: 6px; font-weight: normal;} #Valoracion span {font-size: 1rem; width: 100%; height: auto;} #Valoracion .container {width: 100%; border: 1px solid #ccc; border-radius: 5px; overflow: hidden; transition: max-height 0.3s ease-in-out;} #Valoracion .header {background-color: var(--Verde-degradado); color: black; padding: 10px; display: flex; justify-content: space-between; align-items: center; cursor: pointer;} #Valoracion .content {padding: 5px; height: auto; display: none;} #Valoracion #panel_OtrosDatos {float:left; width: 100%; height: auto; margin-bottom: 10px;} #Valoracion #panel_Fecha{float:left; width: 115px; height: auto;} #Valoracion #DB00_Fecha {width: calc(100% - 15px);} #Valoracion #panel_ResumenValoracion {float:left; width: calc(100% - 115px); height: auto;} #Valoracion #DB00_ResumenValoracion {width: 100%;} #Valoracion .panel_Check {width: 100%; height: 30px;} #Valoracion .panel_Texto {width: 100%; height: auto; margin-bottom: 15px;} /* Pestaña Agenda */ #Agenda #panel_Res_Agenda {margin: auto; max-width: 600px;} #Agenda #panel_Res_Agenda .ui-datepicker{border-radius: 0 !important;} #Agenda #panel_Res_Agenda .ui-datepicker td{text-align: center;} #Agenda #panel_Res_Agenda > div {margin: auto;} #Agenda #panel_Res_Agenda .ui-datepicker td a {border: 1px solid #fff; background: #fff; color: #000; border-radius: 50%; text-align: center; padding: 0; width: 8vw; height: 8vw; line-height: 8vw; font-size: 3.5vw; display: inline-block; margin: 1vw 0;} #Agenda #panel_Res_Agenda .ui-datepicker { font-size: 2vw; width: auto;} #Agenda #panel_Res_Agenda .ui-datepicker table{font-size: 3vw;} #Agenda #panel_Res_Agenda .ui-widget-header {border: 1px solid #fff; background:var(--Naranja-color); color:white; font-weight: bold; font-size: 4vw;} @media (min-width: 501px) { #MantResidente .tabbar__button {font-size: 13px;} #Agenda #panel_Res_Agenda .ui-datepicker td a {border: 1px solid #fff; background: #fff; color: #000; border-radius: 50%; text-align: center; padding: 0; width: 4vw; height: 4vw; line-height: 4vw; font-size: 3.5vw; display: inline-block; margin: 1vw 0;} #Agenda #panel_Res_Agenda .ui-datepicker { font-size: 1.2vw; width: auto;} #Agenda #panel_Res_Agenda .ui-datepicker table{font-size: 1.5vw;} #Agenda #panel_Res_Agenda .ui-widget-header {border: 1px solid #fff; background:var(--Naranja-color); color:white; font-weight: bold; font-size: 3vw;} } @media (min-width: 801px) { #Agenda #panel_Res_Agenda .ui-datepicker td a {border: 1px solid #fff; background: #fff; color: #000; border-radius: 50%; text-align: center; padding: 0; width: 35px; height: 35px; line-height: 35px; font-size: 30px; display: inline-block; margin: 9px 0;} #Agenda #panel_Res_Agenda .ui-datepicker { font-size: 30px; width: auto;} #Agenda #panel_Res_Agenda .ui-datepicker table{font-size: 30px;} #Agenda #panel_Res_Agenda .ui-widget-header {border: 1px solid #fff; background:var(--Naranja-color); color:white; font-weight: bold; font-size: 30px;} } #Agenda #panel_Res_Agenda td.ui-datepicker-today a { border: 0px solid #fff !important;} #Agenda .fondo_Res_Agenda a {background-color: #c4eedc !important; background-image: none !important;} #Agenda #panel_FechaActual {width: 100%; height: 40px; margin-top: 15px; border-width: 1px; border-bottom-style: solid; border-color: #C5C5C5} #Agenda #FechaActual {float:left; width: 100%; height: 30px; font-size: 1.3em; } #Agenda #panel_DatosDia {width: 98.5%; height: auto; margin: 5px 2px 80px 2px; background-color: #fff;} #Agenda .card img {max-width: 40%; float: right;} #Agenda .card {background-color: #f5f9f7; min-height: 40vw;} #ACP #panel_EncuestaACP {float:left; width: 100%; height: 50px;} #ACP #idEncuestaACP {width: 100%;} #ACP #idContenidoACP {float:left; width: 100%;} #ACP .Grupo {background-color: var(--Verde-degradado); color: #686565; padding: 10px 15px; margin: 10px 0; border-radius: 10px; font-size: 1.2em; font-weight: bold; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);} #ACP .Fila {background-color: white; margin: 5px 0; padding: 10px; border-radius: 8px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); display: flex; flex-direction: column; gap: 5px;} #ACP .Pregunta { font-weight: bold; color: var(--Verde-color); font-size: 1em;} #ACP .Respuesta { color: black; font-size: 0.95em; padding: 5px 0;} /* Media queries para adaptarse a dispositivos móviles y tablet */ @media (max-width: 768px) { #ACP .Grupo { font-size: 1.1em; padding: 8px 12px;} #ACP .Pregunta {font-size: 0.95em;} #ACP .Respuesta {font-size: 0.9em;} } /* --------------------------------------*/ /* -------------------------------------- REGISTROTRABAJO -------------------------------------- */ #RegistroTrabajo .toolbar {background: var(--Naranja-color);} #RegistroTrabajo .panel_Usuario {margin-bottom: 10px;} #RegistroTrabajo .NombreUsuario {margin-top: 0px; height: 25px;} #RegistroTrabajo .UsuarioActual {float:left; width: calc(100% - 75px); height: 20px; font-size: 0.8em; margin-left: 5px;} #RegistroTrabajo .FechaHora {float:left; width: calc(100% - 75px); height: 25px; font-size: 0.8em; margin-left: 5px;} #Planificado_idList { display: flex; flex-wrap: wrap; gap:5px;} #Planificado_idList .list-item {margin-bottom: 12px; padding: 0px; border: 1px solid var(--Verde-color);} @media (min-width: 800px) {#Planificado_idList .list-item { width: calc(50% - 5px);}} #Planificado_idList .notification{position: absolute; top: 10px; right: 10px; font-size: 0.9rem} #Planificado_idList .list-item__title{font-weight: bold;} #Planificado_idList .list-item__subtitle{font-size: 0.9rem; margin-top: 0.2rem; color: var(--Verde-color);} #Planificado_idList .list-item__center {flex: 1;} #Planificado_idList .list-item__left {width: 45px; height: 45px; padding: 0px; margin-right: 15px;} #Planificado_idList .list-item__thumbnail {width: 45px; height: 45px; border-radius: 50%;} #Planificado_idList img {object-fit: cover;} /* --------------------------------------*/ /* -------------------------------------- CONTROLESREALIZADOS -------------------------------------- */ #ControlesRealizados .toolbar {background: var(--Naranja-color);} #ControlesRealizados #panel_Cabecera {width: 100%; height: 150px; margin-top: 10px; } #ControlesRealizados #panel_Foto {float:left; width: 70px; height: 80px; text-align: center; overflow: hidden;} #ControlesRealizados #Foto {border-radius: 50%; width: 60px; height: 70px; object-fit: cover;} #ControlesRealizados #panel_DesdeFecha {float:left; width: calc(100% - 75px); height: 30px; font-size: 1em; margin-left: 5px; margin-top: 10px; text-align: right; } #ControlesRealizados #DesdeFecha {font-size: 0.9em;} #ControlesRealizados #panel_HastaFecha {float:left; width: calc(100% - 75px); height: 30px; font-size: 1em; margin-left: 5px; margin-top: 10px; text-align: right;} #ControlesRealizados #HastaFecha {font-size: 0.9em;} #ControlesRealizados #panel_Realizados {float:left; width: 100%; height: 40px;} #ControlesRealizados #idRealizados {width: 100%; text-align: center; font-size: 13px; height: 28px;} #ControlesRealizados #panel_Controles {float:left; width: 100%; height: 40px;} #ControlesRealizados #idControl {width: 100%; text-align: center;} /* -------------------------------------- MANTREGCONTROL -------------------------------------- */ #MantRegControl .toolbar {background: var(--Naranja-color);} #MantRegControl #panel_Cabecera {width: 100%; height: 70px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color);} #MantRegControl #panel_Foto {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantRegControl #Imagen {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantRegControl #Descripcion {float:left; width: calc(100% - 75px); height: auto; font-size: 1.1em; margin-left: 5px; margin-top: 20px; text-align: center;} #MantRegControl #EstadoRegistro {float:left; width: calc(100% - 75px); height: auto; font-size: 0.9em; margin-left: 5px; margin-top: 5px; text-align: center; color:red;} #MantRegControl #fRegControl {margin-top: 20px;} #MantRegControl fieldset {padding: 0px; border-style: none;} #MantRegControl label {font-size: 0.9rem; color: var(--Verde-color); margin-bottom: 2px; font-weight: normal;} #MantRegControl span {font-size: 1rem; width: 100%; height: auto;} #MantRegControl input, #MantRegControl select {font-size: 1rem; height: auto;} #MantRegControl #panel_Ayuda {float:left; width: 100%; height: auto; margin-bottom: 5px;} #MantRegControl #panel_ObserGeneral {float:left; width: 100%; height: auto; margin-bottom: 10px;} #MantRegControl #panel_ObserParticular {float:left; width: 100%; height: auto; margin-bottom: 10px;} #MantRegControl #panel_FotoResidente {float:left; width: 100%; height: 70px; text-align: center; overflow: hidden;} #MantRegControl #FotoResidente {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} /* Estilos para la pantalla en horizontal */ @media only screen and (orientation: landscape) { /* Contenedor flex para alinear la imagen con los paneles de observaciones */ #MantRegControl #panel_Ayuda { width: calc(100% - 80px); } #MantRegControl #panel_FotoResidente { width: 75px; } } #MantRegControl #panel_Residente {float:left; width: 100%; height: 75px;} #MantRegControl #DB_CodResidente {width: 100%;} #MantRegControl #panel_FechaControl {float:left; width: 50%; height: 65px;} #MantRegControl #Fecha {width: calc(100% - 15px);} #MantRegControl #panel_Hora {float:left; width: 105px; height: 65px;} #MantRegControl #DB_Hora {width: 90px;} #MantRegControl #panel_Tipo1 {float:left; width: 100%; height: auto;} #MantRegControl #panel_TipodeCambio {float:left; width: 100%; height: 75px;} #MantRegControl #DB_TipodeCambio {width: 100%;} #MantRegControl #panel_Tipo3 {float:left; width: 100%; height: auto;} #MantRegControl #panel_DiuCantidad {float:left; width: 50%; height: 65px;} #MantRegControl #DB_DiuCantidad {width: 150px;} #MantRegControl #panel_NPanales {float:left; width: 50%; height: 65px;} #MantRegControl #DB_NPanales {width: 150px;} #MantRegControl #panel_Tipo4 {float:left; width: 100%; height: auto;} #MantRegControl #panel_Glucemia {float:left; width: 100%; height: 65px;} #MantRegControl #DB_Glucemia {width: 150px;} #MantRegControl #panel_Tipo5 {float:left; width: 100%; height: auto;} #MantRegControl #panel_Comida {float:left; width: 100%; height: 75px;} #MantRegControl #DB_Comida {width: 100%;} #MantRegControl #panel_Tipo6 {float:left; width: 100%; height: auto;} #MantRegControl #panel_Unidad {float:left; width: 100%; height: 20px; font-size: 0.9em; background-color: var(--Naranja-color); margin-bottom: 10px; text-align: center;} #MantRegControl #panel_Desayuno {float:left; width: 40%; height: 40px;} #MantRegControl #DB_Desayuno {width: 20px;} #MantRegControl #panel_PorDesayuno {float:left; width: 60%; height: 40px;} #MantRegControl #DB_PorDesayuno {width: 100px; } #MantRegControl #panel_Almuerzo {float:left; width: 40%; height: 40px;} #MantRegControl #DB_Almuerzo {width: 20px;} #MantRegControl #panel_PorAlmuerzo {float:left; width: 60%; height: 40px;} #MantRegControl #DB_PorAlmuerzo {width: 100px; } #MantRegControl #panel_AlmTotal {float:left; width: 100%; display: none;} #MantRegControl #panel_Alm_1Plato {float:left; width: 40%; height: 35px; margin-left: 25px;} #MantRegControl #DB_Alm_1Plato {width: 20px;} #MantRegControl #panel_Por_Alm_1Plato {float:left; width: calc(60% - 25px); height: 35px;} #MantRegControl #DB_Por_Alm_1Plato {width: 100px; } #MantRegControl #panel_Alm_2Plato {float:left; width: 40%; height: 35px; margin-left: 25px;} #MantRegControl #DB_Alm_2Plato {width: 20px;} #MantRegControl #panel_Por_Alm_2Plato {float:left; width: calc(60% - 25px); height: 35px;} #MantRegControl #DB_Por_Alm_2Plato {width: 100px; } #MantRegControl #panel_Alm_Postre {float:left; width: 40%; height: 35px; margin-left: 25px;} #MantRegControl #DB_Alm_Postre {width: 20px;} #MantRegControl #panel_Por_Alm_Postre {float:left; width: calc(60% - 25px); height: 35px;} #MantRegControl #DB_Por_Alm_Postre {width: 100px; } #MantRegControl #panel_Merienda {float:left; width: 40%; height: 40px;} #MantRegControl #DB_Merienda {width: 20px;} #MantRegControl #panel_PorMerienda {float:left; width: 60%; height: 40px;} #MantRegControl #DB_PorMerienda {width: 100px; } #MantRegControl #panel_Cena {float:left; width: 40%; height: 40px;} #MantRegControl #DB_Cena {width: 20px;} #MantRegControl #panel_PorCena {float:left; width: 60%; height: 40px;} #MantRegControl #DB_PorCena {width: 100px; } #MantRegControl #panel_CenaTotal {float:left; width: 100%; display: none;} #MantRegControl #panel_Cena_1Plato {float:left; width: 40%; height: 35px; margin-left: 25px;} #MantRegControl #DB_Cena_1Plato {width: 20px;} #MantRegControl #panel_Por_Cena_1Plato {float:left; width: calc(60% - 25px); height: 35px;} #MantRegControl #DB_Por_Cena_1Plato {width: 100px; } #MantRegControl #panel_Cena_2Plato {float:left; width: 40%; height: 35px; margin-left: 25px;} #MantRegControl #DB_Cena_2Plato {width: 20px;} #MantRegControl #panel_Por_Cena_2Plato {float:left; width: calc(60% - 25px); height: 35px;} #MantRegControl #DB_Por_Cena_2Plato {width: 100px; } #MantRegControl #panel_Cena_Postre {float:left; width: 40%; height: 35px; margin-left: 25px;} #MantRegControl #DB_Cena_Postre {width: 20px;} #MantRegControl #panel_Por_Cena_Postre {float:left; width: calc(60% - 25px); height: 35px;} #MantRegControl #DB_Por_Cena_Postre {width: 100px; } #MantRegControl #panel_Recena {float:left; width: 40%; height: 40px;} #MantRegControl #DB_Recena {width: 20px;} #MantRegControl #panel_PorRecena {float:left; width: 60%; height: 40px;} #MantRegControl #DB_PorRecena {width: 100px; } #MantRegControl #panel_Varios {float:left; width: 40%; height: 40px;} #MantRegControl #DB_Varios {width: 20px;} #MantRegControl #panel_PorVarios {float:left; width: 40%; height: 40px;} #MantRegControl #DB_PorVarios {width: 100px; } #MantRegControl #panel_PorTotal {float:left; width: 60%; height: 40px;} #MantRegControl #DB_PorTotal {width: 100px; } #MantRegControl #panel_Tipo7 {float:left; width: 100%; height: auto;} #MantRegControl #panel_Medicacion {float:left; width: 100%; height: 65px;} #MantRegControl #DB_Medicacion {width: 100%;} #MantRegControl #panel_Lote {float:left; width: 100%; height: 65px;} #MantRegControl #DB_Lote {width: 100%;} #MantRegControl #panel_FechaCaducidad {float:left; width: 100%; height: 65px;} #MantRegControl #FechaCaducidad {width: 150px;} #MantRegControl #panel_Tipo8 {float:left; width: 100%; height: auto;} #MantRegControl #panel_AntPeso {float:left; width: 50%; height: 65px;} #MantRegControl #AntPeso {width: 100px;} #MantRegControl #panel_AntTalla {float:left; width: 50%; height: 65px;} #MantRegControl #AntTalla {width: 100px;} #MantRegControl #panel_Peso {float:left; width: 33%; height: 65px;} #MantRegControl #DB_Peso {width: 100px;} #MantRegControl #panel_Talla {float:left; width: 33%; height: 65px;} #MantRegControl #DB_Talla {width: 100px;} #MantRegControl #panel_IMC {float:left; width: 33%; height: 65px;} #MantRegControl #DB_IMC {width: 100px;} #MantRegControl #panel_PesoVariacion2 {float:left; width: 50%; height: 65px;} #MantRegControl #DB_PesoVariacion2 {width: 100px;} #MantRegControl #panel_PesoVariacion {float:left; width: 50%; height: 65px;} #MantRegControl #DB_PesoVariacion {width: 100px;} #MantRegControl #panel_Tipo9 {float:left; width: 100%; height: auto;} #MantRegControl #panel_Pulso {float:left; width: 100%; height: 65px;} #MantRegControl #DB_Pulso {width: 100px;} #MantRegControl #panel_Tipo10 {float:left; width: 100%; height: auto;} #MantRegControl #panel_FisCantidad {float:left; width: 100%; height: 65px;} #MantRegControl #DB_FisCantidad {width: 100px;} #MantRegControl #panel_Tipo11 {float:left; width: 100%; height: auto;} #MantRegControl #panel_Sato2 {float:left; width: 100%; height: 65px;} #MantRegControl #DB_Sato2 {width: 100px;} #MantRegControl #panel_Tipo12 {float:left; width: 100%; height: auto;} #MantRegControl #panel_FechaInicio {float:left; width: 50%; height: 65px;} #MantRegControl #FechaInicio {width: 150px;} #MantRegControl #panel_IRN {float:left; width: 50%; height: 65px;} #MantRegControl #DB_IRN {width: 100px;} #MantRegControl #panel_FechaRevision4 {float:left; width: 100%; height: 65px;} #MantRegControl #FechaRevision4 {width: 150px;} #MantRegControl #panel_Tipo13 {float:left; width: 100%; height: auto;} #MantRegControl #panel_FechaRevision1 {float:left; width: 50%; height: 65px;} #MantRegControl #FechaRevision1 {width: 150px;} #MantRegControl #panel_NSonda1 {float:left; width: 50%; height: 65px;} #MantRegControl #DB_NSonda1 {width: 100px;} #MantRegControl #panel_Tipo14 {float:left; width: 100%; height: auto;} #MantRegControl #panel_FechaRevision2 {float:left; width: 50%; height: 65px;} #MantRegControl #FechaRevision2 {width: 150px;} #MantRegControl #panel_NSonda2 {float:left; width: 50%; height: 65px;} #MantRegControl #DB_NSonda2 {width: 100px;} #MantRegControl #panel_Tipo15 {float:left; width: 100%; height: auto;} #MantRegControl #panel_FechaRevision3 {float:left; width: 50%; height: 65px;} #MantRegControl #FechaRevision3 {width: 150px;} #MantRegControl #panel_NSonda3 {float:left; width: 50%; height: 65px;} #MantRegControl #DB_NSonda3 {width: 100px;} #MantRegControl #panel_Tipo16 {float:left; width: 100%; height: auto;} #MantRegControl #panel_Temperatura {float:left; width: 100%; height: 65px;} #MantRegControl #DB_Temperatura {width: 100px;} #MantRegControl #panel_Tipo17 {float:left; width: 100%; height: auto;} #MantRegControl #panel_Sistolica {float:left; width: 50%; height: 65px;} #MantRegControl #DB_Sistolica {width: 150px;} #MantRegControl #panel_Diastolica {float:left; width: 50%; height: 65px;} #MantRegControl #DB_Diastolica {width: 150px;} #MantRegControl #panel_PAM {float:left; width: 100%; height: 65px;} #MantRegControl #DB_PAM {width: 150px;} #MantRegControl #panel_Tipo21 {float:left; width: 100%; height: auto;} #MantRegControl #panel_RealiPropio {float:left; width: 100px; height: 65px;} #MantRegControl #DB_RealiPropio {width: 20px;} #MantRegControl #panel_ResulPropio {float:left; width: calc(100% - 100px); height: 65px;} #MantRegControl #DB_ResulPropio {width: 100px;} #MantRegControl #panel_Tipo23 {float:left; width: 100%; height: auto;} #MantRegControl #panel_LugarSujecion {float:left; width: 100%; height: 75px;} #MantRegControl #DB_LugarSujecion {width: 100%;} #MantRegControl #panel_EFisiologico {float:left; width: 100%; height: 75px;} #MantRegControl #DB_EFisiologico {width: 100%;} #MantRegControl #panel_EPsicologico {float:left; width: 100%; height: 75px;} #MantRegControl #DB_EPsicologico {width: 100%;} #MantRegControl #panel_ESujecion {float:left; width: 100%; height: 75px;} #MantRegControl #DB_ESujecion {width: 100%;} #MantRegControl #panel_Observaciones {float:left; width: 100%; height: 80px;} #MantRegControl #DB_Observaciones {width: 100%;} /* -------------------------------------- MANTREGCONTROLVACUNA -------------------------------------- */ #MantRegControlVacuna .toolbar {background: var(--Naranja-color);} #MantRegControlVacuna #panel_Cabecera {width: 100%; height: 70px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color);} #MantRegControlVacuna #panel_Foto {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantRegControlVacuna #Imagen {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantRegControlVacuna #Descripcion {float:left; width: calc(100% - 75px); height: auto; font-size: 1.1em; margin-left: 5px; margin-top: 20px; text-align: center;} #MantRegControlVacuna #EstadoRegistro {float:left; width: calc(100% - 75px); height: auto; font-size: 0.9em; margin-left: 5px; margin-top: 5px; text-align: center; color:red;} #MantRegControlVacuna #fRegControl {margin-top: 20px;} #MantRegControlVacuna fieldset {padding: 0px; border-style: none;} #MantRegControlVacuna label {font-size: 0.9rem; color: var(--Verde-color); margin-bottom: 2px; font-weight: normal;} #MantRegControlVacuna span {font-size: 1rem; width: 100%; height: auto;} #MantRegControlVacuna input, #MantRegControlVacuna select {font-size: 1rem; height: auto;} #MantRegControlVacuna #panel_Ayuda {float:left; width: 100%; height: auto; margin-bottom: 5px;} #MantRegControlVacuna #panel_ObserGeneral {float:left; width: 100%; height: auto; margin-bottom: 10px;} #MantRegControlVacuna #panel_ObserParticular {float:left; width: 100%; height: auto; margin-bottom: 10px;} #MantRegControlVacuna #panel_FotoResidente {float:left; width: 100%; height: 70px; text-align: center; overflow: hidden;} #MantRegControlVacuna #FotoResidente {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} /* Estilos para la pantalla en horizontal */ @media only screen and (orientation: landscape) { /* Contenedor flex para alinear la imagen con los paneles de observaciones */ #MantRegControlVacuna #panel_Ayuda { width: calc(100% - 80px); } #MantRegControlVacuna #panel_FotoResidente { width: 75px; } } #MantRegControlVacuna #panel_Residente {float:left; width: 100%; height: 75px;} #MantRegControlVacuna #DB_CodResidente {width: 100%;} #MantRegControlVacuna #panel_Fecha {float:left; width: 50%; height: 65px;} #MantRegControlVacuna #Fecha {width: calc(100% - 15px);} #MantRegControlVacuna #panel_Hora {float:left; width: 105px; height: 65px;} #MantRegControlVacuna #DB_Hora {width: 90px;} #MantRegControlVacuna #panel_LugarPuncion {float:left; width: 100%; height: 75px;} #MantRegControlVacuna #DB_idLugarPuncion {width: 100%;} #MantRegControlVacuna #panel_Vacuna {float:left; width: 100%; height: 75px;} #MantRegControlVacuna #DB_Vacuna {width: 100%;} #MantRegControlVacuna #panel_Lote {float:left; width: 100%; height: 65px;} #MantRegControlVacuna #DB_Lote {width: 100%;} #MantRegControlVacuna #panel_FechaCaducidad {float:left; width: 100%; height: 65px;} #MantRegControlVacuna #FechaCaducidad {width: 150px;} #MantRegControlVacuna #panel_NombreComercial {float:left; width: 100%; height: 65px;} #MantRegControlVacuna #DB_NombreComercial {width: 100%;} #MantRegControlVacuna #panel_Laboratorio {float:left; width: 100%; height: 65px;} #MantRegControlVacuna #DB_Laboratorio {width: 100%;} #MantRegControlVacuna #panel_Observaciones {float:left; width: 100%; height: 80px;} #MantRegControlVacuna #DB_Observaciones {width: 100%;} /* -------------------------------------- MANTREGCONTROLCURA -------------------------------------- */ #MantRegControlCura .toolbar {background: var(--Naranja-color);} #MantRegControlCura #panel_Cabecera {width: 100%; height: 70px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color);} #MantRegControlCura #panel_Foto {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantRegControlCura #Imagen {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantRegControlCura #Descripcion {float:left; width: calc(100% - 75px); height: auto; font-size: 1.1em; margin-left: 5px; margin-top: 20px; text-align: center;} #MantRegControlCura #EstadoRegistro {float:left; width: calc(100% - 75px); height: auto; font-size: 0.9em; margin-left: 5px; margin-top: 5px; text-align: center; color:red;} #MantRegControlCura #fRegControl {margin-top: 20px;} #MantRegControlCura fieldset {padding: 0px; border-style: none;} #MantRegControlCura label {font-size: 0.9rem; color: var(--Verde-color); margin-bottom: 2px; font-weight: normal;} #MantRegControlCura span {font-size: 1rem; width: 100%; height: auto;} #MantRegControlCura input, #MantRegControlCura select {font-size: 1rem; height: auto;} #MantRegControlCura #panel_Ayuda {float:left; width: 100%; height: auto; margin-bottom: 5px;} #MantRegControlCura #panel_ObserGeneral {float:left; width: 100%; height: auto; margin-bottom: 10px;} #MantRegControlCura #panel_ObserParticular {float:left; width: 100%; height: auto; margin-bottom: 10px;} #MantRegControlCura #panel_FotoResidente {float:left; width: 100%; height: 70px; text-align: center; overflow: hidden;} #MantRegControlCura #FotoResidente {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} /* Estilos para la pantalla en horizontal */ @media only screen and (orientation: landscape) { /* Contenedor flex para alinear la imagen con los paneles de observaciones */ #MantRegControlCura #panel_Ayuda { width: calc(100% - 80px); } #MantRegControlCura #panel_FotoResidente { width: 75px; } } #MantRegControlCura #panel_Residente {float:left; width: 100%; height: 75px;} #MantRegControlCura #DB_CodResidente {width: 100%;} #MantRegControlCura #panel_Fecha {float:left; width: 50%; height: 65px;} #MantRegControlCura #Fecha {width: calc(100% - 15px);} #MantRegControlCura #panel_Hora {float:left; width: 105px; height: 65px;} #MantRegControlCura #DB_Hora {width: 90px;} #MantRegControlCura #panel_OrigenCura {float:left; width: 100%; height: 75px;} #MantRegControlCura #DB_OrigenCura {width: 100%;} #MantRegControlCura #panel_LocaCura {float:left; width: 100%; height: 75px;} #MantRegControlCura #DB_LocaCura {width: 100%;} #MantRegControlCura #panel_EstadioCura {float:left; width: 100%; height: 75px;} #MantRegControlCura #DB_EstadioCura {width: 100px;} #MantRegControlCura #panel_EstLocalCura {float:left; width: 100%; height: 75px;} #MantRegControlCura #DB_EstLocalCura {width: 100%;} #MantRegControlCura #panel_TractEnfCura {float:left; width: 100%; height: 65px;} #MantRegControlCura #DB_TractEnfCura {width: 100%;} #MantRegControlCura #panel_TractMedCura {float:left; width: 100%; height: 65px;} #MantRegControlCura #DB_TractMedCura {width: 100%;} #MantRegControlCura #panel_FCuracion {float:left; width: 100%; height: 65px;} #MantRegControlCura #FCuracion {width: 150px;} #MantRegControlCura #panel_Observaciones {float:left; width: 100%; height: 70px;} #MantRegControlCura #DB_Observaciones {width: 100%;} #MantRegControlCura #panel_FotoCura {float:left; display:flex; justify-content: flex-start;} #MantRegControlCura #panel_Img_Foto {width: 100%; height: 300px; margin: 5px;} #MantRegControlCura #panel_Botones {width: 100%; height: 45px; margin: 26px 5px 5px 5px;} /* -------------------------------------- MANTREGCONTROLCAIDA -------------------------------------- */ #MantRegControlCaida .toolbar {background: var(--Naranja-color);} #MantRegControlCaida #panel_Cabecera {width: 100%; height: 70px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color);} #MantRegControlCaida #panel_Foto {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantRegControlCaida #Imagen {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantRegControlCaida #Descripcion {float:left; width: calc(100% - 75px); height: auto; font-size: 1.1em; margin-left: 5px; margin-top: 20px; text-align: center;} #MantRegControlCaida #EstadoRegistro {float:left; width: calc(100% - 75px); height: auto; font-size: 0.9em; margin-left: 5px; margin-top: 5px; text-align: center; color:red;} #MantRegControlCaida #fRegControl {margin-top: 20px;} #MantRegControlCaida fieldset {padding: 0px; border-style: none;} #MantRegControlCaida .container {width: 100%; border: 1px solid #ccc; border-radius: 5px; overflow: hidden; transition: max-height 0.3s ease-in-out;} #MantRegControlCaida .header {background-color: var(--Verde-degradado); color: black; padding: 5px; display: flex; justify-content: space-between; align-items: center; cursor: pointer;} #MantRegControlCaida .header span {font-size: 0.8rem; width: 100%; height: auto;} #MantRegControlCaida .content {padding: 5px; height: auto; display: none; padding: 5px 15px 0px 5px;} #MantRegControlCaida .jlboton {width: 30px;} #MantRegControlCaida label {font-size: 0.9rem; color: var(--Verde-color); margin-bottom: 2px; font-weight: normal;} #MantRegControlCaida span {font-size: 1rem; width: 100%; height: auto;} #MantRegControlCaida input, #MantRegControlCaida select {font-size: 1rem; height: auto;} #MantRegControlCaida #panel_Ayuda {float:left; width: 100%; height: auto; margin-bottom: 5px;} #MantRegControlCaida #panel_ObserGeneral {float:left; width: 100%; height: auto; margin-bottom: 10px;} #MantRegControlCaida #panel_ObserParticular {float:left; width: 100%; height: auto; margin-bottom: 10px;} #MantRegControlCaida #panel_FotoResidente {float:left; width: 100%; height: 70px; text-align: center; overflow: hidden;} #MantRegControlCaida #FotoResidente {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} /* Estilos para la pantalla en horizontal */ @media only screen and (orientation: landscape) { /* Contenedor flex para alinear la imagen con los paneles de observaciones */ #MantRegControlCaida #panel_Ayuda { width: calc(100% - 80px); } #MantRegControlCaida #panel_FotoResidente { width: 75px; } } #MantRegControlCaida #panel_Residente {float:left; width: 100%; height: 75px;} #MantRegControlCaida #DB_CodResidente {width: 100%;} #MantRegControlCaida #panel_Sujeciones {float:left; width: 100%; height: auto; margin-bottom: 10px; min-height: 65px} #MantRegControlCaida #panel_Fecha {float:left; width: 135px; height: 65px;} #MantRegControlCaida #Fecha {width: 125px;} #MantRegControlCaida #panel_HoraIni {float:left; width: 95px; height: 65px;} #MantRegControlCaida #DB_HoraIni {width: 85px;} #MantRegControlCaida #panel_Hora {float:left; width: calc(100% - 230px); height: 65px;} #MantRegControlCaida #DB_Hora {width: 85px;} #MantRegControlCaida #panel_LugarCaida {float:left; width: 100%; height: 75px;} #MantRegControlCaida #DB_LugarCaida {width: 100%;} #MantRegControlCaida #panel_PlantaCaida {float:left; width: 100%; height: 65px;} #MantRegControlCaida #DB_PlantaCaida {width: 100%;} #MantRegControlCaida #panel_FacRiesgoCaida {float:left; width: 100%; height: 65px;} #MantRegControlCaida #DB_FacRiesgoCaida {width: 100%;} #MantRegControlCaida #panel_CausaCaida {float:left; width: 100%; height: 65px;} #MantRegControlCaida #DB_CausaCaida {width: 100%;} #MantRegControlCaida #panel_CircusCaida {float:left; width: 100%; height: 65px;} #MantRegControlCaida #DB_CircusCaida {width: 100%;} #MantRegControlCaida #panel_ConseCaida {float:left; width: 100%; height: 65px;} #MantRegControlCaida #DB_ConseCaida {width: 100%;} #MantRegControlCaida #panel_MedidasCaida {float:left; width: 100%; height: 65px;} #MantRegControlCaida #DB_MedidasCaida {width: 100%;} #MantRegControlCaida #panel_TinettiCaida {float:left; width: 55%; height: 65px;} #MantRegControlCaida #TinettiCaida {width: 150px;} #MantRegControlCaida #panel_ResCaida {float:left; width: 45%; height: 65px;} #MantRegControlCaida #DB_ResCaida {width: 100%;} #MantRegControlCaida #panel_ValoraCaida {float:left; width: 100%; height: 65px;} #MantRegControlCaida #DB_ValoraCaida {width: 100%;} #MantRegControlCaida #panel_DetectaCaida {float:left; width: 100%; height: 75px;} #MantRegControlCaida #DB_DetectaCaida {width: 100%;} #MantRegControlCaida #panel_Observaciones {float:left; width: 100%; height: 70px;} #MantRegControlCaida #DB_Observaciones {width: 100%;} #MantRegControlCaida #panel_FamiliarCaida{float:left; width: calc(100% - 100px); height: 55px; margin-top: 10px} #MantRegControlCaida #DB_FamiliarCaida {width: 20px;} #MantRegControlCaida #panel_HoraInfFamiliar {float:left; width: 100px; height: 65px;} #MantRegControlCaida #DB_HoraInfFamiliar {width: 85px;} #MantRegControlCaida #panel_ContactoCaida {float:left; width: calc(100% - 35px); height: 80px;} #MantRegControlCaida #ContactoCaida {width: calc(100% - 5px);} #MantRegControlCaida #panel_bContactoCaida {float:left; width: 35px; height: 45px; margin-top: 5px;} #MantRegControlCaida #panel_Seleccion {width:calc( 90% - 10px); height: auto; margin: auto; padding: 5px; background-color: white; border-radius: 5px; } #MantRegControlCaida #idSeleccion {display: none;} #MantRegControlCaida #item-list {height: calc(100vh - 270px); overflow: scroll; margin-bottom: 15px; } /* -------------------------------------- MANTREGCONTROLPANNAL -------------------------------------- */ #MantRegControlPannal .toolbar {background: var(--Naranja-color);} #MantRegControlPannal #panel_Cabecera {width: 100%; height: 70px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color);} #MantRegControlPannal #panel_Foto {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantRegControlPannal #Imagen {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantRegControlPannal #Descripcion {float:left; width: calc(100% - 75px); height: auto; font-size: 1.1em; margin-left: 5px; margin-top: 20px; text-align: center;} #MantRegControlPannal #EstadoRegistro {float:left; width: calc(100% - 75px); height: auto; font-size: 0.9em; margin-left: 5px; margin-top: 5px; text-align: center; color:red;} #MantRegControlPannal #fRegControl {margin-top: 20px;} #MantRegControlPannal fieldset {padding: 0px; border-style: none;} #MantRegControlPannal label {font-size: 0.9rem; color: var(--Verde-color); margin-bottom: 2px; font-weight: normal;} #MantRegControlPannal span {font-size: 1rem; width: 100%; height: auto;} #MantRegControlPannal input, #MantRegControlPannal select {font-size: 1rem; height: auto;} #MantRegControlPannal #panel_Ayuda {float:left; width: 100%; height: auto; margin-bottom: 5px;} #MantRegControlPannal #panel_ObserGeneral {float:left; width: 100%; height: auto; margin-bottom: 10px;} #MantRegControlPannal #panel_ObserParticular {float:left; width: 100%; height: auto; margin-bottom: 10px;} #MantRegControlPannal #panel_FotoResidente {float:left; width: 100%; height: 70px; text-align: center; overflow: hidden;} #MantRegControlPannal #FotoResidente {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} /* Estilos para la pantalla en horizontal */ @media only screen and (orientation: landscape) { /* Contenedor flex para alinear la imagen con los paneles de observaciones */ #MantRegControlPannal #panel_Ayuda { width: calc(100% - 80px); } #MantRegControlPannal #panel_FotoResidente { width: 75px; } } #MantRegControlPannal #panel_Residente {float:left; width: 100%; height: 75px;} #MantRegControlPannal #DB_CodResidente {width: 100%;} #MantRegControlPannal #panel_Fecha {float:left; width: 50%; height: 65px;} #MantRegControlPannal #Fecha {width: calc(100% - 15px);} #MantRegControlPannal #panel_Hora {float:left; width: 105px; height: 65px;} #MantRegControlPannal #DB_Hora {width: 90px;} #MantRegControlPannal #panel_Cantidad {float:left; width: 50%; height: 60px;} #MantRegControlPannal #DB_Cantidad {width: 120px;} #MantRegControlPannal #panel_Periodo {float:left; width: 50%; height: 60px;} #MantRegControlPannal #DB_Periodo {width: 150px;} #MantRegControlPannal #panel_TipoPannal {float:left; width: 100%; height: 65px;} #MantRegControlPannal #DB_idTipoPannal {width: 100%;} #MantRegControlPannal #panel_Sala {float:left; width: 100%; height: 65px;} #MantRegControlPannal #DB_idSala {width: 100%;} #MantRegControlPannal #panel_Observaciones {float:left; width: 100%; height: 65px;} #MantRegControlPannal #DB_Observaciones {width: 100%;} /* -------------------------------------- MANTREGCONTROLDEPOSICION -------------------------------------- */ #MantRegControlDeposicion .toolbar {background: var(--Naranja-color);} #MantRegControlDeposicion #panel_Cabecera {width: 100%; height: 70px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color);} #MantRegControlDeposicion #panel_Foto {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantRegControlDeposicion #Imagen {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantRegControlDeposicion #Descripcion {float:left; width: calc(100% - 75px); height: auto; font-size: 1.1em; margin-left: 5px; margin-top: 20px; text-align: center;} #MantRegControlDeposicion #EstadoRegistro {float:left; width: calc(100% - 75px); height: auto; font-size: 0.9em; margin-left: 5px; margin-top: 5px; text-align: center; color:red;} #MantRegControlDeposicion #fRegControl {margin-top: 20px;} #MantRegControlDeposicion fieldset {padding: 0px; border-style: none;} #MantRegControlDeposicion label {font-size: 0.9rem; color: var(--Verde-color); margin-bottom: 2px; font-weight: normal;} #MantRegControlDeposicion span {font-size: 1rem; width: 100%; height: auto;} #MantRegControlDeposicion input, #MantRegControlDeposicion select {font-size: 1rem; height: auto;} #MantRegControlDeposicion #panel_Ayuda {float:left; width: 100%; height: auto; margin-bottom: 5px;} #MantRegControlDeposicion #panel_ObserGeneral {float:left; width: 100%; height: auto; margin-bottom: 10px;} #MantRegControlDeposicion #panel_ObserParticular {float:left; width: 100%; height: auto; margin-bottom: 10px;} #MantRegControlDeposicion #panel_FotoResidente {float:left; width: 100%; height: 70px; text-align: center; overflow: hidden;} #MantRegControlDeposicion #FotoResidente {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} /* Estilos para la pantalla en horizontal */ @media only screen and (orientation: landscape) { /* Contenedor flex para alinear la imagen con los paneles de observaciones */ #MantRegControlDeposicion #panel_Ayuda { width: calc(100% - 80px); } #MantRegControlDeposicion #panel_FotoResidente { width: 75px; } } #MantRegControlDeposicion #panel_Residente {float:left; width: 100%; height: 70px;} #MantRegControlDeposicion #DB_CodResidente {width: 100%;} #MantRegControlDeposicion #panel_Fecha {float:left; width: 50%; height: 65px;} #MantRegControlDeposicion #Fecha {width: calc(100% - 15px);} #MantRegControlDeposicion #panel_Hora {float:left; width: 105px; height: 65px;} #MantRegControlDeposicion #DB_Hora {width: 90px;} #MantRegControlDeposicion #panel_NDeposiciones {float:left; width: 100%; height: 65px;} #MantRegControlDeposicion #DB_NDeposiciones {width: 100px;} #MantRegControlDeposicion #panel_Aspecto {float:left; width: 100%; height: 75px;} #MantRegControlDeposicion #DB_Aspecto {width: 100%;} #MantRegControlDeposicion #panel_Observaciones {float:left; width: 100%; height: 80px;} #MantRegControlDeposicion #DB_Observaciones {width: 100%;} /* -------------------------------------- TAREASREALIZADAS -------------------------------------- */ #TareasRealizadas .toolbar {background: var(--Naranja-color);} #TareasRealizadas #panel_Cabecera {width: 100%; height: 150px; margin-top: 10px; } #TareasRealizadas #panel_Foto {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #TareasRealizadas #Foto {border-radius: 50%; width: 60px; height: 70px; object-fit: cover;} #TareasRealizadas #panel_DesdeFecha {float:left; width: calc(100% - 75px); height: 25px; font-size: 1em; margin-left: 5px; margin-top: 10px; text-align: right; } #TareasRealizadas #DesdeFecha {font-size: 0.9em;} #TareasRealizadas #panel_HastaFecha {float:left; width: calc(100% - 75px); height: 25px; font-size: 1em; margin-left: 5px; margin-top: 10px; text-align: right;} #TareasRealizadas #HastaFecha {font-size: 0.9em;} #TareasRealizadas #panel_Realizados {float:left; width: 100%; height: 40px;} #TareasRealizadas #idRealizados {width: 100%; text-align: center; font-size: 13px; height: 28px;} #TareasRealizadas #panel_Subtarea {width: 100%; height: 40px;} #TareasRealizadas #idSubtarea {width: 100%; text-align: center;} /* -------------------------------------- MANREGTAREA -------------------------------------- */ #MantRegTarea .toolbar {background: var(--Naranja-color);} #MantRegTarea #panel_Cabecera {width: 100%; height: 70px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color);} #MantRegTarea #panel_Foto {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantRegTarea #Imagen {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantRegTarea #Descripcion {float:left; width: calc(100% - 75px); height: auto; font-size: 1.1em; margin-left: 5px; margin-top: 20px; text-align: center;} #MantRegTarea #EstadoRegistro {float:left; width: calc(100% - 75px); height: auto; font-size: 0.9em; margin-left: 5px; margin-top: 5px; text-align: center; color:red;} #MantRegTarea #fRegTarea {margin-top: 20px;} #MantRegTarea fieldset {padding: 0px; border-style: none;} #MantRegTarea label {font-size: 0.9rem; color: var(--Verde-color); margin-bottom: 2px; font-weight: normal;} #MantRegTarea span {font-size: 1rem; width: 100%; height: auto;} #MantRegTarea input, #MantRegTarea select {font-size: 1rem; height: auto;} #MantRegTarea #panel_FotoResidente {float:left; width: 100%; height: 70px; text-align: center; overflow: hidden;} #MantRegTarea #FotoResidente {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantRegTarea #panel_Residente {float:left; width: 100%; height: 75px;} #MantRegTarea #DB_CodResidente {width: 100%;} #MantRegTarea #panel_idLocalizacion {float:left; width: 100%; height: 75px;} #MantRegTarea #DB_idLocalizacion {width: 100%;} #MantRegTarea #panel_idSala {float:left; width: 100%; height: 75px;} #MantRegTarea #DB_idSala {width: 100%;} #MantRegTarea #panel_Fecha {float:left; width: 40%; height: 65px;} #MantRegTarea #Fecha {width: calc(100% - 15px);} #MantRegTarea #panel_HoraIni {float:left; width: 30%; height: 65px;} #MantRegTarea #DB_HoraIni {width: calc(100% - 15px);} #MantRegTarea #panel_Hora {float:left; width: 30%; height: 65px;} #MantRegTarea #DB_Hora {width: calc(100% - 15px);} #MantRegTarea #panel_botones {float:left; width: 60%; height: 40px; margin-left: 40%; margin-bottom: 10px;} #MantRegTarea #btnIniciar { background-color: var(--Naranja-color);} #MantRegTarea #btnDetener { background-color: var(--Naranja-color);} #MantRegTarea #panel_Facturar {float:left; width: 100%; height: 30px;} #MantRegTarea #Facturar {width: 20px;} #MantRegTarea #panel_Observaciones {float:left; width: 100%; height: 80px;} #MantRegTarea #DB_Observaciones {width: 100%;} /* -------------------------------------- ACTIVIDADESREALIZADAS -------------------------------------- */ #ActividadesRealizadas .toolbar {background: var(--Naranja-color);} #ActividadesRealizadas #panel_Cabecera {width: 100%; height: 100px; margin-top: 10px; } #ActividadesRealizadas #panel_Foto {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #ActividadesRealizadas #Foto {border-radius: 50%; width: 60px; height: 70px; object-fit: cover;} #ActividadesRealizadas #panel_DesdeFecha {float:left; width: calc(100% - 75px); height: 25px; font-size: 1em; margin-left: 5px; margin-top: 10px; text-align: right; } #ActividadesRealizadas #DesdeFecha {font-size: 0.9em;} #ActividadesRealizadas #panel_HastaFecha {float:left; width: calc(100% - 75px); height: 25px; font-size: 1em; margin-left: 5px; margin-top: 10px; text-align: right;} #ActividadesRealizadas #HastaFecha {font-size: 0.9em;} #ActividadesRealizadas #panel_idActividades {float:left; width: 100%; height: 40px;} #ActividadesRealizadas #idActividad {width: 100%; text-align: center;} /* -------------------------------------- MANTREGACTIVIDAD -------------------------------------- */ #MantRegActividad .toolbar {background: var(--Naranja-color);} #MantRegActividad #panel_Cabecera {width: 100%; height: 70px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color);} #MantRegActividad #panel_Imagen {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantRegActividad #Imagen {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantRegActividad #Descripcion {float:left; width: calc(100% - 75px); height: auto; font-size: 1.1em; margin-left: 5px; margin-top: 20px; text-align: center;} #MantRegActividad #EstadoRegistro {float:left; width: calc(100% - 75px); height: auto; font-size: 0.9em; margin-left: 5px; margin-top: 5px; text-align: center; color:red;} #MantRegActividad #fRegActividad {margin-top: 20px;} #MantRegActividad fieldset {padding: 0px; border-style: none;} #MantRegActividad label {font-size: 0.9rem; color: var(--Verde-color); margin-bottom: 0; font-weight: normal;} #MantRegActividad span {font-size: 1rem; width: 100%; height: auto;} #MantRegActividad input, #MantRegActividad select {font-size: 1rem; height: auto;} #MantRegActividad .jlboton {width: 30px;} #MantRegActividad #panel_Fecha {float:left; width: 44%; height: 55px;} #MantRegActividad #Fecha {width: 135px;} #MantRegActividad #panel_HoraInicio {float:left; width: 30%; height: 55px;} #MantRegActividad #DB_HoraInicio {width: 90px;} #MantRegActividad #panel_Duracion {float:left; width: 26%; height: 55px;} #MantRegActividad #DB_Duracion {width: 90px;} #MantRegActividad #panel_Sala {float:left; width: 100%; height: 65px;} #MantRegActividad #DB_idSala {width: 100%;} #MantRegActividad #panel_Observaciones {float:left; width: 100%; height: 55px;} #MantRegActividad #DB_Observaciones {width: 100%;} #MantRegActividad .panel_botones {float:left; width: 100%; height: 40px; display: flex; justify-content: space-around; margin-bottom: 10px;} #MantRegActividad .panel_botones .icon-button {font-size: 14px;} #MantRegActividad .panel_botones .icon-button ons-icon {margin-right: 7px;} #MantRegActividad #panel_Lineas {float:left; width: 100%; height: auto;} #MantRegActividad textarea {width: 100%;} /* -------------------------------------- MANTREGLACTIVIDAD -------------------------------------- */ #MantRegLActividad .toolbar {background: var(--Naranja-color);} #MantRegLActividad #panel_Cabecera01 {width: 100%; height: 140px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color);} #MantRegLActividad #panel_Imagen01 {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantRegLActividad #Imagen01 {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantRegLActividad #Descripcion01 {float:left; width: calc(100% - 75px); height: 50px; font-size: 1.1em; margin-left: 5px; margin-top: 20px; text-align: center;} #MantRegLActividad #panel_Foto01 {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantRegLActividad #Foto01 {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantRegLActividad #NombreResidente01 {float:left; width: calc(100% - 75px); height: 50px; font-size: 1.1em; margin-left: 5px; margin-top: 20px; text-align: center;} #MantRegLActividad #fRegLActividad {margin-top: 20px;} #MantRegLActividad fieldset {padding: 0px; border-style: none;} #MantRegLActividad label {font-size: 0.9rem; color: var(--Verde-color); margin-bottom: 0; font-weight: normal;} #MantRegLActividad span {font-size: 1rem; width: 100%; height: auto;} #MantRegLActividad input, #MantRegLActividad select,#MantRegLActividad textarea {font-size: 1rem;} #MantRegLActividad .jlboton {width: 30px;} #MantRegLActividad #panel_Realizada {float:left; width: 50%; height: 35px;} #MantRegLActividad #DB01_Realizada {width: 20px;} #MantRegLActividad #panel_MostrarEnWeb {float:left; width: 50%; height: 35px;} #MantRegLActividad #DB01_MostrarEnWeb {width: 20px;} #MantRegLActividad #panel_HInicio {float:left; width: 50%; height: 55px;} #MantRegLActividad #DB01_HInicio {width: 90px;} #MantRegLActividad #panel_HFin {float:left; width: 50%; height: 55px;} #MantRegLActividad #DB01_HFin {width: 90px;} #MantRegLActividad #panel_Participacion {float:left; width: calc(100% - 20px); height: 55px;} #MantRegLActividad #DB01_Participacion {width: 100%;} #MantRegLActividad #panel_GradoParticipacion {float:right; width: 20px; height: 55px;} #MantRegLActividad #GradoParticipacion {width: 18px; margin-top: 17px;} #MantRegLActividad #panel_MotivoNoAsiste {float:left; width: 100%; height: 55px;} #MantRegLActividad #DB01_MotivoNoAsiste {width: 100%;} #MantRegLActividad #panel_Observaciones {float:left; width: 100%; height: 150px;} #MantRegLActividad #DB01_Observaciones {width: 100%; height: 105px; resize: none;} /* -------------------------------------- ULCERASCAIDAS -------------------------------------- */ #UlcerasCaidas .toolbar {background: var(--Naranja-color);} #UlcerasCaidas #panel_Cabecera {width: 100%; height: 80px; margin-top: 10px; } #UlcerasCaidas #panel_Imagen {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #UlcerasCaidas #Imagen {border-radius: 50%; width: 60px; height: 70px; object-fit: cover;} #UlcerasCaidas #panel_Descripcion {float:left; width: calc(100% - 75px); height: 25px; font-size: 1em; margin-left: 5px; margin-top: 10px; text-align: center; } /* -------------------------------------- MANTREGULCERACAIDA -------------------------------------- */ #MantUlceraCaida .toolbar {background: var(--Naranja-color);} #MantUlceraCaida #panel_Cabecera {width: 100%; height: 70px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color);} #MantUlceraCaida #panel_Foto {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantUlceraCaida #Foto {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantUlceraCaida #NombreResidente {float:left; width: calc(100% - 75px); height: auto; font-size: 1.1em; margin-left: 5px; margin-top: 20px; text-align: center;} #MantUlceraCaida #fRegUlceraCaida {margin-top: 20px;} #MantUlceraCaida fieldset {padding: 0px; border-style: none;} #MantUlceraCaida label {font-size: 0.9rem; color: var(--Verde-color); margin-bottom: 0; font-weight: normal;} #MantUlceraCaida span {font-size: 1rem; width: 100%; height: auto;} #MantUlceraCaida input, #MantUlceraCaida select {font-size: 1rem; height: auto;} #MantUlceraCaida .jlboton {width: 30px;} #MantUlceraCaida #panel_FAparicion {float:left; width: 100%; height: 55px;} #MantUlceraCaida #DB01_FAparicion {width: 120px;} #MantUlceraCaida #panel_idTipo {float:left; width: 100%; height: 60px;} #MantUlceraCaida #DB01_idTipo {width: 100%;} #MantUlceraCaida #panel_idLocalizacion {float:left; width: 100%; height: 60px;} #MantUlceraCaida #DB01_idLocalizacion {width: 100%;} #MantUlceraCaida .panel_botones {float:left; width: 100%; height: 40px; display: flex; justify-content: space-around; margin-bottom: 10px;} #MantUlceraCaida .panel_botones .icon-button {font-size: 14px;} #MantUlceraCaida #panel_Lineas {float:left; width: 100%; height: auto;} /* -------------------------------------- MANTREGCURA -------------------------------------- */ #MantRegCura .toolbar {background: var(--Naranja-color);} #MantRegCura #panel_Cabecera {width: 100%; height: 70px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color); margin-bottom: 10px;} #MantRegCura #panel_Foto02 {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantRegCura #Foto02 {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantRegCura #NombreResidente02 {float:left; width: calc(100% - 75px); height: auto; font-size: 1.1em; margin-left: 5px; margin-top: 20px; text-align: center;} #MantRegCura #fRegActividad {margin-top: 20px;} #MantRegCura fieldset {padding: 0px; border-style: none;} #MantRegCura label {font-size: 0.9rem; color: var(--Verde-color); margin-bottom: 0; font-weight: normal;} #MantRegCura span {font-size: 1rem; width: 100%; height: auto;} #MantRegCura input, #MantRegCura select {font-size: 1rem; height: auto;} #MantRegCura .jlboton {width: 30px;} #MantRegCura #panel_Fecha {float:left; width: 40%; height: 55px;} #MantRegCura #Fecha {width: 110px;} #MantRegCura #panel_HoraIni {float:left; width: 30%; height: 55px;} #MantRegCura #DB02_HoraIni {width: 90px;} #MantRegCura #panel_Hora {float:left; width: 30%; height: 55px;} #MantRegCura #DB02_Hora {width: 90px;} #MantRegCura #panel_Estadio {float:left; width: 40%; height: 70px;} #MantRegCura #DB02_Estadio {width: calc(100% - 15px);} #MantRegCura #panel_Tamano {float:left; width: 60%; height: 70px;} #MantRegCura #DB02_Tamano {width: 100%; height: 32px} #MantRegCura #panel_Cultivo {float:left; width: 100%; height: 30px;} #MantRegCura #DB02_Cultivo {width: 20px;} #MantRegCura #panel_Germen {float:left; width: 100%; height: 55px;} #MantRegCura #DB02_Germen {width: 100%;} #MantRegCura #panel_Tratamiento {float:left; width: 100%; height: 55px;} #MantRegCura #DB02_Tratamiento {width: 100%;} #MantRegCura #panel_Observaciones {float:left; width: 100%; height: 55px;} #MantRegCura #DB02_Observaciones {width: 100%;} #MantRegCura .panel_Foto {width: 100%; margin: 5px 5px 20px 5px;} #MantRegCura .panel_Botones {width: 100%; height: 45px; margin: 26px 5px 5px 5px;} #MantRegCura #panel_FotoUlcera {float:left; display:flex; justify-content: flex-start;} #MantRegCura #panel_FotoCultivo {float:left; display:flex; justify-content: flex-start;} /* -------------------------------------- INCIDENCIAS -------------------------------------- */ #Incidencias .toolbar {background: var(--Naranja-color);} #Incidencias #panel_Cabecera {width: 100%; height: 80px; margin-top: 10px; } #Incidencias #panel_Foto {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #Incidencias #Foto {border-radius: 50%; width: 60px; height: 70px; object-fit: cover;} #Incidencias #panel_DesdeFecha {float:left; width: calc(100% - 75px); height: 25px; font-size: 1em; margin-left: 5px; margin-top: 10px; text-align: right; } #Incidencias #DesdeFecha {font-size: 0.9em;} #Incidencias #panel_HastaFecha {float:left; width: calc(100% - 75px); height: 25px; font-size: 1em; margin-left: 5px; margin-top: 10px; text-align: right;} #Incidencias #HastaFecha {font-size: 0.9em;} #Incidencias #panel_Tipo {width: 100%; height: 40px;} #Incidencias #Tipo {width: 100%; text-align: center;} #Incidencias #panel_TipoIncidencias {width: 100%; height: 40px;} #Incidencias #TipoIncidencias {width: 100%; text-align: center;} /* -------------------------------------- MANTINCIDENCIA -------------------------------------- */ #MantIncidencia .toolbar {background: var(--Naranja-color);} #MantIncidencia #panel_Cabecera {width: 100%; height: 70px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color);} #MantIncidencia #panel_Foto02 {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantIncidencia #Foto02 {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantIncidencia #Descripcion02 {float:left; width: calc(100% - 75px); height: auto; font-size: 1.1em; margin-left: 5px; margin-top: 20px; text-align: center;} #MantIncidencia #EstadoRegistro {float:left; width: calc(100% - 75px); height: auto; font-size: 0.9em; margin-left: 5px; margin-top: 5px; text-align: center; color:red;} #MantIncidencia #fIncidencia {margin-top: 20px;} #MantIncidencia fieldset {padding: 0px; border-style: none;} #MantIncidencia .container {width: 100%; border: 1px solid #ccc; border-radius: 5px; overflow: hidden; transition: max-height 0.3s ease-in-out;} #MantIncidencia .header {background-color: var(--Verde-degradado); color: black; padding: 10px; display: flex; justify-content: space-between; align-items: center; cursor: pointer;} #MantIncidencia .header span {font-size: 0.8rem; width: 100%; height: auto;} #MantIncidencia .content {padding: 5px; height: auto; display: none; padding: 5px 15px 0px 5px;} #MantIncidencia label {font-size: 0.9rem; color: var(--Verde-color); margin-bottom: 2px; font-weight: normal;} #MantIncidencia input, #MantIncidencia select {font-size: 1rem; width: 100%; height: auto;} #MantIncidencia .jlboton {width: 30px;} #MantIncidencia #panel_FechaInc {float:left; width: 50%; height: 60px;} #MantIncidencia #FechaInc {width: 150px;} #MantIncidencia #panel_HoraInc {float:left; width: 50%; height: 60px;} #MantIncidencia #DB_HoraInc {width: 90px;} #MantIncidencia #panel_TipoIncidencia {float:left; width: 100%; height: 75px;} #MantIncidencia #DB_TipoIncidencia {width: 100%;} #MantIncidencia #panel_DeResidencia {float:left; width: 100%; height: 70px;} #MantIncidencia #DB_DeResidencia {width: 100%;} #MantIncidencia #panel_FotoResidente {float:left; width: 100%; height: 70px; text-align: center; overflow: hidden;} #MantIncidencia #FotoResidente {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantIncidencia #panel_DeResidente {float:left; width: 100%; height: 75px;} #MantIncidencia #DB_DeResidente {width: 100%;} #MantIncidencia #panel_Descripcion {float:left; width: 100%; height: 180px;} #MantIncidencia #DB_Descripcion {width: 100%; height: 135px;} #MantIncidencia .panel_botones {float:left; width: 100%; height: 40px; display: flex; justify-content: space-around; margin-bottom: 10px;} #MantIncidencia .panel_botones .icon-button {font-size: 14px;} #MantIncidencia .panel_botones .ons-icon {margin-right: 5px;} #MantIncidencia .jl_table2 { width: 100%; border-collapse: collapse;} #MantIncidencia .jl_table2 th, .jl_table2 td { padding: 8px 12px; text-align: left; border-bottom: 1px solid #ddd; } #MantIncidencia .jl_table2 thead, .jl_table2 thead tr{ background-color: #f2f2f2;} #MantIncidencia .jl_table2 .impar { background-color: var(--Verde-degradado)} #MantIncidencia .jl_table2 .par {background-color: #ffffff;} #MantIncidencia #panel_ARealizar {float:left; width: 100%; height: 80px;} #MantIncidencia #DB01_ARealizar {width: 100%; height: 50px;} #MantIncidencia #panel_FechaAccion {float:left; width: 50%; height: 60px;} #MantIncidencia #FechaAccion {width: 140px;} #MantIncidencia #panel_HoraAccion {float:left; width: calc(50% - 35px); height: 60px;} #MantIncidencia #DB01_HoraAccion {width: 90px;} #MantIncidencia #panel_bAccion {float:left; width: 35px; height: 55px; margin-top: 5px;} #MantIncidencia #panel_UsuarioAccion {float:left; width: 100%; height: 80px;} #MantIncidencia #DB01_UsuarioAccion {width: 100%;} #MantIncidencia #panel_Referente {float:left; width: 100%; height: 70px;} #MantIncidencia #DB01_Referente {width: 100px;} #MantIncidencia #panel_DescripAccion {float:left; width: 100%; height: 180px;} #MantIncidencia #DB01_DescripAccion {width: 100%; height: 135px;} #MantIncidencia #panel_FNotifica2 {float:left; width: 100%; height: 50px;} #MantIncidencia #FNotifica2 {width: 110px;} #MantIncidencia #panel_TipoResolucion {float:left; width: 100%; height: 75px;} #MantIncidencia #DB_TipoResolucion {width: 100%;} #MantIncidencia #panel_FechaResolucion {float:left; width: 50%; height: 60px;} #MantIncidencia #FechaResolucion {width: 140px;} #MantIncidencia #panel_HoraResolucion {float:left; width: calc(50% - 35px); height: 60px;} #MantIncidencia #DB_HoraResolucion {width: 90px;} #MantIncidencia #panel_bAccion {float:left; width: 35px; height: 55px; margin-top: 5px;} #MantIncidencia #panel_PersonalResol {float:left; width: 100%; height: 75px;} #MantIncidencia #DB_PersonalResol {width: 100%;} #MantIncidencia #panel_DescripResol {float:left; width: 100%; height: 180px;} #MantIncidencia #DB_DescripResol {width: 100%; height: 135px;} #MantIncidencia #panel_Seleccion {width:calc( 90% - 10px); height: auto; margin: auto; padding: 5px; background-color: white; border-radius: 5px; } #MantIncidencia #idSeleccion {display: none;} #MantIncidencia #item-list {height: calc(100vh - 220px); overflow: scroll; margin-bottom: 15px; } #MantIncidencia #field_Avisos[disabled] { pointer-events: none;} #MantIncidencia #field_Destinos[disabled] { pointer-events: none;} /* -------------------------------------- SEGUIMIENTOS -------------------------------------- */ #Seguimientos .toolbar {background: var(--Naranja-color);} #Seguimientos #panel_Cabecera {width: 100%; height: 80px; margin-top: 10px; } #Seguimientos #panel_Foto {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #Seguimientos #Foto {border-radius: 50%; width: 60px; height: 70px; object-fit: cover;} #Seguimientos #panel_DesdeFecha {float:left; width: calc(100% - 75px); height: 25px; font-size: 1em; margin-left: 5px; margin-top: 10px; text-align: right; } #Seguimientos #DesdeFecha {font-size: 0.9em;} #Seguimientos #panel_HastaFecha {float:left; width: calc(100% - 75px); height: 25px; font-size: 1em; margin-left: 5px; margin-top: 10px; text-align: right;} #Seguimientos #HastaFecha {font-size: 0.9em;} #Seguimientos #panel_Tipo {width: 100%; height: 40px;} #Seguimientos #Tipo {width: 100%; text-align: center;} #Seguimientos #panel_TipoIncidencias {width: 100%; height: 40px;} #Seguimientos #TipoIncidencias {width: 100%; text-align: center;} /* -------------------------------------- MANTSEGUIMIENTO -------------------------------------- */ #MantSeguimiento .toolbar {background: var(--Naranja-color);} #MantSeguimiento #panel_Cabecera {width: 100%; height: 70px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color);} #MantSeguimiento #panel_Foto02 {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantSeguimiento #Foto02 {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantSeguimiento #Descripcion02 {float:left; width: calc(100% - 75px); height: auto; font-size: 1.1em; margin-left: 5px; margin-top: 20px; text-align: center;} #MantSeguimiento #EstadoRegistro {float:left; width: calc(100% - 75px); height: auto; font-size: 0.9em; margin-left: 5px; margin-top: 5px; text-align: center; color:red;} #MantMantSeguimiento #fSeguimiento {margin-top: 20px;} #MantSeguimiento fieldset {padding: 0px; border-style: none;} #MantSeguimiento .container {width: 100%; border: 1px solid #ccc; border-radius: 5px; overflow: hidden; transition: max-height 0.3s ease-in-out;} #MantSeguimiento .header {background-color: var(--Verde-degradado); color: black; padding: 10px; display: flex; justify-content: space-between; align-items: center; cursor: pointer;} #MantSeguimiento .header span {font-size: 0.8rem; width: 100%; height: auto;} #MantSeguimiento .content {padding: 5px; height: auto; display: none; padding: 5px 15px 0px 5px;} #MantSeguimiento label {font-size: 0.9rem; color: var(--Verde-color); margin-bottom: 2px; font-weight: normal;} #MantSeguimiento input, #MantSeguimiento select {font-size: 1rem; width: 100%; height: 30px;} #MantSeguimiento .jlboton {width: 30px;} #MantSeguimiento #panel_Fecha {float:left; width: 50%; height: 70px; margin-top: 5px;} #MantSeguimiento #Fecha {width: 150px;} #MantSeguimiento #panel_Tipo {float:left; width: 50%; height: 70px; margin-top: 5px;} #MantSeguimiento #DB_Tipo {width: 100%;} #MantSeguimiento #panel_FotoResidente {float:left; width: 100%; height: 70px; text-align: center; overflow: hidden;} #MantSeguimiento #FotoResidente {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantSeguimiento #panel_CodResidente {float:left; width: 100%; height: 75px;} #MantSeguimiento #DB_CodResidente {width: 100%;} #MantSeguimiento #panel_Motivo {float:left; width: 100%; height: 180px;} #MantSeguimiento #DB_Motivo {width: 100%; height: 135px;} #MantSeguimiento #panel_PlanActuacion {float:left; width: 100%; height: 180px;} #MantSeguimiento #DB_PlanActuacion {width: 100%; height: 135px;} #MantSeguimiento #panel_Comunicados {float:left; width: 100%; height: 30px; margin-top: 10px; margin-bottom: 10px; background: var(--Naranja-color); color:white; display: flex; align-items: center; justify-content: center;} #MantSeguimiento #panel_NotaVarios {float:left; width: 100%; height: 180px;} #MantSeguimiento #DB_NotaVarios {width: 100%; height: 135px;} #MantSeguimiento #panel_DestinoVarios {float:left; width: 100%; height: 145px;} #MantSeguimiento #DB_DestinoVarios {width: calc(100% - 40px); height: 100px;} #MantSeguimiento #panel_Seleccion {width:calc( 90% - 10px); height: auto; margin: auto; padding: 5px; background-color: white; border-radius: 5px; } #MantSeguimiento #idSeleccion {display: none;} #MantSeguimiento #item-list {height: calc(100vh - 220px); overflow: scroll; margin-bottom: 15px; } /* -------------------------------------- VISITAS -------------------------------------- */ #Visitas .toolbar {background: var(--Naranja-color);} #Visitas #panel_Cabecera {width: 100%; height: 80px; margin-top: 10px; } #Visitas #panel_Foto {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #Visitas #Foto {border-radius: 50%; width: 60px; height: 70px; object-fit: cover;} #Visitas #panel_DesdeFecha {float:left; width: calc(100% - 75px); height: 25px; font-size: 1em; margin-left: 5px; margin-top: 10px; text-align: right; } #Visitas #DesdeFecha {font-size: 0.9em;} #Visitas #panel_HastaFecha {float:left; width: calc(100% - 75px); height: 25px; font-size: 1em; margin-left: 5px; margin-top: 10px; text-align: right;} #Visitas #HastaFecha {font-size: 0.9em;} #Visitas #panel_Estado {width: 100%; height: 40px;} #Visitas #Estado {width: 100%; text-align: center;} /* -------------------------------------- MANTVISITA -------------------------------------- */ #MantVisita .toolbar {background: var(--Naranja-color);} #MantVisita #panel_Cabecera {width: 100%; height: 70px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color);} #MantVisita #panel_Foto {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantVisita #Foto {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantVisita #Descripcion {float:left; width: calc(100% - 75px); height: auto; font-size: 1.1em; margin-left: 5px; margin-top: 20px; text-align: center;} #MantVisita #EstadoRegistro {float:left; width: calc(100% - 75px); height: auto; font-size: 0.9em; margin-left: 5px; margin-top: 5px; text-align: center; color:red;} #MantVisita #fVisita {margin-top: 20px;} #MantVisita fieldset {padding: 0px; border-style: none;} #MantVisita .container {width: 100%; border: 1px solid #ccc; border-radius: 5px; overflow: hidden; transition: max-height 0.3s ease-in-out;} #MantVisita .header {background-color: var(--Verde-degradado); color: black; padding: 5px; display: flex; justify-content: space-between; align-items: center; cursor: pointer;} #MantVisita .content {padding: 5px; height: auto; display: none;} #MantVisita label {font-size: 0.9rem; color: var(--Verde-color); margin-bottom: 2px; font-weight: normal;} #MantVisita span {font-size: 1rem; width: 100%; height: auto;} #MantVisita input, #MantVisita select {font-size: 1rem; width: 100%; height: auto;} #MantVisita .jlboton {width: 30px;} #MantVisita #panel_FechaApunte {float:left; width: 50%; height: 55px;} #MantVisita #FechaApunte {width: calc(100% - 15px);} #MantVisita #panel_TipoVisita {float:left; width: 100%; height: 65px;} #MantVisita #DB03_TipoVisita {width: 100%;} #MantVisita #panel_FEntradaVisita {float:left; width: 50%; height: 55px;} #MantVisita #FEntradaVisita {width: calc(100% - 15px);} #MantVisita #panel_HEntradaVisita {float:left; width: 105px; height: 55px;} #MantVisita #DB03_HEntradaVisita {width: 90px;} #MantVisita #panel_bHoraEntrada {float:left; width: calc(50% - 105px); height: 55px;} #MantVisita #panel_FSalidaVisita {float:left; width: 50%; height: 55px;} #MantVisita #FSalidaVisita {width: calc(100% - 15px);} #MantVisita #panel_HSalidaVisita {float:left; width: 105px; height: 55px;} #MantVisita #DB03_HSalidaVisita {width: 90px;} #MantVisita #panel_bHoraSalida {float:left; width: calc(50% - 105px); height: 55px;} #MantVisita #panel_FotoResidente {float:left; width: 100%; height: 70px; text-align: center; overflow: hidden;} #MantVisita #FotoResidente {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantVisita #panel_CodResidente {float:left; width: 100%; height: 70px;} #MantVisita #DB03_CodResidente {width: 100%;} #MantVisita #panel_idMotivo {float:left; width: 100%; height: 65px;} #MantVisita #idMotivo {width: 100%;} #MantVisita #panel_NombreVisita {float:left; width: calc( 100% - 35px); height: 65px;} #MantVisita #DB03_NombreVisita {width: calc(100% - 5px);} #MantVisita #panel_bNombreVisita {float:left; width: 35px; height: 45px;} #MantVisita #panel_Parentesco {float:left; width: 65%; height: 65px;} #MantVisita #DB03_Parentesco {width: calc(100% - 15px);} #MantVisita #panel_NPersonas {float:left; width: 35%; height: 65px;} #MantVisita #DB03_NPersonas {width: 100%;} #MantVisita #panel_AtendidoPor {float:left; width: 100%; height: 65px;} #MantVisita #DB03_AtendidoPor {width: 100%;} #MantVisita #fieldset_AusentePara {border-style: solid;} #MantVisita #fieldset_AusentePara legend {font-size: 0.7rem; color: var(--Verde-color); margin-bottom: 0; font-weight: bold;} #MantVisita #panel_Desayuno {float:left; width: 33%; height: 30px;} #MantVisita #DB03_Desayuno {width: 20px;} #MantVisita #panel_Almuerzo {float:left; width: 33%; height: 30px;} #MantVisita #DB03_Almuerzo {width: 20px;} #MantVisita #panel_Merienda {float:left; width: 33%; height: 30px;} #MantVisita #DB03_Merienda {width: 20px;} #MantVisita #panel_Cena {float:left; width: 33%; height: 30px;} #MantVisita #DB03_Cena {width: 20px;} #MantVisita #panel_Recena {float:left; width: 33%; height: 30px;} #MantVisita #DB03_Recena {width: 20px;} #MantVisita #panel_Varios {float:left; width: 33%; height: 30px;} #MantVisita #DB03_Varios {width: 20px;} #MantVisita #panel_LugarSalida {float:left; width: 100%; height: 65px;} #MantVisita #DB03_LugarSalida {width: 100%;} #MantVisita #panel_AcompanadoPor {float:left; width: 100%; height: 65px;} #MantVisita #DB03_AcompanadoPor {width: 100%;} #MantVisita #panel_HSalidaResidente {float:left; width: 105px; height: 55px;} #MantVisita #DB03_HSalidaResidente {width: 90px;} #MantVisita #panel_bSalidaResidente {float:left; width: calc(50% - 105px); height: 55px;} #MantVisita #panel_HEntradaResidente {float:left; width: 105px; height: 50px;} #MantVisita #DB03_HEntradaResidente {width: 90px;} #MantVisita #panel_bEntradaResidente {float:left; width: calc(50% - 105px); height: 55px;} #MantVisita #panel_Observaciones {float:left; width: 100%; height: 80px;} #MantVisita #DB03_Observaciones {width: 100%;} #MantVisita #panel_Firma {display:flex; justify-content: flex-start;} #MantVisita #panel_ImagenFirma {width: 100%; height: 300px; margin: 5px;} #MantVisita #canvas_FirmaVisita {border:1px; border-style: solid; border-color: green; width: 300px; height: 300px;} #MantVisita #DB03_Img_FirmaVisita{width: 300px; height: 300px; display: none;} #MantVisita #panel_BotonesFirma {width: 100%; height: 45px; margin: 5px;} @media (max-width: 500px) { #MantVisita #panel_Firma {display:flex; justify-content: flex-start; flex-direction: column;} } #MantVisita #panel_Seleccion {width:calc( 90% - 10px); height: auto; margin: auto; padding: 5px; background-color: white; border-radius: 5px; } #MantVisita #idSeleccion {display: none;} #MantVisita #item-list {height: calc(100vh - 220px); overflow: scroll; margin-bottom: 15px; } /* -------------------------------------- PER_AGENDA -------------------------------------- */ #Per_Agenda .toolbar {background: var(--Naranja-color);} #Per_Agenda #panel_Per_Agenda {margin: auto; max-width: 600px;} #Per_Agenda #panel_Per_Agenda .ui-datepicker{border-radius: 0 !important;} #Per_Agenda #panel_Per_Agenda .ui-datepicker td{text-align: center;} #Per_Agenda #panel_Per_Agenda > div {margin: auto;} #Per_Agenda #panel_Per_Agenda .ui-datepicker td a {border: 1px solid #fff; background: #fff; color: #000; border-radius: 50%; text-align: center; padding: 0; width: 8vw; height: 8vw; line-height: 8vw; font-size: 3.5vw; display: inline-block; margin: 1vw 0;} #Per_Agenda #panel_Per_Agenda .ui-datepicker { font-size: 2vw; width: auto;} #Per_Agenda #panel_Per_Agenda .ui-datepicker table{font-size: 3vw;} #Per_Agenda #panel_Per_Agenda .ui-widget-header {border: 1px solid #fff; background:var(--Naranja-color); color:white; font-weight: bold; font-size: 4vw;} @media (min-width: 501px) { #Per_Agenda #panel_Per_Agenda .ui-datepicker td a {border: 1px solid #fff; background: #fff; color: #000; border-radius: 50%; text-align: center; padding: 0; width: 4vw; height: 4vw; line-height: 4vw; font-size: 3.5vw; display: inline-block; margin: 1vw 0;} #Per_Agenda #panel_Per_Agenda .ui-datepicker { font-size: 1.2vw; width: auto;} #Per_Agenda #panel_Per_Agenda .ui-datepicker table{font-size: 1.5vw;} #Per_Agenda #panel_Per_Agenda .ui-widget-header {border: 1px solid #fff; background:var(--Naranja-color); color:white; font-weight: bold; font-size: 3vw;} } @media (min-width: 801px) { #Per_Agenda #panel_Per_Agenda .ui-datepicker td a {border: 1px solid #fff; background: #fff; color: #000; border-radius: 50%; text-align: center; padding: 0; width: 35px; height: 35px; line-height: 35px; font-size: 30px; display: inline-block; margin: 9px 0;} #Per_Agenda #panel_Per_Agenda .ui-datepicker { font-size: 30px; width: auto;} #Per_Agenda #panel_Per_Agenda .ui-datepicker table{font-size: 30px;} #Per_Agenda #panel_Per_Agenda .ui-widget-header {border: 1px solid #fff; background:var(--Naranja-color); color:white; font-weight: bold; font-size: 30px;} } #Per_Agenda #panel_Per_Agenda td.ui-datepicker-today a { border: 0px solid #fff !important;} #Per_Agenda .fondo_Per_Agenda a {background-color: #c4eedc !important; background-image: none !important;} #Per_Agenda #panel_FechaActual {width: 100%; height: 40px; margin-top: 15px; border-width: 1px; border-bottom-style: solid; border-color: #C5C5C5} #Per_Agenda #FechaActual {float:left; width: 100%; height: 30px; font-size: 1.3em; } #Per_Agenda #panel_DatosDia {width: 98.5%; height: auto; margin: 5px 2px 80px 2px; background-color: #fff;} #Per_Agenda .list-item__title { -webkit-flex-basis: calc(100% - 20px); flex-basis: 93%;} #Per_Agenda .list-item__subtitle { -webkit-flex-basis: calc(100% - 20px); flex-basis: 93%;} #Per_Agenda .tachado{text-decoration: line-through!important; text-decoration-color: darkblue!important; text-decoration-style: solid!important;} /* --------------------------------------*/ /* -------------------------------------- PROTOCOLOS -------------------------------------- */ #Protocolos .toolbar {background: var(--Naranja-color);} #Protocolos #panel_Buscar {display:flex; width: 100%; height: 50px; margin: 15px 0; justify-content:center; align-items:center; border: 1px solid #000; } #Protocolos #panel_Buscar {background-color: var(--Gris-color);} #Protocolos #Protocolos_Buscar {width: 100%;} /* -------------------------------------- MANTPROTOCOLO -------------------------------------- */ #MantProtocolo .toolbar {background: var(--Naranja-color);} #MantProtocolo #panel_Cabecera {width: 100%; height: 70px; margin-top: 10px; border-bottom: 1px solid var(--Gris-color);} #MantProtocolo #panel_Foto {float:left; width: 70px; height: 70px; text-align: center; overflow: hidden;} #MantProtocolo #Foto {border-radius: 50%; width: 60px; height: 60px; object-fit: cover;} #MantProtocolo #Descripcion {float:left; width: calc(100% - 75px); height: auto; font-size: 1.1em; margin-left: 5px; margin-top: 10px;} #MantProtocolo #Grupo {float:left; width: calc(100% - 75px); height: 30px; font-size: 0.8em; margin-left: 5px;} #MantProtocolo label {font-size: 0.7rem; color: var(--Verde-color); margin-bottom: 0; font-weight: normal;} #MantProtocolo span {font-size: 0.8rem; width: 100%; height: auto;} #MantProtocolo .list-item {padding: 0px;} /* -------------------------------------- SELECTCONTROL -------------------------------------- */ #SelectControl .toolbar {background: var(--Naranja-color);} #SelectControl #panel_BuscarControl {display:flex; width: 100%; height: 50px; margin: 15px 0; justify-content:center; align-items:center; border: 1px solid #000; } #SelectControl #panel_BuscarControl {background-color: var(--Gris-color);} #SelectControl #Controles_Buscar {width: 100%;} #SelectControl .hidden {display: none;} #SelectControl .contenedor-flex { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 10px; } #SelectControl .tarjeta { border: 1px solid #ddd; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); padding: 16px; width: 70px; text-align: center; cursor: pointer; } #SelectControl .tarjeta img { width: 100%; height: auto; border-radius: 4px;} #SelectControl .descripcion { margin-top: 10px; font-size: 12px; color: #333; overflow: hidden; text-overflow: ellipsis;} #SelectControl .marcado { background-color: var(--Verde-degradado); border-color: var(--Verde-color); } /* -------------------------------------- SELECTACTIVIDAD -------------------------------------- */ #SelectActividad .toolbar {background: var(--Naranja-color);} #SelectActividad .contenedor-flex { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 10px; } #SelectActividad .tarjeta { border: 1px solid #ddd; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); padding: 16px; width: 70px; text-align: center; cursor: pointer; } #SelectActividad .tarjeta img { width: 100%; height: auto; border-radius: 4px;} #SelectActividad .descripcion { margin-top: 10px; font-size: 12px; color: #333; } #SelectActividad .marcado { background-color: var(--Verde-degradado); border-color: var(--Verde-color);} #SelectActividad #panel_BuscarActividad {display:flex; width: 100%; height: 50px; margin: 15px 0; justify-content:center; align-items:center; border: 1px solid #000; } #SelectActividad #panel_BuscarActividad {background-color: var(--Gris-color);} #SelectActividad #Actividades_Buscar {width: 100%;} #SelectActividad .hidden {display: none;} /* -------------------------------------- SELECTRESIDENTE -------------------------------------- */ #SelectResidente .toolbar {background: var(--Naranja-color);} #SelectResidente .contenedor-flex { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 10px; } #SelectResidente .tarjeta { border: 1px solid #ddd; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); padding: 16px; width: 70px; text-align: center; cursor: pointer; } #SelectResidente .tarjeta img { width: 100%; height: auto; border-radius: 4px;} #SelectResidente .descripcion { margin-top: 10px; font-size: 12px; color: #333; } #SelectResidente .marcado { background-color: var(--Verde-degradado); border-color: var(--Verde-color); } #SelectResidente .toolbar__center {width: 40%;} #SelectResidente #botonesSelectResidentes .toolbar-button {padding: 4px 6px;} #SelectResidente #panel_Grupo {width: 100%; height: 55px; margin-top: 10px;} #SelectResidente #Grupo {width: 100%; text-align: center;} #SelectResidente #panel_BuscarResidente {display:flex; width: 100%; height: 50px; margin: 15px 0; justify-content:center; align-items:center; border: 1px solid #000; } #SelectResidente #panel_BuscarResidente {background-color: var(--Gris-color);} #SelectResidente #Residentes_Buscar {width: 100%;} #SelectResidente .hidden {display: none;}