body {
  background-position: 40% 0px,center 0px;
  background-repeat: repeat-x;
  background-image: url("../images/troetentiere/konfetti.png"), url("../images/troetentiere/verlauf-rosa.png");
  background-size: 1000px auto, 500px 800px;
  background-color: #f286b9; }
  @media (min-width: 768px) {
    body {
      background-image: url("../images/troetentiere/konfetti.png"), url("../images/troetentiere/verlauf-rosa.png");
      background-position: center top,center top;
      background-size: 1400px auto, 500px 500px; } }

.info {
  background-color: #f7a600; }

#centerholder {
  text-shadow: 0px 0.1125rem 0.25rem rgba(0, 0, 0, 0.15);
  margin: auto;
  position: relative;
  top: clamp(47px, 20vw, 170px);
  margin-bottom: 20px; }
  #centerholder section {
    position: relative;
    max-width: 1000px;
    margin: auto; }
  @media (min-width: 768px) {
    #centerholder {
      top: 170px; } }

h1:not(:first-child) {
  position: relative;
  padding: 1em 0 1em 0; }

section:not(:first-child) {
  padding: 0em 0 2em 0; }

.nav-active #centerholder {
  display: none; }

#tt-einsendeschluss-bild {
  text-align: center; }
  #tt-einsendeschluss-bild img {
    width: 50%;
    margin-top: 1.5em;
    height: auto;
    max-width: 300px; }
  @media (min-width: 1024px) {
    #tt-einsendeschluss-bild {
      text-align: right; }
      #tt-einsendeschluss-bild img {
        margin-top: 0em; } }

#tt-gewinn1 img {
  display: block;
  max-width: 100vw;
  height: auto;
  transform: translate(0px, 20px); }
  @media (min-width: 1024px) {
    #tt-gewinn1 img {
      transform: translate(-80px, 20px); } }

#tt-gewinn2 img {
  display: block;
  max-width: 80vw;
  height: auto;
  transform: translate(0, 20px); }

b {
  color: rgba(255, 213, 0, 0.95); }

@media (min-width: 1024px) {
  .row {
    display: flex;
    gap: 35px; } }

#bastel-holli {
  text-align: center; }
  @media (min-width: 1024px) {
    #bastel-holli {
      width: 50%;
      position: relative;
      padding-top: 30%; } }

#bastel-holli > img {
  width: 100%;
  max-width: 550px;
  height: auto; }
  @media (min-width: 1024px) {
    #bastel-holli > img {
      position: absolute;
      bottom: -15%;
      left: -10%;
      width: 115%; } }

.row > div {
  color: white;
  font-size: 15px;
  position: relative;
  width: 100%;
  line-height: 130%;
  font-weight: normal; }
  .row > div > p {
    font-weight: normal;
    margin: 0.5em 0 0.4em; }
  @media (min-width: 768px) {
    .row > div {
      font-size: 24px; } }
  @media (min-width: 1024px) {
    .row > div {
      margin-bottom: 0px;
      margin-left: 0%;
      line-height: 130%;
      width: 50%; } }

#tt-formholder {
  text-align: left;
  line-height: 1.15; }

#tt-formholder input#tt-checkEinverstaendnis {
  width: 30px;
  height: 30px;
  margin-right: 10px !important; }

label[for=checkEinverstaendnis] {
  font-weight: 300;
  font-size: 14px;
  line-height: 1.15;
  flex: 1; }

#tt-form {
  display: flex;
  flex-flow: wrap; }

#tt-form input:not(#tt-sendbutton), #tt-form textarea {
  line-height: 2;
  padding-left: 0.5em; }

#tt-form > * {
  margin: 7px 0 7px 0;
  width: 100%; }

#tt-upload-field {
  height: 62px;
  font-size: 0.8em;
  color: rgba(255, 213, 0, 0.95);
  position: relative;
  z-index: 400;
  background-color: #e76ea7; }
  #tt-upload-field img {
    transform: translateX(-30px);
    width: 165px;
    height: auto;
    align-self: flex-end; }
  #tt-upload-field label {
    display: flex;
    align-items: center;
    cursor: pointer;
    margin-right: 10px;
    position: absolute;
    bottom: 0;
    height: 100%; }

#ttier_file {
  position: absolute;
  background-color: aliceblue;
  width: 100%;
  height: 150%;
  top: -50%;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  z-index: 400;
  cursor: pointer; }

input#ttform_vorname {
  width: 65%;
  margin-right: 10px; }

#tt-form input#ttform_alter {
  flex-grow: 1;
  width: auto; }

