body{
    margin-top: 130px;
    color: #404041;
    
}

.Activa{
    font-weight: bold;
    color: #393C3E;
}

.Con-IMSS{
    max-width: 100%;
    height: auto;
    padding-bottom: 30px;
    text-align: center;
}

h2{
    font-size: 38px;
    font-family: 'Montserrat';
    font-weight: bold;
    margin-top: 25px;
    margin-bottom: 12.5px;
    margin-left: 10%;
}
.Titulo-IMSS{
    margin-left: 115px;
}

.tab-links li a.active {
    background-color: #366b5f !important; /* Color más oscuro */
}
.tab-links{
    list-style-type: none;
    display:flex ;
    padding: 0;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 10px;
}
.tab-links li{
    display: block;
    position: relative;
    box-sizing: border-box;
    font-size: 50px;
    padding: 0%;
}

.tab-links li a{
    padding: 10px 15px; /*ESPACIO INTERNO*/
    background-color: #488a76 !important;
    margin-right: 0;
    border: 1px solid #FFFFFF;
    border-radius: 0;
    flex: 1;
    text-decoration: none;
    color: #FFF;
    font-size: 12px;
    width: 110px;
    height: 40px;
    text-align: center;
    
}
.tab-links:hover{
   
}
.tab-pane{
    display: none;
    
}
.tab-pane.active{
    display: block;

}
.text-conoce-al-imss{
    width:80%;
   margin-top: 30px;
    margin: 0 auto;
}

h2{
    font-size: 28px;
}
.Separador1{
    margin-left: 110px;
}
.mision{
    text-align: justify;
    width: 83%;
    margin: 0 auto;
}

.cuadros{
    display: flex;
    width: 83%;
    margin: 0 auto;
    border: 1px;
    margin-top: 45px;
}

.cuadro1{
    width: 30%;
    border: 1px;
    height: 40%;
    border-radius: 8%;
    background-color: #f3f3f5;
    
    
}
div.cuadro1{
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.text-cuadros2{
    font-size: 12px;
    text-align: justify;
}
.cuadro2{
    margin-left: 5%;
    width: 30%;
    height: 180px;
    background-color: #f3f3f5;
    border-radius: 8%;

}
div.cuadro2{
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.text-cuadros1{
    text-align: center;
}
.link-mn{
    
    text-align: left;
    color: #12C;
}
.text-mn{
    margin-left: 8%;
    text-align: left;
}

.Img-mn{
    display: flex;
    width: 83%;
    margin: 0 auto;
    justify-content: center;
    align-items: center;
    gap: 10px;
  
}

.cuadro3{
    margin-left: 5%;
    width: 25%;
    height: 100px;
    border-radius: 5%;
    background-color: #f3f3f5;
}
div.cuadro3{
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.text-eo{
 margin-left: 8%;
}
.link-eo{
    text-align: left;
    margin-left: 8%;
    color: #12C;
}
.list-eo{
    margin-left: 5%;
}
.text-ce{
    width: 82%;
    margin-left: 8%;
}
.text-pimss{
    width: 82%;
    margin-left: 8%;
}
.link-pimss{
    
    text-align: left;
    color: #12C;
}
.text-ap{
    width: 82%;
    margin-left: 8%;
}
.link-ap{
    text-align: left;
    color: #12C;
}
.text-mi{
    width: 90%;
    margin-left: 8%;
}
.link-mi{
    color: #12C;
    display: inline-block;
}

@media (max-width:799px){

    .Titulo-_IMSS{
        
    }

    .Con-IMSS img{
        width: 80%;
        height: auto;
    }
    .Titulo_IMSS h2{
        text-align: left;
    }

    .tab-links{
        flex-direction: column;
        width: 100%;
        margin:0 auto;
        justify-content: center;
        align-items: center;
    }

    .Icon-mv {
        display: flex;
        flex-wrap: wrap; /* Permite que los elementos se distribuyan en varias filas */
        justify-content: center;
      
    }

    .Icon-mv a {
        flex: 1 1 calc(33.333% - 20px); /* 3 imágenes por fila */
        box-sizing: border-box;
    }

    .Icon-mv img {
        width: 120px; /* Ajusta las imágenes para que ocupen todo el espacio disponible dentro de cada enlace */
        height: 120px; /* Mantiene la proporción de las imágenes */
    }

    .cuadros{
        flex-direction: column;
        width: 100%;
        margin: 15px 0;
        align-items: center;
    }
    .cuadro1{
        width: 70%;
        height: auto;
        align-items: center;
        margin: 0 ;
    }
    .cuadro2{
        width: 70%;
        height: auto;
        margin-top: 2%;
        margin-right: 4%;
    }

    .cuadro3{
        width: 50%;
        height: auto;
        margin-top: 6%;
    }

    .Img-ce{
        display: flex;
        flex-wrap: wrap; /* Permite que los elementos se distribuyan en varias filas */
        justify-content: center;
      
    }
    .Img-ce a{
        flex: 1 1 calc(33.333% - 20px); /* 3 imágenes por fila */
        box-sizing: border-box;
    }

}