/*

Hot Pink Rollover:   #e1255b
Links & Social Text: #459ad0   old: 83bbdc
Gray Bar & Hr's:    #696969 


#7a7a7a - bio snippet
33ccff - electric blue (maybe use for links?)
Nav colour: #4c89ad
Main Blog background: #000000;


background-image: url('http://www.thejohnsmith.ca/spirits/wp-content/themes/Spirits/images/dark_wood.jpg');
		background-image: url(http://www.thejohnsmith.ca/spirits/wp-content/themes/Spirits/images/bg.jpg);
*/


body {
	background-color: #ffffff; 
	background-image: url('images/background_image.jpg');
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: top center;
	margin: 0px;
    padding: 0px;    
	}
	

/* -------------------
MAIN STRUCTURE
------------------- */
	
#frame {
		width: 1024px;
		margin: auto;
        padding: 0px;
        text-align: center;
		}
	
#middle {
		background-color: #FFFFFF;
		overflow: auto;
		width: 815px;  
        margin: auto;
       	border: 0 solid #33ccff;
		}


#content {
		float: right;
		width: 550px;  /*550 */
        background: #FFFFFF;
        padding: 5px;
		/*margin-left: -126px;*/
        display: inline;
        border: 0 dashed #000000;
		}
	
#sidebar {
		background-color: #ffffff;
		float: left; 
		width: 225px;
     	padding-right: 15px;
		padding-top: 12px;
        padding-left: 15px;
		padding-bottom: 12px;
        display: inline;
		}
	
							
							
#header {
        width: 815px;
 		margin-left: auto;
        margin-right: auto;
		margin-bottom: -2px;
        text-align: center;
        border: 0 dashed #ff0000;
		/* Use when flash is in place background-image: url('http://www.thejohnsmith.ca/spirits/wp-content/themes/Spirits/images/header.png');*/
        }



		/*SOCIAL BADGES ON RIGHT SIDE
		All Badges are 30px in height, and therefore are sequetionally placed +30px down the side
		*/


		
		#socialwrapper {
				background-color: #FFFFFF;
				overflow: auto;
				width: auto;
				height: 0; 
		        margin: 0 auto 0 815px;
				}
				
				
					#socialwrapper img {
	
						   
								}
				
				
				#socialbadge1 {
						position: absolute;
						margin: 0 auto 0 auto;  /*815px*/
						border: 0px;
					}


				#socialbadge2 {
						position: absolute;
						margin-top: 30px;
						margin-left: 0;
						border: 0px;
						}

				#socialbadge3 {
						position: absolute;
						margin-top: 60px;
						margin-left: 0;		
						border: 0px;
					}

				#socialbadge4 {
						position: absolute;
						margin-top: 90px;
						margin-left: 0;	
						border: 0px;
							}


				#socialbadge5 {
						position: absolute;
						margin-top: 120px;
						margin-left: 0;	
						border: 0px;
								}

				#socialbadge6 {
						position: absolute;
						margin-top: 150px;
						margin-left: 0;	
						border: 0px;		
								}




								#socialbadgeb1 {
										position: absolute;
										margin-top: 0;

										border: 0px;
									}


								#socialbadgeb2 {
										position: absolute;
										margin-top: 30px;
										border: 0px;
										}

								#socialbadgeb3 {
										position: absolute;
										margin-top: 60px;
										border: 0px;
									}

									#socialbadgeb4 {
											position: absolute;
											margin-top: 90px;
											border: 0px;
												}


									#socialbadgeb5 {
											position: absolute;
											margin-top: 120px;	
											border: 0px;
													}

									#socialbadgeb6 {
											position: absolute;
											margin-top: 150px;
											border: 0px;
										}
										
										
/*-------------------
NAVIGATION  (located in Sidebar.php)
--------------------*/
	
	/*List Posts in Category - Used for show previews in sidebar*/
	ul .lcp_catlist {
		
		
	}
	
	div.fg-clear {
		clear: both;
	}
	
	#photostream {
		margin-top: -15px;
		padding-left: 20px;
		border: 0 solid #33ffcc;
	}
	
	#photostream img.photo {
		float: left;
		border: 3px solid #696969;
		margin: 6px;
		height: 75px;
		width: 75px;
	}
	
		#photostream img.photo:hover {
					border: 3px solid #e1255b;
		}
	
	#sidebar h1 {
			font-size: 1.7em;
			font-family: Helvetica, sans-serif;		
			color: #459ad0;
			text-transform: uppercase;
			letter-spacing: 4px;
			font-weight: bold;
	}
	
	
	#sidebar li {
			list-style: none;
	}
	
