diff --git a/components/header.js b/components/header.js
index 1adbf87..57e631f 100644
--- a/components/header.js
+++ b/components/header.js
@@ -14,6 +14,7 @@ const Header = () => (
                 <a href="/" className={styles.title}><img src="/sign.png"></img> <h2>Trick The Fox</h2></a>
 
                 <div className={styles.items}>
+                    {/* <a href="/">Home</a> */}
                     <a href="/commissions">Commissions</a>
                     <a href="/gallery">Gallery</a>
                     <a href="/contact">Contact</a>
diff --git a/pages/commissions.js b/pages/commissions.js
index 01f0e85..4adfd26 100644
--- a/pages/commissions.js
+++ b/pages/commissions.js
@@ -2,6 +2,8 @@ import Head from 'next/head'
 import styles from '../styles/Commissions.module.css'
 import Header from '../components/header';
 import Footer from '../components/footer';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+import { faPoundSign } from '@fortawesome/free-solid-svg-icons'
 
 export default function Commissions() {
   return (
@@ -16,68 +18,87 @@ export default function Commissions() {
             <article className="content">
 
                 <div className="card">
-                    <h1>Commissions</h1>
+                    <h1 className="h-unset">Commission sheet</h1>
+                    <h4 className="h-unset"><a href="/contact">Contact me</a> for more information.</h4>
+
+                    <hr />
 
                     <section className={styles.row}>
                         <div>
                             <h2>Headshot Icon</h2>
-                            <p>15+ pounds</p>
+                            <p><FontAwesomeIcon icon={faPoundSign} size="1x" /> 15+</p>
                         </div>
 
-                        <div>
-                            <img src="/vulpirius_foxx_headshot.png"></img>
-                            <img src="/trickdounut.png"></img>
+                        <div className={styles.gapped}>
+                            <div>
+                                <img src="/vulpirius_foxx_headshot.png"></img>
+                            </div>
+                            <div>
+                                <img src="/trickdounut.png"></img>
+                            </div>
                         </div>
                     </section>
 
+                    <hr />
+
                     <section className={styles.row}>
                         <div>
                             <h2>Full body artworks</h2>
-                            <p>25+ pounds for one peep</p>
+                            <p><FontAwesomeIcon icon={faPoundSign} size="1x" /> 25+ for one peep</p>
                         </div>
 
-                        <div>
-                            <img src="/vulpirius_foxx_headshot.png"></img>
-                            <img src="/trickdounut.png"></img>
+                        <div className={styles.gapped}>
+                            <div>
+                                <img src="/!wow.png"></img>
+                            </div>
                         </div>
                     </section>
 
+                    <hr />
+
                     <section className={styles.row}>
                         <div>
                             <h2>Ref sheets</h2>
-                            <p>15+ pounds extras</p>
+                            <p><FontAwesomeIcon icon={faPoundSign} size="1x" /> 15+ extras</p>
                         </div>
 
-                        <div>
-                            <img src="/vulpirius_foxx_headshot.png"></img>
-                            <img src="/trickdounut.png"></img>
+                        <div className={styles.gapped}>
+                            <div>
+                                <img src="/trick_ref_3.png"></img>
+                            </div>
                         </div>
                     </section>
 
+                    <hr />
+
                     <section className={styles.row}>
                         <div>
                             <h2>NSFW Commissions</h2>
-                            <p>30+ pounds per a character</p>
+                            <p><FontAwesomeIcon icon={faPoundSign} size="1x" /> 30+ per peep</p>
                         </div>
 
-                        <div>
-                            <img src="/vulpirius_foxx_headshot.png"></img>
-                            <img src="/trickdounut.png"></img>
+                        <div className={styles.gapped}>
+                            <div>
+                                <img src="/owwwo.png"></img>
+                            </div>
                         </div>
                     </section>
 
+                    <hr />
+
                     <section className={styles.row}>
                         <div>
                             <h2>Large Group Artworks</h2>
                             <p>
-                                100+ pounds for 8 peeps <br />
-                                15+ pounds per an extra peep
+                                <FontAwesomeIcon icon={faPoundSign} size="1x" /> 100+ for 8 peeps <br />
+                                <FontAwesomeIcon icon={faPoundSign} size="1x" /> 15+ per extra peep
                             </p>
                         </div>
 
-                        <div>
-                            <img src="/vulpirius_foxx_headshot.png"></img>
-                            <img src="/trickdounut.png"></img>
+                        <div className={styles.gapped}>
+                            <div>
+                                <img src="/puppsden.png"></img>
+                            </div>
                         </div>
                     </section>
                 </div>
diff --git a/pages/contact.js b/pages/contact.js
index a7533b6..9ebdd43 100644
--- a/pages/contact.js
+++ b/pages/contact.js
@@ -17,7 +17,7 @@ export default function Contact() {
             <article className="content">
 
                 <section className="card">
-                    <h1>Contact</h1>
+                    <h1 className="h-unset">Contact</h1>
                 </section>
 
                 <Socials />
diff --git a/pages/gallery.js b/pages/gallery.js
index 14341b5..34ae065 100644
--- a/pages/gallery.js
+++ b/pages/gallery.js
@@ -16,7 +16,7 @@ export default function Gallery() {
             <article className="content">
 
                 <section className="card">
-                    <h1>Gallery</h1>
+                    <h1 className="h-unset">Gallery</h1>
                 </section>
 
             </article>
diff --git a/pages/old.js b/pages/old.js
deleted file mode 100644
index 60fa2d9..0000000
--- a/pages/old.js
+++ /dev/null
@@ -1,71 +0,0 @@
-import Head from 'next/head'
-import styles from '../styles/Index.module.css'
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { faSearch } from "@fortawesome/free-solid-svg-icons";
-
-function RandomMotto(props) {
-    const Mottos = [
-        "Yesterday is history, tomorrow is a mystery and today is a gift that's why it's called the present.",
-        "Just have fun!",
-        "Live and let go.",
-        "Keep calm and carry on."
-    ];
-    const randomNumber = Math.floor(Math.random() * Mottos.length);
-    return <p>{Mottos[randomNumber]}</p>;
-  }
-
-export default function Index() {
-  return (
-    <div className={styles.page}>
-        <Head>
-            <title>Trick's Website</title>
-            <link rel="icon" href="/trick.jpg" />
-        </Head>
-
-        <section className={styles.container}>
-            <div className={styles.main}>
-                <article className={styles.content}>
-                    <section className={styles.header}>
-                        <div className={styles.avatar_bar}>
-                            <img src="trick.jpg" className={styles.avatar}></img>
-                            <h1>Trick The Fox</h1>
-                        </div>
-                    </section>
-
-                    <h2><RandomMotto /></h2>
-
-                    <p>
-                        I'm a gay femboy nurse fox who likes figure skating, running and dancing, 
-                        addicted to vr and video making and I'm always listening to music, 
-                        oh and I play dnd... And that's just about me in a nutshell.
-                    </p>
-                </article>
-
-                <aside className={styles.content}>
-                    <div className={styles.links}>
-                        <a href="https://twitter.com/Trick_the_fox" target="_blank"><FontAwesomeIcon ico={faSearch} /> Twitter</a>
-                        <a href="https://www.twitch.tv/trick_the_fox" target="_blank">Twitch</a>
-                        <a href="https://docs.google.com/document/d/1cwacGjMxjppSblnxEp5RSCBOlPQDICWisST6R0mMVJQ/edit?usp=sharing" target="_blank">Commissions</a>
-                        <a href="https://trello.com/b/cMyTLWYd" target="_blank">Trello</a>
-                        <a href="https://ko-fi.com/trick_the_fox" target="_blank">Ko-fi</a>
-                    </div>
-                </aside>
-            </div>
-        </section>
-
-        <section className={styles.container}>
-            <section className={styles.content}>
-                <h2>Gallery</h2>
-                
-                <div className={styles.gallery}>
-                    <img src="trick_be_sitting_shadow.png"></img>
-                    <img src="Unnamed.png"></img>
-                    <img src="wow.png"></img>
-                    <img src="triiiiick.png"></img>
-                    <img src="tricky_boy.png"></img>
-                </div>
-            </section>
-        </section>
-    </div>
-  )
-}
diff --git a/public/!wow.png b/public/!wow.png
new file mode 100644
index 0000000..ca392f3
Binary files /dev/null and b/public/!wow.png differ
diff --git a/public/owwwo.png b/public/owwwo.png
new file mode 100644
index 0000000..e39f3a6
Binary files /dev/null and b/public/owwwo.png differ
diff --git a/public/puppsden.png b/public/puppsden.png
new file mode 100644
index 0000000..2bc7e78
Binary files /dev/null and b/public/puppsden.png differ
diff --git a/public/trick_ref_3.png b/public/trick_ref_3.png
new file mode 100644
index 0000000..d07b04b
Binary files /dev/null and b/public/trick_ref_3.png differ
diff --git a/styles/Commissions.module.css b/styles/Commissions.module.css
index a1f3b66..3a86b3c 100644
--- a/styles/Commissions.module.css
+++ b/styles/Commissions.module.css
@@ -6,12 +6,28 @@
 }
 
 .row img {
-    width: 200px;
+    border-radius: 10px;
+    box-shadow: var(--box-shadow);
+}
+
+.gapped {
+    width: 500px;
+    display: flex;
+    gap: 1em;
+}
+
+.price {
+    background-color: var(--theme-color);
+    padding: 0.3em 0.7em;
 }
 
 /* mobile */
-@media (max-aspect-ratio: 1/1) {
+@media (max-aspect-ratio: 5/6) {
     .row {
         flex-direction: column;
     }
+    .gapped {
+        flex-direction: column;
+        width: 100%;
+    }
 }
\ No newline at end of file
diff --git a/styles/Index.module.css b/styles/Index.module.css
index 4daa599..041eee8 100644
--- a/styles/Index.module.css
+++ b/styles/Index.module.css
@@ -13,7 +13,7 @@
 }
 
 .avatar > img {
-    box-shadow: 2px 2px 10px rgba(0,0,0,0.2);
+    box-shadow: var(--box-shadow);
     border-radius: 100%;
     max-width: 100%;
     transition-duration: 0.3s;
diff --git a/styles/Old.module.css b/styles/Old.module.css
deleted file mode 100644
index 8019df8..0000000
--- a/styles/Old.module.css
+++ /dev/null
@@ -1,124 +0,0 @@
-.page {
-    background: rgb(255,85,200);
-    background: radial-gradient(to bottom left, rgba(255,85,200,1) 0%, rgba(79,79,255,1) 100%, rgba(0,212,255,1) 100%);
-    min-height: 100vh;
-    padding: 50px 0 200px 0;
-}
-
-.container {
-    max-width: 1200px;
-    margin: auto;
-}
-
-.main {
-    display: flex;
-    gap: 1em;
-    margin: 100px 0 20px 0;
-}
-
-.content {
-    flex-grow: 1;
-    background-color: white;
-    box-shadow: 5px 5px 10px rgba(0,0,0,0.2);
-    padding: 50px;
-    border-radius: 10px;
-}
-
-.content h2 {
-    margin: unset;
-}
-
-.header {
-    display: flex;
-    gap: 3em;
-}
-
-.links {
-    margin: -20px 0;
-    display: flex;
-    flex-direction: column;
-}
-
-.links > a {
-    padding: 10px;
-    color: #1F50DD;
-    width: 10em;
-    font-size: 1.2em;
-    border-bottom: 4px solid #1F50DD;
-    transition-duration: 0.2s;
-}
-
-.links > a:hover {
-    transition-duration: 0.2s;
-    border-bottom: 4px solid rgba(0,0,0,0);
-    transform: scale(0.97);
-}
-
-.avatar_bar {
-    margin: -40px 0 0 0;
-    flex-grow: 1;
-    display: flex;
-    gap: 1em;
-}
-
-.avatar_bar h1 {
-    font-size: 3em;
-    margin: unset;
-}
-
-.avatar {
-    margin: -110px 0 0 0;
-    border: 6px solid white;
-    border-radius: 100%;
-    height: 200px;
-    transition-duration: 0.3s;
-}
-
-.avatar:hover {
-    transition-duration: 0.3s;
-    transform: scale(1.1) rotate(20deg);
-}
-
-.gallery {
-    padding: 20px 0;
-    display: flex;
-    gap: 2em;
-}
-
-.gallery > img {
-    width: 100%;
-    height: auto;
-}
-
-.gallery > img:hover {
-    transform: scale(2);
-}
-
-@media(max-width:768px) {
-    .avatar_bar {
-        justify-content: center;
-        text-align: center;
-        flex-direction: column;
-    }
-
-    .avatar_bar h1 {
-        font-size: 2em;
-    }
-
-    .avatar {
-        width: 40vw;
-        height: auto;
-    }
-
-    .page {
-        width: 100%;
-    }
-
-    .content {
-        margin: 0 10px;
-    }
-
-    .main {
-        flex-direction: column;
-    }
-}
\ No newline at end of file
diff --git a/styles/components/Socials.module.css b/styles/components/Socials.module.css
index b73e54a..32b97b8 100644
--- a/styles/components/Socials.module.css
+++ b/styles/components/Socials.module.css
@@ -12,8 +12,8 @@
     border-radius: 10px;
     padding: 0.4em 2em;
     font-size: 1.3em;
-    box-shadow: 2px 2px 10px rgba(0,0,0,0.2);
-    background-color: rgba(79,79,255,1);
+    box-shadow: var(--box-shadow);
+    background-color: var(--theme-color);
     color: white;
     transition-duration: 0.1s;
     font-family: 'Dela Gothic One', cursive;
diff --git a/styles/globals.css b/styles/globals.css
index 62515fe..5cc4290 100644
--- a/styles/globals.css
+++ b/styles/globals.css
@@ -10,6 +10,11 @@ body {
   background-color: #1B1C22;
 }
 
+:root {
+  --box-shadow: 2px 2px 10px rgba(0,0,0,0.2);
+  --theme-color: rgba(79,79,255,1);
+}
+
 a {
   color: inherit;
   text-decoration: none;
@@ -27,6 +32,19 @@ h1, h2, h3 {
   text-decoration: underline;
 }
 
+img {
+  max-width: 100%;
+}
+
+hr {
+  width: 100%;
+  margin: 1em 0;
+}
+
+.h-unset {
+  margin: unset;
+}
+
 
 /* page structure */
 .page {
@@ -52,7 +70,7 @@ h1, h2, h3 {
 /* page elements */
 .card {
   border-radius: 10px;
-  box-shadow: 2px 2px 10px rgba(0,0,0,0.2);
+  box-shadow: var(--box-shadow);
   display: flex;
   flex-direction: column;
   gap: 1em;