.animated {
  animation-fill-mode: both;
}
.slideInDownFade {
  animation-name: slideInDownFade;
}

.animated.slideInDownFade {
  animation-timing-function: ease-out;
  animation-duration: 800ms;
}

.mainFade {
  animation-name: mainFade;
}
.animated.mainFade {
  transition-delay: 1500ms;
  animation-delay: 400ms;
  animation-timing-function: ease-out;
}




.section.active
.mainNewHeader_left img {
  animation-fill-mode: both;
  animation-name: titiyana;
  animation-duration: 1100ms;
  animation-delay: 0ms;
  animation-timing-function: ease-in-out; 
}

.section.active
.mainNewHeader_main_flex:after  {
  animation-fill-mode: both;
  animation-name: ramka;
  animation-duration: 1400ms;
  animation-delay: 0ms;
  animation-timing-function: ease-out;
}

.section.active
.mainNewHeader_right_centerdContent {
  animation-fill-mode: both;
  animation-name: text;
  animation-duration: 1000ms;
  animation-delay: 0ms;
  animation-timing-function: ease-out;
}


@keyframes titiyana {
  from {
  opacity: 0.5;
  transform: translate3d(-50px, 00%, 0);
  }

  to {
  opacity: 1;
  transform: translate3d(0px, 00%, 0);
  }

}

@keyframes ramka {
  from {
  transform: scale(0.9) translate3d(0px, 0%, 0);
  opacity: 0.25;
  }

  to {
  transform: scale(1) translate3d(0px, 0%, 0);
  opacity: 1;
  }

}

@keyframes text {
  from {
  transform: scale(1.10) translate3d(0px, -10%, 0);
  opacity: 0;
  }

  to {
  transform: scale(1) translate3d(0px, 0%, 0);
  opacity: 1;
  }

}