/* RESET STYLES */

body,div,ol,ul,li,h1,h2,h3,h4,h5,h6,form,p,blockquote {margin:0; padding:0;}
img, a img {border:0;}
a {outline: none;}
ul {list-style:none; margin:0; padding:0;}
h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal;}


/* MAIN NAVIGATION DIVS */
.navigation {position:relative; top:155px;}
.navpng {position: absolute; top:198px; left:146px;}	
	
#mainnav {
	position: absolute;
	padding: 5px 0px 0px 28px;
	top: 198px;
	left: 146px;
	width: 814px;
	height: 30px;
	}
#mainnav ul{margin:0px; padding:0px;}	
#mainnav li {
	float:left;
	display: inline;
	list-style-type: none;
	padding-top: 5px;
	}
	
#homeNav, #aboutNav, #workNav, #clientsNav, #blogNav, #contactNav {float:left; height:30px;}
#homeNav {width: 75px;}
#aboutNav {width: 95px;}
#workNav {width: 97px;}
#clientsNav {width: 80px;}
#blogNav {width: 64px;}
#contactNav {width: 100px;}

/* MAIN STYLES */

body {
	background: url(../img/back.gif) center;
  	font-family: Arial, Helvetica, sans-serif;
	color: #808080;
	font-size:85%;
	line-height:1.4em;
	}
	
a:link, a:active, a:visited {color: #808080; text-decoration: none;}
a:hover {color: #00adef; text-decoration: underline;}

#grad {background:url(../img/grad.gif) no-repeat center top; margin:0px auto;}
	
#wrapper {position: relative;margin: -8px auto 0; width: 996px;z-index:0;}
	
#header {position: relative; height: 395px; background-color: #efefef;}
	
#imageContainer {position:absolute;}
#foo {z-index:0}
#foo img {position:absolute;}	
	
#logo {position:absolute; top:240px; left:36px;}
 
.note {font-size:0.8em}
	
#speechBox {height:204px;position:absolute; left:146px; top:36px;overflow:hidden;background:transparent url(../img/rotating/bubble.png) no-repeat left top;z-index:90}
.homepage-speech {width:552px!important}

#content {
	float:left;
	width: 758px;
	background-image:url(../img/content_back.gif);
	margin-left: 121px;
	display:inline;
	padding: 0px 64px 0px 53px;
	}
	
#mainCol {float:left; width:468px; padding:0px 28px 0px 0px;}
#rightCol, #rightColcont {float:left; width:234px; padding:0px 0px 50px 28px; font-size:0.8em;}
#fullCol {float:left; width:758px; padding-bottom:30px;}
#rightColshort, #rightColabout {float:left; width:234px; padding:0px 0px 0px 28px; font-size:0.8em;}	
	
#breadcrumb {
	float: left;
	width: 758px;
	color: #a0a0a0;
	padding: 5px 0px 6px 0px;
	margin-bottom: 22px;
	font-size: 0.8em;
	border-bottom: solid #efefef 1px;
	}
	
#breadcrumb a:link, #breadcrumb a:visited {color: #a0a0a0;text-decoration: underline;}
#breadcrumb a:hover, #breadcrumb a:active {color: #00adef;text-decoration: underline;}
	
.rightList {
	color: #404040;
	margin-bottom: 5px;
	padding-left: 1px;
	float:left;
	width: 233px;
	line-height: 1.7em;
	}

.updateList li {height:18px;}	
.updateList li a {padding-left:16px;height:15px;display:block;}
	
.updateList li.twitter a {background:url(../img/blog/updates/twitter.gif) no-repeat 0 4px;}
.updateList li.newsletter a {background:url(../img/blog/updates/newsletter.gif) no-repeat 0 4px;}
.updateList li.rss a {background:url(../img/blog/updates/rss.gif) no-repeat 0 4px;}

.rightList li a:hover {background-position:0 -11px;}
	
.tagList {
	margin-bottom: 5px;
	float:left;
	width: 232px;
	line-height: 1.7em;
	}
	
.tagList li{
	padding: 0px 5px 0px 1px;
	float:left;
	width: 110px;
	}

.rightPad {padding-top: 32px;}

.topBlock, .bottomBlock, .homeBlock, .blogBlock, .profileBlock, .formBlock, .contactBlock, .privacyBlock, .introBlock, .clientBlock, .workBlock, .servicesBlock{
	width: 468px;
	float: left;
	}	

.topBlock{min-height: 153px; height: auto !important; height: 153px;}
.workBlock, .profileBlock, .privacyBlock, .homeBlock, .bottomBlock {padding-bottom: 36px;}
.formBlock {padding-bottom: 10px;}
.privacyBlock {font-size: 0.8em; line-height: 1.4em;}
.privacyBlock ol {margin: 0px 0px 26px 22px;}
.privacyBlock li {margin-left: 0px;}

