/*****************************************************************/
/** Copyright Invent Media - www.inventmedia.com.au				**/
/** All rights reserved											**/
/*****************************************************************/

/******************************* Body ********************************/
html { 
	overflow-y: scroll; /* Forces vertical scroll bar to always be visible avoiding the page shift left when the scrollbar is activated */
}
body {
	margin: 0;
	padding: 0;
	border: 0px;
	background: #21215d url(images/bg.gif) repeat-x fixed; 
	font-size: 13px;
	color: #FFFFFF;
}

body, th, td, input, textarea, select, option {
	font-family: Verdana, Georgia, Helvetica, sans-serif;
}

.wrapper {
/*** wraps the entrie page abouve the footer. Needed for footer ***/
	position: relative; 
	width: 100%;
	margin: 0 auto -100px; /** -ve footer image height -ve footer distance from bottom of screen - see footer */
	text-align: left;
}

/***************************** Headings *******************************/
h1, h2, h3 {
/*	text-transform: lowercase;*/ /*force all heading into lower case*/
	font-family: Verdana, Georgia, Helvetica, sans-serif;
	font-weight: normal;
	color: #FFFFFF;
}

h1 {
/*	letter-spacing: -2px;*/
	font-size: 3em;
}

h2 {
/*	letter-spacing: -1px;*/
	font-size: 2em;
}

h3 {
	font-size: 1em;
}

/************ Paraghraphs, ordered lsits, un-order lists ***************/
p, ul, ol {
	line-height: 200%;
}

hr {
	color:#4a3903;
	border:0;
	background-color: #4a3903;
	height: 2px;
	width: 100%;
}

/************************** Block quotes *******************************/
blockquote {
	padding-left: 1em;
}

blockquote p, blockquote ul, blockquote ol {
	line-height: normal;
	font-style: italic;
}

/***************************** Links ***********************************/
a {
	color: #FFEA6F;
}

a:hover {
	text-decoration: none;
}


/***************************** images *********************************/
img { 
	border: none;
	behavior: url(iepngfix.htc); 
}

/* hide pictures fro preloading */
.hiddenPic { 
	display:none;
}


.imgL{
	float:left;
    padding:10px 10px 10px 10px;
}

.imgC{
/*** center image. You must put the image in <p class="imgcenter"> then the <img> tags ***/
    text-align:center;
    padding:5px 5px 10px 5px;
   }
   
.imgR{
	float:right;
    padding:5px 5px 10px 10px;
}

/***************************** Header *********************************/
#header {
	width: 800px;
	height: 150px;
	margin: 0 auto;
}

/***************************** Menu ********************************/
#menu {
	width: 800px;
	height: 40px;
	margin: 0 auto;
	padding-bottom:15px;
}

#menu ul {
	margin: 0;
	padding: 7px 0 20px 0;
	list-style: none;
}

#menu li {
	display: inline;
}

#menu a {
	display: block;
	float: left;
	width: 130px; /* tab wdith. Set to menu width divided by the number of tabs  - Warning you need to make it slightly less so it doesn't run over in some browsers */
	height: 36px;
	padding-top: 5px;
	text-transform: lowercase;
	text-decoration: none;
	text-align: center;
	letter-spacing: -1px;
	font-size: 30px;
	color: #FFFFFF;
	border:solid #000000 1px;
  }

ul li#home a {
    background: url(images/homeCurrent.gif) no-repeat;
}

ul li#home a:hover {
    background: url(images/homeOn.gif) no-repeat;
}
#menu .homeCurrent a{
	color: #FFEA6F;
    background: url(images/homeCurrent.gif) no-repeat;
}

ul li#concerts a {
    background: url(images/concertsCurrent.gif) no-repeat;
}
ul li#concerts a:hover {
    background: url(images/concertsOn.gif) no-repeat;
}
#menu .concertsCurrent a{
	color: #FFEA6F;
    background: url(images/concertsCurrent.gif) no-repeat;
}

ul li#bio a {
    background: url(images/bioCurrent.gif) no-repeat;
}
ul li#bio a:hover {
    background: url(images/bioOn.gif) no-repeat;
}
#menu .bioCurrent a{
	color: #FFEA6F;
    background: url(images/bioCurrent.gif) no-repeat;
}

ul li#listen a {
    background: url(images/listenCurrent.gif) no-repeat;
}
ul li#listen a:hover {
    background: url(images/listenOn.gif) no-repeat;
}
#menu .listenCurrent a{
	color: #FFEA6F;
    background: url(images/listenCurrent.gif) no-repeat;
}

ul li#gallery a {
    background: url(images/galleryCurrent.gif) no-repeat;
}
ul li#gallery a:hover {
    background: url(images/galleryOn.gif) no-repeat;
}
#menu .galleryCurrent a{
	color: #FFEA6F;
	background: url(images/galleryCurrent.gif) no-repeat;
}

ul li#contact a {
    background: url(images/contactCurrent.gif) no-repeat;
}
ul li#contact a:hover {
    background: url(images/contactOn.gif) no-repeat;
}
#menu .contactCurrent a{
	color: #FFEA6F;
    background: url(images/contactCurrent.gif) no-repeat;
}

#menu a:hover {
/*	background: url(images/.jpg) no-repeat; */
	color: #FFEA6F;
}

#menu .active a {
	color: #FFEA6F;
/*	background: url(images/.jpg) no-repeat;*/
}

