update

assets/css/main.css

@@ -1,35 +1,31 @@
-
 html {
-  width: 100%;
   height: 100%;
-  margin: 0;
-  padding: 0;
   display: flex;
   justify-content: center;
   align-items: center;
   background-color: #333;
+  font-family: Consolas, Monaco, "Lucida Console", monospace !important;
+  font-size: 0.9rem !important;
+  color: #ccc !important;
 }
 
 body {
   box-sizing: border-box !important;
-  font-family: Consolas, Monaco, "Lucida Console", monospace !important;
-  font-size: 0.9rem !important;
-  color: #ccc !important;
   margin: 0;
   padding-top: 3.5rem;
   padding-bottom: 3.5rem;
   padding-left: 1.5rem;
   padding-right: 1.5rem;
-  height: 100%;
   background-color: #3d3d3d;
   max-width: 600px;
+  height: 100%;
 }
 
 @media only screen and (max-width: 700px) {
   * {
     font-size: 1.2rem;
   }
-  
+
   body {
     max-width: 100%;
     padding-left: 1rem;
@@ -90,4 +86,4 @@ a {
 
 .five {
   margin-left: 7.5rem;
-}
+}

layouts/_default/home.html

@@ -15,7 +15,7 @@
       {<br />
       <div class="three">
         <span>question:</span>
-        <span class="highlight">'{{ .question }}'</span><br>
+        <span class="highlight">'{{ .question }}'</span>,<br>
         <span>answer:</span>
         <span class="highlight">'{{ .answer }}'</span>
       </div>