-
Notifications
You must be signed in to change notification settings - Fork 0
/
about-music.html
150 lines (149 loc) · 5.47 KB
/
about-music.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
138
139
140
141
142
143
144
145
146
147
148
149
150
<!doctype html>
<html>
<head>
<title>Noah - Music</title>
<meta charset="utf-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, user-scalable=no"
/>
<meta name="description" content="Noah's Music | Choir • Guitar" />
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="icon" href="./images/icons/favicon_50_w.webp" />
</head>
<body class="is-preload">
<!-- Wrapper -->
<div id="wrapper">
<div id="headers"></div>
<link
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/3.2.1/css/font-awesome.min.css"
media="all"
rel="stylesheet"
type="text/css"
lazyload
/>
<!-- Main -->
<div id="main">
<div class="inner subpage">
<h2 class="align-center subpage">Music</h2>
<div class="row reverse_on_desktop">
<div class="half_image_column">
<img
srcset="
./images/about/music/choir_400_w.webp 400w,
./images/about/music/choir_600_w.webp 800w
"
sizes="(max-width: 980px) 100vw, 55vw"
loading="lazy"
decoding="async"
src="./images/about/music/choir.jpeg"
alt="Choir"
/>
</div>
<div class="half_text_column">
<h3>Singing My Heart Out</h3>
<p>
After some basic piano lessons in elementary school, I joined
the school choir in seventh grade, paving the way for some
tremendous friendships. In high school, I started individual
voice lessons in order to better contribute to our group's
musicality. As a result, I was invited and contributed to the
ACDA All-Northwest chorus in eleventh grade. Our high school
choir routinely competed in the Oregon State Choir Championships
and our choir placed first when I was in eleventh grade.
</p>
</div>
</div>
<hr class="mobile_only" />
<div class="row">
<h3>Picking Up Guitar</h3>
<p>
In addition to singing, I started teaching myself guitar in tenth
grade. I found myself very attracted to fingerstyle techniques,
striving to play more individual notes rather than just chords and
embellishments. Especially when I chose to pursue my academic
goals instead of remaining in the school choir, guitar became a
very important therapeutic and recreational activity.
</p>
</div>
<div class="image_gallery">
<div class="half_column">
<img
srcset="
./images/about/music/guitar_400_w.webp 400w,
./images/about/music/guitar_2022_1000_w.webp 800w
"
sizes="(max-width: 980px) 100vw, 55vw"
loading="lazy"
decoding="async"
src="./images/about/music/guitar.JPG"
alt="Guitar"
/>
<img
srcset="
./images/about/music/guitar_2017_400_w.webp 400w,
./images/about/music/guitar_2017_1000_w.webp 800w
"
sizes="(max-width: 980px) 100vw, 55vw"
loading="lazy"
decoding="async"
src="./images/about/music/guitar_2017.jpg"
alt="Guitar (2017)"
/>
</div>
<div class="half_column">
<img
srcset="
./images/about/music/guitar_2016_400_w.webp 400w,
./images/about/music/guitar_2016_720_w.webp 800w
"
sizes="(max-width: 980px) 100vw, 55vw"
loading="lazy"
decoding="async"
src="./images/about/music/guitar_2016.jpg"
alt="Guitar (2016)"
/>
<img
srcset="
./images/about/music/guitar_fretboard_400_w.webp 400w,
./images/about/music/guitar_fretboard_1000_w.webp 800w
"
sizes="(max-width: 980px) 100vw, 55vw"
loading="lazy"
decoding="async"
src="./images/about/music/guitar_fretboard.JPG"
alt="Guitar Fretboard"
/>
</div>
</div>
</div>
<br />
<div class="row">
<a href="#top" style="margin-left: 90vw">
<img
srcset="
./images/icons/icon_scroll_up_25_w.webp 25w,
./images/icons/icon_scroll_up_50_w.webp 1000w
"
sizes="1.5em"
loading="lazy"
decoding="async"
src="./images/icons/icon_scroll_up.png"
class="scroll_icon"
alt="Scroll Up"
style="position: inherit"
/>
</a>
</div>
</div>
<!-- Footer -->
<footer id="footer"></footer>
</div>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/browser.min.js"></script>
<script src="assets/js/breakpoints.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>