/* ACTIVE MENU

*** NOTES ***
[2005-09-20 bsweeney]
Please refer to the documentation at http://www.project2061.org/includes/CodeLibrary/ActiveMenu/activeMenu.manual.htm
*/

#activeMenuBox, #activeMenuBox * {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
}

#activeMenuBox {
	clear: both;
}

/* Nav4.79 seems to mostly ignore styles applied to elements contained within a DL 
unless the style is defined as dl %tag% (where %tag% is a tag contained within the 
list such as a p tag or img tag) ... though there isn't much consistency. Also, 
Nav4 doesn't understand the !important declaration. */
#activeMenuBox dl dt a {
	display: block;
	width: 100%;
	color: #000000;
	text-decoration: none;
	font-weight: bold;
	font-size: 1.1em;
}

#activeMenuBox dl p a {
	/* Sine we needed to use a general declaration in order to bold title links in Nav4 
	we need to make a specific declaration that links in paragraphs are not to be bolded 
	(for any links contained in the story itself). */
	font-weight: normal;
}

#activeMenuBox dt {
	/* This padding was causing Nav4 to indent the dt elements as well (except for the first one). 
	We'll define a 0 padding for Nav4 in the next declaration, newer browsers will use the following. */
	padding: .25em !important;
}

#activeMenuBox dt {
	clear: both;
	display: block;
	padding: 0em;
	margin: 0em;
}

#activeMenuList h3 {
	margin-bottom: 0em;
	padding-bottom: 0em;
}

#activeMenuList p {
	margin-top: 0em;
	padding-top: 0em;
}


/* The .activeMenu class is only applied if the interactive menu is initalized. 
This is assigned only to the screen type "media" so that when printing the menu reverts 
back to the non-interactive view. */
@media screen {
	#activeMenuBox.activeMenu {
		width: 85%;
	}
	
	#activeMenuBox.activeMenu dl {
		padding: .25em 0em .5em 1.5em;
		margin: 0em 0em 0em 0em;
		border: 1px solid #e0e0e0;
		overflow: auto;
		clear: both;
	}
	
	#activeMenuBox.activeMenu dt {
		display: none;
	}
	
	#activeMenuBox.activeMenu dd {
		margin: 0em;
		padding: 0em;
		display: none;
	}
	
	#activeMenuBox.activeMenu dd img {
		margin: .5em;
	}
	
	#activeMenuBox.activeMenu dd p {
		margin: 0em;
		padding: .5em;
	}
	
	#activeMenuBox.activeMenu .storySelected {
		display: block;
	}
	
	#activeMenuBox.activeMenu #activeMenuList {
		padding: .5em 0em .5em 0em;
		margin: .25em .25em .75em .25em;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: .7em;
		overflow: visible;
	}
	
	#activeMenuBox.activeMenu #activeMenuList ul {
		list-style-type: none;
		margin: 0em;
		padding: 0em;
	}
	
	#activeMenuBox.activeMenu #activeMenuList ul li {
		float: left;
		width: 15em;
		text-align: center;
		margin: 0em .25em 0em .25em;
	}
	
	#activeMenuBox.activeMenu #activeMenuList ul li a {
		display: block;
		width: 100%;
		color: #000000;
		text-decoration: none;
		margin: .15em 0em .15em 0em;
		padding: .25em .5em .25em .5em;
		border: 1px solid #ffffff;
	}
	
	#activeMenuBox.activeMenu #activeMenuList ul li a#activeMenuLink0 {
		background-color: #F1F8F0;
	}
	#activeMenuBox.activeMenu #activeMenuList ul li a#activeMenuLink0.storySelected {
		border: 1px solid #66985F;
	}
	
	#activeMenuBox.activeMenu #activeMenuList ul li a#activeMenuLink1 {
		background-color: #FFFDE8;
	}
	#activeMenuBox.activeMenu #activeMenuList ul li a#activeMenuLink1.storySelected {
		border: 1px solid #B3A92E;
	}
	
	#activeMenuBox.activeMenu #activeMenuList ul li a#activeMenuLink2 {
		background-color: #FEF3E6;
	}
	#activeMenuBox.activeMenu #activeMenuList ul li a#activeMenuLink2.storySelected {
		border: 1px solid #A86318;
	}
	
	#activeMenuBox.activeMenu #activeMenuList ul li a#activeMenuLink3 {
		background-color: #EFF1FB;
	}
	#activeMenuBox.activeMenu #activeMenuList ul li a#activeMenuLink3.storySelected {
		border: 1px solid #5466A1;
	}
}

/* We don't want to show the list of headlines during printing, so add a media type "print" 
that hides the list. */
@media print {
	#activeMenuBox.activeMenu #activeMenuList ul {
		display: none;
	}
}