:root{
	--main-color: rgb(0, 179, 211);
	--u:5mm;
	--uu:10mm;
  /* share font */
  --fs1: 6.5mm;
  --lh1: 5mm;
  /* vollkorn font */
  --fs2: 4mm;
  --lh2: 5mm;
}

/* Cover */
.cover{
	position: relative;
	page-break-after: always;
	page: cover;
	text-align: center;
}
.cover .title{
	font-family:'sharemono', sans-serif;
	text-transform: uppercase;
	letter-spacing: -.04em;
	font-weight: normal;
	hyphens: auto;
	-webkit-hyphens: auto;
	margin:0;
	font-size: 43mm;
  line-height: 44mm;
	padding: var(--uu)
	/* background: url(../content/images/0_leading_image_dustbox.jpg); */
}
.cover-image{
	page-break-after: always;
	width: 85%;
}

.last{
	page:last;
	break-before: left;
}
.backcover{
	page:backcover;
	break-before: right;
	height:210mm;
	background-color: var(--main-color);
}

/* First page with social info */
.first-page{
  page: page;
  display: flex;
  break-before: right;
  height: 190mm;
  flex-direction: column;
  justify-content: space-between;
}
.first-page p{
  font:var(--fs1)/var(--lh1) 'share', sans-serif;
  margin-block-start:0!important;
}
.first-page .contacts p{
  margin-bottom: var(--u);
  margin-top:0;
}

/* Table of content */
.toc{
	break-before: right;
}
.toc ol{
  font-family:'share', sans-serif;
	text-transform: uppercase;
	font-size: var(--fs1);
	line-height: 10mm;
  margin:0;
	padding:0;
	margin-top: -2mm;
}
.toc ol li a::before{
	position: absolute;
	top:0;
	left: 0;
}
.toc ol li{
  padding-left: var(--uu);
  margin-bottom:var(--uu);
	list-style: none;
	position: relative;

}

.toc ol li::marker {
  /* content: counter(list-item) " "; */
}
.toc ol a{
	padding:0 0 0 var(--uu);
	color:black;
	display: block;
}

/* lists */
ul, ol{
	padding-left: var(--u);
}

ul li{
	list-style: none;
	position: relative;
	padding-left: var(--u);
	margin-bottom:var(--u);
}

ul li::before{
	content:"";
	left:0;
}
ul li::before{
	width:1mm;
	height:1mm;
	background:black;
	border-radius:100%;
	position: absolute;
	top:.5em;
}
ol li{
	padding-left: var(--u);
}
ol li::marker{
	font-weight: 500;
}


/* Titles */

h1, h2, h3, h4, h5{
	page-break-inside: avoid;
	page-break-after: avoid;
}
h3 + p, h3 + ul, h3 + ol, h4 + p, h4 + ul, h4 + ol {
  margin-top:var(--u);
}
h5 em{
	width: var(--u);
	height: var(--u);
	padding-left: .1em;
	border-radius: 10px;
	background: black;
	margin-right: calc(var(--u)/2);
	color: white;
	font-style: normal;
	position: absolute;
	top: 0;
	left: 0;
	font-size: 0.8em;
	text-align: center;
}
h1{
	font-family:'sharemono', sans-serif;
	text-transform: uppercase;
	font-size: 43mm;
  line-height: 34mm;
  letter-spacing: -.04em;
  font-weight: normal;
	hyphens: auto;
	-webkit-hyphens: auto;
	page-break-after: always;
	page: cover;
  display: flex;
  width:100%;
  height:210mm;
  padding:var(--uu);
  margin:0;
	break-before: right;
}

