-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
124 lines (112 loc) · 5.69 KB
/
Copy pathindex.html
File metadata and controls
124 lines (112 loc) · 5.69 KB
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
<!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>Gnagarnas fan club</title>
<link rel="stylesheet" href="./css/styles.css">
</head>
<body>
<div class="navbar">
<div class="nav-container">
<a class="logo" href="#">Gnagarnas <span>eviga</span> beskyddare</a>
<nav>
<ul class="primary-nav">
<li class="current"><a href="#">Minignagaren</a></li>
<li><a href="#">Gnagarkul</a></li>
<li><a href="#">Seriös fakta om gnagare</a></li>
</ul>
<ul class="secondary-nav">
<li><a href="#">Kontakta oss</a></li>
<li><a href="#">Bli medlem</a></li>
</ul>
</nav>
</div>
</div>
<section class="hero">
<div class="container">
<div class="left-col">
<p class="subhead">Gnagarnas storhetstid är kommen</p>
<h1>En förening som värnar om roliga gnagare</h1>
<div class="hero-cta">
<a href="#" class="primary-cta">Bli månadsgivare</a>
<a href="#" class="watch-propaganda-cta">Se en film</a>
</div>
</div>
<img src="https://images.pexels.com/photos/2189599/pexels-photo-2189599.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500" class="hero-img" alt="Brown rat">
</div>
</section>
<section class="features-section">
<div class="container">
<img src="https://images.pexels.com/photos/1010267/pexels-photo-1010267.jpeg?auto=compress&cs=tinysrgb&h=750&w=1260"
class="bakgrundsgnagare" alt="Background rodent">
<ul class="features-list">
<li class="features-list-item fli-header">Som medlem får du tillgång till:</li>
<li class="features-list-item">Exklusiv litteratur om gnagare</li>
<li class="features-list-item">Tre möten per år</li>
<li class="features-list-item">Gnagarfestival</li>
<li class="features-list-item">Skratta åt roliga gnagare med andra</li>
<li class="features-list-item">... och mycket mer</li>
</ul>
</div>
</section>
<section class="testamonial-section">
<div class="container">
<ul>
<li class="testamonial-item">
<img class="testamonial-pic" src="https://images.pexels.com/photos/614810/pexels-photo-614810.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500" alt="Serious person">
<blockquote>"Jag har alltid varit intresserad av gnagare. Att gå med i Gnagarnas eviga beskyddare var en självklarhet för mig och jag har inte ångrat det en sekund."</blockquote>
<cide>- Ludwag Edvolf</cide>
</li>
<li class="testamonial-item">
<img class="testamonial-pic" src="https://images.pexels.com/photos/8172857/pexels-photo-8172857.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500"
alt="Serious person">
<blockquote>"Jag gillar alla typer av gnagare. Särskillt de små rackarna för de ser så festliga ut. Tack vare gnagarnas eviga beskyddare har jag utökat min kunskap om de små liven och lärt känna både entusiaster och gnagare."</blockquote>
<cide>- Elviora Von Schpieselstrutsel</cide>
</li>
<li class="testamonial-item">
<img class="testamonial-pic" src="https://images.pexels.com/photos/4584095/pexels-photo-4584095.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500"
alt="Serious person">
<blockquote>"Jag tycker gnagare är ytterst underhållande. Gnagare roar mig."</blockquote>
<cide>- Maltin Doonosas</cide>
</li>
</ul>
</div>
</section>
<section class="contact-section">
<div class="container">
<div class="contact-left">
<h2>Contact</h2>
<form action="">
<label for="name">Name</label>
<input type="text" id="name" name="name">
<label for="email">Email</label>
<input type="email" id="email" name="email">
<label for="message">Message</label>
<textarea name="message" id="message" cols="30" rows="10"></textarea>
<input type="submit" class="send-message-cta" value="Send message">
</form>
</div>
<div class="contact-right">
<iframe
src="https://www.google.com/maps/embed?pb=!1m14!1m12!1m3!1d4519.153738026328!2d11.942286306029605!3d57.686623731405476!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!5e0!3m2!1ssv!2sno!4v1642753665163!5m2!1ssv!2sno"
width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy"></iframe>
</div>
</div>
</section>
<!---Tidigare synder-->
<div class="picture">
<img
src="https://images.pexels.com/photos/9496720/pexels-photo-9496720.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500">
</div>
<div class="textblocks">
<h1>Det här är grejer det!</h1>
<b>Alla våra medlemmar lever för gnagare.</b>
<br>
<b>Självklart kommer det finnas gnagare som äter olika grönsaker på våra möten!</b>
<br>
<b>Och glöm inte vårt motto "En rolig gnagarvideo livar alltid upp!"</b>
</div>
</body>
</html>