/* ------ fonts ------ */
@import url('https://fonts.googleapis.com/css2?family=Lancelot&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lancelot&family=Noto+Serif:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Arvo:ital,wght@0,400;0,700;1,400;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Special+Elite&display=swap');

.raleway { font-family: "Raleway"; }
.lindenhill { font-family: "Linden Hill" }
.anticslab { font-family: "Antic Slab" }
.rubik { font-family: "Rubik" }
.eczar { font-family: "Eczar" }
.spectral { font-family: "Spectral" }
.barlow { font-family: "Barlow" }
.titillium { font-family: "Titillium" }
.lancelot { font-family: "Lancelot" }
.arvo { font-family: "Arvo" }
.fraktur { font-family: "UnifrakturMaguntia" }

body { font-family: "Raleway"; }

/* ------ table of contents ------ */

#TableOfContents {
    position: sticky;
    float: left;
    shape-outside: inset(50%);

    left: 0;
    top: 0;
    height: 100%;

    font-family: "Raleway";
    font-size: 10pt;
    text-align: left;
    width: 5cm;

}

@media screen and (max-width: 1200px) {
    #TableOfContents {
        position: static;
        text-align: center;
        width: auto;
        height: auto;
        float: none;
        shape-outside: none;
    }
    #TableOfContents > ul  > li > ul > li { display: inline; }
    #TableOfContents > ul  > li > ul > li > ul > li { display: none; }
}

#TableOfContents a {
    color: #858a80;
    text-decoration: none;
}

#TableOfContents ul, #TableOfContents li {
    list-style: none;
    margin-top: 4pt;
}

#TableOfContents ul {
    padding-inline-start: 10px;
}

#TableOfContents > ul > li { font-size: 11pt; font-weight: normal; }
#TableOfContents > ul  > li > ul > li { font-size: 10pt; font-weight: normal; }
#TableOfContents > ul  > li > ul > li > ul > li { font-size: 9pt; font-weight: lighter; }

/* ------ blockquote - highlighting ------ */

blockquote p {
    font-family: "Antic Slab";
    font-style: italic;
}

blockquote code {
    all: unset;
    background-color: #dcffa3;
}

li {
    margin-bottom: 0.5rem;
}

/* ------ colors ------ */

