/* Horizontal Navigation with dropdowns */

/*

If changing the height of the nav, make sure you update "#navigation ul li ul"
so that the "top" option is the same as the new height

*/
#navigation span {
display: none;
}

#navigation ul {
list-style-type:none;
margin:0px;
padding:0px;
}

#navigation li {
display:block;
float:left;
}

a.buttonHome {
width: 131px;
height: 21px;
display: block;
float: left;
background: url(../img/button-home.gif) no-repeat 0px 0px;
}
a.buttonDiamonds {
width: 131px;
height: 25px;
display: block;
float: left;
background: url(../img/button-diamonds.gif) no-repeat 0px 0px;
}
a.buttonPearls {
width: 131px;
height: 25px;
display: block;
float: left;
background: url(../img/button-pearls.gif) no-repeat 0px 0px;
}
a.buttonRings {
width: 131px;
height: 25px;
display: block;
float: left;
background: url(../img/button-wedding-ring.gif) no-repeat 0px 0px;
}
a.buttonGold {
width: 131px;
height: 26px;
display: block;
float: left;
background: url(../img/button-gold.gif) no-repeat 0px 0px;
}
a.buttonContact {
width: 131px;
height: 25px;
display: block;
float: left;
background: url(../img/button-contact.gif) no-repeat 0px 0px;
}

a.buttonHG {
width: 131px;
height: 25px;
display: block;
float: left;
background: url(../img/buttonhg.gif) no-repeat 0px 0px;
}

a.buttonHome:hover {
background: url(../img/button-home.gif) no-repeat 0px -21px;
}
a.buttonDiamonds:hover {
background: url(../img/button-diamonds.gif) no-repeat 0px -25px;
}
a.buttonPearls:hover {
background: url(../img/button-pearls.gif) no-repeat 0px -25px;
}
a.buttonRings:hover {
background: url(../img/button-wedding-ring.gif) no-repeat 0px -25px;
}
a.buttonGold:hover {
background: url(../img/button-gold.gif) no-repeat 0px -26px;
}
a.buttonContact:hover {
background: url(../img/button-contact.gif) no-repeat 0px -25px;
}
a.buttonHG:hover {
background: url(../img/buttonhg.gif) no-repeat 0px -25px;
}