/* general styles*/
body {
	max-width: 1155px;
	margin: 0 auto;
	line-height: 150%;
	overflow-x:hidden;
	background-color: #fafafa;
}

i {
	font-style: italic;
}
h1, h2, h3, header, nav {
	font-family: "arial narrow", arial, sans-serif;
	font-weight: normal;
	text-transform: uppercase;
}
p, td {
	font-family: "Times New Roman", times, serif;
	/*font-family: arial, sans-serif;*/
}

h1 {
	color: #666;
	font-size: 35px;
	height: 30px;
	margin: 30px 0 20px;
	padding-top: 29px;
	text-align: left;
	clear: left;
}
h2 {
	font-size: 25px;
	text-align: left;
	margin-top: 20px;
	padding: 0 0 10px 0;
	color: #777;
	clear: left;
}
h3 {
	font-size: 20px;
}
a {
  	text-decoration: none;
  	color: #666;
}
a:hover {
	color: #4d89eb;
}

/* header styles */
header {
	width: 80%;
	max-width: 900px;
	min-width: 400px;
	margin-left: 150px;
	padding-top: 20px;
}

/* navigation styles */
nav {
	width: 120px;
	top: 130px;
	position: fixed;
	float: left;
	vertical-align: bottom;
	-webkit-transition: top 1s;
	transition: top 1s;
}
nav.smaller {
	top: 30px;
}
nav li {
	height: 30px;
	margin: 23px 0;
	font-size: 24px;
	text-align: right;
}
nav a {
	color: #ccc;
	-webkit-transition: font-size 0.5s, color 0.5s;
	transition: font-size 0.5s, color 0.5s;
}
nav a:hover {
	font-size: 27px;
	color: #4d89eb;
}
nav a.focus {
	color: #4d89eb;
	font-size: 30px;
}
nav a img {
	width: 40px;
	-webkit-transition: width 0.5s;
	transition: width 0.5s;
}
nav li.logo {
	height: 45px;
}
nav li#email, nav li#twitter {
	height: 30px;
}
nav a img:hover {
	width: 45px;
}

#devinroth {
	width: 100px;
	height: 70px;
	padding-left: 30px;
}
#devinroth img {
	width: 100%;
	opacity: 0;
	transition: opacity 1s;
	-webkit-transition: opacity 1s;
}
.smaller #devinroth img {
	opacity: 1;
}
section {
	width: 90%;
	margin: 0 auto;
	clear: left;
}

/* content styles */
.content {
	margin-left: 100px;
}
img.half {
	width: 25%;
	float: left;
	padding: 6px 10px 15px 0;
}
img.full {
	width: 100%;
}
table {
  	width: 100%
}
tr.alt {
  	background-color: #fff;
}
td {
	padding-right: 10px;
}
audio {
	width: 100%;
}
audio.album {
	width: 48%;
}
.clear {
	clear: left;
	
}
.play {
	background-image: url("../img/icons/play.png");
	width: 70px;
	height: 70px;
	float: left;
	cursor: pointer; cursor: hand;
	transition: background-image 1s;
	-webkit-transition: background-image 1s;
}
.pause {
	background-image: url("../img/icons/pause.png");
	transition: background-image 1s;
	-webkit-transition: background-image 1s;
}
.download {
	background-image: url("../img/icons/download.png");
	width: 70px;
	height: 70px;
	float: left;
	transition: background-image 1s;
	-webkit-transition: background-image 1s;
}
.play:hover {
	background-image: url("../img/icons/playnew.png");
	transition: background-image 1s;
	-webkit-transition: background-image 1s;
}
.pause:hover {
	background-image: url("../img/icons/pausenew.png");	
	transition: background-image 1s;
	-webkit-transition: background-image 1s;
}
.download:hover {
	background-image: url("../img/icons/downloadnew.png");
	transition: background-image 1s;
	-webkit-transition: background-image 1s;
}

.wavesurfer {
	margin-left: 70px;
}

#biog h1 {
	margin-top: 20px;
}
#bio img {
	margin-bottom: 0;
	padding-bottom: 0;
}

#credits h3 {
	padding: 0;
	margin: 0;
	text-align: center;
}
#credits p {
	text-transform: uppercase;
	font-family: "arial narrow", arial, sans-serif;
	text-align: center;

}
.scroll-right {
	background-color: #000;
	height: 100px;
	width: 50px;
	z-index: 999;
}
.scroll-left {
	background-color: #000;
}
#credits img {
	width: 100%;
}
/*#features, #tv {
	height: 420px;
	overflow: auto;
	white-space: nowrap;

}*/
#features div, #tv div {
	width: 214px;
	height: 400px;
	margin-right: 20px;
	display: inline-block;
	vertical-align: top;
}
/*#short-films, #games {
	height: 120px;
	overflow: auto;
	white-space: nowrap;

}*/
#short-films div, #games div {
	width: 214px;
	height: 100px;
	margin-right: 20px;
	float: left;
	margin-top: 10px;
	vertical-align: top;
}

#albums div {
	width: 214px;
	height: 300px;
	margin-right: 20px;
	display: inline-block;
	vertical-align: top;
}

footer {
	clear: left;
  text-align: center;
  margin: 20px 0 1000px;
}