/*    
Theme Name: Clear Blue Designs 2009 
Theme URI: http://www.clearbluedesigns.co.uk/
Description: Re-design of Clear Blue Designs
Author: Tom Bathgate
Author URI: http://www.clearbluedesigns.co.uk/
Version: 1.0  
*/
html, body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, fieldset {
	margin: 0;
	padding: 0;
	border: 0;
	}
body {
	background:url(images/background.jpg) fixed;
	font-family:Tahoma, Geneva, sans-serif;
	font-size: 14px;
	color:#000000;
}
h1 {
	font-size: 160%;
	}
	h2 {
	font-size: 140%;
	}
	h3 {
	font-size: 130%;
	}
	p {
	line-height: 150%;
	}
	li {
		list-style-type:square
	}
	.titles {
	color:#fff
	}
#wrapper {
	width:860px;
	margin:10px auto;
	height:auto;
	position:relative;
}
#header {
	width:100%;
	height:120px;
	display:block;
}
#header a {
color:#fff;
text-decoration:none
}
#header a:hover {
text-decoration:underline
}
#logo {
	width:271px;
	float:left;
}
#logo img {
	border:0
}
/* navigation styles */
#navigation {
	width:480px;
	float:left;
	position:relative;
	left:130px;
	margin: 0;
	padding: 0;
	list-style: none;
	display: inline;
	overflow: hidden;
	color:#000
}
#navigation ul li {
	margin: 0; 
	padding: 0;
    list-style: none;
	display: inline;
}
#navigation ul li a {
float: left;
	padding: 37px 0 0 0;
	overflow: hidden;
	color:#000;
	height: 0px !important; 
	height /**/:37px; /* for IE5/Win only */
}
a#home {
width:71px;
height:37px;
background:url(images/home.png) no-repeat;
}
a#home:hover {
	background:url(images/home.png) no-repeat;
	background-position: 0 -40px;
}
a#about {
	width:86px;
	height:37px;
	background:url(images/about.png) no-repeat;
}
a#about:hover {
	background:url(images/about.png) no-repeat;
	background-position: 0 -40px;
}
a#services {
	width:96px;
	height:37px;
	background:url(images/services.png) no-repeat;
}
a#services:hover {
	background:url(images/services.png) no-repeat;
	background-position: 0 -40px;
}
a#portfolio {
	width:94px;
	height:37px;
	background:url(images/portfolio.png) no-repeat;
}
a#portfolio:hover {
	background:url(images/portfolio.png) no-repeat;
	background-position: 0 -40px;
}
a#contact {
	width:86px;
	height:37px;
	background:url(images/contact.png) no-repeat;
}
a#contact:hover {
	background:url(images/contact.png) no-repeat;
	background-position: 0 -40px;
}
/* end of navigation */
/*contact details */
#contactdetails {
	width:550px;
	float:left;
	position:relative;
	left:20px;
	top:10px;
	color:#fff;
	font-size:12px;
	}
	#contactdetails img {
		float:left;
		width:20px;
		height:20px
	}
	p#skype {
		height:20px;
		line-height:20px;
		width:90px;
		float:left;
	}
	p#twitter {
		height:20px;
		line-height:20px;
		width:115px;
		float:left;
	}
	p#email {
		height:20px;
		line-height:20px;
		width:185px;
		float:left;
	}
	p#phone {
		height:20px;
		line-height:20px;
		width:110px;
		float:left;
	}
.breadcrumb {
margin-bottom:10px; 
}
.white {
color:#fff
}
.white a {
color:#fff
}
.padding-left {
padding-left: 10px;
}
.addthis_container {
	background:none;
	margin-left:10px;
}
#contentwrapper {
	height:auto;
}
/* featured content */
#featuredcontent {
	height:260px;
	background:url(images/banner_back.png) center no-repeat;
	position:relative;
	z-index:10;
}
h1#smallheader {
	width:235px;
	position:relative;
	top:45px;
	left:60px;
	float:left
}
#slides{
	position:relative;
	top:25px;
	left:50px;
	float:left;
	overflow:scroll;
	height:195px;
}
#slides img {border:0}
#slides ul, #slides li{
	margin:0;
	padding:0;
	list-style:none;
	}
#slides li{ 
	width:490px;
	height:195px;
	overflow:hidden; 
	}
	#slides li span {
		width:215px;
		height:160px;
		float:right;
		z-index:10;
	}
	#slides li a img {
		float:left;
		position:relative;
		padding-right:10px;
		z-index:10;
	}
	#slider li h3, p {
	padding-left:10px;
	}
