.border {
  border: 2px solid red;
  margin: 3px;
}

.flex {
  display: flex;
}

.justify-center {
  justify-content: center;
}

.item-center {
  align-items: center;
}

.bg-black {
  background-color: black;
  color: white;
}

.invert {
  filter: invert(1);
}

.bg-grey {
  background-color: #121212;
}

.rounded {
  border-radius: 7px;
}

.m-1 {
  margin: 5px;
}

.p-1 {
  padding: 10px;
}



/* For Chrome, Edge, Safari, Opera */
::-webkit-scrollbar {
  width: 10px;
  /* scrollbar width */
  height: 10px;
  /* for horizontal scrollbar */
}

::-webkit-scrollbar-track {
  background: #0b0c0e;
  /* track background (black) */
}

::-webkit-scrollbar-thumb {
  background: #1f1f1f;
  /* scrollbar thumb (dark grey) */
  border-radius: 10px;
  /* rounded corners */
  border: 2px solid #0b0c0e;
  /* space between thumb & track */
}

::-webkit-scrollbar-thumb:hover {
  background: #2d2d2d;
  /* hover effect */
}

/* For Firefox */
* {
  scrollbar-width: thin;
  /* "auto" or "thin" */
  scrollbar-color: #1f1f1f #0b0c0e;
  /* thumb color | track color */
}