/*
	GutterMate CSS Screen Styles
	
	Table of Contents:
		typography, look & feel
		colours
		layout
		forms
		tables
		cross-sell panels
        RIGHTPANEL
		
*/

/* typography, look & feel */

body{
	font: normal normal normal 0.8125em Arial, Verdana, Helvetica, sans-serif;
	line-height:1.25em;
	margin:0;
	padding:0;
}
*.hidden{
	display:none;
}

h1 {
    color:#0052a3;
    line-height:1.3em;
    margin:0.2em 0;
    font-size:1.5em;
}

h2 {
    color:#59a51d;
    font-size:1.1em;
    line-height:1.3em;
    margin:8px 0 10px 0;
}

h3 {
	margin:0.2em 0;
	line-height:0.9em;
	color:#0052a3;
	font-size:1em;
}

h4
{
    color:#59A51D;
    font-size:1em;
    margin:2px 0 10px 0;
    line-height:1.3em;
}



hr{
	display:none;
}

p {
	margin:1em 0;
	padding:0;
    line-height:1.4em;
}
img{
	margin:0;
}

img.floatLeft
{
    float:left;
    margin:6px 6px 10px 0;
}

img.floatRight
{
    float:right;
    margin:6px 0 10px 6px;
}

a img{
	border:0;
}
a{
	margin:0;
	padding:0;
	font-weight:bold;
	text-decoration:underline;
}
a:hover{
	text-decoration:none;
}
a.active{
	text-decoration:none;
}
a.active:hover{
	text-decoration:underline;
}
a.gm-button{
	float:left;
	background-image:url(../assets/button_curveleft.gif);
	background-position:left bottom;
	background-repeat:no-repeat;
	line-height:1.23em;
	padding:5px 0pt 5px 1em;
	text-decoration:none;
}
a.gm-button:hover{
	background-image:url(../assets/button_curveleft.gif);
	background-position:left top;
	background-repeat:no-repeat;
	text-decoration:underline;
}
a.gm-button span{
	background:transparent url(../assets/button_curveright.gif) no-repeat scroll right bottom;
	padding-right:1em;
	padding-top:5px;
	padding-bottom:5px;
}
a.gm-button:hover span{
	background-image:url(../assets/button_curveright.gif);
	background-position:right top;
}
a.gm-buybutton{
	background-image:url(../assets/button_addtobasket.gif);
	background-repeat:no-repeat;
	display:block;
	padding:0.35em 1.5em 0.35em 3.5em;
	text-decoration:none;
	text-transform:uppercase;
	height:1%;
}
a.gm-buybutton:hover{
	background-position:-219px center;
	text-decoration:underline;
}
a.gm-emailbutton{
	background-image:url(../assets/button_sendmail.gif);
	background-repeat:no-repeat;
	padding:0.35em 2.5em 0.35em 3.5em;
	margin:0;
	text-decoration:none;
	text-transform:uppercase;
}
a.gm-emailbutton:hover{
	background-position:-226px center;
	text-decoration:underline;
}
abbr{
	cursor:help;
}

ul li{
	list-style-image:url(../assets/listicon.gif);
	line-height:1.4em;
	margin-bottom:6px;
}
#gm-container{
	background-image:url(../assets/side_shadow.gif);
	background-position:right top;
	background-repeat:repeat-y;
	border-left:2px solid #fff;
	padding-right:6px;
}
#gm-header{
	background-image:url(../assets/grad_content.gif);
	background-position:left bottom;
	background-repeat:repeat-x;
	height:100px;
	padding-bottom:25px;
}
#gm-header h1{
	font-size:0.5em;
	border:0;
	margin:0 2.5em;
	padding:1em 0 0 0;
}

#gm-header h1#logo{
	display:none;
}

#gm-header h2#telephone{
	font-size:1em;
	margin:0 1.2em;
	text-align:right;
	width:245px;
}
#gm-header ul{
	list-style:none;
	margin:0;
	padding:0;
}
#gm-header li{
	border-left:1px solid #3367cc;
	display:inline;
	font-size:0.9em;
	font-weight:bold;
	margin-left:0.3em;
	padding-left:0.3em;
}
#gm-header li.first{
	border:0;
	margin:0;
	padding:0;
}
#gm-header li a{
	text-decoration:none;
}
#gm-header li a:hover{
	text-decoration:underline;
}

/* Shopping Basket Panel */

#gm-header{
	position:relative;
}
#gm-header ul{
	position:absolute;
	right:0.5em;
	top:0.5em;
}

#gm-header #gm-shoppingbasket
{
	position:absolute;
	right:0;
	top:30px;
	width:400px;
	height:70px;
}

