/*/ styles for new product pages /*/
.specialHero 			{ height:427px; position:relative;}
.specialHero#grafHero	{ background:url(/new/images/graf/bg-grafSpecial.jpg); }
.specialHero .copy 		{ width:390px; background:url(/new/images/graf/bg-trans.png); padding:20px; margin:0 0 0 10px; color:#fff; }
.specialHero .copy h3	{ color:#fff; font-size:23px; }
.specialHero .copy a 	{ color:#94d042; }

.specialHero ul.specialNav				{height:31px; margin:0 0 0 5px; padding:0; list-style:none; position:absolute; top:397px;}
.specialHero ul.specialNav li			{float:left; border-left:#fff 1px solid; border-collapse:collapse; width:100px;}
.specialHero ul.specialNav li a			{height:24px; padding:8px 0px 0; background:url(/new/images/graf/btn-specialised.png) top repeat-x; display:block; color:#fff; text-align:center;}
.specialHero ul.specialNav li a:hover,
.specialHero ul.specialNav li a.current	{background-position:bottom; color:#666; text-decoration:none;}

.specialContent							{ padding:15px 0px 0; background:url(/new/images/graf/bg-specialBottom.png) top repeat-x #eeeeee; margin-bottom:10px;  }
.specialContent .specialSlide 			{ display:none; clear:both; }
.specialContent .specialSlide.current 	{ display:block; }
.specialContent .specialSlide a.thumb	{ font-size:12px; float:left; color:#424242; padding: 0 10px 0 20px; background:url(/new/images/graf/specialised-seperator.png) right no-repeat; width:205px;  }
.specialContent .specialSlide a.end		{ background:none; }
.specialContent .specialSlide a.thumb:hover	{ text-decoration:none }
.specialContent .specialSlide a strong	{ color:#0d3d69; }
.specialContent .specialSlide a img		{ float:left; margin-right:10px; }
.specialContent .specialSlide p,
.specialContent .specialSlide h3,
.specialContent .specialSlide hr		{ margin:8px 20px }

.specialContent .specialFooter { background:url(/new/images/graf/special-footer.png) bottom no-repeat; height:15px; }

/*/ graf selector styles /*/

#grafsel {
  font-size:11px;
  margin-left:0px;
  width:733px;
  float:right;
}

#grafsel a:hover{text-decoration:none;}

#grafsel div#grafdirt{background:url(/new/images/graf/bg-grafsel.png) top repeat-x #ededed; padding:45px 0 10px; margin-bottom:10px;}

#grafsel .stepcontent{background:#fff; width:728px;padding:10px 0; margin:0 auto; display:none; position:relative}
#grafsel h3.stepbar{background:url(/new/images/graf/graf-steps.png);height:32px;width:728px;margin:0 auto; padding:0;text-indent:-3500px; cursor:pointer;}
#grafsel h3.current{background-position:right;}

#grafsel .graf-btn{width:186px; height:42px; float:left; clear:left padding:20px 0 0 30px; margin:20px 0 0 30px;}
#grafsel .graf-btn a{width:186px; height:30px; display:block; background:url(/new/images/graf/graf-btn.png) top left; padding-top:12px; text-align:center; color:#fff; }
#grafsel .graf-btn a:hover, #grafsel .graf-btn a.current{background-position:bottom left; text-decoration:none;}
#grafsel .graf-btnpadding{padding:0px 0 0 162px; }
#grafsel .totalcapacity{float:left; width:300px; margin:30px 0 0 20px}

#grafsel #step1.current{background-position:728px 0px;}
#grafsel #step2{background-position:0 -32px;}
#grafsel #step2.current{background-position:728px -32px;}
#grafsel #step3{background-position:0 -64px;}
#grafsel #step3.current{background-position:728px -64px;}
#grafsel #step4{background-position:0 -96px;}
#grafsel #step4.current{background-position:728px -96px;}
#grafsel #step5{background-position:0 -128px;}
#grafsel #step5.current{background-position:728px -128px;}

#grafsel #step2content div.tankpics{text-align:center; width:160px; float:left; padding: 10px 0 0;}
#grafsel #step2content div.sizes{width:488px; height:120px; padding:0px 58px 0 20px; background:url(/new/images/graf/step2-bg.png) top left no-repeat; float:right;}
#grafsel #step2content div.sizes a.size{width:221px; height:19px; padding:3px 0 0 12px; font-size:11px; color:#394400; float:left; margin:0 3px 5px 0; display:block; background:url(/new/images/graf/step2-selection.png) top}
#grafsel #step2content div.sizes a.size input{display:none;}
#grafsel #step2content div.sizes a.size:hover, #grafsel #step2content div.sizes a.current{background-position:bottom; color:#fff;}
#grafsel #step2content div.sizes a.size span{font-size:14px;}
#grafsel #step2content div.sizes a.sizeqty{width:221px; height:16px; padding:6px 0 0 12px; font-size:11px; color:#394400; float:left; margin:0 3px 5px 0; display:block; background:url(/new/images/graf/step2-selection.png) top}
#grafsel #step2content div.sizes a.active{background-position:bottom; color:#fff;}
#grafsel #step2content div.sizes a input{width:20px; height:13px; border:1px solid #999; margin:-5px 0 0 5px;  }


#grafsel #step2content div.sizes p{padding:0px; color:#666; font-size:12px;}
#grafsel #step2content div.sizes p span{color:black;}
#grafsel #step2content div.sizes p.titlePrimary{font-size:18px;margin:10px 0 5px;}

#grafsel #step3content a.selectlid{width:205px; height:270px; padding:10px 0 0 15px; float:left; display:block; color:#000; margin:0 0 20px 15px; position:relative;}
#grafsel #step3content a.selectlid:hover, #grafsel #step3content a.current{background:url(/new/images/graf/bg-lid.png) top no-repeat; color:#fff;}
#grafsel #step3content a.selectlid:hover span, #grafsel #step3content a.current span{color:#fff !important;}
#grafsel #step3content a.selectlid .selected{position:absolute; top: 245px; left:0px; width:204px; border-left: 3px solid #394400; border-right: 3px solid #394400; text-align:center; padding:1px 5px; background: #fff; color:#394400; display:none;}

#grafsel #step3content a.selectlidoptional{width:221px; height:270px; padding:10px 0 0 0px; float:left; display:block; color:#000; margin:0 0 20px 15px;background:url(/new/images/graf/bg-lid-optional.png) top left no-repeat; position:relative;}
#grafsel #step3content a.selectlidoptional img{margin:10px 0 0 45px;}
#grafsel #step3content a.selectlidoptional:hover, #grafsel #step3content a.currentopt{background-position:right top;cursor:pointer;}
#grafsel #step3content a.selectlidoptional .selected{position:absolute; top: 245px; left:10px; width:184px; border-left: 3px solid #394400; border-right: 3px solid #394400; text-align:center; padding:1px 5px; background: #394400; color:#fff; display:none;}

#grafsel #step3content a.selectlid span, #grafsel #step4content a.selectfilter span, #grafsel #step5content a.selectpump span, #grafsel #step3content a.selectlidoptional span{font-size:13px; color:#394400;}
#grafsel #step3content a.selectlid p, #grafsel #step4content a.selectfilter p, a.selectlidoptional p, #step1content p{padding:0 10px 0 0; margin:3px 0;}
#grafsel #step3content a.selectlid img{margin:0 0 10px 30px}

#grafsel #step4content a.selectfilter{padding:10px 0 0 15px; width:153px; height:170px; float:left; color:#000; margin:10px 0 0 40px; position:relative;}
#grafsel #step4content a.selectfilter:hover, #grafsel #step4content a.current{background:url(/new/images/graf/bg-filter.png); color:#fff;}
#grafsel #step4content a.selectfilter:hover span, #grafsel #step4content a.current span{color:#fff !important;}
#grafsel #step4content a.selectfilter .selected {display:none; position:absolute; top: 157px; left:0; width:152px; border-left: 3px solid #394400; border-right: 3px solid #394400; text-align:center; padding:1px 5px; background: #fff; color:#394400; }
#grafsel #step4content a.current .selected {display:block; }

#grafsel #step5content a.selectpump{padding:10px 0 0 10px; width:158px; height:170px; float:left; color:#000; margin:10px 0 0 40px; }
#grafsel #step5content a.selectpump:hover, #grafsel #step5content a.current{background:url(/new/images/graf/bg-filter.png); color:#fff; position:relative;}
#grafsel #step5content a:hover span, #grafsel #step5content a.current span{color:#fff;}
#grafsel #step5content a.optional{height:220px}
#grafsel #step5content a.optional:hover, #grafsel #step5content a.optional.current{background:url(/new/images/graf/bg-pumpOption.png); }

#grafsel #step5content a.selectpump img{margin:0 0 10px}

#grafsel #step5content a .selected {display:none; position:absolute; top: 165px; left:0; width:158px; text-align:center; padding:1px 5px; color:#394400; background:url(/new/images/graf/bg-selected.png) bottom white no-repeat; height:21px;}
#grafsel #step5content a.current .selected {display:block; }
#grafsel #step5content a.optional.current .selected {top: 223px;  }

#grafsel #step5content .pump-div{height:240px;}

#grafsel #formComplete 			{display:none;}
#grafsel #formComplete img 		{margin-left:36px;}
#grafsel #formComplete .graf-btn{margin:10px 0 0 30px;}


#grafsel #filter-extension{width:160px; float:right; _float:none; font-size:11px; margin:10px 300px 0 0; _margin:10px 00px 0 260px; padding:10px 0 0 20px; height:50px; background:url(/new/images/graf/bg-filter-optional.png) left top no-repeat;}
#grafsel #filter-extension span{font-size:11px; color:#394400;}
#grafsel #filter-extension input{margin-left:-15px;}

#grafsel #filter-external a img{margin:0 20px 10px;}

#filter-internal{_width:733px; _overflow-x:hidden}

#grafsel p {padding: 2px 20px;}

#grafsel .form-label{float:left; width:110px; padding-left:20px;}
#grafsel .form-input{float:right; width:510px;}

#grafsel img.logo{ float: right; margin-top: 0px;}

#grafsel img.grafhead{ float:left; margin-top: 10px; }

#grafsel .tooltip{cursor:pointer; color:#394400;}

.qtip{font-size:11px;}
.qtip ul {margin:5px; padding:0 0 0 20px;}




img.tank, img.logo
{
  float: right;
}

img.logo {
  margin-top: -40px;
}

#home.copyHolderTop
{
  background: #fff url("http://www.reece.com.au/new/images/products/tank.jpg") right 0 no-repeat;
}

.copyHolderTop p
{

  margin: 4px 0 0;
  line-height: 1.2em;
}

#home.copyHolderTop p
{
  width: 290px;
}

.copyHolderTop img#tankFront
{
  padding-top: 30px;
}

.copyHolderTop #nav
{
  padding: 8px 10px;
  margin: 5px 0 14px;
  background: #000 url("http://www.reece.com.au/new/images/products/grass.jpg") no-repeat;
}

.copyHolderTop #nav p
{
  color: #fff;
  font-size: 16px;
  padding: 6px 10px;
  margin: 0;
  background: url("http://www.reece.com.au/new/images/products/trans.jpg");
}

.copyHolderTop #nav p a
{
  font-size: 17px;
  text-decoration: none;
  color: #fff;
}

.copyHolderTop #nav p a:hover
{
  text-decoration: underline;
}

.copyHolderTop #nav p a.selected
{
  color: #DB1E23;
}

.copyHolderTop .lid, .copyHolderTop .filter, .copyHolderTop .pump
{
  padding: 22px 0 20px;
}

.copyHolderTop .lid.line, .copyHolderTop .pump.line
{
  border-bottom: 1px solid #bbb;
}

.copyHolderTop .lid h2, .copyHolderTop .filter h2, .copyHolderTop .pump h2
{

  color: #DB1E23;
}

.copyHolderTop .lid .info, .copyHolderTop .filter .info, .copyHolderTop .pump .info
{
  float: left;
  width: 380px;
  padding-left: 20px;
}

.copyHolderTop .lid img, .copyHolderTop .filter img, .copyHolderTop .pump img
{
  float: left;
  clear: both;
}

.copyHolderTop ul
{
  padding-left: 12px;
  margin: 3px 0 8px;
}

.copyHolderTop ul li
{

  line-height: 1.4em;
}

.copyHolderTop #moreInfo
{
  padding: 10px 2px;
  height: 172px;
  margin: 10px 0 24px;
  border-top: 1px solid #0D2E56;
  border-bottom: 1px solid #0D2E56;
}

.copyHolderTop #fourSimpleSteps
{
  margin: 20px 0 0;
}

.copyHolderTop #moreInfo .media
{
  float: left;
  padding: 0 5px;
}

.copyHolderTop #moreInfo p
{
  width: 150px;
  margin-top: 0;
}

.clear
{
  clear: both;
}

#overviewLayer {
  margin-left:0px;
}