/***********************************

Stylesheet for www.nationalpass.com.au
written by John Penlington May,2009

***********************************/



* { margin: 0; padding: 0 }

body
{
    background-color: #525F33;;
    font-size: 74%;
    font-family: Verdana, Arial, sans-serif;
    background-image:url('images/bg-4.jpg');
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-position: top center;
    behavior:url(js/csshover.htc);
}

#container {
    background-color: transparent;
    color: #000;
    width: 990px;
    margin: auto;
    margin-bottom: 20px;
    padding-bottom: 20px;
    text-align: center;
}

#header
{
    background-color: transparent;
    width: 100%;
    padding-top: 10px;
}

#branding
{
    float: left;
    width: 262px;
    margin-left: 15px;
    border: 1px solid #F5EB34;

}

#top-menu
{
  float: right;
  width: 620px;
  margin-right: 8px;
  background-color: transparent;
}



div.content
{
  clear: both;
  width: 100%;
  margin-top: 20px;
  background-color: transparent;
  text-align: center;
}

#soundslides
{
  text-align: right;
  float: right;
  width: 500px;
  background-color: #5F6B3D;
  border: 4px solid #5F6B3D;
  margin-right: 8px;
}

#soundslides div
{
  background-color: #5F6B3D;
}

#intro
{
  float: left;
  position: relative;
  left: 83px;
  top: 98px;
  width: 245px;
  z-index:-1;
}

#intro h2, #intro h1
{
    padding-left: 10px;
    padding-right: 10px;
    color: yellow;
    font-weight: normal;
    font-size: 1.4em;
    line-height: 130%;
    font-family: ariel, sans-serif;
	background-image: url('images/black-40.png');
	z-index:-1;    
}

#intro-top
{
	height: 12px;
	background-image: url('images/top-black-40.png');
	  z-index:-1; 	
}

#intro-bottom
{
	height: 12px;
	background-image: url('images/bottom-black-40.png');
	  z-index:-1; 	
	
} 	
	
/*************************************
LINKS STYLING
*/

a:link, a:active, a:visited
{
color: blue;
}

a:hover
{
color: red;
text-decoration: none;
}

/*************************************
WALK THE TRAIL PAGES STYLING
*/

#content-stages
{
  clear: both;
  width: 100%;
  height: 500px;
  margin-bottom: 10px;
  padding-bottom: 10px;
  background-color: transparent;
  text-align: center;
}

#content_info
{
	width: 340px;
	float:left;
	margin-top: 60px;
	margin-left: 17px;
	background:  #5F6B3D;
}

#content_info h2, #intro-top h1
{
	color: yellow;
	background-color: #5F6B3D;
	padding: 6px;
	padding-bottom: 3px;
	font-size: 1.3em;
}

#stages-nav 
{
width: 260px;
margin: 0 auto;
height: 24px;
}



#stages-nav img.left
{
float: left;
border: none;
}

#stages-nav img.right
{
float: right;
border: none;
}


#content_text
{
height: 342px;	
overflow: auto;
border: 5px solid #5F6B3D;
background-color: #ADB675;
}

#content_text p
{
	padding-bottom: 6px;
	padding-left: 15px;
	padding-right: 15px;
	text-align: left;
	font-size: 1em;
	line-height: 140%;

}



#slideshow
{
	 float: right;
	 width: 504px;
	 margin-top: 60px;
	 margin-right: 12px;
	 height: 396px;
}

#message-box
{
	 float: right;
	 width: 300px;
	 margin-top: 60px;
	 margin-right: 12px;
	 height: 396px;
	 background-color: #ADB675;
	 padding: 20px
}

div.panel
{
	width:  218px;
	float: left;
	margin-left: 83px;
	margin-bottom: 20px;
	background-color: white;
}

div.panel h3
{
	background-color:  #525F33;
	color: yellow;
	font-size: 1.1em;
	padding: 8px;
	text-align: center;
}

div.panel p
{
	background-color: #889F5A;
	color: black;
	font-size: 1em;
	padding: 10px;
	text-align: left;
	line-height: 125%;
}




#footer
{
clear: both;
margin-top: 20px;
color: white;
background-color: transparent;
margin-bottom: 40px;
width: 950px;
margin: 0 auto;
}

#footer p, .see-through
{
  font-size: .9em;
  padding: 8px;
  background-image: url(images/black-40.png);
  }