#tt-sendbutton {
  background-image: url(../images/SVG/icon-papierflieger.svg);
  background-size: auto 100%;
  color: rgba(255, 213, 0, 0.95);
  padding: 15px 10px 15px 60px;
  text-align: left;
  cursor: pointer;
  border: none;
  background-color: transparent;
  width: auto;
  margin: 10px 0 0 0 !important;
  line-height: 1.3 !important; }

#tt-recaptcha-text {
  font-family: Arial, "sans-serif";
  /* width: 740px; */
  pointer-events: all;
  font-size: 13px;
  font-weight: 300;
  padding: 20px 0 0 0; }
  #tt-recaptcha-text a {
    text-decoration: underline; }

#bt-sogehts {
  width: 50%;
  max-width: 250px;
  height: auto;
  display: block;
  margin: auto;
  z-index: 200;
  transform: translateY(20px); }

#pk-thumbnails {
  margin-bottom: 100px;
  margin-bottom: clamp(10px, 20vw, 130px);
  line-height: 0;
  text-align: center; }
  #pk-thumbnails figure {
    vertical-align: top;
    display: inline-block;
    width: 95%;
    margin: 5px;
    height: 20%;
    border: solid 5% #fff; }
    @media (max-width: 1024px) {
      #pk-thumbnails figure {
        transform: rotate(0deg) !important; } }
    @media (min-width: 1024px) {
      #pk-thumbnails figure {
        width: 45%; } }
    @media (min-width: 1360px) {
      #pk-thumbnails figure {
        width: 30%; } }
    #pk-thumbnails figure div {
      padding-bottom: 60%; }
  #pk-thumbnails figure:hover {
    position: relative;
    z-index: 200 !important; }

aside p {
  font-size: 0.8rem; }

#pk-thumbnails img {
  width: 100%;
  height: auto;
  box-shadow: 0px 4px 8px 7px rgba(0, 0, 0, 0.1); }

#pk-thumbnails a {
  display: inline-block;
  position: relative;
  width: 96%;
  margin: 1.665%; }
  @media (min-width: 768px) {
    #pk-thumbnails a {
      width: 30%; } }

#pk-thumbnails p {
  transform: rotate(0);
  z-index: 100;
  font-size: 0.5em;
  line-height: 1.2em;
  text-align: left;
  margin-bottom: 3em;
  margin-left: 10px; }

.background {
  position: absolute;
  z-index: -1;
  width: 100vw;
  height: 100%;
  top: 0;
  left: 50%;
  align-self: center;
  margin-left: -50vw;
  background: #025ad4; }

aside ul, aside ol {
  font-size: 0.7em;
  font-weight: 300 !important;
  display: flex;
  flex-wrap: wrap;
  max-width: 100%;
  justify-content: space-between; }
  aside ul li, aside ol li {
    margin: 1em;
    width: 40%;
    text-align: center;
    display: flex;
    flex-direction: column; }
    @media (min-width: 768px) {
      aside ul li, aside ol li {
        width: 18%; } }
    aside ul li img, aside ol li img {
      width: 100%;
      height: auto;
      margin-bottom: 1em; }

aside ol {
  counter-reset: my-awesome-counter;
  list-style: none; }

aside ol li {
  text-align: left;
  line-height: 1em;
  font-weight: bold;
  content: counter(my-awesome-counter);
  color: #d41217;
  margin: 1em 0 1.5em 0;
  counter-increment: my-awesome-counter;
  position: relative; }
  @media (min-width: 768px) {
    aside ol li {
      width: 30%; } }

aside ol li::before {
  content: counter(my-awesome-counter);
  color: #d41217;
  font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace";
  font-size: 1rem;
  font-weight: bold;
  position: absolute;
  --size: 1.4em;
  left: calc(-0.5 * var(--size));
  top: calc(-0.5 * var(--size));
  line-height: var(--size);
  width: var(--size);
  height: var(--size);
  background: white;
  border-radius: 50%;
  text-align: center;
  box-shadow: 0px 0.1125rem 0.25rem rgba(0, 0, 0, 0.2);
  text-shadow: none; }

#bt-sogehts {
  cursor: pointer; }

.tt-materialliste img {
  display: inline;
  filter: drop-shadow(0px 0.1125rem 0.25rem rgba(0, 0, 0, 0.2)); }

.tt-pdf {
  display: block;
  margin-left: 15px; }
  @media (min-width: 768px) {
    .tt-pdf {
      margin-left: 15px; } }
  .tt-pdf li {
    display: inline-block;
    max-width: 100px;
    margin: 0.8em; }

.tt-response {
  color: #f286b9;
  color: #f286b9;
  font-size: 24px;
  font-weight: 700;
  height: 200px; }