#container {
  background-color: pink;
  margin: 0px auto;
  padding: 0px;
  width: 400px;
  height: 400px;
}


.rectangle1 {
    width: 1423px; 
    height: 770px; 
    border-radius: 0px; 
    margin-top: 0px;
    margin-left: 0px;
    
}

.rectangle2 {
    width: 600px; 
    height: 400px; 
    border-radius: 0px; 
    margin-top: -770px;
    margin-left: 0px;
    
}

.rectangle3 {
    width: 600px; 
    height: 370px; 
    border-radius: 0px; 
    margin-top: 0px;
    margin-left: 0px;
    
}

.rectangle4 {
    width: 400px; 
    height: 370px; 
    border-radius: 0px; 
    margin-top: -700px;
    margin-left: 350px;
    
}

.rectangle5 {
    width: 400px; 
    height: 370px; 
    border-radius: 0px; 
    margin-top: -40px;
    margin-left: 1023px;
    
}



.circle1 {
    border-radius: 50%;
    margin-left: 20px;
    margin-top: -720px;
    width: 100px; 
    height: 100px;
}

.circle2 {
    border-radius: 100%; 
    margin-left: 20px;
    margin-top: 40px;
    width: 100px; 
    height: 100px;
    
}

.circle3 {
    border-radius: 100%; 
    margin-left: 20px;
    margin-top: 40px;
    width: 100px; 
    height: 100px;
    
}

.circle4 {
    border-radius: 100%; 
    margin-left: 20px;
    margin-top: 40px;
    width: 100px; 
    height: 100px;
    
}

.circle5 {
    border-radius: 100%; 
    margin-left: 20px;
    margin-top: 40px;
    width: 100px; 
    height: 100px;
    
}

.circle6 {
    border-radius: 100%; 
    margin-left: 200px;
    margin-top: -660px;
    width: 100px; 
    height: 100px;
    
}
.circle7 {
    border-radius: 100%; 
    margin-left: 200px;
    margin-top: 40px;
    width: 100px; 
    height: 100px;
    
}

.circle8 {
    border-radius: 100%; 
    margin-left: 200px;
    margin-top: 40px;
    width: 100px; 
    height: 100px;
    
}

.circle9 {
    border-radius: 100%; 
    margin-left: 200px;
    margin-top: 40px;
    width: 100px; 
    height: 100px;
    
}

.circle10 {
    border-radius: 100%; 
    margin-left: 200px;
    margin-top: 40px;
    width: 100px; 
    height: 100px;
    
}

.circle11 {
    border-radius: 50%;
    margin-left: 900px;
    margin-top: -660px;
    width: 100px; 
    height: 100px;
}

.circle12 {
    border-radius: 100%; 
    margin-left: 900px;
    margin-top: 40px;
    width: 100px; 
    height: 100px;
    
}

.circle13 {
    border-radius: 100%; 
    margin-left: 900px;
    margin-top: 40px;
    width: 100px; 
    height: 100px;
    
}

.circle14 {
    border-radius: 100%; 
    margin-left: 900px;
    margin-top: 40px;
    width: 100px; 
    height: 100px;
    
}

.circle15 {
    border-radius: 100%; 
    margin-left: 900px;
    margin-top: 40px;
    width: 100px; 
    height: 100px;
    
}

.circle16 {
    border-radius: 50%;
    margin-left: 1070px;
    margin-top: -660px;
    width: 100px; 
    height: 100px;
}

.circle17 {
    border-radius: 100%; 
    margin-left: 1070px;
    margin-top: 40px;
    width: 100px; 
    height: 100px;
    
}

.circle18 {
    border-radius: 100%; 
    margin-left: 1070px;
    margin-top: 40px;
    width: 100px; 
    height: 100px;
    
}

.circle19 {
    border-radius: 100%; 
    margin-left: 1070px;
    margin-top: 40px;
    width: 100px; 
    height: 100px;
    
}

.circle20 {
    border-radius: 100%; 
    margin-left: 1070px;
    margin-top: 40px;
    width: 100px; 
    height: 100px;
    
}

#blockRed {
    background-color: red;
}

#blockYellow {
    background-color: yellow;
}

#blockDarkorange {
    background-color: darkorange;
}

#blockSkyblue{
    background-color:skyblue;
    
}

#blockLightpink{
    background-color: lightpink;
    
}

#blockForestgreen {
    background-color: forestgreen;
}

#blockRebeccapurple {
    background-color: rebeccapurple;
}

#blockDarkgray {
    background-color: darkgray;
}

#blockSaddlebrown {
    background-color: saddlebrown;
}

 