diff --git a/src/android/variables.gradle b/src/android/variables.gradle
index 3c505d1c..fae28f09 100644
--- a/src/android/variables.gradle
+++ b/src/android/variables.gradle
@@ -1,8 +1,8 @@
 ext {
     minSdkVersion = 22
     firebaseMessagingVersion = '23.0.5'
-    compileSdkVersion = 34
-    targetSdkVersion = 34
+    compileSdkVersion = 33
+    targetSdkVersion = 33
     androidxActivityVersion = '1.7.0'
     androidxAppCompatVersion = '1.6.1'
     androidxCoordinatorLayoutVersion = '1.2.0'
diff --git a/src/angular.json b/src/angular.json
index c12d4816..02b445b1 100644
--- a/src/angular.json
+++ b/src/angular.json
@@ -83,7 +83,9 @@
         },
         "serve": {
           "builder": "@angular-devkit/build-angular:dev-server",
-          "options": {},
+          "options": {
+            "buildTarget": "dynamicbible:build"
+          },
           "configurations": {
             "production": {}
           }
diff --git a/src/src/app/app.component.scss b/src/src/app/app.component.scss
index a79f8a22..406e97c7 100644
--- a/src/src/app/app.component.scss
+++ b/src/src/app/app.component.scss
@@ -3,11 +3,12 @@
   min-width: 20rem;
 
   mat-icon {
-    padding-right: 1rem;
     color: var(--primary-color);
+    height: auto !important;
   }
 }
 
 mat-sidenav-content {
   overflow: hidden;
 }
