Publishing:HD Bulletin 1

2023-07-12T20:47:39Z

Heerko:

{{:Bulletin_1_Cover}}
{{:Bulletin_1_Introduction}}
{{:Age_of_dust}}

{{:Visual_essay}}
{{:Creative_Crowd}}
{{:A_little_internet}}
{{:Bulletin_1_Colophon}}

PublishingCSS:HD Bulletin 1

2023-07-12T20:47:08Z

Heerko:

ol {
display: block;
}

/*

- Pagedjs
- - Variables
- - Pagebreaks
- - Spreads
- Fonts
- Layouts
- General styling

*/

/*
*** PAGEDJS ***
*/

/*
* Pagedjs/paged media specific styles
*/

@page {
size: 105mm 297mm;
margin: 15mm 10mm 25mm 10mm;
bleed: 3mm;
background-color: white;
}

@page:left {
bleed-right: 0;

@top-center {
content: string(pubTitle);
font-size: 11px;
font-family: Authentic, sans-serif;
font-weight: 120;
}
}

@page:right {
bleed-left: 0;

@top-center {
content: string(articleTitle);
font-size: 11px;
font-family: Authentic, sans-serif;
font-weight: 400;
}
}

@page {
@bottom-center {
content: counter(page);
font-size: 36px;
font-family: notcouriersans, sans-serif;
}
}

/*
* Setting variables
*/

h1 {
string-set: pubTitle content(text);
font-weight: 120;
text-align: left;
font-family: Authentic, sans-serif;
font-size: 0px;
}

h2 {
counter-increment: countChapter;
string-set: articleTitle content(text);
counter-set: footnote-marker 0 footnote 0;
string-set: author "";
font-family: notcouriersans, sans-serif;
font-size: 36px;
font-weight: normal;
text-align: center;

}

h3 {
font-family: Authentic, sans-serif;
font-weight: 300;
font-size: 18px;
text-align: center;

}

a {
color: black;
text-decoration: none;
}

pre {
font-family: notcourier, monospace;
font-size: 15px;
}

.toctitle {
font-family: notcouriersans, sans-serif;
}

/* This is nicer/cleaner than adding the number to the links */
.toc > ul {
list-style: decimal;
font-family: notcouriersans, sans-serif;

}

p {
font-family: Authentic, sans-serif;
font-weight: 120;
font-size: 11px;
line-height: 14px;
}

ul {
font-family: notcouriersans, sans-serif;
font-weight: normal;
font-size: 11px;
}

ol {
font-family: notcouriersans, sans-serif;
font-weight: normal;
font-size: 11px;
}

/* Move the footnotes to the footer */
span.footnote {
float: footnote;
font-family: notcouriersans, sans-serif;
font-weight: normal;
font-size: 9px;
}

.author {
font-family: notcouriersans, sans-serif;
text-align: center;
font-size: 18px;
padding: 10pt;
display: inline-flex;
}

/*
* Page breaks
*/

h1 {
page-break-before: left;
}

h2 {
page-break-before: right;
}

.empty-left-page {
page-break-before: left;
}

.full-spread-image-section {
page-break-before: left;
}

.full-page-image {
page-break-before: always;
}

.full-page-image.full-page-image-left {
page-break-before: left;
}

.page-break {
page-break-before: always;
}

/*
* Spreads
*/

/*
To create a spread wrap the image in a span like so:
[[File:image.jpg|thumb|Your caption.]]
Wiki2print and the css below will transform the html so that two pages are
side by side with the same image repeated over both pages.
The images are translated and scaled to allow some overlap in the bleed.

The (simplified) html looks like this:

- section.full-spread-image-section
- div.full-page-image full-page-image-left
- img.thumbimage
- div.full-page-image
- img.thumbimag
- div.full-spread-image-caption
*/

.full-page-image {
width: var(--pagedjs-width);
height: var(--pagedjs-height);
overflow: hidden;
left: calc(calc(var(--pagedjs-bleed-left) + var(--pagedjs-margin-left))*-1);
top: calc(calc(var(--pagedjs-bleed-top) + var(--pagedjs-margin-top))*-1);
position: absolute;
}

.full-page-image div {
width: calc(var(--pagedjs-width)*2 - var(--pagedjs-bleed-left) - var(--pagedjs-bleed-right));
height: var(--pagedjs-height);
display: flex;
justify-content: center;
align-items: flex-start;
}

