body,html {
    margin: 0;
    padding: 0;
    background-color: black;
}

.creato {
    font-family: 'Creato Display' !important;
}

.white {
  color: white;
}

.array {
    font-family: 'Array-Regular', Arial, Helvetica, sans-serif !important;
}

.gradient-border {
  position: relative;
  border-radius: 5px;      /* border radius */
  padding: 1.2px;          /* border thickness */
  background: rgba(129, 129, 129, 0.2); /* inner content background */
  box-sizing: border-box;
  z-index: 0;
  overflow: hidden;
}

.gradient-border::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;  /* match parent radius */
  padding: 1.2px;          /* border thickness */
  background: linear-gradient(to bottom, #505050, #262626);
  mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  z-index: -1;
}

::selection {
  background-color: #ffffff5a;
  color: rgb(196, 196, 196);
}

::-moz-selection {
  background-color: #ffffff5a;
  color: rgb(196, 196, 196);
}

.button {
  padding: 4px 8px;
  font-size: 16px;
  font-weight: 600;
  color: rgb(0, 0, 0);
  background: rgba(255, 255, 255);
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-family: "Creato Display", sans-serif;
  transition: background 0.5s ease, transform 0.1s ease;
}

.button:hover {
  background: rgb(198, 198, 198);
  transform: translateY(-1px);
}

.button:active {
  background: rgb(160, 160, 160);
  transform: translateY(0);
}