﻿.cover{position: fixed; z-index: 101; background: #C4C4C4; top: 0px; left: 0px; right: 0px; bottom: 0px;}
.cover .loading{width: 300px; height: 120px; margin: 16% auto; text-align: center; padding: 12px;}
.cover .loading .loadItem{height: 200px; width: 200px; background: url("images/loading.png") no-repeat; background-size: 100% 100%; margin: 8px auto; animation: loadingItem 2.5s linear infinite;}
.cover .loading p{margin: 12px auto; color: #fff; font-size: 15px; font-weight: 200; font-style: italic;}
.cover .loading .progress{margin: 80px auto; height: 6px; width: 280px; background: #E5E5E5;}
.cover .loading .progressInner{background: #2CA6FB; height: 3px; width: 0px; transition: width 200ms linear;}

.coverLoad{background: rgba(0,0,0,0.7); position: fixed; z-index: 101; top: 0px; left: 0px; right: 0px; bottom: 0px;}
.coverLoad:before{display: block; content: ""; width: 42px; height: 42px; margin: 60% auto 32px auto; background: url("img/loading.png") no-repeat; background-size: 100% 100%; animation: loadingItem 2.5s linear infinite;}
.coverLoad p{margin: 12px auto; color: #fff; font-size: 15px; font-weight: 200; font-style: italic; text-align: center;}
.coverLoad .progress{margin: 40px auto; height: 3px; width: 30%; background: #E5E5E5;}
.coverLoad .progressInner{background: #FBCD88; height: 3px; width: 0px; transition: width 200ms linear;}
.coverLoadView:before{margin: 10% auto 32px auto;}

.music{position: absolute; top: 8px; left: 8px; height: 36px; width: 36px; z-index:9999; }
.music[datat="0"]{background: url("img/music.png") no-repeat; background-size: 100% 100%; animation: loadingItem 3s linear infinite;}
.music[datat="1"]{background: url("img/music2.png") no-repeat; background-size: 100% 100%;}
.musicr{animation: loadingItem 3s linear infinite;}

.cover1{background: rgba(33,33,33,0.7);}
.startIn{animation: zha 0.8s linear forwards;}

.imgLoad{position: absolute; top: 0px; left: 0px; height: 1px; width: 1px; overflow: hidden;}


@-webkit-keyframes zha {0% {transform: scale(4,4); } 90% {transform: scale(3,3); } 100% {transform: scale(1,1); }}
@-webkit-keyframes loadingItem {from {transform: rotateZ(0deg); }to {transform: rotateZ(360deg); }}