/* Sonnenuntergang */
/* ----------------------------------------------------------------------------*/

@import url("glow-effect.css");
/*@import url("sunset-effect.css");*/


.carousel .carousel-text-inner { }
.carousel-item-header { }
.carousel-item-subheader {  }


.carousel-text-inner > *{
  opacity: 0;
  /*transform: translateX(-190%);*/
  /*transition: opacity 600ms ease, transform 900ms cubic-bezier(.2,.8,.2,1);*/
}


.carousel-text-inner.is-animate > *{
  /*opacity: 1;*/
  /*transform: translateX(0);*/
}

/*.carousel-text-inner.is-animate > *:nth-child(1){ transition-delay: 100ms; }*/
/*.carousel-text-inner.is-animate > *:nth-child(2){ transition-delay: 320ms; }*/
/*.carousel-text-inner.is-animate > *:nth-child(3){ transition-delay: 640ms; }*/

/* Ohne definition */
.frame-container .ce-col > *{
  opacity: 0;
  transform: translateX(190%);
  transition: opacity 600ms ease, transform 1900ms cubic-bezier(.2,.8,.2,1);
}

.frame-container .ce-col.is-animate > *{
  opacity: 1;
  transform: translateX(0);
}
.frame-container .ce-col.is-animate > *:nth-child(1){ transition-delay: 200ms; }

/* 3cols boxen von rechjts nach links    .frame-type-ce_columns3  */

/* 3cols von unten */
.frame-type-ce_columns3 .ce-col > *{
  opacity: 0;
  transform: translateX(190%);
  transition: opacity 600ms ease, transform 1600ms cubic-bezier(.2,.8,.2,1);
}

.frame-type-ce_columns3 .ce-col.is-animate > *{
  opacity: 1;
  transform: translateX(0);
}

/* optional: kleines Stagger */
.frame-type-ce_columns3 .ce-col.is-animate > *:nth-child(1){ transition-delay: 200ms; }
.frame-type-ce_columns3 .ce-col.is-animate > *:nth-child(2){ transition-delay: 300ms; }
.frame-type-ce_columns3 .ce-col.is-animate > *:nth-child(3){ transition-delay: 500ms; }




/* 4cols boxen von rechjts nach links    .frame-type-ce_columns3  */
.frame-type-ce_columns4 .ce-col > *{
  opacity: 0;
  transform: translateX(190%);
  transition: opacity 600ms ease, transform 1900ms cubic-bezier(.2,.8,.2,1);
}

.frame-type-ce_columns4 .ce-col.is-animate > *{
  opacity: 1;
  transform: translateX(0);
}
/* optional: kleines Stagger */
.frame-type-ce_columns4 .ce-col.is-animate > *:nth-child(1){ transition-delay: 200ms; }
.frame-type-ce_columns4 .ce-col.is-animate > *:nth-child(2){ transition-delay: 400ms; }
.frame-type-ce_columns4 .ce-col.is-animate > *:nth-child(3){ transition-delay: 400ms; }
.frame-type-ce_columns4 .ce-col.is-animate > *:nth-child(4){ transition-delay: 400ms; }







/* 2cols boxen von rechjts nach links    .frame-type-ce_columns2  */
.frame-type-ce_columns2 .ce-col > *{
  opacity: 0;
  transition: opacity 600ms ease, transform 1900ms cubic-bezier(.2,.8,.2,1);
}

/* 1. Spalte: kommt von links rein */
.frame-type-ce_columns2 .ce-col:nth-child(1) > *{
  transform: translateY(190%);
}
.frame-type-ce_columns2 .ce-col:nth-child(1).is-animate > *{
  opacity: 1;
  transform: translateY(0);
}

/* 2. Spalte: kommt von rechts rein */
.frame-type-ce_columns2 .ce-col:nth-child(2) > *{
  transform: translateX(190%);
  transition-delay: 150ms;
}
.frame-type-ce_columns2 .ce-col:nth-child(2).is-animate > *{
  opacity: 1;
  transform: translateX(0);
}

/* 2cols als shortcut */
/*.frame-type-shortcut .frame-container */


