@charset "UTF-8";
@font-face {
  font-family: "Houschka Pro-Bold";
  src: url("../fonts/HouschkaPro-Bold.woff2") format("woff2"), url("../fonts/HouschkaPro-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
* {
  box-sizing: border-box;
}

body {
  margin: 0;
  padding: 0;
}

p {
  margin: 0;
}

a {
  text-decoration: underline;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
  margin: 0px;
  padding: 0px;
}

.ft-gruen {
  color: #69be28;
}

.bg-gruen {
  background-color: #69be28;
}

.ft-schwarz {
  color: #000000;
}

.bg-schwarz {
  background-color: #000000;
}

.ft-hellgruen {
  color: #a5d77d;
}

.bg-hellgruen {
  background-color: #a5d77d;
}

.ft-dunkelgruen {
  color: #5faa23;
}

.bg-dunkelgruen {
  background-color: #5faa23;
}

.ft-rot {
  color: #c80019;
}

.bg-rot {
  background-color: #c80019;
}

.ft-tiefgrau {
  color: #262626;
}

.bg-tiefgrau {
  background-color: #262626;
}

.ft-dunkelgrau {
  color: #666666;
}

.bg-dunkelgrau {
  background-color: #666666;
}

.ft-grau {
  color: #cccccc;
}

.bg-grau {
  background-color: #cccccc;
}

.ft-hellgrau1 {
  color: #e4e4e4;
}

.bg-hellgrau1 {
  background-color: #e4e4e4;
}

.ft-hellgrau2 {
  color: #f5f5f5;
}

.bg-hellgrau2 {
  background-color: #f5f5f5;
}

.ft-weiss {
  color: #ffffff;
}

.bg-weiss {
  background-color: #ffffff;
}

h1, .h1a {
  font-family: houschka-pro-demibold, Helvetica, sans-serif;
  text-transform: uppercase;
  font-size: 26px;
  line-height: 31px;
  letter-spacing: 1.5px;
}

@media screen and (min-width: 992px) {
  h1, .h1a {
    font-size: 40px;
    line-height: 48px;
    letter-spacing: 2.5px;
  }
}
.h1b {
  font-family: houschka-pro-medium, Helvetica, sans-serif;
  text-transform: uppercase;
  font-size: 20px;
  line-height: 24px;
  letter-spacing: 1px;
}

@media screen and (min-width: 992px) {
  .h1b {
    font-size: 28px;
    line-height: 34px;
    letter-spacing: 1.5px;
  }
}
h2, .h2 {
  font-family: houschka-pro-medium, Helvetica, sans-serif;
  text-transform: uppercase;
  font-size: 16px;
  line-height: 19px;
  letter-spacing: 1px;
}

@media screen and (min-width: 992px) {
  h2, .h2 {
    font-size: 20px;
    line-height: 24px;
    letter-spacing: 1.5px;
  }
}
h3, .h3 {
  font-family: arnhem-pro-blonditalic, "Times New Roman", sans-serif;
  font-size: 16px;
  line-height: 19px;
  letter-spacing: 0px;
  -webkit-font-smoothing: antialiased;
}

@media screen and (min-width: 992px) {
  h3, .h3 {
    font-size: 20px;
    line-height: 24px;
    letter-spacing: 0px;
  }
}
h4, .h4 {
  font-family: houschka-pro-medium, Helvetica, sans-serif;
  font-size: 20px;
  line-height: 24px;
  letter-spacing: 0.5px;
}

.h4-sonderfall {
  font-family: houschka-pro-medium, Helvetica, sans-serif;
  font-size: 14px;
  line-height: 15px;
  letter-spacing: 0.5px;
}

@media screen and (min-width: 992px) {
  .h4-sonderfall {
    font-size: 20px;
    line-height: 24px;
    letter-spacing: 0.5px;
  }
}
h5, .h5, h6, .h6 {
  font-family: houschka-pro-demibold, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 20px;
  letter-spacing: 0.5px;
}

p, .p1, li {
  font-family: houschka-pro-light, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 28px;
  letter-spacing: 0.8px;
}

@media screen and (min-width: 992px) {
  p, .p1, li {
    font-size: 18px;
    line-height: 32px;
    letter-spacing: 1px;
  }
}
.p2 {
  font-family: houschka-pro-light, Helvetica, sans-serif;
  font-size: 14px;
  line-height: 26px;
  letter-spacing: 0.8px;
}

@media screen and (min-width: 992px) {
  .p2 {
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0.8px;
  }
}
.p3 {
  font-family: houschka-pro-medium, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0.8px;
}

.s1 {
  font-family: houschka-pro-demibold, Helvetica, sans-serif;
  font-size: 12px;
  line-height: 15px;
  letter-spacing: 0.5px;
}

.s2 {
  font-family: houschka-pro-medium, Helvetica, sans-serif;
  text-transform: uppercase;
  font-size: 11px;
  line-height: 13px;
  letter-spacing: 2px;
}

blockquote {
  font-family: arnhem-pro-blonditalic, "Times New Roman", serif;
  font-size: 20px;
  line-height: 30px;
  letter-spacing: 0.5px;
  font-weight: lighter;
  color: #69be28;
  border-left: 2px solid #69be28;
  padding: 0px 50px;
  margin-top: 50px;
  margin-bottom: 50px;
}

@media screen and (max-width: 991px) {
  .margin-sm-a1 {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .padding-sm-a1 {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .margin-sm-top-a1 {
    margin-top: 10px;
  }
  .margin-sm-bottom-a1 {
    margin-bottom: 10px;
  }
  .padding-sm-top-a1 {
    padding-top: 10px;
  }
  .padding-sm-bottom-a1 {
    padding-bottom: 10px;
  }
  .margin-sm-2a1 {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .padding-sm-2a1 {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .margin-sm-top-2a1 {
    margin-top: 20px;
  }
  .margin-sm-bottom-2a1 {
    margin-bottom: 20px;
  }
  .padding-sm-top-2a1 {
    padding-top: 20px;
  }
  .padding-sm-bottom-2a1 {
    padding-bottom: 20px;
  }
  .margin-sm-a2 {
    margin-top: 15px;
    margin-bottom: 15px;
  }
  .padding-sm-a2 {
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .margin-sm-top-a2 {
    margin-top: 15px;
  }
  .margin-sm-bottom-a2 {
    margin-bottom: 15px;
  }
  .padding-sm-top-a2 {
    padding-top: 15px;
  }
  .padding-sm-bottom-a2 {
    padding-bottom: 15px;
  }
  .margin-sm-a3 {
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .padding-sm-a3 {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .margin-sm-top-a3 {
    margin-top: 30px;
  }
  .margin-sm-bottom-a3 {
    margin-bottom: 30px;
  }
  .padding-sm-top-a3 {
    padding-top: 30px;
  }
  .padding-sm-bottom-a3 {
    padding-bottom: 30px;
  }
  .margin-sm-a4 {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .padding-sm-a4 {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .margin-sm-top-a4 {
    margin-top: 40px;
  }
  .margin-sm-bottom-a4 {
    margin-bottom: 40px;
  }
  .padding-sm-top-a4 {
    padding-top: 40px;
  }
  .padding-sm-bottom-a4 {
    padding-bottom: 40px;
  }
  .margin-sm-a5 {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .padding-sm-a5 {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .margin-sm-top-a5 {
    margin-top: 40px;
  }
  .margin-sm-bottom-a5 {
    margin-bottom: 40px;
  }
  .padding-sm-top-a5 {
    padding-top: 40px;
  }
  .padding-sm-bottom-a5 {
    padding-bottom: 40px;
  }
  .margin-sm-a6 {
    margin-top: 60px;
    margin-bottom: 60px;
  }
  .padding-sm-a6 {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  .margin-sm-top-a6 {
    margin-top: 60px;
  }
  .margin-sm-bottom-a6 {
    margin-bottom: 60px;
  }
  .padding-sm-top-a6 {
    padding-top: 60px;
  }
  .padding-sm-bottom-a6 {
    padding-bottom: 60px;
  }
}
@media screen and (min-width: 992px) {
  .margin-md-a1 {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .padding-md-a1 {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .margin-md-top-a1 {
    margin-top: 10px;
  }
  .margin-md-bottom-a1 {
    margin-bottom: 10px;
  }
  .padding-md-top-a1 {
    padding-top: 10px;
  }
  .padding-md-bottom-a1 {
    padding-bottom: 10px;
  }
  .margin-md-2a1 {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .padding-md-2a1 {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .margin-md-top-2a1 {
    margin-top: 20px;
  }
  .margin-md-bottom-2a1 {
    margin-bottom: 20px;
  }
  .padding-md-top-2a1 {
    padding-top: 20px;
  }
  .padding-md-bottom-2a1 {
    padding-bottom: 20px;
  }
  .margin-md-a2 {
    margin-top: 15px;
    margin-bottom: 15px;
  }
  .padding-md-a2 {
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .margin-md-top-a2 {
    margin-top: 15px;
  }
  .margin-md-bottom-a2 {
    margin-bottom: 15px;
  }
  .padding-md-top-a2 {
    padding-top: 15px;
  }
  .padding-md-bottom-a2 {
    padding-bottom: 15px;
  }
  .margin-md-a3 {
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .padding-md-a3 {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .margin-md-top-a3 {
    margin-top: 30px;
  }
  .margin-md-bottom-a3 {
    margin-bottom: 30px;
  }
  .padding-md-top-a3 {
    padding-top: 30px;
  }
  .padding-md-bottom-a3 {
    padding-bottom: 30px;
  }
  .margin-md-a4 {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .padding-md-a4 {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .margin-md-top-a4 {
    margin-top: 40px;
  }
  .margin-md-bottom-a4 {
    margin-bottom: 40px;
  }
  .padding-md-top-a4 {
    padding-top: 40px;
  }
  .padding-md-bottom-a4 {
    padding-bottom: 40px;
  }
  .margin-md-a5 {
    margin-top: 60px;
    margin-bottom: 60px;
  }
  .padding-md-a5 {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  .margin-md-top-a5 {
    margin-top: 60px;
  }
  .margin-md-bottom-a5 {
    margin-bottom: 60px;
  }
  .padding-md-top-a5 {
    padding-top: 60px;
  }
  .padding-md-bottom-a5 {
    padding-bottom: 60px;
  }
  .margin-md-a6 {
    margin-top: 80px;
    margin-bottom: 80px;
  }
  .padding-md-a6 {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .margin-md-top-a6 {
    margin-top: 80px;
  }
  .margin-md-bottom-a6 {
    margin-bottom: 80px;
  }
  .padding-md-top-a6 {
    padding-top: 80px;
  }
  .padding-md-bottom-a6 {
    padding-bottom: 80px;
  }
}
.btn-default, .btn-primary, .btn-success, .btn-info, .btn-warning, .btn-danger {
  text-shadow: none;
  box-shadow: none;
}

.btn {
  font-family: houschka-pro-demibold, Helvetica, sans-serif;
  line-height: 17px;
  letter-spacing: 0.3px;
  padding: 17px 15px 16px 15px;
  border-radius: 2px;
  background-image: none;
  text-decoration: none;
  font-size: 14px;
}
.btn.btn-block {
  width: 100%;
  display: block;
}
.btn.btn-big {
  height: 90px;
}
.btn.btn-primary {
  border: none;
  background-color: #69be28;
  color: #ffffff;
}
.btn.btn-primary.inactive {
  opacity: 0.5;
}
.btn.btn-secondary, .btn.btn-default {
  border: 1px solid #69be28;
  background-color: transparent;
  color: #69be28;
}
.btn.btn-secondary.inactive, .btn.btn-default.inactive {
  opacity: 0.5;
}
.btn.btn-primary-weiss {
  border: none;
  background-color: #ffffff;
  color: #69be28;
}
.btn.btn-primary-weiss.inactive {
  opacity: 0.5;
}
.btn.btn-secondary-weiss, .btn.btn-default-weiss {
  border: 1px solid #ffffff;
  background-color: #69be28;
  color: #ffffff;
}
.btn.btn-secondary-weiss.inactive, .btn.btn-default-weiss.inactive {
  opacity: 0.5;
}
.btn.btn-weiter {
  background-image: url(../img/arrow-btn-right-white.png);
  background-position: 97%;
  background-repeat: no-repeat;
}
.btn.btn-zurueck {
  background-image: url(../img/arrow-btn-left-white.png);
  background-position: 97%;
  background-repeat: no-repeat;
}
.btn.btn-warenkorb {
  background-image: url(../img/icon-btn-warenkorb.svg);
  background-position: 3%;
  background-repeat: no-repeat;
}
.btn.btn-wide {
  padding-left: 100px;
  padding-right: 100px;
}
@media screen and (max-width: 768px) {
  .btn.btn-wide {
    padding-left: 30px;
    padding-right: 30px;
  }
}

.kachel {
  background-color: #ffffff;
  box-shadow: #e4e4e4 1px 1px 0.4px 0px;
}

.tag {
  height: 22px;
  border-radius: 12px;
  font-size: 12px;
  padding: 4px 10px;
}
.tag.gruen {
  background-color: #ffffff;
  color: #69be28;
  border: 1px solid #69be28;
}
.tag.grau {
  background-color: #ffffff;
  color: #262626;
  border: 1px solid #262626;
}

a {
  color: #69be28;
}
a:hover {
  text-decoration: none;
}
a.navigation {
  color: #ffffff;
  text-decoration: none;
}
a.navigation:hover {
  color: #69be28;
}
a.navigation.inactive {
  color: #666666;
}
@media screen and (min-width: 992px) {
  a.navigation {
    color: #262626;
    text-decoration: none;
  }
  a.navigation:hover {
    color: #69be28;
  }
  a.navigation.inactive {
    color: #cccccc;
  }
}

footer a {
  color: #cccccc;
}
footer a:hover {
  color: #69be28;
  text-decoration: none;
}

.shadow-standard {
  box-shadow: #e4e4e4 1px 1px 0.4px 0px;
}

.shadow-kachel {
  box-shadow: #e4e4e4 0px 0px 3px 0px;
}

.shadow-sticky-header {
  box-shadow: #e4e4e4 1px 1px 0.4px 0px;
}

.shadow-navigation {
  box-shadow: rgba(0, 0, 0, 0.25) 5px 0px 15px 10px;
}
@media screen and (min-width: 992px) {
  .shadow-navigation .shadow-navigation {
    box-shadow: #000000 0px 5px 15px 0px;
  }
}

.select-style {
  padding: 10px 0px 10px 10px;
  margin: 0;
  border: none;
  border-radius: 0px;
  overflow: hidden;
  background-color: #ffffff;
  border-bottom: 1px solid #cccccc;
  background: #fff url(../img/arrow-select-down.png) no-repeat 98% 50%;
}
.select-style label {
  margin-left: -9px;
  font-size: 12.645px;
  font-family: houschka-pro-medium, Helvetica, sans-serif;
  text-transform: uppercase;
  line-height: 13px;
  letter-spacing: 2px;
  font-weight: bolder;
}
.select-style.inline {
  display: inline-block;
}
.select-style.bordered {
  border-bottom: 1px solid #cccccc;
}
.select-style select {
  font-family: "houschka-pro-demibold", Helvetica, sans-serif;
  color: #262626;
  padding: 0px 0px;
  width: 100%;
  border: none;
  box-shadow: none;
  background-color: transparent;
  background-image: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-weight: lighter;
  margin-left: -8px;
}
.select-style select::-ms-expand {
  display: none;
}
.select-style select:focus {
  outline: none;
}
.select-style select option {
  font-family: "houschka-pro-demibold", Helvetica, sans-serif;
  color: #262626;
}

.slider-style {
  margin-top: 10px;
}

.radio-row {
  padding: 30px 30px 20px 30px;
  border: 1px solid #e4e4e4;
  border-radius: 0px;
  background-color: #f5f5f5;
}
.radio-row .meta-checkbox {
  background-color: #ffffff;
  margin-right: 30px;
  vertical-align: top;
  margin-top: 20px;
}
.radio-row label {
  max-width: 80%;
}

.radio-buttons p {
  margin-top: 30px;
}
.radio-buttons label, .radio-buttons p {
  font-size: 12.645px;
  font-family: houschka-pro-medium, Helvetica, sans-serif;
  text-transform: uppercase;
  line-height: 13px;
  letter-spacing: 2px;
  font-weight: bolder;
}
.radio-buttons input[type=radio],
.radio-buttons input[type=checkbox] {
  background-color: #ffffff;
  margin-right: 30px;
  vertical-align: top;
  margin-top: 20px;
}
.radio-buttons input[type=radio]:not(old),
.radio-buttons input[type=checkbox]:not(old) {
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
  opacity: 0;
}
.radio-buttons input[type=radio]:not(old) + label,
.radio-buttons input[type=checkbox]:not(old) + label {
  display: inline-block;
  margin-left: -30px;
  padding-left: 50px;
  background: url("/assets/img/radio_unchecked.png") no-repeat 0 0;
  background-size: 30px 30px;
  line-height: 30px;
  cursor: pointer;
  min-width: 30px;
  min-height: 30px;
}
.radio-buttons input[type=radio]:not(old):checked + label,
.radio-buttons input[type=checkbox]:not(old):checked + label {
  background: url("/assets/img/radio_checked.png") no-repeat 0 0;
  background-size: 30px 30px;
}
.radio-buttons input[type=email], .radio-buttons input[type=search], .radio-buttons input[type=number], .radio-buttons input[type=password], .radio-buttons input[type=tel],
.radio-buttons input[type=text] {
  width: 100%;
  border: none;
  border-bottom: 1px solid #cccccc;
  height: 40px;
  padding: 10px;
}
.radio-buttons input[type=email].input__field--hoshi, .radio-buttons input[type=search].input__field--hoshi, .radio-buttons input[type=number].input__field--hoshi, .radio-buttons input[type=password].input__field--hoshi, .radio-buttons input[type=tel].input__field--hoshi,
.radio-buttons input[type=text].input__field--hoshi {
  border-bottom: none;
}

.icon-a-sm {
  width: 17px;
  height: 16px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.icon-a-md {
  width: 32px;
  height: 32px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.icon-a-lg {
  width: 64px;
  height: 64px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.icon-b-sm {
  width: 24px;
  height: 24px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.icon-b-md {
  width: 48px;
  height: 48px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.icon-b-lg {
  width: 96px;
  height: 96px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

@media screen and (max-width: 767px) {
  .row {
    margin-left: -10px;
    margin-right: -10px;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .row {
    margin-left: 0px;
    margin-right: 0px;
  }
}
.icon-projekte {
  background-image: url(../img/navigation/icon_projekte_md.svg);
}

.icon-druckereien {
  background-image: url(../img/navigation/icon_druckereien_md.svg);
}

.icon-wiki {
  background-image: url(../img/navigation/icon_wiki_md.svg);
}

.icon-podcast {
  background-image: url(../img/navigation/icon_podcast_md.svg);
}

.icon-lieferung {
  background-image: url(../img/account/icon_lieferung.svg);
}

.icon-agentur {
  background-image: url(../img/entdecken/icon_agentur.svg);
}

.icon-papiere, .icon-a4copyrough, .icon-weimusterdina4, .icon-uniquepapers {
  background-image: url(../img/navigation/icon_papiere_md.svg);
}

.icon-ecofibres {
  background-image: url(../img/navigation/icon_ecofibres_md.svg);
}

.icon-multiloft, .icon-multilofttop, .icon-produkt, .icon-produktkategorie {
  background-image: url(../img/navigation/icon_multiloft_md.svg);
}

.icon-layflat {
  background-image: url(../img/navigation/icon_layflat_md.svg);
}

.icon-papierkonzept {
  background-image: url(../img/navigation/icon_papierkonzept_md.svg);
}

.icon-dummy, .icon-fenster {
  background-image: url(../img/navigation/icon_dummy_erstellen_md.svg);
}

.icon-a4musterweissepapiere {
  background-image: url(../img/navigation/icon-a4musterweissepapiere.svg);
}

.icon-ecofibrescolors, .icon-a4musterecofibrescolors {
  background-image: url(../img/navigation/icon-a4musterecofibrescolors.svg);
}

.icon-surface {
  background-image: url(../img/konfigurator/icon_oberflaeche.svg);
}

.icon-grammage, div[class^=icon-grammage], div[class*=" icon-grammage"] {
  background-image: url(../img/konfigurator/icon_grammatur.svg);
}

.icon-bueroausstattung, .icon-geschäftsausstattung, .icon-produktgruppe, .icon-mustergeschäftsausstattung {
  background-image: url(../img/konfigurator/icon_bueroausstattung.svg);
}

.icon-packaging {
  background-image: url(../img/konfigurator/icon_packaging.svg);
}

.icon-muster, .icon-musterset {
  background-image: url(../img/konfigurator/icon_muster.svg);
}

.icon-specialpapers {
  background-image: url(../img/konfigurator/icon_friends.svg);
}

.icon-mohawk {
  background-image: url(../img/konfigurator/icon_mohawk.svg);
}

.icon-bedrucktemuster {
  background-image: url(../img/konfigurator/icon_bedruckte_muster.svg);
}

.icon-cover {
  background-image: url(../img/konfigurator/icon_cover.svg);
}

.icon-etiketten, .icon-etikettenaufkleber {
  background-image: url(../img/konfigurator/icon_etiketten.svg);
}

.icon-inserts, .icon-multiloftinserts {
  background-image: url(../img/konfigurator/icon_inserts.svg);
}

.icon-multilofttestset {
  background-image: url(../img/konfigurator/icon_multiloft_testset.svg);
}

.icon-top, .icon-multiloftcover {
  background-image: url(../img/konfigurator/icon_top.svg);
}

.icon-umschläge, .icon-erstausstattungsbox {
  background-image: url(../img/konfigurator/icon_umschlaege.svg);
}

.icon-versandtaschen {
  background-image: url(../img/konfigurator/icon_versandtasche.svg);
}

.icon-selector {
  background-image: url(../img/konfigurator/icon_selector.svg);
}

.icon-papeterie {
  background-image: url(../img/konfigurator/icon_papeterie.svg);
}

.icon-brandbook, .icon-brandbookbuchblock {
  background-image: url(../img/konfigurator/icon_brandbook.svg);
}

.meta-col-md-4 {
  width: 360px;
  float: left;
}
@media screen and (max-width: 1219px) {
  .meta-col-md-4 {
    width: 293px;
  }
}
@media screen and (max-width: 991px) {
  .meta-col-md-4 {
    width: 100%;
    float: none;
    padding-left: 15px;
    padding-right: 15px;
  }
}

.warmwhite, .softwhite, .xinsertwarmwhite325gm2, .xcoverextraroughwarmwhite325gm2, .magnetbox4xextraroughwarmwhite325gm2, .insertwarmwhite {
  background-color: #fffff7;
}

.white, .coldwhitewhite, .whitewhite, .warmwhitewhite, .ulimatewhite, .xinsertwhite325gm2, .xcoverextraroughwhite325gm2, .magnetbox4xextraroughwhite325gm2, .insertwhite {
  background-color: #ffffff;
}

.coldwhite, .coolwhite, .xinsertcoldwhite325gm2, .xcoverextrasmoothcoldwhite270gm2, .insertcoldwhite {
  background-color: #f3fbfe;
}

.allwhite, .mixedwhite10coverjederweissfärbung, .insertallwhite {
  background: #fffff7; /* FF3.6-15 */ /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(45deg, #fffff7 0%, #fffff7 37%, #ffffff 39%, #ffffff 60%, #f3fbfe 62%, #f3fbfe 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#fffff7", endColorstr="#f3fbfe",GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.rainbow, .rainbow1xjedefarbe, .insertrainbow {
  background: red;
  background: linear-gradient(45deg, red, red, orange, yellow, green, blue, indigo, violet, violet);
}
.rainbow .text, .rainbow1xjedefarbe .text, .insertrainbow .text {
  color: #ffffff;
}

.black, .xinsertblack270gm2, .insertblack {
  background-color: #000000;
}
.black .text, .xinsertblack270gm2 .text, .insertblack .text {
  color: #ffffff;
}

.blue, .xinsertblue270gm2, .insertblue {
  background-color: #4866B5;
}
.blue .text, .xinsertblue270gm2 .text, .insertblue .text {
  color: #ffffff;
}

.darkgreen, .xinsertdarkgreen270gm2, .insertdarkgreen {
  background-color: #81AE5E;
}
.darkgreen .text, .xinsertdarkgreen270gm2 .text, .insertdarkgreen .text {
  color: #ffffff;
}

.lightgreen, .xinsertlightgreen270gm2, .insertlightgreen {
  background-color: #CADEBE;
}

.magenta, .xinsertmagenta270gm2, .insertmagenta {
  background-color: #BF016E;
}
.magenta .text, .xinsertmagenta270gm2 .text, .insertmagenta .text {
  color: #ffffff;
}

.orange, .xinsertorange270gm2, .insertorange {
  background-color: #E0C123;
}
.orange .text, .xinsertorange270gm2 .text, .insertorange .text {
  color: #ffffff;
}

.pink, .xinsertpink270gm2, .insertpink {
  background-color: #E8B3B8;
}
.pink .text, .xinsertpink270gm2 .text, .insertpink .text {
  color: #ffffff;
}

.purple, .xinsertpurple270gm2, .insertpurple {
  background-color: #8C5C9C;
}
.purple .text, .xinsertpurple270gm2 .text, .insertpurple .text {
  color: #ffffff;
}

.red, .xinsertred270, .insertred {
  background-color: #9C0D29;
}
.red .text, .xinsertred270 .text, .insertred .text {
  color: #ffffff;
}

.turquoise, .xinsertturquoise270gm2, .insertturquoise {
  background-color: #66ffcc;
}
.turquoise .text, .xinsertturquoise270gm2 .text, .insertturquoise .text {
  color: #ffffff;
}

.yellow, .xinsertyellow270gm2, .insertyellow {
  background-color: #E0E500;
}

.husk {
  background-color: #bec47d;
}
.husk .text {
  color: #ffffff;
}

.milkweed {
  background-color: #f8f9e5;
}

.urbangray {
  background-color: #404440;
}
.urbangray .text {
  color: #ffffff;
}

.iris {
  background-color: #200742;
}
.iris .text {
  color: #ffffff;
}

.chili {
  background-color: #570900;
}
.chili .text {
  color: #ffffff;
}

.magnet, .xmagnetbottom925gm2, .magnetbox4xextraroughwarnwhite325gm2 {
  background-color: rgb(105, 105, 105);
}
.magnet .text, .xmagnetbottom925gm2 .text, .magnetbox4xextraroughwarnwhite325gm2 .text {
  color: #ffffff;
}

/* COLORS with IMAGES */
.birch {
  background-color: #d6d8c0;
  background: url(../img/colors/birch.jpg) no-repeat;
  background-size: cover;
}
.birch .text {
  color: #ffffff;
  text-shadow: 1px 1px black;
}

.snow {
  background-color: #d6d8c0;
  background: url(../img/colors/snow.jpg) no-repeat;
  background-size: cover;
}
.snow .text {
  color: #ffffff;
  text-shadow: 1px 1px black;
}

.straw {
  background-color: #d6d8c0;
  background: url(../img/colors/straw.jpg) no-repeat;
  background-size: cover;
}
.straw .text {
  color: #ffffff;
  text-shadow: 1px 1px black;
}

.jute {
  background-color: #d6d8c0;
  background: url(../img/colors/jute.jpg) no-repeat;
  background-size: cover;
}
.jute .text {
  color: #ffffff;
  text-shadow: 1px 1px black;
}

.earth {
  background-color: #d6d8c0;
  background: url(../img/colors/earth.jpg) no-repeat;
  background-size: cover;
}
.earth .text {
  color: #ffffff;
  text-shadow: 1px 1px black;
}

.hr {
  height: 1px;
  background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 5px 2px;
  background-repeat: repeat-x;
}

.clear {
  clear: both;
}

#nav-mobile {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  margin-left: 60px;
  background-color: #262626;
  background-image: url(../img/header/bg_mobile-nav.png);
  background-position: left;
  background-repeat: repeat-y;
}
#nav-mobile .header {
  height: 80px;
  background-image: linear-gradient(to right, white 20%, rgba(255, 255, 255, 0) 0%);
  background-position: bottom;
  background-size: 5px 1px;
  background-repeat: repeat-x;
}
#nav-mobile .header a {
  margin-left: 0px;
  display: block;
  text-align: center;
}
#nav-mobile .content {
  height: 100%;
  overflow: scroll;
}
#nav-mobile .content a {
  display: block;
  margin-left: 35px;
}
#nav-mobile .content a.has-subnav {
  background-image: url(../img/navigation/btn_arrow_next_xs.svg);
  background-position: right;
  background-repeat: no-repeat;
  margin-right: 30px;
}
#nav-mobile .content a img {
  margin-right: 20px;
  width: 30px;
  height: auto;
}
#nav-mobile .subnav-mobile {
  position: absolute;
  left: 100%;
  top: 0px;
  width: 100%;
  height: 100%;
  background-color: #262626;
  background-image: url(../img/header/bg_mobile-nav.png);
  background-position: left;
  background-repeat: repeat-y;
  display: none;
}
#nav-mobile .subnav-mobile.level1 {
  left: 0%;
  display: block;
}
#nav-mobile .subnav-mobile.level1 > .header {
  height: 60px;
}
#nav-mobile .subnav-mobile .header {
  height: 65px;
}
#nav-mobile .subnav-mobile .header h2 {
  margin-left: 30px;
  margin-top: 25px;
}
#nav-mobile .subnav-mobile .header h2 img {
  margin-right: 10px;
  vertical-align: middle;
  cursor: pointer;
}
#nav-mobile .subnav-mobile .content {
  padding-bottom: 200px;
}

.mobile-nav-white-stripes-overlay {
  display: none;
  position: fixed;
  left: 0px;
  top: 60px;
  width: 60px;
  height: 100%;
  background-color: #ffffff;
  z-index: 100;
  transition: 0.5s;
}

#wrapper {
  position: relative;
  left: 0px;
  top: 0px;
  width: 100%;
  background-color: #ffffff;
  transition: 0.5s;
  border-right: 1px solid #e4e4e4;
}

.inverted header {
  background-color: transparent;
  border-bottom: none;
}
@media screen and (max-width: 991px) {
  .inverted header.scrolled {
    background-color: #000000;
  }
}
.inverted header .logo-md img.logo-standard {
  display: none;
}
.inverted header .logo-md img.logo-weiss {
  display: inline;
}
.inverted header .mainnavigation a {
  color: #ffffff;
}
.inverted header .metanavigation .metanavigation-inverted {
  display: block;
}
.inverted header .metanavigation .metanavigation-standard {
  display: none;
}
.inverted header.scrolled .mainnavigation a {
  color: #666666;
}

#nav-header {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  z-index: 10;
  background-color: #ffffff;
  border-bottom: 1px solid #e4e4e4;
  transition: 0.5s;
}
@media screen and (max-width: 991px) {
  #nav-header {
    height: 60px;
  }
}
#nav-header.scrolled {
  background-color: white;
}
#nav-header .logo-md img {
  transition: 0.5s;
}
#nav-header .logo-md img.logo-weiss {
  display: none;
}
#nav-header .logo-md img.margin-md-a2 {
  margin-top: 20px;
}
@media screen and (max-width: 991px) {
  #nav-header .logo-sm img.padding-sm-a2 {
    padding-top: 18px;
  }
}
#nav-header .mainnavigation {
  text-align: center;
  transition: 0.5s;
  margin-top: 3px;
}
#nav-header .mainnavigation a {
  transition: padding 0.5s;
  display: inline-block;
  padding-left: 20px;
  padding-right: 20px;
}
#nav-header .mainnavigation a.active {
  background-image: url(../img/navigation/btn_arrow_next_md.svg);
  background-position: 50% 80%;
  background-repeat: no-repeat;
  color: #69be28;
}
#nav-header .subnav-md {
  display: none;
  background-color: #ffffff;
}
#nav-header .subnav-md.subnav-level2 {
  height: 200px;
  text-align: center;
}
#nav-header .subnav-md.subnav-level2 .has-subnav {
  height: 150px;
}
#nav-header .subnav-md.subnav-level2 .has-subnav.active {
  background-image: url(../img/navigation/btn_arrow_next_md.svg);
  background-position: 50% 90%;
  background-repeat: no-repeat;
  color: #69be28;
}
#nav-header .subnav-md.subnav-level3 {
  height: 400px;
  text-align: center;
}
#nav-header .subnav-md.subnav-level3 a {
  display: block;
  text-align: left;
  margin-bottom: 0px;
  max-width: none;
}
#nav-header .subnav-md a {
  display: inline-block;
  max-width: 80px;
  color: #262626;
  text-align: center;
  text-decoration: none;
  vertical-align: top;
}
#nav-header .subnav-md a.margin-right-120 {
  margin-right: 120px;
}
#nav-header .subnav-md a.grayedout {
  filter: gray;
  filter: grayscale(1);
  -webkit-filter: grayscale(1);
  opacity: 0.5;
}
#nav-header .subnav-md a .image {
  position: relative;
  text-align: center;
  height: 64px;
  margin-bottom: 10px;
}
#nav-header .subnav-md a .image .icon-a-lg {
  position: relative;
  margin: 0px auto;
  margin-top: 10px;
  transition: 0.5s;
}
#nav-header .subnav-md a .image .icon-a-lg.active {
  top: -5px;
}
#nav-header .metanavigation.margin-md-a2 {
  margin-top: 20px;
}
@media screen and (max-width: 991px) {
  #nav-header .metanavigation.padding-sm-a2 {
    padding-top: 18px;
  }
}
#nav-header .metanavigation .languageSwitch {
  display: inline-block;
  position: relative;
  margin-left: 10px;
  height: 35px;
  width: 60px;
  transform: translateY(-7px);
  z-index: 999;
}
#nav-header .metanavigation .languageSwitch .current {
  position: relative;
  display: block;
  height: 35px;
  width: 60px;
  border: 1px solid #cccccc;
  border-radius: 23px;
  font-size: 16px;
  text-align: left;
  padding-top: 6px;
  padding-left: 10px;
  cursor: pointer;
  transition: 0.3s;
  background-image: url(../img/header/icon-arrow-down.png);
  background-position: 38px 12px;
  background-repeat: no-repeat;
  background-size: 12px auto;
}
#nav-header .metanavigation .languageSwitch .current:hover {
  border: 1px solid black;
}
#nav-header .metanavigation .languageSwitch .languageSwitchDropdown {
  display: none;
  position: absolute;
  right: 0px;
  top: 50px;
  width: 200px;
  height: 180px;
  border-radius: 2px;
  background-color: white;
  border-top: 1px solid #cccccc;
  border-left: 1px solid #cccccc;
  border-right: 1px solid #cccccc;
  box-shadow: 0px 5px 10px #666;
}
#nav-header .metanavigation .languageSwitch .languageSwitchDropdown a {
  display: block;
  position: relative;
  width: 100%;
  height: 60px;
  border-bottom: 1px solid #cccccc;
  font-size: 16px;
  text-align: left;
  padding-top: 18px;
  padding-left: 60px;
  margin-left: 0px;
  text-decoration: none;
  color: #666666;
}
#nav-header .metanavigation .languageSwitch .languageSwitchDropdown a .ring {
  display: block;
  position: absolute;
  width: 20px;
  height: 20px;
  border: 1px solid #cccccc;
  border-radius: 50%;
  left: 20px;
  top: 20px;
  background-color: white;
}
#nav-header .metanavigation .languageSwitch .languageSwitchDropdown a .ring .dot {
  display: block;
  position: absolute;
  left: 5.5px;
  top: 4.5px;
  width: 8px;
  height: 8px;
  border-radius: 4px;
  background-color: white;
  transition: 0.3s;
  border: none;
}
#nav-header .metanavigation .languageSwitch .languageSwitchDropdown a:hover .ring .dot, #nav-header .metanavigation .languageSwitch .languageSwitchDropdown a.active .ring .dot {
  background-color: #69be28;
}
#nav-header .metanavigation .languageSwitch .languageSwitchDropdown a:hover {
  background-color: #e4e4e4;
}
#nav-header .metanavigation .metanavigation-standard {
  position: absolute;
  right: 10px;
  background-image: linear-gradient(#666666 20%, rgba(255, 255, 255, 0) 0%);
  background-position: left;
  background-size: 1px 5px;
  background-repeat: repeat-y;
}
#nav-header .metanavigation .metanavigation-inverted {
  position: absolute;
  right: 10px;
  display: none;
  background-image: linear-gradient(#cccccc 20%, rgba(255, 255, 255, 0) 0%);
  background-position: left;
  background-size: 1px 5px;
  background-repeat: repeat-y;
}
#nav-header .metanavigation .metanavigation-inverted .languageSwitch .current {
  color: white;
  border-color: white;
  background-image: url(../img/header/icon-arrow-down-white.png);
}
#nav-header .metanavigation .metanavigation-inverted a.icon-meta.suche {
  padding-left: 0;
  background-image: url(../img/header/icon_suche_weiss.svg);
}
#nav-header .metanavigation .metanavigation-inverted a.icon-meta.account {
  background-image: url(../img/header/icon_account_weiss.svg);
}
#nav-header .metanavigation .metanavigation-inverted a.icon-meta.warenkorb {
  background-image: url(../img/header/icon_warenkorb_weiss.svg);
}
#nav-header .metanavigation .metanavigation-inverted a.icon-meta.sprache .language-label {
  color: #ffffff;
}
#nav-header .metanavigation .metanavigation-inverted a.icon-meta.burger {
  background-image: url(../img/header/icon_burger_weiss.svg);
}
#nav-header .metanavigation a {
  display: inline-block;
  transition: 0.5s;
  position: relative;
  margin-left: 20px;
  width: 25px;
}
#nav-header .metanavigation a.icon-meta {
  width: 25px;
  height: 25px;
  background-position: right;
  background-size: contain;
}
#nav-header .metanavigation a.icon-meta.suche {
  padding-left: 50px;
  background-image: url(../img/header/icon_suche.svg);
}
#nav-header .metanavigation a.icon-meta.account {
  background-image: url(../img/header/icon_account.svg);
}
#nav-header .metanavigation a.icon-meta.account.loggedin {
  border: 1px solid #666666;
  border-radius: 12px;
}
#nav-header .metanavigation a.icon-meta.warenkorb {
  background-image: url(../img/header/icon_warenkorb.svg);
}
#nav-header .metanavigation a.icon-meta.burger {
  background-image: url(../img/header/icon_burger.svg);
}
#nav-header .metanavigation a .warenkorb-status {
  position: absolute;
  right: 0px;
  top: 2px;
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: #69be28;
  display: none;
}
#nav-header .metanavigation a .warenkorb-status.filled {
  display: block;
}
#nav-header .metanavigation a .language-label {
  position: absolute;
  left: 0px;
  top: 4px;
  width: 25px;
  height: 10px;
  font-size: 9px;
  color: #262626;
  text-align: center;
}
@media screen and (max-width: 991px) {
  #nav-header .metanavigation {
    height: 60px;
  }
}
#nav-header .metanavigation .dropdown-login {
  display: none;
  text-align: left;
  position: absolute;
  right: 0px;
  top: 67px;
  width: 300px;
  background-color: #ffffff;
  border: 1px solid #e4e4e4;
  border-radius: 2px;
  padding: 30px;
}
@media screen and (max-width: 991px) {
  #nav-header .metanavigation .dropdown-login {
    top: 41px;
  }
}
#nav-header .metanavigation .dropdown-login form {
  padding-bottom: 20px;
  margin-bottom: 30px;
}
#nav-header .metanavigation .dropdown-login a {
  width: 100%;
  margin: 0px auto;
}

