2 files changed, 67 insertions, 11 deletions
diff --git a/assets/css/default.css b/assets/css/default.css
index 2552263d..b6f2d9cc 100644
--- a/assets/css/default.css
+++ b/assets/css/default.css
@@ -5,6 +5,12 @@ body {
     Arial, sans-serif;
 }
 
+#contents {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+}
+
 .deleted {
   background-color: rgb(255, 0, 0, 0.5);
 }
@@ -172,7 +178,7 @@ img.thumbnail {
   flex: 1;
 }
 
-.navbar > .searchbar {
+.searchbar {
   flex-grow: 2; /* take double the space of the other items */
 }
 
@@ -185,7 +191,7 @@ img.thumbnail {
   display: inline;
 }
 
-.navbar > .searchbar .pure-form input[type="search"] {
+.searchbar .pure-form input[type="search"] {
   margin-bottom: 1px;
 
   border-top: 0;
@@ -210,12 +216,12 @@ input[type="search"]::-webkit-search-cancel-button {
   background-size: 14px;
 }
 
-.navbar > .searchbar .pure-form fieldset {
+.searchbar .pure-form fieldset {
   padding: 0;
 }
 
 /* attract focus to the searchbar by adding a subtle transition */
-.navbar > .searchbar .pure-form input[type="search"]:focus {
+.searchbar .pure-form input[type="search"]:focus {
   margin-bottom: 0px;
   border-bottom: 2px solid #aaa;
 }
@@ -280,14 +286,16 @@ input[type="search"]::-webkit-search-cancel-button {
  * Footer
  */
 
-.footer {
-  color: #666666;
-  margin: 2em 0;
+footer {
+  color: #919191;
+  margin-top: auto;
+  padding: 1.5em 0;
   text-align: center;
+  max-height: 30vh;
 }
 
-body .footer a {
-  color: inherit;
+footer a {
+  color: #919191 !important;
   text-decoration: underline;
 }
 
@@ -586,7 +594,7 @@ body.dark-theme {
   color: #f0f0f0;
 }
 
-.dark-theme .navbar > .searchbar input {
+.dark-theme .searchbar input {
   background-color: inherit;
   color: inherit;
 }
@@ -625,7 +633,7 @@ body.dark-theme {
     color: #f0f0f0;
   }
 
-  .no-theme .navbar > .searchbar input {
+  .no-theme .searchbar input {
     background-color: inherit;
     color: inherit;
   }
@@ -654,3 +662,35 @@ body.dark-theme {
   content: "[ - ]";
   font-size: 1.5em;
 }
+
+/*With commit d9528f5 all contents of the page is now within a flexbox. However,
+the hr element is rendered improperly within one.
+See https://stackoverflow.com/a/34372979 for more info */
+hr {
+  margin: auto 0 auto 0;
+}
+
+/* Description Expansion Styling*/
+#description-box {
+  display: flex;
+  flex-direction: column;
+}
+
+#descexpansionbutton {
+  display: none
+}
+
+#descexpansionbutton ~ div {
+  overflow: hidden;
+  height: 8.3em;
+}
+
+#descexpansionbutton:checked ~ div {
+  overflow: unset;
+  height: 100%;
+}
+
+#descexpansionbutton + label {
+  order: 1;
+  margin-top: 20px;
+}
diff --git a/assets/css/empty.css b/assets/css/empty.css
new file mode 100644
index 00000000..6ad1515d
--- /dev/null
+++ b/assets/css/empty.css
@@ -0,0 +1,16 @@
+#search-widget {
+    text-align: center;
+    margin: 20vh 0 50px 0;
+}
+
+#logo > h1 {
+    font-size: 3.5em;
+    margin: 0;
+    padding: 0;
+}
+
+@media screen and (max-width: 1500px) and (max-height: 1000px) {
+    #logo > h1 {
+      font-size: 10vmin;
+    }
+}