@charset "UTF-8";
/* CSS Document */

/* =Reset Styles - Thank you Eric Meyer (http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/) */

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,
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-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
:focus {
	outline: 0;
}
body {
	color: black;
	font-size:1em;
	font:61% Helvetica Neue, Helvetica, Arial, sans-serif, sans-serif ;
}

ol, ul {
	list-style: none;
}
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

p strong {
	font-weight:bold;
}


/*MAIN STYLES*/

body {
	background: #fff;
	padding:0;
	text-align:center;
	background:url(../images/topBlackStrip.gif) top repeat-x;
}

#container {
	width:900px;
	margin:0 auto;
	text-align:left;
	position:relative;
}



/*main text Styles */


p{
	margin: 0 0 1.2em 0;
	font-size:1.3em;
	line-height:1.5em;
	color:#666666;
}


/*main link Styles*/

a {
	color:#666666;
	text-decoration:underline;
}

#index a:visited {
		color:#666666;
}

#index a:hover{
	color:#009987;
	cursor:pointer;
}


/*main heading Styles*/

h1 {
	display:none;
}

h2 {
	color: #666666;
	font-size:2em;
	margin-bottom:20px;
}

h3 {
 display:inline-block;
  background:transparent none 0 0 no-repeat;
  text-indent:-3000px;
  font:0/0 Arial;
  overflow:hidden;
  vertical-align:bottom;
}

h4 {
	font-size:1.6em;
	color:#666666;
	margin:0 0 10px 0;
}

/*SECTIONS */


/*Masthead */

#masthead {
	background:url(../images/banner_main.gif) left top no-repeat; 
	margin:0 auto;
	width:900px;
	padding:166px 0 0 0;
	list-style:none;
}

#masthead ul {
	width:900px;
	float:left;
	background: url(../images/nav_rightblend.gif) right bottom no-repeat;
	border-bottom:35px solid #fff;
	height:auto;
	overflow:hidden;
}

#masthead ul li {
	display:inline;
}

#masthead ul li a {
	color:#FFF;
	font-size:1.4em;
	float:left;
	height:27px;
	padding:8px 18px 0px 18px;
	text-decoration:none;
	background: url(../images/nav_divider.gif) left center no-repeat;
	
}

#masthead ul li a:hover {
	color:#009987;
}

#masthead ul li #currentpage{
	position:relative;
	color:#009987;
}

#masthead ul li #currentpage img{
	position:absolute;
	left:50%;
	margin-left:-7px;
	bottom:-1px;
}

#masthead ul .leftButton {
	border-left:none;
	background: url(../images/nav_leftblend.gif) left bottom no-repeat;
}

img.van {
	position:absolute;
	top:5px;
	right:5px;
}


/*Main Content */

#index #mainContent{
	background:none;
	padding:40px 40px 90px 40px;
	width:820px;
	height:auto;
	overflow:hidden;
}

#index #mainContent a{
	position:relative;
	font-size:2.2em;
	width:105px;
	min-height:125px;
	float:left;
	padding:40px 30px 0 0;
	line-height:1.3em;
	background:url(../images/enterarrow.gif) left top no-repeat;
	text-decoration:none;
}

#index #mainContent a:hover{
	background: url(../images/enterarrow_green.gif) left top no-repeat;
}

*html #index #mainContent a{height:125px;}


#index #mainContent a span {
	text-decoration:underline;
	position:absolute;
	left:0px;
	bottom:0px;
	font-size:.7em;
}

#mainContent{
	background:url(../images/maincont_topcurve.gif) left top no-repeat;
	padding:20px 20px 14px 20px;
	width:535px;
	height:auto;
	overflow:hidden;
	
}




#mainContent_bground{
	float:left;
	background:url(../images/botmaincurve.gif) left bottom no-repeat;
	padding:0 0 9px 0;
}

#mainContent ul li { background:url(../images/listbullet1.gif) no-repeat 0px 5px;position:relative;padding-left:15px; font-size:1.3em; list-style:none; line-height:1.5em;  margin-bottom:0px;	color:#666666;}
#mainContent ul { margin-bottom:15px;}

/*Sidebar Section */

#sidebar{
	width:307px;
	float:right;
}


#contactUs {
	background:url(../images/sidegreenblend.gif) left top no-repeat;
	height:auto;
	overflow:hidden;
	min-height:168px;
	padding:30px 15px 0 15px;
}

