/**
 * @license
 * MyFonts Webfont Build ID 3778287, 2019-06-25T17:46:24-0400
 *
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are
 * explicitly restricted from using the Licensed Webfonts(s).
 *
 * You may obtain a valid license at the URLs below.
 *
 * Webfont: Graphit-Medium by HVD Fonts
 * URL: https://www.myfonts.com/fonts/hvdfonts/graphit/medium/
 * Copyright: Copyright (c) 2019 by Livius Dietzel, Tom Hossfeld. All rights reserved.
 * Licensed pageviews: 10,000
 *
 *
 * License: https://www.myfonts.com/viewlicense?type=web&buildid=3778287
 *
 * © 2019 MyFonts Inc
*/
/**
 * @license
 * MyFonts Webfont Build ID 3871732, 2020-02-25T12:36:02-0500
 *
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are
 * explicitly restricted from using the Licensed Webfonts(s).
 *
 * You may obtain a valid license at the URLs below.
 *
 * Webfont: Graphit-Light by HVD Fonts
 * URL: https://www.myfonts.com/fonts/hvdfonts/graphit/light/
 * Copyright: Copyright (c) 2019 by Livius Dietzel, Tom Hossfeld. All rights reserved.
 * Licensed pageviews: 10,000
 *
 *
 *
 * © 2020 MyFonts Inc
*/
/* @import must be at top of file, otherwise CSS will not work */
@import url("//hello.myfonts.net/count/39a6ef");
@import url("//hello.myfonts.net/count/3b13f4");
@import url("//hello.myfonts.net/count/3be560");

@font-face {font-family: 'Graphit'; font-weight: bold; src: url('webfonts/39A6EF_0_0.eot');src: url('webfonts/39A6EF_0_0.eot?#iefix') format('embedded-opentype'),url('webfonts/39A6EF_0_0.woff2') format('woff2'),url('webfonts/39A6EF_0_0.woff') format('woff'),url('webfonts/39A6EF_0_0.ttf') format('truetype');}
@font-face {font-family: 'Graphit'; font-weight: normal; src: url('webfonts/3B13F4_0_0.eot');src: url('webfonts/3B13F4_0_0.eot?#iefix') format('embedded-opentype'),url('webfonts/3B13F4_0_0.woff2') format('woff2'),url('webfonts/3B13F4_0_0.woff') format('woff'),url('webfonts/3B13F4_0_0.ttf') format('truetype');}
@font-face {
    font-family: 'Graphit';
    font-style: italic;
    src: url('webfonts/font.woff2') format('woff2'), url('webfonts/font.woff') format('woff');
}

* {
    box-sizing: border-box;
}

html {
    font-family: 'Graphit';
    scroll-behavior: smooth;
    font-size: 16px;
    line-height: 1.5;
}

figure {
    margin: 0;
}

:root {
    --size0: 6vw;
    --size1: calc((100vw - (2 * var(--size0))) / 6 - 1vw);
    --size2: calc(var(--size1) + 2vw);
    --size3: 5.85vw;
    --size4: 2vmax;
    --color0: #f9c6c0;
    --color1: #fcc834;
    --headings-line-height: 1.2;
}

body, table {
/*    font-family: 'Graphit-Light';*/
    font-weight: normal;
    font-style: normal;
    margin: 0;
    font-size: calc(0.7vw + 1rem);
}

/* strong { */
/*     font-family: "Graphit-Medium"; */
/*     font-weight: normal; */
/* } */

html {
    scroll-snap-type: y proximity;
}

hr {
    width: 100%;
    align-self: start;
    border: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.25);
    margin-bottom: 2rem;
}

em {
    /* Use non-breaking spaces to avoid linebreak after/before quotation marks*/
/*    quotes: '›\200A' '\200A‹';*/
/*    font-style: normal;*/
}

/* em::before { */
/*     content: open-quote; */
/* } */

/* em::after { */
/*     content: close-quote; */
/* } */

dt {
    font-weight: bold;
/*     font-family: "Graphit-Medium"; */
}

dd {
    margin-left: 0;
    margin-bottom: 2rem;
}

.section {
    padding: calc(var(--size0) * 0.666666667 + 1rem) var(--size0);
    scroll-snap-align: start;
    background: var(--color1);
}

.section:nth-child(2n+1) {
    background: var(--color0);
}


@media (min-width: 1200px) {
    .section {
        padding: calc(var(--size0) * 0.66666667 + 1rem) calc(var(--size0) * 4) calc(var(--size0) * 0.66666667 + 1rem) var(--size0);
    }
}

.header.section {
    padding: calc(var(--size0) / 3) var(--size0);
    background: var(--color0);
    scroll-snap-align: start;
    color: #111;

    /* TODO: min. zwei reihen / kein anschnitt der reihen bzw. nur halb*/
    height: calc(100vmin - var(--size0) - 2.5rem);
    overflow: hidden;
}

.header-short.section {
    height: calc(var(--size1) + var(--size0));
}

footer.section {
    padding: 0;
    scroll-snap-align: end;
}

.footer-nav {
    display: flex;
}

.footer-nav a {
    padding: calc(var(--size0) / 4 + 1.5rem) var(--size0);
}

