/*
 * COLORS
 */
:root {
  --white: #f2f2f2;
  --orange: #ff6c01;
  --black: #050505;
  --grey: #666666;
  --grey-dark: #222222;
  --orange-grey: rgb(147.9, 103.8, 71.7);
  --white-transparent: rgba(242, 242, 242, 0);
  --orange-transparent: rgba(255, 108, 1, 0);
  --black-transparent: rgba(5, 5, 5, 0);
  --grey-transparent: rgba(102, 102, 102, 0);
}

/*
 *  BREAKPOINTS & MEDIA QUERIES
 */
/*
* MIXINS
*/
@keyframes buchstabe {
  to {
    stroke-dashoffset: 0;
  }
}
.intro #schriftzug-wrapper #schriftzug {
  transition: height 2s, padding 2s;
}
.intro #schriftzug-wrapper.intro-pre #schriftzug, .intro #schriftzug-wrapper.intro #schriftzug {
  padding: 10vh 10vw;
  height: 100vh;
}
.intro #schriftzug-wrapper .hundt, .intro #schriftzug-wrapper .hammer, .intro #schriftzug-wrapper .stein {
  transition: fill 2s;
}
.intro #schriftzug-wrapper #momo {
  transition: fill 2s, stroke 2s;
}
.intro #schriftzug-wrapper.intro-pre .hundt, .intro #schriftzug-wrapper.intro-pre .hammer, .intro #schriftzug-wrapper.intro-pre .stein {
  fill: rgba(255, 108, 1, 0);
}
.intro #schriftzug-wrapper.intro-pre #momo {
  fill: #f2f2f2;
  stroke: rgba(242, 242, 242, 0);
}
.intro #schriftzug-wrapper.intro-pre #hundt-h {
  stroke-dasharray: 1621.8677978516;
  stroke-dashoffset: 0;
}
.intro #schriftzug-wrapper.intro-pre #hundt-u {
  stroke-dasharray: 1532.90234375;
  stroke-dashoffset: 0;
}
.intro #schriftzug-wrapper.intro-pre #hundt-n {
  stroke-dasharray: 2142.3510742188;
  stroke-dashoffset: 0;
}
.intro #schriftzug-wrapper.intro-pre #hundt-d-aussen {
  stroke-dasharray: 993.190612793;
  stroke-dashoffset: 0;
}
.intro #schriftzug-wrapper.intro-pre #hundt-d-innen {
  stroke-dasharray: 507.7125549316;
  stroke-dashoffset: 0;
}
.intro #schriftzug-wrapper.intro-pre #hundt-t {
  stroke-dasharray: 1030.8603515625;
  stroke-dashoffset: 1030.8603515625;
}
.intro #schriftzug-wrapper.intro-pre #hammer-h {
  stroke-dasharray: 1643.3435058594;
  stroke-dashoffset: 1643.3435058594;
}
.intro #schriftzug-wrapper.intro-pre #hammer-a-aussen {
  stroke-dasharray: 1126.7985839844;
  stroke-dashoffset: 1126.7985839844;
}
.intro #schriftzug-wrapper.intro-pre #hammer-a-innen {
  stroke-dasharray: 372.038482666;
  stroke-dashoffset: 372.038482666;
}
.intro #schriftzug-wrapper.intro-pre #hammer-m-oben {
  stroke-dasharray: 1339.8864746094;
  stroke-dashoffset: 1339.8864746094;
}
.intro #schriftzug-wrapper.intro-pre #hammer-m-unten {
  stroke-dasharray: 1338.0455322266;
  stroke-dashoffset: 1338.0455322266;
}
.intro #schriftzug-wrapper.intro-pre #hammer-e {
  stroke-dasharray: 1303.943359375;
  stroke-dashoffset: 1303.943359375;
}
.intro #schriftzug-wrapper.intro-pre #hammer-r-aussen {
  stroke-dasharray: 1373.0191650391;
  stroke-dashoffset: 1373.0191650391;
}
.intro #schriftzug-wrapper.intro-pre #hammer-r-innen {
  stroke-dasharray: 222.3719024658;
  stroke-dashoffset: 222.3719024658;
}
.intro #schriftzug-wrapper.intro-pre #stein-s {
  stroke-dasharray: 1454.8911132813;
  stroke-dashoffset: 1454.8911132813;
}
.intro #schriftzug-wrapper.intro-pre #stein-t {
  stroke-dasharray: 1069.9577636719;
  stroke-dashoffset: 1069.9577636719;
}
.intro #schriftzug-wrapper.intro-pre #stein-e {
  stroke-dasharray: 1317.4194335938;
  stroke-dashoffset: 1317.4194335938;
}
.intro #schriftzug-wrapper.intro-pre #stein-i {
  stroke-dasharray: 876.5949707031;
  stroke-dashoffset: 876.5949707031;
}
.intro #schriftzug-wrapper.intro-pre #stein-n {
  stroke-dasharray: 2262.0498046875;
  stroke-dashoffset: 2262.0498046875;
}
.intro #schriftzug-wrapper #hundt-t {
  stroke-dasharray: 1030.8603515625;
  stroke-dashoffset: 1030.8603515625;
  animation: buchstabe 1.75s ease-out 0s forwards;
}
.intro #schriftzug-wrapper.intro .hundt:not(.innen), .intro #schriftzug-wrapper.intro .hammer:not(.innen), .intro #schriftzug-wrapper.intro .stein:not(.innen) {
  fill: #ff6c01;
}
.intro #schriftzug-wrapper.intro #momo {
  stroke: #f2f2f2;
  fill: #ff6c01;
}
.intro #schriftzug-wrapper.intro #hammer-h {
  stroke-dasharray: 1643.3435058594;
  stroke-dashoffset: 1643.3435058594;
  animation: buchstabe 1.65s ease-out 0.1s forwards;
}
.intro #schriftzug-wrapper.intro #hammer-a-aussen {
  stroke-dasharray: 1126.7985839844;
  stroke-dashoffset: 1126.7985839844;
  animation: buchstabe 1.55s ease-out 0.2s forwards;
}
.intro #schriftzug-wrapper.intro #hammer-a-innen {
  stroke-dasharray: 372.038482666;
  stroke-dashoffset: 372.038482666;
  animation: buchstabe 1.55s ease-out 0.2s forwards;
}
.intro #schriftzug-wrapper.intro #hammer-m-oben {
  stroke-dasharray: 1339.8864746094;
  stroke-dashoffset: 1339.8864746094;
  animation: buchstabe 1.45s ease-out 0.3s forwards;
}
.intro #schriftzug-wrapper.intro #hammer-m-unten {
  stroke-dasharray: 1338.0455322266;
  stroke-dashoffset: 1338.0455322266;
  animation: buchstabe 1.45s ease-out 0.3s forwards;
}
.intro #schriftzug-wrapper.intro #hammer-e {
  stroke-dasharray: 1303.943359375;
  stroke-dashoffset: 1303.943359375;
  animation: buchstabe 1.35s ease-out 0.4s forwards;
}
.intro #schriftzug-wrapper.intro #hammer-r-aussen {
  stroke-dasharray: 1373.0191650391;
  stroke-dashoffset: 1373.0191650391;
  animation: buchstabe 1.25s ease-out 0.5s forwards;
}
.intro #schriftzug-wrapper.intro #hammer-r-innen {
  stroke-dasharray: 222.3719024658;
  stroke-dashoffset: 222.3719024658;
  animation: buchstabe 1.25s ease-out 0.5s forwards;
}
.intro #schriftzug-wrapper.intro #stein-s {
  stroke-dasharray: 1454.8911132813;
  stroke-dashoffset: 1454.8911132813;
  animation: buchstabe 1.15s ease-out 0.6s forwards;
}
.intro #schriftzug-wrapper.intro #stein-t {
  stroke-dasharray: 1069.9577636719;
  stroke-dashoffset: 1069.9577636719;
  animation: buchstabe 1.05s ease-out 0.7s forwards;
}
.intro #schriftzug-wrapper.intro #stein-e {
  stroke-dasharray: 1317.4194335938;
  stroke-dashoffset: 1317.4194335938;
  animation: buchstabe 0.95s ease-out 0.8s forwards;
}
.intro #schriftzug-wrapper.intro #stein-i {
  stroke-dasharray: 876.5949707031;
  stroke-dashoffset: 876.5949707031;
  animation: buchstabe 0.85s ease-out 0.9s forwards;
}
.intro #schriftzug-wrapper.intro #stein-n {
  stroke-dasharray: 2262.0498046875;
  stroke-dashoffset: 2262.0498046875;
  animation: buchstabe 0.75s ease-out 1s forwards;
}

/*# sourceMappingURL=intro.css.map */