/* FONTS */
*, *:before, *:after {
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
}

body { width: 100%; background-color: #333333; }

body, textarea
{
	font: 100%/1.666666666666667 "Source Sans Pro", serif;
	color: #fff;
}

h1, h2, h3, h4, h5, h6, #controls, th, .navigation-hidden, footer p { font-family: "Bebas Neue", sans-serif; }

h1 { font-size: 3.3em; }
h2 { font-size: 2em; }
h3 { font-size: 1.5em; }

/* LAYOUT */

ul { margin: 0 0 1em 1em; } 
ol { margin: 0 0 1em 1.25em; }
ul li, 
ol li { margin: 0.25em 0; }
li ul { margin: 0 0 0 1em; } 
li ol { margin: 0 0 0 1.25em; }

#controls { width: 100%; }

#navigation { display: inline-block; list-style-type: none; margin: 0em 1em; padding: 0; }
#navigation li { display: inline; float: left; margin: 1px 1px 1px 0; padding: 0; }
#navigation li a { float: left; text-decoration: none; color: #fff; }
#navigation li a,
#navigation li.selected { padding: 1.6em 0.8em 0.2em 0.8em; font-size: 1.5em; }
#navigation li.selected,
#navigation li a:hover { color: #333333; background-color: #ee7c4a; }

#header { margin: 1em; }
#header h1 { border-bottom: 1px solid #fff; font-weight: 700; font-size: 3.3em; line-height: 1.3; }
#header img { display: block; float: left; max-height: 100%; max-width: 100%; margin: 0 1em 1em 0; border: 1px solid; }
#header p { font-size: 1.33em; line-height: 1.5; margin: 1em 0 0 0; }
#header p span.drop { float: left; font-size: 2.89em; line-height: 100%; margin: 0; padding: 0 0.08em 0 0; text-transform: capitalize; color: #cc3300; }
#header p a { text-decoration: none; color: #ee7c4a; }
#header p a:hover { color: #f7bea5; }

footer { margin: 0 1em; padding: 1em 0 0 0; clear: both; border-top: 1px solid #fff; }
footer p { font-size: 1.17em; margin: 0 0 1em 0; }
footer p a { text-decoration: none; color: #ee7c4a; }
footer p a:hover { color: #f7bea5; }

/* biog page */
table { width: 100%; }
td, th { padding: 0.2em; border: 2px solid; text-align: left; }
#content table tr td a { font-weight: normal; }
th { background-color: #ee7c4a; color: #333333; }
tr, td { background-color: #f7bea5; color: #333333; }
td, th { border-color: #333333; }
#biography > .alt-view { margin-top: 1em; }
#biography > .alt-view > a { text-decoration: none; color: #ee7c4a; }
#biography > .alt-view > a:hover { color: #f7bea5; }
#biography > section { margin: 1em 0; }
td a { text-decoration: underline; color: #333333; }
td a:hover { color: #ee7c4a; }

/* contact */
#contact label { display: block; margin-bottom: 0.25em; }
#contact input[type=text] { display: block; border: 1px solid #ee7c4a; color: #000; line-height: 2em; min-width: 10em; max-width: 30em; margin-bottom: 1em; }
#contact textarea { display: block; line-height: 1em; border: 1px solid #ee7c4a; color: #000; min-width: 10em; max-width: 30em; height: 10em; margin-bottom: 1em; }
#contact input[type=submit] { border: 1px solid #000; margin: 1em 0 3em 0; padding: 0.5em; line-height: 2em; border-radius: 0.5em; background-color: #ee7c4a; }
#contact input[type=submit]:hover { border: 1px solid #f7bea5; }
#contact .error { color: #ee7c4a; margin-bottom: 0.25em; }

/* reviews */
blockquote { margin: 0 0 1em 0; padding: 0.5em 0 0.5em 1em; border-width: 0 0 0 5px; border-style: solid; border-color: #ee7c4a; }
div.quotebody > p { margin: 0 0 1em 0; }
p.reviewer { margin: 0; } 
blockquote a { text-decoration: none; color: #ee7c4a; }
blockquote a:hover { color: #f7bea5; }

/* Photos */
.gallery { display: inline-block; margin: 0 0 1em 0; padding: 0; width: 100%; }
.gallery li.thumb { display: inline-block; list-style: none; width: 7em; height: 7em; margin: 0; }
.gallery li.thumb a { display: block; text-decoration: none; font-weight: 400; color: #222222; padding: 0.5em; width: 7em; height: 7em; }
.gallery li.thumb a:hover { background-color: #ee7c4a; }
.gallery li.thumb img { display: block; max-width: 100%; height: auto; position: static; }
.gallery li.thumb .img-box { margin: 0 auto; display: block; }

/* Music */
#music a { text-decoration: none; color: #ee7c4a; }
#music a:hover { color: #f7bea5; }


#container { margin: 0 auto; max-width: 60em; }

#content { margin: 1em 1em 0 1em; }
#content p { margin: 0 0 1em 0; overflow: hidden; }

ul.standard { margin: 0 0 0.5em 1em; padding: 0; }
ul.standard li { list-style-type: disc; margin: 0 0 0.5em 0; padding: 0; }
ul.standard li ul { margin: 0 0 0.5em 2em; padding: 0; }
ul.standard li ul li { list-style-type: circle; margin: 0.25em 0; padding: 0; }
ul.standard li a { text-decoration: none; font-weight: 700; color: #cc3300; }
ul.standard li a:hover { color: #FF6600; }

.hidden, .navigation-hidden { position: absolute; left: -9999px; }

.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

@media all and (max-width: 540px) {
	/* extra styles for mobile */
	#cookie-warning { margin: 1px 0 0 0; }
	
	#controls, #navigation, #preferences { margin: 0; display: block; width: 100%; }
	
	#navigation li { display: block; float: none; margin: 0; padding: 0; } 
	#navigation li a { display: block; float: none; padding: 0.25em; border-bottom: 1px solid #fff; }
	#navigation li.selected { padding: 0.25em; border-bottom: 1px solid #fff; }

	.left-column { width: 100%; }
	.right-column { float: left; width: 100%; }
	.left-column-inner { margin: 0; }
	.right-column-inner { margin: 0; }
	
	/*.navigation-hidden { position: static; left: auto; margin: 2em 0; }
	.navigation-hidden a { display: block; text-decoration: none; color: #222222; padding: 0.25em; border-top: 1px solid #ddd; border-bottom: 1px solid #fff; }
	.navigation-hidden a:hover { color: #fff; background-color: #ee7c4a; }*/
}