/*
        88     88888888ba,       
        88     88      `"8b      
        88     88        `8b     
        88     88         88     
        88     88         88     
        88     88         8P     
88,   ,d88 888 88      .a8P 888  
 "Y8888P"  888 88888888Y"'  888 */

* {
	margin: 0;
	padding: 0;
}

main#canvas {
	width: 48.55vw;
	height: 55.5vw;
	margin-left: 25.7vw;
	margin-right: 22vw;
	background-color: skyblue;
}

section {
	float: left;
	height: 55.5vw;
}

section.blue {
	width: .1vw;
	background-color: skyblue;
}

section.black {
	width: .95vw;
	background-color: black;
}

section.blue2 {
	width: .25vw;
	background-color: skyblue;
}

section.pink {
	width: .15vw;
	background-color: hotpink;
}

section.yellow {
	width: .25vw;
	background-color: darkkhaki;
}

section.gray {
	width: .65vw;
	background-color: lightgrey;
}

section.yellow2 {
	width: .15vw;
	background-color: darkkhaki;
}

section.pink2 {
	width: .25vw;
	background-color: hotpink;
}

section.blue3 {
	width: .25vw;
	background-color: skyblue;
}

section.white {
	width: .65vw;
	background-color: white;
}

section.blue4 {
	width: .3vw;
	background-color: skyblue;
}

section.pink3 {
	width: .23vw;
	background-color: hotpink;
}

section.yellow3 {
	width: .2vw;
	background-color: darkkhaki;
}

section.black2 {
	width: .85vw;
	background-color: black;
}

section.yellow4 {
	width: .22vw;
	background-color: darkkhaki;
}

section.pink4 {
	width: .23vw;
	background-color: hotpink;
}

section.blue5 {
	width: .3vw;
	background-color: skyblue;
}

section.gray2 {
	width: .65vw;
	background-color: lightslategrey;
}

section.blue6 {
	width: .25vw;
	background-color: skyblue;
}

section.pink5 {
	width: .23vw;
	background-color: hotpink;
}

section.yellow5 {
	width: .22vw;
	background-color: darkkhaki;
}

section.white2 {
	width: .6vw;
	background-color: white;
}

section.yellow6 {
	width: .22vw;
	background-color: darkkhaki;
}

section.pink6 {
	width: .22vw;
	background-color: hotpink;
}

section.blue7 {
	width: .25vw;
	background-color: skyblue;
}

section.black3 {
	width: .85vw;
	background-color: black;
}

section.blue8 {
	width: .25vw;
	background-color: skyblue;
}

section.pink7 {
	width: .22vw;
	background-color: hotpink;
}

section.yellow7 {
	width: .25vw;
	background-color: darkkhaki;
}

section.gray3 {
	width: .62vw;
	background-color: lightslategrey;
}

section.yellow8 {
	width: .25vw;
	background-color: darkkhaki;
}

section.pink8 {
	width: .22vw;
	background-color: hotpink;
}

section.blue9 {
	width: .25vw;
	background-color: skyblue;
}

section.white3 {
	width: .6vw;
	background-color: white;
}

section.blue10 {
	width: .3vw;
	background-color: skyblue;
}

section.pink9 {
	width: .22vw;
	background-color: hotpink;
}

section.yellow9 {
	width: .2vw;
	background-color: darkkhaki;
}

section.black4 {
	width: .85vw;
	background-color: black;
}

section.yellow10 {
	width: .2vw;
	background-color: darkkhaki;
}

section.pink10 {
	width: .22vw;
	background-color: hotpink;
}

section.blue11 {
	width: .3vw;
	background-color: skyblue;
}

section.darkblue {
	width: .62vw;
	background-color: navy;
}

section.blue12 {
	width: .3vw;
	background-color: skyblue;
}

section.pink11 {
	width: .22vw;
	background-color: hotpink;
}