/* image replacement */
        .graphic, #prevBtn, #nextBtn{
            margin:0;
            padding:0;
            display:block;
            overflow:hidden;
            text-indent:-8000px;
            z-index:1;
            }
/* // image replacement */	
#prevBtn, #nextBtn{ 
	display:block;
	width:69px;
	height:34px;
	position:relative;
	z-index:1;
	}
	#prevBtn {
	left:-155px;
	top:180px;
}
#nextBtn{ 
	left:-20px;
	top:145px;
	}														
#prevBtn a, #nextBtn a{  
	display:block;
	width:69px;
	height:34px;
	background:url(images/backarrow.gif) no-repeat 0 0;	
	}	
#nextBtn a{ 
	background:url(images/nextarrow.gif) no-repeat 0 0;	
	}
	/* featured content end */
#content {
	height:auto;
	position:relative;
	margin-left:24px;
	z-index:5;
	padding-bottom:5px;
}
#content p {margin:0 0 15px 0}
.narrow {
	width:545px;
	background: url(images/contentback.png) repeat;
	float:left
}
.plain {
background: none
}
.wide {
	width:800px;
	background:#fff;
margin-top:-55px;
padding-top:35px;
}
.portfolio {
	width:800px;
	background: url(images/contentback.png) repeat;
}
table
{
border-collapse:collapse;
background: #f7f7f7;
border: 1px solid #000;
}
tr.grey td {
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	background: #f7f7f7;
	}
td {
	border-bottom: 1px solid #000;
	padding: 0 0.5em;
	}
td:first-child {
	width: 140px;
	}
td+td {
	border-left: 1px solid #CCC;
	text-align: center;
	}
#col1 {
	float:left;
	width:30%;
	margin-top:20px;
	margin-left:20px;
	margin-bottom:10px;
}
#col2 {
	width:30%;
	float:left;
	margin-top:20px;
	margin-left:20px;
	margin-bottom:10px;
}
#col2 ul {
margin-left:10px;
}
#col2 ul li {
padding-bottom:10px;
}
#col3 {
	width:30%;
	float:left;
	margin-top:20px;
	margin-left:20px;
	margin-bottom:10px;
}
.black {
	width:100%;
	height:37px;
	line-height:37px;
	background:#000;
	color:#fff;
	text-align:center;
	text-transform:uppercase;
}
.blue {
	width:100%;
	height:37px;
	line-height:37px;
background:#0083a9;
color:#fff;
text-align:center;
text-transform:uppercase;
	}
	.clear {
		clear:both
	}
	#sidebar {
		width:247px;
		height:auto;
		float:left;
		margin-left:10px
	}
	ul#sidenav li {
		list-style-type:none;
	}
	#sidebar ul#sidenav li a {
display:block;
height:37px;
padding-bottom:10px;
padding-left:10px;
color:#fff;
font-size:18px;
font-weight:bold;
line-height:37px;
text-decoration:none
	}
	a#one, a#two, a#three, a#four, a#five, a#six {
		background: url(images/subnav1.png) no-repeat;
	}
	#sidebar ul#sidenav li a:hover {
	color:#000	
	}
	#footer {
	background: url(images/contentback.png) repeat;
	margin-left:24px;
width:800px;
height:145px;
text-align:right;
display:block;
margin-top:10px;
float:left;
font-size:80%
}
#footer p {
line-height:40px;
padding-right:10px;
}
.padding {
	padding:10px;
}
.paddingsm {
	padding:7px;
}
.padding-left {
	padding-left:10px;
	padding-bottom:5px;
}
.clear {
	clear:both
}
.aligncenter { display: block; margin-left:auto; margin-right:auto }
.alignleft {float:left; padding-right:10px;}
.alignright {float:right; padding-right:10px;}
/* portfolio section */
ul#clients {
		width: 780px;
		float: left;
		padding-left: 9px;
		margin:0 auto;

	}
		ul#clients li {
			list-style: none;
			float: left;
			margin: 15px 0 5px 0;
			padding: 0 12px 0px 0;
			background: transparent url(images/line.jpg) no-repeat right top;

		}
			html>body ul#clients li{ margin-right: 10px; }
			ul#clients li.last{
				margin-right: 0;
				padding: 0px;
				background: none;
				border:none
			}
			ul#clients li .thumbnail {
				background: url(images/frame.png) no-repeat;
				display: block;
				height: 162px;
				width: 238px;
			}
				ul#clients li .thumbnail img { border-style: none; padding:15px }
	.details{
		text-align: center;
		float: left;
		width: 238px;
		padding: 0px;
	}
		.details h3{
			font-size: 15px;
			font-weight: bold;
			margin: 6px 0 0 0;
			padding: 0 0 10px 0;
		}
		.details h3 a {
		text-decoration:none;
		color:#fff
		}
		.details h3 a:hover {
		text-decoration:underline;
		}
