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

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

/* Effekte nur ab Desktop */
@media(min-width:992px) {
    
    
   
.carousel .carousel-text-inner { }
.carousel-item-header { }
.carousel-item-subheader {  }


/* Ohne definition */
.frame-container .ce-col > *{
  opacity: 0;
  transform: translateX(190%);
  transition: opacity 600ms ease, transform 350ms 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 300ms ease, transform 600ms 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 350ms 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 350ms 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 350ms 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  */


.contentcontainer-column.frame-group-inner.is-animate {
  animation-name: flyInFromLeft;
  animation-duration: 2900ms;
  animation-iteration-count: 1;
  transform-origin: left center;
  animation-fill-mode: both;
  
  animation-delay: 500ms,5s;
  animation-timing-function: cubic-bezier(.2,.9,.2,1);
}




.frame-group-inner.is-animate .frame-inner .frame-inner h1 {
  animation-name: flyInFromLeft;
  animation-duration: 900ms;
  animation-iteration-count: 1, infinite, infinite;
  transform-origin: left center;
  animation-fill-mode: both, none, none;
  
  animation-delay: 0s;
  animation-timing-function: cubic-bezier(.2,.9,.2,1), ease-in-out, ease-in-out;
}

.frame-group-inner.is-animate .frame-inner h3{
  animation-name: flyInFromLeft;
  animation-duration: 1000ms;
  animation-iteration-count: 1;
  transform-origin: left center;
  animation-fill-mode: both, none, none;
 
  animation-delay: .2s,       12s, 17s;
  animation-timing-function: cubic-bezier(.2,.9,.2,1), ease-in-out, ease-in-out;
}


.ce-col.left-col.is-animate .frame-inner .frame-inner h2,
.ce-col.left-col.is-animate .frame-inner .frame-inner p
{
  animation-name: flyInFromLeft;
  animation-duration: 1000ms;
  animation-iteration-count: 1;
  transform-origin: left center;
  animation-fill-mode: both, none, none;
  animation-delay: 1s;
  animation-timing-function: cubic-bezier(.2,.9,.2,1), ease-in-out, ease-in-out;
}


.ce-col.right-col.is-animate .frame-inner .frame-inner h2,
.ce-col.right-col.is-animate .frame-inner .frame-inner p
{
  animation-name: flyInFromRight;
  animation-duration: 1000ms;
  animation-iteration-count: 1;
  transform-origin: left center;
  animation-fill-mode: both, none, none;
  animation-delay: 1s;
  animation-timing-function: cubic-bezier(.2,.9,.2,1), ease-in-out, ease-in-out;
}




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

@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.005);
    /*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;
}


}