@font-face {
	font-family: 'ANDALEMO';
	src: url(../fonts/ANDALEMO.TTF) format('truetype');
}

* {
	margin: 0;
	padding: 0;
}

header {
	display: none;
}

section {
		position: fixed;
		background-color: black;
	}

p {
	font-family: ANDALEMO;
	position: fixed;
	animation: finearte 2s;
}
	@keyframes finearte {
		0%		{top: 24.2vw; left: 40.5vw; font-size: 3.5vw;}
		50%		{top: 1.1vw; left: 41vw; font-size: 2.8vw;}
		100%	{top: 1.1vw; left: 45vw; font-size: 2.8vw;}
	}

/* about line */
		#about {
			width: .16vw;
			animation: a 2s;
		}
			@keyframes a {
				0%		{height: 13vw; top: 37vh; left: 33vw;}
				50%		{height: 100vh; top: 0vh; left: 33vw;}
				100%	{height: 100vh; top: 0vh; left: 36.8vw;}
			}

/* fine arte line */
		#fine-arte {
			width: .16vw;
			height: 13vw;
			left: 50vw;
			top: 37vh;
			animation: fade-m 0.9s;
			z-index: 0;
		}

/* design line */
		#design {
			width: .16vw;
			animation: d 2s;
		}
			@keyframes d {
				0%		{height: 13vw; top: 37vh; left: 67vw;}
				50%		{height: 100vh; top: 0vh; left: 67vw;}
				100%	{height: 100vh; top: 0vh; left: 68vw;}
			}
/* hamburgersssss */
			.hamburger {
				width: 0.16vw;
				height: 5.5vh;
				top: 2.5vh;
				left: 3vw;
				z-index: 5;
				animation: hamburger 2s;
			}

				@keyframes hamburger {
						0%		{height: 0vh; top: 5.5vh;}
						75%		{height: 0vh; top: 5.5vh;}
						100%	{height: 5.5vh; top: 2.5vh;}
					}

			.back {
				width: 3.3vw;
				height: 0.3vh;
				top: 15vh;
				left: 1.5vw;
				z-index: 5;
				animation: back 2s;
			}
				@keyframes back {
					0%		{width: 0vw; left: 3.3vw;}
					75%		{width: 0vw; left: 3.3vw;}
					100%	{width: 3.3vw; left: 1.5vw;}
				}

/* NEW lines*/
				.line1 {
					position: fixed;
					left: 6vw;
					width: 0.16vw;
					animation: line 2s;
				}

				.line2 {
					position: fixed;
					left: 37.44vw;
					width: 0.16vw;
					animation: line 2s;
				}

				.line3 {
					position: fixed;
					left: 68.7vw;
					width: 0.16vw;
					animation: line 2s;
				}

					@keyframes line {
						0%		{height: 0vw; top: 50vh;}
						100%	{height: 100vh; top: 0vh;} 
					}

				.hline1 {
					position: fixed;
					left: 37.5vw;
					top: 5.7vw;
					height: 0.16vw;
					animation: hline 2s;
				}

				.hline2 {
					position: fixed;
					left: 37.5vw;
					top: 8.9vw;
					height: 0.16vw;
					animation: hline 2s;
				}

				.hline3 {
					position: fixed;
					left: 68.7vw;
					top: 41.5vw;
					height: 0.16vw;
					animation: hline 2s;
				}

					@keyframes hline {
						0%		{width: 0vw;}
						75%		{width: 0vw;}
						100%	{width: 30.5vw;} 
					}

				.hline4 {
					position: fixed;
					left: 80.95vw;
					top: 36.5vw;
					width: 8vw;
					animation: thick 2s;
				}
					@keyframes thick {
						0%		{height: 0vw;}
						75%		{height: 0vw;}
						100%	{height: 0.7vw;} 
					}