diff --git a/fonts/Purisa-Bold.ttf b/fonts/Purisa-Bold.ttf
new file mode 100644
index 0000000..c859c42
Binary files /dev/null and b/fonts/Purisa-Bold.ttf differ
diff --git a/fonts/Purisa-Bold.woff b/fonts/Purisa-Bold.woff
new file mode 100644
index 0000000..48571e6
Binary files /dev/null and b/fonts/Purisa-Bold.woff differ
diff --git a/fonts/Purisa-Bold.woff2 b/fonts/Purisa-Bold.woff2
new file mode 100644
index 0000000..48571e6
Binary files /dev/null and b/fonts/Purisa-Bold.woff2 differ
diff --git a/fonts/Purisa-BoldOblique.ttf b/fonts/Purisa-BoldOblique.ttf
new file mode 100644
index 0000000..6a0a65f
Binary files /dev/null and b/fonts/Purisa-BoldOblique.ttf differ
diff --git a/fonts/Purisa-BoldOblique.woff b/fonts/Purisa-BoldOblique.woff
new file mode 100644
index 0000000..d1b859c
Binary files /dev/null and b/fonts/Purisa-BoldOblique.woff differ
diff --git a/fonts/Purisa-BoldOblique.woff2 b/fonts/Purisa-BoldOblique.woff2
new file mode 100644
index 0000000..d1b859c
Binary files /dev/null and b/fonts/Purisa-BoldOblique.woff2 differ
diff --git a/fonts/Purisa-Oblique.ttf b/fonts/Purisa-Oblique.ttf
new file mode 100644
index 0000000..a0c2b19
Binary files /dev/null and b/fonts/Purisa-Oblique.ttf differ
diff --git a/fonts/Purisa-Oblique.woff b/fonts/Purisa-Oblique.woff
new file mode 100644
index 0000000..5373f15
Binary files /dev/null and b/fonts/Purisa-Oblique.woff differ
diff --git a/fonts/Purisa-Oblique.woff2 b/fonts/Purisa-Oblique.woff2
new file mode 100644
index 0000000..5373f15
Binary files /dev/null and b/fonts/Purisa-Oblique.woff2 differ
diff --git a/fonts/Purisa.ttf b/fonts/Purisa.ttf
new file mode 100644
index 0000000..8523dfa
Binary files /dev/null and b/fonts/Purisa.ttf differ
diff --git a/fonts/Purisa.woff b/fonts/Purisa.woff
new file mode 100644
index 0000000..743fa94
Binary files /dev/null and b/fonts/Purisa.woff differ
diff --git a/fonts/Purisa.woff2 b/fonts/Purisa.woff2
new file mode 100644
index 0000000..743fa94
Binary files /dev/null and b/fonts/Purisa.woff2 differ
diff --git a/index.html b/index.html
index c5e4b02..e6c2d8d 100644
--- a/index.html
+++ b/index.html
@@ -4,7 +4,8 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Odin Project: Rock Paper Scissors</title>
-    <link rel="stylesheet" href="style.css">
+    <link rel="stylesheet" href="./styles/style.css">
+    <link rel="stylesheet" href="./styles/fonts.css">
 </head>
 <body>
     <header><h1>Rock Paper Scissors</h1></header>
diff --git a/styles/fonts.css b/styles/fonts.css
new file mode 100644
index 0000000..533a351
--- /dev/null
+++ b/styles/fonts.css
@@ -0,0 +1,36 @@
+@font-face {
+    font-family: "Purisa-Bold";
+    src: url("../fonts/Purisa-Bold.ttf") format("truetype"),
+         url("../fonts/Purisa-Bold.woff") format("woff"),
+         url("../fonts/Purisa-Bold.woff2") format("woff2");
+    font-weight: 700;
+    font-style: normal;
+  }
+  
+@font-face {
+    font-family: "Purisa-BoldOblique";
+    src: url("../fonts/Purisa-BoldOblique.ttf") format("truetype"),
+         url("../fonts/Purisa-BoldOblique.woff") format("woff"),
+         url("../fonts/Purisa-BoldOblique.woff2") format("woff2");
+    font-weight: 700;
+    font-style: oblique;
+}
+  
+@font-face {
+    font-family: "Purisa-Oblique";
+    src: url("../fonts/Purisa-Oblique.ttf") format("truetype"),
+         url("../fonts/Purisa-Oblique.woff") format("woff"),
+         url("../fonts/Purisa-Oblique.woff2") format("woff2");
+    font-weight: 400;
+    font-style: oblique;
+}
+  
+@font-face {
+    font-family: "Purisa";
+    src: url("../fonts/Purisa.ttf") format("truetype"),
+         url("../fonts/Purisa.woff") format("woff"),
+         url("../fonts/Purisa.woff2") format("woff2");
+    font-weight: 400;
+    font-style: normal;
+}
+  
\ No newline at end of file
diff --git a/style.css b/styles/style.css
similarity index 82%
rename from style.css
rename to styles/style.css
index 599750e..22a4c7a 100644
--- a/style.css
+++ b/styles/style.css
@@ -1,5 +1,5 @@
 body {
-    background-image: url("./images/paper-5985445_1920.jpg");
+    background-image: url("../images/paper-5985445_1920.jpg");
     background-size: cover;
     background-color: rgb(221, 125, 104);
     color: #eee;
@@ -45,21 +45,21 @@ main {
 }
 
 #rock {
-    background-image: url("./images/rocks-576653_640.png");
+    background-image: url("../images/rocks-576653_640.png");
     background-size: cover;
     background-repeat: no-repeat;
     background-position: center;
 }
 
 #paper {
-    background-image: url("./images/certificate-154169_640.png");
+    background-image: url("../images/certificate-154169_640.png");
     background-size: contain;
     background-repeat: no-repeat;
     background-position-x: center;
 }
 
 #scissors {
-    background-image: url("./images/school-1555907_640.png");
+    background-image: url("../images/school-1555907_640.png");
     background-size: contain;
     background-repeat: no-repeat;
     background-position-x: center;