/* FOOTER ELEMENTS */

#footerShadow {
	float:left;
	width: 758px;
	height: 38px;
	margin: 0px 0px 0px 121px;
	display:inline;
	}
	
#footer {
	clear: both;
	float: left;
	width: 758px;
	padding: 14px 0px 12px 0px;
	font-size: 0.8em;
	border-top: solid #efefef 1px;
	}

#lastFm {
	float:left;
	width: 450px;
	padding: 0px 5px 0px 1px; /* To stop W cropping at start of sentence */
	color: #0eaae6;
	}
	
#bottomNav {float:right;}	
#bottomNav li {float:right;}
		
.navDivide {color: #efefef;}

/* ABOUT PAGE */
.bristolPics {float: right; padding-bottom: 27px;} /* Padding needs to change ie only stylesheet too */

/* CLIENTS PAGE */
.clientList {float:left; width:468px; line-height: 1.6em; padding:4px 0px 53px 0px;}
.clientList li{padding-right:10px; float:left; width:224px;}
.clientList h5 {width: 224px; height: 22px; padding-bottom: 1px;}

ul.clientLogoList {float:left;margin:10px 0 30px 0;width:468px;}
ul.clientLogoList li {float:left;padding-left:6px;width:152px;}
ul.clientLogoList li.first {padding-left:0}

/* CONTACT PAGE */
#map {
	margin-top: 36px;
	width: 466px;
	height: 286px;
	border: #a0a0a0 1px solid;
	}

.compInfo {
	padding:30px 0px 6px 0px;
	font-size: 0.8em;
	line-height: 1.4em;
	} 
	
