/************************************************
 Round Corners Button Rollover Example 2
************************************************/
  .example2 li {
    display:inline;
    list-style:none;
}

.example2 li a {
    background:transparent url(buttons.jpg) no-repeat scroll left top;
color:#808080;
display:block;
float:left;
height:33px;
min-width:50px;
text-decoration:none;
}
.cat_SpanTitle
{
	text-align:center;
	text-transform:capitalize;
	font-size:1.0em;
	font-family:Arial, Helvetica, sans-serif;
	}
.example2 li a span {
    cursor:pointer;
display:inline;
float:left;
height:21px;
margin-left:6px;
min-width:50px;
padding:7px 10px 5px 0;
}

.example2 li a:hover{
    background-position:left bottom;
    color:#ffffff;
}

.example2 li a:hover span {
    background-position:right bottom;
}

.example2 .on  a{
     background-position:left bottom;
     color:#ffffff;	
}

.example2 .on  a span {
   background-position:right bottom;
}




/*
.example2 a{
	float: left;
	text-transform: uppercase;
	list-style: none;
	margin-left: 10px;
	background: url(../images/categories/buttons.jpg) top left no-repeat;
	height: 26px;
	font-size: 10px;
	font-weight:bold;
	margin: 0 5px 0 0;
	font-family: Arial, Helvetica, sans-serif;
	color: #FFFFFF;
}
.example2 li span{
	margin-left: 10px;
	background: url(../images/categories/buttons.jpg) top right no-repeat;
	height: 21px;
	padding: 5px 10px 0 0;
	display: block;
}
.example2 li a:hover{
	background-position: bottom left;
}
.example2 li a:hover span{
	background-position: bottom right;
}

.example2 .on  a{
     background-position:left bottom;
}

.example2 .on  a span {
   background-position:right bottom;
}*/