* { padding: 0; margin: 0; box-sizing: border-box; font-family: "Lato", sans-serif; color: #555; } body { background-color: #ecf0f3; position: relative; } body::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); border-radius: 5px; } body::-webkit-scrollbar { width: 15px; } body::-webkit-scrollbar-thumb { border-radius: 5px; -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.8); } .p-menubar { border-radius: 1px; background: #e4ebf2; border-bottom: 1px solid #fff; line-height: 60px; /*=====Modo glass=====*/ background: rgba(255, 255, 255, 0.2); border-radius: 16px; box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); border: 1px solid rgba(255, 255, 255, 0.3); } .p-menubar .p-menuitem-text { color: lightseagreen !important; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link:hover .p-menuitem-text { color: #2c3e50 !important; font-weight: 400 !important; } .p-menubar .p-menuitem-icon { color: #3a4446 !important; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link { border-radius: 15px; background: #e4ebf2; box-shadow: 6px 6px 12px #bbc1c6, -6px -6px 12px #ffffff !important; border-bottom: 1px solid #f2f2f2 !important; margin-right: 10px !important; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link:hover { background-color: #e4ebf2 !important; color: #fff !important; } .p-menubar .p-menuitem.p-menuitem-active > .p-menuitem-link { background: transparent !important; outline: none !important; } /*==========Submenu==============*/ .p-menubar .p-submenu-list { background-color: #ecf0f3 !important; border-radius: 0px 0px 5px 5px !important; box-shadow: 10px 10px 15px #cdd1d3, -10px -10px 15px #ffffff !important; } ul li ul { width: 100% !important; } .header-sijeinc ul li ul li:hover { background-color: #fff !important; border-bottom: 1px solid #889c9b; } .btn-cerrar { display: flex; justify-content: center; align-items: center; border-radius: 15px; box-shadow: 6px 6px 9px #a2a7ac, -6px -6px 9px #ffffff; border: none; border-radius: 15px; padding: 5px 5px !important; width: 100px; height: 40px !important; margin: 10px 10px; letter-spacing: 2px; transition: all 0.5s ease; background-image: linear-gradient(45deg, #fbda61 0%, #ff5acd 100%); color: #000; } .btn-cerrar:hover { background-image: linear-gradient(45deg, #fbda61 0%, #f541bf 100%); color: #000; } .btn-cerrar i { font-weight: 700; } .contendor-formulario { margin-top: 135px !important; width: 98% !important; border: none; outline: none !important; background: #ecf0f3; box-shadow: 10px 10px 10px #cbced1, -10px -10px 10px #ffffff; } /*=================================== TABLAS CONTROL ORDENES ====================================*/ .titulo-tabla { width: 98%; margin: auto; display: block; margin-top: -30px !important; border-radius: 26px !important; background: #ecf0f3; box-shadow: 6px 6px 4px #d2d6d8, -6px -6px 4px #ffffff; } .tabla-titulo-2 { display: flex; flex-direction: column; margin-left: 20px; } .tabla-titulo-2 p { color: #7a7067; } .p-1 { font-size: 20px; } .p-2 { margin-top: -20px !important; font-size: 13px; } .p-datatable { background: linear-gradient(#f3f4f5, #f3f4f5, #e8e9eb) !important; border-radius: 5px !important; } .p-datatable th { color: #3a4446 !important; font-weight: 400 !important; font-size: 15px !important; background: #d9d9d9 !important; text-align: center !important; } .p-datatable td { text-align: center !important; } .p-datatable-thead { box-shadow: 5px 5px 10px #b4b4b4, -5px -5px 10px #fefefe !important; } .p-datatable tr { color: #555 !important; font-size: 11px !important; border: none !important; } /* .p-datatable tr > td { border: none !important; }*/ /* .p-datatable tr:nth-child(even) { background: #f2f2f2 !important; }*/ .p-datatable tr:nth-child(even) { background-color: transparent !important; } .p-datatable tr:nth-child(odd) { background-color: transparent !important; } .p-datatable tr:nth-child(even):hover { background-color: #d9d9d9 !important; color: #c3975b !important; } .p-datatable tr:nth-child(odd):hover { background-color: #d9d9d9 !important; color: #c3975b !important; } /*==================================== BOTONES ======================================*/ .btn-crear-silae-1 { width: 40px !important; background: #fff; border-radius: 6px !important; -webkit-box-shadow: 2px 2px 5px 0px rgba(89, 108, 127, 1); -moz-box-shadow: 2px 2px 5px 0px rgba(89, 108, 127, 1); box-shadow: 2px 2px 5px 0px rgba(89, 108, 127, 1); display: flex !important; align-items: center !important; padding: 0 !important; font-size: 13px !important; transition: all 1s !important; margin-right: 15px !important; } .btn-crear-silae-1 span { display: none !important; transition: all 1s !important; } .btn-crear-silae-1:hover span { display: block !important; color: #333 !important; } .btn-crear-silae-1:hover { width: 100px !important; transition: all 1s !important; background-color: #b5ac86 !important; } .btn-crear-silae-1 i { background-color: #b5ac86 !important; color: #333 !important; padding: 10px !important; border-radius: 10% !important; left: 0 !important; margin-right: 5px !important; font-size: 18px !important; } /*============================================*/ .campo-btn-table { display: flex; } .btn-table { border: none; outline: none; /* width: 120px; */ border-radius: 10px; background: linear-gradient(145deg, #d4d8db, #fdffff); box-shadow: 6px 6px 9px #cbced1, -6px -6px 9px #ffffff; border-bottom: 1px solid transparent !important; margin-right: 20px; transition: all 1s ease; display: flex; align-items: center; } .btn-table span i { margin-right: 10px; } .btn-table-2 { border: none; outline: none; width: 120px; border-radius: 10px; /* background: linear-gradient(145deg, #d4d8db, #fdffff); */ background-color: #b5ac86; box-shadow: 6px 6px 9px #cbced1, -6px -6px 9px #ffffff; border-bottom: 1px solid transparent !important; margin-right: 20px; transition: all 1s ease; } .btn-table:hover { background: #e66824; } .btn-table:hover span { color: #fff; } .btn-table-1 { color: #3b8c6e; color: #000; letter-spacing: 1.5px; font-weight: 400; } .btn-table:hover .btn-table-1 { color: #fff !important; letter-spacing: 1.5px; font-weight: 700; transition: 0.3s; } .btn-table-11 i { background-color: #035aa6 !important; } .btn-table-eliminar { background: linear-gradient(90deg, #e4ebf2, #e4ebf2, #b4bbbf); border: none; outline: none; width: 120px; border-radius: 10px; box-shadow: 6px 6px 12px #bbc1c6, -6px -6px 12px #ffffff; border-bottom: 1px solid transparent !important; margin-right: 20px; } .btn-table-eliminar .btn-eliminar-1 { color: brown; letter-spacing: 1.5px; transition: 0.3s; } .btn-table-eliminar:hover { background: linear-gradient(90deg, #cd6155, #cd6155, #cd6155, #ec7063); } .btn-table-eliminar:hover .btn-eliminar-1 { color: #fff; } .btn-eliminar-1 i { margin-right: 10px; } /*============================================================*/ .p-button { height: 40px !important; border: none !important; display: flex !important; justify-content: start !important; } .p-button i { left: -10px !important; background-color: #c3975b !important; } /* .sidebar[data-active-color="primary"] .nav li.active > a, .off-canvas-sidebar[data-active-color="primary"] .nav li.active > a { color: #ce494b; opacity: 1; card box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }*/ .btn-volver { position: fixed; bottom: 60px; right: 20px; z-index: 1000 !important; } .btn-volver .p-button { width: 120px; background: #ecf0f3; -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.45); -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.45); box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.45); border-radius: 15px; border-bottom: 1px solid lightseagreen !important; border-right: 1px solid lightseagreen !important; } .btn-volver .p-button:hover { background: #ecf0f3 !important; } .btn-volver .p-button span { color: lightseagreen !important; font-weight: 400 !important; letter-spacing: 1.5px; display: flex !important; } .btn-volver .p-button span i { background: transparent !important; margin-right: 10px; } .btn-volver .p-button :hover i { color: lightseagreen !important; font-weight: 600; } .p-datatable .p-paginator-bottom { background: #f2f2f2 !important; border-bottom: 1px solid #d2dedd !important; } /*==============Tag Crear Incidnte=============*/ .tag-incidente .p-tag.p-tag-info { width: 50px !important; height: 35px !important; border-radius: 5px !important; border-bottom: 1px solid silver !important; border-right: 1px solid silver !important; background: linear-gradient(90deg, #035aa6, #035aa6, #049dd9) !important; } .tag-incidente .p-tag.p-tag-warning { width: 50px !important; height: 35px !important; border-radius: 5px !important; border-bottom: 1px solid silver !important; border-right: 1px solid silver !important; background: linear-gradient(90deg, #f2b705, #f2b705, #f2cb05) !important; } .tag-incidente .p-tag.p-tag-success { width: 50px !important; height: 35px !important; border-radius: 5px !important; border-bottom: 1px solid silver !important; border-right: 1px solid silver !important; background: linear-gradient(90deg, #03a64a, #03a64a, #04bf8a) !important; } .tag-incidente .p-tag.p-tag-danger { width: 50px !important; height: 35px !important; border-radius: 5px !important; border-bottom: 1px solid silver !important; border-right: 1px solid silver !important; background: linear-gradient(90deg, #d91a1a, #d91a1a, #c15143) !important; } .tag-incidente .p-tag-value { color: #fff !important; font-size: 13px; } .p-dropdown { width: 100% !important; border: none !important; outline: none !important; background: none !important; font-size: 13px !important; line-height: 2px !important; padding: 1px !important; color: #6c757d !important; /* margin: 0px 10px !important; */ } .p-dropdown-panel { background-color: #ecf0f3 !important; box-shadow: 6px 6px 4px #c9cccf, -6px -6px 4px #ffffff !important; } .p-multiselect-items-wrapper { background-color: #ecf0f3 !important; box-shadow: 6px 6px 4px #c9cccf, -6px -6px 4px #ffffff !important; } .f-select .p-multiselect-token-label { color: #6c757d !important; font-size: 13px !important; background-color: transparent !important; } .f-select .p-multiselect-item { font-size: 12px !important; } .p-dropdown-items { font-size: 12px !important; } .p-calendar { width: 100% !important; border: none !important; outline: none !important; background: none !important; font-size: 13px !important; line-height: 2px !important; padding: 1px !important; color: #6c757d !important; } .p-multiselect { width: 100% !important; border: none !important; outline: none !important; background: none !important; font-size: 13px !important; line-height: 2px !important; padding: 1px !important; color: #6c757d !important; } .form-control { width: 100% !important; border: none !important; outline: none !important; background: none !important; font-size: 13px !important; padding: 1px !important; color: #6c757d !important; } .p-inputtext { width: 100% !important; border: none !important; outline: none !important; background: none !important; margin: 0px 10px !important; color: #6c757d !important; font-size: 13px !important; } .inpt-texto { color: #6c757d !important; font-size: 13px !important; padding-left: 10px !important; } .p-listbox { border: none !important; outline: none !important; font-size: 13px !important; margin: 0px 10px !important; background: transparent !important; color: #6c757d !important; width: 97% !important; margin: auto !important; border-radius: 15px; box-shadow: inset 3px 3px 4px #d2d6d8, inset -3px -3px 4px #ffffff !important; padding-left: 10px !important; min-height: 100px !important; max-height: 100px !important; /* overflow-y: scroll !important; */ } .p-fieldset-legend-text { text-decoration: none !important; } /*==============P-Acordion================*/ .p-accordion-header-text { color: #595147 !important; } .p-accordion-header-link { border-radius: 11px !important; border: none !important; background: linear-gradient(145deg, #f2f2f2, #f2f2f2) !important; box-shadow: 6px 6px 4px #c9cccf, -6px -6px 4px #ffffff !important; margin-bottom: 10px !important; } .p-accordion-content { border: none !important; outline: none !important; font-size: 13px !important; margin: 0px 10px !important; background: transparent !important; } .p-accordion-content textarea { border: none !important; outline: none !important; font-size: 13px !important; margin: 0px 10px !important; background: transparent !important; color: #6c757d !important; width: 100% !important; min-height: 80px !important; max-height: 80px !important; margin: auto !important; border-radius: 15px; box-shadow: inset 3px 3px 4px #d2d6d8, inset -3px -3px 4px #ffffff !important; padding: 5px 10px 5px 10px !important; text-transform: uppercase !important; } /*==============fin================*/ .btn-notificacion .p-button { border: none !important; outline: none !important; border-radius: 10px !important; background: linear-gradient(145deg, #d4d8db, #fdffff) !important; box-shadow: 6px 6px 9px #cbced1, -6px -6px 9px #ffffff !important; border-bottom: 1px solid transparent !important; transition: all 1s ease !important; } .btn-notificacion .p-button:hover { background: #e66824 !important; } .btn-notificacion .p-button:hover span { color: #fff !important; } /* ===estilo botones de primeng=== */ .p-button { border: none !important; outline: none !important; border-radius: 10px !important; box-shadow: 2px 2px 4px #cbced1, -2px -2px 4px #ffffff !important; border: 1px solid #cce3de !important; transition: all 1s ease !important; display: flex !important; align-items: center !important; justify-content: center !important; margin-bottom: 10px !important; } .p-fieldset-content { background: #ecf0f3 !important; } .p-fieldset { border: none !important; background: transparent !important; background: #ecf0f3 !important; box-shadow: 3px 3px 4px #d2d6d8, -3px -3px 4px #ffffff !important; padding-top: 10px !important; } .p-fieldset-legend { border-radius: 11px !important; border: none !important; background: #ecf0f3 !important; box-shadow: inset 10px 10px 20px #cbced1, inset -10px -10px 20px #ffffff !important; } .p-fieldset-legend a { text-decoration: none !important; } .p-fieldset-legend-text { color: #7a7067 !important; font-size: 15px !important; } .contenedor-primario { border: none !important; background: #ecf0f3 !important; box-shadow: 3px 3px 4px #d2d6d8, -3px -3px 4px #ffffff !important; padding-top: 10px !important; border-radius: 5px !important; } /*===para el boton de los calendarios===*/ .btn-calendar .p-button { top: 5px !important; right: 3px !important; border: none !important; outline: none !important; background: linear-gradient(145deg, #bfb8b0, #fdffff); box-shadow: 7px 7px 9px #b6b9bb, -7px -7px 9px #ffffff; } .btn-calendar .p-button:hover { background: linear-gradient(145deg, #bfb8b0, #bfb8b0, #736a62); } /*==========Fin===========*/ .pl-10 { padding-left: 10px !important; } .mrg-b-50 { margin-bottom: 50px !important; } .mrg-b-100 { margin-bottom: 100px !important; } .p-dialog-header { background: #ecf0f3 !important; } .p-dialog .p-dialog-content { background: #ecf0f3 !important; } .p-dialog-footer { background: #ecf0f3 !important; display: flex !important; justify-content: center !important; } .btn-m { margin-right: 5px !important; } .dialogo-notificar .p-dialog { height: calc(100vh - 200px); } /*====Boton Cerrar Formulario====*/ .btn-cancelar-dialogo { position: absolute; top: 0; right: 0; border-radius: 0 10px 0 0; font-size: 18px; color: #535b5d; padding: 0 6px; background: linear-gradient(145deg, #fdffff, #d4d8db); -webkit-box-shadow: -1px 2px 5px -1px rgba(0, 0, 0, 0.75); -moz-box-shadow: -1px 2px 5px -1px rgba(0, 0, 0, 0.75); box-shadow: -1px 2px 5px -1px rgba(0, 0, 0, 0.75); } .btn-cancelar-dialogo:hover { background-color: #e1523d; color: brown; } .div-vacio { width: 100%; height: 100px; } .seccion-user-btncerrar { display: flex; } .seccion-user-btncerrar .seccion-user { font-size: 13px; margin-right: 10px; } /*=========Fin=========*/ .p-picklist .p-picklist-header { color: #595147 !important; background: linear-gradient(145deg, #bfb8b0, #fdffff) !important; box-shadow: 7px 7px 9px #b6b9bb, -7px -7px 9px #ffffff !important; text-align: center !important; } .p-picklist-list { width: 260px; height: 260px !important; font-size: 12px !important; color: #535b5d !important; border: none !important; background: #ecf0f3 !important; box-shadow: inset 3px 3px 4px #d2d6d8, inset -3px -3px 4px #ffffff !important; border-radius: 0 0 10px 10px !important; } .p-picklist .p-picklist-buttons .p-button { background: linear-gradient(145deg, #bfb8b0, #fdffff) !important; box-shadow: 7px 7px 9px #b6b9bb, -7px -7px 9px #ffffff !important; border-bottom: 1px solid #f2f2f2 !important; font-weight: bold !important; } .btn-editar-tabla { background: linear-gradient(145deg, #bfb8b0, #fdffff) !important; box-shadow: 7px 7px 9px #b6b9bb, -7px -7px 9px #ffffff !important; border-bottom: 1px solid #f2f2f2 !important; font-weight: bold !important; } .btn-table-1 i { margin-right: 10px; } .contenedor-user-logueado { position: fixed; top: 79px; right: 3px; background-color: #f2f2f2; line-height: 33px; border-radius: 0 0 5px 5px; -webkit-box-shadow: 0px 1px 5px -1px rgba(0, 0, 0, 0.35); -moz-box-shadow: 0px 1px 5px -1px rgba(0, 0, 0, 0.35); box-shadow: 0px 1px 5px -1px rgba(0, 0, 0, 0.35); display: flex; justify-content: center; align-items: center; /*=====Modo glass=====*/ /* box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); */ backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); border: 1px solid rgba(255, 255, 255, 0.3); } .contenedor-user-logueado span { font-size: 13px; margin: auto 20px; } .contenedor-user-logueado span i { margin-right: 5px; } .p-dataview.p-dataview-list .p-dataview-content > .p-grid > div { float: left !important; } /*===Estilo para los filtros de la tabla evidencia forense*/ .filtro-columna input { background: #d9d9d9 !important; border-radius: 10px !important; box-shadow: inset 3px 3px 4px #aeaeae, inset -3px -3px 4px #ffffff !important; padding: 10px; } /*======================*/ .elemento-centrado-horizontal { margin: auto !important; } .p-galleria-thumbnail-item { overflow: hidden !important; } /*============================================= PANTALLA DE ESCRITORIO GRANDE - LARGE (lg) tabla-forsense =============================================*/ @media (min-width: 1200px) { .contenedor-estadistica { width: 50%; margin: auto; padding: 20px; } } /*============================================= PANTALLA DE ESCRITORIO MEDIANO - MEDIUM (md) =============================================*/ @media (max-width: 1200px) and (min-width: 992px) { .contenedor-estadistica { width: 70%; margin: auto; padding: 10px; } } /*============================================= PANTALLA DE TABLET - SMALL (sm) =============================================*/ @media (max-width: 991px) and (min-width: 768px) { .campo-btn-table { display: flex; flex-direction: column; } .btn-table { margin-bottom: 10px; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link { border-radius: 5px; background: #e4ebf2; box-shadow: 6px 6px 12px #bbc1c6, -6px -6px 12px #ffffff !important; border-bottom: 1px solid #f2f2f2 !important; margin-bottom: 8px !important; } .contenedor-estadistica { width: 100%; margin: auto; padding: 10px; } } /*============================================= PANTALLA DE PHONES - EXTRA SMALL (xs) =============================================*/ @media (max-width: 767px) { .campo-btn-table { display: flex; flex-direction: column; } .campo-btn-table .btn-table, .btn-table-eliminar { width: 100% !important; } .btn-table { margin-bottom: 10px; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link { border-radius: 5px; background: #e4ebf2; box-shadow: 6px 6px 12px #bbc1c6, -6px -6px 12px #ffffff !important; border-bottom: 1px solid #f2f2f2 !important; margin-bottom: 5px !important; } .p-datatable th { display: flex !important; flex-direction: column !important; } .p-datatable tr { display: flex !important; flex-direction: column !important; } .seccion-user-btncerrar .seccion-user { display: none; } .contenedor-estadistica { width: 100%; margin: auto; padding: 5px; } }