+
diff --git a/src/src/app/components/add-to-page-modal/add-to-page-modal.component.scss b/src/src/app/components/add-to-page-modal/add-to-page-modal.component.scss
index c398cbb0..fd05d7a2 100644
--- a/src/src/app/components/add-to-page-modal/add-to-page-modal.component.scss
+++ b/src/src/app/components/add-to-page-modal/add-to-page-modal.component.scss
@@ -1,9 +1,5 @@
 .close-button {
   float: right;
-
-  mat-icon {
-    transform: scale(1.5);
-  }
 }
 
 .title {
diff --git a/src/src/app/components/help-modal/help-modal.component.scss b/src/src/app/components/help-modal/help-modal.component.scss
index e209bf43..05990985 100644
--- a/src/src/app/components/help-modal/help-modal.component.scss
+++ b/src/src/app/components/help-modal/help-modal.component.scss
@@ -1,9 +1,5 @@
 .close-button {
   float: right;
-
-  mat-icon {
-    transform: scale(1.5);
-  }
 }
 
 .title {
@@ -18,6 +14,7 @@
   font-size: var(--card-font-size);
   font-family: var(--card-font-family);
   line-height: calc(var(--card-font-size) + 0.68rem);
+  color: var(--card-color)
 }
 
 .paragraph-heading {
diff --git a/src/src/app/components/note/edit-modal/note-edit-modal.component.scss b/src/src/app/components/note/edit-modal/note-edit-modal.component.scss
index 8c4d1a5f..3e25b252 100644
--- a/src/src/app/components/note/edit-modal/note-edit-modal.component.scss
+++ b/src/src/app/components/note/edit-modal/note-edit-modal.component.scss
@@ -1,8 +1,5 @@
 .close-button {
   float: right;
-  mat-icon {
-    font-size: 2rem;
-  }
 }
 
 .title {
diff --git a/src/src/app/components/ok-cancel-modal/ok-cancel-modal.component.scss b/src/src/app/components/ok-cancel-modal/ok-cancel-modal.component.scss
index f9fbca8b..d3ce41cb 100644
--- a/src/src/app/components/ok-cancel-modal/ok-cancel-modal.component.scss
+++ b/src/src/app/components/ok-cancel-modal/ok-cancel-modal.component.scss
@@ -1,9 +1,5 @@
 .close-button {
   float: right;
-
-  mat-icon {
-    transform: scale(1.5);
-  }
 }
 
 .title {
diff --git a/src/src/app/components/page-edit-modal/page-edit-modal.component.scss b/src/src/app/components/page-edit-modal/page-edit-modal.component.scss
index 9c2d81a4..c3c7f766 100644
--- a/src/src/app/components/page-edit-modal/page-edit-modal.component.scss
+++ b/src/src/app/components/page-edit-modal/page-edit-modal.component.scss
@@ -1,9 +1,5 @@
 .close-button {
   float: right;
-
-  mat-icon {
-    transform: scale(1.5);
-  }
 }
 
 .title {
diff --git a/src/src/app/components/settings/settings.component.html b/src/src/app/components/settings/settings.component.html
index d2ae704c..73cd19af 100644
--- a/src/src/app/components/settings/settings.component.html
+++ b/src/src/app/components/settings/settings.component.html
@@ -114,8 +114,19 @@
       min="12"
       step="2"
       thumbLabel="true"
-      [(ngModel)]="cardFontSize"
-     #ngSlider><input matSliderThumb (change)="cardFontSizeChanged({source: ngSliderThumb, parent: ngSlider, value: ngSliderThumb.value})" #ngSliderThumb="matSliderThumb" />
+      #ngSlider
+      ><input
+        matSliderThumb
+        [(ngModel)]="cardFontSize"
+        (change)="
+          cardFontSizeChanged({
+            source: ngSliderThumb,
+            parent: ngSlider,
+            value: ngSliderThumb.value
+          })
+        "
+        #ngSliderThumb="matSliderThumb"
+      />
     </mat-slider>
   </div>
 </mat-nav-list>
diff --git a/src/src/app/components/settings/settings.component.scss b/src/src/app/components/settings/settings.component.scss
index be2ba65f..05bf3a7b 100644
--- a/src/src/app/components/settings/settings.component.scss
+++ b/src/src/app/components/settings/settings.component.scss
@@ -11,3 +11,9 @@
 .auth-button {
   width: 100%;
 }
+
+button>.mat-icon, .mat-mdc-outlined-button>.mat-icon {
+    font-size: 1.125rem !important;
+    height: 1.125rem !important;
+    width: 1.125rem !important;
+}
diff --git a/src/src/app/components/strongs/card/strongs-card.component.html b/src/src/app/components/strongs/card/strongs-card.component.html
index e4e5e9c1..708f6252 100644
--- a/src/src/app/components/strongs/card/strongs-card.component.html
+++ b/src/src/app/components/strongs/card/strongs-card.component.html
@@ -16,8 +16,8 @@
   <app-strongs
     [data]="cardItem.data"
     [isCard]="true"
-    (openPassage)="triggerOpenPassage($event)"
-    (openStrongs)="triggerOpenStrongs($event)"
+    (openPassage)="openPassage($event)"
+    (openStrongs)="openStrongs($event)"
   ></app-strongs>
 </div>
 <div class="card-actions">
diff --git a/src/src/app/components/strongs/card/strongs-card.component.ts b/src/src/app/components/strongs/card/strongs-card.component.ts
index d97fc1fb..a54aa5d5 100644
--- a/src/src/app/components/strongs/card/strongs-card.component.ts
+++ b/src/src/app/components/strongs/card/strongs-card.component.ts
@@ -33,8 +33,8 @@ export class StrongsCardComponent extends CardComponent {
   }
 
   async openStrongs(q: string) {
-    const dict = q.substr(0, 1) === 'H' ? 'heb' : 'grk';
-    const sn = q.substr(1);
+    const dict = q.substring(0, 1) === 'H' ? 'heb' : 'grk';
+    const sn = q.substring(1);
     if (this.asModal) {
       const card = await this.appService.getStrongsCard(sn, dict);
       this.dialog.open(StrongsModalComponent, {
diff --git a/src/src/app/components/strongs/modal/strongs-modal.component.html b/src/src/app/components/strongs/modal/strongs-modal.component.html
index feeeceff..e58873b6 100644
--- a/src/src/app/components/strongs/modal/strongs-modal.component.html
+++ b/src/src/app/components/strongs/modal/strongs-modal.component.html
@@ -1,4 +1,3 @@
-<div mat-dialog-title>
   <mat-toolbar>
     <mat-icon aria-hidden="false" aria-label="Strongs Entry Icon">{{
       icon$ | async
@@ -14,7 +13,6 @@
       </button>
     </span>
   </mat-toolbar>
-</div>
 <mat-dialog-content class="content">
   <br />
   <app-strongs
diff --git a/src/src/app/components/strongs/modal/strongs-modal.component.scss b/src/src/app/components/strongs/modal/strongs-modal.component.scss
index af96e7f4..7659e452 100644
--- a/src/src/app/components/strongs/modal/strongs-modal.component.scss
+++ b/src/src/app/components/strongs/modal/strongs-modal.component.scss
@@ -1,14 +1,10 @@
 .close-button {
   float: right;
-
-  mat-icon {
-    transform: scale(1.5);
-  }
 }
 
 .title {
   width: 100%;
-  padding-left: 1rem;
+  padding-left: 1.2rem;
   font-size: 1.5rem;
 }
 
@@ -17,6 +13,7 @@
   font-size: var(--card-font-size);
   font-family: var(--card-font-family);
   line-height: calc(var(--card-font-size) + 0.5rem);
+  color: var(--card-color)
 }
 
 mat-toolbar {
diff --git a/src/src/app/components/strongs/strongs.component.html b/src/src/app/components/strongs/strongs.component.html
index c6ba2a24..da35e964 100644
--- a/src/src/app/components/strongs/strongs.component.html
+++ b/src/src/app/components/strongs/strongs.component.html
@@ -6,7 +6,7 @@
       - {{ data.def.p }} - {{ data.def.lemma }} -
       <span *ngFor="let part of data.def.de"
         ><ng-template [ngIf]="part.sn"
-          ><a (click)="openStrongs(part.sn)">{{ part.sn }}</a></ng-template
+          ><a (click)="triggerOpenStrongs(part.sn)">{{ part.sn }}</a></ng-template
         ><ng-template [ngIf]="part.w"
           ><span [innerHTML]="part.w"></span></ng-template></span
       ><br />
@@ -32,7 +32,7 @@
           <strong>{{ wrd.w }}, {{ wrd.rs.length }}</strong
           >:
           <span *ngFor="let p of wrd.rs"
-            ><a (click)="openPassage(p.r)">{{ makePassage(p.r) }}</a
+            ><a (click)="triggerOpenPassage(p.r)">{{ makePassage(p.r) }}</a
             >,
           </span>
         </dd>
diff --git a/src/src/app/components/verse-picker-modal/verse-picker-modal.component.scss b/src/src/app/components/verse-picker-modal/verse-picker-modal.component.scss
index d0ac23f1..5e0c868f 100644
--- a/src/src/app/components/verse-picker-modal/verse-picker-modal.component.scss
+++ b/src/src/app/components/verse-picker-modal/verse-picker-modal.component.scss
@@ -37,10 +37,6 @@
   line-height: 1.5rem;
   padding: 1rem;
   margin: 1rem 0 1rem 0;
-
-  mat-icon {
-    line-height: 1.3rem;
-  }
 }
 
 .backbutton:hover:not(.disable-hover) {
@@ -55,10 +51,6 @@ h2 {
 
 .close-button {
   float: right;
-
-  mat-icon {
-    transform: scale(1.5);
-  }
 }
 
 .title {
diff --git a/src/src/app/pages/search/search.page.html b/src/src/app/pages/search/search.page.html
index c5cc2e70..9ba70f22 100644
--- a/src/src/app/pages/search/search.page.html
+++ b/src/src/app/pages/search/search.page.html
@@ -40,22 +40,22 @@
       <app-passage-card
         *ngIf="isPassage(item)"
         [cardItem]="item"
-        (onClose)="removeCard(item)"
+        (closeCard)="removeCard(item)"
       ></app-passage-card>
       <app-strongs-card
         *ngIf="isStrongs(item)"
         [cardItem]="item"
-        (onClose)="removeCard(item)"
+        (closeCard)="removeCard(item)"
       ></app-strongs-card>
       <app-words-card
         *ngIf="isWords(item)"
         [cardItem]="item"
-        (onClose)="removeCard(item)"
+        (closeCard)="removeCard(item)"
       ></app-words-card>
       <app-note-card
         *ngIf="isNote(item)"
         [cardItem]="item"
-        (onClose)="removeCard(item)"
+        (closeCard)="removeCard(item)"
       ></app-note-card>
     </mat-card>
   </ng-container>
diff --git a/src/src/app/pages/search/search.page.scss b/src/src/app/pages/search/search.page.scss
index 8d081335..13fba9f8 100644
--- a/src/src/app/pages/search/search.page.scss
+++ b/src/src/app/pages/search/search.page.scss
@@ -10,7 +10,7 @@ mat-card {
   width: 100%;
   position: relative;
   margin-left: 6px;
-  margin-right: 60px;
+  margin-right: 6px;
 }
 
 .search-bar-input {
diff --git a/src/src/app/services/nav.service.ts b/src/src/app/services/nav.service.ts
index 7653b3f5..7eb25468 100644
--- a/src/src/app/services/nav.service.ts
+++ b/src/src/app/services/nav.service.ts
@@ -14,28 +14,28 @@ export class NavService {
   }
 
   public openNav() {
-    return this.sidenav.open();
+    return this.sidenav?.open();
   }
 
   public async closeNav() {
-    const r = await this.sidenav.close();
+    const r = await this.sidenav?.close();
     return r;
   }
 
   public toggleNav(): void {
-    this.sidenav.toggle();
+    this.sidenav?.toggle();
   }
 
   public openSettings() {
-    return this.settings.open();
+    return this.settings?.open();
   }
 
   public async closeSettings() {
-    const r = await this.settings.close();
+    const r = await this.settings?.close();
     return r;
   }
 
   public toggleSettings(): void {
-    this.settings.toggle();
+    this.settings?.toggle();
   }
 }
diff --git a/src/src/index.html b/src/src/index.html
index 709197f7..002eec08 100644
--- a/src/src/index.html
+++ b/src/src/index.html
@@ -5,7 +5,7 @@
     <title>Dynamic Bible</title>
     <meta
       name="viewport"
-      content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"
+      content="viewport-fit=cover, width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no"
     />
     <meta name="format-detection" content="telephone=no" />
     <meta name="msapplication-tap-highlight" content="no" />
diff --git a/src/src/styles/app.scss b/src/src/styles/app.scss
index 7fd80c02..298113d1 100644
--- a/src/src/styles/app.scss
+++ b/src/src/styles/app.scss
@@ -24,6 +24,9 @@ html {
 
   --page-color-primary: rgb(46, 42, 54);
   --page-color-accent: rgb(111, 109, 116);
+
+  --mat-toolbar-title-text-size: 16pt;
+  --mdc-list-list-item-label-text-size: 14pt;
 }
 
 body {
@@ -41,6 +44,13 @@ body {
   color: #777;
 }
 
+mat-icon {
+  font-size: 1.2em !important;
+  height: 30px !important;
+  width: 30px !important;
+  vertical-align: text-top;
+}
+
 .card-title {
   font-size: 1.5rem;
   font-family: "Roboto Condensed";
@@ -50,8 +60,8 @@ body {
   border-top-right-radius: var(--card-border-radius);
   padding-right: 3.2rem;
 
-  mat-icon {
-   transform: scale(1.5);
+  > mat-icon {
+    vertical-align: text-top;
   }
 
   span {
@@ -71,8 +81,8 @@ body {
 
 .card-close-button {
   position: absolute !important;
-  right: 1.5rem;
-  top: 0.5rem;
+  right: 0.5rem;
+  top: 0.3rem;
 }
 
 .card-actions {
@@ -84,11 +94,6 @@ body {
   border-bottom-left-radius: var(--card-border-radius);
   border-bottom-right-radius: var(--card-border-radius);
   padding-top: 10px;
-
-  mat-icon {
-    transform: scale(1.2);
-   }
-
 }
 
 .card-actions-right {
@@ -204,7 +209,6 @@ p {
     max-width: 95vw !important;
     max-height: 95vh !important;
   }
-
   .mat-mdc-dialog-content {
     max-height: 95vh !important;
   }
diff --git a/src/src/styles/fonts.scss b/src/src/styles/fonts.scss
index feb04c5c..9bcf4182 100644
--- a/src/src/styles/fonts.scss
+++ b/src/src/styles/fonts.scss
@@ -19,6 +19,7 @@
   white-space: nowrap;
   word-wrap: normal;
   direction: ltr;
+  font-feature-settings: "liga";
   -webkit-font-feature-settings: "liga";
   -webkit-font-smoothing: antialiased;
 }