button.imageButton { 
    position: relative;
    border: 0; 
    padding: 0;
    cursor: pointer;
    overflow: visible; /* removes extra side padding in IE */
}

button.imageButton::-moz-focus-inner {
    border: none;  /* overrides extra padding in Firefox */
}

button.imageButton span { 
    position: relative;
    display: block; 
    white-space: nowrap;	
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    /* Safari and Google Chrome only - fix margins */
    button.imageButton span {
        margin-top: -1px;
    }
}

/* This is the right portion of the sliding door image */
button.imageButton { 
    padding: 0 10px 0 0; 
    text-align: center; 
    background: transparent url('[themeFolder]/Images/gray.matte.button.png');
    background-repeat: no-repeat;
    background-position: right -120px; /* -120px is where the right portion of the button starts in the background image */
}

/* This is a fix for FF, if you have 10px (which is correct) FF will create a space between the two image portions. It overwrites the value above */
@-moz-document url-prefix() {
    button.imageButton { 
        padding: 0 8px 0 0; 
    }
}

/* This is the left portion of the sliding door image */
button.imageButton span {
    padding: 0px 0 0 10px; 
    height:31px; 
    max-height:31px;
    min-width:75px;
    max-width:350px;
    line-height:31px;
    vertical-align:middle;
    color:#FFFFFF; 
    font-weight:bold;
    background: transparent url('[themeFolder]/Images/gray.matte.button.png'); 
    background-repeat: no-repeat;
    background-position: top left; 
}

/* This is the right portion of the sliding door image */
button.imageButton:hover, button.imageButtonHover { /* the redundant class is used to apply the hover state with a script */
    background-position: right -160px; /* -160px is where the right portion of the button hover over starts in the background image */
}

/* This is the left portion of the sliding door image */
button.imageButton:hover span, button.imageButtonHover span {
    background-position: 0 -40px; /* -40px is where the left portion of the button hover over starts in the background image */
}