/* #Variable Definitions
================================================== */
body {
  font-family: Tisa Pro, "ff-tisa-web-pro", serif;
  font-style: normal;
  color: white; }

h1 {
  font-size: 4em;
  font-weight: 100;
  font-family: futura-pt, "futura-pt", Avenir, sans-serif;
  font-weight: 700; }

h2 {
  font-size: 1.75em;
  font-weight: 100; }

h3 {
  font-size: 1.17em;
  font-weight: 700; }

h4 {
  font-size: .8em;
  font-weight: 700;
  color: white;
  text-transform: uppercase; }

h5 {
  font-size: .9em;
  font-weight: 100; }

h6 {
  font-size: .65em;
  font-weight: 700; }

.prehead {
  border-bottom: 0px;
  padding-top: 2.5%; }

p {
  font-size: 1em;
  margin-top: .5em; }

a {
  text-decoration: none;
  color: #24292d;
  font-weight: 700;
  font-size: 1em; }

.hinting {
  opacity: .4;
  font-size: .75em;
  margin-left: 1em; }

input {
  font-family: futura-pt, "futura-pt", Avenir, sans-serif;
  font-size: 2em;
  height: 1.5em;
  font-weight: 500;
  overflow: visible; }

.myResults {
  font-size: 1.75em; }

/* Small screens  */
@media (min-width: 325px) {
  .myResults {
    font-size: 2em; } }
/* Medium Small screens  */
@media (min-width: 650px) {
  input {
    font-size: 6em; } }
/* Medium screens */
@media (min-width: 770px) {
  h1 {
    font-size: 4em;
    line-height: 1em; }

  h2 {
    font-size: 2em;
    line-height: 1em; }

  h3 {
    font-size: 1.25em; }

  h4 {
    font-size: .85em; }

  h5 {
    font-size: .9em; }

  h6 {
    font-size: .85em; }

  input {
    font-size: 3.5em; }

  .myResults {
    font-size: 2.25em; }

  /* Large screens */ }
@media (min-width: 770px) and (min-width: 960px) {
  p {
    font-size: 1em;
    font-weight: 100; }

  a {
    font-size: 1em; }

  input {
    font-size: 4.25em; }

  .myResults {
    font-size: 2.5em; } }
/* Extra large screens */
@media (min-width: 1140px) {
  .myResults {
    font-size: 3em; } }
@media only screen and (-webkit-min-device-pixel-ratio: 1.5) {
  /* Don't forget your Retina CSS! */ }