#sidebar .navlink a {
		font-size: 1.7em;
		font-family: Helvetica, sans-serif;		
		color: #459ad0;
		text-transform: uppercase;
		text-align: justify;
		letter-spacing: 4px;
		font-weight: bold;
		/*padding-bottom: 20px; -- play with this only if using background image for hover*/
		}
	
#sidebar .navlink a:hover {
		color: #e1255b;
		/* Use the following to play with background images on hover
		background-image: url(images/underline.png);
		background-repeat: repeat-x;
		background-position: 100% 100%;
		padding-bottom: 1px;
		white-space: nowrap;
		*/	
	}
	
	
#sidebar .navlink h2 {
	font-size: 1.7em;
	font-family: Helvetica, sans-serif;		
	color: #459ad0;
	text-transform: uppercase;
	letter-spacing: 4px;
	font-weight: bold;
	}
	
	
	#sidebar .viewall a {
		font-size: 0.6em;
		font-family: Helvetica, sans-serif;
		color: #459ad0;
		float: right;
		padding-top: 5px;
		padding-right: 10px;
		text-transform: uppercase;
	}
	
	#sidebar .viewall a:hover {
		color: #e1255b;
	}
	
	
	
	#sidebar .contactwrapper {
		text-align: center;
		margin-right: auto;
		margin-left: auto;
	}
	#sidebar .contact {
		font-size: 1em;
		color: #696969;
		font-family: Helvetica, sans-serif;
		/*text-transform: uppercase;*/
	}
	
	#sidebar .contact a {
		color: #459ad0;
		text-decoration: none;
	}

	#sidebar .contact a:hover {
		color: #459ad0;
		text-decoration: underline;
	}
	
	/*
	#navcontainer .current_page_item a {
		color: #33CCff; 4c89ad;
		background-image: url(http://www.juniorboys.net/images/underline.gif);
		background-repeat: repeat-x;
		background-position: 100% 100%;
		padding-bottom: 3px;
		white-space: nowrap;	
	}
	*/
	
	
	/*#hack {
		background: white;
		height: 2px;
		width: 450px;
		display: inline;
		position: absolute;
		top: 220px;
		left: 50%;
		margin: 0 0 0 -350px;
		padding: 0;
		z-index: 2;
		}*/
		
	
/*-------------------
END OF NAVIGATION
--------------------*/


	
/* -------------------
CONTENT
------------------- */


/*"Add This" Social Button - currently placed after each Blog Post*/
a.addthis_button {
	float: right;
	padding-right: 14px;
	margin-top: -2px;
}

/*Margins around blog posts*/
#content .post {
	margin: 0 15px 55px 20px;
}
	


/*Blog post Titles / Links*/
#content #post h2, a {
	color: #696969;
	letter-spacing: 3px;
	font-family: Helvetica, sans-serif;
	font-size: 0.7em;
	text-decoration: none;
	
}

/*Date in comments posted*/
#comments .alt,  a {
	color: #696969;
	letter-spacing: 0;
	font-family: Helvetica, sans-serif;
	font-size: 0.9em;
	text-decoration: none;
	
}

#content #post h2, a:hover {
	color: #e1255d;
	text-decoration: none;
}

#content h1 {
	color: #696969;
	font: 2em Helvetica, sans-serif;
}
	
	/*Not Found error page*/
#content h2 {
	color: #696969;
	font: 2em Helvetica, sans-serif;
	font-weight: bold;
	margin-top: 7px;
	border-bottom: 3px solid #696969;
	text-transform: uppercase;
	}

	

	
	/* Main Body blog entry text*/
#content p, #content dl {
	color: #696969;
	font: 0.9em Helvetica, sans-serif;
}
	

	
#content li {
	margin: 0 0 0 22px;
	color: #696969;
	font: 0.9em Helvetica, sans-serif;
}
	
