@font-face{font-family: 'cabin-medium'; src: url('../fonts/cabin-medium-webfont.eot'); src: url('../fonts/cabin-medium-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/cabin-medium-webfont.woff') format('woff'), url('../fonts/cabin-medium-webfont.ttf') format('truetype'), url('../fonts/cabin-medium-webfont.svg#webfont') format('svg'); font-weight: normal; font-style: normal;}
@font-face{font-family: 'cabin-semibold'; src: url('../fonts/cabin-semibold-webfont.eot'); src: url('../fonts/cabin-semibold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/cabin-semibold-webfont.woff') format('woff'), url('../fonts/cabin-semibold-webfont.ttf') format('truetype'), url('../fonts/cabin-semibold-webfont.svg#webfont') format('svg'); font-weight: normal; font-style: normal;}
	

/* hide text and toggle block: */
#Logo, .Submit, .PreviousStep, .NextStep, .SingleRoomEdit, .SingleRoomDelete, .AddRoom, .SaveRoom, .DeleteRoom, #Progress a{display: block; font-size: 0px; text-indent: -9999px; line-height: 0;}

/* font-size reset */
html{font-size: 100%; height: 100%;}
body{background: url(../images/body.jpg) 50% 0; font-family: 'cabin-medium', Arial, sans-serif; color: #202e3a; font-size: 62.5%; letter-spacing: 0.015em; text-align: center; height: 100%;}

/* LAYOUT */
#Container{background: url(../images/Container.jpg) 50% 0 repeat-x; text-align: left; min-height: 100%; min-width: 1004px;}

	#TopWrapper{background: url(../images/Top.png) 50% 0 no-repeat;}
		#Top{position: relative; color: #fff; width: 964px; height: 207px; margin: 0 auto;}
			#Boilerhouse{position: absolute; top: 29px; right: 21px;}
			#Tagline{position: absolute; top: 58px; left: 0; font-size: 2.2em; color: #ebebeb; letter-spacing: 0.02em;}
			#Description{position: absolute; top: 112px; left: 0; font-size: 1.44em; line-height: 1.47; color: #E7E7E7; letter-spacing: 0.02em; width: 454px;}
				#Description p{margin: 5px;}
			#MiniNav{position: absolute; top: 115px; right: 0; text-align: center; width: 358px;}
				#MiniNav li{display: inline;}
					#MiniNav a{font-size: 1.3em; color: #BFBFBF; letter-spacing: 0.01em; text-transform: uppercase; text-decoration: none; margin: 0 7px;}
						#MiniNav a:hover{color: #d7d7d7;}
						#MiniNav a.current, #MiniNav a.section{color: #e3e3e3; border-bottom: 1px solid #4C546A;}
						
	#Wrapper{background: url(../images/Wrapper.png) 50% 0 repeat-y; width: 1000px; margin: 0 auto; padding: 0 1px 0 3px; overflow: hidden;}
		.column{font-size: 1.4em; width: 499px; height: 100%;}
			.column-heading{position: relative; background: url(../images/column-heading.png) 100% 0 repeat-y; color: #F8F7F7; height: 171px; padding: 25px 20px;}
				.section-arrow{position: absolute; top: 221px; left: 50%; margin-left: -31px; background: url(../images/section-arrow.png) 0 100% no-repeat; width: 62px; height: 22px; z-index:3;}
				.column-heading strong{display: block; font-size: 1.65em; letter-spacing: 0.01em; text-transform: uppercase; margin-bottom: 0.7em;}
				#Nav{}
					#Nav li{float: left; margin: 0 16px 13px 0;}
					#Nav li.boilers-and-fuel, #Nav li.heat-pumps{margin-right: 0;}
						#Nav a{position: relative; display: block; background: url(../images/NavA.jpg); border-style: solid; border-width: 1px; border-color: #5285af #081a29 #091e2f #85a8c6; width: 83px; height: 43px; padding: 7px 48px 0 9px; border-radius: 4px; -webkit-border-radius: 4px;}
						#Nav a{font-size: 1.15em; line-height: 1.15; color: #F7F7F7; text-decoration: none; box-shadow: 0 0 8px #305185; -moz-box-shadow: 0 0 8px #305185; -webkit-box-shadow: 0 0 8px #305185; -khtml-box-shadow: 0 0 8px #305185;}
							#Nav a img{position: absolute; top: -14px; right: 0; display: block;}
							#Nav a:hover, #Nav a.current, #Nav a.section{background: url(../images/NavAcurrent.jpg);}
							#Nav a.current, #Nav a.section{position: relative; top: 1px; left: 1px;}
		.content{}
			#ContentHolder{position: relative; background: url(../images/Content.jpg); padding: 38px 19px;}
				#Loading{position: absolute; top: 40px; left: 50%; margin-left: -8px; display: none; text-align: center;}
				.typography #Content{font-size: 0.95em; color: #2A3D4B; line-height: 1.6;}
				.js #Loading{display: block;}
				.js #Content{display: none;}
					.typography h1, .typography h2{font-family: 'cabin-semibold', Arial, sans-serif;}
					.typography h2{font-size: 1.72em; line-height: 1em; color: #1c5f97; text-transform: uppercase; text-align: center; margin-bottom: 0.8em;}
					.typography h3{clear: left; font-size: 1.3em; margin: 2em 0 1em;}
					.typography p{margin-bottom: 1em;}
						.typography a{color: #d55901;}
							.typograebebebphy a:hover{text-decoration: none;}
					.typography ol, .typography ul{margin: 1em 1em 1em 2em;}
						.typography li{margin-bottom: 1em;}
						.typography ol li{list-style-type: decimal; list-style-position: inside;}
		.calculator{float: right;}
			.calculator .column-heading p{font-size: 1.35em; margin-bottom: 0.8em;}
			.calculator .column-heading em{display: block; font-size: 1.02em; width: 340px; line-height: 1.25;}
			.calculator .column-heading .quote{position: absolute; top: 48px; right: 20px; background: url(../images/quote.png) no-repeat; width: 80px; height: 106px;}
			#Calculator{}
			
/* overlay */
#RoomFieldsHolder{display: none; position: fixed; height: 100%; width: 100%; top: 0; left: 0; right: 0; bottom: 0; background: url(../images/RoomFields.png); z-index: 5;}
	.RoomActions{margin-left: 144px; padding-top: 10px; overflow: hidden;}
		.RoomActions a{height: 32px; float: left;}
		.SaveRoom{background: url(../images/SaveRoom.png) no-repeat; width: 99px; margin-right: 4px;}
		.DeleteRoom{background: url(../images/DeleteRoom.png) no-repeat; width: 112px;}
#ContentOverlay{display: none; position: fixed; height: 100%; width: 100%; top: 0; left: 0; right: 0; bottom: 0; background: url(../images/RoomFields.png); z-index: 5;}
	#TableHolder{position: absolute; top: 25%; left: 50%; background: url(../images/Content.jpg); width: 800px; margin-left: -425px; border-radius: 4px; padding: 25px;}
		#close-table{display: block; text-align: center; margin: 2em 0 0; font-size: 1.1em; color: #2c2c2c; font-weight: bold; text-decoration: none;}
		#TableHolder table{font-size: 1.2em; width: 100%;}
			#TableHolder table th{font-weight: bold; border-right: 1px solid #444; border-left: 1px solid #444; padding: 5px;}
			
/* forms */
#PropertyForm_PropertyForm{}
	#PropertyForm_PropertyForm label.left{float: left; font-family: 'cabin-semibold', Arial, sans-serif; font-size: 1.25em; width: 125px;}
		#PropertyForm_PropertyForm label.left span{display: block; font-size: 0.75em; line-height: 1.1; margin-top: 0.5em;}
			#PropertyForm_PropertyForm label.left span a{display: block; color: #fff; margin-top: 0.5em;}
	.field{background: url(../images/Field.png) 2px 100% repeat-x; margin: 0 0 12px; padding: 19px!important; overflow: hidden;}
		.middleColumn{background: url(../images/input.png); padding: 8px!important; border-radius: 5px; margin-left: 143px;}
			.middleColumn input, .middleColumn select, .middleColumn textarea{background: #ebebeb; font-family: 'cabin-semibold', Arial, sans-serif; color: #202e3a; border: 1px solid #946d00; border-radius: 2px; padding: 7px 5px 5px;}
			.middleColumn textarea{font-family: 'cabin-medium', Arial, sans-serif; font-size: 1em; color: #202e3a; width: 180px; height: 200px;}
			
			.optionset li{padding: 5px 2px;}
				.optionset li input{background: none; border: 0;}
				.optionset li label{color: #fff; font-family: 'cabin-medium', Arial, sans-serif; cursor: pointer;}
			
	.CompositeField{padding: 0!important;}
	#RoomsField{padding: 19px!important;}
		.RoomsFieldGroup{background: none!important; margin: 0; overflow: visible;}
		.SingleRoom{position: relative; background: none!important; margin-left: 143px; overflow: visible;}
			.SingleRoom .middleColumn{margin: 0;}
			.SingleRoomName{background: none!important; padding: 0!important; margin: 0!important;}
			div.SingleRoomname{}
				.SingleRoomName .middleColumn{padding: 12px 12px 10px!important;}
					.SingleRoomName span{color: #fff; font-size: 1em;}
			.SingleRoomEdit, .SingleRoomDelete{position: absolute; top: 8px; width: 19px; height: 19px;}
			.SingleRoomEdit{right: 35px; background: url(../images/SingleRoomEdit.png) no-repeat;}
			.SingleRoomDelete{right: 8px; background: url(../images/SingleRoomDelete.png) no-repeat;}
		.AddRoom{background: url(../images/AddRoom.png) no-repeat; width: 96px; height: 32px; margin-left: 142px;}
		
	#RoomFields{display: none; position: absolute; top: 0; left: 0; background-image: none; width: 100%; height: 100%; z-index: 6; overflow: visible;}
		.Room{display: none; position: fixed; top: 5%; left: 50%; background: url(../images/body.jpg); width: 375px; margin-left: -187px; padding: 20px 17px!important; border-radius: 6px; z-index: 7;}
			.Room .field{font-size: 0.9em; background: none; padding: 6px 0px!important; margin: 0;}
			
	/* CarbonCopy checkbox */
	#CarbonCopy input{float: right; width: auto!important; margin-right: 186px;}
	#CarbonCopy label{padding-top: 0!important;}
			
	/* userform */
	#Content .field{padding: 5px!important;}
		#Content label{float: left; margin-top: 11px;}
			#Content .field input{width: 180px;}
			#Content textarea{width: 280px; height: 125px;}
			#Content .action{background: #d55a00; border-color: #f4cd62 #8d6e1d #8d6e1d #f4cd62; border-width: 1px; border-style: solid; color: #fff; margin-left: 148px; padding: 5px 11px; cursor: pointer; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px;}
		

/* Calculator */
.StepField{background: none!important;}

	#StepField2, #StepField3, #StepField4{display: none;}
	
	.StepHeading{padding: 0 19px!important;}
		.StepHeading h2{font-family: 'cabin-semibold', Arial, sans-serif; font-size: 1.25em;}
		.Description{padding: 1.5em 0 1.6em;}
		
	.StepActions{background: none!important; overflow: hidden; zoom: 1;}
		.StepActions .PreviousStep{float: left; background: url(../images/PreviousStep.png) no-repeat; width: 142px; height: 32px; margin: 5px 19px;}
		.StepActions .NextStep{float: right; background: url(../images/NextStep.png) no-repeat; width: 132px; height: 32px; margin: 5px 19px;}
		.StepActions .Submit{float: right; background: url(../images/Submit.png) no-repeat; width: 149px; height: 32px; margin: 5px 19px;}
		.StepActions .Refresh{display: block; width: 100px; text-align: center; height: 32px; margin: 0 auto; padding-top: 1.2em; color: #66551D;}
			.StepActions .Refresh:hover{text-decoration: none;}
			
	#Calculator p, #AnnualRunningCost label.right{line-height: 1.3;}
	
	
/* Quote */
.ItemPriceField{padding: 0 20px!important; width: 459px;} /* Static width to improve slideDown() */
	.Price{float: right;}
	
#Quote{padding-bottom: 14px!important;}
	#Quote label.left{padding: 14px 0 25px 20px; width: 300px;}

#Installed li{position: relative;}
.Price0, .Price1{position: absolute; top: 5px; right: 0; padding: 5px;}

.ItemPriceField{}
	.ItemPriceField .Title{font-size: 1.15em; text-shadow: 1px 1px 1px #4D4D4D; color: #fff; padding-bottom: 0.3em;}
		.ItemPriceField .Price{font-size: 1.15em; text-shadow: 1px 1px 1px #4D4D4D; color: #fff;}
	.ItemPriceField label.right{padding: 0 0 0.5em 0;}

#PropertyFields, #QuoteFields{background: none; margin: 0;}

#Quote_Circuits, #Quote_Radiators{display: none;}
li.heading{overflow: hidden;}
	li.heading span{float: right; color: #fff; font-family: 'cabin-semibold', Arial, sans-serif; text-align: center; width: 122px; padding-right: 5px; text-shadow: 1px 1px 1px #898989;}
#Boiler .RunningCost{float: right; text-align: right; padding-top: 5px; padding-right: 5px;}
#Boiler .label{font-family: 'cabin-semibold', Arial, sans-serif; font-size: 1.1em;}
#Boiler li{padding: 0.5em 0; width: 100%; overflow: hidden;}
#Boiler .RunningCostHolder{float: right; margin-right: 0.5em;}
	#Boiler .RunningCostField{background: #ebebeb; border: 1px solid #946D00; color: #515151; text-align: right; width: 50px; margin-right: 0.5em; padding: 4px;}
	#Boiler .RunningCostHolder span{display: block; float: right; font-size: 0.8em; color: #5B5B5B; line-height: 25px; width: 36px;}

div.optionset .middleColumn{background: none; margin-top: -4px; padding: 0!important;}
ul.optionset{}
	li.current{background: url(../images/input.png); border-radius: 5px;}
	ul.optionset li label, ul.optionset li em{color: #7A641D!important;}
	ul.optionset li.current label, ul.optionset li.current span, ul.optionset li.current em{color: #fff!important; text-shadow: 1px 1px 1px #898989;}

#KW .middleColumn{background: url(../images/Field.png) 0 100% repeat-x; height: 1.9em; margin-left: 0; padding: 0!important;}
	#KW input{float: right; background: transparent; border: 0; font-size: 1.3em; color: #fff; text-align: right; padding: 0; text-shadow: 1px 1px 1px #4D4D4D;}
	label.right{display: block; font-size: 0.85em; font-family: 'cabin-semibold', Arial, sans-serif; padding: 0.8em 0;}
	#KW .middleColumn span{float: right; font-size: 1.3em; color: #fff; padding-left: 3px; text-shadow: 1px 1px 1px #4D4D4D;}
	@media screen and (-webkit-min-device-pixel-ratio:0){ #KW .middleColumn span{padding-top: 2px;} } /* webkit align */
	
.Room input{width: 200px;}
.Room select{width: 212px;}
.Room .RoomArea input{background-image: url(../images/m2.png); background-position: 192px 50%; background-repeat: no-repeat;}
.Room .CeilingHeight input{background-image: url(../images/m.png); background-position: 192px 50%; background-repeat: no-repeat;}
.Room label span{margin-top: 0.1em!important;}

	
.ItemPriceField{background: none;}

/* Floor Plan */
#Calculator .file_heading{border-bottom: 1px dotted #E3DDAB; color: #fff; padding: 4px 1px;}
	.uploadify_button{white-space: nowrap!important;}
	#Calculator .no_files{color: #fff; font-style: italic; padding-top: 3px;}
	.uploadifyQueueItem, .uploadifyFile{border-radius: 3px; -webkit-border-radius: 3px;}

/* Contact Information */
#ContactInformation{padding: 0 19px 19px 19px!important;}
#ContactInformation label.left{padding-top: 19px;}
	#ContactInformation .field{margin: 0 0 0 143px; padding: 5px 0!important;}
		#ContactInformation .field label{font-size: 1.1em; width: 100px; padding-top: 1em;}
		#ContactInformation .field .middleColumn{margin-left: 110px;}
			#ContactInformation .field input{width: 180px;}
			#ContactInformation .required input{background-image: url(../images/required.png); background-position: 133px 50%; background-repeat: no-repeat;}
			#Message{background: none;}
			
/* Processed */
#StepField4{padding: 50px!important;}

/* Progress Nav */
#Progress{height: 44px; padding: 36px 17px 27px;}
	#Progress a{float: left; width: 146px; height: 44px; margin-right: -5px;}
		#Progress a:hover, #Progress a.current{background-position: 0 100%;}
#ProgressStep1{background: url(../images/ProgressStep1.png) no-repeat;}
#ProgressStep2{background: url(../images/ProgressStep2.png) no-repeat;}
#ProgressStep3{background: url(../images/ProgressStep3.png) no-repeat;}

/* typo */
#Content li{list-style-type: disc; list-style-position: outside;}
tr, td{padding: 5px;}
tr{border-bottom: 1px solid #2c2c2c; border-top: 1px solid #2c2c2c;}
td{border-left: 1px solid #2c2c2c; border-right: 1px solid #2c2c2c;}
#full-table{float: left; background: #D36715; color: #fff; text-decoration: none; border-radius: 3px; margin: 1em 0 2em; padding: 5px 8px 2px;}

/* each Room's KW rating */
.SingleRoomKW{position: absolute; top: 0; right: 60px; font-size: 0.8em; color: #EEED7B; line-height: 39px;}

/* EstimateRunningCost */
#EstimateRunningCost label{margin-right: 25px;}
#EstimateRunningCost span.col{float: left; text-align: center; color: #7A641D; margin-right: 15px;}
	#EstimateRunningCost span.col .middleColumn{display: block; margin-left: 0;}
	#EstimateRunningCost span.col .middleColumn input{width: 60px;}
#EstimateRunningCost span.row{display: block; color: #7A641D; margin: 80px 17px 0 0;}
	#EstimateRunningCost span.row .middleColumn{display: block; font-family: 'cabin-semibold', Arial, sans-serif; text-shadow: 1px 1px 1px #626262; -webkit-text-shadow: 1px 1px 1px #626262; color: #fff; margin-left: 150px; padding: 10px 7px 7px!important;}

/* Comparison */
#Comparison .row{display: block; color: #7A641D; margin: 0 17px 15px 150px;}
	#RunningCost_Electricity{text-align: right; width: 35px;}
	#Comparison .middleColumn{display: block; font-family: 'cabin-semibold', Arial, sans-serif; text-shadow: 1px 1px 1px #626262; -webkit-text-shadow: 1px 1px 1px #626262; color: #fff; margin-left: 0; padding: 10px 7px 7px!important;}