diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000..4efd68e
Binary files /dev/null and b/.DS_Store differ
diff --git a/components/Divider.jsx b/components/Divider.jsx
new file mode 100644
index 0000000..0d2df2d
--- /dev/null
+++ b/components/Divider.jsx
@@ -0,0 +1,25 @@
+import styled from "styled-components";
+
+const list = ["/images/lightsaberblue.webp", "/images/lightsaberred.webp"];
+
+const StyledDiv = styled.div`
+  width: 100%;
+
+  img {
+    width: 50%;
+    height: auto;
+  }
+`;
+
+const Divider = () => {
+  return (
+    <StyledDiv>
+      <img
+        src={list[Math.floor(list.length * Math.random())]}
+        alt="Star Wars Divider"
+      />
+    </StyledDiv>
+  );
+};
+
+export default Divider;
diff --git a/components/Gallery.css b/components/Gallery.css
deleted file mode 100644
index 887905b..0000000
--- a/components/Gallery.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.gallery {
-  display: flex;
-}
diff --git a/pages/about.mdx b/pages/about.mdx
index bb6f16f..6e364a5 100644
--- a/pages/about.mdx
+++ b/pages/about.mdx
@@ -1,5 +1,9 @@
+import Divider from "../components/Divider.jsx";
+
 # About
 
+<Divider />
+
 ## What is this?
 
 The Star Wars Databank API is a REST API based on the galatic saga Star Wars. You will have access to hundreds of characters, droids, species, locations, organizations, vehicles and more. The Star Wars Databank API is filled with the official information from the Databank.
diff --git a/pages/character.mdx b/pages/character.mdx
index 25b363d..cf62c20 100644
--- a/pages/character.mdx
+++ b/pages/character.mdx
@@ -1,3 +1,7 @@
+import Divider from "../components/Divider.jsx";
+
 # Character
 
+<Divider />
+
 There is a total of 952 characters sorted by name.
diff --git a/pages/character/getall.mdx b/pages/character/getall.mdx
index b1bf62b..e0bed1c 100644
--- a/pages/character/getall.mdx
+++ b/pages/character/getall.mdx
@@ -1,5 +1,9 @@
+import Divider from "../../components/Divider.jsx";
+
 # Get all characters
 
+<Divider />
+
 You can access the list of characters by using the /characters endpoint.
 
 ```text /GET/
diff --git a/pages/character/schema.mdx b/pages/character/schema.mdx
index 2ffaa4a..5a25a87 100644
--- a/pages/character/schema.mdx
+++ b/pages/character/schema.mdx
@@ -1,5 +1,9 @@
+import Divider from "../../components/Divider.jsx";
+
 # Character Schema
 
+<Divider />
+
 | Key         |  Type  |                      Description |
 | :---------- | :----: | -------------------------------: |
 | \_id        | string |   The unique id of the character |
diff --git a/pages/character/single.mdx b/pages/character/single.mdx
index d149274..aa50354 100644
--- a/pages/character/single.mdx
+++ b/pages/character/single.mdx
@@ -1,5 +1,8 @@
+import Divider from "../../components/Divider.jsx";
+
 # Get a single character
 
+<Divider />
 ## Get by a id
 
 You can get a single character by adding the id as a parameter: /characters/id
diff --git a/pages/creature.mdx b/pages/creature.mdx
index 900066f..846d57c 100644
--- a/pages/creature.mdx
+++ b/pages/creature.mdx
@@ -1,3 +1,7 @@
-# Creatures
+import Divider from "../components/Divider.jsx";
+
+# Creature
+
+<Divider />
 
 There is a total of 75 creatures sorted by name.
diff --git a/pages/creature/getall.mdx b/pages/creature/getall.mdx
index 148f05b..bd030cb 100644
--- a/pages/creature/getall.mdx
+++ b/pages/creature/getall.mdx
@@ -1,5 +1,8 @@
+import Divider from "../../components/Divider.jsx";
+
 # Get all creatures
 
+<Divider />
 You can access the list of creatures by using the /creatures endpoint.
 
 ```text /GET/
