body{
  background-color: black;
  color:white;
}  
h1 {
  font-family: "open sans", sans-serif;
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  font-size: 30px;}
h2 {
  font-family: "open sans", sans-serif;
  font-size: 18px;
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  
}
#canvas{
background-color: white;
box-shadow: 0px 0px 2px black;
margin: 15vmin auto;
width:60vmin;
height:60vmin;
}
#redorangebox{
  position:relative;
  background-color: rgb( 250, 61, 53);
  left: 7.5vmin;
  top: 7.5vmin;
  width: 45vmin;
  height: 45vmin;
}
#maroonbox{
  position:relative;
  background-color: rgb( 162, 56, 56);
  left:12.5vmin;
  bottom: 30.5vmin;
  width: 35vmin;
  height: 35vmin;
}
#bluebox{
  position:relative;
  background-color: rgb( 38, 90, 100);
  left:17.5vmin;
  bottom: 59vmin;
  width: 25vmin;
  height: 25vmin;
}
#orangebox{
  position:relative;
  background-color: rgb( 690, 125, 10);
  left:22.5vmin;
  bottom: 77vmin;
  width: 15vmin;
  height: 15vmin;
}