/* 'Safe as Houses' website stylesheet
   V1.0 Paul Bellamy, BellamyStudio, 2007 */

/* core html elements */
* {
	padding:0;
	margin:0
}
body {
	height:100%;
	background-color:#d0ebf6;
	padding:0;margin:0;
	font:0.75em/1.5em "Lucida Grande", Verdana, Tahoma, Arial, sans-serif;
	color:#333
	}
img {
	border:0
	}

h1,h2,h3,h4{
	margin:0 0 5px 0;
	padding:0;
	color:#444
	}

p {
	margin:.25em 0 .5em 0
	}
a {
	color:#369
}
a:hover {
	color:#39c
}
a:visited {
	color:#036
}
hr {
	border:none;
	background-color:#dedede;
	height:1px
}

/* set up floats */

#container, #boxbottom, #header, #logo, #leftColumn,
#rightColumn, #content {
	float:left
}
#aa {
	float:right;
	margin:150px 20px 0 0
}
/* main template layout */
#wrapper {
	margin: 0 auto 25px auto;
	padding:0;
	width:800px;
	text-align:left;
	}
#container {
	position:relative;
	width:800px;
	background:url('../images/template_bg.png') top left repeat-y;
	}
#boxbottom {
	width:800px;
	padding-bottom:20px;
	display:block;
	background:url('../images/template_base.png') bottom left no-repeat;	
}

#header {
	width:760px;
	height:189px;
	margin:0 20px;
	/* ie6 fix */
	_margin:0 10px;
	background: url('../images/siteheader.jpg') top left no-repeat;
}
#header #logo a {
	display:block;
	margin:135px 0 10px 10px;
	padding:0
}
#header #aa {
	float:right;
	margin:140px 20px 0 0 
}

#content {
	margin:10px 20px 20px 20px;
	/* ie6 fix */
	_margin:10px;
	width:760px
}
#leftColumn {
	width:272px;
	margin:10px;
	_margin:10px 5px 10px 5px;
	}
#rightColumn {
	width:440px;
	margin:10px 10px 10px 12px
	}
#footer {
	padding:10px 25px;
}
#footer p {
	font-size:xx-small;
	color:#999;
	border-top:1px solid #ccc;
	padding:10px 0 0 0
}

#rightColumn h3 {
	border-bottom:1px solid #ccc
}
/* bullet list styling */

ul {
	margin:0 0 10px 0
}
ul.checks, ul.info {
	list-style-type:none
}
ul.checks li {
	padding:3px 0 3px 50px;
	background:url('../images/tick.png') top left no-repeat
}

ul.info li {
	padding:3px 0 3px 45px;
	background:url('../images/info.png') 15px 5px no-repeat
}

/* typography */
p.intro {
	font-size:1.2em;
	line-height:1.4em;
	margin:0 0 1em 0
}

/* panels */

div.columnHeading {
	width:440px;
	float:left;
	clear:both;
	margin-bottom:10px;
	padding:bottom:10px;
	/*border-bottom:1px solid #ccc*/)
}
div.columnHeading div.text {
	float:left;
	width:280px
}
div.columnHeading div.text h2 {
	margin-bottom:0
}
div.columnHeading div.text p {
	margin-top:0;
}
div.columnHeading img {
	float:right
}

div.advice, div.contact, div.nav {
	width:272px;
	padding:0 0 10px 0;
	margin:0 0 20px 0
}
div.nav ul {
	margin:10px 0px 10px 20px;
	font-size:80%;
	font-weight:bold;
	list-style-image: url('/images/nav_arr.png')
}


div.advice p, div.contact p {
	margin:5px 10px
}
div.advice, div.nav {
	background-color:#D6E9F0;
	color:#036
}
div.contact {
	background-color:#dbdcc4;
	color:#44470a
}
div.advice img {
	float:left;
	margin:5px 5px 0 0;
	width:60px;
	height:60px
}
div.contact a {
	color:#44470a;
	font-weight:bold
}
div.advice h3, div.contact h3, div.nav h3 {
	width:272px;
	height:30px;
	font-size:12px;
	padding:0;
	margin:0;
	overflow:hidden;
	text-indent:-999em
}
div.nav h3 {
	background:url('/images/essential_information.png') top left no-repeat;
}
div.advice h3 {
	background:url('/images/expert_advice.png') top left no-repeat;
}
div.contact h3 {
	background:url('/images/contact_us.png') top left no-repeat;
}

a.adviceButton {
	width:257px;
	height:35px;
	display:block;
	text-indent:-999em;
	overflow:auto;
	background:url('/images/more_info_button.png') top left no-repeat;
	margin-left:-5px
}
a.adviceButton:hover {
	background-position:0 -35px
}

a.numberList {
	display:block;
	float:left;
	width:430px;
	border:1px solid #ccc;
	padding:5px;
	text-decoration: none;
	color:#666;
	margin-bottom:10px;
	_margin-bottom:0px
}
a.numberList:hover {
	border:1px solid #999;
	color:#333
}
a.numberList div.number {
	float:left;
	background-color: #dedede;
	width:42px;
	height:42px;
	font-size: 36px;
	line-height:42px;
	font-weight: bolder;
	font-style: italic;
	color:#666;
	margin-right:8px;
	text-align:center
}
a.numberList:hover div.number {
	background-color: #666;
	color:#dedede
}
a.numberList div.copy {
	float:left;
	width:375px;
	font-size:90%
}
a.numberList div.copy span.question {
	font-size:130%;
	font-weight:bold
}