/***********************************************************
CSS BUTTONS +
***********************************************************/

a.button1 {
/* Sliding right image */
background: transparent url('img/buttons/round_buttons_simple/button_01_right.gif') no-repeat scroll top right; 
display: block;
float: left;
height: 21px; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
margin-right: 10px;
padding-right: 6px; /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */
color: #555;
font-weight: bold;
text-decoration: none;
}
a.button1 span {
/* Background left image */ 
background: transparent url('img/buttons/round_buttons_simple/button_01_left.gif') no-repeat; 
display: block;
line-height: 21px; /* CHANGE THIS VALUE ACCORDING TO BUTTON HEIGHT */
padding: 0 0 0 6px;
} 
a.button1:hover span{
color: #333;
}

a.button2 {
/* Sliding right image */
background: transparent url('img/buttons/round_buttons_simple/button_02_right.gif') no-repeat scroll top right; 
display: block;
float: left;
height: 21px; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
margin-right: 10px;
padding-right: 6px; /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */
color: #EEE;
font-weight: bold;
text-decoration: none;
}
a.button2 span {
/* Background left image */ 
background: transparent url('img/buttons/round_buttons_simple/button_02_left.gif') no-repeat; 
display: block;
line-height: 21px; /* CHANGE THIS VALUE ACCORDING TO BUTTON HEIGHT */
padding: 0 0 0 6px;
} 
a.button2:hover span {
color: #FFF;
list-style: square;
}


/* BUTOON 3 */
a.button3 {
/* Sliding right image */
background: transparent url('img/buttons/round_buttons_simple/button_03_right.gif') no-repeat scroll top right; 
display: block;
float: left;
height: 18px; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
margin-right: 10px;
padding-right: 6px; /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */
color: #EEE;
font-weight: bold;
text-decoration: none;
}
a.button3 span, input.button2 span {
/* Background left image */ 
background: transparent url('img/buttons/round_buttons_simple/button_03_left.gif') no-repeat; 
display: block;
line-height: 18px; /* CHANGE THIS VALUE ACCORDING TO BUTTON HEIGHT */
padding: 0 0 0 6px;
} 
a.button3:hover span, input.button3:hover span{
color: #FFF;
list-style: square;
}

/* BUTOON 4 */

a.button4 {
/* Sliding right image */
background: transparent url('img/buttons/round_buttons_simple/button_04_right.gif') no-repeat scroll top right; 
display: block;
float: left;
height: 18px; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
margin-right: 10px;
padding-right: 6px; /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */
color: #666;
font-weight: bold;
text-decoration: none;
}
a.button4 span, input.button4 span {
/* Background left image */ 
background: transparent url('img/buttons/round_buttons_simple/button_04_left.gif') no-repeat; 
display: block;
line-height: 18px; /* CHANGE THIS VALUE ACCORDING TO BUTTON HEIGHT */
padding: 0 0 0 6px;
} 
a.button4:hover span, input.button4:hover span{
color: #333;
list-style: square;
}

/***********************************************************
CSS BUTTONS -
***********************************************************/




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

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

button 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 span {
		margin-top: -1px;
	}
}


/* OPTIONAL BUTTON STYLES for applying custom look and feel: */		
button.button3 { 
	padding: 0 15px 0 0; 
	margin-right:5px; 
	font-size:2em; 
	text-align: center; 
	background: transparent url('img/buttons/round_buttons_simple/button_03_right.gif') no-repeat right; 
}
	
button.button3 span {
	padding: 13px 0 0 15px; 
	height:37px; 
	background: transparent url('img/buttons/round_buttons_simple/button_03_left.gif') no-repeat left top; 
	color:#fff; 
}
	
button.button3:hover, button.button3hover { /* the redundant class is used to apply the hover state with a script */
	background-position: right -210px; 
}
	
button.button3:hover span, button.button3hover span {
	background-position: 0 -70px;
}