/*
Theme Name: Will Beardmore HTML5
Theme URI: http://www.willbeardmore.com
Description: CMS Based HTML5 theme for Will Beardmore's portfolio
Version: 1.0
Author: Will Beardmore
Author URI: http://www.willbeardmore.com/
Tags: html5, portfolio
*/

header, section, footer, aside, nav, article, figure {
	    display: block;
	}

body {
	background: url('images/layout/header-bg.png') top repeat-x #3d3d3d;
	margin: 0;
	padding: 0;
	color: #fff;
	font-size: 80%;
	font-family: Verdana, Arial, Sans-Serif;
}

html, body {
	height: 100%;
}

h1 {
	font-size: 160%;
	margin-bottom: 4px;
}	

img { border: 0; }

a,a:visited { color: #9a9a9a;}
a:Hover { color: #fff; }

header {
	height: 294px;
	width: 960px;
	margin: 0 auto;
	background: url('images/layout/will-top.jpg') center no-repeat;	
	position: relative;
	z-index: 2;
}

header h1, header nav#social {
	background: url('images/layout/top-red-bg.gif') no-repeat;
	width: 254px;
	height: 41px;
	margin: 0;
	padding: 0;
	text-align: center;
}

header h1 {
	position: absolute;
	left: 0;
	top: 0;
}
header h1 img {
	margin-top: 2px;
}

header nav#social {
	position: absolute;
	top: 0;
	right: 0;
}

nav#social ul {
	list-style-type: none;
	margin: 0;
	padding: 8px 0 0 18px;
}

nav#social ul li {
	float: left;
	margin-right: 2px;
}

nav#social ul li a {
	display: block;
	width: 22px;
	height: 22px;
	background: url('images/layout/Networks-Sprite_2.gif') no-repeat;
}

nav#social ul li a.songkick { background-position: 0 0; }
nav#social ul li a.foursquare { background-position: -22px 0; }
nav#social ul li a.flickr {	background-position: -44px 0; }
nav#social ul li a.lastfm {	background-position: -66px 0; }
nav#social ul li a.twitter { background-position: -88px 0; }
nav#social ul li a.linkedin { background-position: -110px 0; }
nav#social ul li a.myspace { background-position: -132px 0; }
nav#social ul li a.facebook { background-position: -154px 0; }
nav#social ul li a.youtube { background-position: -178px 0; }

nav#social ul li a.songkick:Hover { background-position: 0 -22px; }
nav#social ul li a.foursquare:Hover { background-position: -22px -22px; }
nav#social ul li a.flickr:Hover { background-position: -44px -22px; }
nav#social ul li a.lastfm:Hover { background-position: -66px -22px; }
nav#social ul li a.twitter:Hover { background-position: -88px -22px; }
nav#social ul li a.linkedin:Hover { background-position: -110px -22px; }
nav#social ul li a.myspace:Hover { background-position: -132px -22px; }
nav#social ul li a.facebook:Hover { background-position: -154px -22px; }
nav#social ul li a.youtube:hover { background-position: -178px -22px; }

nav#social ul li a span { position: absolute; left: -10000px; }

header h2 {
	margin: 0;
	padding: 0;
}

header h2#newmedia-graduate {
	position: absolute;
	bottom: -4px;
	left: 0;
}

header h2#listento-metal {
	position: absolute;
	right: 0;
	bottom: -16px;
}	

.tooltip {
	display:none;
	background:transparent url('images/layout/black_arrow.png');
	font-size: 100%;
	padding-top: 20px;
	height:35px;
	width:190px;
	text-align: center;
	z-index: 10;
}

nav#mainnav {
	background: url('images/layout/nav-bg.png') repeat-x top left;
	height: 44px;
	position: absolute;
	top: 294px;
	width: 100%;
	z-index: 1;
	padding-top: 5px;
}

nav#mainnav ul {
	width: 570px;
	margin: 0 auto;
	padding: 0;
	list-style-type: none;
}

nav#mainnav ul li {
	margin: 0;
	padding: 0;
	width: 114px;
	float: left;
	position: relative;
}

nav#mainnav ul li a {
	display: block;
	width: 114px;
	height: 35px;
	background: url('images/layout/nav-button-bg.png') transparent bottom no-repeat;
	color: #fff;
	font-size: 140%;
	text-decoration: none;
}

nav#mainnav ul li a:Hover, nav#mainnav ul li.current_page_item a, nav#mainnav ul li.current_page_ancestor a, nav#mainnav ul li.current_page_parent a {
	height: 44px;
}

nav#mainnav li a img {
	position: absolute;
	bottom: 10px;
}

#middlesection {
	background: url('images/layout/bg-tile.gif');
}	

div#middle-wrap {
	background: url('images/layout/content-bg2.gif') top;
	position: absolute;
	top: 294px;
	width: 100%;
	padding-top: 60px;
}

div#middle-content {
	width: 960px;
	margin: 0 auto;
	min-height: 400px;
	position: relative;
}

.left-column {
	background: url('images/layout/seperator-v.png') right repeat-y;
	padding-right: 30px;
	width: 40%;
	float: left;
}

footer {
	clear: both;
	height: 189px;
	background: url('images/layout/footer-bg-fade.png') top repeat-x;
	padding-top: 20px;
	width: 100%;
}

#footer-mid {
	margin: 0 auto;
	width: 960px;
}

footer ul {
	list-style-type: none;	
}

