


[data-inviewport="fade-in"] { 
	transition: 1s;
	opacity: 0;
}
[data-inviewport="fade-in"].is-inViewport { 
	opacity: 1;
}



[data-inviewport="animate-bottom-top-100"] { 
	transition: 1s;
	opacity: 0;
	transform: translateY(100px);
}
[data-inviewport="animate-bottom-top-100"].is-inViewport { 
	opacity: 1;
	transform: translateY(0px);
}

[data-inviewport="animate-bottom-top-50"] { 
	transition: 1s;
	opacity: 0;
	transform: translateY(50px);
}
[data-inviewport="animate-bottom-top-50"].is-inViewport { 
	opacity: 1;
	transform: translateY(0px);
}



[data-inviewport="animate-top-bottom-100"] { 
	transition: 1s;
	opacity: 0;
	transform: translateY(-100px);
}
[data-inviewport="animate-top-bottom-100"].is-inViewport { 
	opacity: 1;
	transform: translateY(0px);
}

[data-inviewport="animate-top-bottom-50"] { 
	transition: 1s;
	opacity: 0;
	transform: translateY(-50px);
}
[data-inviewport="animate-top-bottom-50"].is-inViewport { 
	opacity: 1;
	transform: translateY(0px);
}



[data-inviewport="animate-left-right-50"] { 
	transition: 1s;
	opacity: 0;
	transform: translateX(-50px);
}
[data-inviewport="animate-left-right-50"].is-inViewport { 
	opacity: 1;
	transform: translateX(0px);
}

[data-inviewport="animate-left-right-100"] { 
	transition: 1s;
	opacity: 0;
	transform: translateX(-100px);
}
[data-inviewport="animate-left-right-100"].is-inViewport { 
	opacity: 1;
	transform: translateX(0px);
}


[data-inviewport="animate-right-left-50"] { 
	transition: 1s;
	opacity: 0;
	transform: translateX(50px);
}
[data-inviewport="animate-right-left-50"].is-inViewport { 
	opacity: 1;
	transform: translateX(0px);
}

[data-inviewport="animate-right-left-100"] { 
	transition: 1s;
	opacity: 0;
	transform: translateX(100px);
}
[data-inviewport="animate-right-left-100"].is-inViewport { 
	opacity: 1;
	transform: translateX(0px);
}






[data-inviewport="scale-in"] { 
  transition: 2s;
  transform: scale(0.1);
}
[data-inviewport="scale-in"].is-inViewport { 
  transform: scale(1);
}

[data-inviewport="fade-rotate"] { 
  transition: 2s;
  opacity: 0;
}
[data-inviewport="fade-rotate"].is-inViewport { 
  transform: rotate(180deg);
  opacity: 1;
}