/* compensate for bleeds */
.pagedjs_right_page .full-page-image div {
margin-left: calc( calc(-1 * var(--pagedjs-width)) + var(--pagedjs-bleed-left ) + var(--pagedjs-bleed-right ));
}

.full-page-image img {
width: 100%;
height:100%;
object-fit: contain;
margin: 0 !important;
}

/*
We reuse this class for a single full page image that is not part of a
spread, so we apply the object-fit to prevent warping the image.

[[File:imagejpg|thumb|class=full-page-image|Your caption]]
*/
img.full-page-image {
object-fit: cover;
}

/* Position the caption */
.full-spread-image-section .full-page-image .full-spread-image-caption {
height: auto;
position: absolute;
display: block;
right: calc(calc(var(--pagedjs-bleed-right) + var(--pagedjs-margin-right)));
bottom: calc(var(--pagedjs-bleed-bottom) + var(--pagedjs-margin-bottom));
width: calc(var(--pagedjs-width) - var(--pagedjs-bleed-right) - var(--pagedjs-margin-right) - var(--pagedjs-bleed-left) - var(--pagedjs-margin-left));
}

/*
*** FONTS ***
* There's currently no way to add fonts through the wiki interface
* So either use fonts installed on your system or load them
* through a wiki2print publication plugin
*/

.font-authentic {
font-family: Authentic, sans-serif;
font-weight: 400;
}

.font-le-murmure {
font-family: le-murmure, sans-serif;
}

.font-notcouriersans {
font-family: notcouriersans, sans-serif;
}

.font-solide-mirage-etroit {
font-family: SolideMirageEtroit, sans-serif
}

.font-solide-mirage-mono {
font-family: SolideMirageMono, sans-serif
}

.font-louise-regular {
font-family: Louise-Regular, sans-serif
}

.font-sligoil-micro {
font-family: Sligoil-Micro, sans-serif
}

.font-notoserif {
font-family: NotoSerifItalic-Micro, serif
}

/* General styling */

img {
width: 100%;
height: auto;
}

.pagedjs_pages img {
filter: grayscale(1);
}

PublishingCSS:HD Bulletin 1

2023-07-12T20:46:13Z

Heerko: Reverted edits by Heerko (talk) to last revision by Hd-onions

ol {
display: block;
}

/*

- Pagedjs
- - Variables
- - Pagebreaks
- - Spreads
- Fonts
- Layouts
- General styling

*/

/*
*** PAGEDJS ***
*/

/*
* Pagedjs/paged media specific styles
*/

@page {
size: 105mm 297mm;
margin: 15mm 10mm 25mm 10mm;
bleed: 3mm;
background-color: white;
}

@page:left {
bleed-right: 0;

@top-center {
content: string(pubTitle);
font-size: 11px;
font-family: Authentic, sans-serif;
font-weight: 120;
}
}

@page:right {
bleed-left: 0;

@top-center {
content: string(articleTitle);
font-size: 11px;
font-family: Authentic, sans-serif;
font-weight: 400;
}
}

@page {
@bottom-center {
content: counter(page);
font-size: 36px;
font-family: notcouriersans, sans-serif;
}
}

/*
* Setting variables
*/

h1 {
string-set: pubTitle content(text);
font-weight: 120;
text-align: left;
font-family: Authentic, sans-serif;
font-size: 0px;
}

h2 {
counter-increment: countChapter;
string-set: articleTitle content(text);
counter-set: footnote-marker 0 footnote 0;
string-set: author "";
font-family: notcouriersans, sans-serif;
font-size: 36px;
font-weight: normal;
text-align: center;

}

h3 {
font-family: Authentic, sans-serif;
font-weight: 300;
font-size: 18px;
text-align: center;

}

a {
color: black;
text-decoration: none;
}

pre {
font-family: notcourier, monospace;
font-size: 15px;
}

.toctitle {
font-family: notcouriersans, sans-serif;
}

/* This is nicer/cleaner than adding the number to the links */
.toc > ul {
list-style: decimal;
font-family: notcouriersans, sans-serif;

}

p {
font-family: Authentic, sans-serif;
font-weight: 120;
font-size: 11px;
line-height: 14px;
}

ul {
font-family: notcouriersans, sans-serif;
font-weight: normal;
font-size: 11px;
}

