diff --git a/frontend/src/components/BibleReader.tsx b/frontend/src/components/BibleReader.tsx
index f1563b25..1740eeef 100644
--- a/frontend/src/components/BibleReader.tsx
+++ b/frontend/src/components/BibleReader.tsx
@@ -41,11 +41,11 @@ const BibleReader: React.FC<BibleReaderProps> = ({ book, chapter, onBack, format
   const getFontSizeClass = () => {
     switch (fontSize) {
       case 'small':
-        return 'text-base';
+        return 'text-sm leading-relaxed';
       case 'large':
-        return 'text-xl';
+        return 'text-2xl leading-relaxed';
       default:
-        return 'text-lg';
+        return 'text-lg leading-relaxed';
     }
   };
 
@@ -142,7 +142,7 @@ const BibleReader: React.FC<BibleReaderProps> = ({ book, chapter, onBack, format
       </div>
 
       {/* Bible Content */}
-      <div className={`max-w-3xl mx-auto leading-relaxed ${getFontSizeClass()}`}>
+      <div className={`max-w-3xl mx-auto ${getFontSizeClass()}`}>
         {parseBibleText(content)}
       </div>
 
diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js
index 77882549..e1eeccfc 100644
--- a/frontend/tailwind.config.js
+++ b/frontend/tailwind.config.js
@@ -7,7 +7,8 @@ module.exports = {
   theme: {
     extend: {
       fontFamily: {
-        serif: ['Georgia', 'Times New Roman', 'serif'],
+        serif: ['Times New Roman', 'Georgia', 'serif'],
+        sans: ['Times New Roman', 'Georgia', 'serif'],
       },
       typography: {
         DEFAULT: {