:root {
  --anovaColor: rgb(255, 139, 1); /* FF8B01 */
  --bodyBackground: #f5f5f5;
  --contentBorder: #d8d8d8;
  --modalScreen: rgba(0, 0, 0, 0.79);
  --navBackground: rgba(255, 255, 255, 1);
  --primaryFontColor: #646464;
  --secondaryFontColor: #2b2b2b; /* some headers and ps */
  --red: #fa5b3a;

  font-size: 10px;
}
.full-width { width: 100%; }
.flex { display: flex; }

.flex-center {
  align-items: center;
  justify-content: center;
}

.flex-evenly {
  justify-content: space-evenly;
  align-items: flex-start;
}

.flex-row {
  flex-direction: row;
  flex-wrap: wrap;
}
.flex-column { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.text-center { text-align: center; }
.grid-a { grid-area: a; }
.grid-b { grid-area: b; }
.grid-d { grid-area: d; }

.button {
  background-color: #fb7310;
  border-radius: 25px;
  color: #fff;
  cursor: pointer;
  line-height: 32px;
  padding: 0 30px;
  transition: 0.3s;
}

.button:hover {
  background-color: #fa9a54;
  text-decoration: none;
}

.blue,
.button.blue {
  background-color: #508fde;
  color: var(--navBackground);
}
.button.blue:hover { background-color: #73a5e4; }

.black,
.button.black {
  background-color: var(--secondaryFontColor);
  color: var(--navBackground);
}
.button.black:hover { background-color: #4a4a4a; }

.white,
.button.white {
  background-color: #fff;
  color: #000;
}
.button.white:hover { background-color: #fff; }

.radish,
.button.radish {
  background-color: #dd4b39;
  color: #fff;
}
.button.radish { background-color: #f1b7b0; }

.pink,
.button.pink {
  background-color: #fd6d6f;
  color: #fff;
}

a.red { color: var(--red); }
.button-wide { padding: 0 61px; }

/* this is a toggle so overrides will be needed */
.visuallyhidden { display: none !important; }
.shopify-buy__btn { border: none; }
:focus { outline: none; }