.quanjudiv{
	left:200px;
	}
/****一次性****/
#caseBlanche {
  height:100px;
  width:100px;
  position:absolute;
  left:-10px;
  top:20px;
}

#caseBlanche #load {
  color:#fff;
  font-family:calibri;
  text-align:center;
  position:absolute;
  top :30px;
  left :25px;
  height:80px;
  width:80px;
  border-radius:40px;
  background:#0CF;
  
}
#caseBlanche #load  p{ line-height:80px;}



/****DEBUT huanraoyuandian****/
#huanraoyuandian {
  height:10px;
  width:10px;
  position:absolute;
  background-color:#0CF;
  border-radius:50%;
  top:0px;
  left:10px;
   margin:5px;
}

#rond {
  height:100px;
  width:100px;
  border:1px solid #0CF;
  border-radius:50%;
  position:absolute;
  top:20px;
  left:15px;
  animation:rond 3s infinite;
  -webkit-animation:rond 3s infinite;
}

@keyframes rond {
  0% {transform : rotate(0deg);}
  100% {transform : rotate(360deg);}
}

@-webkit-keyframes rond {
    0%{-webkit-transform : rotate(0deg);}
  100%{-webkit-transform : rotate(360deg);}
}
/****第一个****/

#caseBlanche2 {
  height:100px;
  width:100px;
  position:absolute;
  top:80px;
  left:70px;

}

#caseBlanche2 #load {
  color:#fff;
  font-family:calibri;
  text-align:center;
  position:absolute;
  top:30px;
  left:25px;
  height:80px;
  width:80px;
  border-radius:40px;
  background:#F60;
  
}
#caseBlanche2 #load  p{ line-height:80px;}
#caseBlanche2 #huanraoyuandian{
  height:10px;
  width:10px;
  position:absolute;
  background-color:#F60;
  border-radius:50%;
  top:0px;
  left:10px;
   margin:5px;
}

#caseBlanche2 #rond {
  height:100px;
  width:100px;
  border:1px solid #F60;
  border-radius:50%;
  position:absolute;
  top:20px;
  left:15px;
  animation:rond 3s infinite;
  -webkit-animation:rond 3s infinite;
}

/****第二个****/


#caseBlanche3 {
  height:100px;
  width:100px;
  position:absolute;
  top:140px;
  left:-10px;
}

#caseBlanche3 #load {
  color:#fff;
  font-family:calibri;
  text-align:center;
  position:absolute;
  top:30px;
  left:25px;
  height:80px;
  width:80px;
  border-radius:40px;
  background:#0C3;
  
}
#caseBlanche3 #load  p{ line-height:80px;}
#caseBlanche3 #huanraoyuandian{
  height:10px;
  width:10px;
  position:absolute;
  background-color:#0C3;
  border-radius:50%;
  top:0px;
  left:10px;
   margin:5px;
}

#caseBlanche3 #rond {
  height:100px;
  width:100px;
  border:1px solid #0C3;
  border-radius:50%;
  position:absolute;
  top:20px;
  left:15px;
  animation:rond 3s infinite;
  -webkit-animation:rond 3s infinite;
}

/****第三个****/


#caseBlanche4{
  height:100px;
  width:100px;
  position:absolute;
  top:20px; left:150px;
 
}

#caseBlanche4 #load {
  color:#fff;
  font-family:calibri;
  text-align:center;
  position:absolute;
  top:30px;
  left:25px;
  height:80px;
  width:80px;
  border-radius:40px;
  background:#900;
  
}
#caseBlanche4 #load  p{ line-height:80px;}
#caseBlanche4 #huanraoyuandian{
  height:10px;
  width:10px;
  position:absolute;
  background-color:#900;
  border-radius:50%;
  top:0px;
  left:10px;
   margin:5px;
}

#caseBlanche4 #rond {
  height:100px;
  width:100px;
  border:1px solid #900;
  border-radius:50%;
  position:absolute;
  top:20px;
  left:15px;
  animation:rond 3s infinite;
  -webkit-animation:rond 3s infinite;
}

/****第四个****/


#caseBlanche5{
  height:100px;
  width:100px;
  position:absolute;
  top:140px; left:150px;
 
}

#caseBlanche5 #load {
  color:#fff;
  font-family:calibri;
  text-align:center;
  position:absolute;
  top:30px;
  left:25px;
  height:80px;
  width:80px;
  border-radius:40px;
  background:#CC3;
  
}
#caseBlanche5 #load  p{ line-height:80px;}
#caseBlanche5 #huanraoyuandian{
  height:10px;
  width:10px;
  position:absolute;
  background-color:#CC3;
  border-radius:50%;
  top:0px;
  left:10px;
   margin:5px;
}