p {
    margin: 0 0 1.5rem 0;
}

ul:last-child, p:last-child {
    margin-bottom: 0;
}

ul {
    margin: 0 0 1.5rem 0;
    padding: 0;
}

a:link {
    text-underline-position: under;
}

a:link, a:visited {
    color: #111;
}

.anchor-link {
    position: relative;
    top: calc(-1 * (var(--size0) * 0.666666667 + 1rem));
}

.dots {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.w-100 {
    width: 100%;
    flex-grow: 1;
    flex-shrink: 0;
    flex-basis: 100%;
}

.artist-teaser, .article-teaser {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(4, auto);
    max-width: 100vw;
    grid-gap: calc(1rem * 1.5) calc(1 * var(--size0));
}

.artist-photo {
    order: 3;
}

.artist-photo img {
    width: 100%;

    border-radius: 50%;
    margin-bottom: 3rem;
    object-fit: cover;
    filter: grayscale(1);
    mix-blend-mode: multiply;
}

@media (min-width: 40em) {
    .artist-teaser, .article-teaser {
        grid-template-columns: 4fr 3fr;
    }
    .artist-text, .article-text {
        grid-row: span 3;
    }
}

@media (min-width: 70em) {
    .artist-photo {
        grid-row: span 3;
    }
}

.artist-name, .article-title {
    order: 1;
    grid-column: 1;
    grid-row: 1;
    margin: 0;
}

.artist-photo figcaption {
    font-size: calc(var(--size4) * 0.1 + 1rem);
    line-height: var(--headings-line-height);
    text-align: center;
}

.artist-quote {
    display: none;
    order: 4;
    margin: 0;
}
.artist-text, .article-text {
    order: 2;
    grid-column: 1;
}

.artist-text a:last-child {
    display: inline-block;
    margin-top: 1.5rem;
}

.author-name {
    text-decoration: none;
    float: right;
}

.artist-teaser .anchor-link, .article-teaser .anchor-link {
    grid-row: 1;
    grid-column: 1;
}

blockquote p {
    quotes: "“" "“" "‚" "‘";
}

blockquote p::before {
    content: open-quote;
}
blockquote p::after {
    content: close-quote;
}

blockquote footer {
    font-size: 70%;
}

blockquote footer::before {
    content: "(";
}

blockquote footer::after {
    content: ")";
}

/* h1,h2,h3,h4,h5,h6, */
/* .h1,.h2,.h3,.h4,.h5,.h6 { */
/*     font-family: 'Graphit-Medium'; */
/*     font-weight: normal; */
/* } */

.display-text {
    /* font-family: 'Graphit-Medium'; */
    font-weight: bold;
    font-size: var(--size1);
    margin: 0;
    line-height: var(--size2);
}

.brand {
    grid-column: 1 / span 6;
    justify-self: start;
    text-decoration: none;
}

h1, .h1 {
    font-size: calc(var(--size1) * 0.145 + 1rem);
    line-height: var(--headings-line-height);
    margin: 0 0 2rem 0;
}

h2, .h2 {
    font-size: calc(var(--size1) * 0.125 + 1rem);
    line-height: var(--headings-line-height);
    margin: 0 0 2rem 0;
}

h3 {
    font-size: calc(var(--size1) * 0.1 + 1rem);
    line-height: var(--headings-line-height);
    margin: 0 0 1rem 0;
}

h4 {
    font-size: calc(var(--size1) * 0.075 + 1rem);
    line-height: var(--headings-line-height);
    margin: 0 0 1rem 0;
}


.dot, .dot-first {
    /* font-family: "Graphit-Medium"; */
    font-weight: bold;
    font-size: var(--size1);
    color: #111;
    display: inline;
    line-height: var(--size2);
}

.dot::before {
    content: 'o';
    display: inline;
}

.dot-first {
    color: white !important;
    position: fixed;
    z-index: 1;
    top: calc(var(--size0) / 3);
    right: var(--size3);
    text-decoration: none;
}

@media (min-width: 40em) {
    .flex-list {
        flex-direction: row;
        flex-wrap: wrap;
    }
}

.inline-list {
    display: inline;
}

.inline-list li {
    display: inline-flex;
}

.dot-list li::after {
    content: "\2002o\2002";
    /* font-family: 'Graphit-Medium'; */
    font-weight: bold;
}

.dot-list li:last-child::after {
    content: "";
}

.artist-list {
    margin-bottom: 1.5rem;
}

.fluid-image {
    max-width: 100%;
}

.curious-section {
    display: grid;
    grid-template-columns: 1fr;
}

.curious-title {
    grid-row: 1;
    grid-column: 1;
}

.curious-section .anchor-link {
    grid-row: 1;
    grid-column: 1;
}

@media (min-width: 40em) {
    .curious-section {
        grid-template-columns: 3fr 4fr;
        grid-template-rows: repeat(3, auto);
    }
    .curious-text, .curious-title {
        grid-column: 1 / span 2;
    }
}

.table {
    border-collapse: collapse;
}

.table th {
    /* font-family: "Graphit-Medium"; */
    font-weight: bold;
}

.text-left {
    text-align: left !important;
}

.table-header-left th {
    text-align: left;
    padding: 0 1rem 0 0;
}