nav.navigation-md {
  transition: 0.5s;
  transition-delay: 0.3s;
  min-height: 60px;
}

.overlay-background {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-color: #000000;
  opacity: 0.75;
  display: none;
  z-index: 3;
}

footer a {
  text-decoration: none;
}
footer a:hover {
  color: #ffffff;
}
footer .oben {
  background-color: #69be28;
}
footer .oben .border-left {
  background-image: linear-gradient(to right, white 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 5px 1px;
  background-repeat: repeat-x;
}
@media screen and (min-width: 992px) {
  footer .oben .border-left {
    height: 450px;
    padding-left: 30px;
    background-image: linear-gradient(white 20%, rgba(255, 255, 255, 0) 0%);
    background-position: left;
    background-size: 1px 5px;
    background-repeat: repeat-y;
  }
}
footer .oben h2, footer .oben p, footer .oben li {
  color: #ffffff;
}
footer .oben h2.telefonkontakt, footer .oben p.telefonkontakt, footer .oben li.telefonkontakt {
  line-height: 0px;
}
footer .oben h2.telefonkontakt .s2, footer .oben p.telefonkontakt .s2, footer .oben li.telefonkontakt .s2 {
  line-height: 10px;
}
footer .oben h2.telefonkontakt .h4, footer .oben p.telefonkontakt .h4, footer .oben li.telefonkontakt .h4 {
  line-height: 40px;
}
footer .oben ul {
  padding-left: 0px;
  margin-left: 15px;
}
footer .oben ul li {
  list-style-image: url(../img/footer/bullet.svg);
}
footer .oben .footer-icon {
  margin-right: 20px;
  display: inline-block;
  cursor: pointer;
}
footer .oben .footer-icon-telephone {
  display: block;
  float: left;
}
footer .oben .footer-icon-holder .footer-icon {
  margin-right: 10px;
  margin-bottom: 10px;
}
@media screen and (max-width: 991px) {
  footer .oben .footer-icon-holder {
    text-align: center;
  }
  footer .oben .footer-icon-holder .footer-icon {
    margin-right: 10px;
    margin-bottom: 10px;
  }
}
footer .unten {
  background-color: #262626;
}
footer .unten .h5 {
  color: #ffffff;
}
footer .unten .h5, footer .unten .p3 {
  display: block;
}

.modal-search {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100vh;
  background-color: #fff;
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 100000;
  background-color: rgba(0, 0, 0, 0.8);
}
.modal-search .bttn__closesearch {
  cursor: pointer;
  position: absolute;
  width: 60px;
  height: 60px;
  righT: 30px;
  top: 30px;
  background-color: rgba(255, 255, 255, 0.2);
  border-radius: 100%;
  background-size: 16px 16px;
  background-image: url(../img/btn_close.svg);
  background-position: center;
  background-repeat: no-repeat;
}

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.5.1
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2016 Daniel Eden
 */
.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}

.animated.infinite {
  animation-iteration-count: infinite;
}

.animated.hinge {
  animation-duration: 2s;
}