#caseBlanche5 #rond {
  height:100px;
  width:100px;
  border:1px solid #CC3;
  border-radius:50%;
  position:absolute;
  top:20px;
  left:15px;
  animation:rond 3s infinite;
  -webkit-animation:rond 3s infinite;
}

/****第五个****/


#caseBlanche6{
  height:100px;
  width:100px;
  position:absolute;
  top:210px; left:100px;
 
}

#caseBlanche6 #load {
  color:#fff;
  font-family:calibri;
  text-align:center;
  position:absolute;
  top:30px;
  left:25px;
  height:80px;
  width:80px;
  border-radius:40px;
  background:#F0F;
  
}
#caseBlanche6 #load  p{ line-height:80px;}
#caseBlanche6 #huanraoyuandian{
  height:10px;
  width:10px;
  position:absolute;
  background-color:#F0F;
  border-radius:50%;
  top:0px;
  left:10px;
   margin:5px;
}

#caseBlanche6 #rond {
  height:100px;
  width:100px;
  border:1px solid #F0F;
  border-radius:50%;
  position:absolute;
  top:20px;
  left:15px;
  animation:rond 3s infinite;
  -webkit-animation:rond 3s infinite;
}

/****第六个****/


#caseBlanche7{
  height:100px;
  width:100px;
  position:absolute;
  top:-10px; left:100px;
 
}

#caseBlanche7 #load {
  color:#fff;
  font-family:calibri;
  text-align:center;
  position:absolute;
  top:30px;
  left:25px;
  height:80px;
  width:80px;
  border-radius:40px;
  background:#06F;
  
}
#caseBlanche7 #load  p{ line-height:80px;}
#caseBlanche7 #huanraoyuandian{
  height:10px;
  width:10px;
  position:absolute;
  background-color:#06F;
  border-radius:50%;
  top:0px;
  left:10px;
   margin:5px;
}

#caseBlanche7 #rond {
  height:100px;
  width:100px;
  border:1px solid #06F;
  border-radius:50%;
  position:absolute;
  top:20px;
  left:15px;
  animation:rond 3s infinite;
  -webkit-animation:rond 3s infinite;
}

/****第七个****/

/****手机屏幕****/

@media screen and (max-width: 768px){
.quanjudiv{
	left:0px;
	}
}



@media screen and (max-width: 400px){
/****一次性****/

#caseBlanche {
  height:80px;
  width:80px;
  position:absolute;
  left:-20px;
  top:30px;
}

#caseBlanche #load {
  color:#fff;
  font-family:calibri;
  text-align:center;
  position:absolute;
  top :30px;
  left :25px;
  height:60px;
  width:60px;
  border-radius:40px;
  background:#0CF;
  
}
#caseBlanche #load  p{ line-height:60px;}



/****DEBUT huanraoyuandian****/
#huanraoyuandian {
  height:10px;
  width:10px;
  position:absolute;
  background-color:#0CF;
  border-radius:50%;
  top:0px;
  left:10px;
   margin:5px;
}

#rond {
  height:80px;
  width:80px;
  border:1px solid #0CF;
  border-radius:50%;
  position:absolute;
  top:20px;
  left:15px;
  animation:rond 3s infinite;
  -webkit-animation:rond 3s infinite;
}

@keyframes rond {
  0% {transform : rotate(0deg);}
  100% {transform : rotate(360deg);}
}

@-webkit-keyframes rond {
    0%{-webkit-transform : rotate(0deg);}
  100%{-webkit-transform : rotate(360deg);}
}
/****第一个****/

#caseBlanche2 {
  height:80px;
  width:80px;
  position:absolute;
  top:80px;
  left:41px;

}

#caseBlanche2 #load {
  color:#fff;
  font-family:calibri;
  text-align:center;
  position:absolute;
  top:30px;
  left:25px;
  height:60px;
  width:60px;
  border-radius:40px;
  background:#F60;
  
}
#caseBlanche2 #load  p{ line-height:60px;}
#caseBlanche2 #huanraoyuandian{
  height:10px;
  width:10px;
  position:absolute;
  background-color:#F60;
  border-radius:50%;
  top:0px;
  left:10px;
   margin:5px;
}

#caseBlanche2 #rond {
  height:80px;
  width:80px;
  border:1px solid #F60;
  border-radius:50%;
  position:absolute;
  top:20px;
  left:15px;
  animation:rond 3s infinite;
  -webkit-animation:rond 3s infinite;
}

/****第二个****/


