/* Standard CSS */

body {
  margin:0 auto;
  padding:0 auto;
  font-family:Arial, Helvetica, sans-serif;
  font-size:12px;
  background-color:#bfe1a1; 
}
img {
  border:0;
  margin:0;
  padding:0;
}
a {
  border:0;
}
p {
  padding:0 10px 0 10px;
  /*margin: 10px 10px 10px 10px;
  background:#FFFFFF;
  border:1px solid black;*/
}

/* Container CSS */
#container {
  width:1000px;
  height:768px;
  margin-left:auto;
  margin-right:auto;
  border:1px solid #999999;  
}
#linegroup {
width:210px;
height:40px;
background:gray;
float:right;
padding:2px;
color:white;
}

#linegroup-txt {
height:20px;
padding: 12px 0 0 15px;
float:left;
}

#linegroup img{
float:right;
}

#main {
  width:697px;
  height:768px;
  float:left;
  margin:0px auto;
  padding:0px auto;
}
#mainbody {
  width:697px;
  height:768px;
  float:left;
  margin:0px auto;
  padding:0px auto;
  overflow:auto;
  padding:0px;
  background-color:#d0e9b9;
}
#mainbody img {
align:center;
}
#nav {
  width:303px;
  height:768px;
  float:left;
  margin:0px auto;
  padding:0px auto;
  background-color:#00A27A;
}
#header {
  width:680px;
  height:176px;
  position:absolute;
  margin-left:auto;
  margin-right:auto;
}
#telandweb {
	z-index: 200;
	width:680px;
	height:120px;
	position: absolute;
	left: 488px;
	margin: 648px 0 0 -500px;
	top: 6px;
}
#footer {
  width:990px;
  border-left:1px solid #999999;
  border-right:1px solid #999999;
  border-bottom:1px solid #999999;
  background-color:#CCCCCC;
  margin:0 auto;
  padding:5px;
}
#footer a {
  color:#063e1f;
}  
#footer a:hover {
  color:black;
}

#stage1 {
width: 280px;
float:left;
}

#stage2 {
width:350px;
float:left;
margin-left:20px;
}

#stage3 {
width: 210px;
float:left;
height:350px;
}
#stageimg {
width: 450px;
float:left;
height:350px;
}

#con {
background-color:#FFFF99;
margin:10px;
text-align:left;
padding:5px;
}


a:link {color: #FF0000}     /* unvisited link */
a:visited {color: #00FF00}  /* visited link */
a:hover {color: #FF00FF} 


/* Individual nav items */
#nav-item1{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-voucher-bkg.gif); margin:0px auto; padding:0px auto; }
#nav-item1:hover {
  background:url(images/roofing-voucher-bkg-over.gif); }

#nav-item2{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-newroof-joint-bkg.gif); margin:0px auto; padding:0px auto; }
#nav-item2:hover {
  background:url(images/roofing-newroof-joint-bkg-over.gif); }

#nav-item3{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-newroof-bkg.gif); margin:0px auto; padding:0px auto; }
#nav-item3:hover {
  background:url(images/roofing-newroof-bkg-over.gif); }

#nav-item4{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-repairs-bkg.gif); margin:0px auto; padding:0px auto; }
#nav-item4:hover {
  background:url(images/roofing-repairs-bkg-over.gif); }

#nav-item5{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-guttering-bkg.gif); margin:0px auto; padding:0px auto; }
#nav-item5:hover {
  background:url(images/roofing-guttering-bkg-over.gif); }

#nav-item6{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-flatroofs-bkg.gif); margin:0px auto; padding:0px auto; }
#nav-item6:hover {
  background:url(images/roofing-flatroofs-bkg-over.gif); }

#nav-item7{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-moseley-bkg.gif); margin:0px auto; padding:0px auto; }
#nav-item7:hover {
  background:url(images/roofing-moseley-bkg-over.gif); }

#nav-item8{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-problems-bkg.gif); margin:0px auto; padding:0px auto; }
#nav-item8:hover {
  background:url(images/roofing-problems-bkg-over.gif); }
  
#nav-item9{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-projects-bkg.gif); margin:0px auto; padding:0px auto; }
#nav-item9:hover {
  background:url(images/roofing-projects-bkg-over.gif); }

#nav-item10{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-building-bkg.gif); margin:0px auto; padding:0px auto; }
#nav-item10:hover {
  background:url(images/roofing-building-bkg-over.gif); }

#nav-item11{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-checklist-bkg.gif); margin:0px auto; padding:0px auto; }
#nav-item11:hover {
  background:url(images/roofing-checklist-bkg-over.gif); }

#nav-item12{
  width:25px; height:768px; float:left; position:relative; background:url(images/the-line-group-bkg.gif); margin:0px auto; padding:0px auto; }
#nav-item12:hover {
  background:url(images/the-line-group-bkg-over.gif); }


#nav-item12sel{
  width:25px; height:768px; float:left; position:relative; background:url(images/the-line-group-bkg-selected.gif); margin:0px auto; padding:0px auto; }
  #nav-item1sel{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-voucher-bkg-selected.gif); margin:0px auto; padding:0px auto; }
  #nav-item2sel{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-newroof-joint-bkg-selected.gif); margin:0px auto; padding:0px auto; }
  #nav-item3sel{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-newroof-bkg-selected.gif); margin:0px auto; padding:0px auto; }
  #nav-item4sel{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-repairs-bkg-selected.gif); margin:0px auto; padding:0px auto; }
  #nav-item5sel{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-guttering-bkg-selected.gif); margin:0px auto; padding:0px auto; }
  #nav-item6sel{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-flatroofs-bkg-selected.gif); margin:0px auto; padding:0px auto; }
  #nav-item7sel{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-moseley-bkg-selected.gif); margin:0px auto; padding:0px auto; }
  #nav-item8sel{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-problems-bkg-selected.gif); margin:0px auto; padding:0px auto; }
  #nav-item9sel{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-projects-bkg-selected.gif); margin:0px auto; padding:0px auto; }
  #nav-item10sel{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-building-bkg-selected.gif); margin:0px auto; padding:0px auto; }
    #nav-item11sel{
  width:25px; height:768px; float:left; position:relative; background:url(images/roofing-checklist-bkg-selected.gif); margin:0px auto; padding:0px auto; }