/* Default styles for the button bar */
.modalidad-bar {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    row-gap: 5px;
}

/* Styles for each button */
.modalidad-bar a {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1 1 150px; /* Adjust the width as needed */
}

@media (min-width: 768px) {
    .margen-4tos-primera {
        margin-bottom: 10rem !important;
        margin-top: 5rem !important;
    }

    .margen-4tos {
        margin-bottom: 10rem !important;
    }

    .margen-semi-arriba {
        margin-top: 15rem !important;
        margin-bottom: 20rem !important;
    }

    .margen-semi-arriba-8 {
        margin-top: 15rem !important;
    }

    .margen-semi-abajo {
        margin-top: 29rem !important;
    }

    .margen-final {
        margin-top: 25rem !important;
    }

    .custom-card {
        height: 65px; /* Define el alto que desees para la tarjeta */
        display: flex;
        flex-direction: column;
        justify-content: space-around;
    }

    .line-content {
        flex: 1;
        display: flex;
        align-items: center;
    }

}


@media (max-width: 767px) {
    /* Styles for screens up to 767px */
    .modalidad-bar a {
        flex-basis: 50%; /* Display two buttons per row */
    }
}

@media (max-width: 575px) {
    /* Styles for screens up to 575px */
    .modalidad-bar a {
        flex-basis: 100%; /* Display one button per row */
    }
}