Commit dece4877 authored by Dorian's avatar Dorian
Browse files

sommaire 22

parent b7b0acc7
......@@ -9,6 +9,7 @@
"portrait": "layout/portrait/index.html",
"recit": "layout/recit/index.html",
"rubric": "layout/rubric/index.html",
"rubric-droit": "layout/rubric-droit/index.html",
"rubric-jouer": "layout/rubric-jouer/index.html",
"rubric-web": "layout/rubric-web/index.html",
"sommaire": "layout/sommaire/index.html"
......
......@@ -47,7 +47,7 @@
content: none;
}
// dingbat de fin après chaque crédits
.droit .body b::after {
font: 6.5pt 'Belogodor';
content: '\00A0\E887';
}
// .droit .body b::after {
// font: 6.5pt 'Belogodor';
// content: '\00A0\E887';
// }
......@@ -20,7 +20,9 @@
* nombril de medor VERIF
* soutenir medor
* couv
* web
* droit
*/
......@@ -48,6 +50,16 @@ h3,
break-inside: avoid;
}
/**
* Re-ADDING default sup, after the reset so we don't have to have for every styling/fonts separetely
**/
sup {
vertical-align: super;
font-size: smaller;
}
/**
* no hyphens there
* https://developer.mozilla.org/en-US/docs/Web/CSS/hyphens
......@@ -248,6 +260,7 @@ figcaption footer small {
position: relative;
top: 1pt;
}
.endnote {
font-family: 'Nobel';
font-size: 7pt;
......@@ -338,15 +351,15 @@ figcaption footer small {
/**
* Specific styles
*/
@import "specific styles/edito.less";
@import "specific styles/entretien.less";
@import "specific styles/enquete.less";
@import "specific styles/flamand.less";
@import "specific styles/nombril.less";
@import "specific styles/portfolio.less";
@import "specific styles/portrait.less";
@import "specific styles/recit.less";
@import "specific styles/rubric.less";
@import "specific styles/sommaire.less";
@import "specific styles/web.less";
@import "specific styles/droit.less";
@import "specific styles/nombril.less";
<!DOCTYPE HTML>
<html lang="fr" class="normal">
<html lang="fr" class="normal facing">
<head>
<meta charset="utf-8">
......@@ -24,13 +24,8 @@
<div class="bloc x5 t0 w5 h1 flow-lead" style="margin-top: 36pt; margin-left: -9pt;"></div>
<!-- <div class="bloc x0 w3 t3 b13 flow-main" style="margin-top: 0pt; margin-bottom: 24pt;"></div>
<div class="bloc x3 w3 t3 b13 flow-main" style="margin-top: 0pt; margin-bottom: 24pt;"></div>
<div class="bloc x6 w3 t3 b13 flow-main" style="margin-top: 0pt; margin-bottom: 36pt;"></div> -->
<div class="bloc l0 walf t3 b13 flow-main" style="margin-top: 0pt; margin-bottom: 12pt;"></div>
<div class="bloc r0 walf t3 b13 flow-main" style="margin-top: 0pt; margin-bottom: 36pt;"></div>
<!-- <div class="bloc x6 w3 t3 b13 flow-main" style="margin-top: 0pt; margin-bottom: 36pt;"></div> -->
<!-- textbox -->
<!-- use negative top or bottom margin (multiple of 12) to make a bloc the desired heigh-->
......@@ -38,8 +33,6 @@
<div class="bloc l0 y5 b0 web-squared bleuclaire flow-main" style="margin-top: 0pt; margin-bottom: -12pt;"></div>
<div class="bloc r0 y4 b0 web-rounded vertpale flow-main" style="margin-top: 24pt; margin-bottom: -24pt;"></div>
<!-- illus -->
<!-- <div class="bloc x5 y11 w1 h1 flow-fig2"></div> -->
</div>
</div>
</div>
......@@ -56,12 +49,13 @@
<!-- textbox -->
<div class="bloc l0 y0 web-rounded b6 orange flow-main" style="margin-bottom: -48pt;"></div>
<div class="bloc r0 y3 web-squared b0 jaune flow-main" style="margin-top: 36pt; margin-bottom: -12pt;"></div>
</div>
</div>
</div>
<div id="stories">
<art id="flow-main" class="rubric web" folio="1" src="https://medor.coop/api/v2/pages/783"></art>
<art id="flow-main" class="rubric web" folio="124" src="https://medor.coop/api/v2/pages/865/?draft=true"></art>
</div>
<!-- JAVASCRIPT -->
......
@import "../../../css/main.less";
@import "../../../css/colors.less";
// FIXME desactiver les goutieres pour le sommaire!
sup {
vertical-align: super;
font-size: 60%;
padding-right: 1pt;
}
/*___ couleurs ___*/
@nuit-bleu: #112435;
@ombre-mauve: hsl(247, 35%, 25%);
@metal-orange: #e47550;
@spotlight-beige: hsl(57, 50%, 92%);
@reflet-vert: #a0d5b9;
@plante-vert: #53a679;
@sol-maron: hsl(341, 60%, 28%);
@hardcore-jaune: rgb(255, 248, 94);
.sombre{
background-color: @nuit-bleu;
color: @spotlight-beige;
}
.colored-1{
background-color: @metal-orange;
color: black
}
.colored-2{
background-color: @reflet-vert;
color: black
}
.colored-3{
background-color: @hardcore-jaune;
color: black
}
/*___ images ___*/
div[class^="item"] {
background-repeat: no-repeat;
background-size: 100%;
}
.img-cogito{
background-image: url('https://medor.coop/media/images/cogito.original.jpg');
background-position: 130% 0%;
background-size: 80% !important;
}
.img-croquemort{
background-image: url('https://medor.coop/media/images/croquemort.original.jpg');
// background-position: 11% 30%;
// background-size: 200% !important;
}
.img-gutsy{
background-image: url('https://medor.coop/media/images/gusty2.original.jpg');
background-position: 0 16pt;
}
.img-francine{
background-image: url('https://medor.coop/media/images/ITWFrancine.original.jpg');
background-position: 0% 0%;
background-size: 100% !important;
}
.img-momentflammand{
background-image: url('https://medor.coop/media/images/momentfl.original.jpg');
background-position: 15% 64%;
background-size: 120% !important;
}
.img-musique{
background-image: url('https://medor.coop/media/images/musique-edit.original.jpg');
background-position: 80% 95%;
background-size: 75% !important;
}
.img-pharma{
background-image: url('https://medor.coop/media/images/Pharma.original.png');
background-position: 0% 95%;
background-size: 100% !important;
}
.img-photo{
background-image: url('https://medor.coop/media/images/portfolio.original.jpg');
background-position: -10pt 0;
background-size: 123% !important;
}
.img-poupo{
background-image: url('https://medor.coop/media/images/kitty-crowther-1.original.jpg');
background-position: 75% 90%;
background-size: 75% !important;
}
.img-wc{
background-image: url('https://medor.coop/media/images/wc.original.jpg');
background-position: 0% 70%;
}
//___ adjust ___
#francine{
color: whitesmoke;
}
#francine h1{
font-size: 34pt !important;
line-height: 1em !important;
}
#flammand .pagination{
margin-bottom: 16pt;
}
/*___ basic ___*/
.texte_blanc {
color:white;
}
.texte_noir {
color:black;
}
.noir {
background-color: black;
color: white !important;
}
.blanc {
background-color: white;
}
.text-shadow {
text-shadow: 1px 1px 2px black;
}
//HEADLINE
.headline {
font-family: 'Alfphabet-Condensed' ;
font-size: 35pt ;
font-weight: normal;
margin-top: 0pt;
margin-bottom: 4pt;
margin-left: 3pt;
}
//SAISON/DATE
.date {
font-family: 'Alfphabet-Condensed';
font-size: 12pt;
margin-top: 0;
text-align: left;
}
#date {
position: absolute;
left: 140pt;
top: 10pt;
}
//PAGE NUMBER
.pagination {
font-family: 'Alfphabet-Condensed';
font-size: 21pt ;
font-weight: normal;
line-height: 17pt;
position: absolute;
right: 15pt;
bottom: 11pt;
text-align: right;
vertical-align: bottom;
}
//Style enquete
.som-grande-enquete {
font-family: 'Erbarre';
font-size: 38pt ;
font-weight: bold;
line-height: 36pt;
margin-top: 7pt;
margin-left: 6pt;
text-transform: uppercase;
}
//Style petite enquete?
.som-petite-enquete {
font-family: 'Erbarre' ;
font-size: 18pt ;
font-weight: bold;
line-height: 16pt;
margin-top: 7pt;
margin-left: 6pt;
letter-spacing: .05pt;
text-transform: uppercase;
}
//Style rubrique
.som-rubrique {
// font-family: 'career';
// font-size: 16pt ;
font-family: 'TGL12096';
font-size: 14pt;
font-weight: normal;
line-height: 13pt;
margin-top: 4pt;
margin-left: 6pt;
}
.sur-image {
line-height: 19pt !important;
font-size: 19pt !important;
}
//Style phrase d'accroche
.phrase {
font-family: 'Alfphabet-Condensed' ;
font-size: 13pt;
line-height: 14pt;
margin-top: 2pt;
margin-left: 6pt;
text-align: left;
text-transform: normal;
}
//fix: enlève page num
.sheet:nth-child(even) .main:before { content: " "; }
.sheet:nth-child(odd) .main:before { content: " "; }
/*CSS TEXTE*/
.container {
display: -webkit-grid;
display: grid;
-webkit-grid-template-columns: repeat(10, 1fr);
-webkit-grid-template-rows: repeat(12, 1fr);
grid-template-columns: repeat(9, 1fr);
grid-template-rows: repeat(12, 1fr);
}
.item {
padding: 2pt;
position: relative;
outline: 6px solid black;
outline-offset: -3px;
}
// ????
.gx0 { -webkit-grid-column-start: 1; }
.gx1 { -webkit-grid-column-start: 2; }
.gx2 { -webkit-grid-column-start: 3; }
.gx3 { -webkit-grid-column-start: 4; }
.gx4 { -webkit-grid-column-start: 5; }
.gx5 { -webkit-grid-column-start: 6; }
.gx6 { -webkit-grid-column-start: 7; }
.gx7 { -webkit-grid-column-start: 8; }
.gx8 { -webkit-grid-column-start: 9; }
.gx9 { -webkit-grid-column-start: 10; }
.gy0 { -webkit-grid-row-start: 1; }
.gy1 { -webkit-grid-row-start: 2; }
.gy2 { -webkit-grid-row-start: 3; }
.gy3 { -webkit-grid-row-start: 4; }
.gy4 { -webkit-grid-row-start: 5; }
.gy5 { -webkit-grid-row-start: 6; }
.gy6 { -webkit-grid-row-start: 7; }
.gy7 { -webkit-grid-row-start: 8; }
.gy8 { -webkit-grid-row-start: 9; }
.gy9 { -webkit-grid-row-start: 10; }
.gy10 { -webkit-grid-row-start: 11; }
.gy11 { -webkit-grid-row-start: 12; }
.gxs1 { -webkit-grid-column-end: span 1; }
.gxs2 { -webkit-grid-column-end: span 2; }
.gxs3 { -webkit-grid-column-end: span 3; }
.gxs4 { -webkit-grid-column-end: span 4; }
.gxs5 { -webkit-grid-column-end: span 5; }
.gxs6 { -webkit-grid-column-end: span 6; }
.gxs7 { -webkit-grid-column-end: span 7; }
.gxs8 { -webkit-grid-column-end: span 8; }
.gxs9 { -webkit-grid-column-end: span 9; }
.gxs10 { -webkit-grid-column-end: span 10; }
.gxs11 { -webkit-grid-column-end: span 11; }
.gxs12 { -webkit-grid-column-end: span 12; }
.gys1 { -webkit-grid-row-end: span 1; }
.gys2 { -webkit-grid-row-end: span 2; }
.gys3 { -webkit-grid-row-end: span 3; }
.gys4 { -webkit-grid-row-end: span 4; }
.gys5 { -webkit-grid-row-end: span 5; }
.gys6 { -webkit-grid-row-end: span 6; }
.gys7 { -webkit-grid-row-end: span 7; }
.gys8 { -webkit-grid-row-end: span 8; }
.gys9 { -webkit-grid-row-end: span 9; }
.gys10 { -webkit-grid-row-end: span 10; }
.gys11 { -webkit-grid-row-end: span 11; }
.gys12 { -webkit-grid-row-end: span 12; }
::after{
display: none !important;
}
......@@ -5,154 +5,159 @@
<meta charset="utf-8">
<title>Sommaire</title>
<script src="../../vendors/modernizr-custom.js"></script>
<script src="../../js/toolkit.js"></script>
<link rel="stylesheet" href="../../vendors/reset.css">
<link rel="stylesheet" href="../../vendors/normalize-opentype.css">
<link rel="stylesheet" href="css/style.less" type="text/less">
<link rel="stylesheet" href="style.less" type="text/less">
</head>
<body>
<div id="pages">
<div id="page-1" class="sheet">
<div class="page">
<div class="container main">
<!-- bloc 1 Sommaire-->
<div class="item item-a cellule sombre" style="-webkit-grid-column-end: span 5; -webkit-grid-row-end: span 1; -webkit-grid-row-start: 1; -webkit-grid-column-start: 1;">
<h1 class="headline" style="">sommaire</h1>
<div class="cellule" id="date">
<p class="date" style="">Médor 21&nbsp;<br>Hiver 2020</p>
<div id="page-1" class="sheet">
<div class="page">
<div class="container main sommaire">
<!-- bloc 1 Sommaire-->
<div class="cellule headline" style="-webkit-grid-column-end: span 6; -webkit-grid-row-end: span 1; -webkit-grid-row-start: 1; -webkit-grid-column-start: 1;">
<h1>sommaire</h1>
<div id="date">
<p class="date">Médor 22&nbsp;<br>Printemps 2021</p>
</div>
</div>
</div>
<div class="item cellule colored-2" style="-webkit-grid-column-start: 1; -webkit-grid-column-end: span 3; -webkit-grid-row-start: 2; -webkit-grid-row-end: span 2;">
<h1 class="som-rubrique" style="">Enquêteke</h1>
<p class="phrase">Dans le chef du boss</p>
<p class="pagination">p. 3</p>
</div>
<div id="enket" class="cellule rubrique" style="-webkit-grid-column-start: 1; -webkit-grid-column-end: span 3; -webkit-grid-row-start: 2; -webkit-grid-row-end: span 2;">
<h1>Enquêteke</h1>
<p class="phrase">On a les boules</p>
<p class="pagination">p. 3</p>
</div>
<div class="item cellule colored-1" style="-webkit-grid-column-start: 4; -webkit-grid-column-end: span 2; -webkit-grid-row-start: 2; -webkit-grid-row-end: span 2;">
<h1 class="som-rubrique">Sexe <br>de Médor</h1>
<p class="phrase">Confucius <br>et les périmées</p>
<p class="pagination" style="">p. 6</p>
</div>
<div id="sex" class="cellule rubrique" style="-webkit-grid-column-start: 4; -webkit-grid-column-end: span 3; -webkit-grid-row-start: 2; -webkit-grid-row-end: span 2;">
<h1>Sexe de&nbsp;Médor</h1>
<p class="phrase">Passage à la puberté <br>dans les règles</p>
<p class="pagination">p. 6</p>
</div>
<div class="item cellule img-poupo" style="-webkit-grid-column-start: 6; -webkit-grid-column-end: span 5; -webkit-grid-row-start: 1; -webkit-grid-row-end: span 6;">
<h1 class="som-grande-enquete">L’enfer des bébés placés</h1>
<p class="phrase">Enquête dans<br>les pouponnières</p>
<p class="pagination" style="">p. 10</p>
</div>
<div class="cellule petite-enquete" style="-webkit-grid-column-start: 7; -webkit-grid-column-end: span 4; -webkit-grid-row-start: 1; -webkit-grid-row-end: span 3;">
<h1>Les projets qui f<span class="accent circonflexe">âchent</h1>
<p class="phrase">Herbeumont, ses&nbsp;cabanes, ses&nbsp;cabales</p>
<p class="pagination">p. 10</p>
</div>
<div id="cogito" class="item cellule img-cogito" style="-webkit-grid-column-start: 1; -webkit-grid-column-end: span 5; -webkit-grid-row-start: 4; -webkit-grid-row-end: span 3;">
<h1 class="som-petite-enquete" style="">Cogito</h1>
<p class="phrase">À l’école<br>du fric</p>
<p class="pagination" style="">p. 20</p>
</div>
<div id="fanny" class="cellule grande-enquete" style="-webkit-grid-column-start: 1; -webkit-grid-column-end: span 6; -webkit-grid-row-start: 4; -webkit-grid-row-end: span 2;">
<h1>Sans Écoute</h1>
<p class="phrase">Harcèlement, plaintes et poignard</p>
<p class="pagination">p. 16</p>
</div>
<div class="item cellule sombre" style="-webkit-grid-column-start: 1; -webkit-grid-column-end: span 4; -webkit-grid-row-start: 7; -webkit-grid-row-end: span 4;">
<h1 class="som-grande-enquete">Musique en Belgique</h1>
<p class="phrase">La fausse note</p>
<p class="pagination" style="">p. 28</p>
</div>
<div class="cellule rubrique" style="-webkit-grid-column-start: 7; -webkit-grid-column-end: span 4; -webkit-grid-row-start: 4; -webkit-grid-row-end: span 2;">
<h1>Droit de suite</h1>
<p class="phrase">Du neuf dans les&nbsp;pouponnières</p>
<p class="pagination">p. 27</p>
</div>
<div class="item cellule img-pharma" style="-webkit-grid-column-start: 5; -webkit-grid-column-end: span 4; -webkit-grid-row-start: 7; -webkit-grid-row-end: span 4;">
<h1 class="som-grande-enquete" style="text-transform: none;">McKESSON</h1>
<p class="phrase">Ou comment se dorer la pilule</p>
<p class="pagination">p. 40</p>
</div>
<div id="etudiantes" class="cellule grande-enquete" style="-webkit-grid-column-start: 1; -webkit-grid-column-end: span 5; -webkit-grid-row-start: 6; -webkit-grid-row-end: span 3;">
<h1>Étudiantes voilées</h1>
<p class="phrase">Parole aux concernées</p>
<p class="pagination">p. 28</p>
</div>
<div class="item cellule colored-3" style="-webkit-grid-column-start: 9; -webkit-grid-column-end: span 2; -webkit-grid-row-start: 7; -webkit-grid-row-end: span 2;">
<h1 class="som-rubrique">Médor à jouer<p></p>
<p class="pagination">p. 50</p>
</h1></div>
<div class="cellule grande-enquete" style="-webkit-grid-column-start: 6; -webkit-grid-column-end: span 5; -webkit-grid-row-start: 6; -webkit-grid-row-end: span 4;">
<h1>Bruxelles Propreté</h1>
<p class="phrase">Sales constats <br>pour l’agence qui nettoie</p>
<p class="pagination">p. 36</p>
</div>
<div class="item cellule colored-2" style="-webkit-grid-column-start: 9; -webkit-grid-column-end: span 2; -webkit-grid-row-start: 9; -webkit-grid-row-end: span 2;">
<h1 class="som-rubrique">BD</h1>
<p class="phrase">La bourse ou la connexion?</p>
<p class="pagination">p. 52</p>
</div>
<div id="mauxpeau" class="cellule grande-enquete" style="-webkit-grid-column-start: 1; -webkit-grid-column-end: span 5; -webkit-grid-row-start: 9; -webkit-grid-row-end: span 10;">
<h1>Racisme et blouses blanches</h1>
<p class="phrase">Les maux qui collent à la peau</p>
<p class="pagination">p. 46</p>
</div>
<div id="flammand" class="item cellule img-momentflammand" style="-webkit-grid-column-start: 1; -webkit-grid-column-end: span 10; -webkit-grid-row-start: 11; -webkit-grid-row-end: span 2;">
<h1 class="som-grande-enquete" style="">Les terres assoiffées</h1>
<p class="phrase">Moment flamand</p>
<p class="pagination">p. 66</p>
</div>
<div id="bd" class="cellule petite-enquete" style="-webkit-grid-column-start: 6; -webkit-grid-column-end: span 10; -webkit-grid-row-start: 10; -webkit-grid-row-end: span 3;">
<h1>Accoucher masquée</h1>
<p class="categorie">BD</p>
<p class="pagination">p. 54</p>
</div>
</div>
</div>
</div>
</div>
<div id="page-2" class="sheet">
<div class="page">
<div class="container main">
<div class="item cellule img-wc" style="-webkit-grid-column-start: 1; -webkit-grid-column-end: span 5; -webkit-grid-row-start: 1; -webkit-grid-row-end: span 3;">
<h1 class="som-petite-enquete">W-C et genre</h1>
<p class="phrase">La queue des filles</p>
<p class="pagination">p. 76</p>
</div>
<div class="item cellule colored-1" style="-webkit-grid-column-start: 1; -webkit-grid-column-end: span 5; -webkit-grid-row-start: 4; -webkit-grid-row-end: span 1;">
<h1 class="som-rubrique">Fulguro-point</h1>
<p class="phrase">Kiosk et mix</p>
<p class="pagination">p. 81</p>
</div>
<div class="item cellule img-photo" style="-webkit-grid-column-start: 6; -webkit-grid-column-end: span 8; -webkit-grid-row-start: 1; -webkit-grid-row-end: span 4;">
<h1 class="som-grande-enquete">Photo</h1>
<p class="phrase">Pas de quartier. <br>Canal sans pitié.</p>
<p class="pagination">p. 84</p>
</div>
<div class="item cellule sombre" style="-webkit-grid-column-start: 1; -webkit-grid-column-end: span 2; -webkit-grid-row-start: 5; -webkit-grid-row-end: span 2;">
<h1 class="som-rubrique">Traits belges</h1>
<p class="phrase">Un cas, ce <i>k</i></p>
<p class="pagination">p. 98</p>
</div>
<div class="item cellule img-gutsy" style="-webkit-grid-column-start: 6; -webkit-grid-column-end: span 5; -webkit-grid-row-start: 5; -webkit-grid-row-end: span 4;">
<h1 class="som-petite-enquete">À quoi sert le Benelux&nbsp;?</h1>
<p class="phrase">Portrait de Gusty le Magnifique</p>
<p class="pagination">p. 100</p>
</div>
<div class="item cellule colored-2" style="-webkit-grid-column-start: 3; -webkit-grid-column-end: span 3; -webkit-grid-row-start: 5; -webkit-grid-row-end: span 2;">
<h1 class="som-rubrique">Aire libre</h1>
<p class="phrase">Teams, monopole <br>à l'école&nbsp;?</p>
<p class="pagination">p. 106</p>
</div>
<div id="francine" class="item cellule img-francine" style="-webkit-grid-column-start: 1; -webkit-grid-column-end: span 5; -webkit-grid-row-start: 7; -webkit-grid-row-end: span 4;">
<h1 class="som-grande-enquete">Entretien avec Francine Pairon</h1>
<p class="phrase">La mode est tout<br>sauf accessoire&nbsp;!</p>
<p class="pagination">p. 110</p>
</div>
<div id="pompe" class="item cellule img-croquemort" style="-webkit-grid-column-start: 6; -webkit-grid-column-end: span 6; -webkit-grid-row-start: 9; -webkit-grid-row-end: span 3;">
<h1 class="som-petite-enquete" style="color:white;margin-top:12pt;">Pompes funèbres</h1>
<p class="phrase" style="color:white;">Petits morts entre amis</p>
<p class="pagination" style="color:white;">p. 118</p>
</div>
<div class="item cellule colored-1" style="-webkit-grid-column-start: 1; -webkit-grid-column-end: span 3; -webkit-grid-row-start: 11; -webkit-grid-row-end: span 3;">
<h1 class="som-rubrique">Droit de suite</h1>
<p class="phrase">Du neuf dans nos vieux dossiers</p>
<p class="pagination" style="">p. 123</p>
</div>
<div class="item cellule colored-3" style="-webkit-grid-column-start: 4; -webkit-grid-column-end: span 2; -webkit-grid-row-start: 11; -webkit-grid-row-end: span 3;">
<h1 class="som-rubrique" style="">Coulisses <br>du web</h1>
<p class="pagination" style="">p. 124</p>
</div>
<div class="item cellule sombre" style="-webkit-grid-column-start: 6; -webkit-grid-column-end: span 5; -webkit-grid-row-start: 12; -webkit-grid-row-end: span 6;">
<h1 class="som-rubrique" style="">Le nombril </h1>
<p class="pagination" style="">p. 126</p>
</div>
</div>
<div id="page-2" class="sheet">
<div class="page">
<div class="container main sommaire">
<div id="airlibre" class="cellule rubrique" style="-webkit-grid-column-start: 1; -webkit-grid-column-end: span 5; -webkit-grid-row-start: 1; -webkit-grid-row-end: span 2;">
<h1>Aire Libre</h1>
<p class="phrase">La force du libre, <br>les pouvoirs locaux</p>
<p class="pagination">p. 68</p>
</div>
</div>
<div id="photo" class="cellule grande-enquete" style="-webkit-grid-column-start: 1; -webkit-grid-column-end: span 5; -webkit-grid-row-start: 3; -webkit-grid-row-end: span 2;">
<h1>Mourir et&nbsp;rester</h1>
<p class="categorie">Photo</p>