#content dl dt {
	font-weight: bold;
}
	
#content dl dd {
	margin: 0 0 0.4em 0.5em;
}
	
#content blockquote p {
	margin: 0 0 0 2em;
	border-left: 3px solid #696969;
	padding: 0 0 0 1em;
	color: #696969;
	font-style: italic;
}
	

	/*Post Data after post*/
#content .post ul.post-data {
	border-top: 3px solid #696969;
	list-style: none;
	font: 0.9em Tahoma, Arial, Helvetica, sans-serif;
	padding: 1em 0 0.2em 0;
	color: #827060;
	margin: 1.3em 0 0 0;
	}

	/*IMAGES POSTED IN BLOGS*/
#content .post .entry img {
	margin: 20px 18px 18px 20px;
    padding: 0;
    display: block;
	margin-left:auto;
	margin-right:auto;

	}
	
	
	#content img {
		border: 0;
	}
	#content .post .entry .aligncenter img{
		margin-left:auto;
		margin-right:auto;
		border: 0;
		
	}
	
#content .post .entry {
		margin: 20px 0 0 0;
        padding: 0;
		margin-left:auto;
		margin-right:auto; 
        display: block;

	}


/*Links in blog posts*/
#content .post .entry a {
	font-size: 0.9em;
		color: #459ad0;
		font-weight: bold;
		letter-spacing: 0;
	}

#content .post .entry a:hover {
		text-decoration: underline;
	}

/* Next / Previous Navigation links*/

#content .nextprevious a {
	text-transform: uppercase;
	font-family: Helvetica, sans-serif;
	text-decoration: none;
	font-size: 1em;
	padding-right: 40px;
	padding-left: 40px;

}


#content .nextprevious a:hover {
		text-decoration: underline;
		color: #e1255b;


}




#content .nextprevious {
	text-align: center;
    margin-bottom: 10px;
}


/*Videos posted in comments*/

#content .post ul.post-data li {
	color: #827060;
	}
	
	
/*link to comments*/
#content .post ul.post-data a {
	font-size: 0.7em;
	text-transform: uppercase;
	text-decoration: none;
	font-weight: bold;
	color: #696969;
	}
	
#content .post ul.post-data a:hover {
	color: #e1255b;
	text-decoration: underline;
	}

#content .post ul.post-data li.comments {
	float: right;
	margin: 0 0.7em 0 0;
	display: inline; /* fixes double float bug in IE */
	}
	
#content .post ul.post-data li.comments a {
	padding: 0 0 0 15px;
	}
	
	/*"PUBLISHED BY" INDENTING*/
#content .post ul.post-data li.posted {
	font-size: 0.9em;
	margin: 0 0 0 0;
	color: #696969;
	/*968c83*/
	}
	
		/*RSS ICON positioning*/
#content .post ul.post-data li.posted a img {
	margin: 0 5px -2px 0px;
	}
	
#content .post ul.post-data li.posted a {
	padding: 0 0 0 8px;

	}
	
#content .post ul.post-data li.comments a:hover, #content .post ul.post-data li.posted a:hover {
	background-position: 0 -38px;
	}

.spacer {   
	padding: 0px;
    text-align: right;
    clear: both;
    text-transform: lowercase;
    }



/*-------------------
BIOGRAPHY PAGE
-------------------*/

/*
#content #bioimg {
	width: 500px;

	margin-left: auto;
	margin-right: auto;
}*/


/*Presskit Link Placement*/

/*
#presskitlink {
	 text-align: right;
	 margin-bottom: 25px;
}*/


/*Presskit Download Link */
/*
#content .post .entry #presskitlink a { 
	color: #968c83; 
	text-decoration: none;	
	text-transform: uppercase;
	font: 1em Garamond, serif;
	font-weight: bold
}

#content .post .entry #presskitlink a:hover { 
		text-decoration: underline;
		color: #e1255b;

}*/

/*-------------------
END BIOGRAPHY PAGE
-------------------*/

/*-------------------
TOUR DATES PAGE
-------------------*/


.titletd {
	border-bottom: 3px solid #696969;
	padding-bottom: 4px;  
}

