/*  //// Layout13 from http://blog.html.it/layoutgala   /////   */

div#sandboxshell{
	float:left;
	width:100%;
	}

div#sandbox{
	margin: 0 200px;
	border:1px solid red;
	background:yellow;
	height:200px;
	overflow : auto; 
	}

div#navigation{
	float:left;
	width:200px;
	margin-left:-100%;
	}

div#extra{float:left;
	width:200px;
	margin-left:-200px;
	}

/*adjust these for a sticky footer. */

#footer, #stickyfooter {
	height: 4em; /* .push must be the same height as .footer */
	}
	
#container {
	margin-bottom:-4em; /* the bottom margin is the negative value of  the footer's height */
	}


/* //////------ color and other styling ------////// */

div#navigation{background:#B9CAFF}
div#extra{background:#FF8539}
div#stickyfooter{background:#FED}

/* ///////----basic menu code ----------/////// */
ul.menu {
	/*menus must be classes so we can have other lists too */
	list-style: none;
	margin: 0;
	height: 32px;
	padding-top: 1px;
}

.menu li {				/* all list items */
	float: left;
	position:relative;
	display:block;
	margin:0;
	background: url(../sitegraphics/submenu.png) left;
	padding-left:20px;
	}

.menu a {
	font-family: Arial, Helvetica, san-serif;
	font-size: 10px;
	font-weight: bold;
	line-height: 24px;
	color: black;
	text-transform: uppercase;
	text-decoration:none;
	display:block;
	line-height:14px;
	padding:4px;
	padding-right:20px;
	height:15px;
	width:auto;
	background: url(../sitegraphics/submenu.png) right;
	_width:1px;				/* ie6 equivalent to width-auto */
	_white-space:nowrap;	/* ie6 equivalent to width-auto */
	}

.menu li.active {				/* all list items */
	background: url(../sitegraphics/submenu-on.png) left;
	}
	
.menu li.active a {				/* all list items */
	background: url(../sitegraphics/submenu-on.png) right;
	}