Put in adaptive layout for mobile. Introduce JavaScript free nav menu toggle.

Website/wwwroot/css/style.less

@@ -110,6 +110,10 @@ h1, h2, h3, h4, h5, h6 {
 		margin: 20px 0;
 		padding: 0 10px;
 
+		#menu-toggle {
+			display: none;
+		}
+
 		.nav-list{
 			list-style-type: none;
 			margin: 0;
@@ -164,3 +168,53 @@ form {
 }
 
 @import "blog.less";
+
+
+@media screen and (max-width: 992px) {
+	#content {
+		flex-direction: column-reverse;
+
+		main {
+			padding-top: 0;
+		}
+
+		nav {
+			flex: 1 1 auto;
+			border:none;
+			margin: 0;
+			padding: 30px;
+
+			.nav-open {
+				filter: invert(100%);
+				width: 32px;
+				height: 32px;
+			}
+
+			#menu-toggle:checked + .nav-container{
+				max-height: 1000px;
+				margin-top: 20px;
+				opacity: 1;
+			}
+
+			.nav-container{
+				max-height: 0;
+				overflow: hidden;
+				transition:all 0.5s ease-out;
+				opacity: 0;
+			}
+
+			.strava {
+				display: none;
+			}
+		}
+	}
+
+	.header{
+		&__headshot{
+			width: 40vw;
+			height: 40vw;
+			max-width: 200px;
+			max-height: 200px;
+		}
+	}
+}