*html #contactUs{height:168px;}


#contactUs p {
	color:#FFF;
	height:auto;
	overflow:hidden;
	margin:6px 0 0 0;
}

#contactUs h3 + p {
	font-size:2.8em;
	margin-bottom:0;
}

#contactUsbground {
	padding-bottom:8px;
	background:url(../images/sidegreenblend_bot.gif) left  bottom no-repeat;
}


#map a {
	display:inline-block;
	text-decoration:none;
	font-size:1.2em;
	padding-top:0;
}

/*contact form*/
#contactUs form {margin-top:9px;}
form label{ display:block;width:105px; float:left; font-size:.9em; clear:right; padding-top:1px;}
form input { background-color:#f7fefd; border: 1px solid #bfbfc1; width:161px; font-size:1em; font-family:Helvetica, Arial, sans-serif; float:right;  height:14px; padding:4px 2px 0;}
form input#postcode { width:100px; float:left; margin-left:5px; display:inline; }
form input:focus {background-color:#f2fdd8; border:1px solid #000000}
form  textarea:focus {background-color:#f2fdd8; border:1px solid #000000}
form textarea { background-color:#f7fefd; border: 1px solid #bfbfc1; width:266px; font-size:1em; font-family:Helvetica, Arial, sans-serif; float:right; margin-bottom:10px; height:60px; padding:4px 2px 0;}
form #submit {width:50px; margin-left:5px; border:none; height:22px;margin-bottom:0;padding:0; background:none;}
#contact form p { overflow:hidden; height:auto;}
#contact form {width:380px; position:relative; padding:20px 0; height:auto; overflow:hidden;}
#contact form input, #contact form textarea {width:266px; margin:0;}
#contact form #submit {width:50px; position:absolute; right:0px; bottom:0px;}
/*areas covered*/

#areasCoverbground {
	margin:20px 0;
	background:url(../images/areascoverbground_bot.gif) left bottom no-repeat;
	padding-bottom:8px;
}

#areasCover {
	min-height:45px;
	background:url(../images/areascoverbground.gif) left top no-repeat;
	height:auto;
	overflow:hidden;
	padding:30px 15px 0 15px;
}

*html #areasCover {
	height:45px;
}

#areasCover p {
	width:175px;
	margin-bottom:0;
}

#areasCover a {
	font-size:.9em;
	text-decoration:underline;
}

/*services include*/

.tabs-container img.filofax{
	position:absolute;
	top:-220px;
	right:-310px;
}

.tabs-container img.hard_hat{
	position:absolute;
	top:-250px;
	right:-290px;
}

.tabs-container img.toolbox{
	position:absolute;
	top:-230px;
	right:-280px;
}

.tabs-container img.van{
	position:absolute;
	top:-261px;
	right:-340px;
}


#servicesIncludebground{
	margin:20px 0;
	background: url(../images/ourservicesbground_bot.gif) left bottom no-repeat;
	padding-bottom:11px;
}

#servicesInclude {
	min-height:277px;
	background:url(../images/ourservicesbground.gif) left top no-repeat;
	height:auto;
	overflow:hidden;
	padding:24px 15px 0 13px;
}

*html #servicesInclude {
	height:277px;
}

#servicesInclude  a {
	font-weight:bold;
	font-size:1.4em;
	text-decoration:none;
}

#servicesInclude  a:hover {
	cursor:default;
}

#servicesInclude ul {
	margin:10px 10px 0 0;
	float:left;
	width:125px;
}


#servicesInclude h3 + ul {
	margin-right:15px;
}

#servicesInclude ul li {
	margin-top:6px;
	padding:8px 0 0 45px;
	height:30px;
}

  li.plumbing {background:url(../images/icons/plumbing.png) left top no-repeat;}
  li.roofing {background:url(../images/icons/roofing.png) left top no-repeat;}
  li.glazing {background:url(../images/icons/glazing.png) left top no-repeat;}
  li.locksmiths {background:url(../images/icons/locksmiths.png) left top no-repeat;}
  li.electricians {background:url(../images/icons/electricians.png) left top no-repeat;}
  li.carpentry {background:url(../images/icons/carpentry.png) left top no-repeat;}
  li.plastering {background:url(../images/icons/plastering.png) left top no-repeat;}
  li.decorations {background:url(../images/icons/decorations.png) left top no-repeat;}
  li.cleaning {background:url(../images/icons/cleaning.png) left top no-repeat;}
  li.upholstery {background:url(../images/icons/upholstery.png) left top no-repeat;}
  li.restoration {background:url(../images/icons/restoration.png) left top no-repeat;}
  li.heating {background:url(../images/icons/heating.png) left top no-repeat;}
  li.tiling {background:url(../images/icons/tiling.png) left top no-repeat;}
  li.flooring {background:url(../images/icons/flooring.png) left top no-repeat;}
  li.bricklaying {background:url(../images/icons/bricklaying.png) left top no-repeat;}