.animated.flipOutX,
.animated.flipOutY,
.animated.bounceIn,
.animated.bounceOut {
  animation-duration: 0.75s;
}
@keyframes bounce {
  from, 20%, 53%, 80%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    transform: translate3d(0, 0, 0);
  }
  40%, 43% {
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    transform: translate3d(0, -30px, 0);
  }
  70% {
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    transform: translate3d(0, -15px, 0);
  }
  90% {
    transform: translate3d(0, -4px, 0);
  }
}
.bounce {
  animation-name: bounce;
  transform-origin: center bottom;
}
@keyframes flash {
  from, 50%, to {
    opacity: 1;
  }
  25%, 75% {
    opacity: 0;
  }
}
.flash {
  animation-name: flash;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@keyframes pulse {
  from {
    transform: scale3d(1, 1, 1);
  }
  50% {
    transform: scale3d(1.05, 1.05, 1.05);
  }
  to {
    transform: scale3d(1, 1, 1);
  }
}
.pulse {
  animation-name: pulse;
}
@keyframes rubberBand {
  from {
    transform: scale3d(1, 1, 1);
  }
  30% {
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    transform: scale3d(1.05, 0.95, 1);
  }
  to {
    transform: scale3d(1, 1, 1);
  }
}
.rubberBand {
  animation-name: rubberBand;
}
@keyframes shake {
  from, to {
    transform: translate3d(0, 0, 0);
  }
  10%, 30%, 50%, 70%, 90% {
    transform: translate3d(-10px, 0, 0);
  }
  20%, 40%, 60%, 80% {
    transform: translate3d(10px, 0, 0);
  }
}
.shake {
  animation-name: shake;
}
@keyframes headShake {
  0% {
    transform: translateX(0);
  }
  6.5% {
    transform: translateX(-6px) rotateY(-9deg);
  }
  18.5% {
    transform: translateX(5px) rotateY(7deg);
  }
  31.5% {
    transform: translateX(-3px) rotateY(-5deg);
  }
  43.5% {
    transform: translateX(2px) rotateY(3deg);
  }
  50% {
    transform: translateX(0);
  }
}
.headShake {
  animation-timing-function: ease-in-out;
  animation-name: headShake;
}
@keyframes swing {
  20% {
    transform: rotate3d(0, 0, 1, 15deg);
  }
  40% {
    transform: rotate3d(0, 0, 1, -10deg);
  }
  60% {
    transform: rotate3d(0, 0, 1, 5deg);
  }
  80% {
    transform: rotate3d(0, 0, 1, -5deg);
  }
  to {
    transform: rotate3d(0, 0, 1, 0deg);
  }
}
.swing {
  transform-origin: top center;
  animation-name: swing;
}
@keyframes tada {
  from {
    transform: scale3d(1, 1, 1);
  }
  10%, 20% {
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }
  30%, 50%, 70%, 90% {
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }
  40%, 60%, 80% {
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }
  to {
    transform: scale3d(1, 1, 1);
  }
}
.tada {
  animation-name: tada;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@keyframes wobble {
  from {
    transform: none;
  }
  15% {
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }
  30% {
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }
  45% {
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }
  60% {
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }
  75% {
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }
  to {
    transform: none;
  }
}
.wobble {
  animation-name: wobble;
}
@keyframes jello {
  from, 11.1%, to {
    transform: none;
  }
  22.2% {
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }
  33.3% {
    transform: skewX(6.25deg) skewY(6.25deg);
  }
  44.4% {
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }
  55.5% {
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }
  66.6% {
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }
  77.7% {
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }
  88.8% {
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}
.jello {
  animation-name: jello;
  transform-origin: center;
}
@keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  20% {
    transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
    transform: scale3d(0.9, 0.9, 0.9);
  }
  60% {
    opacity: 1;
    transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
    transform: scale3d(0.97, 0.97, 0.97);
  }
  to {
    opacity: 1;
    transform: scale3d(1, 1, 1);
  }
}
.bounceIn {
  animation-name: bounceIn;
}
@keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(0, -3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, 25px, 0);
  }
  75% {
    transform: translate3d(0, -10px, 0);
  }
  90% {
    transform: translate3d(0, 5px, 0);
  }
  to {
    transform: none;
  }
}
.bounceInDown {
  animation-name: bounceInDown;
}
@keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(-3000px, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(25px, 0, 0);
  }
  75% {
    transform: translate3d(-10px, 0, 0);
  }
  90% {
    transform: translate3d(5px, 0, 0);
  }
  to {
    transform: none;
  }
}
.bounceInLeft {
  animation-name: bounceInLeft;
}
@keyframes bounceInRight {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(3000px, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(-25px, 0, 0);
  }
  75% {
    transform: translate3d(10px, 0, 0);
  }
  90% {
    transform: translate3d(-5px, 0, 0);
  }
  to {
    transform: none;
  }
}
.bounceInRight {
  animation-name: bounceInRight;
}
@keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(0, 3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }
  75% {
    transform: translate3d(0, 10px, 0);
  }
  90% {
    transform: translate3d(0, -5px, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
.bounceInUp {
  animation-name: bounceInUp;
}
@keyframes bounceOut {
  20% {
    transform: scale3d(0.9, 0.9, 0.9);
  }
  50%, 55% {
    opacity: 1;
    transform: scale3d(1.1, 1.1, 1.1);
  }
  to {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
}
.bounceOut {
  animation-name: bounceOut;
}
@keyframes bounceOutDown {
  20% {
    transform: translate3d(0, 10px, 0);
  }
  40%, 45% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }
}
.bounceOutDown {
  animation-name: bounceOutDown;
}
@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    transform: translate3d(20px, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(-2000px, 0, 0);
  }
}
.bounceOutLeft {
  animation-name: bounceOutLeft;
}
@keyframes bounceOutRight {
  20% {
    opacity: 1;
    transform: translate3d(-20px, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }
}
.bounceOutRight {
  animation-name: bounceOutRight;
}
@keyframes bounceOutUp {
  20% {
    transform: translate3d(0, -10px, 0);
  }
  40%, 45% {
    opacity: 1;
    transform: translate3d(0, 20px, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }
}
.bounceOutUp {
  animation-name: bounceOutUp;
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fadeIn {
  animation-name: fadeIn;
}
@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fadeInDown {
  animation-name: fadeInDown;
}
@keyframes fadeInDownBig {
  from {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fadeInDownBig {
  animation-name: fadeInDownBig;
}
@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translate3d(-100%, 0, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fadeInLeft {
  animation-name: fadeInLeft;
}
@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    transform: translate3d(-2000px, 0, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fadeInLeftBig {
  animation-name: fadeInLeftBig;
}
@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fadeInRight {
  animation-name: fadeInRight;
}
@keyframes fadeInRightBig {
  from {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fadeInRightBig {
  animation-name: fadeInRightBig;
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 30%, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fadeInUp {
  animation-name: fadeInUp;
}
@keyframes fadeInUpBig {
  from {
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fadeInUpBig {
  animation-name: fadeInUpBig;
}
@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
.fadeOut {
  animation-name: fadeOut;
}
@keyframes fadeOutDown {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }
}
.fadeOutDown {
  animation-name: fadeOutDown;
}
@keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }
}
.fadeOutDownBig {
  animation-name: fadeOutDownBig;
}
@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translate3d(-100%, 0, 0);
  }
}
.fadeOutLeft {
  animation-name: fadeOutLeft;
}
@keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translate3d(-2000px, 0, 0);
  }
}
.fadeOutLeftBig {
  animation-name: fadeOutLeftBig;
}
@keyframes fadeOutRight {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translate3d(100%, 0, 0);
  }
}
.fadeOutRight {
  animation-name: fadeOutRight;
}
@keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }
}
.fadeOutRightBig {
  animation-name: fadeOutRightBig;
}
@keyframes fadeOutUp {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }
}
.fadeOutUp {
  animation-name: fadeOutUp;
}
@keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }
}
.fadeOutUpBig {
  animation-name: fadeOutUpBig;
}
@keyframes flip {
  from {
    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    animation-timing-function: ease-out;
  }
  40% {
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    animation-timing-function: ease-out;
  }
  50% {
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    animation-timing-function: ease-in;
  }
  80% {
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    animation-timing-function: ease-in;
  }
  to {
    transform: perspective(400px);
    animation-timing-function: ease-in;
  }
}
.animated.flip {
  backface-visibility: visible;
  animation-name: flip;
}
@keyframes flipInX {
  from {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    animation-timing-function: ease-in;
  }
  60% {
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  to {
    transform: perspective(400px);
  }
}
.flipInX {
  backface-visibility: visible !important;
  animation-name: flipInX;
}
@keyframes flipInY {
  from {
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    animation-timing-function: ease-in;
  }
  60% {
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }
  80% {
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }
  to {
    transform: perspective(400px);
  }
}
.flipInY {
  backface-visibility: visible !important;
  animation-name: flipInY;
}
@keyframes flipOutX {
  from {
    transform: perspective(400px);
  }
  30% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }
  to {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}
.flipOutX {
  animation-name: flipOutX;
  backface-visibility: visible !important;
}
@keyframes flipOutY {
  from {
    transform: perspective(400px);
  }
  30% {
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }
  to {
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}
.flipOutY {
  backface-visibility: visible !important;
  animation-name: flipOutY;
}
@keyframes lightSpeedIn {
  from {
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }
  60% {
    transform: skewX(20deg);
    opacity: 1;
  }
  80% {
    transform: skewX(-5deg);
    opacity: 1;
  }
  to {
    transform: none;
    opacity: 1;
  }
}
.lightSpeedIn {
  animation-name: lightSpeedIn;
  animation-timing-function: ease-out;
}
@keyframes lightSpeedOut {
  from {
    opacity: 1;
  }
  to {
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}
.lightSpeedOut {
  animation-name: lightSpeedOut;
  animation-timing-function: ease-in;
}
@keyframes rotateIn {
  from {
    transform-origin: center;
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }
  to {
    transform-origin: center;
    transform: none;
    opacity: 1;
  }
}
.rotateIn {
  animation-name: rotateIn;
}
@keyframes rotateInDownLeft {
  from {
    transform-origin: left bottom;
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
  to {
    transform-origin: left bottom;
    transform: none;
    opacity: 1;
  }
}
.rotateInDownLeft {
  animation-name: rotateInDownLeft;
}
@keyframes rotateInDownRight {
  from {
    transform-origin: right bottom;
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  to {
    transform-origin: right bottom;
    transform: none;
    opacity: 1;
  }
}
.rotateInDownRight {
  animation-name: rotateInDownRight;
}
@keyframes rotateInUpLeft {
  from {
    transform-origin: left bottom;
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  to {
    transform-origin: left bottom;
    transform: none;
    opacity: 1;
  }
}
.rotateInUpLeft {
  animation-name: rotateInUpLeft;
}
@keyframes rotateInUpRight {
  from {
    transform-origin: right bottom;
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }
  to {
    transform-origin: right bottom;
    transform: none;
    opacity: 1;
  }
}
.rotateInUpRight {
  animation-name: rotateInUpRight;
}
@keyframes rotateOut {
  from {
    transform-origin: center;
    opacity: 1;
  }
  to {
    transform-origin: center;
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}
.rotateOut {
  animation-name: rotateOut;
}
@keyframes rotateOutDownLeft {
  from {
    transform-origin: left bottom;
    opacity: 1;
  }
  to {
    transform-origin: left bottom;
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}
.rotateOutDownLeft {
  animation-name: rotateOutDownLeft;
}
@keyframes rotateOutDownRight {
  from {
    transform-origin: right bottom;
    opacity: 1;
  }
  to {
    transform-origin: right bottom;
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}
.rotateOutDownRight {
  animation-name: rotateOutDownRight;
}
@keyframes rotateOutUpLeft {
  from {
    transform-origin: left bottom;
    opacity: 1;
  }
  to {
    transform-origin: left bottom;
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}
.rotateOutUpLeft {
  animation-name: rotateOutUpLeft;
}
@keyframes rotateOutUpRight {
  from {
    transform-origin: right bottom;
    opacity: 1;
  }
  to {
    transform-origin: right bottom;
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}
.rotateOutUpRight {
  animation-name: rotateOutUpRight;
}
@keyframes hinge {
  0% {
    transform-origin: top left;
    animation-timing-function: ease-in-out;
  }
  20%, 60% {
    transform: rotate3d(0, 0, 1, 80deg);
    transform-origin: top left;
    animation-timing-function: ease-in-out;
  }
  40%, 80% {
    transform: rotate3d(0, 0, 1, 60deg);
    transform-origin: top left;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }
  to {
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}
.hinge {
  animation-name: hinge;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@keyframes rollIn {
  from {
    opacity: 0;
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.rollIn {
  animation-name: rollIn;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@keyframes rollOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}
.rollOut {
  animation-name: rollOut;
}
@keyframes zoomIn {
  from {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}
.zoomIn {
  animation-name: zoomIn;
}
@keyframes zoomInDown {
  from {
    opacity: 0;
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.zoomInDown {
  animation-name: zoomInDown;
}
@keyframes zoomInLeft {
  from {
    opacity: 0;
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.zoomInLeft {
  animation-name: zoomInLeft;
}
@keyframes zoomInRight {
  from {
    opacity: 0;
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.zoomInRight {
  animation-name: zoomInRight;
}
@keyframes zoomInUp {
  from {
    opacity: 0;
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.zoomInUp {
  animation-name: zoomInUp;
}
@keyframes zoomOut {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 0;
  }
}
.zoomOut {
  animation-name: zoomOut;
}
@keyframes zoomOutDown {
  40% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  to {
    opacity: 0;
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform-origin: center bottom;
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.zoomOutDown {
  animation-name: zoomOutDown;
}
@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }
  to {
    opacity: 0;
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform-origin: left center;
  }
}
.zoomOutLeft {
  animation-name: zoomOutLeft;
}
@keyframes zoomOutRight {
  40% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }
  to {
    opacity: 0;
    transform: scale(0.1) translate3d(2000px, 0, 0);
    transform-origin: right center;
  }
}
.zoomOutRight {
  animation-name: zoomOutRight;
}
@keyframes zoomOutUp {
  40% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  to {
    opacity: 0;
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform-origin: center bottom;
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.zoomOutUp {
  animation-name: zoomOutUp;
}
@keyframes slideInDown {
  from {
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
.slideInDown {
  animation-name: slideInDown;
}
@keyframes slideInLeft {
  from {
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
.slideInLeft {
  animation-name: slideInLeft;
}
@keyframes slideInRight {
  from {
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
.slideInRight {
  animation-name: slideInRight;
}
@keyframes slideInUp {
  from {
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
.slideInUp {
  animation-name: slideInUp;
}
@keyframes slideOutDown {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, 100%, 0);
  }
}
.slideOutDown {
  animation-name: slideOutDown;
}
@keyframes slideOutLeft {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(-100%, 0, 0);
  }
}
.slideOutLeft {
  animation-name: slideOutLeft;
}
@keyframes slideOutRight {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(100%, 0, 0);
  }
}
.slideOutRight {
  animation-name: slideOutRight;
}
@keyframes slideOutUp {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, -100%, 0);
  }
}
.slideOutUp {
  animation-name: slideOutUp;
}

/*! PhotoSwipe Default UI CSS by Dmitry Semenov | photoswipe.com | MIT license */
/*

	Contents:

	1. Buttons
	2. Share modal and links
	3. Index indicator ("1 of X" counter)
	4. Caption
	5. Loading indicator
	6. Additional styles (root element, top bar, idle state, hidden state, etc.)

*/
/*

	1. Buttons

 */
/* <button> css reset */
.pswp__button {
  width: 44px;
  height: 44px;
  position: relative;
  background: none;
  cursor: pointer;
  overflow: visible;
  -webkit-appearance: none;
  display: block;
  border: 0;
  padding: 0;
  margin: 0;
  float: right;
  opacity: 0.75;
  transition: opacity 0.2s;
  box-shadow: none;
}

.pswp__button:focus,
.pswp__button:hover {
  opacity: 1;
}

.pswp__button:active {
  outline: none;
  opacity: 0.9;
}

.pswp__button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

/* pswp__ui--over-close class it added when mouse is over element that should close gallery */
.pswp__ui--over-close .pswp__button--close {
  opacity: 1;
}

.pswp__button,
.pswp__button--arrow--left:before,
.pswp__button--arrow--right:before {
  width: 44px;
  height: 44px;
}

.pswp__button--close {
  background-image: url(../img/btn_close.svg);
  background-size: cover;
  width: 30px;
  height: 30px;
}

.pswp__button--share {
  background-position: -44px -44px;
}

.pswp__button--fs {
  display: none;
  background-image: url(../img/header/icon_suche_weiss.svg);
  background-size: cover;
  width: 32px;
  height: 28px;
  margin-right: 20px;
}

.pswp--supports-fs .pswp__button--fs {
  display: block;
}

.pswp--fs .pswp__button--fs {
  background-position: -44px 0;
}

.pswp__button--zoom {
  display: none;
  background-image: url(../img/arrow-slider-left.png);
  background-size: cover;
  width: 45px;
  height: 45px;
}

.pswp--zoom-allowed .pswp__button--zoom {
  display: block;
}

.pswp--zoomed-in .pswp__button--zoom {
  background-position: -132px 0;
}

/* no arrows on touch screens */
.pswp--touch .pswp__button--arrow--left,
.pswp--touch .pswp__button--arrow--right {
  visibility: hidden;
}

/*
	Arrow buttons hit area
	(icon is added to :before pseudo-element)
*/
.pswp__button--arrow--left,
.pswp__button--arrow--right {
  background: transparent;
  top: 50%;
  margin-top: -50px;
  width: 70px;
  height: 100px;
  position: absolute;
  cursor: pointer;
}

.pswp__button--arrow--left {
  left: 0;
}

.pswp__button--arrow--right {
  right: 0;
}

.pswp__button--arrow--left:before,
.pswp__button--arrow--right:before {
  content: "";
  top: 35px;
  height: 45px;
  width: 45px;
  position: absolute;
}

.pswp__button--arrow--left:before {
  left: 6px;
  background-image: url(../img/arrow-slider-left.png);
  background-size: cover;
  width: 45px;
  height: 45px;
}

.pswp__button--arrow--right:before {
  right: 6px;
  background-image: url(../img/arrow-slider-right.png);
  background-size: cover;
  width: 45px;
  height: 45px;
}

/*

	2. Share modal/popup and links

 */
.pswp__counter,
.pswp__share-modal {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.pswp__share-modal {
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  padding: 10px;
  position: absolute;
  z-index: 1600;
  opacity: 0;
  transition: opacity 0.25s ease-out;
  -webkit-backface-visibility: hidden;
  will-change: opacity;
}

.pswp__share-modal--hidden {
  display: none;
}

.pswp__share-tooltip {
  z-index: 1620;
  position: absolute;
  background: #FFF;
  top: 56px;
  border-radius: 2px;
  display: block;
  width: auto;
  right: 44px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
  transform: translateY(6px);
  transition: transform 0.25s;
  -webkit-backface-visibility: hidden;
  will-change: transform;
}

.pswp__share-tooltip a {
  display: block;
  padding: 8px 12px;
  color: #000;
  text-decoration: none;
  font-size: 14px;
  line-height: 18px;
}

.pswp__share-tooltip a:hover {
  text-decoration: none;
  color: #000;
}

.pswp__share-tooltip a:first-child {
  /* round corners on the first/last list item */
  border-radius: 2px 2px 0 0;
}

.pswp__share-tooltip a:last-child {
  border-radius: 0 0 2px 2px;
}

.pswp__share-modal--fade-in {
  opacity: 1;
}

.pswp__share-modal--fade-in .pswp__share-tooltip {
  transform: translateY(0);
}

/* increase size of share links on touch devices */
.pswp--touch .pswp__share-tooltip a {
  padding: 16px 12px;
}

a.pswp__share--facebook:before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  top: -12px;
  right: 15px;
  border: 6px solid transparent;
  border-bottom-color: #FFF;
  -webkit-pointer-events: none;
  -moz-pointer-events: none;
  pointer-events: none;
}

a.pswp__share--facebook:hover {
  background: #3E5C9A;
  color: #FFF;
}

a.pswp__share--facebook:hover:before {
  border-bottom-color: #3E5C9A;
}

a.pswp__share--twitter:hover {
  background: #55ACEE;
  color: #FFF;
}

a.pswp__share--pinterest:hover {
  background: #CCC;
  color: #CE272D;
}

a.pswp__share--download:hover {
  background: #DDD;
}

/*

	3. Index indicator ("1 of X" counter)

 */
.pswp__counter {
  position: absolute;
  left: 0;
  top: 0;
  height: 44px;
  font-size: 13px;
  line-height: 44px;
  color: #FFF;
  opacity: 0.75;
  padding: 0 10px;
}

/*

	4. Caption

 */
.pswp__caption {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  min-height: 44px;
}

.pswp__caption small {
  font-size: 11px;
  color: #BBB;
}

.pswp__caption__center {
  text-align: left;
  max-width: 420px;
  margin: 0 auto;
  font-size: 13px;
  padding: 10px;
  line-height: 20px;
  color: #CCC;
}

.pswp__caption--empty {
  display: none;
}

/* Fake caption element, used to calculate height of next/prev image */
.pswp__caption--fake {
  visibility: hidden;
}

/*

	5. Loading indicator (preloader)

	You can play with it here - http://codepen.io/dimsemenov/pen/yyBWoR

 */
.pswp__preloader {
  width: 44px;
  height: 44px;
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -22px;
  opacity: 0;
  transition: opacity 0.25s ease-out;
  will-change: opacity;
  direction: ltr;
}

.pswp__preloader__icn {
  width: 20px;
  height: 20px;
  margin: 12px;
}

.pswp__preloader--active {
  opacity: 1;
}

.pswp__preloader--active .pswp__preloader__icn {
  /* We use .gif in browsers that don't support CSS animation */
  background: url(preloader.gif) 0 0 no-repeat;
}

.pswp--css_animation .pswp__preloader--active {
  opacity: 1;
}

.pswp--css_animation .pswp__preloader--active .pswp__preloader__icn {
  animation: clockwise 500ms linear infinite;
}

.pswp--css_animation .pswp__preloader--active .pswp__preloader__donut {
  animation: donut-rotate 1000ms cubic-bezier(0.4, 0, 0.22, 1) infinite;
}

.pswp--css_animation .pswp__preloader__icn {
  background: none;
  opacity: 0.75;
  width: 14px;
  height: 14px;
  position: absolute;
  left: 15px;
  top: 15px;
  margin: 0;
}

.pswp--css_animation .pswp__preloader__cut {
  /*
            The idea of animating inner circle is based on Polymer ("material") loading indicator
             by Keanu Lee https://blog.keanulee.com/2014/10/20/the-tale-of-three-spinners.html
        */
  position: relative;
  width: 7px;
  height: 14px;
  overflow: hidden;
}

.pswp--css_animation .pswp__preloader__donut {
  box-sizing: border-box;
  width: 14px;
  height: 14px;
  border: 2px solid #FFF;
  border-radius: 50%;
  border-left-color: transparent;
  border-bottom-color: transparent;
  position: absolute;
  top: 0;
  left: 0;
  background: none;
  margin: 0;
}

@media screen and (max-width: 1024px) {
  .pswp__preloader {
    position: relative;
    left: auto;
    top: auto;
    margin: 0;
    float: right;
  }
}
@keyframes clockwise {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes donut-rotate {
  0% {
    transform: rotate(0);
  }
  50% {
    transform: rotate(-140deg);
  }
  100% {
    transform: rotate(0);
  }
}
/*

	6. Additional styles

 */
/* root element of UI */
.pswp__ui {
  -webkit-font-smoothing: auto;
  visibility: visible;
  opacity: 1;
  z-index: 1550;
}

/* top black bar with buttons and "1 of X" indicator */
.pswp__top-bar {
  position: absolute;
  left: 0;
  top: 0;
  padding: 30px;
  width: 100%;
}

.pswp__caption,
.pswp__top-bar,
.pswp--has_mouse .pswp__button--arrow--left,
.pswp--has_mouse .pswp__button--arrow--right {
  -webkit-backface-visibility: hidden;
  will-change: opacity;
  transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
}

/* pswp--has_mouse class is added only when two subsequent mousemove events occur */
.pswp--has_mouse .pswp__button--arrow--left,
.pswp--has_mouse .pswp__button--arrow--right {
  visibility: visible;
}

.pswp__top-bar,
.pswp__caption {
  /*background-color: rgba(0, 0, 0, 0.5);*/
}

/* pswp__ui--fit class is added when main image "fits" between top bar and bottom bar (caption) */
.pswp__ui--fit .pswp__top-bar,
.pswp__ui--fit .pswp__caption {
  /*background-color: rgba(0, 0, 0, 0.3);*/
}

/* pswp__ui--idle class is added when mouse isn't moving for several seconds (JS option timeToIdle) */
.pswp__ui--idle .pswp__top-bar {
  opacity: 0;
}

.pswp__ui--idle .pswp__button--arrow--left,
.pswp__ui--idle .pswp__button--arrow--right {
  opacity: 0;
}

/*
	pswp__ui--hidden class is added when controls are hidden
	e.g. when user taps to toggle visibility of controls
*/
.pswp__ui--hidden .pswp__top-bar,
.pswp__ui--hidden .pswp__caption,
.pswp__ui--hidden .pswp__button--arrow--left,
.pswp__ui--hidden .pswp__button--arrow--right {
  /* Force paint & create composition layer for controls. */
  opacity: 0.001;
}

/* pswp__ui--one-slide class is added when there is just one item in gallery */
.pswp__ui--one-slide .pswp__button--arrow--left,
.pswp__ui--one-slide .pswp__button--arrow--right,
.pswp__ui--one-slide .pswp__counter {
  display: none;
}

.pswp__element--disabled {
  display: none !important;
}

.pswp--minimal--dark .pswp__top-bar {
  background: none;
}

.has-error {
  background-color: rgba(255, 0, 0, 0.1) !important;
}

.card_content_teaser {
  display: block;
  position: relative;
  cursor: pointer;
  text-decoration: none;
}
@media screen and (max-width: 991px) {
  .card_content_teaser {
    margin-bottom: 30px;
  }
}
.card_content_teaser:hover .img-holder {
  transform: scale(1.4);
  filter: brightness(50%);
}
.card_content_teaser .image {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.card_content_teaser .image:before {
  content: "";
  display: block;
  padding-top: 100%; /* initial ratio of 1:1*/
}
.card_content_teaser .image .img-holder {
  transition: 0.5s;
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
}
.card_content_teaser .image .overlay {
  position: absolute;
  left: 0px;
  top: 30%;
  width: 100%;
  height: 70%;
  background-image: linear-gradient(-180deg, rgba(148, 148, 148, 0) 11%, #000000 100%);
}
.card_content_teaser .channel {
  position: absolute;
  right: 20px;
  top: 20px;
  padding: 10px;
  z-index: 2;
  background-color: rgba(0, 0, 0, 0.3);
  color: white;
  text-transform: uppercase;
  text-decoration: none;
  height: 30px;
}
.card_content_teaser .headline {
  position: absolute;
  left: 20px;
  bottom: 15px;
  z-index: 2;
  color: #ffffff;
}
.card_content_teaser .subheadline {
  position: absolute;
  left: 20px;
  bottom: 67px;
  color: #69be28;
  z-index: 2;
}
.card_content_teaser .text {
  position: relative;
  width: 100%;
  padding: 25px 20px 25px 20px;
  background-color: #ffffff;
  color: #262626;
  text-decoration: none;
}

.teaser_themen .slider_teaser {
  display: block;
  position: relative;
  cursor: pointer;
  text-decoration: none;
}
@media screen and (max-width: 991px) {
  .teaser_themen .slider_teaser {
    margin-bottom: 30px;
  }
}
.teaser_themen .slider_teaser .slick-slide {
  background-color: #ffffff;
}
.teaser_themen .slider_teaser:hover .img-holder {
  transform: scale(1.4);
  filter: brightness(50%);
}
.teaser_themen .slider_teaser .image {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.teaser_themen .slider_teaser .image:before {
  content: "";
  display: block;
  padding-top: 100%; /* initial ratio of 1:1*/
}
.teaser_themen .slider_teaser .image .img-holder {
  transition: 0.5s;
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
}
.teaser_themen .slider_teaser .image .overlay {
  position: absolute;
  left: 0px;
  top: 30%;
  width: 100%;
  height: 70%;
  background-image: linear-gradient(-180deg, rgba(148, 148, 148, 0) 11%, #000000 100%);
}
.teaser_themen .slider_teaser .contentbereich {
  padding: 40px;
}
.teaser_themen .slider_teaser .channel {
  position: relative;
  right: 20px;
  top: 20px;
  padding: 10px;
  z-index: 2;
  background-color: rgba(0, 0, 0, 0.3);
  color: white;
  text-transform: uppercase;
  text-decoration: none;
  height: 30px;
}
.teaser_themen .slider_teaser .headline {
  margin-top: 10px;
  position: relative;
  z-index: 2;
  color: #666666;
}
.teaser_themen .slider_teaser .subheadline {
  position: relative;
  color: #69be28;
  z-index: 2;
}
.teaser_themen .slider_teaser .text {
  position: relative;
  width: 100%;
  padding: 30px 0px 0px 0px;
  background-color: #ffffff;
  color: #262626;
  text-decoration: none;
}
.teaser_themen .slider_teaser .btn {
  margin-top: 20px;
  padding-left: 60px;
  padding-right: 60px;
}
.teaser_themen .slick-next {
  background-image: url(../img/arrow-slider-right.png);
  opacity: 0.4;
}
@media screen and (max-width: 768px) {
  .teaser_themen .slick-next {
    display: none !important;
  }
}
.teaser_themen .slick-prev {
  background-image: url(../img/arrow-slider-left.png);
  opacity: 0.4;
}
@media screen and (max-width: 768px) {
  .teaser_themen .slick-prev {
    display: none !important;
  }
}

.card_content_without_background .btn {
  display: block;
}
.card_content_without_background h2.h1b {
  color: #ffffff;
}
.card_content_without_background p {
  color: #ffffff;
}
@media screen and (max-width: 991px) {
  .card_content_without_background p {
    margin: 20px 0px;
  }
}
@media screen and (max-width: 991px) {
  .card_content_without_background p.s1 {
    margin-top: 20px;
  }
}

.card_top_projekt {
  position: relative;
}
.card_top_projekt .image {
  position: relative;
  width: 100%;
  height: 330px;
  background-size: cover;
  background-position: center;
}
.card_top_projekt .image .overlay {
  position: absolute;
  left: 0px;
  top: 60%;
  width: 100%;
  height: 40%;
  background-image: linear-gradient(-180deg, rgba(148, 148, 148, 0) 11%, #000000 100%);
}
.card_top_projekt .channel {
  position: absolute;
  right: 20px;
  top: 20px;
  padding: 10px;
  z-index: 2;
  background-color: rgba(0, 0, 0, 0.3);
  color: white;
  text-transform: uppercase;
  height: 30px;
}
.card_top_projekt .headline {
  position: absolute;
  left: 20px;
  bottom: 15px;
  z-index: 2;
  color: #ffffff;
}
@media screen and (max-width: 768px) {
  .card_top_projekt .headline {
    bottom: 65px;
  }
}
.card_top_projekt .tab-container {
  position: relative;
  margin-top: -70px;
  background: none;
}
@media screen and (max-width: 768px) {
  .card_top_projekt .tab-container {
    margin-bottom: 60px;
  }
}
.card_top_projekt .tab-container .tabs {
  position: relative;
  height: 70px;
  margin-right: 20px;
}
@media screen and (max-width: 768px) {
  .card_top_projekt .tab-container .tabs {
    margin-right: 10px;
  }
}
.card_top_projekt .tab-container .tabs .tab {
  float: right;
  padding: 30px 15px;
  cursor: pointer;
  transition: 0.5s;
  background-position: 50% 115%;
  background-repeat: no-repeat;
}
@media screen and (max-width: 768px) {
  .card_top_projekt .tab-container .tabs .tab {
    padding: 30px 10px;
  }
}
.card_top_projekt .tab-container .tabs .tab.active {
  color: #69be28;
  background-image: url(../img/arrow-active-marker.png);
}
.card_top_projekt .tab-container .tabs .tab:hover {
  color: #69be28;
}
.card_top_projekt .tab-container .tabs-content {
  position: relative;
  height: 150px;
}
@media screen and (max-width: 768px) {
  .card_top_projekt .tab-container .tabs-content {
    height: 250px;
  }
}
.card_top_projekt .tab-container .tabs-content .icon-options {
  display: none;
  position: absolute;
  z-index: 2;
  right: 30px;
  top: 30px;
  background-image: url(../img/account/icon_options.svg);
  background-size: cover;
  background-position: center;
  widtH: 4px;
  height: 20px;
  cursor: pointer;
}
.card_top_projekt .tab-container .tabs-content .tab {
  text-align: left;
  position: absolute;
  background-color: #ffffff;
  lefT: 0px;
  top: 0px;
  padding-left: 40px;
  padding-righT: 40px;
  display: block;
  padding-bottom: 30px;
  width: 100%;
}
@media screen and (max-width: 991px) {
  .card_top_projekt .tab-container .tabs-content .tab {
    padding-top: 40px;
  }
}
.card_top_projekt .tab-container .tabs-content .tab ~ .tab {
  display: none;
}
.card_top_projekt .tab-container .tabs-content .tab .icon {
  position: relative;
  float: left;
  margin-right: 40px;
}
@media screen and (max-width: 768px) {
  .card_top_projekt .tab-container .tabs-content .tab .icon {
    float: none;
    margin: 30px auto;
  }
}
.card_top_projekt .tab-container .tabs-content .tab p {
  text-align: left;
}

.element_searchfield_global {
  position: relative;
  margin-top: 60px;
}
.element_searchfield_global .tab-container {
  position: relative;
  margin-top: -70px;
  background: none;
}
.element_searchfield_global .tab-container .tabs {
  position: relative;
  height: 70px;
  margin-right: 20px;
}
.element_searchfield_global .tab-container .tabs .tab {
  float: left;
  padding: 30px 15px;
  cursor: pointer;
  transition: 0.5s;
  background-position: 50% 115%;
  background-repeat: no-repeat;
}
.element_searchfield_global .tab-container .tabs .tab.active {
  color: #69be28;
  background-image: url(../img/arrow-active-marker.png);
}
.element_searchfield_global .tab-container .tabs .tab:hover {
  color: #69be28;
}
.element_searchfield_global .tab-container .tabs-content {
  position: relative;
  height: 60px;
  background-color: #ffffff;
  border-radius: 2px;
}
.element_searchfield_global .tab-container .tabs-content .icon-options {
  positon: absolute;
  right: 30px;
  top: 30px;
}
.element_searchfield_global .tab-container .tabs-content .tab {
  text-align: left;
  position: absolute;
  background-color: #ffffff;
  lefT: 0px;
  top: 0px;
  height: 60px;
  widtH: 100%;
  border-radius: 2px;
  display: block;
}
.element_searchfield_global .tab-container .tabs-content .tab ~ .tab {
  display: none;
}
.element_searchfield_global .tab-container .tabs-content .tab form {
  widtH: 100%;
  height: 70px;
}
.element_searchfield_global .tab-container .tabs-content .tab form input {
  border: none;
}
.element_searchfield_global .tab-container .tabs-content .tab form input:focus {
  outline: none;
}
.element_searchfield_global .tab-container .tabs-content .tab form input[type=text] {
  padding: 20px 0px 15px 15px;
  margin: 0;
  width: 60%;
}
@media screen and (max-width: 768px) {
  .element_searchfield_global .tab-container .tabs-content .tab form input[type=text] {
    width: 55%;
  }
}
.element_searchfield_global .tab-container .tabs-content .tab form input[type=submit] {
  float: right;
  height: 60px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
  padding: 10px 30px;
}
.element_searchfield_global .tab-container .tabs-content .tab a {
  display: block;
  text-align: center;
  position: absolute;
  bottom: -40px;
  left: 0px;
  width: 100%;
}

.modal-dialog {
  display: none;
  margin-top: 0px;
  margin-bottom: 0px;
  margin: 0px;
  padding: 0;
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100vh;
  background-color: #ffffff;
  z-index: 1000000;
  overflow: scroll;
}
.modal-dialog .icon-close {
  position: absolute;
  right: 40px;
  top: 40px;
  background-image: url(../img/konfigurator/btn_close.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
  width: 25px;
  height: 25px;
}
.modal-dialog .icon-close.icon-white {
  top: 33px;
  background-image: url(../img/btn_close.svg);
}
.modal-dialog .icon-back {
  position: absolute;
  left: 20px;
  top: 20px;
  background-image: url(../img/konfigurator/btn_back.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
  width: 20px;
  height: 20px;
}
.modal-dialog .icon-back.icon-white {
  top: 20px;
  background-image: url(../img/btn_back.svg);
}
.modal-dialog .container {
  margin-top: 25vh;
  margin-bottom: 25vh;
}
.modal-dialog.menge-nicht-verfuegbar-danke {
  text-align: center;
}
.modal-dialog.streckenanfrage-step .header {
  padding-left: 30px;
}
.modal-dialog.streckenanfrage-step .container {
  margin-top: 0;
  margin-bottom: 0;
}
.modal-dialog.streckenanfrage-step .circle {
  position: relative;
  width: 100%;
  padding-bottom: 100%;
  border-radius: 50%;
  background-color: #ffffff;
}
.modal-dialog.streckenanfrage-step .circle .icon {
  position: absolute;
  lefT: 50%;
  top: 50%;
  margin-top: -32px;
  margin-left: -32px;
}
.modal-dialog.streckenanfrage-step .text {
  position: relative;
  left: 0px;
  height: 140px;
  line-height: 140px;
}
.modal-dialog.streckenanfrage-step .text .text-inner {
  display: inline-block;
  vertical-align: middle;
  line-height: 13px;
}
.modal-dialog.registrierung-step .header {
  padding-left: 30px;
  padding-top: 0px;
}
.modal-dialog.registrierung-step .header h2 {
  margin-top: 40px;
}
.modal-dialog.registrierung-step .container {
  margin-top: 0;
  margin-bottom: 0;
}
.modal-dialog.registrierung-step .circle {
  position: relative;
  width: 100%;
  padding-bottom: 100%;
  border-radius: 50%;
  background-color: #ffffff;
}
.modal-dialog.registrierung-step .circle .icon {
  position: absolute;
  lefT: 50%;
  top: 50%;
  margin-top: -32px;
  margin-left: -32px;
}
.modal-dialog.registrierung-step .text {
  position: relative;
  left: 0px;
  height: 140px;
  line-height: 140px;
}
.modal-dialog.registrierung-step .text .text-inner {
  display: inline-block;
  vertical-align: middle;
  line-height: 13px;
}
.modal-dialog.passwort-vergessen p.telefonkontakt, .modal-dialog.passwort-vergessen-sent p.telefonkontakt {
  line-height: 0px;
  width: 220px;
  margin: 0 auto;
}
.modal-dialog.passwort-vergessen p.telefonkontakt img, .modal-dialog.passwort-vergessen-sent p.telefonkontakt img {
  float: left;
  margin-right: 10px;
}
.modal-dialog.passwort-vergessen p.telefonkontakt .s2, .modal-dialog.passwort-vergessen-sent p.telefonkontakt .s2 {
  line-height: 10px;
}
.modal-dialog.passwort-vergessen p.telefonkontakt .h4, .modal-dialog.passwort-vergessen-sent p.telefonkontakt .h4 {
  line-height: 40px;
}
.modal-dialog.anfrage .bordered-row {
  height: 1px;
  background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 5px 2px;
  background-repeat: repeat-x;
}
.modal-dialog.anfrage .druckerei .profilbild {
  width: 64px;
  heighT: 64px;
  border-radius: 32px;
  float: left;
}
.modal-dialog.anfrage .druckerei .text {
  margin-left: 100px;
}
.modal-dialog.anfrage .druckerei h5, .modal-dialog.anfrage .druckerei p {
  margin: 10px 0px;
}
.modal-dialog.anfrage .radio-row {
  padding: 30px 30px 20px 30px;
  border: 1px solid #cccccc;
  border-radius: 2px;
  background-color: #f5f5f5;
}
.modal-dialog.anfrage .radio-row .meta-checkbox {
  background-color: #ffffff;
  margin-right: 30px;
  vertical-align: top;
  margin-top: 20px;
}

.element-card-product {
  position: relative;
  background-color: #ffffff;
  color: #262626;
  padding: 50px 10px 0px 10px;
  text-align: center;
  margin-bottom: 30px;
  cursor: pointer;
  min-height: 200px;
  line-height: 100px;
}
@media screen and (max-width: 768px) {
  .element-card-product {
    padding: 50px 10px 0px 10px;
  }
}
.element-card-product .icon {
  position: relative;
  margin: 0px auto 10px auto;
}
.element-card-product .icon-info {
  position: absolute;
  right: 15px;
  top: 15px;
  widtH: 17px;
  height: 17px;
  background-image: url(../img/konfigurator/icon_info.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
}
.element-card-product .text {
  display: inline-block;
  vertical-align: middle;
  line-height: 13px;
}
.element-card-product p {
  line-height: 20px;
}
.element-card-product .s1 {
  margin-top: 20px;
}
@media screen and (max-width: 768px) {
  .element-card-product .icon {
    position: relative;
    margin: 0px auto 10px auto;
    width: 45px;
    height: 45px;
  }
  .element-card-product p {
    font-size: 14px;
    line-height: 16px;
  }
}

.element-card-format,
.element-card-default {
  position: relative;
  background-color: #ffffff;
  color: #262626;
  padding: 50px 50px 0px 50px;
  text-align: center;
  margin-bottom: 30px;
  cursor: pointer;
  min-height: 200px;
  line-height: 100px;
}
@media screen and (max-width: 768px) {
  .element-card-format,
  .element-card-default {
    padding: 50px 10px 0px 10px;
  }
}
.element-card-format .icon,
.element-card-default .icon {
  position: relative;
  margin: 0px auto 10px auto;
}
.element-card-format .icon-info,
.element-card-default .icon-info {
  position: absolute;
  right: 15px;
  top: 15px;
  widtH: 17px;
  height: 17px;
  background-image: url(../img/konfigurator/icon_info.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
}
.element-card-format .text,
.element-card-default .text {
  display: inline-block;
  vertical-align: middle;
  line-height: 13px;
}
.element-card-format p,
.element-card-default p {
  line-height: 20px;
}
.element-card-format .s1,
.element-card-default .s1 {
  margin-top: 20px;
}
@media screen and (max-width: 768px) {
  .element-card-format .icon,
  .element-card-default .icon {
    position: relative;
    margin: 0px auto 10px auto;
    width: 45px;
    height: 45px;
  }
  .element-card-format p,
  .element-card-default p {
    font-size: 14px;
    line-height: 16px;
  }
}

.element-card-farbe {
  position: relative;
  width: 100%;
  cursor: pointer;
  margin-bottom: 30px;
}
.element-card-farbe .icon-info {
  position: absolute;
  right: 5px;
  top: 5px;
  widtH: 17px;
  height: 17px;
  background-image: url(../img/konfigurator/icon_info.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
  z-index: 2;
}
.element-card-farbe .circle {
  width: 100%;
  padding-bottom: 100%;
  border-radius: 50%;
  bordeR: 1px solid #cccccc;
}
.element-card-farbe .circle .text {
  position: absolute;
  display: inline-block;
  left: 0px;
  top: 50%;
  width: 100%;
  height: 200px;
  margin-top: -100px;
  line-height: 200px;
}
.element-card-farbe .circle .text .text-inner {
  width: 100%;
  text-align: center;
  display: inline-block;
  vertical-align: middle;
  line-height: 13px;
  padding: 40px 10px 40px 10px;
}
.element-card-farbe .circle .text .text-inner .p1 {
  line-height: 22px;
}

.element-card-wiki {
  position: relative;
  background-color: #ffffff;
  margin-bottom: 30px;
}
.element-card-wiki .bild {
  position: relative;
  width: 100%;
  background-size: cover;
  background-position: center;
}
.element-card-wiki .bild:before {
  content: "";
  display: block;
  padding-top: 66%; /* initial ratio of 1:1*/
}
.element-card-wiki .text {
  padding: 30px 20px;
  position: relative;
  background-color: #ffffff;
}
.element-card-wiki .text .icon-options {
  position: absolute;
  z-index: 2;
  right: 20px;
  top: 20px;
  background-image: url(../img/account/icon_options.svg);
  background-size: cover;
  background-position: center;
  widtH: 4px;
  height: 20px;
  cursor: pointer;
}
.element-card-wiki .text a {
  text-decoration: none;
}
.element-card-wiki .text a .s2 {
  margin-bottom: 15px;
  color: #262626;
}
.element-card-wiki .text a h4 {
  margin-bottom: 30px;
  text-decoration: none;
  color: #262626;
}
.element-card-wiki .text .tag {
  border: 1px solid #666666;
  color: #666666;
  text-decoration: none;
  line-height: 33px;
  white-space: nowrap;
}

.element-card-projekt {
  position: relative;
  cursor: pointer;
  border-radius: 2px;
  margin-bottom: 30px;
}
.element-card-projekt:hover .img-holder {
  transform: scale(1.4);
  filter: brightness(50%);
}
.element-card-projekt .image {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.element-card-projekt .image:before {
  content: "";
  display: block;
  padding-top: 66%; /* initial ratio of 1:1*/
}
.element-card-projekt .image .img-holder {
  transition: 0.5s;
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
}
.element-card-projekt .image .overlay {
  position: absolute;
  left: 0px;
  top: 30%;
  width: 100%;
  height: 70%;
  background-image: linear-gradient(-180deg, rgba(148, 148, 148, 0) 11%, #000000 100%);
}
.element-card-projekt .text {
  padding: 30px 20px 0px 20px;
  position: relative;
  background-color: #ffffff;
}
.element-card-projekt .text .icon-options {
  position: absolute;
  z-index: 2;
  right: 20px;
  top: 20px;
  background-image: url(../img/account/icon_options.svg);
  background-size: cover;
  background-position: center;
  widtH: 4px;
  height: 20px;
  cursor: pointer;
}
.element-card-projekt .text a {
  text-decoration: none;
}
.element-card-projekt .text a .s2 {
  margin-bottom: 15px;
  color: #262626;
}
.element-card-projekt .text a h4 {
  margin-bottom: 30px;
  text-decoration: none;
  color: #262626;
}
.element-card-projekt .text .tags {
  padding-bottom: 20px;
}
.element-card-projekt .text .tags .tag {
  border: 1px solid #69be28;
  color: #69be28;
  text-decoration: none;
  white-space: nowrap;
  line-height: 33px;
}
.element-card-projekt .meta {
  background-image: linear-gradient(to right, #cccccc 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 3px 1px;
  background-repeat: repeat-x;
  background-color: #ffffff;
  padding: 15px 0px;
  text-align: center;
}
.element-card-projekt .meta img {
  margin-left: 10px;
}
.element-card-projekt .meta img .first {
  margin-left: 0px;
}

.element-card-druckerei {
  position: relative;
  cursor: pointer;
  border-radius: 2px;
  margin-bottom: 30px;
}
.element-card-druckerei:hover .img-holder {
  transform: scale(1.4);
  filter: brightness(50%);
}
.element-card-druckerei .image {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.element-card-druckerei .image:before {
  content: "";
  display: block;
  padding-top: 66%; /* initial ratio of 1:1*/
}
.element-card-druckerei .image .img-holder {
  transition: 0.5s;
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
}
.element-card-druckerei .image .overlay {
  position: absolute;
  left: 0px;
  top: 30%;
  width: 100%;
  height: 70%;
  background-image: linear-gradient(-180deg, rgba(148, 148, 148, 0) 11%, #000000 100%);
}
.element-card-druckerei .text {
  padding: 30px 20px 0px 20px;
  position: relative;
  background-color: #ffffff;
}
.element-card-druckerei .text .icon-options {
  position: absolute;
  z-index: 2;
  right: 20px;
  top: 20px;
  background-image: url(../img/account/icon_options.svg);
  background-size: cover;
  background-position: center;
  widtH: 4px;
  height: 20px;
  cursor: pointer;
}
.element-card-druckerei .text a {
  text-decoration: none;
}
.element-card-druckerei .text a .s2 {
  margin-bottom: 15px;
  color: #262626;
}
.element-card-druckerei .text a h4 {
  margin-bottom: 30px;
  text-decoration: none;
  color: #262626;
}
.element-card-druckerei .text .tags {
  padding-bottom: 20px;
}
.element-card-druckerei .text .tags .tag {
  border: 1px solid #262626;
  color: #262626;
  text-decoration: none;
  white-space: nowrap;
  line-height: 33px;
}
.element-card-druckerei .meta {
  background-image: linear-gradient(to right, #cccccc 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 3px 1px;
  background-repeat: repeat-x;
  background-color: #ffffff;
  padding: 15px 0px;
  text-align: center;
}
.element-card-druckerei .meta img {
  margin-left: 10px;
}
.element-card-druckerei .meta img .first {
  margin-left: 0px;
}

.element-switch .switch {
  width: 50%;
  float: left;
  font-family: houschka-pro-demibold, Helvetica, sans-serif;
  line-height: 17px;
  letter-spacing: 0.3px;
  padding: 17px 15px 16px 15px;
  text-align: center;
  background-image: none;
  text-decoration: none;
  color: #69be28;
  border: 1px solid #69be28;
  text-decoration: line-through;
  text-decoration: line-through;
  cursor: pointer;
}
.element-switch .switch.first {
  border-top-left-radius: 25px;
  border-bottom-left-radius: 25px;
}
.element-switch .switch.last {
  border-top-right-radius: 25px;
  border-bottom-right-radius: 25px;
}
.element-switch .switch.active {
  text-decoration: none;
  color: #ffffff;
  background-color: #69be28;
}
.element-switch.drei .switch {
  width: 33.3%;
}

.element-cta-entdecken {
  position: relative;
  padding: 30px;
  background-color: #f5f5f5;
  min-height: 160px;
}
.element-cta-entdecken .icon {
  position: relative;
  background-color: #ffffff;
  border-radius: 50%;
  width: 100px;
  height: 100px;
}
.element-cta-entdecken .icon img {
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -30%;
  margin-top: -30%;
  width: 64px;
  height: 64px;
}
.element-cta-entdecken h4 {
  padding-top: 25px;
  line-height: 30px;
}
@media screen and (max-width: 991px) {
  .element-cta-entdecken .icon {
    margin: 0 auto;
  }
  .element-cta-entdecken h4 {
    text-align: center;
  }
}
.element-cta-entdecken a {
  margin-top: 30px;
}

.overlay-background-overlays {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-color: #000000;
  opacity: 0.75;
  display: none;
  z-index: 10;
}

.overlay-anfrageliste {
  position: fixed;
  righT: 0px;
  top: 0px;
  height: 100vh;
  widtH: 320px;
  background-color: #ffffff;
  z-index: 11;
  display: none;
  overflow: scroll;
}
.overlay-anfrageliste .header {
  position: absolute;
  left: 0px;
  top: 0px;
  height: 62px;
  padding: 10px 20px;
  background-color: #ffffff;
}
.overlay-anfrageliste .header img {
  margin-right: 20px;
  cursor: pointer;
}
.overlay-anfrageliste .content {
  position: relative;
  margin-top: 62px;
  background-color: #ffffff;
  height: 100%;
}
.overlay-anfrageliste .content .druckereien {
  padding: 20px;
  background-color: #f5f5f5;
}
.overlay-anfrageliste .content .druckereien .druckerei {
  position: relative;
  background-color: #ffffff;
  margin: 0;
  padding: 20px;
  height: 110px;
  bordeR: 1px solid #e4e4e4;
}
.overlay-anfrageliste .content .druckereien .druckerei .bttn-delete {
  position: absolute;
  right: 0px;
  top: 0px;
  margin: 3px;
  display: none;
  cursor: pointer;
}
.overlay-anfrageliste .content .druckereien .druckerei .profilbild {
  width: 65px;
  heighT: 66px;
  border-radius: 33px;
  float: left;
}
.overlay-anfrageliste .content .druckereien .druckerei .text {
  margin-left: 80px;
}
.overlay-anfrageliste .content .druckereien .druckerei h5 {
  margin: 10px 10px 0px 0px;
}
.overlay-anfrageliste .content .druckereien .druckerei p {
  margin: 10px 0px;
}
.overlay-anfrageliste .content .druckereien .druckerei.leer {
  background-color: #f5f5f5;
}
.overlay-anfrageliste .content .druckereien .druckerei.leer .profilbild {
  background-image: url(../img/entdecken/icon-druckerei-anfrageliste.svg);
  border-radius: 0px;
}
.overlay-anfrageliste .content .formfield-container {
  background-color: #ffffff;
  padding: 0px 20px;
}
.overlay-anfrageliste .content .radio-row {
  padding: 30px 30px 20px 30px;
  border: 1px solid #cccccc;
  border-radius: 2px;
  background-color: #f5f5f5;
}
.overlay-anfrageliste .content .radio-row .meta-checkbox {
  background-color: #ffffff;
  margin-right: 30px;
  vertical-align: top;
  margin-top: 20px;
}
.overlay-anfrageliste .content .radio-row label {
  max-width: 60%;
}
.overlay-anfrageliste .content .btn {
  margin-left: 20px;
  width: calc(100% - 40px);
}

.overlay-filter {
  position: fixed;
  righT: 0px;
  top: 0px;
  height: 100vh;
  widtH: 320px;
  background-color: #ffffff;
  z-index: 11;
  display: none;
  overflow: scroll;
}
.overlay-filter [id*=filter-kategorie-],
.overlay-filter #filter-zertifizerungen {
  display: none;
}
.overlay-filter .header {
  position: absolute;
  left: 0px;
  top: 0px;
  height: 62px;
  width: 100%;
  padding: 10px 20px;
  background-color: #ffffff;
}
.overlay-filter .header h2 {
  font-size: 16px;
}
.overlay-filter .header h2 img {
  margin-right: 15px;
  cursor: pointer;
}
.overlay-filter .header .btn-filter-zuruecksetzen {
  position: absolute;
  right: 20px;
  top: 22px;
}
.overlay-filter .content {
  position: relative;
  margin-top: 62px;
  padding-top: 1px;
  background-color: #f5f5f5;
  height: 100%;
}
.overlay-filter .content.filter {
  background-color: #ffffff;
}
.overlay-filter .content .s2 {
  margin-left: 20px;
}
.overlay-filter .content ul.nav {
  padding: 0;
  margin: 20px 20px;
}
.overlay-filter .content ul.nav:first-child {
  margin-top: 40px;
}
.overlay-filter .content ul.nav li {
  padding: 7px 0;
  background-color: #ffffff;
  border-bottom: 1px solid #e4e4e4;
  background-image: url(../img/arrow-suchergebnis-trenner.png);
  background-position: 93%;
  background-repeat: no-repeat;
}
.overlay-filter .content ul.nav li.sort {
  background-image: url(../img/entdecken/icon_sort.svg);
}
.overlay-filter .content ul.nav li a {
  color: #262626;
  text-decoration: none;
}
.overlay-filter .content ul.nav li a:hover, .overlay-filter .content ul.nav li a:active {
  background: none;
}
.overlay-filter .content .taglist {
  position: relative;
  background-color: #e4e4e4;
  border-left: 1px solid #cccccc;
  border-right: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
}
.overlay-filter .content .taglist .tagrow {
  padding: 15px 20px 0px 20px;
  text-align: left;
  height: 70px;
  border-top: 1px solid #cccccc;
  overflow: hidden;
}
.overlay-filter .content .taglist .tagrow.aktiv {
  background-color: #ffffff;
}
.overlay-filter .content .taglist .tagrow label {
  width: 20px;
  white-space: nowrap;
}
.overlay-filter .content .taglist .tagrow .meta-checkbox {
  position: relative;
  width: 40px;
  height: 40px;
  border-radius: 20px;
  border: 1px dashed #666666;
  margin-right: 20px;
}
.overlay-filter .content .taglist .tagrow .meta-checkbox.active {
  background-image: url(../img/account/checkbox_listitem_checked.svg);
  background-position: center;
  background-size: cover;
  border: none;
}
.overlay-filter .content .taglist .tagrow .meta-checkbox.active .icon {
  display: none;
}
.overlay-filter .content .imageholder {
  margin-left: 20px;
}
.overlay-filter .content .imageholder .zertifizierung {
  position: relative;
}
.overlay-filter .content .imageholder .zertifizierung[data-checked="1"] .aktiv {
  display: block;
}
.overlay-filter .content .imageholder .zertifizierung .aktiv {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-color: rgba(165, 215, 125, 0.9);
  background-image: url(../img/account/icon_zertifizierung_checked.svg);
  background-position: center;
  background-repeat: no-repeat;
  display: none;
}
.overlay-filter .content .btn {
  margin-left: 20px;
  width: calc(100% - 40px);
}

.fce-text h4 {
  line-height: 30px;
}

@media screen and (max-width: 991px) {
  .fce-share {
    background-image: linear-gradient(to right, #cccccc 20%, rgba(255, 255, 255, 0) 0%);
    background-position: top;
    background-size: 3px 1px;
    background-repeat: repeat-x;
  }
  .fce-share .row {
    background-image: linear-gradient(to right, #cccccc 20%, rgba(255, 255, 255, 0) 0%);
    background-position: bottom;
    background-size: 3px 1px;
    background-repeat: repeat-x;
  }
}
.fce-share .icon-share {
  display: inline;
  margin-left: 10px;
}
.fce-share .icon-share.first {
  margin-left: 0px;
}
.fce-share .icon-share a {
  text-decoration: none;
}

.fce-divider .container {
  height: 1px;
  background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 5px 2px;
  background-repeat: repeat-x;
}

.fce-media-text h2, .fce-text-media h2, .fce-text-text h2 {
  margin-bottom: 40px;
  width: 80%;
}
.fce-media-text.podcasts h2, .fce-text-media.podcasts h2, .fce-text-text.podcasts h2 {
  width: auto;
}
.fce-media-text .text p, .fce-text-media .text p, .fce-text-text .text p {
  width: 90%;
}
.fce-media-text img, .fce-text-media img, .fce-text-text img {
  width: 100%;
  height: auto;
}

.fce-fullwidth-text-text .col-md-6 {
  padding: 15vw;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 40vw;
}
@media screen and (max-width: 1600px) {
  .fce-fullwidth-text-text .col-md-6 {
    padding: 12vw;
  }
}
@media screen and (max-width: 1219px) {
  .fce-fullwidth-text-text .col-md-6 {
    padding: 10vw;
  }
}
@media screen and (max-width: 767px) {
  .fce-fullwidth-text-text .col-md-6 {
    padding: 15vw;
    height: 70vw;
  }
}

.fce-fullwidth-text {
  padding: 15vw;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 40vw;
}
.fce-fullwidth-text p {
  margin-bottom: 40px;
}
@media screen and (max-width: 1600px) {
  .fce-fullwidth-text {
    padding: 12vw;
  }
}
@media screen and (max-width: 1219px) {
  .fce-fullwidth-text {
    padding: 10vw;
  }
}
@media screen and (max-width: 767px) {
  .fce-fullwidth-text {
    padding: 15vw;
    height: 100vw;
  }
}

@media screen and (min-width: 992px) {
  .fce-media-text .text h2, .fce-media-text .text p {
    margin-left: 7%;
  }
}

.fce-checklist ul {
  padding-left: 32px;
  list-style: none;
}
.fce-checklist ul li {
  background-image: url(../img/checkmark-green.png);
  background-position: left;
  background-repeat: no-repeat;
  padding-left: 52px;
  margin-bottom: 20px;
}

.fce-carousel {
  position: relative;
}
.fce-carousel .oben {
  background-image: linear-gradient(to right, #cccccc 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 3px 1px;
  background-repeat: repeat-x;
}
.fce-carousel .container {
  background-image: linear-gradient(to right, #cccccc 20%, rgba(255, 255, 255, 0) 0%);
  background-position: bottom;
  background-size: 3px 1px;
  background-repeat: repeat-x;
}
.fce-carousel .slick-slide {
  margin-right: 30px;
}
.fce-carousel .slick-slide .bild {
  position: relative;
  width: 100%;
  background-size: cover;
  background-position: center;
}
.fce-carousel .slick-slide .bild:before {
  content: "";
  display: block;
  padding-top: 66%; /* initial ratio of 1:1*/
}
.fce-carousel .slick-arrow {
  width: 40px;
  height: 40px;
  position: absolute;
}
.fce-carousel .slick-next {
  background-image: url(../img/arrow-slider-right.png);
}
.fce-carousel .slick-prev {
  background-image: url(../img/arrow-slider-left.png);
}

.fce-googlemaps #map {
  height: 450px;
}

.fce-fullwidth-slider {
  position: relative;
}
.fce-fullwidth-slider .icon-zoom {
  position: absolute;
  z-index: 3;
  right: 30px;
  bottom: 30px;
  width: 32px;
  heighT: 32px;
  background-image: url(../img/konfigurator/btn_zoom.svg);
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
}
.fce-fullwidth-slider .icon-zoom.left {
  left: 30px;
}
.fce-fullwidth-slider .bttn-anfragen {
  position: absolute;
  z-index: 3;
  right: 30px;
  bottom: 30px;
}
.fce-fullwidth-slider .bttn-anfragen button {
  padding-left: 45px;
  padding-right: 45px;
  background-position: 89%;
  background-repeat: no-repeat;
  cursor: pointer;
}
.fce-fullwidth-slider .bttn-shop {
  position: absolute;
  z-index: 3;
  right: 30px;
  bottom: 30px;
}
.fce-fullwidth-slider .bttn-shop button {
  padding-left: 60px;
  padding-right: 60px;
  cursor: pointer;
}
.fce-fullwidth-slider .fullwidth-slider.slick-dotted.slick-slider {
  margin-bottom: 0px;
}
.fce-fullwidth-slider .fullwidth-slider .fullwidth-slider-slide {
  position: relative;
  height: 500px;
}
.fce-fullwidth-slider .fullwidth-slider .fullwidth-slider-slide .slide-image {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 500px;
  background-size: cover;
  background-position: center;
}
.fce-fullwidth-slider .fullwidth-slider .fullwidth-slider-slide .slide-text {
  position: absolute;
  width: 100%;
  height: 100%;
  lefT: 0px;
  top: 0px;
  background-image: linear-gradient(-180deg, rgba(148, 148, 148, 0) 30%, rgba(0, 0, 0, 0.7) 99%);
}
.fce-fullwidth-slider .fullwidth-slider .fullwidth-slider-slide .slide-text h2 {
  position: absolute;
  text-align: center;
  width: 100%;
  top: 0%;
  padding: 15px 0px 10px 0px;
  background-color: rgba(0, 0, 0, 0.7);
}
.fce-fullwidth-slider .fullwidth-slider .fullwidth-slider-slide .slide-text h3 {
  display: none;
}
.fce-fullwidth-slider .fullwidth-slider .fullwidth-slider-slide.first .slide-text {
  background-color: rgba(0, 0, 0, 0.7);
  background-image: none;
}
.fce-fullwidth-slider .fullwidth-slider .fullwidth-slider-slide.first .slide-text h2 {
  position: relative;
  margin-top: 150px;
  text-align: center;
  width: 100%;
  background-color: transparent;
}
.fce-fullwidth-slider .fullwidth-slider .fullwidth-slider-slide.first .slide-text h3 {
  display: block;
  text-align: center;
  position: relative;
}
.fce-fullwidth-slider .fullwidth-slider .slick-dots {
  position: absolute;
  bottom: 20px;
  z-index: 10;
  list-style: none;
}
.fce-fullwidth-slider .fullwidth-slider .slick-dots li {
  opacity: 0.7;
  width: 5px;
  height: 5px;
  background-color: #ffffff;
  border: none;
  border-radius: 50%;
}
.fce-fullwidth-slider .fullwidth-slider .slick-dots li.slick-active {
  background-color: #69be28;
}
.fce-fullwidth-slider .fullwidth-slider .slick-dots li button {
  display: none;
}
.fce-fullwidth-slider.first-element {
  margin-top: 108px;
}
@media screen and (max-width: 991px) {
  .fce-fullwidth-slider.first-element {
    margin-top: 62px;
  }
}
.fce-fullwidth-slider.first-element .fullwidth-slider .fullwidth-slider-slide.first .slide-text h2 {
  margin-top: 0px;
}
.fce-fullwidth-slider.first-element .fullwidth-slider .fullwidth-slider-slide.first .slide-text h3 {
  margin-top: 150px;
}

.wiki .fce-fullwidth-slider .fullwidth-slider .fullwidth-slider-slide.first .slide-text h2 {
  margin-top: 0px;
}
.wiki .fce-fullwidth-slider .fullwidth-slider .fullwidth-slider-slide.first .slide-text h3 {
  margin-top: 150px;
}

.fce-multiloft-structure .col-md-3 img {
  margin-bottom: 20px;
  cursor: pointer;
}
@media screen and (max-width: 991px) {
  .fce-multiloft-structure .col-md-3 img {
    width: 70%;
  }
}
.fce-multiloft-structure .col-md-3 .s2 {
  text-align: center;
  margin-top: 20px;
  margin-bottom: 30px;
  visibility: hidden;
}
.fce-multiloft-structure .col-md-3:hover .s2 {
  visibility: visible;
}

.fce-multiloft-farbkerne .farbinfo,
.fce-multiloft-cover .farbinfo {
  position: relative;
}
.fce-multiloft-farbkerne .farbinfo .circle,
.fce-multiloft-cover .farbinfo .circle {
  width: 80%;
  padding-bottom: 80%;
  margin: 0px auto 20px auto;
  border-radius: 50%;
  bordeR: 1px solid #cccccc;
  cursor: pointer;
}
@media screen and (max-width: 991px) {
  .fce-multiloft-farbkerne .farbinfo .circle,
  .fce-multiloft-cover .farbinfo .circle {
    width: 40%;
    padding-bottom: 40%;
  }
}
.fce-multiloft-farbkerne .farbinfo .infocard,
.fce-multiloft-cover .farbinfo .infocard {
  z-index: 2;
  position: absolute;
  display: block;
  opacity: 0;
  left: 0;
  top: -20px;
  background: white;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
  padding-top: 20px;
  padding-bottom: 20px;
  width: 100%;
  pointer-events: none;
  transition: 0.2s;
}
.fce-multiloft-farbkerne .farbinfo .infocard .circle,
.fce-multiloft-cover .farbinfo .infocard .circle {
  width: 70%;
  padding-bottom: 70%;
  margin: 0 auto 20px auto;
  border-radius: 50%;
  bordeR: 1px solid #cccccc;
  cursor: pointer;
}
@media screen and (max-width: 991px) {
  .fce-multiloft-farbkerne .farbinfo .infocard .circle,
  .fce-multiloft-cover .farbinfo .infocard .circle {
    width: 40%;
    padding-bottom: 40%;
  }
}
.fce-multiloft-farbkerne .farbinfo h5, .fce-multiloft-farbkerne .farbinfo .s2,
.fce-multiloft-cover .farbinfo h5,
.fce-multiloft-cover .farbinfo .s2 {
  padding-left: 10px;
  padding-right: 10px;
}
.fce-multiloft-farbkerne .farbinfo .text-center,
.fce-multiloft-cover .farbinfo .text-center {
  white-space: nowrap;
}
.fce-multiloft-farbkerne .farbinfo:hover .infocard,
.fce-multiloft-cover .farbinfo:hover .infocard {
  opacity: 1;
}

.tooltip_content {
  margin: 40px 30px 30px 30px;
}
.tooltip_content h4 {
  color: #69be28;
  margin-bottom: 30px;
}

.icon-info {
  position: absolute;
  right: 15px;
  top: 15px;
  widtH: 17px;
  height: 17px;
  background-image: url(../img/konfigurator/icon_info.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
}
.icon-info.inline {
  display: inline-block;
  vertical-align: -10%;
  position: relative;
  right: auto;
  lefT: auto;
  top: auto;
  margin-left: 8px;
}

.tag {
  border: 1px solid #69be28;
  color: #69be28;
  text-decoration: none;
  white-space: nowrap;
  line-height: 33px;
}
.tag.druckereitag {
  border-color: #262626;
  color: #262626;
}

.bttn-schneidartikel {
  border: none;
  display: block;
  width: 100%;
  background-color: #e4e4e4;
  padding: 12px;
  background-image: url(../img/konfigurator/icon_info.svg);
  background-position: 98%;
  background-repeat: no-repeat;
  text-align: left;
}
.bttn-schneidartikel img {
  vertical-align: middle;
  margin-right: 10px;
}

.bttn-gewicht {
  border: none;
  display: block;
  width: 100%;
  background-color: #e4e4e4;
  padding: 12px;
  text-align: left;
}
.bttn-gewicht img {
  vertical-align: middle;
  margin-right: 10px;
}

.overlay-suche {
  position: fixed;
  lefT: 0px;
  top: 0px;
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.8);
  cursor: url(../img/btn_close.svg), auto;
  z-index: 1000;
  display: none;
}
.overlay-suche .container {
  margin-top: 120px;
}

.rte-content h1, .rte-content h2, .rte-content h3, .rte-content h4, .rte-content h5, .rte-content h6, .rte-content p, .rte-content ol, .rte-content ul {
  margin-bottom: 30px;
}
.rte-content ul {
  padding-left: 0px;
  list-style: none;
}
.rte-content ul li {
  background-image: url(../img/checkmark-green.png);
  background-position: left top;
  background-repeat: no-repeat;
  padding-left: 52px;
  margin-bottom: 20px;
}
.rte-content ol {
  padding-left: 20px;
  list-style-type: decimal;
}
.rte-content ol li {
  padding-left: 40px;
}
.rte-content ol ol {
  margin-top: 10px;
  padding-left: 60px;
  list-style-type: lower-latin;
}

.element_searchfield_history-2col,
.element_searchfield_history-3col,
.element_searchfield_tags_suggest,
.element_searchfield_places_suggest,
.element_searchfield_results,
.element_searchfield_results_list,
.element_searchfield_distance,
.element_searchfield_no_results {
  margin-top: 10px;
  border-radius: 2px;
  position: relative;
  cursor: pointer;
}
.element_searchfield_history-2col.open,
.element_searchfield_history-3col.open,
.element_searchfield_tags_suggest.open,
.element_searchfield_places_suggest.open,
.element_searchfield_results.open,
.element_searchfield_results_list.open,
.element_searchfield_distance.open,
.element_searchfield_no_results.open {
  display: block;
}
.element_searchfield_history-2col .header,
.element_searchfield_history-3col .header,
.element_searchfield_tags_suggest .header,
.element_searchfield_places_suggest .header,
.element_searchfield_results .header,
.element_searchfield_results_list .header,
.element_searchfield_distance .header,
.element_searchfield_no_results .header {
  background-color: #ffffff;
}
.element_searchfield_history-2col .header .entdecken,
.element_searchfield_history-2col .header .haeufig,
.element_searchfield_history-2col .header .zuletzt,
.element_searchfield_history-3col .header .entdecken,
.element_searchfield_history-3col .header .haeufig,
.element_searchfield_history-3col .header .zuletzt,
.element_searchfield_tags_suggest .header .entdecken,
.element_searchfield_tags_suggest .header .haeufig,
.element_searchfield_tags_suggest .header .zuletzt,
.element_searchfield_places_suggest .header .entdecken,
.element_searchfield_places_suggest .header .haeufig,
.element_searchfield_places_suggest .header .zuletzt,
.element_searchfield_results .header .entdecken,
.element_searchfield_results .header .haeufig,
.element_searchfield_results .header .zuletzt,
.element_searchfield_results_list .header .entdecken,
.element_searchfield_results_list .header .haeufig,
.element_searchfield_results_list .header .zuletzt,
.element_searchfield_distance .header .entdecken,
.element_searchfield_distance .header .haeufig,
.element_searchfield_distance .header .zuletzt,
.element_searchfield_no_results .header .entdecken,
.element_searchfield_no_results .header .haeufig,
.element_searchfield_no_results .header .zuletzt {
  padding: 30px;
  text-align: center;
  color: #262626;
  border-bottom: 4px solid #e4e4e4;
}
.element_searchfield_history-2col .header .entdecken.aktiv,
.element_searchfield_history-2col .header .haeufig.aktiv,
.element_searchfield_history-2col .header .zuletzt.aktiv,
.element_searchfield_history-3col .header .entdecken.aktiv,
.element_searchfield_history-3col .header .haeufig.aktiv,
.element_searchfield_history-3col .header .zuletzt.aktiv,
.element_searchfield_tags_suggest .header .entdecken.aktiv,
.element_searchfield_tags_suggest .header .haeufig.aktiv,
.element_searchfield_tags_suggest .header .zuletzt.aktiv,
.element_searchfield_places_suggest .header .entdecken.aktiv,
.element_searchfield_places_suggest .header .haeufig.aktiv,
.element_searchfield_places_suggest .header .zuletzt.aktiv,
.element_searchfield_results .header .entdecken.aktiv,
.element_searchfield_results .header .haeufig.aktiv,
.element_searchfield_results .header .zuletzt.aktiv,
.element_searchfield_results_list .header .entdecken.aktiv,
.element_searchfield_results_list .header .haeufig.aktiv,
.element_searchfield_results_list .header .zuletzt.aktiv,
.element_searchfield_distance .header .entdecken.aktiv,
.element_searchfield_distance .header .haeufig.aktiv,
.element_searchfield_distance .header .zuletzt.aktiv,
.element_searchfield_no_results .header .entdecken.aktiv,
.element_searchfield_no_results .header .haeufig.aktiv,
.element_searchfield_no_results .header .zuletzt.aktiv {
  border-bottom: 4px solid #69be28;
}
.element_searchfield_history-2col .rows.overflow-scroll,
.element_searchfield_history-3col .rows.overflow-scroll,
.element_searchfield_tags_suggest .rows.overflow-scroll,
.element_searchfield_places_suggest .rows.overflow-scroll,
.element_searchfield_results .rows.overflow-scroll,
.element_searchfield_results_list .rows.overflow-scroll,
.element_searchfield_distance .rows.overflow-scroll,
.element_searchfield_no_results .rows.overflow-scroll {
  overflow-y: auto;
  overflow-x: hidden;
  clear: both;
}
.element_searchfield_history-2col .rows .liste,
.element_searchfield_history-3col .rows .liste,
.element_searchfield_tags_suggest .rows .liste,
.element_searchfield_places_suggest .rows .liste,
.element_searchfield_results .rows .liste,
.element_searchfield_results_list .rows .liste,
.element_searchfield_distance .rows .liste,
.element_searchfield_no_results .rows .liste {
  background-color: #ffffff;
  display: none;
  border-radius: 2px;
}
.element_searchfield_history-2col .rows .liste.aktiv,
.element_searchfield_history-3col .rows .liste.aktiv,
.element_searchfield_tags_suggest .rows .liste.aktiv,
.element_searchfield_places_suggest .rows .liste.aktiv,
.element_searchfield_results .rows .liste.aktiv,
.element_searchfield_results_list .rows .liste.aktiv,
.element_searchfield_distance .rows .liste.aktiv,
.element_searchfield_no_results .rows .liste.aktiv {
  display: block;
}
.element_searchfield_history-2col .rows .bordered-row,
.element_searchfield_history-3col .rows .bordered-row,
.element_searchfield_tags_suggest .rows .bordered-row,
.element_searchfield_places_suggest .rows .bordered-row,
.element_searchfield_results .rows .bordered-row,
.element_searchfield_results_list .rows .bordered-row,
.element_searchfield_distance .rows .bordered-row,
.element_searchfield_no_results .rows .bordered-row {
  background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 5px 2px;
  background-repeat: repeat-x;
  padding: 30px;
}
.element_searchfield_history-2col .rows .bordered-row:first-child,
.element_searchfield_history-3col .rows .bordered-row:first-child,
.element_searchfield_tags_suggest .rows .bordered-row:first-child,
.element_searchfield_places_suggest .rows .bordered-row:first-child,
.element_searchfield_results .rows .bordered-row:first-child,
.element_searchfield_results_list .rows .bordered-row:first-child,
.element_searchfield_distance .rows .bordered-row:first-child,
.element_searchfield_no_results .rows .bordered-row:first-child {
  background-image: none;
}

.element_searchfield_history-2col {
  display: none;
}
.element_searchfield_history-2col .header .haeufig,
.element_searchfield_history-2col .header .zuletzt {
  width: 50%;
  float: left;
}

.element_searchfield_history-3col {
  display: none;
}
.element_searchfield_history-3col .header .entdecken,
.element_searchfield_history-3col .header .haeufig,
.element_searchfield_history-3col .header .zuletzt {
  width: 33.3%;
  float: left;
}

.element_searchfield_tags_suggest {
  display: none;
}
.element_searchfield_tags_suggest .rows .liste {
  border-radius: 2px;
  background-color: #ffffff;
  display: block;
}

.element_searchfield_places_suggest {
  display: none;
}
.element_searchfield_places_suggest .rows .liste {
  border-radius: 2px;
  background-color: #ffffff;
  display: block;
}
.element_searchfield_places_suggest .rows .bordered-row {
  padding: 20px 30px;
}

.element_searchfield_no_results {
  display: none;
  background-color: #666666;
  color: #ffffff;
  border-radius: 2px;
  padding: 30px;
}

.element_searchfield_results,
.element_searchfield_results_list {
  display: none;
}
.element_searchfield_results .header,
.element_searchfield_results_list .header {
  padding: 15px;
  background-color: #f5f5f5;
}
.element_searchfield_results .rows .segment.entdecken .list .bordered-row, .element_searchfield_results .rows .segment.toptreffer .list .bordered-row, .element_searchfield_results .rows .segment.shop .list .bordered-row,
.element_searchfield_results_list .rows .segment.entdecken .list .bordered-row,
.element_searchfield_results_list .rows .segment.toptreffer .list .bordered-row,
.element_searchfield_results_list .rows .segment.shop .list .bordered-row {
  display: block;
}
.element_searchfield_results .rows .segment.entdecken .list a.bordered-row, .element_searchfield_results .rows .segment.toptreffer .list a.bordered-row, .element_searchfield_results .rows .segment.shop .list a.bordered-row,
.element_searchfield_results_list .rows .segment.entdecken .list a.bordered-row,
.element_searchfield_results_list .rows .segment.toptreffer .list a.bordered-row,
.element_searchfield_results_list .rows .segment.shop .list a.bordered-row {
  text-decoration: none;
  color: inherit;
}
.element_searchfield_results .rows .segment.shop .list .bordered-row,
.element_searchfield_results_list .rows .segment.shop .list .bordered-row {
  padding-top: 40px;
  padding-bottom: 30px;
}
.element_searchfield_results .rows .segment.shop .list .bordered-row p,
.element_searchfield_results_list .rows .segment.shop .list .bordered-row p {
  line-height: 35px;
}
.element_searchfield_results .rows .segment.toptreffer .list .bordered-row,
.element_searchfield_results_list .rows .segment.toptreffer .list .bordered-row {
  padding-top: 20px;
  padding-bottom: 20px;
}
.element_searchfield_results .rows .segment.toptreffer .list .bordered-row .image,
.element_searchfield_results_list .rows .segment.toptreffer .list .bordered-row .image {
  float: left;
  margin-right: 30px;
  height: 60px;
  width: 60px;
  border-radius: 50%;
  background-size: cover;
  background-position: center;
}
.element_searchfield_results .rows .segment.toptreffer .list .bordered-row p:first-child,
.element_searchfield_results_list .rows .segment.toptreffer .list .bordered-row p:first-child {
  margin-top: 18px;
}
.element_searchfield_results .rows .segment .list,
.element_searchfield_results_list .rows .segment .list {
  background-color: #ffffff;
}
.element_searchfield_results .rows .segment .list .icon,
.element_searchfield_results_list .rows .segment .list .icon {
  float: left;
  margin-right: 30px;
}
.element_searchfield_results .rows .segment .list img,
.element_searchfield_results_list .rows .segment .list img {
  vertical-align: baseline;
  margin-right: 8px;
  margin-left: 8px;
}
.element_searchfield_results .rows .segment .list .s1,
.element_searchfield_results_list .rows .segment .list .s1 {
  margin-top: 5px;
}

.element_searchfield_results_list {
  display: block;
}

.element_searchfield_distance {
  display: none;
}
.element_searchfield_distance .list {
  margin-left: 57%;
  background-color: #ffffff;
  border-radius: 2px;
  width: 130px;
  padding: 10px 0px;
}
.element_searchfield_distance .list .row {
  padding: 10px 30px;
}

.element_searchfield_global.overlay {
  display: none;
}

.element_searchfield_simple {
  position: relative;
  margin-top: 60px;
  background-color: #ffffff;
  height: 60px;
  widtH: 100%;
  border-radius: 2px;
  cursor: auto;
}
.element_searchfield_simple input {
  border: none;
  padding: 20px 0px 15px 20px;
  outline: none;
  width: 100%;
  background-image: url(../img/icon-suche-global.svg);
  background-position: 97%;
  background-repeat: no-repeat;
}

.element_searchfield_projekte,
.element_searchfield_wiki {
  position: relative;
  margin-top: 60px;
  background-color: #ffffff;
  height: 60px;
  widtH: 100%;
  border-radius: 2px;
  cursor: auto;
  display: none;
}
.element_searchfield_projekte form,
.element_searchfield_wiki form {
  widtH: 100%;
  height: 70px;
}
.element_searchfield_projekte form input,
.element_searchfield_wiki form input {
  border: none;
}
.element_searchfield_projekte form input:focus,
.element_searchfield_wiki form input:focus {
  outline: none;
}
.element_searchfield_projekte form input[type=text],
.element_searchfield_wiki form input[type=text] {
  margin: 0;
}
.element_searchfield_projekte form input[type=submit],
.element_searchfield_wiki form input[type=submit] {
  float: right;
  height: 60px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
  padding: 10px 30px;
}

.element_searchfield_druckereien {
  position: relative;
  margin-top: 60px;
  background-color: #ffffff;
  height: 60px;
  widtH: 100%;
  border-radius: 2px;
  cursor: auto;
  display: none;
}
.element_searchfield_druckereien form {
  widtH: 100%;
  height: 70px;
}
.element_searchfield_druckereien form input {
  border: none;
}
.element_searchfield_druckereien form input:focus {
  outline: none;
}
.element_searchfield_druckereien form input[type=text] {
  margin: 0;
  border-left: 1px solid #f5f5f5;
}
.element_searchfield_druckereien form input:first-child {
  border-left: none;
}
.element_searchfield_druckereien form input[type=submit] {
  float: right;
  height: 60px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
  padding: 10px 30px;
}
.element_searchfield_druckereien form input.plz {
  background-image: url(../img/icon-suche-plz.svg);
  padding: 20px 0px 15px 15px;
  background-position: 90%;
  background-repeat: no-repeat;
  width: 25%;
}
.element_searchfield_druckereien form input.umkreis {
  background-image: url(../img/icon-suche-down.svg);
  padding: 20px 0px 15px 15px;
  background-position: 80%;
  background-repeat: no-repeat;
  width: 20%;
}

.card-account-widget {
  position: relative;
  background-color: #ffffff;
  padding: 30px;
  padding-bottom: 10px;
  margin-bottom: 30px;
  border-radius: 2px;
}
.card-account-widget.zertifizierung {
  padding-bottom: 20px;
}
.card-account-widget a.h5 {
  color: #69be28;
  text-decoration: none;
  display: block;
  background-image: url(../img/arrow-suchergebnis-trenner.png);
  background-position: 100%;
  background-repeat: no-repeat;
}
.card-account-widget p.p3, .card-account-widget p.s1 {
  margin-top: 3px;
  margin-bottom: 20px;
}
.card-account-widget.bestellungen .bordered-row {
  background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 5px 2px;
  background-repeat: repeat-x;
  padding: 20px;
  height: 80px;
}
.card-account-widget.leads {
  padding: 0px;
}
.card-account-widget.leads .header {
  background-color: #69be28;
  padding: 30px 30px 1px 30px;
}
.card-account-widget.leads .header .h5 {
  color: #ffffff;
  text-align: center;
}
.card-account-widget.leads .header .guthaben {
  background-color: #5faa23;
  height: 50px;
  border-radius: 25px;
  width: 120px;
  margin: 20px auto;
  text-align: right;
  padding: 10px 18px;
  color: #ffffff;
  background-image: url(../img/account/icon_leads.svg);
  background-position: 20%;
  background-repeat: no-repeat;
}
.card-account-widget.leads .rows {
  background-color: #f5f5f5;
  border-left: 1px solid #e4e4e4;
  border-right: 1px solid #e4e4e4;
}
.card-account-widget.leads .rows .radio-row {
  padding: 20px;
  border-top: 1px solid #e4e4e4;
}
.card-account-widget.leads .button {
  padding: 20px;
  border: 1px solid #e4e4e4;
}

.imageholder .zertifizierung,
.imageholder .thumbnail {
  width: 45%;
  heighT: 100px;
  margin-right: 10px;
  background-position: center;
  background-repeat: no-repeat;
  border: 1px solid #cccccc;
  margin-bottom: 10px;
  float: left;
}
.imageholder .thumbnail {
  background-size: cover;
  position: relative;
}
.imageholder .thumbnail.titelbild {
  border: 1px solid #69be28;
}
.imageholder .thumbnail.titelbild .subline {
  position: absolute;
  bottom: 0px;
  left: 0px;
  background-color: #69be28;
  color: #ffffff;
  width: 100%;
  padding-top: 4px;
  text-align: center;
}
.imageholder .thumbnail.video .play-button {
  position: absolute;
  lefT: 0px;
  top: 0px;
  width: 100%;
  heighT: 100%;
  background-image: url(../img/account/btn_play.svg);
  background-position: center;
  background-repeat: no-repeat;
}

.meta-checkbox {
  display: inline-block;
  position: relative;
  width: 30px;
  height: 30px;
  border: 1px solid #cccccc;
  border-radius: 15px;
  margin-right: 10px;
  vertical-align: middle;
  cursor: pointer;
}
.meta-checkbox.active .icon {
  position: absolute;
  left: 8px;
  top: 8px;
  width: 12px;
  heighT: 12px;
  background-color: #69be28;
  border-radius: 6px;
}

.box__dragndrop,
.box__uploading,
.box__success,
.box__error {
  display: none;
}

.box.has-advanced-upload .box__dragndrop {
  display: inline;
}

.box.is-dragover {
  background-color: grey;
}

.box.is-uploading .box__input {
  visibility: none;
}

.box.is-uploading .box__uploading {
  display: block;
}

.box__button {
  display: none;
}

.box__file {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1;
}

.dragged {
  position: absolute;
  opacity: 0.5;
  z-index: 2000;
}

.fce-nav-sticky {
  position: fixed;
  top: 62px;
  left: 0px;
  width: 100%;
  z-index: 3;
  background-color: rgba(0, 0, 0, 0.8);
  display: none;
}
.fce-nav-sticky p {
  margin-top: 27px;
  margin-left: 30px;
  text-transform: uppercase;
}
.fce-nav-sticky p img {
  margin-left: 30px;
  margin-right: 20px;
  vertical-align: middle;
}
.fce-nav-sticky button {
  margin: 10px 15px;
  padding-left: 60px;
  padding-right: 60px;
  cursor: pointer;
}

.mejs-inner {
  widtH: 100%;
  heighT: 100%;
}
.mejs-inner .mejs-mediaelement {
  width: 100%;
  height: 100%;
}
.mejs-inner .mejs-mediaelement .me-plugin {
  width: 100%;
  height: 100%;
}
.mejs-inner .mejs-mediaelement .me-plugin iframe {
  width: 100%;
  height: 100%;
}



.anmeldeformular {
  background-color: #fff;
  border-radius: 4px;
  padding: 60px 120px 0px 120px;
  margin-top: 15vh;
  height: 70vh;
  overflow: scroll;
  opacity: 0.95;
}
@media (max-width: 767px) {
  .anmeldeformular {
    padding: 10px 10px 0px 10px;
  }
}

/* Tweaks for mobile */
@media screen and (max-width: 768px) {
  form[name=form-config] {
    margin-bottom: 60px;
  }
}

@media screen and (max-width: 768px) {
  .btn.btn-primary.btn-block.margin-md-top-a4.button.refresh.cart {
    margin-left: 0px;
    margin-top: 60px;
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (max-width: 768px) {
  .btn.btn-primary.btn-block.margin-md-top-a1.button.empty.cart {
    margin-left: 0px;
    margin-top: 20px;
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (max-width: 768px) {
  #checkout-review-load {
    margin-top: 100px;
  }
}

.printfarm-content {
  /*
   * Overwrites of standard element classes, so they can be used without breaking the layout
   */
}
.printfarm-content h2 {
  font-family: "Houschka Pro-Bold", Helvetica, Arial, sans-serif;
  text-transform: none;
  text-align: center;
  color: #3b3b3b;
  font-size: 54px;
  line-height: 58px;
}
.printfarm-content h3 {
  font-family: "Houschka Pro-Bold", Helvetica, Arial, sans-serif;
  text-transform: none;
  color: #3b3b3b;
  font-size: 36px;
  line-height: 46px;
}
.printfarm-content h4 {
  font-family: "Houschka Pro-Bold", Helvetica, Arial, sans-serif;
  text-transform: none;
  color: #3b3b3b;
  font-size: 28px;
  line-height: 32px;
}
.printfarm-content p {
  letter-spacing: 0.5px;
}
.printfarm-content .btn {
  height: 38px;
  border-radius: 18px;
  text-transform: uppercase;
  font-size: 14px;
  letter-spacing: 3px;
  padding-top: 8px;
}
.printfarm-content .btn-outline {
  border: 2px solid #69be28;
  background-color: transparent;
  color: #666666;
}
.printfarm-content .btn-outline.weiss {
  border-color: #FFF;
  color: #FFF;
}
.printfarm-content .btn {
  padding-top: 12px;
}
.printfarm-content .btn.btn-lg {
  height: 54px;
  border-radius: 27px;
  font-size: 20px;
  letter-spacing: 4px;
  padding: 19px 30px 0 30px;
}
.printfarm-content .flex-center {
  display: flex;
  align-items: center;
}
.printfarm-content .fce-divider .container {
  background-image: none;
  border-top: 2px solid #69be28;
  margin-bottom: 30px;
}
.printfarm-content .Printfarmheader {
  position: relative;
  height: 430px;
  background-position: center;
  background-size: cover;
  margin-bottom: 90px;
}
.printfarm-content .Printfarmheader .overlay {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.1);
}
.printfarm-content .Printfarmheader .btn-outline {
  margin-top: 30px;
}
.printfarm-content .Printfarmheader h1 {
  margin-top: 120px;
  text-align: center;
  color: white;
  font-size: 46px;
  line-height: 50px;
  text-transform: none;
  font-family: "houschka-pro-demibold", Helvetica, Arial, sans-serif;
}
@media screen and (max-width: 768px) {
  .printfarm-content .Printfarmheader h1 {
    font-size: 30px;
    line-height: 32px;
    margin-top: 100px;
  }
}
.printfarm-content .Printfarmheader .btn-lg {
  margin-top: 30px;
}
.printfarm-content .Printfarmheader.gross {
  height: 760px;
}
.printfarm-content .Printfarmheader.gross .btn-outline {
  display: none;
}
.printfarm-content .Printfarmheader.gross h1 {
  margin-top: 274px;
  font-size: 68px;
  line-heighT: 82px;
}
.printfarm-content .Printfarmheadline {
  margin-top: 30px;
}
.printfarm-content .Printfarmheadline p {
  margin-top: 20px;
  font-size: 25px;
  line-height: 35px;
  text-align: center;
  color: #3b3b3b;
}
.printfarm-content .Printfarmtextimage {
  margin-top: 30px;
  margin-bottom: 40px;
}
.printfarm-content .Printfarmtextimage h3 {
  margin-top: 200px;
}
.printfarm-content .Printfarm3col {
  margin-bottom: 30px;
}
.printfarm-content .Printfarm3col h4 {
  margin-top: 30px;
  text-align: center;
}
.printfarm-content .Printfarm3col p {
  margin-top: 20px;
  text-align: center;
}
.printfarm-content .Printfarm2col {
  margin-top: 60px;
}
.printfarm-content .Printfarm2col.links h3 {
  margin-top: 160px;
}
.printfarm-content .Printfarm2col.links img {
  margin-bottom: 40px;
}
.printfarm-content .Printfarm2col.rechts h3 {
  margin-top: 120px;
}
.printfarm-content .Printfarm2col p {
  margin-top: 20px;
  color: #3b3b3b;
}
.printfarm-content .Printfarmslider {
  margin-top: 60px;
  margin-bottom: 60px;
}
.printfarm-content .Printfarmslider .printfarm-slider-arrows {
  position: relative;
  margin: 60px auto;
  width: 240px;
  height: 60px;
}
.printfarm-content .Printfarmslider .printfarm-slider-arrows p {
  text-align: center;
  margin-top: 0px;
  font-size: 23px;
}
.printfarm-content .Printfarmslider .printfarm-slider-arrows .slick-prev, .printfarm-content .Printfarmslider .printfarm-slider-arrows .slick-next {
  position: absolute;
  display: block;
  height: 60px;
  width: 60px;
  line-height: 0px;
  font-size: 0px;
  cursor: pointer;
  background-color: transparent;
  color: transparent;
  padding: 0;
  outline: none;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  top: 14px;
}
@media screen and (max-width: 768px) {
  .printfarm-content .Printfarmslider .printfarm-slider-arrows .slick-prev, .printfarm-content .Printfarmslider .printfarm-slider-arrows .slick-next {
    display: none !important;
  }
}
.printfarm-content .Printfarmslider .printfarm-slider-arrows .slick-next {
  right: 0;
  background-image: url(../img/arrow_right.svg);
}
.printfarm-content .Printfarmslider .printfarm-slider-arrows .slick-prev {
  left: 0;
  background-image: url(../img/arrow_left.svg);
}
.printfarm-content .Printfarmslider .slick-printfarmslider {
  display: block;
  position: relative;
  cursor: pointer;
  text-decoration: none;
}
@media screen and (max-width: 991px) {
  .printfarm-content .Printfarmslider .slick-printfarmslider {
    margin-bottom: 30px;
  }
}
.printfarm-content .Printfarmslider .slick-printfarmslider .slick-slide {
  background-color: transparent;
}
.printfarm-content .Printfarmslider .slick-printfarmslider:hover .img-holder {
  transform: scale(1.4);
  filter: brightness(50%);
}
.printfarm-content .Printfarmslider .slick-printfarmslider .image {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.printfarm-content .Printfarmslider .slick-printfarmslider .image:before {
  content: "";
  display: block;
  padding-top: 100%; /* initial ratio of 1:1*/
}
.printfarm-content .Printfarmslider .slick-printfarmslider .image .img-holder {
  transition: 0.5s;
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
}
.printfarm-content .Printfarmslider .slick-printfarmslider .image .overlay {
  position: absolute;
  left: 0px;
  top: 30%;
  width: 100%;
  height: 70%;
  background-image: linear-gradient(-180deg, rgba(148, 148, 148, 0) 11%, #000000 100%);
}
.printfarm-content .Printfarmslider .slick-printfarmslider .contentbereich {
  padding: 0 0 0 0;
}
.printfarm-content .Printfarmslider .slick-printfarmslider .contentbereich p {
  font-size: 18px;
  line-height: 23px;
  margin-top: 20px;
  text-transform: uppercase;
}
.printfarm-content .Printfarmslider .slick-printfarmslider .channel {
  position: relative;
  right: 20px;
  top: 20px;
  padding: 10px;
  z-index: 2;
  background-color: rgba(0, 0, 0, 0.3);
  color: white;
  text-transform: uppercase;
  text-decoration: none;
  height: 30px;
}
.printfarm-content .Printfarmslider .slick-printfarmslider .headline {
  margin-top: 10px;
  position: relative;
  z-index: 2;
  color: #666666;
}
.printfarm-content .Printfarmslider .slick-printfarmslider .subheadline {
  position: relative;
  color: #69be28;
  z-index: 2;
}
.printfarm-content .Printfarmslider .slick-printfarmslider .text {
  position: relative;
  width: 100%;
  padding: 30px 0px 0px 0px;
  background-color: #ffffff;
  color: #262626;
  text-decoration: none;
}
.printfarm-content .Printfarmslider .slick-printfarmslider .btn {
  margin-top: 20px;
  padding-left: 60px;
  padding-right: 60px;
}
.printfarm-content #musterbuch-lasche {
  display: block;
  border-bottom-right-radius: 10px;
  border-top-right-radius: 10px;
  background-image: url(../img/icon-musterbuch.svg);
  background-size: 20px 27px;
  background-position: 147px 10px;
  background-repeat: no-repeat;
  position: fixed;
  left: 0px;
  top: 500px;
  width: 180px;
  height: 44px;
  background-color: #69be28;
  color: #FFF;
  font-size: 12px;
  text-transform: uppercase;
  text-decoration: none;
  padding-right: 45px;
  padding-top: 6px;
  text-align: right;
  z-index: 2;
  transition: 0.3s;
}
.printfarm-content #musterbuch-lasche.inactive {
  transform: translateX(-138px);
}
.printfarm-content .fce-video .s1 {
  font-family: houschka-pro-light, Helvetica, sans-serif;
  font-size: 25px;
}

.input {
  position: relative;
  z-index: 1;
  display: inline-block;
  max-width: 100%;
  width: 100%;
  vertical-align: top;
}

.input__field {
  position: relative;
  display: block;
  float: right;
  padding: 0.8em;
  width: 60%;
  border: none;
  border-radius: 0;
  color: #262626;
  font-family: houschka-pro-demibold, Helvetica, sans-serif;
  -webkit-appearance: none; /* for box shadows to show on iOS */
}

.input__field:focus {
  outline: none;
}

.input__label {
  display: inline-block;
  float: right;
  padding: 0 1em;
  width: 40%;
  color: #666666;
  font-weight: bold;
  font-size: 70.25%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.input__label-content {
  position: relative;
  display: block;
  padding: 1.6em 0;
  width: 100%;
  text-transform: uppercase;
  font-family: houschka-pro-demibold, Helvetica, sans-serif;
  line-height: 15px;
  letter-spacing: 2px;
}

.graphic {
  position: absolute;
  top: 0;
  left: 0;
  fill: none;
}

.icon {
  color: #ddd;
  font-size: 150%;
}

/* Individual styles */
/* Haruki */
.input--haruki {
  margin: 4em 1em 1em;
}

.input__field--haruki {
  padding: 0.4em 0.25em;
  width: 100%;
  background: transparent;
  color: #cccccc;
  font-size: 1.55em;
}

.input__label--haruki {
  position: absolute;
  width: 100%;
  text-align: left;
  pointer-events: none;
}

.input__label-content--haruki {
  transition: transform 0.3s;
}

.input__label--haruki::before,
.input__label--haruki::after {
  content: "";
  position: absolute;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 4px;
  background: #cccccc;
  transition: transform 0.3s;
}

.input__label--haruki::before {
  top: 0;
}

.input__label--haruki::after {
  bottom: 0;
}

.input__field--haruki:focus + .input__label--haruki .input__label-content--haruki,
.input--filled .input__label-content--haruki {
  transform: translate3d(0, -90%, 0);
}

.input__field--haruki:focus + .input__label--haruki::before,
.input--filled .input__label--haruki::before {
  transform: translate3d(0, -0.5em, 0);
}

.input__field--haruki:focus + .input__label--haruki::after,
.input--filled .input__label--haruki::after {
  transform: translate3d(0, 0.5em, 0);
}

/* Hoshi */
.input--hoshi {
  overflow: hidden;
}

.input__field--hoshi {
  margin-top: 1em;
  padding: 0.85em 0.15em;
  width: 100%;
  background: transparent;
  color: #262626;
}

.input__label--hoshi {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 0 0.25em;
  width: 100%;
  height: calc(100% - 1em);
  text-align: left;
  pointer-events: none;
}

.input__label-content--hoshi {
  position: absolute;
}

.input__label--hoshi::before,
.input__label--hoshi::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(100% - 10px);
  border-bottom: 1px solid #cccccc;
}

.input__label--hoshi::after {
  margin-top: 2px;
  border-bottom: 4px solid red;
  transform: translate3d(-100%, 0, 0);
  transition: transform 0.3s;
}

.input__label--hoshi-color-1::after {
  border-color: #69be28;
}

.input__label--hoshi-color-2::after {
  border-color: #666666;
}

.input__label--hoshi-color-3::after {
  border-color: #000000;
}

.input__field--hoshi:focus + .input__label--hoshi::after,
.input--filled .input__label--hoshi::after {
  transform: translate3d(0, 0, 0);
}

.input__field--hoshi:focus + .input__label--hoshi .input__label-content--hoshi,
.input--filled .input__label-content--hoshi {
  animation: anim-1 0.3s forwards;
}
@keyframes anim-1 {
  50% {
    opacity: 0;
    transform: translate3d(1em, 0, 0);
  }
  51% {
    opacity: 0;
    transform: translate3d(-1em, -40%, 0);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, -40%, 0);
  }
}
/* Kuro */
.input--kuro {
  max-width: 320px;
  margin-bottom: 3em;
}

.input__field--kuro {
  width: 100%;
  background: transparent;
  color: #9196A1;
  opacity: 0;
  text-align: center;
  transition: opacity 0.3s;
}

.input__label--kuro {
  position: absolute;
  left: 0;
  width: 100%;
  color: #df6589;
  pointer-events: none;
}

.input__label--kuro::before,
.input__label--kuro::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  border: 4px solid #747981;
  transition: transform 0.3s;
}

.input__label--kuro::before {
  border-right: none;
}

.input__label--kuro::after {
  left: 50%;
  border-left: none;
}

.input__field--kuro:focus,
.input--filled .input__field--kuro {
  opacity: 1;
  transition-delay: 0.3s;
}

.input__field--kuro:focus + .input__label--kuro::before,
.input--filled .input__label--kuro::before {
  transform: translate3d(-10%, 0, 0);
}

.input__field--kuro:focus + .input__label--kuro::after,
.input--filled .input__label--kuro::after {
  transform: translate3d(10%, 0, 0);
}

.input__field--kuro:focus + .input__label--kuro .input__label-content--kuro,
.input--filled .input__label-content--kuro {
  animation: anim-2 0.3s forwards;
}
@keyframes anim-2 {
  50% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 1);
  }
  51% {
    opacity: 0;
    transform: translate3d(0, 3.7em, 0) scale3d(0.3, 0.3, 1);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 3.7em, 0);
  }
}
/* Jiro */
.input--jiro {
  margin-top: 2em;
}

.input__field--jiro {
  padding: 0.85em 0.5em;
  width: 100%;
  background: transparent;
  color: #DDE2E2;
  opacity: 0;
  transition: opacity 0.3s;
}

.input__label--jiro {
  position: absolute;
  left: 0;
  padding: 0 0.85em;
  width: 100%;
  height: 100%;
  text-align: left;
  pointer-events: none;
}

.input__label-content--jiro {
  transition: transform 0.3s 0.3s;
}

.input__label--jiro::before,
.input__label--jiro::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: transform 0.3s;
}

.input__label--jiro::before {
  border-top: 2px solid #6a7989;
  transform: translate3d(0, 100%, 0) translate3d(0, -2px, 0);
  transition-delay: 0.3s;
}

.input__label--jiro::after {
  z-index: -1;
  background: #6a7989;
  transform: scale3d(1, 0, 1);
  transform-origin: 50% 0%;
}

.input__field--jiro:focus,
.input--filled .input__field--jiro {
  opacity: 1;
  transition-delay: 0.3s;
}

.input__field--jiro:focus + .input__label--jiro .input__label-content--jiro,
.input--filled .input__label-content--jiro {
  transform: translate3d(0, -80%, 0);
  transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}

.input__field--jiro:focus + .input__label--jiro::before,
.input--filled .input__label--jiro::before {
  transition-delay: 0s;
}

.input__field--jiro:focus + .input__label--jiro::before,
.input--filled .input__label--jiro::before {
  transform: translate3d(0, 0, 0);
}

.input__field--jiro:focus + .input__label--jiro::after,
.input--filled .input__label--jiro::after {
  transform: scale3d(1, 1, 1);
  transition-delay: 0.3s;
  transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}

/* Minoru */
.input__field--minoru {
  width: 100%;
  background: #fff;
  box-shadow: 0px 0px 0px 2px transparent;
  color: #eca29b;
  transition: box-shadow 0.3s;
}

.input__label--minoru {
  padding: 0;
  width: 100%;
  text-align: left;
}

.input__label--minoru::after {
  content: "";
  position: absolute;
  top: 0;
  z-index: -1;
  width: 100%;
  height: 4em;
  box-shadow: 0px 0px 0px 0px;
  color: rgba(199, 152, 157, 0.6);
}

.input__field--minoru:focus {
  box-shadow: 0px 0px 0px 2px #eca29b;
}

.input__field--minoru:focus + .input__label--minoru {
  pointer-events: none;
}

.input__field--minoru:focus + .input__label--minoru::after {
  animation: anim-shadow 0.3s forwards;
}
@keyframes anim-shadow {
  to {
    box-shadow: 0px 0px 100px 50px;
    opacity: 0;
  }
}
.input__label-content--minoru {
  padding: 0.75em 0.15em;
}

/* Yoko */
.input__field--yoko {
  z-index: 10;
  width: 100%;
  background: transparent;
  color: #f5f5f5;
  opacity: 0;
  transition: opacity 0.3s;
}

.input__label--yoko {
  position: relative;
  width: 100%;
  color: #b04b40;
  text-align: left;
}

.input__label--yoko::before {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 0;
  width: 100%;
  height: 4em;
  background: #c5564a;
  transform: perspective(1000px) rotate3d(1, 0, 0, 90deg);
  transform-origin: 50% 100%;
  transition: transform 0.3s;
}

.input__label--yoko::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0.25em;
  background: #ad473c;
  transform-origin: 50% 0%;
  transition: transform 0.3s;
}

.input__label-content--yoko {
  padding: 0.75em 0;
}

.input__field--yoko:focus,
.input--filled .input__field--yoko {
  opacity: 1;
  transition-delay: 0.3s;
}

.input__field--yoko:focus + .input__label--yoko::before,
.input--filled .input__label--yoko::before {
  transform: perspective(1000px) rotate3d(1, 0, 0, 0deg);
}

.input__field--yoko:focus + .input__label--yoko,
.input--filled .input__label--yoko {
  pointer-events: none;
}

.input__field--yoko:focus + .input__label--yoko::after,
.input--filled .input__label--yoko::after {
  transform: perspective(1000px) rotate3d(1, 0, 0, -90deg);
}

/* Kyo */
.input--kyo {
  z-index: auto;
}

.input__field--kyo {
  padding: 0.85em 1.5em;
  width: 100%;
  border-radius: 2em;
  background: #fff;
  color: #535d92;
}

.input__label--kyo {
  z-index: 0;
  padding: 0 0 0 2em;
  width: 100%;
  text-align: left;
}

.input__label--kyo::after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  width: 100%;
  height: 100%;
  background: rgba(11, 43, 205, 0.6);
  opacity: 0;
  transition: opacity 0.3s;
  pointer-events: none;
}

.input__label-content--kyo {
  padding: 0.5em 0;
}

.input__field--kyo:focus,
.input__field--kyo:focus + .input__label--kyo .input__label-content--kyo {
  z-index: 10000;
}

.input__field--kyo:focus + .input__label--kyo {
  color: #fff;
}

.input__field--kyo:focus + .input__label--kyo::after {
  opacity: 1;
}

/* Akira */
.input--akira {
  margin-top: 2em;
}

.input__field--akira {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  display: block;
  padding: 0 1em;
  width: 100%;
  height: 100%;
  background: transparent;
  text-align: center;
}

.input__label--akira {
  padding: 0;
  width: 100%;
  background: #696a6e;
  color: #cc6055;
  cursor: text;
}

.input__label--akira::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #2f3238;
  transform: scale3d(0.97, 0.85, 1);
  transition: transform 0.3s;
}

.input__label-content--akira {
  transition: transform 0.3s;
}

.input__field--akira:focus + .input__label--akira::before,
.input--filled .input__label--akira::before {
  transform: scale3d(0.99, 0.95, 1);
}

.input__field--akira:focus + .input__label--akira,
.input--filled .input__label--akira {
  cursor: default;
  pointer-events: none;
}

.input__field--akira:focus + .input__label--akira .input__label-content--akira,
.input--filled .input__label-content--akira {
  transform: translate3d(0, -3.5em, 0);
}

/* Ichiro */
.input--ichiro {
  margin-top: 2em;
}

.input__field--ichiro {
  position: absolute;
  top: 4px;
  left: 4px;
  z-index: 100;
  display: block;
  padding: 0 0.55em;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  background: #f0f0f0;
  color: #7F8994;
  opacity: 0;
  transform: scale3d(1, 0, 1);
  transform-origin: 50% 100%;
  transition: opacity 0.3s, transform 0.3s;
}

.input__label--ichiro {
  width: 100%;
  text-align: left;
  cursor: text;
}

.input__label--ichiro::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  transform-origin: 50% 100%;
  transition: transform 0.3s;
}

.input__label-content--ichiro {
  transform-origin: 0% 50%;
  transition: transform 0.3s;
}

.input__field--ichiro:focus,
.input--filled .input__field--ichiro {
  opacity: 1;
  transform: scale3d(1, 1, 1);
}

.input__field--ichiro:focus + .input__label--ichiro,
.input--filled .input__label--ichiro {
  cursor: default;
  pointer-events: none;
}

.input__field--ichiro:focus + .input__label--ichiro::before,
.input--filled .input__label--ichiro::before {
  transform: scale3d(1, 1.5, 1);
}

.input__field--ichiro:focus + .input__label--ichiro .input__label-content--ichiro,
.input--filled .input__label-content--ichiro {
  transform: translate3d(0, -3.15em, 0) scale3d(0.8, 0.8, 1) translateZ(1px);
}

/* Juro */
.input--juro {
  overflow: hidden;
}

.input__field--juro {
  position: absolute;
  z-index: 100;
  padding: 2.15em 0.75em 0;
  width: 100%;
  background: transparent;
  color: #1784cd;
  font-size: 0.85em;
}

.input__label--juro {
  padding: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  text-align: left;
}

.input__label-content--juro {
  padding: 2em 1em;
  transform-origin: 0% 50%;
  transition: transform 0.3s, color 0.3s;
  text-rendering: geometricPrecision;
}

.input__label--juro::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0px solid transparent;
  transition: border-width 0.3s, border-color 0.3s;
}

.input__field--juro:focus + .input__label--juro::before,
.input--filled .input__label--juro::before {
  border-width: 8px;
  border-color: #1784cd;
  border-top-width: 2em;
}

.input__field--juro:focus + .input__label--juro .input__label-content--juro,
.input--filled .input__label--juro .input__label-content--juro {
  color: #fff;
  transform: translate3d(0, -1.5em, 0) scale3d(0.75, 0.75, 1) translateZ(1px);
}

/* Hideo */
.input--hideo {
  overflow: hidden;
  background: #fff;
}

.input__field--hideo {
  padding: 0.85em 0.85em 0.85em 3em;
  width: 100%;
  background: transparent;
  transform: translate3d(1em, 0, 0);
  transition: transform 0.3s;
}

.input__label--hideo {
  position: absolute;
  padding: 1.25em 0 0;
  width: 4em;
  height: 100%;
}

.input__label--hideo::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 4em;
  height: 100%;
  background: #899dda;
  transform-origin: 0% 50%;
  transition: transform 0.3s;
}

.icon--hideo {
  color: #fff; /* Needed for Chrome bug */
  transform: scale3d(1, 1, 1);
  transform-origin: 0% 50%;
  transition: transform 0.3s;
}

.input__label-content--hideo {
  position: absolute;
  top: 100%;
}

.input__field--hideo:focus {
  transform: translate3d(0, 0, 0);
}

.input__field--hideo:focus + .input__label--hideo::before {
  transform: scale3d(0.8, 1, 1);
}

.input__field--hideo:focus + .input__label--hideo .icon--hideo {
  transform: scale3d(0.6, 0.6, 1);
}

/* Madoka */
.input--madoka {
  margin: 1.1em;
}

.input__field--madoka {
  width: 100%;
  background: transparent;
  color: #7A7593;
}

.input__label--madoka {
  position: absolute;
  width: 100%;
  height: 100%;
  color: #7A7593;
  text-align: left;
  cursor: text;
}

.input__label-content--madoka {
  transform-origin: 0% 50%;
  transition: transform 0.3s;
}

.graphic--madoka {
  transform: scale3d(1, -1, 1);
  transition: stroke-dashoffset 0.3s;
  pointer-events: none;
  stroke: #7A7593;
  stroke-width: 4px;
  stroke-dasharray: 962;
  stroke-dashoffset: 558;
}

.input__field--madoka:focus + .input__label--madoka,
.input--filled .input__label--madoka {
  cursor: default;
  pointer-events: none;
}

.input__field--madoka:focus + .input__label--madoka .graphic--madoka,
.input--filled .graphic--madoka {
  stroke-dashoffset: 0;
}

.input__field--madoka:focus + .input__label--madoka .input__label-content--madoka,
.input--filled .input__label-content--madoka {
  transform: scale3d(0.81, 0.81, 1) translate3d(0, 4em, 0);
}

/* Kaede */
.input--kaede {
  display: block;
  overflow: hidden;
  margin: 1em auto 2em;
  background: #EFEEEE;
}

.input__field--kaede {
  position: absolute;
  top: 0;
  right: 100%;
  width: 60%;
  height: 100%;
  background: #fff;
  color: #9DABBA;
  transition: transform 0.5s;
  transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}

.input__label--kaede {
  z-index: 10;
  display: block;
  width: 100%;
  height: 100%;
  text-align: left;
  cursor: text;
  transform-origin: 0% 50%;
  transition: transform 0.5s;
  transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}

.input__label-content--kaede {
  padding: 1.5em 0;
}

.input__field--kaede:focus,
.input--filled .input__field--kaede {
  transform: translate3d(100%, 0, 0);
  transition-delay: 0.06s;
}

.input__field--kaede:focus + .input__label--kaede,
.input--filled .input__label--kaede {
  transform: translate3d(60%, 0, 0);
  pointer-events: none;
}

@media screen and (max-width: 34em) {
  .input__field--kaede:focus + .input__label--kaede,
  .input--filled .input__label--kaede {
    transform: translate3d(65%, 0, 0) scale3d(0.65, 0.65, 1);
    pointer-events: none;
  }
}
/* Isao */
.input__field--isao {
  z-index: 10;
  padding: 0.75em 0.1em 0.25em;
  width: 100%;
  background: transparent;
  color: #afb3b8;
}

.input__label--isao {
  position: relative;
  overflow: hidden;
  padding: 0;
  width: 100%;
  color: #dadada;
  text-align: left;
}

.input__label--isao::before {
  content: "";
  position: absolute;
  top: 0;
  width: 100%;
  height: 7px;
  background: #dadada;
  transform: scale3d(1, 0.4, 1);
  transform-origin: 50% 100%;
  transition: transform 0.3s, background-color 0.3s;
  transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}

.input__label--isao::after {
  content: attr(data-content);
  position: absolute;
  top: 0;
  left: 0;
  padding: 0.75em 0.15em;
  color: #da7071;
  opacity: 0;
  transform: translate3d(0, 50%, 0);
  transition: opacity 0.3s, transform 0.3s;
  transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
  pointer-events: none;
}

.input__field--isao:focus + .input__label--isao::before {
  background-color: #da7071;
  transform: scale3d(1, 1, 1);
}

.input__field--isao:focus + .input__label--isao {
  pointer-events: none;
}

.input__field--isao:focus + .input__label--isao::after {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.input__label-content--isao {
  padding: 0.75em 0.15em;
  transition: opacity 0.3s, transform 0.3s;
  transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}

.input__field--isao:focus + .input__label--isao .input__label-content--isao {
  opacity: 0;
  transform: translate3d(0, -50%, 0);
}

.input__field--hoshi.input__datepicker {
  background-image: url(../img/konfigurator/icon_kalender.svg);
  background-position: 98% 0%;
  background-repeat: no-repeat;
}

.input__field--hoshi:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px white inset !important;
}

/* Mixins */
/* Animations */
@keyframes bounce {
  0% {
    transform: scale(1);
  }
  33% {
    transform: scale(0.9);
  }
  66% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
/* Base Styles */
html {
  font-size: 16px;
}

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

/* Component Styles - Steps */
.steps {
  display: flex;
  width: 100%;
  margin: 20px 0px 0px 0px;
  padding: 0 0 1rem 0;
  list-style: none;
}

.step {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  flex: 1;
  position: relative;
  pointer-events: none;
}
.step--active, .step--complete {
  cursor: pointer;
  pointer-events: all;
}
.step:not(:last-child):before, .step:not(:last-child):after {
  display: block;
  position: absolute;
  margin-top: 10px;
  top: 50%;
  left: 50%;
  height: 0.1rem;
  content: "";
  transform: translateY(-50%);
  will-change: width;
  z-index: 0;
}
.step:before {
  width: 100%;
  background-color: #a5d87c;
}
.step:after {
  width: 0;
  background-color: #ffffff;
}
.step--complete:after {
  width: 100% !important;
  opacity: 1;
  transition: width 0.6s ease-in-out, opacity 0.6s ease-in-out;
}

.step__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  margin-top: 20px;
  width: 20px;
  height: 20px;
  background-color: #a5d87c;
  border: 3px solid #69be28;
  border-radius: 50%;
  color: transparent;
  font-size: 15px;
  z-index: 2;
}
.step__icon:before {
  display: block;
  content: "✓";
  padding-top: 4px;
}
.step--complete.step--active .step__icon {
  color: #fff;
  transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out;
}
.step--incomplete.step--active .step__icon {
  border-color: #69be28;
  background-color: #ffffff;
  transition-delay: 0.5s;
}
.step--complete .step__icon {
  animation: bounce 0.5s ease-in-out;
  background-color: #ffffff;
  border-color: #ffffff;
  color: #69be28;
}

.step__label {
  position: absolute;
  left: 50%;
  margin-top: -1rem;
  transform: translateX(-50%);
  color: #ffffff;
}
.step--incomplete.step--inactive .step__label {
  color: #a5d87c;
}
.step--incomplete.step--active .step__label {
  color: #ffffff;
}
.step--active .step__label {
  transition: color 0.3s ease-in-out;
  transition-delay: 0.5s;
  color: #ffffff;
}

/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}
.slick-list:focus {
  outline: none;
}
.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
}
.slick-track:before, .slick-track:after {
  content: "";
  display: table;
}
.slick-track:after {
  clear: both;
}
.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}
[dir=rtl] .slick-slide {
  float: right;
}
.slick-slide img {
  display: block;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

/* Slider */
/* Icons */
@font-face {
  font-family: "slick";
  src: url("./fonts/slick.eot");
  src: url("./fonts/slick.eot?#iefix") format("embedded-opentype"), url("./fonts/slick.woff") format("woff"), url("./fonts/slick.ttf") format("truetype"), url("./fonts/slick.svg#slick") format("svg");
  font-weight: normal;
  font-style: normal;
}
/* Arrows */
.slick-prev,
.slick-next {
  position: absolute;
  display: block;
  height: 40px;
  width: 40px;
  line-height: 0px;
  font-size: 0px;
  cursor: pointer;
  background: transparent;
  color: transparent;
  top: 45%;
  transform: translate(0, -50%);
  padding: 0;
  border: none;
  outline: none;
}

.slick-prev {
  left: -20px;
}
[dir=rtl] .slick-prev {
  left: auto;
  right: -25px;
}

.slick-next {
  right: 10px;
}
[dir=rtl] .slick-next {
  left: -25px;
  right: auto;
}

/* Dots */
.slick-dotted.slick-slider {
  margin-bottom: 30px;
}

.slick-dots {
  position: absolute;
  bottom: -25px;
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  margin: 0;
  width: 100%;
}
.slick-dots li {
  position: relative;
  display: inline-block;
  height: 20px;
  width: 20px;
  margin: 0 5px;
  padding: 0;
  cursor: pointer;
}
.slick-dots li button {
  border: 0;
  background: transparent;
  display: block;
  height: 20px;
  width: 20px;
  outline: none;
  line-height: 0px;
  font-size: 0px;
  color: transparent;
  padding: 5px;
  cursor: pointer;
}
.slick-dots li button:hover, .slick-dots li button:focus {
  outline: none;
}
.slick-dots li button:hover:before, .slick-dots li button:focus:before {
  opacity: 1;
}
.slick-dots li button:before {
  position: absolute;
  top: 0;
  left: 0;
  content: "•";
  width: 20px;
  height: 20px;
  font-family: "slick";
  font-size: 6px;
  line-height: 20px;
  text-align: center;
  color: black;
  opacity: 0.25;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before {
  color: black;
  opacity: 0.75;
}

.tooltipster-fall, .tooltipster-grow.tooltipster-show {
  -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
  -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
}

.tooltipster-base {
  display: flex;
  pointer-events: none;
  position: absolute;
}

.tooltipster-box {
  flex: 1 1 auto;
}

.tooltipster-content {
  box-sizing: border-box;
  max-height: 100%;
  max-width: 100%;
  overflow: auto;
}

.tooltipster-ruler {
  bottom: 0;
  left: 0;
  overflow: hidden;
  position: fixed;
  right: 0;
  top: 0;
  visibility: hidden;
}

.tooltipster-fade {
  opacity: 0;
  transition-property: opacity;
}

.tooltipster-fade.tooltipster-show {
  opacity: 1;
}

.tooltipster-grow {
  transform: scale(0, 0);
  transition-property: transform;
  -webkit-backface-visibility: hidden;
}

.tooltipster-grow.tooltipster-show {
  transform: scale(1, 1);
  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
}

.tooltipster-swing {
  opacity: 0;
  transform: rotateZ(4deg);
  transition-property: transform;
}

.tooltipster-swing.tooltipster-show {
  opacity: 1;
  transform: rotateZ(0);
  transition-timing-function: cubic-bezier(0.23, 0.635, 0.495, 2.4);
}

.tooltipster-fall {
  transition-property: top;
  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
}

.tooltipster-fall.tooltipster-initial {
  top: 0 !important;
}

.tooltipster-fall.tooltipster-dying {
  transition-property: all;
  top: 0 !important;
  opacity: 0;
}

.tooltipster-slide {
  transition-property: left;
  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.15);
}

.tooltipster-slide.tooltipster-initial {
  left: -40px !important;
}

.tooltipster-slide.tooltipster-dying {
  transition-property: all;
  left: 0 !important;
  opacity: 0;
}

@keyframes tooltipster-fading {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.tooltipster-update-fade {
  animation: tooltipster-fading 0.4s;
}

@keyframes tooltipster-rotating {
  25% {
    transform: rotate(-2deg);
  }
  75% {
    transform: rotate(2deg);
  }
  100% {
    transform: rotate(0);
  }
}
.tooltipster-update-rotate {
  animation: tooltipster-rotating 0.6s;
}

@keyframes tooltipster-scaling {
  50% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
.tooltipster-update-scale {
  animation: tooltipster-scaling 0.6s;
}

.tooltipster-sidetip .tooltipster-box {
  background: #565656;
  border: 2px solid #000;
  border-radius: 4px;
}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-box {
  margin-top: 8px;
}

.tooltipster-sidetip.tooltipster-left .tooltipster-box {
  margin-right: 8px;
}

.tooltipster-sidetip.tooltipster-right .tooltipster-box {
  margin-left: 8px;
}

.tooltipster-sidetip.tooltipster-top .tooltipster-box {
  margin-bottom: 8px;
}

.tooltipster-sidetip .tooltipster-content {
  color: #fff;
  line-height: 18px;
  padding: 6px 14px;
}

.tooltipster-sidetip .tooltipster-arrow {
  overflow: hidden;
  position: absolute;
}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow {
  height: 10px;
  margin-left: -10px;
  top: 0;
  width: 20px;
}

.tooltipster-sidetip.tooltipster-left .tooltipster-arrow {
  height: 20px;
  margin-top: -10px;
  right: 0;
  top: 0;
  width: 10px;
}

.tooltipster-sidetip.tooltipster-right .tooltipster-arrow {
  height: 20px;
  margin-top: -10px;
  left: 0;
  top: 0;
  width: 10px;
}

.tooltipster-sidetip.tooltipster-top .tooltipster-arrow {
  bottom: 0;
  height: 10px;
  margin-left: -10px;
  width: 20px;
}

.tooltipster-sidetip .tooltipster-arrow-background, .tooltipster-sidetip .tooltipster-arrow-border {
  height: 0;
  position: absolute;
  width: 0;
}

.tooltipster-sidetip .tooltipster-arrow-background {
  border: 10px solid transparent;
}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-background {
  border-bottom-color: #565656;
  left: 0;
  top: 3px;
}

.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-background {
  border-left-color: #565656;
  left: -3px;
  top: 0;
}

.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-background {
  border-right-color: #565656;
  left: 3px;
  top: 0;
}

.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-background {
  border-top-color: #565656;
  left: 0;
  top: -3px;
}

.tooltipster-sidetip .tooltipster-arrow-border {
  border: 10px solid transparent;
  left: 0;
  top: 0;
}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-border {
  border-bottom-color: #000;
}

.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-border {
  border-left-color: #000;
}

.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-border {
  border-right-color: #000;
}

.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-border {
  border-top-color: #000;
}

.tooltipster-sidetip .tooltipster-arrow-uncropped {
  position: relative;
}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-uncropped {
  top: -10px;
}

.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-uncropped {
  left: -10px;
}

.tooltipster-sidetip.tooltipster-borderless .tooltipster-box {
  border: none;
  background: #1b1b1b;
  background: rgba(10, 10, 10, 0.9);
}

.tooltipster-sidetip.tooltipster-borderless.tooltipster-bottom .tooltipster-box {
  margin-top: 8px;
}

.tooltipster-sidetip.tooltipster-borderless.tooltipster-left .tooltipster-box {
  margin-right: 8px;
}

.tooltipster-sidetip.tooltipster-borderless.tooltipster-right .tooltipster-box {
  margin-left: 8px;
}

.tooltipster-sidetip.tooltipster-borderless.tooltipster-top .tooltipster-box {
  margin-bottom: 8px;
}

.tooltipster-sidetip.tooltipster-borderless .tooltipster-arrow {
  height: 8px;
  margin-left: -8px;
  width: 16px;
}

.tooltipster-sidetip.tooltipster-borderless.tooltipster-left .tooltipster-arrow, .tooltipster-sidetip.tooltipster-borderless.tooltipster-right .tooltipster-arrow {
  height: 16px;
  margin-left: 0;
  margin-top: -8px;
  width: 8px;
}

.tooltipster-sidetip.tooltipster-borderless .tooltipster-arrow-background {
  display: none;
}

.tooltipster-sidetip.tooltipster-borderless .tooltipster-arrow-border {
  border: 8px solid transparent;
}

.tooltipster-sidetip.tooltipster-borderless.tooltipster-bottom .tooltipster-arrow-border {
  border-bottom-color: #1b1b1b;
  border-bottom-color: rgba(10, 10, 10, 0.9);
}

.tooltipster-sidetip.tooltipster-borderless.tooltipster-left .tooltipster-arrow-border {
  border-left-color: #1b1b1b;
  border-left-color: rgba(10, 10, 10, 0.9);
}

.tooltipster-sidetip.tooltipster-borderless.tooltipster-right .tooltipster-arrow-border {
  border-right-color: #1b1b1b;
  border-right-color: rgba(10, 10, 10, 0.9);
}

.tooltipster-sidetip.tooltipster-borderless.tooltipster-top .tooltipster-arrow-border {
  border-top-color: #1b1b1b;
  border-top-color: rgba(10, 10, 10, 0.9);
}

.tooltipster-sidetip.tooltipster-borderless.tooltipster-bottom .tooltipster-arrow-uncropped {
  top: -8px;
}

.tooltipster-sidetip.tooltipster-borderless.tooltipster-right .tooltipster-arrow-uncropped {
  left: -8px;
}

/*!
 * Datetimepicker for Bootstrap 3
 * ! version : 4.7.14
 * https://github.com/Eonasdan/bootstrap-datetimepicker/
 */
.bootstrap-datetimepicker-widget {
  list-style: none;
  background-color: #f5f5f5;
}
.bootstrap-datetimepicker-widget.dropdown-menu {
  margin: 30px 0;
  padding: 4px;
  width: 19em;
}
@media (min-width: 768px) {
  .bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
    width: 38em;
  }
}
@media (min-width: 991px) {
  .bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
    width: 38em;
  }
}
@media (min-width: 1219px) {
  .bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
    width: 38em;
  }
}
.bootstrap-datetimepicker-widget.dropdown-menu:before, .bootstrap-datetimepicker-widget.dropdown-menu:after {
  content: "";
  display: inline-block;
  position: absolute;
}
.bootstrap-datetimepicker-widget.dropdown-menu.bottom:before {
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 7px solid #f5f5f5;
  border-bottom-color: rgba(0, 0, 0, 0.2);
  top: -7px;
  left: 7px;
}
.bootstrap-datetimepicker-widget.dropdown-menu.bottom:after {
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #ffffff;
  top: -6px;
  left: 8px;
}
.bootstrap-datetimepicker-widget.dropdown-menu.top:before {
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 7px solid #f5f5f5;
  border-top-color: rgba(0, 0, 0, 0.2);
  bottom: -7px;
  left: 6px;
}
.bootstrap-datetimepicker-widget.dropdown-menu.top:after {
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #ffffff;
  bottom: -6px;
  left: 7px;
}
.bootstrap-datetimepicker-widget.dropdown-menu.pull-right:before {
  left: auto;
  right: 6px;
}
.bootstrap-datetimepicker-widget.dropdown-menu.pull-right:after {
  left: auto;
  right: 7px;
}
.bootstrap-datetimepicker-widget .list-unstyled {
  margin: 0;
}
.bootstrap-datetimepicker-widget a[data-action] {
  padding: 6px 0;
}
.bootstrap-datetimepicker-widget a[data-action]:active {
  box-shadow: none;
}
.bootstrap-datetimepicker-widget .timepicker-hour, .bootstrap-datetimepicker-widget .timepicker-minute, .bootstrap-datetimepicker-widget .timepicker-second {
  width: 54px;
  font-weight: bold;
  font-size: 1em;
  margin: 0;
}
.bootstrap-datetimepicker-widget button[data-action] {
  padding: 6px;
}
.bootstrap-datetimepicker-widget .btn[data-action=incrementHours]::after {
  content: "Increment Hours";
  display: none;
}
.bootstrap-datetimepicker-widget .btn[data-action=incrementMinutes]::after {
  content: "Increment Minutes";
  display: none;
}
.bootstrap-datetimepicker-widget .btn[data-action=decrementHours]::after {
  content: "Decrement Hours";
  display: none;
}
.bootstrap-datetimepicker-widget .btn[data-action=decrementMinutes]::after {
  content: "Decrement Minutes";
  display: none;
}
.bootstrap-datetimepicker-widget .btn[data-action=showHours]::after {
  content: "Show Hours";
  display: none;
}
.bootstrap-datetimepicker-widget .btn[data-action=showMinutes]::after {
  content: "Show Minutes";
  display: none;
}
.bootstrap-datetimepicker-widget .btn[data-action=togglePeriod]::after {
  content: "Toggle AM/PM";
  display: none;
}
.bootstrap-datetimepicker-widget .btn[data-action=clear]::after {
  content: "Clear the picker";
  display: none;
}
.bootstrap-datetimepicker-widget .btn[data-action=today]::after {
  content: "Set the date to today";
  display: none;
}
.bootstrap-datetimepicker-widget .picker-switch {
  text-align: center;
}
.bootstrap-datetimepicker-widget .picker-switch::after {
  content: "Toggle Date and Time Screens";
  display: none;
}
.bootstrap-datetimepicker-widget .picker-switch td {
  padding: 0;
  margin: 0;
  height: auto;
  width: auto;
  line-height: inherit;
}
.bootstrap-datetimepicker-widget .picker-switch td span {
  line-height: 2.5;
  height: 2.5em;
  width: 100%;
}
.bootstrap-datetimepicker-widget table {
  width: 100%;
  margin: 0;
}
.bootstrap-datetimepicker-widget table td, .bootstrap-datetimepicker-widget table th {
  text-align: center;
}
.bootstrap-datetimepicker-widget table th {
  height: 46px;
  line-height: 20px;
  width: 20px;
  color: #262626;
  font-family: "houschka-pro-demibold", Helvetica, sans-serif;
}
.bootstrap-datetimepicker-widget table th.dow {
  color: #69be28;
  font-family: "houschka-pro-light", Helvetica, sans-serif;
}
.bootstrap-datetimepicker-widget table th.picker-switch {
  width: 145px;
}
.bootstrap-datetimepicker-widget table th.disabled, .bootstrap-datetimepicker-widget table th.disabled:hover {
  background: none;
  color: #262626;
  cursor: not-allowed;
}
.bootstrap-datetimepicker-widget table th.prev::after {
  content: "Previous Month";
  display: none;
}
.bootstrap-datetimepicker-widget table th.next::after {
  content: "Next Month";
  display: none;
}
.bootstrap-datetimepicker-widget table thead tr:first-child th {
  cursor: pointer;
}
.bootstrap-datetimepicker-widget table thead tr:first-child th:hover {
  background: #cccccc;
}
.bootstrap-datetimepicker-widget table td {
  height: 20px;
  line-height: 20px;
  width: 20px;
  border-radius: 50%;
}
.bootstrap-datetimepicker-widget table td.cw {
  font-size: 0.8em;
  height: 20px;
  line-height: 20px;
  color: #666666;
}
.bootstrap-datetimepicker-widget table td.day {
  height: 46px;
  line-height: 20px;
  width: 20px;
}
.bootstrap-datetimepicker-widget table td.day:hover, .bootstrap-datetimepicker-widget table td.hour:hover, .bootstrap-datetimepicker-widget table td.minute:hover, .bootstrap-datetimepicker-widget table td.second:hover {
  background: #cccccc;
  cursor: pointer;
}
.bootstrap-datetimepicker-widget table td.old, .bootstrap-datetimepicker-widget table td.new {
  color: #666666;
}
.bootstrap-datetimepicker-widget table td.today {
  position: relative;
}
.bootstrap-datetimepicker-widget table td.today:before {
  content: "";
  display: inline-block;
  border: 0 0 7px 7px solid transparent;
  border-bottom-color: #69be28;
  border-top-color: rgba(0, 0, 0, 0.2);
  position: absolute;
  bottom: 4px;
  right: 4px;
}
.bootstrap-datetimepicker-widget table td.active, .bootstrap-datetimepicker-widget table td.active:hover {
  background-color: #69be28;
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.bootstrap-datetimepicker-widget table td.active.today:before {
  border-bottom-color: #fff;
}
.bootstrap-datetimepicker-widget table td.disabled, .bootstrap-datetimepicker-widget table td.disabled:hover {
  background: none;
  color: #262626;
  cursor: not-allowed;
}
.bootstrap-datetimepicker-widget table td span {
  display: inline-block;
  width: 54px;
  height: 54px;
  line-height: 54px;
  margin: 2px 1.5px;
  cursor: pointer;
  border-radius: 50%;
}
.bootstrap-datetimepicker-widget table td span:hover {
  background: #cccccc;
}
.bootstrap-datetimepicker-widget table td span.active {
  background-color: #69be28;
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.bootstrap-datetimepicker-widget table td span.old {
  color: #666666;
}
.bootstrap-datetimepicker-widget table td span.disabled, .bootstrap-datetimepicker-widget table td span.disabled:hover {
  background: none;
  color: #262626;
  cursor: not-allowed;
}
.bootstrap-datetimepicker-widget.usetwentyfour td.hour {
  height: 27px;
  line-height: 27px;
}

.input-group.date .input-group-addon {
  cursor: pointer;
}

/*! =======================================================
                      VERSION  9.1.1
========================================================= */
/*! =========================================================
 * bootstrap-slider.js
 *
 * Maintainers:
 *		Kyle Kemp
 *			- Twitter: @seiyria
 *			- Github:  seiyria
 *		Rohit Kalkur
 *			- Twitter: @Rovolutionary
 *			- Github:  rovolution
 *
 * =========================================================
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 * ========================================================= */
.slider {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  margin-top: 10px;
  margin-bottom: 20px;
}

.slider.slider-horizontal {
  width: 100%;
  height: 20px;
}

.slider.slider-horizontal .slider-track {
  height: 10px;
  width: 100%;
  margin-top: -5px;
  top: 50%;
  left: 0;
}

.slider.slider-horizontal .slider-selection,
.slider.slider-horizontal .slider-track-low,
.slider.slider-horizontal .slider-track-high {
  height: 100%;
  top: 0;
  bottom: 0;
}

.slider.slider-horizontal .slider-tick,
.slider.slider-horizontal .slider-handle {
  margin-left: -10px;
}

.slider.slider-horizontal .slider-tick.triangle,
.slider.slider-horizontal .slider-handle.triangle {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  border-width: 0 10px 10px 10px;
  width: 0;
  height: 0;
  border-bottom-color: #cccccc;
  margin-top: 0;
}

.slider.slider-horizontal .slider-tick-container {
  white-space: nowrap;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.slider.slider-horizontal .slider-tick-label-container {
  white-space: nowrap;
  margin-top: 20px;
}

.slider.slider-horizontal .slider-tick-label-container .slider-tick-label {
  padding-top: 4px;
  display: inline-block;
  text-align: center;
}

.slider.slider-vertical {
  height: 210px;
  width: 20px;
}

.slider.slider-vertical .slider-track {
  width: 10px;
  height: 100%;
  left: 25%;
  top: 0;
}

.slider.slider-vertical .slider-selection {
  width: 100%;
  left: 0;
  top: 0;
  bottom: 0;
}

.slider.slider-vertical .slider-track-low,
.slider.slider-vertical .slider-track-high {
  width: 100%;
  left: 0;
  right: 0;
}

.slider.slider-vertical .slider-tick,
.slider.slider-vertical .slider-handle {
  margin-top: -10px;
}

.slider.slider-vertical .slider-tick.triangle,
.slider.slider-vertical .slider-handle.triangle {
  border-width: 10px 0 10px 10px;
  width: 1px;
  height: 1px;
  border-left-color: #cccccc;
  margin-left: 0;
}

.slider.slider-vertical .slider-tick-label-container {
  white-space: nowrap;
}

.slider.slider-vertical .slider-tick-label-container .slider-tick-label {
  padding-left: 4px;
}

.slider.slider-disabled .slider-handle {
  background-image: linear-gradient(to bottom, #dfdfdf 0%, #bebebe 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffdfdfdf", endColorstr="#ffbebebe", GradientType=0);
}

.slider.slider-disabled .slider-track {
  background-image: linear-gradient(to bottom, #e5e5e5 0%, #e9e9e9 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffe5e5e5", endColorstr="#ffe9e9e9", GradientType=0);
  cursor: not-allowed;
}

.slider input {
  display: none;
}

.slider .tooltip.top {
  margin-top: -40px;
  margin-left: 0px;
}

.slider .tooltip.top .tooltip-arrow {
  border-top-color: #69be28;
}

.slider .tooltip-inner {
  white-space: nowrap;
  max-width: none;
  background-color: #69be28;
  color: #ffffff;
}

.slider .hide {
  display: none;
}

.slider-track {
  position: absolute;
  cursor: pointer;
  border-bottom: 1px solid #cccccc;
  border-radius: 0px;
}

.slider-selection {
  position: absolute;
  box-sizing: border-box;
  border-radius: 0px;
  border-bottom: 2px solid #69be28;
}

.slider-selection.tick-slider-selection {
  background-image: linear-gradient(to bottom, #89cdef 0%, #81bfde 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff89cdef", endColorstr="#ff81bfde", GradientType=0);
}

.slider-track-low,
.slider-track-high {
  position: absolute;
  background: transparent;
  box-sizing: border-box;
  border-radius: 0px;
}

.slider-handle {
  position: absolute;
  top: 0px;
  width: 30px;
  height: 30px;
  background-color: #ffffff;
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff149bdf", endColorstr="#ff0480be", GradientType=0);
  filter: none;
  box-shadow: 4px 4px 0 rgba(255, 255, 255, 0.2), 0px 0px 5px rgba(0, 0, 0, 0.5);
  border: 1px solid #cccccc;
}

.slider-handle.round {
  border-radius: 50%;
}

.slider-handle.triangle {
  background: transparent none;
}

.slider-handle.custom {
  background: transparent none;
}

.slider-handle.custom::before {
  line-height: 20px;
  font-size: 20px;
  content: "★";
  color: #726204;
}

.slider-tick {
  position: absolute;
  width: 20px;
  height: 20px;
  background-image: linear-gradient(to bottom, #f9f9f9 0%, #f5f5f5 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#fff9f9f9", endColorstr="#fff5f5f5", GradientType=0);
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  box-sizing: border-box;
  filter: none;
  opacity: 0.8;
  border: 0px solid transparent;
}

.slider-tick.round {
  border-radius: 50%;
}

.slider-tick.triangle {
  background: transparent none;
}

.slider-tick.custom {
  background: transparent none;
}

.slider-tick.custom::before {
  line-height: 20px;
  font-size: 20px;
  content: "★";
  color: #726204;
}

.slider-tick.in-selection {
  background-image: linear-gradient(to bottom, #89cdef 0%, #81bfde 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff89cdef", endColorstr="#ff81bfde", GradientType=0);
  opacity: 1;
}

/*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license */
/*
	Styles for basic PhotoSwipe functionality (sliding area, open/close transitions)
*/
/* pswp = photoswipe */
.pswp {
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  overflow: hidden;
  touch-action: none;
  z-index: 1500;
  -webkit-text-size-adjust: 100%;
  /* create separate layer, to avoid paint on window.onscroll in webkit/blink */
  -webkit-backface-visibility: hidden;
  outline: none;
}

.pswp * {
  box-sizing: border-box;
}

.pswp img {
  max-width: none;
}

/* style is added when JS option showHideOpacity is set to true */
.pswp--animate_opacity {
  /* 0.001, because opacity:0 doesn't trigger Paint action, which causes lag at start of transition */
  opacity: 0.001;
  will-change: opacity;
  /* for open/close transition */
  transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
}

.pswp--open {
  display: block;
}

.pswp--zoom-allowed .pswp__img {
  /* autoprefixer: off */
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
  cursor: zoom-in;
}

.pswp--zoomed-in .pswp__img {
  /* autoprefixer: off */
  cursor: -webkit-grab;
  cursor: -moz-grab;
  cursor: grab;
}

.pswp--dragging .pswp__img {
  /* autoprefixer: off */
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
  cursor: grabbing;
}

/*
	Background is added as a separate element.
	As animating opacity is much faster than animating rgba() background-color.
*/
.pswp__bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0;
  -webkit-backface-visibility: hidden;
  will-change: opacity;
}

.pswp__scroll-wrap {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.pswp__container,
.pswp__zoom-wrap {
  touch-action: none;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

/* Prevent selection and tap highlights */
.pswp__container,
.pswp__img {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}

.pswp__zoom-wrap {
  position: absolute;
  width: 100%;
  transform-origin: left top;
  /* for open/close transition */
  transition: transform 333ms cubic-bezier(0.4, 0, 0.22, 1);
}

.pswp__bg {
  will-change: opacity;
  /* for open/close transition */
  transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
}

.pswp--animated-in .pswp__bg,
.pswp--animated-in .pswp__zoom-wrap {
  transition: none;
}

.pswp__container,
.pswp__zoom-wrap {
  -webkit-backface-visibility: hidden;
}

.pswp__item {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  overflow: hidden;
}

.pswp__img {
  position: absolute;
  width: auto;
  height: auto;
  top: 0;
  left: 0;
}

/*
	stretched thumbnail or div placeholder element (see below)
	style is added to avoid flickering in webkit/blink when layers overlap
*/
.pswp__img--placeholder {
  -webkit-backface-visibility: hidden;
}

/*
	div element that matches size of large image
	large image loads on top of it
*/
.pswp__img--placeholder--blank {
  background: #222;
}

.pswp--ie .pswp__img {
  width: 100% !important;
  height: auto !important;
  left: 0;
  top: 0;
}

/*
	Error message appears when image is not loaded
	(JS option errorMsg controls markup)
*/
.pswp__error-msg {
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  text-align: center;
  font-size: 14px;
  line-height: 16px;
  margin-top: -8px;
  color: #CCC;
}

.pswp__error-msg a {
  color: #CCC;
  text-decoration: underline;
}

.mpshop-overlay .content.page, .mpshop-widget .content.page {
  display: none;
}
.mpshop-overlay .content.page:first-of-type, .mpshop-widget .content.page:first-of-type {
  display: block;
}

.mpshop-overlay {
  display: none;
  margin: 0;
  padding: 0;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: #ffffff;
  z-index: 1000000;
  overflow: scroll;
}
.mpshop-overlay .icon-close {
  position: absolute;
  right: 40px;
  top: 40px;
  background-image: url(../img/konfigurator/btn_close.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
  width: 25px;
  height: 25px;
}
.mpshop-overlay .icon-close.icon-white {
  top: 33px;
  background-image: url(../img/btn_close.svg);
}
.mpshop-overlay .icon-back {
  position: absolute;
  left: 20px;
  top: 20px;
  background-image: url(../img/konfigurator/btn_back.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
  width: 20px;
  height: 20px;
}
.mpshop-overlay .icon-back.icon-white {
  top: 20px;
  background-image: url(../img/btn_back.svg);
}
.mpshop-overlay .container {
  margin-top: 25vh;
  margin-bottom: 25vh;
}
.mpshop-overlay.menge-nicht-verfuegbar-danke {
  text-align: center;
}
.mpshop-overlay.streckenanfrage-step .header {
  padding-left: 30px;
}
.mpshop-overlay.streckenanfrage-step .container {
  margin-top: 0;
  margin-bottom: 0;
}
.mpshop-overlay.streckenanfrage-step .circle {
  position: relative;
  width: 100%;
  padding-bottom: 100%;
  border-radius: 50%;
  background-color: #ffffff;
}
.mpshop-overlay.streckenanfrage-step .circle .icon {
  position: absolute;
  lefT: 50%;
  top: 50%;
  margin-top: -32px;
  margin-left: -32px;
}
.mpshop-overlay.streckenanfrage-step .text {
  position: relative;
  left: 0;
  height: 140px;
  line-height: 140px;
}
.mpshop-overlay.streckenanfrage-step .text .text-inner {
  display: inline-block;
  vertical-align: middle;
  line-height: 13px;
}

.step {
  pointer-events: all;
}

.checkout-index-index .col-main {
  width: 100%;
}

.checkout-index-index, .wrapper {
  background-color: white !important;
}

#opc-shipping_method input[name=besonderheiten] {
  width: 100%;
}

.mpshop-widget .btn-lieferregion {
  background-image: none !important;
  cursor: default !important;
}

.checkout-index-index .order-review .checkout-uebersicht .rechnungsadresse, .checkout-index-index .order-review .checkout-uebersicht .lieferadresse, .checkout-index-index .order-review .checkout-uebersicht .zahlungsoption {
  width: 33%;
  float: left;
}
@media screen and (max-width: 768px) {
  .checkout-index-index .order-review .checkout-uebersicht .rechnungsadresse, .checkout-index-index .order-review .checkout-uebersicht .lieferadresse, .checkout-index-index .order-review .checkout-uebersicht .zahlungsoption {
    width: 100%;
  }
}
.checkout-index-index .order-review .checkout-uebersicht .positionen > div:first-child, .checkout-index-index .order-review .checkout-uebersicht .summary .container > .row {
  padding-top: 60px;
  /*margin-left: 25%;*/
  width: 100%;
}
.checkout-index-index .order-review .checkout-uebersicht .positionen .row.position > div:first-of-type {
  width: 16%;
  float: left;
}
.checkout-index-index .order-review .checkout-uebersicht .positionen .row.position > div:nth-of-type(2) {
  width: 58%;
  float: left;
}
.checkout-index-index .order-review .checkout-uebersicht .positionen .row.position {
  display: flex;
}
.checkout-index-index .order-review .checkout-uebersicht .positionen .row.position > div:nth-of-type(3) {
  width: 25%;
  float: left;
  position: relative;
}
.checkout-index-index .order-review .checkout-uebersicht .zusammenfassung .block, .checkout-index-index .order-review .checkout-uebersicht .agreement .block {
  padding-left: 25%;
  padding-right: 25%;
}
.checkout-index-index .order-review .checkout-uebersicht .agreement .block {
  padding-bottom: 20px;
}
.checkout-index-index .order-review .checkout-uebersicht .zusammenfassung .row.sum {
  height: 24px;
}
.checkout-index-index .order-review .checkout-uebersicht .zusammenfassung .row.sum > div:first-of-type {
  width: 50%;
  float: left;
}
.checkout-index-index .order-review .checkout-uebersicht .zusammenfassung .row.sum > div:nth-of-type(2) {
  width: 50%;
  float: left;
  text-align: right;
}

#address_country_id,
#address_region_id,
#button_navi {
  font-size: 13px;
  text-transform: uppercase;
  color: gray;
  letter-spacing: 2px;
  font-weight: lighter;
  margin-left: -8px;
}

.conf-format .select-style {
  border: 20px solid white;
}

#checkout-status .h1b {
  margin-top: 25px;
}
@media screen and (max-width: 991px) {
  #checkout-status {
    display: none;
  }
}

#checkout input[type=radio] + label:not(old),
#checkout input[type=checkbox] + label:not(old) {
  margin-left: 0;
  display: inline-block;
}
#checkout .col-method {
  min-width: 50px;
}
#checkout .col-method input[type=radio] + label:not(old),
#checkout .col-method input[type=checkbox] + label:not(old) {
  position: absolute;
}
#checkout .btn {
  font-size: 14px;
}
#checkout input[type=email], #checkout input[type=search], #checkout input[type=number], #checkout input[type=password], #checkout input[type=tel],
#checkout input[type=text] {
  width: 100%;
  border: none;
  border-bottom: 1px solid #cccccc;
  height: 40px;
  padding: 10px;
}
#checkout input[type=email].input__field--hoshi, #checkout input[type=search].input__field--hoshi, #checkout input[type=number].input__field--hoshi, #checkout input[type=password].input__field--hoshi, #checkout input[type=tel].input__field--hoshi,
#checkout input[type=text].input__field--hoshi {
  border-bottom: none;
}
#checkout select {
  font-size: 13px;
  text-transform: uppercase;
  color: gray;
  letter-spacing: 2px;
  font-weight: lighter;
  font-family: "houschka-pro-demibold", serif;
  color: #262626;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
#checkout .checkout-agreement {
  text-align: left;
  padding-left: 23px;
}
#checkout .company {
  font-variant: petite-caps;
  font-weight: bolder;
  letter-spacing: 0.15rem;
}
#checkout .position-price {
  font-size: 16px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 0;
  border: none;
  background-color: #FFF;
}
#checkout .address-management {
  margin: 13px 0 20px 0;
}
#checkout .actions-toolbar {
  margin-top: 10px;
}

/*#co-payment-form {
  img {
    display: none;
  }
}*/
#billing-new-address-form {
  background-color: #ffffff;
  border: 10px solid #ffffff;
}

#checkout-step-shipping_method #shipping-method-buttons-container {
  border-top: none;
}

#co-shipping-method-form dt {
  display: none;
}

.sp-methods .radio-row {
  padding-left: 40px;
}

.button.navi.color-on-tap.selected {
  background: rgba(105, 190, 40, 0.25);
}

.button.navi.color-circle-on-tap.selected .circle {
  position: relative;
}
.button.navi.color-circle-on-tap.selected .circle:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(105, 190, 40, 0.25);
  border-radius: 50%;
}

#checkout-payment-method-load .payment-methods .payment-group .payment-method._active .payment-method-content .checkout-agreements-block .checkout-agreements.fieldset .checkout-agreement.field .label .action.action-show {
  text-decoration: none;
  color: black;
  text-transform: none;
  font-size: 14px;
  font-weight: 400;
  text-align: left;
  font-family: houschka-pro-light, Helvetica, sans-serif;
  letter-spacing: unset;
}
#checkout-payment-method-load .payment-methods .payment-group .payment-method._active .payment-method-content .checkout-agreements-block .checkout-agreements.fieldset .checkout-agreement.field .label .action.action-show:hover {
  text-dexcoration: none;
  color: black;
}

#co-shipping-method-form {
  font-size: 16px;
}
#co-shipping-method-form .table-checkout-shipping-method {
  width: 100%;
}
#co-shipping-method-form .sum-total {
  font-size: 16px;
}

#opc-sidebar {
  font-size: 16px;
}
@media screen and (max-width: 850px) {
  #opc-sidebar .opc-block-summary {
    padding: 15px;
  }
}
#opc-sidebar .opc-block-summary .h1b {
  font-size: 20px;
}
#opc-sidebar .opc-block-summary .table.table-totals .grand.totals .mark, #opc-sidebar .opc-block-summary .table.table-totals .grand.totals .amount {
  font-size: 18px;
}
#opc-sidebar .opc-block-summary .items-in-cart > .title strong {
  font-size: 16px;
}
#opc-sidebar .minicart-items .minicart-items-wrapper {
  overflow-x: hidden;
}
#opc-sidebar .minicart-items .product-item .product > * {
  font-size: 16px;
}
@media screen and (max-width: 1060px) {
  #opc-sidebar .minicart-items .product-item .product .product-image-container {
    display: none;
  }
}
#opc-sidebar .minicart-items .product-item .product .product-image-container .circle .icon-a-lg {
  width: 48px;
  height: 48px;
}
@media screen and (max-width: 1060px) {
  #opc-sidebar .minicart-items .product-item .product .product-item-details {
    padding-left: 0;
  }
}
#opc-sidebar .minicart-items .product-item .product .product-item-details .product-item-name {
  font-weight: 900;
  line-height: 1.4;
  font-size: 16px;
}
#opc-sidebar .minicart-items .product-item .product .product-item-details .product-item-name .label {
  margin-right: 5px;
}
#opc-sidebar .minicart-items .product-item .product .product-item-details .details-qty {
  font-size: 14px;
}
#opc-sidebar .minicart-items .product-item .product .product-item-details .price {
  font-size: 18px;
  font-weight: 900;
}

.opc-wrapper h1 {
  margin-bottom: 15px;
}

.abs-button-l,
#store-selector .form-continue .actions-toolbar .action.primary,
.order-review-form .action.primary,
.bundle-actions .action.primary.customize,
.bundle-options-container .block-bundle-summary .box-tocart .action.primary,
.box-tocart .action.tocart,
.cart-summary .checkout-methods-items .action.primary.checkout,
.block-minicart .block-content > .actions > .primary .action.primary,
.methods-shipping .actions-toolbar .action.primary,
.block-authentication .action.action-register,
.block-authentication .action.action-login,
.checkout-payment-method .payment-method-content > .actions-toolbar > .primary .action.primary,
.form-address-edit .actions-toolbar .action.primary,
.box-tocart .action.instant-purchase,
.multicheckout .action.primary {
  font-size: 14px;
}

.abs-discount-code .form-discount .actions-toolbar .primary .action,
.checkout-payment-method .payment-option-content .form-discount .actions-toolbar .primary .action {
  border: none;
}

.payment-method-braintree .hosted-error {
  overflow: hidden;
}
.payment-method-braintree .hosted-control {
  height: 52px;
}

.payment-method-billing-address .billing-address-details button.action.action-edit-address {
  font-size: 14px;
  border-radius: 3px;
  border: none;
}

#checkout .actions-toolbar {
  margin-top: 55px;
}

.firmierung-box {
  margin-bottom: 40px;
  background-color: #e5e5e5;
  padding: 30px;
}
.firmierung-box .select-style {
  background-color: #e5e5e5;
}

.mejs-offscreen {
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: polygon(0px 0, 0 0, 0 0, 0 0);
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
}

.mejs-container {
  position: relative;
  background: #000;
  font-family: Helvetica, Arial, serif;
  text-align: left;
  vertical-align: top;
  text-indent: 0;
}

.mejs-fill-container, .mejs-fill-container .mejs-container {
  width: 100%;
  height: 100%;
}

.mejs-fill-container {
  overflow: hidden;
}

.mejs-container:focus {
  outline: 0;
}

.me-plugin {
  position: absolute;
}

.mejs-embed, .mejs-embed body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  background: #000;
  overflow: hidden;
}

.mejs-fullscreen {
  overflow: hidden !important;
}

.mejs-container-fullscreen {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  z-index: 1000;
}

.mejs-container-fullscreen .mejs-mediaelement, .mejs-container-fullscreen video {
  width: 100%;
  height: 100%;
}

.mejs-clear {
  clear: both;
}

.mejs-background {
  position: absolute;
  top: 0;
  left: 0;
}

.mejs-mediaelement {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.mejs-poster {
  position: absolute;
  top: 0;
  left: 0;
  background-size: contain;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}

:root .mejs-poster img {
  display: none;
}

.mejs-poster img {
  border: 0;
  padding: 0;
}

.mejs-overlay {
  position: absolute;
  top: 0;
  left: 0;
}

.mejs-overlay-play {
  cursor: pointer;
}

.mejs-overlay-button {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100px;
  height: 100px;
  margin: -50px 0 0 -50px;
}

.mejs-overlay:hover .mejs-overlay-button {
  background-position: 0 -100px;
}

.mejs-overlay-loading {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 80px;
  height: 80px;
  margin: -40px 0 0 -40px;
  background: #333;
  background: rgba(0, 0, 0, 0.9);
  background: linear-gradient(rgba(50, 50, 50, 0.9), rgba(0, 0, 0, 0.9));
}

.mejs-overlay-loading span {
  display: block;
  width: 80px;
  height: 80px;
}

.mejs-container .mejs-controls {
  position: absolute;
  list-style-type: none;
  margin: 0;
  padding: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.7);
  background: linear-gradient(rgba(50, 50, 50, 0.7), rgba(0, 0, 0, 0.7));
  height: 30px;
  width: 100%;
}

.mejs-container .mejs-controls div {
  list-style-type: none;
  background-image: none;
  display: block;
  float: left;
  margin: 0;
  padding: 0;
  width: 26px;
  height: 26px;
  font-size: 11px;
  line-height: 11px;
  font-family: Helvetica, Arial, serif;
  border: 0;
}

.mejs-controls .mejs-button button {
  cursor: pointer;
  display: block;
  font-size: 0;
  line-height: 0;
  text-decoration: none;
  margin: 7px 5px;
  padding: 0;
  position: absolute;
  height: 16px;
  width: 16px;
  border: 0;
}

.mejs-controls .mejs-button button:focus {
  outline: dotted 1px #999;
}

.mejs-container .mejs-controls .mejs-time {
  color: #fff;
  display: block;
  height: 17px;
  width: auto;
  padding: 10px 3px 0;
  overflow: hidden;
  text-align: center;
  box-sizing: content-box;
}

.mejs-container .mejs-controls .mejs-time a {
  color: #fff;
  font-size: 11px;
  line-height: 12px;
  display: block;
  float: left;
  margin: 1px 2px 0 0;
  width: auto;
}

.mejs-controls .mejs-play button {
  background-position: 0 0;
}

.mejs-controls .mejs-pause button {
  background-position: 0 -16px;
}

.mejs-controls .mejs-stop button {
  background-position: -112px 0;
}

.mejs-controls div.mejs-time-rail {
  direction: ltr;
  width: 200px;
  padding-top: 5px;
}

.mejs-controls .mejs-time-rail span, .mejs-controls .mejs-time-rail a {
  display: block;
  position: absolute;
  width: 180px;
  height: 10px;
  border-radius: 2px;
  cursor: pointer;
}

.mejs-controls .mejs-time-rail .mejs-time-total {
  margin: 5px;
  background: #333;
  background: rgba(50, 50, 50, 0.8);
  background: linear-gradient(rgba(30, 30, 30, 0.8), rgba(60, 60, 60, 0.8));
}

.mejs-controls .mejs-time-rail .mejs-time-buffering {
  width: 100%;
  background-image: linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-size: 15px 15px;
  animation: buffering-stripes 2s linear infinite;
}
@keyframes buffering-stripes {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 30px 0;
  }
}
.mejs-controls .mejs-time-rail .mejs-time-loaded {
  background: #3caac8;
  background: rgba(60, 170, 200, 0.8);
  background: linear-gradient(rgba(44, 124, 145, 0.8), rgba(78, 183, 212, 0.8));
  width: 0;
}

.mejs-controls .mejs-time-rail .mejs-time-current {
  background: #fff;
  background: rgba(255, 255, 255, 0.8);
  background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(200, 200, 200, 0.8));
  width: 0;
}

.mejs-controls .mejs-time-rail .mejs-time-handle {
  display: none;
  position: absolute;
  margin: 0;
  width: 10px;
  background: #fff;
  border-radius: 5px;
  cursor: pointer;
  border: solid 2px #333;
  top: -2px;
  text-align: center;
}

.mejs-controls .mejs-time-rail .mejs-time-float {
  position: absolute;
  display: none;
  background: #eee;
  width: 36px;
  height: 17px;
  border: solid 1px #333;
  top: -26px;
  margin-left: -18px;
  text-align: center;
  color: #111;
}

.mejs-controls .mejs-time-rail .mejs-time-float-current {
  margin: 2px;
  width: 30px;
  display: block;
  text-align: center;
  left: 0;
}

.mejs-controls .mejs-time-rail .mejs-time-float-corner {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  line-height: 0;
  border: solid 5px #eee;
  border-color: #eee transparent transparent;
  border-radius: 0;
  top: 15px;
  left: 13px;
}

.mejs-long-video .mejs-controls .mejs-time-rail .mejs-time-float {
  width: 48px;
}

.mejs-long-video .mejs-controls .mejs-time-rail .mejs-time-float-current {
  width: 44px;
}

.mejs-long-video .mejs-controls .mejs-time-rail .mejs-time-float-corner {
  left: 18px;
}

.mejs-controls .mejs-fullscreen-button button {
  background-position: -32px 0;
}

.mejs-controls .mejs-unfullscreen button {
  background-position: -32px -16px;
}

.mejs-controls .mejs-mute button {
  background-position: -16px -16px;
}

.mejs-controls .mejs-unmute button {
  background-position: -16px 0;
}

.mejs-controls .mejs-volume-button {
  position: relative;
}

.mejs-controls .mejs-volume-button .mejs-volume-slider {
  display: none;
  height: 115px;
  width: 25px;
  background: rgba(50, 50, 50, 0.7);
  border-radius: 0;
  top: -115px;
  left: 0;
  z-index: 1;
  position: absolute;
  margin: 0;
}

.mejs-controls .mejs-volume-button:hover {
  border-radius: 0 0 4px 4px;
}

.mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-total {
  position: absolute;
  left: 11px;
  top: 8px;
  width: 2px;
  height: 100px;
  background: #ddd;
  background: rgba(255, 255, 255, 0.5);
  margin: 0;
}

.mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-current {
  position: absolute;
  left: 11px;
  top: 8px;
  width: 2px;
  height: 100px;
  background: #ddd;
  background: rgba(255, 255, 255, 0.9);
  margin: 0;
}

.mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-handle {
  position: absolute;
  left: 4px;
  top: -3px;
  width: 16px;
  height: 6px;
  background: #ddd;
  background: rgba(255, 255, 255, 0.9);
  cursor: N-resize;
  border-radius: 1px;
  margin: 0;
}

.mejs-controls a.mejs-horizontal-volume-slider {
  height: 26px;
  width: 56px;
  position: relative;
  display: block;
  float: left;
  vertical-align: middle;
}

.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {
  position: absolute;
  left: 0;
  top: 11px;
  width: 50px;
  height: 8px;
  margin: 0;
  padding: 0;
  font-size: 1px;
  border-radius: 2px;
  background: #333;
  background: rgba(50, 50, 50, 0.8);
  background: linear-gradient(rgba(30, 30, 30, 0.8), rgba(60, 60, 60, 0.8));
}

.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
  position: absolute;
  left: 0;
  top: 11px;
  width: 50px;
  height: 8px;
  margin: 0;
  padding: 0;
  font-size: 1px;
  border-radius: 2px;
  background: #fff;
  background: rgba(255, 255, 255, 0.8);
  background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(200, 200, 200, 0.8));
}

