/* CSS to demonstrate a very nice menu */

body {
	background: url("./layout/stripe.png") repeat;
	background-color: #333;
	color:black;
}

/* ==== begin menu ==== */
#menu3 {
	/* positioning relative to previous DIV or block element */
	position: relative;
	left: 25px;
	top: 30px;

	/* use the following to make the menu fixed */
	/*
	position: fixed;
	left: 125px;
	top: 185px;
	*/

	color: #FFF;
	float: left;
	text-align: left;
	border: outset white 5px; /* outer white border */
	/* display: block;  		not needed? */
}

/* NOTE: the following apply only to tags that are inside a #menu div */
#menu3 h1 {
	margin: 0.5em 0;
	text-align:center;
}

#menu3 ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
	border: solid #0099ff 1px;
} 
#menu3 li {
   /* padding:0;  not needed */
   border: solid #0099ff 1px;
}

#menu3 a {
    display: block;
	padding: 4px 7px;
    width: 200px;	/**** This sets the width of the menu ****/
	background-color:#003366;
	color: #FFF;
	text-decoration:none;	
}
#menu3 a:hover{
	background-color: #06A;
}

/* curr could by an ID or a CLASS */
#menu3 #curr{
	color: #FFF;
	background-color: #090;
	font-weight: bold;
	padding: 2px 7px;
}
/* ==== end of menu ==== */

/* --- Layout divisions (ID) --- */

/* ... this is optional ... */
#page-wrap {
	background: #003;
	min-width: 760px;  
	max-width: 1500px;
	margin: 10px auto; 
	padding-top: 10px;
	padding-bottom: 10px;
	overflow: hidden;
}
/* ... end of page-wrap ... */

#header {
	background-color:#ADF;	
 	height:140px;
}

#main {
	background-color:#DDFFDD;	
    margin-left:290px;		/**** move the whole main over enough so that it doesn't overlap the menu ****/
	margin-right: 30px;
	padding: 0 10px;
	/* float:left; 			I'm not sure why this screws things up */
}

#footer {
	background-color:#AFA;	
	height:100px;
}

/****** HTML Tag formatting ******/
h1 {
  font-family:geneva, arial, san-serif;
  font-size: 150%;
}

/* this applies to ALL <li>tags */
li {
 font-family:geneva, arial, san-serif;
} 

/****** custom classes *****/
.highlight {
  background-color: yellow;
  padding: 5px;
  margin: 0;
}