@import 'colors.css';

section {
    width: 100%;
}

@media (min-width: 1080px) {

    .titulo-con-lineas {
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 20px 0;
        scroll-margin-top: 180px;
    }

    .linea {
        border: 2px solid #Df4e4e;
        border-radius: 25px;
        padding: 15px 0;
    }

    .titulo {
        background-color: #Df4e4e;
        /* Fondo azul para el texto */
        color: var(--blanco);
        /* Color del texto */
        padding: 10px 25px;
        /* Espaciado interno del texto */
        font-size: 18px;
        /* Tamaño del texto base */
        font-family: "MiFuente", sans-serif;
        font-weight: bold;
        /* Texto en negrita */
        border-radius: 20px;
        /* Bordes redondeados */
        margin: 5px;
        /* Espaciado entre las líneas y el texto */
        text-align: center;
        /* Centra el texto */
    }

}

@media (min-width: 600px) and (max-width:1079px) {

    .titulo-con-lineas {
        display: flex;
        align-items: center;
        justify-content: center;
        margin:10px auto;
        scroll-margin-top: 180px;
    }

    .linea {
       box-shadow: 0 0 0 4px #df4e4e;
    border-radius: 50px;
    display: flex;
    justify-content: center;
    align-content: center;
    padding: 10px;
    margin: 10px;
    }

    .titulo {
        background-color: #Df4e4e;
    color: var(--blanco);
    font-size: 24px;
    padding: 10px;
    font-weight: bold;
    font-family: "MiFuente", sans-serif;
    border-radius: 50px;    
    text-align: center;
    }



}

@media (max-width: 599px) {

    .titulo-con-lineas {
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 10px auto;
        scroll-margin-top: 180px;
    }

     .linea {
       box-shadow: 0 0 0 4px #df4e4e;
    border-radius: 50px;
    display: flex;
    justify-content: center;
    align-content: center;
    padding: 10px;
    margin: 10px;
    }

    .titulo {
        background-color: #Df4e4e;
    color: var(--blanco);
    font-size: 24px;
    padding: 10px;
    font-weight: bold;
    font-family: "MiFuente", sans-serif;
    border-radius: 50px;    
    text-align: center;
    }

}