-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
627 lines (599 loc) · 24.2 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
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<meta name="robots" content="index, follow"/>
<title>Taha Derouiche's Official Website</title>
<link rel="shortcut icon" href="logo-website.png">
<!-- Google Font Roboto -->
<link href="https://fonts.googleapis.com/css?family=Roboto:500,400italic,100,300,700,100italic,300italic,400" rel="stylesheet" type="text/css">
<!-- Bootstrap 3.3.5 -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
<!-- Design Style MyWALL -->
<link rel="stylesheet" type="text/css" href="css/mywall.min.css" />
<!-- Black Style MyWALL -->
<link rel="stylesheet" type="text/css" href="css/black.css" />
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<!-- Google Analytics -->
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-72560797-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-72560797-1');
</script>
<!-- End Google Analytics -->
</head>
<body>
<!-- Modal Window Contact me -->
<!-- <div class="modal fade" id="callmeModal" tabindex="-1" aria-hidden="true" role="dialog" aria-labelledby="ModalCall" style="display: none;">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h2 class="modal-title getmetelf" id="ModalCall">Get in touch with me.</h2>
</div>
<div class="modal-body"> -->
<!-- Your phone number -->
<!-- <div class="myphone"><a href="tel:+31647252001">+31 6 47 252 001</a></div> -->
<!-- Contact hours -->
<!-- <div class="contacthours">
<p class="hourcall">Contact hours</p>
<div class="rightcall">
<p class="dayscall">Mon - Fri</p>
<p class="horario">9:00 - 22:00</p>
<p class="dayscall">Sat - Sun</p>
<p class="horario">10:00 - 18:00</p>
</div>
</div> -->
<!-- // Contact hours -->
<!-- </div>
</div>
</div>
</div> -->
<!-- // Modal Window Contact me -->
<!-- Header -->
<header>
<!-- Menu Navigation -->
<div id="top" class="container">
<!-- Menu left -->
<nav id="ha-header" class="left-nav ha-header">
<ul class="nav">
<li class="dropdown">
<!-- Dropdown menu -->
<a class="dropdown-toggle circle-main" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
<svg class="hello" height="36" viewBox="0 0 24 24" width="36" xmlns="http://www.w3.org/2000/svg">
<path d="M2 15.5v2h20v-2H2zm0-5v2h20v-2H2zm0-5v2h20v-2H2z"/>
<path d="M0 0h24v24H0z" fill="none"/>
</svg>
</a>
<!-- Navigation Sections -->
<ul class="dropdown-menu">
<li><a data-scroll data-options='{ "easing": "easeOutQuint" }' href="#top" class="menu-item wall">Hello</a></li>
<li><a data-scroll data-options='{ "easing": "easeOutQuint" }' href="#about" class="menu-item wall">About Me</a></li>
<li><a data-scroll data-options='{ "easing": "easeOutQuint" }' href="#skills" class="menu-item wall">Skills and Abilities</a></li>
<li><a data-scroll data-options='{ "easing": "easeOutQuint" }' href="#education" class="menu-item wall">Education</a></li>
<li><a data-scroll data-options='{ "easing": "easeOutQuint" }' href="#work" class="menu-item wall">Work Experience</a></li>
<li><a data-scroll data-options='{ "easing": "easeOutQuint" }' href="#download" class="menu-item wall">Social Networks</a></li>
<li><a data-scroll data-options='{ "easing": "easeOutQuint" }' href="#contacto" class="menu-item wall">Contact Me</a></li>
</ul>
</li>
</ul>
</nav>
<!-- // Menu left -->
<!-- Menu right - Hidden in small devices -->
<div class="nav-extra">
<!-- Button Contact Modal
<!-- <a class="callme" href="#" data-toggle="modal" data-target="#callmeModal">
<span class="glyphicon glyphicon glyphicon-earphone call" aria-hidden="true"></span>
</a> -->
<!-- Button 'Contact me' -->
<a class="hireme button-mywall hidden-xs" data-scroll data-options='{ "easing": "easeOutQuint" }' href="#contacto">Contact me now</a>
</div>
<!-- // Menu right -->
</div>
<!-- // Menu Navigation -->
<!-- Personal Details -->
<div class="container">
<img class="img-circle imgsus" alt="Taha Derouiche Profile Picture" src="img/profile.png"/>
<h1 class="name-boss">Taha Derouiche</h1>
<h2 class="main-details">Principal consulting architect @ Elastic</h2>
<p class="extend-details">Enthusiastic and methodical, I love technical challenges. This site tells a bit about me, what I love. If you want to know more or just chat about something - drop me a line.</p>
</div>
<!-- // Personal Details -->
</header>
<!-- // Header -->
<!-- About Me Intro - Text Type - Hi. I'm ... -->
<section id="about" class="cd-intro">
<h1 class="cd-headline letters type">
<!-- Static Text -->
<span>Hi. I speak</span>
<!-- Automatic Text Type -->
<span class="cd-words-wrapper waiting">
<b class="is-visible">English</b>
<b>French</b>
<b>Arabic</b>
</span>
</h1>
</section>
<!-- // About Me Intro -->
<!-- About Me Context -->
<section class="full-section my-about">
<!-- Top About me -->
<article class="container">
<div class="row">
<!-- Text about me -->
<div class="col-md-6">
<h2 class="title-main">About Me.</h2>
<p class="text-main">I’m a principal consulting architect at Elastic (Founders of Elasticsearch, Kibana, Logstash and Beats).
<br><br>I am certified AWS Solutions Architect, GCP Data Engineer, Azure Solution Architect and Kubernetes Engineer and Kubernetes Security Specialist .
<br>I am passionate about technology, learning and love to tinker with different technical challenges.
<br>Data Engineering & Cloud Architecture and Machine learning topics are now the new area I love focus on</p>
</div>
<!-- Image right about me -->
<div class="col-md-6">
<img class="img-responsive" src="img/work.jpg" alt="working">
</div>
</div>
</article>
<!-- // Top About me -->
<!-- 3 Columns extra info -->
<article class="full-section my-extrame">
<div class="container">
<div class="row">
<!-- Col 1 -->
<div class="col-sm-4">
<div class="row">
<div class="col-md-4 img-myextra"><img alt="passionate" class="img-myextrame" src="img/passion.png"></div>
<div class="col-md-8">
<h5 class="text-five">Passion</h5>
<p class="text-subfive">I love to deal with every challenge with zest and passion, no exceptions here</p>
</div>
</div>
</div>
<!-- Col 2 -->
<div class="col-sm-4">
<div class="row">
<div class="col-md-4 img-myextra"><img alt="quality" class="img-myextrame" src="img/w_quality.png"></div>
<div class="col-md-8">
<h5 class="text-five">Quality work</h5>
<p class="text-subfive">Some people are happy to sit back and watch the world go by, I am not</p>
</div>
</div>
</div>
<!-- Col 3 -->
<div class="col-sm-4">
<div class="row">
<div class="col-md-4 img-myextra"><img alt="focused" class="img-myextrame" src="img/focused.png"></div>
<div class="col-md-8">
<h5 class="text-five">Focus</h5>
<p class="text-subfive">Focus on one important goal, it really does pay off</p>
</div>
</div>
</div>
</div>
</div>
</article>
<!-- // 3 Columns extra info -->
</section>
<!-- // About Me Context -->
<!-- About Me Gallery -->
<section id="aboutme" class="full-section ha-waypoint" data-animate-down="ha-header-subshow" data-animate-up="ha-header-show">
<!-- Owl Carousel images -->
<div class="owl-carousel">
<div class="item"><img alt="pexels-1" src="img/pexels/pexels-1.jpg"/></div>
<div class="item"><img alt="pexels-2" src="img/pexels/pexels-2.jpg"/></div>
<div class="item"><img alt="pexels-3" src="img/pexels/pexels-3.jpg"/></div>
<div class="item"><img alt="pexels-4" src="img/pexels/pexels-4.jpg"/></div>
<div class="item"><img alt="pexels-5" src="img/pexels/pexels-5.jpg"/></div>
<div class="item"><img alt="pexels-6" src="img/pexels/pexels-6.jpg"/></div>
</div>
<!-- // Owl Carousel images -->
<!-- More about me and 3 columns -->
<div class="container">
<div class="row">
<div class="col-md-12">
<h3 class="title-three">More about me, and my life.</h3>
<p class="text-three">I was born in Tunisia, you know, that country that started the Arab Spring in 2011, well yes, it all started there for me. From there, I got to different places, studying in Grenoble, France. Bought a one way ticket at the end of my Master in Computer Science, starting my adventure in Singapore. Six years later, I decided to make that new jump again and moved to Amsterdam since the beginning of 2018.</p>
</div>
</div>
</div>
</section>
<!-- // About Me Gallery -->
<!-- Skills and abilities -->
<section id="skills" class="full-section-two bg-skills">
<div class="container">
<!-- Text Skills and Abilities -->
<h2 class="title-main mywhite">Skills & Abilities.</h2>
<div class="row">
<!-- Skills percent 1 -->
<div class="col-md-6 separ">
<div class="row">
<div class="hidden-xs col-sm-2 icon-skill"><img class="img-skill" alt="elastic" src="img/elasticsearch.png"/></div>
<div class="col-sm-10">
<div class="row">
<div class="col-sm-12 title-skill">Elasticsearch (elastic stack)</div>
<div class="col-sm-12 bar-skill">
<div class="this-skill my-green my-ninety"></div>
</div>
</div>
</div>
</div>
</div>
<!-- Skills percent 2 -->
<div class="col-md-6 separ">
<div class="row">
<div class="hidden-xs col-sm-2 icon-skill"><img class="img-skill" alt="trading" src="img/devops.png"/></div>
<div class="col-sm-10">
<div class="row">
<div class="col-sm-12 title-skill">Kubernetes and Devops tools</div>
<div class="col-sm-12 bar-skill">
<div class="this-skill my-blue my-seventy"></div>
</div>
</div>
</div>
</div>
</div>
<!-- Skills percent 3 -->
<div class="col-md-6 separ">
<div class="row">
<div class="hidden-xs col-sm-2 icon-skill"><img class="img-skill" alt="Forex" src="img/automation.png"/></div>
<div class="col-sm-10">
<div class="row">
<div class="col-sm-12 title-skill">Software delivery pipeline automation</div>
<div class="col-sm-12 bar-skill">
<div class="this-skill my-blue my-sixty"></div>
</div>
</div>
</div>
</div>
</div>
<!-- Skills percent 4 -->
<div class="col-md-6 separ">
<div class="row">
<div class="hidden-xs col-sm-2 icon-skill"><img class="img-skill" alt="monitoring" src="img/monitoring.png"/></div>
<div class="col-sm-10">
<div class="row">
<div class="col-sm-12 title-skill">Software observability</div>
<div class="col-sm-12 bar-skill">
<div class="this-skill my-green my-ninety"></div>
</div>
</div>
</div>
</div>
</div>
<!-- Skills percent 5 -->
<div class="col-md-6 separ">
<div class="row">
<div class="col-sm-2 hidden-xs icon-skill"><img class="img-skill" alt="incident management" src="img/machinelearning.png"/></div>
<div class="col-sm-10">
<div class="row">
<div class="col-sm-12 title-skill">Machine Learning</div>
<div class="col-sm-12 bar-skill">
<div class="this-skill my-pink my-fifty"></div>
</div>
</div>
</div>
</div>
</div>
<!-- Skills percent 6 -->
<div class="col-md-6 separ">
<div class="row">
<div class="hidden-xs col-sm-2 icon-skill"><img class="img-skill" alt="unix" src="img/linux.png"/></div>
<div class="col-sm-10">
<div class="row">
<div class="col-sm-12 title-skill">Unix Administration</div>
<div class="col-sm-12 bar-skill">
<div class="this-skill my-pink my-green"></div>
</div>
</div>
</div>
</div>
</div>
<!-- // Skills percent -->
</div>
</div>
<!-- Abilities -->
<div class="container cont-mg">
<div class="row">
<!-- Col 1 - Software Skills -->
<div class="col-md-4">
<div class="cont-ab">
<h4 class="title-four color-a">Software Skills</h4>
<!-- Software Abilitie 1 -->
<div class="row">
<div class="col-xs-2"><img class="img-soft" alt="bash scripting" src="img/bash.png"/></div>
<div class="col-xs-5 ability">Shell scritps</div>
<div class="col-xs-5 expert">EXPERT</div>
</div>
<!-- Software Abilitie 2 -->
<div class="row">
<div class="col-xs-2"><img class="img-soft" alt="Office" src="img/python.png"/></div>
<div class="col-xs-5 ability">Python</div>
<div class="col-xs-5 advanced">ADVANCED</div>
</div>
<!-- Software Abilitie 3 -->
<div class="row">
<div class="col-xs-2"><img class="img-soft" alt="Office" src="img/golang.png"/></div>
<div class="col-xs-5 ability">Golang</div>
<div class="col-xs-5 advanced">BEGINNER</div>
</div>
<!-- Software Abilitie 4 -->
<div class="row">
<div class="col-xs-2"><img class="img-soft" alt="python" src="img/sql.png"/></div>
<div class="col-xs-5 ability">SQL</div>
<div class="col-xs-5 expert">EXPERT</div>
</div>
</div>
</div>
<!-- Col 2 - Awesome Services -->
<div class="col-md-4">
<div class="cont-ab">
<h4 class="title-four color-b">Certifications<br><br></h4>
<!-- Awesome Abilities -->
<div class="row">
<div class="col-md-12 text-awsm">Kubernetes Administrator</div>
<div class="col-md-12 text-awsm">Kubernetes Security Specialist</div>
<div class="col-md-12 text-awsm">AWS Solutions Architect</div>
<div class="col-md-12 text-awsm">Google Cloud Data Engineer</div>
<div class="col-md-12 text-awsm">Azure Solution Architect </div>
</div>
<!-- // Awesome Abilities -->
</div>
</div>
<!-- Col 3 - Other Interests -->
<!-- <div class="col-md-4">
<div class="cont-ab">
<h4 class="title-four color-c">Other Interests</h4>
<div class="row">
<!-- Interest 1 -->
<!-- <div class="col-sm-6">
<div class="row">
<div class="col-md-12 intrst">
<img alt="soccer" src="img/soccer.png">
</div>
</div>
<p class="text-interest">Football</p>
</div> -->
<!-- Interest 2 -->
<!-- <div class="col-sm-6">
<div class="row">
<div class="col-md-12 intrst">
<img alt="travel" src="img/travel.png">
</div>
</div>
<p class="text-interest">Travelling</p>
</div> -->
<!-- Interest 3 -->
<!-- <div class="col-sm-6">
<div class="row">
<div class="col-md-12 intrst">
<img alt="Swimming" src="img/Swimming-icon.png">
</div>
</div>
<p class="text-interest">Swimming</p>
</div> -->
<!-- Interest 4 -->
<!-- <div class="col-sm-6">
<div class="row">
<div class="col-md-12 intrst">
<img alt="cycling" src="img/cycling.png">
</div>
</div>
<p class="text-interest">Cycling</p>
</div>
</div>
</div>
</div> -->
<div class="col-md-4">
<div class="cont-ab">
<h4 class="title-four color-b">Devops Tools<br><br></h4>
<!-- Awesome Abilities -->
<div class="row">
<div class="col-md-12 text-awsm">Kubernetes</div>
<div class="col-md-12 text-awsm">Terraform</div>
<div class="col-md-12 text-awsm">Ansible</div>
<div class="col-md-12 text-awsm">Docker</div>
</div>
<!-- // Awesome Abilities -->
</div>
</div>
</div>
</div>
<!-- // Abilities -->
</section>
<!-- // Skills and abilities -->
<!-- Education -->
<section id="education" class="full-section">
<!-- Text Education -->
<div class="container">
<h2 class="title-main">Education.</h2>
</div>
<!-- Timeline Responsive -->
<article id="cd-timeline" class="cd-container">
<!-- 1 Item -->
<div class="cd-timeline-block">
<!-- Circle image 64x64 -->
<div class="cd-timeline-img my-green">
<img src="img/ed1.png" alt="Engineering">
</div>
<!-- Info 1 Education -->
<div class="cd-timeline-content">
<h2>Information Systems Exchange Semester </h2>
<h3><a href="http://www.nus.edu.sg/" target="_blank">National University of Singapore</a></h3>
<span class="cd-date">January 2012</span>
</div>
</div>
<!-- 2 Item -->
<div class="cd-timeline-block">
<!-- Circle image 64x64 -->
<div class="cd-timeline-img my-green">
<img src="img/ed2.png" alt="Science">
</div>
<!-- Info 2 Education -->
<div class="cd-timeline-content">
<h2>Bachelor & Master of Science in Networks and Computer Science</h2>
<h3><a href="http://ensimag.grenoble-inp.fr/en" target="_blank">Ensimag - Grenoble Institute of Technology - France</a></h3>
<span class="cd-date">September 2009</span>
</div>
</div>
<!-- 3 Item -->
<div class="cd-timeline-block">
<!-- Circle image 64x64 -->
<div class="cd-timeline-img my-green">
<img src="img/ed3.png" alt="Bachelor">
</div>
<!-- Info 3 Education -->
<div class="cd-timeline-content">
<h2>Preparatory School For Engineering Studies</h2>
<h3><a href="http://www.ipeit.rnu.tn/en" target="_blank">IPEIT Tunisia</a></h3>
<span class="cd-date">September 2007</span>
</div>
</div>
<!-- The Beginning of Times image -->
<div class="cd-timeline-block">
<!-- Circle image 64x64 -->
<div class="cd-timeline-img my-green">
<img src="img/ed4.png" alt="Times">
</div>
</div>
</article>
<!-- The Beginning of Times item -->
<p class="txt-times">The Beginning of Times</p>
</section>
<!-- // Education -->
<!-- Work Experience -->
<section id="work" class="full-section-two bg-work">
<!-- Text Work Experience -->
<div class="container">
<h2 class="title-main mywhite">Work Experience.</h2>
<!-- <p class="text-main mywhite">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> -->
</div>
<!-- Work -->
<div class="container cont-mg">
<!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#1" role="tab" data-toggle="tab">Elastic</a></li>
<li role="presentation"><a href="#2" role="tab" data-toggle="tab">Standard Chartered</a></li>
<li role="presentation"><a href="#3" role="tab" data-toggle="tab">Commerzbank</a></li>
<li role="presentation"><a href="#4" role="tab" data-toggle="tab">Numericable</a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
<!-- Tab 1 -->
<div role="tabpanel" class="tab-pane fade active in" id="1">
<h3 class="title-wk">Principal Consulting Architect</h3>
<p class="wk-company">Elastic, Amsterdam</p>
<!-- <p class="text-wk">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor. <br> Duis aute irure dolor in reprehenderit in voluptate velit.</p> -->
<p class="wk-date">2018</p>
</div>
<!-- Tab 2 -->
<div role="tabpanel" class="tab-pane fade" id="2">
<h3 class="title-wk">DevOps Engineer</h3>
<p class="wk-company">Standard Chartered, Singapore</p>
<!-- <p class="text-wk">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor. <br> Duis aute irure dolor in reprehenderit in voluptate velit.</p> -->
<p class="wk-date">2016-2018</p>
</div>
<!-- Tab 3 -->
<div role="tabpanel" class="tab-pane fade" id="3">
<h3 class="title-wk">Service reliability engineer - Forex trading</h3>
<p class="wk-company">Commerzbank AG, Singapore</p>
<!-- <p class="text-wk">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor. <br> Duis aute irure dolor in reprehenderit in voluptate velit.</p> -->
<p class="wk-date">2012 - 2016</p>
</div>
<!-- Tab 4 -->
<div role="tabpanel" class="tab-pane fade" id="4">
<h3 class="title-wk">Data analyst. Geo Information Systems</h3>
<p class="wk-company">Numericable, Paris</p>
<!-- <p class="text-wk">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor. <br> Duis aute irure dolor in reprehenderit in voluptate velit.</p> -->
<p class="wk-date">2010</p>
</div>
</div>
<!-- // Tab panes -->
</div>
<!-- // Work -->
</section>
<!-- // Work Experience -->
<!-- Social and Download -->
<section id="download" class="full-download">
<div class="container">
<div class="row">
<!-- Social Networks -->
<div class="col-sm-12 btn-class col-md-7">
<a href="https://www.linkedin.com/in/tahaderouiche" class="social-ink">
<img class="socl" src="img/linkedin-icon.png" alt="linkedin"/>
</a>
<a href="https://github.com/tahaderouiche" class="social-ink">
<img class="socl" src="img/github-icon.png" alt="github"/>
</a>
<!-- <a href="https://medium.com/@taha.derouiche" class="social-ink">
<img class="socl" src="img/medium-icon.png" alt="medium"/>
</a> -->
<a href="https://twitter.com/tahaderouiche" class="social-ink">
<img class="socl" src="img/twitter-icon.png" alt="twitter"/>
</a>
</div>
<!-- Download Resume - CV -->
<div class="col-sm-5 btn-class hidden-sm hidden-xs">
<a class="btn-dwnld" href="taha-derouiche-resume.pdf" target="_blank">Download Resume</a>
</div>
</div>
</div>
</section>
<!-- // Social and Download -->
<!-- Contact me -->
<section id="contacto" class="full-section-three bg-contact">
<div class="container">
<!-- Title Contact me -->
<h1 class="title-ct">Contact me.</h1>
<p class="separator-ct"></p>
<!-- Localization -->
<div class="row">
<div class="col-md-6 col-xs-12 txt-center">
<p class="icon-ct glyphicon glyphicon-map-marker"></p>
<p class="text-ct">I live in <b>Amsterdam</b></p>
</div>
<!--Mail -->
<div class="col-md-6 col-xs-12 txt-center">
<p class="icon-ct glyphicon glyphicon-send"></p>
<p class="text-ct"><a href="mailto:[email protected]?Subject=Hi%20there!" target="_blank">[email protected]</a></p>
</div>
</div>
</div>
</section>
<!-- // Contact me -->
<!-- Footer -->
<footer class="full-footer">
<div class="container padding-footer">
<div class="row">
<!-- Text Left -->
<div class="col-sm-8 foo-left">This is my personal resume, I hope you enjoyed it. It is hosted on AWS S3 and the site source code is available on my GitHub. <br> Taha Derouiche.</div>
<!-- Text Right -->
<div class="col-sm-4 foo-right">Made with <span class="glyphicon glyphicon-heart" aria-hidden="true"></span> in Amsterdam</div>
</div>
</div>
</footer>
<!-- // Footer -->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
<!-- Smooth-scroll -->
<script src="js/smooth-scroll.min.js"></script>
<!-- "Hi. I'am..." Text type - Resource jQuery -->
<script src="js/main.min.js"></script>
<!-- Owl Carousel -->
<script src="js/owl.carousel.min.js"></script>
<!-- Menu Scrolling -->
<script src="js/waypoints.min.js"></script>
<!-- Portfolio gallery -->
<script src="js/imagelightbox.min.js"></script>
</body>
</html>