@import "../../res.less";

.GamePage {
  position: absolute;
  left: 0;
  top: 50%;
  width: 750px;
  height: 1624px;
  transform: translateY(-50%);

  .gameBg {
    position: absolute;
    left: 0;
    top: 0;
    width: 750px;
    height: 1624px;
    .webpBg("GamePage/bg.jpg");
    background-color: white;
  }

  .gameCanvas {
    position: absolute;
    left: 0;
    top: 0;
    width: 750px;
    height: 1624px;
  }

  .posterBtn {
    position: absolute;
    left: 18px;
    top: 1285px;
    width: 346px;
    height: 120px;
    .webpBg("GamePage/我的海报.png");
  }


  .dealCardBtn {
    position: absolute;
    left: 388px;
    top: 1285px;
    width: 347px;
    height: 120px;
    .webpBg("GamePage/发牌.png");
  }

  .backBtn {
    position: absolute;
    left: 0;
    top: 270px;
    width: 112px;
    height: 60px;
    .webpBg("GamePage/返回.png");
    transform-origin: center left !important;
  }

  .progressTitle {
    position: absolute;
    left: 48px;
    top: 366px;
    width: 157px;
    height: 55px;
    .webpBg("GamePage/bt.png");
  }

  .progressTxt {
    font-size: 38px;
    color: rgb(237, 74, 14);
    line-height: 2.514;
    text-align: left;
    position: absolute;
    left: 212px;
    top: 350px;
    font-weight: bold;
  }

  .musicBtn {
    position: absolute;
    left: 678px;
    top: 279px;
    width: 46px;
    height: 46px;
  }

  .progressBar {
    position: absolute;
    left: 41px;
    top: 425px;
    width: 664px;
    height: 43px;
    .webpBg("GamePage/bar.png");

    .progressFill {
      position: absolute;
      left: 10px;
      top: 7px;
      width: 648px;
      height: 27px;
      border-radius: 27px;
      .webpBg("GamePage/fill.png");
      background-size: 648px 27px;
    }
  }
}
