/* CSS Document */

/*
===== CONTENTS =====

last-updated: PUT DATE HERE;

=1: Universally
=2: Accessibility
=3: Body
=4: Outline Construction
=5: Navigation

====================
*/

/*
===== =1: Universally =====
*/

* {
font-size:100%;
margin: 0;
padding: 0;
text-decoration: none;
list-style: none;
}

html {height: 100%;}
body {height: 100%;}
#wrap {min-height: 100%;}
* html #wrap {height: 100%;}

#footer {position: relative;margin: -3.5em auto 0 auto;}

#footer {
clear: both;
width:78em !important;
width:78.5em;
height:1.8em;
color:#fff;
background: url("../stat/footer_bg.gif") right bottom no-repeat;
padding:1.70em 0 0 6.4em;
}

#footer a.credit {
margin:0 auto 0 42.25em;
padding:0;
font-weight:normal;
color:#fff;}

#footer a#top {
margin:0 0 0 1em;
background: url("../stat/top_bg.gif") no-repeat top center;
}

#footer a {
color:#fff;
margin:0 1em;
padding:0.5em 0;}


/*
===== =2: Accessibility Aids =====
*/

.hidden
{
position: absolute;
left: -9999px;
width: 0px;
overflow: hidden;
}

h1 a, ul#nav li a, #wrap #content #discount a {
overflow: hidden;
height: 0;
}


/*
===== =3: Body =====
*/

body {
font: 62.5%/120% Verdana, Arial, Helvetica, sans-serif;
color: #036;
background: #036 url("../stat/body_bg.gif") right repeat-y;
}

/*
===== =4: Outline Construction =====
*/
#wrap {
position: relative;
text-align: left;
margin: 0 auto;
width: 80em !important;
width: 80.5em;
padding:0 0 0 4.44em;
background: #fff url("../stat/wrap02_bg.gif") left repeat-y;
min-height:100%
}

/*
===== =4: Header and Blockquote =====
*/

#header { 
width:78.9em;
height:20.4em;
border-bottom:2px solid #fff;
background: #036 url("../stat/header_bg.jpg") no-repeat left;
z-index:1;
}
#home #header {background-image: url("../stat/header_bg.jpg");}
#about #header {background-image: url("../stat/header_about_bg.jpg");}
#services #header {background-image: url("../stat/header_services_bg.jpg");}
#gardenCentre #header {background-image: url("../stat/header_centre_bg.jpg");}
#other #header {background-image: url("../stat/header_other_bg.jpg");}
#testimonials #header {background-image: url("../stat/header_testimonials_bg.jpg");}
#contact #header {background-image: url("../stat/header_bg.jpg");}

#header blockquote {
margin-left:51.5em;
color:#FFFF67;
text-align:right;
padding:1.6em 2.4em 0em 1.5em;}

#header blockquote p {
font-size:1.4em;
line-height:1.6em;
}
#header blockquote p.credit em{
color:#fff;font-style:normal;
}
#logo a{
position:absolute;
top:16.5em;
width: 24em;
background: url("../stat/logo.gif") no-repeat;
margin: 0 0 0 2.9em;
padding-top: 14.4em;
z-index:2;}


/*
===== =4: Left - Logo - Menu =====
*/

#left {
float:left;
width:26.4em;
text-align:right;
height:48em;}

h1  {
line-height:18px;
font-size:22px;
font-weight:bold;
color:#006699;}

h2 {
line-height:18px;
font-size:18px;
font-weight:bold;
color:#006699;
padding-bottom: 10px;}

h3 {
font-size:12px;
font-weight:bold;
color: #003366;
}

ul#nav {
clear:left;
margin-top:10em;}



ul#nav li {
display:block;
width:100%;
color:#fff;
padding:1em 0 0 0;
background: url("../stat/li_bg.gif") right bottom no-repeat;
}
ul#nav li a {
width:26.5em;
display:block;
padding-top:3.4em;
 }

ul#nav li#stocktaker a {background: url("../stat/stocktakers.gif") -23.25em 0 no-repeat; }
ul#nav li#stocktaker a:hover {background: url("../stat/stocktakers.gif") 9.5em 0 no-repeat; }

ul#nav li#about a {background: url("../stat/about.gif") -23.25em 0 no-repeat; }
ul#nav li#about a:hover {background: url("../stat/about.gif") 9.5em 0 no-repeat; }

