alphabetize css

public/style.css

@@ -1,36 +1,36 @@
 :root {
-  --size: calc(100vmin / 1.618033988749895);
   --primary-text-size: 12px;
+  --size: calc(100vmin / 1.618033988749895);
 }
 
 html,
 body {
-  width: 100%;
   height: 100vh;
   overflow: hidden;
+  width: 100%;
 }
 
 body {
-  margin: 0;
   background: #241917;
   color: #f3bbae;
   font-family: Monaco, monospace !important;
+  margin: 0;
 }
 
 body,
 .braille {
-  display: flex;
   align-items: center;
-  justify-content: center;
+  display: flex;
   flex-flow: row;
+  justify-content: center;
 }
 
 .braille {
-  max-width: 100%;
-  max-height: 100%;
-  width: var(--size);
-  height: var(--size);
   font: 10px/10px "Iosevka Web", monospace;
+  height: var(--size);
+  max-height: 100%;
+  max-width: 100%;
+  width: var(--size);
 }
 
 .braille>* {
@@ -38,8 +38,8 @@ body,
 }
 
 .braille .hidden {
-  position: fixed;
   bottom: 100%;
+  position: fixed;
   right: 100%;
 }
 
@@ -49,6 +49,10 @@ body,
   right: 0;
 }
 
