body {
  background: blue;
  background-size: cover;
  padding: 0px;
  margin-left: 100px;
  margin-right: 100px;
  margin-top: 0px;
  font-family: 'Merriweather', sans-serif;
  color:white;
  font-size: 20px;
  min-height: 200vh;
}

main {
	
}

a {
	color:#dcdddd;
}


p1 {
	margin-top:50px;
	font-size: 120px;
}

p{
	
	margin-top:30px;
	font-size: 30px;

}

p2 {
	margin-top:50px;
	font-size: 120px;
}


h1 {
  font-size: 5em;
  color: white;
  text-transform: uppercase;
}

span {
  border-right: .05em solid;
  animation: caret 0.2s steps(1) forwards;
  border-color: white;
}

@keyframes caret {
  100% {
    border-color: transparent;
  }
}

h1 {
  font-size: 5em;
  color: white;
  text-transform: uppercase;
}

  
.home {
	margin-left:-100px;
	margin-right:-100px;
	position: absolute;
					top:20px;
                    
                    left:14.5vw;
                    
                    height:50px;
                    width:50px;
                    
                    text-align: center;
                    display: inline-block;
                    background-image: url(../home.gif);
                    background-repeat: no-repeat;
                    background-size: contain;
                    opacity: 0;    
                    animation: wait 1.6s steps(1) forwards;
 }



.bottom {
	margin-left:-100px;
	margin-bottom: 20px;
	position: absolute;
					top:190vh;
                    bottom:30%;
                    left:50vw;
                    
                    height:100px;
                    width:100px;
                    
                    text-align: center;
                    display: inline-block;
                    background-image: url(../bottom.gif);
                    background-repeat: no-repeat;
                    background-size: contain;
                    opacity: 1;     

}

.bottom1 {
	margin-left:-100px;
	margin-bottom: 20px;
	position: absolute;
					top:190vh;
                    bottom:30%;
                    left:55vw;
                    
                    height:100px;
                    width:100px;
                    
                    text-align: center;
                    display: inline-block;
                    background-image: url(../bottom.gif);
                    background-repeat: no-repeat;
                    background-size: contain;
                    opacity: 1;     

}

.bottom2 {
	margin-left:-100px;
	margin-bottom: 20px;
	position: absolute;
					top:195vh;
                    bottom:30%;
                    left:60vw;
                    
                    height:100px;
                    width:100px;
                    
                    text-align: center;
                    display: inline-block;
                    background-image: url(../go.gif);
                    background-repeat: no-repeat;
                    background-size: contain;
                    opacity: 1;     

}

.boompic {
	position: absolute;
                    top:60%;
                    left:70%;
                    height:300px;
                    width:300px;
                    float: right;
                    display: inline-block;
                    background-image: url(../boom.gif);
                    background-repeat: no-repeat;
                    background-size: contain;
                    opacity: 0;
                    animation: wait 4.3s steps(1) forwards;

}

.fingerpic {
	position: absolute;
                    top:39%;
                    left:70%;
                    height:300px;
                    width:300px;
                    float: right;
                    display: inline-block;
                    background-image: url(../finger.gif);
                    background-repeat: no-repeat;
                    background-size: contain;
                    opacity: 0;
                    animation: wait 1.6s steps(1) forwards;
}

.lightningpic {
	position: absolute;
                    top:20%;
                    left:70%;
                    height:300px;
                    width:300px;
                    float: right;
                    display: inline-block;
                    background-image: url(../lightning.gif);
                    background-repeat: no-repeat;
                    background-size: contain;
                    opacity: 0;
                    animation: wait 1.6s steps(1) forwards;

}

.mousepic {
	position: absolute;
                    top:20%;
                    left:70%;
                    height:300px;
                    width:300px;
                    float: right;
                    display: inline-block;
                    background-image: url(../fire.gif);
                    background-repeat: no-repeat;
                    background-size: contain;
                    opacity: 0;
                    animation: wait 1.6s steps(1) forwards;

}

.sufpic {
	position: absolute;
                    top:20%;
                    left:70%;
                    height:300px;
                    width:300px;
                    float: right;
                    display: inline-block;
                    background-image: url(../mouse.gif);
                    background-repeat: no-repeat;
                    background-size: contain;
                    opacity: 0;
                    animation: wait 1.6s steps(1) forwards;

}

@keyframes wait {
	100% {
		opacity: 1;}
	}

a:hover { 
  animation: pulse 1s infinite;
  animation-timing-function: linear;   
}

@keyframes pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.1);}
  100% { transform: scale(1); }
  }