/* MUSIC PAGE */
ul.recent-track {border-top:#e4e4e4 1px solid;;float:left;font-size:0.9em;margin-top:5px;padding-bottom:25px;width:100%}
ul.recent-track li {border-bottom:#dfdfdf 1px solid;margin-top:4px;padding-bottom:4px;}
ul.top-artists {float:left;font-size:0.9em;padding:5px 0 25px 0;width:100%}
ul.top-artists li {
	background:url("http://cdn.last.fm/flatness/picture_frame.png") no-repeat;
	float:left;
	margin: 0 6px 0 0;
	width:150px;
	min-height: 180px;
	height: auto !important;
	height: 185px;
	}
	
span.lastfm-frame {display:block;height:102px;margin-bottom:10px;position:relative;overflow:hidden;width:132px;}
span.lastfm-frame img {margin:2px 0 0 3px;}
span.lastfm-number {font-weight:bold;color:#0EAAE6}
span.lastfm-total-plays {font-size:0.9em;}
span.lastfm-artist-name {font-weight:bold;}

/* FONT CLASSES */
.bodytext {color: #404040;}
.bodytext p {margin: 0px 0px 21px 0px;}
p.bodytext {margin: 0px 0px 0px 0px;}
.bodytext a:link, .bodytext a:visited {color: #a0a0a0; text-decoration: underline;}
.bodytext a:hover, .bodytext a:active {color: #00adef; text-decoration: underline;}

.h2Pad {
	width: 234px;
	float:left;
	height:22px; /* FORCES DIV TO SHOW CORRECT HEIGHT WHILE SIFR IS LOADING AND ALSO FOR MAC FIREFOX WHICH HAS LARGE BOTTOM PADDING ON SIFR ELEMENTS*/
	}
.h2mainPad {
	width: 350px;
	float:left;
	height:22px; /* FORCES DIV TO SHOW CORRECT HEIGHT WHILE SIFR IS LOADING AND ALSO FOR MAC FIREFOX WHICH HAS LARGE BOTTOM PADDING ON SIFR ELEMENTS*/
	}
.h2Pad, .h2mainPad {padding-bottom: 5px;}
.h2TeamPad {padding-bottom: 10px;}

.h2extraPad {padding-bottom: 20px;}

.h4Pad, .h5Pad, .h5PadJob, .h4ContactPad, .h4ContactPadtop {
	float:left; 
	clear:both; 
	height:18px; /* FORCES DIV TO SHOW CORRECT HEIGHT WHILE SIFR IS LOADING AND ALSO FOR MAC FIREFOX WHICH HAS LARGE BOTTOM PADDING ON SIFR ELEMENTS*/
	}	
	
.h5Pad, .h5PadJob, .h5PadLanding, .h4ContactPad, .h4ContactPadtop {padding-bottom: 4px;}	
.h4Pad {padding-bottom: 5px;}	
.h5Pad, .h4Pad, .h4ContactPad, .h4ContactPadtop {width: 234px;}
.h5PadJob, .h5PadLanding {clear:both; width: 350px;}
.h5Pad {padding-top: 3px;}
.h4ContactPadtop {padding-top: 100px;}	/* joel 10/02/2010	*/	
.h4ContactPad {padding-top: 22px;}	
.h5ContactPad {width:234px; float:left; clear:both;}

.email a {background:url(../img/button-info.gif) no-repeat left top;float:left;height:20px;width:115px;text-indent:-9999px;}
	.email a:hover {background-position:left bottom;}


h2,h3 {
  margin:0; /* this is overridden when sIFR is active with the !important declaration */
  width: 100%;
}

h2 {
	color: #00adef;
 	font-size:22px;
	line-height:1em; /* this is overridden when sIFR is active with the !important declaration */
	}
h2 a:link, h2 a:visited {color: #00adef; text-decoration: none;}
h2 a:hover, h2 a:active {color: #00adef; text-decoration: underline;}

h3, h5 {
	font-weight: bold;
	font-size:17px;
	line-height:1em; /* this is overridden when sIFR is active with the !important declaration */
	}
	
h5 {font-size:15px;}	
	
h3 a:link, h3 a:visited {color: #a0a0a0; text-decoration: none;}
h3 a:hover, h3 a:active {color: #00adef; text-decoration: none;}
#down h3 a:link, #down h3 a:visited {color: #00adef; text-decoration: none;}	

h4 {
	color: #00adef;
	font-weight: bold;
	font-size:17px;
	line-height:1em; /* this is overridden when sIFR is active with the !important declaration */
	}
h4 a:link, h4 a:visited {color: #00adef; text-decoration: none;}
h4 a:hover, h4 a:active {color: #00adef; text-decoration: underline;}

h6 {color: #808080; font-weight: bold;}
h6.subtitle {padding-bottom: 9px;}
h6.privacy {padding-bottom: 9px; font-size: 1.4em;}

.showLink, .pageLink, .workLink {float:left; width: 233px; padding-left:1px;} 
.showLink a:link, .showLink a:visited, .showProfile a:link, .showProfile a:visited {color: #a0a0a0; text-decoration: none;}
.showLink a:hover, .showLink a:active, .showProfile a:hover, .showProfile a:active  {color: #00adef; text-decoration: underline;}
.workLink a:link, .workLink a:visited {color: #a0a0a0; text-decoration: underline;}
.workLink a:hover, .workLink a:active {color: #00adef; text-decoration: underline;}

.picCaption {width:468px; padding:2px 0px 0px 0px; font-size:0.8em; display:block;}

.blueText {color: #0eaae6;}

/* GENERIC STYLES */
.divider {
	width:758px; 
	float:left; 
	background-image:url(../img/divider.gif); 
	background-repeat:repeat-y; 
	background-position: 495px 0px; 
	margin-bottom: 30px;
	}

.bullets {margin-bottom: 21px;}
.bullets li,
.blogBlock ul li {
	display:block;
    background:transparent url(../img/bullet.gif) no-repeat;
    background-position:0px 12px;	
	padding: 4px 0px 6px 13px;
	color: #404040;
	}
	
.bullets.payperlead li {clear:both;margin:0;padding: 5px 0px 2px 13px;}	
.bullets li ul {clear:both;margin:5px 0 5px 0;width:100%}
	
a .alt, .none {display: none;}

.hidden {position: absolute; left: -1000em; width: 20em;}

.disabled {visibility: hidden;}

.pb24 {padding-bottom: 24px;}

.greyBorder {border: #efefef solid 1px;}

img.adwords {float:left; clear:both; padding-top:48px}
img.google_planner {float:left; clear:both; padding-top:20px}


table.adwords {border-collapse:collapse;font-size:0.9em;width:60%;}
	table.adwords thead tr {border:solid #EFEFEF;border-width:0 0 1px 0;}
	table.adwords td,th {padding:8px 0;text-align:left;}
	table.adwords th {font-size:1.1em;}
	table.adwords td {border-bottom:1px solid #EFEFEF;padding:4px 0;}
	table.adwords td b {color:#666;font-weight:bold;}


.top-panel-wrapper {
	background:url(../img/top-panel-fades.png) no-repeat center bottom;
	padding-bottom:8px;
	position:relative;
	width:100%;
	z-index:1;
	}
	
	.top-panel {
		height:36px;
		margin:0 auto;
		position:relative;
		text-align:center;
		width:996px;
		}
		
		.top-panel a {
			background:url(../img/logo-bray-leino-yucca.gif) no-repeat left top;
			height:23px;
			position:absolute;
			right:31px;
			text-indent:-9999px;
			top:7px;
			width:140px;
			}