body{

	font-family: Arial, Helvetica, sans-serif;
	background: url(../images/bg_main.png) repeat #f8f8f8;

 }	
 h3{line-height: 35px;color:#1a2d37;
	margin: 0 70px 7px;}

#formCalc {
  margin: 10px 0px 0px 0px;
  padding: 0; 
  border:1px solid #B3B3B3;    
  color:#333333;
}

#formCalc div {
  padding: 5px 0px 5px 8px;
}

#formCalc .headerYellow {
   background: url(../images/bg_bottom.png) repeat rgb(52, 52, 52);
    font-weight:bold;
    font-size:12px;
    margin:0;
    clear: both;
	color:white;
}

#formCalc .headerBlue {
    /*background:#91C5DF;*/
	background: url(../images/bg_bottom.png) repeat rgb(52, 52, 52);
    font-weight:bold;
    font-size:13px;
    margin:0;
    clear: both;
	color:white;
}

#formCalc .headerBlueSub {
   /* background:#91C5DF;*/
	background: url(../images/bg_bottom.png) repeat rgb(52, 52, 52);
    font-weight:normal;
    font-size:10px;
    margin:0;
    clear: both;
    text-align:left;
	color:white;
}

#formCalc .headerBlueSub label {
	display: block;
	text-align: left;
	float: left;
	padding-top:1px;
	width: 323px;
}

#formCalc .headerInputCalcBt {
    background: url(../images/bg_bottom.png) repeat rgb(52, 52, 52);
    font-weight:normal;
    font-size: 12px;
    margin:0;
    text-align:left;
	color:white;
}	

#formCalc .headerInputCalcBt label {
	display: block;
	text-align: left;
	float: left;
	padding-top:1px;
	width: 323px;
}

#formCalc input,  textarea {
    width:50px; 
    margin:5px 0 0 5px;
    border:1px solid #ccc;
}

#formCalc input.textBox {float:left}

#formCalc input.textBoxLarge {float:left;width:105px}

#formCalc select {
    width:45px;
    margin-left:10px;
    border:1px solid #ccc;
}

#formCalc label {
	margin: 0;
	display: block;
	text-align: left;
	float: left;
	width: 250px; 
}

#formCalc fieldset {
  /* clear: both; note that this clear causes inputs to break to left in ie5.x mac, commented out */
  border-color: #fff;
  border-width: 0px;
  border-style: solid;
  padding: 5px 0px 8px 0px;        /* padding in fieldset support spotty in IE */
  margin: 0 auto;
  background:#F0EEE9;
}

#formCalc .mandat {
	width: 324px;
	padding: 12px 0px 0px 0px;
	margin: 0px 0px 0px 5px;
}

#formCalc .mandat2 {
	width: 359px;
	padding: 12px 0px 0px 0px;
	margin: 0px 22px 0px 5px;
}

#formCalc .mandatTitle {
	padding: 10px 0px;
	margin: 0px 0px 0px 5px;
	font-size:10px;
}

#formCalc .headerBlueSub .mandatTotal {
	width: 290px;
	padding: 0;
	margin: 2px 0px 0px 0px;
}

#formCalc br { clear:left; }

#formCalc .smallHeader { font-size:9px; margin-left:7px;}

.deckArea #sPrepClean {margin-bottom: 20px; margin-left: 0px;}



/* decking calculator */
#formCalc fieldset label { color:#333; }
#formCalc .headerBlueSub { color:#fff; }
#formCalc .input { display:block; float:left; padding:0; width:150px; margin-right:8px; }
#formCalc .small { text-align:center; font-size:9px; text-transform:uppercase; display:block; }
#formCalc .deckArea .input input { margin:0 10px 0 0; width:150px; }
#formCalc .deckArea .input.noHeading { margin:0 8px 15px 329px; }
#formCalc fieldset .headerInputCalcBt label { width:324px; margin:5px 0 0 8px; color:#fff; text-transform: uppercase; }
#formCalc #deckTotalArea { width:150px; float:left; margin:5px 0; }
/* decking */
#formCalc .headerBlue { background-color:rgb(88,155,189); background-image: none; text-transform:uppercase; font-size:14px; padding:8px 10px; }
#formCalc.decking .headerBlue { padding:7px 15px; }
#formCalc.decking label.mandat { text-transform:capitalize; }
#formCalc.decking div { padding:0; }
#formCalc.decking fieldset { padding:5px 0px 5px 8px; }
#formCalc.decking fieldset select { float:left; margin:13px 0 10px 0; }
#formCalc.decking .noHeading { margin-left:334px; }
#formCalc.decking .noHeading select { margin:0; }
#formCalc.decking .mandatTitle { padding:0; }
#formCalc.decking .textBox { margin:10px 0; width:150px; }
#formCalc.decking .headerInputCalcBt { height:60px; background-color:rgb(88,155,189); background-image: none; }
#formCalc.decking .headerInputCalcBt label { margin:6px 5px 0 10px; }
#formCalc.decking .headerInputCalcBt label span { color:#fff; font-size:11px; }
#formCalc.decking .headerInputCalcBt #sTotalTime { float:left; width:150px; margin:14px 0 0 5px; }

h2#formCalc { margin:35px 0 15px 15px; border:none; }
#formCalc .headerBlueSub label { width:324px; margin-left:5px; }
#formCalc .headerBlueSub label span { color:#fff !important; font-size:11px; }
#formCalc #sYearsBeforeSave2, #formCalc #sNetMaintenanceCost10yrs2 { width:150px; float:left; }
#formCalc .mandat, #formCalc .mandat2 { margin-left:10px; width:324px; margin-right:0;  }

#formCalc.maintenance label.mandatTitle { padding:0; margin-left:10px; }
#formCalc.maintenance label.madat { margin-left:10px; }
#formCalc input.textBox { width:150px; float:left; }
#formCalc .headerBlueSub #sTotalAnnualCost { width:150px; }
#formCalc.maintenance .comparison span { padding-top:10px; }
#formCalc.maintenance input { float:left; width:150px; }

.sixteen.columns #formCalc.maintenance input#sApproxMaintenanceLabour{ margin-left: 160px; }
.sixteen.columns #formCalc.maintenance input#sEquipmentMaterials{ margin-left: 160px; }

/* overwrites */
@media only screen and (max-width: 599px) { 

  /* decking calculator */
  #formCalc .deckArea .input.noHeading { margin-left:0; }
  #formCalc.decking .noHeading { margin-left:0; }
}

@media only screen and (max-width: 479px) { 

  /* decking calculator */
  #formCalc .deckArea .input.noHeading { margin-left:0; }
  #formCalc fieldset .headerInputCalcBt label { text-align:center; }
  #formCalc #deckTotalArea { width:324px; }

  }


/* maintenance calculator */
#formCalc.maintenance .mandat { padding-top:0; height:30px; }
#formCalc.maintenance select.select { margin-bottom:0; }