<header>
- <a href="#"><img src="../Images/logo_heureux-cyclage.jpg" alt="logo_heureux-cyclage" width="300" /></a>
+ <a href="#"><img src="../clavettes/images/logo_heureux-cyclage.jpg" alt="logo_heureux-cyclage" width="300" /></a>
</header>
<!--1ERE COLONNE-->
- <!--<div class="row">
- <div class="column large-3">-->
+
+ <div class="col-12 col-m-6 col-l-3">
<div id="ateliers">
- <div class="atelier1">
-
+
+
+ <ul>
+ <li>
+
+
+ <a href="#"><h1>Atelier vélo d'Échirolles</h1></a>
+ <a href="#"><h2>Halle du vieux village<br>Échirolles</h2></a>
+ <a href="#"><h2>horaires</h2></a>
- <a href="#"><h1>Atelier vélo d'Échirolles</h1></a>
- <a href="#"><h2>Halle du vieux village<br>Échirolles</h2></a>
- <a href="#"><h2>horaires</h2></a>
-
- </div>
-
- <div class="atelier2">
-
- <a href="#"><h1>uN p'Tit véLo dAnS La Tête</h1></a>
- <a href="#"><h2>5 rue de Londres <br>38000 GRENOBLE</h2></a>
- <a href="#"><h2>horaires</h2></a>
-
- </div>
-
- <div class="atelier3">
-
- <a href="#"><h1>Les Cycl'hauts du Rabot</h1></a>
- <a href="#"><h2>11, rue Maurice Gignoux<br>38031 GRENOBLE</h2></a>
- <a href="#"><h2>horaires</h2></a>
-
- </div>
-
- <div class="atelier4">
-
- <a href="#"><h1>La Citrouille</h1></a>
- <a href="#"><h2>38000 Grenoble</h2></a>
- <a href="#"><h2>horaires</h2></a>
-
- </div>
-
- <div class="atelier5">
-
- <a href="#"><h1>Un Vélo de Plus</h1></a>
- <a href="#"><h2>adresse</h2></a>
- <a href="#"><h2>horaires</h2></a>
-
- </div>
-
- <div class="atelier6">
-
- <a href="#"><h1>Les déraillés</h1></a>
- <a href="#"><h2>adresse</h2></a>
- <a href="#"><h2>horaires</h2></a>
-
- </div>
-
- <div class="atelier7">
-
- <a href="#"><h1>Atelier Garave</h1></a>
- <a href="#"><h2>adresse</h2></a>
- <a href="#"><h2>horaires</h2></a>
-
- </div>
-
+ </li>
+
+ <li>
+
+ <a href="#"><h1>uN p'Tit véLo dAnS La Tête</h1></a>
+ <a href="#"><h2>5 rue de Londres <br>38000 GRENOBLE</h2></a>
+ <a href="#"><h2>horaires</h2></a>
+
+ </li>
+
+ <li>
+
+ <a href="#"><h1>Les Cycl'hauts du Rabot</h1></a>
+ <a href="#"><h2>11, rue Maurice Gignoux<br>38031 GRENOBLE</h2></a>
+ <a href="#"><h2>horaires</h2></a>
+
+ </li>
+
+ <li>
+
+ <a href="#"><h1>La Citrouille</h1></a>
+ <a href="#"><h2>38000 Grenoble</h2></a>
+ <a href="#"><h2>horaires</h2></a>
+
+ </li>
+
+ <li>
+
+ <a href="#"><h1>Un Vélo de Plus</h1></a>
+ <a href="#"><h2>adresse</h2></a>
+ <a href="#"><h2>horaires</h2></a>
+
+ </li>
+
+ <li>
+
+ <a href="#"><h1>Les déraillés</h1></a>
+ <a href="#"><h2>adresse</h2></a>
+ <a href="#"><h2>horaires</h2></a>
+
+ </li>
+
+ <li>
+
+ <a href="#"><h1>Atelier Garave</h1></a>
+ <a href="#"><h2>adresse</h2></a>
+ <a href="#"><h2>horaires</h2></a>
+
+ </li>
+ </ul>
</div>
- <!--</div>
+ </div>
- </div>-->
+
<!--2EME COLONNE-->
- <!--<div class="column large 5">-->
- <div id="news">
+
+ <div class="col-12 col-m-6 col-l-5">
- <div class="article1">
-
- <a href="#"><img src="../Images/velo-nb.png" alt="logo_heureux-cyclage" width="500px" /></a>
+ <div id="news">
- <a href="#"><h1>Titre de l'article</h1></a>
+ <div class="article1">
- <a href="#"><h3>Date — Auteur</h3></a>
+ <a href="#"><img src="../clavettes/images/velo-nb.png" alt="logo_heureux-cyclage"/></a>
- <a href="#"><p>extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article</p></a>
+ <a href="#"><h1>Titre de l'article</h1></a>
+
+ <a href="#"><h3>Date — Auteur</h3></a>
+
+ <a href="#"><p>extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article extrait du contenu de l'article...</p></a>
+ <a href="#"><p class="suite">Lire la suite...</p></a>
+
+ </div>
+
+ <div class="article2">
+
+ </div>
+
+ <div class="article3">
+
+ </div>
+
+ <div class="article4">
+
+ </div>
- </div>
-
- <div class="article2">
-
- </div>
-
- <div class="article3">
-
- </div>
-
- <div class="article4">
</div>
-
-
+
</div>
+
- <!--</div>-->
<!--3EME COLONNE-->
- <!--<div class="column large 4">-->
+ <div class="col-12 col-m-12 col-l-4">
<div class="map">
+
+
</div>
- <!--</div>
+ </div>
- <div class="row">
- <div class="column large 4">-->
+
+ <div class="col-12 col-m-12 col-l-4">
<div class="agenda">
+
+
+
</div>
- <!--</div>
+ </div>
- </div>-->
+
dépôts / lhc / web / clavettes.git / blobdiff