/* CSS Document */

* { margin:0; padding:0; }
ul{list-style-type:none;}

html,body{
margin:0;
padding:0;
}
body{
font: .8em tahoma,verdana,arial,sans-serif;
color:#333333;
text-align:center;
background:#ffffff url(../images/bg.gif) top left repeat-x;
}
#container{
position:relative;
width:770px;
background-color:#FFFFFF;
margin:0 auto;
text-align:left;
}

/* STANDARD STYLES
***************************************************************************/
a{
color:#669900;
text-decoration:none;
}
a:hover{
text-decoration:underline;
}
h1, h2, h3, h4{
margin:10px 10px 0 10px;
}
p{
margin:10px;
}
.clear{
clear:both;
}
.summary{
margin:5px 0 10px 0;
}
.warn{
color:#ff0000;
}
/* H1 HEADER
***************************************************************************/
h1.header{
width:100%;
height:162px;
background:#ffffff url(../images/headerPhoto.jpg) top right no-repeat;
margin:55px 0 0 0;
}
h1.header a{
text-indent:-2000px;
display:block;
height:100%;
width:167px;
background:#ffffff url(../images/headerLogo.gif) top left no-repeat;
}

/* TOP OF PAGE LINKS AND TAGLINE
***************************************************************************/
h2#pageTopHeading{
position:absolute;
top:-20px;
right:8px;
color:#FFFFFF;
font-size:1.3em; /* may need revisiting - original size out of template was 1.3em */
font-weight:normal;
margin:0;
}
ul#pageTopLinks{
position:absolute;
top:-23px;
left:2px;
list-style-type:none;
width:400px;
}
ul#pageTopLinks li{
float:left;
margin:5px;
color:#FFFFFF;
}
ul#pageTopLinks li a{
color:#FFFFFF;
font-size: 0.9em; /* may need revisiting */
}

/* NAVIGATION
***************************************************************************/
ul#navigation{
position:absolute;
top:164px;
list-style-type:none;
width:100%;
height:75px;
background:#cfcfcf url(../images/navBg.gif) bottom left no-repeat;
}
ul#navigation li{
width:90px;
height:60px;
float:left;
margin-top:15px;
}
ul#navigation li a{
display:block;
color:#FFFFFF;
font-size:1.1em;
padding:20px;
text-align:center;
}
ul#navigation li.home{
width:82px;
}
ul#navigation li.news{
width:94px;
}
ul#navigation li.services{
width:92px;
}
ul#navigation li.about{
width:94px;
}
ul#navigation li.weee{
width:150px;
background-image:url(../images/weeeSymbol.gif);
background-position:top left;
background-repeat:no-repeat;
}
ul#navigation li.order{
width:150px;
background-image:url(../images/order.gif);
background-position:top left;
background-repeat:no-repeat;
margin-left:10px;
}
ul#navigation li.weee strong{
display:block;
font-weight:normal;
width:50px;
margin-left:70px;
}
ul#navigation li.order strong{
display:block;
font-weight:normal;
width:80px;
margin-left:55px;
}
ul#navigation li.resources a, 
ul#navigation li.about a, 
ul#navigation li.contact a, 
ul#navigation li.weee a{
padding:20px 8px;
}
ul#navigation li.weee a,
ul#navigation li.order a{
padding:12px 8px;
}

/* LEFT PANEL
***************************************************************************/
#leftPanel{
float:left;
width:271px;
border:2px solid #999999;
margin:15px 0 70px 15px;
}
#leftPanel h3{
color:#000000;
}
p.noteBox{
background-color:#999999;
color:#ffffff;
padding:10px;
}

img.map{
border: 1px dashed #8b8b8b;
margin: 10px 19px 0 19px;
background: #999999;
height: 230px;
width: 230px;
}

/* MAIN PANEL
***************************************************************************/
#mainPanel{
width:444px;
float:right;
margin-right:15px;
margin-top:15px;
}
#mainPanel p{
margin:10px 0;
}
#mainPanel h3{
margin:10px 0;
}
a.boxPic01,
a.boxPic02,
a.boxPic03,
a.boxPic04{
text-indent:-2000px;
display:block;
width:214px;
height:61px;
border:2px solid #999999;
margin-bottom:10px;
}
a.boxPic01{
float:left;
background:#ffffff url(../images/boxPic01.jpg) top left no-repeat;
}
a.boxPic02{
float:right;
background:#ffffff url(../images/boxPic02.jpg) top left no-repeat;
}
a.boxPic03{
float:left;
background:#ffffff url(../images/boxPic03.jpg) top left no-repeat;
}
a.boxPic04{
float:right;
background:#ffffff url(../images/boxPic04.jpg) top left no-repeat;
}

/* FULL PANEL
***************************************************************************/
#fullPanel{
width:730px;
float:right;
margin-right:15px;
margin-top:15px;
}
#fullPanel p{
margin:10px 0;
}
#fullPanel h3{
margin:10px 0;
}

/* CONTENT - COMMON
***************************************************************************/
#contentWrapper{
margin-top:77px;
width:766px;
border-left:2px solid #8b8b8b;
border-right:2px solid #8b8b8b;
background:#ffffff url(../images/grass.jpg) bottom no-repeat;
padding-bottom:60px;
}

ul.bulletList{
list-style-type: disc;
margin-left: 20px;
}

ul.bulletList li{
margin-bottom: 5px
}

p.bulletText{
padding: 0 30px;
}

ul.bulletSubList{
list-style-type: circle;
padding-left: 20px;
padding-top: 10px;
padding-bottom: 5px;
}

