.btn-outline {
  color: $green-100;
  box-shadow: inset 0 0 0 2px $green-100;

  &:hover,
  &:active,
  &.zeroclipboard-is-hover,
  &.zeroclipboard-is-active {
    color: darken($green-100, 4%);
    box-shadow: inset 0 0 0 3px darken($green-100, 4%);
  }

  &:focus {
    box-shadow: inset 0 0 0 2px darken($green-100, 4%);
  }

  &:focus:hover,
  &.selected:focus {
    box-shadow: inset 0 0 0 2px darken($green-100, 4%);
  }
}

.text-justify {
  text-align: justify;
}

// Borrowed from Tailwind. 1_2 = 1/2
.w-0 { width: 0px; }
.w-1 { width: 0.25rem; }
.w-2 { width: 0.5rem; }
.w-3 { width: 0.75rem; }
.w-4 { width: 1rem; }
.w-5 { width: 1.25rem; }
.w-6 { width: 1.5rem; }
.w-7 { width: 1.75rem; }
.w-8 { width: 2rem; }
.w-9 { width: 2.25rem; }
.w-10 { width: 2.5rem; }
.w-11 { width: 2.75rem; }
.w-12 { width: 3rem; }
.w-14 { width: 3.5rem; }
.w-16 { width: 4rem; }
.w-20 { width: 5rem; }
.w-24 { width: 6rem; }
.w-28 { width: 7rem; }
.w-32 { width: 8rem; }
.w-36 { width: 9rem; }
.w-40 { width: 10rem; }
.w-44 { width: 11rem; }
.w-48 { width: 12rem; }
.w-52 { width: 13rem; }
.w-56 { width: 14rem; }
.w-60 { width: 15rem; }
.w-64 { width: 16rem; }
.w-72 { width: 18rem; }
.w-80 { width: 20rem; }
.w-96 { width: 24rem; }
.w-px { width: 1px; }
.w-1_2 { width: 50%; }
.w-1_3 { width: 33.333333%; }
.w-2_3 { width: 66.666667%; }
.w-1_4 { width: 25%; }
.w-2_4 { width: 50%; }
.w-3_4 { width: 75%; }
.w-1_5 { width: 20%; }
.w-2_5 { width: 40%; }
.w-3_5 { width: 60%; }
.w-4_5 { width: 80%; }
.w-1_6 { width: 16.666667%; }
.w-2_6 { width: 33.333333%; }
.w-3_6 { width: 50%; }
.w-4_6 { width: 66.666667%; }
.w-5_6 { width: 83.333333%; }
.w-1_12 { width: 8.333333%; }
.w-2_12 { width: 16.666667%; }
.w-3_12 { width: 25%; }
.w-4_12 { width: 33.333333%; }
.w-5_12 { width: 41.666667%; }
.w-6_12 { width: 50%; }
.w-7_12 { width: 58.333333%; }
.w-8_12 { width: 66.666667%; }
.w-9_12 { width: 75%; }
.w-10_12 { width: 83.333333%; }
.w-11_12 { width: 91.666667%; }
.w-full { width: 100%; }
.w-screen { width: 100vw; }
.w-min { width: min-content; }
.w-max { width: max-content; }
.w-fit { width: fit-content; }

.h-0 { height: 0px; }
.h-1 { height: 0.25rem; }
.h-2 { height: 0.5rem; }
.h-3 { height: 0.75rem; }
.h-4 { height: 1rem; }
.h-5 { height: 1.25rem; }
.h-6 { height: 1.5rem; }
.h-7 { height: 1.75rem; }
.h-8 { height: 2rem; }
.h-9 { height: 2.25rem; }
.h-10 { height: 2.5rem; }
.h-11 { height: 2.75rem; }
.h-12 { height: 3rem; }
.h-14 { height: 3.5rem; }
.h-16 { height: 4rem; }
.h-20 { height: 5rem; }
.h-24 { height: 6rem; }
.h-28 { height: 7rem; }
.h-32 { height: 8rem; }
.h-36 { height: 9rem; }
.h-40 { height: 10rem; }
.h-44 { height: 11rem; }
.h-48 { height: 12rem; }
.h-52 { height: 13rem; }
.h-56 { height: 14rem; }
.h-60 { height: 15rem; }
.h-64 { height: 16rem; }
.h-72 { height: 18rem; }
.h-80 { height: 20rem; }
.h-96 { height: 24rem; }
.h-px { height: 1px; }

.clear-left { clear: left; }
.clear-right { clear: right; }
.clear-both { clear: both; }
.clear-none { clear: none; }