-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
executable file
·424 lines (424 loc) · 22.8 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
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
<!DOCTYPE html>
<html>
<head>
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible"/>
<meta charset="utf-8"/>
<meta content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"
name="viewport"/>
<title>Beta Corp.</title>
<link href="//fonts.googleapis.com/css?family=Lato:300,400" rel="stylesheet" type="text/css"/>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
<link href="/images/apple-icon-57x57.png" rel="apple-touch-icon" sizes="57x57"/>
<link href="/images/apple-icon-60x60.png" rel="apple-touch-icon" sizes="60x60"/>
<link href="/images/apple-icon-72x72.png" rel="apple-touch-icon" sizes="72x72"/>
<link href="/images/apple-icon-76x76.png" rel="apple-touch-icon" sizes="76x76"/>
<link href="/images/apple-icon-114x114.png" rel="apple-touch-icon" sizes="114x114"/>
<link href="/images/apple-icon-120x120.png" rel="apple-touch-icon" sizes="120x120"/>
<link href="/images/apple-icon-144x144.png" rel="apple-touch-icon" sizes="144x144"/>
<link href="/images/apple-icon-152x152.png" rel="apple-touch-icon" sizes="152x152"/>
<link href="/images/apple-icon-180x180.png" rel="apple-touch-icon" sizes="180x180"/>
<link href="/images/android-icon-192x192.png" rel="icon" sizes="192x192" type="image/png"/>
<link href="/images/favicon-32x32.png" rel="icon" sizes="32x32" type="image/png"/>
<link href="/images/favicon-96x96.png" rel="icon" sizes="96x96" type="image/png"/>
<link href="/images/favicon-16x16.png" rel="icon" sizes="16x16" type="image/png"/>
<link href="/stylesheets/site.css" rel="stylesheet"/>
<script src="/javascripts/carousel.js"></script>
</head>
<body class="index">
<nav class="main-header">
<div class="container">
<div class="row align-items-center">
<div class="col-12 col-md text-center text-md-left">
<a class="d-inline-block d-lg-block" href="/">
<img src="/images/logo_white.svg" class="d-block logo" alt="Logo white"/>
</a>
</div>
<div class="col-12 col-md text-center text-md-right">
<div class="d-block space-t1 d-md-none"></div>
<a class="main-header__link" href="/">Home</a>
<a class="main-header__link" href="/panopta.html">Panopta</a>
<a class="main-header__link" href="/rails_maintenance.html">Ruby on Rails Onderhoud</a>
<a class="main-header__link" href="/#contact">Contact</a>
</div>
</div>
</div>
</nav>
<div class="hero">
<div class="container h100">
<div class="carousel">
<div class="carousel__container">
<div class="carousel__item carousel__item--active">
<div class="carousel__item__image" style="background-image: url('/images/stadsring.jpg')"></div>
<div class="carousel__item__description">
<img src="/images/logo.svg" width="50" class="d-block space-b1" alt="Logo"/>
<p class="paragraph space-b0">Meedenken, kwaliteit leveren en vooral plezier maken is ons motto. Dat ziet u
terug in onze software.
</p>
</div>
</div>
<div class="carousel__item">
<div class="carousel__item__image" style="background-image: url('/images/panopta.png')"></div>
<div class="carousel__item__description">
<img src="/images/panopta_logo.svg" width="115" class="d-block space-b1" alt="Panopta logo"/>
<p class="paragraph">AVG/GDPR zonder hoofdpijn: eenvoudig, snel en correct data-incidenten afhandelen.</p>
<a class="button button--dark" href="/panopta.html">Lees Meer</a>
</div>
</div>
<div class="carousel__item">
<div class="carousel__item__image" style="background-image: url('/images/secuform.png')"></div>
<div class="carousel__item__description">
<img src="/images/secuform_logo.svg" width="115" class="d-block space-b1" alt="Secuform logo"/>
<p class="paragraph">Veilig cliënten inschrijfformulier voor uw website.</p>
<a class="button button--dark" href="/secuform.html">Lees Meer</a>
</div>
</div>
</div>
<div class="carousel__pages">
<div class="carousel__page carousel__page--active" data-index="0"></div>
<div class="carousel__page" data-index="1"></div>
<div class="carousel__page" data-index="2"></div>
</div>
</div>
</div>
</div>
<section class="section section--dark">
<div class="container">
<div class="row justify-content-center color-text-on-dark">
<div class="col-md-10">
<div class="text-center"><h2 class="heading color-body">Over Ons</h2></div>
<div class="row space-b2">
<div class="col-12 col-md-6">
<p class="paragraph">Beta Corp. (afgekort van Beta Coöperatie) is een samenwerkingsverband van een groep
freelancers die samen software ontwikkelen voor bedrijven en instellingen. Onze focus ligt op
hoog-technische prototypes en betrouwbare, flexibele infrastructuurprojecten. Productontwikkeling is onze
specialiteit.
</p>
<p class="paragraph space-b0">Veel van onze projecten voeren wij uit in de financiële sector: crowdfunding,
mobiele betalingen, obligatie-uitgiftesystemen en betalingsplatformen.
</p>
</div>
<div class="col-12 col-md-6">
<p class="paragraph">Ook zijn wij in de zorgsector actief. Daarbij werken wij op het snijvlak van security
en privacy: inzage van zorgdossiers voor patiënten, privacy auditing tools en document-encryptie.
</p>
<p class="paragraph space-b0">Klanten van ons zijn onder andere: ABN Amro, Mijndomein, Nedap, NPO en
Ericsson.
</p>
</div>
</div>
</div>
</div>
<div class="row justify-content-center color-text-on-dark">
<div class="col-md-8">
<p class="paragraph space-b0 color-body text-center">Omdat Beta Corp. een samenwerkingsverband is, kunnen wij de
continuïteit, hosting en support waarborgen van de door ons ontwikkelde systemen.
</p>
</div>
</div>
</div>
</section>
<section class="section section--shadow">
<div class="container">
<div class="row">
<div class="col">
<div class="text-center"><h2 class="heading center color-em">Ons Team</h2></div>
<div class="row">
<div class="col-12 col-md">
<div class="teammember">
<div class="teammember__image" style="background-image: url('/images/gerard.png')"></div>
<h2 class="heading heading--s heading--cap color-em">Gerard</h2>
<p class="paragraph">Ik richtte mijn bedrijf op in 2005 en in 2017 evolueerde dit in de coöperatie Beta
Corp. Ik ben een echte prototyper en bouw graag een langdurige relatie op met de klant.
</p>
</div>
</div>
<div class="col-12 col-md">
<div class="teammember">
<div class="teammember__image" style="background-image: url('/images/bart.png')"></div>
<h2 class="heading heading--s heading--cap color-em">Bart</h2>
<p class="paragraph">Ik ben een software engineer, beveiligingsdeskundige en prototyper. Ik heb een
masterdiploma in informatietechnologie en een minor in biomedische technologie; beide van de
Universiteit Twente, Nederland. Daarnaast heb ik ook een CISSP-beveiligingstitel.
</p>
</div>
</div>
<div class="col-12 col-md">
<div class="teammember">
<div class="teammember__image" style="background-image: url('/images/wes.png')"></div>
<h2 class="heading heading--s heading--cap color-em">Wes</h2>
<p class="paragraph">Ik ben gespecialiseerd in het oplossen van complexe problemen. Mijn specialiteit is
het bouwen van back-endsystemen die hoge capaciteit vereisen. Daarnaast ben ik momenteel druk bezig met
de AVG/GDPR privacy wetgeving.
</p>
</div>
</div>
<div class="col-12 col-md">
<div class="teammember">
<div class="teammember__image" style="background-image: url('/images/marcel.png')"></div>
<h2 class="heading heading--s heading--cap color-em">Marcel</h2>
<p class="paragraph">Ik ben een software-specialist en ontwerp backend-applicaties die complexe problemen
voor klanten oplossen. Daarnaast ben ik Ops-engineer die systemen inricht en beheert met Amazon Web
Services, Docker en Kubernetes.
</p>
</div>
</div>
<div class="col-12 col-md">
<div class="teammember">
<div class="teammember__image" style="background-image: url('/images/diederick.png')"></div>
<h2 class="heading heading--s heading--cap color-em">Diederick</h2>
<p class="paragraph">Ik ben een all round software engineer die zich graag richt op de frontend van
software. Mijn specialiteit is om de vraag en wensen van de klant helder te krijgen en deze te
realiseren door middel van gebruiksvriendelijke user interfaces.
</p>
</div>
</div>
</div>
<div class="row d-none d-md-flex">
<div class="col-md">
<p class="paragraph space-b0">
<a class="link link--social space-r025 footer-logo" href="https://github.com/smeevil" target="_blank"
title="Github">
<img src="/images/github.svg" width="20" class="d-block" alt="Github"/>
</a>
<a class="link link--social space-r025 footer-logo" href="https://www.linkedin.com/in/smeevil/"
target="_blank" title="LinkedIn">
<img src="/images/linkedin.svg" width="20" class="d-block" alt="Linkedin"/>
</a>
<a class="link link--social space-r025 footer-logo" href="https://twitter.com/smeevil" target="_blank"
title="Twitter">
<img src="/images/twitter.svg" width="20" class="d-block" alt="Twitter"/>
</a>
<a class="link link--social footer-logo" href="https://govannon.nl" target="_blank" title="Website">
<img src="/images/website.svg" width="20" class="d-block" alt="Website"/>
</a>
</p>
</div>
<div class="col-md">
<p class="paragraph space-b0">
<a class="link link--social space-r025 footer-logo" href="https://github.com/barttenbrinke"
target="_blank" title="Github">
<img src="/images/github.svg" width="20" class="d-block" alt="Github"/>
</a>
<a class="link link--social space-r025 footer-logo" href="https://www.linkedin.com/in/bmtenbrinke/"
target="_blank" title="LinkedIn">
<img src="/images/linkedin.svg" width="20" class="d-block" alt="Linkedin"/>
</a>
<a class="link link--social space-r025 footer-logo" href="http://twitter.com/barttenbrinke"
target="_blank" title="Twitter">
<img src="/images/twitter.svg" width="20" class="d-block" alt="Twitter"/>
</a>
<a class="link link--social footer-logo" href="http://www.retrosync.com/" target="_blank" title="Website">
<img src="/images/website.svg" width="20" class="d-block" alt="Website"/>
</a>
</p>
</div>
<div class="col-md">
<p class="paragraph space-b0">
<a class="link link--social space-r025 footer-logo" href="https://github.com/narnach" target="_blank"
title="Github">
<img src="/images/github.svg" width="20" class="d-block" alt="Github"/>
</a>
<a class="link link--social space-r025 footer-logo" href="http://www.linkedin.com/in/wesoldenbeuving"
target="_blank" title="LinkedIn">
<img src="/images/linkedin.svg" width="20" class="d-block" alt="Linkedin"/>
</a>
<a class="link link--social space-r025 footer-logo" href="http://twitter.com/narnach" target="_blank"
title="Twitter">
<img src="/images/twitter.svg" width="20" class="d-block" alt="Twitter"/>
</a>
<a class="link link--social footer-logo" href="http://narnach.com" target="_blank" title="Website">
<img src="/images/website.svg" width="20" class="d-block" alt="Website"/>
</a>
</p>
</div>
<div class="col-md">
<p class="paragraph space-b0">
<a class="link link--social space-r025 footer-logo" href="https://github.com/marceldegraaf"
target="_blank" title="Github">
<img src="/images/github.svg" width="20" class="d-block" alt="Github"/>
</a>
<a class="link link--social space-r025 footer-logo" href="https://www.linkedin.com/in/marceldegraaf/"
target="_blank" title="LinkedIn">
<img src="/images/linkedin.svg" width="20" class="d-block" alt="Linkedin"/>
</a>
<a class="link link--social space-r025 footer-logo" href="http://twitter.com/marceldegraaf"
target="_blank" title="Twitter">
<img src="/images/twitter.svg" width="20" class="d-block" alt="Twitter"/>
</a>
<a class="link link--social footer-logo" href="https://syntaxis.io" target="_blank" title="Website">
<img src="/images/website.svg" width="20" class="d-block" alt="Website"/>
</a>
</p>
</div>
<div class="col-md">
<p class="paragraph space-b0">
<a class="link link--social space-r025 footer-logo" href="https://github.com/dkln" target="_blank"
title="Github">
<img src="/images/github.svg" width="20" class="d-block" alt="Github"/>
</a>
<a class="link link--social space-r025 footer-logo"
href="https://www.linkedin.com/in/diederick-lawson-0b250a152/" target="_blank" title="LinkedIn">
<img src="/images/linkedin.svg" width="20" class="d-block" alt="Linkedin"/>
</a>
<a class="link link--social space-r025 footer-logo" href="http://twitter.com/dkln" target="_blank"
title="Twitter">
<img src="/images/twitter.svg" width="20" class="d-block" alt="Twitter"/>
</a>
<a class="link link--social footer-logo" href="http://altovista.nl" target="_blank" title="Website">
<img src="/images/website.svg" width="20" class="d-block" alt="Website"/>
</a>
</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="section section--dark">
<div class="container">
<div class="row justify-content-center color-text-on-dark">
<div class="col-md-10">
<div class="text-center"><h2 class="heading color-body">Portfolio</h2></div>
<div class="row">
<div class="col-12 col-md-4">
<div class="portfolio__image" style="background-image: url('/images/panopta.png')"></div>
<h2 class="heading heading--s portfolio__title color-body">Panopta</h2>
<p class="paragraph portfolio__text">Panopta is een webapplicatie die bedrijven helpt informatie-incidenten
te managen in het kader van de AVG / GDPR. Dé praktische oplossing om te voldoen aan de nieuwe
privacywetgeving!
</p>
<a class="d-block d-md-none button button--small button--light space-b2" href="/panopta.html">Lees Meer</a>
</div>
<div class="col-12 col-md-4">
<div class="portfolio__image" style="background-image: url('/images/secuform.png')"></div>
<h2 class="heading heading--s portfolio__title color-body">SecuForm</h2>
<p class="paragraph portfolio__text">SecuForm is een webapplicatie die online inschrijven veilig en
eenvoudig mogelijk maakt. Dé tool voor zorginstellingen die gebruik maken van Ons Administratie van Nedap
en een laagdrempelig inschrijfformulier op hun website willen.
</p>
<a class="d-block d-md-none button button--small button--light space-b2" href="/secuform.html">Lees Meer</a>
</div>
<div class="col-12 col-md-4">
<div class="portfolio__image" style="background-image: url('/images/leanfund.png')"></div>
<h2 class="heading heading--s portfolio__title color-body">Leanfund.us</h2>
<p class="paragraph portfolio__text">Leanfund.us is een crowdfunding-platform voor een verscheidenheid aan
projecten. Beta Corp. draagt zorg voor de hosting, het funding-proces en de betalingen.
</p>
<div class="space-b2 d-block d-md-none"></div>
</div>
</div>
<div class="row space-b2 d-none d-md-flex">
<div class="col-12 col-md-4">
<a class="button button--small button--light" href="/panopta.html">Lees Meer</a>
</div>
<div class="col-12 col-md-4">
<a class="button button--small button--light" href="/secuform.html">Lees Meer</a>
</div>
<div class="col-12 col-md-4">
<a class="button button--small button--light" href="https://www.leanfund.us/" target="_blank">Lees Meer</a>
</div>
</div>
<div class="row">
<div class="col-12 col-md-4">
<div class="portfolio__image" style="background-image: url('/images/mijndomein2.png')"></div>
<h2 class="heading heading--s portfolio__title color-body">Mijndomein Obligaties</h2>
<p class="paragraph portfolio__text">Dit is een platform voor de aanschaf, uitgifte en uitbetalingen van
obligaties van Mijndomein. Beta Corp. draagt zorg voor het gehele proces, waaronder de uitkering van
dividend aan de participanten.
</p>
<a class="d-block d-md-none button button--small button--light space-b2"
href="https://mijndomeinobligatie.nl" target="_blank">Lees Meer
</a>
</div>
<div class="col-12 col-md-4">
<div class="portfolio__image" style="background-image: url('/images/shield1.png')"></div>
<h2 class="heading heading--s portfolio__title color-body">Shield (Nedap)</h2>
<p class="paragraph portfolio__text">Shield is een framework dat op basis van Data, Context en Interactie
(DCI) besluit of zorggegevens ontsloten mogen worden. Beta Corp. heeft de basis van dit systeem
mede-ontwikkeld, waarmee Nedap kan voldoen aan de privacywetgeving in het kader van de AVG / GDPR.
</p>
<div class="space-b2 d-block d-md-none"></div>
</div>
<div class="col-12 col-md-4">
<div class="portfolio__image" style="background-image: url('/images/otx.png')"></div>
<h2 class="heading heading--s portfolio__title color-body">Bridge (OTX)</h2>
<p class="paragraph portfolio__text">Bridge is een internationale logistiek-oplossing voor het transport van
kleding. Deze applicatie converteert zeer verschillende klant-API’s (SAP/JSON/CSV/XML) middels REST naar
de nieuw ontwikkelde portal.
</p>
</div>
</div>
<div class="row space-b2 d-none d-md-flex">
<div class="col-12 col-md-4">
<a class="button button--small button--light" href="https://mijndomeinobligatie.nl" target="_blank">Lees
Meer
</a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="section section--shadow">
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="row">
<div class="col">
<div class="text-center"><h2 class="heading color-em">Geïnteresseerd?</h2></div>
<p class="paragraph">Neem contact met ons op om een afspraak te maken. U kunt gebruik maken van het
onderstaand formulier, ons mailen of ons bellen.
</p>
</div>
</div>
<div class="row">
<div class="col-md-8">
<form action="https://formspree.io/info@betacorp.nl" class="contact" method="POST"><input
class="textfield__input" name="name" placeholder="Uw naam" type="text"/>
<div class="textfield textfield--email"><input class="textfield__input" name="_replyto"
placeholder="Uw email adres" type="email"/></div>
<textarea class="textarea" name="message" placeholder="Uw bericht"></textarea><input
class="button button--dark" type="submit" value="Bericht versturen"/></form>
</div>
<div class="d-none d-md-block col-md-4">
<p class="paragraph"><strong>Beta Coöperatie U.A.</strong><br/>Stadsring 248-250<br/>3811HS Amersfoort<br/>06-472
72 430<br/>info@betacorp.nl<br/>KvK 68772963<br/>BTW NL857585496B01
</p>
<p class="paragraph">
<a class="link link--social space-r025" href="https://github.com/betacooperation" target="_blank">
<img src="/images/github.svg" width="30" class="d-block" alt="Github"/>
</a>
<a class="link link--social" href="https://www.linkedin.com/company/betacorp" target="_blank">
<img src="/images/linkedin.svg" width="30" class="d-block" alt="Linkedin"/>
</a>
</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="section section--dark" id="contact">
<div class="container">
<div class="row align-items-center justify-content-center">
<div class="col col-auto">
<img src="/images/logo_white.svg" width="50" class="footer-logo d-block" alt="Logo white"/>
</div>
<div class="col col-auto">
<p class="paragraph color-text">Beta Coöperatie U.A. - Stadsring 248-250 - 3811HS Amersfoort - info@betacorp.nl
- 06-472 72 430<br/>KvK 68772963 - BTW NL857585496B01
</p>
<p class="paragraph space-b0">
<a class="link link--social footer-logo space-r025" href="https://github.com/betacooperation" target="_blank">
<img src="/images/github_light.svg" width="20" class="d-block" alt="Github light"/>
</a>
<a class="link link--social footer-logo" href="https://www.linkedin.com/company/betacorp" target="_blank">
<img src="/images/linkedin_light.svg" width="20" class="d-block" alt="Linkedin light"/>
</a>
</p>
</div>
</div>
</div>
</section>
</body>
</html>