/*
Theme Name: Crooked Still
Theme URI: http://crookedstill.com
Description: Developed for Crooked Still.
Version: 1.0
Author: Will Harrell
Color Palette:

*/

@import url('zeroout.css');

body{ background:url(img/bg.jpg);}

div#page{ 
	width:900px;
	margin:0 auto;
	position:relative;}

/**HEADER**/
div#header{ height:140px;}

/**BRAND**/
div#brand{ 
	width:200px; height:135px;
	background:url(img/logo.png);
	position:absolute;
	left:350px; top:10px;}
div#brand h1, div#brand h2{ text-indent:-9999px;}

/**NAVIGATION**/
div#navigation{ 
	width:900; height:38px;
	position:relative;
	top:72px;}
ul.nav{	
	height:38px; 	width:330px; 
	list-style:none;
	position:absolute;}
ul.nav li{ float:left;}
ul#nav_left{ 
	left:12px; top:0;
	background:url(img/bg_menu_left.png) no-repeat bottom;}
ul#nav_right{ 
	left:555px; top:0;
	background:url(img/bg_menu_right.png) no-repeat bottom;}
ul.nav li a{
	display:block;
	height:18px;
	text-indent:-9999px;}
ul#nav_left li a{ background:url('img/buttons/left.png');}
ul#nav_right li a{ background:url('img/buttons/right.png');}
ul.nav li{ margin-left:8px;}
ul#nav_left li:first-child a{ margin-left:15px;}
ul#nav_right li:first-child a{ margin-left:0;}

/**INDIVIDUAL LI - LEFT**/
ul#nav_left li.home a{ background-position:0 0;	width:50px;}
ul#nav_left li.page-item-5 a{ background-position:-65px 0; width:58px;}
ul#nav_left li.home a:hover{ background-position:0 18px;}	
ul#nav_left li.page-item-6 a{ background-position:-135px 0;	width:35px;}
ul#nav_left li.page-item-7 a{ background-position:-185px 0;	width:52px;}
ul#nav_left li.page-item-8 a{	background-position:-248px 0;	width:57px;}
ul#nav_left li.page-item-9 a{	background-position:250px 0; width:50px;}	

/**INDIVIDUAL LI - RIGHT**/	
ul#nav_right li.page-item-9 a{ background-position:0 0;	width:58px;}
ul#nav_right li.page-item-10 a{	background-position:-72px 0;	width:72px;}
ul#nav_right li.page-item-19 a{	background-position:-157px 0;	width:62px;}
ul#nav_right li.page-item-11 a{	background-position:-231px 0;	width:86px;}

/**HOVER**/
ul#nav_left li.home a:hover{ background-position:0 18px; width:50px;}
ul#nav_left li.page-item-5 a:hover{ background-position:-65px 18px; width:58px;}
ul#nav_left li.page-item-6 a:hover{ background-position:-135px 18px;	width:35px;}
ul#nav_left li.page-item-7 a:hover{ background-position:-185px 18px;	width:52px;}
ul#nav_left li.page-item-8 a:hover{	background-position:-248px 18px;	width:57px;}
ul#nav_left li.page-item-9 a:hover{	background-position:250px 18px; width:50px;}	
ul#nav_right li.page-item-9 a:hover{ background-position:0 18px;	width:58px;}
ul#nav_right li.page-item-10 a:hover{	background-position:-72px 18px;	width:72px;}
ul#nav_right li.page-item-19 a:hover{	background-position:-157px 18px;	width:62px;}
ul#nav_right li.page-item-11 a:hover{	background-position:-231px 18px;	width:86px;}

/**SOCIAL NETWORK**/
ul#social_network{ 
	position:absolute;
	left:710px; top:10px;
	width:179px; height:28px;
	list-style:none;}
ul#social_network li{ float:left;}
ul#social_network li a{	
	display:block;
	text-indent:-9999px;
	width:25px; height:25px;}
ul#social_network li#links a{ 
	width:79px;
	background:url(img/social_links.png);}
