/* @import './variables.css';
@import './red_social/general.css';
@import './red_social/logo_profile.css';
@import './red_social/profile.css';
@import './red_social/post.css';
@import './red_social/comment.css';
@import './red_social/modal_post.css';
@import './reservas.css';
@import './red_social/buttoms.css'; */
@import url('./variables.css?v=1');
@import url('./red_social/general.css?v=1.3.24');
@import url('./red_social/logo_profile.css?v=1');
@import url('./red_social/profile.css?v=1.1.3');
@import url('./red_social/post.css?v=1.1');
@import url('./red_social/comment.css?v=1');
@import url('./red_social/modal_post.css?v=1');
@import url('./reservas.css?v=1');
@import url('./red_social/buttoms.css?v=1');

.btn-cian {
    background-color: var(--cian);
    color: var(--color-blanco);
}

a {
    color: var(--color-azul);
}

.text-azul-claro {
    color: var(--color-azul-claro);
}

.bg-azul-claro {
    background-color: var(--color-azul-claro);
}

.text-blanco {
    color: var(--color-blanco);
}

.bg-blanco {
    background-color: var(--color-blanco);
}

.text-metal {
    color: var(--metal) !important;
}

.bg-metal {
    background-color: var(--metal);
}

.bg-gris-claro {
    background-color: var(--gris-claro);
}

.text-azul-acopi {
    color: var(--azul-acopi) !important;
}

.bg-azul-acopi {
    background-color: var(--azul-acopi) !important;
}

.bg-verde-limoncito {
    background-color: var(--verde-limoncito) !important;
}


.btn.bg-metal.text-azul-acopi:hover {
    background-color: var(--metal);
    color: var(--azul-acopi);
}

.os-theme-light>.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle,
.os-theme-light>.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle:hover {
    /* background: var(--guayaba); */
    background: linear-gradient(180deg, var(--azul-acopi) 0%, var(--metal) 100%);
}


.identificador {
    margin-right: 0px;
    /* padding: 1rem; */
    background-color: var(--azul-acopi);
    border: solid 1px var(--guayaba);
    color: var(--metal);
    margin-right: 0px;
    padding: 1rem 1.25rem;
    /* background-color: white; */
    border-top: solid 1px;
    border-bottom: solid 1px;
    border-right: solid 1px;
}

.required::after,
.requerido::after {
    content: ' (*)';
    color: red
}


.small-letter {
    font-size: x-small
}

/* Textos y fondos con papeleta de colores */

.text-amarillo {
    color: var(--amarillo);
}

.bg-amarillo {
    background-color: var(--amarillo);
}

.text-azul {
    color: var(--color-azul);
}

.text-cian {
    color: var(--cian);
}

.bg-azul {
    background-color: var(--color-azul);
}

.text-verde {
    color: var(--montana);
}

.bg-verde {
    background-color: var(--montana);
}

.text-morado {
    color: var(--color-morado);
}

.bg-morado {
    background-color: var(--color-morado);
}

.text-guayaba {
    color: var(--guayaba);
}

.bg-guayaba {
    background-color: var(--guayaba);
}

.text-montana {
    color: var(--montana);
}

.bg-montana {
    background-color: var(--montana);
}

.text-mantequilla {
    color: var(--mantequilla) !important;
}

.bg-mantequilla {
    background-color: var(--mantequilla);
}

.text-verde-claro {
    color: var(--verde-claro);
}

.bg-verde-claro {
    background-color: var(--verde-claro);
}

.bg-verde-whatsapp {
    background-color: #00a884;
}

.bg-azul-whatsapp {
    background-color: #62c1eb;
}

.bg-amarillo-whatsapp {
    background-color: #ffcf79;
}

.btn-azul-whatsapp {
    background-color: #62c1eb;
}

.text-cielo {
    color: var(--cielo);
}

.bg-cielo {
    background-color: var(--cielo);
}

.text-guayacan {
    color: var(--guayacan);
}

.bg-guayacan {
    background-color: var(--guayacan);
}



/* ----------------------------------------------------------------------------------------- */
.corte-derecha {
    clip-path: polygon(0% 0%, 100% 23%, 100% 83%, 0% 100%);
}

.corte-izquierda {
    clip-path: polygon(0% 23%, 100% 0%, 100% 100%, 0% 83%);
}

.pointer {
    cursor: pointer;
}

.d-grid {
    display: grid;
}

.borde-encabezado {
    width: 5px;
    height: 51px;
    background-color: var(--montana);
}

/* input file */
input.form-control[type=file] {
    padding: 3px 15px;
}

/* OGNANIZAR */
.btn-eje {
    transition: all 1s ease 0.1s;
}

