/*
	Squid Grid System ~ Bradley Taunt
	Modified 960 Grid System
*/

/* `Generic Elements
----------------------------------------------------------------------------------------------------*/
html 																				{ background: none; } 

body																				{ background: #fff; font-family: Arial, Helvetica, sans-serif; }

h1 																					{ margin: 0; font-size: 18px; color: #000; }

h1.title																			{ text-transform: uppercase; font-size: 22px; width: 100%; height: 30px; background: #0E5082; color: #fff; padding-left: 10px; padding-bottom: 2px; }

h1.footer																			{ margin-top: 10px; margin-bottom: 10px; }

p 																					{ font-size: 12px; padding: 0 0 10px 0; margin: 0; color: #000; }

a 																					{ text-decoration: none; color: #007dd9; }

a:hover 																			{ color: #7cb2d9; }

hr 																					{ padding: 0; margin: 10px 0 10px 0px; width: 940px; }

a#example2																			{ margin-right: 30px; }

.facebook																			{ border:none; overflow:hidden; width:200px; height:35px; position: absolute; top: 0px; left: 550px; z-index: 9999; }

.explict																			{ color: red; position: absolute; }

.explict1																			{ color: red; position: absolute; z-index: 9999; top: 94px; left: 120px; z-index: 9999; }

.explict2																			{ color: red; position: absolute; z-index: 9999; top: 125px; left: 120px; z-index: 9999; }

.explict6																			{ color: red; position: absolute; z-index: 9999; top: 245px; left: 170px; z-index: 9999; }

.explict7																			{ color: red; position: absolute; z-index: 9999; top: 275px; left: 170px; z-index: 9999; }

.explict9																			{ color: red; position: absolute; z-index: 9999; top: 335px; left: 170px; z-index: 9999; }


/* `Containers
----------------------------------------------------------------------------------------------------*/

#container																			{ margin-left: auto; margin-right: auto; width: 960px; background:none; }

#main-holder																		{ width: 100%; min-height: 398px; background: #000 url(../images/top-grunge.jpg) repeat-x top center; margin-top: 10px; }

#bottom-holder																		{ width: 100%; min-height: 400px; background: #000 url(../images/white-spades.jpg) repeat-x bottom center; padding-bottom: 10px; }


/* `Content >> Global
----------------------------------------------------------------------------------------------------*/
.top-info3,
.top-info2,
.top-info,
.full-content,
.footer,
#slider,
div.jp-audio,
.cd-cover,
.bio-text,
.profile-picture,
.logo
{
	display: inline;
	float: left;
	position: relative;
	margin-left: 10px;
	margin-right: 10px;
}

/* `Grid >> Sections
----------------------------------------------------------------------------------------------------*/

.logo 																				{ width: 560px; height: 118px; background: url(../images/spades.png) no-repeat top center; margin-top: 20px; }

.profile-picture																	{ width: 420px; }
	.profile-picture img															{ padding: 125px 0 0 0; }

.bio-text																			{ width: 500px; }
	.bio-text h1																	{ color: #fff; font-size: 32px; text-transform: uppercase; }
	.bio-text p																		{ color: #fff; padding: 10px; }
	.bio-text img.right																{ float: left; padding: 10px 0 0 0; }
	.bio-text p.download															{ float: left; padding: 30px 10px 0 0; font-size: 18px; }
	
.cd-cover																			{ width: 530px; margin-top: -60px; }
	.cd-cover p																		{ font-size: 22px; color: #fff; margin-top: 17px; }
	.cd-cover ul 																	{ list-style: none; margin-top: 10px; background: url(../images/nav-bg2.png) repeat-x top center; width: 475px; height: 50px; padding-left: 0px; float: left; }
	.cd-cover ul li																	{ display: inline; float: left; margin: 13px 0 0 0; padding: 0; }
	.cd-cover ul li a																{ padding: 14px 30px; font-size: 14px; border-right: 1px solid #888888; border-left: 1px solid #fff; color: #6a6a6a; }
	.cd-cover ul li a:hover, .cd-cover ul li a.selected								{ background: url(../images/nav-hover.png) repeat-x; color: #000; }
	
	.cd-cover img.right																{ float: left; padding: 0 0 0 0; margin-top: -15px; }
	.cd-cover p.download															{ float: left; padding: 0px 30px 0 0; font-size: 30px; margin-top: -5px; }
	
.footer																				{ width: 940px; text-align: right; margin-top: 10px; }
	.footer p																		{ color: #fff; }
	
.full-content																		{ width: 940px; }

.top-info																			{ width: 380px; min-height: 10px; }
	.top-info a#example2															{ float: left; display: inline; margin-right: 20px; margin-bottom: 0px; margin-top: 20px; }
	
.top-info2																			{ width: 380px; min-height: 10px; background: url(../images/transparent.png) repeat; }
	.top-info2 a#example2															{ float: left; display: inline; margin-right: 20px; margin-bottom: 0px; margin-top: 20px; }
	
	.top-info2 form																	{ margin-top: 10px; margin-left: 15px; }
	.top-info2 form p																{ color: #fff; }
	.top-info2 h1																	{ margin-left: 15px; }
	
.top-info3																			{ width: 380px; min-height: 400px; background: #fff; margin-top: 10px; }

/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clearfix:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

/*
	The following zoom:1 rule is specifically for IE6 + IE7.
	Move to separate stylesheet if invalid CSS is a problem.
*/

        #image{border:4px #666 solid;height:480px;width:640px;}
        .thumb{float:left;margin-right:10px;margin-top:10px;}