/****************************************************
  Foundations
****************************************************/

body {
	margin: 0;
	padding: 0;
	background: #4dc5e2 url('../images/main-bg.jpg') 50% 27px no-repeat;
	font-family: Arial, sans-serif;
	font-size: 12px;
	color: #ffffff;
}
#container {
	min-height: 100%;
	position: relative;
	text-align: center;
}
.wrapper {
	width: 950px;
	margin: 0 auto;
	text-align: left;
	position: relative;
}

/****************************************************
  Foundations
****************************************************/

#header {
	height: 125px;
}
	#header #logo {
		float: left;
		margin: 29px 0 0;
	}
	#header #logo a {
		display: block;
		width: 340px;
		height: 71px;
		background: url('../images/logo.jpg') top left no-repeat;
		text-indent: -9999em;
	}
	#header ul#navigation {
		display: inline;
		list-style-type: none;
		float:right;
		position: relative;
		padding: 0;
		margin: 42px 0 0;
	}
	#header ul#navigation li {
		display: inline;
		float: left;
	}
	#header ul#navigation li a {
		display: block;
		height: 36px;
		line-height: 36px;
		width: 107px;
		background: url('../images/nav-bg.jpg') top left no-repeat;
		margin: 0 2px;
		color: #404c26;
		text-decoration: none;
		font-weight: bold;
		font-size: 14px;
		text-align: center;
	}
	#header ul#navigation li a:hover {
		background: url('../images/nav-bg.jpg') bottom left no-repeat;
	}

#header #breadcrumbs {
	display:none;
}

/****************************************************
  BODY
****************************************************/

#body {
	padding-bottom: 136px;   /* Height of the footer */
	position: relative;
	clear: both;
}

	/******************************
	  BODY :: SIDE BAR
	*******************************/
	#side-bar {
		width: 175px;
		float: left;
		position: relative;
		background: url('../images/nav-bg.gif') bottom left no-repeat;
		padding: 0 0 10px;
	}
	#side-bar span.title {
		text-align: center;
		display: block;
		width: 158px;
		height: 52px;
		padding: 30px 17px 0 0;
		background: #4DC5E2 url('../images/nav-bg.gif') top left no-repeat;
		font-family: "Myriad Pro", "Helvetica", Arial, sans-serif;
		font-size: 18px;
		font-weight: bold;
		color: #0183a8;
	}
	#side-bar ul {
		padding: 10px 0 0;
		margin: 0 0 0 13px;
		list-style-type: none;
	}
	#side-bar ul li a {
		color: #107796;
		font-size: 12px;
		text-decoration: none;
		display: block;
		width: 100%;
		padding: 4px 0;
	}
	#side-bar ul li a:hover {
		background: #d6f0f7;
	}
	#side-bar ul li.current a {
		background: #d6f0f7;
		font-weight: bold;
	}
	#side-bar ul li a span {
		padding: 0 0 0 32px;
		font-family: "Myriad Pro", "Helvetica", Arial, sans-serif;
		background: url('../images/footer-bullet.gif') 21px 50% no-repeat;
		font-size: 14px;
		line-height: 14px;
	}
	
	/*******************************
	  BODY :: CONTENT
	********************************/
	#content {
		width: 756px;
		float: right;
		position: relative;
		padding: 0 0 20px 0;
	}
	#content h1 {
		font-family: "Myriad Pro", "Helvetica", Arial, sans-serif;
		font-size: 44px;
		text-shadow: #1380ab -2px 1px 1px;
		margin: 0 0 30px;
	}
	#content a {
		color: #0183a8;
	}
	
	/*******************************
		:: FAQ Page (AKA Content page)	
	********************************/
	#content h2.question {
		font-size: 17px;
		margin: 0;
		padding: 0 0 0 50px;
		background: url('../images/question-icon.gif') center left no-repeat;
		line-height: 41px;
	}
	#content .answer {
		padding: 0 0 0 50px;
		background: url('../images/answer-icon.gif') top left no-repeat;
		margin: 20px 0 0 0;
	}
	#content .answer p {
		font-size: 13px;
		margin: 0 0 5px;
	}
	#content .blockquote {
		margin: 20px 0 20px 56px;
		padding: 10px 0 0 0;
		width: 698px;
		clear: both;
		background: url('../images/faq-blockquote.gif') top left no-repeat;
	}
	#content .blockquote blockquote {
		padding: 0 40px 10px 40px;
		margin: 0 0 0 0;
		display: block;
		width: 618px;
		font-size: 14px;
		font-weight: bold;
		background: url('../images/faq-blockquote.gif') bottom left no-repeat;
	}
	
	/*************************
		:: Contact
	**************************/
	form {
	 margin: 0;
	 padding: 0;
	}
	form .text {
	 border: 1px solid #7f9db9;
	 width: 200px;
	 font-size: 14px;
	 color: #0f4070;
	}
	form .small {
	 width: 110px;
	}
	form p, form h3 {
	 clear: both;
	}
	form label {
	 width: 160px;
	 float: left;
	}
	form input.radio {
	 float: left;
	}
	p.controls {
	 padding: 0;
	 margin: 0 0 5px 0;
	}
	p.street {
	float:left;
	}
	p.radio-yesno {
	 padding: 0;
	 margin: 0 0 0 95px;
	}
	p.radio-yesno label {
	 width: 40px;
	 padding: 0;
	 margin: 0 0 0 3px;
	}
	p.submit {
	 padding: 10px 27px 20px 0;
	 margin: 0;
	 float: right;
	}
	textarea {
	 border: 1px solid #7f9db9;
	 width: 200px;
	 font-family: Arial, Helvetica;
	 font-size: 14px;
	 color: #0f4070;
	}
	
	/*************************
		:: Product page
	**************************/
	table#product-range {
		font-family: "Myriad Pro", "Helvetica", Arial, sans-serif;
		color: #0183a8;
		font-size: 14px;
		font-weight: bold;
		margin: 0 0 20px 0;
	}


/****************************************************
  Footer
****************************************************/

div#footer {
  width:100%;
  display:block;
  position: relative;
  margin-top: -136px;
  height: 136px;
  clear:both;
}

/* footer hack */
html, body, #container {height: 100%;}
body > #container {height: auto; min-height: 100%;}
.clearfix:after {content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;}
.clearfix {display: inline-block;}
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* end footer hack */

	#footer .wrapper{
		height: 136px;
		overflow: hidden;
		background: url('../images/footer-bg.jpg') top left no-repeat;
	}
	#footer .wondersoft {
		width: 235px;
		float: left;
	}
	#footer .products {
		width: 240px;
		float: left;
	}
	#footer .contact {
		width: 240px;
		float: left;
	}
	#footer .sign-up {
		width: 235px;
		float: left;
	}
	#footer span.title {
		display: block;
		visibility: hidden;
		height: 44px;
	}
	#footer ul {
		padding: 10px 0 0;
		margin: 0;
		list-style-type: none;
	}
	#footer ul li {
		padding: 4px 0 0 25px;
		background: url('../images/footer-bullet.gif') 16px 8px no-repeat;
	}
	#footer ul li a {
		color: #107796;
		font-size: 12px;
		text-decoration: none;
	}
	#footer ul li a:hover {
		border-bottom: 1px dotted;
	}
	#footer .sign-up a {
		display: block;
		width: 121px;
		height: 36px;
		background: url("../images/footer-sign-up.jpg") top left no-repeat;
		text-indent: -9999em;
		margin: 13px 0 0 15px;
	}
	#footer .sign-up p {
		margin: 5px 15px 0 15px;
	}