html { font-size: 18px; }
* { margin: 0; padding: 0; }
body { font: .76em Century, Serif; background: url(../images/body.gif) repeat; color: #AAA; overflow-y: scroll; height: 101%; }
h1 { font: normal 2.7em Century, Serif; }
h2 { font: normal 1.8em Century, Serif; color: #dfdfdf; margin: 0 0 1em; }
h3 { font: normal 1.4em Century, Serif; margin: 0 0 20px; }
h4 { font: normal 1.1em Century, Serif; color: #dfdfdf; margin: 0 0 0.25em; }
p { margin: 0 0 1em; line-height: 1.6em; }
a { outline: 0; color: #304D6F; text-decoration: none; }
li { list-style: none; }
li a, img { display: block; }
img { outline: 0; border: 0; }
#wrapper { width: 80em; margin: auto; }
.clr { clear: both; }

#logo { float: left; padding: 2.5em 1.25em; }
	#logo h1 a { color: #fff; }
		#logo h1 a span { color: #AAA; }
#start { padding-top: 15.625em; width: 100%; text-align: center; }
	#start h1 { color: #fff; }
		#start h1 span { color: #AAA; }
#menu { height: 3.5em; padding: 0.25em 0 0 0.25em; }
	#menu li { float: left; font-size: 1.3em; text-transform: uppercase; }
		#menu li a { color: #AAA; margin: 0 3.125em 0 0; }
			#menu li a.current, #menu li a:hover { color: #fff; }

#pitch { clear: both; background: url(../images/pitch.jpg) no-repeat; background-size: cover; height: 20em; margin: 0 0 1.875em; padding: 3.125em 22.5em 0.625em 1.875em;  color: #888; }
	#pitch h1 { font-size: 2.3em; color: #304D6F; margin: 0 0 1.25em; }
	#pitch em { font-size: 1.1em; font-weight: bold; line-height: 1.6em; }
	#pitch h2 { color: #304D6F; margin-top: -1em; }
	#pitch span a { border-bottom: 1px dotted #666; padding: 0 0 1px; }
	#pitch span { color: #304D6F; font-size: 1.1em; }

.content { background: url(../images/content.gif) repeat; padding: 1.25em; }
.link { color: #ccc; margin: 0 0.625em 0 0; border-bottom: 1px dotted #666; padding: 0 0 1px; }
.upper { text-transform: uppercase; }
#main { padding: 1.25emx; }
.col { float: left; width: 23em; margin: 0 3em 1em 0; }
	.col.last { float: right; margin-right: 1em; }
	.col li, .case li { list-style-type:disc; margin-left: 1.5em; }
	.case img { float: left; clear: left; margin: 0 1.25em 1.25em 0; background: #121212; padding: 3px; }
	.short { padding: 0 0 1em 0; background: url(../images/line.gif) repeat-x left bottom; }
	.case a, .article a { color: #ddd; font-weight: bold; }
	.date { font-size: .84em; margin: 0 0 3px; }

#footer { clear: both; background: url(../images/line.gif) repeat-x; padding: 1.25em 1.25em 0.625em; font-size: .9em; }
	#footer a, #header #links a, #start .case a { color: #ccc; margin: 0 0.625em 0 0; border-bottom: 1px dotted #666; padding: 0 0 1px; }
	#links { float: right; }
		#links a { margin: 0 0 0 0.625em; }
	#footer p { margin: 0 0 8px; }
	#header p { margin: 1.5em 0.625em 1em; text-align: right; }

/* styles 880p ----------------------------------------------------------- */
@media only screen and (max-width: 40em) { 
	html { font-size: 16px; height: 100%; }
	#wrapper { width: 95%; margin-left: auto; margin-right: auto; }
	#logo	 { padding: 1.5em 1.25em; }
	#links   { display: none; }
	#pitch:not(.contact) p { display: none; }
	#pitch   { height: 14em; padding: 1em; background: url(../images/pitchrev.jpg) no-repeat right; background-size: cover; }
	#pitch.contact    { height: 20em; }
	#pitch.contact h2 { display: none; }
	.col     { float: left!important; width: 95%; font-size: 1.1em; }
} 

/* menu        ----------------------------------------------------------- */
.show-menu { display: none; position: absolute; top: 0.5em; right: 0.5em; color: #fff; font-size: 3.2em; }
input[type=checkbox]{ display: none; }										/* Hide checkbox */
input[type=checkbox]:checked ~ #menu{ display: block; }						/* Show menu when invisible checkbox is checked */

@media only screen and (max-width: 40em) { 
	li { float: left; margin-right: 1px; }				/* Create a horizontal list with spacing */
    #menu { position: static; display: none; position: absolute; padding: 1em; 
			top: 5em; right: 1em; width: 15em; height: 12em; background: url(../images/content.gif) repeat; }
    li { margin-bottom: 0.5em; }											/* Create vertical spacing */
    ul li, li a { width: 100%; }											/* Make all menu links full width */
    .show-menu { display:block; }											/* Display 'show menu' link */
}