@font-face {
    src: url('fern/FernVariable-Roman-VF.woff2') format("woff2"),
         url('fern/FernVariable-Roman-VF.woff') format("woff");
    font-family: 'Fern Web';
    font-style: normal;
    font-weight: 400 800;
}


@font-face {
    src: url('fern/FernVariable-Italic-VF.woff2') format("woff2"),
         url('fern/FernVariable-Italic-VF.woff') format("woff");
    font-family: 'Fern Web';
    font-style: italic;
    font-weight: 400 800;
}


p {
    text-decoration-skip-ink: none !important;
}

#topnav a {
    text-decoration: none;
}

body {
  font-family: 'Fern Web', et-book, Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif;
  color: #221;
  background: #f6f5f2;
}

h2 {
    margin-top: 3rem;
}

pre > code {
    width: unset;
}

p code {
    font-size: 85%;
    background: gainsboro;
    border-radius: .2em;
    padding: .1em .333em;
}

section > img, section > a > img {
    width: 100%;
    height: auto;
}

section a {
    color: #e11980 !important;
}

section > p:first-of-type {
    font-style: italic;
}
/*section > p:first-of-type::first-letter {
    color: #e11980;
    float: left;
    font-size: 2.5lh;
    padding-right: .25lh;
    margin-left: -.333lh;
}*/


ul.post-list {
    padding: 0;
}
ul.post-list > li {
    list-style: none;
}
ul.post-list h3 {
    margin-bottom: 0;
    font-style: normal;
}
ul.post-list p {
    margin-top: .666rem;
    font-style: italic;
}
ul.post-list a {
    color: inherit !important;
    text-decoration: none;
}
ul.post-list time {
    font-variant-numeric: lining-nums;
    font-variant-caps: all-small-caps;
    font-style: normal;
    opacity: .5;
}

@media (min-width: 760px)
{
    html {
        font-size: 17px; /*das muss nur auf desktop!*/
    }
}

@media (prefers-color-scheme: dark) {
    body {
		color: #ddd;
		background: #151515;
    }
    p code {
		background: #272822;
    }
}