.Opening_Animation .Main_Heading {
	animation-name: 	Main_Heading_Animation;
	animation-delay: 1.5s;
	animation-duration: 1s;
	animation-iteration-count: 1;
	animation-timing-function: ease;
	animation-fill-mode: forwards;  
}
.Opening_Animation .Main_Heading span {
	animation-name: 	Heading_Span_Animation;
	animation-duration: 2s;
	animation-iteration-count: 1;
	animation-timing-function: linear;
}
.Opening_Animation .Buttons_Container_Buttons {
	opacity: 0;
	animation-name: 	Buttons_Container_Buttons_Animation;
	animation-duration: 1s;
	animation-delay: 1.8s;
	animation-iteration-count: 1;
	animation-timing-function: linear;
	animation-fill-mode: forwards;  
}
.Opening_Animation .Footer {
	opacity: 0;
	animation-name: Footer_Animation;
	animation-duration: 0.7s;
	animation-delay: 2s;
	animation-iteration-count: 1;
	animation-timing-function: linear;
	animation-fill-mode: forwards; 
}
@media only screen and (min-width: 1000px) { /*more than 1000px*/
	.Opening_Animation .Main_Heading {
		transform: translateY(-50%);
	}
	@keyframes Main_Heading_Animation {
		100% {
			transform: translateY(-270%);
		}
	}
}
@media only screen and (max-width: 1000px), only screen and (device-aspect-ratio: 2/3), only screen and (device-aspect-ratio: 40/71), only screen and (device-aspect-ratio: 40/71) { /*less than 1000px and iphones*/
	.Opening_Animation .Main_Heading {
		transform: translateY(-45%);
	}
	@keyframes Main_Heading_Animation {
		100% {
			transform: translateY(-580%);
		}
	}
}
@keyframes Heading_Span_Animation {
	0% {
		color: #21EE00;
	}
	20% {
		color: #FE8082;
	}
	40% {
		color: #41C4FF;
	}
	60% {
		color: #F2A10F;
	}
	80% {
		color: #D5A6FF;
	}
	100% {
		color: #FFF;
	}
}
@keyframes Buttons_Container_Buttons_Animation {
	100% {
		opacity: 1.0;
	}
}
@keyframes Footer_Animation {
	100% {
		opacity: 1.0
	}
}

/*We use Contents_Animation through jQuery as we need custom start and end point*/
.Contents_Open_Animation_End {
	transform: translate3d(2%, 0, 0) scale(1.0) rotate(0deg);
	opacity: 1.0;
	display: none
}

.Button_Zip {
	animation-name: 	Button_Zip_Rotating;
	animation-duration: 0.6s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}
@keyframes Button_Zip_Rotating {
	0% {
		transform: rotate(30deg);
	}
	50% {
		transform: rotate(34deg);
	}
	100% {
		transform: rotate(30deg);
	}
}

/*Open zip*/
.Open_Button_Zip {
	animation-name: 	Open_Button_Zip;
	animation-duration: 0.6s;
	animation-iteration-count: 1;
	animation-timing-function: linear;
	animation-fill-mode: forwards;  
}
.Open_Button_Zip_End {
	transform: translate3D(15%, 120%, 0);
}

@keyframes Open_Button_Zip {
	25% {
		transform: translate3D(15%, 0, 0) rotate(0deg);
	}
	100% {
		transform: translate3D(15%, 120%, 0);
	}
}

.Open_Button_Zip_BG {
	animation-name: 	Open_Button_Zip_BG;
	animation-duration: 0.6s;
	animation-iteration-count: 1;
	animation-timing-function: linear;
	animation-fill-mode: forwards;  
}

.Open_Button_Zip_BG_End {
	height: 100%;
}

@keyframes Open_Button_Zip_BG {
	100% {
		height: 100%;
	}
}

/*Close zip*/
.Close_Button_Zip {
	animation-name: 	Close_Button_Zip;
	animation-duration: 1s;
	animation-iteration-count: 1;
	animation-timing-function: linear;
	animation-fill-mode: forwards;
	animation-delay: 0.6s;
}
@keyframes Close_Button_Zip {
	50% {
		transform: translate3D(0%, 0%, 0) rotate(30deg);
	}
	100% {
		transform: translate3D(0%, 0%, 0) rotate(30deg);
	}
}

.Close_Button_Zip_BG {
	animation-name: 	Close_Button_Zip_BG;
	animation-duration: 0.6s;
	animation-iteration-count: 1;
	animation-timing-function: linear;
	animation-fill-mode: forwards;
	animation-delay: 0.6s;  
}
@keyframes Close_Button_Zip_BG {
	100% {
		height: 0%;
	}
}