/* CSS Document */

/*<div id="menu"> <ul id="item1"> <li class="top">menu item</li> <li class="item"><a href="#">menu item 1</a></li> <li class="item"><a href="#">menu item 2</a></li> <li class="item"><a href="#">menu item 3</a></li> </ul> </div>*/

body{margin:0;}

#container{
	margin:0;
	position:absolute;
	background-color: #b48db2;

}

#menu{
	margin:0;
	}

#menu ul{/*lines up in a horizontal row and sets padding and margin for the main items in the list*/
	color:#FFFFFF;
	float:left;
	margin:0;
	padding-left:12px;
	padding-right:12px;
	list-style:none;
	padding-top:5px;
	padding-bottom:3px;
	}
	
.mainmenulinks {
	
	font-family: "Lucida", Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align: center;
	font-weight:bold;
	
}
a.mainmenulinks:link {
color: #FFFFFF;
text-decoration: none;
}


a.mainmenulinks:visited {
color: #FFFFFF;
text-decoration: none;
}

a.mainmenulinks:hover {
color: #993300;
text-decoration: none;
}
a.mainmenulinks:active {
color: #FFFFFF;
text-decoration: none;
}


.menulinks {
	background-color: #b48db2;
	font-family: "Lucida", Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align: center;
	font-weight:bold;
	padding-top:1px;
	padding-bottom: 6px;
}
a.menulinks:link {
color: #FFFFFF;
text-decoration: none;
}


a.menulinks:visited {
color: #FFFFFF;
text-decoration: none;
}

a.menulinks:hover {
color: #993300;
text-decoration: none;
}
a.menulinks:active {
color: #FFFFFF;
text-decoration: none;
}

#menu ul .item{
display:none;
width:125px;
margin-left:-10px; 
margin-top:3px;
background-color: #b48db2;

}

#menu ul:hover .item{
position:absolute; 
display:block;

}


#menu ul:hover .item a:link, #menu ul:hover .item a:visited {
	background-color: #b48db2;
	color:#FFFFFF;
	font-family: "Lucida", Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align: left;
	font-weight:bold;
	
	text-decoration:none;
}

#menu ul:hover .item a:hover {
color:#993300;
}

#menu ul:hover .item a:active {
color:#FFFFFF;
}

.clear{clear:both;}
