-
Notifications
You must be signed in to change notification settings - Fork 19
Expand file tree
/
Copy pathpartenariat.html
More file actions
executable file
·357 lines (349 loc) · 20.8 KB
/
partenariat.html
File metadata and controls
executable file
·357 lines (349 loc) · 20.8 KB
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
<!DOCTYPE html>
<html lang="zxx">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Retrouvez ici notre réseau de partenaires">
<meta name="copyright" content=" Made by P4 Simplon Sénégal">
<meta name="author" content="P4 Simplon Sénégal">
<link rel="stylesheet" href="partenariat/css/bootstrap-5.1.3-dist/css/bootstrap.min.css">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.carousel.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.theme.min.css">
<link rel="stylesheet" href="partenariat/css/partenariat.css">
<script src="partenariat/css/bootstrap-5.1.3-dist/js/bootstrap.bundle.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="partenariat/js/partenariat.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.carousel.min.js"></script>
<title>Simplon Sénégal | Partenariats</title>
</head>
<body>
<header>
<nav class="navbar navbar-expand-lg navbar-light fixed-top bg-white shadow-lg">
<div class="container-fluid">
<a href="#" title="revenir à la page d'acceuil"><img src="partenariat/img/logo.png" class="navbar-brand logo" alt="logo de simplon"></a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class=" collapse navbar-collapse" id="navbarNavDropdown">
<ul class=" navbar-nav d-flex align-items-center justify-content-end w-100">
<li class="nav-item px-5 ">
<a class="nav-link" href="index.html">Accueil</a>
</li>
<li class="nav-item px-5 ">
<a class="nav-link" href="Fabrique/fabrique.html">Fabrique</a>
</li>
<li class="nav-item px-5 ">
<a class="nav-link" href="formation.html">Formation</a>
</li>
<li class="nav-item px-5">
<a class="nav-link activate-link" id="active" href="partenariat.html">Partenariats</a>
</li>
<li class="nav-item px-5 ">
<a class="nav-link" href="Partie_Espace/index.html">Espaces</a>
</li>
<li class="nav-item px-5 ">
<a class="nav-link" href="entité.html">Entités</a>
</li>
<li class="nav-item px-5 "><img src="partenariat/img/search.svg" alt="image search"></li>
<li class="nav-item ps-5 pe-1 ">
<div class="dropdown">
<button class="btn dropdown-toggle" type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
<span>Fr</span>
</button>
<ul class="dropdown-menu" aria-labelledby="dropdownMenuButton1">
<li><a class="dropdown-item" href="#">En</a></li>
</ul>
</div>
</li>
<li class="nav-item pe-1 ">
<button class="btn" id="btn-red-contact"> Contact</button>
</li>
</ul>
</div>
</div>
</nav>
</header>
<main>
<!-- banniere parteanariats -->
<section class="banner">
<h1 class="title-page">PARTENARIATS</h1>
<img src="partenariat/img/partenaires/banniere.jpg" class="img-fluid image-banner"
alt="image illustrant le partenariat">
<div class="overlay"></div>
</section>
<!-- le reseau des entreprises -->
<section class="mx-md-5 mx-lg-5 px-sm-4 my-5">
<div class="row">
<h2>Le réseau des entreprises</h2>
</div>
<hr class="underlined-text col-1 mx-lg-0 mx-auto">
<div class="row">
<div class="col-md-12 col-sm-12 col-lg-6 px-lg-2 px-md-3 px-sm-0 my-md-3 my-sm-5">
<iframe class="w-100" height="400"
src="https://www.youtube.com/embed/19ie550_anQ" title="YouTube video player"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>
</iframe>
</div>
<div class="col-md-12 col-sm-12 col-lg-6 px-lg-5">
<h4 class="mx-5 my-md-3 my-sm-5">C'est quoi le réseau des entreprises?</h4>
<p class="mx-5 text-lg-start text-justify">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Rerum nostrum suscipit
quas
dicta minus dolorem
magni cupiditate. Dicta, quasi, beatae porro praesentium officiis accusamus nesciunt impedit
soluta
alias repellendus vero?
Unde fugit officiis neque impedit commodi explicabo possimus? Alias rerum cupiditate ducimus
vero
nobis.
Mollitia officiis quisquam quis eaque velit amet qui nisi animi fugiat odit, provident, quaerat
saepe
distinctio?
Eius, ipsum quis molestiae quae totam sunt inventore et aliquid. Vero illo magnam animi ratione
tempora.
</p>
</div>
</div>
<div class="d-flex align-items-center justify-content-center my-5">
<h3>Notre réseau d'entreprises</h3>
</div>
<!-- slide show img entreprises -->
<div class="container">
<div class="row">
<div id="testimonial-slider" >
<figure class="testimonial">
<img src="partenariat/img/partenaires/logo-atos.PNG" alt="Logo de atos">
</figure>
<figure class="testimonial">
<img src="partenariat/img/partenaires/logo-sncf-foundation.jpg" alt="logo de sncf">
</figure>
<figure class="testimonial">
<img src="partenariat/img/partenaires/logo-artp.JPG" alt="logo artp">
</figure>
<figure class="testimonial">
<img src="partenariat/img/partenaires/salesforce.png" alt="logo de salesforce">
</figure>
<figure class="testimonial">
<img src="partenariat/img/partenaires/neurotech.png" alt="logo de neurotech">
</figure>
<figure class="testimonial">
<img src="ipartenariat/mg/partenaires/orange-1.png" alt="logo de orange">
</figure>
<figure class="testimonial">
<img src="partenariat/img/partenaires/logo-FFE.png" alt="logo de FFE">
</figure>
<figure class="testimonial">
<img src="partenariat/img/partenaires/GEN.png" alt="logo de Grande ecoles du numeriques">
</figure>
<figure class="testimonial">
<img src="partenariat/img/partenaires/wave.jpg" alt="logo de SGBS">
</figure>
<figure class="testimonial">
<img src="partenariat/img/partenaires/People-Input.jpg" alt="logo de people input">
</figure>
<figure class="testimonial">
<img src="partenariat/img/partenaires/Pole-Emploi.jpg" alt="logo de pole emploi">
</figure>
<figure class="testimonial">
<img src="partenariat/img/partenaires/Drapeau-Union-europeenne-avec-logo-UE_large.jpg" alt="logo de union europeenne">
</figure>
</div>
</div>
</div>
<div class="row justify-content-center align-items-center py-5">
<button class="btn btn-red col-md-4 col-lg-3 col-sm-3 ">Rejoindre le réseau</button>
</div>
</section>
<!-- Partie soutenir nos actions -->
<section class="row my-md-5 my-lg-5 position-relative">
<div class="support-banner row position-relative">
<img src="partenariat/img/main.jpg" class="img-fluid image-banner" alt="image de fond nous soutenir">
<div class="overlay"></div>
</div>
<div class="row soutenir-bloc px-lg-5 px-md-5 px-sm-3">
<div class="col-md-12 col-lg-4 px-lg-2 px-md-3 px-sm-0 my-md-3 my-sm-5">
<iframe class="w-100 bordered" height="400"
src="https://www.youtube.com/embed/19ie550_anQ" title="YouTube video player"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen></iframe>
</div>
<div class="col-md-12 col-lg-6 soutenir-texte px-5">
<h2>Soutenir nos actions</h2>
<hr class="d-lg-none d-sm-block underlined-text col-1 mx-lg-0 mx-auto">
<p class="py-5 text-justify ">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Rerum nostrum suscipit
quas dicta minus dolorem
magni cupiditate. Dicta, quasi, beatae porro praesentium officiis accusamus nesciunt impedit
soluta.
</p>
</div>
</div>
</section>
<!-- bloc rouge soutenir nos actions -->
<section class="container mx-sm-auto red-bloc-support">
<div class="row container-sm">
<div class="col-lg-4 col-md-4 col-sm-12 py-lg-5 py-md-2 py-sm-1 px-md-2 px-sm-1 px-lg-5">
<h4 class="color-white text-center py-lg-5 py-md-2 py-sm-5">Formation</h4>
<p class="color-white py-lg-5 py-md-2 py-sm-1 px-lg-5 px-md-2 px-sm-5 text-center">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Ex aspernatur exercitationem harum
necessitatibus odit? Vero
</p>
</div>
<div class="col-lg-4 col-md-4 col-sm-12 py-lg-5 py-md-2 py-sm-1 px-md-2 px-sm-1 px-lg-5">
<h4 class="color-white boldered py-lg-5 py-md-2 py-sm-1">Projet</h4>
<p class="color-white border-text py-lg-5 py-md-2 py-sm-1 px-lg-5 px-md-2 px-sm-5 text-center">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Ex aspernatur exercitationem harum
necessitatibus odit? Vero
</p>
</div>
<div class="col-lg-4 col-md-4 col-sm-12 py-lg-5 py-md-2 py-sm-1 px-md-2 px-sm-1 px-lg-5">
<h4 class="color-white boldered py-lg-5 py-md-2 py-sm-1">Programme</h4>
<p class="color-white py-lg-5 py-md-2 py-sm-1 px-lg-5 px-md-2 px-sm-5 text-center">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Ex aspernatur exercitationem harum
necessitatibus odit? Vero
</p>
</div>
</div>
<div class="row align-items-center justify-content-center">
<button class="btn btn-white col-lg-3 col-md-3 col-sm-3">Soutenir nos actions</button>
</div>
</section>
<!-- Partie mise en place d'une fabrique -->
<section class="mx-md-5 mx-lg-5 mx-sm-4 my-5">
<div class="row">
<h2>Mise en place d'une fabrique</h2>
</div>
<hr class="underlined-text col-1 mx-lg-0 mx-auto">
<div class="row">
<p class="text-justify px-lg-0 px-5">
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Maiores quas asperiores repellendus
pariatur
temporibus nisi
eaque accusamus excepturi veniam alias magnam assumenda dolore, nam eligendi. Harum debitis
accusamus
optio eaque.
Odit beatae quam dolor, aperiam nihil modi. Officia sapiente tempore modi? Quisquam expedita, eius,
explicabo dolorum
asperiores libero laborum et deleniti dolorem, maiores sunt. Illum culpa aperiam quidem
reprehenderit
molestiae.
Culpa, eaque, delectus ipsam molestias illo repellendus ad rem ea earum minima recusandae et
consequuntur quod
doloremque eveniet facere unde. Harum, consequatur atque. Soluta, quia quasi maiores optio sapiente
excepturi!
</p>
</div>
<div class="mx-5 row-6 py-5 d-flex flex-wrap justify-content-center align-items-center">
<div class="card col-lg-3 col-md-3 col-sm-8 carte mx-lg-5 mx-md-5">
<img class="card-img-top border-img img-fluid" src="partenariat/img/fab1.jpeg" alt="Fabrique 1">
<div class="card-body">
<h5 class="card-title color-black py-lg-3 py-md-3 py-sm-3">Fabrique 1</h5>
<p class="py-lg-3 py-md-3 py-sm-3 px-lg-5 px-sm-2 px-md-3 text-left">Lorem ipsum dolor sit amet consectetur adipisicing elit.
Aliquam
vero quod sunt iste sequi quos veniam error, quae repudiandae tempora ullam tenetur quaerat
eveniet reiciendis iure eum magni rerum aspernatur.</p>
</div>
</div>
<div class="card col-lg-3 col-md-3 col-sm-8 carte mx-lg-5 mx-md-5 my-5">
<img class="card-img-top border-img img-fluid" src="partenariat/img/sonatel_academy.jpeg" alt="Fabrique 2">
<div class="card-body">
<h5 class="card-title color-black py-lg-3 py-md-3 py-sm-3">Fabrique 2</h5>
<p class="py-lg-3 py-md-3 py-sm-3 px-lg-5 px-sm-2 px-md-3 text-left">Lorem ipsum dolor sit amet consectetur adipisicing elit.
Aliquam
vero quod sunt iste sequi quos veniam error, quae repudiandae tempora ullam tenetur quaerat
eveniet reiciendis iure eum magni rerum aspernatur.</p>
</div>
</div>
<div class="card col-lg-3 col-md-3 col-sm-8 carte mx-lg-5 mx-md-5 my-5">
<img class="card-img-top border-img img-fluid" src="partenariat/img/fab3.jpeg" alt="Fabrique 3">
<div class="card-body">
<h5 class="card-title color-black py-lg-3 py-md-3 py-sm-3">Fabrique 3</h5>
<p class="py-lg-3 py-md-3 py-sm-3 px-lg-5 px-sm-2 px-md-3 text-left">Lorem ipsum dolor sit amet consectetur adipisicing elit.
Aliquam
vero quod sunt iste sequi quos veniam error, quae repudiandae tempora ullam tenetur quaerat
eveniet reiciendis iure eum magni rerum aspernatur.</p>
</div>
</div>
</div>
<div class="row justify-content-center align-items-center">
<button class="btn btn-red col-lg-3 col-md-3 col-sm-3"> Rejoindre l'aventure</button>
</div>
</section>
<!-- Reseau des partenaires -->
<section class="mx-md-5 mx-lg-5 mx-sm-4 my-5">
<div class="row"><h2>Réseau des partenaires</h2></div>
<hr class="underlined-text col-1 mx-lg-0 mx-auto">
<div class="container grille">
<img src="partenariat/img/partenaires/salesforce.png" alt="logo salesforce" class="grid-item">
<img src="partenariat/img/partenaires/partenaire1.gif" alt="logo accenture" class="grid-item">
<img src="partenariat/img/partenaires/wave.jpg" alt="" class="grid-item">
<img src="partenariat/img/partenaires/Fondation-Société-Générale_logo.png" alt=" logo fondation SG"
class="grid-item">
<img src="partenariat/img/partenaires/orange-1.png" alt="logo orange" class="grid-item">
<img src="partenariat/img/partenaires/logo-FFE.png" alt="logo FEE" class="grid-item">
<img src="partenariat/img/partenaires/logo-sncf-foundation.jpg" alt="logo-sncf-foundation" class="grid-item">
<img src="partenariat/img/partenaires/Societe-Generale-logo.png" alt=" logo societe generale" class="grid-item">
<img src="partenariat/img/partenaires/logo-atos.PNG" alt="logo atos" class="grid-item">
<img src="partenariat/img/partenaires/logo-artp.JPG" alt="logo artp" class="grid-item">
<img src="partenariat/img/partenaires/neurotech.png" alt="logo neurotech" class="grid-item">
<img src="partenariat/img/partenaires/salesforce.png" alt="logo salesforce" class="grid-item">
</div>
</section>
</main>
<!-- footer de la page -->
<footer class="footer row py-5 px-5">
<div class=" col-md-6 col-lg-3 col-xl-3 col-sm-12 px-5 text-white">
<div class="row pb-sm-2 pb-lg-5 -pb-md-3">
<img src="partenariat/img/logo-simplon.svg" alt="logo de simplon" class="img-fluid">
</div>
<div class="row align-items-center py-5">
<div class="col-3">
<img src="partenariat/img/twitter.svg" alt="Logo de twitter">
</div>
<div class="col-3">
<img src="partenariat/img/facebook.svg" alt="Logo de facebook">
</div>
<div class="col-3">
<img src="partenariat/img/instagram.svg" alt="Logo de instagram">
</div>
<div class="col-3">
<img src="partenariat/img/youtube-icon.svg" alt="Logo de youtube">
</div>
</div>
</div>
<div class="col-md-6 col-lg-3 col-xl-3 col-sm-12 px-5 text-white">
<p class="fw-bold h1 pb-sm-2 pb-lg-4 -pb-md-3 text-center text-lg-start">Voir plus</p>
<p class="h4 text-center text-lg-start"> À propos</p>
<p class="h4 text-center text-lg-start"> Notre histoire</p>
<p class="h4 text-center text-lg-start"> Conditions d'utilisation</p>
<p class="h4 text-center text-lg-start"> Politique de confidentialité</p>
<p class="h4 text-center text-lg-start"> FAQ</p>
</div>
<div class="col-md-6 col-lg-3 col-xl-3 col-sm-12 px-5 text-white">
<p class="fw-bold h1 pb-sm-2 pb-lg-4 -pb-md-3 text-center text-lg-start">Coordonnées</p>
<p class="h4 text-center text-lg-start">Cité Keur Gorgui <br> Dakar, Sicap, Liberté 2 <br> Sénégal</p>
<p class="h4 text-center text-lg-start">simplon@email.com <br> help@simplon.com</p>
<p class="h4 text-center text-lg-start">(221) 77 456 78 90 <br> (221) 77 654 32 10</p>
</div>
<div class="col-md-6 col-lg-3 col-xl-3 col-sm-12 px-5 text-white">
<p class="fw-bold h1 pb-sm-2 pb-lg-4 -pb-md-3 text-center text-lg-start">Notre Newsletter</p>
<p class="h4 text-center text-lg-start">Souscrivez-vous à notre newsletter pour ne manquer aucune de nos activités</p>
<div class="height-input input-group mb-3">
<input type="email" class="form-control" placeholder="Email" aria-label="Recipient's username" aria-describedby="button-addon2">
<button class="btn btn-danger" type="submit" id="button-addon2">Joindre</button>
</div>
</div>
</footer>
<footer class="row py-md-5 py-lg-5 py-sm-3 footer-element-color-red ">
<div class="px-sm-1 px-5 col-md-6 col-lg-6 col-sm-12">
<p class="h3 font-weight-bold px-lg-5 text-sm-center">©Simplon 2021.All rights reserved</p>
</div>
<div class="px-sm-1 px-5 col-md-6 col-lg-6 col-sm-12 text-lg-end">
<p class="h3 font-weight-bold px-lg-5 text-sm-center">
Made width <img src="partenariat/img/heart-fill.svg" alt="emoji coeur"> by <strong>Simplon P4</strong>
</p>
</div>
</footer>
<figure id="btn-back-to-top" title="Revenir en haut" class="rounded-circle"><img src="partenariat/img/arrow-up-circle-fill.svg" alt="Icone revenir en haut de la page"></figure>
</body>
</html>