
.restaurants {
    display: flex;
    flex-wrap: wrap; /* Pour que les cartes s'ajustent et passent à la ligne si nécessaire */
    justify-content: space-between; /* Pour espacer les cartes de manière égale */
}

.carte-jaune {
    gap: 20px;
    background-color: #ffd230;
    width: 300px;
    height: 250px;
    margin-bottom: 2%;
    border-radius: 20px;
    padding: 20px;
    margin-left: 2%;        
    margin-right: 2%;
}

.carte-bleu {
    gap: 20px;
    background-color: #0c162c;
    width: 300px;
    height: 250px;
    margin-bottom: 2%;
    border-radius: 20px;
    padding: 20px;
    margin-left: 2%;
    margin-right: 2%;
}

.titre-restaurant-jaune {
    font-family: 'Motter-Bold', sans-serif;
    color: #ffd230;
    font-size: 25px;
    cursor: default;
    text-align: center;
    margin-bottom: -10%;
    margin-top: 1%;
}

.titre-restaurant-bleu {
    font-family: 'Motter-Bold', sans-serif;
    color: #0c162c;
    font-size: 25px;
    cursor: default;
    text-align: center;
    margin-bottom: -10%;
    margin-top: 1%;
}

.nom-restaurant-bleu {
    color: #0c162c;
    font-size: 20px;
    cursor: default;
    text-align: center;
    margin-bottom: -10%;
    margin-top: 40px;
}

.nom-restaurant-jaune {
    color: #ffd230;
    font-size: 20px;
    cursor: default;
    text-align: center;
    margin-bottom: -10%;
    margin-top: 40px;
}


.ecrit-bleu {
    color: #0c162c;
    font-family: 'Calibri', sans-serif;
    font-size: 18px;
}

.ecrit-jaune {
    color: #ffd230;
    font-family: 'Calibri', sans-serif;
    font-size: 18px;
}

.lien-maps-bleu {
    text-decoration: none;
    color: #ffd230;
    font-family: 'Motter-Bold', sans-serif;
    font-size: 15px;
    background-color: #0c162c;
    padding: 10px;
    border-radius: 20px;
    margin-left: 62%;
}

.lien-maps-jaune {
    text-decoration: none;
    color: #0c162c;
    font-family: 'Motter-Bold', sans-serif;
    font-size: 15px;
    background-color: #ffd230;
    padding: 10px;
    border-radius: 20px;
    margin-left: 62%;
}

.titre-restaurant {
    cursor: default;
    text-align: center;
}

.fond-restaurant-bleu {
    border: #0c162c solid 2px;
    border-radius: 10px;
    background-color: #0c162c;
    margin-bottom: 6%;
    padding: 5px;
    margin-top: 13%;
}

.fond-restaurant-jaune {
    border: #ffd230 solid 2px;
    border-radius: 10px;
    background-color: #ffd230;
    margin-bottom: 6%;
    padding: 5px;
    margin-top: 13%;
}