:root {
  /* Page Settings: */
  --page-width: 8.5in;

  /* Colors from Tachyons */
  --light-gray: #eeeeee;

  /* Spacing from Tachyons */
  --spacing-extra-large: 4rem;
}

/* Media Queries */
@custom-media --breakpoint-page screen and (min-width: 8.5in);

/* Styles */

.mw-page { max-width: var(--page-width); }

@media (--breakpoint-page) {
  .mv-5-page {
    margin-top: var(--spacing-extra-large);
    margin-bottom: var(--spacing-extra-large);
  }

  .bg-light-gray-page { background-color: var(--light-gray); }

  .shadow-2-page { box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.2); }

  .db-page { display: block; }
}

@media print {
  @page {
    size: letter portrait;
    margin: 0;
  }
}