/*
	JL DECKING (.co.uk) / HANDHELD_CSS.CSS
	
	This is the handheld stylesheet for the website.
	This version is placed after the master stylesheet
	and overides it for when the site is viewed on a hand-
	held device.
	
	Created:		07/08/08
	Created By:		James Marriott @ Joal Leisure
	Last Modified:	07/08/08
*/

/* ----- RESETS ----- */
body { background:#fff; margin:5px; padding:0; }

h1, h2, h3, h4, h5, p { margin:0; padding:0; font-family:Georgia, Arial, Helvetica, sans-serif; }


/* ----- PRIMARY DIVISIONS ----- */
#header {
	width:960px;
	height: 57px;
	background:transparent;
	margin:0 auto; padding:0 0 1em 0;
}

		/* Header specific styles */
		#header_logo { 
			width:642px; 
			height:54px; 
			background:url('../../../images/logo.png') no-repeat; 
			margin:5px 0 0 5px;
			float:left;
			}

		/* Header specific styles */
		#fitrite_logo { 
			width:86px; 
			height:50px; 
			background:url('../../../images/fitrite_logo.gif') no-repeat; 
			margin:5px 5px 0 0;
			float:right;
			}


/* Navigation menu for top of page */
#navbar { /* This division acts as a container for the navbar ul eliments */
	width: 100%;
	background:#006f00;
	margin:0;
	padding:0;
	float:left;
}

		/* Navigation specific styles */
		#navbar_container {
			width: 960px;
			background:url() repeat-x;
			margin: 0 auto;
			padding: 0;
			font:bold 14px Geneva, Arial, Helvetica, sans-serif;
			}
		#navbar_container ul { /* Define the style of the individual ul elements */
			width: 12%;
			border-left: 1px solid #222; 
			background: url(../images/navbar-button-0b.png);
			margin: 0;
			padding: 0;
			float: left;
			list-style: none;
			text-align: center;
			}
		#navbar_container a, #navbar_container h2 { /* Define the style of the links within the navbar division */
			display: block;
			margin: 0;
			padding: 12px 0;
			background: transparent;
			text-decoration: none;
			color:#ccc;
			}
		#navbar_container a.active {
			background: #43bd35 url(../images/nav_hover_bg.png);
			margin: 0;	padding: 12px 0;
			text-transform: none;
			color:#2e3f4f;
			}
		#navbar_container a:hover { /* Define the style of the links when hovered over within the navbar division */
			background: #43bd35 url(../images/nav_hover_bg.png) repeat-x;
			margin: 0; padding: 12px 0;
			text-transform: none;
			color:#2e3f4f;
			}


#wrapper {
	width: 960px;
	background: #fff;
	margin: 0 auto; padding: 0;
	}

		#bread {
			width: 100%;
			background: #00a;
			margin: 0; padding: 0;
			float: left;
			}
				/* Text styles */
				#bread p { background:inherit; padding:5px 0; font:14px normal; color:#fff; }


#banner {
	width: 100%;
	height: 300px;
	background: #fff url('') no-repeat center;
	margin:1em 0;
	padding:0;
	float:left;
	}


#left {
	width: 800px;
	background:transparent;
	border-right:1px solid #222;
	margin:0; padding: 0;
	float: left;
	}


#right {
	width: 159px;
	height: 500px;
	background:inherit;
	margin: 0; padding: 0;
	float: left;
	}


#footer {
	width: 100%;
	background:#006f00;
	border-top:1px solid #222;
	margin:1em 0; padding:0;
	float:left;
	}

		#footer_links {
			width:960px;
			margin:0 auto;
			padding:5px;
			}
			
				#footer_links_left {
					width:200px;
					margin:0; padding:0;
					float:left;
					}

				#footer_links_center {
					width:200px;
					margin:0; padding:0;
					float:left;
					}

				#footer_links_right {
					width:200px;
					margin:0; padding:0;
					float:left;
					}


/* ----- SECONDARY DIVISIONS / CLASSES ----- */
.left_container {
	width:100%;
	margin:0 0 2em 0; padding:0;
	float:left;
	}
	
	.left_container h1 { margin:0; font:24px bold; }
	
	.left_container h1 span { font:14px normal; vertical-align:text-top; } 
	
	.left_container img { margin:0 5px 5px 0; float:left; }
	
	.left_col {
		width:395px;
		margin:0 5px 0 0; padding:0;
		float:left;
		}
	
	.right_col {
		width:395px;
		margin:0 0 0 5px; padding:0;
		float:left;
		}


#left_offset {
	width: 700px;
	background:transparent;
	border-right:1px solid #222;
	margin-left:100px; padding: 0;
	float: left;
	}


.page_description {
	width:690px; /* Total width = 690+5+5 = 700 */
	margin:1em 0;
	padding:5px;
	}

		.page_description p { margin-bottom:1em; line-height:1.5em; }
	

.img_border {
	width:300px;
	border:1px solid #222;
	margin:0 10px 0 -100px;
	padding:5px;
	float:left;
	}


.page_header {
	margin:5px;
	font:32px bold;
	}
		.page_header span { font:14px normal; vertical-align:text-top; }

/* ----- TEXT STYLES ----- */



/* ----- CONTACT ----- */
.contact { width:100%; background:#fff; border-top:1px solid #2e3f4f; margin:1em 0 0 -100px; padding:0; float:left; }

.contact_intro { width:100%; margin:1em 0; float:none; }

.contact_form { margin:0; padding:0; }

.contact_form .form_input { width:100%; margin-bottom:1em; float:left; }

.contact_form .form_submit { width:40%; margin:1em 50%; float:left; }

.contact_form form fieldset { border:0; padding:1% 0; }

.contact_form input, textarea { background:#fff; border:1px solid #2e3f4f; padding:2px; color:#222; } /**/

.contact_form label { display:block; width:7em; float:left; text-align:left; margin-right:0.5em; }

.contact_form p { width:100%; float:left; text-align:center; }

.contact_form p label { width:15em; float:left; }

.contact_form p input { width:2em; float:left; }

.contact_form .submit { border:1px solid #2e3f4f; color:#2e3f4f;	}