added a few

docs/css/styles.css

@@ -1,18 +1,23 @@
 body {
-  -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-  -moz-box-sizing: border-box; /* Firefox, other Gecko */
-  box-sizing: border-box; /* Opera/IE 8+ */
-  height:100%
+  -webkit-box-sizing: border-box;
+  /* Safari/Chrome, other WebKit */
+  -moz-box-sizing: border-box;
+  /* Firefox, other Gecko */
+  box-sizing: border-box;
+  /* Opera/IE 8+ */
+  height: 100%
 }
-p{
-    margin: 0px;
+
+p {
+  margin: 0px;
 }
 
 canvas {
   position: absolute;
 }
+
 #toolbar {
-    display: flex;
+  display: flex;
   flex-flow: column;
   height: 100%;
 
@@ -22,8 +27,9 @@ canvas {
   height: 100vh;
   background-color: rgb(189, 189, 189);
 }
+
 #custom {
-    display: flex;
+  display: flex;
   flex-flow: column;
   height: 100%;
 
@@ -33,14 +39,73 @@ canvas {
   /* height: 100vh; */
   background-color: rgb(189, 189, 189);
 }
-.button{
-  display:block;
+
+.button {
+  display: block;
   position: absolute;
   right: 20px;
   z-index: 100;
 }
 
 
-.controls{
-    display: block;
+.controls {
+  display: flex;
+  margin: 8px 0px;
+}
+
+.controlFrameButton {
+  width: 8%;
+}
+.controlPauseButton {
+  width: 80%;
+  margin: auto;
+}
+/* <!-- HTML !-->
+<button class="button-8" role="button">Button 8</button> */
+
+/* CSS */
+.button-8 {
+  background-color: #e1ecf4;
+  border-radius: 3px;
+  border: 1px solid #7aa7c7;
+  box-shadow: rgba(255, 255, 255, .7) 0 1px 0 0 inset;
+  box-sizing: border-box;
+  color: #1f3f55;
+  cursor: pointer;
+  display: inline-block;
+  /* font-family: -apple-system,system-ui,"Segoe UI","Liberation Sans",sans-serif; */
+  font-size: 13px;
+  font-weight: 400;
+  line-height: 1.15385;
+  /* margin: 0; */
+  outline: none;
+  padding: 8px .8em;
+  position: relative;
+  text-align: center;
+  text-decoration: none;
+  user-select: none;
+  -webkit-user-select: none;
+  touch-action: manipulation;
+  vertical-align: baseline;
+  white-space: nowrap;
+}
+
+.button-8:hover,
+.button-8:focus {
+  background-color: #b3d3ea;
+  color: #2c5777;
+}
+
+.button-8:focus {
+  box-shadow: 0 0 0 4px rgba(0, 149, 255, .15);
+}
+
+.button-8:active {
+  background-color: #a0c7e4;
+  box-shadow: none;
+  color: #2c5777;
+}
+
+.buttonReset{
+  background-color: #f4e1e1;
 }