diff --git a/pages/creature/schema.mdx b/pages/creature/schema.mdx
index 3d93898..44d2ff8 100644
--- a/pages/creature/schema.mdx
+++ b/pages/creature/schema.mdx
@@ -1,5 +1,9 @@
+import Divider from "../../components/Divider.jsx";
+
 # Creature Schema
 
+<Divider />
+
 | Key         |  Type  |                     Description |
 | :---------- | :----: | ------------------------------: |
 | \_id        | string |   The unique id of the creature |
diff --git a/pages/creature/single.mdx b/pages/creature/single.mdx
index b76c4b7..50cc3aa 100644
--- a/pages/creature/single.mdx
+++ b/pages/creature/single.mdx
@@ -1,5 +1,8 @@
+import Divider from "../../components/Divider.jsx";
+
 # Get a single creature
 
+<Divider />
 ## Get by a id
 
 You can get a single creature by adding the id as a parameter: /creatures/id
diff --git a/pages/droid.mdx b/pages/droid.mdx
index 1df1333..b760e7f 100644
--- a/pages/droid.mdx
+++ b/pages/droid.mdx
@@ -1,3 +1,7 @@
+import Divider from "../components/Divider.jsx";
+
 # Droid
 
+<Divider />
+
 There is a total of 60 droids sorted by name.
diff --git a/pages/droid/getall.mdx b/pages/droid/getall.mdx
index 4f16e12..ba2b8cc 100644
--- a/pages/droid/getall.mdx
+++ b/pages/droid/getall.mdx
@@ -1,5 +1,9 @@
+import Divider from "../../components/Divider.jsx";
+
 # Get all droids
 
+<Divider />
+
 You can access the list of droids by using the /droids endpoint.
 
 ```text /GET/
diff --git a/pages/droid/schema.mdx b/pages/droid/schema.mdx
index d15c445..99a1d11 100644
--- a/pages/droid/schema.mdx
+++ b/pages/droid/schema.mdx
@@ -1,5 +1,9 @@
+import Divider from "../../components/Divider.jsx";
+
 # Droid Schema
 
+<Divider />
+
 | Key         |  Type  |                  Description |
 | :---------- | :----: | ---------------------------: |
 | \_id        | string |   The unique id of the droid |
diff --git a/pages/droid/single.mdx b/pages/droid/single.mdx
index 05425aa..920ef98 100644
--- a/pages/droid/single.mdx
+++ b/pages/droid/single.mdx
@@ -1,5 +1,8 @@
+import Divider from "../../components/Divider.jsx";
+
 # Get a single droid
 
+<Divider />
 ## Get by a id
 
 You can get a single droid by adding the id as a parameter: /droids/id
diff --git a/pages/index.mdx b/pages/index.mdx
index f6812e8..f1ea86e 100644
--- a/pages/index.mdx
+++ b/pages/index.mdx
@@ -1,19 +1,15 @@
 import Gallery from "../components/Gallery.jsx";
+import Divider from "../components/Divider.jsx";
 
 # Introduction
 
+<Divider />
 ![Star Wars Celebration Banner](/images/banner.jpg "Star Wars Celebration Banner")
 
 This documentation will help you get familiar with the resources of the Star Wars Databank API and show you how to make different queries.
 
 ## Demo
 
-```
-fetch(
-  "https://starwars-databank-server.vercel.app/api/v1/characters?page=39&limit=6"
-);
-```
-
 <Gallery />
 
 ## Main endpoint
@@ -22,7 +18,7 @@ fetch(
 
 ## Data
 
-| Type          | Quantity |                                                    Main Endpoint |
+| Type          | Quantity |                                                         Endpoint |
 | :------------ | :------: | ---------------------------------------------------------------: |
 | Characters    |   952    |    https://starwars-databank-server.vercel.app/api/v1/characters |
 | Creatures     |    75    |    https://starwars-databank-server.vercel.app/api/v1/creatures/ |
diff --git a/pages/info.mdx b/pages/info.mdx
index 361ea97..350f685 100644
--- a/pages/info.mdx
+++ b/pages/info.mdx
@@ -1,5 +1,9 @@
+import Divider from "../components/Divider.jsx";
+
 # Info and Pagination
 
+<Divider />
+
 ## Information
 
 The API will automatically paginate the responses. You will receive up to 10 documents per page.
diff --git a/pages/location.mdx b/pages/location.mdx
index b2a2ad0..5247b1c 100644
--- a/pages/location.mdx
+++ b/pages/location.mdx
@@ -1,3 +1,6 @@
+import Divider from "../components/Divider.jsx";
+
 # Location
 
+<Divider />
 There is a total of 312 locations sorted by name.
diff --git a/pages/location/getall.mdx b/pages/location/getall.mdx
index 34a751b..0c8c389 100644
--- a/pages/location/getall.mdx
+++ b/pages/location/getall.mdx
@@ -1,5 +1,8 @@
+import Divider from "../../components/Divider.jsx";
+
 # Get all locations
 
+<Divider />
 You can access the list of locations by using the /locations endpoint.
 
 ```text /GET/