li#fb a{ background:url(img/social_fb.png);}
li#ms a{ background:url(img/social_ms.png);}
li#twit a{ background:url(img/social_twit.png);}
li#yt a{ background:url(img/social_yt.png);}

/**MAILING LIST**/
form#mailing_list{
	height: 33px; width: 230px;
	left: 620px; top: 38px;
	position: absolute;}
form#mailing_list input{ display:block;}
form#mailing_list input#mail{ 
	font-size:12px;
	height:17px;
	position:relative;
	top:0;}	
form#mailing_list input#submit{ 
	position:relative;
	left:175px; top:-25px;
	background:url(img/sign_up.png);}

/**CONTENT**/
div#content{ 
	width:900px; height:590px;
	position:relative;
	
	/*ff test*/
	top:20px;}
	
/**NEW ALBUM**/	
div#new_album{ 
	width:599px; height:286px;
	background:url(img/bg_new_album.png);
	position:relative;}
div#new_album h3{ 
	color:#ede5cf;
	font: 18px Georgia, serif;	
	position:relative;
	left:50px; top:220px;
	letter-spacing:2px;
	
	/*ff test*/
	margin:0;}	
div#new_album > h3 span{ 
	font: normal normal bold 18px Georgia, serif;
	color:#a55732;}
div#new_album > p{
	color:#ede5cf;
	font: 14px Georgia, serif;
	position:relative;
	left:50px; top:208px;}
div#new_album a{ 
	color:#ede5cf;
	font: 14px Georgia, serif;}		

/***NEWS AND UPDATES*/
div#news_updates{ 
	width:600px; height:285px;
	background:url(img/bg_news_updates.png);
	position:relative;
	top:7px;}	
div#news_updates h3{ 
	text-indent:-9999px;
	width:540px; height:16px;
	background:url(img/news_updates.png) no-repeat;
	top:20px; left:30px;
	position:relative;
	border-bottom:2px dotted #68584b;
	padding-bottom:5px;
	margin-top:0;}	
div#news_updates a#all{ 
	font-size:12px;
	color:#887c67;
	position:absolute;
	top:19px; left:530px;}
div#news_updates *{ color:#ede5cf;}		
div#news_updates h4{ 
	margin:0 auto 0 auto;
	font: normal normal bold 14px Georgia, serif;}
div#news_updates p{ font: 11px Verdana, sans-serif;}
div#news_updates p.date{ 
	margin-top:5px;
	font-style: italic;}
div#news{ 
	height: 205px; width: 534px;
	left: 30px; top: 10px;
	overflow: auto;
	position: relative;}

/**SIDEBAR**/
div#sidebar{ 
	width:300px;
	position:absolute;
	left:600px; top:0px;}

/**UPCOMING EVENTS**/
div#upcoming_events{ 
	height:292px; width:292px;
	background:url(img/bg_upcoming_events.png);}
div#upcoming_events *{ margin:0;}
div#upcoming_events > a{
	color:#887c67;
	font: 12px Georgia, serif;
	margin-left:40px;
	border:0;}
div#upcoming_events div.event > a{ 
	font: 11px Georgia, serif;
	text-decoration:underline;
	color:#887c67;
	display:block;
	position:relative;
	left:148px; top:-10px;}	
div#upcoming_events .event{ 
	height: 50px;
	margin: 15px auto 13px 30px;
	width: 255px;}
div#upcoming_events h3{ 
	text-indent:-9999px;
	background:url(img/upcoming_shows.png);
	width:212px; height:22px;
	position:relative;
	left:40px; top:10px;
	margin-bottom:34px;}
div#upcoming_events p.date{ 
	font: normal normal bold 11px Georgia, serif;
	color:#ede5cf;
	margin-bottom:1px;}	
div#upcoming_events h4{ 
	font: 11px Verdana, sans-serif;
	color:#ede5cf;
	margin-bottom:1px;
	
	display:inline;}
