.sandra21 {
    width: 100%;
    height: auto;
  }

.traude22{
    width: 83%;
    height: auto;
  }

  .gerhard21 {
    width: 100%;
    height: auto;
  }

  .ebi21 {
    width: 80%;
    height: auto;
  }


#scene2_container_traude
{
    -webkit-animation-name: anim_traude_small;
    -webkit-animation-duration: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: ease;
    -webkit-animation-fill-mode: forwards;
}
  
@-webkit-keyframes anim_traude_small
{
    100% { -webkit-transform: rotate(0deg) scale(0.6) skew(0deg) translate(0%);}
}

#scene2_traude_container_kopf
{
    -webkit-animation-name: anim_traude_kopf;
    -webkit-animation-duration: 10s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease;
    -webkit-animation-fill-mode: forwards;
}
@-webkit-keyframes anim_traude_kopf
{
    0% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(0%);}
    50% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(5%);}
    100% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(0%);}
}

.scene2_traude_container_kopf
{
    -webkit-animation-name: anim_traude_kopf_front !important;
    -webkit-animation-duration: 4s !important;
    -webkit-animation-iteration-count: infinite !important;
    -webkit-animation-timing-function: ease !important;
    -webkit-animation-fill-mode: forwards !important;
}

@-webkit-keyframes anim_traude_kopf_front
{
    0% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(0%);}
    50% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(1%);}
    100% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(0%);}
}

.scene2_container_traude_front
{
    -webkit-animation-name: anim_traude_front !important;
    -webkit-animation-duration: 5s !important;
    -webkit-animation-iteration-count: 1 !important;
    -webkit-animation-timing-function: ease !important;
    -webkit-animation-fill-mode: forwards !important;
}
  
@-webkit-keyframes anim_traude_front
{
    from 
    {
        -webkit-transform: rotate(0deg) scale(0.6) skew(0deg) translateY(0%);
    }
    to 
    {
        -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(-15%);
    }
}

#scene2_teller1
{
    -webkit-animation-name: anim_teller1_hin;
    -webkit-animation-duration: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: ease;
    -webkit-animation-fill-mode: forwards;
}

@-webkit-keyframes anim_teller1_hin 
{
    100% { -webkit-transform: rotate(0deg) scale(1.0) skew(0deg) translate(14%);}
}

#scene2_teller2
{
    -webkit-animation-name: anim_teller2_hin;
    -webkit-animation-duration: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: ease;
    -webkit-animation-fill-mode: forwards;
}

@-webkit-keyframes anim_teller2_hin
{
    100% { -webkit-transform: rotate(0deg) scale(1.0) skew(0deg) translate(-3%);}
}

.scene2_teller1_weg
{
    -webkit-animation-name: anim_teller1_weg !important;
    -webkit-animation-duration: 2s !important;
    -webkit-animation-iteration-count: 1 !important;
    -webkit-animation-timing-function: ease !important;
    -webkit-animation-fill-mode: forwards !important;
}

@-webkit-keyframes anim_teller1_weg 
{
    from 
    {
        -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(14%);
    }
    to 
    {
        -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(-18%);
    }
}

.scene2_teller2_weg
{
    -webkit-animation-name: anim_teller2_weg !important;
    -webkit-animation-duration: 2s !important;
    -webkit-animation-iteration-count: 1 !important;
    -webkit-animation-timing-function: ease !important;
    -webkit-animation-fill-mode: forwards !important;
}
    
@-webkit-keyframes anim_teller2_weg 
{
    from 
    {
        -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(-3%);
    }
    to 
    {
        -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(5%);
    }
}

#scene2_traude_kopf2
{
    -webkit-animation-name: anim_kopf2 !important;
    -webkit-animation-duration: 10s !important;
    -webkit-animation-iteration-count: infinite !important;
    -webkit-animation-timing-function: ease !important;
    -webkit-animation-fill-mode: forwards !important;
}

@-webkit-keyframes anim_kopf2 
{
    0% { opacity: 0;}
    24% { opacity: 0;}
    28% { opacity: 1;}
    31% { opacity: 0;}
    74% { opacity: 0;}
    77% { opacity: 1;}
    80% { opacity: 0;}
    100% { opacity: 0;}
}

#scene2_traude_hand_links 
{
    -webkit-animation-name: anim_traude_hand_link;
    -webkit-animation-duration: 6s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease;
    -webkit-animation-fill-mode: forwards;
    transform-origin: 31% 47%;
}

