:root{ --font-size: 12px; --line-height: 18px; --small-font-size: 10px; --small-line-height: 15px; --h2-font-size: 21px; --h2-line-height: 27px; --first-indent: 7mm; --second-indent: 20mm; } /* --------------- */ /* h1: section titles */ /* h2: contribution titles */ /* --------------- */ @font-face{ font-family: "bitter"; src: url(../fonts/Bitter-Medium.ttf); font-weight: normal; font-style: normal; } @font-face{ font-family: "bitter"; src: url(../fonts/Bitter-MediumItalic.ttf); font-weight: normal; font-style: italic; } @font-face{ font-family: "bitter"; src: url(../fonts/Bitter-Bold.ttf); font-weight: bold; font-style: normal; } @font-face{ font-family: "bitter"; src: url(../fonts/Bitter-BoldItalic.ttf); font-weight: bold; font-style: italic; } @font-face{ font-family: "bitter_semi"; src: url(../fonts/Bitter-SemiBold.ttf); font-weight: normal; font-style: normal; } /* custom markers */ div.page-break{ page-break-after: always; } div.column-break{ /* does not work from this stylesheet, rule gets removed by paged.js??? */ /* only worked once inserted directly into the HTML */ break-after: column; } div.column-break + p{ orphans: 8; } div.no-hyphens{ hyphens: none !important; } div.no-indent p{ text-indent: unset !important; } div.contribution.bugged-report div.no-indent p{ width: 100%; margin-bottom: var(--line-height); } div.contribution.bugged-report div.right-align{ text-align: right; margin-left: 0; margin-bottom: var(--line-height); } /* general */ body{ font-family: "bitter"; font-size: var(--font-size); line-height: var(--line-height); letter-spacing: 0.01em; /*hyphens: auto;*/ /*-webkit-hyphenate-limit-chars: 8 2 4;*/ /* word length, minimum number of characters before and after the hyphen -- does not work in chrome */ orphans: unset; /* Default is 2. These might trigger disappearing sentences at pagebreak? https://mattermost.pagedmedia.org/pagedmedia/pl/xsetebgcbbddzggwbbn93e5k1a */ widows: unset; /* Default is 2. These might trigger disappearing sentences at pagebreak? https://mattermost.pagedmedia.org/pagedmedia/pl/xsetebgcbbddzggwbbn93e5k1a */ } @page{ /*size: 152.4mm 228.6mm;*/ /* Size of the online PDF */ /*size: 152mm 229mm;*/ /* Size listed in cover generator of Lightning Source */ /*size: 164mm 237mm;*/ /* Size of the physical printed DB06 book */ size: 152.4mm 228.6mm; /* about 3mm in pixels */ bleed: 12px; marks: crop; @bottom-center{ content: counter(page); font-size: 9.5pt; margin-top: -6mm; } } @page:right{ margin: 14.758mm 18mm 21.225mm 29.125mm; } @page:left{ margin: 14.758mm 29.125mm 21.225mm 18mm; } @page:right{ /* running header: contribution title (taken from the h2 of the contribution) */ @top-center{ content: string(contributiontitle); font-size: 8pt; text-transform: uppercase; margin-top: 5mm; } } @page:left{ /* running header: section title (taken from the h1 of the section) */ @top-center{ content: element(sectiontitle); font-size: 8pt; text-transform: uppercase; margin-top: 5mm; } } @page:first{ /* cover */ /*background: linear-gradient(180deg, #787cc0, #c0c1e7);*/ background: linear-gradient(180deg, #3741ea, #c0c1e7); @top-center{ content: none; } @bottom-center{ content: none; } } @page backcover{ /* backcover */ /*background: linear-gradient(180deg, #787cc0, #c0c1e7);*/ background: linear-gradient(180deg, #3741ea, #c0c1e7); @top-center{ content: none; } @bottom-center{ content: none; } } @page section{ /* section title pages */ /*background: linear-gradient(180deg, #787cc0, #c0c1e7);*/ background: linear-gradient(180deg, #3741ea, #c0c1e7); color: white !important; @top-center{ content: none; } @bottom-center{ color: white !important; } } @page section:first{ @bottom-center{ content: none; } } @page contribution:first{ /* exception for running-header on the first page of a contribution */ margin-top: 128px; @top-center{ content: none; } } @page nomarks{ @top-center{ content: none; } @bottom-center{ content: none; } } @page nomarkssmallmargins:right{ @top-center{ content: none; } @bottom-center{ content: none; } } @page nomarkssmallmargins:left{ @top-center{ content: none; } @bottom-center{ content: none; } } @page:blank{ @top-center{ content: none; } @bottom-center{ content: none; } } /* for fullpage image contributions */ @page fullpage{ margin: 0 !important; @top-center{ content: none; } @bottom-center{ content: none; } } /* sections -- page flows */ div.section{ page: section; /* force an extra blank page before each section ... */ page-break-before: left; } div.section.intro{ /* exception for the intro section, as there is no title page for this section */ page: contribution !important; } div.section.toc, div.section.intro{ /* exception for the section of the toc and intro, as it needs to be on the right */ page-break-before: right !important; } div.section h1{ /* ... and make sure that each section starts on the right */ page-break-before: right; } div.multi{ counter-reset: page 1; } /* sub-sections -- page flows */ div.multi, div.preface, div.introduction, div.contribution{ page-break-before: right; } div.preface, div.acknowledgements, div.introduction, div.contribution, div.appendix{ page: contribution; } div.section.nomarks, div.section.toc, div.contribution.beirut-82 div.thumb, div.enlarged-image{ page: nomarks; } div.special_image_treatment.userinfo{ page: nomarkssmallmargins; } div.cover.second, div.multi, div.series{ page-break-after: always; } /* force extra page-break for section title pages to start on the left */ div.contribution.so-called-plants, div.contribution.invasive-imagination, div.contribution.interview-phil{ page-break-after: always; } div.appendix{ page-break-before: always; } div.appendix.letter{ page-break-before: right; } div.backcover{ page-break-before: left; page: backcover; } /* sub-sections -- lay-out rules */ div.cover, div.backcover{ hyphens: none; margin: -7.5mm 0 0 20mm; } div.cover, div.cover ul li, div.backcover b{ font-size: 17pt; font-family: "bitter_semi"; line-height: 1.4; letter-spacing: 0.025em; color: white; font-weight: bold; } /*div.multi img{ position: absolute !important; top: 13mm !important; left: -30mm !important; width: 152.4mm !important; display: unset; }*/ div.cover ul{ padding: 0; margin: 2em 0; } div.cover ul li{ margin-bottom: 0.1em !important; } div.cover.second, div.cover.second ul li{ color: black; } div.backcover{ color: white; } div.backcover b{ margin-left: 0; } div.backcover p{ margin-bottom: var(--line-height); } div.series{ font-size: var(--small-font-size); line-height: var(--small-line-height); hyphens: none; } div.series.about{ width: 50%; } div.series.colophon{ columns: 2 auto; column-gap: 8mm; column-fill: auto; height: 207mm; } /* Table of Contents */ div.toc *{ font-size: var(--font-size); hyphens: none; } /* the word "Content" at the top of the page */ div.toc > p:first-of-type{ font-size: 16pt !important; font-family: "bitter_semi"; line-height: 22pt; letter-spacing: 0.025em; margin: -26px 0 33px var(--second-indent) !important; } div.toc a::before{ content: target-counter(attr(href url), page); float: left; font-weight: normal; margin-left: -13.5mm; } div.toc p{ margin-top: 1.5em; margin-left: 7mm; } div.toc ul{ margin: var(--line-height) 0 0 10mm !important; } div.toc ul li{ margin-bottom: 0.5em; } /* forcing "Signs of clandestine" in toc to next page */ div.toc ul:nth-of-type(5) { page-break-before: avoid; } /* disabling wiki-only entries */ div.toc ul:nth-of-type(2) li:last-of-type { /* The Extended Trans*feminist Rendering Program */ display: none; } div.toc ul:nth-of-type(3) li:last-of-type { /* Comprehensive Features */ display: none; } div.toc ul:nth-of-type(4) li:nth-of-type(3) { /* somatopologies: a guided tour II */ display: none; } div.introduction, div.contribution{ } div.introduction h1{ display: none; } div.contribution h2 + p > b{ font-weight: normal; } div.item_index{ hyphens: none; } div.item_index ul{ column-gap: 10mm; padding: 0; } div.item_index li{ margin-bottom: 0 !important; text-indent: -7mm; margin-left: 7mm; } div.item_index li a::after{ content: ", " target-counter(attr(href), page); font-weight: bold; margin-left: -0.15em; /* To remove the weird gaps between inline-blocks. This seems to be a general problem in HTML5/CSS3 */ } div.item_index li span.item_nr{ width: 10mm; text-align: right; } /* Invasive imagination and its agential cuts - figures */ div.two-columns{ columns: 2 auto; column-fill: auto; column-gap: 14mm; } div.two-columns img, div.two-columns div.thumb{ display: block; float: left; } div.two-columns img, div.two-columns div.thumb img{ width: 55mm !important; } /* general elements*/ span.star{ /* ----> ✶ <--- */ font-family: monospace; vertical-align: text-bottom; line-height: 1.4; } h1{ /* section titles */ font-size: 44px; line-height: 52px; margin: 0; word-break: normal; hyphens: manual !important; } /* h1's are followed by a */ .running-header-section{ position: running(sectiontitle); } h2{ /* Contribution titles */ string-set: contributiontitle content(text) !important; font-family: "bitter_semi"; font-size: var(--h2-font-size); line-height: var(--h2-line-height); letter-spacing: 0.025em; margin: 0 0 0.2em 0; hyphens: none; } /* title wrapper, to take these out of the baseline */ div.title-wrapper{ position: absolute; margin: -97px 0 var(--h2-font-size) var(--second-indent); } div.title-wrapper p{ position: absolute; width: 80mm; } /* exception for the introduction */ div.introduction div.title-wrapper h2{ margin: 0 !important; padding: 0 !important; } div.introduction div.title-wrapper h2 + p{ position: absolute; width: 80mm; top: 85px !important; margin: 0 !important; color: red; } /* author names */ div.preface h2, div.introduction h2, div.contribution h2{ margin-bottom: 0.2em !important; } div.preface h2 + p, div.introduction h2 + p, div.contribution h2 + p{ margin-left: 0 !important; text-indent: unset !important; font-weight: normal; } div.preface h2 + p > b, div.introduction h2 + p > b, div.contribution h2 + p > b{ font-weight: normal !important; } h3{ /* Sub-headers + Notes/References sections + TOC headers*/ font-size: var(--font-size); line-height: var(--line-height); page-break-after: avoid; margin: var(--line-height) 0 0 var(--second-indent); letter-spacing: 0.05em; hyphens: none; } div.contribution.information-for-users h3{ margin-bottom: var(--line-height) !important; } div.contribution.bugged-report h3{ margin-bottom: var(--line-height) !important; } div.introduction + h3{ color: red; margin-top: 0 !important; } /* exception for bugged report h3 above notes */ div.contribution.bugged-report ol.references{ margin-top: -18px !important; } h4{ /* Sub-sub-headers */ font-size: 100%; page-break-after: avoid; margin: var(--line-height) 0 0 var(--second-indent); hyphens: none; font-style: italic; font-weight: normal; } h5, h6{ margin: 0 0 var(--line-height) 0; page-break-after: avoid; hyphens: none; } p{ text-indent: var(--first-indent); margin: 0; padding: 0; } /* all exceptions on the text-indent */ div.title-wrapper + p, div.note > p, p.image + p, div.list-without-markers p, div.no-text-indent p, div.toc p, h2 + p, /* author name */ h2 + p, h2 + p + p + blockquote + p, div.contribution.information-for-users h2 + p + p, div.contribution h2 + p + p + div.thumb, div.contribution h2 + p + div.thumb, h3 + p, div.thumb + p, div.portrait + p, h4 + p, div.series p, div.cover p, div.biographies p, div.previously_published p, div.backcover p, blockquote p, table p, pre + p, div.quote + p, blockquote + p, ul + p, ol + p{ text-indent: unset !important; } div.previously_published p, div.biographies p, div.series p{ margin-bottom: var(--line-height); } div.contribution.information-for-users div.title-wrapper + p + p > b, div.contribution.ultrasonic-dreams div.title-wrapper + p + p > b{ margin-left: -7mm; } ul{ margin: 18px 0 !important; } ul > li { list-style: none; text-indent: 0; margin-bottom: var(--line-height); } div.contribution ul > li::before{ content: "- "; margin-left: -3.5mm; margin-right: 1.5mm; } /* Mysteriously enough... these rules don't work??? */ div.cover ul > li::before, ul.references > li::before, div.toc ul > li::before, div.item_index ul > li::before { content: none !important; margin-left: unset; margin-right: unset; margin-bottom: unset; } div.contribution.ultrasonic-dreams li, div.contribution.lidar li, div.contribution.clandestine li, div.contribution.information-for-users li{ margin-bottom: 0 !important; } div.list-without-markers{ text-indent: -0.8em !important; } div.list-without-markers ul > li{ text-indent: -1em !important; } div.list-without-markers ul > li:before{ content: none !important; margin-left: unset; margin-right: unset; } /* notes (ol.references) and references (ul.references) */ ol.references, ul.references{ font-size: var(--small-font-size); line-height: var(--small-line-height); columns: 2 auto; column-gap: 7mm; margin: 0 1em !important; padding: 0; orphans: 3; } ol.references li, ul.references li{ hyphens: none !important; page-break-inside: auto !important; } ul.references > li{ text-indent: -1em; margin-bottom: unset !important; } div.note{ font-size: var(--small-font-size); line-height: var(--small-line-height); width: 50mm; margin: 0; hyphens: none; } img{ position: relative; display: block; width: 105mm; /* full text width */ height: auto; max-height: 200mm; margin: var(--line-height) 0 12px 0; /* PRINT PDF - GRAYSCALE */ /*filter: grayscale(100%);*/ } div.thumb{ /* sometimes wrapper of img + image caption */ font-size: var(--small-font-size); line-height: var(--small-line-height); margin: var(--line-height) 0 var(--line-height) var(--first-indent); page-break-inside: avoid; break-inside: avoid; hyphens: none; } div.thumb div.thumbinner{ width: unset !important; } div.thumb img{ margin-left: -7mm !important; /* same as first-indent but inverted */ } div.portrait div.thumb img{ width: auto !important; min-width: 60mm; } div.fullpage{ page: fullpage !important; } div.fullpage div.thumb{ margin: 0 !important; } div.fullpage div.thumb img{ /* PREVIEW PDF -- these sizes only apply for the preview view! no bleed */ /*width: 152.4mm; max-width: none; height: 228.6mm; max-height: 228.6mm; margin: -3mm 0 0mm -7mm !important;*/ /* PRINT PDF -- these sizes only apply when the bleed is turned on */ width: 155.4mm; max-width: none; height: auto; max-height: 234.6mm; margin-top: -6mm !important; margin-bottom: 0 !important; } div.fullpage.left div.thumb img{ margin-left: -3mm !important; } div.fullpage.right div.thumb img{ margin-left: 0mm !important; } img[src="./images/Topology-typography-2B.svg"]{ page-break-after: always; } /* Exception for User Info large small image */ div.special_image_treatment.userinfo img{ width: auto !important; max-width: auto !important; height: 200mm !important; max-height: 200mm !important; margin: 0; } /* Exception for Invasive Imagination images */ div.invasive-imagination div.thumb{ margin-bottom: 2em; width: 75mm !important; } div.invasive-imagination div.thumb img{ width: 100% !important; } /* Exception for Maria Dada's text on Beirut 82 */ div.enlarged-image img, div.contribution.beirut-82 div.thumb img{ width: auto !important; max-width: auto !important; height: 175mm !important; max-height: 175mm !important; } div.contribution.beirut-82 div.thumb img{ margin-top: -10mm; margin-left: -22mm !important; } div.contribution.beirut-82 div.thumb img[src="./images/Strategy_and_Tactics.jpg"]{ margin-left: -17mm !important; } /* BASELINE FINAL TWEAKS */ img[src="./images/Imagen_2.png"]{ margin-top: 19px; } img[src="./images/Brk02.gif"]{ margin-bottom: 8px; } img[src="./images/Image20.png"]{ margin-top: 23px; margin-bottom: 13px; } img[src="./images/DisintegrationEffect2.png"]{ margin-top: 23px; } img[src="./images/CollapseWoman1.jpg"]{ margin-top: 23px; margin-bottom: 13px; } img[src="./images/AdvanceRig1.png"]{ margin-top: 22px; } img[src="./images/Rigonfour1.png"]{ margin-top: 23px; } img[src="./images/FKrig171.gif"]{ margin-top: -3px; } img[src="./images/DigestingDuck1.png"]{ margin-top: -2px; } img[src="./images/RiggingDan1.jpg"]{ margin-top: 20px; } img[src="./images/McKayRig1.jpg"]{ margin-top: -4px; } img[src="./images/TalismanRig1.jpg"]{ margin-top: -5px; } img[src="./images/Blender.jpg"]{ margin-top: 20px; } img[src="./images/MojoDallas01.jpg"]{ margin-top: -2px; } img[src="./images/Cunningham.jpg"]{ margin-top: 22px; } img[src="./images/Figure04.png"]{ margin-top: 27px; } img[src="./images/Figure09.png"]{ margin-top: -6px; } img[src="./images/Figure10.png"], img[src="./images/Figure12.png"]{ margin-top: 25px; } img[src="./images/Figure13.jpg"]{ margin-top: 18px; } img[src="./images/Background_prominence.png"]{ margin-top: -4px; } img[src="./images/Inscriptions.jpg"], img[src="./images/Inscriptions_2.jpg"]{ margin-top: -2px; } img[src="./images/Backlighting.jpg"], img[src="./images/Overexposed.jpg"]{ margin-top: -2px; } img[src="./images/Fol_thefragilityoflife-2.jpeg"]{ margin-top: 20px; margin-bottom: 12px; } img[src="./images/04_bertillon_identification_system.jpg"]{ margin-top: -4px; } img[src="./images/09_newsdirect.png"]{ margin-top: 26px; } img[src="./images/Simone1.jpg"]{ margin-top: 20px; } img[src="./images/06_imgf0016.png"]{ margin-top: 21px; } img[src="./images/Difficultforest.jpg"]{ margin-top: -2px; } img[src="./images/Makehuman.png"]{ margin-top: -4px; } img[src="./images/Leaflet.jpg"]{ margin-top: 15px; } img[src="./images/Continuum_brighton.svg"]{ margin-top: -13px; } img[src="./images/Image1.jpg"]{ margin-top: 17px; } img[src="./images/Image2.png"]{ margin-top: 15px; } img[src="./images/Image3.jpg"]{ margin-top: 28px; } img[src="./images/Image4.jpg"]{ margin-top: 26px; } img[src="./images/Image5.jpg"]{ margin-top: 23px; } img[src="./images/Image6.png"]{ margin-top: 15px; } img[src="./images/Datum.jpg"]{ margin-top: 21px; } img[src="./images/Gplates1.gif"]{ margin-top: 17px; } img[src="./images/Image01.png"]{ margin-top: -3px; } img[src="./images/Image02.png"]{ margin-top: 21px; } img[src="./images/Image03.png"]{ margin-top: 23px; } img[src="./images/Image04.png"]{ margin-top: -8px; } a[href="#File:Image04.png"] + .thumbcaption{ margin-bottom: -8px; } img[src="./images/Gplates1.gif"] { margin-top: -1px; } img[src="./images/Gplates2.gif"] { margin-top: 22px; } img[src="./images/Gplates3.gif"] { margin-top: 21px; } img[src="./images/Gplates3.gif"] { margin-top: 21px; } img[src="./images/Gplates5.gif"] { margin-top: 24px; } img[src="./images/Gplates5.gif"] { margin-top: 60px; } img[src="./images/Image02.png"] { margin-top: 20px; } img[src="./images/Image05.png"] { margin-top: 21px; } img[src="./images/File_manager_overview.png"]{ margin-top: 24px; margin-bottom: 24px; } .contribution.so-called-plants div.floatnone + p{ margin-left: var(--second-indent) !important; text-indent: unset !important; } pre{ /*
's are sometimes manually added in the text */ /* BITTER VERSION */ font-family: "bitter"; font-size: var(--font-size); line-height: var(--line-height); hyphens: none; white-space: pre-line; margin: calc(var(--line-height) - 1px) 0 calc(var(--line-height) - 1px) var(--second-indent); border: 1px solid rgba(0,0,0,0.2); padding: calc(var(--line-height) / 2) var(--line-height); page-break-inside: avoid; } div.quote > pre{ border: none; padding: 0; page-break-inside: unset; font-style: italic; white-space: pre-line; word-wrap: break-word; } div.contribution.so-called-plants pre{ margin-top: 9px; margin-bottom: 9px; } blockquote{ margin: 0 0 0 var(--second-indent); font-style: italic; } blockquote.pull{ margin: var(--line-height) 0 var(--line-height) var(--second-indent) !important; } table{ width: 125mm !important; margin-left: -10mm !important; font-size: var(--small-font-size) !important; line-height: var(--small-line-height); hyphens: none; page-break-after: always; } table p{ margin-bottom: 15px !important; } td { vertical-align: top; padding: 0.5em !important; } tr:first-of-type td { border: 0 !important; border-left: 1px solid black !important; } td:first-of-type{ font-weight: bold; border: 0 !important; border-bottom: 1px solid black !important; } tr:last-of-type td{ border-bottom: 0 !important; } tr:first-of-type td:first-of-type{ border-left: 0 !important; border-bottom: 0 !important; } tr:first-of-type td:last-of-type{ border-right: 1px solid black !important; } sup{ line-height: 0; font-size: 7pt; padding-left: 0.15mm; font-style: normal !important; } div.thumbcaption sup, ul.references sup, ol.references sup{ font-size: 6pt !important; } a, a:visited, a:active, a:hover{ color: inherit; text-decoration: none; page-break-inside: avoid; } /* specific details, uitzonderingen */ a.external{ word-break: break-all; } span.endash{ letter-spacing: -0.05em; margin-left: -0.05em; } @media print{ html, body{ background-color: transparent; } div#nav{ display: none !important; } }