@import url('https://fonts.googleapis.com/css?family=Raleway&display=swap');

:root {
  --gray-offset: rgba(0, 0, 0, 0.03);
  --gray-border: rgba(0, 0, 0, 0.15);
  --gray-light: rgba(0, 0, 0, 0.4);
  --gray-mid: rgba(0, 0, 0, 0.7);
  --gray-dark: rgba(0, 0, 0, 0.9);
  --body-color: var(--gray-mid);
  --headline-color: var(--gray-dark);
  --accent-color: #ed5f74;
  --radius: 6px;
}

body {
  padding: 20px;
  font-family: 'Raleway';
  display: flex;
  justify-content: center;
  font-size: 1.2em;
}

form > * {
  margin: 10px 0;
}

code {
  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;
}

button {
  background-color: #ed5f74;
}

button {
  background: var(--accent-color);
  border-radius: var(--radius);
  color: white;
  border: 0;
  padding: 12px 16px;
  margin-top: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  display: block;
}
button:hover {
  filter: contrast(115%);
}
button:active {
  transform: translateY(0px) scale(0.98);
  filter: brightness(0.9);
}
button:disabled {
  opacity: 0.5;
  cursor: none;
}

/* prices.html */
.price-list {
  display: flex;
}

.price-list > div {
  flex-grow: 3;
  margin: 0 10px;
  border: black solid 1px;
  padding: 20px;
}