/*
Theme Name: 960bc
Theme URI: http://www.guardianwebdesign.com.au/960bc
Description: A blank canvas WordPress theme for developers based on the 960 CSS framework.
Version: 1.5
Author: Troy Dean
Author URI: http://www.guardianwebdesign.com.au/
Tags: fixed-width, one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar

	960bc v1.5
	http://www.guardianwebdesign.com.au/960bc

	This theme was designed and built by Troy Dean
	as a starting point for WordPress developers who
	like the 960 grid system.
	http://www.960.gs
	The theme includes no images and minimal styling,
	providing a blank canvas for the designer to unleash
	her css magic.

	The CSS, XHTML and design is released under GPL:
	http://www.opensource.org/licenses/gpl-license.php

*/

/* for ease of updating into the future we use separate style sheets for colours and typography */

@import url(colours.css);
@import url(typography.css);

/* Begin Structure */

body {
		width: 100%;
		margin: 0;
		padding: 0;
		position: relative;
		}

#page {
		position: relative;
		margin: 0;
		padding: 0;
		width: 100%;
		}
		
#wrapper {
		position: relative;
		}	


#header {
		padding: 0;
		width: 100%;
		float: left;
		height: 50px;
		}
		
#headerimg {
		position: relative;
		left: 0px;
		}
		
/* This hides the 'skip to' links and maintains accessibility */
		
#skip {
		position: absolute;
		top: -500px;
		width: 1px;
		height: 1px;
		overflow: hidden;
		}
		
#heroes {
		margin-top: -140px;
		}

#sidebar {
		text-align: left;
		padding-top: 0px;
		padding-bottom: 25px;
		margin: -109px 0 0 0;
		}
		
img#sidehero {
		margin: 0 0 20px 0;
		border: 1px solid #000;
		}

#footer {
		clear: both;
		margin: 20px 0 0 0;
		padding: 0;
		}
		
ul#social {
		float: left;
		width: 200px;
		margin-top: 20px;
		}
		
.entry ul#social {
		float: none!important;
		width: auto!important;
		}
		
ul#social li a {
		display: block;
		float: left;
		padding: 24px 0 0 0;
		width: 24px;
	    overflow: hidden;    
	    height: 0px !important;
	    height /**/:24px;
	    margin: 0 10px 0 0;
		}
		
.entry ul#social li a {
		display: block;
		float: none!important;
		padding: 6px 0 0 36px!important; 
		height: 18px!important;
		width: auto!important; 
	    margin: 0 10px 0 0;
	    font-size: 1.5em;
		}
		
ul#social li#facebook a, li#facebook a {
		background: url('images/facebook.png') no-repeat top left;
		}
		
ul#social li#facebook a:hover, li#facebook a:hover {
		background: url('images/facebook.png') no-repeat bottom left;
		}
		
ul#social li#myspace a, li#myspace a {
		background: url('images/myspace.png') no-repeat top left;
		}
		
ul#social li#myspace a:hover, li#myspace a:hover {
		background: url('images/myspace.png') no-repeat bottom left;
		}
		
ul#social li#twitter a, li#twitter a {
		background: url('images/twitter.png') no-repeat top left;
		}
		
ul#social li#twitter a:hover, li#twitter a:hover {
		background: url('images/twitter.png') no-repeat bottom left;
		}
		
ul#social li#lastfm a, li#lastfm a {
		background: url('images/lastfm.png') no-repeat top left;
		}
		
ul#social li#lastfm a:hover, li#lastfm a:hover {
		background: url('images/lastfm.png') no-repeat bottom left;
		}
		
ul#social li#jango a, li#jango a {
		background: url('images/jango.png') no-repeat top left;
		}
		
ul#social li#jango a:hover, li#jango a:hover {
		background: url('images/jango.png') no-repeat bottom left;
		}
		
#blogLink {
		position: absolute;
		top: 710px;
		left: 860px;
		}
		
#blogLink a {
		color:#d2eaca;
		font-size:15px;
		line-height:33px;
		text-align:center;
		text-decoration:none;
		}
		
#blogLink a:hover { color:#fff; }

#flowtabs {
	
	/* dimensions */
	position: relative;
	top: 0px!important;
	left: 0!important;
	margin-right: 20px;
	float: right;
	width: 600px;
}

