Reset button

styles.css

@@ -3,9 +3,12 @@
   font-size: 16px;
   line-height: 24px;
   font-weight: 400;
-  /* Verdana , Avenir, Helvetica, Arial, sans-serif */
   color: #0f0f0f98;
-  background-color: #f6f6f6;
+  background-color: #2f2f2f;
+
+  height: 100%;
+  display: flex;
+  justify-content: center;
 
   font-synthesis: none;
   text-rendering: optimizeLegibility;
@@ -14,60 +17,49 @@
   -webkit-text-size-adjust: 100%;
 }
 
-.board{
-  text-align: center;
-}
-
 .container {
+  display: block;
+  justify-content: center;
   margin: 0;
   padding: 10vh;
-  display: flex;
-  /* flex-direction: column; */
-  justify-content: center;
-  text-align: center;
-  vertical-align: middle;
-}
-
-.logo {
-  height: 6em;
-  padding: 1.5em;
-  will-change: filter;
-  transition: 0.75s;
-}
-
-.logo.tauri:hover {
-  filter: drop-shadow(0 0 2em #24c8db);
-}
-
-.row {
-  display: flex;
-  justify-content: center;
-}
-
-a {
-  font-weight: 500;
-  color: #646cff;
-  text-decoration: inherit;
-}
-
-a:hover {
-  color: #535bf2;
-}
-
-h1 {
-  text-align: center;
 }
 
 button {
   cursor: pointer;
-}
-
-.button-hidden {
   vertical-align: middle;
   text-align: center;
   border-radius: 8px;
   border: 1px solid transparent;
-  /* font-weight: 500; */
+}
+
+.upper-menu{
+  display: flex;
+  justify-content: left;
+}
+
+.game{
+  display: flex;
+  justify-content: center;
+}
+
+.button-reset {
+  height: 50px;
+  width: 100px;
+  margin: 2px;
+  font-size: 25px;
+  background-color: #0f0f0f98;
+  color: #ffffff;
+  transition: background-color 0.5s;
+  -webkit-transition: background-color 0.5s;
+}
+
+.button-reset:hover {
+  background-color: #262626;
+  transition: background-color 0.5s;
+  -webkit-transition: background-color 0.5s;
+}
+
+.button-hidden {
   font-size: 25px;
   color: rgba(15, 15, 15, 0.0);
   background-color: #0f0f0f98;
@@ -77,14 +69,9 @@ button {
   margin: 2px;
   transition: background-color 0.5s;
   -webkit-transition: background-color 0.5s;
-
 }
 
 .button-shown {
-  vertical-align: middle;
-  text-align: center;
-  border-radius: 8px;
-  border: 1px solid transparent;
   font-size: 25px;
   font-weight: 700;
   color: #0f0f0f98;
@@ -117,23 +104,3 @@ input,
 button {
   outline: none;
 }
-
-@media (prefers-color-scheme: dark) {
-  :root {
-    /* color: #f6f6f6; */
-    background-color: #2f2f2f;
-  }
-
-  a:hover {
-    color: #24c8db;
-  }
-
-  input,
-  button {
-    color: #ffffff;
-    background-color: #0f0f0f98;
-  }
-  button:active {
-    background-color: #0f0f0f69;
-  }
-}