@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Sporting_Grotesque-Bold_web';
    font-style: normal;
    /*font-weight: 600;*/
    src: url('/assets/fonts/Sporting_Grotesque-Bold_web.woff2') format('woff2');
}
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'AvenirLTProHeavy';
    font-style: normal;
    src: url('/assets/fonts/AvenirLTProHeavy.otf') format('opentype');
}
/* Utility Reg Trial */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'UtilitySansTest-Regular';
    font-style: normal;
    src: url('/assets/fonts/UtilitySansTest-Regular.otf') format('opentype');
}
/* Utility Reg Trial */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'UtilitySansTest-SemiBold';
    font-style: normal;
    src: url('/assets/fonts/UtilitySansTest-SemiBold.otf') format('opentype');
}
/* Utility Bold Trial */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'UtilitySansTest-Bold';
    font-style: normal;
    src: url('/assets/fonts/UtilitySansTest-Bold.otf') format('opentype');
}

@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'MunkenSansWeb-Regular';
    font-style: normal;
    src: url('/assets/fonts/MunkenSansWeb-Regular.woff2') format('woff2');
}
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'MunkenSansWeb-Medium';
    font-style: normal;
    src: url('/assets/fonts/MunkenSansWeb-Medium.woff2') format('woff2');
}
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'MunkenSansWeb-Bold';
    font-style: normal;
    src: url('/assets/fonts/MunkenSansWeb-Bold.woff2') format('woff2');
}

:root {
    --choral: #FE634E;
    --pink: #ecb2ba;
    --pink-dark: #c6939a;
    --paper-dark: #dbd8be;
    --tape-gray: #dbd8be;
    --tape-edge-gray: #b7b49d;
    --transparent: rgba(255, 255, 255, 0);
}

.munken-sans {
    font-family: "MunkenSansWeb-Regular", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
}

.munken-sans-medium {
font-family: "MunkenSansWeb-Medium", sans-serif;
font-optical-sizing: auto;
font-style: normal;
}

.munken-sans-bold {
font-family: "MunkenSansWeb-Bold", sans-serif;
font-optical-sizing: auto;
font-style: normal;
}

*,
::after,
::before {
    box-sizing:border-box
}


html,
body {
    height: 100%;
}

body {
    margin: 0;
    background-color: #fffbeb;
    color: #7d004c;
    font-family: "MunkenSansWeb-Regular", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    overflow-x: hidden;
}

a {
    color: inherit;
    text-decoration: none;
    position: relative;
}

#kontakt a {
    padding: 0 2px;
}

#kontakt a::before {
  content: '';
  background-color:var(--pink);
  position: absolute;
  left: 0;
  bottom: 3px;
  width: 100%;
  height: 6px;
  z-index: -1;
  transition: all .3s ease-in-out;

  @media (min-width: 1024px) {
      height: 8px;
  }
}

#kontakt a:hover::before {
  bottom: 0;
  height: 100%;
}

p,
ul,
#kontakt {
    margin-top: 0;
    font-size: 1.125rem;

    @media (min-width: 768px) {
        font-size: 1.5rem;
    }
    @media (min-width: 1024px) {
        font-size: 1.75rem;
    }
}

h1,
h2 {
    margin-top: 0;
    font-family: "Sporting_Grotesque-Bold_web", sans-serif;
    /*font-family: "AvenirLTProHeavy", sans-serif;*/
    letter-spacing: -.02em;

    /* für Impressum/Datenschutz */
    font-size: 1.5rem;

    @media (min-width: 1024px) {
        font-size: 2rem;
    }
}

h1 {
    margin-bottom: 0;
}

h3 {
    letter-spacing: -0.05em;
    margin-bottom: 0;
    font-family: "MunkenSansWeb-Medium", sans-serif;
    font-size: 1.5rem;

    @media (min-width: 1024px) {
        font-size: 2rem;
    }
}

b,
strong {
    font-family: "MunkenSansWeb-Medium", sans-serif;
}

img {
    display: block;
    width: auto;
    max-width: 100%;
}

.icon {
    margin: 4px .25rem 0 0;

    @media (min-width: 768px) {
        margin: 6px .375rem 0 0;
    }
    @media (min-width: 1024px) {
        margin: 8px .5rem 0 0;
    }
}

.choral {
    color: var(--choral);
}

.done {
    font-family: "MunkenSansWeb-Regular", sans-serif;
    margin-top: 1rem;
    font-size: calc(.25vw + .25vh + 1vmax);
    line-height: 1.3;
    color: var(--choral);
}

.lg,
.lg p {
    font-size: calc(1vw + 1vh + 1.25vmin);
    line-height: 1.25;
    color: var(--choral);
}

.xl,
.xl p {
    font-size: calc(1.25vw + 1.25vh + 1.75vmin);
    line-height: 1.25;
    color: var(--choral);
}

.xxl {
    font-size: calc(1.25vw + 1.25vh + 2vmin);
    line-height: 1.25;
    color: var(--choral);
    letter-spacing: -0.025em;
}

.xxxl {
    font-size: calc(2.5vw + 1.75vh + 2.5vmin);
    line-height: 1.25;
    color: var(--choral);
    word-break: break-all;
}

.photorized {
    /*background-image:linear-gradient(90deg,blue,yellow,red,purple);*/
    background-image: url("/assets/images/text-bg.jpg");
    /*background-size: cover;*/
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.flex-cc {
    display: flex;
    justify-content: center;
    align-items: center;
}


.flex-ccc {
    display: flex;
    flex-direction: column;
    align-items: center;

    @media (min-width: 1024px) {
        justify-content: center;
    }
}

.flex-csbc {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

.imp {
    color: inherit;
    display: flex;
    justify-content: space-between;
    position: absolute;
    bottom: 12px;
    left: 0;
    right: 0;
    font-size: .875rem;
    text-decoration: none;
    padding: 0 16px;
    /*margin-bottom: max(.75rem, env(safe-area-inset-bottom));*/
    @media (min-width: 768px) {
        padding: 0 20px;
        justify-content: end;
    }
}

.imp span:nth-of-type(2) {
    display: none;

    @media (min-width: 768px) {
        display: inline;
    }
}

.mb-3 {
    margin-bottom: 4rem;

    @media (min-width: 768px) {
        margin-bottom: 6rem;
    }

    @media (min-width: 1024px) {
        margin-bottom: 6rem;
    }
    @media (min-width: 1280px) {
        margin-bottom: 8rem;
    }
}

section {
    /*height: 100dvh;*/
    padding: 2rem 1rem;

    @media (min-width: 768px) {
        padding: 2rem 1.5rem;
    }

    @media (min-width: 1024px) {
        padding: 2rem 2rem;
    }

    @media (min-width: 1280px) {
        padding: 3rem 4rem;
    }
}

.content {
    text-align: center;
    padding: 0 1.5rem 2rem;

    @media (min-width: 768px) {
        padding: 0 2.25rem 3rem;
    }

    @media (min-width: 1024px) {
        padding: 1rem 2.25rem 3rem;
        max-width: 767px;
    }

    @media (min-width: 1280px) {
        max-width: 909px;
    }
}

#impressum {
    position: relative;
    background-color: #f6f6eb;
    color: #391fd1;

    p,
    ul {
        font-size: 1rem;
    }
}