@charset "utf-8";
<style>

ul.animatedbgul{
	margin: 0;
	padding: 0;
	list-style: none;
}

ul.animatedbgul li{
	width: 100%;
	clear:left; /* clear contents of inner span, which will be floated left */
	overflow: hidden; /* clear contents of inner span, which will be floated left */
}

ul.animatedbgul li span{
	display: block;
	float: left; /* cause width of each span to take up only as much space as needed */
	min-width: 0px; /* animated property. Explicit min-width defined so animation works. */
	margin-bottom: 5px;
	padding: 2px;
	color: #000000;
}

ul.animatedbgul li:hover span{
	color: #640065;
	background: #faca57;
	border-left: 8px solid darkred;
	min-width: 450px; /* animated property. Set to desired final length of background */
	-webkit-box-shadow: 0 0 5px gray;
	-moz-box-shadow: 0 0 5px gray;
	box-shadow: 0 0 5px gray;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

</style>
/* CSS Document */