diff --git a/app/database/tables/007_relationship.sql b/app/database/tables/007_relationship.sql
deleted file mode 100644
index 5e3b80c9bc84f2f9aa75c091b26b650151ee1755..0000000000000000000000000000000000000000
--- a/app/database/tables/007_relationship.sql
+++ /dev/null
@@ -1,9 +0,0 @@
-CREATE TABLE IF NOT EXISTS relationship
-(
-  relationship_id SERIAL PRIMARY KEY NOT NULL,
-  client_id_1 INTEGER NOT NULL,
-  client_id_2 INTEGER NOT NULL,
-  type VARCHAR(50) NOT NULL CHECK (type IN ('FRIEND', 'PENDING', 'BLOCKED')),
-  FOREIGN KEY (client_id_1) REFERENCES client(client_id) ON DELETE CASCADE ON UPDATE CASCADE,
-  FOREIGN KEY (client_id_2) REFERENCES client(client_id) ON DELETE CASCADE ON UPDATE CASCADE
-);
\ No newline at end of file
diff --git a/app/models/anime_list.php b/app/models/anime_list.php
index 50202dfb19edcea48b324b6f9a5e37a40cb7ef58..1656eca836c8fea2489ae2a5fa9b0cd27d646ac4 100644
--- a/app/models/anime_list.php
+++ b/app/models/anime_list.php
@@ -61,7 +61,12 @@ class Anime_List{
     JOIN client c ON c.client_id = l.client_id 
     WHERE a.anime_id = '.$aid.' AND c.client_id = '.$cid);
     return ($this->db->fetchData());
-    // return true if there is a mutual relationship, otherwise false
+    // return true if there is a row, otherwise false
+  }
+
+  public function getAverageUserScoreByClientID($id){
+    $this->db->query('SELECT AVG(user_score) AS avg FROM '.$this->table.' WHERE client_id = '.$id);
+    return $this->db->fetchData();
   }
 
 }
\ No newline at end of file
diff --git a/app/models/client.php b/app/models/client.php
index f52c30c0a0f658a1100efd8632dc439738d400e7..d90eb0c0e51000aa2e0b24124de46ee3ca652bb9 100644
--- a/app/models/client.php
+++ b/app/models/client.php
@@ -35,12 +35,6 @@ class Client {
       return $this->db->fetchData();
     }
 