.btn-eje:hover,
.btn-eje:active,
.btn-eje:focus {
    transform: scale(1);
    -webkit-box-shadow: 3px 4px 24px -1px rgba(0, 0, 0, 0.31);
    -moz-box-shadow: 3px 4px 24px -1px rgba(0, 0, 0, 0.31);
    box-shadow: 3px 4px 24px -1px rgba(0, 0, 0, 0.31);
    /* padding: 5px; */
    border-radius: 10px;
}

/* ---------------------------------------- */

* {
    box-sizing: border-box;
}


.nav-tabs {
    border-bottom: 1px solid var(--metal);
    border-radius: 18px;
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    color: #495057;
    background-color: #bfbaba81;
    border-color: var(--metal) var(--metal) var(--metal);
    border-radius: 10px;
}


.rounded-pill-left {
    border-radius: 30px 0px 0px 30px;
}

.rounded-pill-right {
    border-radius: 0px 30px 30px 0px;
}

.card-personalizada {
    background-color: rgba(255, 255, 255, 0.6);
    border-radius: 15px
}

.boton-esquina-derecha {
    right: -10px;
    top: -10px;
    background: #c8d7e5;
    border: none;
    padding: 5px;
    border-radius: 5px;
    z-index: 2;
    position: absolute;
}

/* Clases para cascada de estados */
.revision {
    background-color: #17a2b8;
}

.aprobado {
    background-color: var(--montana);
}

.pendiente {
    background-color: var(--color-morado);
}

.rechazado,
.correccion {
    background-color: #dc3545;
}

.revision,
.aprobado,
.rechazado,
.correccion {
    color: white;
}


/* ------------------------------------------------------ */

/* Estilos para nav-tabs */

.nav-tabs a {
    color: var(--guayaba);
}

/* -------------------------------------------------------- */

/* ESTILOS PARA EL HOME */

.cajon-info {
    background-color: rgb(247 250 255);
    padding: 15px;
    border-radius: 15px;
    margin-bottom: 10px;
    height: 250px;
}

.content-principal {
    background-color: #662681
}

.logo-mipyme {
    max-height: 110px;
}

.img-carpeta,
.img-buscar {
    max-height: 100px
}

/* ----------------------------------------------------------------------------------- */

/* Clases de estados actividad */

.actividad-pendiente {
    background-color: #e0a800;
    border-color: #d39e00;
}

.actividad-revision {
    background-color: #138496;
    border-color: #117a8b;
}

.actividad-correccion {
    background-color: #5a6268;
    border-color: #545b62;
}

.actividad-finalizado {
    background-color: #218838;
    border-color: #1e7e34;
}

.actividad-atrasada {
    background-color: #c82333;
    border-color: #bd2130;
}

.actividad-cancelada {
    background-color: var(--color-morado);
}

/* Estados Proyecto */


.proyecto-ejecucion {
    background: rgb(42, 49, 128);
    background: linear-gradient(90deg, rgba(42, 49, 128, 1) 0%, rgba(0, 150, 64, 1) 35%, rgba(102, 38, 129, 1) 100%);
}


/* Clase para texto input file bootstrap */
.custom-file-label::after {
    content: "Buscar" !important;
}

/* Clase para requeridos por Jhordy */
.requerido::after {
    content: " (*)";
    color: red;
}

/* Fin requerido */
td,
th {
    vertical-align: middle !important;
}

.modal-content {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 3px solid var(--montana);
    border-radius: 20px;
    box-shadow: 0 .25rem .5rem rgba(0, 0, 0, .5);
    /* outline: 0; */
    overflow: hidden;
}

.modal-header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem;
    border-bottom: 1px solid var(--montana);
    border-top-left-radius: calc(0.3rem - 1px);
    border-top-right-radius: calc(0.3rem - 1px);
}

.modal-footer {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding: 0.75rem;
    border-top: 1px solid var(--montana);
    border-bottom-right-radius: calc(0.3rem - 1px);
    border-bottom-left-radius: calc(0.3rem - 1px);
}

.borde {
    border: 1px solid #dee2e6;
}

.borde-table-start {
    border-radius: 5px 0px 0px 0px;
}

.borde-table-end {
    border-radius: 0px 5px 0px 0px;
}

.g-recaptcha {
    display: flex;
    justify-content: center;
}

/* body {
background-color: #f4f6f9;
} */

.content-wrapper {
    background-color: transparent;
}

.vaya-fondo {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    object-fit: cover;
    /* opacity: 0.5; */
}

.card-personalizada {
    background-color: rgba(255, 255, 255, 0.6) !important;
    border-radius: 15px !important;
}

