html, body{
    
    
 
    cursor: default;
    height:100%;
    margin:0;
    font-family: 'Source Sans Pro', sans-serif;
    
} 








.content {
    display:flex;
    width:100%;
    height: 100%;
    
    flex-flow: column;
    
    
}




body:hover{
    cursor:default;
}

a:hover{
    color:#1a237e;
    font-weight: 900;

}



.push {
  
    margin-top:auto;
    
    
    width:100%;
    margin-bottom:0px;
  
    
}
.pull{
    
   
    width:100%;
    margin-top:0px;
    margin-bottom:10vh;
}


@keyframes hide{
    to{
        
        visibility: hidden;
       bottom:0;
        position: absolute;
      
    }
}

@keyframes init{
    to{
        position:relative;
        visibility: visible;
    }
}



.one {
    
   font-family:monospace;
    background-color: black;
    display:block;
    visibility: hidden;
    font-size: 4.6vmin;
    color:white;
    padding:10px;
    position: absolute;
    margin:0px auto 0px 10%;
   animation:init 0s linear 0s 1 normal forwards,hide 1s linear 5.435s 1 normal forwards;
    
}

.two {
     position: absolute;
     font-family:monospace;
    background-color: black;
    display:block;
    visibility: hidden;
    font-size: 4.6vmin;
    color:white;
    padding:10px;
    margin:0px auto 0px 10%;
   animation:init 0s linear 2.44s 1 normal forwards,hide 0s linear 8.44s 1 normal forwards;
}
.three{
     position: absolute;
     font-family:monospace;
    background-color: black;
    display:block;
    visibility: hidden;
    font-size: 4.6vmin;
    color:white;
    padding:10px;
    margin:0px auto 0px 10%;
   animation:init 0s linear 5.44s 1 normal forwards,hide 0s linear 11s 1 normal forwards;
}
.four{
     position: absolute;
     font-family:monospace;
    background-color: black;
    display:block;
    visibility: hidden;
    font-size: 4.6vmin;
    color:white;
    padding:10px;
    margin:0px auto 0px 10%;
   animation:init 0s linear 8.44s 1 normal forwards,hide 0s linear 13.88s 1 normal forwards;
}
.five{
     position: absolute;
     font-family:monospace;
    background-color: black;
    display:block;
    visibility: hidden;
    font-size: 4.6vmin;
    color:white;
    padding:10px;
    margin:0px auto 0px 10%;
   animation:init 0s linear 10.878s 1 normal forwards,hide 0s linear 16.88s 1 normal forwards;
}
.six{
     position: absolute;
     font-family:monospace;
    background-color: black;
    display:block;
    visibility: hidden;
    font-size: 4.6vmin;
    color:white;
    padding:10px;
    margin:0px auto 0px 10%;
   animation:init 0s linear 13.878s 1 normal forwards,hide 0s linear 21.44s 1 normal forwards;
}
.seven{
     position: absolute;
     font-family:monospace;
    background-color: black;
    display:block;
    visibility: hidden;
    font-size: 4.6vmin;
    color:white;
    padding:10px;
    margin:0px auto 0px 10%;
   animation:init 0s linear 16.878s 1 normal forwards,hide 0s linear 21.44s 1 normal forwards;
}


.products{
    display:flex;
   font-size: 30px;
    align-content: center;
 
  width:100%;
  margin-top:0;
    margin-bottom: 50px;
   justify-content: space-around;
    flex-direction: row;
     flex-wrap: wrap;
    position: absolute;
   box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.75);
     background-color: white;
    color:black; 

}
img {
    padding:12px;
}



a {
    width:auto;
  margin-top:auto;
    margin-bottom: auto;
   color:black;
    text-decoration: none;
   margin-right: 5px;
    margin-left: 5px;
}














