Nav _ Css

[pcmagic]

Hey Folks just wondering if anybody could help a little here please, From this css code below, How Can i get so that navcontainer is blue but with a red when you hover over it???? Also With the text in the navcontainer having a small 1px red border around it??? The Drop Down part of this .navcontainer what part do i change so that on the drop down part alone is white with a small black border and blue text???

Any help and guidelines would be very appreciated,

Thanks

.foot {
	COLOR: #F99007;
	FONT-FAMILY: sans-serif;
	FONT-SIZE: 12px;
}
.foot a:link, .foot a:visited, .foot a:active {
 color: #F99007;
 text-decoration: none;

}
.foot a:hover {
 color: #0B6295;
 text-decoration: none;

}
.navcontainer
{
width: 10em;
border-right: 1px solid #000;
padding: 0 0 1em 0;
margin-bottom: 1em;
font-family: Verdana, Lucida, Geneva, Helvetica, Arial, sans-serif;
background-color: #90bade;
color: #333;
}

.navcontainer ul
{
list-style: none;
margin: 0;
padding: 0;
border: none;
}

.navcontainer li
{
border-bottom: 1px solid #90bade;
margin: 0;
float: left;
width: 10em;
}

.navcontainer li a
{
display: block;
padding: 5px 5px 5px 0.5em;
border-left: 10px solid #1958b7;
border-right: 10px solid #508fc4;
background-color: #2175bc;
color: #fff;
text-decoration: none;
width: 100%;
}

html>body .navcontainer li a { width: auto; }

.navcontainer li a:hover
{
border-left: 10px solid #1c64d1;
border-right: 10px solid #5ba3e0;
background-color: #2586d7;
color: #fff;
}

.navcontainer li ul {
	position: absolute;
	width: 10em;
	left: -999em;
}

.navcontainer li:hover ul {
	left: auto;
}

.navcontainer li:hover ul, #nav li.sfhover ul {
	left: auto;
}

#navcontainer A:hover, #navcontainer A:active { background: #E32636; }

 

[pcmagic]

Pleasseeeeeeeeeeeeeee