/*

	......................................................................................
	...................mmmmmm.......mmmmmm...................mmmmmm.......mmmmmm..........
	........mmmmmm...mmmmmmmmmm...mmmmmmmmmmm.....mmmmmm...mmmmmmmmmm...mmmmmmmmmm........
	........mmmmmm.mm.........mmmm..........mmm...mmmmmm.mm.........mmmm..........mmm.....
	........mmmmmmmm...........mm...........mmm...mmmmmmmm...........mm...........mmm.....
	........mmmmmm.............mm...........mmm...mmmmmm.............mm...........mmm.....
	........mmmmmm.............mm...........mmm...mmmmmm.............mm...........mmm.....
	........mmmmmm.............mm...........mmm...mmmmmm.............mm...........mmm.....
	........mmmmmm.............mm...........mmm...mmmmmm.............mm...........mmm.....
	........mmmmmm.............mm...........mmm...mmmmmm.............mm...........mmm.....
	........mmmmmm.............mm...........mmm...mmmmmm.............mm...........mmm.....
	......................................................................................

	Minerva's Ascii art logo = my initials 
*/

/* RESET CSS */

* {
	margin: 0;
	padding: 0;
}

/* -=-=-CANVAS-=-=-= */

header#canvas {
	width: 46vw;
	height:46vw;
	background-color: #edede5;
	margin: 2vh auto;
}
main, section, figure {
	float: center;
}

	main.beige {
	display: inline-block;
	width: 100%;
	height:100%;
	background-color: #edede5;

	
	}
	
	section.blue {
		display: inline-block;
		width: 65%;
		height: 65%;
		background-color:#5588b3;
		margin-top: 17%;
		margin-left: 18%;

	}

	figure.pink {
		display: inline-block;
		width:65%;
		height: 65%;
		background-color: #9d6ba8;
		margin-top: 26%;
		margin-left: 16%;
		

	}

	figcaption.magenta {
		width: 67%;
		height:67%;
		background-color: #ab4445;
		margin-top: 22%;
		margin-left: 17%;
	}

	/* -=-= COLOR CLASS HOVER -=-= */

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

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

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

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