/*-----------------------------------------------------------------------------
[client] Screen Stylesheet

version:   1.0
date:      01/03/07
author:    [your email]
email:     [you at domain dot com]
website:   [your domain]
version history: [location of file]
-----------------------------------------------------------------------------*/

/* Import other stylesheets
-----------------------------------------------------------------------------*/ 

/* @import url("typography.css"); */

/* Remove padding and margin */

body {
}

#wrapper {
	margin: 0px auto;
	width: 1000px;
	text-align: left; /* Resets center from body || used IE5 center content */
}
#header {
	width: 100%;
	background-image: url('header_bg.jpg');
	background-repeat: no-repeat;
	height: 150px;
	position: relative;
	margin-bottom: 2em;
}
#header #logo {
	padding: 15px 40px;
}
#header #contactdetails {
	float:right;
	text-align: right;
	margin: 1em;
	font-size: 1.25em;
	font-weight: bold;
}
#header #contactdetails #servicing  {
	font-size: 0.65em;
	font-weight: normal;
	color: #758a7f;
}
#products {
	margin-top: 3em;
}
#products .heading {
	width: 100%;
	background-color: #339964;
	padding: 0.1em 0 0.1em .25em;
	font-weight: bold;
	font-size: 1.25em;
	color: #ffffff;
}
#products .heading a, #products .heading a:visited {
	text-decoration: none;
	color: #ffffff;
}
#products .heading a:hover {
	text-decoration: underline;
	color: #ffffff;
}
.col1 img, .col2 img {
	margin-top: .5em;
}
.col1 {
	width: 100%;
	float: left;
	margin-right: -525px;
}
/* Wrapps around col1 to give the right margin we need - same width as col 2 */
.col1 .content {
	margin-right: 525px;
	padding-right: 0px;
}
.indent {
	margin-left: 15px;
}
.col2 { 
	width: 480px;
	float: right;
	margin-right: 5px;
	/* background: #d7dabd; */
}
.col2 image{margin-right: 0; padding-right: 0}
.col2 #guarantee {
	width:430px;
	float: right;
	margin-right: 0px;
	background-color: #c8d0cc;          /* if needed */
    border: 0px solid #ffffff;   /* if needed */
    -webkit-border-radius: 10px;    /* for Safari */
    -moz-border-radius: 10px;       /* for Firefox */
	font-size: 1.1em;
	padding: 20px;
	color: #339964;
	font-weight: bold;
	font-style: italic;
}
.col2 #guarantee #signature{
 	width:100%;
	font-style:italic;
	text-align: right;
	font-size: .9em;
	color: #758a7f;
}
.col2 #guarantee > .tl, .rounded_STYLE > .tr, .rounded_STYLE > .bl, .rounded_STYLE > .br
{
  width: 5px;
  height: 5px;
  position: absolute;
}

.rounded_STYLE > .tl
{
  background: url(/images/ui/rounded/STYLE-tl.png) top left no-repeat;
  top: 0;
  left: 0;
}

.rounded_STYLE > .tr
{
  background: url(/images/ui/rounded/STYLE-tr.png) top right no-repeat;
  top: 0;
  right: 0;
}

.rounded_STYLE > .bl
{
  background: url(/images/ui/rounded/STYLE-bl.png) bottom left no-repeat;
  bottom: 0;
  left: 0;
}

.rounded_STYLE > .br
{
  background: url(/images/ui/rounded/STYLE-br.png) bottom right no-repeat;
  bottom: 0;
  right: 0;
}
#content {
	width: 100%;
	margin: 20px 5px;
}
#footer {
	width: 970px;
	border-top: 3px solid #c8d0cc;
	margin: 30px 0px 0px 15px;
	font-size: .75em;
	color: #666666;
}
#footer a {
	text-decoration: none;
	color: #666666;
}
#footer a:hover {
	text-decoration: none;
	color: #c6c6c6;
}
.clearfix {
	display: block;
	clear: both;
}
/* Menu Styling */
#header #menu {
	position: absolute;
	bottom: 1.25em;
	right: 1em;
}
#header #menu ul li {
	display: inline;
	list-style-type: none;
	padding: 0 10px;
	border-left: 1px solid #ffffff;
}
#header #menu #first {
	border-left: 0;
	color: #cfcfcf;
}
#header #menu ul li a {
	font-weight: bold;
	font-size: 1.25em;
	color: #ffffff;
	text-decoration: none;
}
#header #menu ul li a:hover {
	color: #339964;
	text-decoration: underline;
}