/*Variables CSS*/
:root{
    /*Colores claros*/
    --rojo-h-table:#9f2241;
    --verde-claro: #235B4E;
    --rojo-claro: #9F2241;
    --cafe-claro: #c0a073;
    --cafe-claro-1: #f0e7da;
    --gris-claro: #8c8c94;
    --gris-claro-1: #e6e6e6;
    --azul: #4743C5;
    --azul-texto:rgb(0, 87, 225);
    /*Colores Oscuros*/
    --verde-oscuro: #10312B;
    --rojo-oscuro: #691C32;
    --cafe-oscuro: #BC955C;
    --gris-oscuro: #6F7271;
    /*Colores neutros*/
    --blanco: #FFFFFF;   
    --negro: #000000;   
}
@font-face{
    font-family:Montserrat-Regular;
    src: url(../fonts/Montserrat-Regular.ttf)
}
@font-face{
    font-family:Montserrat-Black;
    src: url(../fonts/Montserrat-Black.ttf);
}
@font-face{
    font-family:Montserrat-Bold;
    src: url(../fonts/Montserrat-Bold.ttf);
}

*{
    font-family:Montserrat-Regular;
    font-size: 1rem;
}

html{
    box-sizing: border-box;
}
img{
    max-width: 100%;
    display: block;
    height: auto;
}
/*Globales*/
.contenedor{
    max-width: 140rem;
    width: 100%;
    margin: 0 auto;
}
.contenedor__header{
    max-width: 140rem;
    width: 100%;
    margin: 0 auto;
}
/*Header*/
.bg__cafe--claro{
    background-color: var(--blanco);
}
.bg_donde{
    background-color: var(--cafe-claro-1);
}
.bg__image--principal{
    background-image: url(../img/image_fondo_gral.jpg);
    height: auto;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}

