diff --git a/index.html b/index.html
index eb14116..cd01fcc 100644
--- a/index.html
+++ b/index.html
@@ -1,57 +1,34 @@
 <!DOCTYPE html>
 <html>
-<head>
-  <title>WebAR Windmill</title>
-  <script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script>
-  <script src="https://cdn.jsdelivr.net/gh/AR-js-org/AR.js/aframe/build/aframe-ar.js"></script>
-  <style>
-    #overlay {
-      position: absolute;
-      top: 50%;
-      left: 50%;
-      transform: translate(-50%, -50%);
-      display: none;
-    }
-  </style>
-</head>
-<body style="margin: 0; overflow: hidden;">
+  <head>
+    <meta charset="utf-8">
+    <title>WebAR Windmill</title>
+    <script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script>
+    <script src="https://raw.githack.com/AR-js-org/AR.js/master/aframe/build/aframe-ar.js"></script>
+    <link rel="stylesheet" href="css/styles.css">
+  </head>
+  <body>
+    <a-scene embedded arjs>
+      <!-- Assets -->
+      <a-assets>
+        <a-asset-item id="windmillModel" src="windmill.glb"></a-asset-item>
+        <video id="videoOverlay" src="video.mp4" autoplay loop></video>
+        <img id="logoMarker" src="logo.png">
+      </a-assets>
 
-<a-scene embedded arjs>
-  <!-- Windmill Marker -->
-  <a-marker preset="custom" type="pattern" url="logo.patt">
-    <a-entity gltf-model="url(windmill.glb)" animation-mixer></a-entity>
-  </a-marker>
+      <!-- Windmill Marker -->
+      <a-marker preset="custom" url="logo.png">
+        <a-gltf-model src="#windmillModel" animation-mixer></a-gltf-model>
+      </a-marker>
 
-  <!-- Static Middle Marker -->
-  <a-entity camera>
-    <a-cursor></a-cursor>
-  </a-entity>
-</a-scene>
+      <!-- Video Overlay -->
+      <a-entity id="videoContainer" position="0 1.5 -3" visible="false">
+        <a-plane material="shader: flat; src: #videoOverlay" height="1" width="1.78"></a-plane>
+      </a-entity>
 
-<!-- Video Overlay -->
-<div id="overlay">
-  <video id="video" width="600" controls>
-    <source src="video.mp4" type="video/mp4">
-    Your browser does not support the video tag.
-  </video>
-</div>
-
-<script>
-  document.addEventListener('markerFound', (e) => {
-    if (e.detail && e.detail.markerId === 'your-marker-id') {
-      document.getElementById('overlay').style.display = 'block';
-      document.getElementById('video').play();
-    }
-  });
-
-  document.addEventListener('markerLost', (e) => {
-    if (e.detail && e.detail.markerId === 'your-marker-id') {
-      document.getElementById('overlay').style.display = 'none';
-      document.getElementById('video').pause();
-      document.getElementById('video').currentTime = 0;
-    }
-  });
-</script>
-
-</body>
+      <!-- Camera -->
+      <a-entity camera></a-entity>
+    </a-scene>
+    <script src="js/main.js"></script>
+  </body>
 </html>