/****************************** Page ********************************/
#page {
/*** The area in the middle that holds the content ***/
	width: 800px;
	margin: 0 auto; /* align div center */
	padding: 0 0 20px 0; /* setting bottom padding to the distance footer is from bottom - see footer */
}

/*********************** Lists ********************************/
#page ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#page li {
	padding-left: 30px;
	background: url(images/arrow.gif) no-repeat 15px 50%;
}

.underline li {
/*** Underline li ***/
	padding-left: 30px;
	border-bottom: 1px dotted #4A3903;
}

#page h2 {
	margin: 0;
	padding: 20px 0 2px 0;
/*	background: url(images/icon01.gif) no-repeat left bottom;
*/	border-bottom: 2px solid #4A3903;
}

#page a {
	text-decoration: none;
}

#page a:hover {
	text-decoration: underline;
}

/*************************** Content shared classes *********************************/
p {
	padding: 10px 0 10px 0; 
}

.post {
	padding: 20px 0 0px 0;
}

.title {
	margin: 0;
	border-bottom: 2px solid #4A3903;
}

.byline {
	margin: 0;
}

.meta {
	border-top: 1px solid #4A3903;
	text-align: right;
	color: #4A3903;
}

.meta a {
	padding-left: 15px;
	background: url(images/arrow.gif) no-repeat left center;
	font-weight: bold;
	color:#CC9900;
}

.smallimage {
	padding: 20px 0 10px 0;
	align: center;
	align="middle"
	border:0;
}

.clear { 
/*** clear is use to remove the float. need for footer to work ****/
  clear: both;
}

/*************************** CD Divs **********************************/
.cd{
	padding:0 0 20px 0;
/*	border:#FFFFFF solid 1px;
*/}

.pcd{
	padding: 0 0 0 0;
}

.cdtrack{
	float: left;
	width: 50px;
	padding-left:100px;
}

.cdtitle{
	float: left;
	width: 300px;
}

.cdcomposer{
	float: left;
	width: 140px;
}

.cdlength{
	float: left;
	width: 70px;
}

.cdplay{
	float: left;
	width: 122px;
}

.cdadd{
	float: left; 
	padding: 15px 3px 0 0 ;
	width: 630px;
	text-align:right;
}

.cdview{
	float: right;
 	padding: 15px 0 0 0;
	width:160px;
	text-align:left;
}

.plong {
padding-bottom:150px;
}

/*************************** Contact Form div **********************************/
#formContact {
	width: 500px;
	margin: 0 auto; /* align div center */
}

#formContact input{
	width:250px;
}

#formContact textarea {
	width:250px;   
	height: 100px;
}

#formContact label { 
	float: left; 
	width: 90px; 
	padding: 0; 
	margin: 5px 0 0; 
	text-align: Left; 
	font-weight: bold;
}

#formContactValid {
/*** formContactValid is simple to align the vaildation ara of the form centered ***/
/*	padding: 25px;*/
	width: 435px;
	margin: 0 auto; /* align div center */
	text-align:center;
}

/*************************** Login Form div **********************************/
#formLogin {
	width: 400px;
/*	border:thin solid red;*/
/*	text-align:center; */
	padding: 80px 0 0 0; 
	margin: 0 auto; /* align div center */
}

#formLogin input{
	width:250px;
}

#formLogin label { 
	float: left; 
	width: 110px; 
	padding: 0; 
	margin: 5px 0 0; 
	text-align: Left; 
	font-weight: bold;
}

#formLoginValid {
/*	border:thin solid green;*/
/*** formContactValid is simple to align the vaildation ara of the form centered ***/
/*	padding: 25px;*/
	/*width: 400px;
	margin: 0 auto;*/ /* align div center */
	text-align:center;
}


/*************************** Content div No Sidebar **********************************/
#contentNS {
	float: left;
	width: 800px;
}

/********************* Content div with right sidebar column ************************/
#contentRS {
	float: left;
	width: 532px;
}

#sidebarR {
	float: right;
	width: 210px;
}

/********************* Content div with Left sidebar column ************************/
#contentLS {
	float: right;
	width: 532px;
}

#sidebarL {
	float: left;
	width: 210px;
}


/******************* Content for div for two evenly spaces Columns *********************/
.ColHalfL {
	float: left;
	width: 350px;
	padding: 20px;
}

.ColHalfR {
	float: right;
	width: 350px;
	padding: 20px;
}

/******************* Content for div for two evenly spaces Columns Content centered*********************/
.ColHalfLCenter {
	float: left;
    text-align:center;
	width: 350px;
	padding: 20px;
}

.ColHalfRCenter {
	float: right;
    text-align:center;
	width: 350px;
	padding: 20px;
}

/******************* Content for div for three enevenly spaced Columns *********************/
/* left */
.ColL { 
	float: left;
	width: 266px;
}

/* middle */
.ColM {
	float: left;
	width: 266px;
}

/* right */
.ColR {
	float: right;
	width: 266px;
}

/***************************** Footer ****************************************/
.footer {
	position: relative;
	height:100px;
	width: 100%;
	margin: 0 auto;
	padding: 0; /* footer distance from bottom of screen */
/*	background: url(images/footer.png) repeat-x;*/
}
.footer a {
	color: #fff;
	text-decoration: underline;
	border: 0;
}
.footer p {
	position: absolute;
	left: 0;
	bottom: 4px;
	width: 100%;
	padding: 0 0 60px 0;
	color: #fff;
	font: 0.8em arial,sans-serif;
	text-align: center;
}