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

.HomePage {
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  position: absolute;

  overflow-x: hidden;
  overflow-y: auto;

  .homeEffect {
    position: absolute;
    left: 0;
    top: 79px;
    width: 750px;
    height: 1253px;
  }

  .bg {
    width: 750px;
    height: 1438px;
    left: 0;
    top: 0;
    position: absolute;
    .sparkBg("userHomePage/bg.jpg");
  }

  .logo {
    position: absolute;
    left: 223px;
    top: 75px;
    width: 290px;
    height: 28px;
    .sparkBg("userHomePage/logo.png");
  }

  .title {
    position: absolute;
    left: 112px;
    top: 110px;
    width: 550px;
    height: 182px;
    .sparkBg("userHomePage/标题.png");
  }

  .subTitle {
    position: absolute;
    left: 69px;
    top: 292px;
    width: 613px;
    height: 46px;
    .sparkBg("userHomePage/subBg.png");

    font-size: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgb(255, 255, 255);
  }

  .rule {
    position: absolute;
    left: 0;
    top: 85px;
    width: 98px;
    height: 50px;
    .sparkBg("userHomePage/规则.png");
    transform-origin: left center;
  }

  .prize {
    position: absolute;
    left: 643px;
    top: 80px;
    width: 107px;
    height: 50px;
    .sparkBg("userHomePage/奖品.png");
    transform-origin: right center;
  }

  .inviteDetails {
    position: absolute;
    left: 597px;
    top: 345px;
    width: 153px;
    height: 50px;
    .sparkBg("userHomePage/邀请明细.png");
    transform-origin: right center;
  }

  .uid {
    position: absolute;
    left: 0;
    top: 355px;
    height: 40px;

    padding: 0 10px;
    box-sizing: border-box;

    font-size: 20.51px;
    color: rgb(255, 255, 255);
    text-transform: uppercase;
    text-align: left;

    display: flex;
    align-items: center;
    background-color: rgba(0, 0, 0, 0.65);
    border-radius: 0 40px 40px 0;
  }

  .visitList {
    position: absolute;
    left: 0;
    top: 594px;
    width: 150px;
    height: 153px;
    transform-origin: left center;

    .visitListSvga {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 198px;
      height: 353px;
    }
  }

  .shareBtn {
    position: absolute;
    right: 0;
    top: 590px;
    width: 181px;
    height: 181px;


    .shareBtnSvga {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 185px;
      height: 354px;
    }
  }

  .inviteBtn {
    position: absolute;
    left: 187px;
    top: 1127px;
    width: 377px;
    height: 123px;

    .inviteBtnImg {
      width: 100%;
      height: 100%;
      .sparkBg("userHomePage/按钮.png");
      .breathAnimation();
    }
  }

  .musicBtn {
    position: absolute;
    left: 685px;
    top: 165px;
    width: 47px;
    height: 47px;
  }

  .drawBtn {
    position: absolute;
    left: 585px;
    top: 1073px;
    width: 165px;
    height: 204px;
    //.sparkBg("userHomePage/抽奖.png");

    .drawBtnSvga {
      position: absolute;
      left: -47px;
      top: 50%;
      transform: translateY(-50%);
      width: 224px;
      height: 354px;
    }
  }

  .strategy {
    position: absolute;
    left: 54px;
    top: 401px;
    width: 662px;
    height: 200px;
    .sparkBg("userHomePage/瓜分攻略.png");
  }

}
