fix modal and tab border

index.html

@@ -274,7 +274,7 @@
       <div class="modal-dialog modal-dialog-centered">
         <div class="modal-content">
           <div class="modal-body text-center">
-            <iframe width="345" height="190" frameborder="0" allowfullscreen="1" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" title="YouTube video player" 
+            <iframe frameborder="0" allowfullscreen="1" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" title="YouTube video player" 
               id="widget2"></iframe>
           </div>
         </div>

sass/main.css

@@ -230,6 +230,7 @@ body {
   height: 100%;
   left: -2px;
   top: 3px;
+  border: none;
   background-color: transparent;
   border-bottom: 3px solid #EE7800;
   opacity: 0;
@@ -1181,6 +1182,17 @@ body {
 #videoModal .modal-content {
   background-color: transparent;
   border: none;
+  height: 30vh;
+}
+
+#videoModal .modal-content .modal-body {
+  width: 100%;
+  height: 100%;
+}
+
+#videoModal .modal-content iframe {
+  width: 100%;
+  height: 100%;
 }
 
 .fixed-btn {

sass/main.scss

@@ -187,6 +187,7 @@ body {
                     height: 100%;
                     left: -2px;
                     top: 3px;
+                    border: none;
                     background-color: transparent;
                     border-bottom: 3px solid #EE7800;
                     opacity: 0;
@@ -1004,6 +1005,17 @@ body {
 #videoModal .modal-content {
     background-color: transparent;
     border: none;
+    height: 30vh;
+}
+
+#videoModal .modal-content .modal-body {
+    width:100%; 
+    height:100%;
+}
+
+#videoModal .modal-content iframe {
+    width:100%; 
+    height:100%;
 }
 
 .fixed-btn {