* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

.list-wrap label {
  
  color:#555;
}
.search-box {
  
  clear:left;
  width:80%;
  padding:0.4em;
  font-size:1em;
  color:#555;
  border:1px solid #00BDE8;
  border-radius:3px;
}

.list-count {
  
  text-align:center;
  width:30%;
  padding:0.5em;
  color:#ddd;
}

li {
  transition-property: margin, background-color, border-color;
  transition-duration: .4s, .2s, .2s;
  transition-timing-function: ease-in-out, ease, ease;
}

.empty-item {
  transition-property: opacity;
  transition-duration: 0s;
  transition-delay: 0s;
  transition-timing-function: ease;
}

.empty .empty-item {
  transition-property: opacity;
  transition-duration: .2s;
  transition-delay: .3s;
  transition-timing-function: ease;
}

.hiding {
  
  opacity:0.5;
}

.hidden {
  display:none;
}

ul {
  
  width:100%;
  
  padding:0;
  position:relative;
}

ul:before {
  
  position:absolute;
  
  font-size:2em;
  text-align:right;
  
  color:#ededed;
  font-weight:bold;
  font-family: 'Microsoft YaHei','Lantinghei SC','Open Sans',Arial,'Hiragino Sans GB','STHeiti','WenQuanYi Micro Hei','SimSun',sans-serif;
  
}

li {
  
  clear:left;
  width:90%;
  list-style:none;
  background-color: #fafafa;
  cursor:pointer;
  color:#333;
  position:relative;
  height: 100px;
  padding: 10px;
  margin: auto;
}

li:hover {
  background-color:#f9f9f9;
  border-color:#00BDE8;
}

.empty-item {
  background:#fff;
  color:#ddd;
  margin:0.2em 0;
  padding:0.5em 0.8em;
  font-style:italic;
  border:none;
  text-align:center;
  visibility:hidden;
  opacity:0;
  float:left;
  clear:left;
  width:100%;
  
}

.empty .empty-item {
  opacity:1;
  visibility:visible;
}
/*
The following are styles purely for the surroundings
*/
body {
  background-color:#fff;
  font-family:'Microsoft YaHei','Lantinghei SC','Open Sans',Arial,'Hiragino Sans GB','STHeiti','WenQuanYi Micro Hei','SimSun',sans-serif;
  margin:0;
  padding:0;
  font-size:1em;
}

a {color:#00BDE8;}

h1 {
  font-size:2em;
  margin:0;
  
  text-align:center;
  font-family: 'Microsoft YaHei','Lantinghei SC','Open Sans',Arial,'Hiragino Sans GB','STHeiti','WenQuanYi Micro Hei','SimSun',sans-serif;
}
h3 {
  margin:0 0 2em;
  text-align:center;
  font-weight:normal;
  font-family: 'Microsoft YaHei','Lantinghei SC','Open Sans',Arial,'Hiragino Sans GB','STHeiti','WenQuanYi Micro Hei','SimSun',sans-serif;
  font-style:italic;
  color:#777;
  font-size:1em;
}

.list-wrap {
  
  width:98%;
  margin: auto;
  border-radius: 10px;
  
}