ol {
font-family: notcouriersans, sans-serif;
font-weight: normal;
font-size: 11px;
}

/* Move the footnotes to the footer */
span.footnote {
float: footnote;
font-family: notcouriersans, sans-serif;
font-weight: normal;
font-size: 9px;
}

.author {
font-family: notcouriersans, sans-serif;
text-align: center;
font-size: 18px;
padding: 10pt;
display: inline-flex;
}

/*
* Page breaks
*/

h1 {
page-break-before: left;
}

h2 {
page-break-before: right;
}

.empty-left-page {
page-break-before: left;
}

.full-spread-image-section {
page-break-before: left;
}

.full-page-image {
page-break-before: always;
}

.full-page-image.full-page-image-left {
page-break-before: left;
}

.page-break {
page-break-before: always;
}

/*
* Spreads
*/

/*
To create a spread wrap the image in a span like so:
[[File:image.jpg|thumb|Your caption.]]
Wiki2print and the css below will transform the html so that two pages are
side by side with the same image repeated over both pages.
The images are translated and scaled to allow some overlap in the bleed.

The (simplified) html looks like this:

- section.full-spread-image-section
- div.full-page-image full-page-image-left
- img.thumbimage
- div.full-page-image
- img.thumbimag
- div.full-spread-image-caption
*/

.full-page-image {
width: var(--pagedjs-width);
height: var(--pagedjs-height);
overflow: hidden;
left: calc(calc(var(--pagedjs-bleed-left) + var(--pagedjs-margin-left))*-1);
top: calc(calc(var(--pagedjs-bleed-top) + var(--pagedjs-margin-top))*-1);
position: absolute;
}

.full-page-image div {
width: calc(var(--pagedjs-width)*2 - var(--pagedjs-bleed-left) - var(--pagedjs-bleed-right));
height: var(--pagedjs-height);
display: flex;
justify-content: center;
align-items: flex-start;
}

/* compensate for bleeds */
.pagedjs_right_page .full-page-image div {
margin-left: calc( calc(-1 * var(--pagedjs-width)) + var(--pagedjs-bleed-left ) + var(--pagedjs-bleed-right ));
}

.full-page-image img {
width: 100%;
height:100%;
object-fit: contain;
margin: 0 !important;
}

/*
We reuse this class for a single full page image that is not part of a
spread, so we apply the object-fit to prevent warping the image.

[[File:imagejpg|thumb|class=full-page-image|Your caption]]
*/
img.full-page-image {
object-fit: cover;
}

/* Position the caption */
.full-spread-image-section .full-page-image .full-spread-image-caption {
height: auto;
position: absolute;
display: block;
right: calc(calc(var(--pagedjs-bleed-right) + var(--pagedjs-margin-right)));
bottom: calc(var(--pagedjs-bleed-bottom) + var(--pagedjs-margin-bottom));
width: calc(var(--pagedjs-width) - var(--pagedjs-bleed-right) - var(--pagedjs-margin-right) - var(--pagedjs-bleed-left) - var(--pagedjs-margin-left));
}

/*
*** FONTS ***
* There's currently no way to add fonts through the wiki interface
* So either use fonts installed on your system or load them
* through a wiki2print publication plugin
*/

.font-authentic {
font-family: Authentic, sans-serif;
font-weight: 400;
}

.font-le-murmure {
font-family: le-murmure, sans-serif;
}

.font-notcouriersans {
font-family: notcouriersans, sans-serif;
}

.font-solide-mirage-etroit {
font-family: SolideMirageEtroit, sans-serif
}

.font-solide-mirage-mono {
font-family: SolideMirageMono, sans-serif
}

.font-louise-regular {
font-family: Louise-Regular, sans-serif
}

.font-sligoil-micro {
font-family: Sligoil-Micro, sans-serif
}

.font-notoserif {
font-family: NotoSerifItalic-Micro, serif
}

/* General styling */

.pagedjs_pages img {
filter: grayscale(1);
}

PublishingCSS:HD Bulletin 1

2023-07-12T20:45:42Z

Heerko: Blanked the page

PublishingCSS:HD Bulletin 1

2023-07-12T20:05:59Z

Heerko:

ol {
display: block;
}

/*

- Pagedjs
- - Variables
- - Pagebreaks
- - Spreads
- Fonts
- Layouts
- General styling

*/