.centro {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.text-center {
    text-align: center;
}

.text-lowercase {
    text-transform: lowercase;
}

.text-capitalize {
    text-transform: capitalize;
}

.zoom-iconos {
    transition: all 1s ease 0.1s;
}

.zoom-iconos:hover {
    transform: scale(1.1);
    -webkit-box-shadow: 3px 4px 24px -1px rgba(0, 0, 0, 0.31);
    -moz-box-shadow: 3px 4px 24px -1px rgba(0, 0, 0, 0.31);
    box-shadow: 3px 4px 24px -1px rgba(0, 0, 0, 0.31);
    /* padding: 5px; */
    border-radius: 10px;
}

.zoom-button {
    transition: all 0.5s ease 0.1s;
}

.zoom-button:hover {
    transform: scale(1.0);
    -webkit-box-shadow: 3px 4px 24px -1px rgba(0, 0, 0, 0.31);
    -moz-box-shadow: 3px 4px 24px -1px rgba(0, 0, 0, 0.31);
    box-shadow: 3px 4px 24px -1px rgba(0, 0, 0, 0.31);
    /* padding: 5px; */
    border-radius: 10px;
}


.titulo-header {
    border-bottom: solid 2px var(--azul-acopi);
    background-color: #9e89891a;
    border-radius: 10px;
}


[type=checkbox] {
    width: 1.8em;
    height: 1.8em !important;
}

[type=checkbox]:disabled {
    background-color: #999;
}

:checked[type=checkbox] {
    background-color: var(--azul-acopi);
}



.form-check-input[type=radio] {
    width: 1.8em;
    height: 1.8em !important;
}

.form-check-input:checked[type=radio] {
    background-color: var(--azul-acopi);
    background-image: none;
}

.bg-personalizado {
    background: linear-gradient(133deg, rgba(0, 105, 150, 0.7511379551820728) 0%, rgba(124, 184, 40, 0.7455357142857143) 100%);
}



.nav-pills .nav-link:not(.active):hover {
    color: var(--azul-acopi);
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    color: #fff;
    background-color: var(--azul-acopi);
}

/* ----------------------------------------------------------------------------------------------------- */


/* BOTONES */

.btn-outline-primary {
    color: var(--azul-acopi);
    border-color: var(--azul-acopi);
}

.btn-outline-primary:hover,
.btn-outline-primary:active {
    color: #fff !important;
    background-color: var(--azul-acopi);
    border-color: var(--metal);
}

.btn-outline-primary:not(:disabled):not(.disabled).active,
.btn-outline-primary:not(:disabled):not(.disabled):active,
.show>.btn-outline-primary.dropdown-toggle {
    color: #fff;
    background-color: var(--azul-acopi);
    border-color: var(--metal);
}

.btn-disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* --------------------------------------------------------------------------------------------------------- */


/* ventana modales */

.shadow-modal {
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, 0.40) !important;
}


/* ------------------------------------------------------------------------------------------ */



.ms-container {
    background: transparent url(../img/switch.png) no-repeat 50% 50%;
    width: 100% !important;
}


/* TABLAS */

.border-tabla-start {
    border-radius: 20px 0px 0px 0px;
}

.border-tabla-end {
    border-radius: 0px 20px 0px 0px;
}


/* ----------------------------------------------------- */


/* PAGINACIÓN */

.page-link {
    position: relative;
    display: block;
    padding: 0.5rem 0.75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: var(--azul-acopi);
    background-color: #fff;
    border: 1px solid #dee2e6;
}

.page-item.active .page-link {
    z-index: 3;
    color: #fff;
    background-color: var(--azul-acopi);
    border-color: var(--azul-acopi);
}

/*
-------------------------------------------------------------------------------------------------------------------------
*/

/* Estilo label checkbox */

.form-check-label {
    margin-left: 1.5em;
}

/*
------------------------------------------------------------------------------------------------------------------------
*/
/* Ícono ver contraseña */
/* .input-group-prepend input {
padding: 9px 42px 9px 12px;
}

.eye {
position: relative;
right: 35px;
} */

/*
-----------------------------------------------------------------------------------------------------------------------
*/
/* Botón WhatsApp */
.float {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 20px;
    right: 20px;
    background-color: var(--color-blanco);
    color: rgb(24, 85, 16);
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 3px #999;
    z-index: 100;
    box-shadow: 0px 0px 3px 4px rgba(40, 184, 40, 0.5);
    border: 1px solid rgb(110, 110, 110);
    transition: all 1s ease 0.1s;
}

.float:hover {
    text-decoration: none;
    color: var(--color-blanco);
    background-color: #25D366;
}

.my-float {
    margin-top: 14px;
}