section.yellow11 {
	width: .2vw;
	background-color: darkkhaki;
}

section.white4 {
	width: .65vw;
	background-color: white;
}

section.yellow12 {
	width: .2vw;
	background-color: darkkhaki;
}

section.pink12 {
	width: .22vw;
	background-color: hotpink;
}

section.blue13 {
	width: .3vw;
	background-color: skyblue;
}

section.darkblue2 {
	width: .62vw;
	background-color: midnightblue;
}

section.blue14 {
	width: .3vw;
	background-color: skyblue;
}

section.pink13 {
	width: .22vw;
	background-color: hotpink;
}

section.yellow13 {
	width: .15vw;
	background-color: darkkhaki;
}

section.black5 {
	width: .85vw;
	background-color: black;
}

section.yellow14 {
	width: .15vw;
	background-color: darkkhaki;
}

section.pink14 {
	width: .22vw;
	background-color: hotpink;
}

section.blue15 {
	width: .3vw;
	background-color: skyblue;
}

section.white5 {
	width: .65vw;
	background-color: white;
}

section.blue16 {
	width: .3vw;
	background-color: skyblue;
}

section.pink15 {
	width: .22vw;
	background-color: hotpink;
}

section.yellow15 {
	width: .15vw;
	background-color: darkkhaki;
}

section.darkblue3 {
	width: .62vw;
	background-color: midnightblue;
}

section.yellow16 {
	width: .15vw;
	background-color: darkkhaki;
}

section.pink16 {
	width: .25vw;
	background-color: hotpink;
}

section.blue17 {
	width: .3vw;
	background-color: skyblue;
}

section.black6 {
	width: .85vw;
	background-color: black;
}

section.blue18 {
	width: .3vw;
	background-color: skyblue;
}

section.pink17 {
	width: .25vw;
	background-color: hotpink;
}

section.yellow17 {
	width: .15vw;
	background-color: darkkhaki;
}

section.white6 {
	width: .65vw;
	background-color: white;
}

section.yellow18 {
	width: .15vw;
	background-color: darkkhaki;
}

section.pink18 {
	width: .25vw;
	background-color: hotpink;
}

section.blue19 {
	width: .3vw;
	background-color: skyblue;
}

section.darkblue4 {
	width: .62vw;
	background-color: midnightblue;
}

section.blue20 {
	width: .3vw;
	background-color: skyblue;
}

section.pink19 {
	width: .25vw;
	background-color: hotpink;
}

section.yellow19 {
	width: .2vw;
	background-color: darkkhaki;
}

section.black7 {
	width: .85vw;
	background-color: black;
}

section.yellow20 {
	width: .2vw;
	background-color: darkkhaki;
}

section.pink20 {
	width: .25vw;
	background-color: hotpink;
}

section.blue21 {
	width: .3vw;
	background-color: skyblue;
}

section.white7 {
	width: .55vw;
	background-color: white;
}

section.blue22 {
	width: .3vw;
	background-color: skyblue;
}

section.pink21 {
	width: .2vw;
	background-color: hotpink;
}

section.yellow21 {
	width: .2vw;
	background-color: darkkhaki;
}

section.gray4 {
	width: .62vw;
	background-color: lightslategrey;
}

section.yellow22 {
	width: .2vw;
	background-color: darkkhaki;
}

section.pink22 {
	width: .2vw;
	background-color: hotpink;
}

section.blue23 {
	width: .3vw;
	background-color: skyblue;
}

section.black8 {
	width: .85vw;
	background-color: black;
}

section.blue24 {
	width: .3vw;
	background-color: skyblue;
}

section.pink23 {
	width: .15vw;
	background-color: hotpink;
}

section.yellow23 {
	width: .2vw;
	background-color: darkkhaki;
}

section.white8 {
	width: .55vw;
	background-color: white;
}

section.yellow24 {
	width: .2vw;
	background-color: darkkhaki;
}