/*
*** PAGEDJS ***
*/

/*
* Pagedjs/paged media specific styles
*/

@page {
size: 105mm 297mm;
margin: 15mm 10mm 25mm 10mm;
bleed: 3mm;
background-color: white;
}

@page:left {
bleed-right: 0;

@top-center {
content: string(pubTitle);
font-size: 11px;
font-family: Authentic, sans-serif;
font-weight: 120;
}
}

@page:right {
bleed-left: 0;

@top-center {
content: string(articleTitle);
font-size: 11px;
font-family: Authentic, sans-serif;
font-weight: 400;
}
}

@page {
@bottom-center {
content: counter(page);
font-size: 36px;
font-family: notcouriersans, sans-serif;
}
}

/*
* Setting variables
*/

h1 {
string-set: pubTitle content(text);
font-weight: 120;
text-align: left;
font-family: Authentic, sans-serif;
font-size: 0px;
}

h2 {
counter-increment: countChapter;
string-set: articleTitle content(text);
counter-set: footnote-marker 0 footnote 0;
string-set: author "";
font-family: notcouriersans, sans-serif;
font-size: 36px;
font-weight: normal;
text-align: center;

}

h3 {
font-family: Authentic, sans-serif;
font-weight: 300;
font-size: 18px;
text-align: center;

}

a {
color: black;
text-decoration: none;
}

pre {
font-family: notcourier, monospace;
font-size: 15px;
}

.toctitle {
font-family: notcouriersans, sans-serif;
}

/* This is nicer/cleaner than adding the number to the links */
.toc > ul {
list-style: decimal;
font-family: notcouriersans, sans-serif;

}

p {
font-family: Authentic, sans-serif;
font-weight: 120;
font-size: 11px;
line-height: 14px;
}

ul {
font-family: notcouriersans, sans-serif;
font-weight: normal;
font-size: 11px;
}

ol {
font-family: notcouriersans, sans-serif;
font-weight: normal;
font-size: 11px;
}

/* Move the footnotes to the footer */
span.footnote {
float: footnote;
font-family: notcouriersans, sans-serif;
font-weight: normal;
font-size: 9px;
}

.author {
font-family: notcouriersans, sans-serif;
text-align: center;
font-size: 18px;
padding: 10pt;
display: inline-flex;
}

/*
* Page breaks
*/

h1 {
page-break-before: left;
}

h2 {
page-break-before: right;
}

.empty-left-page {
page-break-before: left;
}

.full-spread-image-section {
page-break-before: left;
}

.full-page-image {
page-break-before: always;
}

.full-page-image.full-page-image-left {
page-break-before: left;
}

.page-break {
page-break-before: always;
}

/*
* Spreads
*/

/*
To create a spread wrap the image in a span like so:
[[File:image.jpg|thumb|Your caption.]]
Wiki2print and the css below will transform the html so that two pages are
side by side with the same image repeated over both pages.
The images are translated and scaled to allow some overlap in the bleed.

The (simplified) html looks like this:

- section.full-spread-image-section
- div.full-page-image full-page-image-left
- img.thumbimage
- div.full-page-image
- img.thumbimag
- div.full-spread-image-caption
*/

.full-page-image {
width: var(--pagedjs-width);
height: var(--pagedjs-height);
overflow: hidden;
left: calc(calc(var(--pagedjs-bleed-left) + var(--pagedjs-margin-left))*-1);
top: calc(calc(var(--pagedjs-bleed-top) + var(--pagedjs-margin-top))*-1);
position: absolute;
}

.full-page-image div {
width: calc(var(--pagedjs-width)*2 - var(--pagedjs-bleed-left) - var(--pagedjs-bleed-right));
height: var(--pagedjs-height);
display: flex;
justify-content: center;
align-items: flex-start;
}

/* compensate for bleeds */
.pagedjs_right_page .full-page-image div {
margin-left: calc( calc(-1 * var(--pagedjs-width)) + var(--pagedjs-bleed-left ) + var(--pagedjs-bleed-right ));
}

.full-page-image img {
width: 100%;
height:100%;
object-fit: contain;
margin: 0 !important;
}

/*
We reuse this class for a single full page image that is not part of a
spread, so we apply the object-fit to prevent warping the image.

[[File:imagejpg|thumb|class=full-page-image|Your caption]]
*/
img.full-page-image {
object-fit: cover;
}

