html{height: 100%;
}

body{height:100%;
     margin: 0;
  display: flex;
  align-items: center;
  justify-content:center;
padding: 100px}

#canvas{
  background-color:rgb(135,142,156);
width: 60vmin;
height:90vmin;
position:absolute;


}

#second{
  background-color:rgb(18,33,44);
  width: 30vmin;
  height:90vmin;
  position:absolute;
  left: 30vmin;}

#third{
  background-color:rgb(194,180,157);
  width: 22vmin;
  height:62vmin;
  position:absolute;
  left: 18.5vmin;
  top:28vmin;
}

#fourth{
  background-color:rgb(95,69,32);
  width: 22vmin;
  height:2.8vmin;
  position:absolute;
  left: 18.5vmin;
  top:27.8vmin;
}

#fifth{
  background-color:black;
  width: 22vmin;
  height:12vmin;
  position:absolute;
  left: 18.5vmin;
  top:42vmin;
}

#sixth{
  background-color:black;
  width: 22vmin;
  height:12vmin;
  position:absolute;
  left: 18.5vmin;
  top:66vmin;
}

nav {
  text-align: center;
  z-index: 1;
  position: absolute;
  left:0;
  top:0px;
  height: 7vmin;
  width: 100%
   
}

nav a{
  display: inline-block;
  margin-top: 5vmin;
  padding: 3vmin;
  text-decoration:none;
  font-family: verdana, sans-serif;
  color:dimgray;
  font-size: 15px;
}


.active {
  color: darkgrey;
}