-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
executable file
·177 lines (162 loc) · 11.4 KB
/
index.html
File metadata and controls
executable file
·177 lines (162 loc) · 11.4 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
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Welcome to Lisa's Piano Lessons, where music meets passion. Discover our 20 years of experience teaching classical and rhythmic piano. Join our community for students of all ages. Enjoy our concerts, affordable prices, and quality education. Get started today!">
<title>Lisa's piano lessons</title>
<link rel="stylesheet" href="style.css">
<script defer src="script.js"></script>
</head>
<body>
<a tabindex="0" class="hidden"></a>
<a tabindex="0" class="skip-to-content" href="#toc">SKIP TO CONTENT</a>
<nav id="navigation">
<div id="nav-home">
<a class="logo" href="index.html" ><img src="assets/img/piano-logo.png" alt="The piano school's logo. Consists of piano keys and name."></a>
<a href="index.html" tabindex="-1" class="you-are-here">Lisa's Piano Lessons</a>
</div>
<div id="hamburger-wrapper">
<svg width="auto" height="auto" viewBox="0 0 600 468" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M33.3334 434H566.667" stroke="white" stroke-width="66.6667" stroke-linecap="round"/>
<path d="M33.3334 234H566.667" stroke="white" stroke-width="66.6667" stroke-linecap="round"/>
<path d="M33.3334 34H566.667" stroke="white" stroke-width="66.6667" stroke-linecap="round"/>
</svg>
<p>Menu</p>
</div>
<div id="mobile-dropdown-content">
<ul role ="menu">
<li role="menuitem" class="hidden-home"><a href="index.html" tabindex="0">Home</a></li>
<li role="menuitem"><a href="articles.html" tabindex="0">Articles</a></li>
<li role="menuitem" aria-haspopup="true">
<a href="teachers.html" id="menu-teachers" tabindex="0">Our teachers</a>
<ul role="menu" id="secondDropdown">
<li role="menuitem"><a href="teachers.html#teacher-uyen" tabindex="0" class="submenu-link">Uyen Lisa Nguyen</a></li>
<li role="menuitem"><a href="teachers.html#teacher-alex" tabindex="0" class="submenu-link">Alex Hartman</a></li>
</ul>
</li>
<li role="menuitem"><a href="resources.html" tabindex="0">Resources</a></li>
<li role="menuitem" aria-haspopup="true">
<a href="getstarted.html" tabindex="0" class="get-started-today-link">Get started today!</a>
</li>
</ul>
</div>
</nav>
<div class="hero">
<svg class="svg-title piano" width="100%" height="50%" viewBox="0 0 3328 724" fill="none" xmlns="http://www.w3.org/2000/svg">
<line x1="166.989" y1="5" x2="166.989" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="323.296" y1="5" x2="323.296" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="479.605" y1="5" x2="479.605" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="635.912" y1="5" x2="635.912" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="792.221" y1="5" x2="792.221" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="948.53" y1="5" x2="948.53" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="1104.84" y1="5" x2="1104.84" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="1261.15" y1="5" x2="1261.15" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="1417.45" y1="5" x2="1417.45" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="1573.76" y1="5" x2="1573.76" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="1730.07" y1="5" x2="1730.07" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="1886.38" y1="5" x2="1886.38" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="2042.69" y1="5" x2="2042.69" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="2199" y1="5" x2="2199" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="2355.3" y1="5" x2="2355.3" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="2511.61" y1="5" x2="2511.61" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="2667.92" y1="5" x2="2667.92" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="2824.23" y1="5" x2="2824.23" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="2980.54" y1="5" x2="2980.54" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<line x1="3136.85" y1="5" x2="3136.85" y2="719.045" stroke="#A2A8B5" stroke-width="9"/>
<path d="M136.44 5H228.805V470.925C228.805 472.582 227.461 473.925 225.805 473.925H139.44C137.784 473.925 136.44 472.582 136.44 470.925V5Z" fill="#A2A8B5"/>
<path d="M1219.94 5H1312.31V470.925C1312.31 472.582 1310.96 473.925 1309.31 473.925H1222.94C1221.28 473.925 1219.94 472.582 1219.94 470.925V5Z" fill="#A2A8B5"/>
<path d="M1383.03 6.14307H1475.39V472.068C1475.39 473.725 1474.05 475.068 1472.39 475.068H1386.03C1384.37 475.068 1383.03 473.725 1383.03 472.068V6.14307Z" fill="#A2A8B5"/>
<path d="M2314.1 5H2406.47V470.925C2406.47 472.582 2405.12 473.925 2403.47 473.925H2317.1C2315.44 473.925 2314.1 472.582 2314.1 470.925V5Z" fill="#A2A8B5"/>
<path d="M2942.89 5H3035.25V470.925C3035.25 472.582 3033.91 473.925 3032.25 473.925H2945.89C2944.23 473.925 2942.89 472.582 2942.89 470.925V5Z" fill="#A2A8B5"/>
<path d="M1852.28 5H1944.64V470.925C1944.64 472.582 1943.3 473.925 1941.64 473.925H1855.28C1853.62 473.925 1852.28 472.582 1852.28 470.925V5Z" fill="#A2A8B5"/>
<path d="M758.122 5H850.486V470.925C850.486 472.582 849.143 473.925 847.486 473.925H761.122C759.465 473.925 758.122 472.582 758.122 470.925V5Z" fill="#A2A8B5"/>
<path d="M2783.02 5H2875.39V470.925C2875.39 472.582 2874.05 473.925 2872.39 473.925H2786.02C2784.37 473.925 2783.02 472.582 2783.02 470.925V5Z" fill="#A2A8B5"/>
<path d="M1699.52 5H1791.89V470.925C1791.89 472.582 1790.54 473.925 1788.89 473.925H1702.52C1700.87 473.925 1699.52 472.582 1699.52 470.925V5Z" fill="#A2A8B5"/>
<path d="M605.366 5H697.73V470.925C697.73 472.582 696.387 473.925 694.73 473.925H608.366C606.709 473.925 605.366 472.582 605.366 470.925V5Z" fill="#A2A8B5"/>
<path d="M278.54 5H370.904V470.925C370.904 472.582 369.561 473.925 367.904 473.925H281.54C279.883 473.925 278.54 472.582 278.54 470.925V5Z" fill="#A2A8B5"/>
<path d="M2473.96 5H2566.32V470.925C2566.32 472.582 2564.98 473.925 2563.32 473.925H2476.96C2475.3 473.925 2473.96 472.582 2473.96 470.925V5Z" fill="#A2A8B5"/>
<path d="M3102.75 5H3195.11V470.925C3195.11 472.582 3193.77 473.925 3192.11 473.925H3105.75C3104.09 473.925 3102.75 472.582 3102.75 470.925V5Z" fill="#A2A8B5"/>
<path d="M2005.04 5H2097.4V470.925C2097.4 472.582 2096.06 473.925 2094.4 473.925H2008.04C2006.38 473.925 2005.04 472.582 2005.04 470.925V5Z" fill="#A2A8B5"/>
<path d="M907.325 5H999.689V470.925C999.689 472.582 998.346 473.925 996.689 473.925H910.325C908.668 473.925 907.325 472.582 907.325 470.925V5Z" fill="#A2A8B5"/>
<path d="M5 8C5 6.34314 6.34315 5 8 5H3320C3321.66 5 3323 6.34315 3323 8V719.045H5V8Z" stroke="#A2A8B5" stroke-width="9"/>
</svg>
<div class="hero-text homepage">
<h1 tabindex="0">Lisa's Piano Lessons</h1>
<p tabindex="0">Music for life</p>
<a id="start-today" href="getstarted.html">Start today</a>
</div>
</div>
<a id="explore" href="#toc">Learn more</a>
<main>
<div class="content-container">
<nav id="toc" class="toc">
<ol>
<li><h2 tabindex="0">Table of contents</h2></li>
<a href="#who-are-we" class="hidden">Skip table of content</a>
<li> <a href="#who-are-we">Who are we?</a> </li>
</ol>
</nav>
<div class="content">
<h3 id="who-are-we">Who are we?</h3>
<section tabindex="0" class="content-card-container">
<div class="content-card">
<img src="assets/img/playing-piano.jpeg" alt="This images shows hands playing a piano.">
</div>
<div class="content-card">
<p>We are a school that loves music! With more than 20 years of experience teaching piano, we really know our stuff. </p>
<p>We are based at Madla Bydelshus, midway between Amfi Madla and UiS, and we accept large and small students in addition to our department at Klepp.</p>
<p>Yes, that's right - we have something for everyone, whether you're a child, teenager or adult!</p>
</div>
</section>
<section tabindex="0" class="content-card-container">
<div class="content-card">
<p>We teach classical piano, rhythmic piano and even playing by notation/chords. And you can trust us when we say it's never boring with us.</p>
<p>We also have a large library with a variety of sheet music and training material in different styles and levels.</p>
</div>
<div class="content-card">
<img src="assets/img/music-notes.jpeg" alt="This images shows music notes.">
</div>
</section>
<section tabindex="0" class="content-card-container">
<div class="content-card">
<img src="assets/img/piano-steinway.png" alt="This images shows a Steinway Piano.">
</div>
<div class="content-card">
<p>And don't forget – we have fantastic equipment! At our school you will find a concert piano.</p>
<p>And as if that wasn't enough, we have two concert performances a year! There is a summer concert and a Christmas concert, and you can be sure that it is always a great experience for everyone who attends.</p>
<p>Our private music school has taught piano at an affordable price, quality and reputation in the community for more than 20 years.</p>
</div>
</section>
</div>
</div>
</main>
<footer>
<div class="footer-card" tabindex="0">
<h4 class="footer-heading">Prices</h4>
<p>20min. kr 198</p>
<p>40min. kr 360</p>
<p>Free trial session</p>
</div>
<div class="footer-card" tabindex="0">
<h4 class="footer-heading">Madla Bydelshus</h4>
<p>Åsta Kongsmor Gate 20 4044 Hafrsfjord
</p>
<p>Monday-Thursday kl 14.00-20.00</p>
<p>Free parking</p>
</div>
<div class="footer-card" tabindex="0">
<h4 class="footer-heading">Klepp</h4>
<p>Øksnevarden 31 4351 Klepp
</p>
<p>Friday-Sunday kl 10.00-21.00</p>
<p>Free parking</p>
</div>
<div class="footer-card" tabindex="0">
<h4 class="footer-heading">Contact</h4>
<p>Phone: 12345678</p>
<p>E-mail: lisa-piano-lessons@email.com</p>
</div>
</footer>
</body>
</html>