From f0e9b0a6e7d26923a8bfa6bcd329eda7614fac34 Mon Sep 17 00:00:00 2001
From: thiagofqs <39809188+thiagofqs@users.noreply.github.com>
Date: Sun, 3 Sep 2023 16:15:09 -0300
Subject: [PATCH] =?UTF-8?q?feat:=20cores=20dos=20bot=C3=B5es=20de=20tipos?=
 =?UTF-8?q?=20alterados;=20aumentado=20fonte=20e=20tamanho=20dos=20bot?=
 =?UTF-8?q?=C3=B5es=20de=20tipos?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 assets/css/style.css        | 104 +++++++++++++++++++-----------------
 assets/css/style.css.map    |   2 +-
 assets/sass/_variables.sass |  12 ++---
 assets/sass/style.sass      |  95 +++++++++++++++++---------------
 4 files changed, 113 insertions(+), 100 deletions(-)

diff --git a/assets/css/style.css b/assets/css/style.css
index ed84ae3..713a124 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -17,10 +17,6 @@ a {
   text-decoration: underline;
 }
 
-p {
-  margin: 0.4rem;
-}
-
 #fade {
   position: fixed;
   top: 0;
@@ -69,7 +65,7 @@ p {
   justify-content: space-between;
   align-items: center;
   border-bottom: 1px solid #fff;
-  padding-bottom: 1rem;
+  padding-bottom: 10px;
 }
 .modal-header-title {
   font-weight: 700;
@@ -95,19 +91,21 @@ p {
   text-align: center;
 }
 .modal-body-div {
-  margin-top: 2rem;
+  margin-top: 20px;
 }
 .modal-body-img {
   border-radius: 5px;
   max-width: 90%;
+  margin-top: 10px;
 }
 .modal-body-lista {
   text-align: start;
-  margin-left: 1rem;
+  margin-left: 10px;
 }
 .modal-body-title {
   font-weight: 700;
   color: #fff;
+  margin-bottom: 10px;
 }
 .modal-body-text {
   font-weight: 400;
@@ -118,8 +116,8 @@ p {
 }
 .modal-footer {
   border-top: 1px solid #fff;
-  padding-top: 1rem;
-  margin-top: 2rem;
+  padding-top: 10px;
+  margin-top: 20px;
 }
 .modal-footer-text {
   text-align: center;
@@ -140,11 +138,11 @@ p {
 }
 
 #share {
-  margin-left: 0.5rem;
+  margin-left: 5px;
 }
 
 .main {
-  padding-top: 2rem;
+  padding-top: 20px;
 }
 @keyframes octocat-wave {
   0% {
@@ -170,13 +168,13 @@ p {
   display: flex;
   justify-content: center;
   align-items: center;
-  margin-bottom: 2rem;
+  margin-bottom: 20px;
 }
 .main-header-title {
   font-weight: 700;
   text-align: center;
   color: #fff;
-  margin-right: 1rem;
+  margin-right: 10px;
 }
 .main-header-button {
   padding: 10px;
@@ -204,7 +202,7 @@ p {
   align-items: center;
   flex-direction: column;
   border-radius: 10px;
-  padding: 1rem;
+  padding: 10px;
   background-color: #E74C3C;
   min-height: 570px;
   min-width: 507px;
@@ -221,29 +219,30 @@ p {
 }
 .main-pokeguess-game-pokename {
   font-weight: 700;
+  margin-bottom: 10px;
 }
 .main-pokeguess-game-textType {
   text-align: center;
+  margin-bottom: 10px;
 }
 .main-pokeguess-game-types {
   display: flex;
   justify-content: center;
   align-items: center;
   flex-direction: column;
-  gap: 0.4rem;
+  gap: 5px;
 }
 .main-pokeguess-game-types-container {
   display: flex;
   justify-content: center;
   align-items: center;
   flex-wrap: wrap;
-  gap: 0.4rem;
+  gap: 5px;
 }
 .main-pokeguess-game-types-container-button {
   border: 1px solid #202124;
   border-radius: 8px;
-  font-size: 0.8rem;
-  padding: 0.2rem 0.5rem;
+  padding: 5px 10px;
   color: #fff;
 }
 .main-pokeguess-game-types-container-button:hover {
@@ -259,15 +258,15 @@ p {
   display: flex;
   justify-content: center;
   align-items: center;
-  gap: 1rem;
-  margin-top: 1rem;
+  gap: 10px;
+  margin-top: 20px;
 }
 .main-pokeguess-game-buttons-button {
   background-color: #595959;
   border: none;
   border-radius: 8px;
-  font-size: 1rem;
-  padding: 0.5rem 1rem;
+  font-size: 1.2rem;
+  padding: 5px 20px;
   color: #fff;
 }
 .main-pokeguess-game-buttons-button:hover {
@@ -282,11 +281,12 @@ p {
   background-color: #fff;
   width: 100%;
   border-radius: 20px;
-  margin-top: 1rem;
+  margin-top: 10px;
 }
 .main-pokeguess-game-settings p {
   text-align: center;
   color: #202124;
+  margin: 10px;
 }
 
 #gen1 {
@@ -302,12 +302,13 @@ p {
   justify-content: center;
   align-items: center;
   flex-direction: column;
-  gap: 1rem;
+  gap: 20px;
 }
 .aside-div-title {
   color: #fff;
   text-align: center;
   font-weight: 700;
+  margin-bottom: 10px;
 }
 .aside-div-content-left {
   display: flex;
@@ -317,8 +318,8 @@ p {
   background-color: #fff;
   min-width: 128px;
   min-height: 96px;
-  padding: 1rem 0;
-  gap: 0.5rem;
+  padding: 10px 0;
+  gap: 8px;
   border-radius: 10px 0 0 10px;
 }
 .aside-div-content-left-gen {
@@ -335,9 +336,13 @@ p {
   background-color: #595959;
   border: none;
   font-size: 1rem;
-  padding: 0.5rem 0;
+  padding: 8px 0;
   width: 100%;
   color: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 5px;
 }
 .aside-div-content-left-gen-button:hover {
   cursor: pointer;
@@ -352,8 +357,8 @@ p {
   background-color: #fff;
   min-width: 128px;
   min-height: 96px;
-  padding: 1rem 0;
-  gap: 0.5rem;
+  padding: 16px 0;
+  gap: 8px;
   border-radius: 0 10px 10px 0;
 }
 .aside-div-content-title {
@@ -384,7 +389,7 @@ p {
   border: none;
   border-radius: 8px;
   font-size: 1rem;
-  padding: 0.5rem 0;
+  padding: 5px 0;
   width: 5rem;
   color: #fff;
 }
@@ -408,7 +413,7 @@ p {
   bottom: 0;
   width: 100%;
   background-color: #fff;
-  padding: 1rem 3rem;
+  padding: 10px 30px;
 }
 #cookie-consent-modal-link {
   color: #595959;
@@ -418,7 +423,7 @@ p {
   background-color: #E74C3C;
   color: #fff;
   border: none;
-  padding: 0.5rem 1rem;
+  padding: 5px 10px;
   font-size: 1rem;
   border-radius: 5px;
   font-weight: 700;
@@ -436,8 +441,9 @@ p {
   justify-content: center;
   align-items: center;
   flex-wrap: wrap;
-  gap: 0.2rem;
-  padding: 1rem 0 2rem 0;
+  gap: 10px;
+  margin-top: 20px;
+  padding: 20px 10px;
   text-align: center;
 }
 .footer-copyright {
@@ -447,7 +453,7 @@ p {
 .footer-lang {
   border: none;
   border-radius: 3px;
-  padding: 0.2rem 0.2rem;
+  padding: 3px;
   color: #202124;
   background-color: #fff;
 }
@@ -473,11 +479,11 @@ p {
 }
 
 #normal {
-  background-color: #BAB2AB;
+  background-color: #9FA19E;
 }
 
 #fighting {
-  background-color: #7F331D;
+  background-color: #c53800;
 }
 
 #poison {
@@ -501,11 +507,11 @@ p {
 }
 
 #steel {
-  background-color: #A7A8B3;
+  background-color: #598FA2;
 }
 
 #fire {
-  background-color: #EE400E;
+  background-color: #E62828;
 }
 
 #water {
@@ -537,19 +543,19 @@ p {
 }
 
 #dark {
-  background-color: #423429;
+  background-color: #50413E;
 }
 
 #fairy {
-  background-color: #F3ACF2;
+  background-color: #ED91E9;
 }
 
 @media (max-width: 820px) {
   .aside {
     flex-direction: row;
     flex-wrap: wrap;
-    gap: 1rem;
-    margin: 1rem 0;
+    gap: 10px;
+    margin: 10px 0;
   }
   .aside-div-content-left, .aside-div-content-right {
     border-radius: 10px;
@@ -570,13 +576,13 @@ p {
     min-height: 600px;
   }
   .main-pokeguess-game-buttons-button {
-    padding: 0.7rem 1.2rem;
+    padding: 5px 10px;
   }
   .main-pokeguess-game-types-container {
-    padding: 0 4rem;
+    padding: 0 60px;
   }
   .main-pokeguess-game-types-container-button {
-    padding: 0.4rem 1rem;
+    padding: 5px 10px;
   }
   .main-pokeguess-game-figure img {
     width: 40%;
@@ -599,15 +605,15 @@ p {
   .aside-div-content-left, .aside-div-content-right {
     width: 96px;
     min-height: 96px;
-    padding: 1rem 0;
-    gap: 0.5rem;
+    padding: 10px 0;
+    gap: 5px;
   }
   .aside-div-content-left-gen {
     width: 96px;
     min-height: 96px;
   }
   .main-pokeguess-game {
-    padding: 1rem 0;
+    padding: 10px 0;
   }
   .main-pokeguess-game-figure img {
     width: 50%;
diff --git a/assets/css/style.css.map b/assets/css/style.css.map
index f06d057..30c5a6b 100644
--- a/assets/css/style.css.map
+++ b/assets/css/style.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../sass/style.sass","../sass/_variables.sass","../sass/_mixins.sass"],"names":[],"mappings":"AAEQ;AAER;EACI;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACI,kBCVI;;;ADYR;EACI,OCdI;EDeJ;;;AAEJ;EACI;;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACI;EACA;EACA;;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA,kBC1CI;ED2CJ;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACI;EACA;;;AAEJ;EACI;;;AAGA;EACI;EACA;EACA;EACA;EACA;;AACA;EACI;EACA,OCnEJ;;ADoEA;EACI;EACA;EACA;EACA,kBCvEJ;;ADwEI;EACI;EACA,OC3ER;;AD4EA;EACI;;AACJ;EACI,OCjFE;;ADkFV;EACI;;AACA;EACI;;AACJ;EACI;EACA;;AACJ;EACI;EACA;;AACJ;EACI;EACA,OC5FJ;;AD6FA;EACI;EACA,OC/FJ;;ADgGA;EACI;;AACR;EACI;EACA;EACA;;AACA;EACI;EACA;EACA,OCzGJ;;;AD2GR;EACI;;;AAEJ;EACI;;;AAEJ;EACI;;;AAEJ;EACI;;;AAEJ;EACI;;AACA;EACI;IACI;;EACJ;IACI;;EACJ;IACI;;EACJ;IACI;;EACJ;IACI;;EACJ;IACI;;;AACR;EEvHA;EACA;EACA;EFuHI;;AACA;EACI;EACA;EACA,OC5IJ;ED6II;;AACJ;EACI;EACA;EACA;EACA,kBCnJI;;ADoJJ;EACI;EACA,OCrJR;;ADsJA;EErJJ;EACA;EACA,kBDLU;;AD0JV;EEzIA;EACA;EACA;;AFyII;EE3IJ;EACA;EACA;EF2IQ;EACA;EACA;EACA,kBCjKE;EDkKF;EACA;EACA,OClKJ;;ADmKI;EEpJR;EACA;EACA;EFoJY;;AACA;EACI;;AACR;EACI;;AACJ;EACI;;AACJ;EE7JR;EACA;EACA;EF6JY;EACA;;AACA;EEjKZ;EACA;EACA;EFiKgB;EACA;;AACA;EACI;EACA;EACA;EACA;EACA,OCzLhB;;AD0LY;EEpLhB;EACA;;AFqLgB;EElLhB;EACA;EACA,kBDbY;;AD+LJ;EE/KR;EACA;EACA;EF+KY;EACA;;AACA;EACI,kBCpMJ;EDqMI;EACA;EACA;EACA;EACA,OCxMZ;;ADyMQ;EEnMZ;EACA;;AFoMQ;EE5LR;EACA;EACA;EF4LY;EACA,kBC9MR;ED+MQ;EACA;EACA;;AACA;EACI;EACA,OCnNZ;;;ADqNR;EACI;;;AACJ;EACI;;;AAEJ;EE5MI;EACA;EACA;EF4MA;EACA;;AAEI;EACI,OCjOJ;EDkOI;EACA;;AAEA;EEtNR;EACA;EACA;EFsNY;EACA,kBCxOR;EDyOQ;EACA;EACA;EACA;EACA;;AACA;EE/NZ;EACA;EACA;EF+NgB;EACA,kBCjPZ;EDkPY;EACA;EACA;;AACA;EACI,kBCvPR;EDwPQ;EACA;EACA;EACA;EACA,OC3PhB;;AD4PY;EE3PhB;EACA;EACA,kBDLU;;ADgQF;EE/OR;EACA;EACA;EF+OY;EACA,kBCjQR;EDkQQ;EACA;EACA;EACA;EACA;;AACJ;EACI;EACA,OCxQR;;ADyQI;EACI;;AACJ;EACI;EACA,OC7QR;;AD8QI;EACI,OC/QR;;ADgRI;EACI,OCjRR;EDkRQ;EACA;EACA;;AACJ;EACI,eCzRF;;AD0RF;EACI,kBC1RA;ED2RA;EACA;EACA;EACA;EACA;EACA,OC/RR;;ADgSI;EE/RR;EACA;EACA,kBDLU;;ADoSF;EExRR;EACA;EACA,kBDbY;;;ADsShB;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA,kBC7SI;ED8SJ;;AACA;EACI,OCjTQ;;;ADmThB;EACI,kBCrTU;EDsTV,OCpTI;EDqTJ;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EE3TI;EACA;EACA,kBDLU;;;ADiUd;EEhTI;EACA;EACA;EFgTA;EACA;EACA;EACA;;AACA;EACI,OCtUA;EDuUA;;AACJ;EACI;EACA;EACA;EACA,OC3UA;ED4UA,kBC7UA;;AD8UA;EACI,OC/UJ;;ADgVJ;EACI,eCnVM;;ADoVV;EACI,OCnVA;EDoVA;;AACJ;EACI,OCtVA;EDuVA;;AACA;EACI,OC3VE;;AD4VV;EACI;;;AAER;EACI,kBC1VK;;;AD2VT;EACI,kBC3VO;;;AD4VX;EACI,kBC5VK;;;AD6VT;EACI,kBC7VK;;;AD8VT;EACI,kBC9VG;;;AD+VP;EACI,kBC/VE;;;ADgWN;EACI,kBChWI;;;ADiWR;EACI,kBCjWI;;;ADkWR;EACI,kBClWG;;;ADmWP;EACI,kBCnWI;;;ADoWR;EACI,kBCpWI;;;ADqWR;EACI,kBCrWO;;;ADsWX;EACI,kBCtWK;;;ADuWT;EACI,kBCvWM;;;ADwWV;EACI,kBCxWE;;;ADyWN;EACI,kBCzWK;;;AD0WT;EACI,kBC1WG;;;AD2WP;EACI,kBC3WI;;;AD6WR;EACI;IACI;IACA;IACA;IACA;;EACJ;IACI;;EACJ;IACI;;EACJ;IACI;;EACJ;IACI;;EACJ;IACI;;EACA;IACI;;EACA;IACI;;EACR;IACI;;EACA;IACI;;EACR;IACI;;;AAEZ;EACI;IACI;;;AAER;EACI;IACI;;EAEJ;IACI;;;AAER;EACI;IACI;IACA;IACA;IACA;;EACJ;IACI;IACA;;EACJ;IACI;;EACJ;IACI","file":"style.css"}
\ No newline at end of file
+{"version":3,"sourceRoot":"","sources":["../sass/style.sass","../sass/_variables.sass","../sass/_mixins.sass"],"names":[],"mappings":"AAEQ;AAER;EACI;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACI,kBCVI;;;ADYR;EACI,OCdI;EDeJ;;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACI;EACA;EACA;;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA,kBCvCI;EDwCJ;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACI;EACA;;;AAEJ;EACI;;;AAGA;EACI;EACA;EACA;EACA;EACA;;AACA;EACI;EACA,OChEJ;;ADiEA;EACI;EACA;EACA;EACA,kBCpEJ;;ADqEI;EACI;EACA,OCxER;;ADyEA;EACI;;AACJ;EACI,OC9EE;;AD+EV;EACI;;AACA;EACI;;AACJ;EACI;EACA;EACA;;AACJ;EACI;EACA;;AACJ;EACI;EACA,OC1FJ;ED2FI;;AACJ;EACI;EACA,OC9FJ;;AD+FA;EACI;;AACR;EACI;EACA;EACA;;AACA;EACI;EACA;EACA,OCxGJ;;;AD0GR;EACI;;;AAEJ;EACI;;;AAEJ;EACI;;;AAEJ;EACI;;;AAEJ;EACI;;AACA;EACI;IACI;;EACJ;IACI;;EACJ;IACI;;EACJ;IACI;;EACJ;IACI;;EACJ;IACI;;;AACR;EEtHA;EACA;EACA;EFsHI;;AACA;EACI;EACA;EACA,OC3IJ;ED4II;;AACJ;EACI;EACA;EACA;EACA,kBClJI;;ADmJJ;EACI;EACA,OCpJR;;ADqJA;EEpJJ;EACA;EACA,kBDLU;;ADyJV;EExIA;EACA;EACA;;AFwII;EE1IJ;EACA;EACA;EF0IQ;EACA;EACA;EACA,kBChKE;EDiKF;EACA;EACA,OCjKJ;;ADkKI;EEnJR;EACA;EACA;EFmJY;;AACA;EACI;;AACR;EACI;EACA;;AACJ;EACI;EACA;;AACJ;EE9JR;EACA;EACA;EF8JY;EACA;;AACA;EElKZ;EACA;EACA;EFkKgB;EACA;;AACA;EACI;EACA;EACA;EACA,OCzLhB;;AD0LY;EEpLhB;EACA;;AFqLgB;EElLhB;EACA;EACA,kBDbY;;AD+LJ;EE/KR;EACA;EACA;EF+KY;EACA;;AACA;EACI,kBCpMJ;EDqMI;EACA;EACA;EACA;EACA,OCxMZ;;ADyMQ;EEnMZ;EACA;;AFoMQ;EE5LR;EACA;EACA;EF4LY;EACA,kBC9MR;ED+MQ;EACA;EACA;;AACA;EACI;EACA,OCnNZ;EDoNY;;;AAEpB;EACI;;;AACJ;EACI;;;AAEJ;EE7MI;EACA;EACA;EF6MA;EACA;;AAEI;EACI,OClOJ;EDmOI;EACA;EACA;;AAEA;EExNR;EACA;EACA;EFwNY;EACA,kBC1OR;ED2OQ;EACA;EACA;EACA;EACA;;AACA;EEjOZ;EACA;EACA;EFiOgB;EACA,kBCnPZ;EDoPY;EACA;EACA;;AACA;EACI,kBCzPR;ED0PQ;EACA;EACA;EACA;EACA,OC7PhB;ED8PgB;EACA;EACA;EACA;;AACJ;EEjQhB;EACA;EACA,kBDLU;;ADsQF;EErPR;EACA;EACA;EFqPY;EACA,kBCvQR;EDwQQ;EACA;EACA;EACA;EACA;;AACJ;EACI;EACA,OC9QR;;AD+QI;EACI;;AACJ;EACI;EACA,OCnRR;;ADoRI;EACI,OCrRR;;ADsRI;EACI,OCvRR;EDwRQ;EACA;EACA;;AACJ;EACI,eC/RF;;ADgSF;EACI,kBChSA;EDiSA;EACA;EACA;EACA;EACA;EACA,OCrSR;;ADsSI;EErSR;EACA;EACA,kBDLU;;AD0SF;EE9RR;EACA;EACA,kBDbY;;;AD4ShB;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA,kBCnTI;EDoTJ;;AACA;EACI,OCvTQ;;;ADyThB;EACI,kBC3TU;ED4TV,OC1TI;ED2TJ;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EEjUI;EACA;EACA,kBDLU;;;ADuUd;EEtTI;EACA;EACA;EFsTA;EACA;EACA;EACA;EACA;;AACA;EACI,OC7UA;ED8UA;;AACJ;EACI;EACA;EACA;EACA,OClVA;EDmVA,kBCpVA;;ADqVA;EACI,OCtVJ;;ADuVJ;EACI,eC1VM;;AD2VV;EACI,OC1VA;ED2VA;;AACJ;EACI,OC7VA;ED8VA;;AACA;EACI,OClWE;;ADmWV;EACI;;;AAER;EACI,kBCjWK;;;ADkWT;EACI,kBClWO;;;ADmWX;EACI,kBCnWK;;;ADoWT;EACI,kBCpWK;;;ADqWT;EACI,kBCrWG;;;ADsWP;EACI,kBCtWE;;;ADuWN;EACI,kBCvWI;;;ADwWR;EACI,kBCxWI;;;ADyWR;EACI,kBCzWG;;;AD0WP;EACI,kBC1WI;;;AD2WR;EACI,kBC3WI;;;AD4WR;EACI,kBC5WO;;;AD6WX;EACI,kBC7WK;;;AD8WT;EACI,kBC9WM;;;AD+WV;EACI,kBC/WE;;;ADgXN;EACI,kBChXK;;;ADiXT;EACI,kBCjXG;;;ADkXP;EACI,kBClXI;;;ADoXR;EACI;IACI;IACA;IACA;IACA;;EACJ;IACI;;EACJ;IACI;;EACJ;IACI;;EACJ;IACI;;EACJ;IACI;;EACA;IACI;;EACA;IACI;;EACR;IACI;;EACA;IACI;;EACR;IACI;;;AAEZ;EACI;IACI;;;AAER;EACI;IACI;;EAEJ;IACI;;;AAER;EACI;IACI;IACA;IACA;IACA;;EACJ;IACI;IACA;;EACJ;IACI;;EACJ;IACI","file":"style.css"}
\ No newline at end of file
diff --git a/assets/sass/_variables.sass b/assets/sass/_variables.sass
index 05dbc49..1b6b06c 100644
--- a/assets/sass/_variables.sass
+++ b/assets/sass/_variables.sass
@@ -4,15 +4,15 @@ $white: #fff
 $black: #202124
 
 //Type Color
-$normal: #BAB2AB
-$fighting: #7F331D
+$normal: #9FA19E
+$fighting: #c53800
 $poison: #944592
 $ground: #C8A95F
 $rock: #9E863C
 $bug: #A9BA27
 $ghost: #605FAA
-$steel: #A7A8B3
-$fire: #EE400E
+$steel: #598FA2
+$fire: #E62828
 $water: #3393F4
 $grass: #78C53C
 $electric: #F8B717
@@ -20,5 +20,5 @@ $flying: #99A8F3
 $psychic: #E6477D
 $ice: #6DD3F2
 $dragon: #6958BE
-$dark: #423429
-$fairy: #F3ACF2
+$dark: #50413E
+$fairy: #ED91E9
diff --git a/assets/sass/style.sass b/assets/sass/style.sass
index 88b9d5a..b83f1a3 100644
--- a/assets/sass/style.sass
+++ b/assets/sass/style.sass
@@ -17,9 +17,6 @@ a
     color: variables.$white
     text-decoration: underline
 
-p
-    margin: 0.4rem
-
 #fade
     position: fixed
     top: 0
@@ -64,7 +61,7 @@ p
         justify-content: space-between
         align-items: center
         border-bottom: 1px solid variables.$white
-        padding-bottom: 1rem
+        padding-bottom: 10px
         &-title
             font-weight: 700
             color: variables.$white
@@ -83,16 +80,18 @@ p
     &-body
         text-align: center
         &-div
-            margin-top: 2rem
+            margin-top: 20px
         &-img
             border-radius: 5px
             max-width: 90%
+            margin-top: 10px
         &-lista
             text-align: start
-            margin-left: 1rem
+            margin-left: 10px
         &-title
             font-weight: 700
             color: variables.$white
+            margin-bottom: 10px
         &-text
             font-weight: 400
             color: variables.$white
@@ -100,8 +99,8 @@ p
             font-weight: 700
     &-footer
         border-top: 1px solid variables.$white
-        padding-top: 1rem
-        margin-top: 2rem
+        padding-top: 10px
+        margin-top: 20px
         &-text
             text-align: center
             font-weight: 700
@@ -117,10 +116,10 @@ p
     font-size: .7rem
 
 #share
-    margin-left: .5rem
+    margin-left: 5px
 
 .main
-    padding-top: 2rem
+    padding-top: 20px
     @keyframes octocat-wave
         0%
             transform: rotate(0deg)
@@ -136,12 +135,12 @@ p
             transform: rotate(0deg)
     &-header
         @include mixins.flex-centralize
-        margin-bottom: 2rem
+        margin-bottom: 20px
         &-title
             font-weight: 700
             text-align: center
             color: variables.$white
-            margin-right: 1rem
+            margin-right: 10px
         &-button
             padding: 10px
             border-radius: 5px
@@ -158,7 +157,7 @@ p
             @include mixins.flex-centralize
             flex-direction: column
             border-radius: 10px
-            padding: 1rem
+            padding: 10px
             background-color: variables.$primary-500
             min-height: 570px
             min-width: 507px
@@ -170,21 +169,22 @@ p
                     width: 50%
             &-pokename
                 font-weight: 700
+                margin-bottom: 10px
             &-textType
                 text-align: center
+                margin-bottom: 10px
             &-types
                 @include mixins.flex-centralize
                 flex-direction: column
-                gap: 0.4rem
+                gap: 5px
                 &-container
                     @include mixins.flex-centralize
                     flex-wrap: wrap
-                    gap: 0.4rem
+                    gap: 5px
                     &-button
                         border: 1px solid variables.$black
                         border-radius: 8px
-                        font-size: 0.8rem
-                        padding: 0.2rem 0.5rem
+                        padding: 5px 10px
                         color: variables.$white
                     &-button:hover
                         @include mixins.secondary-button-hover
@@ -192,14 +192,14 @@ p
                         @include mixins.button-disabled
             &-buttons
                 @include mixins.flex-centralize
-                gap: 1rem
-                margin-top: 1rem
+                gap: 10px
+                margin-top: 20px
                 &-button
                     background-color: variables.$secondary-500
                     border: none
                     border-radius: 8px
-                    font-size: 1rem
-                    padding: 0.5rem 1rem
+                    font-size: 1.2rem
+                    padding: 5px 20px
                     color: variables.$white
                 &-button:hover
                     @include mixins.secondary-button-hover
@@ -209,10 +209,11 @@ p
                 background-color: variables.$white
                 width: 100%
                 border-radius: 20px
-                margin-top: 1rem
+                margin-top: 10px
                 p
                     text-align: center
                     color: variables.$black
+                    margin: 10px
 
 #gen1
     border-radius: 10px 0 0 0
@@ -222,12 +223,13 @@ p
 .aside
     @include mixins.flex-centralize
     flex-direction: column
-    gap: 1rem
+    gap: 20px
     &-div
         &-title
             color: variables.$white
             text-align: center
             font-weight: 700
+            margin-bottom: 10px
         &-content
             &-left
                 @include mixins.flex-centralize
@@ -235,8 +237,8 @@ p
                 background-color: variables.$white
                 min-width: 128px
                 min-height: 96px
-                padding: 1rem 0
-                gap: 0.5rem
+                padding: 10px 0
+                gap: 8px
                 border-radius: 10px 0 0 10px
                 &-gen
                     @include mixins.flex-centralize
@@ -249,9 +251,13 @@ p
                         background-color: variables.$secondary-500
                         border: none
                         font-size: 1rem
-                        padding: 0.5rem 0
+                        padding: 8px 0
                         width: 100%
                         color: variables.$white
+                        display: flex
+                        align-items: center
+                        justify-content: center
+                        gap: 5px
                     &-button:hover
                         @include mixins.primary-button-hover
             &-right
@@ -260,8 +266,8 @@ p
                 background-color: variables.$white
                 min-width: 128px
                 min-height: 96px
-                padding: 1rem 0
-                gap: 0.5rem
+                padding: 16px 0
+                gap: 8px
                 border-radius: 0 10px 10px 0
             &-title
                 font-size: 1rem
@@ -285,7 +291,7 @@ p
                 border: none
                 border-radius: 8px
                 font-size: 1rem
-                padding: 0.5rem 0
+                padding: 5px 0
                 width: 5rem
                 color: variables.$white
             &-button:hover
@@ -302,7 +308,7 @@ p
     bottom: 0
     width: 100%
     background-color: variables.$white
-    padding: 1rem 3rem
+    padding: 10px 30px
     &-link
         color: variables.$secondary-500
 
@@ -310,7 +316,7 @@ p
     background-color: variables.$primary-500
     color: variables.$white
     border: none
-    padding: .5rem 1rem
+    padding: 5px 10px
     font-size: 1rem
     border-radius: 5px
     font-weight: 700
@@ -322,8 +328,9 @@ p
 .footer
     @include mixins.flex-centralize
     flex-wrap: wrap
-    gap: .2rem
-    padding: 1rem 0 2rem 0
+    gap: 10px
+    margin-top: 20px
+    padding: 20px 10px
     text-align: center
     &-copyright
         color: variables.$white
@@ -331,7 +338,7 @@ p
     &-lang
         border: none
         border-radius: 3px
-        padding: 0.2rem 0.2rem
+        padding: 3px
         color: variables.$black
         background-color: variables.$white
         &-option
@@ -340,10 +347,10 @@ p
         outline-color: variables.$primary-500
     &-version
         color: variables.$white
-        font-size: 0.8rem
+        font-size: .8rem
     &-by
         color: variables.$white
-        font-size: 0.8rem
+        font-size: .8rem
         &-heart
             color: variables.$primary-500
     &-bold
@@ -390,8 +397,8 @@ p
     .aside
         flex-direction: row
         flex-wrap: wrap
-        gap: 1rem
-        margin: 1rem 0
+        gap: 10px
+        margin: 10px 0
     .aside-div-content-left, .aside-div-content-right
         border-radius: 10px
     .aside-div-content-left-gen
@@ -405,11 +412,11 @@ p
         &-game
             min-height: 600px
             &-buttons-button
-                padding: 0.7rem 1.2rem
+                padding: 5px 10px
         &-game-types-container
-            padding: 0 4rem
+            padding: 0 60px
             &-button
-                padding: 0.4rem 1rem
+                padding: 5px 10px
         &-game-figure img
             width: 40%
 
@@ -428,12 +435,12 @@ p
     .aside-div-content-left, .aside-div-content-right
         width: 96px
         min-height: 96px
-        padding: 1rem 0
-        gap: 0.5rem
+        padding: 10px 0
+        gap: 5px
     .aside-div-content-left-gen
         width: 96px
         min-height: 96px
     .main-pokeguess-game
-        padding: 1rem 0
+        padding: 10px 0
     .main-pokeguess-game-figure img
         width: 50%