diff --git a/pages/location/schema.mdx b/pages/location/schema.mdx
index f36e4f1..4eca3d3 100644
--- a/pages/location/schema.mdx
+++ b/pages/location/schema.mdx
@@ -1,5 +1,9 @@
+import Divider from "../../components/Divider.jsx";
+
 # Location Schema
 
+<Divider />
+
 | Key         |  Type  |                     Description |
 | :---------- | :----: | ------------------------------: |
 | \_id        | string |   The unique id of the location |
diff --git a/pages/location/single.mdx b/pages/location/single.mdx
index 8ba59af..939671d 100644
--- a/pages/location/single.mdx
+++ b/pages/location/single.mdx
@@ -1,5 +1,8 @@
+import Divider from "../../components/Divider.jsx";
+
 # Get a single location
 
+<Divider />
 ## Get by a id
 
 You can get a single location by adding the id as a parameter: /locations/id
diff --git a/pages/organization.mdx b/pages/organization.mdx
index 5aa7298..de65a3b 100644
--- a/pages/organization.mdx
+++ b/pages/organization.mdx
@@ -1,3 +1,6 @@
+import Divider from "../components/Divider.jsx";
+
 # Organization
 
+<Divider />
 There is a total of 135 organizations sorted by name.
diff --git a/pages/organization/getall.mdx b/pages/organization/getall.mdx
index 0f390cc..823d5b1 100644
--- a/pages/organization/getall.mdx
+++ b/pages/organization/getall.mdx
@@ -1,5 +1,8 @@
+import Divider from "../../components/Divider.jsx";
+
 # Get all organizations
 
+<Divider />
 You can access the list of organizations by using the /organizations endpoint.
 
 ```text /GET/
diff --git a/pages/organization/schema.mdx b/pages/organization/schema.mdx
index 675e536..1a66089 100644
--- a/pages/organization/schema.mdx
+++ b/pages/organization/schema.mdx
@@ -1,5 +1,9 @@
+import Divider from "../../components/Divider.jsx";
+
 # Organization Schema
 
+<Divider />
+
 | Key         |  Type  |                         Description |
 | :---------- | :----: | ----------------------------------: |
 | \_id        | string |   The unique id of the organization |
diff --git a/pages/organization/single.mdx b/pages/organization/single.mdx
index 047aa2b..75d3d07 100644
--- a/pages/organization/single.mdx
+++ b/pages/organization/single.mdx
@@ -1,5 +1,8 @@
+import Divider from "../../components/Divider.jsx";
+
 # Get a single organization
 
+<Divider />
 ## Get by a id
 
 You can get a single organization by adding the id as a parameter: /organizations/id
diff --git a/pages/specie.mdx b/pages/specie.mdx
index 2e56bdf..ed068ca 100644
--- a/pages/specie.mdx
+++ b/pages/specie.mdx
@@ -1,3 +1,6 @@
+import Divider from "../components/Divider.jsx";
+
 # Specie
 
+<Divider />
 There is a total of 82 species sorted by name.
diff --git a/pages/specie/getall.mdx b/pages/specie/getall.mdx
index cdcc689..d2d71f4 100644
--- a/pages/specie/getall.mdx
+++ b/pages/specie/getall.mdx
@@ -1,5 +1,8 @@
+import Divider from "../../components/Divider.jsx";
+
 # Get all species
 
+<Divider />
 You can access the list of species by using the /species endpoint.
 
 ```text /GET/
