@import url("http://fonts.googleapis.com/css?family=Comfortaa");
/* start reset */
/*
http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126; Public Domain
*/	html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
/* HTML5 display-role reset for older browsers */
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
/* body{line-height:1;} */
ol,ul{list-style:none;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
table{border-collapse:collapse;border-spacing:0;}
/* end reset */
body{	
	font-family: "Comfortaa","Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic" ,sans-serif;
	font-size:1.5em;
	background-image:url('http://jovino.com/random-image.php?width=60&height=136');
	background-size:100%;
	background-position:fixed;
	background-repeat:repeat;
	color:#222;
	background-color:#F0F;
}
::selection {
	background: #ff00ff;
}
::-moz-selection {
	background: #ff00ff;
}
h1{
	font-weight:bold;
	font-size:2em;
}
h2{
	font-weight:bold;
	font-size:2em;
}
h3{
	font-weight:bold;
	font-size:1.75em;
	color:#F0F;
}
h4{
	font-weight:bold;
	font-size:1.75em;
}
/*
 h3{
	font-size:28px;
	font-weight:bold;
	line-height:18px;
	margin-bottom:16px;
	letter-spacing:-2px;
	text-transform:uppercase;
 }

/*
/*
h4,h5{
	font-size:20px;
	font-weight:bold;
	line-height:24px;
}
*/
p{
/*	font-size:16px; */
	margin-bottom:16px;
	padding-bottom:16px;
}
ol,ul{
/*	font-size:14px; */
}
ul#nav{
	padding:0;
	font-weight:bold;
}
li{
	list-style-type:none;
	padding-bottom:8px;
	display:block;
}
li.nav{
	padding:0 16px;
	text-align:right;
}
li.nav span{
	text-decoration:none;
}
li.nav strong a{
	text-decoration:none;
}
li b:after {
	content:"\A";
	white-space:pre;
}
ul li ul li{
	margin-left:20px;
	padding-bottom:0;
	display: list-item;
	list-style-type: disc;
}
b, strong{
	font-weight:bold;
}
i, em{
	font-style:italic;
}
a{
	color:#F0F;
}
a:hover,.filter:hover{
	color:#0FF;
}
#logo{
	width:100%;
	max-width:960px;
	margin:0px auto -14px;
	padding:0 -6px;
}
#logo img{
	width:100%;
}

.container{
	width:100%;
	max-width:960px;
	margin:0 auto 20px;
	background-color:#fff;
	position:relative;
	z-index:21;
	border-radius:4px;
}
.content{
	padding:20px 20px 4px;
}
.folio{
	padding-bottom:0;
}
.folio img{
	width:100%;
	float:none;
	clear:both;
	margin:0 0 20px;
	border-radius:2px;
}
.folio img.pixels{
	width:auto;
	border:none;
	padding:0;
	float:none;
}

#pixels{
	text-align:center;
	display:inline;
	width:100%;
}

.folio img:nth-child(even).pixels{
	float:none;
	clear:none;
}
.folio img.bordered{
	border:1px solid #999;
	border-radius:2px;
}
#top{
	position:fixed;
	top:0;
	left:0;
	width:1px;
	height:1px;
	z-index:0;
	opacity:0;
}
.clear{
	clear:both;
}
audio{
	width:100%;
	max-width:800px;
	margin:10px auto 20px;
	border-radius:6px;
	background-color:#0f0;
	opacity:1.0;
}
.paused{
	background-color:#fff;
	opacity:0.25;
}
span.filter{
	cursor:pointer;
	text-decoration:underline;
}
.stuff, .intro{
	clear:both;
	// display:none;
}
.intro{
	margin:191px auto 40px;
	
}
.stuff.landing{
	display:block;
}
.landing img{
	display:block;
	margin:0 auto 20px;
	max-width:100%;
}
.landing .photocredit{
	padding-bottom:0;
}
h4.playing:hover{
	color:#2f2;
}
.photocredit{
	text-align:right;
	font-size:10px;
	margin-top:-16px;
	padding-bottom:16px;
}
.playing{
	text-decoration:none;
	color:#2f2;
	cursor:default;
}

#top{
	cursor:pointer;
}

.pink{
	color:#F0F;
}
.smallNav{
	background-image:url('logo16-nav.png');
	background-repeat:no-repeat;
	background-color:none;
	background-size:auto 136px;
	z-index:1000;
	padding-top:12px;
	height:120px;
}

.props{
	font-size:.8em;
	color:#F0F;
}

.BTT{
	text-align:right;
}
.up{
	color:#F0F;
	cursor:pointer;
	text-decoration:none;
	padding-right:20px;
}
#footcontainer{
	position: fixed;
	bottom: 0;
	left:0;
	width: 100%;
	padding:0;
	margin:0;
	z-index:1000;
	height:60px;
}
#footcontainer .container{
	margin-bottom:0;
	padding-bottom:0;
	padding-bottom:-20px;
}
#footcontainer .content{
	margin-bottom:0;
}
#footcontainer p .BTT{
	margin-bottom:0;
	padding:0;
	padding-right:20px;
}

#navDiv{
	width:100%;
	max-width:960px;
	background:none;
	background-color: rgba(33,33,33,.5);
}
#navDiv .container{
	background:none;
}


#copy{
	width:100%;
	max-width:960px;
	margin:-10px auto 10px;
	text-align:right;
}
#copy p{
	padding-right:20px;
	float:left;
}
#copy p.BTT{
	padding-right:20px;
	float:right;
}


#headcontainer{
	position: fixed;
	height:120px;
	top: 0;
	left:0;
	width: 100%;
	z-index:1000;
}
#headcontainer .container{
	margin-top:0;
	padding-top:0;
}
#headcontainer .content{
	margin-top:0;
	border-radius: 4px;
}
.headfix{
	position: fixed;
	top:0;
}

.glow{
	text-shadow:
	0px 2px #FFF,
	0px -3px #FFF,
	2px 0px #FFF,
	-2px 0px #FFF,
	
	2px 2px #FFF,
	2px -2px #FFF,
	-2px 2px #FFF,
	-2px -2px#FFF
	;
}



@media screen and (min-width : 1137px) {
	body{
		padding:0 60px;
	}

	li b:after {
		content:" \2014";
		font-weight:normal;
	}
	.folio img{
		width:48%;
	}
	.folio img:nth-child(even){
		float:right;
		clear:right;
	}
	.folio img:nth-child(odd){
		float:left;
		clear:left;
	}
	.folio img.full{
		width:100%;
		float:none;
		clear:both;
	}
	.folio img.right{
		float:right;
		margin:0 0 20px 16px;
		clear:left;
	}
/*
	#top{
		bottom:38px;
		left:8px;
		width:45px;
		height:45px;
		background-position:left center;
	}
	*/
}