/* Reset
-----------------------------------------------------------------------------------------------*/	
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } 
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }

/* Default styles
-----------------------------------------------------------------------------------------------*/	
body { background: #fff; color: #373737; font: 76%/1 "Trebuchet MS", Arial, Helvetica, sans-serif; }
hr { display: none; }
strong { font-weight: bold; }
em { font-style: italic; }
abbr, acronym { border-bottom: 1px dotted #999; cursor: help; }
input, textarea, select { font: 0.9em "Trebuchet MS", Arial, Helvetica, sans-serif; }
a, a:link, a:visited, a:active { color: #658085; text-decoration: none; }
a:hover { text-decoration: underline; }
.hide, #accessibility-nav { position: absolute; top: -9999em; left: -9999em; height: 1px; width: 1px; }
.clearfix:after, div#content:after { display: block; visibility: hidden; clear: both; height: 0; content: "."; }
.clearfix, div#content { height: 1%; } 

/* Layout
-----------------------------------------------------------------------------------------------*/		
div.container { text-align: left; font-size: 1em; } 
div#content { width: 960px; } 
	
/* Header
-----------------------------------------------------------------------------------------------*/	
div#header { height: 151px; border-bottom: 1px solid #000; background: #f2f5f5 url(../images/bg-header.jpg) repeat-x top left; }
div#header div.inner { width: 551px; margin: 0 auto; position: relative; }
div#header a, div#header a span { display: block; width: 551px; height: 121px; overflow: hidden; cursor: pointer; }
div#header a { color: #373737; text-transform: uppercase; font-size: 5em; font-weight: bold; letter-spacing: 2px; text-align: center; line-height: 2.2em; }
div#header a, div#header a span { position: absolute; top: 0; left: 0; }
div#header a { top: 14px; }
div#header a span { background: url(../images/logo.jpg) no-repeat; }

/* Middle
-----------------------------------------------------------------------------------------------*/	
div#middle { background: url(../images/bg-middle.jpg) no-repeat top center; height: 217px; }
div#middle div.inner { position: relative; width: 299px; margin: 0 auto; }
div#middle p, div#middle p span { display: block; width: 299px; height: 45px; overflow: hidden; }
div#middle p { color: #856d59; font-size: 2em; text-align: center; }
div#middle p em { display: block; color: #658085; font-size: 0.8em; }
div#middle p, div#middle p span { position: absolute; top: 0; left: 0; }
div#middle p { top: 17px; }
div#middle p span { background: url(../images/title_need-advertising.jpg) no-repeat; }
 

/* Navigation
-----------------------------------------------------------------------------------------------*/	
div#navigation { background: #000 url(../images/bg-colours.jpg) repeat-x bottom left; padding-bottom: 7px; text-align: center; }
div#navigation ul li { display: inline; font-size: 1.5em; font-weight: bold; } 
div#navigation ul li a { color: #dbd1bd; padding: 10px 20px; line-height: 2.5em; }
div#navigation ul li.current a { color: #88a2a6; }


/* Content
-----------------------------------------------------------------------------------------------*/	
div#content { width: 900px; margin: 0 auto; padding: 30px; line-height: 1.5; font-size: 1em; }
div#content p { padding: 0 0 15px; }
div#content h1 { color: #856d59; font-size: 2em; padding: 0 0 10px; text-align: center; }
div#content h2 { color: #658085; font-size: 1.6em; padding: 0 0 5px; }

div#content h2.radio { background: url(../images/h2-radio.jpg) no-repeat top center; padding-top: 80px; text-align: center; margin-top: 20px; }
div#content h2.web { background: url(../images/h2-web.jpg) no-repeat top center; padding-top: 80px; text-align: center; margin-top: 20px; }
div#content h2.print { background: url(../images/h2-print.jpg) no-repeat top center; padding-top: 80px; text-align: center; margin-top: 20px; }

div#content div.col1, div#content div.col2, div#content div.col3, div#content div.col-image { float: left; width: 263px; margin-right: 55px; }
div#content div.col3 { margin: 0; }

div#content div.col2-text { float: left; width: 526px; }

ul.portfolio li a img { border: 2px solid #856d59; }
ul.portfolio li { float: left; margin: 0 10px 10px; text-align: center; }
ul.services li { list-style: disc; text-align: center; }

/* the team */
div.the-team-photos { width: 590px; float: left; }
div.the-team-desc { float: right; width: 300px; }
div.the-team-photos ul li { float: left; margin: 0 20px 20px 0; position: relative; border: 1px solid #333; }
div.the-team-photos ul li, div.the-team-photos ul li span { width: 125px; height: 150px; overflow: hidden; }  
div.the-team-photos ul li span { background: url(../images/profiles.jpg) no-repeat top left; position: absolute; top: 0; left: 0; } 

div.the-team-photos ul li.ryan a:hover span,
div.the-team-photos ul li.ryan a.current span { background-position: 0 0; }
div.the-team-photos ul li.stace a:hover span,
div.the-team-photos ul li.stace a.current span { background-position: -125px 0; }
div.the-team-photos ul li.kc a:hover span,
div.the-team-photos ul li.kc a.current span { background-position: -252px 0; }
div.the-team-photos ul li.charles a:hover span,
div.the-team-photos ul li.charles a.current span { background-position: -378px 0; }
div.the-team-photos ul li.k-dawg a:hover span,
div.the-team-photos ul li.k-dawg a.current span { background-position: -504px 0; }
div.the-team-photos ul li.benyos a:hover span,
div.the-team-photos ul li.benyos a.current span { background-position: -630px 0; }
div.the-team-photos ul li.ling a:hover span,
div.the-team-photos ul li.ling a.current span { background-position: -749px 0; }
div.the-team-photos ul li.cripdog a:hover span,
div.the-team-photos ul li.cripdog a.current span { background-position: -875px 0; } 


div.the-team-photos ul li.ryan a span { background-position: 0 -150px; }
div.the-team-photos ul li.stace a span { background-position: -125px -150px; }
div.the-team-photos ul li.kc a span { background-position: -252px -150px; }
div.the-team-photos ul li.charles a span { background-position: -378px -150px; }
div.the-team-photos ul li.k-dawg a span { background-position: -504px -150px; }
div.the-team-photos ul li.benyos a span { background-position: -630px -150px; }
div.the-team-photos ul li.ling a span { background-position: -749px -150px; }
div.the-team-photos ul li.cripdog a span { background-position: -875px -150px; } 
 
 
form { text-align: center; }
form select, form textarea, form input { border: 1px solid #333; color: #333; padding: 2px; width: 150px; }
form textarea { width: 350px; }
form div { margin-bottom: 12px; }
form label { vertical-align: top; cursor: pointer; display: block; }


p.footer em { font-style: normal; }
p.footer { clear: left; text-align: center; padding: 50px; }