@import url(http://fonts.lug.ustc.edu.cn/css?family=Open+Sans);
*{ text-decoration: none; margin: 0; padding:0; margin-bottom: 30px; color:#333; box-sizing:border-box;}
body{  font-family:'Open Sans'; text-align:center; background:#B1DFDB; width:100%; height:100%; padding-top:40px; display:block; position:relative; font-size:18px;}
hr{ border:0;}
p{ font-size: 13px;}
/*general*/
span{ cursor:pointer; clear:both;  border-radius: 3px; padding:20px 60px; display:inline-block; margin:0 20px; transition:all 0.8s, color 0.3s 0.3s; cursor:pointer; background:#9ACC5F; color:#333;}
/*general hover*/
a:hover, span:hover{ color:#fff;}
/*effects*/
.btn-left:hover{ box-shadow:300px 0 0 0 rgba(0,0,0,0.5) inset;}
.btn-right:hover{ box-shadow:-300px 0 0 0 rgba(0,0,0,0.5) inset;}
.btn-top:hover{box-shadow:0 150px 0 0 rgba(0,0,0,0.5) inset;}
.btn-bottom:hover{box-shadow:0 -150px 0 0 rgba(0,0,0,0.5) inset;}
.btn-special1:hover{box-shadow:0 0 0 10px rgba(0,0,0,0.5) inset;}
.btn-special2:hover{box-shadow: 0 0 0 10px #9ACC5F inset, 0 0 0 150px rgba(0,0,0,0.5) inset;}
.btn-special3:hover{box-shadow: 300px 0 0 0  rgba(0,0,0,0.25) inset, -300px 0 0 0  rgba(0,0,0,0.25) inset;}
.btn-special4:hover{box-shadow: 0 80px 0 0  rgba(0,0,0,0.25) inset, 0 -80px 0 0  rgba(0,0,0,0.25) inset;}