/* single tab */
#flowtabs li { 
	float:left; 
	margin:0; 
	padding:0; 
	text-indent:0; 
	list-style-type:none!important;
}

/* a- tag inside single tab */
#flowtabs li a {
	display:block;
	height: 39px;   
	width: 100px; 	
	padding: 20px 0 0;
	margin:0px;
	
	/* font decoration */
	color:#d2eaca;
	font-size:15px;
	line-height:33px;
	text-align:center;
	text-decoration:none;
}

#flowtabs li a:hover {
	color: #fff
}	

.post {
		margin: 0 0 40px;
		}

.postmetadata {
		margin: 30px 0;
		}

.smallattachment {
		float: left;
		width: 128px;
		margin: 5px 5px 5px 0px;
		}

.attachment {
		margin: 5px 0px;
		}

.postmetadata {
		clear: both;
		}
		
.entry {
		border-bottom: 1px dotted #fff;
		clear: both;
		}
		
.contact {
		border-bottom: none!important;
		}

/* End Structure */

/* Begin Images */
img.border {
		padding: 3px;
		border: 1px solid #096d8d;
		}

p img {
		padding: 0;
		max-width: 100%;
		border: 1px solid #096d8d;
		}

img.centered {
		display: block;
		margin-left: auto;
		margin-right: auto;
		}

img.alignright {
		padding: 4px;
		margin: 0 0 2px 7px;
		display: inline;
		}

img.alignleft {
		padding: 4px;
		margin: 0 7px 2px 0;
		display: inline;
		}

.alignright {
		float: right;
		}

.alignleft {
		float: left
		}
/* End Images */

/* Begin Lists

	Special stylized non-IE bullets
	Do not work in Internet Explorer, which merely default to normal bullets. */

html>body .entry ul {
		margin-left: 0px;
		list-style: none;
		z-index: 9999;
		}

html>body .entry li {
		margin: 7px 0 8px 0px;
		font-size: 1.3em;
		}

.entry ol {
		padding: 0 0 0 35px;
		margin: 0;
		}

.entry ol li {
		margin: 0;
		padding: 0;
		}

.postmetadata ul, .postmetadata li {
		display: inline;
		list-style-type: none;
		list-style-image: none;
		}

/* End Entry Lists */

/* Begin Form Elements */
#searchform {
		margin: 10px auto;
		padding: 5px 3px;
		text-align: left;
		}

#sidebar #searchform #s {
		width: 108px;
		padding: 2px;
		}

#sidebar #searchsubmit {
		padding: 1px;
		}

.entry form { /* This is mainly for password protected posts, makes them look better. */
		text-align:center;
		}

select {
		width: 130px;
		}
		
#respond {
		padding: 0;
		}
		
#respond p {
		margin-bottom: 10px;
		}

#commentform input {
		width: 170px;
		padding: 5px;
		margin: 2px 5px 1px 0;
		}

#commentform {
		margin: 5px 10px 0 0;
		}

#commentform textarea {
		width: 90%;
		padding: 5px;
		}

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

#commentform #submit {
		display: block;		
		margin: 0 0 0 0px;
		text-align: center;
		}
		
#join {
		font-size: 1.5em!important;
		}

		
#join label {
		display: block;
		width: 100px;
		float: left;
		margin: 5px 0;
		text-align: left;
		}
		
#join input, #join input:focus {
		display: block;
		clear: left;
		width: 300px;
		padding: 5px;
		margin: 1px 0;
		font-size: 1.3em!important;
		background: #fff;
		border: 1px solid #086e8d;
		}
		
#join input:hover {
		background: #086e8d;
		border: 1px solid #fff;
		color: #fff;
		}
		
#join input[type="submit"] {
		display: block;
		clear: left;
		width: auto;
		padding: 5px;
		margin: 10px 0;
		font-size: 1.2em!important;
		border: 1px solid #000;
		background: #72d1b5;
		color: #fff;
		}
		
#join input:hover[type="submit"] {
		background: #086e8d;
		color: #fff;
		}

/* End Form Elements */

/* Begin Comments*/

#commentcount {
		float: left;
		text-align: left;
		padding: 3px 5px;
		background: #72d1b5;
		margin: -5px 0 10px 0;
		}
		
#commentcount p {
		margin: 0!important;
		}
		