.port_black {
	width:100%;
	height:37px;
	line-height:37px;
	background:#000;
	color:#fff;
	text-transform:uppercase;
}
.port_blue {
	width:100%;
	height:37px;
	line-height:37px;
background:#0083a9;
color:#fff;
text-transform:uppercase;
	}
#portfolioside, #blogsidebar {
		width:247px;
		height:auto;
		float:left;
		margin-left:10px;
		background: url(images/subnav1.png) repeat;
	}
	#portfolioside {
	list-style: none;
	}
	#portfolioside ul li {
	padding-left:25px;
	padding-top:5px;
	padding-bottom:5px;
	background: url(images/bullet.gif) 0 2px no-repeat;
	list-style-type:none;
	}
	#blogsidebar ul li {
		padding:10px;
		list-style-type:none
	}
	.divider {
		width:40%;
		border:0;
		color: #000;
background-color: #000;
height: 1px;
clear:both
	}
	.detailed {
		height:30px;
		line-height:30px;
		margin: 5px 0 5px 0;
		float:left;
	}
	.detailed img {
		float:left;
		width:30px;
		height:30px;
	}
	li.cat-item {
	height: 30px;
	line-height: 30px;
	background: url(images/folder.png) left no-repeat;
	padding:0;
	margin:0
}
li.cat-item a {
	display:block;
	height: 30px;
	line-height: 30px;
	border-bottom: 0;
	padding-left:35px;
	color:#000;
	text-decoration:none;
	font-size:16px;
}
li.cat-item a:hover, li.cat-item a:active {
	color: #FFF;
	text-decoration:underline;
}
li.widget_tag_cloud a {
	color: #000;
	text-decoration:none;
}
li.widget_tag_cloud a:hover, li.widget_tag_cloud a:active {
	color: #FFF;
}
#respond {
	margin-top:20px;
}
#comment {
	width:500px;
	margin-bottom:10px;
}
.post, .page {
	float: left;
	width: 500px;
	padding: 10px;
	margin: 0 0 15px;
	color: #000;
}
.portfolio-post {
	float: left;
	width: 510px;
	padding: 10px;
	margin: 0 0 15px;
	color: #000;
	background: url(images/contentback.png) repeat;
}
.posted {
	float: left;
	padding: 10px;
	margin: 0 auto;
	color: #000;
}
.post, .posted h2 a {
	color: #FFF;
	border-color: #FFF;
}
.post, .posted small {
	color: #000;
	line-height: 1.3em;
	display: block;
	margin-bottom: 10px;
}
.post img {
	border: 8px solid #FFF;
	margin-top: 5px;
}
.thumbnail {
background: #fff;
width:208px;
height:133px;
}
.post-thumbnail {
width:208px;
height:133px;
margin-left:15px;
float:right;
}
.odd {
float:right;
margin:0 0 1em 1em;
}
.even {
float:left;
margin:0 1em 1em 0;
}
.thumbnail img {
width:188px;
height:120px;
 display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top:6px;
	padding:5px;
}
.post ul {
	list-style-type: disc;
	list-style-position: inside;
	margin: 15px;
}
.post ol {
	list-style-type: decimal;
	list-style-position: inside;
	margin: 15px;
}
.post blockquote {
	width: 90%;
	margin: 25px auto;
	font-family: Georgia, serif;
	font-style: italic;
	font-size: 1.2em;
}
.post p {
	padding:0;
	margin:0
}
input#submit {
background:#ffb70f;
border:none;
color:#fff;
font-size:18px;
height:37px;
}
.tagzone a, .postmetadata, .postmetadata a {
	color: #000;
	border-color: #8DB135;
}
.tagzone a:hover, .postmetadata a:hover {
	color:#fff
}
.wpcf7-form, .text{
	width:90%
}
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> global settings needed for thickbox <<<-----------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
*{padding: 0; margin: 0;}
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_window {
  font: 12px Arial, Helvetica, sans-serif;
  color: #333333;
}
#TB_secondLine {
  font: 10px Arial, Helvetica, sans-serif;
  color:#666666;
}
#TB_window a:link {color: #666666;}
#TB_window a:visited {color: #666666;}
#TB_window a:hover {color: #000;}
#TB_window a:active {color: #666666;}
#TB_window a:focus{color: #666666;}
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay {
  position: fixed;
  z-index:100;
  top: 0px;
  left: 0px;
  height:100%;
  width:100%;
}
.TB_overlayMacFFBGHack {background: url(macFFBgHack.png) repeat;}
.TB_overlayBG {
  background-color:#000;
  filter:alpha(opacity=75);
  -moz-opacity: 0.75;
  opacity: 0.75;
}
* html #TB_overlay { /* ie6 hack */
	 position: absolute;
	 height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
