#splash {
  display : none ;
  position: fixed;
  width: 100%;
  height: 100%;
  background: url(./art_bg.jpg) no-repeat center;
  background-size: cover;
  /* bottom: 0; */
}

/* loading 特效，没有具体进度的加载特效 */
#loading {
  margin: 20px;
  position: fixed;
  width: 20px;
  height: 20px;
  border-radius: 100%;
  background-color: #fff;

  animation: ball-rotate 1s 0s cubic-bezier(0.7, -0.13, 0.22, 0.86) infinite;
  animation-fill-mode: both;
}

#loading:before,
#loading:after {
  position: fixed;
  width: 20px;
  height: 20px;
  margin: 2px;
  content: "";
  opacity: 0.8;
  border-radius: 100%;
  background-color: #fff;
}

#loading:before {
  top: 0;
  left: -28px;
}

#loading:after {
  top: 0;
  left: 25px;
}

@keyframes ball-rotate {
  0% {
    transform: rotate(0deg) scale(1);
  }

  50% {
    transform: rotate(180deg) scale(0.6);
  }

  100% {
    transform: rotate(360deg) scale(1);
  }
}


/* 条形进度条 -----begin*/
.progress-bar {
  background-color: #1a1a1a;
  position: absolute;
  left: 25%;
  bottom: 5%;
  height: 14px;
  padding: 5px;
  width: 50%;
  /*margin: 0 -175px;         */
  border-radius: 5px;
  box-shadow: 0 1px 5px #000 inset, 0 1px 0 #444;           
}

.progress-bar span {
  display: block;
  height: 100%;
  border-radius: 3px;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset;
  transition: width .4s ease-in-out; 
  background-color: #fff;    
}

.stripes span {
  background-size: 30px 30px;
  background-image: linear-gradient(135deg, rgba(255, 255, 255, .15) 25%, transparent 25%,
                      transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%,
                      transparent 75%, transparent);            
  
  animation: animate-stripes 1s linear infinite;             
}

@keyframes animate-stripes {
  0% {background-position: 0 0;} 100% {background-position: 60px 0;}
}