@font-face {
  font-family: Tpw Cargo;
  src: url('../fonts/tpw_cargo.woff2') format("woff2"), url('../fonts/tpw_cargo.eot') format("embedded-opentype"), url('../fonts/tpw_cargo.woff') format("woff"), url('../fonts/tpw_cargo.ttf') format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: auto;
}

@font-face {
  font-family: Tpwprov Web;
  src: url('../fonts/tpwprov-web-bold.woff2') format("woff2"), url('../fonts/tpwprov-web-bold.woff') format("woff"), url('../fonts/tpwprov-web-bold.otf') format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Lotagrotesque;
  src: url('../fonts/LotaGrotesque-Regular.eot') format("embedded-opentype"), url('../fonts/LotaGrotesque-Regular.woff') format("woff"), url('../fonts/LotaGrotesque-Regular.ttf') format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: auto;
}

@font-face {
  font-family: Lotagrotesque;
  src: url('../fonts/LotaGrotesque-Bold.eot') format("embedded-opentype"), url('../fonts/LotaGrotesque-Bold.woff') format("woff"), url('../fonts/LotaGrotesque-Bold.ttf') format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: auto;
}

@font-face {
  font-family: Lotagrotesque;
  src: url('../fonts/LotaGrotesque-SemiBold.eot') format("embedded-opentype"), url('../fonts/LotaGrotesque-SemiBold.woff') format("woff"), url('../fonts/LotaGrotesque-SemiBold.ttf') format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: auto;
}

:root {
  --blue: blue;
  --verbright-green: #01e08d;
  --almostblack: #1d1d1d;
  --orange: #ff9c00;
  --lavender: #d3b3ed;
  --bright-green: #00cc78;
  --box-radius: 20px;
  --white-smoke: #ecf0f1;
  --bright-purple: #6b00c4;
  --red-orange: #ff4e00;
  --white: #fff;
  --light-yellow: #ffff93;
  --blue-violet: #853fff;
  --dark-blue: #1a3481;
  --lightblueish: #202020;
  --steel-blue: #3b99d9;
  --steel-blue-2: #2e80b6;
  --dark-khaki: #a8d069;
  --medium-sea-green: #30ad64;
  --light-sea-green: #25ccbf;
  --light-sea-green-2: #20ac99;
  --sandy-brown: #f8c740;
  --goldenrod: #e2a62b;
  --khaki: #face6a;
  --sandy-brown-2: #e4b962;
  --salmon: #fd7072;
  --indian-red: #cf404d;
  --tan: #d39f9a;
  --dim-gray: #735260;
  --indian-red-2: #af4173;
  --brown: #822e50;
  --tomato: #e64c40;
  --firebrick: #bf3a30;
  --salmon-2: #fc7d64;
  --silver: #bec3c7;
  --dim-gray-2: #49647b;
  --dark-slate-gray: #2d3e4f;
  --dark-slate-gray-2: #404047;
  --white-smoke-2: #edeff2;
  --white-smoke-3: #f3f3f3;
  --light-gray: #d4d4d4;
  --dim-gray-3: #5d5d5d;
  --dark-slate-gray-3: #303030;
  --dim-grey: #505050;
  --burlywood: #cba162;
  --greenish: #b4fee5;
  --darkgreenish: #85fed4;
  --brightred: #ff0064;
  --misty-rose: #fdd9e8;
  --silver-2: #bebebe;
  --greentext: #2bfda9;
  --lavender-blush: #fee6ef;
  --dark-grey: #a1a1a1;
  --dim-grey-2: #747474;
  --khaki-2: #feeda2;
  --lavender-blush-2: #ffecf4;
  --page-margin: 20px;
}

