-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
253 lines (195 loc) · 7.55 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
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
<!doctype html>
<!--[if lt IE 9]><html class="ie"><![endif]-->
<!--[if gte IE 9]><!--><html><!--<![endif]-->
<head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<title>14islands</title>
<meta name="description" content="Pushing the web forward."/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,400,300,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/style.css">
<!--[if lt IE 9]>
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- <link rel="shortcut icon" href="assets/favicon.png"/>
<link rel="apple-touch-icon" sizes="114x114" href="assets/icon.png"/> -->
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-31151822-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body lang="en">
<header>
</header>
<div id="intro">
<div class="column-wide">
<h1>
At <b>14islands</b> we build <b>elegant</b> websites using <b>modern</b> web standards and <b>cutting edge</b> technologies.
</h1>
<h2>
<i>And yes, we do responsive web design.</i>
</h2>
<h3 class="contact">
Say <a href="mailto:[email protected]" title="Send us an email to say hello!">[email protected]</a>
</h3>
</div>
</div>
<div id="work">
<article class="wrapper">
<h2><span>Featured Work</span></h2>
<section class="column-third">
<figure>
<div class="border">
<img src="img/work/work-chrome-racer.jpg" alt="Line up mobile screens to create a race track and enjoy music on all devices at once." >
</div>
<figcaption>
<h4>Google Chrome Racer</h4>
<p>Line-up screens to create a race track, enjoy music on all devices at once. <a href="https://mobile.888sport.com">Visit site.</a></p>
</figcaption>
</figure>
</section>
<section class="column-third">
<figure>
<div class="border">
<img src="img/work/work-kambi.jpg" alt="Responsive sports betting web application" >
</div>
<figcaption>
<h4>Kambi Sports Solutions</h4>
<p>Responsive sports betting web application, built for mobiles, tablets and desktops. <a href="https://mobile.888sport.com/en/#events/live">Visit site.</a></p>
</figcaption>
</figure>
</section>
<section class="column-third">
<figure>
<div class="border">
<img src="img/work/work-bandcontroller.jpg" alt="Band Controller Web Audio API Chrome Experiment" >
</div>
<figcaption>
<h4>Band Controller</h4>
<p>A groundbreaking interactive music experience, built using the Web Audio API. <a href="http://www.bandcontroller.se">Visit site.</a></p>
</figcaption>
</figure>
</section>
</article>
</div>
<article id="about" class="inverted">
<section class="wrapper" >
<div class="column-two about-text">
<h2>About Us</h2>
<p>
<b>14islands</b> is a company specialized in front-end web development. We are a small team of two dedicated developers, both with more than 10 years of experience in the web industry, and have worked as lead developers for some of the worlds leading brands.
</p>
<p>
We are happy to take full responsibility of your web production or work as consultants with your team.
</p>
<p>
Are you working on something cool? <a href="#contact-us">Yes!</a>
</p>
</div>
<div class="column-third">
<div class="quotes-3d vertical">
<blockquote class="paul">
<div>
<p>World-class talent combined with knowledge and a friendly attitude, you're doing yourself a huge favour by working with them.</p>
<footer> – Paul Lewis, Google Chrome team</footer>
</div>
</blockquote>
<blockquote class="paul">
<div>
<p>Hjörtur & David are legends in their own respective professional fields. I would highly recommend their services to anyone I know.</p>
<footer> – Kris Brady, Designer at Facebook</footer>
</div>
</blockquote>
<blockquote class="thodoris">
<div>
<p>Super talented developers with an eye for perfection. Don't hesitate to work with them!</p>
<footer> – Thodoris Tsiridis, Spotify</footer>
</div>
</blockquote>
<blockquote class="hakim">
<div>
<p>These guys are solid and always on top of their game.</p>
<footer> – Hakim El Hattab, Qwiki</footer>
</div>
</blockquote>
</div>
</div>
</section>
<section class="wrapper column-wide webuild" >
<h3>We build</h3>
<div class="we-build-responsive column-third">
<h4 ><span>Responsive Interfaces</span></h4>
<img src="img/about/we-build-responsive.png">
</div>
<div class="we-build-interactive column-third">
<h4><span>Interactive Frontends</span></h4>
<img src="img/about/we-build-interactive.png">
</div>
<div class="we-build-mobile column-third">
<h4><span>Mobile Web Apps</span></h4>
<img src="img/about/we-build-mobile.png">
</div>
</section>
<section class="wrapper" >
<div class="column-fluid" >
<h3>We Are</h3>
<ul class="about-list">
<li><p>HTML5 Specialists</p></li>
<li><p>Creative Developers</p></li>
<li><p>Javascript & CSS nerds</p></li>
</ul>
</div>
<div class="column-fluid" >
<h3>We Care</h3>
<ul class="about-list">
<li><p>Quality</p></li>
<li><p>User Experience</p></li>
<li><p>Honesty</p></li>
</ul>
</div>
<div class="column-fluid" >
<h3>We Love</h3>
<ul class="about-list">
<li><p>Giving talks & workshops on web development</p></li>
<li><p>Experimenting with emerging technologies</p></li>
<li><p>Giving back to the community</p></li>
</ul>
</div>
</section>
</article>
<!--article class="wrapper">
<section class="column-two">
<h3>Latest from the Blog</h3>
</section>
<section class="column-third">
<h3>Activity feed</h3>
</section>
</article-->
<footer id="contact-us" class="wrapper column-wide">
<h1>We'd love to hear from you!</h1>
<a href="mailto:[email protected]">Send email</a> -
<a href="http://twitter.com/#!/14islands" title="Follow 14islands on Twitter">Twitter</a> -
<a href="http://www.facebook.com/14islands" title="Follow 14islands on Facebook">Facebook</a> -
<a href="http://14islands.tumblr.com/" title="Follow 14islands on Tumblr">Blog</a>
</footer>
<!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if offline -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.2.min.js"><\/script>')</script>
<script src="js/src/quotes3D.js"></script>
<script>
var q = new Quotes3D( $('.quotes-3d') );
// skip iphone address bar
/mobile/i.test(navigator.userAgent) && !location.hash && setTimeout(function () {
if (!pageYOffset) window.scrollTo(0, 1);
}, 1000);
</script>
</body>
</html>