/* Shortcuts */
.frame-type-shortcut 
.frame-container .ce-col > *{
  opacity: 0;
  transform: translateX(190%);
  transition: opacity 600ms ease, transform 1900ms cubic-bezier(.2,.8,.2,1);
}
.frame-type-shortcut 
.frame-container .ce-col.is-animate > *{
  opacity: 1;
  transform: translateX(0);
}
.frame-type-shortcut 
.frame-container .ce-col.is-animate > *:nth-child(1){ transition-delay: 200ms; }



/* Carussel Header pulsieren in Größe  */

    .carousel-text-inner.is-animate .carousel-item-header{
  animation-name: flyInFromLeft, schlagSchatten, textBreath;
  animation-duration: 900ms, 12s, 90s;
  animation-iteration-count: 1, infinite, infinite;
  transform-origin: left center;
  animation-fill-mode: both, none, none;
  /* fly-in        strokePulse  textBreath  */
  animation-delay: 0s,        5s, 8s;
  animation-timing-function: cubic-bezier(.2,.9,.2,1), ease-in-out, ease-in-out;
}

.carousel-text-inner.is-animate .carousel-item-subheader{
  animation-name: flyInFromLeft, schlagSchatten, textBreath;
  animation-duration: 1000ms, 18s, 90s;
  animation-iteration-count: 1, infinite, infinite;
  transform-origin: left center;
  animation-fill-mode: both, none, none;
  /* fly-in         strokePulse  textBreath */
  animation-delay: .2s,       12s, 17s;
  animation-timing-function: cubic-bezier(.2,.9,.2,1), ease-in-out, ease-in-out;
}

.carousel-text-inner.is-animate .carousel-item-bodytext {
  animation-name: flyInFromLeft;
  animation-duration: 1200ms;
  animation-delay: .4s;
  transform-origin: left center;
  animation-fill-mode: both, none, none;
  animation-timing-function: cubic-bezier(.2,.9,.2,1);
}




/* Anfangseffekt: von links außen nach innen */
@keyframes flyInFromLeft{
  0%{
    opacity: 0;
    transform: translateX(-120%);
  }
  100%{
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes textBreath{
  0%, 100%{
    transform: translateY(0) scale(1);
    opacity: 1;
    filter: none;
  }
  50%{
    transform: translateY(0px) scaleX(1.10);
    /*transform: translateY(-1px) scale(1.015);*/
    opacity: .85;
    filter: saturate(1.0);
  }
}

@keyframes schlagSchatten{
  0%,100%{
    text-shadow:
      1px 0 0 rgba(0,0,0,.05),
      -1px 0 0 rgba(0,0,0,.05),
      0 1px 0 rgba(0,0,0,.05),
      0 -1px 0 rgba(0,0,0,.05),
      1px 1px 0 rgba(0,0,0,.00),
      -1px 1px 0 rgba(0,0,0,.00),
      1px -1px 0 rgba(0,0,0,.00),
      -1px -1px 0 rgba(0,0,0,.00);
  }
  50%{
    text-shadow:
      2px 0 0 rgba(0,0,0,.25),
      -2px 0 0 rgba(0,0,0,.25),
      0 2px 0 rgba(0,0,0,.25),
      0 -2px 0 rgba(0,0,0,.25),
      2px 2px 0 rgba(0,0,0,.25),
      -2px 2px 0 rgba(0,0,0,.25),
      2px -2px 0 rgba(0,0,0,.25),
      -2px -2px 0 rgba(0,0,0,.25);
  }
}



/* Hintergrunddbild im Header */









/* Weicher „Wellen“-Bewegungs-Look über Blur/Grain */

#carousel-backgroundimage-224-9{
  background-size: cover;
  filter: saturate(1) brightness(1);
  animation: bgBreath 60s ease-in-out infinite;
}

@keyframes bgBreath{
  0%,100%{ filter: saturate(1) brightness(1); transform: scale(1); }
  50%{ filter: saturate(1.5) brightness(1.2); transform: scale(1.3); }
  
}






/* Ken Burns */
.frame-backgroundimage{
  background-size: cover;
  background-position: center;
  animation: bgKenBurns 120s ease-in-out infinite;
}
@keyframes bgKenBurns{
  0%   { transform: scale(1.00) translate3d(0,0,0); }
  50%  { transform: scale(1.25) translate3d(0.0%, 0.8%, 0); }
  100% { transform: scale(1.00) translate3d(0,0,0); }
}





body {
  overflow-x: hidden;
}