/* Theme URI: http://www.scottwills.co.uk
Author: Scott Wills
Date: April 2006
Author URI: http://www.scottwills.co.uk

Color Table:

#ffff -- White
#1b1b1b -- Background
#09f -- Hyperlink Blue
#333 -- Container Border

*/

a:link, a:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #09f;
	text-decoration: underline;
}

a:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #fff;
	background-color: #09f; 
}

body {
	background-image: url(../images/backgroundDark.gif);  
	background-attachment: fixed; 
	background-color: #1b1b1b;
	font: 12px Verdana, Arial, Helvetica, sans-serif;
	color: #fff;
	line-height: 240%;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	float: none;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

form {
	background-color: #222;
	padding: 5px 20px 20px 20px;
	border: 1px dashed #444; 
}

form textarea, input, select {
	background-color: #ccc;
}

#paragraphAlternate {
	font: 12px Verdana, Arial, Helvetica, sans-serif;
	background-color: #111;
	color: #999;
	line-height: 240%;
	margin: 0 0 0 0;
	padding: 10px 20px 10px 20px;
	border-top: 1px solid #333;
	border-bottom: 2px solid #333;
}

img {
	border-style: none;
}

/* Use container to center all content */

#container {
	border-top: 6px solid #333;
	border-bottom: 6px solid #333;
	border-right: 6px solid #333;
	border-left: 6px solid #333; 
	width: 852px;
	margin: 0 auto 0;
	text-align:left;
	position: relative;
	background-color: #1b1b1b;
}


#navButtonHome {
	position: absolute;
	float: left;
	background-position: 0 0;
	margin: 0px 0 0 445px;
}

#navButtonAbout {
	position: absolute;
	float: left;
	background-position: 0 0;
	margin: 0px 0 0 515px;
}

#navButtonDesign {
	position: absolute;
	float: left;
	background-position: 0 0;
	margin: 0px 0 0 585px;
}

#navButtonPhotos {
	position: absolute;
	float: left;
	background-position: 0 0;
	margin: 0px 0 0 655px;
}

#navButtonMusic {
	position: absolute;
	float: left;
	background-position: 0 0;
	margin: 0px 0 0 725px;
}

#header {
	background-image:  url(../images/headerBlue.jpg);
	padding: 0 0 0 0;
	position: relative;
	width: 852px;
	height: 189px;
	margin: 0 0 0 0;
}

#content {
	position: relative;
	font: 12px Verdana, Arial, Helvetica, sans-serif;
	color: #fff;
	line-height: 240%;
	margin: 0 0 0 60px;
	width: 740px;
	padding: 0px 0 25px 0;
}

#headlineFlash {
	border-top: 1px solid #444;
	width: 730px;
	padding: 0 0 15px 0;
	}

#sectionRunning {
	background: url(../images/sectionRunning.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}

#sectionLatestProjects {
	background: url(../images/sectionLatestProjects.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}
	
#sectionAlbumPromotion {
	background: url(../images/sectionAlbumPromotion.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}


#sectionEverything{
	background: url(../images/sectionEverything.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}

#sectionContact {
	background: url(../images/sectionContact.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}

#sectionContactThanks {
	background: url(../images/sectionContactThanks.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}

#sectionAbout {
	background: url(../images/sectionAbout.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}
	
#sectionRecent {
	background: url(../images/sectionRecent.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}

#sectionSoundtrack {
	background: url(../images/sectionSoundtrack.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}
	
#sectionFlickr {
	background: url(../images/sectionFlickr.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}
	
#sectionDesign {
	background: url(../images/sectionDesign.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}
	
#sectionDesignLogo {
	background: url(../images/sectionDesignLogo.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}	

#sectionDesignWeb {
	background: url(../images/sectionDesignWeb.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}

#sectionDesignInteractive {
	background: url(../images/sectionDesignInteractive.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}
	
#sectionPhotosLatest {
	background: url(../images/sectionPhotosLatest.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}

#sectionPhotosFavorites {
	background: url(../images/sectionPhotosFavorites.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}

.sectionHeader img {
	background: url(../images/sectionHeader.jpg) no-repeat;
	margin: 0 0 16px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	height: 52px;
	width: 730px;
	}

#art a img {
	border: 4px solid #fff;
}

#art a:hover img {
	border: 4px solid #0099ff;
}

