/* CSS Document */

 /* ################################################## */
/* ################################################## */
/* ################################################## */
/* garden */
/* ################################################## */
/* ################################################## */
/* ################################################## */


/* ################################################## */
/* ################# LOGO AND STRAP STYLES ################## */
/* ################################################## */


#logo-panel-garden {
	width: 100%;
	height: 104px;
	background-color: #a7d500;
	background-image: url(../images/logo-panel-garden.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	margin: 0;
	}
	
#logo-panel-garden .headline {
	font-size: 150%;
	color: #fff;
	font-weight: normal;
	line-height: 130%;
	 
	width: auto;
	display: box;
	position: absolute;
	top: 6%; right: 5%;
	}
	
	
	
/* ################################################## */
/* ################# NAVIGATION  STYLES ################## */
/* ################################################## */


#navigation-panel-garden {	
	width: 100%;
	height: 30px;
	background-color: #cbe674;
	background-image: url(../images/navigation-panel-garden.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	border-bottom: 1px solid #00541f;
	margin: 0;
	padding: 0;
	font-size: 60%;
	letter-spacing: -1px;
	}
	
#navigation-panel-garden a:link {color: #00541f; text-decoration: none;}
#navigation-panel-garden a:visited {color: #00541f; text-decoration: none;}
#navigation-panel-garden a:hover {color: #00541f; text-decoration: none;}
#navigation-panel-garden a:active {color: #b12a24; text-decoration: none;font-weight: bold;}

 /* remove the margin and bullets, set the padding for this demo only*/
#navigation-panel-garden .button {margin:0; padding:1px 0 0px 182px; list-style:none;}

 /* display the list items inline with a right margin to space the buttons. Use this to pre-load the hover image */
#navigation-panel-garden .button li {
	display:inline;
	float:left;
	margin-right:1px;
	background-image: url(../images/hover_button.gif);
	background-repeat: no-repeat;
}

/* style the links and place the background image to start from left edge */
#navigation-panel-garden .button li a {display:block; height:28px; float:left; background:url(../images/button.gif);background-repeat: no-repeat; text-decoration:none; padding-left: 10px; padding-right: 10px; padding-top: 5px; padding-bottom: 0;}

/* style the link hover and the link hover b to replace the background image - border:0 needed for IE6 to work */
#navigation-panel-garden .button li a:hover, 
 {border:0; background-image:url(../images/hover_button.gif); background-repeat: no-repeat;cursor:pointer;}

/* style the active state to replace the background image. This can also be used for a 'current' tab if you wish */
#navigation-panel-garden .button li a:active, 
#navigation-panel-garden .button li a.current {background-image: url(../images/active_button.gif);background-repeat: no-repeat;}