:root { --cols: 8; --rows: 8; --guts: 4mm; } @page { size: 165mm 230mm; margin-top: 16mm; margin-bottom: 16mm; bleed: 6mm; color: black; marks: crop; } @page:left { margin-left: 16mm; margin-right: 8mm; @left-middle { content: counter(page); display: flex; justify-content: center; align-items: center; font-family: 'Ortica'; font-weight: bold; font-size: 8pt; height: 30mm; } @left-top { content: ''; white-space: nowrap; font-family: 'Ortica'; font-weight: lighter; font-size: 7pt; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; text-align: right; } @left-bottom { content: ''; white-space: nowrap; font-family: 'Ortica'; font-weight: lighter; font-size: 7pt; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; } } .pagedjs_margin-left-top div, .pagedjs_margin-left-bottom div { display: block; min-width: max-content; transform: rotate(-90deg); } @page:right { margin-left: 8mm; margin-right: 16mm; } body { font-family: 'Public'; } #chargement { position: fixed; background-color: chocolate; padding: 5px; color: white; top: 10px; left: 10px; opacity: 1; transition: opacity 0.3s ease-out; z-index: 9999; } a { text-decoration: underline; } h2 { font-family: 'Ortica'; font-weight: lighter; padding: 0 10%; font-size: 24pt; break-before: left; color: white; margin: 0; line-height: 1.2 !important; text-align: center; } .partie_count { font-size: 55pt; color: white; font-family: 'Ortica'; font-weight: bold; width: 100%; text-align: center; line-height: 1; margin-bottom: 33pt; } h3 { break-before: left; font-family: 'Ortica'; font-weight: lighter; font-size: 28pt; line-height: 1.3; margin: 0; width: 50%; } h3 .gros-chiffre { font-size: 54pt; font-family: 'Ortica'; font-weight: bold; margin-bottom: -5mm; } h4 { break-before: left; margin-top: 0; font-size: 16pt; line-height: 1.1; color: black; font-family: 'Ortica'; font-weight: bold; } .breakbefore { break-before: page; } .breakafter { break-after: page; } .moment { padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols)); display: block; font-size: 11pt; font-weight: bold; line-height: 1.1; /* LA IL FAUT AJUSTER CF TEMPS 14 */ } .moment + .moment { margin-bottom: 14pt; } .moment .first-letter { font-size: 18pt; } .temps { padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols)); font-size: 9pt; margin-top: -1pt; margin-bottom: 8pt; font-weight: 500; } .temps:before { content: "> "; } .labeur, .free { padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols)); line-height: 12pt; font-size: 9pt; text-align: justify; hyphens: auto; } .labeur p:before { content: '+ '; font-weight: bold; } .labeur li { margin-bottom: 4pt; } .labeur li:before { content: '× '; font-weight: bold; } .labeur ul { list-style: none; padding-left: 3mm; } .latour, .lampe { font-family: 'Novel'; font-weight: normal; margin-top: 20mm; margin-left: calc(var(--pagedjs-pagebox-width) / var(--cols)); margin-right: -16mm; margin-bottom: 20mm; line-height: 12pt; font-size: 8pt; padding-right: 18mm; padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols)); padding-bottom: 10mm; padding-top: 10mm; background-color: beige; } .encart-split { position: absolute; margin-left: calc(var(--pagedjs-pagebox-width) / var(--cols)); background-color: beige; } .pagedjs_left_page .latour, .pagedjs_left_page .lampe { padding-right: 10mm; width: 128.375mm; } .latour[data-split-original="true"] { padding-bottom: 1mm !important; } .latour[data-split-from] { padding-top: 1mm !important; } .latour-header, .lampe-header { display: flex; flex-direction: row; align-items: center; margin-bottom: 3mm; font-weight: bold; } .latour-header img:first-of-type, .lampe-header img:first-of-type { margin-top: 1mm; margin-right: 2mm; width: 8mm; } .lampe { padding-top: 3mm; padding-bottom: 3mm; } .bibliographie { column-count: 2; column-gap: var(--guts); column-fill: auto; line-height: 12pt; font-size: 9pt; font-weight: bold; } img { width: 100%; } .imgsmall { padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols)); } .imgsmall img { width: 100%; } .fullpage2imgs { width: 140mm; height: 210mm; padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols)); } .fullpageimage { margin-top: -22mm; margin-left: -10mm; width: 171mm; height: 230mm; } .bottomimg { width: 100%; break-after: page; } .bottomimg img { height: 100%; } .tripleimgs, .tripleimgs_bottom { break-before: page; break-after: page } .tripleimgs img:nth-of-type(2), .tripleimgs_bottom img:first-of-type { width: calc(50% - 2mm); margin-right: 4mm; } .tripleimgs img:last-of-type, .tripleimgs_bottom img:nth-of-type(2) { width: calc(50% - 2mm); } .tripleimgs2, .tripleimgs2_bottom { break-before: page; break-after: page } .tripleimgs2 img:nth-of-type(2), .tripleimgs2_bottom img:first-of-type { width: calc(37.5% - 2mm); margin-right: 4mm; } .tripleimgs2 img:last-of-type, .tripleimgs2_bottom img:nth-of-type(2) { width: calc(62.5% - 2mm); } .imgfullspreadleft, .imgfullspreadright, .imgfullspreadright_bleedtop, .imgfullspreadright_bleed { break-before: left; break-after: left; width: 149mm; overflow: hidden; } .imgfullspreadright_bleedtop { margin-top: -22mm; height: 220mm; } .imgfullspreadright_bleed { margin-top: -22mm; height: 242mm; } .imgfullspreadleft img, .imgfullspreadright img { height: 198mm; width: auto; } .imgfullspreadright_bleedtop img { height: 220mm; width: auto; } .imgfullspreadright_bleed img { height: 242mm; width: auto; } .imgfullspreadleft-right { width: 149mm; overflow: hidden; margin-left: -16mm; } .imgfullspreadright-right { width: 143mm; margin-left: -8mm; overflow: hidden; display: flex; justify-content: flex-end; } .imgfullspreadright_bleedtop-right, .imgfullspreadright_bleed-right { width: 173mm; height: 220mm !important; margin-top: -22mm; margin-left: -8mm; overflow: hidden; display: flex; justify-content: flex-end; } .imgfullspreadright_bleed-right, .imgfullspreadright_bleed-right img { height: 242mm !important; } .imgfullspreadright_bleedtop-right img, .imgfullspreadright_bleed-right img { height: 220mm; width: auto; } .imgfullspreadright-right img { height: 198mm; width: auto; } .imgfullspreadleft-right img { height: 198mm; width: auto; margin-left: -141mm; }