.title {
	font-size: 1em;
	font-family: Georgia, serif;
	font-weight: bold;
	text-transform: uppercase;
	}

table td {
	padding: 3px 15px 3px 3px;
	
}


.showtable {
	margin-top: -20px;

}


.showtable td {
	font-family: Tahoma, Verdana, Arial;
	font-size: 15px;
	color: #968c83;
}

td.venue {
	font-weight: bold;
	font-size: 14px;
}


.showtable tr {
	font-family: Tahoma, Verdana, Arial;
	font-size: 13px;
	color: #968c83;

}

/*-------------------
END TOUR DATES PAGE
-------------------*/


/*-------------------
VIDEO PAGE
-------------------*/


.videowrapper {
	margin: -15px 0 0 0;
}


/*-------------------
END VIDEO PAGE
-------------------*/

/*-------------------
DISCOGRAPHY & MERCH PAGE
-------------------*/


.store_badge {
	
	border: 0;
	float: left;
	text-align: center;
	margin-right: auto;
	margin-left: auto;

}

.discowrapper {
	margin: 0 0 0 0;
    
}

.albumlisting {	
	height: 350px;
	border: 1px solid #ffffff;
	margin-left: 15px;
	margin-right: auto;
	margin-top: -20px;
	margin-bottom: 15px;


}


.leftmerch {
	float: left;
	border: 1px solid #ffffff;
	margin-top: -30px;
	padding: 0;
}
.albumart {
	float: left;
	width: 200px;
	height: 200px;
	padding-top: -15px;
	
}

.albumdetails {	
	margin: 10px 0 0 230px;
	border: 1px solid #ffffff;
}

#content .post .albumtitle {
	font-size: 1em;
	font-family: Helvetica, sans-serif;
    font-weight: bold;
	color:#696969;
	text-transform: uppercase;
}


.albumtracks {
	padding: 10px 0 0 0;

}


/*-------------------
END DISCOGRAPHY & MERCH PAGE
-------------------*/


	
/* -------------------
COMMENTS
------------------- */

/* "(#) Responses to 'Article Name'" text*/

#content #comments {
	font: 1.5em Helvetica, sans-serif;
	color: #696969;
	text-transform: uppercase;
	text-align: center;
	font-weight: bold;

}

/*Responses Title Positioning*/

#content #comments {
	margin: 0 20px 20px 25px;
	}

/*
#commentform p #comment {
	font: 10px Tahoma, Arial, Helvetica, sans-serif
}
*/

/*The whole Comment section*/
ol.commentlist {
	/*border: 1px solid #696969;*/

}

ol.commentlist, li {
	/*This effects all li items including header nav, sidebar links, post-data and comments*/	
}



/*Individual Comment Styling*/

#content .commentlist li {
	border-top: 0 solid #7a7a7a;
	border-bottom: 1px solid #7a7a7a;
	margin-top: 25px;
	margin-right: 60px;
	/*
	margin-left: 50px;
	
	margin-bottom: 40px;
	*/

}



/*
#content #comments form a { color: #847b73; }
#content #comments form a:hover { color: #827060; }


#content #comments form p #comment {
	font: 10px Tahoma, Arial, Helvetica, sans-serif;
	color: #9a9a9a;
}
	

*/


/*
.alt {
font: 4.1em Tahoma, Arial, Helvetica, sans-serif;
}
*/



.em {
	
	color: #000000;
	font-size: 1em;
}
/*Simon Says...*/
.commentlist cite, .commentlist cite a {
	font-weight: bold;
	text-transform: uppercase;
	font-size: 1em;
	font-family: Helvetica, sans-serif;
	padding-right: 3px;
	}



/*meta data for date & time*/
.commentmetadata {	
	font-size: 0.8em;
	color: #696969;
	font-family: Helvetica, sans-serif;
	
}

	


.commentlist cite, .commentlist cite {
	font-family: Tahoma, Arial, Helvetica, sans-serif;

	}


/*
.commentlist p {
	font: 11px Tahoma, Arial, Helvetica, sans-serif;
}
*/