div#upcoming_events h4 + p{
	font: 11px Verdana, sans-serif;
	color:#ede5cf;
	display:inline;}	
		
div#upcoming_events p.location{ 
	font: 11px Verdana, sans-serif;
	color:#ede5cf;
	display:block;}
div#upcoming_events div.event p a{ font: 11px Verdana, sans-serif; color:#a55732;}
	
/**TWEETS**/	
div#tweets{ 
	width:292px; height:292px;
	background:url(img/bg_tweet.png);
	position:relative;
	top:0px;}
div#tweets p#album{ 
	background: url(img/album_cover.png) no-repeat;
	font: 12px Georgia, serif;
	height: 70px; width: 250px;
	left: 25px; top: 10px;
	margin-bottom: 10px;
	padding-left: 72px;
	padding-top: 20px;
	position: relative;
	margin-left:0;
	margin-top:0;}
div#tweets p#album a{ color:black;}		
div#tweets span{ 
	font: normal normal bold 12px Georgia, serif;}
div#tweets p#tweet{ 
	font: 12px Verdana, sans-serif;
	width:250px;
	margin-left:27px;
	margin-top:0px;
	letter-spacing:1px;}	
div#tweets p a{ 
	color:#615854;
	font: 11px Verdana, sans-serif;}
div#tweets p a#follow{ display:block;}
div#tweets h3{ 
	background: url(img/twitter.png) no-repeat;
	font: 18px Georgia, serif;
	height: 34px; width: 250px;
	left: 25px; 
	margin-bottom: 2px;
	padding-left: 50px;
	padding-top:5px;
	position: relative;
	margin-left:0;}
div#tweets > a{ 
	position:absolute;
	left:100px; bottom:30px;
	color:#904927;
	font: 12px Georgia,	serif;}
	
/**PAGE.PHP**/	
div#content_sub, div#content_single{ 
	width:602px; height:589px;
	background:url(img/bg_content_sub.png) no-repeat;
	position:relative;}
div#posts_all{ 
	width:595px; height:485px;
	top:15px;
	position:relative;
	overflow:auto;}
	
/**EACH OF THE PAGE TITLES**/	
div#content_sub h3#title{ text-indent:-9999px; position:relative; left:25px; top:20px; 
	/*ff test*/
	margin:0;
	margin-bottom:25px;}
div#content_sub.id5 h3#title{ background:url(img/news.png) no-repeat; width:67px; height:38px;}
div#content_sub.id6 h3#title{ background:url(img/biography.png) no-repeat; width:136px; height:38px;}
div#content_sub.id7 h3#title{ background:url(img/tour.png) no-repeat; width:150px; height:38px;}
div#content_sub.id8 h3#title{ background:url(img/music.png) no-repeat; width:78px; height:38px;}
div#content_sub.id9 h3#title{ background:url(img/videos.png) no-repeat; width:70px; height:38px;}
div#content_sub.id10 h3#title{ background:url(img/photos.png) no-repeat; width:92px; height:38px;}
div#content_sub.id19 h3#title{ background:url(img/press.png) no-repeat; width:80px; height:38px;}
div#content_sub.id11 h3#title{ background:url(img/contact.png) no-repeat; width:150px; height:38px;}
div#content_sub.id41 h3#title{ background:url(img/links.png) no-repeat; width:68px; height:38px;}


/**SUB CONTENT**/		
div#content_sub *, div#content_single *{ color:#ede5cf;}		
div#content_sub h4{ font: normal normal bold 14px Georgia, serif; margin:0;}
div#content_sub h4.band{ font-weight:normal; }
div#content_sub div#band{ width:539px; height:230px; background:url(img/bg_bio.png) no-repeat;}
div#content_sub div#band ul{ list-style:none; position:relative; left:385px; top:36px; width:160px;}
div#band ul li { margin-bottom:4px;}
div#content_sub p.date{ font: italic normal normal 12px Georgia, serif; margin:0;}
div#content_sub p, div#content_single p{ font: 11px Verdana, sans-serif;}
div#content_sub > a#youtube{ 
	position:absolute; right:20px; top:0;
	padding-top:30px;
	font: 11px Verdana, sans-serif; color:#ede5cf;
	height:41px; width:200px; display:block; background:url(img/youtube.png) no-repeat right;}
