.bottomArea{
  background-color: #ffffff;
  width: 100%;
  height: 37px;
  position: absolute;
  bottom: 0;
}
.indexMenu{
  background: url(../img/controls/menu.png) no-repeat center;
  cursor: pointer;
  width: 105px;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.indexMenu:hover{
  background: url(../img/controls/menuOver.png) no-repeat center;
}
.progressBar-main{
  position: absolute;
  width: 545px;
  height: 5px;
  background-color: #184459;
  vertical-align: top;
  top: 15px;
  left: 120px;
  cursor: pointer;
  border-radius: 15px;
}
.progressBar-Under{
  height: 5px;
  background-color: #299cd2;
  cursor: pointer;
  position: absolute;
  top: 0;
  border-radius: 15px;
}
.progressBar-Pointer{
  width: 11px;
  height: 11px;
  background-color: #fff;
  border-radius: 50%;
  position: absolute;
  top: -3px;
  right: -9px;
  cursor: pointer;
}
.time{
  color: #07222f;
  font-size: 13px;
  position: absolute;
  top: 11px;
  left: 690px;
}
.time > div{
  display: inline-block;
}
.pause{
  background: url(../img/controls/pause.png) no-repeat center;
  width: 40px;
  height: 100%;
  cursor: pointer;
  position: absolute;
  bottom: 0;
  right: 445px;
}
.pause:hover{background: url(../img/controls/pauseOver.png) no-repeat center;}

.play{
  background: url(../img/controls/play.png) no-repeat center;
  width: 40px;
  height: 100%;
  cursor: pointer;
  position: absolute;
  bottom: 0;
  right: 445px;
}
.play:hover{background: url(../img/controls/playOver.png) no-repeat center;}

.replay{
  background: url(../img/controls/rePlay.png) no-repeat center;
  width: 40px;
  height: 100%;
  cursor: pointer;
  position: absolute;
  bottom: 0;
  right: 395px;
}
.replay:hover{background: url(../img/controls/rePlayOver.png) no-repeat center;}

/* .script{
  background: url(../img/controls/script.png) no-repeat center;
  width: 40px;
  height: 100%;
  cursor: pointer;
  position: absolute;
  bottom: 0;
  right: 395px;
} */
.fs{
  background: url(../img/controls/fs.png) no-repeat center;
  width: 40px;
  height: 100%;
  cursor: pointer;
  position: absolute;
  bottom: 0;
  right: 345px;
}
.fs:hover{
  background: url(../img/controls/fsOver.png) no-repeat center;
}
.volumeOnBtn{
  background: url(../img/controls/volumeOn.png) no-repeat left center;
  width: 30px;
  height: 100%;
  cursor: pointer;
  position: absolute;
  bottom: 0;
  right: 295px;
}
.volumeOnBtn:hover{background: url(../img/controls/volumeOnOver.png) no-repeat left center;}

.volumeOffBtn{
  background: url(../img/controls/volumeOff.png) no-repeat left 11px;
  width: 30px;
  height: 100%;
  cursor: pointer;
  position: absolute;
  bottom: 0;
  right: 295px;
}
.volumeOffBtn:hover{background: url(../img/controls/volumeOffOver.png) no-repeat left 11px;}

.volumeBar-main{
  width: 92px;
  height: 5px;
  background-color: #184459;
  vertical-align: top;
  top: 15px;
  right: 195px;
  cursor: pointer;
  border-radius: 15px;
  position: absolute;
}
.volumeBar-Under{
  height: 5px;
  background-color: #299cd2;
  cursor: pointer;
  position: absolute;
  top: 0;
  border-radius: 15px;
}
.volumeBar-point{
  width: 11px;
  height: 11px;
  background-color: #fff;
  border-radius: 50%;
  position: absolute;
  top: -3px;
  right: -9px;
  cursor: pointer;
}
.prevBtn{
  background: url(../img/controls/prev.png) no-repeat center;
  width: 40px;
  height: 100%;
  cursor: pointer;
  position: absolute;
  bottom: 0;
  right: 135px;
}
.prevBtn:hover{
  background: url(../img/controls/prevOver.png) no-repeat center;
}
.nextBtn{
  background: url(../img/controls/next.png) no-repeat center;
  width: 40px;
  height: 100%;
  cursor: pointer;
  position: absolute;
  bottom: 0;
  right: 10px;
}
.nextBtn:hover{
  background: url(../img/controls/nextOver.png) no-repeat center;
}

.thisPageNum, .totalPageNum{
  vertical-align: top;
  color: #07222f;
  font-size: 20px;
  position: absolute;
  bottom: 5px;

}
.thisPageNum{
  right: 100px;
}
.totalPageNum{
  right: 60px;
}
.endBubble{
  background: url(../img/controls/bubble_next.png) no-repeat left top;
  width: 55px;
  height: 62px;
  position: absolute;
  bottom: 20px;
  right: 10px;
  opacity: 0;
  z-index: -1;
}