/*"Leave a Comment"*/
#middle #content #respond {
	font: 1.5em Helvetica, Tahoma, Arial, sans-serif;
	font-weight: bold;
	color: #696969;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	text-transform: uppercase;
}



/* This is the entire comment form area*/

#commentform {
	/*border: 1px solid #696969;*/
	padding-right: 25px;
	padding-left: 25px;
	margin-top: -10px;

	
}

/*Name, Email, Website text*/

#commentform p {
	font: 1em Helvetica, Tahoma, Arial, sans-serif;
	margin-left: 5px;
	color: #696969;
	text-transform: uppercase;
}


/* Name Input Field*/

#commentform p #author {
	font: 0.7em Tahoma, Arial, Helvetica, sans-serif;
	background: #ffffff;
	border: 3px solid #459ad0;
	width: 250px;
	color: #696969;
	padding: 3px;
}


#commentform p #author:hover  {
	border: 3px solid #e12bbd;
}


#commentform p #author:focus  {
	border: 3px solid #e12bbd;
}


/*Comment Text Field*/

#commentform p textarea {
	font: 0.8em Helvetica, Tahoma, Arial, sans-serif;
	background: #ffffff;
	border: 3px solid #459ad0;
	width: 470px;
	color: #696969;
	padding: 5px;

}

#commentform p textarea:hover {
	border: 3px solid #e12bbd;
}
#commentform p textarea:focus {
	border: 3px solid #e12bbd;
}




/*Comment Submit button*/

#commentform #submit {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	/*float:left;*/
    background: #ffffff;
    color: #696969;
	font: 1em Helvetica, Tahoma, Arial, sans-serif;
	border:3px solid #696969;
    height: 35px;
	width: 480px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 3px;
    padding-top: 3px;
    font-weight: bold;
	}


#commentform #submit:hover {
	border:3px solid #e12bbd;
	color: #e12bbd;
	}


	
/* -------------------
SIDEBAR (see "Navigation" section for Nav styles)
------------------- */


/*Bio Preview Text*/
.biosnippet {
	color: #7a7a7a;
	font-size: .8em;
	font-family: Helvetica, sans-serif;
	
}

#sidebar hr {
	color: #696969;
	background-color: #7a7a7a;
	height: 3px;
	border: 0;
	margin-top: 15px;
	margin-bottom: 15px;

	}
	
	/*
#sidebar h2 {
	color: #696969;
	font: 2em/1.5em Garamond, serif;
	font-weight: bold;
	margin: 0 0 0 0;
	text-transform: uppercase;
	}
	*/

        
	/*Twitter Posts*/
	
	/*Sidebar Non-Links*/
#sidebar p, #sidebar li {
	/*list-style-image: url(http://localhost/wordpress/wp-content/themes/SPIRITS/images/pixel.jpg);*/
	color: #696969;
	font: 1em Helvetica, sans-Serif;
	padding-bottom: 10px;
	padding-top: 15px;
	margin-left: 18px;
	}
	
#sidebar p, #sidebar ul, #sidebar ol {
	margin: 0 0 0 0; /*This is the margin after the list is finished*/
	
	}
	
#sidebar ul { 	
	padding: 0 0 0 0;
	margin-right: 30px;
    text-align: left; 
	color: #696969;
	text-decoration: none;	
 }
 

#sidebar ul li a{ 
	color: #459ad0;
	text-decoration: none;	
	padding: 0 0 0 3px;
	/*list-style-image: url(images/icon.gif);*/
 }



#sidebar ul li a:hover{ 
	text-decoration: underline;	
 }



/*Side bar Email list form styles*/
#sidebarform {
	background-color: #ffffff;
	padding-top: 13px;
	padding-bottom: 8px;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}


#sidebarform .join {
	color: #459ad0;
	font: 0.8em Helvetica, sans-serif;
	display: inline;
	float: left;
	font-weight: bold;
	text-transform: uppercase;
	padding-left: 15px;
	padding-top: 3px;
	padding-bottom: 8px;
	letter-spacing: 2.2px;
	
}




#textarea {
	font: 0.8em Helvetica, sans-serif;
	background: #ffffff;
	border: 3px solid  #459ad0;
	width: 95px;
	color: #696969;
	padding-top: 5px;
	padding-bottom: 1px;
	margin-right: 6px;
	padding-left: 3px;
	height: 17px;
	text-transform: uppercase;
	}
	

