diff --git a/styles.css b/styles.css
index d064a48..ce2e00b 100644
--- a/styles.css
+++ b/styles.css
@@ -77,6 +77,7 @@ aside {
    flex-basis: 30%;
 }
 
+
 /*
 ========================================================================
    HEADER / BANNER
@@ -230,6 +231,52 @@ div#a-lec_infos {
    font-weight:                  normal;
 }
 
+/* On screens that are less than 700px wide, make the sidebar into a topbar */
+@media screen and (max-width: 700px) {
+
+   section#a-lec_page-wrapper {
+    display:                block;
+    margin:                 0 25px;
+  }
+ 
+   aside#a-lec_sidebar {
+      background: none;
+   }
+   
+   .a-lec_latest-posts {
+      margin-left: -35px;
+   }
+   
+   #a-lec_footer {
+      display: block;
+      padding: 5px;
+   }
+   
+   #a-lec_footer .a-lec_paragraph{
+      margin-bottom: 30px;
+      font-size: 80%;
+      border:                       2px solid var(--a-lec_blue);
+      border-top : unset;
+      border-left: unset;
+      border-right: unset;
+      padding: 15px;
+   }
+   
+   #a-lec_footer  h1 {
+      margin-top: 10px;
+      font-size: 115%;
+      padding: 15px;
+      margin-bottom: -20px;
+   }
+   
+   #a-lec_footer li {
+      text-align: center;
+   }
+}
+/* On screens that are less than 400px, display the bar vertically, instead of horizontally */
+@media screen and (max-width: 400px) {
+
+}
 
 
 /*
@@ -492,6 +539,7 @@ h1,h2,h3,h4,h5,h6 {
    display:                inline-block;
    color:                  #000;
    font-weight:            bold;
+   text-align:             center;
 }
    h1 {
       font-size:           130%;