#canvas{
  width: 90vmin;
  margin:11vmin auto 3vmin auto;
  height:87vmin;
  background-color: antiquewhite;
  position: relative;
}

#blue{
  left:0%
  top:80%;
  width:23%;
  height:100%;
  background-color: rgb(72, 87, 163);
  position: absolute;
  }

#navyblue1{
  left:20%;
  top:0%;
  width: 11%;
  height: 100%;
  background-color: rgb(44, 52, 96);
  position: absolute;
}

#bluegreen1{
  left:30%;
  top:0%;
  width:10%;
  height:100%;
  background-color:rgb(62, 87, 113);
  position: absolute;
}

#paleyellow{
  left:40%;
  top:0%;
  width:10%;
  height:100%;
  background-color:rgb(250, 230, 176);
  position: absolute;
  }

#navyblue2{
  left: 50%;
  top: 0%;
  width: 10%;
  height: 100%;
  background-color:rgb(44, 52, 96);
  position: absolute
}

#peach{
  left: 60%;
  top: 0%;
  width: 10%;
  height: 100%;
  background-color: rgb(234, 176, 136);
  position: absolute;
}

#lavender{
  right:20%;
  top: 0%;
  width: 10%;
  height: 100%;
  background-color:rgb(141, 115, 128);
  position: absolute;
}

#navyblue3{
  right: 10%;
  top: 0%;
  width: 10%;
  height: 100%;
  background-color:rgb(44, 52, 96);
  position: absolute;
}

#bluegreen2{
  right:0%;
  top: 0%;
  width: 10%;
  height: 100%;
  background-color:rgb(62, 87, 113);
  position: absolute;
}