.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-handle {
  display: none;
}

.mejs-controls .mejs-captions-button {
  position: relative;
}

.mejs-controls .mejs-captions-button button {
  background-position: -48px 0;
}

.mejs-controls .mejs-captions-button .mejs-captions-selector {
  visibility: hidden;
  position: absolute;
  bottom: 26px;
  right: -51px;
  width: 85px;
  height: 100px;
  background: rgba(50, 50, 50, 0.7);
  border: solid 1px transparent;
  padding: 10px 10px 0;
  overflow: hidden;
  border-radius: 0;
}

.mejs-controls .mejs-captions-button:hover .mejs-captions-selector {
  visibility: visible;
}

.mejs-controls .mejs-captions-button .mejs-captions-selector ul {
  margin: 0;
  padding: 0;
  display: block;
  list-style-type: none !important;
  overflow: hidden;
}

.mejs-controls .mejs-captions-button .mejs-captions-selector ul li {
  margin: 0 0 6px;
  padding: 0;
  list-style-type: none !important;
  display: block;
  color: #fff;
  overflow: hidden;
}

.mejs-controls .mejs-captions-button .mejs-captions-selector ul li input {
  clear: both;
  float: left;
  margin: 3px 3px 0 5px;
}

.mejs-controls .mejs-captions-button .mejs-captions-selector ul li label {
  width: 55px;
  float: left;
  padding: 4px 0 0;
  line-height: 15px;
  font-family: Helvetica, Arial, serif;
  font-size: 10px;
}

