:root {
--body-margin-top: 2cm;
--body-margin-right: 2cm;
--body-margin-bottom: 2cm;
--body-margin-left: 2cm;
}
/* Reset CSS */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body, h1, h2, h3, p, ul, li {
margin: 0;
padding: 0;
}
/* PAGE */
body {
font-family: Arial, sans-serif;
font-size: 11pt;
margin: var(--body-margin-top) var(--body-margin-right) var(--body-margin-bottom) var(--body-margin-left);
background-color: #fdfdfd;
overflow-x: hidden;
}
@media print {
body {
margin: 2cm;
background-color: white;
}
}
@page:right {
@bottom-center {
content: counter(page);
}
}
.document {
margin-bottom: 10vh;
}
@media print {
.document {
page-break-before: always;
}
}
.chapter {
}
.paragraph {
line-height: 1.5;
margin-top: 0.5em;
margin-bottom: 0.5em;
text-align: justify;
padding-left: 0.25em;
}
.page-break {
page-break-after: always;
}
/* HEADING */
.heading-1, .heading-2, .heading-3, .heading-4, .heading-5, .heading-6 {
font-weight: 600;
font-family: 'Arial', sans-serif;
margin-top: 0.75em;
margin-bottom: 0.5em;
line-height: 1.25;
page-break-after: avoid;
}
.heading-1 {
font-size: 2em;
margin-top: 5vh;
padding-bottom: 0.3em;
border-bottom: 1px solid #000000;
page-break-before: always;
}
@media print {
.heading-1 {
font-size: 2em;
margin-top: 0;
padding-bottom: 0.3em;
border-bottom-width: 1px;
border-bottom-style: solid;
page-break-before: always;
}
}
.heading-2 {
font-size: 1.5em;
padding-bottom: 0.3em;
border-bottom-width: 1px;
border-bottom-style: solid;
}
.heading-3 {
font-size: 1.25em;
font-weight: bold;
}
.heading-4 {
font-size: 1.1em;
}
.heading-5 {
font-size: 1em;
}
.heading-6 {
font-size: 0.875em;
}
/* EMBEDDED STYLE */
.abridged-embedded-style {
border-radius: 5%;
}
/* CHECKBOX */
.checkbox {
width: 15px;
height: 15px;
border: 1px solid #aaa;
border-radius: 4px;
position: relative;
background-color: #eee;
}
.checkbox-checked::before {
content: '\2713';
font-size: 16px;
color: black;
display: block;
text-align: center;
line-height: 18px;
}
/* IMAGE */
.figure {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
}
.image {
max-width: 100%;
height: auto;
margin-bottom: 10px;
}
.image-caption {
width: 100%;
}
/* LIST */
.list {
list-style-type: none;
padding: 0;
margin: 3vh 1vw 3vh 3.5vw;
page-break-inside: avoid;
}
.list-item-indentation {
padding-left: 2vw;
}
.list-item-bullet {
display: inline-block;
margin-right: 1vw;
font-size: medium;
width: 0.5em;
}
.list-item-bullet > .checkbox {
margin-right: 1.3vw;
}
/* FOCUS BLOCK */
.focus-block, .focus-quote-block {
padding: 16px;
border-radius: 8px;
display: flex;
gap: 10px;
align-items: center;
font-size: 1.05em;
margin: 3vh 2vw;
page-break-inside: avoid;
}
.focus-block-description, .focus-quote-block-description {
color: black;
}
.focus-block-quote, .focus-quote-block-quote {
background-color: #f9f9f9;
border-left: 4px solid #aaa;
font-style: italic;
font-weight: normal;
font-family: Georgia, 'Times New Roman', Times, serif;
font-size: 1.25em;
}
.focus-block-quote-title, .focus-quote-block-quote-title {
content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-quote" viewBox="0 0 16 16"><path d="M12 12a1 1 0 0 0 1-1V8.558a1 1 0 0 0-1-1h-1.388q0-.527.062-1.054.093-.558.31-.992t.559-.683q.34-.279.868-.279V3q-.868 0-1.52.372a3.3 3.3 0 0 0-1.085.992 4.9 4.9 0 0 0-.62 1.458A7.7 7.7 0 0 0 9 7.558V11a1 1 0 0 0 1 1zm-6 0a1 1 0 0 0 1-1V8.558a1 1 0 0 0-1-1H4.612q0-.527.062-1.054.094-.558.31-.992.217-.434.559-.683.34-.279.868-.279V3q-.868 0-1.52.372a3.3 3.3 0 0 0-1.085.992 4.9 4.9 0 0 0-.62 1.458A7.7 7.7 0 0 0 3 7.558V11a1 1 0 0 0 1 1z"/></svg>');
}
.focus-block-note, .focus-quote-block-note {
background-color: #edf4fe;
border-left: 4px solid #1a73e8;
}
.focus-block-note-title, .focus-quote-block-note-title {
color: #1354a8;
content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="%231354a8" class="bi bi-info-circle" viewBox="0 0 16 16"><path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14m0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16"/><path d="m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0"/></svg>');
}
.focus-block-tip, .focus-quote-block-tip {
background-color: #eafbea;
border-left: 4px solid #34a853;
}
.focus-block-tip-title, .focus-quote-block-tip-title {
color: #24753a;
content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="%2324753a" class="bi bi-lightbulb" viewBox="0 0 16 16"><path d="M2 6a6 6 0 1 1 10.174 4.31c-.203.196-.359.4-.453.619l-.762 1.769A.5.5 0 0 1 10.5 13a.5.5 0 0 1 0 1 .5.5 0 0 1 0 1l-.224.447a1 1 0 0 1-.894.553H6.618a1 1 0 0 1-.894-.553L5.5 15a.5.5 0 0 1 0-1 .5.5 0 0 1 0-1 .5.5 0 0 1-.46-.302l-.761-1.77a2 2 0 0 0-.453-.618A5.98 5.98 0 0 1 2 6m6-5a5 5 0 0 0-3.479 8.592c.263.254.514.564.676.941L5.83 12h4.342l.632-1.467c.162-.377.413-.687.676-.941A5 5 0 0 0 8 1"/></svg>');
}
.focus-block-important, .focus-quote-block-important {
background-color: #f1edf9;
border-left: 4px solid #8957E5;
}
.focus-block-important-title, .focus-quote-block-important-title {
color: #6b45b1;
content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="%236b45b1" class="bi bi-bookmark-star" viewBox="0 0 16 16"><path d="M7.84 4.1a.178.178 0 0 1 .32 0l.634 1.285a.18.18 0 0 0 .134.098l1.42.206c.145.021.204.2.098.303L9.42 6.993a.18.18 0 0 0-.051.158l.242 1.414a.178.178 0 0 1-.258.187l-1.27-.668a.18.18 0 0 0-.165 0l-1.27.668a.178.178 0 0 1-.257-.187l.242-1.414a.18.18 0 0 0-.05-.158l-1.03-1.001a.178.178 0 0 1 .098-.303l1.42-.206a.18.18 0 0 0 .134-.098z"/><path d="M2 2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v13.5a.5.5 0 0 1-.777.416L8 13.101l-5.223 2.815A.5.5 0 0 1 2 15.5zm2-1a1 1 0 0 0-1 1v12.566l4.723-2.482a.5.5 0 0 1 .554 0L13 14.566V2a1 1 0 0 0-1-1z"/></svg>');
}
.focus-block-warning, .focus-quote-block-warning {
background-color: #fff8e5;
border-left: 4px solid #d79b00;
}
.focus-block-warning-title, .focus-quote-block-warning-title {
color: #b17f02;
content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="%23b17f02" class="bi bi-exclamation-triangle" viewBox="0 0 16 16"><path d="M7.938 2.016A.13.13 0 0 1 8.002 2a.13.13 0 0 1 .063.016.15.15 0 0 1 .054.057l6.857 11.667c.036.06.035.124.002.183a.2.2 0 0 1-.054.06.1.1 0 0 1-.066.017H1.146a.1.1 0 0 1-.066-.017.2.2 0 0 1-.054-.06.18.18 0 0 1 .002-.183L7.884 2.073a.15.15 0 0 1 .054-.057m1.044-.45a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767z"/><path d="M7.002 12a1 1 0 1 1 2 0 1 1 0 0 1-2 0M7.1 5.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0z"/></svg>');
}
.focus-block-caution, .focus-quote-block-caution {
background-color: #fff3f4;
border-left: 4px solid #d93025;
}
.focus-block-caution-title, .focus-quote-block-caution-title {
color: #8b1e16;
content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="%238b1e16" class="bi bi-exclamation-octagon" viewBox="0 0 16 16"><path d="M4.54.146A.5.5 0 0 1 4.893 0h6.214a.5.5 0 0 1 .353.146l4.394 4.394a.5.5 0 0 1 .146.353v6.214a.5.5 0 0 1-.146.353l-4.394 4.394a.5.5 0 0 1-.353.146H4.893a.5.5 0 0 1-.353-.146L.146 11.46A.5.5 0 0 1 0 11.107V4.893a.5.5 0 0 1 .146-.353zM5.1 1 1 5.1v5.8L5.1 15h5.8l4.1-4.1V5.1L10.9 1z"/><path d="M7.002 11a1 1 0 1 1 2 0 1 1 0 0 1-2 0M7.1 4.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0z"/></svg>');
}
/* BOOKMARK */
.bookmark, .abridged-bookmark {
width: 98vw;
height: 15vh;
background-color: #f3efcb;
border-top-left-radius: 1%;
border-bottom-left-radius: 1%;
border-top-right-radius: calc(var(--body-margin-right) / 4.0);
border-bottom-right-radius: calc(var(--body-margin-right) / 4.0);
color: #333;
display: flex;
flex-direction: row-reverse;
justify-content: space-between;
align-items: center;
z-index: 999;
margin-left: calc(-1 * var(--body-margin-left));
overflow-x: hidden;
padding-right: calc(var(--body-margin-right) / 2.0);
padding-left: calc(var(--body-margin-right) / 2.0);
margin-top: 5vh;
margin-bottom: 5vh;
page-break-inside: avoid;
}
.bookmark-title, .abridged-bookmark-title {
font-size: large;
font-weight: bold;
}
.bookmark-title::after, .abridged-bookmark-title::after {
margin-left: 1vw;
content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="%23521616" class="bi bi-bookmark-fill" viewBox="0 0 16 16"><path d="M2 2v13.5a.5.5 0 0 0 .74.439L8 13.069l5.26 2.87A.5.5 0 0 0 14 15.5V2a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2"/></svg>');
}
/* .TODO */
.todo {
width: 98vw;
height: 15vh;
background-color: #fae8c7;
border-top-left-radius: 1%;
border-bottom-left-radius: 1%;
border-top-right-radius: calc(var(--body-margin-right) / 4.0);
border-bottom-right-radius: calc(var(--body-margin-right) / 4.0);
color: #333;
display: flex;
flex-direction: row-reverse;
justify-content: space-between;
align-items: center;
z-index: 999;
margin-left: calc(-1 * var(--body-margin-left));
overflow-x: hidden;
padding-right: calc(var(--body-margin-right) / 2.0);
padding-left: calc(var(--body-margin-right) / 2.0);
margin-top: 5vh;
margin-bottom: 5vh;
page-break-inside: avoid;
}
.todo-title::before {
content: "TODO";
font-size: large;
font-weight: bold;
color: #835602;
}
.todo-title::after {
margin-left: 1vw;
content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="%235e3f04" class="bi bi-pencil-square" viewBox="0 0 16 16"><path d="M15.502 1.94a.5.5 0 0 1 0 .706L14.459 3.69l-2-2L13.502.646a.5.5 0 0 1 .707 0l1.293 1.293zm-1.75 2.456-2-2L4.939 9.21a.5.5 0 0 0-.121.196l-.805 2.414a.25.25 0 0 0 .316.316l2.414-.805a.5.5 0 0 0 .196-.12l6.813-6.814z"/><path fill-rule="evenodd" d="M1 13.5A1.5 1.5 0 0 0 2.5 15h11a1.5 1.5 0 0 0 1.5-1.5v-6a.5.5 0 0 0-1 0v6a.5.5 0 0 1-.5.5h-11a.5.5 0 0 1-.5-.5v-11a.5.5 0 0 1 .5-.5H9a.5.5 0 0 0 0-1H2.5A1.5 1.5 0 0 0 1 2.5z"/></svg>');
}
/* .TABLE */
.table {
display: table;
width: 90%;
border-collapse: collapse;
margin: 5%;
}
.table-header {
display: table-header-group;
}
.table-body-row {
display: table-row;
}
.table-footer {
display: table-footer-group;
}
.table-cell, .table-empty-cell {
display: table-cell;
padding: 8px;
border: 1px solid #ddd;
}
.table-header .table-cell {
font-weight: bold;
background-color: #f2f2f2;
}
.table-footer .table-cell {
font-weight: bold;
background-color: #f9f9f9;
}
.table-empty-cell {
visibility: hidden;
border: none;
}
.table-right-cell {
text-align: right;
}
.table-center-cell {
text-align: center;
}
.table-left-cell {
text-align: left;
}
/* TOC */
.toc {
line-height: 2vh;
margin-bottom: 7vh;
page-break-inside: avoid;
}
.toc-title {
font-size: xx-large;
font-weight: bold;
margin-bottom: 2vh;
}
.toc-item {
margin: 5px 0 0 0;
}
.toc-body {
list-style-type: none;
padding: 0;
}
.toc-item-indentation {
padding-left: 2vw;
}
.toc-item-bullet {
display: inline-block;
margin-right: 0.5vw;
font-size: large;
width: 0.5em;
}
.toc-item-bullet::before {
content: "-";
}
/* BIBLIOGRAPHY */
.bibliography {
line-height: 2vh;
page-break-before: always;
}
.bibliography-title {
font-size: xx-large;
font-weight: bold;
margin-bottom: 2vh;
page-break-after: avoid;
}
.bibliography-body {
list-style-type: none;
padding: 0;
page-break-inside: avoid;
}
.bibliography-item {
margin: 1vh 0 0 1vh;
font-size: small;
}
.bibliography-item-title {
font-size: x-large;
font-style: italic;
margin-left: 1vw;
margin-bottom: 0.5vh;
}
.bibliography-item-title::before {
content: '"';
}
.bibliography-item-title::after {
content: '"';
}
.bibliography-item-authors {
font-size: medium;
margin-left: 2vw;
}
.bibliography-item-url {
text-decoration: underline;
margin-left: 2vw;
}
.bibliography-item-description {
margin-left: 2vw;
}
.bibliography-item-year {
margin-left: 2vw;
}
/* CITE */
.cite {
text-decoration: none;
color: black;
}
.cite::before {
content: '[';
margin-left: 0.2rem;
margin-right: 0.05rem;
}
.cite::after {
content: ']';
margin-right: 0.2rem;
margin-left: 0.05rem;
}