diff --git a/app/src/main/kotlin/views/BaseView.kt b/app/src/main/kotlin/views/BaseView.kt
index 7e5bc75..4c4a390 100644
--- a/app/src/main/kotlin/views/BaseView.kt
+++ b/app/src/main/kotlin/views/BaseView.kt
@@ -13,7 +13,7 @@ class BaseView(staticFileResolver: StaticFileResolver) : View(staticFileResolver
         jwtPayload = jwtPayload
     ) {
         section("text-center my-2 p-2") {
-            h1("text-5xl") {
+            h1("text-5xl casual") {
                 span("text-teal-300") { +"Simplenotes " }
                 +"- access your notes anywhere"
             }
diff --git a/app/src/main/kotlin/views/SettingView.kt b/app/src/main/kotlin/views/SettingView.kt
index 6a00e33..b39fc7d 100644
--- a/app/src/main/kotlin/views/SettingView.kt
+++ b/app/src/main/kotlin/views/SettingView.kt
@@ -32,8 +32,8 @@ class SettingView(staticFileResolver: StaticFileResolver) : View(staticFileResol
                 }
 
                 form(method = FormMethod.post, action = "/export") {
-                    button(name = "display", classes = "btn btn-teal block", type = submit) { +"Display my data" }
-                    button(name = "download", classes = "btn btn-green block mt-2", type = submit) {
+                    button(name = "display", classes = "inline btn btn-teal block", type = submit) { +"Display my data" }
+                    button(name = "download", classes = "inline btn btn-green block ml-2 mt-2", type = submit) {
                         +"Download my data"
                     }
                 }
diff --git a/css/src/font-variants.pcss b/css/src/font-variants.pcss
new file mode 100644
index 0000000..c9a526f
--- /dev/null
+++ b/css/src/font-variants.pcss
@@ -0,0 +1,3 @@
+.casual {
+    --CASL : 1;
+}
diff --git a/css/src/navbar.pcss b/css/src/navbar.pcss
index dc6540a..5596b95 100644
--- a/css/src/navbar.pcss
+++ b/css/src/navbar.pcss
@@ -6,8 +6,7 @@
         @apply text-2xl text-gray-100 font-bold;
 
         &:hover {
-            @apply text-blue-300 font-extrabold;
-            --CASL: 1;
+            @apply text-blue-300 font-extrabold casual;
         }
     }
 
@@ -26,8 +25,7 @@
             @apply text-gray-100 font-semibold;
 
             &:hover {
-                @apply text-blue-300 font-bold;
-                --CASL: 1;
+                @apply text-blue-300 font-bold casual;
             }
         }
     }
diff --git a/css/src/other.pcss b/css/src/other.pcss
index dfccd91..b08e440 100644
--- a/css/src/other.pcss
+++ b/css/src/other.pcss
@@ -6,8 +6,7 @@
     }
 
     &:hover {
-        @apply bg-teal-800 text-white;
-        --CASL: 1;
+        @apply bg-teal-800 text-white casual;
     }
 
     &.disabled {
diff --git a/css/src/styles.pcss b/css/src/styles.pcss
index 3e0e19a..e914195 100644
--- a/css/src/styles.pcss
+++ b/css/src/styles.pcss
@@ -7,6 +7,7 @@
 @import "tailwindcss/components";
 
 @import "./button.pcss";
+@import "./font-variants.pcss";
 @import "./hljs.pcss";
 @import "./navbar.pcss";
 @import "./note-table.pcss";