diff --git a/angular/src/app/components/social-media-buttons/social-media-buttons.component.scss b/angular/src/app/components/social-media-buttons/social-media-buttons.component.scss
index 6cd7512..af0f2ba 100644
--- a/angular/src/app/components/social-media-buttons/social-media-buttons.component.scss
+++ b/angular/src/app/components/social-media-buttons/social-media-buttons.component.scss
@@ -12,4 +12,4 @@
         align-items: center;
         justify-content: center;
     }
-}
\ No newline at end of file
+}
diff --git a/angular/src/app/presentation-options/default-option/components/navbar/navbar.component.scss b/angular/src/app/presentation-options/default-option/components/navbar/navbar.component.scss
index 2949102..0d6cf27 100644
--- a/angular/src/app/presentation-options/default-option/components/navbar/navbar.component.scss
+++ b/angular/src/app/presentation-options/default-option/components/navbar/navbar.component.scss
@@ -6,8 +6,7 @@
   box-sizing: border-box;
   padding: 12px 16px;
   width: 100%;
-  background: #231f20;
-  box-shadow: 0px 8px 16px rgba(17, 17, 17, 0.5);
+  background: var(--button-color);
   color: var(--button-text-color);
   display: grid;
   justify-content: space-between;
diff --git a/angular/src/app/presentation-options/default-option/components/social-media-buttons/social-media-buttons.component.scss b/angular/src/app/presentation-options/default-option/components/social-media-buttons/social-media-buttons.component.scss
index 6cd7512..109b400 100644
--- a/angular/src/app/presentation-options/default-option/components/social-media-buttons/social-media-buttons.component.scss
+++ b/angular/src/app/presentation-options/default-option/components/social-media-buttons/social-media-buttons.component.scss
@@ -7,9 +7,9 @@
         width: 48px;
         height: 48px;
         border-radius: 100%;
-        background: #333333;
+        background: var(--button-color);
         display: flex;
         align-items: center;
         justify-content: center;
     }
-}
\ No newline at end of file
+}
diff --git a/angular/src/styles.scss b/angular/src/styles.scss
index 910445d..e34ead8 100644
--- a/angular/src/styles.scss
+++ b/angular/src/styles.scss
@@ -46,6 +46,13 @@ hr {
     border-top: 1px solid #BDBDBD;
 }
 
+.mat-bottom-sheet-container {
+    box-shadow: 0px 8px 10px -5px rgba(255, 255, 255, 0.2), 0px 16px 24px 2px rgba(255, 255, 255, 0.14), 0px 6px 30px 5px rgba(255, 255, 255, 0.12);
+    background: var(--background-color);
+    color: var(--text-color);
+}
+
+
 .mat-form-field-appearance-outline .mat-form-field-outline {
     color: var(--button-color_disabled) !important;
 }