/* id for button div */
#buttons {
margin:0 auto 0 auto;
position:relative;
width: 360px;
text-align: center;
}
#buttons ul {
display:inline;
margin:0 auto;
padding:0;
}
#buttons li {
display:inline;
list-style:none outside none;
margin:0;
padding:0;
text-align:center;
}

#buttons ul li img {
padding-right: 20px;
}
/* END id for button container */

/* class for button positioning */
.button_positioning{
	padding-left: 94px;
}

.button_positioning li a
{	 
	text-indent: -999999px; /* forces anchor link off of page */
	overflow: hidden; /* hides part of the buttons image */
	display: block;
	width: 70px;
	height: 70px;
	margin-right: 5px; /* provides space between buttons */
	float: left;
}

/* button classes for round buttons to provide hover effect. The "a" is set with a top position of -85px to offset the image containing both states of the button. The "a:hover" is set with a top position of 0 to create the hover affect when user hovers mouse over button */
li.btn_elearn a {
     background: url('/images/buttons/btn_elearn.gif') no-repeat;
     background-position: 0 -85px;	 
}

li.btn_elearn a:hover {
     background: url('/images/buttons/btn_elearn.gif') no-repeat;
     background-position: 0 0;
}

li.btn_rodp a {
     background: url('/images/buttons/btn_rodp.gif') no-repeat;
     background-position: 0 -85px;
}

li.btn_rodp a:hover {
     background: url('/images/buttons/btn_rodp.gif') no-repeat;
     background-position: 0 0;
}
/* END button classes */