section.pink24 {
	width: .15vw;
	background-color: hotpink;
}

section.blue25 {
	width: .35vw;
	background-color: skyblue;
}

section.gray5 {
	width: .62vw;
	background-color: lightslategrey;
}

section.blue26 {
	width: .35vw;
	background-color: skyblue;
}

section.pink25 {
	width: .15vw;
	background-color: hotpink;
}

section.yellow25 {
	width: .2vw;
	background-color: darkkhaki;
}

section.black9 {
	width: .85vw;
	background-color: black;
}

section.yellow26 {
	width: .2vw;
	background-color: darkkhaki;
}

section.pink26 {
	width: .15vw;
	background-color: hotpink;
}

section.blue27 {
	width: .35vw;
	background-color: skyblue;
}

section.white9 {
	width: .67vw;
	background-color: white;
}

section.blue28 {
	width: .35vw;
	background-color: skyblue;
}

section.pink27 {
	width: .15vw;
	background-color: hotpink;
}

section.yellow27 {
	width: .2vw;
	background-color: darkkhaki;
}

section.gray6 {
	width: .62vw;
	background-color: lightslategrey;
}

section.yellow28 {
	width: .2vw;
	background-color: darkkhaki;
}

section.pink28 {
	width: .15vw;
	background-color: hotpink;
}

section.blue29 {
	width: .35vw;
	background-color: skyblue;
}

section.black10 {
	width: .8vw;
	background-color: black;
}

section.blue30 {
	width: .3vw;
	background-color: skyblue;
}

section.pink29 {
	width: .15vw;
	background-color: hotpink;
}

section.yellow29 {
	width: .2vw;
	background-color: darkkhaki;
}

section.white10 {
	width: .67vw;
	background-color: white;
}

section.yellow30 {
	width: .2vw;
	background-color: darkkhaki;
}

section.pink30 {
	width: .15vw;
	background-color: hotpink;
}

section.blue31 {
	width: .3vw;
	background-color: skyblue;
}

section.gray7 {
	width: .62vw;
	background-color: lightgrey;
}

section.blue32 {
	width: .3vw;
	background-color: skyblue;
}

section.pink31 {
	width: .2vw;
	background-color: hotpink;
}

section.yellow31 {
	width: .25vw;
	background-color: darkkhaki;
}

section.black11 {
	width: .8vw;
	background-color: black;
}

section.yellow32 {
	width: .25vw;
	background-color: darkkhaki;
}

section.pink32 {
	width: .2vw;
	background-color: hotpink;
}

section.blue33 {
	width: .25vw;
	background-color: skyblue;
}

section.white11 {
	width: .67vw;
	background-color: white;
}

section.blue34 {
	width: .25vw;
	background-color: skyblue;
}

section.pink33 {
	width: .2vw;
	background-color: hotpink;
}

section.yellow33 {
	width: .25vw;
	background-color: darkkhaki;
}

section.gray8 {
	width: .62vw;
	background-color: lightgrey;
}

section.yellow34 {
	width: .25vw;
	background-color: darkkhaki;
}

section.pink34 {
	width: .15vw;
	background-color: hotpink;
}

section.blue35 {
	width: .3vw;
	background-color: skyblue;
}

section.black12 {
	width: .85vw;
	background-color: black;
}

/* HOVER COLORS */
.blue:hover {
	background-color: yellow;
}

.black:hover {
	background-color: magenta;
}

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

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

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

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

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

.pink2:hover {
	
	background-color: cyan;
}

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

.white:hover {
	
	background-color: lime;
}

.blue4:hover {

	background-color: gold;
}

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

.yellow3:hover {

	background-color: red;
}

.black2:hover {

	background-color: white;
}

.yellow4:hover {

	background-color: cyan;
}

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

.blue5:hover {

	background-color: orange;
}

.gray2:hover {

	background-color: green;
}

.blue6:hover {

	background-color: red;
}