/* -------------------------------------------------------------------------------- */


/*BOTON WPP*/

/* .float {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 45px;
    right: 20px;
    background-color: var(--guayaba);
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 3px #999;
    z-index: 100;
    box-shadow: 0px 0px 25px 10px rgb(253 108 105 / 70%);
}

.float:hover {
    text-decoration: none;
    color: var(--montana);
    background-color: #fff;
}

.my-float {
    margin-top: 14px;
} */

/* --------------------------------------------- */


/* Miga de pan en proyectos y demas vistas referentes a el */
.breadcrumb {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    margin-top: 1rem;
    list-style: none;
    background-color: #e9ecef;
    border-radius: 0.25rem;
}

/* ------------------------------------------------------------------------------------------- */
.collapse {
    visibility: initial;
}

/* -------------------------------------------------------------------------------------------- */
/* Maquetación Objetivos */

.menu-objetivo {
    transition: all 1s ease 0.1s;
}

.menu-objetivo:hover,
.menu-objetivo.active {
    transform: scale(1.1);
    webkit-box-shadow: 3px 4px 24px -1px rgba(0, 0, 0, 0.31);
    -moz-box-shadow: 3px 4px 24px -1px rgba(0, 0, 0, 0.31);
    box-shadow: 3px 4px 24px -1px rgba(0, 0, 0, 0.31);
    border-radius: 10px
}




/* ------------------------------------------------------------------------------------------- */
/* Maquetación TRL */

/* .fixedTRL {
position: fixed;
bottom: 60px;
left: 600px;
width: 900px;
height: 50px;
border: 1px solid #73AD21;
} */





/* Estilos para motores Webkit y blink (Chrome, Safari, Opera... )*/

::-webkit-scrollbar {
    -webkit-appearance: none;
}

::-webkit-scrollbar:vertical {
    width: 15px;
}

::-webkit-scrollbar-button:increment {
    display: none;
}

::-webkit-scrollbar:horizontal {
    height: 10px;
}

::-webkit-scrollbar-thumb {
    /* background-color: #662681; */
    /*  background: rgb(0, 43, 233); */
    background: linear-gradient(180deg, var(--azul-acopi) 0%, var(--metal) 100%);
    border-radius: 20px;
    border: 2px solid #f1f2f3;
}

::-webkit-scrollbar-track {
    border-radius: 10px;
}

/* ------------------------------------------------------------------------------------------------------------- */

/* .layout-fixed .wrapper .sidebar {
    height: calc(70vh - (3.5rem + 1px));
} */



.popover .popover-close {
    cursor: pointer;
}



label.drag-and-drop {
    border: 5px solid blue;
    width: 200px;
    height: 100px;
}



/* soluciones empresariales */

.section-solucion {
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    background-position: center;
    /* min-height: 400px; */
    display: flex;
    align-items: center;
    padding: 2%;
}

/* --------------------------------------------------------------------------------------- */

/* Cards módulos */
.card-animate {
    width: 300px;
    padding: 5px;
    margin: 0 auto;
    transition: box-shadow 0.3s ease;
}

.card-animate:hover {
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
}

/* ------------------------------------------------------------------------------------- */

/* Estilo para el campo de selección de archivo */
.drag-and-drop-area {
    border: 2px dashed #ccc;
    border-radius: 19px;
    padding: 20px;
    text-align: center;
    position: relative;
    cursor: pointer;
}

.drag-and-drop-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: #999;
}

.drag-and-drop-placeholder i {
    font-size: 48px;
}

.visually-hidden {
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
}

.text-legal {
    font-weight: bold;
    color: #ffffff;
    /* color: #f5bd01;
    -webkit-text-stroke: 1px #2e3051;
    text-shadow: 0px 4px 4px #282828; */
    text-shadow: 0px 4px 4px #000000;
}

.text-conta {
    font-weight: bold;
    color: #ffffff;
    text-shadow: 0px 4px 4px #000000;
}

.text-scan {
    font-weight: bold;
    color: #ffffff;
    text-shadow: 0px 4px 4px #000000;
}

.text-work {
    font-weight: bold;
    color: #ffffff;
    /* color: #184c3e;
    -webkit-text-stroke: 1px #00ff2e;
    text-shadow: 0px 4px 4px #ffffff; */
    text-shadow: 0px 4px 4px #000000;

}

.text-room {
    font-weight: bold;
    color: #ffffff;
    /* color: #3a2f57;
    -webkit-text-stroke: 1px #ff008b;
    text-shadow: 0px 4px 4px #ffffff; */
    text-shadow: 0px 4px 4px #000000;
}

