@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@600&family=Protest+Riot&display=swap');

#container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

    font-size: 500%;
    font-family: 'Protest Riot';
    white-space: nowrap;
    color: black;
}

#input {
    height: 100px;
    border: none
}

.heart {
    width:200px;
    background:
     radial-gradient(circle at 60% 65%, red 64%, transparent 65%) top left,
     radial-gradient(circle at 40% 65%, red 64%, transparent 65%) top right,
     linear-gradient(to bottom left, red 43%,transparent 43%) bottom left ,
     linear-gradient(to bottom right,red 43%,transparent 43%) bottom right;
    background-size:50% 50%;
    background-repeat:no-repeat;
    display:inline-block;
    position: absolute;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: none;

  }
  .heart::before {
    content:"";
    display:block;
    padding-top:100%;
  }
 