div#content_sub.id7 p.date{ color:#887c67;	font: italic normal normal 14px Georgia, serif;}
div#content_sub.id7 p{ font: 12px Georgia, serif; margin:1px auto 1px auto;}
div#content_sub.id7 a{ font:12px Georgia, serif;}	
div#content_sub.id11 p,
div#content_sub.id41 p{ margin:1px auto 1px auto;}	
	
div.post{ 
	width:550px;
	position:relative;
	left:20px; top:5px;
	border-bottom:2px dotted #68584b;
	margin-bottom:10px;
	padding-bottom:10px;}
div.post ul{ list-style:none;}
div.post li span > span{ float:left;}
div.post li{ 
	margin-bottom:10px;
	font: 12px Georgia, serif;}
div.post li.no_media{ text-indent:23px;}
div.post span span{ display:block; width:18px; height:19px; background:url('img/bg_play.png');}
div.post embed,
div.post object{ margin:3px auto auto 4px;}

div#content_sub a, div#content_single a{ font-size:11px; color:#a55732;}	
div#band a{ font: normal normal bold 11px Georgia, serif;color:#ede5cf;}
div#content_sub a span{ font: italic normal normal 11px Georgia, serif; color:#695F51;}
div#content_single h3{ font: 25px Georgia, serif; margin:18px auto auto 18px; padding-top:30px;}

/**MUSIC**/
div#content_sub.id8 div.post{ min-height:200px;}
div#content_sub.id8 div.post h3{ display:inline; font: normal normal bold 18px Georgia, serif; margin-left:190px;}
div#content_sub.id8 div.post ul.songs{ margin-top:10px; margin-left:190px;}
div#content_sub.id8 div.post img{ /*float:left;*/ margin-right:10px;}
div#content_sub.id8 div.post h3 + a{ font: italic normal normal 12px Georgia, serif; color:#a69988;}
div.order{ position:absolute; top:40px; left:420px;}
div#content_sub div.order h4{ font: normal normal bold 12px Georgia, serif; color:#a55732;}
div#content_sub div.order li{ margin-top:1px; margin-bottom:1px;}
div#content_sub div.order li a{ font: 12px Verdana, sans-serif; color:#a69983; }
div#content_sub div.post div.order ul{ margin-top:1px;}	

div#content_sub div.post#some_strange_country{ background:url('img/album_some_strange_country.png') no-repeat;}
div#content_sub div.post#still_crooked{ background:url('img/album_still_crooked.png') no-repeat;}	
div#content_sub div.post#shaken_by_a_low_sound{ background:url('img/album_shaken_by_a_low_sound.png') no-repeat;}	
div#content_sub div.post#hop_high{ background:url('img/album_hop_high.png') no-repeat;}	
div#content_sub div.post#crooked_still_live{ background:url('img/album_live.png') no-repeat;}

/**FOOTER**/
p#footer{ 
	margin:10px auto auto 634px;
	width:260px;
	font-size:11px;}
	
	
/**POPUP**/
body#popup{ background:#312C2A;}
body#popup *{ color:#ede5cf;}
body#popup div{ width:550px;}
body#popup div p{ font: 11px Verdana, serif;}
body#popup h3{ border-bottom:2px dotted #68584b; padding-bottom:7px; font-family:Georgia, serif;}	

/**GALLERY**/
div#content_sub div.ngg-gallery-thumbnail span a,
div#content_sub div.ngg-gallery-thumbnail span{ font:10px Verdana, serif;}
div.ngg-gallery-thumbnail-box{ margin-bottom:10px;}	

/**GET RID OF BLUE OUTLINE**/	
div.jScrollPaneContainer:focus, 
a:focus	{  outline-width:0;}