#footer p a
{
    color: white;
  }

#footer p a:hover
{
    color: yellow;
    text-decoration: none;
  }

/*****************
GOOGLE MAP STYLING
*/

#map_canvas
{
width: 700px;
height: 350px;
float: right;
margin-right: 16px;
margin-top:120px;
margin-bottom: 20px;
border: 4px solid #5f6b3d;
}


/*********************
"STAY WITH US" STYLING
*/

#places2stay
{
width: 356px;
float: left;
background-color: #ADB675;
height:500px;
margin-left: 17px;
}

#places2stay h3
{
background-color: #5F6B3D;
color: #FFFF00;
padding: 8px;
}

#places2stay p
{
	padding-bottom: 6px;
	padding-left: 15px;
	padding-right: 15px;
	text-align: left;
	font-size: 1em;
	line-height: 140%;
	background-color: #ADB675;
}

#places2stay ul
{
margin-left: 20px;
}

#places2stay ul li
{
text-align: left;
	font-size: 1em;
	line-height: 140%;
}

#side_bar
{
width: 250px;
margin: 0 auto;
text-align: left;
margin-top: 20px;
}

#side_bar a, #side_bar a:visited, #side_bar a:active
{
font-size: 1.2em;
line-height: 180%;
color: blue;
}

#side_bar a:active
{
font-weight: bold;
text-decoration: none;
color: black;
}

div.infowindow
{
padding:10px;
margin: 0 auto;
text-align: center;
background-color: #ADB675;
font-size: 1.3em;
}

div.infowindow a
{
font-size: .9em;
}


/********************
MAPS STYLING
*/
#map-widest
{
width: 950px;
height: 425px;
margin-left: 15px;
margin-right: 15px;
margin-bottom: 30px;
border: 4px solid #5F6B3D;
}

#map-widest img
{
margin: 0;
padding: 0;
}

span.bold
{
font-weight: bold;
color: blue;
}

/********************
DROPDOWN MENU STYLING
*/

#drop_down_menus *
{
margin:0; padding:0; /* remove the default margins and padding on the menu elements */
}

#drop_down_menus
{
behavior:url(csshover.htc);
font-family:verdana, arial, sans-serif;
border:none;
float:left; /* make the div enclose the ul */
margin-left:  16px;
margin-top: 20px; z-index:  1;
clear:both;}#drop_down_menus ul  {   	/* border:2px solid red; */   /*  show the container */
float:left; /* make the ul enclose the li's */
}

#drop_down_menus li
{
/* this div represents the container (left column, perhaps) that you drop the menu into - the menu will expand horizontally to fill the space available */	/* border:2px solid blue; */   /* show the container */
border-left:1px solid #D2DCA7; /* a divider between the list items */
list-style-type:none; /* removes the bullet off each list item */
float:left; /* make the list items sit side by side */
position:relative; /*positioning content for the nested ul (the drop-down) */
background-color:#525F33;
}

#drop_down_menus li:first-child
{
border-left:none; /* no divider needed to the left of the first list items */
}

#drop_down_menus a
{
display:block; /* make the link fill the list item correctly */
padding:.3em 6px; /* pad the link text away from the edge of the list item */
color:yellow;
font-weight: bold;
font-size: 1em;
text-decoration:none;
}

#drop_down_menus a:hover
{
color:#464; /* different text color for the hover */
background-color:#F5EB34;/* different background color for the hover */
}


#drop_down_menus li ul
{
position:absolute; /* positions the drop-down relative the parent li positioning context */
display:none; /* hides the drop-down (revealed when hovered - see below) */
width:13em; /* set the width of the drop-down */
left:-1px;
text-align: left;
}

#drop_down_menus li:hover ul
{
display:block; /* display the menu when hovered */
}

#drop_down_menus li ul li
{
width:100%;  /* makes each li the width of the ul and therefore stack */
border-right:none; /* add borders around the drop-down */
border-top:1px solid #D2DCA7;
border-left:none;
}

#drop_down_menus li ul li:first-child
{
border-left:none; /* overrides the removal of top level left border  */
border-top:none; /* a border across the top of the drop-down */
}

/* a hack for IE 6 - doesn't understand first-child \*/* html #drop_down_menus li ul {	border-top:1px solid #686; /* adds a top border to the drop-downs in IE6 */	}