*{
	margin: 0;
	padding: 0;
}

header#canvas {
	width: 36.24vw;
	height:43.1vw;
	margin-left:30vw;
	margin-top: 3vw;
}

section {
	position: absolute;
}

section.pink {
	width: 9.2vw;
	height:34.5vw;	
}

section.pink {
	margin-bottom: 5vw;
	margin-top: .2vw;
	margin-left: .1vw;
}

section.purple {
	width: 9.2vw;
	height:1.5vw;
		
}
section.purple {
	margin-top:34.73vw;
	margin-left: .1vw;	
}

section.pink1 {
	width:9.2vw;
	height:6.7vw;
}

section.pink1 {
	margin-top:36.309vw;
	margin-left: .1vw;
}

section.lightpurple {
	width:8.75vw;
	height:16.7vw;
}

section.lightpurple {
	margin-left:9.34vw;
	margin-top: .2vw;
}

section.purple1 {
	width:8.75vw;
	height:1.7vw;
}

section.purple1 {
	margin-left:9.34vw;
	margin-top:16.94vw ;
}
section.lightpurple1 {
	width:8.75vw;
	height:9.34vw;
}

section.lightpurple1 {
	margin-left:9.34vw;
	margin-top: 18.66vw;
}

section.purple2 {
	width:8.75vw;
	height:1.7vw;
}

section.purple2 {
	margin-left:9.34vw;
	margin-top:28vw ;
}

section.lightpurple2 {
	width:8.75vw;
	height:13.25vw;
}

section.lightpurple2 {
	margin-left:9.34vw;
	margin-top: 29.75vw;
}

section.purple3 {
	width:8.89vw;
	height:25vw;
}

section.purple3 {
	margin-left:18vw;
	margin-top:.2vw ;
}

section.lightpurple3 {
	width:8.84vw;
	height:1.7vw;
}

section.lightpurple3 {
	margin-left:18.08vw;
	margin-top: 25.22vw;
}

section.purple4 {
	width:8.84vw;
	height:16.1vw;
}

section.purple4 {
	margin-left:18.08vw;
	margin-top: 26.9vw;
}

section.blue {
	width:9.22vw;
	height:8vw;
}

section.blue {
	margin-left:26.93vw;
	margin-top: .2vw;
}

section.lightpurple4 {
	width:9.23vw;
	height:1.7vw;
}

section.lightpurple4 {
	margin-left:26.9vw;
	margin-top: 8.25vw;
}

section.blue1 {
	width:9.23vw;
	height:28vw;
}

section.blue1 {
	margin-left:26.93vw;
	margin-top: 9.9vw;
}

section.lightpurple5 {
	width:9.23vw;
	height:1.7vw;
}

section.lightpurple5 {
	margin-left:26.93vw;
	margin-top: 37.91vw;
}

section.blue2 {
	width:9.23vw;
	height:4vw;
}

section.blue2 {
	margin-left:26.93vw;
	margin-top: 39vw;
}


/*CSS COLOR*/

.red {
	background-color: maroon;
}

.pink {
	background-color:lightcoral;
}

.pink1 {
	background-color:lightcoral;
}

.purple {
	background-color: blueviolet;
}

.lightpurple {
	background-color:violet;
}

.purple1 {
	background-color:blueviolet;
}

.lightpurple1 {
	background-color:violet;
}

.purple2 {
	background-color:blueviolet;
}

.lightpurple2 {
	background-color:violet;
}

.purple3 {
	background-color:blueviolet;
}

.lightpurple3 {
	background-color:violet;
}

.purple4{
	background-color:blueviolet;
}

.blue{
	background-color:blue;
}

.lightpurple4 {
	background-color:violet;
}

.blue1 {
	background-color: blue;
}

.lightpurple5 {
	background-color: violet;
}

.blue2 {
	background-color: blue;
}










.red:hover {
	background-color: aqua;
}

.pink:hover {
	background-color:greenyellow;
}

.pink1:hover {
	background-color:lightcyan;
}

.purple:hover {
	background-color: teal;
}

.lightpurple:hover {
	background-color:orangered;
}

.purple1:hover {
	background-color:peru;
}

.lightpurple1:hover {
	background-color:skyblue;
}

.purple2:hover {
	background-color:mediumslateblue;
}

.lightpurple2:hover {
	background-color:yellow;
}

.purple3:hover {
	background-color:orange;
}

.lightpurple3:hover {
	background-color:chocolate;
}

.purple4:hover{
	background-color:forestgreen;
}

.blue:hover{
	background-color:darkturquoise;
}

.lightpurple4:hover {
	background-color:deeppink;
}

.blue1:hover {
	background-color: gold;
}

.lightpurple5:hover {
	background-color: crimson;
}

.blue2:hover {
	background-color: darkorange;
}