/* - - - - - - - - - - - - - - - - - - - - -

Title : ULTIMATE ARBOR//
URL : http://www.ultimatearbor.com.au

Author : NHN DESIGN
		 naomi.h.ngo@gmail.com

- - - - - - - - - - - - - - - - - - - - - */

/*----------------------------------------------------------------------------- 
Global Styles
-----------------------------------------------------------------------------*/

html,body,div,dl,dt,dd,pre,form,fieldset,input,textarea,blockquote { 
	margin:0; 
	padding:0; 
}

html { 
	margin:0; 
	padding:0; 
	overflow: -moz-scrollbars-vertical;
}

body {
	padding: 0;
	margin: 0;
	font: normal 12px Arial, Helvetica, sans-serif;
	color: #666666;
	background-color: #fff;
	background: #cccccc url(../images/bodybg.jpg) repeat-x;
}

a {
	color: #6cbd41;
	text-decoration: underline;
}

a:hover {
	color: #000;
	text-decoration: underline;
}

fieldset { 
	border: 0; 
}

img { 
	border: 0; 
}

h1 {
	font: normal 18px Arial, Helvetica, sans-serif, "Trebuchet MS";
	color: #6cbd41;
}

h2 {
	font: bold 16px Arial, Helvetica, sans-serif, "Trebuchet MS";
	color: #6cbd41;
}

h3 {
	font: bold 14px Arial, Helvetica, sans-serif, "Trebuchet MS";
	color: #6cbd41;
}

p, td, li {	
	font: normal 12px/18px Arial, Verdana, Helvetica, sans-serif;
	color: #666;
}

.clear { 
	clear: both; 
	font-size: 0; 
	height: 0; 
	line-height: 0; 
}

hr {
	height: 1px;
	border: solid;
	color: #ccc;
}

html>body hr {
	border: none; 
	border-top: 1px solid #ccc;
}

#content_area li, #content_area_wrap li {
	list-style: square;
}

/*----------------------------------------------------------------------------- 
Template Styles
-----------------------------------------------------------------------------*/

#container {
	margin: 0 auto;
	background: url(../images/containerbg.png) repeat-y;
	padding-bottom: 10px;
}

#logowrapper {
	margin: 0 auto;
	/*height: 137px;*/
	background: url(../images/logobg.jpg) no-repeat;
}
	

#bannerimage {
	margin: 0 auto;
	border-bottom: 5px solid #fff;
}

#content_area {
	/*width: 901px;*/
	height: 250px;
	min-height: 250px;
	margin: 0 auto;
	padding: 10px;

}

html>body #content_area {
	height: auto;
}


#content_area_wrap {
	width: 911px;
	margin: 0 auto;
	background: url(../images/contentbg.jpg) no-repeat bottom right;
	padding-left: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
}

	#bodytext {
		float: left;
		border-right: 1px dashed #ccc;
		padding-right: 10px;
	}
	
	#quicklinks {
		/*width: 250px;
		float: right;
		text-align: right;*/
	}

#footer {
	width: 921px;
	margin: 0 auto;
	font: normal 11px/18px Arial, Helvetica, sans-serif;
	color: #fff;
	/*background: url(../images/footerbg.jpg) repeat-x;*/
	background: #fff;
	
}

	#footer_left {
		margin: 0 auto;
		background: #c0c0c0; /* Old browsers */
		background: -moz-linear-gradient(top, #c0c0c0 0%, #9b9b9b 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top, #c0c0c0 0%,#9b9b9b 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, #c0c0c0 0%,#9b9b9b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c0c0c0', endColorstr='#9b9b9b',GradientType=0 ); /* IE6-9 */
		width: 100%;
		text-align: center;
	}
		#footer_left img {
				vertical-align: middle;
			}
	
	#footer_right {
		width: 921px;
		margin: 0 auto;
		text-align: right;
		padding: 0px 0 20px 0;
		font: normal 11px/16px Arial, Helvetica, sans-serif;
	}

		a.footer {
			color: #666;
			text-decoration: underline;
		}
		
		a.footer:hover {
			color: #000;
			text-decoration: underline;
		}



/*
----------------------------------------------------------------------------- 
MAIN NAVIGATION MENU
-----------------------------------------------------------------------------*/
/* -- Top Menu Sucker Fish 4 Level -- */

