Estructura HTML Menu Gooey

<div class="contenedor-menu-gooey">
    <div class="ov-gooey">

        <button class="ov-gooey-toggle-button">
      <i class="fas fa-bars"></i>
        </button>

        <ul class="ov-gooey-items">
            <li class="ov-gooey-item">
                <a href="#" class="ov-gooey-button">
                    <i class="fas fa-home"></i>
                </a>
            </li>
            <li class="ov-gooey-item">
                <a href="#" class="ov-gooey-button">
                    <i class="fas fa-store"></i>
                </a>
            </li>
            <li class="ov-gooey-item">
                <a href="#" class="ov-gooey-button">
                    <i class="fas fa-star"></i>
                </a>
            </li>
            <li class="ov-gooey-item">
                <a href="#" class="ov-gooey-button">
                    <i class="fas fa-comment-dots"></i>
                </a>
            </li>
        </ul>

    </div>

    <svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="800">
        <defs>
            <filter id="goo">
              <feGaussianBlur in="SourceGraphic" stdDeviation="12" result="blur" />
              <feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 35 -15" result="goo" />
              <feComposite in="SourceGraphic" in2="goo" operator="atop"/>
            </filter>
        </defs>
    </svg>

</div><!-- /contenedor-menu-gooey -->