/* CSS styles for Mortgage Force
   Coded by DJENAN KOZIC :: 18/03/2009
   ----------------------------------------------------- */

/* ------ CSS CONTENTS ------

   1. COLOURS, DIMENSIONS & DESIGN NOTES
   2. RESETS
   3. BASICS
   4. HEADER
   5. NAVIGAITON
   6. MAIN CONTENT
   7. FOOTER
   8. FORMS

/*


/* ------ 1. COLOURS, DIMENSIONS & DESIGN NOTES ------



*/

/* ------ 2. YUI Reset Code ------ */

html{color:#000;background:#FFF;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}
del,ins{text-decoration:none;}
li{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym{border:0;font-variant:normal;}
sup{vertical-align:baseline;}
sub{vertical-align:baseline;}
legend{color:#000;}
input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}
input,button,textarea,select{*font-size:100%;}



/* ------ 3. THE BASICS ------ */

body {
	background-color:#f8f8f7;
	font:normal 62.5% "Lucida Sans", Helvetica, Verdana, Sans-serif;
}
strong { font-weight:bold; }
.clear { clear:both; }
.floatleft { float:left; margin:0px 10px 0px 0px;
}


/* ------ 4. HEADER ------ */

div.contact-info {
	width:100%;
	background-color:#4fcae0;
}
	div.contact-info p {
		width:860px;
		margin:0 auto;
		background-color:#41bbd1;
		padding:9px 20px 10px 20px;
		font-size:1.4em;
		color:white;
	}
		div.contact-info p a { color:#B4E9FF; text-decoration:none;	}
		div.contact-info p a:hover { color:#2B5E78; }
div.header {
	height:214px;
	width:900px;
	margin:0 auto;
	background-color:white;
	position:relative;
}
h1.logo {
	position:absolute;
	top:0;
	left:0;
	text-indent:-900em;
	overflow:hidden;
}
	h1.logo a {
		display:block;
		width:666px;
		height:214px;
		background:transparent url('../img/logo.gif') no-repeat top left;
	}
div.header h2.prominent-award {
	background:transparent url('../img/award-tag.png') no-repeat top left;
	position:absolute;
	top:0;
	left:550px;
	height:226px;
	width:171px;
	display:block;
	text-indent:-9000em;
	overflow:hidden;
	z-index:100;
}
div.header h2.address {
	position:absolute;
	height:158px;
	width:186px;
	top:0;
	right:0;
	display:block;
	text-align:right;
	color:white;
	padding:28px 24px;
	font-size:1.7em;
	letter-spacing:-0.1em;
	background: #d2e0e0 url('../img/awards.gif') no-repeat 52px 125px;
	
}
div.header h2.address span { color:#272825; }
div.header h2.address strong { font-weight:bold; }

/* ------ 5. NAVIGAITON ------ */

div.nav-container {
	width:100%;
	background-color:#4fcae0;
}

	ul.nav {
		width:860px;
		background-color:#41bbd1;
		margin:0 auto;
		padding:17px 20px 19px 20px;
	}
		ul.nav li {
			display:inline;
			border-right:1px solid white;
			padding:2px 8px 2px 0;
			margin:0 5px 0 0;
		}
		ul.nav li.last { border:none; padding-right:0; margin-right:0; }
			ul.nav li a {
				text-decoration:none;
				color:white;
				font-size:1.4em;
			}
			ul.nav li a.on, ul.nav li a:hover { color:#1B5880; }


/* ------ 6. MAIN CONTENT ------ */

div.content-wrapper {
	width:880px;
	margin:0 auto;
	background-color:white;
	padding:20px 0 20px 20px;
}

	div.content {
		width:604px;
		float:left;
	}
		
		div.content h2 {
			font-size:2.4em;
			font-weight:bold;
			letter-spacing:-0.05em;
			color:#d9693d;
		}
		div.content h3 {
			font-size:1.6em;
			font-weight:bold;
			letter-spacing:-0.05em;
			color:#d9693d;
			padding: 15px 0px 0px 0px;
		}
		div.content h4 {
			font-size:2.4em;
			font-weight:bold;
			letter-spacing:-0.05em;
			color:#d9693d;
		}
		div.content h5 {
			font-size:2.4em;
			font-weight:bold;
			letter-spacing:-0.05em;
			color:#d9693d;
		}
		div.content h6 {
			font-size:2.4em;
			font-weight:bold;
			letter-spacing:-0.05em;
			color:#d9693d;
		}
		div.content a { color:#d9693d; }
		div.content p {
			font-size:1.2em;
			color:#272825;
			line-height:1.5em;
		}
		div.content p, div.content ul { padding:0.6em 0; }
		div.content li {
			color:#41bbd1;
			font-size:1.2em;
			line-height:1.6em;
			background:transparent url('../img/bullet.gif') no-repeat 0 5px;
			padding-left:16px;
		}
	
	div.aside {
		width: 234px;
		padding:0;
		float:right;
	}
		div.aside p.phone-number { color:#CE522F; font-size:1.2em; line-height:1.6em; margin: 0.8em 0; margin-bottom:20px; }
		div.aside p.phone-number em { font-style:normal; font-size:2.2em; letter-spacing:-0.05em; display:block; font-weight:bold; }
	
	.button {
		display:block;
		color:white;
		padding:13px 30px 15px 15px;
		*padding:10px 30px 15px 15px;
		line-height:15px;
		text-decoration:none;
		font:bold 1.1em  Arial, Sans-serif;
		letter-spacing:-0.05em;
		width:155px;
		margin-left:-2px;
		}
	.red { background:transparent url('../img/button-red.gif') no-repeat top left; }
	.deep-red { background:transparent url('../img/button-deep-red.gif') no-repeat top left; }
	.dark-orange { background:transparent url('../img/button-dark-orange.gif') no-repeat top left; }
	.light-orange { background:transparent url('../img/button-light-orange.gif') no-repeat top left; }
	.yellow { background:transparent url('../img/button-yellow.gif') no-repeat top left; }
	
	div.aside img {
		margin:20px 0 0;
	}


/* ------ 7. FOOTER ------ */

div.footer {
	border-top:1px solid #6D9D99;
	background-color:#9eb4b5;
	width:100%;
	padding:20px 0;
}
	div.footer p {
		width:860px;
		margin:0 auto;
		font-size:1.2em;
		padding:0.6em 20px;
		line-height:1.5em;
		color:white;
	}
	div.footer a {
		color:#608078;
		text-decoration:underline;
	}

/* ------ 8. FORMS ------ */

div.content form {}
div.content form fieldset { 
	clear:both;
	border:1px solid #ccc;
	position:relative;
	padding:25px 10px 10px;
	*padding:40px 10px 10px;
	margin:15px 0;
	background-color:#eee;
	}
div.content form fieldset legend {
	font-size:1.6em;
	font-weight:bold;
	letter-spacing:-0.05em;
	color:#d9693d;
	padding: 0px 0px 0px 0px;
	*padding: 2px 2px 2px 2px;
	*border:1px solid #ccc;
	top:10px;
	*top:-12px;
	position:absolute;
	*background-color:white;
	
}
div.content form fieldset fieldset legend { font-size:1.2em; }
div.content form fieldset fieldset { margin-top:10px; margin-bottom:0; background-color:#fff; }
div.content form fieldset.no-legend, div.content form fieldset fieldset.no-legend { padding-top:10px; }
div.content form fieldset ul {}
div.content form fieldset ul li {
	background-image:none;
	padding:5px 0;
	clear:both;
	}
div.content form fieldset ul li span { float:left; width:10px; padding-right:5px; text-align:right; }
div.content form fieldset ul li label {
	width:250px;
	float:left;
	vertical-align:middle;
}
div.content form fieldset ul li input { float:left; border:1px solid #888; padding:2px; vertical-align:middle; width:200px; margin-right:5px; }
div.content form fieldset ul li input.non-text { border:none; padding:2px; vertical-align:middle; width:auto; margin-right:5px; }
div.content form fieldset ul li textarea { height:50px; float:left; width:300px; }
div.content form fieldset ul li.textarea { height:50px; }
div.content form fieldset input.submit-button { width:10em; font-size:1em; margin:10px auto; background-color:#9BD6E6; color:#0C82A8; border-color:#0C8BB3; }
div.content form fieldset input.submit-button:hover { background-color:#2BABD4; color:white; border-color:#0C8BB3; }