#photos a img {
	border: 4px solid #fff;
}

#photos a:hover img {
	border: 4px solid #0099ff;
}

#flickr {
	padding-top: 10px;
	padding-left: 33px;
	width: 730px;
}

#flickr img {
	margin: 4px; 
	width: 75px;
	height: 75px;
	border: 4px solid #fff;
}

#flickr a:link img {
	margin: 0; 
	width: 75px;
	height: 75px;
	border: 4px solid #fff;
}

#flickr a:visited img {
	margin: 0; 
	width: 75px;
	height: 75px;
	border: 4px solid #fff;
}

#flickr a:hover img {
	margin: 0; 
	width: 75px;
	height: 75px;
	border: 4px solid #09f;
}

#footer {
	background: url(../images/footer.jpg) repeat-x;
	position: relative;
	height: 217px;
	width: 852px;
}

#footerText {
	padding: 75px 0 0 75px;
	bottom: 20px;
	font-size: 90%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #fff;
	text-align: left;
	line-height: 240%;
	}

#footerText a:link, a:visited {
	color: #666;
	text-decoration: underline;
	font-weight: normal;
	}

#footerText a:hover {
	color: #fff;
	background-color: #1b1b1b;
	}

.copyright {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #6A6260;
	padding-left: 41px;
	border: 1px solid #8D817E;
}

.copyright a:link {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #fff;
	text-decoration: underline;
}

/* photo archives / photoArchives / newsChannel */

#newsChannel ul {
/*		list-style-position: outside; */
        list-style-type: none;
        width: 290px;
		margin: 0;
		padding: 0;
} 

#newsChannel li {
        border-bottom: 1px solid #333;
        border-width: 1px 0;
        margin: 0 0 0 0;
		padding: 0 0 0 40px;
		background: url(../images/newsBullet.jpg) no-repeat;
		background-position: 0 50%;
}

#newsChannel li a { 
        color: #09f;
        display: block;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		font-weight: bold;
        padding: 6px;
        text-decoration: none;
}

* html #newsChannel li a {  /* make hover effect work in IE */
		width: 250px;
        text-decoration: none;
}

#newsChannel li a:hover {
        background-color: #111;
        text-decoration: none;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		font-weight: bold;
}

#newsChannel li a:visited {
        text-decoration: none;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		font-weight: bold;
}

#newsChannel a em { 
        color: #666;
/*      display: block; */
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		font-weight: bold;
        line-height: 100%; 
        text-decoration: none;
}


/* dapper design */

.threeColContainer
{
width: 730px; /* originally 90% although 100% works fine too */
/* margin: 10px auto; */
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #999;
line-height: 240%;
/* border: 1px solid #f00;
line-height: 130%; */
}

.threeColContainer h2 {
font-size: 12px;
color: #fff;
font-weight: bold;
}

.threeColContainer img {
	margin: 0; 
	width: 190px;
	height: 110px;
	border: 8px solid #333;
}

.threeColContainer a:link img {
	margin: 0; 
	width: 190px;
	height: 110px;
	border: 8px solid #333;
}

.threeColContainer a:hover img {
	margin: 0; 
	width: 190px;
	height: 110px;
	border: 8px solid #09f;
}

.threeColLeft
{
float: left;
background-color: #121212;
width: 207px;
height: 275px;
padding: 12px;
border-left: 1px dashed #333; 
border-right: 1px dashed #333;
}

.threeColRight
{
float: right;
background-color: #121212;
width: 207px;
height: 275px;
padding: 12px;
border-left: 1px dashed #333; 
border-right: 1px dashed #333;

}

.threeColCenter
{
float: none;
width: 207px;
height: 275px;
background-color: #222;
margin-left: 248px; /* positions column horizontally 246 */
/* margin-right: 240px; */
padding: 12px;
border-left: 1px dashed #333; 
border-right: 1px dashed #333; 

}

#designLink
{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #999;
}

#designLink a:link, a:visited
{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #999;
text-decoration: none;
border-bottom: 1px dashed;
}

#designLink a:hover
{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #fff;
background-color: #121212; 
text-decoration: none;
border-bottom: 1px dashed;
}


/* homepage 2 column */

#homeTwoColContainer
{
width: 730px; /* originally 90% although 100% works fine too */
/* margin: 10px auto; */
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #999;
line-height: 240%;
padding-bottom: 15px;
/* border: 1px solid #f00;
line-height: 130%; */
}

