body {
    background-color: #f0f8ff; /* Ferah bir arka plan rengi */
    font-family: 'Roboto', Arial, sans-serif; /* Google Fonts'tan Roboto fontu */
    font-size: 14px; /* Genel font boyutunu küçült */
}
.container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    padding: 20px;
}
.location {
    margin: 20px;
    text-align: center;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    width: 500px;
    border-radius: 5px;
    background-color: #F5F5DC; /* Kutucukların arka planı */
}
@media (min-width: 600px) {
    .location {
        width: 600px; /* Ekran genişliği 600px'den büyük olduğunda kutucukların genişliği iki katına çıkarılır */
    }
}
.location img {
    width: 100%;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.location:hover {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.3);
}
.location h2 {
    margin: 10px 0;
    font-size: 16px; /* Başlık font boyutunu küçült */
}
.location a, .location button {
    display: block; /* Linkleri ve butonları blok olarak ayarla */
    margin: 10px auto; /* Linkler arasında boşluk bırak */
    text-decoration: none;
    color: #F5F5DC;
    background-color: #C19A6B; /* Butonların arka planı camel */
    border: none;
    padding: 10px 20px;
    border-radius: 5px;
    cursor: pointer;
}
.location button:hover, .location a:hover {
    background-color: #0056b3;
}