diff --git a/README.md b/README.md
index 5d7c446..7c8bc50 100644
--- a/README.md
+++ b/README.md
@@ -41,10 +41,6 @@ as well as an [API reference guide](https://developer.withings.com/api-reference
 
 ## TODOs
 
-- [ ] implement regular notifications
-- [ ] fix colourtheme
-- [ ] fix favicons
-- [ ] add text content
 - [ ] fix overflow on `mews-continue`
 - [ ] add `register-final` view
 
diff --git a/app/authentication/templates/authentication/login.html b/app/authentication/templates/authentication/login.html
index 754e2f7..ef982d0 100644
--- a/app/authentication/templates/authentication/login.html
+++ b/app/authentication/templates/authentication/login.html
@@ -25,7 +25,7 @@
 
         <div class="flex flex-col">
           {% render_field form.username|add_error_class:"error" %}
-          <label class="text-sm text-accent-800 font-semibold" for="{{ form.username.id_for_label }}">
+          <label for="{{ form.username.id_for_label }}">
               {% render_field form.username.label %}
           </label>
           {% if form.username.errors %}
@@ -39,7 +39,7 @@
 
         <div class="flex flex-col">
           {% render_field form.password|add_error_class:"error" %}
-          <label class="text-sm text-accent-800 font-semibold" for="{{ form.password.id_for_label }}">
+          <label for="{{ form.password.id_for_label }}">
               {% render_field form.password.label %}
           </label>
           {% if form.password.errors %}
diff --git a/app/authentication/templates/authentication/register-continue.html b/app/authentication/templates/authentication/register-continue.html
index 4b1ec4f..b8e8f19 100644
--- a/app/authentication/templates/authentication/register-continue.html
+++ b/app/authentication/templates/authentication/register-continue.html
@@ -25,7 +25,7 @@
 
           <div class="flex flex-col">
             {% render_field user_form.first_name|add_error_class:"error" %}
-            <label class="text-sm text-accent-800 font-semibold" for="{{ user_form.first_name.id_for_label }}">
+            <label for="{{ user_form.first_name.id_for_label }}">
                 {% render_field user_form.first_name.label %}
             </label>
             {% if user_form.first_name.errors %}
@@ -39,7 +39,7 @@
 
           <div class="flex flex-col">
             {% render_field user_form.last_name|add_error_class:"error" %}
-            <label class="text-sm text-accent-800 font-semibold" for="{{ user_form.last_name.id_for_label }}">
+            <label for="{{ user_form.last_name.id_for_label }}">
                 {% render_field user_form.last_name.label %}
             </label>
             {% if user_form.last_name.errors %}
@@ -53,7 +53,7 @@
 
           <div class="flex flex-col">
             {% render_field profile_form.date_of_birth|add_error_class:"error" %}
-            <label class="text-sm text-accent-800 font-semibold" for="{{ profile_form.date_of_birth.id_for_label }}">
+            <label for="{{ profile_form.date_of_birth.id_for_label }}">
                 {% render_field profile_form.date_of_birth.label %}
             </label>
             {% if profile_form.date_of_birth.errors %}
@@ -67,7 +67,7 @@
 
           <div class="flex flex-col">
             {% render_field profile_form.sex|add_error_class:"error" %}
-            <label class="text-sm text-accent-800 font-semibold" for="{{ profile_form.sex.id_for_label }}">
+            <label for="{{ profile_form.sex.id_for_label }}">
                 {% render_field profile_form.sex.label %}
             </label>
             {% if profile_form.sex.errors %}
@@ -81,7 +81,7 @@
 
           <div class="flex flex-col">
             {% render_field user_form.email|add_error_class:"error" %}
-            <label class="text-sm text-accent-800 font-semibold" for="{{ user_form.email.id_for_label }}">
+            <label for="{{ user_form.email.id_for_label }}">
                 {% render_field user_form.email.label %}
             </label>
             {% if user_form.email.errors %}
@@ -95,7 +95,7 @@
 
           <div class="flex flex-col">
             {% render_field user_form.username|add_error_class:"error" %}
-            <label class="text-sm text-accent-800 font-semibold" for="{{ user_form.username.id_for_label }}">
+            <label for="{{ user_form.username.id_for_label }}">
                 {% render_field user_form.username.label %}
             </label>
             {% if user_form.username.errors %}
@@ -109,7 +109,7 @@
 
           <div class="flex flex-col">
             {% render_field user_form.password1|add_error_class:"error" %}
-            <label class="text-sm text-accent-800 font-semibold" for="{{ user_form.password1.id_for_label }}">
+            <label for="{{ user_form.password1.id_for_label }}">
                 {% render_field user_form.password1.label %}
             </label>
             {% if user_form.password1.errors %}
@@ -123,7 +123,7 @@
 
           <div class="flex flex-col">
             {% render_field user_form.password2|add_error_class:"error" %}
-            <label class="text-sm text-accent-800 font-semibold" for="{{ user_form.password2.id_for_label }}">
+            <label for="{{ user_form.password2.id_for_label }}">
                 {% render_field user_form.password2.label %}
             </label>
             {% if user_form.password2.errors %}
diff --git a/app/core/templates/core/base.html b/app/core/templates/core/base.html
index b616794..7020cce 100644
--- a/app/core/templates/core/base.html
+++ b/app/core/templates/core/base.html
@@ -10,6 +10,7 @@
     <meta name="author" content="{% block author %}Julian Lobbes{% endblock author %}">
 
     <link rel="stylesheet" href="{% static 'dist/main.css' %}">
+    <link rel="icon" type="image/png" href="{% static 'medwings/images/logo/medwings-logo.png' %}">
   </head>
   <body class="global">
     <header class="global">
diff --git a/app/core/templates/core/footer.html b/app/core/templates/core/footer.html
index 0022947..ea7ad65 100644
--- a/app/core/templates/core/footer.html
+++ b/app/core/templates/core/footer.html
@@ -1,3 +1,3 @@
-<div class="flex gap-4 justify-center items-center p-2 bg-background-700 text-sm">
+<div class="flex gap-4 justify-center items-center p-2 bg-primary-100 text-sm text-background">
   <p>&copy; 2023 Julian Lobbes</p>
 </div>
diff --git a/app/core/templates/core/navbar.html b/app/core/templates/core/navbar.html
index d5e18d2..bcb1cd3 100644
--- a/app/core/templates/core/navbar.html
+++ b/app/core/templates/core/navbar.html
@@ -1,59 +1,55 @@
-<nav class="flex gap-4 items-center p-2 bg-background-800 font-bold text-2xl">
-  <a href="/">
-    <div class="bg-background-400 p-2 rounded rounded-xl">
-      <svg class="h-8 w-auto" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
-        viewBox="0 0 512.001 512.001" xml:space="preserve">
-        <g>
-          <path style="fill:#FAEDD6;" d="M398.266,86.092c-25.518,0-46.104,19.473-46.104,44.992v41.853l39.925,33.359h16.01
-            c13.263,0,23.503-12.09,23.503-25.355v-14.365h8.517c13.263,0,23.886-12.398,23.886-25.661v-16.01
-            c21.95,0,40.155-14.773,40.155-38.813L398.266,86.092L398.266,86.092z"/>
-          <path style="fill:#FAEDD6;" d="M113.734,86.092c25.518,0,46.104,19.473,46.104,44.992v41.853l-39.925,33.359h-16.01
-            c-13.263,0-23.503-12.09-23.503-25.355v-14.365h-8.517c-13.263,0-23.886-12.398-23.886-25.661v-16.01
-            c-24.041,0-40.155-14.773-40.155-38.813L113.734,86.092L113.734,86.092z"/>
-        </g>
-        <path style="fill:#FA004B;" d="M376.286,188.964c-31.262-31.262-81.949-31.262-113.21,0c-0.296,0.296-3.427,3.427-8.491,8.491
-          c-3.383-3.383-5.422-5.422-5.66-5.66c-31.262-31.262-81.948-31.262-113.21,0s-31.262,81.949,0,113.21
-          c0.239,0.239,118.871,118.871,118.871,118.871S375.992,302.47,376.288,302.174C407.548,270.912,407.548,220.226,376.286,188.964z"/>
-        <g>
-          <path style="fill:#232323;" d="M398.266,77.04c-29.8,0-54.044,24.244-54.044,54.044V161.2c-29.785-8.61-63.26-1.209-86.691,22.221
-            l-2.948,2.948l-0.117-0.117c-23.43-23.43-56.904-30.83-86.69-22.221v-32.947c0-29.799-24.244-54.044-54.044-54.044H0v7.839
-            c0,26.393,21.472,47.865,47.865,47.865h40.026v-15.679H47.865c-15.045,0-27.712-10.375-31.221-24.347h97.089
-            c21.155,0,38.365,17.21,38.365,38.365v39.176c-7.901,4.06-15.317,9.381-21.928,15.991c-3.42,3.42-6.483,7.062-9.22,10.866h-17.049
-            c-8.919,0-16.176-7.256-16.176-16.176H72.046c0,17.565,14.29,31.855,31.855,31.855h8.084c-14.246,32.247-8.2,71.365,18.186,97.752
-            l124.414,124.414l5.543-5.543c4.958-4.958,121.411-121.411,121.702-121.702c25.617-25.617,32.077-63.24,19.396-94.921h6.875
-            c17.564,0,31.855-14.29,31.855-31.855h-15.679c0,8.92-7.256,16.176-16.176,16.176h-15.079c-3.202-4.843-6.93-9.437-11.19-13.697
-            c-6.61-6.61-14.026-11.932-21.928-15.991v-36.345c0-21.154,17.21-38.365,38.365-38.365h97.089
-            c-3.509,13.972-16.176,24.347-31.221,24.347H424.11v15.679h40.026c26.393,0,47.865-21.472,47.865-47.865V77.04L398.266,77.04
-            L398.266,77.04z M370.739,296.634c-0.422,0.423-92.402,92.403-116.153,116.154L141.257,299.462
-            c-28.156-28.156-28.156-73.968,0-102.124c14.077-14.077,32.57-21.117,51.061-21.117c18.493,0,36.984,7.039,51.063,21.117
-            l11.204,11.204l14.034-14.034c28.156-28.156,73.969-28.156,102.124,0S398.898,268.475,370.739,296.634z"/>
-          <path style="fill:#232323;" d="M440.119,157.091h-40.026v15.679h40.026c17.565,0,31.855-14.29,31.855-31.855h-15.679
-            C456.296,149.835,449.039,157.091,440.119,157.091z"/>
-          <path style="fill:#232323;" d="M111.907,157.091H71.881c-8.92,0-16.176-7.256-16.176-16.176H40.026
-            c0,17.564,14.29,31.855,31.855,31.855h40.026V157.091z"/>
-        </g>
-        <path style="fill:#FFFFFF;" d="M367.906,244.969h-15.679c0-17.769-14.698-32.174-32.468-32.174v-15.679
-          C346.936,197.117,367.906,218.838,367.906,244.969z"/>
-        <g>
-          <rect x="247.641" y="86.087" style="fill:#36C9A3;" width="15.679" height="48.081"/>
-
-          <rect x="284.178" y="111.923" transform="matrix(-0.7071 -0.7071 0.7071 -0.7071 407.3551 426.5414)" style="fill:#36C9A3;" width="15.679" height="33.963"/>
-
-          <rect x="202.999" y="121.072" transform="matrix(-0.7071 -0.7071 0.7071 -0.7071 284.3756 375.6156)" style="fill:#36C9A3;" width="33.963" height="15.679"/>
-        </g>
-      </svg>
+<nav class="flex flex-wrap gap-4 items-center justify-center sm:justify-start p-2 bg-primary-100 font-bold text-lg transition-all">
+  <div class="flex w-full sm:w-auto">
+    <a class="block" href="/">
+      <div class="bg-white/90 p-1 rounded rounded-xl border-4 hover:border-secondary group transition-all max-w-fit">
+        <svg class="h-8 w-auto group-hover:scale-90" version="1.1" id="Layer_1" viewBox="0 0 501.31603 501.31603" xml:space="preserve" sodipodi:docname="medwings-logo.svg" width="501.31601" height="501.31601" inkscape:version="1.3 (0e150ed6c4, 2023-07-21)" inkscape:export-filename="medwings-logo.png" inkscape:export-xdpi="49.022972" inkscape:export-ydpi="49.022972" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg"><defs id="defs9"><linearGradient id="linearGradient12" inkscape:collect="always"><stop style="stop-color:#b90000;stop-opacity:1" offset="0" id="stop12"/><stop style="stop-color:#ee6464;stop-opacity:1" offset="1" id="stop13"/></linearGradient><inkscape:path-effect effect="fillet_chamfer" id="path-effect12" is_visible="true" lpeversion="1" nodesatellites_param="F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1" radius="8" unit="px" method="auto" mode="F" chamfer_steps="1" flexible="false" use_knot_distance="true" apply_no_radius="true" apply_with_radius="true" only_selected="false" hide_knots="false"/><inkscape:path-effect effect="fillet_chamfer" id="path-effect11" is_visible="true" lpeversion="1" nodesatellites_param="F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1" radius="8" unit="px" method="auto" mode="F" chamfer_steps="1" flexible="false" use_knot_distance="true" apply_no_radius="true" apply_with_radius="true" only_selected="false" hide_knots="false"/><inkscape:path-effect effect="fillet_chamfer" id="path-effect10" is_visible="true" lpeversion="1" nodesatellites_param="F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1" radius="8" unit="px" method="auto" mode="F" chamfer_steps="1" flexible="false" use_knot_distance="true" apply_no_radius="true" apply_with_radius="true" only_selected="false" hide_knots="false"/><linearGradient inkscape:collect="always" xlink:href="#linearGradient12" id="linearGradient13" x1="114.10844" y1="427.41153" x2="402.21704" y2="163.0332" gradientUnits="userSpaceOnUse"/></defs><sodipodi:namedview id="namedview9" pagecolor="#505050" bordercolor="#eeeeee" borderopacity="1" inkscape:showpageshadow="0" inkscape:pageopacity="0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1" showgrid="false" inkscape:zoom="1.1352357" inkscape:cx="264.26231" inkscape:cy="205.24373" inkscape:window-width="1900" inkscape:window-height="1004" inkscape:window-x="10" inkscape:window-y="38" inkscape:window-maximized="1" inkscape:current-layer="Layer_1"/>&#10; &#10; &#10; &#10; &#10;<g id="logo-all" inkscape:label="all" transform="translate(-5.3419952,-4.8412612)"><g id="logo-wings" inkscape:label="wings" style="fill:#6aa4bf;fill-opacity:1;stroke:#000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1" transform="translate(0,48)">&#10;<path style="fill:#6aa4bf;fill-opacity:1;stroke:#000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1" d="m 398.266,86.092 c -25.518,0 -46.104,19.473 -46.104,44.992 v 41.853 l 39.925,33.359 h 16.01 c 13.263,0 23.503,-12.09 23.503,-25.355 v -14.365 h 8.517 c 13.263,0 23.886,-12.398 23.886,-25.661 v -16.01 c 21.95,0 40.155,-14.773 40.155,-38.813 z" id="path1"/>&#10;<path style="fill:#6aa4bf;fill-opacity:1;stroke:#000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1" d="m 113.734,86.092 c 25.518,0 46.104,19.473 46.104,44.992 v 41.853 l -39.925,33.359 h -16.01 C 90.64,206.296 80.4,194.206 80.4,180.941 v -14.365 h -8.517 c -13.263,0 -23.886,-12.398 -23.886,-25.661 v -16.01 c -24.041,0 -40.155,-14.773 -40.155,-38.813 z" id="path2"/>&#10;</g><g id="logo-heart" inkscape:label="heart"><path style="fill:url(#linearGradient13);fill-opacity:1;stroke:#000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1" d="m 376.286,188.964 c -31.262,-31.262 -81.949,-31.262 -113.21,0 -0.296,0.296 -3.427,3.427 -8.491,8.491 -3.383,-3.383 -5.422,-5.422 -5.66,-5.66 -31.262,-31.262 -81.948,-31.262 -113.21,0 -31.262,31.262 -31.262,81.949 0,113.21 0.239,0.239 118.871,118.871 118.871,118.871 0,0 121.406,-121.406 121.702,-121.702 31.26,-31.262 31.26,-81.948 -0.002,-113.21 z" id="path3"/><path style="fill:#fff" d="m 367.906,244.969 h -15.679 c 0,-17.769 -14.698,-32.174 -32.468,-32.174 v -15.679 c 27.177,10e-4 48.147,21.722 48.147,47.853 z" id="path7"/></g><g id="logo-blips" inkscape:label="blips" style="stroke:#000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1">&#10;<path x="247.64101" y="86.086998" style="fill:#36c9a3;stroke:#000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1" width="15.679" height="48.081001" id="rect7" inkscape:path-effect="#path-effect12" sodipodi:type="rect" d="m 255.64101,86.086998 a 7.8411428,7.8411428 46.172867 0 1 7.679,8 V 126.168 a 8,8 135 0 1 -8,8 7.8411428,7.8411428 46.172867 0 1 -7.679,-8 V 94.086998 a 8,8 135 0 1 8,-8 z"/>&#10;<path x="284.17801" y="111.923" transform="matrix(-0.7071,-0.7071,0.7071,-0.7071,407.3551,426.5414)" style="fill:#36c9a3;stroke:#000;stroke-width:5.00005;stroke-dasharray:none;stroke-opacity:1" width="15.679" height="33.963001" id="rect8" inkscape:path-effect="#path-effect11" sodipodi:type="rect" d="m 292.17801,111.923 a 7.8411428,7.8411428 46.172867 0 1 7.679,8 v 17.963 a 8,8 135 0 1 -8,8 7.8411428,7.8411428 46.172867 0 1 -7.679,-8 v -17.963 a 8,8 135 0 1 8,-8 z"/>&#10;<path x="202.99899" y="121.072" transform="matrix(-0.7071,-0.7071,0.7071,-0.7071,284.3756,375.6156)" style="fill:#36c9a3;stroke:#000;stroke-width:5.00005;stroke-dasharray:none;stroke-opacity:1" width="33.963001" height="15.679" id="rect9" inkscape:path-effect="#path-effect10" sodipodi:type="rect" d="m 210.99899,121.072 h 17.963 a 8,8 45 0 1 8,8 7.8411428,7.8411428 136.17287 0 1 -8,7.679 h -17.963 a 8,8 45 0 1 -8,-8 7.8411428,7.8411428 136.17287 0 1 8,-7.679 z"/>&#10;</g></g>&#10;</svg>
+      </div>
+    </a>
+    <div class="grow sm:hidden"></div>
+    <div id="hamburger-div">
+      <svg class="h-10 w-auto sm:hidden cursor-pointer" id="hamburger-svg" width="512mm" height="512mm" viewBox="0 0 512 512"><g id="hamburger-all" transform="translate(0,-18.119038)"><path class="hamburger-path" style="fill-opacity:1;stroke-width:2.2225;stroke-linecap:square;stroke-linejoin:round;stroke-miterlimit:15.6;stroke-dasharray:none;stroke-opacity:1" id="hamburger-top" width="427.90082" height="45.731606" x="46.167351" y="69.705063" d="M 69.450684,69.705063 H 450.78484 a 23.283333,23.283333 45 0 1 23.28333,23.283333 22.869615,22.869615 136.04611 0 1 -23.28333,22.448274 H 69.450684 A 23.283333,23.283333 45 0 1 46.167351,92.153335 22.869615,22.869615 136.04611 0 1 69.450684,69.705063 Z" transform="translate(-4.1177597,40.551704)"/><path class="hamburger-path" style="fill-opacity:1;stroke-width:2.2225;stroke-linecap:square;stroke-linejoin:round;stroke-miterlimit:15.6;stroke-dasharray:none;stroke-opacity:1" id="hamburger-middle" width="427.90082" height="45.731606" x="46.167351" y="69.705063" d="M 69.450684,69.705063 H 450.78484 a 23.283333,23.283333 45 0 1 23.28333,23.283333 22.869615,22.869615 136.04611 0 1 -23.28333,22.448274 H 69.450684 A 23.283333,23.283333 45 0 1 46.167351,92.153335 22.869615,22.869615 136.04611 0 1 69.450684,69.705063 Z" transform="translate(-4.1177597,181.54817)"/><path class="hamburger-path" style="fill-opacity:1;stroke-width:2.2225;stroke-linecap:square;stroke-linejoin:round;stroke-miterlimit:15.6;stroke-dasharray:none;stroke-opacity:1" id="hamburger-bottom" width="427.90082" height="45.731606" x="46.167351" y="69.705063" d="M 69.450684,69.705063 H 450.78484 a 23.283333,23.283333 45 0 1 23.28333,23.283333 22.869615,22.869615 136.04611 0 1 -23.28333,22.448274 H 69.450684 A 23.283333,23.283333 45 0 1 46.167351,92.153335 22.869615,22.869615 136.04611 0 1 69.450684,69.705063 Z" transform="translate(-4.1177597,322.54464)"/></g></svg>
     </div>
-  </a>
-  {% if request.user.is_authenticated %}
-    <a class="text-md" href="{% url 'dashboard' %}">Dashboard</a>
-  {% endif %}
-  {% if request.user.is_authenticated %}
-    <a class="btn text-lg" href="{% url 'mews-init' %}">Record Vitals</a>
-  {% endif %}
-  <div class="grow"></div>
-  {% if request.user.is_authenticated %}
-    <a class="btn-outline text-lg" href="{% url 'logout' %}">Log Out</a>
-  {% else %}
-    <a class="btn text-lg" href="{% url 'login' %}">Log In</a>
-  {% endif %}
+  </div>
+  <div id="hamburger-content" class="flex flex-col grow sm:flex-row gap-4 items-center justify-center hamburger--closed">
+    {% if request.user.is_authenticated %}
+      <a class="btn" href="{% url 'dashboard' %}">Dashboard</a>
+    {% endif %}
+    {% if request.user.is_authenticated %}
+      <a class="btn" href="{% url 'mews-init' %}">Record Vitals</a>
+    {% endif %}
+    <div class="grow hidden sm:block"></div>
+    {% if request.user.is_authenticated %}
+      <a class="btn-outline" href="{% url 'logout' %}">Log Out</a>
+    {% else %}
+      <a class="btn" href="{% url 'login' %}">Log In</a>
+    {% endif %}
+  </div>
 </nav>
+<script>
+  const hamburgerSvg = document.getElementById("hamburger-svg");
+  const hamburgerContentDiv = document.getElementById("hamburger-content");
+
+  let hamburgerMenuIsOpen = false;
+
+  function toggleHamburgerMenu() {
+    if (hamburgerMenuIsOpen) {
+      hamburgerContentDiv.classList.remove("hamburger--open");
+      hamburgerSvg.classList.remove("hamburger--open");
+
+      hamburgerContentDiv.classList.add("hamburger--closed");
+      hamburgerSvg.classList.add("hamburger--closed");
+
+      hamburgerMenuIsOpen = false;
+    } else {
+      hamburgerContentDiv.classList.remove("hamburger--closed");
+      hamburgerSvg.classList.remove("hamburger--closed");
+
+      hamburgerContentDiv.classList.add("hamburger--open");
+      hamburgerSvg.classList.add("hamburger--open");
+
+      hamburgerMenuIsOpen = true;
+    }
+  }
+
+  hamburgerSvg.addEventListener('click', toggleHamburgerMenu);
+</script>
diff --git a/app/medwings/templates/medwings/dashboard.html b/app/medwings/templates/medwings/dashboard.html
index 7a4d5b8..e28191a 100644
--- a/app/medwings/templates/medwings/dashboard.html
+++ b/app/medwings/templates/medwings/dashboard.html
@@ -8,9 +8,10 @@
   <div class="flex flex-col justify-center items-center gap-8 py-4 px-8 w-full h-full">
 
     <h1 class="w-full text-center">Dashboard</h1>
+    <p class="text-secondary font-semibold">This page shows all of your recorded health data.</p>
 
     <div class="flex flex-col justify-center items-center gap-2 p-4 w-full max-h-96">
-      <h2 class="w-full text-center">MEWS Measurements</h2>
+      <h2 class="w-full text-secondary-400 text-center">MEWS</h2>
       {% if mews_data %}
         <canvas id="mewsChart"></canvas>
       {% else %}
@@ -21,7 +22,7 @@
     </div>
 
     <div class="flex flex-col justify-center items-center gap-2 p-4 w-full max-h-96">
-      <h2 class="w-full text-center">Blood Pressure Measurements</h2>
+      <h2 class="w-full text-secondary-400 text-center">Blood Pressure</h2>
       {% if blood_pressure_data %}
         <canvas id="bloodPressureChart"></canvas>
       {% else %}
@@ -32,7 +33,7 @@
     </div>
 
     <div class="flex flex-col justify-center items-center gap-2 p-4 w-full max-h-96">
-      <h2 class="w-full text-center">Body Temperature Measurements</h2>
+      <h2 class="w-full text-secondary-400 text-center">Body Temperature</h2>
       {% if body_temp_data %}
         <canvas id="bodyTempChart"></canvas>
       {% else %}
@@ -43,7 +44,7 @@
     </div>
 
     <div class="flex flex-col justify-center items-center gap-2 p-4 w-full max-h-96">
-      <h2 class="w-full text-center">Heart Rate Measurements</h2>
+      <h2 class="w-full text-secondary-400 text-center">Heart Rate</h2>
       {% if heart_rate_data %}
         <canvas id="heartRateChart"></canvas>
       {% else %}
@@ -54,7 +55,7 @@
     </div>
 
     <div class="flex flex-col justify-center items-center gap-2 p-4 w-full max-h-96">
-      <h2 class="w-full text-center">Blood Oxygenation Measurements</h2>
+      <h2 class="w-full text-secondary-400 text-center">Blood Oxygenation</h2>
       {% if spo2_level_data %}
         <canvas id="spo2LevelChart"></canvas>
       {% else %}
@@ -65,7 +66,7 @@
     </div>
 
     <div class="flex flex-col justify-center items-center gap-2 p-4 w-full max-h-96">
-      <h2 class="w-full text-center">Respiration Score Measurements</h2>
+      <h2 class="w-full text-secondary-400 text-center">Respiration Score</h2>
       {% if respiration_score_data %}
         <canvas id="respirationScoreChart"></canvas>
       {% else %}
diff --git a/app/medwings/templates/medwings/index.html b/app/medwings/templates/medwings/index.html
index 4afd42c..491f149 100644
--- a/app/medwings/templates/medwings/index.html
+++ b/app/medwings/templates/medwings/index.html
@@ -5,14 +5,24 @@
 {% endblock title %}
 
 {% block content %}
-  <div class="flex flex-col justify-center items-center gap-2 py-4 mx-4 max-w-4xl">
-    <h1>Welcome to Medwings</h1>
-    <p1>Your personal health guardian</p1>
+  <div class="flex flex-col justify-center items-center gap-2 px-2 py-4 mx-4 max-w-4xl">
+    <div id="logo-container" class="relative">
+      <svg class="w-64 h-64 drop-shadow-xl" version="1.1" id="Layer_1" viewBox="0 0 501.31603 501.31603" xml:space="preserve" sodipodi:docname="medwings-logo.svg" width="501.31601" height="501.31601" inkscape:version="1.3 (0e150ed6c4, 2023-07-21)" inkscape:export-filename="medwings-logo.png" inkscape:export-xdpi="49.022972" inkscape:export-ydpi="49.022972" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg"><defs id="defs9"><linearGradient id="linearGradient12" inkscape:collect="always"><stop style="stop-color:#b90000;stop-opacity:1" offset="0" id="stop12"/><stop style="stop-color:#ee6464;stop-opacity:1" offset="1" id="stop13"/></linearGradient><inkscape:path-effect effect="fillet_chamfer" id="path-effect12" is_visible="true" lpeversion="1" nodesatellites_param="F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1" radius="8" unit="px" method="auto" mode="F" chamfer_steps="1" flexible="false" use_knot_distance="true" apply_no_radius="true" apply_with_radius="true" only_selected="false" hide_knots="false"/><inkscape:path-effect effect="fillet_chamfer" id="path-effect11" is_visible="true" lpeversion="1" nodesatellites_param="F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1" radius="8" unit="px" method="auto" mode="F" chamfer_steps="1" flexible="false" use_knot_distance="true" apply_no_radius="true" apply_with_radius="true" only_selected="false" hide_knots="false"/><inkscape:path-effect effect="fillet_chamfer" id="path-effect10" is_visible="true" lpeversion="1" nodesatellites_param="F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1" radius="8" unit="px" method="auto" mode="F" chamfer_steps="1" flexible="false" use_knot_distance="true" apply_no_radius="true" apply_with_radius="true" only_selected="false" hide_knots="false"/><linearGradient inkscape:collect="always" xlink:href="#linearGradient12" id="linearGradient13" x1="114.10844" y1="427.41153" x2="402.21704" y2="163.0332" gradientUnits="userSpaceOnUse"/></defs><sodipodi:namedview id="namedview9" pagecolor="#505050" bordercolor="#eeeeee" borderopacity="1" inkscape:showpageshadow="0" inkscape:pageopacity="0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1" showgrid="false" inkscape:zoom="1.1352357" inkscape:cx="264.26231" inkscape:cy="205.24373" inkscape:window-width="1900" inkscape:window-height="1004" inkscape:window-x="10" inkscape:window-y="38" inkscape:window-maximized="1" inkscape:current-layer="Layer_1"/>&#10; &#10; &#10; &#10; &#10;<g id="logo-all" inkscape:label="all" transform="translate(-5.3419952,-4.8412612)"><g id="logo-wings--subtle" inkscape:label="wings" style="fill:#6aa4bf;fill-opacity:1;stroke:#000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1" transform="translate(0,48)">&#10;<path style="fill:#6aa4bf;fill-opacity:1;stroke:#000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1" d="m 398.266,86.092 c -25.518,0 -46.104,19.473 -46.104,44.992 v 41.853 l 39.925,33.359 h 16.01 c 13.263,0 23.503,-12.09 23.503,-25.355 v -14.365 h 8.517 c 13.263,0 23.886,-12.398 23.886,-25.661 v -16.01 c 21.95,0 40.155,-14.773 40.155,-38.813 z" id="path1"/>&#10;<path style="fill:#6aa4bf;fill-opacity:1;stroke:#000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1" d="m 113.734,86.092 c 25.518,0 46.104,19.473 46.104,44.992 v 41.853 l -39.925,33.359 h -16.01 C 90.64,206.296 80.4,194.206 80.4,180.941 v -14.365 h -8.517 c -13.263,0 -23.886,-12.398 -23.886,-25.661 v -16.01 c -24.041,0 -40.155,-14.773 -40.155,-38.813 z" id="path2"/>&#10;</g><g id="logo-heart--subtle" inkscape:label="heart"><path style="fill:url(#linearGradient13);fill-opacity:1;stroke:#000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1" d="m 376.286,188.964 c -31.262,-31.262 -81.949,-31.262 -113.21,0 -0.296,0.296 -3.427,3.427 -8.491,8.491 -3.383,-3.383 -5.422,-5.422 -5.66,-5.66 -31.262,-31.262 -81.948,-31.262 -113.21,0 -31.262,31.262 -31.262,81.949 0,113.21 0.239,0.239 118.871,118.871 118.871,118.871 0,0 121.406,-121.406 121.702,-121.702 31.26,-31.262 31.26,-81.948 -0.002,-113.21 z" id="path3"/><path style="fill:#fff" d="m 367.906,244.969 h -15.679 c 0,-17.769 -14.698,-32.174 -32.468,-32.174 v -15.679 c 27.177,10e-4 48.147,21.722 48.147,47.853 z" id="path7"/></g><g id="logo-blips--subtle" inkscape:label="blips" style="stroke:#000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1">&#10;<path x="247.64101" y="86.086998" style="fill:#36c9a3;stroke:#000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1" width="15.679" height="48.081001" id="rect7" inkscape:path-effect="#path-effect12" sodipodi:type="rect" d="m 255.64101,86.086998 a 7.8411428,7.8411428 46.172867 0 1 7.679,8 V 126.168 a 8,8 135 0 1 -8,8 7.8411428,7.8411428 46.172867 0 1 -7.679,-8 V 94.086998 a 8,8 135 0 1 8,-8 z"/>&#10;<path x="284.17801" y="111.923" transform="matrix(-0.7071,-0.7071,0.7071,-0.7071,407.3551,426.5414)" style="fill:#36c9a3;stroke:#000;stroke-width:5.00005;stroke-dasharray:none;stroke-opacity:1" width="15.679" height="33.963001" id="rect8" inkscape:path-effect="#path-effect11" sodipodi:type="rect" d="m 292.17801,111.923 a 7.8411428,7.8411428 46.172867 0 1 7.679,8 v 17.963 a 8,8 135 0 1 -8,8 7.8411428,7.8411428 46.172867 0 1 -7.679,-8 v -17.963 a 8,8 135 0 1 8,-8 z"/>&#10;<path x="202.99899" y="121.072" transform="matrix(-0.7071,-0.7071,0.7071,-0.7071,284.3756,375.6156)" style="fill:#36c9a3;stroke:#000;stroke-width:5.00005;stroke-dasharray:none;stroke-opacity:1" width="33.963001" height="15.679" id="rect9" inkscape:path-effect="#path-effect10" sodipodi:type="rect" d="m 210.99899,121.072 h 17.963 a 8,8 45 0 1 8,8 7.8411428,7.8411428 136.17287 0 1 -8,7.679 h -17.963 a 8,8 45 0 1 -8,-8 7.8411428,7.8411428 136.17287 0 1 8,-7.679 z"/>&#10;</g></g>&#10;</svg>
+      <div class="absolute top-1/2 left-1/2 -translate-x-1/2">
+        <h1 class="title text-6xl text-center drop-shadow-xl">MedwingS</h1>
+      </div>
+    </div>
+    <h2 class="text-secondary-400 font-sans -translate-y-8 text-2xl font-semibold text-center">The Mobile Early Deterioration Warning System</h2>
     <p>
       We understand that after receiving medical care, you may still have concerns about your health, particularly if you're at
       risk of sudden health changes.
       That's where we come in.
     </p>
+    <p>
+      Our platform leverages smart medical sensor devices to keep track of your vital signs - such as heart rate,
+      blood pressure, and body temperature - providing you and your healthcare team with a detailed and continuous
+      picture of your health status.
+    </p>
     <div class="flex flex-col gap-2 items-center call-to-action-box">
       {% if not request.user.is_authenticated %}
         <p class="font-semibold">To use the platform, please log in:</p>
@@ -24,11 +34,6 @@
         <a class="btn text-lg" href="{% url 'dashboard' %}">Go to your personal dashboard</a>
       {% endif %}
     </div>
-    <p>
-      Our platform leverages smart medical sensor devices to keep track of your vital signs - such as heart rate,
-      blood pressure, and body temperature - providing you and your healthcare team with a detailed and continuous
-      picture of your health status.
-    </p>
     <p>
       Our unique feature is the ability to calculate your Modified Early Warning Score (MEWS) from your vitals data.
       This system is used widely in healthcare settings to detect early signs of deterioration.
@@ -43,7 +48,7 @@
       dedicated team has your health in their sights.
       Stay in control of your health with us, your personal health guardian. 
     </p>
-    <p>
+    <p class="text-secondary-400 font-sans text-xl font-semibold text-center">
       Welcome aboard!
     </p>
   </div>
diff --git a/app/medwings/templates/medwings/mews-continue.html b/app/medwings/templates/medwings/mews-continue.html
index b55c280..3d06e05 100644
--- a/app/medwings/templates/medwings/mews-continue.html
+++ b/app/medwings/templates/medwings/mews-continue.html
@@ -8,12 +8,16 @@
 {% block content %}
   <div class="flex flex-col justify-center items-center gap-2 py-4 mx-4 max-w-4xl">
     <h1>Record your health status</h1>
-    <div id="pageContainer" class="grid grid-cols-3 gap-6 text-xl justify-center items-center w-full p-4 border rounded-md overflow-hidden">
+    <div class="flex flex-col gap-2 items-center call-to-action-box w-full text-center sm:text-start">
+      <p class="font-semibold">Please start measuring your vitals using your devices now.</p>
+      <p>Your measurement results will be synchronized automatically.</p>
+    </div>
+    <div id="pageContainer" class="grid grid-cols-3 gap-6 text-xl justify-center items-center w-full p-4 border border-secondary rounded-md overflow-hidden">
       <div class="font-semibold text-center sm:text-start col-span-2">
         <p>Blood Pressure (systolic)</p>
       </div>
-      <div id="bloodPressureLoader" class="loader h-1 bg-accent loader--loading"></div>
-      <div id="bloodPressureValue" class="loader font-bold text-end hidden">
+      <div id="bloodPressureLoader" class="loader loader-bar loader--loading"></div>
+      <div id="bloodPressureValue" class="loader loader-value hidden">
         <p><span id="bloodPressureValueNumber"></span> mmHG</p>
       </div>
 
@@ -21,8 +25,8 @@
       <div class="font-semibold text-center sm:text-start col-span-2">
         <p>Body Temperature</p>
       </div>
-      <div id="bodyTempLoader" class="loader h-1 bg-accent loader--loading"></div>
-      <div id="bodyTempValue" class="loader font-bold text-end hidden">
+      <div id="bodyTempLoader" class="loader loader-bar loader--loading"></div>
+      <div id="bodyTempValue" class="loader loader-value hidden">
         <p><span id="bodyTempValueNumber"></span> °C</p>
       </div>
 
@@ -30,8 +34,8 @@
       <div class="font-semibold text-center sm:text-start col-span-2">
         <p>Heart Rate</p>
       </div>
-      <div id="heartRateLoader" class="loader h-1 bg-accent loader--loading"></div>
-      <div id="heartRateValue" class="loader font-bold text-end hidden">
+      <div id="heartRateLoader" class="loader loader-bar loader--loading"></div>
+      <div id="heartRateValue" class="loader loader-value hidden">
         <p><span id="heartRateValueNumber"></span> bpm</p>
       </div>
 
@@ -39,8 +43,8 @@
       <div class="font-semibold text-center sm:text-start col-span-2">
         <p>Blood Oxygenation</p>
       </div>
-      <div id="spo2Loader" class="loader h-1 bg-accent loader--loading"></div>
-      <div id="spo2Value" class="loader font-bold text-end hidden">
+      <div id="spo2Loader" class="loader loader-bar loader--loading"></div>
+      <div id="spo2Value" class="loader loader-value hidden">
         <p><span id="spo2ValueNumber"></span> %</p>
       </div>
 
@@ -48,8 +52,8 @@
       <div class="font-semibold text-center sm:text-start col-span-2">
         <p>Respiration Score</p>
       </div>
-      <div id="respirationScoreLoader" class="loader h-1 bg-accent loader--loading"></div>
-      <div id="respirationScoreValue" class="loader font-bold text-end hidden">
+      <div id="respirationScoreLoader" class="loader loader-bar loader--loading"></div>
+      <div id="respirationScoreValue" class="loader loader-value hidden">
         <p><span id="respirationScoreValueNumber"></span></p>
       </div>
 
@@ -57,8 +61,8 @@
       <div class="font-semibold text-center sm:text-start col-span-2">
         <p>MEWS</p>
       </div>
-      <div id="mewsLoader" class="loader h-1 bg-accent loader--loading"></div>
-      <div id="mewsValue" class="loader font-bold text-end hidden">
+      <div id="mewsLoader" class="loader loader-bar loader--loading"></div>
+      <div id="mewsValue" class="loader loader-value hidden">
         <p><span id="mewsValueNumber"></span></p>
       </div>
     </div>
diff --git a/app/medwings/templates/medwings/mews-init.html b/app/medwings/templates/medwings/mews-init.html
index 4e1e583..9977afd 100644
--- a/app/medwings/templates/medwings/mews-init.html
+++ b/app/medwings/templates/medwings/mews-init.html
@@ -6,9 +6,9 @@
 {% endblock title %}
 
 {% block content %}
-  <div class="flex flex-col justify-center items-center gap-2 py-4 mx-4 max-w-4xl">
+  <div class="flex flex-col justify-center items-center gap-6 sm:gap-12 py-4 mx-4 max-w-xl">
     <h1>Record your health status</h1>
-    <div class="flex flex-col justify-center items-center gap-2">
+    <div class="flex flex-col justify-center items-center gap-2 call-to-action-box">
       <div class="flex justify-center items-center gap-4">
         <img class="max-h-24 max-w-24 drop-shadow-lg saturate-50" src="{% static 'medwings/images/devices/withings-bpm-core.webp' %}" alt="A Withings BPM core.">
         <img class="max-h-24 max-w-24 drop-shadow-lg saturate-50" src="{% static 'medwings/images/devices/withings-thermo.webp' %}" alt="A Withings Thermo.">
diff --git a/app/static/medwings/images/logo/medwings-logo.png b/app/static/medwings/images/logo/medwings-logo.png
index 5007d8d..0cc185a 100644
Binary files a/app/static/medwings/images/logo/medwings-logo.png and b/app/static/medwings/images/logo/medwings-logo.png differ
diff --git a/app/static/medwings/images/logo/medwings-logo.svg b/app/static/medwings/images/logo/medwings-logo.svg
index 527290d..fbc9c8c 100644
--- a/app/static/medwings/images/logo/medwings-logo.svg
+++ b/app/static/medwings/images/logo/medwings-logo.svg
@@ -1,66 +1,87 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
-
 <svg
-   fill="#000000"
    version="1.1"
-   id="Capa_1"
-   width="800.00897"
-   height="800.00897"
-   viewBox="0 0 45.968516 45.968516"
+   id="Layer_1"
+   viewBox="0 0 501.31603 501.31603"
    xml:space="preserve"
    sodipodi:docname="medwings-logo.svg"
+   width="501.31601"
+   height="501.31601"
    inkscape:version="1.3 (0e150ed6c4, 2023-07-21)"
    inkscape:export-filename="medwings-logo.png"
-   inkscape:export-xdpi="30.719656"
-   inkscape:export-ydpi="30.719656"
+   inkscape:export-xdpi="49.022972"
+   inkscape:export-ydpi="49.022972"
    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
    xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns:xlink="http://www.w3.org/1999/xlink"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg"><defs
-   id="defs4"><linearGradient
-   id="linearGradient7"
-   inkscape:collect="always"><stop
-     style="stop-color:#ec3636;stop-opacity:1;"
-     offset="0"
-     id="stop7" /><stop
-     style="stop-color:#e2df46;stop-opacity:1;"
-     offset="1"
-     id="stop8" /></linearGradient>&#10;	&#10;<linearGradient
-   inkscape:collect="always"
-   xlink:href="#linearGradient7"
-   id="linearGradient8"
-   x1="-0.88695079"
-   y1="35.375"
-   x2="46.902077"
-   y2="9.6768303"
-   gradientUnits="userSpaceOnUse" /><linearGradient
-   inkscape:collect="always"
-   xlink:href="#linearGradient7"
-   id="linearGradient9"
-   gradientUnits="userSpaceOnUse"
-   x1="-0.88695079"
-   y1="35.375"
-   x2="46.902077"
-   y2="9.6768303" /><linearGradient
-   inkscape:collect="always"
-   xlink:href="#linearGradient7"
-   id="linearGradient10"
-   gradientUnits="userSpaceOnUse"
-   x1="-0.88695079"
-   y1="35.375"
-   x2="46.902077"
-   y2="9.6768303" /><linearGradient
-   inkscape:collect="always"
-   xlink:href="#linearGradient7"
-   id="linearGradient11"
-   gradientUnits="userSpaceOnUse"
-   x1="-0.88695079"
-   y1="35.375"
-   x2="46.902077"
-   y2="9.6768303" /></defs><sodipodi:namedview
-   id="namedview4"
+   id="defs9"><linearGradient
+     id="linearGradient12"
+     inkscape:collect="always"><stop
+       style="stop-color:#b90000;stop-opacity:1;"
+       offset="0"
+       id="stop12" /><stop
+       style="stop-color:#ee6464;stop-opacity:1;"
+       offset="1"
+       id="stop13" /></linearGradient><inkscape:path-effect
+     effect="fillet_chamfer"
+     id="path-effect12"
+     is_visible="true"
+     lpeversion="1"
+     nodesatellites_param="F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1"
+     radius="8"
+     unit="px"
+     method="auto"
+     mode="F"
+     chamfer_steps="1"
+     flexible="false"
+     use_knot_distance="true"
+     apply_no_radius="true"
+     apply_with_radius="true"
+     only_selected="false"
+     hide_knots="false" /><inkscape:path-effect
+     effect="fillet_chamfer"
+     id="path-effect11"
+     is_visible="true"
+     lpeversion="1"
+     nodesatellites_param="F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1"
+     radius="8"
+     unit="px"
+     method="auto"
+     mode="F"
+     chamfer_steps="1"
+     flexible="false"
+     use_knot_distance="true"
+     apply_no_radius="true"
+     apply_with_radius="true"
+     only_selected="false"
+     hide_knots="false" /><inkscape:path-effect
+     effect="fillet_chamfer"
+     id="path-effect10"
+     is_visible="true"
+     lpeversion="1"
+     nodesatellites_param="F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1 @ F,0,0,1,0,8,0,1"
+     radius="8"
+     unit="px"
+     method="auto"
+     mode="F"
+     chamfer_steps="1"
+     flexible="false"
+     use_knot_distance="true"
+     apply_no_radius="true"
+     apply_with_radius="true"
+     only_selected="false"
+     hide_knots="false" /><linearGradient
+     inkscape:collect="always"
+     xlink:href="#linearGradient12"
+     id="linearGradient13"
+     x1="114.10844"
+     y1="427.41153"
+     x2="402.21704"
+     y2="163.0332"
+     gradientUnits="userSpaceOnUse" /></defs><sodipodi:namedview
+   id="namedview9"
    pagecolor="#505050"
    bordercolor="#eeeeee"
    borderopacity="1"
@@ -69,24 +90,65 @@
    inkscape:pagecheckerboard="0"
    inkscape:deskcolor="#d1d1d1"
    showgrid="false"
-   inkscape:zoom="1.0275"
-   inkscape:cx="400"
-   inkscape:cy="371.77616"
+   inkscape:zoom="1.1352357"
+   inkscape:cx="264.26231"
+   inkscape:cy="205.24373"
    inkscape:window-width="1900"
    inkscape:window-height="1004"
    inkscape:window-x="10"
    inkscape:window-y="38"
    inkscape:window-maximized="1"
-   inkscape:current-layer="Capa_1" />&#10;<g
-   id="g3"
-   style="fill:url(#linearGradient8);fill-opacity:1"
-   transform="translate(1.3144378e-4,-3.0572798e-4)">&#10;		<path
-   d="m 44.887,10.992 c -1.108,-0.732 -2.603,-0.425 -3.33,0.683 -1.736,2.631 -4.229,3.869 -6.704,4.869 h -0.002 c 2.439,3 2.14,8.199 -0.928,11.267 -0.052,0.051 -1.104,1.101 -2.487,2.477 1.027,-0.073 2.096,-0.217 3.179,-0.461 3.148,-0.713 6.408,-2.269 9.085,-5.335 0.872,-1 0.77,-2.521 -0.231,-3.394 -0.013,-0.009 -0.023,-0.015 -0.036,-0.024 0.561,-0.555 1.097,-1.166 1.603,-1.842 0.796,-1.063 0.58,-2.57 -0.482,-3.366 -0.027,-0.021 -0.06,-0.033 -0.087,-0.052 0.386,-0.464 0.756,-0.958 1.105,-1.489 0.73,-1.11 0.423,-2.602 -0.685,-3.333 z"
-   id="path1"
-   style="fill:url(#linearGradient9);fill-opacity:1;stroke:none" />&#10;		<path
-   d="m 9.478,21.624 c 0,-1.85 0.578,-3.606 1.636,-5.079 C 8.638,15.759 6.146,14.307 4.411,11.676 3.682,10.568 2.189,10.26 1.081,10.992 c -1.108,0.731 -1.415,2.223 -0.684,3.332 0.351,0.531 0.721,1.025 1.105,1.489 -0.027,0.019 -0.059,0.031 -0.086,0.052 -1.063,0.796 -1.279,2.303 -0.483,3.366 0.506,0.676 1.042,1.287 1.603,1.842 C 2.523,21.082 2.512,21.088 2.5,21.097 1.499,21.97 1.396,23.49 2.268,24.49 c 2.677,3.067 5.937,4.623 9.085,5.336 1.083,0.244 2.151,0.388 3.18,0.461 -1.386,-1.38 -2.442,-2.432 -2.493,-2.482 -1.653,-1.651 -2.562,-3.846 -2.562,-6.181 z"
-   id="path2"
-   style="fill:url(#linearGradient10);fill-opacity:1;stroke:none" />&#10;		<path
-   d="m 32.483,16.857 c -1.316,-1.316 -3.042,-1.974 -4.769,-1.974 -1.717,0 -3.435,0.652 -4.748,1.956 -1.314,-1.304 -3.031,-1.956 -4.749,-1.956 -1.726,0 -3.45,0.658 -4.767,1.974 -2.633,2.632 -2.633,6.902 0,9.535 0.128,0.128 6.376,6.346 8.677,8.636 0.231,0.231 0.535,0.347 0.839,0.347 0.304,0 0.607,-0.115 0.839,-0.347 2.301,-2.29 8.549,-8.507 8.677,-8.636 2.633,-2.634 2.633,-6.903 10e-4,-9.535 z"
-   id="path3"
-   style="fill:url(#linearGradient11);fill-opacity:1;stroke:none" />&#10;	</g>&#10;</svg>
+   inkscape:current-layer="Layer_1" />&#10;  &#10;  &#10;  &#10;  &#10;  <g
+   id="all"
+   inkscape:label="all"
+   transform="translate(-5.3419952,-4.8412612)"><g
+     id="wings"
+     inkscape:label="wings"
+     style="fill:#6aa4bf;fill-opacity:1;stroke:#000000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1"
+     transform="translate(0,48)">&#10;    <path
+   style="fill:#6aa4bf;fill-opacity:1;stroke:#000000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1"
+   d="m 398.266,86.092 c -25.518,0 -46.104,19.473 -46.104,44.992 v 41.853 l 39.925,33.359 h 16.01 c 13.263,0 23.503,-12.09 23.503,-25.355 v -14.365 h 8.517 c 13.263,0 23.886,-12.398 23.886,-25.661 v -16.01 c 21.95,0 40.155,-14.773 40.155,-38.813 z"
+   id="path1" />&#10;    <path
+   style="fill:#6aa4bf;fill-opacity:1;stroke:#000000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1"
+   d="m 113.734,86.092 c 25.518,0 46.104,19.473 46.104,44.992 v 41.853 l -39.925,33.359 h -16.01 C 90.64,206.296 80.4,194.206 80.4,180.941 v -14.365 h -8.517 c -13.263,0 -23.886,-12.398 -23.886,-25.661 v -16.01 c -24.041,0 -40.155,-14.773 -40.155,-38.813 z"
+   id="path2" />&#10;  </g><g
+     id="heart"
+     inkscape:label="heart"><path
+       style="fill:url(#linearGradient13);fill-opacity:1;stroke:#000000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1"
+       d="m 376.286,188.964 c -31.262,-31.262 -81.949,-31.262 -113.21,0 -0.296,0.296 -3.427,3.427 -8.491,8.491 -3.383,-3.383 -5.422,-5.422 -5.66,-5.66 -31.262,-31.262 -81.948,-31.262 -113.21,0 -31.262,31.262 -31.262,81.949 0,113.21 0.239,0.239 118.871,118.871 118.871,118.871 0,0 121.406,-121.406 121.702,-121.702 31.26,-31.262 31.26,-81.948 -0.002,-113.21 z"
+       id="path3" /><path
+       style="fill:#ffffff"
+       d="m 367.906,244.969 h -15.679 c 0,-17.769 -14.698,-32.174 -32.468,-32.174 v -15.679 c 27.177,10e-4 48.147,21.722 48.147,47.853 z"
+       id="path7" /></g><g
+     id="blips"
+     inkscape:label="blips"
+     style="stroke:#000000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1">&#10;    <path
+   x="247.64101"
+   y="86.086998"
+   style="fill:#36c9a3;stroke:#000000;stroke-width:5;stroke-dasharray:none;stroke-opacity:1"
+   width="15.679"
+   height="48.081001"
+   id="rect7"
+   inkscape:path-effect="#path-effect12"
+   sodipodi:type="rect"
+   d="m 255.64101,86.086998 a 7.8411428,7.8411428 46.172867 0 1 7.679,8 V 126.168 a 8,8 135 0 1 -8,8 7.8411428,7.8411428 46.172867 0 1 -7.679,-8 V 94.086998 a 8,8 135 0 1 8,-8 z" />&#10;    <path
+   x="284.17801"
+   y="111.923"
+   transform="matrix(-0.7071,-0.7071,0.7071,-0.7071,407.3551,426.5414)"
+   style="fill:#36c9a3;stroke:#000000;stroke-width:5.00005;stroke-dasharray:none;stroke-opacity:1"
+   width="15.679"
+   height="33.963001"
+   id="rect8"
+   inkscape:path-effect="#path-effect11"
+   sodipodi:type="rect"
+   d="m 292.17801,111.923 a 7.8411428,7.8411428 46.172867 0 1 7.679,8 v 17.963 a 8,8 135 0 1 -8,8 7.8411428,7.8411428 46.172867 0 1 -7.679,-8 v -17.963 a 8,8 135 0 1 8,-8 z" />&#10;    <path
+   x="202.99899"
+   y="121.072"
+   transform="matrix(-0.7071,-0.7071,0.7071,-0.7071,284.3756,375.6156)"
+   style="fill:#36c9a3;stroke:#000000;stroke-width:5.00005;stroke-dasharray:none;stroke-opacity:1"
+   width="33.963001"
+   height="15.679"
+   id="rect9"
+   inkscape:path-effect="#path-effect10"
+   sodipodi:type="rect"
+   d="m 210.99899,121.072 h 17.963 a 8,8 45 0 1 8,8 7.8411428,7.8411428 136.17287 0 1 -8,7.679 h -17.963 a 8,8 45 0 1 -8,-8 7.8411428,7.8411428 136.17287 0 1 8,-7.679 z" />&#10;  </g></g>&#10;</svg>
diff --git a/app/static/medwings/images/misc/hamburger.svg b/app/static/medwings/images/misc/hamburger.svg
new file mode 100644
index 0000000..26452b8
--- /dev/null
+++ b/app/static/medwings/images/misc/hamburger.svg
@@ -0,0 +1,31 @@
+<svg width="512mm" height="512mm" viewBox="0 0 512 512" id="hamburger">
+  <g id="hamburger-all" transform="translate(0,-18.119038)">
+    <path
+       style="fill:#010202;fill-opacity:1;stroke:#000000;stroke-width:2.2225;stroke-linecap:square;stroke-linejoin:round;stroke-miterlimit:15.6;stroke-dasharray:none;stroke-opacity:1"
+       id="hamburger-top"
+       width="427.90082"
+       height="45.731606"
+       x="46.167351"
+       y="69.705063"
+       d="M 69.450684,69.705063 H 450.78484 a 23.283333,23.283333 45 0 1 23.28333,23.283333 22.869615,22.869615 136.04611 0 1 -23.28333,22.448274 H 69.450684 A 23.283333,23.283333 45 0 1 46.167351,92.153335 22.869615,22.869615 136.04611 0 1 69.450684,69.705063 Z"
+       transform="translate(-4.1177597,40.551704)" />
+    <path
+       style="fill:#010202;fill-opacity:1;stroke:#000000;stroke-width:2.2225;stroke-linecap:square;stroke-linejoin:round;stroke-miterlimit:15.6;stroke-dasharray:none;stroke-opacity:1"
+       id="hamburger-middle"
+       width="427.90082"
+       height="45.731606"
+       x="46.167351"
+       y="69.705063"
+       d="M 69.450684,69.705063 H 450.78484 a 23.283333,23.283333 45 0 1 23.28333,23.283333 22.869615,22.869615 136.04611 0 1 -23.28333,22.448274 H 69.450684 A 23.283333,23.283333 45 0 1 46.167351,92.153335 22.869615,22.869615 136.04611 0 1 69.450684,69.705063 Z"
+       transform="translate(-4.1177597,181.54817)" />
+    <path
+       style="fill:#010202;fill-opacity:1;stroke:#000000;stroke-width:2.2225;stroke-linecap:square;stroke-linejoin:round;stroke-miterlimit:15.6;stroke-dasharray:none;stroke-opacity:1"
+       id="hamburger-bottom"
+       width="427.90082"
+       height="45.731606"
+       x="46.167351"
+       y="69.705063"
+       d="M 69.450684,69.705063 H 450.78484 a 23.283333,23.283333 45 0 1 23.28333,23.283333 22.869615,22.869615 136.04611 0 1 -23.28333,22.448274 H 69.450684 A 23.283333,23.283333 45 0 1 46.167351,92.153335 22.869615,22.869615 136.04611 0 1 69.450684,69.705063 Z"
+       transform="translate(-4.1177597,322.54464)" />
+  </g>
+</svg>
diff --git a/assets/css/fonts.css b/assets/css/fonts.css
index 4204595..b145627 100644
--- a/assets/css/fonts.css
+++ b/assets/css/fonts.css
@@ -370,10 +370,40 @@
 }
 
 
