.destinations-container {
display: flex;
flex-wrap: wrap; justify-content: space-between;
margin: 20px auto;
max-width: 1200px;
} .destination-box {
order: 1;
position: relative;
width: calc(20% - 20px); height: 250px;
perspective: 1000px;
cursor: pointer;
border-radius: 10px;
overflow: hidden;
margin-bottom: 20px;
} .details-section {
order: 2;
flex-basis: 100%;
display: flex;
justify-content: space-between;
align-items: flex-start;
padding: 20px;
background-color: #f9f9f9;
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
margin-top: 10px;
transition: all 0.3s ease-in-out;
} .destination-front,
.destination-back {
position: absolute;
width: 100%;
height: 100%;
backface-visibility: hidden; border-radius: 10px;
overflow: hidden;
transition: transform 0.6s ease-in-out; background-size: cover;
background-position: center;
display: flex;
justify-content: center;
align-items: center;
} .destination-front {
transform: rotateY(0deg); } .destination-back {
transform: rotateY(180deg); background-color: rgba(0, 0, 0, 0.4); } .destination-name {
font-size: 24px;
font-weight: bold;
color: white;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7); z-index: 2; } .details-text {
width: 100%;
padding-right: 20px;
}
.details-form {
width: 25%;
}
.details-form h3 {
margin-bottom: 15px;
font-size: 20px;
}
.details-form label {
display: block;
margin: 10px 0 5px;
font-weight: bold;
}
.details-form input,
.details-form select,
.details-form button {
width: 100%;
padding: 10px;
margin-bottom: 10px;
border: 1px solid #ccc;
border-radius: 5px;
}
.details-form button {
background-color: #007bff;
color: white;
border: none;
cursor: pointer;
transition: background-color 0.3s ease;
}
.details-form button:hover {
background-color: #0056b3;
} #ischia .destination-front,
#ischia .destination-back {
background-image: url(https://www.alilauro.it/wp-content/themes/alilauro/static/images/destinazioni/08-ischia.jpg);
}
#capri .destination-front,
#capri .destination-back {
background-image: url(https://www.alilauro.it/wp-content/themes/alilauro/static/images/destinazioni/07-capri.jpg);
}
#procida .destination-front,
#procida .destination-back {
background-image: url(https://www.alilauro.it/wp-content/themes/alilauro/static/images/destinazioni/09-procida.jpg);
}
#sorrento .destination-front,
#sorrento .destination-back {
background-image: url(https://www.alilauro.it/wp-content/themes/alilauro/static/images/destinazioni/19-sorrento.jpg);
} .destination-box:hover .destination-front {
transform: rotateY(180deg); }
.destination-box:hover .destination-back {
transform: rotateY(0deg); }
.space{
line-height: 1.5;
}