/*OVALBUTTON2*/
/* li-elementin perusmäärittelyt */
 
#ovalbutton2 li {
	float: left;  /*jos halutaan painikkeet samalle riville */
	list-style-type: none;
	width: 150px; /* tekstille varattava tila */
	line-height: 24px; /* taustakuvan korkeus */
/*text-align: center;*/
	margin-bottom: 10px; /* marginaalit sen mukaan, onko painikkeet alekkain vai vierekkäin */
	margin-left: 5px;
}


/* ensin määritellään painikkeen vasen puoli ja teksin muotoilut */
/* kuva asemoidaan vasemmalle ylhäälle (left top) ja kuvasta näytetään yläosa (top) */

#ovalbutton2 a {
	background: transparent url('oval-orange-left.gif') no-repeat top left; /* PAINIKKEEN VASEN LAITAVÄRI */
	display: block;
	font: bold 13px Tahoma;
	color: purple;
	line-height: 24px; /* Sama kuin taustakuvan korkeus -- teksti keskellä riviä */
	padding-left: 5px; /* Kuvan vasem. puolen leveys - oli 11px mutta nyt menee vas.puol. uppoaa txtiin */
	text-decoration: none;
}



/* ------------------------------------------------------------------------------------- */


/* Painikkeen oikeapuoli on span-elementin taustakuvana. 
Kuva asemoidaan ylhäälle oikealle (top right), kuvasta näkyy vain se osa joka mahtuu li-elementin leveyteen */
#ovalbutton2 a span {
	background: transparent url('oval-orange-right.gif') no-repeat top right; /* PAINIKKEEN oikea LAITAVÄRI*/
	display: block;
	padding-right: 11px; /* Sama arvo kuin edellä padding-left -- teksti keskelle */
}



/* ------------------------------------------------------------------------------------- */


/* Hover-kuva esille, kuva asemoidaan alareunastaan -painikk vas puolen sävy */
#ovalbutton2 a:hover {
	background-position: bottom left;
}




/* ------------------------------------------------------------------------------------- */


/* Hover kuva esille, kuva asemoidaan alareunastaan -painikk oik puolen sävy */
#ovalbutton2 a:hover span {
	background-position: bottom right;
	color: black;
}