diff --git a/static/style.css b/static/style.css
index 72a44a5..55ab37a 100644
--- a/static/style.css
+++ b/static/style.css
@@ -3,24 +3,23 @@
 :root {
     font-family: 'Nunito', 'Arial';
     /* vars */
-    --color-1-1: hsl(341, 100%, 95%);
-    --color-1-2: hsl(341, 85%, 89%);
-    --color-1-3: hsl(342, 95%, 79%);
-    --color-1-4: hsl(341, 94%, 65%);
-    --color-1-5: hsl(342, 72%, 49%);
-    --color-1-6: hsl(342, 62%, 37%);
-    --color-1-7: hsl(342, 66%, 31%);
-    --color-1-8: hsl(342, 78%, 19%);
+    /*--principal-pastel:     hsl(341, 100%, 95%);*/
+    /*--principal-brightest:  hsl(341, 85%, 89%);*/
+    /*--principal-light:      hsl(342, 95%, 79%);*/
+    --principal-neurtal:    hsl(341, 94%, 65%);
+    /*--principal-dark:       hsl(342, 72%, 49%);*/
+    /*--principal-darker:     hsl(342, 62%, 37%);*/
+    /*--principal-darkest:    hsl(342, 78%, 19%);*/
 
-    --color-2-1: hsl(30, 33%, 98%);
-    --color-2-2: hsl(29, 56%, 91%);
-    --color-2-3: hsl(30, 59%, 83%);
-    --color-2-4: hsl(31, 54%, 69%);
-    --color-2-5: hsl(30, 66%, 63%);
-    --color-2-6: hsl(30, 46%, 46%);
-    --color-2-7: hsl(30, 64%, 29%);
+    --secondary-pastel:     hsl(30, 33%, 98%);
+    /*--secondary-brightest:  hsl(29, 56%, 91%);*/
+    /*--secondary-light:      hsl(30, 59%, 83%);*/
+    /*--secondary-neurtal:    hsl(31, 54%, 69%);*/
+    /*--secondary-dark:       hsl(30, 66%, 63%);*/
+    /*--secondary-darker:     hsl(30, 46%, 46%);*/
+    /*--secondary-darkest:    hsl(30, 64%, 29%);*/
 
-    --color-g-1: hsl(340, 2%, 63%);
+    --grey-dark: hsl(340, 2%, 63%);
 
     --size-1: 2px;
     --size-2: 4px;
@@ -41,7 +40,7 @@
 }
 
 body {
-    background: var(--color-2-1);
+    background: var(--secondary-pastel);
 }
 
 body > header {
@@ -49,7 +48,7 @@ body > header {
     box-shadow: var(--shadow);
     padding: var(--size-3);
     font-size: var(--size-5);
-    background: var(--color-2-1);
+    background: var(--secondary-pastel);
 }
 
 body > header > nav {
@@ -69,7 +68,7 @@ body > header > nav > ul > li::marker {
     content: none;
 }
 body > header > nav > ul > li {
-    background: var(--color-1-4);
+    background: var(--principal-neurtal);
     border-radius: var(--border-radius);
     height: 100%;
     padding-left: var(--size-4);
@@ -88,7 +87,7 @@ body > header > nav > ul > li {
 }
 
 body > header > nav > ul > li > a {
-    color: var(--color-2-1);
+    color: var(--secondary-pastel);
     font-weight: 600;
     text-decoration: none;
 }
@@ -97,7 +96,7 @@ body > header > nav > ul > li:first-child > a > img {
     height: var(--size-6);
 }
 body > header > nav > ul > li:last-child {
-    border: var(--border) var(--color-1-4);
+    border: var(--border) var(--principal-neurtal);
     background: none;
 }
 body > header > nav > ul > li:last-child > a > img {
@@ -113,7 +112,7 @@ footer {
     align-items: center;
     height: 200px;
     width: 100vw;
-    background: var(--color-g-1);
-    color: var(--color-2-1);
+    background: var(--grey-dark);
+    color: var(--secondary-pastel);
     font-size: var(--size-5);
 }