@charset "UTF-8";
/* -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
-=-=-= THESE STYLES DESIGNED AND BUILT WITH LOVING CARE -=-=-=
=-=-=-=- ENTIRELY BY HAND JUST FOR YOU BY IAN BESLER -=-=-=-=-
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=- */

/* -=-=-=-=-=-=-=-=-=-=
-=-=-= CSS RESET =-=-=-
=-=-=-=-=-=-=-=-=-=- */

* {
	margin: 0;
	padding: 0;
}

/* -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
-=-=-= HTML5 SEMANTIC TAGS =-=-=-
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=- */

	body {
		background-color: #fff;
	}

	main#canvas {
		margin: 2.85vw auto 0 auto;
		width: 61vw;
		height: 49.7vw;
	}

		section {
			width: 100%;
		}

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

			section#row-one {
				height: 11.2%;
			}

				article#row-one-col-one {
					width: 18.6%;
				}

				article#row-one-col-two {
					width: 63%;
				}

				article#row-one-col-three {
					width: 18.4%; 
				}
			
			section#row-two {
				height: 7.3%;
			}

				article#row-two-col-one {
					width: 15.2%;
				}

				article#row-two-col-two {
					width: 3.4%;
				}

				article#row-two-col-three {
					width: 11.5%;
				}

				article#row-two-col-four {
					width: 40%;
				}

				article#row-two-col-five {
					width: 11.5%;
				}

				article#row-two-col-six {
					width: 3.4%;
				}

				article#row-two-col-seven {
					width: 15%;
				}
			
			section#row-three {
				height: 14.5%;
			}

				article#row-three-col-one {
					width: 4.8%;
				}

				article#row-three-col-two {
					width: 10.4%;
				}

				article#row-three-col-three {
					width: 3.4%;
				}

				article#row-three-col-four {
					width: 11.5%;
				}

				article#row-three-col-five {
					width: 3.4%;
				}

				article#row-three-col-six {
					width: 9.3%;
				}

				article#row-three-col-seven {
					width: 2.8%;
				}

				article#row-three-col-eight {
					width: 9.2%;
				}

				article#row-three-col-nine {
					width: 2.7%;
				}

				article#row-three-col-ten {
					width: 9.4%;
				}

				article#row-three-col-eleven {
					width: 3.3%;
				}

				article#row-three-col-twelve {
					width: 11.5%;
				}

				article#row-three-col-thirteen {
					width: 3.3%;
				}

				article#row-three-col-fourteen {
					width: 10.4%;
				}

				article#row-three-col-fifteen {
					width: 4.6%;
				}
			
			section#row-four {
				height: 0.9%;
			}
			
			section#row-five {
				height: 0.8%;
			}
			
			section#row-six {
				height: 4.2%;
			}
			
			section#row-seven {
				height: 15%;
			}

				article#row-seven-col-one {
					width: 15.2%;
				}

				article#row-seven-col-two {
					width: 3.4%;
				}

				article#row-seven-col-three {
					width: 11.5%;
				}

				article#row-seven-col-four {
					width: 3.4%;
				}

				article#row-seven-col-five {
					width: 9.3%;
				}

				article#row-seven-col-six {
					width: 2.8%;
				}

				article#row-seven-col-seven {
					width: 9.2%;
				}

				article#row-seven-col-eight {
					width: 2.7%;
				}

				article#row-seven-col-nine {
					width: 9.4%;
				}

				article#row-seven-col-ten {
					width: 3.3%;
				}

				article#row-seven-col-eleven {
					width: 11.5%;
				}

				article#row-seven-col-twelve {
					width: 3.3%;
				}

				article#row-seven-col-thirteen {
					width: 15%;
				}
			
			section#row-eight {
				height: 4.7%;
			}

				article#row-eight-col-one {
					width: 30.1%;
				}

				article#row-eight-col-two {
					width: 3.4%;
				}

				article#row-eight-col-three {
					width: 9.3%;
				}

				article#row-eight-col-four {
					width: 2.8%;
				}

				article#row-eight-col-five {
					width: 9.2%;
				}

				article#row-eight-col-six {
					width: 2.7%;
				}

				article#row-eight-col-seven {
					width: 9.4%;
				}

				article#row-eight-col-eight {
					width: 3.3%;
				}

				article#row-eight-col-nine {
					width: 29.8%;
				}
			
			section#row-nine {
				height: 34.8%;
			}

				article#row-nine-col-one {
					width: 4.8%;
				}

				article#row-nine-col-two {
					width: 28.7%;
				}

				article#row-nine-col-three {
					width: 33.4%;
				}

				article#row-nine-col-four {
					width: 28.5%;
				}

				article#row-nine-col-five {
					width: 4.6%;
				}
			
			section#row-ten {
				height: 6.6%;
			}

				article#row-ten-col-one {
					width: 4.8%;
				}

				article#row-ten-col-two {
					width: 28.7%;
				}

				article#row-ten-col-three {
					width: 33.4%;
				}

				article#row-ten-col-four {
					width: 28.5%;
				}

				article#row-ten-col-five {
					width: 4.6%;
				}

		aside {
			font-size: 0.8em;
			font-family: Arial, Helvetica, sans-serif;
			text-align: right;
			padding-top: 0.2em;
		}

/* -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
-=-=-= COLOR CLASSES =-=-=-
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=- */

.fanny-sanin-gray {
	background-color: #262825;
}
	
	.fanny-sanin-gray:hover {
		background-color: #6ba;
	}

.fanny-sanin-turquoise {
	background-color: #6ba;
}

	.fanny-sanin-turquoise:hover {
		background-color: #262825;
	}

.fanny-sanin-teal {
	background-color: #516370;
}

	.fanny-sanin-teal:hover {
		background-color: #1c1e24;
	}

.fanny-sanin-dark-blue {
	background-color: #1c1e24;
}

	.fanny-sanin-dark-blue:hover {
		background-color: #516370;
	}

.fanny-sanin-crimson {
	background-color: #6d211b;
}

	.fanny-sanin-crimson:hover {
		background-color: #111;
	}

.fanny-sanin-black {
	background-color: #111;
}

	.fanny-sanin-black:hover {
		background-color: #6d211b;
	}

.fanny-sanin-red {
	background-color: #a43;
}

	.fanny-sanin-red:hover {
		background-color: #8e9079;
	}

.fanny-sanin-pink {
	background-color: #b7a09b;
}
	
	.fanny-sanin-pink:hover {
		background-color: #a43;
	}

.fanny-sanin-olive {
	background-color: #8e9079;
}

	.fanny-sanin-olive:hover {
		background-color: #b7a09b;
	}