p a {color: #b46f9c;}
blockquote p, blockquote li { color: #53744e; }
blockquote p a { color: #6cc644 }
blockquote p a:visited { color: #347e11 }
blockquote p a { color: #838d7b; }
blockquote p a:visited { color: #4b5447; }

blockquote .dark-blue code { background-color: #a3d9ff; }
blockquote .blue code { background-color: #bbdffa; }
blockquote .orange code { background-color: #ffe5cb; }
blockquote .green code { background-color: #c2f6b1; }
blockquote .purple code { background-color: #e2d4f6; }


/* ------ LAYOUTS ------ */

.layout-philosophical {
    font-family: "Libre Baskerville";
}
.layout-philosophical blockquote p {
    font-family: unset;
    font-style: italic;
}

.layout-german-history {
    font-family: "Arvo", serif;
    font-weight: 400;

    font-style: normal;
}
.layout-german-history .historical-quote {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 1.5rem;
}
.layout-german-history .historical-header .source {
    font-family: "UnifrakturMaguntia", cursive;
    font-size: 1.5rem;
}
.layout-german-history .historical-header .authorline {
    font-size: 1rem;
    font-style: italic;
}
.original.german {
    font-family: "UnifrakturMaguntia", cursive;
    font-weight: 100;
    font-size: 1.3rem;
    font-style: normal;
    color: #51574c;
}
.original.german u {
    letter-spacing: 5px;
    text-decoration: none;
}
.translation {
    font-family: "Barlow", serif;
    font-size: 1.3rem;
    color: #798158;
}
.translate-german {
    color: black;

    float: left;
    width: 45%;
    margin-left: 10%;
}
.layout-german-history blockquote p {
    font-family: "Raleway";
    font-family: "Linden Hill";
    font-family: "Antic Slab";
    font-family: "Rubik";
    font-family: "Eczar";
    font-family: "Spectral";
    font-family: "Barlow";
    font-family: "Titillium";
    font-family: "Lancelot";
    font-family: "Arvo";
    font-family: "UnifrakturMaguntia";

    font-family: "Barlow";

    font-style: normal;
    font-size: 1.1rem;
    color: #b46f9c;
}

.layout-german-history blockquote code,
.coded-decoded code {
    all: unset;
    background-color: rgba(180, 111, 156, 0.29);
}

/* ------ CODED-DECODED ------ */

.coded-decoded * {
    font-family: "Barlow", serif;
    font-size: 1.1rem;
}
.coded-decoded em {
    font-family: "Spectral";
    font-family: "Lancelot", serif;
    font-size: 1.2rem;
}
.coded-decoded table {
    border-spacing: 1rem;
    border-collapse: inherit;
    width: calc(100% + 2rem);
    margin-left: -1rem;
    margin-top: -1rem;
}
.coded-decoded.head-none thead {
    display: none;
}
.coded-decoded td {
    text-align: justify;
    vertical-align: baseline;
}
.coded-decoded td:nth-child(1) {
    color: #333333;
}
.coded-decoded th:nth-child(n+2),
.coded-decoded th:nth-child(n+2) *,
.coded-decoded td:nth-child(n+2),
.coded-decoded td:nth-child(n+2) * {
    font-size: 0.9rem;
    font-style: italic;

    color: #D5008F;
}
.coded-decoded.layers- th:nth-child(1) { width: 55%; text-align: left;}
.coded-decoded.layers- th:nth-child(n+2) { width: 45%; text-align: right;}
.coded-decoded.layers- td:nth-child(1) { width: 55%; text-align: justify;}
.coded-decoded.layers- td:nth-child(n+2) { width: 45%; text-align: right;}

.coded-decoded.layers-2 th:nth-child(1) { width: 55%; text-align: left;}
.coded-decoded.layers-2 th:nth-child(2) { width: 22%; text-align: left;}
.coded-decoded.layers-2 th:nth-child(3) { width: 22%; text-align: right;}
.coded-decoded.layers-2 td:nth-child(1) { width: 55%; text-align: justify;}
.coded-decoded.layers-2 td:nth-child(2) { width: 22%; text-align: left;}
.coded-decoded.layers-2 td:nth-child(3) { width: 22%; text-align: right;}

.coded-decoded.layers-3 th:nth-child(1) { width: 50%; text-align: left;}
.coded-decoded.layers-3 th:nth-child(2) { width: 16%; text-align: left;}
.coded-decoded.layers-3 th:nth-child(3) { width: 16%; text-align: center;}
.coded-decoded.layers-3 th:nth-child(4) { width: 16%; text-align: right;}
.coded-decoded.layers-3 td:nth-child(1) { width: 50%; text-align: justify;}
.coded-decoded.layers-3 td:nth-child(2) { width: 16%; text-align: left;}
.coded-decoded.layers-3 td:nth-child(3) { width: 16%; text-align: center;}
.coded-decoded.layers-3 td:nth-child(4) { width: 16%; text-align: right;}

.coded-decoded.layers-a1b td:nth-child(3),
.coded-decoded.layers-a1b td:nth-child(3) * {
    font-size: 1.0rem;
    font-style: normal;
    color: unset;
}

.coded-decoded.layers-a1b th:nth-child(1) { width: 50%; text-align: left;}
.coded-decoded.layers-a1b th:nth-child(2) { width: 15%; text-align: right;}
.coded-decoded.layers-a1b th:nth-child(3) { width: 35%; text-align: justify;}

.coded-decoded.cross-3 table td:nth-child(3) {
    background:
            repeating-linear-gradient(70deg, #e1e1e1, #e1e1e1 1.2px, transparent 1.2px, transparent 5px),
            repeating-linear-gradient(-20deg, #e1e1e1, #e1e1e1 0.8px, transparent 0.8px, transparent 5px);
}

/* ------ NOTES ------ */

.notes-columns {
    display: grid;
    grid-auto-flow: dense;
}
.notes-section article > a {
    text-decoration: none;
}

/* ------ SPECIAL ------ */

.breakout { /* https://stackoverflow.com/questions/11723417/break-element-out-of-container */
    margin:1em -100%; /* old browsers fallback */
    margin:1em calc(50% - 50vw);
}

.marginnote {
    font-size: 80%;
}
.marginnote > p {
    margin: 0;
}
.marginnote ul, .marginnote ol {
    list-style-type: none;
    padding-left: 0;
}

.leftnote {
    float: left;
    width: 150px;
    margin-left: -150px;
}
.rightnote {
    float: right;
    width: 150px;
    margin-right: -150px;
    text-align: right;
}

.layout-german-history .leftnote { font-size: 75%; width: 180px; margin-left: -190px; color: #b46f9c; }
.layout-german-history .rightnote { font-size: 75%; width: 180px; margin-right: -190px; color: #b46f9c; }


/* ------ POLINV : TEAMS ------ */

.team-item {
    position: relative;
}
.team-item > a {
    display: block;
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: 2fr 3fr 12fr;
    align-items: center;
    align-items: start;
}
.team-item address {
    position: absolute;
    right: 0;
    top: 0;
}
.team-list .team- { border-color: #284561; }
.team-list .team-m-b { border-color: #b7a7ad; }
.team-list .team-g-m-c { border-color: #aed49e; }
.team-list .team-n-p { border-color: #e7aac6; }
.team-list .team-b { border-color: #57433a; }


.cuttopaper {
    background-color: #cdcacd;
    background-image: url("../img/paper_0022_23.jpg");
    background-blend-mode: screen;
    background-size: cover;
}
.cuttopaper .innershadow { background-color: white;  }
.cuttopaper .innershadow.top { box-shadow:  0px 5px 5px 0px #e3e1e0; border-bottom: 1px solid #aaa6aa; }
.cuttopaper .innershadow.bottom { box-shadow:  0px -5px 5px 0px #e3e1e0;  border-top: 1px solid #aaa6aa; }
.cuttopaper img {
    border-radius: 0.5em;
    border: 1px solid #d3d1cf;
}
.cuttoemail {
    background-color: #ede9ed;
    font-family: "Special Elite", sans-serif;
    word-spacing: 3px;
}
.cuttodream {
    font-family: "Titillium", serif;
}


/* ------ media queries ------ */

@media (min-width: 40em) and (max-width: 64em) {
    .notes-columns { grid-template-columns: 1fr 1fr; }
}

@media (min-width: 64em) and (max-width: 96em) {
    .notes-columns { grid-template-columns: 1fr 1fr 1fr; }
}

@media (min-width: 96em) {
    .notes-columns { grid-template-columns: 1fr 1fr 1fr 1fr; }
}