.mejs-controls .mejs-captions-button .mejs-captions-translations {
  font-size: 10px;
  margin: 0 0 5px;
}

.mejs-chapters {
  position: absolute;
  top: 0;
  left: 0;
  border-right: solid 1px #fff;
  width: 10000px;
  z-index: 1;
}

.mejs-chapters .mejs-chapter {
  position: absolute;
  float: left;
  background: #222;
  background: rgba(0, 0, 0, 0.7);
  background: linear-gradient(rgba(50, 50, 50, 0.7), rgba(0, 0, 0, 0.7));
  filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorstr=#323232, endColorstr=#000000);
  overflow: hidden;
  border: 0;
}

.mejs-chapters .mejs-chapter .mejs-chapter-block {
  font-size: 11px;
  color: #fff;
  padding: 5px;
  display: block;
  border-right: solid 1px #333;
  border-bottom: solid 1px #333;
  cursor: pointer;
}

.mejs-chapters .mejs-chapter .mejs-chapter-block-last {
  border-right: 0;
}

.mejs-chapters .mejs-chapter .mejs-chapter-block:hover {
  background: #666;
  background: rgba(102, 102, 102, 0.7);
  background: linear-gradient(rgba(102, 102, 102, 0.7), rgba(50, 50, 50, 0.6));
  filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorstr=#666666, endColorstr=#323232);
}

