Make mobile friendly

_scss/_base.scss

@@ -9,6 +9,7 @@ html {
 	background-repeat: repeat;
 }
 
+@media only screen and (min-width: 600px) {
 .center {
 	background-color: $background-color;
 	width: 50%;
@@ -16,6 +17,16 @@ html {
 	margin: auto;
 	border: 5px solid #96CDFB;
 }
+}
+
+@media only screen and (max-width: 600px) {
+.center {
+	background-color: $background-color;
+	text-align: center;
+	margin: 10px;
+	border: 5px solid #96CDFB;
+}
+}
 
 .content {
 	margin: 5%;

_scss/_footer.scss

@@ -1,3 +1,4 @@
+@media only screen and (min-width: 600px) {
 footer {
 	margin: auto;
 	margin-top: 5%;
@@ -19,4 +20,27 @@ footer {
 		}
 	}
 }
+}
 
+@media only screen and (max-width: 600px) {
+footer {
+	margin: 10px;
+	margin-top: 5%;
+	margin-bottom: 5%;
+	border: 5px solid #ABE9B3;
+
+	ul {
+    	list-style: none;
+    	margin: auto;
+    	padding: 10px;
+	    display: grid;
+
+	    li {
+			h3 {
+				margin-top: auto;
+			}
+			text-align: center;
+		}
+	}
+}
+}

_scss/_formatting.scss

@@ -23,7 +23,10 @@ code, pre {
 	border-radius: 5px;
 	padding: 5px;
 	border-bottom: 2px solid #FAE3B0;
+}
 
+code {
+	display: inline;
 }
 
 .date {
@@ -32,13 +35,17 @@ code, pre {
 
 @media only screen and (min-width: 600px) {
 	code, pre {
-      	display: inline-block;
+      	display: inline;
       	max-width: 18cm;
 	}
 }
 
-code {
-	display: inline;
+@media only screen and (max-width: 600px) {
+	code, pre {
+      	display: inline-block;
+		max-width: 100%;
+		overflow: auto;
+	}
 }
 
 p code {

_scss/_navigation.scss

@@ -28,8 +28,10 @@ nav {
 
 @media only screen and (max-width: 600px) {
 nav {
-	font-size: 20px;
+	margin: 10px;
 	list-style: none;
+	font-size: 1.3em;
+	border: 5px solid #DDB6F2;
 	
 	ul {
 		list-style: none;
@@ -38,15 +40,21 @@ nav {
 		margin: auto;
 		display: grid;
 		
-			grid-template-columns: repeat(3, 1fr);
-			gap: 10px;
-			grid-auto-rows: minmax(50px, auto);
-			align-content: center;
+		grid-template-columns: repeat(3, 1fr);
+		gap: 10px;
+		grid-auto-rows: minmax(50px, auto);
+		align-content: center;
 
-			li {
-				padding: 0px;
-				margin: auto;
+		li {
+			padding: 0px;
+			margin: auto;
+			font-weight: bold;
+			text-align: center;
+
+			a {
+				text-decoration: none;
 			}
+		}
 	}
 }
 }