/* 
                 _..--+~/@-~--.
             _-=~      (  .   "}         _   __  __   _
          _-~     _.--=.\ \""""    )\/) /_) )_  / _  /_) )\ ) 
        _~      _~       \ \_\    (  ( / / (__ (__/ / / (  (                
       _~     _~          '--'
      =      _=               :      :       ____                   
___  |      ;                            ____ '~--.~.
     ;      ;  MAEGAN BY MAEGAN             _____  } |
  ___=       \ ___ __     __..-...__           ___/__/__
     :        =_     _.-~~          ~~--.__
_____ \         ~-+-~                   ___~=_______
     ~@#~~ == ...______ __ ___ _--~~--_
                                                    =
*/

*{
	margin-top: 4.1%;
	padding: 0;
}

header#canvas {
	width: 60vw;
	height: 60.1vw;
	margin: 6vw auto 0 19.8%;
}

section {
	width: 100%;
	height: 100%;
	float: left;
}

article {
	width: 2.94%;
	height: 100%;
	float: left;
}

figure{
	width: 0.5%;
	height: 100%;
	float: left;
	margin-top: 2%;
}

/* CSSS COLOR CLASSSES */

.purple {
	background-color: #9080A6;
  	transition: 0.3s;
}

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

.pink {
	background-color: #D06B9D;
  	transition: 0.3s;
}
	.pink:hover {
	background-color: orange;
	}

.yellow {
	background-color: #ECDC52;
  	transition: 0.3s;
}

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

.green {
	background-color: #43AB7A;
  	transition: 0.3s;
}

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

.blue {
	background-color: #93BCD2;
  	transition: 0.3s;
}

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

.orange {
	background-color: darkorange;
  	transition: 0.3s;
}
	.orange:hover {
	background-color: navy;
	}

.gold {
	background-color: #F7B40D;
  	transition: 0.3s;
}

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

.lime {
	background-color: #A9B843;
  	transition: 0.3s;
}

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

.bluelast {
	background-color: powderblue;
	width: 1%;
}

	.bluelast:hover {
	background-color: yellow;
	width: 1%;
	}

.purpleinside {
	background-color: black;
}

