Clickable whitespace underneath every SVG

There’s clickable whitespace underneath every SVG.

Meaning, when that area is clicked, nothing happens, no video opens.

The whole area inside the box should be clickable.

Full Code: https://jsfiddle.net/fzLcpjrb/

Also, how come there are 2 different mouse cursors when you hover over that area?

How would all of this be fixed?

What’s not written properly in the html if that’s where the issue is?

<svg width="198" height="198" viewbox="8.5 -12.2 7 48.49">
                     <symbol id="play" width="198" height="198" viewbox="8.5 -12.2 7 48.49">
                        <title>Play</title>
                        <path d="M16.036 11.58l-6-3.82a.5.5 0 0 0-.77.42v7.64a.498.498 0 0 0 .77.419l6-3.817c.145-.092.23-.25.23-.422s-.085-.33-.23-.42z" />
                        <path d="M12 22.75C6.072 22.75 1.25 17.928 1.25 12S6.072 1.25 12 1.25 22.75 6.072 22.75 12 17.928 22.75 12 22.75zm0-20C6.9 2.75 2.75 6.9 2.75 12S6.9 21.25 12 21.25s9.25-4.15 9.25-9.25S17.1 2.75 12 2.75z" />
                     </symbol>
                  </svg>
                  <svg class="alpha" >
                     <use href="#play" />
                  </svg>
                  <div class="hide">
                     <div class="video playinga" data-id="ZPz3wzPlruA"></div>
                  </div>
               </li>
               <li>
                  <svg class="beta">
                     <use href="#play" />
                  </svg>
                  <div class="hide">
                     <div class="video playingb" data-id="VFMtNOxpV3o"></div>
                  </div>
               </li>
               <li>
                  <svg class="gamma">
                     <use href="#play" />
                  </svg>
                  <div class="hide">
                     <div class="video playingc" data-id="Zkf4EDjV1_g"></div>
                  </div>
               </li>
               <li>
                  <svg class="delta">
                     <use href="#play" />
                  </svg>
                  <div class="hide">
                     <div class="video playingd" data-id="-Xgi_way56U"></div>
                  </div>
               </li>
               <li>
                  <svg class="epsilon">
                     <use href="#play" />
                  </svg>
                  <div class="hide">
                     <div class="video playinge" data-id="EK3h0IADYrQ"></div>
                  </div>
               </li>
               <li>
                  <svg class="zeta">
                     <use href="#play" />
                  </svg>
                  <div class="hide">
                     <div class="video playingf" data-id="YOw9J4K02H4"></div>
                  </div>
               </li>
               <li>
                  <svg class="eta">
                     <use href="#play" />
                  </svg>
                  <div class="hide">
                     <div class="video playingg" data-id="ID856YDIb6A"></div>
                  </div>
               </li>
               <li>
                  <svg class="theta">
                     <use href="#play" />
                  </svg>
                  <div class="hide">
                     <div class="video playingh" data-id="9Gn8ymkrlbI"></div>
                  </div>
               </li>
               <li>
                  <svg class="iota">
                     <use href="#play" />
                  </svg>
                  <div class="hide">
                     <div class="video playingi" data-id="qYEooPeyz5M"></div>
                  </div>

There’s clickable whitespace underneath every SVG.
I can not find any whitespace in the link u have provided?
But if u want to make the entire area clickable u can ahref a div

Also, how come there are 2 different mouse cursors when you hover over that area?
I cannot seem to replicate this error?
but if ure refering to the changing mouse thats because its set to change
if u like to change it to something else simply remove this in ure CSS code
or CSS cursor property for other mouse options