diff --git a/style.css b/style.css
index f1fa033..b09d493 100644
--- a/style.css
+++ b/style.css
@@ -1,5 +1,7 @@
 :root {
 	--width: 1000px;
+	--color-blue: #324c9c;
+	--color-red: #ff4e6c;
 }
 
 @font-face {
@@ -20,7 +22,7 @@ body {
 	margin: 0;
 	line-height: 1.5;
 	background-color: #edfbff;
-	color: #324c9c;
+	color: var(--color-blue);
 	font-family: montserrat, sans;
 }
 
@@ -59,7 +61,7 @@ main .phases, main .quotations {
 
 main .phases h2 { text-align: center }
 main .phases figure {
-	background-color: #324c9c;
+	background-color: var(--color-blue);
 	color: #fff;
 	padding: 2em;
 	max-width: 75%;
@@ -84,7 +86,7 @@ main .quotations figure figcaption {
 }
 
 main .team {
-	background-color: #324c9c;
+	background-color: var(--color-blue);
 	padding: 4em 1em;
 }
 main .team h2 {
@@ -103,7 +105,7 @@ main .team figure {
 	transition: all .1s linear;
 }
 main .team figure:hover {
-	background-color: #ff4e6c;
+	background-color: var(--color-red);
 	color: #fff;
 }
 main .team figure, main .team figure * { cursor: pointer }
@@ -119,7 +121,7 @@ main .articles .header {
 	grid-template-columns: 1fr 4fr;
 	align-items: baseline;
 	margin-bottom: 4em;
-	border-bottom: 1px solid #324c9c;
+	border-bottom: 1px solid var(--color-blue);
 }
 main .articles .list {
 	display: grid;
@@ -172,7 +174,7 @@ footer img:hover { transform: scale(1.1) }
 	max-width: var(--width);
 	padding: 3em;
 	background-color: #fff;
-	color: #324c9c;
+	color: var(--color-blue);
 	transform: translate(0, -2em);
 	transition: transform .2s ease-out;
 }