Body {
	font-family: helvetica;
	background-color: black;
	position: relative;
}

.text {
	position:absolute;
	justify-content: center;
	overflow: hidden; 
  	white-space: nowrap; 
  	animation: typing 3s steps(30) forwards;
  	top: 200px;
}

@keyframes typing {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}


h1{
	font-style: bold;
	font-size: 25px ;
	color: white;
	text-align: left;
	margin-left: 80px
}

a{
	text-decoration: none;

}

.link{
	position:relative;
	top: 60vh;
	margin: auto;
	font-style: bold;
	font-size: 15px ;
	color: white;
	left: 4vw;
	transition: all 0.3s ease;
    color: grey;
    animation: fadeInAnimation 3s ease-in forwards;
    opacity: 0;
    animation-delay: 2s;
}

@keyframes fadeInAnimation {
        from {
            opacity: 0; 
        }
        to {
            opacity: 1; 
        }
}

.link:hover{
	color: #fff;
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff;
}


@media screen and (max-width: 768px){

.text {
	position:absolute;
	justify-content: center;
	overflow: hidden; 
  	white-space: nowrap; 
  	animation: typing 3s steps(30) forwards;
  	top: 800px;
}

h1{
	font-style: bold;
	font-size: 18px ;
	color: white;
	text-align: left;
	margin-left: 80px
	
}
.link{
	position:absolute;
	top: 1200px;
	margin: auto;
	font-style: bold;
	font-size: 15px ;
	color: white;
	left: 40vw;

}

}