-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
137 lines (127 loc) · 5.79 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Kodah</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Josefin+Slab:wght@100;400&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&display=swap" rel="stylesheet">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header class="header">
<div class="container">
<div class="header_wrapper">
<div class="header__logo">
<p>Kodah</p>
</div>
<div class="header__menu">
<i class="fa-solid fa-bars bar"></i>
<ul>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
</div>
</div>
</header>
<section class="travel">
<div class="container">
<div class="travel_wrapper">
<div class="travel__image">
<img src="./img/jeremy-bishop-unsplash-AQE0OE3RxghDQBq3.avif" alt="">
</div>
<div class="travel__text">
<p class="travel__text--title">Traveling around the globe</p>
<p class="travel__text--main">& sharing stories</p>
<p class="travel__text--description">The world is filled with endless beauty and adventures. It's my dream to explore every corner of this incredible planet. Join me on my journey across roads, seas, and skies.</p>
</div>
</div>
</div>
</section>
<section class="routes">
<div class="container">
<div class="routes_wrapper">
<div class="routes__title">
<h2 class="routes__title--text">My most recent routes</h2>
</div>
<div class="routes__items">
<div class="routes__items--card">
<img src="./img/horses.webp" alt="">
<h3 class="routes__items--card__title">Iceland</h3>
<div class="routes__items--card__description">
<p class="routes__items--card__description--first">Nature at its most raw.</p>
<p class="routes__items--card__description--second">6/30/20211 min read</p>
</div>
</div>
<div class="routes__items--card">
<img src="./img/canyon.webp" alt="">
<h3 class="routes__items--card__title">Grand Canyon & Utah</h3>
<div class="routes__items--card__description">
<p class="routes__items--card__description--first">
Rugged mountains and riverbeds.</p>
<p class="routes__items--card__description--second">6/30/20211 min read</p>
</div>
</div>
<div class="routes__items--card">
<img src="./img/lake.avif" alt="">
<h3 class="routes__items--card__title">Lake Tahoe</h3>
<div class="routes__items--card__description">
<p class="routes__items--card__description--first">
Freshwater lake adventures.
</p>
<p class="routes__items--card__description--second">6/30/20211 min read</p>
</div>
</div>
<div class="routes__items--card">
<img src="./img/tours.webp" alt="">
<h3 class="routes__items--card__title">Group tours
</h3>
<div class="routes__items--card__description">
<p class="routes__items--card__description--first">
Life is more fun when you have people to share it with.
</p>
<p class="routes__items--card__description--second">6/30/20211 min read</p>
</div>
</div>
</div>
<div class="routes__button">
<button>All stories here</button>
</div>
</div>
</section>
<section class="pictures">
<div class="container">
<div class="pictures_wrapper">
<img src="./img/hill.avif" alt="">
<img src="./img/home.avif" alt="">
<img src="./img/tree.avif" alt="">
<img src="./img/mountain.avif" alt="">
</div>
</div>
</section>
<footer class="footer">
<div class="container">
<div class="footer_wrapper">
<div class="footer__input">
<label>Subscribe to my newsletter here *</label>
<input type="text" placeholder="Your email address">
<button type="submit">Submit</button>
</div>
<div class="footer__social">
<i class="fa-brands fa-twitter"></i>
<i class="fa-brands fa-facebook"></i>
<i class="fa-brands fa-instagram"></i>
</div>
</div>
</div>
</footer>
</body>
</html>