/* CSS Document */

#sidebar {
	background: #115B5B;
}

#bar { /* a container for a menubar. one per page. */
	padding: 0;
	width: 200px;
	font-family: 'Comic Sans MS'; 
	font-size: 14px;

}

#bar div { /* ANY layer in the menubar. WATCH OUT FOR THE CONSEQUENCES OF USING THIS */
	padding-bottom: 1px;
}

#bar div.main, #bar div.sub1, #bar div.sub1L, #bar div.sub2, #bar div.sub2L, #bar div.sub3, #bar div.spacer { /* Any link layer, including spacers */
	height: 21px;
}

#bar div.main { /* Any of the top-level elements */
	border-bottom: solid 1px #006666;
	margin: 0;
	padding-left: 20px !important;
}


#bar a:hover, #bar div.main:hover, #bar div.sub1:hover, #bar div.sub1L:hover, #bar div.sub2:hover, #bar div.sub2L:hover, #bar div.sub3:hover { /* All link layers except currently selected top level element in hover state*/
	background-color: #004444;
}

#bar a { /* Any link in a layer in the nav bar */
	width: 100%;
	text-decoration: none;
	color: #CCFFFF;
}

.sub1 { /* the main items under the title */
	text-indent: 30px !important;
}

.sub1L {
	text-indent: 30px !important;
	background-position: 10px 0;
}

.sub2 { /* subcategories under the mains */
	text-indent: 50px;
}

.sub2L {
	text-indent: 50px !important;
	background-position: 30px 0;
}

.sub3 { /* specifics under the subcategories (not always used) */
	text-indent: 70px;
}

.togglemenu { /* these are grouped menu items that will toggle visibility, but the grouping should be invisible */
	border: 0 !important;
	padding: 0 !important;
	height: auto !important;
	display: none;
}
#bar .main, #bar .sub1L, #bar .sub2L { /* All layers which contain links */
	background-image: url("../gfx/lightbulb-off.gif");
	background-repeat: no-repeat !important; 
}


.category { /* A fold out in a menu. Nesting is taken care of because this compounds because of nested elements with a margin. */
}

.category-top {
 /* Placeholder for bubbles look */
}

.category-bottom {
 /* Placeholder for bubbles look */
}