/* Position the caption */
.full-spread-image-section .full-page-image .full-spread-image-caption {
height: auto;
position: absolute;
display: block;
right: calc(calc(var(--pagedjs-bleed-right) + var(--pagedjs-margin-right)));
bottom: calc(var(--pagedjs-bleed-bottom) + var(--pagedjs-margin-bottom));
width: calc(var(--pagedjs-width) - var(--pagedjs-bleed-right) - var(--pagedjs-margin-right) - var(--pagedjs-bleed-left) - var(--pagedjs-margin-left));
}

/*
*** FONTS ***
* There's currently no way to add fonts through the wiki interface
* So either use fonts installed on your system or load them
* through a wiki2print publication plugin
*/

.font-authentic {
font-family: Authentic, sans-serif;
font-weight: 400;
}

.font-le-murmure {
font-family: le-murmure, sans-serif;
}

.font-notcouriersans {
font-family: notcouriersans, sans-serif;
}

.font-solide-mirage-etroit {
font-family: SolideMirageEtroit, sans-serif
}

.font-solide-mirage-mono {
font-family: SolideMirageMono, sans-serif
}

.font-louise-regular {
font-family: Louise-Regular, sans-serif
}

.font-sligoil-micro {
font-family: Sligoil-Micro, sans-serif
}

.font-notoserif {
font-family: NotoSerifItalic-Micro, serif
}

/* General styling */

img {
width: 100%;
height: auto;
}

.pagedjs_pages img {
filter: grayscale(1);
}

Publishing:HD Bulletin 1

2023-07-12T19:44:31Z

Heerko:

{{:Bulletin_1_Cover}}
{{:Bulletin_1_Introduction}}
{{:Age_of_dust}}
{{:Earth_battery}}
{{:Visual_essay}}
{{:Creative_Crowd}}
{{:A_little_internet}}
{{:Bulletin_1_Colophon}}

Earth battery

2023-07-12T19:44:18Z

Heerko: Reverted edits by Heerko (talk) to last revision by Hd-onions

== ... looking back: ✧˖°. Mud batteries ⋆ ˚｡⋆୨୧˚ ==
=== How-to make batteries from soil ===
「 H&D in collaboration with Hackitects (Michel Barchini, Mary Farwy)」 

The 8th edition of the H&D Summer Academy "Connecting Otherwise" was organized in a distributed manner. H&D invited four initiatives (DDDUG, Hackitects, MELT, NEWS) to develop a workshop program together on four different interconnected locations: Amsterdam, Aotearoa (formerly known as New Zealand), Berlin (+ online) and Seoul. In Amsterdam we were accompanied by the Hackitect collective (Michel Barchini, Mary Farwy). In the workshop we invited participants to imagine and try out ways to radically reduce the energy use associated with communication technologies such as the Internet and consider a low-tech approaches to 'connecting otherwise'. The workshop incorporated different experimental approaches simultaneously. One focused on exploring strategies from DIY biotechnology where bacteria found in local iron-rich soil are harnessed to generate and store energy.

==== Collecting mud for the battery ====
Look for reddish brown soil (rich in iron) near river beds and swamps, areas where water has a reddish color. Preferably collect deep samples not from the surface.

About 1 liter makes 2 batteries. Ideally you get it a few days before the workshop, but it should be fine for up to two weeks. It is always good to collect more mud than what you calculate, in case some spill during preparations.

Make sure you take mud as well as some water (see image below).

==== Tools & Materials ====
*Pot and stove to cook the agar mixture
*Multimeter
*Clippers and wire stripper
*Breadboard
*Kitchen scale
*Liquids measuring cup
*Tape (or anything to mark different wires)

==== Materials ====
*Mud
*Containers with wide opening on top (ex: glass jar or plastic container - around 1L)
*Electric wires (Copper wires 30 cm - 2 wires are needed per battery)
*Stainless steel grids to be cut in rectangles. Size : around 8 x 8 cm, but can change according to the size and shape of your container. Aluminium nets are good to use but they are less conductive. You can use also kitchen strainer mesh. You can also experiment with the size of the net, for example: making it like a strip 8 x 20, to have more surface area. In this case you can roll it without making the surfaces touch.
*Epoxy glue
*Small brush to spread the glue
*Active coal
*Agar (10g is needed per 1L battery)
*Salt substances (any broth powder - 1 pack, 2g per battery). Broth powder is the one you use for cooking. We used the veggie broth cubes that you buy from the supermarket.
*LED
*Drinking Water