#gm-shoppingbasket a#buyButton {
    display:block;
    position:absolute;
    top:0;
    right:0;
	background-image:url(../assets/gm-buy-button.gif);
	background-repeat:no-repeat;
	background-position:left top;
	margin:0;
	padding:7px 0 0 0;
	text-align:center;
	width:200px;
	height:43px;
	color:#fff;
	font-size:2.2em;
	line-height:1.2em;
	text-decoration:none;
}

#gm-shoppingbasket a:visited#buyButton {
    color:#fff;
}

#gm-shoppingbasket a:hover#buyButton  {
    background-position:left bottom;
}

#gm-shoppingbasket p#buy-links {
    padding:0;
    float:right;
	font-weight:bold;
	margin:50px 0;
	text-align:center;
	font-size:0.85em;
}

/* END Shopping Basket Panel */

/* Logos */

#gmWtl
{
    width:112px;
    padding:14px;
}

#gmWtl img
{
    margin-top:30px;
}

/* END Water Technology List Logo */

#gm-mainmenu{
	background-image:url(../assets/grad_bluemenu.gif);
	background-position:left top;
	background-repeat:repeat-x;
	padding-top:1.9em;
	width:140px;
}
#gm-mainmenu h2{
	margin:0;
	padding:0;
}
#gm-mainmenu ul{
	background-image:url(../assets/curves_bluemenu.gif);
	background-position:center bottom;
	background-repeat:no-repeat;
	font-size:0.9em;
	font-weight:bold;
	margin:0;
	padding:10px 0 2em 1em;
	width:128px;
}
#gm-mainmenu ul li{
	list-style:none;
	list-style-image:none;
	padding:0.25em 0;
}
#gm-mainmenu li a{
	text-decoration:none;
	background-image:url(../assets/bluearrow.gif);
	background-repeat:no-repeat;
	background-position:left center;
}
#gm-mainmenu li a:hover{
	text-decoration:underline;
}


/* -------------------------------------------------------- Home Page */

#gm-homepage {
	padding:0 0.25em;
}


div.homepanel {
	padding:0;
	margin:20px 20px 0 0;
	width:570px;
	background-color:#393;
	overflow:hidden;
	height:373px;
}

div.homepanel > ul {
    list-style-type:none;
}

div.homepanel > ul > li {
    font-size:1.35em;
    color:#fff;
    list-style-image:url(../assets/big-list-bullet.gif);
}

p#calltoaction {
    padding:6px 0 6px 0;
    width:560px;
    font-size:1.5em;
    color:#0052a3;
    margin-top:20px;
    border:1px solid #0052a3;
    text-align:center;
}
p#calltoaction em {
    font-weight:bold;
    font-style:normal;
    font-size:1.6em;
}

p#calltoaction a {
    color:#0052a3;
}



/* -------------- Home End */

#gmBasket, gmBasketError{
	padding:0 1em;
}
#gm-content p.gm-backtotop{
	text-align:right;
}

#gm-content h3.installation-step{
	clear:both;
}
#gm-content img.installation-photo{
	float:right;
	margin:0 0 1em 1em;
}
#gm-content p.pdf{
	background-image:url(../assets/pdf_icon.gif);
	background-repeat:no-repeat;
	background-position:left top;
	padding-left:2em;
	margin:20px 0 20px 0;
	clear:both;
}
#gm-content p#clear{
	clear:both;
}
ul#gm-terms-menu{
	margin:2em 0;
	padding:0 0 0 3em;
}

/* BASKET ERROR */

td#gmBasketError h1
{
    color:#a00;
    width:100%;
    text-align:center;   
}

td#gmBasketError p
{
    color:#a00;   
    width:100%;
    text-align:center;    
}


#gmBasket h3{
	clear:left;
}
#gmBasket p.gm-button{
	float:left;
	width:100%;
}
ul#checkoutProgress{
	margin:1em 0;
	padding:0;
	position:relative;
	float:left;
	width:530px;
}
#checkoutProgress li {
	display:inline;
	float:left;
	font-weight:bold;
	padding:10px;
	text-align:center;
	width:112px;
}
#checkoutProgress li.active{
	text-decoration:underline;
}
#checkout-options{
	float:left;
	margin:0 0 1em 0;
	padding:0;
	list-style:none;	
	position:relative;
	width:100%;
}
#checkout-options li{
	clear:both;
	float:left;
	list-style:none;
	margin:0.5em 0;
}
li#checkout-continue{
	position:absolute;
	right:0;
}
#gm-basket-help div{
	padding-top:12px;
	margin-bottom:1em;
	background-image:url(../assets/curves_checkout_top.gif);
	background-position:center top;	
	background-repeat:no-repeat;
}
#gm-basket-help p{
	background-image:url(../assets/curves_checkout_bottom.gif);
	background-position:center bottom;
	background-repeat:no-repeat;
	margin:0 0.2em;
	padding:2em 1em 3em 1em;
}
#gm-basket-help img{
	margin-left:0.75em;
}
#gm-footer{
	font-size:0.85em;
	margin-bottom:2em;
	padding:5em 1em;
}
#gm-footer p{
	margin:0;
}
#gm-footer ul{
	margin:0;
	padding:0;
}
#gm-footer li{
	display:inline;
	border-left:1px solid;
	margin-left:0.5em;
	padding-left:0.5em;
}
#gm-footer li.first{
	border:0 none;
	margin:0;
	padding:0;
}


