diff --git a/Tourguide (2).jpg b/Tourguide (2).jpg new file mode 100644 index 00000000..3b32bf42 Binary files /dev/null and b/Tourguide (2).jpg differ diff --git a/index.html b/index.html index cd838d34..9cdb038d 100644 --- a/index.html +++ b/index.html @@ -151,7 +151,7 @@

Find Your Perfect Getaway
Discover the World's Best

- +
diff --git a/newplantrip.html b/newplantrip.html new file mode 100644 index 00000000..31c4bc0f --- /dev/null +++ b/newplantrip.html @@ -0,0 +1,56 @@ + + + + + + Document + + + +
+
+
+ +

Tour Planner

+
+ + + +
+
+ +
+ # +
+ +
+
+ + + + + + + + + + + + + + + + +
+
+ + diff --git a/newplantripstyle.css b/newplantripstyle.css new file mode 100644 index 00000000..cec0568d --- /dev/null +++ b/newplantripstyle.css @@ -0,0 +1,168 @@ +* { + margin: 0; + padding: 0; + text-decoration: none; + box-sizing: border-box; +} + +html, body { + height: 100%; + overflow: hidden; +} + +.navbar { + font-family: Calibri, "Segoe UI", Candara, "Bitstream Vera Sans", sans-serif; + background-color: #6bafea; + color: black; + padding: 1rem; + height: 15%; +} + +.nav { + display: flex; + align-items: center; + justify-content: space-between; + position: relative; +} +.plantrip{ + display: flex; + justify-content: space-between; + gap: 2px; +} +.plantrip h1 { + font-size: 3rem; + color: white; +} +.plantrip img{ + width: 100px; + height: 70px; + margin-bottom: 15px; +} +.nav-links { + display: flex; + align-items: center; +} + +li { + list-style: none; + display: inline-block; +} + +li a { + font-size: 1.75rem; + margin-right: 50px; + font-weight: bold; + color: black; +} +.nav-button a { + padding: 10px; + border-radius: 10px; + background-color: black; + color: white; +} + +.burger-menu { + display: none; + font-size: 2rem; + background: none; + border: none; + cursor: pointer; +} + +.nav-toggle { + display: none; +} + +@media (max-width: 768px) { + .nav-links { + display: none; + flex-direction: column; + width: 100%; + text-align: center; + background-color: cyan; + position: absolute; + top: 70px; + left: 0; + z-index: 10; + } + + .nav-links li { + margin: 15px 0; + } + + .nav-toggle:checked + .burger-menu + .nav-links { + display: flex; + } + + .burger-menu { + display: block; + } +} + +.background { + width: 100%; + height: 100vh; /* Full viewport height */ + overflow: hidden; + position: relative; /* Ensure the navbar is above the background */ +} + +.background img { + width: 100%; + height: 100%; + object-fit: cover; /* Ensures the image covers the entire container */ + display: block; +} + +.form-container { + position: absolute; + top: 40%; /* Adjust this value as needed */ + left: 50%; + transform: translate(-50%, -50%); + z-index: 1; /* Ensure the form is above the image */ + width: 80%; + height: 60%; + max-width: 600px; + /* background-color: #add8e6e3; */ + padding: 20px; + border-radius: 8px; + /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); */ +} + + +form { + max-width: 600px; + margin: 20px auto; + background-color: #6fb3ed; + padding: 20px; + border-radius: 25px; + box-shadow: 10px 10px 8px 10px #3887cb; +} + +label { + display: block; + margin-bottom: 8px; +} + +input, +select { + width: calc(100% - 20px); /* Adjusted width to accommodate padding */ + padding: 10px; + margin-bottom: 16px; + border: 1px solid #ccc; + border-radius: 4px; + box-sizing: border-box; +} + +button { + background-color: #4CAF50; + color: #fff; + padding: 10px 20px; + border: none; + border-radius: 4px; + cursor: pointer; + font-size: 16px; +} + +button:hover { + background-color: #45a049; +} diff --git a/ronin-06roiCfSCiU-unsplash (1).jpg b/ronin-06roiCfSCiU-unsplash (1).jpg new file mode 100644 index 00000000..b7de87ed Binary files /dev/null and b/ronin-06roiCfSCiU-unsplash (1).jpg differ