-/* NotoColorEmoji */
+/* PlayfairDisplaySC */
 @font-face {
-    font-family: 'NotoColorEmoji';
-    src: url('/assets/fonts/notocoloremoji/notocoloremoji-regular.ttf') format('truetype');
+    font-family: 'PlayfairDisplaySC';
+    src: url('/assets/fonts/playfairdisplaysc/playfairdisplaysc-regular.ttf') format('truetype');
     font-weight: 400;
     font-style: normal;
 }
+@font-face {
+    font-family: 'PlayfairDisplaySC';
+    src: url('/assets/fonts/playfairdisplaysc/playfairdisplaysc-regular-italic.ttf') format('truetype');
+    font-weight: 400;
+    font-style: italic;
+}
+@font-face {
+    font-family: 'PlayfairDisplaySC';
+    src: url('/assets/fonts/playfairdisplaysc/playfairdisplaysc-bold.ttf') format('truetype');
+    font-weight: 700;
+    font-style: normal;
+}
+@font-face {
+    font-family: 'PlayfairDisplaySC';
+    src: url('/assets/fonts/playfairdisplaysc/playfairdisplaysc-bold-italic.ttf') format('truetype');
+    font-weight: 700;
+    font-style: italic;
+}
+@font-face {
+    font-family: 'PlayfairDisplaySC';
+    src: url('/assets/fonts/playfairdisplaysc/playfairdisplaysc-black.ttf') format('truetype');
+    font-weight: 900;
+    font-style: normal;
+}
+@font-face {
+    font-family: 'PlayfairDisplaySC';
+    src: url('/assets/fonts/playfairdisplaysc/playfairdisplaysc-black-italic.ttf') format('truetype');
+    font-weight: 900;
+    font-style: italic;
+}
diff --git a/assets/css/styles.css b/assets/css/styles.css
index 6f95eda..cf0b01e 100644
--- a/assets/css/styles.css
+++ b/assets/css/styles.css
@@ -8,10 +8,17 @@ h1, h2, h3, h4, h5, h6 {
   font-weight: 600;
   font-style: normal;
   text-align: center;
+  line-height: 1;
 }
 
 h1 {
-  font-size: 3rem;  
+  font-size: 3rem;
+  @apply text-primary-200;
+}
+
+h1.title {
+  @apply font-title font-bold;
+  @apply underline text-secondary-500/90;
 }
 
 h2 {
@@ -34,59 +41,68 @@ h6 {
   font-size: 1rem;
 }
 
+p {
+  @apply text-center sm:text-start;
+}
+
 input {
   @apply rounded rounded-md drop-shadow-sm px-2 py-1;
-  @apply bg-accent-100;
+  @apply bg-secondary/25;
   @apply w-full;
 }
 
 input[type="submit"] {
   @apply rounded rounded-lg drop-shadow-md px-4 py-2;
-  @apply bg-accent-600;
+  @apply bg-secondary hover:bg-secondary-600;
+  @apply cursor-pointer;
   @apply font-semibold;
   @apply hover:drop-shadow-xl;
 }
 
 select {
   @apply rounded rounded-md drop-shadow-sm px-2 py-1;
-  @apply bg-accent-100;
+  @apply bg-secondary/25;
   @apply w-full;
 }
 
 select.error {
-  @apply border border-failure;
+  @apply border-2 border-failure/50;
 }
 
 input.error {
-  @apply border border-failure;
+  @apply border-2 border-failure/50;
 }
 
 fieldset {
-  @apply border border-accent p-4;
+  @apply border border-secondary p-4;
 }
 legend {
-  @apply text-sm text-accent-600 px-2;
+  @apply text-sm text-secondary px-2;
+}
+label {
+  @apply text-sm text-secondary/75 font-semibold;
 }
 
-a {
-  @apply underline text-primary-300;
+a:not(.btn, .btn-outline) {
+  @apply underline text-secondary;
 }
 
 .btn {
   text-align: center;
-  @apply rounded rounded-lg drop-shadow-md px-4 py-2;
-  @apply bg-accent-600;
-  @apply font-semibold;
+  @apply rounded rounded-lg drop-shadow-md px-2 py-1;
+  @apply bg-accent hover:bg-accent-600;
+  @apply font-semibold text-primary-100 hover:text-primary-200;
   @apply hover:drop-shadow-xl;
+  @apply border-2 border-accent hover:border-accent-700;
 }
 
 .btn-outline {
   text-align: center;
-  @apply rounded rounded-lg drop-shadow-md px-4 py-2;
-  @apply text-accent-600 bg-accent-600/10;
-  @apply border-2 border-accent-600;
-  @apply font-semibold;
+  @apply rounded rounded-lg drop-shadow-md px-2 py-1;
+  @apply bg-transparent hover:bg-accent-600;
+  @apply font-semibold text-accent hover:text-primary-100;
   @apply hover:drop-shadow-xl;
+  @apply border-2 border-accent hover:border-accent-700;
 }
 
 body.global {
@@ -94,6 +110,7 @@ body.global {
   width: 100%;
   display: flex;
   flex-direction: column;
+  @apply bg-gradient-to-b from-primary-900/75 via-background to-primary-900/75;
 }
 
 header.global, main.global, footer.global {
@@ -118,17 +135,24 @@ div.status-message {
 }
 
 div.status-message.error {
-  @apply font-semibold bg-failure/50 border border-failure;
+  @apply italic text-failure-300 bg-failure/50 border border-failure;
 }
 
 div.call-to-action-box {
   @apply bg-gradient-to-r from-secondary-300/75 to-secondary-500/75;
   @apply rounded-md py-4 px-6;
+  @apply text-center sm:text-start;
 }
 
 .loader {
   overflow: hidden;
 }
+.loader.loader-bar {
+  @apply h-1 bg-accent rounded rounded-full;
+}
+.loader.loader-value {
+  @apply font-bold text-end;
+}
 
 .loader--loading {
   animation: loading 2s infinite linear;
@@ -187,3 +211,104 @@ div.call-to-action-box {
     opacity: 1;
   }
 }
+
+#logo-wings {
+  animation: logowings 2s ease-in-out infinite alternate;
+}
+#logo-wings--subtle {
+  animation: logowings-subtle 2s ease-in-out infinite alternate;
+}
+#logo-heart {
+  animation: logoheart 1s linear infinite;
+  transform-origin: center;
+}
+#logo-heart--subtle {
+  animation: logoheart-subtle 1s linear infinite;
+  transform-origin: center;
+}
+#logo-blips {
+  animation: logoblips 6s linear infinite;
+  transform-origin: bottom;
+  transform-box: fill-box;
+}
+#logo-blips--subtle {
+  animation: logoblips-subtle 6s linear infinite;
+  transform-origin: bottom;
+  transform-box: fill-box;
+}
+
+@keyframes logowings {
+  0% {
+    transform: translateY(0%);
+  }
+
+  100% {
+    transform: translateY(5%);
+  }
+}
+@keyframes logowings-subtle {
+  0% {
+    transform: translateY(5%);
+  }
+
+  100% {
+    transform: translateY(8%);
+  }
+}
+
+@keyframes logoheart {
+  0%, 25%, 50%, 100% {
+    transform: scale(100%);
+  }
+
+  12%, 37% {
+    transform: scale(105%);
+  }
+}
+@keyframes logoheart-subtle {
+  0%, 25%, 50%, 100% {
+    transform: scale(100%);
+  }
+
+  12%, 37% {
+    transform: scale(102%);
+  }
+}
+
+@keyframes logoblips {
+  0% {
+    transform: rotateY(0deg)
+  }
+
+  5%, 100% {
+    transform: rotateY(360deg);
+  }
+}
+@keyframes logoblips-subtle {
+  0% {
+    transform: rotateY(0deg)
+  }
+
+  5%, 100% {
+    transform: rotateY(360deg);
+  }
+}
+
+path.hamburger-path {
+  @apply fill-secondary stroke-secondary;
+}
+
+#hamburger-content.hamburger--closed {
+  @apply hidden sm:flex;
+}
+#hamburger-content.hamburger--open {
+  @apply flex;
+}
+#hamburger-svg.hamburger--open {
+  transform-origin: center;
+  transform: rotate(90deg);
+}
+#hamburger-svg.hamburger--closed {
+  transform-origin: center;
+  transform: rotate(0deg);
+}
diff --git a/assets/fonts/notocoloremoji/notocoloremoji-regular.ttf b/assets/fonts/notocoloremoji/notocoloremoji-regular.ttf
deleted file mode 100644
index 8ebcc8f..0000000
Binary files a/assets/fonts/notocoloremoji/notocoloremoji-regular.ttf and /dev/null differ
diff --git a/assets/fonts/playfairdisplaysc/playfairdisplaysc-black-italic.ttf b/assets/fonts/playfairdisplaysc/playfairdisplaysc-black-italic.ttf
new file mode 100644
index 0000000..e423fa0
Binary files /dev/null and b/assets/fonts/playfairdisplaysc/playfairdisplaysc-black-italic.ttf differ
diff --git a/assets/fonts/playfairdisplaysc/playfairdisplaysc-black.ttf b/assets/fonts/playfairdisplaysc/playfairdisplaysc-black.ttf
new file mode 100644
index 0000000..7d50fe3
Binary files /dev/null and b/assets/fonts/playfairdisplaysc/playfairdisplaysc-black.ttf differ
diff --git a/assets/fonts/playfairdisplaysc/playfairdisplaysc-bold-italic.ttf b/assets/fonts/playfairdisplaysc/playfairdisplaysc-bold-italic.ttf
new file mode 100644
index 0000000..036c404
Binary files /dev/null and b/assets/fonts/playfairdisplaysc/playfairdisplaysc-bold-italic.ttf differ
diff --git a/assets/fonts/playfairdisplaysc/playfairdisplaysc-bold.ttf b/assets/fonts/playfairdisplaysc/playfairdisplaysc-bold.ttf
new file mode 100644
index 0000000..d5a1aff
Binary files /dev/null and b/assets/fonts/playfairdisplaysc/playfairdisplaysc-bold.ttf differ
diff --git a/assets/fonts/playfairdisplaysc/playfairdisplaysc-regular-italic.ttf b/assets/fonts/playfairdisplaysc/playfairdisplaysc-regular-italic.ttf
new file mode 100644
index 0000000..6220854
Binary files /dev/null and b/assets/fonts/playfairdisplaysc/playfairdisplaysc-regular-italic.ttf differ
diff --git a/assets/fonts/playfairdisplaysc/playfairdisplaysc-regular.ttf b/assets/fonts/playfairdisplaysc/playfairdisplaysc-regular.ttf
new file mode 100644
index 0000000..f3caa71
Binary files /dev/null and b/assets/fonts/playfairdisplaysc/playfairdisplaysc-regular.ttf differ
diff --git a/tailwind.config.js b/tailwind.config.js
index faccd43..1e320dd 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -4,70 +4,119 @@ export default {
   theme: {
     extend: {
       fontFamily: {
-        sans: ["Montserrat", "NotoColorEmoji"],
-        serif: ["Lora", "NotoColorEmoji"],
-        mono: ["SourceCodePro", "NotoColorEmoji"],
-        accent: ["Kanit", "NotoColorEmoji"],
-        emoji: ["NotoColorEmoji"],
+        sans: ["Montserrat"],
+        serif: ["Lora"],
+        mono: ["SourceCodePro"],
+        accent: ["Kanit"],
+        title: ["PlayfairDisplaySC"]
       },
       colors: {
         transparent: "transparent",
         current: "currentColor",
         primary: {
-          50:      "#D5E8EC",
-          100:     "#9CCAD3",
-          200:     "#4B9AAA",
-          300:     "#326671",
-          400:     "#1F4047",
-          500:     "#0D1B1E",
-          DEFAULT: "#0D1B1E",
-          600:     "#0C191C",
-          700:     "#070F11",
-          800:     "#040809",
-          900:     "#000000",
+          50:      "#050511",
+          100:     "#0F0E35",
+          200:     "#19165A",
+          300:     "#23207F",
+          400:     "#2D2AA3",
+          500:     "#323a8a",
+          DEFAULT: "#323a8a",
+          600:     "#575DA2",
+          700:     "#7D81BA",
+          800:     "#A2A4D2",
+          900:     "#C8C8EB",
         },
         secondary: {
-          50:      "#F3F7F5",
-          100:     "#DBE6E2",
-          200:     "#B6CDC5",
-          300:     "#9EBDB2",
-          400:     "#86AC9F",
-          500:     "#6C9A8B",
-          DEFAULT: "#6C9A8B",
-          600:     "#5B8677",
-          700:     "#4A6D61",
-          800:     "#3A554B",
-          900:     "#192420",
+          50:      "#0A1515",
+          100:     "#123839",
+          200:     "#1A5C5E",
+          300:     "#228083",
+          400:     "#2AA5A8",
+          500:     "#4bb1bd",
+          DEFAULT: "#4bb1bd",
+          600:     "#71C3C6",
+          700:     "#97D4D0",
+          800:     "#BCE6DA",
+          900:     "#E2F7E5",
         },
         accent: {
-          50:      "#FFF9EB",
-          100:     "#FFEDC2",
-          200:     "#FFE7AD",
-          300:     "#FFDA85",
-          400:     "#FFCE5C",
-          500:     "#FFC233",
-          DEFAULT: "#FFC233",
-          600:     "#FFB60A",
-          700:     "#E09D00",
-          800:     "#A37200",
-          900:     "#523900",
+          50:      "#33000b",
+          100:     "#660015",
+          200:     "#99001f",
+          300:     "#cc0029",
+          400:     "#e04159",
+          500:     "#e85a6a",
+          DEFAULT: "#e85a6a",
+          600:     "#f0747b",
+          700:     "#f88d8d",
+          800:     "#fda6a6",
+          900:     "#ffbfbe",
         },
         background: {
-          50:      "#FFFFFF",
-          100:     "#FFFFFF",
-          200:     "#FFFFFF",
-          300:     "#FFFFFF",
-          400:     "#FFFFFF",
-          500:     "#FCFCFC",
-          DEFAULT: "#FCFCFC",
-          600:     "#CCCCCC",
-          700:     "#A3A3A3",
-          800:     "#707070",
-          900:     "#333333",
+          50:      "#0D0C0B",
+          100:     "#28251F",
+          200:     "#444133",
+          300:     "#605D48",
+          400:     "#7C785D",
+          500:     "#fcfbf8",
+          DEFAULT: "#fcfbf8",
+          600:     "#FDFDF6",
+          700:     "#FDFEFA",
+          800:     "#FEFFFD",
+          900:     "#FFFFFF",
+        },
+        text: {
+          50:      "#0A0A0A",
+          100:     "#141414",
+          200:     "#1F1F1F",
+          300:     "#292929",
+          400:     "#343434",
+          500:     "#202120",
+          DEFAULT: "#202120",
+          600:     "#5B5B5B",
+          700:     "#767676",
+          800:     "#919191",
+          900:     "#ADADAD",
+        },
+        success: {
+          50:      "#001400",
+          100:     "#002800",
+          200:     "#003D00",
+          300:     "#005100",
+          400:     "#006600",
+          500:     "#00CC00",
+          DEFAULT: "#00CC00",
+          600:     "#33D133",
+          700:     "#66D766",
+          800:     "#99DD99",
+          900:     "#CCE3CC",
+        },
+        warning: {
+          50:      "#191200",
+          100:     "#332400",
+          200:     "#4D3600",
+          300:     "#664800",
+          400:     "#805A00",
+          500:     "#EDC000",
+          DEFAULT: "#EDC000",
+          600:     "#EFD133",
+          700:     "#F1E266",
+          800:     "#F4F399",
+          900:     "#F7F4CC",
+        },
+        failure: {
+          50:      "#190000",
+          100:     "#320000",
+          200:     "#4C0000",
+          300:     "#660000",
+          400:     "#800000",
+          500:     "#E40000",
+          DEFAULT: "#E40000",
+          600:     "#E43333",
+          700:     "#E46666",
+          800:     "#E69999",
+          900:     "#E9CCCC",
         },
-        success: "#00CC00",
-        warning: "#EDC000",
-        failure: "#E40000",
       },
       screens: {
         '3xl': '1920px',