.mejs-chapters .mejs-chapter .mejs-chapter-block .ch-title {
  font-size: 12px;
  font-weight: 700;
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin: 0 0 3px;
  line-height: 12px;
}

.mejs-chapters .mejs-chapter .mejs-chapter-block .ch-timespan {
  font-size: 12px;
  line-height: 12px;
  margin: 3px 0 4px;
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.mejs-captions-layer {
  position: absolute;
  bottom: 0;
  left: 0;
  text-align: center;
  line-height: 20px;
  font-size: 16px;
  color: #fff;
}

.mejs-captions-layer a {
  color: #fff;
  text-decoration: underline;
}

.mejs-captions-layer[lang=ar] {
  font-size: 20px;
  font-weight: 400;
}

.mejs-captions-position {
  position: absolute;
  width: 100%;
  bottom: 15px;
  left: 0;
}

.mejs-captions-position-hover {
  bottom: 35px;
}

.mejs-captions-text {
  padding: 0;
  background: rgba(20, 20, 20, 0.5);
  white-space: pre-wrap;
  box-shadow: 5px 0 0 rgba(20, 20, 20, 0.5), -5px 0 0 rgba(20, 20, 20, 0.5);
}

.me-cannotplay a {
  color: #fff;
  font-weight: 700;
}

.me-cannotplay span {
  padding: 15px;
  display: block;
}

.mejs-controls .mejs-loop-off button {
  background-position: -64px -16px;
}

.mejs-controls .mejs-loop-on button {
  background-position: -64px 0;
}

.mejs-controls .mejs-backlight-off button {
  background-position: -80px -16px;
}

.mejs-controls .mejs-backlight-on button {
  background-position: -80px 0;
}

.mejs-controls .mejs-picturecontrols-button {
  background-position: -96px 0;
}

.mejs-contextmenu {
  position: absolute;
  width: 150px;
  padding: 10px;
  border-radius: 4px;
  top: 0;
  left: 0;
  background: #fff;
  border: solid 1px #999;
  z-index: 1001;
}

.mejs-contextmenu .mejs-contextmenu-separator {
  height: 1px;
  font-size: 0;
  margin: 5px 6px;
  background: #333;
}

.mejs-contextmenu .mejs-contextmenu-item {
  font-family: Helvetica, Arial, serif;
  font-size: 12px;
  padding: 4px 6px;
  cursor: pointer;
  color: #333;
}

.mejs-contextmenu .mejs-contextmenu-item:hover {
  background: #2C7C91;
  color: #fff;
}

.mejs-controls .mejs-sourcechooser-button {
  position: relative;
}

.mejs-controls .mejs-sourcechooser-button button {
  background-position: -128px 0;
}

.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector {
  position: absolute;
  bottom: 26px;
  right: -10px;
  width: 130px;
  height: 100px;
  background: rgba(50, 50, 50, 0.7);
  border: solid 1px transparent;
  padding: 10px;
  overflow: hidden;
  border-radius: 0;
}

.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul {
  margin: 0;
  padding: 0;
  display: block;
  list-style-type: none !important;
  overflow: hidden;
}

.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul li {
  margin: 0 0 6px;
  padding: 0;
  list-style-type: none !important;
  display: block;
  color: #fff;
  overflow: hidden;
}

.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul li input {
  clear: both;
  float: left;
  margin: 3px 3px 0 5px;
}

.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul li label {
  width: 100px;
  float: left;
  padding: 4px 0 0;
  line-height: 15px;
  font-family: Helvetica, Arial, serif;
  font-size: 10px;
}

.mejs-postroll-layer {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(50, 50, 50, 0.7);
  z-index: 1000;
  overflow: hidden;
}

.mejs-postroll-layer-content {
  width: 100%;
  height: 100%;
}

.mejs-postroll-close {
  position: absolute;
  right: 0;
  top: 0;
  background: rgba(50, 50, 50, 0.7);
  color: #fff;
  padding: 4px;
  z-index: 100;
  cursor: pointer;
}

div.mejs-speed-button {
  width: 46px !important;
  position: relative;
}

.mejs-controls .mejs-button.mejs-speed-button button {
  background: transparent;
  width: 36px;
  font-size: 11px;
  line-height: normal;
  color: #fff;
}

.mejs-controls .mejs-speed-button .mejs-speed-selector {
  display: none;
  position: absolute;
  top: -100px;
  left: -10px;
  width: 60px;
  height: 100px;
  background: rgba(50, 50, 50, 0.7);
  border: solid 1px transparent;
  padding: 0;
  overflow: hidden;
  border-radius: 0;
}

.mejs-controls .mejs-speed-button:hover > .mejs-speed-selector {
  display: block;
}

.mejs-controls .mejs-speed-button .mejs-speed-selector ul li label.mejs-speed-selected {
  color: rgb(33, 248, 248);
}

.mejs-controls .mejs-speed-button .mejs-speed-selector ul {
  margin: 0;
  padding: 0;
  display: block;
  list-style-type: none !important;
  overflow: hidden;
}

.mejs-controls .mejs-speed-button .mejs-speed-selector ul li {
  margin: 0 0 6px;
  padding: 0 10px;
  list-style-type: none !important;
  display: block;
  color: #fff;
  overflow: hidden;
}

.mejs-controls .mejs-speed-button .mejs-speed-selector ul li input {
  clear: both;
  float: left;
  margin: 3px 3px 0 5px;
  display: none;
}

.mejs-controls .mejs-speed-button .mejs-speed-selector ul li label {
  width: 60px;
  float: left;
  padding: 4px 0 0;
  line-height: 15px;
  font-family: Helvetica, Arial, serif;
  font-size: 11px;
  color: #fff;
  margin-left: 5px;
  cursor: pointer;
}

.mejs-controls .mejs-speed-button .mejs-speed-selector ul li:hover {
  background-color: #c8c8c8 !important;
  background-color: rgba(255, 255, 255, 0.4) !important;
}

.mejs-controls .mejs-button.mejs-jump-forward-button button {
  background: transparent;
  font-size: 9px;
  line-height: normal;
  color: #fff;
}

.mejs-controls .mejs-button.mejs-skip-back-button button {
  background: transparent;
  font-size: 9px;
  line-height: normal;
  color: #fff;
}

/**
 * Css styles for jquery.tagit plugin
 * Extending bootstrap (http://twitter.github.com/bootstrap/)
 */
/**
 * Provides both, elements which look like form inputs when they are not and
 * cleared styles for form elements (no shadow etc.)
 */
.form-dummy fieldset {
  margin-bottom: 0;
}

.form-dummy fieldset > div {
  margin-bottom: 0;
}

.form-dummy label {
  line-height: 14px;
}

.form-dummy .input > span {
  line-height: 14px;
  display: inline-block;
  height: 14px;
  padding: 6px;
}

.fake-input {
  display: inline-block;
  margin: 0;
  padding: 20px;
  color: #262626;
  background-color: white;
  z-index: 3;
}

.fake-input.focused {
  outline: none;
}

form div.error, input.no-style {
  transition: none;
  box-shadow: none;
}

form div.error input.no-style,
input.no-style,
form div.error input.no-style:focus,
input.no-style:focus {
  border: none;
  border-radius: 0;
  box-shadow: none;
  transition: none;
}

.tagit {
  list-style: none;
}

.tagit.fake-input {
  padding: 10px 0px 10px 20px;
  float: left;
  line-height: 26px;
  white-space: nowrap;
  overflow-x: hidden;
}

.element_searchfield_global .tagit-searchfield.tagit.fake-input,
.element_searchfield_projekte .tagit-searchfield.tagit.fake-input {
  width: 620px;
}

@media screen and (max-width: 1220px) {
  .element_searchfield_global .tagit-searchfield.tagit.fake-input,
  .element_searchfield_projekte .tagit-searchfield.tagit.fake-input {
    width: 450px;
  }
}
@media screen and (max-width: 991px) {
  .element_searchfield_global .tagit-searchfield.tagit.fake-input,
  .element_searchfield_projekte .tagit-searchfield.tagit.fake-input {
    width: 80%;
  }
}
@media screen and (max-width: 740px) {
  .element_searchfield_global .tagit-searchfield.tagit.fake-input,
  .element_searchfield_projekte .tagit-searchfield.tagit.fake-input {
    width: 60%;
  }
}
.element_searchfield_global [data-tab="1"] .tagit-searchfield.tagit.fake-input,
.element_searchfield_druckereien .tagit-searchfield.tagit.fake-input {
  width: 250px;
}

@media screen and (max-width: 1220px) {
  .element_searchfield_global [data-tab="1"] .tagit-searchfield.tagit.fake-input,
  .element_searchfield_druckereien .tagit-searchfield.tagit.fake-input {
    width: 190px;
  }
}
@media screen and (max-width: 991px) {
  .element_searchfield_global [data-tab="1"] .tagit-searchfield.tagit.fake-input,
  .element_searchfield_druckereien .tagit-searchfield.tagit.fake-input {
    width: 30%;
  }
}
@media screen and (max-width: 740px) {
  .element_searchfield_global [data-tab="1"] .tagit-searchfield.tagit.fake-input,
  .element_searchfield_druckereien .tagit-searchfield.tagit.fake-input {
    width: 100%;
  }
}
.element_searchfield_global .tab-container .tabs-content .tab form .tagit li,
.tagit li {
  display: inline-block;
}

.element_searchfield_global .tab-container .tabs-content .tab form .tagit li.tag,
.tagit li.tag {
  position: relative;
  margin: 3px 4px 3px 0;
  padding: 0 2px 0 2px;
  line-height: 18px;
  cursor: default;
  border-radius: 2px;
  color: #262626;
}

.element_searchfield_global .tab-container .tabs-content .tab form .tagit li.tag .close,
.tagit li.tag .close {
  bottom: auto;
  margin-left: 5px;
  margin-right: 10px;
  width: 16px;
  height: 16px;
  position: relative;
  background-image: url(../img/tagit_cancel.png);
}

.tagit .tagit-edit-handle {
  position: relative;
}

.element_searchfield_global .tab-container .tabs-content .tab form li.tagit-edit-handle input[type=text],
.tagit .tagit-edit-handle input {
  padding: 3px 4px 2px 0;
  background: transparent;
}

.tagit .tagit-edit-handle ul {
  position: absolute;
  left: 0;
  top: 20px;
  right: 0;
  background: white;
  margin: 0;
  padding: 0;
  display: none;
  line-height: 20px;
}

.tagit .tagit-edit-handle ul.open {
  display: block;
  z-index: 1000;
}

.tagit .tagit-edit-handle ul.open:hover li.selected {
  background: transparent;
  color: inherit;
}

.tagit .tagit-edit-handle ul.open li {
  display: block;
  padding: 3px;
  cursor: default;
}

.fake-input.tagit li.tag {
  border: none;
  font-size: 16px;
}

.element_searchfield_places_suggest {
  margin-left: -20px;
}

.p3.selected {
  color: #69BE28;
}

.element_searchfield_global .tabs-content .tab[data-tab="1"] .p3.plz,
.element_searchfield_druckereien .p3.plz {
  width: 20% !important;
  background-image: url(../img/icon-suche-plz.svg);
  padding: 20px 0px 15px 15px;
  background-position: 90%;
  background-repeat: no-repeat;
}
.element_searchfield_global .tabs-content .tab[data-tab="1"] .p3.umkreis,
.element_searchfield_druckereien .p3.umkreis {
  width: 20% !important;
  background-image: url(../img/icon-suche-down.svg);
  padding: 20px 0px 15px 15px;
  background-position: 100%;
  background-repeat: no-repeat;
}
.element_searchfield_global .tabs-content .tab[data-tab="1"] .btn-primary,
.element_searchfield_druckereien .btn-primary {
  width: 25% !important;
}

@media screen and (max-width: 740px) {
  .element_searchfield_global .tabs-content .tab[data-tab="1"],
  .element_searchfield_druckereien {
    height: 113px;
    background-color: #fff;
  }
  .element_searchfield_global .tabs-content .tab[data-tab="1"] .p3.plz,
  .element_searchfield_druckereien .p3.plz {
    width: 50% !important;
  }
  .element_searchfield_global .tabs-content .tab[data-tab="1"] .p3.umkreis,
  .element_searchfield_druckereien .p3.umkreis {
    width: 20% !important;
  }
  .element_searchfield_global .tabs-content .tab[data-tab="1"] .btn-primary,
  .element_searchfield_druckereien .btn-primary {
    width: 25% !important;
  }
}
@media screen and (max-width: 484px) {
  .element_searchfield_global .tabs-content .tab[data-tab="1"],
  .element_searchfield_druckereien {
    height: 170px;
    background-color: #fff;
  }
  .element_searchfield_global .tabs-content .tab[data-tab="1"] .p3.plz,
  .element_searchfield_druckereien .p3.plz {
    width: 50% !important;
  }
  .element_searchfield_global .tabs-content .tab[data-tab="1"] .p3.umkreis,
  .element_searchfield_druckereien .p3.umkreis {
    width: 40% !important;
  }
  .element_searchfield_global .tabs-content .tab[data-tab="1"] .btn-primary,
  .element_searchfield_druckereien .btn-primary {
    width: 100% !important;
    border-bottom-left-radius: 2px !important;
  }
}
#umkreis {
  padding: 0px 0px;
  border: none;
  box-shadow: none;
  background-color: transparent;
  -webkit-appearance: none;
}

