html {
	height: 100%;
	background:	/* funky drops with gradient */
		linear-gradient(to bottom, #002244, #120106) fixed no-repeat;
	font-size: 100%;
}

body {
	padding: 0 20px;
	padding: 0 1.25rem;
	margin-top: 0;
	margin-bottom: 0;
	height: 100%;
	min-height: 100%;

	font-size: 12px;
	font-size: 1.2rem;
	font-family: Helvetica, Arial, sans-serif;
	color: #eeeeee;
	text-rendering: optimizeLegibility;
}


	
/* links */

a {
	color: #000099;
	text-decoration: none;
}

a:hover {
	color: #0000ff;
}

a:active {
	color: #ff00ff;
}


.main {
	max-width: 760px;
}



/* lists */

ul {
	padding: 0;
	margin: 0;
}

li {
	display: block;				/* removes discs */
/*	list-style-type: circle;
	list-style-position: inside;	*/
}


/* checkbox-hack */

input[type=checkbox] {				/* hide checkbox */
 	position: absolute;
	top: -9999px;
	left: -9999px;
}

.checkbox-input {				/* hide input element */
	display: none;
}

.notes {					/* collapsed view of latest section (default state) */
	max-height: 60px;
	overflow:hidden;
}

input[type=checkbox]:checked ~ .notes {	/* full view */
	max-height: 100%;
	overflow:visible;
}

.works {					/* collapsed view of latest section (default state) */
	max-height: 60px;
	overflow:hidden;
}

input[type=checkbox]:checked ~ .works {		/* full view */
	max-height: 100%;
	overflow:visible;
}

label:after {					/* button to expand */
	color: #ff00ff;
	content: "[more]";	
}

input[type=checkbox]:checked + label:after {	/* button to collapse */
	color: #ff00ff;
	content: "[less]";
}