a.button, span.button, del.button {
  display: -moz-inline-box;
  display: inline-block;
  cursor: pointer;
  border: none;
  font-size: 0;
  line-height: 0;
  text-decoration: none;
    
	/*
  	for Safari, read this first
  	http://creativebits.org/webdev/safari_background_repeat_bug_fix
	*/
  background-position:0 0;
  background-repeat: no-repeat;
  height: 20px;
  color: #02C5CC;
  font-style: normal;
  margin: 0 10px 0 0;
  padding: 0 10px 0 0;
  vertical-align: middle;
  padding-top: -2px;
  _position: relative;
  _width: 10px;
  _overflow-y: hidden;
}


a.button, span.button, del.button,
a.button span, span.button button, span.button input, del.button span {
  background-image: url('/design/button-3ml.gif');
  _background-image: url('/design/button-3ml.gif');
}

a.hibutton, span.hibutton, del.hibutton,
a.hibutton span, span.hibutton button, span.hibutton input, del.hibutton span {
  background-image: url('/design/button-highlighted.gif');
  _background-image: url('/design/button-highlighted.gif');
}

a.button span, span.button button, span.button input, del.button span {
  white-space: nowrap;
  cursor: pointer;
  color: #eeeeee;
  display: -moz-inline-box;
  display: inline-block;
  line-height: 1.2;
  letter-spacing: 0 !important;
  font-family: "Arial" !important;
  font-size: 12px !important;
  font-style: normal;
  background-color: transparent;
  background-position: 100% 0;
  background-repeat: no-repeat;
  height: 20px;
  padding: 4px 10px 0 7px;
  margin: 0 -16px 0 5px;
  border: none;
  vertical-align: text-top;
  zoom: 1;
  _position: relative;
  _padding-left: 0px;
  _padding-right: 12px;
  _margin-right: -10px;
  _display: block;
  _top: 0;
  _right: -5px;
}

a.hibutton span, span.hibutton button, span.hibutton input, del.hibutton span {
 color: #d8e5d2;
}


span.button button {
  line-height: 2.5;/*Opera need this*/
}

html.safari a.button span, 
html.safari del.button span {
  line-height: 1.3;
}

html.safari span.button button {
  line-height: 2.6;
}

html.safari a.button:focus,
html.safari span.button button:focus {
  outline: none;
}

del.button {
	/* cursor:not-allowed;	*/
	background-position:0 -120px;
}

del.button span {
  cursor: default;
  color: #aaa !important;
  background-position: 100% -120px;
}


span.button button, span.button input {
  padding-top: 0px;
  line-height: 2.5;/*Opera need this*/
}

/** optional **/
a.button:visited {
  /*color: #aaa;*/
  text-decoration: none;
}



/*Hover Style*/

a.button:hover, 
span.button:hover,
a.button:focus, 
a.dom-button-focus, 
span.button-behavior-hover {
  background-position: 0 -30px;
  color: #222;
  text-decoration: none;
}

a.button:hover span, 
span.button:hover button, 
a.button:focus span, 
span.button-behavior-hover button, 
span.button-behavior-hover input {
  background-position: 100% -30px;
}


a.button:active, a.button:focus span {
  color: #444;
}

del.button-behavior-hover, del.button:hover {
  background-position: 0 -180px;
	/* cursor:not-allowed; */
}


del.button-behavior-hover span, del.button:hover span {
  background-position: 100% -180px;
	/* cursor:not-allowed; */
}


/*Optional hack for IE6 to simulate :hover selector*/

span.button button, del.button span, span.button input {
  _behavior: expression(
		(function(el) {
			if( typeof( behavior_onMouseEnter) == 'undefined') {
				behavior_onMouseEnter = function(el) {
					var dEl = this.parentNode;					
					var sClass = dEl.className;
					dEl.__defaultClassName = sClass;
					dEl.className = sClass + ' button-behavior-hover';	
					this.setCapture();
        };

				behavior_onMouseLeave = function(el) {
					var dEl = this.parentNode;
					dEl.className = dEl.__defaultClassName ;
					dEl.__defaultClassName = undefined;
					this.releaseCapture();
        };
      };
			
			
			el.runtimeStyle.behavior = 'none';
			el.onmouseenter = behavior_onMouseEnter;
			el.onmouseleave = behavior_onMouseLeave;
		})(this));
}