#homeTwoColContainer h2 {
font-size: 12px;
color: #fff;
font-weight: bold;
}

#homeTwoColLeft
{
float: left;
font-size: 11px;
color: #fff;
background-color: #111;
border-left: 1px dashed #333;
border-right: 1px dashed #333;
width: 350px;
height: 200px;
padding: 12px;
}

#homeTwoColRight
{
float: right;
width: 320px; /* 320px original */
height: 200px;
padding: 0px;
text-decoration: none;
border-bottom: none;
}

#homeTwoColRight a:link {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #09f;
	text-decoration: none; 
}

#homeTwoColRight a:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #09f;
	border-bottom: none;
}

#homeTwoColRight a:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #fff;
	background-color: #121212;
	text-decoration: underline; 
}



#homeTwoColCenter
{
float: none;
width: 0px;
height: 200px;
background-color: #222;
margin-left: 0; /* positions column horizontally 246 */
/* margin-right: 240px; */
padding: 0;
border: none; 
}

/* photoArchives 2 column */

.twoColContainer
{
width: 730px; /* originally 90% although 100% works fine too */
/* margin: 10px auto; */
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #999;
line-height: 240%;
/* border: 1px solid #f00;
line-height: 130%; */
}

.twoColContainer h2 {
font-size: 12px;
color: #fff;
font-weight: bold;
}

#twoColLeft
{
float: left;
font-size: 11px;
color: #fff;
background: url(../images/photoIntroBack.jpg) no-repeat; 
width: 400px;
height: 150px;
padding: 12px;
}

#twoColRight
{
float: left;
width: 240px; /* 320px original */
height: 150px;
padding: 0px;
}

#twoColRight a:link, a:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #09f;
	text-decoration: none;
	border-bottom: none;
}

#twoColRight a:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #09f;
	text-decoration: none;
	border-bottom: none;
}

#twoColRight a:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #fff;
	background-color: #121212;
	text-decoration: underline; 
}

#twoColCenter
{
float: none;
width: 0px;
height: 150px;
background-color: #222;
margin-left: 0; /* positions column horizontally 246 */
/* margin-right: 240px; */
padding: 0;
border: none; 
}

/* photosets 2 column */

#photosetsTwoColContainer
{
width: 730px; /* originally 90% although 100% works fine too */
/* margin: 10px auto; */
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #999;
line-height: 240%;
/* border: 1px solid #f00;
line-height: 130%; */
}

#photosetsTwoColContainer h2 {
font-size: 12px;
color: #fff;
font-weight: bold;
}

#photosetsTwoColLeft
{
float: left;
font-size: 11px;
color: #fff;
background: url(../images/photoIntroBack.jpg) no-repeat; 
width: 400px;
height: 150px;
padding: 12px;
}

#photosetsTwoColRight
{
float: left;
width: 240px; /* 320px original */
height: 150px;
padding: 0px;
}

#photosetsTwoColRight a:link, a:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #09f;
	text-decoration: none; 
}

#photosetsTwoColRight a:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #fff;
	background-color: #121212;
	text-decoration: underline; 
}

#photosetsTwoColCenter
{
float: none;
width: 0px;
height: 150px;
background-color: #222;
margin-left: 0; /* positions column horizontally 246 */
/* margin-right: 240px; */
padding: 0;
border: none; 
}

#runningPromo {
	background: url(../images/runningPromotion.jpg) no-repeat;
	margin: 0 0 16px 0;
	width: 730px;
	height: 227px;
}


#evolutionPromo {
	background: url(../images/albumPromoBackground.gif) no-repeat;
	margin: 0 0 16px 0;
	width: 730px;
	height: 227px;
}

#evolutionPromoTwoColLeft {
	float: left;
	background: url(../images/albumCover.jpg) no-repeat; 
	width: 213px;
	height: 196px;
	padding: 5px;
	margin: 15px;
}

#evolutionPromoTwoColRight {
	padding: 1px 25px 0 0 ;
	font-size: 12px;
	color: #fff;
}

 #evolutionPromo h3 {
	font-size: 12px;
	color: #fff;
	font-weight: bold;
} 

#evolutionPromo p {
	font-size: 11px;
	color: #fff;
}

#buttonListenNow {
	margin: -4px 0 0 0;
}