mep_carnet.css 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288
  1. :root {
  2. --cols: 8;
  3. --rows: 8;
  4. --guts: 4mm;
  5. --beige: #fbf2e7;
  6. --ocre: #d98a29;
  7. }
  8. @page {
  9. size: 165mm 230mm;
  10. margin-top: 16mm;
  11. margin-bottom: 16mm;
  12. bleed: 6mm;
  13. color: black;
  14. marks: crop;
  15. }
  16. @page:left {
  17. margin-left: 16mm;
  18. margin-right: 8mm;
  19. @left-middle {
  20. content: counter(page);
  21. display: flex;
  22. justify-content: center;
  23. align-items: center;
  24. font-family: 'Ortica';
  25. font-weight: bold;
  26. font-size: 8pt;
  27. color: var(--ocre);
  28. height: 30mm;
  29. }
  30. @left-top {
  31. content: 'Titre sous-section';
  32. white-space: nowrap;
  33. font-family: 'Ortica';
  34. font-weight: bold;
  35. font-size: 8pt;
  36. display: flex;
  37. flex-direction: column;
  38. align-items: center;
  39. justify-content: flex-start;
  40. text-align: right;
  41. }
  42. @left-bottom {
  43. content: 'Partie générale';
  44. white-space: nowrap;
  45. font-family: 'Ortica';
  46. font-weight: bold;
  47. font-size: 8pt;
  48. display: flex;
  49. flex-direction: column;
  50. align-items: center;
  51. justify-content: flex-end;
  52. }
  53. }
  54. .pagedjs_margin-left-top div, .pagedjs_margin-left-bottom div {
  55. display: block;
  56. min-width: max-content;
  57. transform: rotate(-90deg);
  58. }
  59. @page:right {
  60. margin-left: 8mm;
  61. margin-right: 16mm;
  62. }
  63. body {
  64. font-family: 'Public';
  65. }
  66. h2 {
  67. color: blue;
  68. }
  69. h3 {
  70. color: red;
  71. }
  72. .moment {
  73. padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
  74. display: block;
  75. font-size: 11pt;
  76. font-weight: bold;
  77. line-height: 1.1; /* LA IL FAUT AJUSTER CF TEMPS 14 */
  78. }
  79. .moment:first-of-type {
  80. break-before: left;
  81. }
  82. .moment .first-letter {
  83. font-size: 18pt;
  84. }
  85. .temps {
  86. padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
  87. font-size: 9pt;
  88. margin-top: -3pt;
  89. margin-bottom: 8pt;
  90. font-weight: 500;
  91. }
  92. .temps:before {
  93. content: "> ";
  94. }
  95. .labeur {
  96. padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
  97. line-height: 12pt;
  98. font-size: 9pt;
  99. text-align: justify;
  100. hyphens: auto;
  101. }
  102. .labeur p:before {
  103. content: '+ ';
  104. font-weight: bold;
  105. }
  106. .labeur ul {
  107. list-style: none;
  108. padding-left: 3mm;
  109. }
  110. .latour, .lampe {
  111. font-family: 'Novel';
  112. font-weight: normal;
  113. margin-top: 20mm;
  114. margin-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
  115. margin-right: -16mm;
  116. margin-bottom: 20mm;
  117. background-color: var(--beige);
  118. line-height: 12pt;
  119. font-size: 9pt;
  120. padding-right: 18mm;
  121. padding-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
  122. padding-bottom: 10mm;
  123. padding-top: 10mm;
  124. }
  125. .encart-split {
  126. position: absolute;
  127. margin-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
  128. background-color: #fbf2e7;
  129. }
  130. .pagedjs_left_page .latour, .pagedjs_left_page .lampe {
  131. padding-right: 10mm;
  132. width: 128.375mm;
  133. }
  134. .latour[data-split-original="true"] {
  135. padding-bottom: 1mm !important;
  136. }
  137. .latour[data-split-from] {
  138. padding-top: 1mm !important;
  139. }
  140. .latour-header, .lampe-header {
  141. display: flex;
  142. flex-direction: row;
  143. align-items: center;
  144. line-height: 1.1;
  145. /* font-family: 'Novel';
  146. */ font-weight: bold;
  147. }
  148. .latour-header div:first-of-type,
  149. .lampe-header div:first-of-type {
  150. margin-top: 1mm;
  151. margin-right: 2mm;
  152. }
  153. .lampe {
  154. padding-top: 3mm;
  155. padding-bottom: 3mm;
  156. }
  157. img {
  158. width: 100%;
  159. }
  160. .fullpage2imgs {
  161. width: 130mm;
  162. height: 210mm;
  163. }
  164. .fullpageimage {
  165. margin-top: -22mm;
  166. margin-left: -10mm;
  167. width: 171mm;
  168. height: 230mm;
  169. }
  170. .bottomimg {
  171. width: 100%;
  172. }
  173. .bottomimg img {
  174. height: 100%;
  175. }
  176. .tripleimgs,
  177. .tripleimgs_bottom {
  178. break-before: page;
  179. break-after: page
  180. }
  181. .tripleimgs img:nth-of-type(2),
  182. .tripleimgs_bottom img:first-of-type {
  183. width: calc(50% - 1mm);
  184. margin-right: 2mm;
  185. }
  186. .tripleimgs img:last-of-type,
  187. .tripleimgs_bottom img:nth-of-type(2) {
  188. width: calc(50% - 1mm);
  189. }
  190. .tripleimgs2,
  191. .tripleimgs2_bottom {
  192. break-before: page;
  193. break-after: page
  194. }
  195. .tripleimgs2 img:nth-of-type(2),
  196. .tripleimgs2_bottom img:first-of-type {
  197. width: calc(37.5% - 1mm);
  198. margin-right: 2mm;
  199. }
  200. .tripleimgs2 img:last-of-type,
  201. .tripleimgs2_bottom img:nth-of-type(2) {
  202. width: calc(62.5% - 1mm);
  203. }
  204. .imgfullspreadleft {
  205. break-before: left;
  206. break-after: left;
  207. width: 149mm;
  208. overflow: hidden;
  209. }
  210. .imgfullspreadright {
  211. break-before: left;
  212. break-after: left;
  213. width: 149mm;
  214. overflow: hidden;
  215. }
  216. .imgfullspreadleft img {
  217. height: 198mm;
  218. width: auto;
  219. }
  220. .imgfullspreadright img {
  221. height: 198mm;
  222. width: auto;
  223. }
  224. .imgfullspreadleft-right {
  225. width: 149mm;
  226. overflow: hidden;
  227. margin-left: -16mm;
  228. }
  229. .imgfullspreadright-right {
  230. width: 149mm;
  231. margin-left: -8mm;
  232. overflow: hidden;
  233. display: flex;
  234. justify-content: flex-end;
  235. }
  236. .imgfullspreadright-right img {
  237. height: 198mm;
  238. width: auto;
  239. }
  240. .imgfullspreadleft-right img {
  241. height: 198mm;
  242. width: auto;
  243. margin-left: -141mm;
  244. }