#navbar {
	width: 916px;
	height: 47px;
	margin: 0 auto;
	background: url(../images/navbar.jpg) repeat-x;
	font: bold 15px/47px Arial, Helvetica, sans-serif;
	color: #fff;
	padding-left: 5px;
}

	#nav, #nav ul {
		width: 900px;
		height: 47px;
		padding: 0;
		margin: 0;
		list-style: none;
		}
	
	#nav li {
		float: left;
		padding: 0;
		height: auto;
		margin: 0;
		}
	
	#nav li.selected { 
		color: #fff;
		text-decoration: none;
		}
	
	#nav li a {
		color: #fff;
		font: bold 15px/47px Arial, Helvetica, sans-serif;
		text-transform: uppercase;
		display: block;
		text-decoration: none;
		padding: 0 21px 0px 11px;  
		}
			
	#nav li a:hover { 
		color: #000;
		}
	
	#nav li.selected a { 
		color: #000;
		text-decoration: none;
		}
		
	#nav li.selected a:hover { 
		color: #000;
		text-decoration: none;
		}
		
	#nav li:hover, #nav li.hover {
		position: static;
	}

@media(min-width: 800px) {
	#container {
		width: 961px;
		margin: 0 auto;
		background: url(../images/containerbg.png) repeat-y;
	}
	#logowrapper {
		width: 921px;
		height: 137px;
	}
		#logo {
			width: 459px;
			height: 137px;
			float: left;
		}
		#myLinks {
			display: none;
		}
		a.icon {
				display: none;
			}
		#details {
			float: right;
			text-align: right;
			width: 400px;
			height: 22px;
			padding-top: 115px
		}
	#content_area {
		width: 901px;
	}
	#bodytext {
		width:650px;
	}
	#bannerimage {
		width: 921px;
		height: 212px;
	}
	#quicklinks {
		width: 250px;
		float: right;
		text-align: right;
	}
	#footer_left {
		/*width: 760px;
		height: 80px;*/
		margin: 0 auto;
	}
}

@media(max-width: 799px) { /*Mobile*/
	body {
		background: #eee;
	}
	#container {
		/*width: 100%;*/
		margin: 0 auto;
		background: #fff;
		margin-left: 10px;
		margin-right: 10px;
	}
	#logowrapper {
		width: 100%;
		background: url(../images/logobg-mobile.jpg) no-repeat;
		float: right;
	}		
	#logo { 
		margin: 0 auto;
		width: 100%;
		text-align: left;
		margin-top: 10px;
		margin-left: 6px;
	}
		#logo img {
			width: 210px;
		}
	#details {
		float: left;
		margin-bottom: 0;
		margin-top: 20px;
		text-align: center;
		width: 100%;
		padding-bottom: 10px;
	}
	#bannerimage {
		padding-left: 10px;
		padding-right: 10px;
	}
		#bannerimage img {
			width: 100%;
		}
	#content_area_wrap {
		width: 100%;
		padding-left: 0;
		/*padding: 0 10px 10px 10px;*/
		background: none;
	}
		#bodytext {
			/*width: 100%;*/
			border-right: none;
			padding: 10px 0 10px 10px;
			border-bottom: 1px dashed #ccc;
			padding-bottom: 10px;
			margin-bottom: 15px;
		}
			#bodytext h1 {
				margin: 0;
			}
	#quicklinks {
		text-align: center;
	}
	#footer {
		width: 100%;
		float: left;
		background: #fff;
	}
		#footer img {
			/*display: block;*/
		}
		#footer_left {
			/*clear: both;*/
		}
			#footer_left a {
				/*float: left;*/
			}
		#footer_right {
			width: 100%;
			clear: both;
			margin-right: 10px;
			text-align: center;
		}
	
	#navbar {
		display: none;
	}
	/* Style the navigation menu */
	.topnav {
	  overflow: hidden;
	  position: relative;
	  float: right;
	  width: 100%;
	}

	/* Hide the links inside the navigation menu (except for logo/home) */
	.topnav #myLinks {
	  display: none;
	  background-color: #333;
	  margin-top: 10px;
	}
	
	.topnav #logo a {
		padding: 0;
		width: 210px;
	}
		.topnav #logo a:hover {
			background: none;
		}

	/* Style navigation menu links */
	.topnav a {
	  color: white;
	  padding: 14px 16px;
	  text-decoration: none;
	  font-size: 17px;
	  display: block;
	}

	/* Style the hamburger menu */
	.topnav a.icon {
	  background: #6cbd41;
	  display: block;
	  position: absolute;
	  right: 10px;
	  top: 20px;
	}

	/* Add a grey background color on mouse-over */
	.topnav a:hover {
	  background-color: #ddd;
	  color: black;
	}

	/* Style the active link (or home/logo) */
	.active {
	  background-color: #6cbd41;
	  color: white;
	}
}