@-webkit-keyframes anim_traude_hand_link
{
    0% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(0%);}
    50% { -webkit-transform: rotate(10deg) scale(1) skew(0deg) translateY(0%);}
    100% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(0%);}
}

.scene2_sandra_schwanz 
{
    -webkit-animation-name: anim_sandra_schwanz;
    -webkit-animation-duration: 0.15s;
    -webkit-animation-iteration-count: 6;
    -webkit-animation-timing-function: ease;
    -webkit-animation-fill-mode: forwards;
    transform-origin: 38% 89%;
}

@-webkit-keyframes anim_sandra_schwanz
{
    0% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(0%);}
    50% { -webkit-transform: rotate(3deg) scale(1) skew(0deg) translateY(0%);}
    100% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(0%);}
}

#scene2_sandra_container_kopf
{
    -webkit-animation-name: anim_sandra_kopf !important;
    -webkit-animation-duration: 4s !important;
    -webkit-animation-iteration-count: infinite !important;
    -webkit-animation-timing-function: ease !important;
    -webkit-animation-fill-mode: forwards !important;
    transform-origin: left center;
}

@-webkit-keyframes anim_sandra_kopf
{
    0% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(0%);}
    50% { -webkit-transform: rotate(-1deg) scale(1) skew(0deg) translateY(0.5%);}
    100% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(0%);}
}

#scene2_sandra_kopf2
{
    -webkit-animation-name: anim_sandra_kopf2 !important;
    -webkit-animation-duration: 8s !important;
    -webkit-animation-iteration-count: infinite !important;
    -webkit-animation-timing-function: ease !important;
    -webkit-animation-fill-mode: forwards !important;
}

@-webkit-keyframes anim_sandra_kopf2 
{
    0% { opacity: 0;}
    24% { opacity: 0;}
    28% { opacity: 1;}
    31% { opacity: 0;}
    74% { opacity: 0;}
    77% { opacity: 1;}
    80% { opacity: 0;}
    100% { opacity: 0;}
}

#scene2_container_sandra
{
    -webkit-animation-name: anim_sandra_koerper ;
    -webkit-animation-duration: 6s !important;
    -webkit-animation-iteration-count: infinite ;
    -webkit-animation-timing-function: ease ;
    -webkit-animation-fill-mode: forwards;
    transform-origin: center center;
}

#scene2_gerhard21_fisch img{
    -webkit-animation-name: anim_gerhard21_fisch_img;
    -webkit-animation-duration: 50s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-delay: 1s;
  }

  
  @-webkit-keyframes anim_gerhard21_fisch_img {
    0% { -webkit-transform: rotate(0deg) scaleX(1) skew(0deg) translateX(0%) translateY(0%);}
    50% { -webkit-transform: rotate(0deg) scaleX(1) skew(0deg) translateX(0%) translateY(0%);}
    50.01% { -webkit-transform: rotate(0deg) scaleX(-1) skew(0deg) translateX(0%) translateY(0%);}
    99% { -webkit-transform: rotate(0deg) scaleX(-1) skew(0deg) translateX(0%) translateY(0%);}
  }

  #scene2_gerhard21_fisch{
    -webkit-animation-name: anim_gerhard21_fisch;
    -webkit-animation-duration: 50s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-delay: 1s;
  }

  
  @-webkit-keyframes anim_gerhard21_fisch {
    0% { -webkit-transform: rotate(0deg) skew(0deg) translateX(0%) translateY(0%);}
    25% { -webkit-transform: rotate(-20deg) skew(0deg) translateX(-175%) translateY(10%);}
    50% { -webkit-transform: rotate(0deg) skew(0deg) translateX(-390%) translateY(10%);}
    75% { -webkit-transform: rotate(10deg) skew(0deg) translateX(-440%) translateY(-4%);}
    100% { -webkit-transform: rotate(0deg) skew(0deg) translateX(0%) translateY(0%);}
  }

@-webkit-keyframes anim_sandra_koerper
{
    0% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(0%);}
    50% { -webkit-transform: rotate(0deg) scale(1.01) skew(0deg) translateY(0%);}
    100% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(0%);}
}

.kochloeffelgo {
    -webkit-animation-name: anim_gerhard21_kochloeffel;
    -webkit-animation-duration: 16s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-delay: 0s;
  }

