diff --git a/d1.jpeg b/d1.jpeg new file mode 100644 index 00000000..a5497614 Binary files /dev/null and b/d1.jpeg differ diff --git a/d2.jpeg b/d2.jpeg new file mode 100644 index 00000000..d781fc0b Binary files /dev/null and b/d2.jpeg differ diff --git a/d3.jpeg b/d3.jpeg new file mode 100644 index 00000000..d871de23 Binary files /dev/null and b/d3.jpeg differ diff --git a/d4.jpeg b/d4.jpeg new file mode 100644 index 00000000..75a9177c Binary files /dev/null and b/d4.jpeg differ diff --git a/d5.jpg b/d5.jpg new file mode 100644 index 00000000..9afc8eb0 Binary files /dev/null and b/d5.jpg differ diff --git a/d6.jpeg b/d6.jpeg new file mode 100644 index 00000000..65520ca0 Binary files /dev/null and b/d6.jpeg differ diff --git a/index.html b/index.html index a05a4489..5b2781f8 100644 --- a/index.html +++ b/index.html @@ -127,41 +127,79 @@ } } - .gallery-rotate-image .image-container { - display: flex; - flex-wrap: wrap; - gap: 16px; - /* Adjust the gap between images */ - } - - .gallery-rotate-image .image-container span { - display: inline-block; - } - - .trip-gallery-container { - display: flex; - flex-wrap: wrap; - gap: 16px; - /* Adjust the gap between images */ - } - - .trip-gallery-container .image-container { - display: flex; - flex-direction: column; - align-items: center; - } - - .trip-gallery-container .image-container img { - max-width: 100%; - height: auto; - } - - .btn-container { - display: flex; - justify-content: center; - gap: 8px; - /* Adjust the gap between buttons */ - } + body { + font-family: Arial, sans-serif; + margin: 0; + padding: 0; + background-color: #f9f9f9; +} + +.section__header { + text-align: center; + padding: 2em 0; +} + +.center-align { + text-align: center; +} + +.trips__container { + display: flex; + flex-wrap: wrap; + gap: 1em; + justify-content: center; + padding: 1em; +} + +.trip__card { + background-color: #fff; + border: 1px solid #ddd; + border-radius: 8px; + overflow: hidden; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + width: 250px; /* Adjusted width */ + max-width: 100%; + transition: transform 0.3s ease; +} + +.trip__card img { + width: 100%; + height: 150px; /* Adjusted height */ + object-fit: cover; +} + +.trip__details { + padding: 0.5em; /* Reduced padding */ +} + +.trip__details h4 { + font-size: 1.1em; /* Reduced font size */ + margin: 0; +} + +.trip__details p { + font-size: 0.9em; /* Reduced font size */ + margin: 0.5em 0 0; +} + +.booking__price { + padding: 0.5em; + text-align: center; +} + +.book__now { + background-color: #4CAF50; + color: white; + border: none; + padding: 0.5em 1em; + border-radius: 5px; + cursor: pointer; + transition: background-color 0.3s ease; +} + +.book__now:hover { + background-color: #45a049; +} @media screen and (max-width: 768px) { body { @@ -196,6 +234,171 @@ } } + .trips__container { + display: flex; + flex-wrap: wrap; + justify-content: center; + gap: 20px; + padding: 20px; + } + .trip__card { + flex: 1 1 calc(33.333% - 40px); /* Adjust 40px to your desired gap size */ + box-sizing: border-box; + background-color: #f9f9f9; + border: 1px solid #ddd; + border-radius: 10px; + overflow: hidden; + display: flex; + flex-direction: column; + align-items: center; + text-align: center; + max-width: calc(33.333% - 40px); /* Same as above */ + } + .trip__card img { + width: 100%; + height: 250px; + object-fit: cover; + } + .trip__details { + padding: 10px; + } + .booking__price { + margin-top: auto; /* Pushes the button to the bottom */ + padding: 10px; + width: 100%; + text-align: center; + } + .book__now { + background-color: #007bff; + color: white; + border: none; + padding: 10px 20px; + border-radius: 5px; + cursor: pointer; + text-transform: uppercase; + } + .book__now:hover { + background-color: #0056b3; + } + body { + font-family: Arial, sans-serif; + margin: 0; + padding: 0; + background-color: #f9f9f9; +} + +.trip-section { + padding: 2em 0; + background-color: #fff; +} + +.container { + max-width: 1200px; + margin: 0 auto; + padding: 0 1em; +} + +.title { + text-align: center; + font-size: 2em; + margin-bottom: 0.5em; +} + +.subtitle { + text-align: center; + font-size: 1.1em; + color: #666; + margin-bottom: 2em; +} + +.trip-grid { + display: flex; + flex-wrap: wrap; + gap: 1em; + justify-content: center; +} + +.card { + background-color: #fff; + border: 1px solid #ddd; + border-radius: 8px; + overflow: hidden; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + width: 300px; + max-width: 100%; + transition: transform 0.3s ease; +} + +.card:hover { + transform: scale(1.05); +} + +.card img { + width: 100%; + height: 200px; + object-fit: cover; +} + +.card-details { + padding: 1em; +} + +.card-details p { + font-size: 1.2em; + margin: 0; +} + +.rating { + margin: 0.5em 0; + font-size: 1em; + color: #f39c12; +} + +.price-info { + display: flex; + justify-content: space-between; + align-items: center; +} + +.price { + font-size: 1.2em; +} + +.book-now-button { + background-color: #940a97; + color: white; + border: none; + padding: 0.5em 1em; + border-radius: 5px; + cursor: pointer; + transition: background-color 0.3s ease; +} + +.book-now-button:hover { + background-color: #8a0bd8; +} + +.view-all-buttons { + text-align: center; + margin-top: 2em; +} + +.view-all-buttons .btn { + background-color: #970cd8; + color: white; + border: none; + padding: 0.5em 2em; + border-radius: 5px; + cursor: pointer; + margin: 0 1em; + transition: background-color 0.3s ease; +} + +.view-all-buttons .btn:hover { + background-color: #45a049; +} + + @@ -822,68 +1025,174 @@
+ Enjoy and be the part of cultural celebration and festivals. +
++ Enjoy and be the part of cultural celebration and festivals. +
++ Meet international artists like Siilawy, Marwan Moussa in July +
++ Experience the largest Latin music festival in the UK +
++ Celebrate the ancient tradition of marking land borders with flags +
++ Celebrate marine life with parades, music, and educational events +
++ Traditional cultural celebration in Islands +
++ Festival of John the Baptist with lively parties and traditional food +
+
- Top trip deals curated for you. Get the best package for your adventure and save more.
+
+ Top trip deals curated for you. Get the best package for your adventure and save more.
Best Trip Packages
+