#gm-options, #gm-basket-help{
	width:210px;
	padding-right:3px;
	float:right;
}
#gm-options #gm-cards {
	clear:left;
	margin:1.5em 7px;
	text-align:center;
}
/********************************** */
/* colours */

body, th, #gm-shoppingbasket h2, #gmBasket li.active{background-color:#9c3;}
tr.alt, #gmBasket tr{background-color:#e3e1e2;}
#gm-container, #gm-shoppingbasket, #gm-footer{background-color:#fff;}
p#basket-summary, #checkoutProgress li, #gm-basket-help p{background-color:#e2f0c6;}
#gm-mainmenu ul{background-color:#eaf3fc;}
#gm-quickadd-content{background-color:#acd6fe;}
a.gm-button{background-color:#f8df35;}
a.gm-button:hover{background-color:#666;}
body{color:#333;}
a{color:#36c;}
h3, em.gm-form-required{color:#0052A3;}
a.gm-buybutton, #gm-quickadd a.moreinfo, 
#gm-header li a.active, #gm-mainmenu ul li.active a, 
a.gm-button, a.gm-emailbutton, a.active, #gm-content h3.installation-step, #gm-content h3.installation-step1{color:#000;}
#gm-quickadd h3, 
#gm-quickadd p#availability{color:#013366;}
h2#telephone{color:#999;}
#gm-footer, #gmBasket tr, #gmBasket td.basket-qty input, #gmBasket li{color:#666;}
th, #gm-shoppingbasket h2, #gm-panel-noladders a, 
p.gm-crosssell a, a.gm-buybutton:hover, a.gm-emailbutton:hover, 
#gmBasket li.active, a.gm-button:hover, #gm-panel-noladders a,
#gm-panel-freecarriage a, #gm-panel-nodanger a, #gm-panel-waterdiverter a, p.crosssellpanel a{color:#fff;}

/********************************** */
/* layout */

#gm-container{
	position:relative;
	width:760px;
	margin:0 auto;
}


#gm-mainmenu {
	position:absolute;
	top:7.7em;
	left:0;
}

#CheckoutError
{
    margin-left:150px;
}

#gm-homepage, #gm-content, #gmBasket, #gm-footer, #gmBasketError {
	margin-left:160px;
	margin-right:40px;
}
#gm-panel-noladders, #gm-panel-freecarriage, #gm-panel-nodanger, #gm-panel-waterdiverter{
	height:131px;
	left:11.1em;
	top:12em;
	position:absolute;
	width:188px;
}

#gmBasket, #gmBasketError, #CheckoutError{
	margin-right:40px;
	position:relative;
}
#gm-footer{
	clear:both;
}
#header-overhang{
	background:transparent url(../assets/overhang.gif) no-repeat scroll 0%;
	height:123px;
	position:absolute;
	right:-46px;
	top:0;
	width:46px;
}
#error404{
	margin:0 0 0 140px;
	padding:0 1em;
}
/********************************** */
/* forms */
form{
	margin:0;
	padding:0;
}
fieldset{
	border:0;
	margin:0;
	padding:0;
}
legend{
	display:none;
	margin:0;
	padding:0;
}
#gm-quickadd  select{
	margin:0.1em 0 0.1em 0.1em;
	width:6em;
}
input.submit{
	display:none;
}
form.gm-form ol{
	list-style:none;
	margin:0;
	padding:0;
}
form.gm-form ol li{
	margin:0.25em 0;
}
form.gm-form label{
	display:block;
	float:left;
	width:10em;
}
form.gm-form input, form.gm-form textarea{
	padding:0;
	margin:0;
	width:205px;
	border:1px solid #ccc;
}
form.gm-form p.checkbox{
	display:inline;
	float:left;
	margin-left:10em;
	width:20em;
}
form.gm-form p.checkbox input{
	border:0;
	float:left;
	width:auto;
}
form.gm-form p.checkbox label{
	display:inline;
	float:left;
	padding-left:1em;
	width:17em;
}
form.gm-form li input.checkbox{
	border:0;
	width:auto;
}
form.gm-form select{
	border:1px solid #ccc;
	width:15.5em;
}
form.gm-form select.half{
	width:7.6em;
}
form#checkout-form table input, form#checkout-form p input{
	width:auto;
}
a.gm-emailbutton{
	margin-left:10em;
}
em.gm-form-required{
	font-style:normal;
	font-weight:bold;
}

