*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}



.opacityAnim{
	opacity: 0;

	transition: opacity 2.5s ease-in-out;
}

.visible{
	opacity: 1;
}

/* For Left to right Animation */

.left-to-right-anim{
	transform: translateX(-50%);
	
	transition: transform 1s ease-in-out;
}

.left-to-right-anim-onePointFive{
	transform: translateX(-150%);
	
	transition: transform 1.5s ease-in-out;
}

.left-to-right-anim-three-hund{
	transform: translateX(-300%);
	
	transition: transform 1s ease-in-out;
}

/* For Right to left Animation */

.right-to-left-anim{
	transform: translateX(50%);
	
	transition: transform 1s ease-in-out;
}

.right-to-left-anim-onePointFive{
	transform: translateX(150%);
	
	transition: transform 1.5s ease-in-out;
}

.right-to-left-anim-three-hund{
	transform: translateX(300%);
	
	transition: transform 1s ease-in-out;
}


/*========================= Start Anim=====================*/

.start-anim{
    transform: translateX(0%);
}


/*===============================================================*/

/*For scale Transitions zero to 1*/

.scale-anim-z-t-o{
	transform: scale(0);
	
	transition: transform 1s ease-in-out;
}

/*For scale Transitions*/

.scale-anim{
	transform: scale(1.2);
	
	transition: transform 1s ease-in-out;
}

.start-scale-anim{
    transform: scale(1);
}


/* Scale like pop */

.scale-anim-pop{
	transform: scale(0);
	
	transition: transform 1s ease-in-out;
}

.start-scale-anim-pop{
    animation: scalepop 0.8s forwards;
}

@keyframes scalepop {
    0% {
      transform: scale(0);
    }
    50% {
      transform: scale(1.2);
    }
    100% {
      transform: scale(1);
    }
}


/* Bottom to top pop */

.bottom-to-top-pop{
	opacity: 0;
	
	transition: transform 1s ease-in-out;
}

.start-bottom-to-top-pop{
	opacity: 1;
    animation: bottomtoppop 1s forwards;
}

@keyframes bottomtoppop {
    0% {
		transform: translateY(1000px);
    }
    50% {
		transform: translateY(-100px);
    }
    100% {
		transform: translateY(0px);
    }
}


/* without scroll effects */

.scale-anim-without-scroll{
	transform: scale(0);
	
	transition: transform 1s ease-in-out;
}

.start-scale-anim-without-scroll{
    transform: scale(1);
}