diff --git a/src/App.tsx b/src/App.tsx
index 0da7d98..e86553c 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,43 +1,15 @@
-import { useState } from 'react'
-import reactLogo from './assets/react.svg'
-import viteLogo from './assets/vite.svg'
-import heroImg from './assets/hero.png'
-import './App.css'
-
-// Import the tic-tac-toe game component
-import TicTacToe from './components/TicTacToe'
+import React from 'react';
+import './App.css';
+import TicTacToe from './components/TicTacToe';
 
 function App() {
-  const [count, setCount] = useState(0)
-
   return (
-    <>
-      <section id="center">
-        <div className="hero">
-          <img src={heroImg} className="base" width="170" height="179" alt="" />
-          <img src={reactLogo} className="framework" alt="React logo" />
-          <img src={viteLogo} className="vite" alt="Vite logo" />
-        </div>
-        <div>
-          <h1>Get started</h1>
-          <p>
-            Edit <code>src/App.tsx</code> and save to test <code>HMR</code>
-          </p>
-        </div>
-        <button
-          className="counter"
-          onClick={() => setCount((count) => count + 1)}
-        >
-          Count is {count}
-        </button>
-      </section>
-
-      <div className="ticks"></div>
-
-      {/* Add the tic-tac-toe game component */}
-      <TicTacToe />
-    </>
-  )
+    <div className="App">
+      <div className="App-content">
+        <TicTacToe />
+      </div>
+    </div>
+  );
 }
 
-export default App
+export default App;