.text-edu {
    font-weight: bold;
    color: #ffffff;
    /* -webkit-text-stroke: 1px #3a2f57;
    text-shadow: 0px 4px 4px #b300ff; */
    text-shadow: 0px 4px 4px #000000;

}

.text-data {
    font-weight: bold;
    color: #ffffff;
    /* -webkit-text-stroke: 1px #3a2f57;
    text-shadow: 0px 4px 4px #1b5b1f; */
    text-shadow: 0px 4px 4px #000000;

}

.text-web {
    font-weight: bold;
    color: #ffffff;
    /* -webkit-text-stroke: 1px #3a2f57;
    text-shadow: 0px 4px 4px #0000ff; */
    text-shadow: 0px 4px 4px #000000;

}

.text-marketing {
    font-weight: bold;
    color: #ffffff;
    /* -webkit-text-stroke: 1px #3a2f57;
    text-shadow: 0px 4px 4px #d0642d; */
    text-shadow: 0px 4px 4px #000000;

}



/* Popover personalizado */

.custom-popover {
    --bs-popover-max-width: 200px;
    --bs-popover-border-color: var(--cielo);
    --bs-popover-header-bg: var(--cielo);
    --bs-popover-header-color: black;
    --bs-popover-body-padding-x: 1rem;
    --bs-popover-body-padding-y: .5rem;
}

/* Reacciones */

.reactions-container {
    position: relative;
}

.reactions-container:hover .reactions {
    display: flex;
    opacity: 1;
    visibility: visible;
}

.reactions {
    flex-direction: row;
    position: absolute;
    margin-top: -70px;
    left: -20px;
    transition: opacity 0.3s ease-out, visibility 0.3s ease-out;
    opacity: 0;
    border-radius: 2rem;
    visibility: hidden;
}

.reactions-container:not(:hover) .reactions {
    transition-delay: 0.5s;
    opacity: 0;
}

/* Insignias responsivas */

.responsive-image {
    position: absolute;
    top: auto;
    /* Ajusta la posición vertical */
    right: 10px;
    /* Ajusta la posición horizontal */
    max-width: 200px;
    /* Ajusta el tamaño máximo de la imagen */
    height: auto;
    /* Ajusta la altura automáticamente */
    z-index: 65;
    /* Asegura que la imagen esté por encima del contenido */
}

/* Media query para dispositivos con una anchura máxima de 768px (pantallas pequeñas como teléfonos móviles) */
@media only screen and (max-width: 768px) {
    .responsive-image {
        top: 10px;
        /* Ajusta la posición vertical para dispositivos móviles */
    }
}

/* Media query para pantallas más grandes (mayor a 768px) */
@media only screen and (min-width: 769px) {
    .responsive-image {
        bottom: 10px;
        /* Ajusta la posición vertical para pantallas grandes */
    }
}

/* btn vermas */
.show-more-btn {
    color: #073a42;
}

.show-more-btn:hover {
    color: #3d93e3;
}

.show-more-btn.disabled,
.show-more-btn:disabled {
    color: #17a2b8;
    background-color: transparent;
}



/* Redes sociales */

.social-icons {
    padding: 0;
    list-style: none;
    margin: 1em
}

.social-icons li {
    display: inline-block;
    margin: .15em;
    position: relative;
    font-size: 1.3em
}

.social-icons i {
    color: var(--azul-acopi);
    position: absolute;
    top: 21px;
    left: 21px;
    transition: all 265ms ease-out
}

.social-icons a {
    display: inline-block
}

.social-icons a:before {
    transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    content: " ";
    width: 60px;
    height: 60px;
    border-radius: 100%;
    display: block;
    /* background: linear-gradient(45deg, #00B5F5, #002A8F); */
    background: white;
    transition: all 265ms ease-out;
    /* border: solid 2px var(--azul-acopi); */
    border: solid 2px white;
}

.social-icons a:hover:before {
    transform: scale(0);
    /* transition: all 265ms ease-in */
    transition: all 200ms ease-in;
}


.social-icons a:hover i {
    transform: scale(1.8);
    -ms-transform: scale(1.8);
    -webkit-transform: scale(1.8);
    color: white;
    background: var(--white);
    /* background: -webkit-linear-gradient(45deg, #00B5F5, #002A8F); */
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    /* transition: all 265ms ease-in; */
    transition: all 200ms ease-in;
}


/* --------------------------------------------------------------------------------------------------------- */

/* Select2 rounded */
.selection>.select2-selection {
    border-radius: 50rem !important;
}

/* Custom paginator */

.btn-custon-paginator:hover {
    border: solid 1px var(--cian) !important;
    color: var(--azul-acopi) !important;
}

.btn-custon-paginator.prev {
    border-radius: 100% 0% 0% 100%;
}