form.gm-form input#UseDeliveryAddress
{
    width:30px;
    display:inline;
}

#gmBasket .ErrorSummary
{
    margin-top:10px;
    border-top:1px solid red;
    border-right:1px solid red;
    border-bottom:1px solid red;
    border-left:1px solid red;
    padding:10px 10px 10px 10px;
}

#gmBasket .ErrorSummary ul li
{
    color:Red;
}
    

/********************************** */
/* tables */
table{
	border:1px solid #9c3;
	margin:1em 0;
}
th{
	text-align:left;
	padding:0.5em;
}
th img{
	margin:3px 3px 0 3px;
}
td{
	padding:0.5em;
}
#gmBasket table{
	border:0 none;
	clear:left;
	width:100%;
}
#gmBasket th{
	padding:0.5em;
	text-align:center;
}
#gmBasket td{
	text-align:center;
	border-top:1px solid #fff;	
}
#gmBasket td#basket-delivery, td#basket-total, #gmBasket td.basket-qty{
	text-align:right;
	font-weight:bold;
}

th.right, td.right {
    text-align:right;
}

th.centre, td.centre {
    text-align:center;
}


td.total {
    border-top:1px solid #9c3;
    font-weight:bold;
}


/********************************** */
/* cross selling panels */
p.crosssellpanel{
	display:block;
	height:50px;
	padding:270px 5px 0 5px;
	position:relative;
	width:195px;
	margin:400px 0 2em 0;
}
p.crosssellpanel a{
	position:absolute;
	bottom:2px;
}
p#crosssellpanel_1{background:transparent url(../assets/crosssellpanel_1.jpg) no-repeat scroll left top;}
p#crosssellpanel_2{background:transparent url(../assets/crosssellpanel_2.jpg) no-repeat scroll left top;}
p#crosssellpanel_3{background:transparent url(../assets/crosssellpanel_3b.jpg) no-repeat scroll left top; height:144px;}
p#crosssellpanel_4{background:transparent url(../assets/crosssellpanel_4.jpg) no-repeat scroll left top;}
p#crosssellpanel_5{background:transparent url(../assets/crosssellpanel_5.jpg) no-repeat scroll left top;}
/********************************** */


/* --------------------------------- Checkout Buttons */

ul#checkout-options li a.chkbutton
{
    display:block;
    color:#333;
    background-image:url(../assets/checkout_buttons.gif);
    background-position:left bottom;
    background-repeat:no-repeat;
    width:140px;
    padding-top:5px;
    height:22px;
    text-align:center;
    text-decoration:none;
    font-weight:bold;
    font-size:0.9em;
}

ul#checkout-options li a:visited.chkbutton
{
    color:#333;
}

ul#checkout-options li a:hover.chkbutton
{
    background-position:left top;
    color:#fc3;
}

a.CheckoutButton
{
    display:block;
    background-image:url(../assets/checkout_buttons.gif);
    background-repeat:no-repeat;
    background-position:bottom left;
    width:140px;
    padding-top:5px;
    height:22px;
    color:#000;
    font-size:1em;
    text-align:center;
    text-decoration:none;
    float:right;
    margin-left:6px;
}

a:visited.CheckoutButton
{
    color:#000;
}

a:hover.CheckoutButton
{
    color:#fff;
    background-position:top left;
}

/* Special Panel */

.gm-panel {
    padding:20px 10px 4px 10px;
    width:185px;
    background-color:#add6ff;
    background-image:url(../assets/curves_blue_top.gif);
    background-repeat:no-repeat;
    background-position:top left;
    text-align:center;
    position:relative;
}

.gm-panel h5 {
    font-size:1.4em;
    color:#0052A3;
    margin:0 0 4px 0;
}

.gm-panel p {
    line-height:1.6em;
}


.gm-panel p em {
    font-style:normal;
    font-weight:bold;
    font-size:1.4em;
    color:#0052A3;
}

p.gm-panel-bottom {
    position:absolute;
    bottom:0;
    left:0;
    background-image:url(../assets/curves_blue_bottom.gif);
    background-repeat:no-repeat;
    background-position:top left;
    width:205px;
    height:9px;
    margin:0;
    padding:0;
}