+.links {
+  padding: 0;
+}
+
 @media only screen and (max-width: 625px) {
   .globe-txt {
     position: fixed;
@@ -57,37 +61,31 @@ body,
     transform: translate(50%, -50%);
   }
 
-  .links {
-    padding: 0;
-  }
-
   .dashboard {
     flex-direction: column !important;
   }
+
+  .center-text {
+    left: 2px;
+    margin-left: 0;
+    margin-top: 0;
+    max-width: 100vw;
+    right: 2px;
+  }
 }
 
 .center-text {
-  position: fixed;
+  background-color: #241917;
-  gap: 25px;
+  border: 4px solid #9a756c;
   display: flex;
   flex-direction: column;
-  border: 4px solid #9a756c;
+  gap: 25px;
-  text-align: left;
-  z-index: 10;
-  background-color: #241917;
-  max-width: 35rem;
-  top: 30%;
   left: 15%;
-}
+  max-width: 35rem;
-
+  position: fixed;
-@media only screen and (max-width: 625px) {
+  text-align: left;
-  .center-text {
+  top: 30%;
-    left: 2px;
+  z-index: 10;
-    right: 2px;
-    margin-left: 0;
-    margin-top: 0;
-    max-width: 100vw;
-  }
 }
 
 ::-webkit-scrollbar {
@@ -104,18 +102,18 @@ body,
 
 .tab,
 .tab-link {
-  cursor: pointer;
-  border-width: 0 4px 4px 0;
-  border-style: solid;
   border-color: #9a756c;
+  border-style: solid;
+  border-width: 0 4px 4px 0;
+  cursor: pointer;
   font-size: 10px;
 }
 
 .tab-link {
   color: #f3bbae;
-  text-decoration: none;
   margin-right: 2.5rem;
   min-width: 4.5rem;
+  text-decoration: none;
 }
 
 .tab-link svg {
@@ -129,8 +127,8 @@ a {
 }
 
 p {
-  margin: 0;
   font-size: var(--primary-text-size);
+  margin: 0;
 }
 
 .tabbed {
@@ -151,15 +149,15 @@ ul.custom-bullet li {
 
 ul.custom-bullet li::before {
   content: "-";
-  position: absolute;
   left: -15px;
+  position: absolute;
 }
 
 .tab>label {
+  cursor: pointer;
   display: flex;
   margin: 0;
   padding: 0.35rem 0.75rem;
-  cursor: pointer;
   transition: all 0.3s;
 }
 
@@ -204,20 +202,20 @@ ul.custom-bullet li::before {
 }
 
 .code {
-  word-wrap: break-word;
+  background-color: #241917;
+  border: 4px solid #9a756c;
+  color: #fff !important;
   display: block;
   font-size: 10px;
-  background-color: #241917;
-  color: #fff !important;
-  border: 4px solid #9a756c;
   padding: 5px;
+  word-wrap: break-word;
 }
 
 .bullet-text {
   font-size: var(--primary-text-size);
-  text-align: left;
-  position: relative;
   padding-top: 1rem;
+  position: relative;
+  text-align: left;
 }
 
 .tab-content a[href]:hover {
@@ -225,9 +223,9 @@ ul.custom-bullet li::before {
 }
 
 .visible {
-  z-index: 0;
   position: absolute;
   right: 0;
+  z-index: 0;
 }
 
 ul {
@@ -235,8 +233,8 @@ ul {
 }
 
 .tabs {
-  display: flex;
   align-items: stretch;
+  display: flex;
   list-style: none;
   margin: 0;
   padding: 0;
@@ -268,50 +266,50 @@ ul {
 }
 
 .tab-icon {
-  width: var(--primary-text-size);
   color: #f3bbae;
   fill: #f3bbae;
   padding-left: 0.25rem;
+  width: var(--primary-text-size);
 }
 
 a {
+  align-items: center;
   display: flex;
   justify-content: center;
-  align-items: center;
 }
 
 .bullet-text a {
-  justify-content: left;
   align-items: left;
+  justify-content: left;
 }
 
 .modal-window {
-  position: fixed;
   background-color: rgba(0, 0, 0, 0.45);
-  top: 0;
-  right: 0;
   bottom: 0;
   left: 0;
-  z-index: 999;
-  visibility: hidden;
   opacity: 0;
   pointer-events: none;
+  position: fixed;
+  right: 0;
+  top: 0;
   transition: all 0.3s;
+  visibility: hidden;
+  z-index: 999;
 
   &:target {
-    visibility: visible;
     opacity: 1;
     pointer-events: auto;
+    visibility: visible;
   }
 
   &>div {
-    width: 400px;
+    background: #241917;
+    left: 50%;
+    padding: 2em;
     position: absolute;
     top: 50%;
-    left: 50%;
     transform: translate(-50%, -50%);
-    padding: 2em;
+    width: 400px;
-    background: #241917;
   }
 
   header {
@@ -325,19 +323,19 @@ a {
 }
 
 .modal-close {
-  line-height: 14px;
-  font-size: 18px;
-  text-decoration: none;
-  position: absolute;
-  right: 0;
-  top: 0;
   border-bottom: 4px solid #9a756c;
   border-left: 4px solid #9a756c;
+  font-size: 18px;
+  line-height: 14px;
   padding: 0.25rem 0.35rem;
+  position: absolute;
+  right: 0;
+  text-decoration: none;
+  top: 0;
 
   &:hover {
-    color: #241917 !important;
     background-color: #9a756c;
+    color: #241917 !important;
   }
 }
 
@@ -353,20 +351,20 @@ a {
 }
 
 .logo {
-  max-width: 150px;
   display: block;
+  max-width: 150px;
 }
 
 .btn {
   background-color: #241917;
-  padding: 0.35rem 0.75rem;
-  border-top: 4px solid #9a756c;
   border-right: 4px solid #9a756c;
-  text-decoration: none;
+  border-top: 4px solid #9a756c;
-  font-size: 10px;
-  position: absolute;
   bottom: 0;
+  font-size: 10px;
   left: 0;
+  padding: 0.35rem 0.75rem;
+  position: absolute;
+  text-decoration: none;
 }
 
 .btn:hover {
@@ -377,9 +375,9 @@ a {
 }
 
 .modal-text {
+  font-size: var(--primary-text-size);
   line-height: 1.6;
   margin: 0;
-  font-size: var(--primary-text-size);
 }
 
 .modal-body {
@@ -387,13 +385,13 @@ a {
 }
 
 .crypto-address {
-  word-wrap: break-word;
+  background-color: #241917;
+  border: 4px solid #9a756c;
+  color: #fff;
   display: block;
   font-size: 12px !important;
-  background-color: #241917;
-  color: #fff;
-  border: 4px solid #9a756c;
   padding: 5px;
+  word-wrap: break-word;
 }
 
 .crypto-name {