diff --git a/static/css/custom.css b/static/css/custom.css
index 575a808..a6e609e 100644
--- a/static/css/custom.css
+++ b/static/css/custom.css
@@ -7,11 +7,43 @@
     color: #333; 
         } */
 /* ------------------------------------------------------------------ */
-@font-face {
+/*@font-face {
     font-family: 'Kurale';
     src: url('/static/fonts/Kurale-Regular.ttf') format('truetype');
     font-weight: normal;
     font-style: normal;
+}*/
+
+@font-face {
+    font-family: "IBM Plex Sans";
+    src: url("/static/fonts/IBM%20Plex%20Sans%20Var-Roman.woff2") format("woff2");
+    font-weight: 100 700;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: "IBM Plex Sans";
+    src: url("/static/fonts/IBM%20Plex%20Sans%20Var-Italic.woff2") format("woff2");
+    font-weight: 100 700;
+    font-style: italic;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: "IBM Plex Serif";
+    src: url("/static/fonts/IBM%20Plex%20Serif%20Var-Roman.woff2") format("woff2");
+    font-weight: 100 700;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: "IBM Plex Serif";
+    src: url("/static/fonts/IBM%20Plex%20Serif%20Var-Italic.woff2") format("woff2");
+    font-weight: 100 700;
+    font-style: italic;
+    font-display: swap;
 }
 
 header { border-bottom: 2px solid #003366; padding-bottom: 10px; margin-bottom: 30px; }
@@ -40,7 +72,7 @@ img { max-width: 100%; height: auto; display: block; margin: 20px auto; }
 /* background*/
 body {
     /* margin: 0; */
-    font-family: 'Kurale', sans-serif;
+    font-family: "IBM Plex Sans", Arial, sans-serif;
     /* font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; */
     max-width: 1000px; 
     margin: 20px auto;