.w-layout-blockcontainer {
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

@media screen and (max-width: 991px) {
  .w-layout-blockcontainer {
    max-width: 728px;
  }
}

@media screen and (max-width: 767px) {
  .w-layout-blockcontainer {
    max-width: none;
  }
}

h1 {
  text-align: left;
  margin-top: 0;
  margin-bottom: 10px;
  font-family: Lotagrotesque, Arial, sans-serif;
  font-size: 40px;
  font-weight: 400;
  line-height: 1.3em;
}

h2 {
  margin-bottom: 10px;
  font-family: Lotagrotesque, Arial, sans-serif;
  font-size: 30px;
  font-weight: 400;
  line-height: 1.3em;
}

h3 {
  margin-top: 0;
  margin-bottom: 10px;
  font-family: Lotagrotesque, Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 1.3em;
}

h4 {
  margin-top: 0;
  margin-bottom: 5px;
  font-family: Lotagrotesque, Arial, sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.3em;
}

h5 {
  margin-top: 0;
  margin-bottom: 5px;
  font-size: 18px;
  font-weight: 700;
  line-height: 25px;
}

h6 {
  color: #5d5d5d;
  margin-top: 0;
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 400;
  line-height: 25px;
}

p {
  margin-top: 0;
  margin-bottom: 15px;
}

a {
  color: #000;
  text-decoration: underline;
}

label {
  margin-top: 15px;
  margin-bottom: 5px;
  font-weight: 400;
  display: block;
}

blockquote {
  border-left: 5px #e2e2e2;
  margin-bottom: 0;
  padding: 0;
  font-size: 28px;
  font-weight: 600;
  line-height: 36px;
}

.navigation-bar {
  text-align: center;
  margin-top: 45px;
}

.section {
  background-color: #fff;
  padding-left: 2.5%;
  padding-right: 2.5%;
  position: relative;
}

.header-section {
  text-align: center;
  padding-top: 76px;
  padding-bottom: 76px;
}

.social-icon-link {
  opacity: .9;
  margin-left: 4px;
  margin-right: 4px;
  padding: 3px;
  transition: opacity .2s;
}

.social-icon-link:hover {
  opacity: .37;
}

.footer-text {
  color: #a8a8a8;
  text-transform: none;
  margin-top: 8px;
  margin-bottom: 0;
  font-family: Lotagrotesque, Arial, sans-serif;
  font-size: 13px;
}

.nav-link {
  text-align: center;
  text-transform: none;
  font-family: Lotagrotesque, Arial, sans-serif;
  font-size: 16px;
  line-height: 25px;
  text-decoration: none;
  transition: color .2s;
  display: inline-block;
}

.nav-link:hover, .nav-link.w--current {
  color: #303030;
}

.main-image {
  margin-bottom: 39px;
}

.byline-wrapper {
  color: #ccc;
  text-align: center;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 25px;
  font-size: 12px;
  line-height: 18px;
}

.byline-link {
  color: #ccc;
  margin-right: 5px;
  font-family: Montserrat, sans-serif;
  text-decoration: none;
  transition: color .2s;
  display: inline-block;
}

.byline-link:hover {
  color: #333;
}

.byline-text {
  margin-right: 5px;
  font-family: Montserrat, sans-serif;
  display: inline-block;
}

.blog-content {
  width: 65%;
  margin-bottom: 52px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
  line-height: 22px;
  display: block;
}

.blog-content h1, .blog-content h2 {
  font-weight: 400;
}

.blog-content h3 {
  font-weight: 700;
}

.blog-content h6 {
  text-transform: uppercase;
}

.blog-home-link {
  color: #303030;
  font-family: Montserrat, sans-serif;
  text-decoration: none;
  transition: opacity .2s;
}

.blog-home-link:hover {
  opacity: .82;
}

.blog-name {
  letter-spacing: 1px;
  margin-bottom: 0;
  font-size: 53px;
  line-height: 57px;
  display: inline-block;
}

.blog-name:hover {
  color: #6d6d6d;
}

.link-to-page {
  color: #303030;
  text-align: center;
  letter-spacing: 1px;
  text-transform: uppercase;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
  font-family: Montserrat, sans-serif;
  font-size: 11px;
  line-height: 18px;
  text-decoration: none;
  transition: color .2s;
  display: block;
}

.link-to-page:hover {
  color: #d4d4d4;
}

.blog-headline {
  text-align: center;
  text-transform: none;
  margin-top: 0;
  margin-bottom: 0;
  padding-bottom: 17px;
  font-family: Montserrat, sans-serif;
  font-size: 30px;
  font-weight: 400;
  line-height: 39px;
  display: block;
}

.heading-wrapper {
  width: 80%;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.post-heading {
  text-align: center;
  text-transform: uppercase;
  font-weight: 400;
}

.category-heading {
  text-align: center;
  margin-bottom: 39px;
}

.blog-list {
  width: 100%;
  margin-bottom: 53px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.blog-item {
  border-top: 1px solid #0000001a;
  padding-top: 31px;
}

.empty-state {
  color: #fff;
  text-align: center;
  background-color: #20ac99;
  margin-bottom: 54px;
  padding-top: 29px;
}

.inline-heading {
  display: inline-block;
}

.intro {
  padding-top: 70px;
  position: relative;
}

.logobox {
  width: 25%;
  max-width: 320px;
  position: static;
}

.navigation {
  background-color: #0000;
  max-width: 1500px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 8%;
  padding-right: 20px;
  font-weight: 700;
  display: block;
}

.navitem {
  color: #00f;
  cursor: pointer;
  border-radius: 4px;
  margin-left: 5px;
  margin-right: 5px;
  padding: 7px 10px 6px;
}

.navitem.w--current {
  color: var(--blue);
  background-color: #0000ff1a;
  border-radius: 4px;
}

.newslink {
  color: #00f;
  text-decoration: none;
  display: block;
}

.dropdown-holder {
  color: #000;
  padding-left: 15px;
  padding-right: 15px;
}

.nav {
  margin-top: 23px;
}

.box-for-link {
  text-align: center;
  justify-content: center;
  margin-bottom: 30px;
  display: flex;
}

.footernav {
  color: #fff;
  font-size: 15px;
  line-height: 26px;
}

.footer-info {
  color: #fff;
  margin-bottom: 80px;
  font-size: 15px;
}

.image-3 {
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.footercolumns {
  max-width: 1200px;
  margin-bottom: 30px;
  display: block;
}

.gotoplink {
  margin-left: auto;
  margin-right: auto;
  padding: 10px 20px 15px;
  text-decoration: none;
  display: block;
}

.toplinkbox {
  text-align: center;
  padding-top: 40px;
}

.link {
  color: #fff;
  text-decoration: none;
}

.link:hover {
  color: #505050;
}

.togglelink {
  color: #00f;
  text-decoration: none;
}

.imageslide {
  opacity: 1;
  background-image: url('../images/main_sachrang.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
}

.footer-final {
  color: #00cc78;
  background-color: #fff;
  padding-top: 20px;
  padding-bottom: 25px;
  font-size: 16px;
  line-height: 24px;
}

.submenu {
  color: #00f;
}

.submenu.w--open {
  background-color: #fff;
  border: 2px solid #00f;
  border-radius: 0 0 3px 3px;
  padding-top: 6px;
  padding-bottom: 8px;
  font-size: 17px;
  font-weight: 400;
  box-shadow: 0 0 5px #0003;
}

.subnavlink {
  color: #00f;
  padding-top: 8px;
  padding-bottom: 8px;
  padding-right: 24px;
  font-weight: 600;
}

.subnavlink:hover {
  background-color: #e9e9ff;
}

.questionbox {
  margin-top: 20px;
  margin-right: 32%;
  text-decoration: none;
  transition: transform .2s;
  display: block;
}

.questionbox:hover {
  transform: translate(5px);
}

.item-unlinked {
  color: #e9e9e9;
}

.termin-more {
  float: right;
  text-align: right;
  padding-bottom: 1px;
  text-decoration: none;
  display: inline-block;
}

.menu-button {
  color: #00f;
}

.utility-page-wrap {
  justify-content: center;
  align-items: center;
  width: 100vw;
  max-width: 100%;
  height: 100vh;
  max-height: 100%;
  display: flex;
}

.utility-page-content {
  text-align: center;
  flex-direction: column;
  width: 260px;
  display: flex;
}

.social-button {
  float: right;
  margin-bottom: 10px;
  margin-left: 10px;
  padding-left: 0;
}

.footer-link {
  color: #fff;
  text-decoration: none;
}

.footer-nav {
  color: #fff;
  background-color: #00cc79;
  padding-top: 25px;
  padding-bottom: 40px;
}

.body {
  background-color: var(--verbright-green);
  color: var(--almostblack);
  font-family: Lotagrotesque, Arial, sans-serif;
  font-size: 20px;
  line-height: 28px;
}

.body.home {
  background-color: var(--verbright-green);
  color: #000;
}

.body.bg-orange {
  background-color: var(--orange);
}

.body.bg-lightpurple {
  background-color: var(--lavender);
  color: #202020;
}

.body.bg-peach {
  background-color: #ff99a8;
}

.footer-nav-title {
  margin-bottom: 20px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 30px;
  line-height: 50px;
}

.footer-nav-link {
  background-color: #fff;
  border-radius: 30px;
  margin-bottom: 20px;
  margin-right: 20px;
  padding: 10px 25px;
  text-decoration: none;
  display: inline-block;
  box-shadow: 10px 10px #000;
}

.footer-nav-link:hover {
  box-shadow: 10px 10px #0800ff;
}

.footer-nav-link.help {
  color: #fff;
  background-color: #ff4e00;
}

.footer-nav-link.parents {
  box-shadow: 10px 10px #ff4e00;
}

.for-parents-nav {
  padding-top: 25px;
}

.footer-label-text {
  color: var(--bright-green);
  margin-right: 25px;
  display: inline-block;
}

.footer-tpw-link {
  vertical-align: top;
  display: inline-block;
}

.tpw-label {
  float: left;
  position: static;
}

.imprint-label {
  float: right;
}

.imprint-link {
  color: var(--bright-green);
  text-decoration: none;
}

.navbar {
  color: #000;
  text-align: center;
  background-color: #0000;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}

.brand {
  color: #000;
  padding: 15px 20px;
  font-weight: 700;
}

.brand:hover {
  color: #fff;
}

.nav-menu {
  float: none;
  width: 50%;
  margin-left: auto;
  margin-right: auto;
}

.topnav-link-parents {
  float: right;
  padding: 15px 25px 10px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 25px;
  font-weight: 700;
  text-decoration: none;
  display: block;
}

.topnav-link-parents:hover {
  color: #fff;
}

.dropdown-toggle {
  padding-top: 15px;
  padding-bottom: 10px;
  padding-right: 20px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 25px;
}

.dropdown-link {
  background-color: #fff;
  border-radius: 25px;
  display: inline-block;
  box-shadow: 10px 10px #000;
}

.dropdown-list {
  background-color: #ddd;
}

.dropdown-list.w--open {
  text-align: center;
  overflow-wrap: normal;
  background-color: #0000;
}

.main-headline {
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 120px;
  line-height: 120px;
}

.main-headline._140p {
  font-size: 140px;
  line-height: 140px;
}

.main-headline._120p, .main-headline._100p, .main-headline.stueck {
  font-size: 120px;
  line-height: 120px;
}

.title-stage {
  padding-top: 50px;
}

.introtext-home {
  font-size: 35px;
  line-height: 46px;
}

.testimonial-image {
  float: right;
  background-color: var(--orange);
  border-radius: 50%;
  width: 30%;
  height: 30%;
  margin-left: 30px;
}

.page-intro {
  padding-top: 60px;
}

.content {
  margin-top: 50px;
  margin-bottom: 50px;
}

.linkbox {
  border-radius: var(--box-radius);
  background-color: var(--orange);
  color: var(--blue);
  flex-flow: column;
  flex: 0 auto;
  justify-content: space-between;
  width: 44%;
  min-height: 300px;
  margin-bottom: 50px;
  margin-right: 50px;
  padding: 25px 20px 20px;
  text-decoration: none;
  transition: transform .2s;
  display: flex;
}

.linkbox:hover {
  transform: scale(1.05);
}

.linkbox.bg-blue {
  background-color: var(--blue);
  color: var(--verbright-green);
}

.linkbox.bg-white {
  background-color: var(--white-smoke);
  color: var(--bright-purple);
}

.linkbox.bg-red {
  background-color: var(--red-orange);
  color: var(--white);
}

.linkbox.outline-wht {
  color: var(--white);
  background-color: #0000;
  border: 3px solid #fff;
}

.linkbox.dotted-wht {
  color: var(--white);
  background-color: #0000;
  border: 3px dotted #fff;
  align-self: flex-end;
}

.linkbox.bg-yellow {
  background-color: var(--light-yellow);
  color: var(--verbright-green);
}

.box-headline {
  margin-bottom: 26px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 4.2em;
  line-height: .9em;
}

.box-headline.small {
  font-size: 3.2em;
}

.box-headline.xxl {
  padding-top: 12px;
  font-size: 6.5em;
}

.box-headline.smaller {
  font-size: 2.2em;
}

.box-headline.orange {
  color: var(--orange);
}

.box-headline.purple {
  color: var(--bright-purple);
}

.teaser-holder {
  flex-flow: wrap;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: flex-start;
  align-items: stretch;
  display: flex;
}

.linkbox-video-icon {
  float: right;
  color: var(--orange);
  text-align: center;
  text-transform: uppercase;
  background-image: url('../images/zickbubble-blue.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  margin-left: auto;
  margin-right: auto;
  padding: 38px 30px 25px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 30px;
  position: absolute;
  inset: auto 0% 0% auto;
}

.linkbox-video-icon.bg-orange {
  color: var(--blue);
  background-image: url('../images/zickbubble-orange.svg');
}

.linkbox-video-icon.bg-green {
  color: var(--blue);
  background-image: url('../images/zickbubble-green.svg');
}

.linkbox-video-icon.bg-purple {
  color: var(--white);
  background-image: url('../images/zickbubble-purple.svg');
}

.stueck-teaser {
  max-width: 1200px;
  margin-bottom: 50px;
  margin-left: auto;
  margin-right: auto;
}

.stueck-link {
  border-radius: var(--box-radius);
  background-color: var(--bright-purple);
  color: var(--red-orange);
  width: 75%;
  margin-right: 50px;
  text-decoration: none;
  transition: transform .2s;
  display: flex;
  overflow: hidden;
}

.stueck-link:hover {
  transform: scale(1.05);
}

.stueck-link.bg-blue {
  background-color: var(--blue);
  color: var(--orange);
}

.stueckbox-textholder {
  width: 50%;
  padding: 30px 30px 25px 25px;
}

.stueckbox-imageholder {
  background-image: url('../images/9dad59df.jpg');
  background-position: 50%;
  background-size: cover;
  width: 50%;
}

.stueck-box-headline {
  color: var(--red-orange);
  margin-bottom: 25px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 7em;
  line-height: .9em;
}

.image-5 {
  float: right;
}

.stueck-sidetext {
  float: right;
  text-align: center;
  width: 22%;
  padding-top: 20px;
}

.heading {
  margin-bottom: 25px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 60px;
  line-height: 50px;
}

.video-holder {
  max-width: 1020px;
  margin-bottom: 50px;
  margin-left: auto;
  margin-right: auto;
}

.video-frame {
  border-radius: var(--box-radius);
  background-color: var(--light-yellow);
  padding: 30px;
}

.video-frame.bg-green {
  background-color: var(--verbright-green);
  display: block;
}

.video-frame.bg-lightpurple {
  background-color: var(--blue-violet);
}

.video-frame.bg-red {
  background-color: var(--red-orange);
}

.video-frame.bg-purple {
  background-color: var(--bright-purple);
}

.video-sing-along-text {
  float: left;
  color: var(--light-yellow);
  margin-top: 10px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 40px;
  line-height: 60px;
}

.text-block-2 {
  padding-top: 10px;
}

.link-w-arrow {
  float: right;
  color: var(--light-yellow);
  background-image: url('../images/arrow-right-byellow.svg');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: 70px;
  margin-top: 10px;
  padding: 10px 80px 10px 10px;
  text-decoration: none;
}

.quiz-background {
  background-color: var(--dark-blue);
  color: var(--verbright-green);
  margin-left: -90px;
  margin-right: -90px;
  padding-top: 25px;
  padding-bottom: 50px;
  overflow: hidden;
  box-shadow: inset 0 0 40px #000000a3;
}

.quiz-headline {
  text-align: center;
  margin-top: 45px;
  margin-bottom: 34px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 5.1em;
  line-height: .9em;
}

.quiz-yes-link {
  float: left;
  color: var(--dark-blue);
  background-color: #0000;
  background-image: url('../images/quiz-yes-bubble.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  margin-left: 20px;
  margin-right: 20px;
  padding: 40px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 60px;
  line-height: 50px;
  text-decoration: none;
  display: block;
}

.quiz-no-link {
  float: left;
  color: var(--dark-blue);
  background-color: #0000;
  background-image: url('../images/quiz-no-bubble.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  margin-left: 20px;
  margin-right: 20px;
  padding: 40px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 60px;
  line-height: 50px;
  text-decoration: none;
  display: block;
}

.container.text-block {
  margin-bottom: 20px;
}

.container.relative {
  position: relative;
}

.container.songtext-holder {
  margin-bottom: 50px;
  display: flex;
}

.container.copyright {
  margin-top: 100px;
}

.quiz-wn-link {
  float: left;
  color: var(--dark-blue);
  background-color: #0000;
  background-image: url('../images/quiz-wn-bubble.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  margin-left: 20px;
  margin-right: 20px;
  padding: 30px 30px 20px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 30px;
  line-height: 30px;
  text-decoration: none;
  transition: transform .2s;
  display: block;
}

.quiz-wn-link:hover {
  transform: scale(1.2);
}

.quiz-holder {
  margin-top: 130px;
  margin-bottom: 100px;
  overflow: hidden;
}

.quiz-button-holders {
  justify-content: center;
  align-items: center;
  display: flex;
}

.linkbox-arrow-icon {
  float: right;
  color: var(--light-yellow);
  background-image: url('../images/arrow-right-byellow.svg');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: 70px;
  padding-top: 19px;
  padding-bottom: 19px;
  padding-right: 80px;
  text-decoration: none;
  position: absolute;
  inset: auto 0% 0% auto;
}

.linkbox-arrow-icon.purple {
  color: var(--bright-purple);
  background-image: url('../images/arrow-right-purple.svg');
}

.linkbox-arrow-icon.white {
  background-image: url('../images/arrow-right-wht.svg');
}

.linkbox-arrow-icon.red {
  background-image: url('../images/arrow-right-red.svg');
}

.linkbox-textholder {
  font-size: 30px;
  line-height: 35px;
  position: relative;
}

.linkbox-text {
  padding-right: 90px;
  line-height: 36px;
}

.linkbox-text._50p {
  padding-right: 50%;
}

.linkbox-text.orange {
  color: var(--orange);
}

.linkbox-text.purple {
  color: var(--bright-purple);
}

._75p {
  width: 75%;
}

.video-fram-caption {
  margin-top: 20px;
  margin-left: 30px;
}

.bellygame-holder {
  margin-top: 100px;
  margin-bottom: 100px;
}

.belly-game {
  border-radius: var(--box-radius);
  background-color: var(--bright-purple);
  color: var(--orange);
  text-align: center;
  flex-flow: column;
  justify-content: space-between;
  min-height: 60vh;
  padding: 25px 60px 40px;
  display: flex;
}

.richttext-p75 {
  width: 75%;
}

.richttext {
  width: 95%;
}

.handfont {
  margin-bottom: 20px;
  font-family: Tpwprov Web, Arial, sans-serif;
  line-height: 1.1em;
}

.handfont.size-h2 {
  font-size: 55px;
}

.handfont.size-h3 {
  font-size: 35px;
}

.handfont.size-h1 {
  font-size: 70px;
  line-height: 1em;
}

.xx-belly-game {
  text-align: center;
}

.belly-game-holder {
  max-width: 1020px;
  margin-bottom: 70px;
  margin-left: auto;
  margin-right: auto;
}

.bellygame-question {
  text-align: center;
  margin-top: 45px;
  margin-bottom: 34px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 5.1em;
  line-height: .9em;
}

.bellygame-button-holders {
  flex-flow: row;
  justify-content: space-between;
  align-items: flex-end;
  display: flex;
}

.belly-yes-link {
  float: left;
  color: var(--bright-purple);
  background-color: #0000;
  background-image: url('../images/quiz-yes-bubble.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  margin-left: 0;
  margin-right: 20px;
  padding: 40px 30px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 60px;
  line-height: 50px;
  text-decoration: none;
  display: block;
}

.belly-wn-link {
  float: left;
  color: var(--bright-purple);
  background-color: #0000;
  background-image: url('../images/belly-wn-bubble.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  margin-left: 20px;
  margin-right: 20px;
  padding: 30px 30px 20px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 30px;
  line-height: 30px;
  text-decoration: none;
  transition: transform .2s;
  display: block;
}

.belly-wn-link:hover {
  transform: scale(1.2);
}

.belly-no-link {
  float: left;
  color: var(--bright-purple);
  background-image: url('../images/quiz-no-bubble.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  margin-left: 20px;
  margin-right: 0;
  padding: 35px 25px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 60px;
  line-height: 50px;
  text-decoration: none;
  display: block;
}

.next-steps {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: row;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.nextlink-box {
  border-radius: var(--box-radius);
  background-color: var(--orange);
  color: var(--blue);
  flex-flow: column;
  flex: auto;
  justify-content: space-between;
  padding: 25px 20px 20px;
  text-decoration: none;
  transition: transform .2s;
  display: flex;
}

.nextlink-box:hover {
  transform: scale(1.05);
}

.nextlink-box.bg-blue {
  background-color: var(--blue);
  color: var(--verbright-green);
}

.nextlink-box.bg-white {
  background-color: var(--white-smoke);
  color: var(--bright-purple);
}

.nextlink-box.bg-white.blk {
  color: var(--almostblack);
}

.nextlink-box.bg-red {
  background-color: var(--red-orange);
  color: var(--white);
}

.nextlink-box.outline-wht {
  color: var(--white);
  background-color: #0000;
  border: 3px solid #fff;
}

.nextlink-box.dotted-wht {
  color: var(--white);
  background-color: #0000;
  border: 3px dotted #fff;
  align-self: flex-end;
}

.nextlink-box.first {
  order: -9999;
}

.nextlink-box.last {
  order: 9999;
}

.next-steps-holder {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: row;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: space-between;
  align-items: stretch;
  margin-top: 100px;
  margin-bottom: 100px;
}

.next-steps-label {
  text-align: center;
  margin-bottom: 40px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 30px;
}

.page-title {
  margin-bottom: 25px;
}

.audioplay-button {
  color: var(--verbright-green);
  background-image: url('../images/headphones-play.svg');
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: auto;
  padding-top: 5px;
  padding-bottom: 35px;
  padding-right: 60px;
  font-size: 22px;
  text-decoration: none;
  position: absolute;
  inset: auto 0% -9% auto;
}

.audioplay-button:hover {
  color: #ff9500;
}

.cardslider-holder {
  max-width: 1020px;
  margin: 70px auto 50px;
}

.cardslider-text {
  float: left;
  width: 31%;
  padding-top: 20px;
}

.cardslider {
  float: none;
  border-radius: var(--box-radius);
  width: 66%;
  margin-left: auto;
  overflow: hidden;
}

.slider-cardslider {
  background-color: #ff4e00;
  height: auto;
  min-height: auto;
}

.cardslider-image {
  border-radius: 15px;
  width: 50%;
  margin-right: 30px;
  overflow: hidden;
}

.cardslider-cardtext {
  color: var(--white);
  text-align: center;
  width: 50%;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.3em;
}

.cardslider-slide {
  padding: 25px 70px;
}

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

.text-block-4 {
  color: var(--white);
  text-align: center;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.3em;
}

.slide-nav {
  display: none;
}

.programm-slider-right-arrow {
  background-image: url('../images/arrow-right-wht.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 15%;
  width: 50%;
  height: 50px;
  inset: auto 0% 0% 50%;
}

.programm-slogan {
  margin-bottom: 25px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 40px;
  line-height: 1.1em;
}

.programm-slider-holder {
  max-width: 1020px;
  margin-bottom: 25px;
  margin-left: auto;
  margin-right: auto;
}

.programm-slider {
  border-radius: var(--box-radius);
  background-color: var(--bright-green);
  padding: 20px 30px 30px;
}

.programm-slider.bg-green {
  background-color: var(--verbright-green);
  display: block;
}

.programm-slider.bg-orange {
  background-color: var(--red-orange);
}

.programm-slider.bg-purple {
  color: var(--lightblueish);
  background-color: #869aff;
}

.programm-slider-left-arrow {
  display: none;
}

.text-block-5 {
  width: 65%;
}

.programm-learning {
  width: 65%;
  margin-left: auto;
}

.heading-3 {
  float: left;
  width: 30%;
}

.programm-learn-label {
  float: left;
  width: 30%;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 30px;
  line-height: 1.2em;
}

.slider-programmslider {
  background-color: #0000;
  height: auto;
  min-height: auto;
}

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

.programm-slide-image {
  width: 50%;
}

.div-block-2 {
  text-align: center;
  width: 50%;
}

.programmslide-label {
  margin-bottom: 15px;
  font-weight: 600;
}

.programmslider-slidetext {
  color: var(--white);
  text-align: center;
  width: 50%;
  padding-bottom: 20px;
  padding-left: 30px;
  padding-right: 30px;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.3em;
}

.programm-scene {
  margin-bottom: 50px;
}

.heading-4 {
  font-weight: 400;
}

.remember-button-yes {
  float: right;
  color: var(--white);
  text-align: center;
  text-transform: none;
  background-image: url('../images/bubble-green.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  margin-left: auto;
  margin-right: auto;
  padding: 35px 30px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 40px;
  line-height: 40px;
  text-decoration: none;
  position: absolute;
  inset: auto 0% 27% auto;
}

.remember-button-yes.bg-orange {
  color: var(--blue);
  background-image: url('../images/zickbubble-orange.svg');
}

.remember-button-yes.bg-green {
  color: var(--blue);
  background-image: url('../images/zickbubble-green.svg');
}

.remember-button-yes.bg-purple {
  color: var(--white);
  background-image: url('../images/zickbubble-purple.svg');
}

.remember-button-no {
  float: right;
  color: var(--bright-purple);
  text-align: center;
  text-transform: none;
  background-image: url('../images/quiz-no-bubble.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  margin-left: auto;
  margin-right: auto;
  padding: 26px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 40px;
  line-height: 40px;
  text-decoration: none;
  position: absolute;
  inset: auto 0% -3% auto;
}

.remember-button-no.bg-orange {
  color: var(--blue);
  background-image: url('../images/zickbubble-orange.svg');
}

.remember-button-no.bg-green {
  color: var(--blue);
  background-image: url('../images/zickbubble-green.svg');
}

.remember-button-no.bg-purple {
  color: var(--white);
  background-image: url('../images/zickbubble-purple.svg');
}

.div-block-3 {
  width: 60%;
  margin-left: auto;
  margin-right: auto;
}

.richttext-p60 {
  width: 60%;
  margin-right: auto;
}

.songtext-sidecol {
  width: 38%;
  margin-left: auto;
}

.songtext-zitat {
  text-align: right;
  margin-bottom: 50px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 55px;
  line-height: 1em;
}

.songtext-icon-notes {
  float: right;
  color: var(--light-yellow);
  background-image: url('../images/notes-blk.svg');
  background-position: 100% 100%;
  background-repeat: no-repeat;
  background-size: contain;
  padding-top: 60px;
  padding-bottom: 60px;
  padding-right: 85px;
  text-decoration: none;
  position: absolute;
  inset: auto 0% 0% auto;
}

.songtext-icon-notes.purple {
  color: var(--bright-purple);
  background-image: url('../images/arrow-right-purple.svg');
}

.songtext-icon-notes.white {
  background-image: url('../images/arrow-right-wht.svg');
}

.songtext-icon-notes.red {
  background-image: url('../images/arrow-right-red.svg');
}

.icon-notes {
  background-image: url('../images/notes-blk.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  margin-left: auto;
  margin-right: auto;
  padding: 70px;
  line-height: 40px;
  position: absolute;
  inset: auto 0% -10% auto;
}

.icon-notes.bg-orange {
  color: var(--blue);
  background-image: url('../images/zickbubble-orange.svg');
}

.icon-notes.bg-green {
  color: var(--blue);
  background-image: url('../images/zickbubble-green.svg');
}

.icon-notes.bg-purple {
  color: var(--white);
  background-image: url('../images/zickbubble-purple.svg');
}

.sontext-download-box {
  border-radius: var(--box-radius);
  background-color: var(--white);
  flex-flow: column;
  flex: auto;
  justify-content: space-between;
  margin-top: 20px;
  margin-bottom: 40px;
  padding: 25px 20px 20px;
  text-decoration: none;
  transition: transform .2s;
  display: flex;
}

.sontext-download-box:hover {
  transform: scale(1.05);
}

.sontext-download-box.bg-blue {
  background-color: var(--blue);
  color: var(--verbright-green);
}

.sontext-download-box.bg-white {
  background-color: var(--white-smoke);
  color: var(--bright-purple);
}

.sontext-download-box.bg-white.blk {
  color: var(--almostblack);
}

.sontext-download-box.bg-red {
  background-color: var(--red-orange);
  color: var(--white);
}

.sontext-download-box.outline-wht {
  color: var(--white);
  background-color: #0000;
  border: 3px solid #fff;
}

.sontext-download-box.dotted-wht {
  color: var(--white);
  background-color: #0000;
  border: 3px dotted #fff;
  align-self: flex-end;
}

.sontext-download-box.first {
  order: -9999;
}

.sontext-download-box.last {
  order: 9999;
}

.downloadbox-text {
  padding-right: 90px;
  font-size: 25px;
  line-height: 1.3em;
}

.downloadbox-text._50p {
  padding-right: 50%;
}

.downloadbox-text.orange {
  color: var(--orange);
}

.question-block {
  margin-bottom: 50px;
}

.question {
  margin-left: 100px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 85px;
  line-height: 85px;
}

.question-number {
  float: left;
  background-color: var(--white);
  text-align: center;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 80px;
  height: 80px;
  padding-top: 13px;
  font-size: 50px;
  font-weight: 600;
  line-height: 60px;
  display: block;
}

.question-link {
  vertical-align: top;
  background-image: url('../images/star-wht.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  margin-left: 15px;
  padding: 20px 25px 16px 30px;
  font-family: Lotagrotesque, Arial, sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 20px;
  text-decoration: none;
  display: inline-block;
}

.option-block {
  background-image: url('../images/curve-arrow-blk.svg');
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 80px;
  margin-right: 20px;
  position: relative;
}

.options {
  margin-bottom: 50px;
  display: flex;
}

.check-icon {
  background-image: url('../images/checkcircle-green.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  padding: 30px;
  position: absolute;
  inset: auto -4% -6% auto;
}

.option-text {
  border-radius: var(--box-radius);
  background-color: var(--white);
  height: 100%;
  margin-left: 100px;
  padding: 25px;
}

.nummer-gegen-kummer {
  float: left;
  border-radius: var(--box-radius);
  background-color: var(--white);
  background-image: url('../images/phone-icon-blk.svg');
  background-position: 25px;
  background-repeat: no-repeat;
  background-size: auto 60%;
  width: 48%;
  margin-right: 25px;
  padding: 25px 25px 10px 120px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 100px;
  font-weight: 400;
  line-height: 100px;
  text-decoration: none;
  display: block;
}

.benefits-list {
  width: 50%;
  margin-left: auto;
  padding-top: 15px;
}

.kummernummer-block {
  margin-bottom: 50px;
}

.feebackslider-holder {
  background-image: url('../images/feedback-bubble-wht4x.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  max-width: 1020px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.slider {
  background-color: #0000;
  height: auto;
}

.image-6 {
  width: 50%;
  max-width: none;
  height: 100%;
  display: block;
}

.is-stretch-svg {
  max-width: none;
  display: block;
  position: absolute;
  inset: 0%;
}

.feedbackslide-content {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  margin-left: 16%;
  margin-right: 16%;
  padding-top: 100px;
  padding-bottom: 90px;
  display: flex;
}

.feedback-text {
  margin-bottom: 10px;
  margin-right: auto;
  font-size: 30px;
  line-height: 1.3em;
}

.feedback-source {
  margin-right: auto;
}

.feebackslider-left-arrow {
  background-image: url('../images/arrow-left-green.svg');
  background-position: 80%;
  background-repeat: no-repeat;
  background-size: 45%;
  width: 15%;
}

.feebackslider-right-arrow {
  background-image: url('../images/arrow-right-green.svg');
  background-position: 20%;
  background-repeat: no-repeat;
  background-size: 45%;
  width: 15%;
}

.feedback-form {
  background-image: url('../images/form-connector.svg');
  background-position: 75% 0;
  background-repeat: no-repeat;
  background-size: auto 270px;
  width: 60%;
  margin-top: -70px;
  padding-top: 160px;
}

.formfield-message {
  border-radius: var(--box-radius);
  border-style: none;
  min-height: 60px;
  padding: 20px;
  font-size: 22px;
  line-height: 1.3em;
}

.feedback-fieldlabel {
  margin-top: 20px;
  margin-bottom: 10px;
  padding-left: 18px;
}

.submit-button {
  border-radius: var(--box-radius);
  background-color: var(--blue-violet);
  width: 100%;
  margin-top: 20px;
  margin-bottom: 20px;
  padding: 20px 20px 15px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 40px;
  line-height: 40px;
}

.submit-button:hover {
  background-color: var(--red-orange);
}

.feedbackfor-consent {
  margin-top: 30px;
}

.form-sidecol {
  float: right;
  width: 35%;
  margin-top: 90px;
}

.parents-headline {
  font-family: Tpw Cargo, sans-serif;
  font-size: 120px;
  line-height: 120px;
}

.parents-headline._140p {
  font-size: 140px;
  line-height: 140px;
}

.parents-headline._120p, .parents-headline._100p {
  font-size: 120px;
  line-height: 120px;
}

.backlink-icon {
  float: right;
  text-align: center;
  background-image: url('../images/zickbubble-wht.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 25%;
  margin-left: 15px;
  padding: 45px 40px 33px;
  font-family: Tpwprov Web, Arial, sans-serif;
  font-size: 25px;
  text-decoration: none;
}

.backlink-icon.bottom {
  float: none;
  margin-right: auto;
}

.quotebox {
  border-radius: var(--box-radius);
  background-color: var(--orange);
  margin-bottom: 25px;
  padding: 20px 25px;
  font-size: 40px;
  line-height: 1.3em;
}

.quotebox.bg-lavender {
  background-color: var(--lavender);
}

.paragraph {
  line-height: 1.3em;
}

.highlight-rule {
  border-radius: var(--box-radius);
  background-color: var(--white-smoke);
  margin-top: 5px;
  margin-bottom: 5px;
  margin-right: 10px;
  padding: 15px 25px;
  font-size: 25px;
  display: inline-block;
}

.playbutton-icon {
  background-color: #000;
  border-radius: 50%;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  padding: 20px 16px 16px 22px;
  line-height: 22px;
}

.feedback-response {
  border-radius: var(--box-radius);
  background-color: var(--light-yellow);
  border-style: none;
  padding: 15px 20px;
}

.copyright-symbol {
  float: left;
}

.copyright-text {
  padding-left: 20px;
}

html.w-mod-js [data-ix="fade-in-bottom-page-loads"] {
  opacity: 0;
  transform: translate(0, 50px);
}

html.w-mod-js [data-ix="fade-in-left-scroll-in"] {
  opacity: 0;
  transform: translate(-50px);
}

html.w-mod-js [data-ix="fade-in-right-scroll-in"] {
  opacity: 0;
  transform: translate(50px);
}

html.w-mod-js [data-ix="fade-in-top-scroll-in"] {
  opacity: 0;
  transform: translate(0, -50px);
}

html.w-mod-js [data-ix="fade-in-bottom-scroll-in"] {
  opacity: 0;
  transform: translate(0, 50px);
}

html.w-mod-js [data-ix="bounce-in-scroll-in"] {
  opacity: 0;
  transform: scale(.6);
}

html.w-mod-js [data-ix="scale-on-scroll"] {
  opacity: 0;
  transform: scale(.01);
}

html.w-mod-js [data-ix="fade-in"] {
  opacity: 0;
}

@media screen and (max-width: 991px) {
  h1 {
    font-size: 35px;
  }

  h2 {
    font-size: 26px;
  }

  h3 {
    font-size: 22px;
  }

  .section {
    padding-left: 7.5%;
    padding-right: 7.5%;
  }

  .footer-section {
    padding-left: 0%;
    padding-right: 0%;
  }

  .footer-text {
    line-height: 20px;
  }

  .main-image {
    margin-bottom: 35px;
  }

  .blog-content {
    width: 75%;
  }

  .logobox {
    width: 35%;
  }

  .navitem {
    padding-top: 20px;
    padding-bottom: 15px;
  }

  .newslink {
    float: left;
  }

  .nav {
    z-index: 9999;
    background-color: #fff;
    margin-top: 0;
    position: fixed;
    box-shadow: 14px 14px 16px 16px #0000008a;
  }

  .submenu.w--open {
    border-left-style: none;
    border-right-style: none;
    padding-top: 6px;
  }

  .questionbox {
    margin-right: 16%;
  }

  .menu-button {
    padding-top: 15px;
    padding-bottom: 15px;
    font-size: 30px;
    line-height: 30px;
  }

  .body {
    font-size: 18px;
    line-height: 25px;
  }

  .topnav-link-parents {
    font-size: 22px;
    line-height: 25px;
  }

  .main-headline._140p {
    font-size: 120px;
    line-height: 125px;
  }

  .main-headline._120p {
    font-size: 95px;
    line-height: 95px;
  }

  .main-headline._100p, .main-headline.stueck {
    font-size: 90px;
    line-height: 92px;
  }

  .title-stage {
    padding-top: 30px;
  }

  .page-intro {
    padding-top: 40px;
  }

  .linkbox {
    width: 44%;
    margin-bottom: 40px;
    margin-right: 40px;
  }

  .box-headline {
    font-size: 3.5em;
  }

  .box-headline.small {
    font-size: 2.6em;
  }

  .box-headline.xxl {
    font-size: 5.4em;
  }

  .box-headline.smaller {
    font-size: 1.8em;
  }

  .linkbox-video-icon {
    padding-top: 29px;
    padding-bottom: 20px;
    font-size: 20px;
  }

  .stueck-teaser {
    max-width: none;
    margin-left: 20px;
    margin-right: 20px;
  }

  .stueck-link {
    width: 100%;
  }

  .stueck-link:hover {
    transform: none;
  }

  .stueck-box-headline {
    font-size: 5.8em;
  }

  .stueck-sidetext {
    float: none;
    width: 100%;
    margin-bottom: 40px;
    padding-left: 45px;
    padding-right: 45px;
  }

  .video-holder {
    margin-left: 20px;
    margin-right: 20px;
  }

  .link-w-arrow {
    margin-top: 0;
  }

  .quiz-headline {
    font-size: 4.8em;
  }

  .quiz-wn-link {
    font-size: 25px;
    line-height: 20px;
  }

  .linkbox-text {
    font-size: 25px;
    line-height: 31px;
  }

  .bold-text {
    font-size: 95px;
    line-height: 95px;
  }

  .belly-game {
    margin-left: 0;
    margin-right: 0;
  }

  .handfont.size-h2 {
    font-size: 45px;
  }

  .handfont.size-h3 {
    font-size: 30px;
  }

  .handfont.size-h1 {
    font-size: 45px;
  }

  .bellygame-question {
    font-size: 4.8em;
  }

  .belly-wn-link {
    font-size: 25px;
    line-height: 20px;
  }

  .next-steps {
    grid-column-gap: 15px;
    grid-row-gap: 15px;
  }

  .audioplay-button {
    bottom: -38%;
  }

  .cardslider-holder {
    margin-left: 20px;
    margin-right: 20px;
  }

  .cardslider-text {
    text-align: center;
    width: 100%;
    margin-bottom: 26px;
  }

  .cardslider {
    width: 100%;
  }

  .programm-slogan {
    margin-bottom: 20px;
    font-size: 30px;
  }

  .programm-slider-holder {
    margin-left: 20px;
    margin-right: 20px;
  }

  .programm-learn-label, .programmslider-slidetext {
    font-size: 25px;
  }

  .remember-button-yes {
    padding: 30px;
    font-size: 30px;
    line-height: 30px;
  }

  .remember-button-no {
    padding-top: 29px;
    padding-bottom: 20px;
    font-size: 30px;
    line-height: 30px;
  }

  .bold-text-3 {
    font-size: 30px;
  }

  .songtext-sidecol {
    width: 36%;
  }

  .songtext-zitat {
    font-size: 40px;
  }

  .icon-notes {
    padding: 55px;
    font-size: 30px;
    line-height: 30px;
  }

  .sontext-download-box {
    margin-left: auto;
  }

  .downloadbox-text {
    font-size: 20px;
  }

  .question {
    margin-left: 80px;
    font-size: 70px;
    line-height: 75px;
  }

  .question-number {
    width: 60px;
    height: 60px;
    font-size: 30px;
    line-height: 38px;
  }

  .nummer-gegen-kummer {
    background-size: auto 50%;
    width: 40%;
    padding-top: 25px;
    padding-bottom: 15px;
    padding-left: 85px;
    font-size: 55px;
    line-height: 55px;
  }

  .benefits-list {
    width: 58%;
    padding-top: 5px;
  }

  .feebackslider-holder {
    margin-left: 10px;
    margin-right: 10px;
  }

  .slider {
    height: auto;
  }

  .feedbackslide-content {
    flex-flow: column;
  }

  .feedback-source {
    margin-right: auto;
  }

  .parents-headline {
    font-size: 100px;
    line-height: 100px;
  }

  .parents-headline._140p {
    font-size: 120px;
    line-height: 125px;
  }

  .parents-headline._120p {
    font-size: 95px;
    line-height: 95px;
  }

  .parents-headline._100p {
    font-size: 90px;
    line-height: 92px;
  }

  .backlink-icon {
    margin-right: 15px;
    padding-left: 35px;
    padding-right: 35px;
    font-size: 20px;
  }

  .paragraph {
    font-size: 30px;
  }

  .highlight-rule {
    font-size: 22px;
    line-height: 22px;
  }

  .text-block-6 {
    font-size: 20px;
  }
}

@media screen and (max-width: 767px) {
  h2 {
    font-size: 24px;
  }

  h4 {
    font-size: 18px;
  }

  .navigation-bar {
    margin-top: 21px;
  }

  .header-section {
    padding-top: 38px;
    padding-bottom: 38px;
  }

  .main-image {
    margin-bottom: 34px;
  }

  .blog-content, .link-to-page, .heading-wrapper {
    width: 80%;
  }

  .post-heading {
    font-size: 25px;
    line-height: 29px;
  }

  .logobox {
    width: 50%;
    padding-left: 0;
  }

  .navigation {
    padding-left: 4%;
  }

  .footer-info {
    text-align: center;
    margin-left: 15px;
    margin-right: 15px;
  }

  .footercolumns {
    text-align: center;
  }

  .footer-final {
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
  }

  .questionbox {
    margin-right: 15px;
  }

  .footer-nav {
    padding-left: 20px;
    padding-right: 20px;
  }

  .footer-tpw-link {
    width: 60%;
  }

  .tpw-label {
    text-align: left;
  }

  .brand {
    padding: 10px 15px;
    font-size: 14px;
  }

  .nav-menu {
    width: 30%;
  }

  .topnav-link-parents {
    padding: 12px 15px;
    font-size: 20px;
  }

  .dropdown-toggle {
    font-size: 22px;
  }

  .main-headline._140p, .main-headline._120p {
    font-size: 85px;
    line-height: 90px;
  }

  .main-headline._100p {
    font-size: 75px;
    line-height: 80px;
  }

  .main-headline.stueck {
    margin-bottom: 60px;
    font-size: 75px;
    line-height: 80px;
  }

  .title-stage {
    padding-bottom: 30px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .introtext-home {
    font-size: 30px;
    line-height: 40px;
  }

  .testimonial-image {
    margin-bottom: 25px;
    margin-left: 25px;
  }

  .page-intro {
    margin-left: 20px;
    margin-right: 20px;
    padding-top: 0;
  }

  .content {
    margin: 40px 20px;
  }

  .linkbox {
    min-height: 240px;
    margin-bottom: 25px;
    margin-right: 25px;
    padding: 20px 15px 15px;
  }

  .box-headline {
    font-size: 2.9em;
  }

  .box-headline.small {
    font-size: 2.1em;
  }

  .box-headline.xxl {
    font-size: 4.5em;
  }

  .box-headline.smaller {
    font-size: 2.1em;
  }

  .linkbox-video-icon {
    padding: 15px;
  }

  .stueck-teaser {
    margin-left: 0;
    margin-right: 0;
  }

  .stueck-box-headline {
    font-size: 4.5em;
  }

  .video-holder {
    margin-left: 0;
    margin-right: 0;
  }

  .video-frame {
    padding: 20px;
  }

  .quiz-background {
    margin-left: 0;
    margin-right: 0;
  }

  .quiz-headline {
    font-size: 3.5em;
  }

  .quiz-yes-link {
    padding: 28px;
    font-size: 50px;
  }

  .quiz-no-link {
    padding: 30px;
    font-size: 50px;
  }

  .container.copyright {
    text-align: left;
  }

  .quiz-wn-link {
    padding: 20px;
    font-size: 20px;
  }

  .quiz-holder {
    margin: 70px -20px;
  }

  .linkbox-text._50p {
    font-size: 22px;
    line-height: 28px;
  }

  .video-fram-caption {
    margin-top: 15px;
    margin-left: 20px;
    font-size: 16px;
    line-height: 22px;
  }

  .bellygame-holder {
    margin: 70px -20px;
  }

  .belly-game {
    margin-left: 0;
    margin-right: 0;
    padding-left: 25px;
    padding-right: 25px;
  }

  .richttext-p75 {
    width: 100%;
  }

  .bellygame-question {
    font-size: 3em;
  }

  .belly-yes-link {
    padding: 28px;
    font-size: 50px;
  }

  .belly-wn-link {
    padding: 20px;
    font-size: 20px;
  }

  .belly-no-link {
    padding: 30px;
    font-size: 50px;
  }

  .next-steps {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex-flow: column;
  }

  .nextlink-box {
    order: -9999;
    min-height: 180px;
    margin-bottom: 25px;
    margin-right: 25px;
    padding: 20px 15px 15px;
  }

  .next-steps-label {
    margin-bottom: 25px;
    font-size: 25px;
  }

  .column {
    padding-bottom: 15px;
    padding-left: 0;
    padding-right: 0;
  }

  .bold-text-2 {
    font-size: 25px;
  }

  .audioplay-button {
    width: 86px;
    bottom: -26%;
  }

  .cardslider-holder {
    margin-left: 0;
    margin-right: 0;
  }

  .cardslider-cardtext {
    font-size: 25px;
  }

  .programm-slider-holder {
    margin-bottom: 20px;
    margin-left: 0;
    margin-right: 0;
  }

  .programm-slider {
    padding: 10px 20px 20px;
  }

  .programm-learn-label {
    font-size: 20px;
  }

  .programmslider-slidetext {
    font-size: 18px;
  }

  .remember-button-yes {
    inset: auto auto -4% 37%;
  }

  .remember-button-no {
    padding: 15px;
    inset: auto 20% 0% auto;
  }

  .richttext-p60 {
    width: 100%;
  }

  .songtext-icon-notes {
    padding-top: 30px;
    padding-bottom: 30px;
    padding-right: 50px;
  }

  .icon-notes {
    bottom: 1%;
  }

  .sontext-download-box {
    order: -9999;
    padding: 20px 15px 15px;
  }

  .downloadbox-text {
    font-size: 18px;
  }

  .downloadbox-text._50p {
    font-size: 22px;
    line-height: 28px;
  }

  .question-block {
    margin-bottom: 25px;
  }

  .question {
    margin-left: 50px;
    font-size: 55px;
    line-height: 60px;
  }

  .question-number {
    width: 40px;
    height: 40px;
    padding-top: 9px;
    font-size: 20px;
    line-height: 25px;
  }

  .option-block {
    margin-bottom: 35px;
  }

  .options {
    display: block;
  }

  .nummer-gegen-kummer {
    width: 48%;
    padding-left: 75px;
    font-size: 50px;
  }

  .benefits-list {
    width: 50%;
    padding-top: 0;
  }

  .kummernummer-block {
    margin-bottom: 30px;
  }

  .feebackslider-holder {
    margin-left: -10px;
    margin-right: -10px;
  }

  .feedback-text {
    font-size: 25px;
  }

  .feedback-form {
    width: 56%;
  }

  .formfield-message {
    padding: 15px;
    font-size: 18px;
  }

  .form-sidecol {
    width: 40%;
  }

  .parents-headline {
    font-size: 80px;
    line-height: 80px;
  }

  .parents-headline._140p, .parents-headline._120p {
    font-size: 85px;
    line-height: 90px;
  }

  .parents-headline._100p {
    font-size: 75px;
    line-height: 80px;
  }

  .backlink-icon {
    width: 30%;
    margin-bottom: 12px;
    padding: 26px 25px 22px;
    font-size: 18px;
    line-height: 22px;
  }

  .quotebox {
    font-size: 30px;
  }

  .highlight-rule {
    padding: 10px 18px;
    font-size: 20px;
  }

  .heading-5 {
    font-size: 30px;
  }

  .feedback-response {
    padding: 10px 15px;
    font-size: 18px;
  }

  .response-box {
    padding-left: 20px;
    padding-right: 20px;
  }
}

@media screen and (max-width: 479px) {
  h1 {
    font-size: 35px;
    line-height: 42px;
  }

  h3 {
    font-size: 20px;
  }

  label {
    margin-top: 10px;
    margin-bottom: 3px;
  }

  .section {
    padding-left: 0%;
    padding-right: 0%;
  }

  .blog-content, .link-to-page {
    width: 90%;
  }

  .blog-headline {
    font-size: 25px;
    line-height: 30px;
  }

  .heading-wrapper {
    width: 90%;
  }

  .post-heading {
    font-size: 24px;
  }

  .intro {
    padding-top: 40px;
  }

  .logobox {
    width: 75%;
  }

  .navigation {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0%;
    padding-right: 0;
  }

  .newslink {
    float: none;
  }

  .nav {
    margin-top: 0;
    transition: opacity .2s;
  }

  .footer-final {
    padding: 15px 15px 20px;
  }

  .footer-nav {
    padding-left: 15px;
    padding-right: 15px;
  }

  .footer-nav-title {
    font-size: 22px;
    line-height: 30px;
  }

  .footer-nav-link {
    margin-bottom: 15px;
    margin-right: 15px;
    padding-left: 15px;
    padding-right: 15px;
    font-size: 16px;
    line-height: 20px;
  }

  .footer-label-text {
    margin-bottom: 10px;
    display: block;
  }

  .footer-tpw-link {
    width: 80%;
  }

  .tpw-label {
    text-align: left;
  }

  .imprint-label {
    margin-top: 75px;
  }

  .brand {
    padding-bottom: 5px;
  }

  .nav-menu {
    width: 100%;
    margin-top: 40px;
  }

  .topnav-link-parents {
    padding-bottom: 5px;
    padding-left: 12px;
    font-size: 18px;
  }

  .dropdown-toggle {
    text-align: center;
    padding-top: 10px;
    display: block;
  }

  .main-headline._120p {
    font-size: 70px;
    line-height: 70px;
  }

  .main-headline._100p {
    font-size: 54px;
    line-height: 56px;
  }

  .main-headline.stueck {
    margin-bottom: 70px;
    font-size: 54px;
    line-height: 56px;
  }

  .title-stage {
    padding-top: 20px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .introtext-home {
    font-size: 25px;
    line-height: 32px;
  }

  .testimonial-image {
    width: 40%;
    height: 40%;
    margin-top: -40px;
  }

  .page-intro {
    margin-left: 15px;
    margin-right: 15px;
  }

  .content {
    margin-top: 20px;
    margin-left: 15px;
    margin-right: 15px;
  }

  .linkbox {
    width: 100%;
    min-height: 200px;
    margin-right: 0;
  }

  .linkbox-video-icon {
    padding-top: 14px;
    padding-bottom: 10px;
  }

  .stueck-teaser {
    margin-bottom: 40px;
  }

  .stueck-link {
    flex-flow: column;
    display: flex;
  }

  .stueckbox-textholder {
    width: 100%;
    padding: 25px 15px 15px;
  }

  .stueckbox-imageholder {
    width: 100%;
    padding-bottom: 69%;
  }

  .stueck-box-headline {
    margin-bottom: 10px;
    font-size: 4.5em;
  }

  .stueck-sidetext {
    padding-left: 0;
    padding-right: 0;
  }

  .video-frame {
    padding: 15px;
  }

  .video-sing-along-text {
    padding-left: 10px;
    font-size: 30px;
    line-height: 40px;
  }

  .link-w-arrow {
    background-size: 50px;
    padding-top: 9px;
    padding-bottom: 9px;
    padding-right: 60px;
  }

  .quiz-background {
    padding-bottom: 40px;
    padding-left: 10px;
    padding-right: 10px;
  }

  .quiz-headline {
    margin-top: 25px;
  }

  .quiz-yes-link {
    margin-left: 10px;
    margin-right: 10px;
    padding: 15px;
    font-size: 30px;
    line-height: 30px;
  }

  .quiz-no-link {
    margin-left: 0;
    margin-right: 0;
    padding: 20px;
    font-size: 30px;
    line-height: 30px;
  }

  .container.text-block {
    margin-bottom: 10px;
  }

  .container.songtext-holder {
    display: block;
  }

  .container.copyright {
    margin-top: 50px;
    font-size: 15px;
    line-height: 22px;
  }

  .quiz-wn-link {
    margin-left: 10px;
    margin-right: 10px;
    padding-left: 20px;
    padding-right: 20px;
    font-size: 16px;
    line-height: 16px;
  }

  .quiz-holder {
    margin: 50px -15px;
  }

  .bold-text {
    font-size: 80px;
    line-height: 85px;
  }

  .dropdown {
    width: 100%;
  }

  .video-fram-caption {
    margin-left: 15px;
  }

  .bellygame-holder {
    margin: 50px -15px;
  }

  .belly-game {
    padding-bottom: 40px;
    padding-left: 10px;
    padding-right: 10px;
  }

  .handfont.size-h2 {
    font-size: 35px;
  }

  .handfont.size-h3 {
    font-size: 22px;
  }

  .handfont.size-h1 {
    font-size: 35px;
  }

  .bellygame-question {
    margin-top: 25px;
    font-size: 2em;
  }

  .bellygame-button-holders {
    flex-flow: column;
    align-items: center;
  }

  .belly-yes-link {
    margin-left: 10px;
    margin-right: 10px;
    padding: 15px;
    font-size: 30px;
    line-height: 30px;
  }

  .belly-wn-link {
    margin-left: 10px;
    margin-right: 10px;
    padding-left: 20px;
    padding-right: 20px;
    font-size: 16px;
    line-height: 16px;
  }

  .belly-no-link {
    margin-left: 0;
    margin-right: 0;
    padding: 20px;
    font-size: 30px;
    line-height: 30px;
  }

  .nextlink-box {
    width: 100%;
    min-height: 200px;
    margin-right: 0;
  }

  .nextlink-box:hover {
    transform: none;
  }

  .next-steps-holder {
    margin-top: 50px;
  }

  .next-steps-label {
    margin-bottom: 20px;
    font-size: 20px;
  }

  .page-title {
    font-size: 20px;
    line-height: 30px;
  }

  .audioplay-button {
    width: 100px;
    bottom: 1%;
  }

  .cardslider-image {
    width: 100%;
    margin-bottom: 20px;
    margin-right: 0;
  }

  .cardslider-cardtext {
    width: 100%;
    margin-top: 15px;
    font-size: 20px;
  }

  .cardslider-slide {
    padding-left: 40px;
    padding-right: 40px;
  }

  .cardslider-content {
    flex-flow: column;
    justify-content: space-around;
    align-items: center;
    padding-left: 15px;
    padding-right: 15px;
    display: flex;
  }

  .cardslider-left-arrow {
    width: 20%;
  }

  .programm-slider-right-arrow {
    width: 100%;
    height: 30px;
    left: 0%;
  }

  .programm-slider {
    padding: 15px;
  }

  .programm-slider-left-arrow {
    width: 20%;
  }

  .programm-learning {
    width: 100%;
  }

  .programm-learn-label {
    width: 100%;
    margin-bottom: 10px;
  }

  .programmslide-content {
    flex-flow: column;
    margin-bottom: 30px;
    display: flex;
  }

  .programm-slide-image {
    width: 100%;
  }

  .programmslide-label {
    text-align: center;
  }

  .programmslider-slidetext {
    width: 100%;
    margin-top: 20px;
    padding-bottom: 10px;
    font-size: 20px;
  }

  .remember-button-yes {
    padding: 24px;
    font-size: 20px;
    line-height: 20px;
    inset: auto auto 0% 20%;
  }

  .remember-button-no {
    padding-top: 14px;
    padding-bottom: 10px;
    font-size: 20px;
    line-height: 25px;
    bottom: 0%;
    right: 20%;
  }

  .songtext-sidecol {
    width: 100%;
    margin-top: 40px;
  }

  .songtext-zitat {
    text-align: left;
    margin-bottom: 40px;
  }

  .songtext-icon-notes {
    padding: 40px;
  }

  .icon-notes {
    padding: 40px;
    font-size: 20px;
    line-height: 20px;
    inset: 6% 5% auto auto;
  }

  .sontext-download-box {
    width: 100%;
    min-height: 200px;
    margin-right: 0;
  }

  .sontext-download-box:hover {
    transform: none;
  }

  .question {
    margin-left: 0;
    font-size: 45px;
    line-height: 50px;
  }

  .question-number {
    margin-right: 10px;
  }

  .question-link {
    margin-left: 10px;
    padding: 14px 20px 12px 23px;
    font-size: 18px;
    line-height: 18px;
  }

  .cardslider-right-arrow {
    width: 20%;
  }

  .option-block {
    background-size: 40px;
    margin-right: 10px;
  }

  .option-text {
    margin-left: 50px;
    padding: 15px;
  }

  .nummer-gegen-kummer {
    width: 100%;
    margin-bottom: 20px;
    padding-left: 85px;
    font-size: 55px;
  }

  .benefits-list {
    width: 100%;
  }

  .feedback-text {
    font-size: 18px;
  }

  .feedback-source {
    font-size: 15px;
    line-height: 22px;
  }

  .feedback-form {
    background-image: none;
    width: 100%;
    margin-top: 0;
    padding-top: 0;
  }

  .formfield-message {
    min-height: 40px;
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .feedback-fieldlabel {
    padding-left: 10px;
  }

  .feedbackfor-consent {
    margin-top: 10px;
  }

  .form-sidecol {
    float: none;
    width: 100%;
    margin-top: 30px;
    margin-bottom: 40px;
  }

  .parents-headline {
    font-size: 70px;
    line-height: 72px;
  }

  .parents-headline._120p {
    font-size: 70px;
    line-height: 70px;
  }

  .parents-headline._100p {
    font-size: 50px;
    line-height: 52px;
  }

  .backlink-icon {
    width: 50%;
    margin-top: -30px;
  }

  .quotebox {
    padding: 15px 20px;
    font-size: 25px;
  }

  .heading-5 {
    font-size: 28px;
    line-height: 1.3em;
  }

  .feedback-response {
    min-height: 40px;
  }

  .response-box {
    padding-left: 10px;
    padding-right: 10px;
  }
}


@font-face {
  font-family: 'Tpw Cargo';
  src: url('../fonts/tpw_cargo.woff2') format('woff2'), url('../fonts/tpw_cargo.eot') format('embedded-opentype'), url('../fonts/tpw_cargo.woff') format('woff'), url('../fonts/tpw_cargo.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Tpwprov Web';
  src: url('../fonts/tpwprov-web-bold.woff2') format('woff2'), url('../fonts/tpwprov-web-bold.woff') format('woff'), url('../fonts/tpwprov-web-bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Lotagrotesque';
  src: url('../fonts/LotaGrotesque-Regular.eot') format('embedded-opentype'), url('../fonts/LotaGrotesque-Regular.woff') format('woff'), url('../fonts/LotaGrotesque-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Lotagrotesque';
  src: url('../fonts/LotaGrotesque-Bold.eot') format('embedded-opentype'), url('../fonts/LotaGrotesque-Bold.woff') format('woff'), url('../fonts/LotaGrotesque-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Lotagrotesque';
  src: url('../fonts/LotaGrotesque-SemiBold.eot') format('embedded-opentype'), url('../fonts/LotaGrotesque-SemiBold.woff') format('woff'), url('../fonts/LotaGrotesque-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: auto;
}