==== Making the Cathodes ====
To make the cathodes you need the active coal, epoxy glue, metal nets and electric wires.

[[File:cathode1.jpg|thumb]]
ID: Hands performing the steps described in what follows

#Empty the pills of the active coal to get the powder out, and place it on a sheet. (about 10 pills powder per 1 cathode disc)
#Cut two meshes in a rectangular shape 8 x 8cm. Place them in opposite directions and fold the edges so they are attached. We make two layers so it can hold the glue and coal well.
#Brush the glue on the mesh and make sure that you add enough glue and that it is brushed evenly on the surface of the mesh.

[[File:cathode2.jpg|thumb]]
ID: Hands performing the steps described in what follows

#Cover the brushed mesh with the active coal powder and press it very well. After pressing, add coal and press again. It is very important that the coal is covering the whole surface.
#After making sure that the mesh is covered and pressed with coal, connect the mesh from one of the sides to an electric wire. At the end you might need to bend the mesh to fit your container. Bend it, but be sure not to make the edges touch each other. More coal surface is better! Now leave it to fully dry.

==== Preparing first part of the Soil Battery ====
For this step you need the container (glass jar), mud, the dried cathodes.

[[File:cathode3.jpg|thumb]]
ID: 1. The finished cathode, 2. Two glass jars half filled with mud, with a wire from the cathode coming out of the opening
 

#Put the cathode in the container (make sure that the glue dried and the coal is stuck to it).
#Fill the jar with mud so it covers the cathode, keeping the wire out of the container.
#Mark the wire with tape to identify that its negative. (black = negative)
#Hit the container to get all the trapped air bubbles out. It is VERY IMPORTANT to release the air bubbles from the mud.

==== Making the proton exchange membrane ====

[[File:mudbattery_parallel.jpg|thumb]]
ID: Process of preparing and pouring the agar described in the steps below

[[File:battery_demonstration.jpg|thumb]]
ID: Mud battery in a glass jar: half filled with mud, then a layer of solidified agar, and filled to the top with clean tap water. Two cables are coming from the jar and are connected to an LED for illustration purposes.

==== Connecting the batteries in parallel ====
The water part in the battery is (+) and the mud part is (-). When connecting two batteries in parallel the (-) from the first battery should be connected to the (-) in the second one, and the (+) from the first to the (+) in the second. Then the (-) and (+) should be connected together to close the circuit. See the drawing:

[[File:agar_membrane.jpg|thumb]]
ID: Diagram of two mud batteries connected in parallel: The cathode (or minus, black) comes from the mud of battery one and is connected to the cathode of battery 2. The anode (or plus, red) is the wire sitting in the top half in the water, and is connected to the anode of battery two.

The mud-batteries how-to was assembled in preparation to the H&D Summer Academy 2022 "Connecting Otherwise," and used as a guide during the workshop "SoilPunk" by Hackitects in collaboration with H&D.
Visit https://github.com/hackersanddesigners/Soilpunk_joulethief for more complete documentation.
Listen to the audio documentation of Radio Echo Collective: https://www.mixcloud.com/RadioEchoCollective/hd-connecting-otherwise-soilpunk-with-hackitects-x-hd/

2023-06-16T08:27:16Z

Heerko:

/*

- Pagedjs
- - Variables
- - Pagebreaks
- - Spreads
- Fonts
- Layouts
- General styling

*/

/*
*** PAGEDJS ***
*/

/*
* Pagedjs/paged media specific styles
*/

@page {
size: 105mm 297mm;
margin: 15mm 10mm 25mm 10mm;
bleed: 3mm;
background-color: white;
}

@page:left {
bleed-right: 0;

@top-center {
content: string(pubTitle);
}
}

@page:right {
bleed-left: 0;

@top-center {
content: string(articleTitle);
font-size: 9px;
font-family: Louise-Regular, sans-serif;
}
}

@page {
@bottom-center {
content: counter(page);
font-size: 36px;
font-family: notcouriersans, sans-serif;

}
}

/*
* Setting variables
*/

