Use HTML code for icons now

src/Controls.astro

@@ -6,16 +6,8 @@ const {
     SeekColor = '#ff274d'
 } = Astro.props
 
-// Icons
+// Icons and Styles
-import {
+import './Iconoir.css'
-    RewindSolid,
-    Enlarge,
-    ForwardSolid,
-    PlaySolid,
-    Refresh,
-    SoundHighSolid,
-    MultiWindow
-} from "@iconoir/vue"
 ---
 
 <div class="video-controls">
@@ -23,17 +15,17 @@ import {
         <p>{Title}</p>
     </div>
     <div class="vc-bottom">
-        <button style="display: none" id="vc-playagain"><Refresh /></button>
+        <button style="display: none" id="vc-playagain"><i class="iconoir-refresh"></i></button>
         <div class="vc-start">
-            <button id="vc-playpause"><PlaySolid /></button>
+            <button id="vc-playpause"><i class="iconoir-play-solid"></i></button>
             {Live ?
                 null
                 :
-                <button id="vc-backwards"><RewindSolid /></button>
+                <button id="vc-backwards"><i class="iconoir-rewind-solid"></i></button>
-                <button id="vc-forwards"><ForwardSolid /></button>
+                <button id="vc-forwards"><i class="iconoir-forward-solid"></i></button>
             }
             <div class="vc-volume-controller">
-                <button><SoundHighSolid/></button>
+                <button><i class="iconoir-sound-high-solid"></i></button>
                 <div class="vc-volume-controller-input">
                     <span style={`background: lightblue`} class="vc-volume-bar"></span>
                     <input type="range" min="0" max="1.0" step="0.01"/>
@@ -63,8 +55,8 @@ import {
             }
             <slot/>
             <!-- The requestPictureInPicture() function is not supported in Firefox -->
-            <button id="vc-pip" onclick="Player.requestPictureInPicture()"><MultiWindow/></button>
+            <button id="vc-pip" onclick="Player.requestPictureInPicture()"><i class="iconoir-multiwindow"></i>/button>
-            <button id="vc-fullscreen"><Enlarge /></button>
+            <button id="vc-fullscreen"><i class="iconoir-enlarge"></i></button>
         </div>
     </div>
 </div>

src/Player.astro

@@ -19,9 +19,9 @@ import Controller from './Controls/Controller.astro'
 import Seek from './Controls/Seek.astro'
 import Sync from './Controls/Sync.astro'
 
-// Styles
+// Icons and Styles
 import './Index.scss'
-import { Settings } from '@iconoir/vue'
+import './Iconoir.css'
 ---
 
 <div class="video-container" id={"zorn-player-" + PlayerName}>
@@ -31,7 +31,7 @@ import { Settings } from '@iconoir/vue'
     {Milieu ? <MilieuEffect/> : null }
     {SettingsMenu ?
         <Controls PlayerName={PlayerName} Live={Live}>
-            <button id="open-zorn-settings-button" onclick="OpenZornMenu()"><Settings/></button>
+            <button id="open-zorn-settings-button" onclick="OpenZornMenu()"><i class="iconoir-settings"></i></button>
             <slot/>
         </Controls>
         :