div.right-column {
	width: 55%;
	float: right;
}

div#accordion {
	background: url('images/layout/accordion-mid.gif') repeat-x;
	height: 215px;
	width: 513px;
	overflow: hidden;
	position: relative;
	display: none;
}	
div.acc-item {
	width: 33px;
	overflow: hidden;
	background: url('images/layout/accordion-right.gif') right no-repeat;
	height: 215px;
	float: left;
	position: relative;
}
div.acc-item section {
	height: 215px;
	background: url('images/layout/accordion-left.gif') left top no-repeat;
	position: absolute;
	top: 0px;
	left: 0px;
	font-size: 90%;
}
div.acc-item h1 {
	width: 24px;
	margin-top: 100px;
	float: left;
	margin-right: 20px;
}
div.acc-item ul {
	list-style-type: none;
}

.acc-item embed {
	float: left;
}

#blipcontent {
	float: left;
	width: 330px;
	text-align: center;
	padding-top: 15px;
}

#lastfmselections {
	width: 325px;
}
#lastfmselections li {
	display: inline;
}


div.acc-item ul.twitterandblog {
	width: 325px;
}
div.acc-item ul.twitterandblog li {
	background: url('images/layout/seperator-h-acc.png') bottom repeat-x;
	padding-bottom: 4px;
}


.clickable:Hover {
	cursor: pointer;
}

#showcase {
	margin-top: 20px;
}

#showcase section {
	background-repeat: no-repeat;
	height: 150px;
	width: 250px;
	overflow: hidden;
}

#showcase section h1 {
	font-size: 100%;
}
#showcase section h1 a {
	color: #FFF;
	text-decoration: none;
}

#showcase section {
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
	position: relative;
}

#showcase section div {
	background: #000;
	top: 100px;
	position: absolute;
	width: 230px;
	height: 150px;
	padding: 10px;
	opacity: 0.9;
}

#showcase section p {
	display: none;
}

h1 {
	margin-top: 4px;
}

#flickr_badge_uber_wrapper {text-align:center; width:325px;}
#flickr_badge_wrapper {padding:10px 0 10px 0;}
.flickr_badge_image {margin:0 10px 10px 10px; display: inline;}
.flickr_badge_image img {border: 1px solid black !important;}
#flickr_badge_source {text-align:left; margin:0 10px 0 10px;}
#flickr_badge_icon {float:left; margin-right:5px;}
#flickr_www {display:block; padding:0 10px 0 10px !important; font: 11px Arial, Helvetica, Sans serif !important; color:#3993ff !important;}
#flickr_badge_uber_wrapper a:hover,
#flickr_badge_uber_wrapper a:link,
#flickr_badge_uber_wrapper a:active,
#flickr_badge_uber_wrapper a:visited {text-decoration:none !important; background:inherit !important;}
#flickr_badge_wrapper {}
#flickr_badge_source {padding:0 !important; font: 11px Arial, Helvetica, Sans serif !important; color:#666666 !important;}

#foursquaresection {
	color: #000;
	font-size: 80%;
}

#foursquaresection a:Hover {
	color: #999;
}

#latestblog h2 {
	font-size: 120%;
	margin: 0;
	padding: 0;
}
#latestblog time {
	font-style: italic;
}

#main-content {
	width: 700px;
	float: left;
}

aside#sidebar-blog {
	float: right;
	background: url('images/layout/seperator-v.png') left repeat-y;
	width: 220px;
}

aside#sidebar-pages {
	width: 180px;
	margin-right: 20px;
	position: absolute;
	left: 0;
	top: 0;
}

aside#sidebar-pages ul {
	margin: 0;
	padding: 0;
}

aside#sidebar-pages ul h2 {
	margin: 0;
	padding: 0;
}

aside#sidebar-pages ul h2 a {
	color: #FFF;
	text-decoration: none;
}

nav.prev-next ul {
	list-style-type: none;
}

nav.prev-next ul li:first-of-type {
	float: left;
}

nav.prev-next ul li:last-of-type {
	float: right;
}

.tags {
	display: block;
	height: 26px;
	width: 68px;
	background: url('images/layout/tag.gif') no-repeat;
	float: left;
	padding-left: 12px;
	padding-top: 6px;
}
.tagp {
	clear: both;
}

aside ul {
	list-style-type: none;
}

.attachment-thumbnail {
	float: left;
	border: 1px solid #fff;
	margin: 10px 10px 10px 0px;
}

.withsidebar {
	background: url('images/layout/seperator-v.png') left repeat-y;
	margin-left: 190px;
	padding-left: 15px;
}

.alignleft {
	float: left;
	margin: 10px;
}

#qrroulette {
	width: 496px;
	height: 35px;
	display: block;
	text-indent: -10000px;
	background: url('images/qr-title.gif');
}

#roulettewheel {
	background: url('images/main-bg.png') no-repeat center;
	width: 915px;
	height: 915px;
	position: relative;
}

#rotatewheel {
	background: url('images/will-roulette.png');
	width: 915px;
	height: 915px;
	position: absolute;
	top: 0;
	left: 0;
}

#roulettecontent {
	position: absolute;
	top: 270px;
	left: 195px;
	width: 530px;
	height: 362px;
}

#abovecontent {
	position: absolute;
	width: 530px;
	text-align: center;
	top: 120px;
	left: 195px;

}

div.songkick-events li {
	background: url('images/layout/seperator-h-acc.png') bottom repeat-x;
}