Add another @media for medium-sized screens

_includes/footer.html

@@ -18,5 +18,7 @@
 
     <div class="column-3">
       This work is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-nc/4.0/">Creative Commons Attribution-NonCommercial 4.0 International License</a> unless otherwise stated.
+      <br><br>
+      beakandlens.com was last updated on {{ 'now' | date: "%d.%m.%Y" }}
     </div>
   </div>

_layouts/home.html

@@ -32,6 +32,8 @@
 		
 		<div class="article">
 			<p>Welcome to Beak and Lens Photography. Beak and Lens Photography is run by Marvin Johanning, a hobbyist wildlife (mostly birds) photographer from Bielefeld, Germany. I am also on <img src="/assets/icons/instagram.png" width="16" height="16"> <a href="https://www.instagram.com/beakandlens/">Instagram</a>, <img src="/assets/icons/mastodon.png" width="16" height="16"> <a href="https://birds.town/@mjohanning">Mastodon</a> and <img src="/assets/icons/flickr.png" width="16" height="16"> <a href="https://www.flickr.com/photos/mjohanning/">Flickr</a>! For more information about me, see the About page. If you want to see some of my favourite photos in a rather random order, just continue scrolling down! Once you reach the end, you can click the button to see all of my photos or simply click the <a href="/gallery">Gallery</a> link in the menu at the top left. </p>
+
+			<p>Please note that this page is still a <b><u>work in progress</u></b> as of {{ 'now' | date: "%d.%m.%Y" }}. Expect frequent (weekly or even daily) updates to the site's design, new page additions and more for a while. More information can be found in the <a href="/updates/">Update Blog</a>.</p>
 		</div>
 		
 		<div class="separator">

assets/css/gallery.css

@@ -13,6 +13,12 @@
   border-radius: 25px;
 }
 
+@media (prefers-color-scheme: dark) {
+  .gallery-row {
+    border: 5px rgba(205, 205, 205) double;
+   }
+}
+
 .gallery-button {
   display: -ms-flexbox; /* IE10 */
   display: flex;
@@ -37,7 +43,7 @@
 }
 
 /* Responsive layout - makes a two column-layout instead of four columns */
-@media only screen and (max-width: 1200px) {
+@media only screen and (max-width: 800px) {
   .gallery-column {
     -ms-flex: 100%;
     flex: 100%;
@@ -50,6 +56,18 @@
     margin-right: 0;
   }
 
+  .gallery-button {
+    margin-left: 0;
+    margin-right: 0;
+  }
+}
+
+@media only screen and (max-width: 1200px) {
+  .gallery-row {
+    margin-left: 0;
+    margin-right: 0;
+  }
+
   .gallery-button {
     margin-left: 0;
     margin-right: 0;

assets/css/styles.css

@@ -23,8 +23,8 @@
     --colour1: #5F8D4E;
     --colour2: #5F8D4E;
     --colour3: #A4BE7B;
-    --colour4: #285430;
-    --colour5: #285430;
+    --colour4: #A4BE7B;
+    --colour5: #5F8D4E;
 
     --bg-color: #242424;
 
@@ -35,6 +35,8 @@
   body {
     background-color: #242424;
     color: #F5F5F5; 
+
+    border: white;
   }
 
   blockquote {
@@ -62,6 +64,8 @@
 @media (prefers-color-scheme: light) {
   body {
     background-color: white;
+
+    border: black; 
   }
 
   blockquote {
@@ -619,7 +623,7 @@ div.heading-greek {
   margin: 0px 150px 0;
 }
 
-@media only screen and (max-width: 1200px) {
+@media only screen and (max-width: 800px) {
 	.separator2 {
 	  margin: 0;
 	}
@@ -738,7 +742,7 @@ img.no {
 
 .button1 {
   background-color: var(--bg-color); 
-  border: 5px double var(--colour5);
+  border: 5px double var(--colour4);
   border-radius: 25px;
   width: 100%;
 }
@@ -753,7 +757,7 @@ a.button {
 }
 
 body {
-  border: 1px solid black;
+  border: 2px solid;
   border-radius: 25px;
   margin-left: 5%; 
   margin-right: 5%;

updates.md

@@ -0,0 +1,15 @@
+---
+layout: page
+title: About
+heading: Updates
+subtitle: Behind the scenes! 
+meta_description: A blog containing current information about beakandlens.com.  
+
+intro: On the following page you will find updates regarding the website and its content. The update appear in chronological order, with the latest update at the very top and earlier ones below it. I highly encourage you to check back here every so often so as to not miss out on new website features or content.
+permalink: /updates/
+---
+
+<div class="article">
+  <h2>27.09.2023 — A new home</h2>
+  <p></p>
+</div>