.stockstate {
  padding-bottom: 2em;
}
.stockstate .row.row1 {
  height: 60px;
}
.stockstate .row.row1 div:first-child {
  color: #69be28;
  padding-top: 9px;
}
.stockstate .row.row1 div:last-child {
  text-align: right;
}
.stockstate .row.row1 div:last-child a {
  color: #666666;
  cursor: pointer;
}
.stockstate .row.row2 {
  height: 26px;
}
.stockstate .row.row2 div {
  padding-bottom: 10px;
}
.stockstate .row.row3 .stocks div {
  text-transform: unset;
  padding-top: 15px;
  padding-bottom: 15px;
  color: #b4b4b4;
  line-height: 20px;
  text-align: center;
  border-top: 1px solid #b4b4b4;
  border-right: 1px solid #b4b4b4;
  border-bottom: 1px solid #b4b4b4;
}
.stockstate .row.row3 .stocks div:first-child {
  border-left: 1px solid #b4b4b4;
}
.stockstate .row.row3 .stocks div.active {
  font-weight: bold;
  background-color: #eee;
  color: black;
}
.stockstate .row.row3 .stocks div.active span:last-child {
  color: #69be28;
}
.stockstate .row.dropship_delivery {
  height: 60px;
}
.stockstate .row.dropship_delivery div {
  color: #69be28;
  padding-top: 10px;
}

.stockstate_tooltip .p1 {
  color: #69be28;
}

@media screen and (max-width: 768px) {
  #mpshop_widget_breadcrump {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  .mpshop-content {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}

@media screen and (max-width: 768px) {
  .order-review {
    margin-top: 0px;
  }
}

@media screen and (max-width: 768px) {
  .row.sum {
    clear: both;
  }
}

@media screen and (max-width: 768px) {
  .checkout-index-index .order-review .checkout-uebersicht .zusammenfassung .block {
    padding-left: 40px;
    padding-right: 10px;
  }
}

@media screen and (min-width: 768px) {
  .desktop-flex {
    display: flex;
  }
}

.alert-danger strong {
  display: block;
}

.extbase-debugger-floating {
  position: fixed;
  z-index: 100000;
  left: 0;
  top: 0;
  -webkit-user-drag: auto;
}

.formfield-container.radio-buttons input[type=radio] {
  margin-left: 30px;
}

#block-discount-heading {
  padding: 17px 15px 16px 15px;
  cursor: pointer;
  border: 1px solid #69be28;
  background-color: transparent;
  color: #69be28;
  display: block;
  margin-bottom: 20px;
}

label.label[for=discount-code] {
  display: none;
}

.payment-option.discount-code .payment-option-title {
  display: none;
}
.payment-option.discount-code .payment-option-content {
  display: block !important;
}
.payment-option.discount-code .payment-option-content .actions-toolbar {
  margin-top: 10px !important;
}
.payment-option.discount-code .payment-option-content .actions-toolbar .primary {
  display: block;
  width: 100%;
}
.payment-option.discount-code .payment-option-content .actions-toolbar .primary button.action.action-apply {
  background-color: #69be28;
  border: none;
  color: white;
  padding: 10px 20px;
  display: block;
  width: 100%;
}

body {
  background-color: #e4e4e4;
}

body.dragging, body.dragging * {
  cursor: move !important;
}

.standard #wrapper {
  padding-top: 108px;
}
@media screen and (max-width: 991px) {
  .standard #wrapper {
    padding-top: 62px;
  }
}
.standard #wrapper section:first-of-type {
  margin-top: 60px;
}
@media screen and (max-width: 991px) {
  .standard #wrapper section:first-of-type {
    margin-top: 50px;
  }
}
.standard.printfarm {
  background-color: #f6f5ee;
}
.standard.printfarm #wrapper {
  background-color: #f6f5ee;
}
.standard.printfarm .printfarm-corners {
  border-radius: 10px;
}

.printfarm section.teaser_fullscreen {
  background-image: none !important;
}
.printfarm section.teaser_fullscreen .overlay {
  display: none;
}
.printfarm section.teaser_fullscreen .credits {
  display: none;
}
.printfarm section.teaser_fullscreen .firstrow .h1a {
  color: #69be28;
  text-align: center;
}
.printfarm section.teaser_fullscreen .firstrow .p3 {
  text-align: center;
}
@media screen and (max-width: 768px) {
  .printfarm section.teaser_fullscreen .element_searchfield_global {
    margin-top: 120px;
  }
}
.printfarm section.teaser_fullscreen .element_searchfield_global .tab-container .tabs .tab {
  padding: 9px 0;
  margin: 0 10px 10px 10px;
}
.printfarm section.teaser_fullscreen .element_searchfield_global .tab-container .tabs .tab.ft-weiss {
  color: #666666;
  font-size: 20px;
}
.printfarm section.teaser_fullscreen .element_searchfield_global .tab-container .tabs .tab.ft-weiss.active {
  background-image: none;
  color: #666666;
  border-bottom: 1px solid #69be28;
}
.printfarm section.teaser_fullscreen .element_searchfield_global .tab-container .tabs-content {
  border: 10px solid white;
  height: 80px;
  border-radius: 40px;
}
.printfarm section.teaser_fullscreen .element_searchfield_global .tab-container .tabs-content .tab {
  background-color: transparent;
}
.printfarm section.teaser_fullscreen .element_searchfield_global .tab-container .tabs-content .tab form input[type=submit] {
  border-radius: 30px;
  text-transform: uppercase;
  font-size: 18px;
  letter-spacing: 3px;
}
@media screen and (max-width: 768px) {
  .printfarm section.teaser_fullscreen .element_searchfield_global .tab-container .tabs-content .tab form ul {
    width: 30%;
  }
}
.printfarm section.teaser_fullscreen .element_searchfield_global .tab-container .tabs-content .tab .tagit-link-alle {
  font-size: 16px;
  color: #666666;
}
.printfarm section.teaser_inspiration {
  margin-top: 80px;
}
.printfarm section.teaser_inspiration h1 {
  color: #69be28;
}
.printfarm section.teaser_inspiration h1, .printfarm section.teaser_inspiration p {
  text-align: center;
  widtH: 80%;
  margin-left: auto;
  margin-right: auto;
}
.printfarm section.teaser_inspiration h1.p3, .printfarm section.teaser_inspiration p.p3 {
  margin-bottom: 80px;
}
@media screen and (max-width: 991px) {
  .printfarm section.teaser_inspiration h1.h1b, .printfarm section.teaser_inspiration h1.p3, .printfarm section.teaser_inspiration p.h1b, .printfarm section.teaser_inspiration p.p3 {
    margin-bottom: 30px;
  }
}
.printfarm section.teaser_inspiration .icon-projekte, .printfarm section.teaser_inspiration .icon-druckereien, .printfarm section.teaser_inspiration .icon-papiere {
  height: 120px;
  background-position: top;
}
.printfarm section.teaser_inspiration .card_top_projekt {
  border-radius: 10px;
}
.printfarm section.teaser_inspiration .card_top_projekt .image {
  border-radius: 10px;
}
.printfarm section.teaser_inspiration .card_top_projekt .tabs-content .tab {
  border-radius: 10px;
}
@media screen and (max-width: 768px) {
  .printfarm section.teaser_themen {
    margin-top: 200px;
  }
}
.printfarm section.teaser_themen .subheadline {
  text-align: center;
}
.printfarm section.teaser_themen .slider_teaser .image {
  border-radius: 10px;
}
.printfarm section.teaser_themen .slider_teaser .text {
  background-color: transparent;
}
.printfarm section.teaser_themen .card_content_teaser h2 {
  font-size: 25px;
  line-height: 28px;
  text-align: left;
}
.printfarm section.teaser_themen .card_content_teaser .subheadline {
  bottom: auto;
  top: 20px;
}

