-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathhobby.html
129 lines (109 loc) · 5 KB
/
hobby.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
<!doctype html>
<html lang="en">
<head>
<title>Hobbies</title>
<meta name="Yeram Hwang" content="webpage">
<link rel="stylesheet" href="css/styles.css?v=1.0">
<meta charset="utf-8">
<!-- Bootstrap core CSS -->
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom fonts -->
<link href="vendor/fontawesome-free/css/all.min.css" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic" rel="stylesheet" type="text/css">
<!-- Plugin CSS -->
<link href="vendor/magnific-popup/magnific-popup.css" rel="stylesheet" type="text/css">
<!-- Custom styles -->
<link href="css/freelancer.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-expand-lg bg-secondary fixed-top text-uppercase" id="mainNav">
<div class="container">
<a class="navbar-brand js-scroll-trigger" href="index.html" target="_blank">Yeram's WebPage</a>
<button class="navbar-toggler navbar-toggler-right text-uppercase bg-primary text-white rounded" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
Menu
<i class="fas fa-bars"></i>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item mx-0 mx-lg-1">
<a class="nav-link py-3 px-0 px-lg-3 rounded js-scroll-trigger" href="#surfing">Surfing</a>
</li>
<li class="nav-item mx-0 mx-lg-1">
<a class="nav-link py-3 px-0 px-lg-3 rounded js-scroll-trigger" href="#running">Running</a>
</li>
<li class="nav-item mx-0 mx-lg-1">
<a class="nav-link py-3 px-0 px-lg-3 rounded js-scroll-trigger" href="#rockcli">Rock Climbing</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Header Section -->
<header class="masthead bg-primary text-white">
<div class="container">
<h1 class="text-uppercase mb-0 text-left text-white">Why Run?</h1>
<hr class="star-light">
<h1 class="text-uppercase mb-0 text-right">Why <span style = "color: #000000"><u>Not</u></span> Run?</h1>
</div>
</header>
<!-- Surfing Section -->
<section class="about" id="surfing">
<h2 class="text-uppercase mb-0 text-left"> Surfing~~!</h2>
<hr class="star-dark mb-5" align="left">
<div class="container">
<iframe width="100%" height="400px" src="https://www.youtube.com/embed/D_zz7XTvURo" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</section>
<!-- Running Section -->
<section class="bg-primary text-white mb-0" id="running">
<h2 class="text-uppercase mb-0 text-right">Running~~! </h2>
<hr class="star-light mb-5">
</section>
<!-- Rock Climbing Section -->
<section class="rockcli" id="rockcli">
<h2 class="text-uppercase mb-0 text-left"> Rock Climbing~~!</h2>
<hr class="star-dark mb-5" align="left">
</section>
<!-- Footer Section-->
<footer class="footer text-center">
<div class="container">
<div class="row">
<div class="col-md-4 mb-5 mb-lg-0">
<h4 class="text-uppercase mb-4">Location</h4>
<p class="lead mb-0">Los Angeles, CA 90057</p>
</div>
<div class="col-md-4">
<h4 class="text-uppercase mb-4">Email</h4>
<p class="lead mb-0">[email protected]</p>
</div>
</div>
</div>
</footer>
<div class="copyright py-4 text-center text-white">
<div class="container">
<details>
<summary>Copyright © Yeram Hwang 2019</summary>
</details>
</div>
</div>
<!-- Scroll to Top Button (Only visible on small and extra-small screen sizes) -->
<div class="scroll-to-top d-lg-none position-fixed ">
<a class="js-scroll-trigger d-block text-center text-white rounded" href="#page-top">
<i class="fa fa-chevron-up"></i>
</a>
</div>
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- Plugin JavaScript -->
<script src="vendor/jquery-easing/jquery.easing.min.js"></script>
<script src="vendor/magnific-popup/jquery.magnific-popup.min.js"></script>
<!-- Contact Form JavaScript -->
<script src="js/jqBootstrapValidation.js"></script>
<script src="js/contact_me.js"></script>
<!-- Custom scripts for this template -->
<script src="js/freelancer.js"></script>
</body>
</html>