@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;
	}

		a:link {
			color: #00f;
		}

		a:hover {
			background-color: #ff0;
		}

	html,body {
		width: 100%;
		height: 100%;
	}

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

/* =-=-=-=-=-=-=-=-=
=-=-=- HEADER =-=-=-
-=-=-=-=-=-=-=-=- */

header {
	width: 100%;
	position: fixed;
	background-color: lightgray;
	padding: 2%;
	border-bottom: 0.1em solid #000;
	font-size: 1.5em;
}

	h1,h2,h3,h4,h6 {
		font-family: sans-serif;
		font-weight: normal;
	}

/* =-=-=-=-=-=-=-=-=-
=-=-=- MAIN -=-=-=
-=-=-=-=-=-=-=-=-= */

main {
	padding: 12em 0 0 2%;
}

/* =-=-=-=-=-=-=-=-=-
=-=-=- SECTION -=-=-=
-=-=-=-=-=-=-=-=-= */

h4 {
	padding-top: 6em;
	text-align: center;
	font-size: 1.5em;
}

/* =-=-=-=-=-=-=-=-=-
=-=-=- FIGURE -=-=-=
-=-=-=-=-=-=-=-=-= */

figure {
	width: 5vw;
	height: 5vw;
	position: fixed;
	z-index: 2;
}

/* =-=-=-=-=-=-=-=-=
=-=-=- FOOTER =-=-=-
-=-=-=-=-=-=-=-=- */

footer {
	position: fixed;
	bottom: 0;
	width: 100%;
	background-color: lightgray;
	padding: 2%;
	font-size: 2em;
	border-top: 0.1em solid #000;
}

	footer img {
		width: 1em;
	}