Added basic GUI styling. May need to rework in the future. Checkpoint 4.

simon-says/src/features/patternGen/buttonLayout.css

+.redbutton{
+    background-color: #f44336;
+    border: none;
+    width: 50%;
+    height: 300px;
+}
+.bluebutton{
+    background-color: #008CBA;
+    border: none;
+    width: 50%;
+    height: 300px;
+}
+.yellowbutton{
+    background-color: #ffff00;
+    border: none;
+    width: 50%;
+    height: 300px;
+}
+.greenbutton{
+    background-color: #4CAF50;
+    border: none;
+    width: 50%;
+    height: 300px;
+}
+#wrapper{
+    width: 100%;
+    background-color:#ffffff;
+    margin-left: auto;
+    margin-right: auto;
+    margin-top:10px;
+    margin-bottom:10px;
+    padding:10px;
+    line-height:150%;
+    clear:both; 
+}
\ No newline at end of file

simon-says/src/features/patternGen/patternGeneration.js

 import React from 'react';
+import styles from './buttonLayout.css';
 
 export function Pattern() {
   return (
     <main>
-      <button>
-
+      <div>
+      <button class = "redbutton">
       </button>
-      <button>
+      <button class = "bluebutton">
         
       </button>
-      <button>
+      <button class = 'yellowbutton'>
         
       </button>
-      <button>
+      <button class = 'greenbutton'>
         
       </button>
+      </div>
     </main>
   );
 }
\ No newline at end of file