ul.solarsystem {
	position: relative;
	width:300px;
	height: 340px;
	list-style: none;
	-webkit-transition: all 0.09s ease-in;
	-moz-transition: all 0.09s ease-in;
	-o-transition: all 0.09s ease-in;
	transition: all 0.09s ease-in;
	overflow: hidden;
}

ul.solarsystem li {
text-indent: -9999px;
display: block;
position: absolute;
border: 2px solid #394057;
}


ul.solarsystem li {
	list-style:none;
}

ul.solarsystem li span {
display: block;
position: absolute;
width: 10px;
height: 10px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}

ul.solarsystem li.sun {
	width: 30px;
	height: 30px;
	border-radius: 15px;
	background: #FC3;
	background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.22, #C90), color-stop(1, #FFDB70) );
	background-image: -moz-linear-gradient( center bottom, #C90 22%, #FFDB70 100% );
	top: 150px;
	left: 140px;
	border: none;
	-webkit-box-shadow: 0 0 50px #c90;
	-moz-box-shadow: 0 0 50px #c90;
	box-shadow: 0 0 50px #c90;
	z-index: 100;
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
}

ul.solarsystem li.mercury {
	-webkit-animation-duration: 5s;
	-moz-animation-duration: 5s;
}

ul.solarsystem li.mercury {
	width: 100px;
	height: 100px;
	-webkit-border-radius: 52px;
	-moz-border-radius: 52px;
	border-radius: 52px;
	top: 113px;
	left: 103px;
	z-index: 99;
}

ul.solarsystem li.mercury span {
	background: #B6BAC5;
	top: 10px;
	left: 10px;
}

ul.solarsystem li.venus {
    width: 160px;
    height: 160px;
    -webkit-border-radius: 82px;
    -moz-border-radius: 82px;
    border-radius: 82px;
    top: 83px;
    left: 73px;
    z-index: 98;
}

ul.solarsystem li.venus span {
    background: #bf8639;
    top: 118px;
    left: 5px;
}

ul.solarsystem li.venus {-webkit-animation-duration:8s; -moz-animation-duration:8s;}


ul.solarsystem li {
    -webkit-animation-iteration-count:infinite;
    -webkit-animation-timing-function:linear;
    -webkit-animation-name:orbit;
    
    -moz-animation-iteration-count:infinite;
    -moz-animation-timing-function:linear;
    -moz-animation-name:orbit;
}

@-webkit-keyframes orbit { from { -webkit-transform:rotate(0deg) } to { -webkit-transform:rotate(360deg) } }
@-moz-keyframes orbit { from { -moz-transform:rotate(0deg) } to { -moz-transform:rotate(360deg) } }