Fix image size

themes/quadrant/assets/css/main.css

@@ -1,6 +1,7 @@
 /* margin boilerplate */
 
 :root {
+  --site-width: 960px;
   --regular-margin: 15px;
 }
 
@@ -42,7 +43,7 @@ html {
 
 body {
   display: block;
-  max-width: 960px;
+  max-width: var(--site-width);
   margin: 0 auto;
   padding: 10px 10px;
 }
@@ -96,7 +97,7 @@ header hr, footer hr {
 }
 
 main img {
-  max-width: 960px;
+  max-width: var(--site-width);
   box-sizing: border-box;
   border-radius: 5px;
   box-shadow: 2px 2px 10px #000;
@@ -109,3 +110,13 @@ time, small {
 footer small a {
   padding-right: 12px;
 }
+
+@media only screen and (max-device-width: var(--site-width)) {
+  body {
+    max-width: 100vw;
+  }
+
+  main img {
+    max-width: 95vw;
+  }
+}