.titulo__principal{
    display: flex;
    flex-direction:row;
    align-items: center;
}
.titulo__principal--texto1{
    color: var(--blanco);
    font-family: Montserrat-Bold;
}
.titulo__principal--texto2{
    font-family: Montserrat-Bold;
}
.header{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.header .content-header{
    margin: 1rem 0 0 0;
}
@media (min-width:765px) {
    .header{
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }
}
@media (min-width:765px) {
    .gobierno{
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }
}
.menu__text{
    font-weight: bold;
    color: var(--blanco);
}
.grid{
    display:grid;
}
.grid-col-12{
    grid-template-columns: repeat(12,minmax(0,1fr));
}
.col-span-10{
    grid-column-start: span 10;
    grid-column-end: span 10;
}
.col-span-12{
   grid-column-start: span 12;
   grid-column-end: span 12;
}
.col-start-2{
    grid-column-start: 2;
}
.h-\[110\%\]{
    height: 110%;
}
.w-\[90\%\]{
    width: 90%;
}
.w-\[62\%\]{
    width: 62%;
}
.mt-nino{
    padding-top: 20%;
}
.z-40{
    z-index:40;
}
.z-0{
    z-index:0;
}
.justify-items-center{
    justify-items: center;
}
.justify-self-center{
    justify-self:center;
}
.mt-1{
    margin-top: 0.25rem;
}
.pt-1{
    padding-top: 0.25rem;
}
.overflow-hidden{
    overflow: hidden;
}
.absolute{
    position: absolute;
}
.relative{
    position: relative;
}
.img-2{
    animation: rotation 15s infinite linear;
}
@keyframes rotation{
    from{
        transform:rotate(0deg);
    }
    to{
        transform: rotate(359deg);
    }
}
.h-card{
    height: 22rem;
}
.bg-verde-dark{
    background-color: var(--verde-oscuro);
}
.bg-gold{
    background-color: var(--cafe-claro);
}
.bg-white{
    background-color: var(--blanco);
    width: 100%;
}
.bg-red{
    background-color: var(--rojo-claro);
}
.bg-red-dark{
    background-color: var(--rojo-oscuro);
}
.bg-verde{
    background-color: var(--verde-claro);
}
.bg-gold-dark{
    background-color: var(--cafe-oscuro);
}
.bg-dark{
    background-color: var(--cafe-oscuro);
}
.bg-gris{
    background-color: var(--gris-oscuro);
}
.bg__gris--dark{
    background-color: var(--gris-oscuro);
}
.bg-ht{
    background-color: var(--rojo-h-table);
   }
.ejes__proteccion .ejes__titulo{
    color: var(--rojo-oscuro);
    font-family: Montserrat-Bold;
}
.texto__general{
    color:var(--rojo-oscuro);
    font-family: Montserrat-Bold; 
}
.texto__general--card{
    color:var(--rojo-);
    font-family:Montserrat-Bold;
    font-weight: 700;
    text-align: start;
}
.doble__linea{
    font-weight: 500;
    font-size: 28px;
}
.texto__general--red{
    color:#9F2241;
    font-family:Montserrat-Bold;
    font-weight: 400;
    font-size: 45px;
}
.texto__general--azul{
    color:#4743C5;
    font-family:Montserrat-Bold;
    font-weight: 400;
    font-size: 45px;
}
.texto__general--gris{
    color:var(--gris-oscuro);
    font-family:Montserrat-Bold;
    font-weight: 400;
    font-size: 45px;
}
.parrafo__texto{
    color:var(--gris-oscuro);
    font-weight: 600;
    text-align: start;
    line-height: 1.5;
}
.parrafo__texto--azul{
    color:var(--negro);
    font-weight: 600;
    text-align: start;
    line-height: 1.5;
    color:#4743C5;
}
.card{
    border: none;
}
.btn_details{
    border: 2px solid var(--cafe-oscuro);
    background-color: var(--cafe-claro);
    color: var(--blanco);
    font-family: Montserrat-Bold; 
    border-radius: 10px;
}
.btn_details:hover{
    background-color: var(--blanco);
    color: #4743C5;
}
.btn-mapa{
    background-color: #4743C5;
    color: var(--blanco);
    font-family: Montserrat-Bold; 
    border-radius: 10px;
}
.bg__card--color:hover{
    background-color: var(--gris-claro);
    color: var(--blanco);
}
.card{
    border-radius: 15px;
}
.card .card-header{
    border-radius: 10px;
}
.ubicacion__card{
    border-radius: 10px;
}
.bg-ubicacion{
    background-color: #f4f4f4;
}
.bg__item--eje{
    background-color: var(--azul);
    margin: 1px;
    border: 1px solid  var(--cafe-oscuro)
    
}
.bg__item--eje a{
    color:var(--blanco);
    font-weight: 700;
    font-size: 20px;
}
.bg__item--eje a:hover{
    background-color: var(--blanco);
    color:var(--azul);
    font-weight: 700;
   
}
.border--item{
    border: 3px solid var(--gris-oscuro);
}
.border--item  .btn-collapse{
    color: var(--blanco);
    font-weight: 700;
    background-color: var(--gris-oscuro);
}
.header__card {
    margin:0 auto;
}
.body__card{
    color: var(--rojo-claro);
    font-weight: 700;
    font-size: 13px;
}
.foo_card{
    background-color: var(--cafe-oscuro);
}
.modal-header {
    display: flex;
    flex-direction: row;
    justify-content: center;
}
.modal-footer{
    display: flex;
    flex-direction: row;
    justify-content: center;
    text-align: center;
}
.modal-header h1{
    color:var(--blanco);
    font-size: 40px;
    font-weight: 700;
}
.tittle-modal{
    font-size: 30rem;
    font-weight: 700;
}
.titulo__eje{
    margin-top:1rem;
    font-weight: 700;
    font-family:Montserrat-Bold;
    font-size: 1.5rem;
}
.titulo__eje--desc{
    font-family: Monserrat-Regular;
    font-weight: 500;
    line-height: 1.5rem;
    color:var(--negro);
    text-align: justify;

}
.br-botton{
    border-bottom: 2px solid var(--cafe-oscuro);
}
.content-center{
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.content-center img{
    margin: 0 auto;
}
.nav-link:active a{
    color: #691C32;
}
.title__card--header{
    color: var(--blanco);
    font-weight: bold;
    font-size: 30px;
}
.text__title--accordion{
    font-size: 20px;
    color: var(--azul-texto);
    font-weight: 800;
}
.text__title--accordion_gr{
    font-size: 20px;
    color: var(--gris-oscuro);
    font-weight: 800;
}
.text__content--accordion_az{
    font-size: 15px;
    color: var(--azul-texto);
    font-weight: 700;
    margin-left: 1rem;
}
.text__content--accordion{
    font-size: 15px;
    color: var(--gris-oscuro);
    font-weight: 700;
    margin-left: 1rem;
    padding: 1rem;
}
.border--row{
    border-bottom: 4px solid var(--azul-texto);
}
.h-circulos{
    height: 550px;
}
.img-salud{
    display: flex;
    justify-content: center;
}
.carousel__dflex{
    display: flex;
    flex-direction: row;

}
.caja__logos{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
.img__acor--caja{
    width: 400px;
    height: 370px;
}
.img__acor--caja1{
    width: 450px;
    height: 330px;
}
.img__ssp{
    width: 420px;
    height: 300px;
}
.img__inm{
    width: 45rem;
    height: 30rem;
}
.row__center{
    justify-content: center;
}
.th__title{
    color:var(--blanco);
    font-size: 16px;
    font-weight: 800;
}
.title__info--gral{
    font-weight: 700;
}
.tj{
    text-align: justify;
}
.center{
    display: flex;
    justify-content: center;
}
.img__depencecias{
    width: 180px;
    height: 170px;
    background-size: cover;
}
.img__depencecias--h{
    width: 250px;
    height: 170px;
    background-size: cover;
}
.img__depencecia--w{
    width: 320px;
    height: 200px;
    background-size: cover;
}  
.img__depencecia--z{
    width: 200px;
    height: 170px;
    background-size: cover;
}
.img__depencecia--sec{
    width: 230px;
    height: 130px;
    background-size: cover;
}
.img__depencecia--st{
    width: 170px;
    height: 130px; 
}
.col-multi{
    text-align: center;
    vertical-align: middle;
}
.table-container {
    height: 770px;
    overflow-y: scroll;
   }
.data, th, td {
    border-collapse: collapse;
    padding: 4px;
}
.comar_enlace:hover{
    color: var(--verde-claro);
}

.custom-bg {
    background-color: #621132;
    color: white; /* Color de texto */
    font-weight: bold; /* Texto en negrita */
    font-size: 2.5rem; /* Tamaño de fuente */
    letter-spacing: 2px; /* Espaciado entre letras */
    padding: 10px 20px; /* Espaciado interno */
    border-radius: 15px; /* Borde suave */
}
