This repository has been archived by the owner on Jul 18, 2019. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
166 lines (165 loc) · 7.87 KB
/
index.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
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Cosa Nostra</title>
<link rel="stylesheet" href="dist/style.min.css">
</head>
<body>
<header class="hero">
<a href="index.html" class="logo">
<h1>Cosa Nostra</h1>
</a>
<h2 class="lead">
Experience 20’s gangster’s lifestyle in the real world
</h2>
<div class="animation-wrapper">
<img src="dist/images/hero-phone.png" class="phone">
<img src="dist/images/hero-ss1.png" class="ss1">
<img src="dist/images/hero-ss2.png" class="ss2">
</div>
<div class="links">
<a href="#support" class="support">Support App</a>
<a href="#" class="facebook icon-facebook" target="_blank">Stayzest on Facebook</a>
</div>
</header>
<section class="description">
<div class="container">
<a href="#" class="download-btn" target="_blank">
<img src="dist/images/apple-store-badge.svg" alt="Download on the Apple Store">
<span class="label">
<strong>Coming</strong> <br>
Soon
</span>
</a>
<div class="left">
<h3 class="title">
<small>The game</small>
Cosa Nostra
</h3>
<p class="text-content">This location-based game allows you to take over real-world establishments to build your gangster empire and become the kingpin of your city.</p>
<p class="text-content">Build your strategy, battle agains other players to become more experienced and wealthier, hire thugs or steal from them.</p>
<p class="outro">
Every place you conquer is connected to the real place by <strong>Foursquare<sup>tm</sup></strong>
</p>
<p class="outro">
The more popular a place is the more money it will generate to you.
</p>
</div>
<img src="dist/images/description-phone.png" class="phone">
</div>
</section>
<section class="video">
<h3 class="title">See the map of your own town in a diferente perspective.</h3>
<p class="text-content">Every place you can get into is a deal you may fight for.</p>
<a href="https://www.youtube.com/watch?v=SfbbhshhBQ4" class="button" target="_blank">
<i class="icon-play-outline"></i>
Watch our video
</a>
<div class="video-wrapper">
<video class="embed" autoplay loop>
<source src="dist/videos/video-preview.webm" type="video/webm">
<source src="dist/videos/video-preview.mp4" type="video/mp4">
</video>
</div>
</section>
<div id="video-modal" class="iziModal"></div>
<section class="features">
<h3 class="title">
Cosa Nostra
<strong>Features</strong>
</h3>
<ul class="feat-list">
<li class="feat">
<img src="dist/images/features/conquer.svg" alt="Conquer">
<h4>Conquer</h4>
<p>Earn the money, conquer your business and fight for the respect!</p>
</li>
<li class="feat">
<img src="dist/images/features/recruit.svg" alt="Recruit">
<h4>Recruit</h4>
<p>Not really in a popular area? Now's a great time to recruit some new henchmen that might be near you, they surely can help you out.</p>
</li>
<li class="feat">
<img src="dist/images/features/skills.svg" alt="Skills">
<h4>Skills</h4>
<p>Build-up your character as you gain experience focusing in the skills you find more important for your strategy.</p>
</li>
<li class="feat">
<img src="dist/images/features/training.svg" alt="Training">
<h4>Training</h4>
<p>Let your henchmen hit the gym or the shooting range, training them to enhance your chances of winning.</p>
</li>
<li class="feat">
<img src="dist/images/features/interact.svg" alt="Interact">
<h4>Interact</h4>
<p>Take over the world by going outside, or do that within the confort of your home. It's your call.</p>
</li>
<li class="feat">
<img src="dist/images/features/competition.svg" alt="Compete">
<h4>Compete</h4>
<p>Earn your friends', your town's or even the world's respect.</p>
</li>
</ul>
<div class="animation-wrapper">
<img src="dist/images/gangster-1.png">
<img src="dist/images/gangster-2.png">
<img src="dist/images/gangster-3.png">
</div>
</section>
<section class="download">
<div class="container">
<div class="left">
<h3 class="title">
<strong>Download</strong>
For Free
</h3>
<p class="text-content">We're launching Cosa Nostra in a few countries at first so we can monitor everything, scale properly and avoid downtimes. We are also working day and night to bring this world of adventure to everyone as soon as possible.</p>
<a href="#" class="download-btn" target="_blank">
<img src="dist/images/apple-store-badge.svg" alt="Download on the Apple Store">
</a>
</div>
<div class="animation-wrapper">
<img src="dist/images/gangster-1.png">
<img src="dist/images/gangster-2.png">
<img src="dist/images/gangster-3.png">
</div>
</div>
</section>
<section id="support" class="support-form">
<h3 class="title">App Support</h3>
<h4 class="subtitle">Say hello!</h4>
<form onsubmit="return false">
<div class="input-field">
<input type="text" name="fullName" id="full-name" required>
<label for="full-name">Full name</label>
</div>
<div class="input-field">
<input type="email" name="email" id="email" required>
<label for="email">E-mail</label>
</div>
<div class="input-field">
<textarea name="message" id="message" required></textarea>
<label for="message">Message</label>
</div>
<button type="submit" class="submit-btn">Send</button>
</form>
<div id="success-modal" class="iziModal"></div>
<div id="error-modal" class="iziModal"></div>
</section>
<footer class="footer">
<p class="feedback">
Give us your
<a href="#" target="_blank">feedback</a>
about Cosa Nostra
</p>
<a href="#" class="stayzest" target="_blank">
Stayzest Technologies
</a>
<a href="#" target="_blank" class="facebook icon-facebook"></a>
</footer>
<script src="dist/scripts.min.js"></script>
</body>
</html>