I think its finally straightened out. Now for the buttons. I have searched all over for tutorials on the sliding door buttons. I really think my main issue is from the template I started with. There is soo much useless code I have been removing since I started my site.

Here is my current css file that i have for the buttons.

Code:
/* SilverFish Customizations */
body {margin: 0; font-family: verdana, arial, helvetica, sans-serif; font-size: 62.5%; color: #000000; margin: 0px 0px 50px 0px; color: #333; background-color: #ffffff;}
body#popupShippingEstimator, body#popupImage, body#infoShoppingCart, body#popupCVVHelp {background:none;}

#mainWrapper {background-color: #ffffff; text-align: left; width: 100%; vertical-align: top; border: none ; margin: 0px;}
table { font-size: 100% }

#navFusionWrapper {background-color: #ffffff; margin: 0; padding: 0; width: 100% }

/*
header
*/


#navMainWrapper {width: 100%; background-color: #ffffff; margin: 0; padding: 0;}

#navMain {
text-align: center;
list-style: none;
margin: 0px; 
width: 100%; 
color: #ffffff; 
background-color: #000030; 
font-size: 93%;}

#navMain ul { 
margin: 2px 0; 
width: 100%;
padding: 5px; 
list-style: none;
 text-align: center;
 line-height: 3.5em; 
 text-align: center;

 }

#navMain ul li {
display: inline;
font-size: 13px; 
font-weight: bold; 
text-transform: uppercase; 
color: #ffffff; 
text-align: center;

 }
#navMain ul li a  {
text-align: center;
text-decoration: none; 
padding: 4px 15px 0 0; 
margin: 0; 
margin-right: 8px;
color: #ffffff; 

}

#navMain ul li a span {
text-align: center;
padding-right: 15px;
display: inline;
margin-top: -4px;
height: 24px;
}

#navMain ul li a {
color: #ffffff;
background: url(../images/button_normal_header.gif) no-repeat top right;
}

#navMain ul li a:hover {
color: #ffffff;
background: url(../images/button_over_header.gif) no-repeat top left;
}