#caseBlanche3 {
  height:80px;
  width:80px;
  position:absolute;
  top:130px;
  left:-20px;
}

#caseBlanche3 #load {
  color:#fff;
  font-family:calibri;
  text-align:center;
  position:absolute;
  top:30px;
  left:25px;
  height:60px;
  width:60px;
  border-radius:40px;
  background:#0C3;
  
}
#caseBlanche3 #load  p{ line-height:60px;}
#caseBlanche3 #huanraoyuandian{
  height:10px;
  width:10px;
  position:absolute;
  background-color:#0C3;
  border-radius:50%;
  top:0px;
  left:10px;
   margin:5px;
}

#caseBlanche3 #rond {
  height:80px;
  width:80px;
  border:1px solid #0C3;
  border-radius:50%;
  position:absolute;
  top:20px;
  left:15px;
  animation:rond 3s infinite;
  -webkit-animation:rond 3s infinite;
}

/****第三个****/


#caseBlanche4{
  height:80px;
  width:80px;
  position:absolute;
  top:30px; left:102px;
 
}

#caseBlanche4 #load {
  color:#fff;
  font-family:calibri;
  text-align:center;
  position:absolute;
  top:30px;
  left:25px;
  height:60px;
  width:60px;
  border-radius:40px;
  background:#900;
  
}
#caseBlanche4 #load  p{ line-height:60px;}
#caseBlanche4 #huanraoyuandian{
  height:10px;
  width:10px;
  position:absolute;
  background-color:#900;
  border-radius:50%;
  top:0px;
  left:10px;
   margin:5px;
}

#caseBlanche4 #rond {
  height:80px;
  width:80px;
  border:1px solid #900;
  border-radius:50%;
  position:absolute;
  top:20px;
  left:15px;
  animation:rond 3s infinite;
  -webkit-animation:rond 3s infinite;
}

/****第四个****/


#caseBlanche5{
  height:80px;
  width:80px;
  position:absolute;
  top:130px; left:102px;
 
}

#caseBlanche5 #load {
  color:#fff;
  font-family:calibri;
  text-align:center;
  position:absolute;
  top:30px;
  left:25px;
  height:60px;
  width:60px;
  border-radius:40px;
  background:#CC3;
  
}
#caseBlanche5 #load  p{ line-height:60px;}
#caseBlanche5 #huanraoyuandian{
  height:10px;
  width:10px;
  position:absolute;
  background-color:#CC3;
  border-radius:50%;
  top:0px;
  left:10px;
   margin:5px;
}

#caseBlanche5 #rond {
  height:80px;
  width:80px;
  border:1px solid #CC3;
  border-radius:50%;
  position:absolute;
  top:20px;
  left:15px;
  animation:rond 3s infinite;
  -webkit-animation:rond 3s infinite;
}

/****第五个****/


#caseBlanche6{
  height:100px;
  width:100px;
  position:absolute;
  top:210px; left:100px;
 
}

#caseBlanche6 #load {
  color:#fff;
  font-family:calibri;
  text-align:center;
  position:absolute;
  top:30px;
  left:25px;
  height:80px;
  width:80px;
  border-radius:40px;
  background:#F0F;
  
}
#caseBlanche6 #load  p{ line-height:80px;}
#caseBlanche6 #huanraoyuandian{
  height:10px;
  width:10px;
  position:absolute;
  background-color:#F0F;
  border-radius:50%;
  top:0px;
  left:10px;
   margin:5px;
}

#caseBlanche6 #rond {
  height:100px;
  width:100px;
  border:1px solid #F0F;
  border-radius:50%;
  position:absolute;
  top:20px;
  left:15px;
  animation:rond 3s infinite;
  -webkit-animation:rond 3s infinite;
}

/****第六个****/


#caseBlanche7{
  height:100px;
  width:100px;
  position:absolute;
  top:-10px; left:100px;
 
}

#caseBlanche7 #load {
  color:#fff;
  font-family:calibri;
  text-align:center;
  position:absolute;
  top:30px;
  left:25px;
  height:80px;
  width:80px;
  border-radius:40px;
  background:#06F;
  
}
#caseBlanche7 #load  p{ line-height:80px;}
#caseBlanche7 #huanraoyuandian{
  height:10px;
  width:10px;
  position:absolute;
  background-color:#06F;
  border-radius:50%;
  top:0px;
  left:10px;
   margin:5px;
}

#caseBlanche7 #rond {
  height:100px;
  width:100px;
  border:1px solid #06F;
  border-radius:50%;
  position:absolute;
  top:20px;
  left:15px;
  animation:rond 3s infinite;
  -webkit-animation:rond 3s infinite;
}
}