.btn-custon-paginator.next {
    border-radius: 0% 100% 100% 0%;
}

.page-item.disabled .btn-custon-paginator {
    border: solid 1px var(--bs-secondary);
}

.btn-custon-paginator {
    padding: 10px 17px;
    border: solid 1px var(--azul-acopi);
    border-radius: 5rem;
    margin-left: 2px;
    margin-right: 2px;
    list-style: none;
    color: var(--bs-secondary);
    font-weight: bold;
}

.page-item.active .btn-custon-paginator, .btn-custon-paginator.active {
    background-color: var(--azul-acopi);
    color: white;
}

.page-item.active .btn-custon-paginator:hover, .btn-custon-paginator.active:hover {
    background-color: var(--bs-secondary);
    border: solid 1px var(--bs-secondary);
    color: white !important;
}



.nav-link {
    display: block;
    padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
    font-size: var(--bs-nav-link-font-size);
    font-weight: var(--bs-nav-link-font-weight);
    color: var(--azul-acopi);
    text-decoration: none;
    background: 0 0;
    border: 0;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: white;
    background-color: var(--azul-acopi);
    border-color: var(--metal) var(--metal) var(--metal);
    border-radius: 10px;
}


/* SOLUCIONES EMPRESARIALES */


.boton-principal:hover {
    -webkit-animation: neon2 1.5s ease-in-out infinite alternate;
    -moz-animation: neon2 1.5s ease-in-out infinite alternate;
    animation: neon2 1.5s ease-in-out infinite alternate;
}



/*setup*/
/* * {
    margin: 0;
    padding: 0;
} */

/* body {
    background-color: #222222;
}

#container {
    width: 500px;
    margin: auto;
}
 */

/*neeeeoooon*/
/* p {
    text-align: center;
    font-size: 7em;
    margin: 20px 0 20px 0;
} */

/* a {
    text-decoration: none;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
}

p:nth-child(1) a {
    color: #FF1177;
    font-family: Monoton;
}

p:nth-child(1) a:hover {
    -webkit-animation: neon1 1.5s ease-in-out infinite alternate;
    -moz-animation: neon1 1.5s ease-in-out infinite alternate;
    animation: neon1 1.5s ease-in-out infinite alternate;
}

p:nth-child(2) a {
    font-size: 1.5em;
    color: #228DFF;
    font-family: Iceland;
}

p:nth-child(2) a:hover {
    -webkit-animation: neon2 1.5s ease-in-out infinite alternate;
    -moz-animation: neon2 1.5s ease-in-out infinite alternate;
    animation: neon2 1.5s ease-in-out infinite alternate;
}

p:nth-child(3) a {
    color: #FFDD1B;
    font-family: Pacifico;
}

p:nth-child(3) a:hover {
    -webkit-animation: neon3 1.5s ease-in-out infinite alternate;
    -moz-animation: neon3 1.5s ease-in-out infinite alternate;
    animation: neon3 1.5s ease-in-out infinite alternate;
}

p:nth-child(4) a {
    color: #B6FF00;
    font-family: PressStart;
    font-size: 0.8em;
}

p:nth-child(4) a:hover {
    -webkit-animation: neon4 1.5s ease-in-out infinite alternate;
    -moz-animation: neon4 1.5s ease-in-out infinite alternate;
    animation: neon4 1.5s ease-in-out infinite alternate;
}

p:nth-child(5) a {
    color: #FF9900;
    font-family: Audiowide;
}

p:nth-child(5) a:hover {
    -webkit-animation: neon5 1.5s ease-in-out infinite alternate;
    -moz-animation: neon5 1.5s ease-in-out infinite alternate;
    animation: neon5 1.5s ease-in-out infinite alternate;
}

p:nth-child(6) a {
    color: #BA01FF;
    font-family: Vampiro One;
}

p:nth-child(6) a:hover {
    -webkit-animation: neon6 1.5s ease-in-out infinite alternate;
    -moz-animation: neon6 1.5s ease-in-out infinite alternate;
    animation: neon6 1.5s ease-in-out infinite alternate;
}

p a:hover {
    color: #ffffff;
} */



