
  /* animations */

[data-inviewport="anime3a"],
[data-inviewport="anime3b"],
[data-inviewport="anime3c"],
[data-inviewport="anime3d"],
[data-inviewport="anime3e"],
[data-inviewport="anime3f"],
[data-inviewport="anime3g"]{
	opacity: 0;
}

[data-inviewport="anime3a"].is-inViewport {
	animation: fadein 1s;
	animation-timing-function: linear;
	animation-delay: 0s;
	animation-fill-mode: forwards;
	animation-iteration-count: 1;
}
[data-inviewport="anime3b"].is-inViewport {
	animation: fadein 1s;
	animation-timing-function: linear;
	animation-delay: 0.1s;
	animation-fill-mode: forwards;
	animation-iteration-count: 1;
}
[data-inviewport="anime3c"].is-inViewport {
	animation: fadein 1s;
	animation-timing-function: linear;
	animation-delay: 0.2s;
	animation-fill-mode: forwards;
	animation-iteration-count: 1;
}
[data-inviewport="anime3d"].is-inViewport {
	animation: fadein 1s;
	animation-timing-function: linear;
	animation-delay: 0.3s;
	animation-fill-mode: forwards;
	animation-iteration-count: 1;
}
[data-inviewport="anime3e"].is-inViewport {
	animation: fadein 1s;
	animation-timing-function: linear;
	animation-delay: 0.4s;
	animation-fill-mode: forwards;
	animation-iteration-count: 1;
}
[data-inviewport="anime3f"].is-inViewport {
	animation: fadein 1s;
	animation-timing-function: linear;
	animation-delay: 0.5s;
	animation-fill-mode: forwards;
	animation-iteration-count: 1;
}
[data-inviewport="anime3g"].is-inViewport {
	animation: fadein 1s;
	animation-timing-function: linear;
	animation-delay: 0.6s;
	animation-fill-mode: forwards;
	animation-iteration-count: 1;
}

@-webkit-keyframes fadein {
	0% {
		opacity: 0;
	}
	50% {
		opacity: 0.5;
	}
	75% {
		opacity: 0.75;
	}
	100% {
		opacity: 1;
	}
}

@keyframes fadein {
	0% {
		opacity: 0;
	}
	50% {
		opacity: 0.5;
	}
	100% {
		opacity: 1;
	}
}

.animeopacity {
    transform: scale(0.8);
    opacity: .1;
    transition: all 1s;
}

.animehor-r {
    opacity: .1;
    transform: translateX(30%);
    transition: all 1s;
}

.animehor-l {
    opacity: .1;
    transform: translateX(-30%);
    transition: all 1s;
}

.animex {
    transform: scale(1);
    opacity: 1;
    transform: translateX(0) translateY(0);
} 


.drop {
	animation: dropFrames linear 1s;
	animation-iteration-count: 1;
  }
  @keyframes dropFrames {
	0% {
	  opacity: 0;
	}
	100% {
	  opacity: 1;
	}
  }

  .drop-delay1 {
	animation-delay: 0s;
  }
  .drop-delay2 {
	animation-delay: 0.1s;
  }
  .drop-delay3 {
	animation-delay: 0.2s;
  }
  .drop-delay4 {
	animation-delay: 0.3s;
  }
  .drop-delay5 {
	animation-delay: 0.4s;
  }
  .drop-delay6 {
	animation-delay: 0.5s;
  }
  .drop-delay7 {
	animation-delay: 0.6s;
  }