body{
    margin:0;
    padding:0;
    background:#fff;
    overflow:hidden;
  }
  .test {
    border: 1px solid black;
  }
  .icecream{
    position: absolute;
    left: 50%;
    top: 50%;
    width: 200px;
    height:440px;
    margin-left:-100px;
    margin-top:-220px;
    }
  .icecream .head{
    width:100%;
    height: 310px;
    background:#db7093;
    border-radius: 100px 100px 0 30px;
  }
  .icecream .head .bite{
    position: absolute;
    left:5%;
    top:10px;
    width:40px;
    height:50px;
    border-radius: 8500%;
    background:#fff;
  }
  .icecream .head .bite:nth-child(2) {
    left: 0px;
    top: 50px;
    width:30px;
    height:35px;
  }
  .icecream .head .stripContainer {
    position: absolute;
    top:18%;
    left:50%;
    width:116px;
    height:140px;
    margin-left:-58px;
    display: flex;
    justify-content: space-between;
  }
  .icecream .head .stripContainer .strip {
    width:40px;
    height:100%;
    border-radius: 120px;
    background:#db819f;
  }
  .icecream .head .mltContainer {
    position: absolute;
    right: 0;
    bottom: 20px;
    height: 100px;
  }

  .mltContainer .drip {
    width:30px;
    height:30px;
    background: #db7093;
    border-radius: 0px 300px 190px;
    margin-bottom: 5px;
    transform: rotate(45deg);
    animation: drop 3s infinite linear;
  }

  .icecream .stick {
    position: relative;
    left:50%;
    width:34px;
    margin-left:-17px;
    height:115px;
    top:310px;
    border-radius: 0 0 30px 30px;
    background:#ffefd5;
  }
  @keyframes drop {
    0% {
      opacity: 0;
      transform: rotate(45deg) translate(0, -10px);
    }
    50% {
      opacity: 1;
      transform: rotate(45deg) translate(10px, 0);
    }
    100%{
      opacity: 0;
      transform: rotate(45deg) translate(20px, 10px);
    }
  }

  .drip.second {
    animation-delay: -5.5s;
  }