/*
Author:		Peter Boere
Company:	Hyperlaunch New Media
*/
/*--------------------------------------------------------------------------- Browser Reset and Utilities ---*/
html{overflow-y:scroll;}div,ul,ol,li,dt,dd,dl,blockquote,fieldset,table,td,th,p,h1,h2,h3,h4,h5,h6,body,form{padding:0;margin:0;}ol,ul{list-style:none;}abbr,img,fieldset{border:0;}.tr{text-align:right;}.tl{text-align:left;}.fl{float:left;}.fr{float:right;}.tc{text-align:center;}.hide{display:none;visibility:hidden;}textarea{overflow-y:auto;}table{border-collapse:collapse;}

.li-ca li:after, .ca:after, .content:after {content:".";display:block;visibility:hidden;height:0px;clear:both;}
.li-ca li, .ca, .content {zoom:1;}

/*--------------------------------------------------------------------------- Debug ---*/
/*a[target=_blank]:after {content:'^';background:red;color:#fff;font-weight:bold;padding:3px;}*/

/*--------------------------------------------------------------------------- Consistent Elements ---*/
body {background:#333;margin:0;padding:0;}

.wrap {width:760px;font:11px/1.2 arial,sans-serif;
	background:#c8c7c7 url(../images/banners/chillin.jpg) no-repeat;	
	min-height:475px;height:475px;}
	.wrap[class] {height:auto;}
	.wrap p {padding-bottom:1em;}
	.wrap img {border:0;}
	.wrap a {color:#f60;}
	.wrap a:hover {}
	.wrap li.on a {cursor:default;} 
		.wrap li.on a:hover {text-decoration:none;} 
	
	.wrap .region-header {margin-bottom:2px;padding:0 0 3px 0;font-size:25px;letter-spacing:-1px;
		font-family:'Arial Rounded MT Bold',arial,sans-serif;font-weight:normal;color:#fff;
		background:0;}
	.wrap .region-header span {padding:0 11px 3px 7px;background:#f60;}

	.wrap h2 {font-size:12px;color:#fff;} 
	.wrap h3 {font-size:11px;} 
	.small {font-size:10px;}
	
	#Feature {background-image:url(../images/banners/bath-1.jpg);}
	#ProjectPlanner {background-image:url(../images/banners/lawn.jpg);}
	#RefreshForLess {background-image:url(../images/banners/alfresco.jpg);}
	#Competition {background-image:url(../images/banners/bath-1.jpg);}

#nav-1 {background:#fff;padding-bottom:4px;font-size:12px;}
	#nav-1 a {background:#332d2d;display:block;padding:4px 10px;color:#fff;margin-bottom:1px;zoom:1;
		text-decoration:none;}
	#nav-1 a:hover {text-decoration:underline;}

#Home #nav-1-home a,
#Feature #nav-1-this-months-feature a,
#ProjectPlanner #nav-1-project-planner a, 
#RefreshForLess #nav-1-refresh-for-less a, 
#Competition #nav-1-competition a 
	{background:#808000;}

.layout-2 .block .inner {padding:14px 17px;}

.content {padding:0 0 2em;}
	.content h2 {background:#3f3f3f;font-size:13px;padding:4px 10px 5px;}
	.content .page-header {font-size:12px;color:#fff;background:#3f3f3f;font-size:13px;
		padding:4px 10px 5px;}

.area-1 {float:left;width:160px;}
.area-2 {float:right;width:595px;}

#BandQ-banner {height:113px;position:relative;}
	#BandQ-banner h3 {position:absolute;left:-100em;}
	#BandQ-banner h6 {left:0px;top:3px;font-size:10px;position:absolute;letter-spacing:1px;color:#fff;
		background-color:#333;padding:1px 4px 2px;opacity:.9;filter:alpha(opacity=90);} 

.wrap .block {margin-bottom:4px;}
	.block img {display:block;}
	.block img.fr {border:1px solid #333;margin:3px 0 10px 15px;}
	.block .inner {background-color:#fff;padding:8px 10px;background-repeat:repeat-x;}
	.block span.cta {display:block;}
	.block h4 {font-size:11px;padding:0;font-weight:normal}
		.block h4 strong {font-size:12px;padding:0 0 0 4px;}
	.block .cta {display:block;background:#3f3f3f url(../images/arrow.png) 8px 50% no-repeat;text-transform:uppercase;color:#f60;
		padding:5px 16px;font-weight:bold;font-size:10px;letter-spacing:1px;zoom:1;text-decoration:none;}
	.block .cta:hover {color:#fff;text-decoration:none;}

	#Feature .image-wrapper a {text-decoration:none;color:#000;zoom:1;}
	#Feature .image-wrapper a:hover {color:#f60;}
	#Feature .image-wrapper a strong {display:block;background:#fff;padding:8px;
		font-weight:normal;}
	#Feature .image-wrapper a span {font-weight:bold;font-size:12px;padding:0 0 0 4px;
		position:relative;top:1px;} 
	
.layout-1 .column-1 {float:left;width:292px;}
.layout-1 .column-2 {float:right;width:291px;}
.layout-1 .column-1 .image-wrapper {overflow:hidden;width:292px;}	
.layout-1 .column-2 .image-wrapper {overflow:hidden;width:291px;}
#ProjectPlanner .block .inner {min-height:118px;height:118px;}
#ProjectPlanner .block .inner[class] {height:auto;}

.layout-3 .area-2-trim {background:#fff;}
	.layout-3 .column-1 {float:left;width:437px;}
	.layout-3 .column-2 {float:right;width:155px;}

/*--------------------------------------------------------------------------- Upload form ---*/
.list-fields {}
	.list-fields li {padding:0 0 .8em;}
	.list-fields label {text-align:right;float:left;color:#f60;width:145px;
		font-size:11px;font-weight:bold;padding:3px 7px 0 0;}
	.list-fields label span.small {color:#444;float:none;}
	.list-fields span {float:left;width:260px;}
	.list-fields .last {padding:.5em 0 0;}	
	.list-fields input.submit {background:#444;color:#fff;width:9em;font-size:11px;
		border:1px solid #444;padding-top:2px;padding-bottom:2px;cursor:pointer;}
	.list-fields .hide * {display:none;visibility:hidden;}
	em.required {background:url(../images/required.png) right top no-repeat;padding-left:6px;}
	em.required em {visibility:hidden;}
	
input.text, 
textarea {width:200px;border-style:solid;border-color:#888 #ddd #ddd #888;border-width:1px 1px 1px 1px;
		padding:1px 3px;}	
textarea {height:80px;font-size:12px;font-family:arial,sans-serif;}

.error-message {display:block;zoom:1;}
	.error-message b {display:block;margin:5px 0;zoom:1;} 
	.error-message strong {padding:1px 4px;background:#f60;font:bold 11px arial;color:#fff;}

/*--------------------------------------------------------------------------- Competition ---*/
#ts-and-cs {border-top:1px solid #ffd0b2;padding:10px 0;}

#competition-iframe {width:100%;height:417px;}

.btns {padding:12px 0;}
	.btns a {background:#444;color:#fff;text-decoration:none;
		padding:3px 10px;}
	.btns a:hover {text-decoration:underline;}

/*--------------------------------------------------------------------------- Project planner ---*/
#shopping-list {background:url(../images/project-planner/shopping-list-top.png) no-repeat;} 
	#shopping-list-trim {padding:24px 42px 35px 34px;
		background:url(../images/project-planner/shopping-list-bottom.png) -7px bottom no-repeat;}

	#content .shopping-list-short {background-image:url(../images/project-planner/shopping-list-top-short.png);} 
	
	#shopping-list h2 {color:#f60;font-size:20px;letter-spacing:0;zoom:1;background:0;
		padding:0 0 .6em;font-family:'Arial Rounded MT Bold',arial,sans-serif;font-weight:normal;} 
	#shopping-list h2 span {display:block;color:#000;font-size:12px;background:0;
		font-family:arial,sans-serif;letter-spacing:0;padding:0;font-weight:bold;zoom:1;}
	#shopping-list h3 {font-size:15px;background:0;padding:0;font-weight:bold;padding:0 0 .2em;
		color:#f60;zoom:1;}
	#shopping-list h3 span.small {display:block;font-size:11px;color:#444;}
	#shopping-list h4 {font-size:13px;font-weight:bold;color:#f60;padding:0 0 2px;}
	#shopping-list ul {padding:0 0 1.5em;}
	#shopping-list li {border-top:1px solid #e0e0e0;padding:.5em 0 .7em;}
	#shopping-list p {padding:0 0 .3em;}
	#shopping-list .fl {width:253px;}
	#shopping-list .fr {width:100px;}	
	#shopping-list .fr a {background:url(../images/project-planner/more-btn.png) center repeat-x;
		color:#fff;float:right;width:5em;text-align:center;padding:4px 4px;text-decoration:none;
		margin-top:2px;}
	#shopping-list .fr a:hover {text-decoration:underline;}
	#shopping-list .fr .small {display:block;text-align:right;padding:0 0 3px;line-height:1.1;}
	#shopping-list .price {display:block;color:#f60;font-size:14px;font-weight:bold;text-align:right;
		padding:0 0 0px;}

.tbl-shopping-cost {width:100%;font-size:12px;color:#222;line-height:1.1;
	margin-bottom:2em;}
	.tbl-shopping-cost th,
	.tbl-shopping-cost td {padding:.2em 0 .2em;vertical-align:top;border-bottom:1px solid #e0e0e0;}
	.tbl-shopping-cost th {text-align:left;padding-right:30px;}
	.tbl-shopping-cost td {font-weight:bold;color:#f60;font-size:14px;text-align:right;}
	.tbl-shopping-cost .total td,
	.tbl-shopping-cost .total th {padding-top:1.3em;padding-bottom:.2em;;border-bottom:2px solid #bbb;}

	#print-shopping-list {display:block;background:url(../images/print.png) right center no-repeat;
		text-align:right;padding:14px 56px;font-weight:bold;text-decoration:none;font-size:12px;}
	#print-shopping-list:hover {text-decoration:underline;}

#nav-pp {font-size:12px;padding:25px 0 0 3px;}
	#nav-pp li {padding:.3em 0;}
	#nav-pp li.on {opacity:.5;filter:alpha(opacity=50);cursor:default;zoom:1;background-color:#fff;}
	#nav-pp li.on a:hover {text-decoration:none;}
	#nav-pp a {font-weight:bold;text-decoration:none;padding:0 0 0 9px;
		background:url(../images/arrow.png) 0px 50% no-repeat;}	
	#nav-pp a:hover {text-decoration:underline;}		

#how-to-guide {padding:10px 10px 0 23px;}
	#how-to-guide h2 {color:#f60;background:0;padding:10px 0 .1em;font-size:17px;
		border-bottom:1px solid #f60;margin:0 0 .3em;}
	#how-to-guide 

.list-steps {}
	.list-steps h3 {color:#f60;font-size:14px;padding:0 0 4px;}
	.list-steps h3 em {color:#000;font-style:normal;color:#444;
		padding:0 0 0 3px;}
	.list-steps li.first {border:0;}
	.list-steps img.fr {margin:0 0 5px 12px;}
	.list-steps li {border-top:1px solid #ffd1b2;padding:.7em 0;}
	.list-steps div.fl {width:275px;}
	.list-steps div.fr {width:105px;text-align:right;}	
	.list-steps div.fr img,
	.list-steps img.fr {border:1px solid #f60;margin-top:2px;}
	.list-steps img.no-border {border:0;}
	.list-steps ol.fl {width:200px;}
	.list-steps ol li {padding:0 0 .8em 10px;background:url(../images/dash.png) 0px .5em no-repeat;
		border:0;}
	.list-steps .image-wrapper.tc {padding:0 0 1.2em;}