restyle new game button to put it on the right side of the introduction

style/main.scss

@@ -34,10 +34,8 @@ body {
   margin: 80px 0;
 }
 
-.heading:after {
-  content: "";
-  display: block;
-  clear: both;
+.heading {
+  @include clearfix;
 }
 
 h1.title {
@@ -168,17 +166,10 @@ hr {
   line-height: 42px;
 }
 
-.restart-button {
-  @include button;
-  display: block;
-  width: 100px;
-  margin: 10px auto 10px auto;
-  text-align: center;
-}
-
 // Game field mixin used to render CSS at different width
 @mixin game-field {
   .game-container {
+    margin-top: 40px;
     position: relative;
     padding: $grid-spacing;
 
@@ -454,8 +445,24 @@ hr {
   @include animation-fill-mode(backwards);
 }
 
+.above-game {
+  @include clearfix;
+  // margin-bottom: 10px;
+}
+
 .game-intro {
-  margin-bottom: 0;
+  float: left;
+  line-height: 42px;
+  // margin-bottom: 0;
+}
+
+.restart-button {
+  @include button;
+  display: block;
+  // width: 100px;
+  // margin: 10px auto 10px auto;
+  text-align: center;
+  float: right;
 }
 
 .game-explanation {
@@ -499,6 +506,22 @@ hr {
     margin-bottom: 10px;
   }
 
+  // Show intro and restart button side by side
+  .game-intro {
+    width: 55%;
+    display: block;
+    box-sizing: border-box;
+    line-height: 1.65;
+  }
+
+  .restart-button {
+    width: 42%;
+    padding: 0;
+    display: block;
+    box-sizing: border-box;
+    margin-top: 2px;
+  }
+
   // Render the game field at the right width
   @include game-field;