/*glow for webkit*/
/* @-webkit-keyframes neon1 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #FF1177,
            0 0 70px #FF1177,
            0 0 80px #FF1177,
            0 0 100px #FF1177,
            0 0 150px #FF1177;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #FF1177,
            0 0 35px #FF1177,
            0 0 40px #FF1177,
            0 0 50px #FF1177,
            0 0 75px #FF1177;
    }
}

@-webkit-keyframes neon2 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #228DFF,
            0 0 70px #228DFF,
            0 0 80px #228DFF,
            0 0 100px #228DFF,
            0 0 150px #228DFF;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #228DFF,
            0 0 35px #228DFF,
            0 0 40px #228DFF,
            0 0 50px #228DFF,
            0 0 75px #228DFF;
    }
}

@-webkit-keyframes neon3 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #FFDD1B,
            0 0 70px #FFDD1B,
            0 0 80px #FFDD1B,
            0 0 100px #FFDD1B,
            0 0 150px #FFDD1B;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #FFDD1B,
            0 0 35px #FFDD1B,
            0 0 40px #FFDD1B,
            0 0 50px #FFDD1B,
            0 0 75px #FFDD1B;
    }
}

@-webkit-keyframes neon4 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #B6FF00,
            0 0 70px #B6FF00,
            0 0 80px #B6FF00,
            0 0 100px #B6FF00,
            0 0 150px #B6FF00;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #B6FF00,
            0 0 35px #B6FF00,
            0 0 40px #B6FF00,
            0 0 50px #B6FF00,
            0 0 75px #B6FF00;
    }
}

@-webkit-keyframes neon5 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #FF9900,
            0 0 70px #FF9900,
            0 0 80px #FF9900,
            0 0 100px #FF9900,
            0 0 150px #FF9900;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #FF9900,
            0 0 35px #FF9900,
            0 0 40px #FF9900,
            0 0 50px #FF9900,
            0 0 75px #FF9900;
    }
}

@-webkit-keyframes neon6 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #ff00de,
            0 0 70px #ff00de,
            0 0 80px #ff00de,
            0 0 100px #ff00de,
            0 0 150px #ff00de;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #ff00de,
            0 0 35px #ff00de,
            0 0 40px #ff00de,
            0 0 50px #ff00de,
            0 0 75px #ff00de;
    }
} */

/*glow for mozilla*/
/* @-moz-keyframes neon1 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #FF1177,
            0 0 70px #FF1177,
            0 0 80px #FF1177,
            0 0 100px #FF1177,
            0 0 150px #FF1177;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #FF1177,
            0 0 35px #FF1177,
            0 0 40px #FF1177,
            0 0 50px #FF1177,
            0 0 75px #FF1177;
    }
}

@-moz-keyframes neon2 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #228DFF,
            0 0 70px #228DFF,
            0 0 80px #228DFF,
            0 0 100px #228DFF,
            0 0 150px #228DFF;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #228DFF,
            0 0 35px #228DFF,
            0 0 40px #228DFF,
            0 0 50px #228DFF,
            0 0 75px #228DFF;
    }
}

@-moz-keyframes neon3 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #FFDD1B,
            0 0 70px #FFDD1B,
            0 0 80px #FFDD1B,
            0 0 100px #FFDD1B,
            0 0 150px #FFDD1B;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #FFDD1B,
            0 0 35px #FFDD1B,
            0 0 40px #FFDD1B,
            0 0 50px #FFDD1B,
            0 0 75px #FFDD1B;
    }
}

@-moz-keyframes neon4 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #B6FF00,
            0 0 70px #B6FF00,
            0 0 80px #B6FF00,
            0 0 100px #B6FF00,
            0 0 150px #B6FF00;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #B6FF00,
            0 0 35px #B6FF00,
            0 0 40px #B6FF00,
            0 0 50px #B6FF00,
            0 0 75px #B6FF00;
    }
}

@-moz-keyframes neon5 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #FF9900,
            0 0 70px #FF9900,
            0 0 80px #FF9900,
            0 0 100px #FF9900,
            0 0 150px #FF9900;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #FF9900,
            0 0 35px #FF9900,
            0 0 40px #FF9900,
            0 0 50px #FF9900,
            0 0 75px #FF9900;
    }
}

@-moz-keyframes neon6 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #ff00de,
            0 0 70px #ff00de,
            0 0 80px #ff00de,
            0 0 100px #ff00de,
            0 0 150px #ff00de;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #ff00de,
            0 0 35px #ff00de,
            0 0 40px #ff00de,
            0 0 50px #ff00de,
            0 0 75px #ff00de;
    }
} */