-    public function getAllClientRelationshipByClientID($id){
-      $id = $this->db->processDataType($id);
-      $this->db->query('SELECT * FROM ' . $this->table . ' JOIN relationship WHERE '.$id.' = relationship.client_id_1 OR '.$id.' = relationship.client_id_2');
-      return $this->db->fetchAllData();
-    }
-
     public function insertClient($data){
       foreach($data as $key => $value){
         $data[$key] = $this->db->processDataType($value);
@@ -68,4 +62,5 @@ class Client {
         return ($this->db->countRow() != 0);
         // if countRow == 0, query fails
     }
+
 }
\ No newline at end of file
diff --git a/app/models/genre.php b/app/models/genre.php
index 3c673c8b19c1ee93c1bb7c23b8e3079e41534afb..e6696be56b4dae86098b8358487e78ac88cf50cb 100644
--- a/app/models/genre.php
+++ b/app/models/genre.php
@@ -22,11 +22,6 @@ class Genre {
     return $this->db->fetchData();
   }
 
-  public function getAllGenreIDByAnimeID($id){
-    $this->db->query('SELECT '.$this->table.'.genre_id FROM ' . $this->table . ' JOIN anime_genre ON '.$this->table.'.genre_id = anime_genre.genre_id JOIN anime ON anime_genre.anime_id = anime.anime_id WHERE anime.anime_id = '.$id);
-    return $this->db->fetchAllData();
-  }
-
   public function insertGenre($name){
     $name = $this->db->processDataType($name);
     $this->db->query('INSERT INTO ' . $this->table . ' (name) VALUES ('.$name.')');
@@ -52,4 +47,10 @@ class Genre {
     // if countRow == 0, query fails
   }
 
+  // =========== SPECIFIC QUERY ===========
+  public function getAllGenreIDByAnimeID($id){
+    $this->db->query('SELECT g.genre_id, g.name FROM ' . $this->table . ' g JOIN anime_genre ON g.genre_id = anime_genre.genre_id JOIN anime ON anime_genre.anime_id = anime.anime_id WHERE anime.anime_id = '.$id);
+    return $this->db->fetchAllData();
+  }
+
 }
\ No newline at end of file
diff --git a/app/models/relationship.php b/app/models/relationship.php
deleted file mode 100644
index 43118eddf834d929a14bce6c4cda4e4d8dddf3ec..0000000000000000000000000000000000000000
--- a/app/models/relationship.php
+++ /dev/null
@@ -1,61 +0,0 @@
-<?php
-
-require_once(dirname(__DIR__,1).'/define.php');
-require_once(BASE_DIR.'/setup/setup.php');
-require_once('Database.php');
-
-class Relationship {
-  private $table = 'relationship';
-  private $db;
-
-  public function __construct(){
-    $this->db = new Database ();
-  }
-
-  public function getAllRelationship(){
-    $this->db->query('SELECT * FROM '.$this->table);
-    return $this->db->fetchAllData();
-  }
-
-  public function getRelationshipByID($id){
-    $this->db->query('SELECT * FROM '.$this->table. ' WHERE relationship_id = '. $id);
-    return $this->db->fetchData();
-  }
-
-  public function insertRelationship($data){
-    foreach($data as $key => $value){
-      $data[$key] = $this->db->processDataType($value);
-    }
-    $this->db->query('INSERT INTO ' . $this->table . ' (client_id_1, client_id_2, type) VALUES ('.$data['client_id_1'].','.$data['client_id_2'].','.$data['type'].')');
-    $this->db->execute();
-    return ($this->db->countRow() != 0);
-    // if countRow == 0, query fails
-  }
-
-  public function updateRelationship($data){
-    foreach($data as $key => $value){
-      $data[$key] = $this->db->processDataType($value);
-    }
-    $this->db->query('UPDATE ' . $this->table . 'SET client_id_1 = '.$data['client_id_1'].', client_id_2 = '.$data['client_id_2'].', type = '.$data['type'].' WHERE relationship_id = '. $data['relationship_id']);
-    $this->db->execute();
-    return ($this->db->countRow() != 0);
-    // if countRow == 0, query fails
-  }
-
-  public function deleteRelationship($id){
-    $this->db->query('DELETE FROM ' . $this->table . ' WHERE relationship_id = '. $id);
-    $this->db->execute();
-    return ($this->db->countRow() != 0);
-    // if countRow == 0, query fails
-  }
-
-  // SPECIFIC QUERY
-
-  public function getMutualRelationship($id1, $id2){
-    $this->db->query('SELECT * FROM '.$this->table.' WHERE client_id_1 = '.$id1.' AND client_id_2 = '.$id2.' OR client_id_1 = '.$id2.' AND client_id_2 = '.$id1);
-    return ($this->db->fetchData());
-    // return true if there is a mutual relationship, otherwise false
-  }
-
-
-}
\ No newline at end of file
diff --git a/app/public/handler/trailer.js b/app/public/handler/trailer.js
index cf647760839f55f0417c40d6363fc09417470dda..7c4dd27f0be4c3f458acbb95be0de3eeba251e66 100644
--- a/app/public/handler/trailer.js
+++ b/app/public/handler/trailer.js
@@ -1,10 +1,12 @@
-function displayTrailer (trailer){
-  // let trailer = '/public/vid/trailer1.mp4';
+function displayTrailer (trailer, title){
   document.getElementById("trailer-div").style.top = "0px";
   document.getElementById("anime-trailer-iframe").src = trailer;
+  document.getElementById("trailer-title").innerHTML = title;
 }
 
 function hideTrailer() {
   document.getElementById("trailer-div").style.top = "-100%";
   document.getElementById("anime-trailer-iframe").src = "";
+  document.getElementById("trailer-title").innerHTML = "";
+
 }
diff --git a/app/public/style/anime.css b/app/public/style/anime.css
index 49ea1206d9fa14e461566a26c98242644333b168..e81e8f60bd248edca396f2e74f5e6afb5ee0c017 100644
--- a/app/public/style/anime.css
+++ b/app/public/style/anime.css
@@ -52,7 +52,6 @@
 
 .image-preview {
   width: 100%;
-  max-width: 320px;
   object-fit: contain;
   object-position: center;
 }
@@ -132,13 +131,25 @@
   flex: 1;
   display: flex;
   flex-direction: column;
+  justify-content: start;
+  align-items: center;
+  padding: 20px;
   gap: 5px;
   max-width: 320px;
-  margin-bottom: 20px;
+  margin-bottom: 10px;
 }
 
-.anime-details div {
-  margin-bottom: 10px;
+.grid-container {
+  width: 100%;
+  display: grid;
+  grid-template-columns: auto auto;
+  padding: 10px;
+  gap: 10px;
+  justify-content: space-between;
+}
+
+.anime-details-aspect {
+  font-weight: bold;
 }
 
 .anime-trailer {
@@ -147,7 +158,7 @@
   flex-direction: column;
   align-items: center;
   background-color: #dedede;
-  padding: 20px;
+  padding: 10px;
 }
 
 .anime-trailer-iframe {
diff --git a/app/public/style/client.css b/app/public/style/client.css
index 8c767124a03bd4bf5db39211b94927851286a731..1acac2d769a1a2e176fe035a18df2106ae6373b9 100644
--- a/app/public/style/client.css
+++ b/app/public/style/client.css
@@ -1,12 +1,79 @@
-.client-container{
+.client-big-container{
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: row;
+  padding: 20px;
+  gap: 20px;
+  margin: auto;
+}
+
+.client-left-container{
   display: flex;
   justify-content: center;
   align-items: center;
   flex-direction: column;
   padding: 20px;
+  gap: 20px;
+}
+
+.client-main-container{
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: row;
+  padding: 20px;
+  gap: 20px;
+  border: black 2px solid;
+}
+
+.client-image-box{
+  display: flex;
+  width: 120px;
+  aspect-ratio: 1;
+  padding: 10px;
+  border-radius: 100%;
+  border: black 2px solid;
+}
+
+.client-image {
+  width: 100%;
+  object-fit: cover;
+  object-position: center;
+  border-radius: 100%;
 }
 
-.image-box{
+.client-description {
   display: flex;
-  
+  flex-direction: column;
+  gap: 5px;
+}
+
+.client-username {
+  font-size: 36px;
+  font-weight: bold;
+}
+
+.client-email {
+  font-size: 16px;
+  color: #787878;
+  font-weight: bold;
+}
+
+.client-id{
+  font-size: 12px;
+  color: #787878;
+}
+
+.client-info-container {
+  width: 100%;
+  display: grid;
+  grid-template-columns: auto auto;
+  padding: 10px;
+  gap: 10px;
+  justify-content: space-between;
+}
+
+.client-info-aspect {
+  font-weight: bold;
 }
\ No newline at end of file
diff --git a/app/public/style/global.css b/app/public/style/global.css
index 17a37b5cdcffb965f22056cefa5ed1ad6f567590..9967c6f991b9db53131bf054b6e490b2d9be4d58 100644
--- a/app/public/style/global.css
+++ b/app/public/style/global.css
@@ -5,6 +5,9 @@ body {
   background-color: #f2f2f2;
   min-height: 100vh;
   position: relative;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
 }
 
 a {
@@ -173,13 +176,14 @@ h2 {
 .anime-card {
   width: 200px;
   position: relative;
-  aspect-ratio: 3/4;
+  aspect-ratio: 2/3;
   display: flex;
   justify-content: center;
   align-items: center;
   overflow: hidden;
   transition: ease-in-out;
   transition-duration: 0.15s;
+  background-color: #dedede;
 }
 
 .anime-card:hover {
@@ -191,7 +195,6 @@ h2 {
 
 .anime-card img {
   width: 100%;
-  max-width: 200px;
   object-fit: cover;
   object-position: center;
 }
@@ -282,6 +285,7 @@ h2 {
   overflow: hidden;
   width: 80%;
 }
+
 .anime-review-list {
   list-style: none;
   padding: 0;
@@ -342,7 +346,6 @@ footer {
   color: #fff;
   padding: 20px 50px; /* Added horizontal padding for spacing */
   text-align: center; /* Centered text content */
-  height: 100px;
 }
 
 .footer-nav {
diff --git a/app/public/style/trailer.css b/app/public/style/trailer.css
index 5ba8452c7d33e4cc171ba90645b590231ab5481c..81248161f786bb568df1fe738c3a834e884b7fb1 100644
--- a/app/public/style/trailer.css
+++ b/app/public/style/trailer.css
@@ -28,7 +28,6 @@
 
 .image-preview{ 
   width: 100%;
-  max-width: 320px;
   object-fit: contain;
   object-position: center;
   transition: ease-in-out;
@@ -68,15 +67,28 @@
   transition-duration: 0.2s;
 }
 
+.trailer-box{
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%,-50%);
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  gap: 10px;
+}
+
+.trailer-title {
+  font-size: 24px;
+  font-weight: bold;
+  color:white;
+}
 
 .anime-trailer-iframe {
   padding: 0;
   margin: 0;
   width: 720px;
   aspect-ratio: 16/9;
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%,-50%);
 }
 
diff --git a/app/setup/seed.php b/app/setup/seed.php
index 2e5417f85e6381ae9c2bfd138cbd4681dc52052b..47d1075538ad5d215b5957f58d7a1f85c4a8d47d 100644
--- a/app/setup/seed.php
+++ b/app/setup/seed.php
@@ -7,7 +7,6 @@ require_once(BASE_DIR.'/models/Genre.php');
 require_once(BASE_DIR.'/models/Anime.php');
 require_once(BASE_DIR.'/models/Anime_List.php');
 require_once(BASE_DIR.'/models/Anime_Genre.php');
-require_once(BASE_DIR.'/models/Relationship.php');
 
 $lorem_ipsum = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sit amet tincidunt risus, nec dictum lectus. Cras vitae tempus elit. Maecenas nec lobortis lectus. Ut mollis neque sit amet nunc aliquet, a fermentum libero sodales. Praesent non magna suscipit dolor sagittis posuere. Proin tortor lorem, viverra tempor dignissim vel, euismod vel magna. Maecenas fermentum ultricies imperdiet. Donec sodales lacus id magna ultricies rhoncus.';
 
@@ -218,28 +217,6 @@ function seedAnimeGenreData(){
   }
 }
 
-function seedRelationshipData(){
-  $relationship = new Relationship();
-  $typeArr = array('FRIEND', 'PENDING', 'BLOCKED');
-  for ($i = 0; $i < 10; $i++){
-    $id1 = rand(1,10);
-    $id2 = rand(1,10);
-    $type = $typeArr[rand(0,2)];
-    while ($relationship->getMutualRelationship($id1, $id2)){
-      $id1 = rand(1,10);
-      $id2 = rand(1,10);
-      $type = $typeArr[rand(0,2)];
-    }
-
-    $relationshipTuple = array (
-      'client_id_1' => $id1,
-      'client_id_2' => $id2,
-      'type' => $type
-    );
-    $relationship->insertRelationship($relationshipTuple);
-  }
-}
-
 function seedAllData(){
   seedClientData(); 
   seedStudioData();
@@ -247,7 +224,6 @@ function seedAllData(){
   seedAnimeData();
   seedAnimeListData();
   seedAnimeGenreData();
-  seedRelationshipData();
   echo 'Seeding success';
 }
 
diff --git a/app/views/Client/detail.php b/app/views/Client/detail.php
index 6fb4bab00edc806d0050f416c83d60179ebc99d7..1f5e9dc9ef4cb664c47257897c439f94a61ca513 100644
--- a/app/views/Client/detail.php
+++ b/app/views/Client/detail.php
@@ -3,8 +3,10 @@
 require_once(dirname(__DIR__,2).'/define.php');
 require_once(BASE_DIR.'/views/includes/header.php');
 require_once(BASE_DIR.'/models/Client.php');
+require_once(BASE_DIR.'/models/Anime_List.php');
 
 $c = new Client();
+$al = new Anime_List();
 $id = $data['id'];
 $client = $c->getClientByID($id);
 ?>
@@ -22,12 +24,49 @@ $client = $c->getClientByID($id);
 </head>
 
 <body>
-  <div class='client-container'>
-    <div class='image-box'>
-    </div>
-    <div class=''>
+  <div class='client-big-container'>
+    <div class='client-left-container'>
+      <div class='client-main-container'>
+        <div class='client-image-box'>
+          <?php
+            $image = $client['image'] ?? '/public/img/placeholder.jpg';
+            echo "
+              <img class='client-image' src='$image' alt='Client Image'/>
+            ";
+          ?>
+        </div>
+        <div class='client-description'>
+          <?php
+            echo"
+              <div class='client-username'> $client[username] </div>
+              <div class='client-email'> $client[email]</div>
+              <div class='client-id'> Client ID: $client[client_id] </div>
+            ";
+          ?>
+        </div>
+      </div>
+
+      <div class='client-info-container'>
+        <?php
+        $clientType = $client['admin_status'] ? "Admin" : "User";
+        $clientTypeColor = $client['admin_status'] ? "red" : "blue";
+        $birthdate = $client['birthdate'] ?? "No information";
+        $bio = $client['bio'] ?? "No information";
+        $avgScore = $al->getAverageUserScoreByClientID($id)['avg']? $al->getAverageUserScoreByClientID($id)['avg'].' / 10 ★' : "Have not been scoring";
+        echo "
+          <div class='client-info-aspect'> Admin Status </div>
+          <div style=\"color:$clientTypeColor; font-weight:bold\"> $clientType </div>
+          <div class='client-info-aspect'> Birthdate </div>
+          <div> $birthdate </div>
+          <div class='client-info-aspect'> Anime List Amount </div>
+          <div> 9 </div>
+          <div class='client-info-aspect'> Average Anime Scoring </div>
+          <div> $avgScore</div>
+        ";
+        ?>
+      </div>
     </div>
-  </div>
+  </div>  
 </body>
 </html>
 
diff --git a/app/views/anime/detail.php b/app/views/anime/detail.php
index 5eb0889cfff0c60786b1143ae792fba6847c5fb3..0161c0e69c4baa5803cf44de9185ebba2599673a 100644
--- a/app/views/anime/detail.php
+++ b/app/views/anime/detail.php
@@ -6,16 +6,20 @@ require_once(BASE_DIR.'/models/Anime.php');
 require_once(BASE_DIR.'/models/Studio.php');
 require_once(BASE_DIR.'/models/Client.php');
 require_once(BASE_DIR.'/models/Anime_List.php');
+require_once(BASE_DIR.'/models/Genre.php');
 
 $a = new Anime();
 $s = new Studio();
 $c = new Client();
 $al = new Anime_List();
+$g = new Genre();
+
 
 $id = $data['id'];
 $anime = $a->getAnimeById($id);
 $studio = $s->getStudioByAnimeID($id);
-$reviews = $a-> getReviewsByAnimeID($id);
+$reviews = $a->getReviewsByAnimeID($id);
+$genres = $g->getAllGenreIDByAnimeID($id);
 
 $client_id = $c->getClientByUsername($_SESSION['username'])['client_id'];
 
@@ -56,13 +60,31 @@ $client_id = $c->getClientByUsername($_SESSION['username'])['client_id'];
               <?php
                 $date = $anime['release_date'] ?? "No information";
                 $episodes = $anime['episodes'] ?? "No information";
-                echo " <div>Score: <span> $anime[score] </span></div> ";
-                echo " <div>Type: <span> $anime[type] </span></div> ";
-                echo " <div>Status: <span> $anime[status] </span></div> ";
-                echo " <div>Genres: <span> Action, Drama, Thriller </span></div> ";
-                echo " <div>Studios: <span> $studio[name] </span></div> ";
-                echo " <div>Release Date: <span> $date </span></div> ";
-                echo " <div>Episodes: <span> $episodes </span></div> ";
+                if ($genres) {
+                  $genreData = $genres[0]['name'];
+                  for ($i = 1; $i < count($genres); $i++){
+                    $genreData = $genreData.', '.$genres[$i]['name'];
+                  }
+                } else {
+                  $genreData = "No information";
+                }
+                echo "
+                  <div class='grid-container'>
+                    <div class='anime-details-aspect'> Score </div>
+                    <div> $anime[score] ★ </div>
+                    <div class='anime-details-aspect'> Type </div>
+                    <div> $anime[type] </div>
+                    <div class='anime-details-aspect'> Genre </div>
+                    <div> $genreData </div>
+                    <div class='anime-details-aspect'> Studio </div>
+                    <div> $studio[name] </div>
+                    <div class='anime-details-aspect'> Release Date </div>
+                    <div> $date </div>
+                    <div class='anime-details-aspect'> Episodes </div>
+                    <div> $episodes </div>
+                  </div>
+                
+                ";
               ?>
 
               <center>
diff --git a/app/views/home/index.php b/app/views/home/index.php
index 5a7096ce9a917da8d8504da6399e4d9b3f84e7f2..818f6489e58facb517bfd56be161219de7fe394c 100644
--- a/app/views/home/index.php
+++ b/app/views/home/index.php
@@ -95,7 +95,7 @@ require_once(dirname(__DIR__,2).'/define.php');
                         echo "<a href='/?client/detail/$review[client_id]'>";
                         echo "<span class='username'>" . htmlspecialchars($review['username']) . "</span>";
                         echo "</a>";
-                        echo "<div class='rating'>Score: " . htmlspecialchars($review['user_score']) . "/10★</div>";
+                        echo "<div class='rating'>Score: " . htmlspecialchars($review['user_score']) . "/10 ★</div>";
                         echo "</div>";
                         echo "<p>" . htmlspecialchars($review['review']) . "</p>";
                         echo "</div>";
diff --git a/app/views/trailer/index.php b/app/views/trailer/index.php
index 9057ac06983dc0f4144b93ab945835c3ee209d50..f103d276e51c253e78d8486357d280e532966ffc 100644
--- a/app/views/trailer/index.php
+++ b/app/views/trailer/index.php
@@ -21,7 +21,10 @@ $a = new Anime();
 
 <body>
   <div class="trailer-container" id='trailer-div' onclick='hideTrailer()'>
-  <iframe class='anime-trailer-iframe' id='anime-trailer-iframe' src='' autoplay='false' allowfullscreen></iframe>
+    <div class='trailer-box'> 
+      <div class='trailer-title' id='trailer-title'> HEHEHE </div> 
+      <iframe class='anime-trailer-iframe' id='anime-trailer-iframe' src='' autoplay='false' allowfullscreen></iframe>
+    </div>
   </div>
 
   <div class="flex-wrap">
@@ -34,7 +37,7 @@ $a = new Anime();
         $trailer = htmlspecialchars($anime['trailer']);
         echo "
         <div class='container'>
-          <div class='box-preview' onclick=\"displayTrailer('$trailer')\">
+          <div class='box-preview' onclick=\"displayTrailer('$trailer', '$anime[title]')\">
             <img src='$image' class='image-preview' id='image-preview'/>
           </div>
           <div class='description'>