Change basic mobile styling, and desktop width

Breakpoint size
Header margin from burger
Max width for desktop

main.css

@@ -4,7 +4,7 @@ header {position: relative}
 header hr {display:none}
 body {
 margin:.2rem;
-max-width:48rem;
+max-width:54rem;
 padding:0 .62rem;
 font:1.2rem/1.62 sans-serif
 }
@@ -16,7 +16,7 @@ border-top:1px dotted #000
 nav>a:first-child {border:none}
 
 h1,h2,h3,h4,h5,h6 { line-height:1 }
-header h1 { margin: 1.4rem auto 1.2rem; margin-right: 60px }
+header h1 { margin: 1.4rem auto 1.2rem; margin-right: 52px }
 
 a { text-decoration:none }
 a:link,a:visited { color:#087CA7 }
@@ -74,7 +74,7 @@ flex-direction:column
 main { flex:1 0 auto }
 
 @media print {body {max-width:none}}
-@media (min-width: 600px) {
+@media (min-width: 720px) {
  body { margin:.2rem auto; }
  nav>a { margin-left:2rem; padding: auto; display: inline; border: none }
  nav>a:first-child { padding:1rem 0; padding-left:0; margin-left:0 }
@@ -86,6 +86,7 @@ main { flex:1 0 auto }
 @media (max-width:320px) {
  #burger-toggle~nav{display:block}
  .burger-container{display:none}
+ header h1{margin-right:auto}
 }
 @media (prefers-color-scheme: dark) {
  body { color:#FFF; background:#191919 }