title: How to fill this SVG?
body: <p>I've tried to fill this SVG:</p>
  
  <pre><code>&lt;svg xmlns="http://www.w3.org/2000/svg" width="23.15" height="20" viewBox="0 0 23.15 20"&gt;
      &lt;defs&gt;
          &lt;style&gt;
              .cls-1{fill:#d1d1d1}
          &lt;/style&gt;
      &lt;/defs&gt;
      &lt;path id="iconfinder_heart_226577" d="M22.777 9.744a5.957 5.957 0 0 0-8.425 0l-1.4 1.4-1.4-1.4a5.958 5.958 0 0 0-8.435 8.426l1.4 1.4 8.43 8.43 8.426-8.426 1.4-1.4a5.958 5.958 0 0 0 .004-8.43zm-4.213 9.83l-5.617 5.617-5.617-5.617-2.808-2.808a3.972 3.972 0 0 1 5.617-5.617l2.808 2.809 2.809-2.809a3.972 3.972 0 0 1 5.617 5.617z" class="cls-1" transform="translate(-1.372 -7.999)"/&gt;
  &lt;/svg&gt;
  </code></pre>
  
  <p>With color in the middle, but I was only able to change the color of the stroke.
  I've tried a lot of answers here but I didn't understand what I'm doing wrong.</p>
  
  <pre><code>&lt;svg xmlns="http://www.w3.org/2000/svg" width="23.15" height="20" viewBox="0 0 23.15 20"&gt;
      &lt;defs&gt;
          &lt;style&gt;
              .cls-1{
                fill:#EB6320;
                stroke: none;
                type: path;
              }
          &lt;/style&gt;
      &lt;/defs&gt;
      &lt;path
        id="iconfinder_heart_226577"
        d="M22.777 9.744a5.957 5.957 0 0 0-8.425 0l-1.4 1.4-1.4-1.4a5.958 5.958 0 0 0-8.435 8.426l1.4 1.4 8.43 8.43 8.426-8.426 1.4-1.4a5.958 5.958 0 0 0 .004-8.43zm-4.213 9.83l-5.617 5.617-5.617-5.617-2.808-2.808a3.972 3.972 0 0 1 5.617-5.617l2.808 2.809 2.809-2.809a3.972 3.972 0 0 1 5.617 5.617z"
        class="cls-1"
        transform="translate(-1.372 -7.999)"/&gt;
  &lt;/svg&gt;
  </code></pre>