diff --git a/pages/specie/schema.mdx b/pages/specie/schema.mdx
index 32d03ff..72aa176 100644
--- a/pages/specie/schema.mdx
+++ b/pages/specie/schema.mdx
@@ -1,5 +1,9 @@
+import Divider from "../../components/Divider.jsx";
+
 # Specie Schema
 
+<Divider />
+
 | Key         |  Type  |                   Description |
 | :---------- | :----: | ----------------------------: |
 | \_id        | string |   The unique id of the specie |
diff --git a/pages/specie/single.mdx b/pages/specie/single.mdx
index bafec5b..896683c 100644
--- a/pages/specie/single.mdx
+++ b/pages/specie/single.mdx
@@ -1,5 +1,8 @@
+import Divider from "../../components/Divider.jsx";
+
 # Get a single specie
 
+<Divider />
 ## Get by a id
 
 You can get a single specie by adding the id as a parameter: /species/id
diff --git a/pages/vehicle.mdx b/pages/vehicle.mdx
index 06401e2..e12b321 100644
--- a/pages/vehicle.mdx
+++ b/pages/vehicle.mdx
@@ -1,3 +1,6 @@
+import Divider from "../components/Divider.jsx";
+
 # Vehicle
 
+<Divider />
 There is a total of 266 vehicles sorted by name.
diff --git a/pages/vehicle/getall.mdx b/pages/vehicle/getall.mdx
index a197cc0..8046024 100644
--- a/pages/vehicle/getall.mdx
+++ b/pages/vehicle/getall.mdx
@@ -1,5 +1,8 @@
+import Divider from "../../components/Divider.jsx";
+
 # Get all vehicles
 
+<Divider />
 You can access the list of vehicles by using the /vehicles endpoint.
 
 ```text /GET/
diff --git a/pages/vehicle/schema.mdx b/pages/vehicle/schema.mdx
index e3404a0..16d13c7 100644
--- a/pages/vehicle/schema.mdx
+++ b/pages/vehicle/schema.mdx
@@ -1,5 +1,9 @@
+import Divider from "../../components/Divider.jsx";
+
 # Vehicle Schema
 
+<Divider />
+
 | Key         |  Type  |                    Description |
 | :---------- | :----: | -----------------------------: |
 | \_id        | string |   The unique id of the vehicle |
diff --git a/pages/vehicle/single.mdx b/pages/vehicle/single.mdx
index a6f6fc3..03fddc5 100644
--- a/pages/vehicle/single.mdx
+++ b/pages/vehicle/single.mdx
@@ -1,5 +1,8 @@
+import Divider from "../../components/Divider.jsx";
+
 # Get a single vehicle
 
+<Divider />
 ## Get by a id
 
 You can get a single vehicle by adding the id as a parameter: /vehicles/id
diff --git a/public/.DS_Store b/public/.DS_Store
new file mode 100644
index 0000000..c168a71
Binary files /dev/null and b/public/.DS_Store differ
diff --git a/public/images/divider.png b/public/images/divider.png
new file mode 100644
index 0000000..e1e37e7
Binary files /dev/null and b/public/images/divider.png differ
diff --git a/public/images/dividerEmpire.png b/public/images/dividerEmpire.png
new file mode 100644
index 0000000..296ddd2
Binary files /dev/null and b/public/images/dividerEmpire.png differ
diff --git a/public/images/lightsaberblue.webp b/public/images/lightsaberblue.webp
new file mode 100644
index 0000000..baa8542
Binary files /dev/null and b/public/images/lightsaberblue.webp differ
diff --git a/public/images/lightsaberred.webp b/public/images/lightsaberred.webp
new file mode 100644
index 0000000..170df6b
Binary files /dev/null and b/public/images/lightsaberred.webp differ