Move cancel buttons alongside submit buttons

This is better because it saves vertical space for the contents of the
pop-up menu.

This commit also adds some padding to the cancel and clear buttons, to
make them easier targets to hit.

app/assets/stylesheets/components/page-footer.scss

@@ -67,6 +67,10 @@
     padding: 0.52632em 0.78947em 0.26316em 0.78947em;
   }
 
+  .js-cancel {
+    margin: 0;
+  }
+
 }
 
 .align-button-with-textbox {
@@ -86,21 +90,3 @@
   }
 
 }
-
-.page-footer-js-cancel {
-
-  text-decoration: underline;
-  color: $govuk-blue;
-  cursor: pointer;
-
-  &:hover {
-    color: $link-hover-colour;
-  }
-
-  &:focus,
-  &:active, {
-    background: $yellow;
-    color: $govuk-blue;
-    outline: 3px solid $yellow;
-  }
-}

app/assets/stylesheets/components/stick-at-top-when-scrolling.scss

@@ -122,3 +122,26 @@
   display: block;
   margin-bottom: 5px;
 }
+
+.js-cancel {
+
+  display: inline-block;
+  padding: 10px 10px 5px 10px;
+  margin-top: -10px;
+  margin-right: -10px;
+  text-decoration: underline;
+  color: $govuk-blue;
+  cursor: pointer;
+
+  &:hover {
+    color: $link-hover-colour;
+  }
+
+  &:focus,
+  &:active, {
+    background: $yellow;
+    color: $govuk-blue;
+    outline: none;
+  }
+
+}