/*tabbed services page*/
/* Caution! Ensure accessibility in print and other media types... */
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */


    .tabs-hide {
        display: none;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .tabs-nav {
        display: none;
    }
}


/* Skin */

#services #mainContent {
	position:relative;
	overflow:visible;
}

ul#tablist {
	width:850px;
	position:absolute;
	top:-33px;
	left:-30px;
}

ul#tablist li {
	background:none;
}

ul#tablist li.tabs-selected a{
	color:#009987;
}

ul#tablist li a{
	font-weight:bold;
color:#666666;
}

.tabs-nav {
    list-style: none;
    margin: 0;
    padding: 0 0 0 4px;
}
.tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
.tabs-nav li {
    float: left;
    margin: 0 0 0 1px;
    min-width: 84px; /* be nice to Opera */
}
.tabs-nav a, .tabs-nav a span {
    display: block;
    padding: 0 10px;
    background: url(../images/tab.png) no-repeat;
}
.tabs-nav a {
    position: relative;
    top: 1px;
    z-index: 2;
    padding-left: 0;
    color: #000;
    font-size: 13px;
    font-weight: normal;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    white-space: nowrap; /* required in IE 6 */    
}


.tabs-nav a span {
    width: 64px; /* IE 6 treats width as min-width */
    min-width: 64px;
    height: 18px; /* IE 6 treats height as min-height */
    min-height: 18px;
    padding-top: 6px;
    padding-right: 0;
}
*>.tabs-nav a span { /* hide from IE 6 */
    width: auto;
    height: auto;
}

.tabs-nav .tabs-selected a span, .tabs-nav a:hover span, .tabs-nav a:focus span, .tabs-nav a:active span {
    background-position: 0 -50px;
}
.tabs-nav a span, .tabs-nav .tabs-disabled a:hover span, .tabs-nav .tabs-disabled a:focus span, .tabs-nav .tabs-disabled a:active span {
    background-position: 0 0;
}
.tabs-nav .tabs-selected a:link, .tabs-nav .tabs-selected a:visited, .tabs-nav .tabs-disabled a:link, .tabs-nav .tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
.tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}
.tabs-nav .tabs-disabled {
    opacity: .4;
}
.tabs-container {
 position:relative;
 background:#FFF;
	/* declare background color for container to avoid distorted fonts in IE while fading */
}

.tabs-container img {
	margin:10px 0 20px 0;
}

.tabs-loading em {
    padding: 0 0 0 20px;
    background: url(images/loading.gif) no-repeat 0 50%;
}


ul {	line-height:1.6em;
}



#tablist {
	display:none;
}

/*News*/

div.news_story {
	margin-bottom:30px;
}

/*Case studies*/

a.cslink { position:relative; margin-left:4px; padding-left:8px; background:url(../images/casestudies_divider.gif) left 2px no-repeat; font-size:1.2em; font-weight:bold; text-decoration:none;}
p + a.cslink, h2 + a.cslink, ul + a.cslink  {margin-left:0px; padding-left:0px; background:none;}
#fancy_content h4{ margin:30px 0 20px 40px; color:#666; font-size:2.2em;}
div#fancy_div p{padding:0 40px;width:560px;}
div#fancy_div img{margin:15px 40px;}
/*footer*/

#index #footer {
	width:860px;
	padding:20px 0 15px 40px;
	background:#bed73b url(../images/footerbground.gif) bottom repeat-x;
}

#index #footer p{
	color:#FFF;
}


#footer {
	float:left;
	width:575px;
	margin:20px 0 0 0;
	font-size:.9em;
}

#footer p {
	line-height:1.4em;
	margin-bottom:7px;
}

#footer img{
	margin-left:5px;
	float:right;
}