@-webkit-keyframes anim_gerhard21_kochloeffel
    {
        0% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateX(0%) translateY(-100%);}
        25% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateX(0%) translateY(0%);}
        30% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateX(10%) translateY(0%);}
        40% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateX(-10%) translateY(0%);}
        50% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateX(10%) translateY(0%);}
        60% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateX(-10%) translateY(0%);}
        70% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateX(10%) translateY(0%);}
        80% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateX(-10%) translateY(0%);}
        90% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateX(10%) translateY(0%);}
        100% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateX(0%) translateY(-100%);}
    }

.teebeutelgo {
    -webkit-animation-name: anim_gerhard21_teebeutel;
    -webkit-animation-duration: 4s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-delay: 0s;
    }

@-webkit-keyframes anim_gerhard21_teebeutel
    {
        0% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(-100%);}
        100% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translateY(0%);}
    }

.wassergo {
    -webkit-animation-name: anim_gerhard21_wasser;
    -webkit-animation-duration: 16s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-delay: 0s;
    }



  @-webkit-keyframes anim_gerhard21_wasser
  {
      0% { opacity: 100;}
      40% { opacity: 100;}
      100% { opacity: 0;}
  }

.teego {
    -webkit-animation-name: anim_gerhard21_tee;
    -webkit-animation-duration: 16s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-delay: 0s;
    }



  @-webkit-keyframes anim_gerhard21_tee
  {
      0% { opacity: 0;}
      20% { opacity: 0;}
      100% { opacity: 100;}
  }

  #scene2_traude22_augen_zu
  {
    -webkit-animation-name: anim_traude22_augen !important;
    -webkit-animation-duration: 10s !important;
    -webkit-animation-iteration-count: infinite !important;
    -webkit-animation-timing-function: ease !important;
    -webkit-animation-fill-mode: forwards !important;
}

@-webkit-keyframes anim_traude22_augen 
{
    0% { opacity: 0;}
    24% { opacity: 0;}
    28% { opacity: 1;}
    31% { opacity: 0;}
    74% { opacity: 0;}
    77% { opacity: 1;}
    80% { opacity: 0;}
    100% { opacity: 0;}
}