.pink5:hover {

	background-color: blue;
}

.yellow5:hover {
	background-color: cyan;
}

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

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

.pink6:hover {
	
	background-color: green;
}

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

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

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

.pink7:hover {
	
	background-color: lime;
}

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

.gray3:hover {
	
	background-color: violet;
}

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

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

.blue9:hover {
	
	background-color: cyan;
}

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

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

.pink9:hover {
	
	background-color: lime;
}

.yellow9:hover {
	
	background-color: black;
}

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

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

.pink10:hover {
	
	background-color: green;
}

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

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

.blue12:hover {
	
	background-color: white;
}

.pink11:hover {
	
	background-color: black;
}

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

.white4:hover {
	
	background-color: lime;
}

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

.pink12:hover {
	
	background-color: cyan;
}

.blue13:hover {
	
	background-color: lime;
}

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

.blue14:hover {
	
	background-color: green;
}

.pink13:hover {
	
	background-color: cyan;
}

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

.black5:hover {
	
	background-color: cyan;
}

.yellow14:hover {
	
	background-color: green;
}

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

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

.white5:hover {
	
	background-color: cyan;
}

.blue16:hover {
	
	background-color: black;
}

.pink15:hover {
	
	background-color: cyan;
}

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

.darkblue3:hover {
	
	background-color: lime;
}

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

.pink16:hover {
	
	background-color: cyan;
}

.blue17:hover {
	
	background-color: lime;
}

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

.blue18:hover {
	
	background-color: lime;
}

.pink17:hover {
	
	background-color: cyan;
}

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

.white6:hover {
	
	background-color: green;
}

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

.pink18:hover {
	
	background-color: cyan;
}

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

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

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

.pink19:hover {
	
	background-color: black;
}

.yellow19:hover {
	
	background-color: green;
}

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

.yellow20:hover {
	
	background-color: cyan;
}

.pink20:hover {
	
	background-color: lime;
}

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

.white7:hover {
	
	background-color: cyan;
}

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

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

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

.gray4:hover {
	
	background-color: magenta;
}

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

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

.blue23:hover {
	background-color: lime;
}

.black8:hover {
	
	background-color: magenta;
}

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

.pink23:hover {
	
	background-color: lime;
}

.yellow23:hover {
	
	background-color: hotpink;
}

.white8:hover {
	
	background-color: cyan;
}

.yellow24:hover {
	
	background-color: lime;
}

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

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

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

.blue26:hover {
	background-color: lime;
}

.pink25:hover {
	
	background-color: gray;
}

.yellow25:hover {
	
	background-color: black;
}

.black9:hover {
	
	background-color: white;
}

.yellow26:hover {
	
	background-color: cyan;
}

.pink26:hover {
	
	background-color: lime;
}

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

.white9:hover {
	
	background-color: green;
}

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

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

.yellow27:hover {
	
	background-color: lime;
}

.gray6:hover {
	
	background-color: cyan;
}

.yellow28:hover {
	
	background-color: lime;
}

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

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

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

.blue30:hover {
	background-color: lime;
}

.pink29:hover {
	
	background-color: green;
}

.yellow29:hover {
	
	background-color: navy;
}

.white10:hover {
	
	background-color: cyan;
}

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

.pink30:hover {
	
	background-color: lime;
}

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

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

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

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

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

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

.yellow32:hover {
	
	background-color: cyan;
}

.pink32:hover {
	
	background-color: lime;
}

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

.white11:hover {
	
	background-color: cyan;
}

.blue34:hover {
	
	background-color: lime;
}

.pink33:hover {

	background-color: red;
}

.yellow33:hover {
	
	background-color: seagreen;
}

.gray8:hover {
	
	background-color: lime;
}

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

.pink34:hover {
	
	background-color: black;
}

.blue35:hover {
	
	background-color: lime;
}

.black12:hover {
	
	background-color: magenta;
}