ul#nav li#services a {background: url("../stat/services.gif") -23.25em 0 no-repeat; }
ul#nav li#services a:hover {background: url("../stat/services.gif") 9.5em 0 no-repeat; }

ul#nav li#centres a {background: url("../stat/centres.gif") -23.25em 0 no-repeat; }
ul#nav li#centres a:hover {background: url("../stat/centres.gif") 9.5em 0 no-repeat; }

ul#nav li#petShops a {background: url("../stat/petShops.gif") -23.25em 0 no-repeat; }
ul#nav li#petShops a:hover {background: url("../stat/petShops.gif") 9.5em 0 no-repeat; }

ul#nav li#customers a {background: url("../stat/customers.gif") -23.25em 0 no-repeat; }
ul#nav li#customers a:hover {background: url("../stat/customers.gif") 9.5em 0 no-repeat; }

ul#nav li#testimonials a {background: url("../stat/testimonials.gif") -23.25em 0 no-repeat; }
ul#nav li#testimonials a:hover {background: url("../stat/testimonials.gif") 9.5em 0 no-repeat; }

ul#nav li#contact a {background: url("../stat/contact.gif") -23.25em 0 no-repeat; }
ul#nav li#contact a:hover {background: url("../stat/contact.gif") 9.5em 0 no-repeat; }


#wrap #content .discount a {display:block;width:468px;padding-top:33px;background:url(../stat/discount.jpg);}

/*
===== =5: Content - Slideshow =====
*/

#flashcontent  {
width:49.7em;
height:10.8em;
margin-left:29.2em;
background: url("../stat/slideshow_bg.jpg") no-repeat;
}

#content {
padding: 0;
padding:2.4em 1.5em 3.5em 31.5em;
min-height:100%;
}
#content p, #content ul {
font-size:1.2em;
padding:0.8em 0;
line-height:1.5em}

#content ul {
font: 1.2em/1.3em Verdana, Arial, Helvetica, sans-serif;
margin:2em 0 2em 3em;}

#content blockquote {
margin:0.5em;
padding:0.5em 3em;
line-height:1.2em;
font: normal  1.0em/1.3em Verdana, Arial, Helvetica, sans-serif ;
border:none;
background:#F2FADC;
}

#content blockquote p{
margin:1em 0;
padding:0; 
background:none;}

p.credit {
margin:0 0 2.4em 0;
padding:0; 
font-weight:bold;
text-align:right;}

address {
margin:1em 0;
padding:0.5em 2em;
font:normal 0.8em/1.0em Verdana, Arial, Helvetica, sans-serif ;}

form#contactForm {
margin:0;
width:44em;
padding: 0.5em;
}

form#contactForm p{font-size:1.1em;}

fieldset {
border: 0;
clear: both;
}

form#contactForm p {
clear: left;
}

form#contactForm label {
clear:left;
color: #036;
float: left;
width:10em;
padding: 0.4em 0 0.4em 0.5em;
margin-right: 0.4em;
}

form#contactForm input, form#contactForm textarea {
float: left;
width: 18em;
margin: 0 1.5em 1em 0;
padding: 0.3em;
border: 1px solid #bbb;
}
form#contactForm textarea {
width:24em;
height:10em;
font-size:1.2em;
}

form input.error, form textarea.error {
background:#F2FADC;
} 

form#contactForm input.submit {
float: right;
color: #fff;
width:6.2em;
height:2.2em;
padding:0 0 0 0;
margin: 0 2em 0 0;
border: 0;
text-align: center;
font: bold 1.3em/1.4em Verdana, Arial, Helvetica, sans-serif;
cursor: pointer;
border-top:1px solid #01182F;
border-right:1px solid #01182F;
border-bottom:1px solid #004A94;
border-left:1px solid #004A94;
background: #003366;
}

#content div.errMsg {
margin:0.5em 0;
padding:1em 2em;
font:normal 0.8em/1.0em Verdana, Arial, Helvetica, sans-serif ;
border-top:1px solid #ccc;
border-bottom:1px solid #ccc;
background:#F2FADC;
}
#content div.errMsg p {margin:0;padding:0;}
#content div.errMsg ul {margin:0.5em 1.5em;padding:0;}
#content div.errMsg ul li {font:normal 1em/1.1em Verdana, Arial, Helvetica, sans-serif ;}