.home section {
  position: relative;
}
.home section.teaser_fullscreen {
  background-image: url(../../_content/startseite_header.png);
  background-size: cover;
  background-position: top;
  background-attachment: scroll;
  width: 100%;
  height: 100vh;
}
.home section.teaser_fullscreen .overlay {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-color: #000000;
  opacity: 0.7;
}
.home section.teaser_fullscreen .credits {
  position: absolute;
  left: 20px;
  bottom: 20px;
  color: #cccccc;
  opacity: 0.6;
  text-decoration: none;
}
.home section.teaser_fullscreen .firstrow {
  margin-top: 25vh;
}
@media screen and (max-width: 768px) {
  .home section.teaser_fullscreen .firstrow {
    margin-top: 20vh;
  }
}
.home section.teaser_fullscreen .firstrow .h1a {
  color: #ffffff;
  text-align: center;
}
.home section.teaser_fullscreen .firstrow .p3 {
  text-align: center;
  color: #ffffff;
  opacity: 0.7;
  text-shadow: #ffffff 0px 0px 21px;
}
.home section.teaser_inspiration {
  background-color: #f5f5f5;
}
.home section.teaser_inspiration h1, .home section.teaser_inspiration p {
  text-align: center;
  widtH: 80%;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 991px) {
  .home section.teaser_inspiration h1.h1b, .home section.teaser_inspiration h1.p3, .home section.teaser_inspiration p.h1b, .home section.teaser_inspiration p.p3 {
    margin-bottom: 30px;
  }
}
.home section.teaser_inspiration .icon-projekte, .home section.teaser_inspiration .icon-druckereien, .home section.teaser_inspiration .icon-papiere {
  height: 120px;
  background-position: top;
}
.home section.teaser_musterbuch {
  background-image: url(../../_content/startseite-musterbuch.png);
  background-size: cover;
  background-position: top;
}
.home section.teaser_musterbuch .overlay {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(-90deg, rgba(148, 148, 148, 0) 11%, #000000 100%);
}
.home section.teaser_papierkonzept {
  background-image: url(../../_content/none.png);
  background-color: #cccccc;
  background-size: cover;
  background-position: top;
  background-attachment: fixed;
}
.home section.teaser_themen {
  background-color: #f5f5f5;
  padding-bottom: 0px;
}
.home section.teaser_themen .slider_teaser .subheadline.s1 {
  font-size: 18px;
  line-height: 22px;
}
.home section.teaser_themen .slider_teaser .text {
  background-color: transparent;
}

.konfigurator .statusbar {
  position: relative;
  top: 0px;
  left: 0px;
  margin-top: 108px;
  height: 78px;
  background-color: #69be28;
}
.konfigurator .infoleiste {
  background-color: #000000;
  display: none;
}
.konfigurator .infoleiste img {
  width: 15px;
  height: 15px;
  margin-right: 10px;
  vertical-align: bottom;
}
.konfigurator .konfigurator {
  background-color: #f5f5f5;
}
.konfigurator .konfigurator .conf-category,
.konfigurator .konfigurator .conf-surface,
.konfigurator .konfigurator .conf-color,
.konfigurator .konfigurator .conf-grammage,
.konfigurator .konfigurator .conf-testbox,
.konfigurator .konfigurator .conf-format,
.konfigurator .konfigurator .conf-differenzierung,
.konfigurator .konfigurator .conf-final {
  display: none;
}
.konfigurator .konfigurator .conf-color .row {
  text-align: center;
}
.konfigurator .konfigurator .conf-color .row article {
  display: inline-block;
  float: none;
}
.konfigurator .konfigurator .conf-final .p2 p {
  display: inline;
}
.konfigurator .konfigurator .conf-final .container {
  margin-top: 0;
  margin-bottom: 0;
}
.konfigurator .konfigurator .conf-final .circle {
  position: relative;
  width: 100%;
  padding-bottom: 100%;
  border-radius: 50%;
  background-color: #ffffff;
}
.konfigurator .konfigurator .conf-final .circle .icon {
  position: absolute;
  lefT: 50%;
  top: 50%;
  margin-top: -32px;
  margin-left: -32px;
}
.konfigurator .konfigurator .conf-final .text {
  position: relative;
  left: 0px;
}
.konfigurator .konfigurator .conf-final .text .text-inner {
  display: inline-block;
  vertical-align: middle;
}
.konfigurator .konfigurator .conf-final .text .text-inner .p2 {
  line-height: 20px;
}

.wiki section {
  position: relative;
}
.wiki section.wiki-header {
  margin-top: 168px;
}
.wiki section.wiki-header h3, .wiki section.wiki-header h1 {
  text-align: center;
}
.wiki section.wiki-header img {
  width: 100%;
  height: auto;
}

.blog section {
  position: relative;
}
.blog section.blog-header {
  margin-top: 168px;
}
.blog section.blog-header.blog-list {
  background-color: #f5f5f5;
  margin-top: 108px;
  padding-top: 60px;
}
.blog section.blog-header h2, .blog section.blog-header h1 {
  text-align: center;
}
.blog section.blog-header h2 a, .blog section.blog-header h1 a {
  margin-right: 10px;
  text-transform: none;
}
.blog section.blog-header img {
  width: 100%;
  height: auto;
}
.blog section.blog-header .kategorie-links a {
  text-decoration: none;
  margin: 10px;
}
.blog section.blog-header .kategorie-links a.ft-gruen {
  text-decoration: underline;
}

.account .profilheader {
  position: relative;
  top: 0px;
  left: 0px;
  margin-top: 108px;
  height: 215px;
  background-color: #69be28;
  background-size: cover;
  background-position: center;
}
@media screen and (max-width: 991px) {
  .account .profilheader {
    height: 300px;
  }
  .account .profilheader [class*=col-] {
    text-align: center;
  }
  .account .profilheader [class*=col-] .icon {
    margin: 20px auto;
  }
}
.account .profilheader .overlay {
  position: absolute;
  lefT: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-color: #69be28;
  opacity: 0.8;
}
.account .profilheader .profilheader-nav {
  list-style: none;
}
.account .profilheader .profilheader-nav li {
  float: right;
  margin-left: 30px;
}
@media screen and (max-width: 991px) {
  .account .profilheader .profilheader-nav li {
    margin-left: 10px;
  }
}
.account .profilheader .profilheader-nav li.aktiv {
  border-bottom: 2px solid #ffffff;
}
.account .profilheader .profilheader-nav li:last-child {
  margin-left: 0px;
}
.account .profilheader .profilheader-nav li a {
  color: #ffffff;
  text-decoration: none;
}
.account .profilheader .profilheader-nav li button {
  color: white;
  background: none;
  border: none;
  padding-bottom: 5px;
  font-weight: normal;
}
.account .profilheader .icon-profile {
  width: 96px;
  heighT: 96px;
  background-image: url(../img/icon-account-avatar-big.svg);
  background-size: 100%;
  border-radius: 50%;
}
.account .profilheader .icon-profile.goldprinter {
  background-image: url(../img/icon-account-avatar-gp-big.svg);
}
.account .profilheader h1 {
  margin-top: 20px;
  color: #ffffff;
  margin-left: 30px;
}
.account .profilheader h3 {
  color: #ffffff;
  opacity: 0.6;
  margin-left: 30px;
}
.account .profileigenschaften {
  background-color: #f5f5f5;
}
.account .profileigenschaften h1 {
  margin-top: 15px;
}
.account .profileigenschaften .btn {
  padding-left: 40px;
  padding-right: 40px;
  margin-lefT: 20px;
}
@media screen and (max-width: 991px) {
  .account .profileigenschaften .btn {
    padding-left: 20px;
    padding-right: 20px;
  }
}
.account .profil-header-sticky {
  position: fixed;
  top: 62px;
  left: 0px;
  width: 100%;
  padding: 10px;
  background-color: #69be28;
  z-index: 2;
  display: none;
}
.account .profil-header-sticky.scrolled {
  display: block;
}
.account .profil-header-sticky .h2 {
  display: block;
  margin-top: 5px;
  text-decoration: none;
  color: #ffffff;
}
.account .profil-header-sticky .h2 img {
  vertical-align: middle;
  margin-right: 30px;
}
.account .profil-header-sticky .btn {
  padding-left: 40px;
  padding-right: 40px;
  margin-lefT: 20px;
}
@media screen and (max-width: 991px) {
  .account .profil-header-sticky .btn {
    padding-left: 20px;
    padding-right: 20px;
  }
}
.account .profilformular {
  position: relative;
  margin-top: 108px;
  background-color: #f5f5f5;
}
.account .profilformular .h2 {
  display: block;
  margin-top: 8px;
  text-decoration: none;
}
.account .profilformular .h2 img {
  vertical-align: middle;
  margin-right: 30px;
}
.account .profilformular .btn {
  padding-left: 40px;
  padding-right: 40px;
  margin-lefT: 20px;
}
@media screen and (max-width: 991px) {
  .account .profilformular .btn {
    padding-left: 20px;
    padding-right: 20px;
  }
}
.account .profilformular .formularheader {
  padding: 30px;
  position: relative;
  top: 0px;
  left: 0px;
  background-color: #69be28;
  background-size: cover;
  background-position: center;
}
@media screen and (max-width: 991px) {
  .account .profilformular .formularheader {
    height: 300px;
  }
  .account .profilformular .formularheader [class*=col-] {
    text-align: center;
  }
  .account .profilformular .formularheader [class*=col-] .icon {
    margin: 20px auto;
  }
}
.account .profilformular .formularheader .overlay {
  position: absolute;
  lefT: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-color: #69be28;
  opacity: 0.8;
}
.account .profilformular .formularheader .icon-profile {
  margin: 0 auto;
  width: 64px;
  heighT: 64px;
  background-image: url(../img/icon-account-avatar-big.svg);
  background-size: 100%;
  border-radius: 50%;
}
.account .profilformular .formularheader .icon-profile.goldprinter {
  background-image: url(../img/icon-account-avatar-gp-big.svg);
}
.account .profilformular .formularheader h1 {
  margin-top: 20px;
  color: #ffffff;
  text-align: center;
}
.account .profilformular .formularheader a {
  color: #ffffff;
  opacity: 0.6;
}
.account .profilformular ul.nav {
  padding: 0;
  margin: 0;
}
.account .profilformular ul.nav li {
  padding: 3px 0;
}
.account .profilformular ul.nav li a {
  color: #262626;
  text-decoration: none;
}
.account .profilformular ul.nav li.aktiv {
  background-color: #ffffff;
  border-left: 4px solid #69be28;
}
.account .profilformular ul.nav li.aktiv a {
  color: #69be28;
}
.account .profilformular .formarea {
  background-color: #ffffff;
}
.account .profilformular .formarea .bordered-row {
  background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 5px 2px;
  background-repeat: repeat-x;
}
.account .profilformular .formarea .bordered-row.row {
  margin-left: 0px;
  margin-right: 0px;
}
.account .profilformular .formarea .bordered-row .s2 {
  margin-bottom: 10px;
}
.account .profilformular .formarea .bordered-row a {
  display: block;
  margin-bottom: 10px;
}
.account .profilformular .formarea textarea {
  height: 200px;
}
.account .profilformular .formarea.tags-form .form-tags {
  padding: 0;
}
.account .profilformular .formarea.tags-form .tagkategorien-nav {
  list-style: none;
  padding-left: 30px;
  border-bottom: 1px solid #e4e4e4;
  height: 60px;
  margin: 0;
}
.account .profilformular .formarea.tags-form .tagkategorien-nav li {
  float: left;
  margin-right: 20px;
  cursor: pointer;
}
.account .profilformular .formarea.tags-form .tagkategorien-nav li.aktiv {
  border-bottom: 4px solid #69be28;
}
.account .profilformular .formarea.tags-form .tagkategorien-tags {
  display: none;
}
.account .profilformular .formarea.tags-form .tagkategorien-tags.active {
  display: block;
}
.account .profilformular .formarea.tags-form .tagkategorien-tags .taglist {
  position: relative;
  background-color: #e4e4e4;
  border-left: 1px solid #cccccc;
  border-right: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  margin-left: 30px;
  margin-right: 30px;
  margin-top: 30px;
}
.account .profilformular .formarea.tags-form .tagkategorien-tags .taglist .tagrow {
  padding: 20px 30px;
  text-align: left;
  height: 80px;
  border-top: 1px solid #cccccc;
}
.account .profilformular .formarea.tags-form .tagkategorien-tags .taglist .tagrow.aktiv {
  background-color: #ffffff;
}
.account .profilformular .formarea.tags-form .tagkategorien-tags .taglist .tagrow .meta-checkbox {
  position: relative;
  width: 40px;
  height: 40px;
  border-radius: 20px;
  border: 1px dashed #666666;
  margin-right: 20px;
}
.account .profilformular .formarea.tags-form .tagkategorien-tags .taglist .tagrow .meta-checkbox.active {
  background-image: url(../img/account/checkbox_listitem_checked.svg);
  background-position: center;
  background-size: cover;
  border: none;
}
.account .profilformular .formarea.tags-form .tagkategorien-tags .taglist .tagrow .meta-checkbox.active .icon {
  display: none;
}
.account .profilformular .formarea.zertifizerungen-form .imageholder .zertifizierung {
  position: relative;
  width: 21%;
  height: 120px;
  margin-right: 3%;
  cursor: pointer;
  margin-bottom: 18px;
}
.account .profilformular .formarea.zertifizerungen-form .imageholder .zertifizierung > input[type=checkbox] {
  display: none;
}
.account .profilformular .formarea.zertifizerungen-form .imageholder .zertifizierung > :checked + .aktiv {
  display: block;
}
.account .profilformular .formarea.zertifizerungen-form .imageholder .zertifizierung .aktiv {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-color: rgba(165, 215, 125, 0.9);
  background-image: url(../img/account/icon_zertifizierung_checked.svg);
  background-position: center;
  background-repeat: no-repeat;
  display: none;
}
.account .profilformular .formarea.bilder-form .imageholder .placeholder,
.account .profilformular .formarea.bilder-form .imageholder .thumbnail,
.account .profilformular .formarea.bilder-form .imageholder .upload-bild,
.account .profilformular .formarea.bilder-form .imageholder .upload-video {
  position: relative;
  width: 21%;
  height: 120px;
  margin-right: 3%;
  cursor: pointer;
  margin-bottom: 18px;
}
.account .profilformular .formarea.bilder-form .imageholder .placeholder .bild,
.account .profilformular .formarea.bilder-form .imageholder .thumbnail .bild,
.account .profilformular .formarea.bilder-form .imageholder .upload-bild .bild,
.account .profilformular .formarea.bilder-form .imageholder .upload-video .bild {
  position: absolute;
  lefT: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
}
.account .profilformular .formarea.bilder-form .imageholder .placeholder .icon-delete,
.account .profilformular .formarea.bilder-form .imageholder .thumbnail .icon-delete,
.account .profilformular .formarea.bilder-form .imageholder .upload-bild .icon-delete,
.account .profilformular .formarea.bilder-form .imageholder .upload-video .icon-delete {
  position: absolute;
  right: 10px;
  top: 10px;
  background-image: url(../img/account/btn_delete.svg);
  width: 25px;
  height: 25px;
  background-size: cover;
  cursor: pointer;
}
.account .profilformular .formarea.bilder-form .imageholder .upload-bild,
.account .profilformular .formarea.bilder-form .imageholder .upload-video {
  text-align: center;
  border: 1px dashed #cccccc;
  padding: 35px 0px;
}
.account .profilformular .formarea.bestellhistorie .bestellungen .bordered-row {
  background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 5px 2px;
  background-repeat: repeat-x;
  padding-bottom: 10px;
  padding-top: 20px;
}
.account .profilformular .formarea.bestellhistorie .bestellungen .bordered-row .s2 {
  margin-bottom: 0px;
}
.account .profilformular .formarea.bestellhistorie .bestellungen .bordered-row a {
  display: block;
  margin-bottom: 10px;
}
.account .profilformular .formarea.bestellhistorie .bestellungen .bordered-row .icon.icon-options {
  background-image: url(../img/account/icon_options.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 35px;
  height: 35px;
  cursor: pointer;
}
.account .profilformular .formarea.bestellhistorie .bestellungen .bordered-row .icon.icon-options:hover {
  background-image: url(../img/account/icon_options-active.svg);
}
.account .profilformular .formarea.bestellhistorie .bestellungen .bordered-row .tracking {
  background-color: #e4e4e4;
  margin-top: 15px;
  margin-bottom: 15px;
  padding-top: 10px;
  padding-bottom: 10px;
}
.account .profilformular .formarea.bestellhistorie .bestellungen .bordered-row .tracking img {
  vertical-align: middle;
  margin-right: 20px;
}
.account .profilformular .formarea.bestellhistorie .bestellungen .bordered-row .tracking a {
  display: inline;
}
.account .profilformular .formarea.bestellhistorie .bestellungen .bordered-row .options {
  display: none;
  position: absolute;
  right: 35px;
  top: -50px;
  width: 250px;
  background-color: #ffffff;
  border-radius: 2px;
  z-index: 2;
  transition: 0.5s;
}
.account .profilformular .formarea.bestellhistorie .bestellungen .bordered-row .options.active {
  display: block;
}
.account .profilformular .formarea.bestellhistorie .bestellungen .bordered-row .options a {
  display: block;
  text-decoration: none;
  color: #262626;
  text-align: left;
  padding: 20px;
  margin: 0;
  background-image: url(../img/account/btn_options_menu_arrow_left.png);
  background-position: 90%;
  background-repeat: no-repeat;
}
.account .profilformular .formarea.bestellhistorie .bestellungen .bordered-row .options a:hover {
  color: #69be28;
  text-decoration: underline;
}
.account .profilformular .formarea.bestellhistorie .bestellungen .bordered-row .options a:first-child {
  border-bottom: 2px dotted #cccccc;
}
.account .profilformular .formarea.bestelldetail .formularheader {
  padding: 20px 40px;
}
@media screen and (max-width: 991px) {
  .account .profilformular .formarea.bestelldetail .formularheader {
    height: 120px;
  }
}
.account .profilformular .formarea.bestelldetail .formularheader h2 {
  margin-top: 12px;
}
.account .profilformular .formarea.bestelldetail .formularheader .s1 {
  margin: 0;
}
.account .profilformular .formarea.bestelldetail .adressen {
  height: 220px;
}
@media screen and (max-width: 1219px) {
  .account .profilformular .formarea.bestelldetail .adressen {
    height: 240px;
  }
}
@media screen and (max-width: 991px) {
  .account .profilformular .formarea.bestelldetail .adressen {
    height: auto;
  }
}
.account .profilformular .formarea.bestelldetail .adressen .rechnungsadresse {
  padding: 40px 55px;
  height: 100%;
}
.account .profilformular .formarea.bestelldetail .adressen .lieferadresse {
  padding: 40px 55px;
  background-image: linear-gradient(#262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: left;
  background-size: 2px 5px;
  background-repeat: repeat-y;
  height: 100%;
}
@media screen and (max-width: 991px) {
  .account .profilformular .formarea.bestelldetail .adressen .lieferadresse {
    background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
    background-position: top;
    background-size: 5px 2px;
    background-repeat: repeat-x;
  }
}
.account .profilformular .formarea.bestelldetail .adressen .zahlungsoption {
  padding: 40px 55px;
  background-image: linear-gradient(#262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: left;
  background-size: 2px 5px;
  background-repeat: repeat-y;
  height: 100%;
}
@media screen and (max-width: 991px) {
  .account .profilformular .formarea.bestelldetail .adressen .zahlungsoption {
    background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
    background-position: top;
    background-size: 5px 2px;
    background-repeat: repeat-x;
  }
}
.account .profilformular .formarea.bestelldetail .positionen .position .icon {
  widtH: 64px;
  height: 64px;
  border-radius: 32px;
  background-color: #f5f5f5;
  background-position: center;
  background-size: 50%;
  background-repeat: no-repeat;
}
@media screen and (max-width: 480px) {
  .account .profilformular .formarea.bestelldetail .positionen .position .icon {
    widtH: 45px;
    height: 45px;
    border-radius: 23px;
  }
}
.account .profilformular .formarea.bestelldetail .positionen .position .h5 {
  margin-top: 20px;
  margin-bottom: 10px;
}
@media screen and (max-width: 480px) {
  .account .profilformular .formarea.bestelldetail .positionen .position .h5 {
    margin-top: 15px;
  }
}
.account .profilformular .formarea.bestelldetail .positionen .position .h5.preis {
  vertical-align: bottom;
  background-color: #f5f5f5;
  padding: 10px 20px 8px 20px;
}
@media screen and (max-width: 480px) {
  .account .profilformular .formarea.bestelldetail .positionen .position .h5.preis {
    font-size: 14px;
    padding: 5px 5px 3px 5px;
    widtH: 100%;
    position: absolute;
    right: 10px;
  }
}
.account .profilformular .formarea.bestelldetail .positionen .position .p2 {
  margin-bottom: 10px;
}
.account .profilformular .formarea.bestelldetail .positionen .bordered-row {
  height: 1px;
}
.account .profilformular .formarea.bestelldetail .zusammenfassung .row {
  margin-top: 5px;
}
.account .profilformular .formarea.bestelldetail .zusammenfassung .row.bordered-row {
  margin-top: 30px;
  margin-bottom: 30px;
  height: 1px;
}

.downloads .kategorie h1 {
  cursor: pointer;
  min-height: 60px;
}
.downloads .kategorie h1 span {
  background-image: url("../img/btn-download.png");
  background-size: cover;
  display: block;
  float: right;
  width: 40px;
  height: 40px;
  transition: 0.5s;
}
.downloads .kategorie .download {
  display: none;
  margin-left: 0px;
  margin-right: 0px;
  background-color: #f5f5f5;
  border-radius: 2px;
  margin-bottom: 10px;
}
.downloads .kategorie .download [class*=col-] {
  padding: 0;
}
.downloads .kategorie .download .p3 {
  margin: 18px 30px;
}

.faq {
  margin-top: 108px;
}
.faq .frage {
  cursor: pointer;
  border-top: 1px solid #e4e4e4;
}
.faq .frage:first-child {
  border-top: none;
}
.faq .frage .arrow {
  background-image: url(../img/arrow-select-down.png);
  width: 50px;
  height: 80px;
  background-position: 50% 37px;
  background-repeat: no-repeat;
  transition: 0.5s;
}
.faq .frage .arrow.aktiv {
  display: none;
}
.faq .antwort {
  display: none;
}
.faq .antwort .arrow {
  background-image: url(../img/arrow-select-up.png);
  width: 50px;
  height: 80px;
  background-position: 50% 37px;
  background-repeat: no-repeat;
  transition: 0.5s;
  position: absolute;
  bottom: 0px;
}

.entdecken .entdecken-nav {
  float: right;
  list-style: none;
}
.entdecken .entdecken-nav li {
  float: left;
  margin-left: 30px;
}
.entdecken .entdecken-nav li.active {
  border-bottom: 2px solid #69be28;
}
.entdecken .entdecken-nav li a {
  display: block;
  color: #ffffff;
  text-decoration: none;
  padding: 30px 0px 10px 0px;
}
.entdecken .plugin-entdecken {
  position: relative;
  margin-top: 108px;
  background-color: #262626;
  background-image: url(../img/projekte/bg-kacheln.png);
  background-size: 100%;
  background-position: top;
  background-repeat: no-repeat;
}
@media screen and (max-width: 991px) {
  .entdecken .plugin-entdecken {
    margin-top: 62px;
  }
}
.entdecken .plugin-entdecken h1 {
  text-align: center;
}
.entdecken .plugin-entdecken .element_searchfield_projekte,
.entdecken .plugin-entdecken .element_searchfield_druckereien {
  display: block;
}
.entdecken .plugin-entdecken .background {
  position: absolute;
  left: 0px;
  top: 0px;
  widtH: 100%;
  height: 100%;
  background-color: #262626;
  opacity: 0.7;
}
.entdecken .plugin-entdecken .sorter {
  padding-top: 8px;
  cursor: pointer;
}
.entdecken .plugin-entdecken .sorter img {
  margin-left: 10px;
}
.entdecken .plugin-entdecken .col-md-4 {
  padding: 15px;
}
.entdecken .entdecken-nav-sticky {
  position: fixed;
  top: 62px;
  left: 0px;
  width: 100%;
  z-index: 3;
  background-color: rgba(0, 0, 0, 0.8);
  display: none;
}
.entdecken .entdecken-nav-sticky p {
  margin-top: 35px;
}
.entdecken .entdecken-nav-sticky p img {
  margin-left: 30px;
  margin-right: 20px;
}
.entdecken .filtericon-sticky {
  position: fixed;
  bottom: 0px;
  left: 0px;
  width: 100%;
  z-index: 3;
}
.entdecken .filtericon-sticky .icon {
  position: relative;
  float: right;
  width: 65px;
  height: 65px;
  cursor: pointer;
  margin-right: -27px;
}
@media screen and (max-width: 991px) {
  .entdecken .filtericon-sticky .icon {
    margin-right: 0px;
  }
}
.entdecken .filtericon-sticky .icon.icon-anfrageliste {
  position: relative;
  background-image: url(../img/entdecken/btn_sticky_anfrageliste.svg);
}
.entdecken .filtericon-sticky .icon.icon-anfrageliste .badge {
  position: absolute;
  right: 0px;
  top: 0px;
  width: 20px;
  height: 20px;
  border-radius: 10px;
  background-color: #000000;
  font-size: 12px;
  padding-top: 4px;
}
.entdecken .filtericon-sticky .icon.icon-filter {
  position: relative;
  background-image: url(../img/entdecken/btn_sticky_filter.svg);
}
.entdecken .filtericon-sticky .icon.icon-filter .badge {
  position: absolute;
  right: 0px;
  top: 0px;
  width: 20px;
  height: 20px;
  border-radius: 10px;
  background-color: #000000;
}

.projekt .projekt-nav-sticky {
  position: fixed;
  top: 62px;
  left: 0px;
  width: 100%;
  z-index: 3;
  background-color: rgba(0, 0, 0, 0.8);
  display: none;
}
.projekt .projekt-nav-sticky p {
  margin-top: 15px;
  text-transform: uppercase;
}
.projekt .projekt-nav-sticky p img {
  margin-left: 30px;
  margin-right: 20px;
  vertical-align: middle;
}
.projekt .projekt-nav-sticky button {
  margin: 10px 15px;
  padding-left: 45px;
  padding-right: 45px;
  background-position: 89%;
  background-repeat: no-repeat;
  cursor: pointer;
}
.projekt .fce-fullwidth-slider {
  margin-top: 108px;
}
@media screen and (max-width: 991px) {
  .projekt .fce-fullwidth-slider {
    margin-top: 62px;
  }
}
.projekt .fce-fullwidth-slider .icon-zoom {
  left: 30px;
}
.projekt .project-metainfos {
  background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: bottom;
  background-size: 5px 2px;
  background-repeat: repeat-x;
}
.projekt .project-metainfos img {
  margin-left: 20px;
}
.projekt .project-infos,
.projekt .project-tags,
.projekt .project-share {
  background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 5px 2px;
  background-repeat: repeat-x;
}
.projekt .project-infos {
  text-align: center;
}
.projekt .project-infos .druckerei {
  height: 100%;
}
.projekt .project-infos .papier {
  background-image: linear-gradient(#262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: left;
  background-size: 2px 5px;
  background-repeat: repeat-y;
  height: 100%;
}
@media screen and (max-width: 991px) {
  .projekt .project-infos .papier {
    background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
    background-position: top;
    background-size: 5px 2px;
    background-repeat: repeat-x;
  }
}
.projekt .project-infos .agentur {
  background-image: linear-gradient(#262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: left;
  background-size: 2px 5px;
  background-repeat: repeat-y;
  height: 100%;
}
@media screen and (max-width: 991px) {
  .projekt .project-infos .agentur {
    background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
    background-position: top;
    background-size: 5px 2px;
    background-repeat: repeat-x;
  }
}
.projekt .project-infos .icon {
  position: relative;
  width: 32px;
  height: 32px;
  margin: 0 auto;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  margin-bottom: 20px;
}
.projekt .project-tags .wiki {
  padding-left: 40px;
  background-image: linear-gradient(#262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: left;
  background-size: 2px 5px;
  background-repeat: repeat-y;
  height: 100%;
}
@media screen and (max-width: 991px) {
  .projekt .project-tags .wiki {
    padding-left: 20px;
    background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
    background-position: top;
    background-size: 5px 2px;
    background-repeat: repeat-x;
  }
}
.projekt .druckerei-webshop,
.projekt .druckerei-zertifizierung,
.projekt .druckerei-kontaktdaten {
  background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 5px 2px;
  background-repeat: repeat-x;
}
.projekt .druckerei-webshop .btn {
  padding-left: 100px;
  padding-right: 100px;
}
.projekt .druckerei-leistungen {
  background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 5px 2px;
  background-repeat: repeat-x;
}
.projekt .druckerei-leistungen .bordered-row {
  background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 5px 2px;
  background-repeat: repeat-x;
}
.projekt .druckerei-leistungen .bordered-row .s2 {
  margin-top: 5px;
}
.projekt .druckerei-zertifizierung .zertifizierung {
  display: inline-block;
  width: 135px;
  height: 120px;
  background-size: 50%;
  background-position: center;
  background-repeat: no-repeat;
  border: 1px solid #cccccc;
  margin: 15px;
}
.projekt .filtericon-sticky {
  position: fixed;
  bottom: 0px;
  left: 0px;
  width: 100%;
  z-index: 3;
}
.projekt .filtericon-sticky .icon {
  position: relative;
  float: right;
  width: 65px;
  height: 65px;
  cursor: pointer;
  margin-right: -27px;
}
@media screen and (max-width: 991px) {
  .projekt .filtericon-sticky .icon {
    margin-right: 0px;
  }
}
.projekt .filtericon-sticky .icon.icon-anfrageliste {
  position: relative;
  background-image: url(../img/entdecken/btn_sticky_anfrageliste.svg);
}
.projekt .filtericon-sticky .icon.icon-anfrageliste .badge {
  position: absolute;
  right: 0px;
  top: 0px;
  width: 20px;
  height: 20px;
  border-radius: 10px;
  background-color: #000000;
  font-size: 12px;
  padding-top: 4px;
}
.projekt .filtericon-sticky .icon.icon-filter {
  position: relative;
  background-image: url(../img/entdecken/btn_sticky_filter.svg);
}
.projekt .filtericon-sticky .icon.icon-filter .badge {
  position: absolute;
  right: 0px;
  top: 0px;
  width: 20px;
  height: 20px;
  border-radius: 10px;
  background-color: #000000;
}

.team {
  margin-top: 108px;
}
.team img {
  display: block;
  margin: 0 auto;
  border-radius: 110px;
}

.papierfabriken {
  margin-top: 108px;
}
.papierfabriken .bordered-row {
  background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 5px 2px;
  background-repeat: repeat-x;
  height: 1px;
}

.warenkorb .warenkorb-header-sticky,
.warenkorb .warenkorb-header {
  padding: 15px;
  background-color: #69be28;
}
.warenkorb .warenkorb-header-sticky.scrolled,
.warenkorb .warenkorb-header.scrolled {
  display: block;
}
.warenkorb .warenkorb-header-sticky .h1b,
.warenkorb .warenkorb-header .h1b {
  display: block;
  margin-top: 13px;
  text-decoration: none;
  color: #ffffff;
}
.warenkorb .warenkorb-header-sticky .h1b img,
.warenkorb .warenkorb-header .h1b img {
  vertical-align: middle;
  margin-right: 30px;
}
.warenkorb .warenkorb-header-sticky .btn,
.warenkorb .warenkorb-header .btn {
  padding-left: 40px;
  padding-right: 40px;
  margin-lefT: 20px;
}
@media screen and (max-width: 991px) {
  .warenkorb .warenkorb-header-sticky .btn,
  .warenkorb .warenkorb-header .btn {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media screen and (max-width: 500px) {
  .warenkorb .warenkorb-header-sticky .btn,
  .warenkorb .warenkorb-header .btn {
    width: 100%;
    margin-top: 10px;
    margin-left: 0px;
  }
}
.warenkorb .warenkorb-header-sticky .btn.zur-kasse,
.warenkorb .warenkorb-header .btn.zur-kasse {
  padding-left: 70px;
  padding-right: 90px;
  background-image: url(../img/account/btn_options_menu_arrow_left.png);
  background-position: 90%;
  background-repeat: no-repeat;
}
.warenkorb .warenkorb-header-sticky {
  position: fixed;
  top: 62px;
  left: 0px;
  width: 100%;
  display: none;
  z-index: 2;
}
.warenkorb .warenkorb-header {
  position: relative;
  margin-top: 108px;
}
.warenkorb .warenkorbformular {
  position: relative;
  background-color: #f5f5f5;
}
.warenkorb .warenkorbformular .h2 {
  display: block;
  margin-top: 8px;
  text-decoration: none;
}
.warenkorb .warenkorbformular .h2 img {
  vertical-align: middle;
  margin-right: 30px;
}
.warenkorb .warenkorbformular .btn {
  padding-left: 40px;
  padding-right: 40px;
  margin-lefT: 20px;
}
@media screen and (max-width: 991px) {
  .warenkorb .warenkorbformular .btn {
    padding-left: 20px;
    padding-right: 20px;
  }
}
.warenkorb .warenkorbformular .formularheader {
  padding: 30px;
  position: relative;
  top: 0px;
  left: 0px;
  background-color: #69be28;
  background-size: cover;
  background-position: center;
}
@media screen and (max-width: 991px) {
  .warenkorb .warenkorbformular .formularheader {
    height: 300px;
  }
  .warenkorb .warenkorbformular .formularheader [class*=col-] {
    text-align: center;
  }
  .warenkorb .warenkorbformular .formularheader [class*=col-] .icon {
    margin: 20px auto;
  }
}
.warenkorb .warenkorbformular .formularheader .overlay {
  position: absolute;
  lefT: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-color: #69be28;
  opacity: 0.8;
}
.warenkorb .warenkorbformular .formularheader .icon-profile {
  margin: 0 auto;
  width: 64px;
  heighT: 64px;
  background-image: url(../img/icon-account-avatar-big.svg);
  background-size: 100%;
  border-radius: 50%;
}
.warenkorb .warenkorbformular .formularheader .icon-profile.goldprinter {
  background-image: url(../img/icon-account-avatar-gp-big.svg);
}
.warenkorb .warenkorbformular .formularheader h1 {
  margin-top: 20px;
  color: #ffffff;
  text-align: center;
}
.warenkorb .warenkorbformular .formularheader a {
  color: #ffffff;
  opacity: 0.6;
}
.warenkorb .warenkorbformular ul.nav {
  padding: 0;
  margin: 0;
}
.warenkorb .warenkorbformular ul.nav li {
  padding: 3px 0;
}
.warenkorb .warenkorbformular ul.nav li a {
  color: #262626;
  text-decoration: none;
}
.warenkorb .warenkorbformular ul.nav li.aktiv {
  background-color: #ffffff;
  border-left: 4px solid #69be28;
}
.warenkorb .warenkorbformular ul.nav li.aktiv a {
  color: #69be28;
}
.warenkorb .warenkorbformular .formarea {
  background-color: #ffffff;
}
.warenkorb .warenkorbformular .formarea .bordered-row {
  background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 5px 2px;
  background-repeat: repeat-x;
}
.warenkorb .warenkorbformular .formarea .bordered-row.row {
  margin-left: 0px;
  margin-right: 0px;
}
.warenkorb .warenkorbformular .formarea .bordered-row .s2 {
  margin-bottom: 10px;
}
.warenkorb .warenkorbformular .formarea .bordered-row a {
  display: block;
  margin-bottom: 10px;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .formularheader {
  padding: 20px 40px;
}
@media screen and (max-width: 991px) {
  .warenkorb .warenkorbformular .formarea.bestelldetail .formularheader {
    height: 120px;
  }
}
.warenkorb .warenkorbformular .formarea.bestelldetail .formularheader h2 {
  margin-top: 12px;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .formularheader .s1 {
  margin: 0;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .adressen {
  height: 220px;
}
@media screen and (max-width: 1219px) {
  .warenkorb .warenkorbformular .formarea.bestelldetail .adressen {
    height: 240px;
  }
}
@media screen and (max-width: 991px) {
  .warenkorb .warenkorbformular .formarea.bestelldetail .adressen {
    height: auto;
  }
}
.warenkorb .warenkorbformular .formarea.bestelldetail .adressen .rechnungsadresse {
  padding: 40px 55px;
  height: 100%;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .adressen .lieferadresse {
  padding: 40px 55px;
  background-image: linear-gradient(#262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: left;
  background-size: 2px 5px;
  background-repeat: repeat-y;
  height: 100%;
}
@media screen and (max-width: 991px) {
  .warenkorb .warenkorbformular .formarea.bestelldetail .adressen .lieferadresse {
    background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
    background-position: top;
    background-size: 5px 2px;
    background-repeat: repeat-x;
  }
}
.warenkorb .warenkorbformular .formarea.bestelldetail .adressen .zahlungsoption {
  padding: 40px 55px;
  background-image: linear-gradient(#262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: left;
  background-size: 2px 5px;
  background-repeat: repeat-y;
  height: 100%;
}
@media screen and (max-width: 991px) {
  .warenkorb .warenkorbformular .formarea.bestelldetail .adressen .zahlungsoption {
    background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
    background-position: top;
    background-size: 5px 2px;
    background-repeat: repeat-x;
  }
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position {
  padding-bottom: 10px;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position .kundenreferenz {
  text-decoration: underline;
  cursor: pointer;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position .formfield-container {
  display: none;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position .icon {
  widtH: 64px;
  height: 64px;
  border-radius: 32px;
  background-color: #f5f5f5;
  background-position: center;
  background-size: 50%;
  background-repeat: no-repeat;
}
@media screen and (max-width: 480px) {
  .warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position .icon {
    widtH: 45px;
    height: 45px;
    border-radius: 23px;
  }
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position .icon.icon-options {
  background-image: url(../img/account/icon_options.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 35px;
  height: 35px;
  cursor: pointer;
  float: right;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position .icon.icon-options:hover {
  background-image: url(../img/account/icon_options-active.svg);
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position .options {
  display: none;
  position: absolute;
  right: 50px;
  top: -50px;
  width: 250px;
  background-color: #ffffff;
  border-radius: 2px;
  z-index: 2;
  transition: 0.5s;
  border: 1px solid #e4e4e4;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position .options.active {
  display: block;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position .options a {
  display: block;
  text-decoration: none;
  color: #262626;
  text-align: left;
  padding: 20px;
  margin: 0;
  background-image: url(../img/account/btn_options_menu_arrow_left.png);
  background-position: 90%;
  background-repeat: no-repeat;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position .options a:hover {
  color: #69be28;
  text-decoration: underline;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position .options a:first-child {
  border-bottom: 2px dotted #cccccc;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position .h5 {
  margin-top: 20px;
  margin-bottom: 10px;
}
@media screen and (max-width: 480px) {
  .warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position .h5 {
    margin-top: 15px;
  }
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position .h5.preis {
  vertical-align: bottom;
  background-color: #f5f5f5;
  padding: 10px 20px 8px 20px;
}
@media screen and (max-width: 480px) {
  .warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position .h5.preis {
    font-size: 14px;
    padding: 5px 5px 3px 5px;
    widtH: 100%;
    position: absolute;
    right: 10px;
  }
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .position .s1 {
  margin-top: 20px;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .preis .geriest {
  padding: 11px;
  background-image: url(../img/checkout/icon_geriest.svg);
  background-position: 7%;
  background-repeat: no-repeat;
  padding-left: 60px;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .preis .h5.preis {
  vertical-align: bottom;
  background-color: #f5f5f5;
  padding: 10px 20px 8px 20px;
}
@media screen and (max-width: 480px) {
  .warenkorb .warenkorbformular .formarea.bestelldetail .positionen .preis .h5.preis {
    font-size: 14px;
    padding: 5px 5px 3px 5px;
    widtH: 100%;
    position: absolute;
    right: 10px;
  }
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .preis .element-switch .switch {
  padding: 3px 0px 2px 0px;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .positionen .bordered-row {
  height: 1px;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .zusammenfassung {
  background-color: #f5f5f5;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .zusammenfassung .btn-lieferregion {
  cursor: pointer;
  padding: 20px 30px;
  background-color: #ffffff;
  background-image: url(../img/account/btn_options_menu_arrow_left.png);
  background-position: 90%;
  background-repeat: no-repeat;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .zusammenfassung .btn {
  margin: 40px 0px;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .zusammenfassung p {
  margin-top: 10px;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .zusammenfassung .row {
  margin-top: 5px;
}
.warenkorb .warenkorbformular .formarea.bestelldetail .zusammenfassung .row.bordered-row {
  margin-top: 30px;
  margin-bottom: 30px;
  height: 1px;
}

.checkout .bordered-row {
  background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 5px 2px;
  background-repeat: repeat-x;
}
.checkout .bordered-row.row {
  margin-left: 0px;
  margin-right: 0px;
}
.checkout .statusbar {
  position: relative;
  top: 0px;
  left: 0px;
  margin-top: 108px;
  height: 78px;
  background-color: #69be28;
}
.checkout .radio-row {
  position: relative;
}
.checkout .radio-row .meta-checkbox {
  margin-top: 0px;
}
.checkout .element-switch {
  width: 75%;
  margin: 20px auto 30px auto;
}
.checkout .element-switch .switch {
  padding: 3px 0px 2px 0px;
}
.checkout .btn-kreditlimit {
  position: absolute;
  right: 30px;
  top: 37px;
}
.checkout .checkout-uebersicht .formularheader {
  padding: 20px 40px;
}
@media screen and (max-width: 991px) {
  .checkout .checkout-uebersicht .formularheader {
    height: 120px;
  }
}
.checkout .checkout-uebersicht .formularheader h2 {
  margin-top: 12px;
}
.checkout .checkout-uebersicht .formularheader .s1 {
  margin: 0;
}
.checkout .checkout-uebersicht .adressen {
  height: 220px;
}
@media screen and (max-width: 1219px) {
  .checkout .checkout-uebersicht .adressen {
    height: 240px;
  }
}
@media screen and (max-width: 991px) {
  .checkout .checkout-uebersicht .adressen {
    height: auto;
  }
}
.checkout .checkout-uebersicht .adressen .rechnungsadresse {
  padding: 40px 55px;
  height: 100%;
}
.checkout .checkout-uebersicht .adressen .lieferadresse {
  padding: 40px 55px;
  background-image: linear-gradient(#262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: left;
  background-size: 2px 5px;
  background-repeat: repeat-y;
  height: 100%;
}
@media screen and (max-width: 991px) {
  .checkout .checkout-uebersicht .adressen .lieferadresse {
    background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
    background-position: top;
    background-size: 5px 2px;
    background-repeat: repeat-x;
  }
}
.checkout .checkout-uebersicht .adressen .zahlungsoption {
  padding: 40px 55px;
  background-image: linear-gradient(#262626 20%, rgba(255, 255, 255, 0) 0%);
  background-position: left;
  background-size: 2px 5px;
  background-repeat: repeat-y;
  height: 100%;
}
@media screen and (max-width: 991px) {
  .checkout .checkout-uebersicht .adressen .zahlungsoption {
    background-image: linear-gradient(to right, #262626 20%, rgba(255, 255, 255, 0) 0%);
    background-position: top;
    background-size: 5px 2px;
    background-repeat: repeat-x;
  }
}
.checkout .checkout-uebersicht .positionen .position .icon {
  widtH: 64px;
  height: 64px;
  border-radius: 32px;
  background-color: #f5f5f5;
  background-position: center;
  background-size: 50%;
  background-repeat: no-repeat;
}
@media screen and (max-width: 480px) {
  .checkout .checkout-uebersicht .positionen .position .icon {
    widtH: 45px;
    height: 45px;
    border-radius: 23px;
  }
}
.checkout .checkout-uebersicht .positionen .position .h5 {
  margin-top: 20px;
  margin-bottom: 10px;
}
@media screen and (max-width: 480px) {
  .checkout .checkout-uebersicht .positionen .position .h5 {
    margin-top: 15px;
  }
}
.checkout .checkout-uebersicht .positionen .position .h5.preis {
  vertical-align: bottom;
  background-color: #f5f5f5;
  padding: 10px 20px 8px 20px;
}
@media screen and (max-width: 480px) {
  .checkout .checkout-uebersicht .positionen .position .h5.preis {
    font-size: 14px;
    padding: 5px 5px 3px 5px;
    widtH: 100%;
    position: absolute;
    right: 10px;
  }
}
.checkout .checkout-uebersicht .positionen .position .p2 {
  margin-bottom: 10px;
}
.checkout .checkout-uebersicht .positionen .bordered-row {
  height: 1px;
}
.checkout .checkout-uebersicht .box-gutschein {
  background-color: #ffffff;
  padding: 30px;
}
.checkout .checkout-uebersicht .zusammenfassung .row {
  margin-top: 5px;
}
.checkout .checkout-uebersicht .zusammenfassung .row.bordered-row {
  margin-top: 30px;
  margin-bottom: 30px;
  height: 1px;
}

.searchbar {
  margin-top: 108px;
  background-color: rgba(0, 0, 0, 0.8);
}
.searchbar .element_searchfield_simple {
  margin-top: 20px;
  margin-bottom: 20px;
}

.plugin-blog-list {
  position: relative;
  background-color: #f5f5f5;
}
.plugin-blog-list h1 {
  text-align: center;
}

.plugin-similar-topics {
  position: relative;
  background-color: #f5f5f5;
}
.plugin-similar-topics h1 {
  text-align: center;
}

.plugin-attached-projects {
  position: relative;
  background-color: #262626;
  background-image: url(../img/projekte/bg-kacheln.png);
  background-size: 100%;
  background-position: top;
  background-repeat: no-repeat;
}
.plugin-attached-projects h1 {
  text-align: center;
}
.plugin-attached-projects .background {
  position: absolute;
  left: 0px;
  top: 0px;
  widtH: 100%;
  height: 100%;
  background-color: #262626;
  opacity: 0.7;
}
.plugin-attached-projects .col-md-4 {
  padding: 15px;
}

.plugin-attached-printers {
  position: relative;
  background-color: #f5f5f5;
  background-size: 100%;
  background-position: top;
  background-repeat: no-repeat;
}
.plugin-attached-printers h1 {
  text-align: center;
}
.plugin-attached-printers .background {
  position: absolute;
  left: 0px;
  top: 0px;
  widtH: 100%;
  height: 100%;
  background-color: #262626;
  opacity: 0.7;
}
.plugin-attached-printers .col-md-4 {
  padding: 15px;
}

/*# sourceMappingURL=main-printfarm.css.map */