diff --git a/frontend/src/components/SpeechboxArrow.js b/frontend/src/components/SpeechboxArrow.js
index 86368f6c..3d4f5c2c 100644
--- a/frontend/src/components/SpeechboxArrow.js
+++ b/frontend/src/components/SpeechboxArrow.js
@@ -49,10 +49,10 @@ const SpeechTextboxArrow = React.memo(
     }, []);
 
     const diffStyles = {
-      top: { margin: "margin-bottom", rotation: 0, align: "flex-end" },
-      bottom: { margin: "margin-top", rotation: 180, align: "flex-start" },
-      left: { margin: "margin-right", rotation: 270, align: "flex-start" },
-      right: { margin: "margin-left", rotation: 90, align: "flex-end" },
+      top: { margin: "marginBottom", rotation: 0, align: "flex-end" },
+      bottom: { margin: "marginTop", rotation: 180, align: "flex-start" },
+      left: { margin: "marginRight", rotation: 270, align: "flex-start" },
+      right: { margin: "marginLeft", rotation: 90, align: "flex-end" },
     }[arrowLocation];
 
     return (
diff --git a/frontend/src/components/TimerComponent/Notification.js b/frontend/src/components/TimerComponent/Notification.js
index 4e96829b..cd77d088 100644
--- a/frontend/src/components/TimerComponent/Notification.js
+++ b/frontend/src/components/TimerComponent/Notification.js
@@ -48,7 +48,7 @@ function Notification({ setTime, sceneTime }) {
             variant="contained"
             color="black"
             onClick={handleClose}
-            style={{ "margin-left": "10%" }}
+            style={{ marginLeft: "10%" }}
           >
             Continue
           </Button>