h1 {
string-set: pubTitle content(text);
font-weight: 300;

}

h2 {
counter-increment: countChapter;
string-set: articleTitle content(text);
counter-set: footnote-marker 0 footnote 0;
string-set: author "";
font-weight: 300;

}

a {
color: black;
}

.toctitle {
font-family: Ortica,serif;
font-size: 22px;
}

/* This is nicer/cleaner than adding the number to the links */
.toc > ul {
list-style: decimal;
}

.mw-headline {
display: block;
text-align: center;
font-family: notcouriersans, sans-serif;
font-weight: normal;
}

p {
font-family: Authentic, sans-serif;
font-weight: 400;
font-size: 11px;
line-height: 14px;

}
/* Move the footnotes to the footer */
span.footnote {
float: footnote;
}

.author{
display: block;
text-align: center;
font-family: notcouriersans, sans-serif;
font-size: 9px;

}

/*
* Page breaks
*/

h1 {
page-break-before: left;
}

h2 {
page-break-before: right;
}

.empty-left-page {
page-break-before: left;
}

.full-spread-image-section {
page-break-before: left;
}

.full-page-image {
page-break-before: always;
}

.full-page-image.full-page-image-left {
page-break-before: left;
}

/*
* Spreads
*/

/*
To create a spread wrap the image in a span like so:
[[File:image.jpg|thumb|Your caption.]]
Wiki2print and the css below will transform the html so that two pages are
side by side with the same image repeated over both pages.
The images are translated and scaled to allow some overlap in the bleed.

The (simplified) html looks like this:

- section.full-spread-image-section
- div.full-page-image full-page-image-left
- img.thumbimage
- div.full-page-image
- img.thumbimag
- div.full-spread-image-caption
*/

.full-page-image {
width: var(--pagedjs-width);
height: var(--pagedjs-height);
overflow: hidden;
left: calc(calc(var(--pagedjs-bleed-left) + var(--pagedjs-margin-left))*-1);
top: calc(calc(var(--pagedjs-bleed-top) + var(--pagedjs-margin-top))*-1);
position: absolute;
}

.full-page-image div {
width: calc(var(--pagedjs-width)*2 - var(--pagedjs-bleed-left) - var(--pagedjs-bleed-right));
height: var(--pagedjs-height);
display: flex;
justify-content: center;
align-items: flex-start;
}

/* compensate for bleeds */
.pagedjs_right_page .full-page-image div {
margin-left: calc( calc(-1 * var(--pagedjs-width)) + var(--pagedjs-bleed-left ) + var(--pagedjs-bleed-right ));
}

.full-page-image img {
width: 100%;
height: 100%;
object-fit: contain;
margin: 0 !important;
}

/*
We reuse this class for a single full page image that is not part of a
spread, so we apply the object-fit to prevent warping the image.

[[File:imagejpg|thumb|class=full-page-image|Your caption]]
*/
img.full-page-image {
object-fit: cover;
}

/* Position the caption */
.full-spread-image-section .full-page-image .full-spread-image-caption {
height: auto;
position: absolute;
display: block;
right: calc(calc(var(--pagedjs-bleed-right) + var(--pagedjs-margin-right)));
bottom: calc(var(--pagedjs-bleed-bottom) + var(--pagedjs-margin-bottom));
width: calc(var(--pagedjs-width) - var(--pagedjs-bleed-right) - var(--pagedjs-margin-right) - var(--pagedjs-bleed-left) - var(--pagedjs-margin-left));
}

/*
*** FONTS ***
* There's currently no way to add fonts through the wiki interface
* So either use fonts installed on your system or load them
* through a wiki2print publication plugin
*/

.font-authentic {
font-family: Authentic, sans-serif;
font-weight: 400;
}

.font-le-murmure {
font-family: le-murmure, sans-serif;
}

.font-notcouriersans {
font-family: notcouriersans, sans-serif;
}

.font-solide-mirage-etroit {
font-family: SolideMirageEtroit, sans-serif
}

.font-solide-mirage-mono {
font-family: SolideMirageMono, sans-serif
}

.font-louise-regular {
font-family: Louise-Regular, sans-serif
}

.font-sligoil-micro {
font-family: Sligoil-Micro, sans-serif
}

.font-notoserif {
font-family: NotoSerifItalic-Micro, serif
}

/* General styling */