:root {
  --ad-width: 300px;
  --ad-height: 600px;
}

body {
  position: absolute !important;
  padding: 0 !important;
  width: var(--ad-width) !important;
  height: var(--ad-height) !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 auto !important;
  z-index: 9999 !important;
}

.wrapper {
  position: absolute;
  width: var(--ad-width);
  height: var(--ad-height);
  top: 0;
  left: 0;
  overflow: hidden;
  cursor: pointer;
}

.bg,
.logo,
.tint,
.playbtn,
.outprod,
.outels,
.outcta,
.outcp,
.incp {
  position: absolute;
  width: var(--ad-width);
  height: var(--ad-height);
  top: 0;
  left: 0;
  pointer-events: none;
}

.playbtn {
  transform-origin: 150px 520px;
}

.outcta {
  transform-origin: 150px 550px;
}

/* Game UI */

.hits_cn {
  position: absolute;
  width: 300px;
  height: 300px;
  top: 212px;
  left: 0;
  right: 0;
  margin: 0 auto;
}

.hammer_cn,
.hammer {
  position: absolute;
  width: 106px;
  height: 162px;
  top: 320px;
  left: 80px;

  transform-origin: 50% 100%;
  pointer-events: none;
}

.hammer_cn {
  transform: scale(1);
}

.hammer {
  top: 0;
  left: 0;
  transform-origin: 50% 100%;
}

.tgcn_1,
.tgcn_2,
.tgcn_3,
.tgcn_4 {
  position: absolute;
  width: 110px;
  height: 110px;

  border-radius: 50%;
  background-color: #95baf3;
  border: 2px solid #95baf3;
  margin: -2px;

  overflow: hidden;
}

.expcn_1,
.expcn_2,
.expcn_3,
.expcn_4 {
  position: absolute;
  width: 110px;
  height: 110px;

  pointer-events: none;
}

.gmprod_1,
.gmprod_2,
.gmprod_3,
.gmprod_4 {
  position: absolute;
  width: 110px;
  height: 90px;
  overflow: hidden;
  pointer-events: none;
}

.tgcn_1,
.tgcn_2,
.expcn_1,
.expcn_2 {
  top: 0;
}

.tgcn_1,
.gmprod_1,
.tgcn_3,
.gmprod_3,
.expcn_1,
.expcn_3 {
  left: 26px;
}

.tgcn_2,
.gmprod_2,
.tgcn_4,
.gmprod_4,
.expcn_2,
.expcn_4 {
  left: 164px;
}

.tgcn_3,
.tgcn_4,
.expcn_3,
.expcn_4 {
  top: 141px;
}

.gmprod {
  position: absolute;
  width: 110px;
  height: 157px;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;

  pointer-events: none;

  transform-origin: 50% 100%;
}

.gmprod_1,
.gmprod_2 {
  top: -30px;
}

.gmprod_3,
.gmprod_4 {
  top: 111px;
}

.gmprod_1 .gmprod,
.gmprod_2 .gmprod {
  top: 30px;
}

.gmprod_3 .gmprod,
.gmprod_4 .gmprod {
  top: 30px;
}

.scorecn {
  position: absolute;
  width: 113px;
  height: 23px;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 140px;
}

.sc1,
.sc2,
.sc3,
.sc4 {
  position: absolute;
  width: 23px;
  height: 23px;
  top: 0;
  border-radius: 50%;
  background-color: #ffffff;
}

.sc1 {
  left: 0;
}

.sc2 {
  left: 30px;
}

.sc3 {
  left: 60px;
}

.sc4 {
  left: 90px;
}

/* .icon{
    position: absolute;
    width: 55px;
    height: 55px;
    bottom: 40px;
    left: 0;
    right: 0;
    margin: 0 auto;
    background-size: contain;

} */
