/* COLORS */

:root {
  --color-background: #f8fcfb;
  --color-light: #c9fdd7;
  --color-darker: #79d1c3;
  --color-dark: #6892d5;
}

/* FONTS */

@font-face {
    font-family: 'chaneyregular';
    src: url('https://cdn.glitch.com/f1c1aab2-4714-4e1b-b699-0b043d4d7b26%2Fchaney-regular-webfont.woff2?v=1614976283457') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'basiersquare';
    src: url('https://cdn.glitch.com/f1c1aab2-4714-4e1b-b699-0b043d4d7b26%2Fbasiersquare-regular-webfont.woff2?v=1614976924518') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'basiersquare';
    src: url('https://cdn.glitch.com/f1c1aab2-4714-4e1b-b699-0b043d4d7b26%2Fbasiersquare-bold-webfont.woff2?v=1614977160089') format('woff2');
    font-weight: bold;
    font-style: normal;
}



body {
  background-color: var(--color-background);
  font-family: "basiersquare";
  font-size: 1.4em;
}


header {
  margin-top: 2em;
}
h1 {
  font-family: "chaneyregular";
}
h1 .tagline {
  font-size: 0.5em;
  font-family: "basiersquare";
}


main {
  margin-top: 2em;
}

.row {
  margin-top: 1.5em;
}


#app {
  margin: auto;
  max-width: 960px;
}

#results {
  margin-top: 2em;
}

thead {
  font-weight: bold;
}

label, input[type="text"], textarea, button {
  display: block;
}
input[type="text"], textarea {
  min-width: 50%;
  padding: 0.5em;
}
textarea {
  width:100%;
}