removed bad logic and trying new approach for responsiveness

src/a_new_hope.html

@@ -120,6 +120,5 @@
     </div>
 
     <script src="js/audio-control.js"></script>
-    <script src="js/logo.js"></script>
   </body>
 </html>

src/attack_of_the_clones.html

@@ -119,7 +119,6 @@
     </div>
 
     <script src="js/audio-control.js"></script>
-    <script src="js/logo.js"></script>
     <script src="js/parallax.js"></script>
   </body>
 </html>

src/inc/main.css

@@ -443,6 +443,7 @@ body {
   background-attachment: scroll;
   background-color: #000000;
   margin: 0 auto;
+  overflow-x: hidden;
 }
 
 @media (max-width: 768px) {
@@ -1380,6 +1381,7 @@ a:after {
   display: flex;
   justify-content: center;
   align-items: center;
+  height: 70vh;
   animation: logo 7s ease-out 7s forwards;
   opacity: 0;
   overflow: hidden;
@@ -1409,6 +1411,10 @@ a:after {
     width: 150px;
   }
 
+  .logo {
+    height: 50vh;
+  }
+
   @keyframes logo {
     0% {
       transform: scale(1);
@@ -1424,6 +1430,10 @@ a:after {
     width: 100px;
   }
 
+  .logo {
+    height: 40vh;
+  }
+
   @keyframes logo {
     0% {
       transform: scale(1);

src/return_of_the_jedi.html

@@ -119,6 +119,5 @@
     </div>
 
     <script src="js/audio-control.js"></script>
-    <script src="js/logo.js"></script>
   </body>
 </html>

src/revenge_of_the_sith.html

@@ -119,6 +119,5 @@
     </div>
 
     <script src="js/audio-control.js"></script>
-    <script src="js/logo.js"></script>
   </body>
 </html>

src/the_empire_strikes_back.html

@@ -120,6 +120,5 @@
     </div>
 
     <script src="js/audio-control.js"></script>
-    <script src="js/logo.js"></script>
   </body>
 </html>

src/the_phantom_menace.html

@@ -120,6 +120,5 @@
     </div>
 
     <script src="js/audio-control.js"></script>
-    <script src="js/logo.js"></script>
   </body>
 </html>