/*glow*/
/* @keyframes neon1 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #FF1177,
            0 0 70px #FF1177,
            0 0 80px #FF1177,
            0 0 100px #FF1177,
            0 0 150px #FF1177;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #FF1177,
            0 0 35px #FF1177,
            0 0 40px #FF1177,
            0 0 50px #FF1177,
            0 0 75px #FF1177;
    }
}

@keyframes neon2 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #228DFF,
            0 0 70px #228DFF,
            0 0 80px #228DFF,
            0 0 100px #228DFF,
            0 0 150px #228DFF;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #228DFF,
            0 0 35px #228DFF,
            0 0 40px #228DFF,
            0 0 50px #228DFF,
            0 0 75px #228DFF;
    }
}

@keyframes neon3 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #FFDD1B,
            0 0 70px #FFDD1B,
            0 0 80px #FFDD1B,
            0 0 100px #FFDD1B,
            0 0 150px #FFDD1B;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #FFDD1B,
            0 0 35px #FFDD1B,
            0 0 40px #FFDD1B,
            0 0 50px #FFDD1B,
            0 0 75px #FFDD1B;
    }
}

@keyframes neon4 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #B6FF00,
            0 0 70px #B6FF00,
            0 0 80px #B6FF00,
            0 0 100px #B6FF00,
            0 0 150px #B6FF00;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #B6FF00,
            0 0 35px #B6FF00,
            0 0 40px #B6FF00,
            0 0 50px #B6FF00,
            0 0 75px #B6FF00;
    }
}

@keyframes neon5 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #FF9900,
            0 0 70px #FF9900,
            0 0 80px #FF9900,
            0 0 100px #FF9900,
            0 0 150px #FF9900;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #FF9900,
            0 0 35px #FF9900,
            0 0 40px #FF9900,
            0 0 50px #FF9900,
            0 0 75px #FF9900;
    }
}

@keyframes neon6 {
    from {
        text-shadow: 0 0 10px #fff,
            0 0 20px #fff,
            0 0 30px #fff,
            0 0 40px #ff00de,
            0 0 70px #ff00de,
            0 0 80px #ff00de,
            0 0 100px #ff00de,
            0 0 150px #ff00de;
    }

    to {
        text-shadow: 0 0 5px #fff,
            0 0 10px #fff,
            0 0 15px #fff,
            0 0 20px #ff00de,
            0 0 35px #ff00de,
            0 0 40px #ff00de,
            0 0 50px #ff00de,
            0 0 75px #ff00de;
    }
} */


/*REEEEEEEEEEESPONSIVE*/
/* @media (max-width: 650px) {

    #container {
        width: 100%;
    }

    p {
        font-size: 3.5em;
    }

} */

/* ------------------------------------------------------------------------------------------------------------------------ */


/* @media (min-width: 992px){
    .sidebar-mini.sidebar-collapse .main-sidebar, .sidebar-mini.sidebar-collapse .main-sidebar::before {
        margin-left: 0;
        width: 2.6rem;
    }

} */

/* PORTAFOLIOOOOOOOOOOOOOOOOOOOOOOOOOO */

/* Encabezado para todos los Ejes */

.hero-section {
    background: url('/img/fondo.jpg') no-repeat center center/cover;
    color: white;
    text-align: center;
    padding: 80px 20px;
    position: relative;
    width: 100%;
}

.background-overlay {
    background-color: #001f7799;
    opacity: 0.9;
    transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
    inset: 0;
    width: 100%;
    height: 100%;
    position: absolute;
}

/* ---------------------------------------- */



/* --------------------------------------------------------------- */



/* Estilos Eje JURIDICO */

/* Estilos generales */
body {
    font-family: 'Arial', sans-serif;
    background-color: #f4f4f4;
}

/* Sección LegalGo */
.legalgo {
    background: linear-gradient(to right, #002b5b, #0052a3);
    color: white;
    padding: 60px 20px;
}

/* Títulos */
.titulo-legal {
    font-size: 2.5rem;
    font-weight: bold;
    text-transform: uppercase;
}

.subtitulo-legal {
    font-size: 1.2rem;
    max-width: 800px;
    margin: 0 auto 40px;
    text-align: center;
}

/* Servicios */
.servicio {
    background: white;
    color: #002b5b;
    text-align: center;
    border-radius: 10px;
    padding: 20px;
    transition: 0.3s;
}

.servicio:hover {
    transform: scale(1.05);
    box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.2);
}

/* Paquetes */
.titulo-paquetes {
    font-size: 1.8rem;
    margin-bottom: 30px;
}

.paquete {
    background: white;
    color: #333;
    border-radius: 10px;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
    text-align: center;
    transition: 0.3s;
}

.paquete:hover {
    transform: translateY(-5px);
}

.paquete .card-header {
    background: #0052a3;
    color: white;
    font-weight: bold;
    font-size: 1.2rem;
    padding: 15px;
    border-radius: 10px 10px 0 0;
}

.paquete .card-body {
    padding: 20px;
}

.paquete ul {
    list-style: none;
    padding: 0;
}

.paquete ul li {
    margin-bottom: 10px;
    font-size: 1rem;
}

/* .......................................................................... */