/*Error*/ @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } .accslide, .dashboard-container, .activity-calendar, .cont-buscador { animation: fadeIn 0.5s ease-out; } .accslide.fadeout, .dashboard-container.fadeout, .activity-calendar.fadeout { animation: fadeOut 0.5s ease-out; } /*Importando fuentes e iconos*/ /*Variables estáticas globales Paleta de colores, tamaño de fuente*/ @font-face { font-family: 'Rubik'; src: url('../fonts/Rubik/Rubik-Medium.ttf'); } @font-face { font-family: 'Poppins'; src: url('../fonts/Poppins/Poppins-SemiBold.ttf'); } @font-face { font-family: 'Roboto'; src: url('../fonts/Roboto/Roboto-Regular.ttf'); } :root { --font-md: 15px; --font-xxl: 5rem; --font-xl: 2rem; --font-lg: 1.5rem; --font-sm: 1.2rem; --font-xs: 0.75rem; --font-xxs: 0.625rem; --font-size-principal: 12px; --icon-size: 25px; --font-Roboto: 'Roboto'; --font-Poppins: 'Poppins', sans-serif; --font-Rubik-Sans: 'Rubik', sans-serif; --font-bx-icons: "boxicons"; --file-select-img-content: "Elegir Fotografía"; --file-select-doc-content: "Elegir Archivo"; --file-select-xlsx-content: "Elegir Excel"; /*VARIANTS*/ --primary-900: #04247c; --primary-800: #193690; --primary-700: #223f9c; --primary-600: #2c49ab; --primary-500: #3251b2; --primary-400: #546bbd; --primary-300: #7386c8; --primary-200: #9ba8d8; --primary-100: #c3cae8; --primary-50: #e7eaf5; /*VARIANTS*/ --secondary-900: #005d63; --secondary-800: #009f8f; --secondary-700: #0093a7; --secondary-600: #00a8c1; --secondary-500: #00b8d4; --secondary-400: #26c3db; --secondary-300: #4ccde2; --secondary-200: #7fdceb; --secondary-100: #b1e9f3; --secondary-50: #e0f6fa; --dk-gray-100: #f3f4f6; --dk-gray-200: #e5e7eb; --dk-gray-300: #d1d5db; --dk-gray-400: #9ca3af; --dk-gray-500: #6b7280; --dk-gray-600: #4b5563; --dk-gray-700: #374151; --dk-gray-800: #1f2937; --dk-gray-900: #111827; --dk-dark-bg: #313348; --dk-darker-bg: #e8e8e8; --dk-gray-1000: #000818; --primary-light: #8abdff; --primary: #6d5dfc; --primary-dark: #5b0eeb; --white: #FFFFFF; --greyLight-1: #E4EBF5; --greyLight-2: #c8d0e7; --greyLight-3: #bec8e4; --greyDark: #9baacf; /*tema claro elevator speech----------------------*/ --background-card-elevator: linear-gradient(to bottom, #ffecd4 10%, #fffcef 30%, #fffbef 50%); --background-speech-elevator: linear-gradient(to bottom, #fff0d7, #f9f0e5); --background-config-elevator: rgba(255, 245, 238, 0.95); --background-controls-elevator: linear-gradient(to bottom, #fff0d7, #f9f0e5); --form-range-bg-elevator: #deb887; --form-range-thumb-elevator: #8b4513; --form-select-bg-elevator: #fff; --form-select-border-elevator: #deb887; --text-primary-elevator: #4a4a4a; --text-title-elevator: #0a192f; --text-secondary-elevator: black; --background-speech-config-elevator: #d0e7ff; --background-card-elevatorActive: linear-gradient(to bottom, #ffecd4 10%, #fffcef 30%, #fffbef 50%); --second-title-colorElevator: black; --second-title-colorelevator: #00b8d4; /*PLANEACIÓN CALENDARIO DE ACTIVIDADES DE NÓMINA*/ /*colores para cada evento*/ /*Cálculo Definitivo del Periodo de Nómina*/ --planeacion-act1-background: rgba(57, 73, 171, 0.5); /* Timbrado del Periodo de Nómina*/ --planeacion-act2-background: rgba(0, 230, 118, 0.5); /*Cálculo de Integrado Variable del Bimestre Anterior*/ --planeacion-act3-background: rgba(255, 241, 118, 0.5); /* Cálculo de PTU */ --planeacion-act4-background: rgba(255, 112, 67, 0.5); /* Cálculo de Aguinaldos */ --planeacion-act5-background: rgba(0, 137, 123, 0.5); /* Cierre Anual de Operaciones */ --planeacion-act6-background: rgba(106, 27, 154, 0.5); /* Pago Mensual de IMSS */ --planeacion-act7-background: rgba(41, 182, 246, 0.5); /* Pago Bimestral del IMSS e Infonavit */ --planeacion-act8-background: rgba(128, 222, 234, 0.5); /* Pago de Impuesto Sobre Nómina */ --planeacion-act9-background: rgba(109, 76, 65, 0.5); /* Permiso sin Goce de Sueldo */ --planeacion-eve1-background: rgba(183, 28, 28, 0.5); /* Incapacidad por Maternidad */ --planeacion-eve2-background: rgba(240, 98, 146, 0.5); /* Incapacidad por Enfermedad */ --planeacion-eve3-background: rgba(192, 202, 51, 0.5); /* Incapacidad por Riesgo de Trabajo */ --planeacion-eve4-background: rgba(255, 109, 0, 0.5); /* Vacaciones */ --planeacion-eve5-background: rgba(0, 231, 94, 0.5); /* Bajas del Personal */ --planeacion-eve6-background: rgba(120, 144, 156, 0.5); /* Ingresos */ --planeacion-eve7-background: rgba(56, 142, 60, 0.5); /* Reingresos */ --planeacion-eve8-background: rgba(121, 134, 203, 0.5); /* Días Festivos Obligatorios */ --planeacion-eve9-background: #FFC400; /* Cumpleaños del Personal */ --planeacion-eve10-background: rgba(0, 188, 212, 0.5); /* Aniversario del Personal */ --planeacion-eve11-background: rgba(168, 124, 5, 0.5); /* Permiso con Goce de Sueldo */ --planeacion-eve12-background: rgba(239, 154, 154, 0.5); /* Permiso por Paternidad */ --planeacion-eve13-background: rgba(21, 101, 192, 0.5); /* Incapacidad por Accidente de Tránsito */ --planeacion-eve14-background: rgba(142, 36, 170, 0.5); /* Permiso por Enfermedad */ --planeacion-eve15-background: rgba(85, 139, 47, 0.5); /* Permiso por Matrimonio */ --planeacion-eve16-background: rgba(234, 128, 252, 0.5); /* Permiso por Natalicio */ --planeacion-eve17-background: rgba(253, 216, 53, 0.5); /* Permiso por Defunción */ --planeacion-eve18-background: rgba(141, 110, 99, 0.5); } /*Variables de tema claro, así como aquellas variables iguales para ambos temas, como sombras, bordes, radio de borde, etc*/ .body { /*Variables para ambos temas*/ --element-background: transparent; --title-color: var(--primary-color); --second-title-color: var(--secondary-600); --navbar-buscador-background: #ecf5ff; --navbar-buscador-opcion-background-hover: #e9ecef; /*********************/ /* PANTALLA DE CARGA */ /*********************/ /* --ring-background: var(--primary-300); --ring-shadow-1: #7386c833; --ring-shadow-2: #7386c822; --ring-2-background: #0093a7; --ring-2-shadow-1: #0093a733; --ring-2-shadow-2: #0093a722; --ring-3-background: #98649E; --ring-3-shadow-1: #98649E33; --ring-3-shadow-2: #98649E22;*/ --ring-background: #2445ff; --ring-shadow-1: #2445ff33; --ring-shadow-2: #2445ff22; --ring-2-background: #ffed2d; --ring-2-shadow-1: #ffed2d33; --ring-2-shadow-2: #ffed2d22; --ring-3-background: #f81c1c; --ring-3-shadow-1: #f81c1c33; --ring-3-shadow-2: #f81c1c22; /*INPUTS*/ /************Input border radius************/ --input-soft-border-radius: 13px; /************Input Shadows*************/ --input-inner-shadow: inset 0.2rem 0.2rem 0.5rem var(--shadow-drk), inset -0.2rem -0.2rem 0.5rem var(--shadow-lght); --input-shadow: 0.3rem 0.3rem 0.6rem var(--shadow-drk), -0.2rem -0.2rem 0.5rem var(--shadow-lght); /*CARD*/ --card-background: var(--element-background); /***CARD FOCUS*/ --card-focus-background: #ecf5ff93; --card-focus-shadow: inset 8px 8px 8px rgba(255, 255, 255, 0.03), inset -8px -8px 8px rgba(0, 0, 0, 0.2), 8px 8px 8px rgba(0, 0, 0, 0.2), -8px -8px 8px rgba(255, 255, 255, 0.03); --card-focus-inner-shadow: inset 2px 2px 2px #6f8d97, inset -2px -2px 2px #dbffff; /************Card border radius**********/ --card-border-radius: 20px; /***********Card shadows**********/ --card-shadow: 7px 7px 14px var(--shadow-drk), -7px -7px 14px var(--shadow-lght); --card-sm-shadow: 2px 2px 2px var(--shadow-drk), -2px -2px 2px var(--shadow-lght); --card-sm-inner-shadow: inset 2px 2px 2px var(--shadow-drk), inset -2px -2px 2px var(--shadow-lght); /*BUTTON*/ --button-focus-text-color: var(--secondary-700); --button-focus-background: var(--element-background); /************Buttons shadows**********/ --button-shadow: 5px 5px 10px var(--shadow-drk), -5px -5px 10px var(--shadow-lght); --button-inner-shadow: inset 5px 5px 10px var(--shadow-drk), inset -5px -5px 10px var(--shadow-lght); /******Border Radius Button***/ /*rectangulares*/ --button-lg-border-radius: 10px; --button-sm-border-radius: 7px; --button-circle-border-radius: 50%; /*botón de cerrar sesión FALTA DOCUMENTAR*/ --button-sign-out-color: var(--secondary-color); --button-sign-out-hover: var(--fourth-color); /*TABLES*/ --table-header-text-color: var(--title-color); --table-header-background: var(--sidebar-footer-background); --table-header-shadow: 2px 2px 5px var(--shadow-drk); --table-shadow: var(--card-sm-shadow); /*FORM CONTROLS*/ --input-border-radius: 6px; --input-focus-border-bottom: 3px solid var(--input-color); /*campos obligatorios*/ --input-required-border: 1px solid var(--input-required-color); --input-required-border-bottom: 2px solid var(--input-required-color); --input-required-focus-border-bottom: 3px solid var(--input-required-color); /*campos deshabilitados */ --input-disabled-border: 0.2px solid var(--input-disabled-color); /*-------------------------------------------*/ /* NAVBAR COLORS */ /*-------------------------------------------*/ --navbar-background: #E4EBF6; /* --navbar-background: #E1EAF8; */ --navbar-icon-color: var(--secondary-500); /*SIDEBAR*/ --sidebar-width: 250px; --sidebar-li-border-radius: 16px 0 0 16px; /*TAB BAR*/ --tab-bar-background: var(--element-background); --tab-bar-focus-background: var(--secondary-color); --primary-color: var(--primary-400); --secondary-color: var(--secondary-700); /************LIGHT MODE COLORES BASE**********/ --theme-background: #E4EBF6; /*--theme-background: linear-gradient(to top, #99c3d6 0%, #c2d4f27b 74%) FIXED;*/ --shadow-drk: #849cb7; --shadow-lght: #f1f9fde2; --text-color: #1e1e1e; --text-color-lght: #666666; --second-text-color-lght: #333333; --white-color: #fff; --title-section-color: var(--title-color); /**********DEGRADADOS********/ --tittle-gradient-color: linear-gradient(45deg, var(--primary-700) 0%, var(--primary-400) 35%, var(--primary-100) 100%); /**CARD EN EL BUSCADOR***/ --card-inner-shadow: inset 5px 5px 15px var(--shadow-drk), inset -5px -5px 15px #caffff; /****BUTTON*****/ --button-text-color: var(--secondary-50); --button-background: linear-gradient(94deg, var(--secondary-600) 0%, var(--secondary-700) 35%, var(--secondary-800) 100%); /*-------------------------------------------*/ /* DATA TABLES COLORS */ /*-------------------------------------------*/ /*CARD CONSULTA*/ --card1_front: linear-gradient(122deg, #5888be 0%, #546bbd 50%, #7386c8 100%); --card1_back: linear-gradient(232deg, rgb(207 228 255 / 26%) 0%, rgb(198 207 224) 50%, rgb(111 135 211 / 45%) 100%); --card1_inside: linear-gradient(117deg, rgb(207 228 255 / 26%) 0%, rgb(198 207 224) 50%, rgb(111 135 211 / 45%) 100%); --card2_front: linear-gradient(122deg, rgb(159 209 236)0%, rgb(64 172 206) 50%, rgb(102 179 204) 100%); --card2_back: linear-gradient(44deg, #7db6e694 0%, #b9d6efd3 50%, #eef4ff33 100%); --card2_inside: linear-gradient(313deg, #7db6e694 0%, #b9d6efd3 50%, #eef4ff33 100%); --card3_front: linear-gradient(122deg, #89d4cd 1%, #27a599e0 50%, #4DB6AC 100%); --card3_back: linear-gradient(262deg, #bcdddc8c 0%, #b6d6d4b0 50%, #96cad3 100%); --card3_inside: linear-gradient(82deg, #bcdddc8c 0%, #b6d6d4b0 50%, #96cad3 100%); --card4_front: linear-gradient(122deg, #5e35b157 0%, rgb(154 144 199) 50%, #825ac291 100%); --card4_back: linear-gradient(88deg, #ac93ea52 0%, #d3cfdd69 50%, #c9c0de5c 100%); --card4_inside: linear-gradient(267deg, #ac93ea52 0%, #d3cfdd69 50%, #c9c0de5c 100%); --table-row-hover-background: #74a0e5e8; --table-paginate-text-color: var(--text-color-lght); --table-td-even: #C2B0E2; --table-tr-selected: var(--secondary-600); --table-child-tr-odd1: #c4d3ebcc; --table-child-tr-odd2: #D6E1F1; --table-child-tr-even1: #D4C7EA; --table-child-tr-even2: #ddd3eee8; --scroll-background: #c8d9de; --input-search: #acc0df6e; /*-------------------------------------------*/ /* FORM CONTROLS */ /*-------------------------------------------*/ --input-background: linear-gradient(130deg, #c3cae85b 10%, #7fddeb59 100%); --input-color: #4aaad6; --input-border: 0.2px solid #04247c49; /*Campos obligatorios*/ --input-required-color: #F67E2D; /*campos disabled*/ --input-disabled-color: #005d63; --input-disabled-background: linear-gradient(130deg, #0094a728 0%, #0094a756 74%); /*danger color*/ --input-danger-color: #dc3545; /*-------------------------------------------*/ /* SIDEBAR COLORS */ /*-------------------------------------------*/ --sidebar-background: #ecf5ffb4; --sidebar-footer-background: #96cad3; --sidebar-i-text-color: var(--second-text-color-lght); /*añadir*/ /***************TOOLTIPS SIDEBAR FOOTER*/ --sidebar-tooltip-background: var(--dk-gray-100); /****************ACCORDION*******************/ --accordion-text-color: var(--text-color-lght); --accordion-hover-text-color: var(--text-color-drk); /*-------------------------------------------*/ /* TAB BAR */ /*-------------------------------------------*/ --tab-bar-nav-link-background: #99c3d691; --tab-bar-text-color: var(--text-color-lght); --tab-bar-focus-text-color: var(--white-color); /*---------------------------------------------------------*/ /* MÓDULO PLANEACIÓN */ /*variables para elementos dentro del módulo planeación*/ /*---------------------------------------------------------*/ --calendar-today-background: #2c4aab29; /*MODAL NUEVO EVENTO*/ --modal-backdrop: #ffffff; --modal-background: linear-gradient(to top, #b2d5e6 0%, #d9e7ff 74%) FIXED; --calendar-border-color: #e9eaed; /*---------------------------------------------*/ /* ÁREA DE TRABAJO PRINCIPAL */ /*---------------------------------------------*/ /*cambios 01/02/2022 Lizeth */ /*--------------MODULO EMPRESA-------------------*/ /*--MEmp-sidebar-li-background: linear-gradient(270deg, transparent 5%, #4fb5fe91 45%, #4fb5fed3 100%); --MEmp-sidebar-dropdown-a-hover-background: #4fb6fe;*/ /*--------------COLABORADOR-------------------*/ /*--MColab-sidebar-li-background: linear-gradient(270deg, transparent 5%, #0CC0C491 45%, #0CC0C4d3 100%); --MColab-sidebar-dropdown-a-hover-background: #0CC0C4;*/ /*------------------PLANEACIÓN----------------------*/ /*--MPlan-sidebar-li-background: linear-gradient(270deg, transparent 5%, #b66fff91 45%, #b66fffd3 100%); --MPlan-sidebar-dropdown-a-hover-background: #b66fff;*/ /*------------------INCIDENCIAS DE PAGO----------------------*/ /*--MIncidP-sidebar-li-background: linear-gradient(270deg, transparent 5%, #878cff91 45%, #878cffd3 100%); --MIncidP-sidebar-dropdown-a-hover-background: #878cff;*/ /*--------------------CALCULO DE NOMINA----------------------*/ /*--MCalcN-sidebar-li-background: linear-gradient(270deg, transparent 5%, #4db6ac77 45%, #009688ad 100%); --MCalcN-sidebar-dropdown-a-hover-background: #0096889a;*/ /*--------------------LEYES APLICABLES----------------------*/ /*--MLeyesA-sidebar-li-background: linear-gradient(270deg, transparent 5%, #77ACF191 45%, #77ACF1d3 100%); --MLeyesA-sidebar-dropdown-a-hover-background: #77ACF1;*/ /*--------------------PROCESOS ANUALES----------------------*/ /*--MProcA-sidebar-li-background: linear-gradient(270deg, transparent 5%, #f587b691 45%, #f587b6d3 100%); --MProcA-sidebar-dropdown-a-hover-background: #f177ac;*/ /*---------------------------------------------*/ /* ÁREA DE TRABAJO PRINCIPAL */ /*---------------------------------------------*/ /*cambios 01/02/2022 Lizeth */ /*cambios 18/01/2024 Eder Joel Calzada Espinosa cambio de nombre en las variables*/ /*--------------MODULO EMPRESA-------------------*/ --sidebarc1-li-background: linear-gradient(270deg, transparent 5%, #4fb5fe91 45%, #4fb5fed3 100%); --sidebarc1-dropdown-a-hover-background: #4fb6fe; /*--------------COLABORADOR-------------------*/ --sidebarc2-li-background: linear-gradient(270deg, transparent 5%, #0CC0C491 45%, #0CC0C4d3 100%); --sidebarc2-dropdown-a-hover-background: #0CC0C4; /*------------------PLANEACIÓN----------------------*/ --sidebarc3-li-background: linear-gradient(270deg, transparent 5%, #b66fff91 45%, #b66fffd3 100%); --sidebarc3-dropdown-a-hover-background: #b66fff; /*------------------INCIDENCIAS DE PAGO----------------------*/ --sidebarc4-li-background: linear-gradient(270deg, transparent 5%, #878cff91 45%, #878cffd3 100%); --sidebarc4-dropdown-a-hover-background: #878cff; /*--------------------CALCULO DE NOMINA----------------------*/ --sidebarc5-li-background: linear-gradient(270deg, transparent 5%, #4db6ac77 45%, #009688ad 100%); --sidebarc5-dropdown-a-hover-background: #0096889a; /*--------------------LEYES APLICABLES----------------------*/ --sidebarc6-li-background: linear-gradient(270deg, transparent 5%, #77ACF191 45%, #77ACF1d3 100%); --sidebarc6-dropdown-a-hover-background: #77ACF1; /*--------------------PROCESOS ANUALES----------------------*/ --sidebarc7-li-background: linear-gradient(270deg, transparent 5%, #f587b691 45%, #f587b6d3 100%); /*-------------------------------------------*/ /* Acordeón COLORS */ /*-------------------------------------------*/ /*cambios 14/01/2022 Lizeth*/ /*--------------EMPRESA-------------------*/ --MEmp-accordion-v-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #4fb5fed3 50%, transparent 96%, transparent 100%); --MEmp-accordion-h-label-background: linear-gradient(270deg, transparent 0%, transparent 10%, #4fb5fed3 50%, transparent 96%, transparent 100%); /*--------------COLABORADOR-------------------*/ --MColab-accordion-v-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #0CC0C4d3 50%, transparent 96%, transparent 100%); /*cambios 31/01/2022 Lizeth*/ --MColab-accordion-h-label-background: linear-gradient(270deg, transparent 0%, transparent 10%, #0CC0C4d3 50%, transparent 96%, transparent 100%); /*cambios 17/01/2022 Lizeth*/ /*--------------INCIDENCIAS DE PAGO-------------------*/ --MIncidP-accordion-v-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #878cffd3 50%, transparent 96%, transparent 100%); /*cambios 03/02/2022 Lizeth*/ /*-------------CÁLCULO DE NOMINA---------------*/ --MCalcN-accordion-v-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #009688ad 50%, transparent 96%, transparent 100%); --MCalcN-accordion-h-label-background: linear-gradient(270deg, transparent 0%, transparent 10%, #009688ad 50%, transparent 96%, transparent 100%); /*-------------LEYES APLICABLES---------------*/ --MLeyesA-accordion-v-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #77ACF1d3 50%, transparent 96%, transparent 100%); --MLeyesA-accordion-h-label-background: linear-gradient(270deg, transparent 0%, transparent 10%, #77ACF1d3 50%, transparent 96%, transparent 100%); /*cambios 26/01/2022 Andrea*/ /*------------PROCESOS ANUALES---------------*/ --MProcA-accordion-v-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #f587b6d3 50%, transparent 96%, transparent 100%); --MProcA-accordion-h-label-background: linear-gradient(270deg, transparent 0%, transparent 10%, #f587b6d3 50%, transparent 96%, transparent 100%); /*cambios 21/02/2022 Lizeth*/ /*------------CONFIGURACION---------------*/ --MConf-accordion-v-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #4046ff82 50%, transparent 96%, transparent 100%); --MConf-accordion-h-label-background: linear-gradient(270deg, transparent 0%, transparent 10%, #4046ff82 50%, transparent 96%, transparent 100%); /*Colores de acordeon*/ --acordeonc1-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #4fb5fed3 50%, transparent 96%, transparent 100%); --acordeonc2-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #0CC0C4d3 50%, transparent 96%, transparent 100%); --acordeonc3-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #878cffd3 50%, transparent 96%, transparent 100%); --acordeonc4-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #009688ad 50%, transparent 96%, transparent 100%); --acordeonc5-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #77ACF1d3 50%, transparent 96%, transparent 100%); --acordeonc6-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #f587b6d3 50%, transparent 96%, transparent 100%); --acordeonc7-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #4046ff82 50%, transparent 96%, transparent 100%); /*Estadísticas Table color por módulo*/ --estadistica1-table-background: radial-gradient(149% 157% at 50% -52%, #4fb5fed3 34%, #FF000000 99%); --estadistica2-table-background: radial-gradient(149% 157% at 50% -52%, #0CC0C4d3 34%, #FF000000 99%); --estadistica3-table-background: radial-gradient(149% 157% at 50% -52%, #878cffd3 34%, #FF000000 99%); --estadistica4-table-background: radial-gradient(149% 157% at 50% -52%, #009688ad 34%, #FF000000 99%); --estadistica5-table-background: radial-gradient(149% 157% at 50% -52%, #77ACF1d3 34%, #FF000000 99%); --estadistica6-table-background: radial-gradient(149% 157% at 50% -52%, #f587b6d3 34%, #FF000000 99%); --estadistica7-table-background: radial-gradient(149% 157% at 50% -52%, #4046ff82 34%, #FF000000 99%); /*-------------DASHBOARD---------------*/ --dash-breadcrumb-text-color: #04247c; --dash-card-background: #ecf5ffde; --dash-card-icon-shadow: 3px 3px 5px #90959c, -3px -3px 5px #ffffff; --dash-card-icon-border-radius: 30%; /*-------------DASHBOARD---------------*/ --dash-card-background: #ecf5ffde; --dash-card-icon-shadow: 3px 3px 5px #90959c, -3px -3px 5px #ffffff; --dash-card-icon-border-radius: 30%; /*-------------DASHBOARD WAVES---------------*/ --dash-animation-container-background: var(--primary-100); --dash-waves-1: rgba(94, 96, 206, 0.2); --dash-waves-2: rgba(94, 96, 206, 0.5); --dash-waves-3: rgba(94, 96, 206, 0.7); --dash-waves-4: rgb(75, 77, 170); /*-------------DASHBOARD PERSONALIZACIÓN, CARDS CARRUSEL---------------* /*------------TOTAL COLABORADORES---------------*/ /*Color base: #EB5D6F */ /*------------ICONO---------------*/ --dash-carrusel-card-TColab-icon-background: linear-gradient(145deg, #d45464, #fb6477); /*------------HOVER CARD---------------*/ --dash-carrusel-card-TColab-background-hover: radial-gradient(149% 157% at 50% -52%, #F6B9C1 34%, #FF000000 99%); /*------------TOTAL MUJERES---------------*/ /*Color base: #943385*/ /*------------ICONO---------------*/ --dash-carrusel-card-TMujer-icon-background: linear-gradient(145deg, #852e78, #9e378e); /*------------HOVER CARD---------------*/ --dash-carrusel-card-TMujer-background-hover: radial-gradient(149% 157% at 50% -52%, #DD9CD3 34%, #FF000000 99%); /*------------ICONO---------------*/ --dash-carrusel-card-TNoBinario-icon-background: linear-gradient(145deg, #8E24AA, #212121); /*------------HOVER CARD---------------*/ --dash-carrusel-card-TNoBinario-background-hover: radial-gradient(149% 157% at 50% -52%, #BA68C875 34%,#42424259 99%); /*------------TOTAL HOMBRES---------------*/ /* Color base: #4482e9 */ /*------------ICONO---------------*/ --dash-carrusel-card-THombre-icon-background: linear-gradient(145deg, #3d75d2, #498bf9); /*------------HOVER CARD---------------*/ --dash-carrusel-card-THombre-background-hover: radial-gradient(149% 157% at 50% -52%, #A1C1F4 34%, #FF000000 99%); /*------------ANTIGËDAD PROMEDIO---------------*/ /* Color base: #dcac45 */ /*------------ICONO---------------*/ --dash-carrusel-card-Antiguedad-icon-background: linear-gradient(145deg, #c69b3e, #ebb84a); /*------------HOVER CARD---------------*/ --dash-carrusel-card-Antiguedad-background-hover: radial-gradient(149% 157% at 50% -52%, #F0DCB0 34%, #FF000000 99%); /*------------DÍAS DE TRABAJO---------------*/ /* Color base: #1fc3d4*/ /*------------ICONO---------------*/ --dash-carrusel-card-DiaTrabajo-icon-background: linear-gradient(145deg, #1cb0bf, #21d1e3); /*------------HOVER CARD---------------*/ --dash-carrusel-card-DiaTrabajo-background-hover: radial-gradient(149% 157% at 50% -52%, #9CE8F0 34%, #FF000000 99%); /*------------AUSENTISMO---------------*/ /* Color base: #f58a55 */ /*------------ICONO---------------*/ --dash-carrusel-card-DiaAusente-icon-background: linear-gradient(145deg, #dd7c4d, #ff945b); /*------------HOVER CARD---------------*/ --dash-carrusel-card-DiaAusente-background-hover: radial-gradient(149% 157% at 50% -52%, #FBCDB7 34%, #FF000000 99%); /*------------ALTAS EN EL AÑO ---------------*/ /* Color base: #00db9b */ /*------------ICONO---------------*/ --dash-carrusel-card-AltaAnual-icon-background: linear-gradient(145deg, #00c58c, #00eaa6); /*------------HOVER CARD---------------*/ --dash-carrusel-card-AltaAnual-background-hover: radial-gradient(149% 157% at 50% -52%, #ACFFE6 34%, #FF000000 99%); /*------------BAJAS EN EL AÑO---------------*/ /* Color base: #e8523e */ /*------------ICONO---------------*/ --dash-carrusel-card-BajaAnual-icon-background: linear-gradient(145deg, #d14a38, #f85842); /*------------HOVER CARD---------------*/ --dash-carrusel-card-BajaAnual-background-hover: radial-gradient(149% 157% at 50% -52%, #F5B5AD 34%, #FF000000 99%); /*------------INCAPACIDAD---------------*/ /* Color base: #a487d5 */ /*------------ICONO---------------*/ --dash-carrusel-card-Incapacidad-icon-background: linear-gradient(145deg, #947ac0, #af90e4); /*------------HOVER CARD---------------*/ --dash-carrusel-card-Incapacidad-background-hover: radial-gradient(149% 157% at 50% -52%, #C4B1E4 34%, #FF000000 99%); /*------------INDEMNIZACIÓN---------------*/ /* Color base: #3f7d9f*/ /*------------ICONO---------------*/ --dash-carrusel-card-Indemnizacion-icon-background: linear-gradient(145deg, #39718f, #4386aa); /*------------HOVER CARD---------------*/ --dash-carrusel-card-Indemnizacion-background-hover: radial-gradient(149% 157% at 50% -52%, #99C1D6 34%, #FF000000 99%); /*------------INDICE DE ROTACION---------------*/ /* Color base: #880E4F*/ /*------------ICONO---------------*/ --dash-carrusel-card-IndiceRotacion-icon-background: linear-gradient(145deg, #7a0d47, #920f55); /*------------HOVER CARD---------------*/ --dash-carrusel-card-IndiceRotacion-background-hover: radial-gradient(149% 157% at 50% -52%, #F38AC2 34%, #FF000000 99%); /*------------CDFIS TIMBRADOS---------------*/ /* Color base: #00BFA5*/ /*------------ICONO---------------*/ --dash-carrusel-card-CFDITimbrado-icon-background: linear-gradient(145deg, #00ac95, #00ccb1); /*------------HOVER CARD---------------*/ --dash-carrusel-card-CFDITimbrado-background-hover: radial-gradient(149% 157% at 50% -52%, #8CFFF0 34%, #FF000000 99%); /*------------CUMPLEAÑOS---------------*/ /* Color base: #00BFA5*/ /*------------ICONO---------------*/ --dash-carrusel-card-Cumpleanios-icon-background: linear-gradient(145deg, rgba(97,207,143,1), rgba(58,222,255,1)); /*------------HOVER CARD---------------*/ --dash-carrusel-card-Cumpleanios-background-hover: radial-gradient(149% 157% at 50% -52%, #61CF8F42 34%, #3ADEFF45 99%); /*------------CUMPLEAÑOS---------------*/ /* Color base: #00BFA5*/ /*------------ICONO---------------*/ --dash-carrusel-card-Aniversario-icon-background: linear-gradient(145deg, #EABE3F, #E5A65E); /*------------HOVER CARD---------------*/ --dash-carrusel-card-Aniversario-background-hover: radial-gradient(149% 157% at 50% -52%, #EABE3F85 34%, #FF000000 99%); /*-------------DASHBOARD PERSONALIZACIÓN, Lista proyecciones---------------*/ /* COLOR BASE: #b0cc78 */ --dash-list-group-ProyeAnual-icon-background: linear-gradient(145deg, #9eb86c, #bcda80); /* Color base: #67c7bc */ --dash-list-group-ProyEjercido-icon-background: linear-gradient(145deg, #5db3a9, #6ed5c9); /* Color base: #f9a24b */ --dash-list-group-ProyRetenido-icon-background: linear-gradient(145deg, #e09244, #ffad50); /* Color base: #ebc44f */ --dash-list-group-ProyPorRetener-icon-background: linear-gradient(145deg, #d4b047, #fbd255); /* Color base: #71B383 */ --dash-list-group-ProyePorEjercer-icon-background: linear-gradient(145deg, #66a176, #79c08c); /***********CARD BOX*************/ --dash-card-box-BlobScatter: var(--secondary-100); --dash-list-group-shadow-hover: 0px 5px 20px #90959cd9; --ig-button-content: rgba(0, 0, 0, 0.26); /*cambios 28/10/2022 Anahí*/ /*------------ACUMULADO---------------*/ --MAcumulado-card-h-label-background: linear-gradient(270deg, transparent 0%, transparent 10%, #F681B3 50%, transparent 96%, transparent 100%); /*------------MENSUAL---------------*/ --MMensual-card-h-label-background: linear-gradient(270deg, transparent 0%, transparent 10%, #0cc49cd3 50%, transparent 96%, transparent 100%); /*Cambios Anahí 23/11/2022*/ /*------------ORGANIGRAMA---------------*/ /* --stroke-background: #1ACFAE; */ --fill-card: #ecf5ff; /*Cambios Anahí 25/11/2022*/ /*------------ORGANIGRAMA---------------*/ /* --stroke-background: #ecf5ff; */ /*-------------------------------------------*/ /* RELOJ CAPTCHA 2 */ /*-------------------------------------------*/ /*--------------Manecilla hr----------------*/ --RManecilla-hr-color: var(--primary-700); /*--------------Manecilla min----------------*/ --RManecilla-min-color: var(--secondary-600); /*--------------Manecilla seg----------------*/ --RManecilla-seg-color: var(--secondary-800); /*--------------Temporizador----------------*/ --RTemporizador: var(--primary-500); --input-background-color-config: #ff00004b; --input-border-color-config: #ff4242; /*Estadisticas individuales*/ --Estadistica1-cardRange-stroke-color: #D454644F; --Estadistica2-cardRange-stroke-color: #852e783D; --Estadistica3-cardRange-stroke-color: #FFFFFF; --Estadistica4-cardRange-stroke-color: #3d75d23D; --Estadistica1-chartRange-background: #fb6477; --Estadistica2-chartRange-background: #9e378e; --Estadistica3-chartRange-background: #f6f192; --Estadistica4-chartRange-background: #498bf9; --Estadistica5-chartRange-background: #ebb84a; --Estadistica6-chartRange-background: #21d1e3; --Estadistica7-chartRange-background: #ff945b; --Estadistica8-chartRange-background: #00eaa6; --Estadistica9-chartRange-background: #f85842; --Estadistica10-chartRange-background: #af90e4; --Estadistica11-chartRange-background: #4386aa; --Estadistica12-chartRange-background: #920f55; --Estadistica13-chartRange-background: #00ccb1; /************ESTILOS DE EMISION DE DOCUMENTOS COLABORADOR MODO CLARO**********/ /*CARDS FRONT COLORS*/ --card-front: radial-gradient(149% 157% at 50% -52%, #b5c4e8 34%, #FF000000 99%); --card-front-contract: radial-gradient(149% 157% at 50% -52%, #6aa3e3 34%, #FF000000 99%); /*Tablas de estadisticas*/ --TablaEstadisticasCabeceras: #C8C9FD; } /*Variables para tema oscuro, en este caso ya no es necesario especificar algunas variables como sombras, bordes, etc. Sólo aquellos colores que cambian*/ .body.dark-theme { /************DARK MODE COLORES BASE**********/ --primary-color: var(--primary-200); --secondary-color: var(--secondary-200); --theme-background: #0a192f; --shadow-drk: #040a13; --shadow-lght: #10284b; --text-color: #d0d0d0ec; --text-color-lght: #adadad; --text-color-drk: #1e1e1e; --white-color: #ebebeb; --title-section-color: #37bef4; --navbar-background: var(--theme-background); --navbar-buscador-background: var(--dash-card-background); --navbar-buscador-opcion-background-hover: var(--theme-background); /*---------------tema oscuro Eelvator speech---------------------------------------*/ --background-card-elevator: #4c6993; --background-speech-elevator: #577ba7; --background-config-elevator: #577ba7; --background-controls-elevator: #577ba7; --form-range-bg-elevator: #a67856; --form-range-thumb-elevator: #d2691e; --form-select-bg-elevator: #2b2b2b; --form-select-border-elevator: #577ba7; --text-primary-elevator: #e0e0e0; --text-title-elevator: #ffffff; --text-secondary-elevator: #ffffff; --background-speech-config-elevator: #3a5f7d; --background-card-elevatorActive: #577ba7; --second-title-colorElevator: #ffffff; --second-title-colorelevator: #ffffff; /*********************/ /* PANTALLA DE CARGA */ /*********************/ /* --ring-background: var(--primary-300); --ring-shadow-1: #7386c833; --ring-shadow-2: #7386c822; --ring-2-background: #4ccde2; --ring-2-shadow-1: #4ccde233; --ring-2-shadow-2: #4ccde222; --ring-3-background: #BA91B8; --ring-3-shadow-1: #BA91B833; --ring-3-shadow-2: #BA91B822; */ /**********DEGRADADOS********/ --tittle-gradient-color: linear-gradient(45deg, var(--primary-400) 0%, var(--primary-200) 35%, var(--primary-500) 100%); /*CARDS*/ --card-inner-shadow: inset 5px 5px 15px var(--shadow-drk), inset -5px -5px 15px var(--shadow-lght); /*CARD FOCUS*/ --card-focus-background: #143260af; --card-focus-shadow: inset 8px 8px 8px rgba(255, 255, 255, 0.03), inset -8px -8px 8px rgba(0, 0, 0, 0.2), 8px 8px 8px rgba(0, 0, 0, 0.2), -8px -8px 8px rgba(255, 255, 255, 0.03); --card-focus-inner-shadow: inset 2px 2px 2px #6f8d97, inset -2px -2px 2px #dbffff; /****BUTTONS*****/ --button-text-color: var(--theme-background); --button-background: linear-gradient(94deg, var(--secondary-300) 0%, var(--secondary-400) 35%, var(--secondary-500) 100%); /*-------------------------------------------*/ /* DATA TABLES COLORS */ /*-------------------------------------------*/ /*CARD CONSULTA*/ --card1_front: linear-gradient(228deg, #306295 0%, #174f86 50%, #19548e 100%); --card1_back: linear-gradient(232deg, #0b4678 0%, #023b6b 50%, #002f56 100%); --card1_inside: linear-gradient(117deg, #0b4678 0%, #023b6b 50%, #002f56 100%); --card2_front: linear-gradient(122deg, rgb(38 83 149)0%, rgb(58 109 173) 50%, rgb(44 72 169) 100%); --card2_back: linear-gradient(37deg, #0b3d6a 0%, #033d7c 50%, #04406c 100%); --card2_inside: linear-gradient(137deg, #0b3d6a 0%, #033d7c 50%, #04406c 100%); --card3_front: linear-gradient(122deg, #31968e 1%, #16ab9de0 50%, #186962 100%); --card3_back: linear-gradient(42deg, #144f52 0%, #065a60 50%, #115352 100%); --card3_inside: linear-gradient(286deg, #144f52 0%, #065a60 50%, #115352 100%); --card4_front: linear-gradient(122deg, #4f0588 0%, #4f0588 50%, #400370 100%); --card4_back: linear-gradient(91deg, #230549 0%, #2d1250 50%, #3a2356 100%); --card4_inside: linear-gradient(270deg, #230549 0%, #2d1250 50%, #3a2356 100%); --table-row-hover-background: var(--primary-500); --table-paginate-text-color: var(--dk-gray-400); --table-td-even: var(--primary-800); --table-tr-selected: var(--secondary-900); --table-child-tr-odd1: #153564b3; --table-child-tr-odd2: #153564fa; --table-child-tr-even1: #54368fa6; --table-child-tr-even2: #54368f80; --scroll-background: #3e7e88c4; --input-search: #132e53; /*-------------------------------------------*/ /* FORM CONTROLS */ /*-------------------------------------------*/ --input-background: linear-gradient(130deg, #3f66ae2c 0%, #2c4d8343 74%); --input-color: #537ff0e7; --input-border: 0.2px solid #4a6bd67c; /*Campos obligatorios*/ --input-required-color: #f3f79c; /*campos disabled*/ --input-disabled-color: #7fddeb9f; --input-disabled-background: linear-gradient(130deg, #7fddeb17 0%, #7fddeb3d 74%); /*---------------------------------------------*/ /* ÁREA DE TRABAJO PRINCIPAL */ /*---------------------------------------------*/ /*-------------------------------------------*/ /* SIDEBAR COLORS */ /*-------------------------------------------*/ --sidebar-background: #0d223f; --sidebar-footer-background: #112a4f; --sidebar-i-text-color: var(--white-color); /***************TOOLTIPS SIDEBAR FOOTER*/ --sidebar-tooltip-background: var(--dk-gray-1000); /****************ACCORDION*******************/ --accordion-text-color: var(--text-color); --accordion-hover-text-color: var(--white-color); /*-------------------------------------------*/ /* TAB BAR */ /*-------------------------------------------*/ --tab-bar-nav-link-background: #99c3d652; --tab-bar-focus-text-color: var(--text-color-drk); --tab-bar-text-color: var(--text-color); /*---------------------------------------------------------*/ /* MÓDULO PLANEACIÓN */ /*variables para elementos dentro del módulo planeación*/ /*---------------------------------------------------------*/ --calendar-today-background: #7385c85b; /*MODAL NUEVO EVENTO*/ --modal-backdrop: #091527; --modal-background: #0a192f; --calendar-border-color: var(--shadow-drk); /*--------------MODULO EMPRESA-------------------*/ --MEmp-sidebar-li-background: linear-gradient(270deg, transparent 5%, #0075dc69 45%, #0075dc8a 100%); /*--------------COLABORADOR-------------------*/ --MColab-sidebar-i-background: linear-gradient(270deg, transparent 5%, #00BCD48c 45%, #00bbd4a6 100%); /*------------------PLANEACIÓN----------------------*/ --MPlan-sidebar-i-background: linear-gradient(270deg, transparent 5%, #9119f269 45%, #9119f28a 100%); /*------------------INCIDENCIAS DE PAGO----------------------*/ --MIncidP-sidebar-i-background: linear-gradient(270deg, transparent 5%, #5852f069 45%, #5752f073 100%); /*--------------------CALCULO DE NOMINA----------------------*/ --MCalcN-sidebar-i-background: linear-gradient(270deg, transparent 5%, #0096937a 45%, #0096939d 100%); /*--------------------LEYES APLICABLES----------------------*/ --MLeyesA-sidebar-i-background: linear-gradient(270deg, transparent 5%, #527cda8c 45%, #527cdaa6 100%); /*--------------------PROCESOS ANUALES----------------------*/ --MProcA-sidebar-i-background: linear-gradient(270deg, transparent 5%, #f1549969 45%, #f154998a 100%); /*-------------------------------------------*/ /* Acordeón COLORS */ /*-------------------------------------------*/ /*--------------EMPRESA-------------------*/ --MEmp-accordion-v-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #0075dc8a 50%, transparent 96%, transparent 100%); --MEmp-accordion-h-label-background: linear-gradient(270deg, transparent 0%, transparent 10%, #0075dc8a 50%, transparent 96%, transparent 100%); /*--------------COLABORADOR-------------------*/ --MColab-accordion-v-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #00bbd4a6 50%, transparent 96%, transparent 100%); --MColab-accordion-h-label-background: linear-gradient(270deg, transparent 0%, transparent 10%, #00bbd4a6 50%, transparent 96%, transparent 100%); /*--------------INCIDENCIAS DE PAGO-------------------*/ --MIncidP-accordion-v-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #5752f073 50%, transparent 96%, transparent 100%); /*-------------CÁLCULO DE NOMINA---------------*/ --MCalcN-accordion-v-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #0096939d 50%, transparent 96%, transparent 100%); --MCalcN-accordion-h-label-background: linear-gradient(270deg, transparent 0%, transparent 10%, #0096939d 50%, transparent 96%, transparent 100%); /*-------------LEYES APLICABLES---------------*/ --MLeyesA-accordion-v-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #527cdaa6 50%, transparent 96%, transparent 100%); --MLeyesA-accordion-h-label-background: linear-gradient(270deg, transparent 0%, transparent 10%, #527cdaa6 50%, transparent 96%, transparent 100%); /*------------PROCESOS ANUALES---------------*/ --MProcA-accordion-v-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #f154998a 50%, transparent 96%, transparent 100%); --MProcA-accordion-h-label-background: linear-gradient(270deg, transparent 0%, transparent 10%, #f154998a 50%, transparent 96%, transparent 100%); /*------------CONFIGURACION---------------*/ --MConf-accordion-v-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #4047ffab 50%, transparent 96%, transparent 100%); --MConf-accordion-h-label-background: linear-gradient(270deg, transparent 0%, transparent 10%, #4047ffab 50%, transparent 96%, transparent 100%); /*Colores de acordeon*/ --acordeonc1-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #0075dc8a 50%, transparent 96%, transparent 100%); --acordeonc2-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #00bbd4a6 50%, transparent 96%, transparent 100%); --acordeonc3-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #5752f073 50%, transparent 96%, transparent 100%); --acordeonc4-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #0096939d 50%, transparent 96%, transparent 100%); --acordeonc5-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #527cdaa6 50%, transparent 96%, transparent 100%); --acordeonc6-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #f154998a 50%, transparent 96%, transparent 100%); --acordeonc7-label-background: linear-gradient(360deg, transparent 0%, transparent 10%, #4047ffab 50%, transparent 96%, transparent 100%); /*---------------------------------------------*/ /* ACUMULADOS, SLIDES */ /*---------------------------------------------*/ /******SECCIÓN*/ /*-------------DASHBOARD---------------*/ --dash-breadcrumb-text-color: #9ba8d8; --dash-card-background: #132e53; --dash-card-icon-shadow: 3px 3px 5px #081221, -3px -3px 5px #1e4a85; --dash-card-icon-border-radius: 30%; /*-------------DASHBOARD WAVES---------------*/ --dash-animation-container-background: var(--primary-900); --dash-waves-1: rgba(94, 96, 206, 0.2); --dash-waves-2: rgba(94, 96, 206, 0.5); --dash-waves-3: rgba(94, 96, 206, 0.7); --dash-waves-4: rgb(75, 77, 170); /*-------------DASHBOARD PERSONALIZACIÓN, CARDS CARRUSEL---------------* /*------------TOTAL COLABORADORES---------------*/ /* Color base: #C2185B */ /*------------ICONO---------------*/ /* --dash-carrusel-card-TColab-icon-background: linear-gradient(145deg, #de2145, #ff2852); */ --dash-carrusel-card-TColab-icon-background: linear-gradient(145deg, #af1652, #d01a61); /*------------HOVER CARD---------------*/ --dash-carrusel-card-TColab-background-hover: radial-gradient(149% 157% at 50% -52%, #620C2E 34%, #FF000000 99%); /*------------TOTAL MUJERES---------------*/ /* Color base: a44c96 */ /*------------ICONO---------------*/ --dash-carrusel-card-TMujer-icon-background: linear-gradient(145deg, #944487, #af51a1); /*------------HOVER CARD---------------*/ --dash-carrusel-card-TMujer-background-hover: radial-gradient(149% 157% at 50% -52%, #5E2B55 34%, #FF000000 99%); /*------------TOTAL HOMBRES---------------*/ /*Color base: 56a1fa*/ /*------------ICONO---------------*/ --dash-carrusel-card-THombre-icon-background: linear-gradient(145deg, #4d91e1, #5cacff); /*------------HOVER CARD---------------*/ --dash-carrusel-card-THombre-background-hover: radial-gradient(149% 157% at 50% -52%, #04418C 34%, #FF000000 99%); /*------------ANTIGËDAD PROMEDIO---------------*/ /* Color base: DCAC45 */ /*------------ICONO---------------*/ --dash-carrusel-card-Antiguedad-icon-background: linear-gradient(145deg, #c69b3e, #ebb84a); /*------------HOVER CARD---------------*/ --dash-carrusel-card-Antiguedad-background-hover: radial-gradient(149% 157% at 50% -52%, #574111 34%, #FF000000 99%); /*------------DÍAS DE TRABAJO---------------*/ /* Color base: #00a8bb */ /*------------ICONO---------------*/ --dash-carrusel-card-DiaTrabajo-icon-background: linear-gradient(145deg, #0097a8, #00b4c8); /*------------HOVER CARD---------------*/ --dash-carrusel-card-DiaTrabajo-background-hover: radial-gradient(149% 157% at 50% -52%, #007987 34%, #FF000000 99%); /*------------AUSENTISMO---------------*/ /* Color base: e55600 */ /*------------ICONO---------------*/ --dash-carrusel-card-DiaAusente-icon-background: linear-gradient(145deg, #ce4d00, #f55c00); /*------------HOVER CARD---------------*/ --dash-carrusel-card-DiaAusente-background-hover: radial-gradient(149% 157% at 50% -52%, #622600 34%, #FF000000 99%); /*------------ALTAS EN EL AÑO ---------------*/ /* Color base: #00b761 */ /*------------ICONO---------------*/ --dash-carrusel-card-AltaAnual-icon-background: linear-gradient(145deg, #00a557, #00c468); /*------------HOVER CARD---------------*/ --dash-carrusel-card-AltaAnual-background-hover: radial-gradient(149% 157% at 50% -52%, #004F2A 34%, #FF000000 99%); /*------------BAJAS EN EL AÑO---------------*/ /* Color base: #c74036 */ /*------------ICONO---------------*/ --dash-carrusel-card-BajaAnual-icon-background: linear-gradient(145deg, #b33a31, #d5443a); /*------------HOVER CARD---------------*/ --dash-carrusel-card-BajaAnual-background-hover: radial-gradient(149% 157% at 50% -52%, #64201B 34%, #FF000000 99%); /*------------INCAPACIDAD---------------*/ /* Color base: #7c52c3*/ /*------------ICONO---------------*/ --dash-carrusel-card-Incapacidad-icon-background: linear-gradient(145deg, #704ab0, #8558d1); /*------------HOVER CARD---------------*/ --dash-carrusel-card-Incapacidad-background-hover: radial-gradient(149% 157% at 50% -52%, #4D2E83 34%, #FF000000 99%); /*------------INDEMNIZACIÓN---------------*/ /* Color base: #4ea1c5 */ /*------------ICONO---------------*/ --dash-carrusel-card-Indemnizacion-icon-background: linear-gradient(145deg, #4691b1, #53acd3); /*------------HOVER CARD---------------*/ --dash-carrusel-card-Indemnizacion-background-hover: radial-gradient(149% 157% at 50% -52%, #3f9ac177 34%, #FF000000 99%); /*------------INDICE DE ROTACION---------------*/ /* Color base: #880E4F*/ /*------------ICONO---------------*/ --dash-carrusel-card-IndiceRotacion-icon-background: linear-gradient(145deg, #7a0d47, #920f55); /*------------HOVER CARD---------------*/ --dash-carrusel-card-IndiceRotacion-background-hover: radial-gradient(149% 157% at 50% -52%, #690B3D 34%, #FF000000 99%); /*------------CDFIS TIMBRADOS---------------*/ /* Color base: #00BFA5*/ /*------------ICONO---------------*/ --dash-carrusel-card-CFDITimbrado-icon-background: linear-gradient(145deg, #00ac95, #00ccb1); /*------------HOVER CARD---------------*/ --dash-carrusel-card-CFDITimbrado-background-hover: radial-gradient(149% 157% at 50% -52%, #006C5D 34%, #FF000000 99%); /*-------------DASHBOARD PERSONALIZACIÓN, Lista proyecciones---------------*/ /* COLOR BASE: #7fa835 */ --dash-list-group-ProyeAnual-icon-background: linear-gradient(145deg, #729730, #88b439); /* Color base: #009e8d */ --dash-list-group-ProyEjercido-icon-background: linear-gradient(145deg, #008e7f, #00a997); /* Color base: #ec8942 */ --dash-list-group-ProyRetenido-icon-background: linear-gradient(145deg, #d47b3b, #fd9347); /* Color base: #e7b72e */ --dash-list-group-ProyPorRetener-icon-background: linear-gradient(145deg, #d0a529, #f7c431); /* Color base: #54a46b */ --dash-list-group-ProyePorEjercer-icon-background: linear-gradient(145deg, #4c9460, #5aaf72); /***********CARD BOX*************/ --dash-card-box-BlobScatter: #0094a749; --dash-list-group-shadow-hover: 0px 5px 20px #081221e8; --ig-button-content: rgba(255, 255, 255, 0.26); /*------------ACUMULADO---------------*/ --MAcumulado-card-h-label-background: linear-gradient(270deg, transparent 0%, transparent 10%, #db4d8b8a 50%, transparent 96%, transparent 100%); /*------------MENSUAL---------------*/ --MMensual-card-h-label-background: linear-gradient(270deg, transparent 0%, transparent 10%, #03a2b8a6 50%, transparent 96%, transparent 100%); /*Cambios Anahí 23/11/2022*/ /*------------ORGANIGRAMA---------------*/ /*--stroke-background: #65FFE3; */ --fill-card: #132e53; /*Cambios Anahí 25/11/2022*/ /*------------ORGANIGRAMA---------------*/ /* --stroke-background: #132e53; */ /*-------------------------------------------*/ /* RELOJ captcha 2 */ /*-------------------------------------------*/ /*--------------Manecilla hr----------------*/ --RManecilla-hr-color: var(--primary-200) !important; /*--------------Manecilla min----------------*/ --RManecilla-min-color: var(--secondary-300) !important; /*--------------Manecilla seg----------------*/ --RManecilla-seg-color: var(--secondary-500) !important; /*--------------Temporizador----------------*/ --RTemporizador: var(--primary-300); /*Estadisticas individuales*/ --Estadistica1-cardRange-stroke-color: #af16526B; --Estadistica2-cardRange-stroke-color: #94448745; --Estadistica3-cardRange-stroke-color: #FFFFFF5E; --Estadistica4-cardRange-stroke-color: #4d91e145; --Estadistica1-chartRange-background: #d01a61; --Estadistica2-chartRange-background: #af51a1; --Estadistica3-chartRange-background: #f6f192; --Estadistica4-chartRange-background: #5cacff; /*Tablas de estadisticas*/ --TablaEstadisticasCabeceras: #114C9F; } /*ERRORES*/ .invalid { outline: 1px solid red; } .validation-message { color: red; } #blazor-error-ui { background: var(--navbar-buscador-background); bottom: 0; box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2); display: none; left: 0; padding: 0.6rem 1.25rem 0.7rem 1.25rem; position: fixed; width: 100%; z-index: 1000; } #blazor-error-ui i { font-size: 18px; font-weight: bold; } #blazor-error-ui i.bx-info-circle { color: #B71C1C; } #blazor-error-ui a { text-decoration: none; } #blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: 0.75rem; top: 0.5rem; } .blazor-error-boundary { background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121; padding: 1rem 1rem 1rem 3.7rem; color: white; } .blazor-error-boundary::after { content: "Ocurrió un error" } /*FIN ERRORES*/ * { margin: 0; padding: 0; box-sizing: border-box; } /*-------------------------------*/ /* ANIMACIONES */ /*-------------------------------*/ /* TÍTULOS */ @keyframes fluido { 0% { background-position: 0 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0 50%; } } @keyframes fluido2 { 0% { background-position: 0% 50%; } 100% { background-position: 100% 50%; /* Avanza solo hacia la derecha */ } } /***Responsive overflow*/ /*.body #PanelControl { --theme-background: #F6F6F6; } */ .body { background: var(--theme-background); /* PONER TEXT ALIGN EN CADA MÓDULO INDEPENDIENTE */ font-family: var(--font-Roboto); height: 100%; color: var(--text-color); overflow-y: scroll; overflow-x: hidden; transition: .2s background linear; } .body #PanelControl { font-family: var(--font-Roboto); color: var(--text-color); /* background: #F6F6F6; */ /* height: 100vh; */ /* overflow: scroll !important; */ font-size: 12px; } /*-------------------------------*/ /* PANTALLA DE CARGA */ /*-------------------------------*/ .container-load { display: flex; justify-content: center; align-items: center; min-height: 100vh; transition: .2s background linear; background: var(--theme-background); } .loading { position: relative; width: 100%; display: flex; justify-content: center; align-items: center; } .loading .ring { position: relative; width: 70px; height: 70px; margin: -20px; border-radius: 50%; border: 3px solid transparent; border-top: 3px solid var(--ring-background); animation: animate 4s linear infinite; } .loading .ring:nth-child(1) { position: relative; width: 70px; height: 70px; margin: -20px; border-radius: 50%; border: 3px solid transparent; border-top: 3px solid var(--ring-background); animation: animate 4s linear infinite; } .loading .ring:nth-child(1) { position: relative; width: 70px; height: 70px; margin: -20px; border-radius: 50%; border: 3px solid transparent; border-top: 3px solid var(--ring-background); animation: animate 4s linear infinite; } @keyframes animate { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .loading .ring::before { content: ''; position: absolute; top: 5px; right: 2px; border-radius: 50%; width: 10px; height: 10px; background: var(--ring-background); box-shadow: 0 0 0 5px var(--ring-shadow-1), 0 0 0 10px var(--ring-shadow-2), 0 0 20px var(--ring-background), 0 0 25px var(--ring-background); } .loading .ring:nth-child(2) { animation: animate2 4s linear infinite; animation-delay: -1s; border-left: 3px solid var(--ring-2-background); border-top: 3px solid transparent; } @keyframes animate2 { 0% { transform: rotate(360deg); } 100% { transform: rotate(0deg); } } .loading .ring:nth-child(2)::before { content: ''; position: absolute; top: initial; bottom: 5px; left: 2px; border-radius: 50%; width: 10px; height: 10px; background: var(--ring-2-background); box-shadow: 0 0 0 5px var(--ring-2-shadow-1), 0 0 0 10px var(--ring-2-shadow-2), 0 0 20px var(--ring-2-background), 0 0 25px var(--ring-2-background); } .loading .ring:nth-child(3) { animation: animate2 4s linear infinite; animation-delay: -3s; position: absolute; top: -30.66px; border-top: 3px solid transparent; border-left: 3px solid var(--ring-3-background); } @keyframes animate2 { 0% { transform: rotate(360deg); } 100% { transform: rotate(0deg); } } .loading .ring:nth-child(3)::before { content: ''; position: absolute; top: initial; bottom: 5px; left: 2px; border-radius: 50%; width: 10px; height: 10px; background: var(--ring-3-background); box-shadow: 0 0 0 5px var(--ring-3-shadow-1), 0 0 0 10px var(--ring-3-shadow-2), 0 0 20px var(--ring-3-background), 0 0 25px var(--ring-3-background); } /* .loading p{ position: absolute; color: #fff; font-size: 1.5em; font-family: consolas; bottom: -80px; letter-spacing: 0.15px; } */ /*-------------------------------*/ /* BOTÓN TEMA */ /*-------------------------------*/ .theme { position: absolute; top: -1rem; right: -4rem; display: flex; padding: 0.25rem; border-radius: 50%; box-shadow: var(--button-shadow); background: var(--card-background); color: var(--navbar-icon-color); cursor: pointer !important; z-index: 1000; } /*cambios Andrea 17/02/2022*/ /*-------------------*/ /* Botones */ /*-------------------*/ .button { background: var(--button-background); border: none; outline: none; cursor: pointer; color: var(--button-text-color); box-shadow: var(--button-shadow); text-decoration: none; align-items: center; letter-spacing: .5px; word-spacing: 2px; font-weight: 600; transition: transform .2s ease-in; } .btn-no-shadow { box-shadow: none; } .button:hover, .button-line:hover, .button:focus-visible, .button-line:focus-visible { transform: scale(1.045); -webkit-transform: scale(1.045); -moz-transform: scale(1.045); -ms-transform: scale(1.045); } .button-line:hover { border: 2px solid var(--secondary-color); color: var(--secondary-color); } .button:active, .button:focus-visible { border: none; outline: 0; color: var(--button-focus-text-color) !important; /*second-color*/ background: var(--button-focus-background); box-shadow: var(--button-inner-shadow) !important; } /*color de iconos*/ .button i { color: var(--button-text-color); } .button:active i { color: var(--button-focus-text-color); } /*segundo estilo*/ .button-line { background: var(--element-background); border: 2px solid var(--secondary-color); color: var(--secondary-color); outline: none; cursor: pointer; text-decoration: none; align-items: center; letter-spacing: .5px; word-spacing: 2px; box-shadow: var(--button-shadow); font-weight: 600; padding: 5 15px; transition: transform .1s ease-in; } .button-line:active, .button-line:focus-visible { border-color: var(--secondary-color) !important; color: var(--secondary-color) !important; outline: 0; /*second-color*/ box-shadow: var(--button-inner-shadow); } /*color de iconos*/ .button-line i { color: var(--secondary-color); } .button-line:active i { color: var(--secondary-color); } /*button recorder*/ .button-record { transition: 0.15s linear; } .button-record:hover { transition: 0.15s linear; transform: scale(1.05); } /*botones circulares agregar esta clase*/ .button-circle { border-radius: var(--button-circle-border-radius) !important; } /**TAMANO DE BOTONES PARA AQUELLOS QUE CONTENGAN TEXTO*/ /**cambiando estilos de boostrap*/ .btn-lg { border-radius: var(--button-lg-border-radius) !important; padding: 5px 15px; } .btn { border-radius: var(--button-lg-border-radius); padding: 5px 15px; } .btn-sm { border-radius: var(--button-sm-border-radius); padding: 5px 15px; } .btn-xs { height: 30px; border-radius: var(--button-sm-border-radius); padding: 5px 10px; } .btn.button:hover { color: var(--button-text-color); } .btn.button-line { color: var(--secondary-color); } /*TAMANO DE BOTONES PARA AQUELLOS QUE CONTENGAN ICONOS*/ .btn-icon-xl { width: 50px; height: 50px; font-size: 37px; border-radius: var(--button-lg-border-radius); } .btn-icon-md { width: 33px; height: 33px; font-size: 22px; border-radius: var(--button-sm-border-radius); } .btn-icon-sm { width: 25px; height: 25px; font-size: 15px; border-radius: var(--button-sm-border-radius); } .btn-icon-xs { width: 20px; height: 20px; font-size: 13px; border-radius: var(--button-sm-border-radius); } .btn-disabled { opacity: .5; cursor: not-allowed; pointer-events: none; } .button.btn-disabled:active, .button.btn-disabled:focus-visible { background: var(--button-background) !important; color: var(--button-text-color) !important; box-shadow: nonw !important; } /* .btn-disabled:active { all: unset; } */ /** PARA LOS INPUTS QUE SEAN TIPO FILE*/ /*****input file*****/ .input-file { position: relative; display: inline-block; overflow: hidden; } .file-select::before { display: flex; justify-content: center; align-items: center; border-radius: var(--button-sm-border-radius); position: absolute; left: 0; right: 0; top: 0; bottom: 0; } .file-select-focus::before { font-weight: 600; display: flex; justify-content: center; align-items: center; border-radius: var(--button-sm-border-radius); position: absolute; /*width: 100%;*/ left: 0; right: 0; top: 0; bottom: 0; box-shadow: var(--button-inner-shadow); background: var(--button-focus-background); color: var(--button-focus-text-color); } .file-select.img::before, .file-select-focus.img::before, .file-select.xlsx::before, .file-select-focus.xlsx::before, .file-select.doc::before, .file-select-focus.doc::before { white-space: nowrap; } .file-select.img::before, .file-select-focus.img::before { content: var(--file-select-img-content); } .file-select.doc::before, .file-select-focus.doc::before { content: var(--file-select-doc-content); } .input-file input[type="file"] { opacity: 0; /* width: 100%; */ display: inline-block; } /*****/ .docs-personales .file-select::before { padding: 0 10px; justify-content: left; overflow: hidden; } .btn-file { position: relative; overflow: hidden; } .btn-file input[type=file] { position: absolute; top: 0; right: 0; min-width: 100%; min-height: 100%; font-size: 100px; text-align: right; filter: alpha(opacity=0); opacity: 0; outline: none; background: white; cursor: inherit; display: block; } .file-select.xlsx::before, .file-select-focus.xlsx::before { content: var(--file-select-xlsx-content); } .body.dark-theme input[type=date]::-webkit-calendar-picker-indicator { filter: invert(1); } /*------------------------------------*/ /* CAJAS DE TEXTO Numorfismo */ /*------------------------------------*/ .field { height: 15%; width: 100%; display: flex; position: relative; margin-bottom: 20px; } .form-control-sm.input { padding-left: 35px; outline: none; border: none; font-size: var(--font-medium); background: var(--element-background); color: var(--text-color); border-radius: var(--input-soft-border-radius); box-shadow: var(--input-inner-shadow); } .form-control-sm.input::placeholder { color: var(--text-color); } .form-control-sm.input:focus { box-shadow: var(--input-shadow); background: var(--element-background); } body.dark-theme .form-control-sm.input:focus { color: var(--text-color); } .field .span { position: absolute; width: 35px; line-height: 30px; color: var(--text-color); } /*cambios Andrea 07/03/2022*/ /*------------------------------------*/ /* CARDS */ /*------------------------------------*/ .sdpr-card { border-radius: var(--card-border-radius); background: var(--element-background); border: none; } .outer-card { box-shadow: var(--card-shadow); } .inner-card { box-shadow: var(--card-inner-shadow); } .sm-outer-card { box-shadow: var(--card-sm-shadow); } .sm-inner-card { box-shadow: var(--card-sm-inner-shadow); } /*------------------------------------*/ /* CARRUSEL ESTILOS */ /*------------------------------------*/ .slick-dots li { width: 10px !important; height: 10px !important; } .slick-dots li button { width: 10px !important; height: 10px !important; } .slick-dots li button:before { opacity: 0.25; background: var(--secondary-900) !important; border-radius: 20px; content: ""; width: 10px; height: 10px; } .slick-prev:before { background-image: url("/img/Acceso/arrow-left-lg.png"); background-size: 60px 60px; display: inline-block; width: 60px; height: 60px; content: ""; margin-left: 0px !important; padding: 0 !important; background-repeat: no-repeat; position: initial; } .slick-prev:before button { width: 60px; height: 60px; } .slick-next:before { background-image: url("/img/Acceso/arrow-right-lg.png"); background-size: 60px 60px; display: inline-block; width: 60px; height: 60px; content: ""; background-repeat: no-repeat; } #dash-long .slick-prev:before, #dash-long .slick-next:before { background-size: 30px 30px !important; width: 30px !important; height: 30px !important; } .calendar-cont, .card-events, .events-details { text-transform: capitalize; color: var(--text-color); background: var(--element-background); border-radius: var(--card-border-radius); box-shadow: var(--card-sm-shadow); } .events-details { text-transform: none; } .calendar-cont .fc-left { color: var(--title-color); font-family: var(--font-Poppins); } .calendar-cont .fc-day-header { color: var(--second-title-color); } /* #calendar .fc-today-button.fc-button.fc-state-default.fc-corner-left.fc-corner-right{ } */ #calendar .fc-today-button.fc-button.fc-state-default.fc-corner-left.fc-corner-right, .fc-year-button.fc-button.fc-state-default.fc-corner-left.fc-corner-right, .fc-month-button.fc-button.fc-state-default.fc-corner-left.fc-corner-right { color: var(--text-color); background: var(--element-background) !important; font-size: 14px; border: none; box-shadow: var(--button-shadow); font-family: var(--font-Poppins); font-weight: 200; } .fc-year-button.fc-button.fc-state-default.fc-corner-left.fc-corner-right, .fc-month-button.fc-button.fc-state-default.fc-corner-left.fc-corner-right { opacity: 0.65; } .fc-today-button.fc-button.fc-state-default.fc-corner-left.fc-corner-right:focus, .fc-year-button.fc-button.fc-state-default.fc-corner-left.fc-corner-right.fc-state-active, .fc-month-button.fc-button.fc-state-default.fc-corner-left.fc-corner-right.fc-state-active { opacity: 1; box-shadow: var(--ham-menu-button-inner-shadow); } #calendar .fc-day-grid-event { margin-bottom: 7px; } .calendar-cont .fc-right .fc-button-group button.fc-prev-button { margin-right: 4px; } .calendar-cont .fc-right .fc-button-group button .fc-icon { font-size: 11px; } .calendar-cont .fc-right .fc-button-group button:hover { background: #d8d8d8; } .calendar-cont.widget-calendar { padding: 10px; margin: 0px; height: 570px; } .calendar-cont.widget-calendar td, .calendar-cont.widget-calendar th { font-size: 14px; border: none; } /* .calendar-cont .fc-right .fc-button-group { top: 0; right: 0; } */ .calendar-cont .fc-right .fc-button-group button { height: 25px; width: 25px; line-height: 18px; padding: 0; border: 0px solid transparent; background: var(--button-background); color: var(--button-text-color); box-shadow: var(--button-shadow); } .calendar-cont .fc-right .fc-button-group button.fc-prev-button { margin-right: 4px; } .calendar-cont .fc-right .fc-button-group button .fc-icon { font-size: 11px; } .calendar-cont .fc-right .fc-button-group button:hover { background: var(--ham-menu-button-hover-color); color: var(--ham-menu-button-hover-text-color); } .fc-unthemed td.fc-today { border: none; color: var(--text-color); border-radius: 5px; } .fc-unthemed td.fc-day { border: 1px solid var(--calendar-today-background); } .fc-day-top .fc-today { opacity: 0 !important; } .cont-planeacion .card-events, .events-details { position: relative; padding: 6px; height: 570px; } /********Card muchos eventos********/ .fc-popover .fc-header .fc-title { text-transform: lowercase; color: var(--title-color) !important; font-family: var(--font-Poppins) !important; pointer-events: all; } .fc-unthemed .fc-popover .fc-header { background: var(--modal-background) !important; } #calendar .fc-popover.fc-more-popover { background: var(--modal-background); border: none; border-radius: 8px; padding-top: 4px; box-shadow: var(--card-sm-shadow); } #calendar .fc-more { color: var(--secondary-color); font-weight: bold; } #calendar .fc-event .fc-title { padding-left: 6px; color: rgb(235, 235, 235); font-weight: bold; letter-spacing: 1.5px; z-index: 2; width: 100% !important; } .v-info { height: 90%; padding-bottom: 50px; / margin-bottom: 10px; / transition: all 0.3s; } .v-section { padding: 25px 0px 10px; height: 87%; overflow-y: scroll; overflow-x: hidden; } .v-section_item { position: relative; margin-bottom: 15px; padding-left: 9px; line-height: 1.15; font-size: var(--font-size-principal); } .v-section_item .item-content .v-fecha { margin-bottom: 10px; width: calc(100% - 27px) !important; } .v-section_time { padding-bottom: 4px; font-weight: 800; } .v-section_line { position: absolute; left: 0; top: 0; bottom: 0; width: 4px; border-radius: 2px; } .color-orange { / background: linear-gradient(#ff9900, #ff5050); / background: linear-gradient(109.6deg, #e88f1b 0%, #e84c14 100%); box-shadow: 0 -3px 12px -3px #b85621; } .color-pink { background: linear-gradient(109.6deg, #fe5196 0%, #e65f50 100%); / background: linear-gradient(#fa74a7, #fc5b5b); / box-shadow: 0 -3px 12px -3px #a01948; } .color-green { background: linear-gradient(109.6deg, rgba(2, 201, 131, 0.933) 11.2%, rgba(15, 167, 91, 0.782) 91.1%); box-shadow: 0 -3px 12px -3px #0c4f43; } .color-purple { background: linear-gradient(109.6deg, rgb(214, 63, 214) 0%, rgb(136, 85, 208) 100%); box-shadow: 0 -3px 12px -3px rgb(103, 39, 192); } .color-blue { background: linear-gradient(109.6deg, #1ea0c7 0%, #0c67b1 100%); / background: linear-gradient(#08aeea, #3785fa); / box-shadow: 0 -3px 12px -3px #1460d3; } .color-orange, .color-pink, .color-green, .color-blue, .color-yell, .color-purple { border: none !important; } body.dark-theme .color-orange { background: linear-gradient(109.6deg, #c77e2f 0%, #c0581f 100%); box-shadow: 0 2px 12px -3px #ffa41ce9; } body.dark-theme .color-pink { background: linear-gradient(109.6deg, #c52a68 0%, #c73f30 100%); / background: linear-gradient(#fa74a7, #fc5b5b); / / background: #ff66a8c7; / box-shadow: 0 2px 12px -3px #ff4b81f8; } body.dark-theme .color-green { background: linear-gradient(109.6deg, rgba(3, 148, 97, 0.933) 11.2%, rgba(9, 109, 59, 0.782) 91.1%); / box-shadow: 0 -3px 12px -3px #0c4f43; / / background: #19be6ce7; / box-shadow: 0 3px 12px -3px #25975ee9; } body.dark-theme .color-blue { background: linear-gradient(109.6deg, #229ec4d7 0%, #005eaa 100%); / background: linear-gradient(#08aeea, #3785fa); / box-shadow: 0 2px 12px -3px #2d91b3e9; } body.dark-theme .color-purple { background: linear-gradient(109.6deg, rgba(197, 37, 197, 0.782) 0%, rgb(87, 37, 158) 100%); box-shadow: 0 3px 12px -3px rgb(166, 55, 194); } .v-btn { cursor: pointer; position: absolute; display: flex; z-index: 2; justify-content: center; align-content: center; right: 10px; bottom: 10px; } @media screen and (max-width: 768px) { .cont-planeacion .card-events { height: 300px; } } /*==============MODAL NUEVO EVENTO=====================*/ #modalNuevoEv .modal-content { background: var(--modal-background); border-radius: var(--card-border-radius); border: none; box-shadow: var(--card-shadow); } #modalNuevoEv .modal-header { border-bottom: none; color: var(--title-color); font-family: var(--font-Poppins); } .modal-backdrop { background-color: var(--modal-backdrop) !important; } #modalNuevoEv .modal-footer { border-top: none; } #modalNuevoEv .modal-footer .button { width: 110px; height: 40px; } #modalNuevoEv .modal-footer .button-op { width: 110px; height: 40px; } #modalNuevoEv .modal-close { width: 30px; height: 30px; font-size: 25px; } /************ALERTS CALENDARIO****************/ .card-events .calendar-alert { height: 30px; padding: 5px; font-size: 13px; position: relative; color: var(--text-color); border: none; font-weight: 600; border-radius: 8px; } .card-events .calendar-alert.success { background: #b2d9b4; } .body.dark-theme .card-events .calendar-alert.success { background: #44876b; } .card-events .calendar-alert.error { background: #c48ea7; } .body.dark-theme .card-events .calendar-alert.error { background: #9c446e; } #events-details-cont { display: none; /* visibility: hidden; opacity: 0; -webkit-transition: all 1s ease 0.5s; -moz-transition: all 1s ease 0.5s; transition: all 1s ease 0.5s; */ } #events-details-cont.fade { transition-delay: 15s; } #events-details-cont.active { /* visibility: visible; opacity: 1; -webkit-transition: all 1.0s ease-in 0.5s; transition: all 1.0s ease-in 0.5s; */ display: block; } #calendar-cont { transition: width 0.5s ease-in; } /*---------------------*/ /* POPOVERS */ /*---------------------*/ /*.body .popover.fade { border-radius: 10px; box-shadow: var(--card-sm-shadow); border: none; } .body .popover.fade, .body .popover.fade .popover-header, .body .popover.fade.show.bs-popover-bottom .popover-header { border-radius: 10px; background: var(--modal-background); border: 1px solid transparent !important; outline-color: transparent; text-decoration: none; } .body .popover.fade .popover-arrow::after { border-top-color: var(--sidebar-footer-background); border-bottom-color: var(--sidebar-footer-background); } .body .popover.fade .popover-header { border: none; text-transform: uppercase; color: var(--title-color) !important; font-family: var(--font-Poppins) !important; } .body .popover.fade .popover-body { color: var(--text-color); font-weight: bold; } */ .popover-info { background: none; border: none; outline: none; } .body .popover { max-width: 140px; } .body .popover.fade { border-radius: 10px; box-shadow: var(--card-sm-shadow); border: none; } .body .popover-body { padding: .9rem .3rem; font-size: 11px; } .body .popover.fade, .body .popover.fade .popover-header, .body .popover.fade.show.bs-popover-bottom .popover-header { border-radius: 10px; background: var(--sidebar-tooltip-background); outline-color: transparent; text-decoration: none; } /* .body .popover.fade .popover-arrow::after { border-top-color: var(--sidebar-footer-background); border-bottom-color: var(--sidebar-footer-background); } */ .body .bs-popover-auto[data-popper-placement^=right] > .popover-arrow::after, .bs-popover-end > .popover-arrow::after { border-right-color: var(--sidebar-tooltip-background); } .body .bs-popover-auto[data-popper-placement^=top] > .popover-arrow::after, .bs-popover-top > .popover-arrow::after { border-top-color: var(--sidebar-tooltip-background); } .body .bs-popover-auto[data-popper-placement^=left] > .popover-arrow::after, .bs-popover-left > .popover-arrow::after { border-left-color: var(--sidebar-tooltip-background); } .body .popover.fade .popover-header { border: none; text-transform: uppercase; color: var(--title-color) !important; font-family: var(--font-Poppins) !important; } .body .popover.fade .popover-body { color: var(--text-color); } /****************DASHBOARD**************/ /*CARRUSEL*/ .dashboard-carrusel .slick-prev, .dashboard-carrusel .slick-next { width: 30px; height: 30px; } .dashboard-carrusel .slick-prev:before, .dashboard-carrusel .slick-next:before { background-size: 17px 17px; width: 17px; height: 17px; } ::-webkit-scrollbar { background: transparent; width: 20px; height: 5px; z-index: -1; position: relative; display: inline-block; } ::-webkit-scrollbar-thumb { background-color: rgba(32, 89, 151, 0.398); width: 10px; } ::-webkit-scrollbar-thumb:hover { background-color: rgba(0, 0, 0, 0.152); } body.dark-theme ::-webkit-scrollbar-thumb { background-color: rgba(51, 130, 158, 0.686); } body.dark-theme ::-webkit-scrollbar-thumb:hover { background-color: rgba(218, 218, 218, 0.398); } .more-options { opacity: 0; z-index: -2; left: -2000px; position: absolute; } .more-options.active { left: 0px; opacity: 1; z-index: 1; position: relative; } /*ESTILOS DE MÁS OPCIONES O FORMULARIOS DE CONSULTA*/ .more-options, .form-cont { transition: opacity 1s; } .more-options { opacity: 0; z-index: -2; left: -2000px; position: absolute; } .form-cont { opacity: 1; left: 0; } .form-cont.hidden { opacity: 0; z-index: -2; left: -2000px; position: absolute; } .more-options.active { left: 0px; opacity: 1; z-index: 1; position: relative; } .desactivar { display: none; } .form-reportes { transition: 0.8s ease all !important; } .form-grid { transition: 0.8s ease-out !important; } .btn.button-line.more-options.active { color: var(--secondary-color) !important; } .btn.more-options.active { color: var(--button-text-color) !important; } /*LOADING*/ .load { display: inline-block; width: 15px; height: 15px; border-radius: 15px; } .s1 { background-color: var(--primary-500); } .s2 { background-color: var(--primary-400); } .s3 { background-color: var(--primary-300); } .loading .load:nth-last-child(1) { animation: loadingW 0.9s 0.1s linear infinite; } .loading .load:nth-last-child(2) { animation: loadingW 0.9s 0.2s linear infinite; } .loading .load:nth-last-child(3) { animation: loadingW 0.9s 0.3s linear infinite; } .form-load { display: flex; justify-content: center; } @keyframes loadingW { 0% { transform: translate(0, 0); } 50% { transform: translate(0, 15px); } 100% { transform: translate(0, 0); } } /*alineación de decimales */ .dec { text-align: end; } #LeyAplicable .accordion-etiqueta { background: var(--MLeyesA-accordion-v-label-background); } #acc-IncidP .accordion-etiqueta { background: var(--MIncidP-accordion-v-label-background); } .btn.more-options.active { color: var(--button-text-color) !important; } /*REPORTES*/ .Nombre_reporte:hover { background: var(--dash-card-background); box-shadow: var(--dash-card-icon-shadow); border-radius: 50px; font-weight: 900; font-size: 13px; } .card-formulario label { cursor: pointer; } .accslide { display: block; padding: 0; /* overflow: hidden; */ font-size: var(--font-size-principal); } /********************/ /* CONSULTA RFC */ /******************/ .input-group-text.icon-group { background: var(--button-background) !important; cursor: pointer; border: var(--input-border); font-size: 12px; color: var(--button-text-color) !important; } .input-group-text.icon-group:hover { transform: scale(1.045) !important; } .input-group-text.icon-group:focus { border: none; outline: 0; color: var(--button-focus-text-color) !important; background: var(--button-focus-background) !important; box-shadow: var(--button-inner-shadow) !important; } ::-webkit-scrollbar { background: transparent; width: 6px; height: 5px; z-index: -1; position: relative; display: inline-block; } ::-webkit-scrollbar-thumb { background-color: rgba(32, 89, 151, 0.398); } ::-webkit-scrollbar-thumb:hover { background-color: rgba(0, 0, 0, 0.152); } body.dark-theme ::-webkit-scrollbar-thumb { background-color: rgba(51, 130, 158, 0.686); } body.dark-theme ::-webkit-scrollbar-thumb:hover { background-color: rgba(218, 218, 218, 0.398); } #wrapper .cont-accordion .card-formulario { /* height: calc(100vh - 132px); */ /* height: calc(100vh - 170.82px); */ /* 74 */ } /*,card-formulario{ overflow-y: scroll; } @media (max-height: 625px) { .card-formulario, .form-container, .cont-planeacion { overflow-y: scroll !important; } } @media (max-width: 1110px) { .card-formulario, .cont-planeacion { overflow: scroll !important; overflow-y: scroll; } } */ /*07/06/2023*/ @media (max-width: 767px) { #navbarMain > .container-fluid .navbar-brand { margin-left: 15px; } } #wrapper .cont-accordion .card-formulario { /* height: calc(100vh - 132px); */ /* height: calc(100vh - 170.82px); */ /* 74 */ } #wrapper.fullwidth-right .cont-accordion .card-formulario { /* height: calc(100vh - 150px); */ /* height: calc(100vh - 187.245px); */ /* height: 71.5vh; */ } /*HR*/ .line-form { margin: 0 0 2px 0; /* display: block; */ border: none; height: 1px !important; border-radius: 5px; background: #0071B9; background: linear-gradient(to right, var(--primary-500), var(--secondary-800), var(--primary-800), var(--secondary-800), var(--primary-500)); } /*********FORM CONTROLS**********/ /*para evitar que los label tengan cursor y realicen eventos clic*/ .form-container .col-form-label { cursor: default !important; pointer-events: none; } /*estilos para cajas de texto, selects*/ .form-control-sdpr { padding: 0 3px 0 3px !important; background: var( --input-background); box-shadow: var(--input-glass-shadow); border: var( --input-border); border-radius: var( --input-border-radius); color: var(--text-color); transition: border 0.2s ease-in-out; font-size: 12px; margin: 0px; } .form-control-sdpr, .form-select-sdpr, .input-file input[type="file"] { min-height: calc(1.5em + 0.4rem + 1px); } .form-select-sdpr { background: var( --input-background); box-shadow: var(--input-glass-shadow); border: var( --input-border); border-radius: var( --input-border-radius); color: var(--text-color); transition: border 0.2s ease-in-out; font-size: 12px; width: 100%; padding: 0 2px 0 2px !important; } .form-select-sdpr option { background-color: var(--dash-card-background); } .form-control-sdpr:focus { background: var(--background-elements); box-shadow: none; border-bottom: var(--input-focus-border-bottom); outline: none; } /*Estilos para modo oscuro, texto en blanco en todos los casos*/ .form-control:focus, .form-control-sdpr:focus, .form-select-sdpr:focus, .form-select-sdpr:checked { color: var(--text-color); } .form-select-sdpr:focus, .form-select-sdpr:checked { background-color: var(--background-theme); box-shadow: none; border-bottom: var( --input-focus-border-bottom); color: var(--text-color); outline: none; } /*Estilos input file (Blazor)*/ .input-file { background: var( --input-background); box-shadow: var(--input-glass-shadow); border: var( --input-border); border-radius: var( --input-border-radius); color: var(--text-color); /* height: 25px; */ text-align: center; box-sizing: border-box; cursor: pointer; } .input-file::-webkit-file-upload-button { visibility: hidden; /*width: 12.5vw;*/ padding-top: 6px; } .input-file::before { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; padding: 2px 3px 0px 3px; margin-left: -5px; content: "Seleccionar archivo"; text-align: center; /* box-sizing: border-box; */ position: absolute; /*width: 12vw;*/ height: 100%; /* height: 25px; */ cursor: pointer; /* border-radius: var(--button-sm-border-radius); */ box-shadow: var(--button-shadow); background: var(--button-background); color: var(--button-text-color); } /*.input-file:focus::before { box-shadow: var(--button-inner-shadow); background: var(--button-focus-background); color: var(--button-focus-text-color); }*/ .input-file:hover::before { transform: scale(1.025); -webkit-transform: scale(1.025); -moz-transform: scale(1.025); -ms-transform: scale(1.025); } .titulo-consulta { font-size: 14px; font-family: var(--font-Poppins); cursor: default !important; color: #00a8c1; text-align: center; } /*INPUTS NUMÉRICOS*/ /* Para Chrome, Safari, Edge, Opera */ input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } /* Para Firefox */ input[type="number"] { -moz-appearance: textfield; appearance: textfield; } /*ACORDEONES*/ /*Colores*/ .accordion-nav.ac-c-1 .cont-accordion .accordion-etiqueta { background: var(--acordeonc1-label-background); } .accordion-nav.ac-c-2 .cont-accordion .accordion-etiqueta { background: var(--acordeonc2-label-background); } .accordion-nav.ac-c-3 .cont-accordion .accordion-etiqueta { background: var(--acordeonc3-label-background); } .accordion-nav.ac-c-4 .cont-accordion .accordion-etiqueta { background: var(--acordeonc4-label-background); } .accordion-nav.ac-c-5 .cont-accordion .accordion-etiqueta { background: var(--acordeonc5-label-background); } .accordion-nav.ac-c-6 .cont-accordion .accordion-etiqueta { background: var(--acordeonc6-label-background); } .accordion-nav.ac-c-7 .cont-accordion .accordion-etiqueta { background: var(--acordeonc7-label-background); } /*tres etiquetas*/ /*.accordion-nav.vertical.ac-3 .li-accordion-v.active .accslide { width: calc(100% - 54px); }*/ /*Fullwidth*/ /*.accordion-nav.vertical.ac-3 .li-accordion-v:nth-child(2).active .accslide.fullwidth { width: calc(100% - 36px); } .accordion-nav.vertical.ac-3 .li-accordion-v:nth-child(3).active .accslide.fullwidth { width: calc(100% - 18px); }*/ /*cuatro etiquetas*/ /*.accordion-nav.vertical.ac-4 .li-accordion-v.active .accslide { width: calc(100% - 72px); }*/ /*Fullwidth*/ /*.accordion-nav.vertical.ac-4 .li-accordion-v:nth-child(2).active .accslide.fullwidth { width: calc(100% - 54px); } .accordion-nav.vertical.ac-4 .li-accordion-v:nth-child(3).active .accslide.fullwidth { width: calc(100% - 36px); } .accordion-nav.vertical.ac-4 .li-accordion-v:nth-child(4).active .accslide.fullwidth { width: calc(100% - 18px); }*/ /*cinco etiquetas*/ /*.accordion-nav.vertical.ac-5 .li-accordion-v.active .accslide { width: calc(100% - 90px); }*/ /*Fullwidth*/ /*.accordion-nav.vertical.ac-5 .li-accordion-v:nth-child(2).active .accslide.fullwidth { width: calc(100% - 72px); } .accordion-nav.vertical.ac-5 .li-accordion-v:nth-child(3).active .accslide.fullwidth { width: calc(100% - 54px); } .accordion-nav.vertical.ac-5 .li-accordion-v:nth-child(4).active .accslide.fullwidth { width: calc(100% - 36px); } .accordion-nav.vertical.ac-5 .li-accordion-v:nth-child(5).active .accslide.fullwidth { width: calc(100% - 18px); }*/ /*seis etiquetas*/ /*.accordion-nav.vertical.ac-6 .accordion-control[type="radio"]:checked ~ .accslide { width: calc(100% - 108px); }*/ /*Fullwidth*/ /*.accordion-nav.vertical.ac-6 .li-accordion-v:nth-child(2).active .accslide.fullwidth { width: calc(100% - 90px); } .accordion-nav.vertical.ac-6 .li-accordion-v:nth-child(3).active .accslide.fullwidth { width: calc(100% - 72px); } .accordion-nav.vertical.ac-6 .li-accordion-v:nth-child(4).active .accslide.fullwidth { width: calc(100% - 54px); } .accordion-nav.vertical.ac-6 .li-accordion-v:nth-child(5).active .accslide.fullwidth { width: calc(100% - 36px); } .accordion-nav.vertical.ac-6 .li-accordion-v:nth-child(6).active .accslide.fullwidth { width: calc(100% - 18px); }*/ /*nueve etiquetas*/ /*.accordion-nav.vertical.ac-9 .li-accordion-v.active .accslide { width: calc(100% - 162px); }*/ /*Fullwidth*/ /*.accordion-nav.vertical.ac-9 .li-accordion-v:nth-child(2).active .accslide.fullwidth { width: calc(100% - 144px); } .accordion-nav.vertical.ac-9 .li-accordion-v:nth-child(3).active .accslide.fullwidth { width: calc(100% - 126px); } .accordion-nav.vertical.ac-9 .li-accordion-v:nth-child(4).active .accslide.fullwidth { width: calc(100% - 108px); } .accordion-nav.vertical.ac-9 .li-accordion-v:nth-child(5).active .accslide.fullwidth { width: calc(100% - 90px); } .accordion-nav.vertical.ac-9 .li-accordion-v:nth-child(6).active .accslide.fullwidth { width: calc(100% - 72px); } .accordion-nav.vertical.ac-9 .li-accordion-v:nth-child(7).active .accslide.fullwidth { width: calc(100% - 54px); } .accordion-nav.vertical.ac-9 .li-accordion-v:nth-child(8).active .accslide.fullwidth { width: calc(100% - 36px); } .accordion-nav.vertical.ac-9 .li-accordion-v:nth-child(9).active .accslide.fullwidth { width: calc(100% - 18px); }*/ /*trece etiquetas*/ /*.accordion-nav.vertical.ac-13 .li-accordion-v.active .accslide { width: calc(100% - 234px); }*/ /*Fullwidth*/ /*.accordion-nav.vertical.ac-13 .li-accordion-v:nth-child(2).active .accslide.fullwidth { width: calc(100% - 216px); } .accordion-nav.vertical.ac-13 .li-accordion-v:nth-child(3).active .accslide.fullwidth { width: calc(100% - 198px); } .accordion-nav.vertical.ac-13 .li-accordion-v:nth-child(4).active .accslide.fullwidth { width: calc(100% - 180px); } .accordion-nav.vertical.ac-13 .li-accordion-v:nth-child(5).active .accslide.fullwidth { width: calc(100% - 162px); } .accordion-nav.vertical.ac-13 .li-accordion-v:nth-child(6).active .accslide.fullwidth { width: calc(100% - 144px); } .accordion-nav.vertical.ac-13 .li-accordion-v:nth-child(7).active .accslide.fullwidth { width: calc(100% - 126px); } .accordion-nav.vertical.ac-13 .li-accordion-v:nth-child(8).active .accslide.fullwidth { width: calc(100% - 108px); } .accordion-nav.vertical.ac-13 .li-accordion-v:nth-child(9).active .accslide.fullwidth { width: calc(100% - 90px); } .accordion-nav.vertical.ac-13 .li-accordion-v:nth-child(10).active .accslide.fullwidth { width: calc(100% - 72px); } .accordion-nav.vertical.ac-13 .li-accordion-v:nth-child(11).active .accslide.fullwidth { width: calc(100% - 54px); } .accordion-nav.vertical.ac-13 .li-accordion-v:nth-child(12).active .accslide.fullwidth { width: calc(100% - 36px); } .accordion-nav.vertical.ac-13 .li-accordion-v:nth-child(13).active .accslide.fullwidth { width: calc(100% - 18px); }*/ /*siete etiquetas*/ /*.accordion-nav.vertical.ac-7 .li-accordion-v.active .accslide { width: calc(100% - 126px); }*/ /*Fullwidth*/ /*.accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(2).active .accslide.fullwidth { width: calc(100% - 108px); } .accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(3).active .accslide.fullwidth { width: calc(100% - 90px); } .accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(4).active .accslide.fullwidth { width: calc(100% - 72px); } .accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(5).active .accslide.fullwidth { width: calc(100% - 54px); } .accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(6).active .accslide.fullwidth { width: calc(100% - 36px); } .accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(7).active .accslide.fullwidth { width: calc(100% - 18px); }*/ /*cuatro etiquetas*/ .accordion-nav.vertical.ac-4 .li-accordion-v.active .accslide.fullwidth, .accordion-nav.vertical.ac-4 .li-accordion-v:nth-child(3).active .accslide.right { width: calc(100% - 36px); } .accordion-nav.vertical.ac-4 .li-accordion-v:nth-child(2).active .accslide.left, .accordion-nav.vertical.ac-4 .li-accordion-v:nth-child(2).active .accslide.right { width: calc(100% - 54px); } .accordion-nav.vertical.ac-4 .li-accordion-v:nth-child(3).active .accslide.left, .accordion-nav.vertical.ac-4 .li-accordion-v:nth-child(1).active .accslide.right { width: calc(100% - 72px); } /*cinco etiquetas*/ .accordion-nav.vertical.ac-5 .li-accordion-v.active .accslide.fullwidth, .accordion-nav.vertical.ac-5 .li-accordion-v:nth-child(4).active .accslide.right { width: calc(100% - 36px); } .accordion-nav.vertical.ac-5 .li-accordion-v:nth-child(2).active .accslide.left, .accordion-nav.vertical.ac-5 .li-accordion-v:nth-child(3).active .accslide.right { width: calc(100% - 54px); } .accordion-nav.vertical.ac-5 .li-accordion-v:nth-child(3).active .accslide.left, .accordion-nav.vertical.ac-5 .li-accordion-v:nth-child(2).active .accslide.right { width: calc(100% - 72px); } .accordion-nav.vertical.ac-5 .li-accordion-v:nth-child(4).active .accslide.left, .accordion-nav.vertical.ac-5 .li-accordion-v:nth-child(1).active .accslide.right { width: calc(100% - 90px); } /*seis etiquetas*/ .accordion-nav.vertical.ac-6 .li-accordion-v.active .accslide.fullwidth, .accordion-nav.vertical.ac-6 .li-accordion-v:nth-child(5).active .accslide.right { width: calc(100% - 36px); } .accordion-nav.vertical.ac-6 .li-accordion-v:nth-child(2).active .accslide.left, .accordion-nav.vertical.ac-6 .li-accordion-v:nth-child(4).active .accslide.right { width: calc(100% - 54px); } .accordion-nav.vertical.ac-6 .li-accordion-v:nth-child(3).active .accslide.left, .accordion-nav.vertical.ac-6 .li-accordion-v:nth-child(3).active .accslide.right { width: calc(100% - 72px); } .accordion-nav.vertical.ac-6 .li-accordion-v:nth-child(4).active .accslide.left, .accordion-nav.vertical.ac-6 .li-accordion-v:nth-child(2).active .accslide.right { width: calc(100% - 90px); } .accordion-nav.vertical.ac-6 .li-accordion-v:nth-child(5).active .accslide.left, .accordion-nav.vertical.ac-6 .li-accordion-v:nth-child(1).active .accslide.right { width: calc(100% - 108px); } /*siete etiquetas*/ .accordion-nav.vertical.ac-7 .li-accordion-v.active .accslide.fullwidth, .accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(6).active .accslide.right { width: calc(100% - 36px); } .accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(2).active .accslide.left, .accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(5).active .accslide.right { width: calc(100% - 54px); } .accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(3).active .accslide.left, .accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(4).active .accslide.right { width: calc(100% - 72px); } .accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(4).active .accslide.left, .accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(3).active .accslide.right { width: calc(100% - 90px); } .accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(5).active .accslide.left, .accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(2).active .accslide.right { width: calc(100% - 108px); } .accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(6).active .accslide.left, .accordion-nav.vertical.ac-7 .li-accordion-v:nth-child(1).active .accslide.right { width: calc(100% - 126px); } /*ocho etiquetas*/ .accordion-nav.vertical.ac-8 .li-accordion-v.active .accslide.fullwidth, .accordion-nav.vertical.ac-8 .li-accordion-v:nth-child(7).active .accslide.right { width: calc(100% - 36px); } .accordion-nav.vertical.ac-8 .li-accordion-v:nth-child(2).active .accslide.left, .accordion-nav.vertical.ac-8 .li-accordion-v:nth-child(6).active .accslide.right { width: calc(100% - 54px); } .accordion-nav.vertical.ac-8 .li-accordion-v:nth-child(3).active .accslide.left, .accordion-nav.vertical.ac-8 .li-accordion-v:nth-child(5).active .accslide.right { width: calc(100% - 72px); } .accordion-nav.vertical.ac-8 .li-accordion-v:nth-child(4).active .accslide.left, .accordion-nav.vertical.ac-8 .li-accordion-v:nth-child(4).active .accslide.right { width: calc(100% - 90px); } .accordion-nav.vertical.ac-8 .li-accordion-v:nth-child(5).active .accslide.left, .accordion-nav.vertical.ac-8 .li-accordion-v:nth-child(3).active .accslide.right { width: calc(100% - 108px); } .accordion-nav.vertical.ac-8 .li-accordion-v:nth-child(6).active .accslide.left, .accordion-nav.vertical.ac-8 .li-accordion-v:nth-child(2).active .accslide.right { width: calc(100% - 126px); } .accordion-nav.vertical.ac-8 .li-accordion-v:nth-child(7).active .accslide.left, .accordion-nav.vertical.ac-8 .li-accordion-v:nth-child(1).active .accslide.right { width: calc(100% - 144px); } /*diez etiquetas*/ .accordion-nav.vertical.ac-10 .li-accordion-v.active .accslide.fullwidth, .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(9).active .accslide.right { width: calc(100% - 36px); } .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(2).active .accslide.left, .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(8).active .accslide.right { width: calc(100% - 54px); } .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(3).active .accslide.left, .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(7).active .accslide.right { width: calc(100% - 72px); } .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(4).active .accslide.left, .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(6).active .accslide.right { width: calc(100% - 90px); } .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(5).active .accslide.left, .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(5).active .accslide.right { width: calc(100% - 108px); } .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(6).active .accslide.left, .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(4).active .accslide.right { width: calc(100% - 126px); } .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(7).active .accslide.left, .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(3).active .accslide.right { width: calc(100% - 144px); } .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(8).active .accslide.left, .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(2).active .accslide.right { width: calc(100% - 162px); } .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(9).active .accslide.left, .accordion-nav.vertical.ac-10 .li-accordion-v:nth-child(1).active .accslide.right { width: calc(100% - 180px); } /*catorce etiquetas*/ .accordion-nav.vertical.ac-14 .li-accordion-v.active .accslide.fullwidth /*.accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(13).active .accslide.right*/ { width: calc(100% - 36px); } .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(2).active .accslide.left, .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(12).active .accslide.right { width: calc(100% - 54px); } .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(3).active .accslide.left, .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(11).active .accslide.right { width: calc(100% - 72px); } .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(4).active .accslide.left, .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(10).active .accslide.right { width: calc(100% - 90px); } .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(5).active .accslide.left, .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(9).active .accslide.right { width: calc(100% - 108px); } .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(6).active .accslide.left, .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(8).active .accslide.right { width: calc(100% - 126px); } .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(7).active .accslide.left, .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(7).active .accslide.right { width: calc(100% - 144px); } .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(8).active .accslide.left, .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(6).active .accslide.right { width: calc(100% - 162px); } .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(9).active .accslide.left, .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(5).active .accslide.right { width: calc(100% - 180px); } .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(10).active .accslide.left, .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(4).active .accslide.right { width: calc(100% - 198px); } .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(11).active .accslide.left, .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(3).active .accslide.right { width: calc(100% - 216px); } .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(12).active .accslide.left, .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(2).active .accslide.right { width: calc(100% - 234px); } .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(13).active .accslide.left, .accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(1).active .accslide.right { width: calc(100% - 252px); } /*Quince etiquetas*/ .accordion-nav.vertical.ac-15 .li-accordion-v.active .accslide.fullwidth /*.accordion-nav.vertical.ac-14 .li-accordion-v:nth-child(13).active .accslide.right*/ { width: calc(100% - 36px); } .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(2).active .accslide.left, .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(13).active .accslide.right { width: calc(100% - 54px); } .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(3).active .accslide.left, .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(12).active .accslide.right { width: calc(100% - 72px); } .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(4).active .accslide.left, .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(11).active .accslide.right { width: calc(100% - 90px); } .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(5).active .accslide.left, .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(10).active .accslide.right { width: calc(100% - 108px); } .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(6).active .accslide.left, .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(9).active .accslide.right { width: calc(100% - 126px); } .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(7).active .accslide.left, .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(8).active .accslide.right { width: calc(100% - 154px); } .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(8).active .accslide.left, .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(7).active .accslide.right { width: calc(100% - 162px); } .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(9).active .accslide.left, .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(6).active .accslide.right { width: calc(100% - 180px); } .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(10).active .accslide.left, .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(5).active .accslide.right { width: calc(100% - 198px); } .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(11).active .accslide.left, .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(4).active .accslide.right { width: calc(100% - 216px); } .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(12).active .accslide.left, .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(3).active .accslide.right { width: calc(100% - 234px); } .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(13).active .accslide.left, .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(2).active .accslide.right { width: calc(100% - 252px); } .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(14).active .accslide.left, .accordion-nav.vertical.ac-15 .li-accordion-v:nth-child(1).active .accslide.right { width: calc(100% - 270px); } /*TABLA DE ESTADÍSTICAS*/ /*.statistical-table .mud-table-root{ font-size: 12px!important; } */ .statistical-table .mud-table-root .mud-table-body .mud-table-row { border-bottom: 1px solid; border-bottom-color: #9f9f9f69; } .statistical-table.dashboard .mud-table-root .mud-table-body .mud-table-row { } .statistical-table table { box-shadow: none !important; font-size: 12px !important; } .statistical-table .mud-table-container { border-radius: var(--input-soft-border-radius); padding: 0 8px; height: 100% } .statistical-table.dashboard:not(.statistical-table.dashboard.EAntiguedad) .mud-table-container, .statistical-table.range.fest #contentTable { height: 70vh; /* height: 100%*/ } .statistical-table table th, .statistical-table table td { font-size: 12px !important; padding-bottom: 0px !important; padding-right: 7px !important; padding-left: 7px !important; } /*Color de tablas por módulo*/ .statistical-table .mud-table-container { border-radius: var(--input-soft-border-radius); padding: 0 8px; } .statistical-table.estadistica1 .mud-table-container { background: var(--estadistica1-table-background) } .statistical-table.estadistica2 .mud-table-container { background: var(--estadistica2-table-background) } .statistical-table.estadistica3 .mud-table-container { background: var(--estadistica3-table-background) } .statistical-table.estadistica4 .mud-table-container { background: var(--estadistica4-table-background) } .statistical-table.estadistica5 .mud-table-container { background: var(--estadistica5-table-background) } .statistical-table.estadistica6 .mud-table-container { background: var(--estadistica6-table-background) } .statistical-table.estadistica7 .mud-table-container { background: var(--estadistica7-table-background) } .statistical-table.range, .statistical-chart { border-radius: var(--card-border-radius); background: var(--dash-card-background); } .statistical-table.range:not(.statistical-table.range.fest) .table-range { height: 14rem; } .statistical-table.range { z-index: 1 } .rz-axis .rz-axis-title { fill: var(--text-color) !important; } /*.statistical-table:not(.statistical-table.dashboard) .mud-table-container { box-shadow: var(--table-shadow) !important; } .statistical-table:not(.statistical-table.dashboard) .mud-table-head .mud-table-cell { color: var(--table-header-text-color) !important; } */ /*@keyframes fallAndBounce1 { 0% { transform: translateX(-10px); transform: translateY(10px);*/ /* posición inicial */ /*} 25% { transform: translateX(-10px); transform: translateY(165px);*/ /* caída hasta el suelo */ /*} 40% { transform: translateX(-10px); transform: translateY(70px);*/ /* primer rebote */ /*} 55% { transform: translateX(-10px); transform: translateY(165px);*/ /* segundo rebote */ /*} 70% { transform: translateX(-10px); transform: translateY(85px);*/ /* tercer rebote */ /*} 100% { transform: translateX(-10px); transform: translateY(165px);*/ /* posición final */ /*} } @keyframes fallAndBounce2 { 0% { transform: translateX(10px); transform: translateY(10px);*/ /* posición inicial */ /*} 25% { transform: translateX(10px); transform: translateY(165px);*/ /* caída hasta el suelo */ /*} 40% { transform: translateX(10px); transform: translateY(70px);*/ /* primer rebote */ /*} 55% { transform: translateX(10px); transform: translateY(165px);*/ /* segundo rebote */ /*} 70% { transform: translateX(10px); transform: translateY(85px);*/ /* tercer rebote */ /*} 100% { transform: translateX(10px); transform: translateY(165px);*/ /* posición final */ /*} } @keyframes fallAndBounce3 { 0% { transform: translateX(30px); transform: translateY(10px);*/ /* posición inicial */ /*} 25% { transform: translateX(30px); transform: translateY(165px);*/ /* caída hasta el suelo */ /*} 40% { transform: translateX(30px); transform: translateY(70px);*/ /* primer rebote */ /*} 55% { transform: translateX(30px); transform: translateY(165px);*/ /* segundo rebote */ /*} 70% { transform: translateX(30px); transform: translateY(85px);*/ /* tercer rebote */ /*} 100% { transform: translateX(30px); transform: translateY(165px);*/ /* posición final */ /*} } @keyframes fallAndBounce4 { 0% { transform: translateX(-10); transform: translateY(10px);*/ /* posición inicial */ /*} 25% { transform: translateX(-10); transform: translateY(165px);*/ /* caída hasta el suelo */ /*} 40% { transform: translateX(-10); transform: translateY(70px);*/ /* primer rebote */ /*} 55% { transform: translateX(-10); transform: translateY(165px);*/ /* segundo rebote */ /*} 70% { transform: translateX(-10); transform: translateY(85px);*/ /* tercer rebote */ /*} 100% { transform: translateX(-10); transform: translateY(165px);*/ /* posición final */ /*} } @keyframes fallAndBounce5 { 0% { transform: translateX(-10); transform: translateY(10px);*/ /* posición inicial */ /*} 25% { transform: translateX(-10); transform: translateY(165px);*/ /* caída hasta el suelo */ /*} 40% { transform: translateX(-10); transform: translateY(70px);*/ /* primer rebote */ /*} 55% { transform: translateX(-10); transform: translateY(165px);*/ /* segundo rebote */ /*} 70% { transform: translateX(-10); transform: translateY(85px);*/ /* tercer rebote */ /*} 100% { transform: translateX(-10); transform: translateY(165px);*/ /* posición final */ /*} } @keyframes fallAndBounce6 { 0% { transform: translateX(-10); transform: translateY(10px);*/ /* posición inicial */ /*} 25% { transform: translateX(-10); transform: translateY(165px);*/ /* caída hasta el suelo */ /*} 40% { transform: translateX(-10); transform: translateY(70px);*/ /* primer rebote */ /*} 55% { transform: translateX(-10); transform: translateY(165px);*/ /* segundo rebote */ /*} 70% { transform: translateX(-10); transform: translateY(85px);*/ /* tercer rebote */ /*} 100% { transform: translateX(-10); transform: translateY(165px);*/ /* posición final */ /*} } @keyframes fallAndBounce7 { 0% { transform: translateX(-10); transform: translateY(10px);*/ /* posición inicial */ /*} 25% { transform: translateX(-10); transform: translateY(165px);*/ /* caída hasta el suelo */ /*} 40% { transform: translateX(-10); transform: translateY(70px);*/ /* primer rebote */ /*} 55% { transform: translateX(-10); transform: translateY(165px);*/ /* segundo rebote */ /*} 70% { transform: translateX(-10); transform: translateY(85px);*/ /* tercer rebote */ /*} 100% { transform: translateX(-10); transform: translateY(165px);*/ /* posición final */ /*} } @keyframes fallAndBounce8 { 0% { transform: translateX(-10); transform: translateY(10px);*/ /* posición inicial */ /*} 25% { transform: translateX(-10); transform: translateY(165px);*/ /* caída hasta el suelo */ /*} 40% { transform: translateX(-10); transform: translateY(70px);*/ /* primer rebote */ /*} 55% { transform: translateX(-10); transform: translateY(165px);*/ /* segundo rebote */ /*} 70% { transform: translateX(-10); transform: translateY(85px);*/ /* tercer rebote */ /*} 100% { transform: translateX(-10); transform: translateY(165px);*/ /* posición final */ /*} } @keyframes fallAndBounce9 { 0% { transform: translateX(-10); transform: translateY(10px);*/ /* posición inicial */ /*} 25% { transform: translateX(-10); transform: translateY(165px);*/ /* caída hasta el suelo */ /*} 40% { transform: translateX(-10); transform: translateY(70px);*/ /* primer rebote */ /*} 55% { transform: translateX(-10); transform: translateY(165px);*/ /* segundo rebote */ /*} 70% { transform: translateX(-10); transform: translateY(85px);*/ /* tercer rebote */ /*} 100% { transform: translateX(-10); transform: translateY(165px);*/ /* posición final */ /*} } @keyframes fallAndBounce10 { 0% { transform: translateX(-10); transform: translateY(10px);*/ /* posición inicial */ /*} 25% { transform: translateX(-10); transform: translateY(165px);*/ /* caída hasta el suelo */ /*} 40% { transform: translateX(-10); transform: translateY(70px);*/ /* primer rebote */ /*} 55% { transform: translateX(-10); transform: translateY(165px);*/ /* segundo rebote */ /*} 70% { transform: translateX(-10); transform: translateY(85px);*/ /* tercer rebote */ /*} 100% { transform: translateX(-10); transform: translateY(165px);*/ /* posición final */ /*} } @keyframes fallAndBounce11 { 0% { transform: translateX(-10); transform: translateY(10px);*/ /* posición inicial */ /*} 25% { transform: translateX(-10); transform: translateY(165px);*/ /* caída hasta el suelo */ /*} 40% { transform: translateX(-10); transform: translateY(70px);*/ /* primer rebote */ /*} 55% { transform: translateX(-10); transform: translateY(165px);*/ /* segundo rebote */ /*} 70% { transform: translateX(-10); transform: translateY(85px);*/ /* tercer rebote */ /*} 100% { transform: translateX(-10); transform: translateY(165px);*/ /* posición final */ /*} } @keyframes fallAndBounce12 { 0% { transform: translateX(-10); transform: translateY(10px);*/ /* posición inicial */ /*} 25% { transform: translateX(-10); transform: translateY(165px);*/ /* caída hasta el suelo */ /*} 40% { transform: translateX(-10); transform: translateY(70px);*/ /* primer rebote */ /*} 55% { transform: translateX(-10); transform: translateY(165px);*/ /* segundo rebote */ /*} 70% { transform: translateX(-10); transform: translateY(85px);*/ /* tercer rebote */ /*} 100% { transform: translateX(-10); transform: translateY(165px);*/ /* posición final */ /*} } @keyframes fallAndBounce13 { 0% { transform: translateX(-10); transform: translateY(10px);*/ /* posición inicial */ /*} 25% { transform: translateX(-10); transform: translateY(165px);*/ /* caída hasta el suelo */ /*} 40% { transform: translateX(-10); transform: translateY(70px);*/ /* primer rebote */ /*} 55% { transform: translateX(-10); transform: translateY(165px);*/ /* segundo rebote */ /*} 70% { transform: translateX(-10); transform: translateY(85px);*/ /* tercer rebote */ /*} 100% { transform: translateX(-10); transform: translateY(165px);*/ /* posición final */ /*} } @keyframes fallAndBounce14 { 0% { transform: translateX(-10); transform: translateY(10px);*/ /* posición inicial */ /*} 25% { transform: translateX(-10); transform: translateY(165px);*/ /* caída hasta el suelo */ /*} 40% { transform: translateX(-10); transform: translateY(70px);*/ /* primer rebote */ /*} 55% { transform: translateX(-10); transform: translateY(165px);*/ /* segundo rebote */ /*} 70% { transform: translateX(-10); transform: translateY(85px);*/ /* tercer rebote */ /*} 100% { transform: translateX(-10); transform: translateY(165px);*/ /* posición final */ /*} } .animated-group svg g > g:nth-child(1) { animation: fallAndBounce1 1.5s ease-out; } .animated-group svg g > g:nth-child(2) { animation: fallAndBounce2 1.5s ease-out; } .animated-group svg g > g:nth-child(3) { animation: fallAndBounce3 1.5s ease-out; } .animated-group svg g > g:nth-child(4) { animation: fallAndBounce4 1.5s ease-out; } .animated-group svg g > g:nth-child(5) { animation: fallAndBounce5 1.5s ease-out; } .animated-group svg g > g:nth-child(6) { animation: fallAndBounce6 1.5s ease-out; } .animated-group svg g > g:nth-child(7) { animation: fallAndBounce7 1.5s ease-out; } .animated-group svg g > g:nth-child(8) { animation: fallAndBounce8 1.5s ease-out; } .animated-group svg g > g:nth-child(9) { animation: fallAndBounce9 1.5s ease-out; } .animated-group svg g > g:nth-child(10) { animation: fallAndBounce10 1.5s ease-out; } .animated-group svg g > g:nth-child(11) { animation: fallAndBounce11 1.5s ease-out; } .animated-group svg g > g:nth-child(12) { animation: fallAndBounce12 1.5s ease-out; } .animated-group svg g > g:nth-child(13) { animation: fallAndBounce13 1.5s ease-out; } .animated-group svg g > g:nth-child(14) { animation: fallAndBounce14 1.5s ease-out; }*/ @keyframes confetti-slow { 0% { transform: translate3d(0, 0, 0) rotateX(0) rotateY(0); } 100% { transform: translate3d(25px, 105vh, 0) rotateX(360deg) rotateY(180deg); } } @keyframes confetti-medium { 0% { transform: translate3d(0, 0, 0) rotateX(0) rotateY(0); } 100% { transform: translate3d(100px, 105vh, 0) rotateX(100deg) rotateY(360deg); } } @keyframes confetti-fast { 0% { transform: translate3d(0, 0, 0) rotateX(0) rotateY(0); } 100% { transform: translate3d(-50px, 105vh, 0) rotateX(10deg) rotateY(250deg); } } .confetti-container { perspective: 700px; position: absolute; overflow: hidden; top: 0; right: 0; bottom: 0; left: 0; } .confetti { position: absolute; z-index: 1; top: -10px; border-radius: 0; } .confetti--animation-slow { animation: confetti-slow 18.25s linear 1 forwards; } .confetti--animation-medium { animation: confetti-medium 15.75s linear 1 forwards; } .confetti--animation-fast { animation: confetti-fast 10.25s linear 1 forwards; } /*Andrea-Para que los botones en card consulta no tengan sombra*/ .body.dark-theme .card__consulta button { box-shadow: none !important; } .texto_Opaco { opacity: .5; }