* { padding: 0; margin: 0; }
a img { border: 0; }
body { color: #BCB4A9; background: #32291F; font-family: "Trebuchet MS"; font-size: 100%; margin: 10px 0 0 0; }
h1 { font-family: Calibri; font-size: 2.0em; font-weight: normal; color: #FDD001; letter-spacing: -0.03em; margin: 0 0 0.25em 0; }
h2 { font-family: Calibri; font-size: 1.6em; color: #FDD001; border-bottom: 0px solid #564C42; margin: 0 0 0.5em 0; clear: both;}
h2 span { padding: 2px 10px 2px 0; background:#322920;  }
h2 a:link { color: #FDD001; text-decoration: none; }
h2 a:hover { color: #8f6333; text-decoration: none; }
h3 { font-family: Calibri; font-size: 1.3em; color: #FDD001; margin: 0 0 0.75em 0; clear: both; }
h4,h5,h6 { font-family: Calibri; font-size: 0.9em; color: #FDD001; margin: 0 0 0.75em 0; }
p { line-height: 1.5em; margin: 0 0 1em 0; }
blockquote { font-style: italic; margin: 0 0 1em 0;}
blockquote span {display: block; font-style: normal; text-align: right;}
ul { margin: 0 0 1em 0;}
ol { margin: 0 0 1em 0;}
li { line-height: 1.5em; }
a:link { color: #FFFFFF; text-decoration: none; }
a:visited { color: #B99875; text-decoration: none; }
a:hover { color: #8F6333; text-decoration: underline; }
a:active { color: #FECE00; text-decoration: none;}
a:focus { color: #FFFF00; text-decoration: none;}

body#about #main ul {list-style: none;}
body#about #main ul li {padding: 0 0 0 15px; background: url(images/dot1.gif) no-repeat left;}



#wrapper { width: 960px; margin: 0 auto; clear: both;}
#header { float: left; width: 100%; font-size: 0.75em; padding: 0 0 1em 0; border-bottom: 1px solid #564C42; margin: 0 0 2% 0; clear: both;}
#subheader {float: left; width: 100%; padding: 0 0 2% 0; margin: 0 0 2% 0; clear: both;}
#content { width: 100%; font-size: 0.75em; padding: 1% 0 1% 0; clear: both;}
#sidebar { float: left; width: 220px; margin: 0 30px 0 0;}
#main { float: left; width: 700px;}
#mainwork { float: left; width: 640px;}
#mainblog { float: left; width: 480px; padding: 0 24px 0 0; border-right: 1px solid #564C42;}
#blogextra { float: right; width: 182px; text-align: center;}
#footer {float: left; width: 100%; font-size: 0.75em; padding: 1% 0 1% 0; background: #2A2118; border-top: 1px solid #564C42; border-bottom: 1px solid #564C42; margin: 0 0 1em 0; clear: both;}
#footerinner {width: 960px; margin: 0 auto;}

/* colour coding */
body#about #subheader { border-bottom: 5px solid #6DCFF6;}
body#work #subheader { border-bottom: 5px solid #D18BD2;}
body#blog #subheader { border-bottom: 5px solid #E37E2D;}
body#contact #subheader { border-bottom: 5px solid #C7FF5C;}

body#about ul.shnav li a {background: url(images/dot1.gif) no-repeat left;}
body#work ul.shnav li a {background: url(images/dot2.gif) no-repeat left;}
body#blog ul.shnav li a {background: url(images/dot3.gif) no-repeat left;}
body#contact ul.shnav li a {background: url(images/dot4.gif) no-repeat left;}

body#about ul.cats li a {background: url(images/dot1.gif) no-repeat left;}
body#work ul.cats li a {background: url(images/dot2.gif) no-repeat left;}
body#blog ul.cats li a {background: url(images/dot3.gif) no-repeat left;}
body#contact ul.cats li a {background: url(images/dot4.gif) no-repeat left;}

body#about ul.workcats ul li a {background: url(images/dot1.gif) no-repeat left;}
body#work ul.workcats ul li a {background: url(images/dot2.gif) no-repeat left;}
body#blog ul.workcats ul li a {background: url(images/dot3.gif) no-repeat left;}
body#contact ul.workcats ul li a {background: url(images/dot4.gif) no-repeat left;}

body#about h1 {color: #6DCFF6;}
body#about h2 {color: #FECE00;}
body#about h3 {color: #FECE00;}

body#work h1 {color: #D18BD2;}
body#work h2 {color: #FECE00;}
body#work h3 {color: #FECE00;}

body#blog h1 {color: #E37E2D;}
body#blog h2 {color: #FECE00; padding: 0 0 0.25em 0; border-bottom: 2px solid #D27225}
body#blog h3 {color: #FECE00;}

body#contact h1 {color: #C7FF5C;}
body#contact h2 {color: #FECE00;}
body#contact h3 {color: #FECE00;}

/* header bits */
.skiplinks {display: none;}
.logo { float: left; margin: 35px 60px 0 0;}
ul.nav {font-family: Calibri; float: right; width: 425px; list-style: none; margin: 0; }
ul.nav li img {display: block; margin: 0 auto;}
ul.nav li { float: left; width: 24.5%; text-align: center; line-height: 1.2em;}
ul.nav li a { display: block; font-size: 1.2em; font-weight: bold; text-decoration: none; padding-top: 100px;}
.line {border-right: 1px solid #564C42;}
a.nabout {background: url(/images/nav-about.gif) no-repeat top center;}
a.nwork {background: url(/images/nav-work.gif) no-repeat top center;}
a.nblog {background: url(/images/nav-blog.gif) no-repeat top center;}
a.ncontact {background: url(/images/nav-contact.gif) no-repeat top center;}
a.nabout:hover {background: url(/images/nav-about-on.gif) no-repeat top center;}
a.nwork:hover {background: url(/images/nav-work-on.gif) no-repeat top center;}
a.nblog:hover {background: url(/images/nav-blog-on.gif) no-repeat top center;}
a.ncontact:hover {background: url(/images/nav-contact-on.gif) no-repeat top center;}
body#about .nabout {background: url(/images/nav-about-on.gif) no-repeat top center;}
body#work .nwork {background: url(/images/nav-work-on.gif) no-repeat top center;}
body#blog .nblog {background: url(/images/nav-blog-on.gif) no-repeat top center;}
body#contact .ncontact {background: url(/images/nav-contact-on.gif) no-repeat top center;}

/* sub header */
.shtestimonial {float: left; width: 55%; padding: 0 3% 0 25px; border-right: 1px solid #564C42; margin: 0 3% 0 0; }
ul.shnav {float: right; width: 35%; font-family: Calibri; list-style: none; margin: 0;}
ul.shnav li {float: left; width: 45%; line-height: 2em; font-size: 1.1em; font-weight: bold; }
ul.shnav li a {padding: 0 0 0 15px;}

/* sidebar things */
.sidebar-title { color: #FDD001; }
ul.cats {font-family: Calibri; list-style: none; margin: 0 0 1em 0; }
ul.cats li {  }
ul.cats li a {display: block; line-height: 2em; padding: 0 0 0 15px; }
ul.news { list-style: none; margin: 0 0 1em 0; }
ul.news li { line-height: 1.5em; padding: 0 0 0.5em 0; border-bottom: 1px dashed #564C42; margin: 0 0 0.5em 0; }
ul.news li p {margin: 0;}
ul.news li a {font-weight: bold; padding: 0 0 0 15px; background: url(images/dot3.gif) no-repeat left;}
.rsslinks { display: block; padding: 0 0 0 1.75em; background: url(/images/rss.gif) no-repeat left;}

ul.workcats {list-style: none; margin: 0 0 1em 0; }
ul.workcats li {margin: 0 0 0 0; }
ul.workcats li a {display: block; font-family: Calibri; font-size: 1.3em; padding: 0 0 0.5em 0;}
ul.workcats ul {list-style: none; margin: 0; }
ul.workcats ul li {  }
ul.workcats ul li a {display: block; font-size: 1.0em; line-height: 1.5em; padding: 0 0 0 20px;}

/* main content area stuff */
.col3 {float: left; width: 31%; padding: 0 1% 0 1%; }
ul.list { list-style: none; margin: 0 0 1em 0;}
ul.list li { line-height: 2em; padding: 0 0 0 7.5%; background: url(images/dot1.gif) no-repeat left;}
.smalltext {font-size: 0.8em;}

/* bloggy */
.blog-entry {float: left; width: 100%; padding: 0 0 1em 0; border-bottom: 1px solid #564C41; margin: 0 0 1em 0;}
div.tweet {float: right; width: auto;}
.blog-author {margin: 0 0 0.5em 0;}
ul.social-sites {float: left; width: 98%; list-style: none; padding: 1%; background: #564C42; margin: 0 0 1em 0;}
ul.social-sites li {float: left; margin: 0 1em 0 0;}
.blogcomment {float: left; width: 96%; padding: 2%; background: #2A2219 ; margin: 0 0 1% 0;}
fieldset.addcomment {float: left; width: 100%; border: 1px solid #564C42; margin: 0 0 1em 0;}
fieldset.addcomment legend {font-size: 1.1em; font-weight: bold; color: #FDD001; padding: 0 10px; margin: 0 10px;}
div.addcomment {float: left; width: 96%; padding: 2%;}
fieldset.addcomment label {display: block; padding: 2px; clear: both;}
fieldset.addcomment input {float: left; padding: 2px; background: #DDDDDD; border: 1px solid #000000;}
fieldset.addcomment input:focus {background: #FDCE01; border: 1px solid #000000; }
fieldset.addcomment textarea {width: 98%; padding: 2px; background: #DDDDDD; border: 1px solid #000000;}
fieldset.addcomment textarea:focus {background: #FDCE01; border: 1px solid #000000; }
fieldset.addcomment .input-submit {font-size: 0.9em; font-weight: bold; background: #FDD001;}

/* work detail page */
.work-item {float: left; width: 100% border-bottom: 1px solid #564C42; margin: 0 0 1em 0;}
.work-item img {float: left; border: 1px solid #000000; margin: 0 20px 0 0;}
.work-image-main {float: left; width: 100%; padding: 0 0 1em 0; border-bottom: 2px solid #554B41; margin: 0 0 1em 0;}
.work-image-extra {float: left; width: 100%; padding: 5px 0 0 0; border-top: 2px solid #554B41; margin: 0  0 1em 0;}
.work-image-extra-thumb {float: left; width: 100px; height: 100px; line-height: 100px; text-align: center; margin: 0 5px 5px 0;}
.work-desc {float: left; width: 60%;}
.work-extra {float: right; width: 35%;}
#blogextra img {border: 1px solid #000000;}

/* case study listings */
.cs-listing {float: left; width: 182px; height: 240px; padding: 0 30px 1em 0; border-bottom: 1px solid #564C42; margin: 0 0 1em 0;}
.cs-listing img {display: block; border: 1px solid #000000; margin: 0 0 1em 0;}
.cs-listing .link {float: right; width: auto; font-weight: bold; padding: 0 0 0 15px; background: url(images/dot1.gif) no-repeat left;}

/* clients page */
ul.clients {float: left; width: 100%; list-style: none; margin: 0 0 1em 0;}
ul.clients li {float: left; width: 29%; margin: 0 4% 0 0;}
ul.clients h3 { padding: 0 0 0.25em 0; border-bottom: 1px solid #564C42;}
ul.clients ul {float: left; width: 100%; list-style: none; border-bottom: 1px solid #564C42; margin: 0 0 2em 0;}
ul.clients ul li {width: 100%; padding: 0 0 1em 0;}

/* portfolio */
.pf-listing {float: left; width: 192px; height: 200px; padding: 1em 30px 0 0; border-top: 1px solid #564C42; margin: 0 0 1em 0;}
.pf-listing img {display: block; border: 1px solid #000000; margin: 0 0 0.5em 0;}
.pf-listing p {margin: 0 0 0.5em 0;}
.pf-listing .viewlink {float: right; width: auto; font-weight: bold; padding: 0 0 0 15px; background: url(images/dot1.gif) no-repeat left;}

/* pagination */
.paginate {float: left; width: 100%; height: 25px; text-align: right; margin: 0 0 1em 0;}
.paginate b {display: block; float: left; height: 25px; font-weight: bold; text-align: center; line-height: 25px; color: #fff; text-decoration: none; padding: 0 10px; margin: 0 5px 0 0;} 
.paginate a {display: block; float: left; height: 25px; font-weight: bold; text-align: center; line-height: 25px; background: #564C42; color: #fff; text-decoration: none; padding: 0 10px; margin: 0 5px 0 0;} 
.paginate a:hover, a.current{ background: #FDCE01; color: #32291F; } 

/* cheesy team profiles */
.team {float: left; width: 100%; border-bottom: 0px solid #554B41; padding: 1em 0 0 0; margin: 0 0 1em 0;}
.teamphoto {float: left; width: 220px; text-align: center;}
.teaminfo {float: left; width: 400px;}
.teaminfo p {margin: 0 0 0.5em 0;}
.teaminfo strong {float: left; width: 30%; font-weight: bold; color: #FDD001;}

/* associates */
.associate {float: left; width: 100%; border-bottom: 0px solid #554B41; padding: 1em 0 0 0; margin: 0 0 1em 0;}
.associate-img {float: left; width: 220px; text-align: center;}
.associate-desc {float: left; width: 400px;}

/* testimonials */
.testimonials {float: left; width: 100%; border-bottom: 0px solid #554B41; padding: 1em 0 0 0; margin: 0 0 1em 0;}
.testimonials-img {float: left; width: 220px; height: 100px; text-align: center;}
.testimonials-desc {float: left; width: 400px;}

/* link */
body#about #main ul.links {float: left; width: 100%; list-style: none; margin: 0 0 1em 0;}
body#about #main ul.links li {float: left; width: 33%; padding: 0; background: none;}
body#about #main ul.links li ul {list-style: none;}
body#about #main ul.links li ul li {float: left; width: 100%; padding: 0; background: none;}

/* forms */
fieldset { float: left; width: 100%; background: url(images/bg-fieldset.gif); border: 1px solid #564C42; margin: 0 0 1em 0;}
legend {font-size: 1.0em; font-weight: bold; color: #FDD001; padding: 2px 10px; background: #32291F; border: 1px solid #564C42; margin: 0 10px;}
.formrow {float: left; width: 92%; padding: 1% 4% 1% 4%;}
.formrow-label {float: left; width: 25%; text-align: right; margin: 0 2.5% 0 0;}
.formrow-button {font-size: 0.9em; font-weight: bold; background: #FDD001;}
input { padding: 2px; background: #DDDDDD; border: 1px solid #000000;}
input:focus { background: #FDCE01; border: 1px solid #000000; }
textarea { padding: 2px; background: #DDDDDD; border: 1px solid #000000;}
textarea:focus {background: #FDCE01; border: 1px solid #000000; }

/* bottom things */
ul.bottom {float: left; width: 100%; list-style: none; margin: 0 0 1em 0;}
ul.bottom li.bottomcontact {float: left; width: 26%; height: 180px; padding: 0 2% 0 1%; border-right: 1px solid #564C40;}
ul.bottom li.bottomcustomer {float: left; width: 15%; height: 180px; padding: 0 2% 0 2%; border-right: 1px solid #564C40;}
ul.bottom li.bottomnewsletter {float: left; width: 21%; height: 180px; padding: 0 2% 0 2%; border-right: 1px solid #564C40;}
ul.bottom li.bottomseemore {float: left; width: 23%; height: 180px; padding: 0 0 0 2%;}
ul.bottom li.bottomseemore img {margin: 0 10px 0 0;}

ul.bottomlinks {width: 100%; font-size: 0.75em; text-align: center; margin: 0 auto 1em auto;}
ul.bottomlinks li {display: inline; padding: 10px;}

/* sitemap page */
.sitemap {list-style: none; padding: 0 20px;}
.sitemap h1 {margin: 0 0 20px 0;}
.sitemap ul {float: left; width: 100%; list-style: none; margin: 0 0 1em 0;}
.sitemap ul li {float: left; width: 25%;}
.sitemap ul li ul {float: left; width: 100%; list-style: none; margin: 0 0 1em 0;}
.sitemap ul li ul li {float: left; width: 100%;}



/*slideshow viewer*/
/*preload classes*/ 
.svw {width: 50px; height: 20px; background: #fff;} 
.svw ul {position: relative; left: -999em;} 
 
/*core classes*/ 
.stripViewer {position: relative; overflow: hidden;  margin: 0 0 5px 0; } 
.stripViewer ul { /* this is your UL of images */ 
margin: 0; padding: 0; position: relative; left: 0; top: 0; width: 1%; list-style-type: none; } 
.stripViewer ul li { float:left; } 
.stripTransmitter { overflow: auto; width: 1%; } 
.stripTransmitter ul { margin: 0; padding: 0; position: relative; list-style-type: none; }
.stripTransmitter ul li { width: 25px; float: left; margin: 0 5px 0 0; } 
.stripTransmitter a { font: bold 11px Verdana, Arial; text-align: center; line-height: 25px; background: #564C42; color: #fff; text-decoration: none; display: block; } 
.stripTransmitter a:hover, a.current{ background: #FDCE01; color: #32291F; } 
 
/*tooltips formatting*/ 
#tooltip { 
background: #fff; 
color: #000; 
opacity: 0.85; 
border: 5px solid #dedede; 
} 
#tooltip h3 {  
font: normal 10px Verdana;  
margin: 0;  
padding: 6px 2px;  
border: 0; 
}