generated from Code-Institute-Org/gitpod-full-template
-
Notifications
You must be signed in to change notification settings - Fork 1
/
home.html
116 lines (113 loc) · 6.08 KB
/
home.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css"
integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.2/css/all.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.2/css/v4-shims.css">
<link rel="stylesheet" href="assets/css/style.css">
<title>Home</title>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerMemory"
aria-controls="navbarTogglerMemory" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-left m-auto" href="home.html" id="logo">Mari Mems</a>
<div class="collapse navbar-collapse" id="navbarTogglerMemory">
<ul class="navbar-nav mr-auto mt-2 mt-lg-0">
<li class="nav-item active">
<a class="nav-link" href="home.html">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="howtoplay.html">How to play</a>
</li>
<li class="nav-item">
<a class="nav-link" href="levels.html">Play now</a>
</li>
</ul>
</div>
</nav>
<section>
<div class="container home-content">
<div class="row">
<div class="col who-why-title">
<h2>Who are we?</h2>
<p>Mari Mems was started by our founder Mari Amesrim who struggled to remember faces. Mari
researched and sought the help of professionals to improve her memory. Mari was able to use all
she had learned and turned it into a fun game for you share in her success. </p>
</div>
</div>
<div class="row">
<div class="col who-why-title">
<h2>Why train your
<i class="fa fa-brain"></i>?
</h2>
<!-- Content in this div is from https://blog.neuronation.com/en/what-is-brain-training-good-for#:~:text=Another%20study%20revealed%20that%20brain,Dr.&text=Belleville%20and%20her%20colleagues%20discovered,the%20first%20signs%20of%20dementia.
Read more button from (https://www.w3schools.com/howto/howto_js_read_more.asp)-->
<p>We like to keep our bodies active, but why don’t we invest the same amount of care in our minds?
Research shows that variation in our mental activity is the key to long-term success. It is well
known that physical exercise leads to a longer and happier life<span
id="ellipsis">...</span><span id="continue"> So, what about exercise for your brain?
<br>
<br>
According to the latest findings in Neuroscience, your brain reaches its peak performance at
16-25 years, and thereafter cognitive functioning declines. For most of us, these are not so
great news. But the better news is that no matter how old you are or what your profession
is, science shows that training with brain exercises can in fact benefit you. The key to
success? Mari Mems.
</span></p>
<button onclick="myFunction()" id="myBtn">Read more</button>
</div>
</div>
<div class="row">
<div class="col">
<h2>Jump straight in!</h2>
</div>
</div>
<div class="row">
<div class="d-grid gap-2 col-6 d-md-block">
<br>
<a class="btn jump-in-buttons" href="howtoplay.html" type="button">How to play</a>
<a class="btn jump-in-buttons" href="levels.html" type="button">Jump in</a>
</div>
</div>
</div>
</section>
<footer class="container-fluid footer">
<div class="row socials">
<div class="col social-media-footer">
<a target="_blank" href="https://www.facebook.com/">
<i class="fa fa-facebook social-media" aria-hidden="true"></i>
<span class="sr-only">Facebook</span>
</a>
</div>
<div class="col social-media-footer">
<a target="_blank" href="https://www.instagram.com/">
<i class="fa fa-instagram social-media" aria-hidden="true"></i>
<span class="sr-only">Instagram</span>
</a>
</div>
<div class="col social-media-footer">
<a target="_blank" href="https://twitter.com/">
<i class="fa fa-twitter social-media" aria-hidden="true"></i>
<span class="sr-only">Twitter</span>
</a>
</div>
</div>
</footer>
<script src="js/script.js"></script>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"
integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.min.js"
integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s"
crossorigin="anonymous"></script>
</body>
</html>