ul.bulletSubList li{
margin-left: 40px;
}

ul.linkList{
list-style-type: circle;
margin: 5px 10px 0 30px;
}

h5.bulletSubHeading{
padding-left: 40px;
}

/* CONTENT - INDEX
***************************************************************************/

#SOFALogo img{
float: left;
border: 0px;
margin: 10px 8px 32px 8px;
}

#SOFABlurb {
padding: 5px;
}

/* CONTENT - NEWS
***************************************************************************/

.nPhoto{
margin: 12px;
padding: 1px;
border: #999999 2px solid ;
}

.nCap{
margin: -12px 13px 0 12px;
padding: 0 4px 2px 4px;
background-color:#999999;
font-size: 0.8em;
color:#ffffff;
}

/* CONTENT - SERVICES
***************************************************************************/

.leftLinkSet{
float: left;
width: 340px;
height: 90px;
padding-left: 20px;
padding-top: 5px;
padding-bottom: 5px;
}

.rightLinkSet{
float: right;
width: 340px;
height: 90px;
padding-right: 20px;
padding-top: 5px;
padding-bottom: 5px;
}

.fullLinkSet{
float: left;
width: 690px;
height: 95px;
padding-left: 20px;
padding-top: 5px;
padding-bottom: 5px;
}

div#infoBox{
background: #ccc;
padding: 10px;
border: solid 1px #aaa;
}
div#infoBox ol{
margin-left:15px;
}
/* CONTENT - ABOUT US
***************************************************************************/

p.address{
padding-top: 5px;
padding-bottom: 5px;
padding-left: 20px;
}

/* CONTENT - CONTACT US
***************************************************************************/

#mMap{
margin: 12px;
padding: 1px;
border: #999999 2px solid ;
}

p.address2{
margin-top: -5px;
padding-bottom: 5px;
padding-left: 20px;
}

/* CONTENT - THE WEEE DIRECTIVE
***************************************************************************/

.linkSet{
float: left;
width: 420px;
height: 95px;
padding: 5px 20px;
}

.faqNList{
padding: 5px 35px;
}

.faqUList{
list-style-type: disc;
margin: 5px 35px;
}

a.backTT{
float: right;
padding-right: 20px;
padding-bottom: 30px;
}

/* CONTENT - THE WEEE FAQ
***************************************************************************/

#FAQLinkPanel{
float:left;
position: fixed;
top: 5px;
left: 5px;
width:180px;
border:2px solid #999999;
margin: 5px;
padding: 5px;
background: #FFFFFF;
}

#FAQLinkPanel a{
font-size: 0.8em;
}

ul.FAQLinkPanelLinks{
list-style-type: circle;
margin-left: 20px;
}

a.FAQLinkPanelBackTT{
float: right;
text-align: right;
}

/* CONTENT - TERMS & CONDITIONS
***************************************************************************/

p.legalText{
padding-left: 10px;
}

p.legalSub{
padding-left: 40px;
}

ol.legalAlphaList{
list-style-type: lower-alpha;
padding-left: 80px;
}

/* CONTENT - SITE FAQ
***************************************************************************/

#siteFAQ{
margin-left: 30px;
}

#siteFAQ li{
font-weight: bold;
}

p.answerText{
padding-bottom: 15px;
padding-left: 10px;
font-weight: normal;
}

/* CONTENT - GLOSSARY
***************************************************************************/
ul.termList{
list-style-type: none;
margin-left: 30px;
margin-right: 30px;
}

ul.termList li{
margin-bottom: 20px;
}

/* CONTENT -  TARIFF & POSTCODE LIST
***************************************************************************/
div.PCSet1{
float: left;
width: 200px;
}

div.PCSet2{
float: left;
width: 200px;
}

ul.PCList{
list-style-type: circle;
margin: 5px 10px 0 30px;
}

p.tariffs {
padding: 0 10px;
}

/* CONTENT -  THANK YOU
***************************************************************************/
.thankyou {
text-align: center;
}

h1.thankyou{
padding-top: 100px;
}

p.thankyou{
padding: 0 150px 100px 150px;
}

/* FOOTER
***************************************************************************/
#footer{
clear:both;
width:766px;
border-left:2px solid #8b8b8b;
border-right:2px solid #8b8b8b;
}
#footer p{
clear:both;
text-align:center;
font-size:.8em;
margin:0;
}
#footer ul{
margin-left:110px;
}
#footer ul li{
float:left;
margin:5px 20px;
font-size:1.1em;
}
#bottomFooter{
display:block;
height:18px;
margin-bottom:40px;
margin:0;
background:#ffffff url(../images/footerBg.gif) bottom left no-repeat;
}
#footer a{
color:#333333;
}

p.fAddress{
padding-top: 5px;
font-size: 1.1em;
}

/* FORM STYLES
***************************************************************************/
div.formrow{
clear: both;
padding:5px 0;
margin:0;
width:300px;
}
div.center{
text-align:center;
}
div.formrow span.formlabel{
float: left;
width: 100px;
text-align: left;
margin-right:20px;
}
div.formrow span.formelement, div.formrow p.formelement{
float: right;
width: 150px;
text-align: left;
}
div.formrow textarea{
width:140px;
}
div.formrowWide{
clear: both;
padding:7px 0;
margin:0;
width:450px;
}
div.formrowWide span.formlabel{
float: left;
width: 175px;
text-align: left;
margin-right:20px;
}
div.formrowWide input{
width:50px;
}