.container {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	overflow: hidden;
}

.line {
	position: absolute;
	width: 100%;
	overflow: hidden;
	height: 100%;
	/* background: blueviolet; */
	background-image: linear-gradient(120deg, #f093fb 0%, #f5576c 100%);
}

ul {
	z-index: 99;
	position: absolute;
	list-style: none;
	right: 30px;
}
ul li {
	display: inline-block;
	margin: 15px;
}

ul li a {
	text-decoration: none;
	color: #fff;
	font-family: 'Roboto Thin';
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.418);
	font-size: 20px;
	transition: all 1s ease 0s;
}

ul li a:hover {
	text-decoration: none;
	color: #fff;
	font-family: 'Roboto Thin';
	font-size: 25px;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.418);
	transition: all 1s ease 0s;
}
ul li a:hover:after {
	text-decoration: none;
	color: #fff;
	font-family: 'Roboto Thin';
	font-size: 20px;
	transition: all 1s ease 1s;
}

.mid-text {
	position: absolute;

	z-index: 99;
	top: 25%;
	left: 50%;
	transform: translate(-50%, 0%);
	animation: wavy 8s linear infinite;
}

/*.mid-text h2:hover {
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.418);
	color: #fff;
	font-family: 'ADAM.CG PRO', Helvetica, sans-serif;
	font-size: 60px;
	transition: all 1s ease 0s;
}*/

.mid-text h2 {
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.418);
	color: #fff;
	font-family: 'ADAM.CG PRO', Helvetica, sans-serif;
	font-size: 50px;
	transition: all 1s ease 0s;
}

.line-1 {
	z-index: 15;
	opacity: 0.5;
}

.line-2 {
	z-index: 10;
	opacity: 0.7;
}

.line-3 {
	z-index: 5;
}

.wave {
	position: absolute;
	left: 0;
	width: 200%;
	height: 100%;
	background-repeat: repeat no-repeat;
	background-position: 0 bottom;
	transform-origin: center bottom;
}

.wave1 {
	-webkit-background-size: 50% 80px;
	background-size: 50% 80px;
}
.wave2 {
	-webkit-background-size: 50% 100px;
	background-size: 50% 100px;
	animation: animate 12s linear infinite;
}
.wave3 {
	-webkit-background-size: 50% 80px;
	background-size: 50% 80px;
	animation: animate 18s linear infinite;
}

@keyframes animate {
	0% {
		transform: translate(0) translateZ(0) scaleY(1);
	}
	/* 25% {
		transform: translate(-12.5%) translateZ(0) scaleY(0.75);
	} */

	50% {
		transform: translate(-25%) translateZ(0) scaleY(0.5);
	}
	/* 75% {
		transform: translate(-37.5%) translateZ(0) scaleY(0.75);
	} */

	100% {
		transform: translate(-50%) translateZ(0) scaleY(1);
	}
}
@keyframes hoverEffect {
	0% {
		font-size: 20px;
	}
	50% {
		font-size: 25px;
	}
	100% {
		font-size: 30px;
	}
}

@keyframes wavy {
	0% {
		transform: rotate(0deg) scaleX(1) scaleY(1) translate(-50%, 0%);
	}

	10% {
		transform: rotate(-5deg) scaleX(1) scaleY(1) translate(-55%, 5%);
	}
	20% {
		transform: rotate(0deg) scaleX(1) scaleY(1) translate(-60%, 5%);
	}
	30% {
		transform: rotate(5deg) scaleX(1) scaleY(1) translate(-65%, 0%);
	}
	40% {
		transform: rotate(7.5deg) scaleX(1) scaleY(1) translate(-65%, 5%);
	}
	50% {
		transform: rotate(-5deg) scaleX(1) scaleY(1) translate(-62.5%, 10%);
	}
	60% {
		transform: rotate(0deg) scaleX(1) scaleY(1) translate(-50%, 5%);
	}
	70% {
		transform: rotate(1.25deg) scaleX(1) scaleY(1) translate(-45%, 0%);
	}
	80% {
		transform: rotate(5deg) scaleX(1) scaleY(1) translate(-40%, -2.5%);
	}
	90% {
		transform: rotate(2.5deg) scaleX(1) scaleY(1) translate(-45%, 0%);
	}
	100% {
		transform: rotate(0deg) scaleX(1) scaleY(1) translate(-50%, 0%);
	}
}