visual improvements

assets/quotes.json

@@ -97,6 +97,10 @@ quotes = {
         {
             "author": "Professor Brand",
             "body": "I’m not afraid of death. I’m an old physicist. I’m afraid of time."
+        },
+        {
+            "author": "Dr. Amelia Brand",
+            "body": "We must confront the reality that nothing in our solar system can help us."
         }
     ]
 }

css/main.css

@@ -19,6 +19,7 @@ body {
 #mainTitle {
     font-family: 'Bebas Neue', cursive;
     font-size: 3em;
+    background-color: #2a5f82 !important;
 }
 
 .content {
@@ -51,6 +52,10 @@ footer p {
     margin-top: 15px;
 }
 
+footer a {
+    color: #2a5f82;;
+}
+
 #switchLang {
     transform: scale(1.5);
 }

index.html

@@ -39,10 +39,10 @@ <h2 id="afterTextTime">en el planeta Miller desde el estreno de la película en
         </section>
         <section id="btnSnapshot" class="py-2 text-center">
             <input id="btnGenSnapshot" class="btn btn-dark" onclick="takeSnapshot();" type="button" value="Screenshot">
-            <input id="btnPlayMusic" class="btn btn-dark px-3" onclick="playSoundtrack();" type="button" value="Música">
             <input id="btnShuffleQuote" class="btn btn-dark px-3" onclick="renderRandomQuote();" type="button" value="∞">
+            <input id="btnPlayMusic" class="btn btn-dark px-3" onclick="playSoundtrack();" type="button" value="Música">
         </section>
-        <section class="content text-light py-2 px-2 text-center">
+        <section class="content text-light py-2 px-2 text-center rounded">
             <div class="phrase">
                 <p class="lead font-italic" id="phrase"></p>
                 <hr>
@@ -52,8 +52,8 @@ <h2 id="afterTextTime">en el planeta Miller desde el estreno de la película en
 
         <a href="#" id="imageDownloader" hidden></a>
 
-        <div id='credits' class="content text-light text-center mt-5" hidden>
-            <p>+) dbetm.github.io/time-miller</p>
+        <div id='credits' class="content text-light text-center mt-4 rounded" hidden>
+            <p>+) https://dbetm.github.io/time-miller</p>
         </div>
 
         <footer id="footer" class="container-fluid py-2 bg-light text-center">

js/app.js

@@ -82,6 +82,7 @@ function takeSnapshot() {
     document.body.style.width = '600px';
     document.body.style.height = '750px';
     document.getElementById('credits').hidden = false;
+    document.getElementById("mainTitle").style.backgroundColor = "#2a5f82";
 
     html2canvas(document.body, {
         width: 600,