Theme memories box to look like a Win9X window

memories.html

@@ -18,13 +18,19 @@
             <input type="button" onclick="location.href='/';" value="Blueheart forever">
         </div>
         <h1>Thank you for the memories.</h1>
+       <div class="window">
+        <div class="window_titlebar">
+            <h3>memories.exe</h3>
+        </div>
         <div class="wrapper">
             <div class="memoriesBox" id="memoriesBox"></div>
+            <footer> 
             <button id="prev">&lt;</button>
             <button id="next">&gt;</button>
-
+            </footer>
             <script src="/js/memories.js"></script>
         </div>
+       </div>
         </body>
     </div>
 </body>

styles/style_main.css

@@ -12,13 +12,13 @@ body {
 
 /* *flexes your boxes*/
 .container {
-    padding-top: 30px;
+    padding-top: 10vh;
     display: flex;
     flex-direction: column;
 } 
 
 
-img.art_temp {
+img.art_temp { /* we still need to redo this to the final, thing. */
     width: 50%;
     align-self: center;
     padding-top: 5vh;
@@ -36,6 +36,33 @@ div.taskbar {
     background: #c3c3c3;
     box-shadow: inset -1px -1px black;
 }
+
+/* Probably not the right way to do this, but it will suffice I guess. */
+div.window_titlebar {
+    position: absolute;
+
+    left: 0px;
+    top: 0px;
+    width: 100%;
+
+    height: 22px;
+    background: navy;
+}
+
+div.window {
+    position: relative
+    ;
+    border-style: ridge;
+    border-width: 5px;
+    border-color: #c3c3c3;
+    
+    width: 60vw;
+    padding: 10px;
+    align-self: center;
+    background-color: white;
+}
+
+
 /* Fonts */
 
 h1 { 
@@ -47,3 +74,22 @@ h1 {
     display: inline;
     align-self: center;
 }
+
+h2 {
+    padding-top: 5px;
+    font-family: 'Share Tech', serif;
+}
+
+h3 {
+    display: inline;
+    padding-left: 2px;
+    font-family: 'Bitter', serif;
+    font-size: 11pt;
+    
+    color: white;
+}
+
+p {
+    font-family: 'Bitter', serif; 
+    font-weight: 450;
+}