#szene2_gerhard5_fisch_img{
    -webkit-animation-name: anim_gerhard25_fisch_img;
    -webkit-animation-duration: 50s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-delay: 1s;
  }

  
  @-webkit-keyframes anim_gerhard25_fisch_img {
    0% { -webkit-transform: rotate(0deg) scaleX(1) skew(0deg) translateX(0%) translateY(0%);}
    50% { -webkit-transform: rotate(0deg) scaleX(1) skew(0deg) translateX(0%) translateY(0%);}
    50.01% { -webkit-transform: rotate(0deg) scaleX(-1) skew(0deg) translateX(0%) translateY(0%);}
    99% { -webkit-transform: rotate(0deg) scaleX(-1) skew(0deg) translateX(0%) translateY(0%);}
  }

  #scene2_gerhard5_fisch{
    -webkit-animation-name: anim_gerhard25_fisch;
    -webkit-animation-duration: 50s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-delay: 1s;
  }

  
  @-webkit-keyframes anim_gerhard25_fisch {
    0% { -webkit-transform: rotate(0deg) skew(0deg) translateX(0%) translateY(0%);}
    25% { -webkit-transform: rotate(-20deg) skew(0deg) translateX(-175%) translateY(5%);}
    50% { -webkit-transform: rotate(0deg) skew(0deg) translateX(-290%) translateY(5%);}
    75% { -webkit-transform: rotate(10deg) skew(0deg) translateX(-340%) translateY(-4%);}
    100% { -webkit-transform: rotate(0deg) skew(0deg) translateX(0%) translateY(0%);}
  }

  #scene2_gerhard22_fisch_img{
    -webkit-animation-name: anim_gerhard22_fisch_img;
    -webkit-animation-duration: 50s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-delay: 1s;
  }

  
  @-webkit-keyframes anim_gerhard22_fisch_img {
    0% { -webkit-transform: rotate(0deg) scaleX(1) skew(0deg) translateX(0%) translateY(0%);}
    50% { -webkit-transform: rotate(0deg) scaleX(1) skew(0deg) translateX(0%) translateY(0%);}
    50.01% { -webkit-transform: rotate(0deg) scaleX(-1) skew(0deg) translateX(0%) translateY(0%);}
    99% { -webkit-transform: rotate(0deg) scaleX(-1) skew(0deg) translateX(0%) translateY(0%);}
  }

  #scene2_gerhard22_fisch{
    -webkit-animation-name: anim_gerhard22_fisch;
    -webkit-animation-duration: 50s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-delay: 1s;
  }

  
  @-webkit-keyframes anim_gerhard22_fisch {
    0% { -webkit-transform: rotate(0deg) skew(0deg) translateX(0%) translateY(0%);}
    25% { -webkit-transform: rotate(-20deg) skew(0deg) translateX(-175%) translateY(5%);}
    50% { -webkit-transform: rotate(0deg) skew(0deg) translateX(-290%) translateY(5%);}
    75% { -webkit-transform: rotate(10deg) skew(0deg) translateX(-340%) translateY(-4%);}
    100% { -webkit-transform: rotate(0deg) skew(0deg) translateX(0%) translateY(0%);}
  }

  #scene2_ebi1_ohr_links{
    -webkit-animation-name: anim_ebi21_ohr_links;
    -webkit-animation-duration: 7s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-fill-mode: forwards;
    transform-origin: 64% 29%;
    animation-delay: 1s;
  }

  #scene2_ebi1_ohr_rechts{
    -webkit-animation-name: anim_ebi21_ohr_rechts;
    -webkit-animation-duration: 7s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-fill-mode: forwards;
    transform-origin: 30% 80%;
    animation-delay: 1s;
  }

  @-webkit-keyframes anim_ebi21_ohr_rechts 
  {
    0% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0%);}
    50% { -webkit-transform: rotate(1deg) scale(1) skew(0deg) translate(0%);}
  }

  
  @-webkit-keyframes anim_ebi21_ohr_links {
    0% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0%);}
    50% { -webkit-transform: rotate(-1deg) scale(1) skew(0deg) translate(0%);}
  }

  #scene2_ebi1_schwanz{
    -webkit-animation-name: anim_ebi21_schwanz;
    -webkit-animation-duration: 5s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-fill-mode: forwards;
    transform-origin: 61% 81%;
    animation-delay: 1s;
  }
  
  @-webkit-keyframes anim_ebi21_schwanz {
    0% { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0%);}
    50% { -webkit-transform: rotate(2deg) scale(1) skew(0deg) translate(0%);}
  }

  #scene2_ebi1_augen_zu
  {
    -webkit-animation-name: anim_szene2_ebi_augen !important;
    -webkit-animation-duration: 10s !important;
    -webkit-animation-iteration-count: infinite !important;
    -webkit-animation-timing-function: ease !important;
    -webkit-animation-fill-mode: forwards !important;
  }

  @-webkit-keyframes anim_szene2_ebi_augen 
{
    0% { opacity: 0;}
    24% { opacity: 0;}
    28% { opacity: 1;}
    31% { opacity: 0;}
    74% { opacity: 0;}
    77% { opacity: 1;}
    80% { opacity: 0;}
    100% { opacity: 0;}
}

.mirror{
  -webkit-animation-name: anim_mirror_1;
  -webkit-animation-duration: 0s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: linear;
  -webkit-animation-fill-mode: forwards;
}

@-webkit-keyframes anim_mirror_1 {
  0% { -webkit-transform: rotate(0deg) scaleX(1) skew(0deg) translateX(0%);}
  100% { -webkit-transform: rotate(0deg) scaleX(-1) skew(0deg) translateX(0%);}
}

.mirror_back{
  -webkit-animation-name: anim_mirror_back_1;
  -webkit-animation-duration: 0s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: linear;
  -webkit-animation-fill-mode: forwards;
}

@-webkit-keyframes anim_mirror_back_1 {
  0% { -webkit-transform: rotate(0deg) scaleX(-1) skew(0deg) translateX(0%);}
  100% { -webkit-transform: rotate(0deg) scaleX(1) skew(0deg) translateX(0%);}
}

#scene2_gerhrad21_augen_con img{
    display: none;
  }
  #scene2_gerhrad21_augen_con img:first-child {
    display: block;
  }

#scene2_gerhard22_anim_con img{
    display: none;
  }

#scene2_gerhard22_anim_con img:first-child {
    display: block;
}

#scene11_gerhard22_anim_con img{
  display: none;
}

#scene11_gerhard22_anim_con img:first-child {
  display: block;
}


#scene2_traude22_anim_con img{
    display: none;
  }

#scene2_traude22_anim_con img:first-child {
    display: block;
  }

  #scene2_gerhard5_augen_con img{
    display: none;
  }

#scene2_gerhard5_augen_con img:first-child {
    display: block;
  }
  
  #scene2_ebi1_mund_con img{
    display: none;
  }

#scene2_ebi1_mund_con img:first-child {
    display: block;
  }