#commentcount a {
		color: #000;
		}
		
#commentcount a:hover {
		color: #fff;
		}

.alt {
		margin: 0;
		padding: 10px;
		}

.commentlist {
		padding: 0;
		text-align: justify;
		}

.commentlist li {
		margin: 15px 0 10px;
		padding: 5px 5px 10px 10px;
		list-style: none;
		}

.commentlist li .avatar { 
		float: right;
		padding: 2px;
		}

.commentlist li ul li { 
		margin-right: -5px;
		margin-left: 10px;
		}

.commentlist p {
		margin: 10px 5px 10px 0;
		}

.children {
		padding: 0;
		}

#commentform p {
		margin: 5px 0;
		}

.nocomments {
		text-align: center;
		margin: 0;
		padding: 0;
		}

.commentmetadata {
		margin: 0;
		display: block;
		}

/* End Comments */


/* Begin Various Tags & Classes */
acronym, abbr, span.caps {
		cursor: help;
		}

blockquote {
		margin: 15px 30px 0 10px;
		padding-left: 20px;
		}

blockquote cite {
		margin: 5px 0 0;
		display: block;
		}

.center {
		text-align: center;
		}

.hidden {
		display: none;
		}

hr {
		display: none;
		}

.navigationTop {
		display: block;
		text-align: center;
		margin-top: 10px;
		margin-bottom: 30px;
		}

.navigationBottom {
		display: block;
		text-align: center;
		margin-top: 10px;
		margin-bottom: 10px;
		}

/* End Various Tags & Classes*/

/* root element for accordion. decorated with rounded borders and gradient background image */
#accordion {
	width: 690px;	
}

#accordion p {
	margin: 0 0 3px 0;	
}

/* accordion header */
#accordion h3 {
	display: inline;
	clear:both;
	float: left;
	margin:6px 0 0 0;
	padding:5px 25px 5px 5px;
	font-size:14px;
	font-weight:normal;
	cursor:pointer;
	color: #fff;
	background: #096d8d url('images/open.jpg') no-repeat center right;		
}

#accordion h3:hover {
	display: inline;
	clear:both;
	float: left;
	margin:6px 0 0 0;
	padding:5px 25px 5px 5px;
	font-size:14px;
	font-weight:normal;
	cursor:pointer;
	color: #096d8d;
	background: #fff url('images/open-hover.jpg') no-repeat center right;		
}

/* currently active header */
#accordion h3.current {
	cursor:default;
	padding:5px;
	background: #000;	
	border-bottom: 1px solid #fff;
}

#accordion h3.current:hover {
	color: #fff;
}

/* accordion pane */
#accordion div.pane {
	display:none;
	padding:15px;
	color:#000;
	font-size:13px;
	clear: both;
	margin: 0;
	background: #72d1b5 url('images/tr.jpg') no-repeat top right;
}

#accordion div.pane p {
	font-size: 1.1em;
	margin: 0 0 6px 0;
}

/* a title inside pane */
#accordion div.pane a {
	font-size: 1.1em;
	color:#086D8D;
	background: none!important;
}

#player {
	margin: 0 0 10px 0;
}

#about {
	float: left;
	width: 380px;
}

/* the overlayed element */ 
.overlay { 
     
    /* must be initially hidden */ 
    display:none; 
     
    /* place overlay on top of other elements */ 
    z-index:10000; 
     
    /* styling */ 
    background-color:#333; 
     
    width:675px;     
    min-height:200px; 
    border:1px solid #666; 
     
    /* CSS3 styling for latest browsers */ 
    -moz-box-shadow:0 0 90px 5px #000; 
    -webkit-box-shadow: 0 0 90px #000;     
} 
 
/* close button positioned on upper right corner */ 
.overlay .close { 
    background-image:url(../img/overlay/close.png); 
    position:absolute; 
    right:-15px; 
    top:-15px; 
    cursor:pointer; 
    height:35px; 
    width:35px; 
}

/* use a semi-transparent image for the overlay */ 
#overlay { 
    background-image:url(http://static.flowplayer.org/img/overlay/transparent.png); 
    color:#efefef; 
    height:450px; 
} 
 
/* container for external content. uses vertical scrollbar, if needed */ 
div.contentWrap { 
    height:441px; 
    overflow-y:auto;
     
}