.hat{
width: 12.5rem;
position: absolute;
transform: scale(0.11) rotate(30deg);
top: -36px;
left: 100px;
}
.base {
  background: #f6f6f6;
  border-radius: 2rem;
  color:#f6f6f6;
  width:8.8rem;
  position: relative;
  left:1rem;
  z-index:-1;
  border: 1px solid #59f;
}
.body{
  position: relative;
  left: 1.75rem;
  width:7.43rem;
  height: 5.6rem;
  background-color: #BB2649;
  border-radius: 300% 0% 0%;
  z-index:-3;
}
.ball{
  width:2rem;
  height:2rem;
  background:#f6f6f6;
  border-radius:50%;
  position:relative;
  left:69%;
  top:1rem;
  z-index:-1;
  border: 1px solid #59f;
}
.circle{
  width:3rem;
  height:5.6rem;
  background: #fff;
  border-radius:50%;
  top:25%;
  left:65%;
  position:absolute;
  z-index:-2;
}

@media (max-width: 850px) 
{
.hat{transform: scale(0.11) rotate(18deg);
top: -37px;
left: -26px;}

}