diff --git a/src/components/CableDetailComponent.js b/src/components/CableDetailComponent.js
index 9f6d0f5..d0645a8 100644
--- a/src/components/CableDetailComponent.js
+++ b/src/components/CableDetailComponent.js
@@ -246,8 +246,8 @@ export default class CableDetailComponent extends Component {
         right: "auto",
         bottom: "auto",
         marginRight: "-50%",
-        width: "30%",
-        height: "30%",
+        width: "auto",
+        height: "auto",
         transform: "translate(-50%, -50%)",
         overflow: "hidden",
         display: "flex",
@@ -258,6 +258,8 @@ export default class CableDetailComponent extends Component {
         background:
           "linear-gradient(-30deg, rgb(187, 194, 236) 0%, rgba(255, 255, 255, 1) 100%)",
         boxShadow: "0 0 20px rgba(0, 0, 0, 0.5)",
+        minWidth: "30%",
+        minHeight: "30%"
       },
       overlay: {
         opacity: modalOpacity,
diff --git a/src/components/NavBar.js b/src/components/NavBar.js
index d29addc..334606d 100644
--- a/src/components/NavBar.js
+++ b/src/components/NavBar.js
@@ -92,8 +92,8 @@ export default class NavBar extends Component {
         right: "auto",
         bottom: "auto",
         marginRight: "-50%",
-        width: "30%",
-        height: "30%",
+        width: "auto",
+        height: "auto",
         transform: "translate(-50%, -50%)",
         overflow: "hidden",
         display: "flex",
@@ -104,6 +104,8 @@ export default class NavBar extends Component {
         background:
           "linear-gradient(-30deg, rgb(187, 194, 236) 0%, rgba(255, 255, 255, 1) 100%)",
         boxShadow: "0 0 20px rgba(0, 0, 0, 0.5)",
+        minWidth: "30%",
+        minHeight: "30%"
       },
       overlay: {
         opacity: modalOpacity,