#TB_window {
  position: fixed;
  background: #ffffff;
  z-index: 102;
  color:#000000;
  display:none;
  border: 4px solid #525252;
  text-align:left;
  top:50%;
  left:50%;
}
* html #TB_window { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}
#TB_window img#TB_Image {
  display:block;
  margin: 15px 0 0 15px;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  border-top: 1px solid #666;
  border-left: 1px solid #666;
}
#TB_caption{
  height:25px;
  padding:7px 30px 10px 25px;
  float:left;
}
#TB_closeWindow{
  height:25px;
  padding:11px 25px 10px 0;
  float:right;
}
#TB_closeAjaxWindow{
  padding:7px 10px 5px 0;
  margin-bottom:1px;
  text-align:right;
  float:right;
}
#TB_ajaxWindowTitle{
  float:left;
  padding:7px 0 5px 10px;
  margin-bottom:1px;
}
#TB_title{
  background-color:#e8e8e8;
  height:27px;
}
#TB_ajaxContent{
  clear:both;
  padding:2px 15px 15px 15px;
  overflow:auto;
  text-align:left;
  line-height:1.4em;
}
#TB_ajaxContent.TB_modal{
  padding:15px;
}
#TB_ajaxContent p{
  padding:5px 0px 5px 0px;
}
#TB_load{
  position: fixed;
  display:none;
  height:13px;
  width:208px;
  z-index:103;
  top: 50%;
  left: 50%;
  margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
}
* html #TB_load { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}
#TB_HideSelect{
  z-index:99;
  position:fixed;
  top: 0;
  left: 0;
  background-color:#fff;
  border:none;
  filter:alpha(opacity=0);
  -moz-opacity: 0;
  opacity: 0;
  height:100%;
  width:100%;
}
* html #TB_HideSelect { /* ie6 hack */
	 position: absolute;
	 height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
#TB_iframeContent{
  clear:both;
  border:none;
  margin-bottom:-1px;
  margin-top:1px;
  _margin-bottom:1px;
}
/* cufon styles */
h1.title { font-size:30px; font-weight:normal; color:#ffffff; }
h1.title a { text-decoration:none; color:#ad1010; }
h1.title a:hover { color:#1d5cd1; }
h1 { font-size:24px; font-weight:bold; color:#000000; }
h1 a { text-decoration:none; color:#000000; }
h1 a:hover { color:#ffffff; }
div#col1 h3, div#col2 h3, div#col3 h3, h3.titles, h3.sliderhead, h2.titles { font-size:20px; font-weight:normal; color:#ffffff; text-align:center }
h3.sliderhead, h2.titles { font-size:20px; font-weight:normal; color:#ffffff; text-align:left }
div#col1 h3, div#col2 h3, div#col3 h3 { font-size:20px; color:#ffffff; text-align:center; line-height:37px; padding-top:10px; }
div#col1 h3 a, div#col2 h3 a, div#col3 h3 a, h3.titles a, h3.sliderhead a, h2.titles a { text-decoration:none; color:#000000; }
div#col1 h3 a:hover, div#col2 h3 a:hover, div#col3 h3 a:hover, h3.titles a:hover, h3.sliderhead a:hover, h2.titles a:hover { color:#ffffff; }
h2.widgettitle, div#content h2 { font-size:24px; font-weight:normal; color:#000000; }
div#content h2 { font-size:24px; font-weight:normal; color:#000000; padding-bottom:10px; text-align:left }
h2.widgettitle a, div#content h2 a { text-decoration:none; color:#000000; }
h2.widgettitle a:hover, div#content h2 a:hover { color:#ffffff; }
#portfolioside h3, #blogsidebar h3, #featuredcontent h3 { font-size:20px; font-weight:normal; color:#000000; }