You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
297 lines
5.0 KiB
CSS
297 lines
5.0 KiB
CSS
@font-face {
|
|
font-family: "Millimetre-Light";
|
|
src: url(./fonts/Millimetre-Light_web.woff2) format("woff2"),
|
|
url(./fonts/Millimetre-Light_web.woff) format("woff");
|
|
}
|
|
@font-face {
|
|
font-family: "Millimetre-Regular";
|
|
src: url(./fonts/Millimetre-Regular_web.woff2) format("woff2"),
|
|
url(./fonts/Millimetre-Regular_web.woff) format("woff");
|
|
}
|
|
@font-face {
|
|
font-family: "Millimetre-Bold";
|
|
src: url(./fonts/Millimetre-Bold_web.woff2) format("woff2"),
|
|
url(./fonts/Millimetre-Bold_web.woff) format("woff");
|
|
}
|
|
@font-face {
|
|
font-family: "Millimetre-Extrablack";
|
|
src: url(./fonts/Millimetre-Extrablack_web.woff2) format("woff2"),
|
|
url(./fonts/Millimetre-Extrablack_web.woff) format("woff");
|
|
}
|
|
@media print {
|
|
/* Size and marin for all pages ------------- */
|
|
@page {
|
|
size: 148mm 210mm;
|
|
margin-top: 15mm;
|
|
margin-bottom: 15mm;
|
|
}
|
|
|
|
/* LEFT PAGES -------------------------------- */
|
|
|
|
@page :left {
|
|
margin-left: 20mm;
|
|
margin-right: 20mm;
|
|
@bottom-left {
|
|
content: counter(page);
|
|
font-family: "Millimetre-Light";
|
|
font-size: 8pt;
|
|
width: 40px;
|
|
}
|
|
@bottom-center {
|
|
content: "chatty, messy, sticky, tsss";
|
|
text-align: left;
|
|
margin-left: -5mm;
|
|
font-family: "Millimetre-Light";
|
|
font-size: 8pt;
|
|
}
|
|
}
|
|
|
|
/* RIGHT PAGES -------------------------------- */
|
|
|
|
@page :right {
|
|
margin-left: 20mm;
|
|
margin-right: 20mm;
|
|
@bottom-right {
|
|
content: counter(page);
|
|
font-family: "Millimetre-Light";
|
|
font-size: 8pt;
|
|
width: 40px;
|
|
}
|
|
@bottom-center {
|
|
content: string(chapTitle);
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
section {
|
|
break-after: always;
|
|
}
|
|
|
|
.chapter h1 {
|
|
string-set: chapTitle content(text);
|
|
}
|
|
|
|
/* BLANK PAGES -------------------------------- */
|
|
|
|
@page: blank {
|
|
@bottom-left {
|
|
content: none;
|
|
}
|
|
@bottom-center {
|
|
content: none;
|
|
}
|
|
@bottom-right {
|
|
content: none;
|
|
}
|
|
}
|
|
|
|
/* COUVERTURE -------------------------------- */
|
|
|
|
@page: first {
|
|
margin: 10mm 10mm;
|
|
/* background-color: rgb(20, 121, 253); */
|
|
@bottom-right {
|
|
content: none;
|
|
}
|
|
}
|
|
|
|
#cover {
|
|
font-family: "Millimetre-Light", sans-serif;
|
|
display: block;
|
|
/* break-before: none; */
|
|
}
|
|
|
|
#titletext {
|
|
}
|
|
|
|
#title {
|
|
font-size: 20pt;
|
|
margin-top: -2.5mm;
|
|
}
|
|
|
|
.cms {
|
|
width: 80%;
|
|
float: left;
|
|
}
|
|
.cms p {
|
|
font-size: 10pt;
|
|
line-height: 14pt;
|
|
}
|
|
.diary {
|
|
width: 100%;
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
column-gap: 10px;
|
|
row-gap: 10px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.part {
|
|
background-color: blanchedalmond;
|
|
}
|
|
|
|
.part p {
|
|
font-family: "Millimetre-Light";
|
|
font-size: 10pt;
|
|
line-height: 14pt;
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 0 2mm;
|
|
}
|
|
|
|
.part2,
|
|
.part3 {
|
|
background-color: transparent;
|
|
}
|
|
.part2 img,
|
|
.part3 img {
|
|
display: inline-block;
|
|
width: 100%;
|
|
}
|
|
|
|
.part3 img {
|
|
float: right;
|
|
}
|
|
|
|
.transition {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.transition p {
|
|
font-family: "Millimetre-Extrablack";
|
|
line-height: 0;
|
|
}
|
|
|
|
.cartoon {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
/* margin-top: 5mm; */
|
|
}
|
|
|
|
.intro {
|
|
width: 100%;
|
|
margin-top: 0;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
margin-bottom: 2.5mm;
|
|
background-color: white;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
#firstintro {
|
|
margin-bottom: 8.5mm;
|
|
}
|
|
|
|
.intro2 {
|
|
break-before: always;
|
|
}
|
|
|
|
#expl_buchimgae img {
|
|
float: right;
|
|
width: 50%;
|
|
}
|
|
|
|
.cms p,
|
|
.text p,
|
|
.intro p {
|
|
font-family: "Millimetre-Light";
|
|
}
|
|
|
|
.intro h4 {
|
|
font-size: 12pt;
|
|
}
|
|
|
|
.intro p {
|
|
font-size: 10pt;
|
|
line-height: 14pt;
|
|
border: 1px dashed black;
|
|
padding: 0 2mm;
|
|
}
|
|
#tsss {
|
|
text-decoration: underline dotted;
|
|
}
|
|
|
|
.cut {
|
|
width: 100%;
|
|
height: auto;
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
align-items: flex-start;
|
|
margin-bottom: 10mm;
|
|
}
|
|
|
|
.text {
|
|
background-color: blanchedalmond;
|
|
width: 100%;
|
|
max-width: 100%;
|
|
margin-left: -5mm;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.text p,
|
|
.part p {
|
|
padding: 0 2mm;
|
|
font-size: 10pt;
|
|
line-height: 14pt;
|
|
}
|
|
|
|
/* #adjustgap1,
|
|
#adjustgap2 {
|
|
margin-bottom: 7.5mm;
|
|
}
|
|
|
|
#adjustgap3 {
|
|
margin-top: -2.5mm;
|
|
} */
|
|
#photo {
|
|
display: none;
|
|
}
|
|
|
|
#Buchimgae {
|
|
text-decoration: dotted underline;
|
|
display: inline-block;
|
|
}
|
|
|
|
#Buchimgaepic {
|
|
display: none;
|
|
padding: 0;
|
|
margin: 0;
|
|
width: 20%;
|
|
}
|
|
|
|
#Buchimgaepic img {
|
|
width: 100%;
|
|
}
|
|
|
|
.ani img,
|
|
.enrico img,
|
|
.bindtogether img,
|
|
.chaepic img,
|
|
.compopic img,
|
|
.bilbi img {
|
|
width: 80%;
|
|
border: 1px solid black;
|
|
}
|
|
|
|
.enrico,
|
|
.bindtogether,
|
|
.chaepic,
|
|
.bilbi {
|
|
display: none;
|
|
}
|
|
|
|
/* SECTION BREAKS -------------------------------- */
|
|
|
|
section {
|
|
/* break-before: right; */
|
|
}
|
|
|
|
/* CONTENT --------------------------------------- */
|
|
}
|