h2{
	font-family:'sharemono', sans-serif;
  font-weight: normal;
	font-size: 25mm;
	line-height: 23mm;
	text-transform: uppercase;
	hyphens:auto;
	-webkit-hyphens: auto;
  /* word-break: break-all; */
	page-break-before: always;
	page-break-after: always;
	break-before: right;
	page: titlePage;
	display: flex;
	width:100%;
	/* height:210mm; */
	margin:0;
}
.pretitle{
	break-before: left;
	display: block;
	page:preTitle;
	height:210mm;
	background-color: var(--main-color);
	background-size: auto 100%;
	background-position: center center;
	background-repeat: no-repeat;
	background-blend-mode: multiply;
	image-rendering: -moz-crisp-edges;
	image-rendering: -webkit-crisp-edges;
	image-rendering: pixelated;
	image-rendering: crisp-edges;
}
.pretitle.introduction{background-image: url(../content/images/3D-2.png);}
.pretitle.air-quality{background-image: url(../content/images/air-quality.png);}
.pretitle.setting-up{background-image: url(../content/images/3D-1.png);}
.pretitle.building{background-image: url(../content/images/building.png);}
.pretitle.summary{background-image: url(../content/images/3D-5.png);}
.pretitle.appendix{background-image: url(../content/images/3D-4.png);}
.pretitle.troubleshooting{background-image: url(../content/images/3D-3.png);}
/* .pretitle.building-screen{background-image: url(../content/images/building-screen.png);} */
.pretitle.data{background-image: url(../content/images/data.png);}
.pretitle.calibrating{background-image: url(../content/images/calibrating.png);}
/* .pretitle.ressources{background-image: url(../content/images/3D-4.png);} */

/* h2::before{
	page:blank;
} */


h3{
  font-family: 'share',sans-serif;
  font-size: 2em;
  line-height: var(--uu);
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.005em;
  margin-block-start: var(--uu);
  margin: calc(var(--uu) * 1) 0 0 0;
}

h3:first-child, p:first-child, ul:first-child, h5:first-child{
	margin-top:0;
}


h4{
  font-family:'share', sans-serif;
  font-size: 1.5em;
	line-height: var(--uu);
  font-weight: normal;
	letter-spacing: 0.005em;
	margin:var(--u) 0 0 0;
	line-height: var(--uu);
}


h5{
  font-family:'share', sans-serif;
  font-size: 1em;
	line-height: var(--uu);
  font-weight: normal;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin:var(--u) 0 ;
	line-height: var(--u);
	position: relative;
	padding-left: var(--uu);
}


p, ul, ol, table{
	font: var(--fs2)/var(--lh2) "Vollkorn", serif;
  margin-top:0;
	margin-bottom: var(--u);
	text-align: justify;
	hyphens: auto;
	-webkit-hyphens: auto;
}

ul, ol{text-align: left;}
p {line-height: var(--lh2);}
code{font-size:.9em;}
.jump{page-break-after: always;}

a{
	color: var(--main-color);
	text-decoration: none;
}
b, strong{
	font-weight: 600;
}
table{
	margin:0 auto;
	width:80%;
	border-collapse: collapse;
}
table, th, td {
  border: 1px solid black;
	padding: 2.3mm;
}
/* images */
figure{
	height: 100%;
	width: 100%;
  box-sizing: content-box;
	margin: 0;
  text-align: center;
  padding: 0;
  /* page-break-inside: avoid; */
}

figure + figure{
	margin: var(--u) 0;
}

figure + p, figure + ul, figure + ol{
	margin-top: var(--u);
}

figure img{
  display: block;
  margin:0 auto 0 auto;
}
figure img:not(:first-child){
	margin-top:var(--u);
}
figure.landscape img{
  height:70mm;
  width: auto;
  /* outline:1px solid red; */
}
figure.panoramic img{
  height:55mm;
  width: auto;
  /* outline:1px solid green; */
}
figure.portrait img{
  height:90mm;
  width: auto;
  /* outline:1px solid blue; */
}
figure.code img{
	height:20mm;
  width: auto;
}

figcaption{
  font-family:'share', sans-serif;
  font-size: 3mm;
  line-height: 5mm;
}