/* Position nav bar on page */ #nav { height: 20px; width: 750px; margin: 0 auto; } #cssnav { height: 20px; width: 780px; margin: 0 auto; } /* strip unordered list */ ul#cssnav { margin: 0; padding: 0; list-style: none; float: left; width: 1000px; } ul#cssnav li { margin: 0; padding-right: 15px; float: left; } /* CSS Sprites - Default State - Specify height of nav bar - Move the text (inside ) off the page */ ul#cssnav a { float: left; display: block; height: 20px; text-indent: -9999px; background-position: left bottom; } /* CSS Sprites - Hover State */ ul#cssnav a:hover { background-position: left top; } /* Assign an image and width to each link */ ul#cssnav li.index a { background-image: url(../images/btn_home.png); width: 51px; } ul#cssnav li.biography a { background-image: url(../images/btn_biography.png); width: 95px; } ul#cssnav li.gallery a { background-image: url(../images/btn_gallery.png); width: 76px; } ul#cssnav li.press a { background-image: url(../images/btn_press.png); width: 56px; } ul#cssnav li.charities a { background-image: url(../images/btn_charities.png); width: 95px; } ul#cssnav li.blog a { background-image: url(../images/btn_blog.png); width: 46px; } ul#cssnav li.rhonj a { background-image: url(../images/btn_rhonj.png); width: 56px; } ul#cssnav li.onlineshop a { background-image: url(../images/btn_onlineshop.png); width: 104px; } ul#cssnav li.contact a { background-image: url(../images/btn_contact.png); width: 76px; } /* Assign active status based on */ #home li.index a, #biography li.biography a, #gallery li.gallery a, #press li.press a, #charities li.charities a, #blog li.blog a, #rhonj li.rhonj a, #onlineshop li.onlineshop a, #contact li.contact a { background-position: left top; }