#textarea:hover {
	border: 3px solid #e1255b;
}

#textarea:focus {

	border: 3px solid  #e1255b;
}


#submit {
	margin: 0;
	border: 3px solid  #459ad0;
	background: #ffffff;
    color: #696969;
	font: 0.9em Helvetica, sans-serif;
	font-color:  #696969;
	font-weight: bold;
	text-transform: uppercase;
	width: 90px;
	padding: 3px;
	}

	
#submit:hover {

	border: 3px solid #e1255b;
	}

#sidebarform input{
	margin-bottom: 13px;
}



	/*CONTROL HEIGHT OF SIDEBAR 12px for no rss image*/
	
	/*NOT CURRENTLY IN USE*/
#sidebarcontainer {
	float: right;
	padding: 0;
	width: 100px;
	height: 100%;
	margin: 0px;

}
#sidebarcontainer form {
	padding: 0;
	margin: 0;
}
#subscriptionoptions{
	width:300px;
	padding: 0 30px;
}

#rssmain {
	float:left;
	padding: 4px 0 0px 0;
}

/* This white pixel fills in white space from the bottom of the sidebar to the bottom of the blog posts*/
#sidepixel{
	width: 100%;
	height: 100%; /* THIS AINT DOIN NOTTIN'!*/
	margin: 0;
	
}

#wrap {
	margin: 0;
	float: left;
	padding-top: 5px;
	width: 254px;
	color: #827060;
	height: 100%;
	border: 0 dashed #000000;

}

.clear {
	clear: both;
	margin: 0;
	padding: 0;
}


.clearfix:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}


.clearfix {
display: inline-block;
}

html[xmlns] .clearfix {
display: block;
}

* html .clearfix {
height: 1%;
}





.ad250 {
	text-align: center;
}


/* -------------------
FOOTER
------------------- */

#footer {
	clear: left;
	text-align: center;
	background-color: #FFFFFF;
	height: 90px;
	width: 815px;
    margin-right: auto;
	margin-left: auto;
    padding: 0px;

	}
	
#footer p {
	color: #696969;
	font-family: Helvetica, sans-serif;
	font-size:0.7em;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 0;
	padding-top: 20px;
	margin-left: 15px;
	line-height: 15px;
	}
	
#footer a {
	color: #459ad0;
	font-family: Helvetica, sans-serif;
	font-size: 1em;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 0;

	}

#footer a:hover {
	text-decoration: underline;
	}
	
#footer hr {
	color: #7a7a7a;
	background-color: #7a7a7a;
	margin: 15px 0px 5px 0px;
	height: 3px;
	border: 0;
}

/*This is for the top lace border of the footer*/

#footertop img  {
	margin-bottom: -12px;
	display: block;
	text-align: center;
	width: 815px;
    margin-right: auto;
margin-left: auto;

	
}

#footer #sulogo {
	border: 0;
	float: right;
	margin: 10px 25px 5px 5px;
	height: 50px;
	width: 50px;
}






 .cssnav
{
position: relative;
font-family: arial, helvetica, sans-serif;
background: url('http://www.thejohnsmith.ca/spirits/wp-content/themes/Spirits/images/sulogo.jpg') no-repeat;
white-space: nowrap;
display: block;
width: 100px;
height: 92px;
margin: 0;
padding: 0;
}

.cssnav a
{
display: block;
color: #000000;
font-size: 11px;
width: 100px;
height: 92px;
display: block;
float: left;
color: black;
text-decoration: none;
}

.cssnav img
{
width: 100px;
height: 92px;
border: 0
}

* html a:hover
{
visibility:visible
}

.cssnav a:hover img
{
visibility:hidden
}

.cssnav span
{
position: absolute;
left: 35px;
top: 15px;
margin: 0px;
padding: 0px;
cursor: pointer;
}


/*Image Rollover CSS*/

img.nohover {border:0}
img.hover {border:0;display:none}

a:hover img.hover {display:inline}
a:hover img.nohover {display:none}




/* -------------------
END FOOTER
------------------- */