@charset "UTF-8";
/*! chota.css v0.6.1 | MIT License | github.com/jenil/chota */
:root {
  --color-primary:#1a9f60;
  --color-lightGrey:#d2d6dd;
  --color-grey:#7e818b;
  --color-darkGrey:#3f4144;
  --color-error:#d43939;
  --color-success:#28bd14;
  --grid-maxWidth:120rem;
  --grid-gutter:2rem;
  --font-size:1.6rem;
  --font-family:-apple-system,BlinkMacSystemFont,Avenir,"Avenir Next","Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
  line-height: 1.15;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  letter-spacing: 0.01em;
  line-height: 1.6;
  font-size: var(--font-size);
  font-weight: 400;
  font-family: Segoe UI, Helvetica Neue, sans-serif;
  font-family: var(--font-family);
  margin: 0;
  padding: 0;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 500;
  margin: 0.35em 0 0.7em;
}

h1 {
  font-size: 2em;
}

h2 {
  font-size: 1.75em;
}

h3 {
  font-size: 1.5em;
}

h4 {
  font-size: 1.25em;
}

h5 {
  font-size: 1em;
}

h6 {
  font-size: 0.85em;
}

a {
  color: var(--color-primary);
  text-decoration: none;
}

a:hover:not(.button) {
  opacity: 0.75;
}

p {
  margin-top: 0;
}

blockquote {
  background-color: #f3f3f6;
  padding: 1.5rem 2rem;
  border-left: 3px solid var(--color-lightGrey);
}

dl dt {
  font-weight: 700;
}

hr {
  background-color: var(--color-lightGrey);
  height: 1px;
  margin: 1rem 0;
}

hr, table {
  border: none;
}

table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  text-align: left;
}

table.striped tr:nth-of-type(2n) {
  background-color: #f3f3f6;
}

td, th {
  vertical-align: middle;
  padding: 1.2rem 0.4rem;
}

thead {
  border-bottom: 2px solid var(--color-lightGrey);
}

tfoot {
  border-top: 2px solid var(--color-lightGrey);
}

code, kbd, pre, samp, tt {
  font-family: monaco, Consolas, Lucida Console, monospace;
}

code, kbd {
  font-size: 90%;
  white-space: pre-wrap;
  border-radius: 4px;
  color: #d43939;
  padding: 0.2em 0.4em;
}

code, kbd, pre {
  background-color: #f3f3f6;
}

pre {
  font-size: 1em;
  padding: 1rem;
  overflow-x: auto;
}

pre code {
  background: none;
  padding: 0;
}

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
}

img {
  max-width: 100%;
}

fieldset {
  border: 1px solid var(--color-lightGrey);
}

iframe {
  border: 0;
}

.container {
  max-width: var(--grid-maxWidth);
  margin: 0 auto;
  width: 96%;
  padding: 0 calc(var(--grid-gutter) / 2);
}

.row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  margin-left: calc(var(--grid-gutter) / -2);
  margin-right: calc(var(--grid-gutter) / -2);
}

.row, .row.reverse {
  -webkit-box-orient: horizontal;
}

.row.reverse {
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

.col {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.col, [class*=" col-"], [class^=col-] {
  margin: 0 calc(var(--grid-gutter) / 2) calc(var(--grid-gutter) / 2);
}

.col-1 {
  -ms-flex: 0 0 calc(8.33333% - var(--grid-gutter));
  flex: 0 0 calc(8.33333% - var(--grid-gutter));
  max-width: calc(8.33333% - var(--grid-gutter));
}

.col-1, .col-2 {
  -webkit-box-flex: 0;
}

.col-2 {
  -ms-flex: 0 0 calc(16.66667% - var(--grid-gutter));
  flex: 0 0 calc(16.66667% - var(--grid-gutter));
  max-width: calc(16.66667% - var(--grid-gutter));
}

.col-3 {
  -ms-flex: 0 0 calc(25% - var(--grid-gutter));
  flex: 0 0 calc(25% - var(--grid-gutter));
  max-width: calc(25% - var(--grid-gutter));
}

.col-3, .col-4 {
  -webkit-box-flex: 0;
}

.col-4 {
  -ms-flex: 0 0 calc(33.33333% - var(--grid-gutter));
  flex: 0 0 calc(33.33333% - var(--grid-gutter));
  max-width: calc(33.33333% - var(--grid-gutter));
}

.col-5 {
  -ms-flex: 0 0 calc(41.66667% - var(--grid-gutter));
  flex: 0 0 calc(41.66667% - var(--grid-gutter));
  max-width: calc(41.66667% - var(--grid-gutter));
}

.col-5, .col-6 {
  -webkit-box-flex: 0;
}

.col-6 {
  -ms-flex: 0 0 calc(50% - var(--grid-gutter));
  flex: 0 0 calc(50% - var(--grid-gutter));
  max-width: calc(50% - var(--grid-gutter));
}

.col-7 {
  -ms-flex: 0 0 calc(58.33333% - var(--grid-gutter));
  flex: 0 0 calc(58.33333% - var(--grid-gutter));
  max-width: calc(58.33333% - var(--grid-gutter));
}

.col-7, .col-8 {
  -webkit-box-flex: 0;
}

.col-8 {
  -ms-flex: 0 0 calc(66.66667% - var(--grid-gutter));
  flex: 0 0 calc(66.66667% - var(--grid-gutter));
  max-width: calc(66.66667% - var(--grid-gutter));
}

.col-9 {
  -ms-flex: 0 0 calc(75% - var(--grid-gutter));
  flex: 0 0 calc(75% - var(--grid-gutter));
  max-width: calc(75% - var(--grid-gutter));
}

.col-9, .col-10 {
  -webkit-box-flex: 0;
}

.col-10 {
  -ms-flex: 0 0 calc(83.33333% - var(--grid-gutter));
  flex: 0 0 calc(83.33333% - var(--grid-gutter));
  max-width: calc(83.33333% - var(--grid-gutter));
}

.col-11 {
  -ms-flex: 0 0 calc(91.66667% - var(--grid-gutter));
  flex: 0 0 calc(91.66667% - var(--grid-gutter));
  max-width: calc(91.66667% - var(--grid-gutter));
}

.col-11, .col-12 {
  -webkit-box-flex: 0;
}

.col-12 {
  -ms-flex: 0 0 calc(100% - var(--grid-gutter));
  flex: 0 0 calc(100% - var(--grid-gutter));
  max-width: calc(100% - var(--grid-gutter));
}

@media screen and (max-width: 599px) {
  .container {
    width: 100%;
  }
  .col, [class*=col-], [class^=col-] {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
    max-width: 100%;
  }
}
@media screen and (min-width: 900px) {
  .col-1-md {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(8.33333% - var(--grid-gutter));
    flex: 0 0 calc(8.33333% - var(--grid-gutter));
    max-width: calc(8.33333% - var(--grid-gutter));
  }
  .col-2-md {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(16.66667% - var(--grid-gutter));
    flex: 0 0 calc(16.66667% - var(--grid-gutter));
    max-width: calc(16.66667% - var(--grid-gutter));
  }
  .col-3-md {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(25% - var(--grid-gutter));
    flex: 0 0 calc(25% - var(--grid-gutter));
    max-width: calc(25% - var(--grid-gutter));
  }
  .col-4-md {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(33.33333% - var(--grid-gutter));
    flex: 0 0 calc(33.33333% - var(--grid-gutter));
    max-width: calc(33.33333% - var(--grid-gutter));
  }
  .col-5-md {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(41.66667% - var(--grid-gutter));
    flex: 0 0 calc(41.66667% - var(--grid-gutter));
    max-width: calc(41.66667% - var(--grid-gutter));
  }
  .col-6-md {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(50% - var(--grid-gutter));
    flex: 0 0 calc(50% - var(--grid-gutter));
    max-width: calc(50% - var(--grid-gutter));
  }
  .col-7-md {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(58.33333% - var(--grid-gutter));
    flex: 0 0 calc(58.33333% - var(--grid-gutter));
    max-width: calc(58.33333% - var(--grid-gutter));
  }
  .col-8-md {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(66.66667% - var(--grid-gutter));
    flex: 0 0 calc(66.66667% - var(--grid-gutter));
    max-width: calc(66.66667% - var(--grid-gutter));
  }
  .col-9-md {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(75% - var(--grid-gutter));
    flex: 0 0 calc(75% - var(--grid-gutter));
    max-width: calc(75% - var(--grid-gutter));
  }
  .col-10-md {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(83.33333% - var(--grid-gutter));
    flex: 0 0 calc(83.33333% - var(--grid-gutter));
    max-width: calc(83.33333% - var(--grid-gutter));
  }
  .col-11-md {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(91.66667% - var(--grid-gutter));
    flex: 0 0 calc(91.66667% - var(--grid-gutter));
    max-width: calc(91.66667% - var(--grid-gutter));
  }
  .col-12-md {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(100% - var(--grid-gutter));
    flex: 0 0 calc(100% - var(--grid-gutter));
    max-width: calc(100% - var(--grid-gutter));
  }
}
@media screen and (min-width: 1200px) {
  .col-1-lg {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(8.33333% - var(--grid-gutter));
    flex: 0 0 calc(8.33333% - var(--grid-gutter));
    max-width: calc(8.33333% - var(--grid-gutter));
  }
  .col-2-lg {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(16.66667% - var(--grid-gutter));
    flex: 0 0 calc(16.66667% - var(--grid-gutter));
    max-width: calc(16.66667% - var(--grid-gutter));
  }
  .col-3-lg {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(25% - var(--grid-gutter));
    flex: 0 0 calc(25% - var(--grid-gutter));
    max-width: calc(25% - var(--grid-gutter));
  }
  .col-4-lg {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(33.33333% - var(--grid-gutter));
    flex: 0 0 calc(33.33333% - var(--grid-gutter));
    max-width: calc(33.33333% - var(--grid-gutter));
  }
  .col-5-lg {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(41.66667% - var(--grid-gutter));
    flex: 0 0 calc(41.66667% - var(--grid-gutter));
    max-width: calc(41.66667% - var(--grid-gutter));
  }
  .col-6-lg {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(50% - var(--grid-gutter));
    flex: 0 0 calc(50% - var(--grid-gutter));
    max-width: calc(50% - var(--grid-gutter));
  }
  .col-7-lg {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(58.33333% - var(--grid-gutter));
    flex: 0 0 calc(58.33333% - var(--grid-gutter));
    max-width: calc(58.33333% - var(--grid-gutter));
  }
  .col-8-lg {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(66.66667% - var(--grid-gutter));
    flex: 0 0 calc(66.66667% - var(--grid-gutter));
    max-width: calc(66.66667% - var(--grid-gutter));
  }
  .col-9-lg {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(75% - var(--grid-gutter));
    flex: 0 0 calc(75% - var(--grid-gutter));
    max-width: calc(75% - var(--grid-gutter));
  }
  .col-10-lg {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(83.33333% - var(--grid-gutter));
    flex: 0 0 calc(83.33333% - var(--grid-gutter));
    max-width: calc(83.33333% - var(--grid-gutter));
  }
  .col-11-lg {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(91.66667% - var(--grid-gutter));
    flex: 0 0 calc(91.66667% - var(--grid-gutter));
    max-width: calc(91.66667% - var(--grid-gutter));
  }
  .col-12-lg {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(100% - var(--grid-gutter));
    flex: 0 0 calc(100% - var(--grid-gutter));
    max-width: calc(100% - var(--grid-gutter));
  }
}
fieldset {
  padding: 0.5rem 2rem;
}

legend {
  text-transform: uppercase;
  font-size: 0.8em;
  letter-spacing: 0.1rem;
}

input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=color]):not([type=button]):not([type=reset]), select, textarea, textarea[type=text] {
  font-family: inherit;
  padding: 0.8rem 1rem;
  border-radius: 4px;
  border: 1px solid var(--color-lightGrey);
  font-size: 1em;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  display: block;
  width: 100%;
}

input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=color]):not([type=button]):not([type=reset]):not(:disabled):hover, select:hover, textarea:hover, textarea[type=text]:hover {
  border-color: var(--color-grey);
}

input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=color]):not([type=button]):not([type=reset]):focus, select:focus, textarea:focus, textarea[type=text]:focus {
  outline: none;
  border-color: var(--color-primary);
  -webkit-box-shadow: 0 0 1px var(--color-primary);
  box-shadow: 0 0 1px var(--color-primary);
}

input.error:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=color]):not([type=button]):not([type=reset]), textarea.error {
  border-color: var(--color-error);
}

input.success:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=color]):not([type=button]):not([type=reset]), textarea.success {
  border-color: var(--color-success);
}

select {
  -webkit-appearance: none;
  background: #f3f3f6 no-repeat 100%;
  background-size: 1ex;
  background-origin: content-box;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='40' fill='%23555'><polygon points='0,0 60,0 30,40'/></svg>");
}

[type=checkbox], [type=radio] {
  width: 1.6rem;
  height: 1.6rem;
}

.button, [type=button], [type=reset], [type=submit], button {
  padding: 1rem 2.5rem;
  color: var(--color-darkGrey);
  background: var(--color-lightGrey);
  border-radius: 4px;
  border: 1px solid transparent;
  font-size: var(--font-size);
  line-height: 1;
  text-align: center;
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
  text-decoration: none;
  -webkit-transform: scale(1);
  transform: scale(1);
  display: inline-block;
  cursor: pointer;
}

.grouped {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.grouped > .button:not(:last-child), .grouped > input:not(:last-child) {
  margin-right: 16px;
}

.button + .button {
  margin-left: 1rem;
}

.button:hover, [type=button]:hover, [type=reset]:hover, [type=submit]:hover, button:hover {
  opacity: 0.8;
}

.button:active, [type=button]:active, [type=reset]:active, [type=submit]:active, button:active {
  -webkit-transform: scale(0.98);
  transform: scale(0.98);
}

button:disabled, button:disabled:hover, input:disabled, input:disabled:hover {
  opacity: 0.4;
  cursor: not-allowed;
}

.button.dark, .button.error, .button.primary, .button.secondary, .button.success, [type=submit] {
  color: #fff;
  background-color: #000;
  background-color: var(--color-primary);
}

.button.secondary {
  background-color: var(--color-grey);
}

.button.dark {
  background-color: var(--color-darkGrey);
}

.button.error {
  background-color: var(--color-error);
}

.button.success {
  background-color: var(--color-success);
}

.button.outline {
  background-color: transparent;
  border-color: var(--color-lightGrey);
}

.button.outline.primary {
  border-color: var(--color-primary);
  color: var(--color-primary);
}

.button.outline.secondary {
  border-color: var(--color-grey);
  color: var(--color-grey);
}

.button.outline.dark {
  border-color: var(--color-darkGrey);
  color: var(--color-darkGrey);
}

.button.clear {
  background-color: transparent;
  border-color: transparent;
  color: var(--color-primary);
}

.button.icon {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.button.icon > img {
  margin-left: 2px;
}

.button.icon-only {
  padding: 1rem;
}

::-webkit-input-placeholder {
  color: #bdbfc4;
}

:-ms-input-placeholder {
  color: #bdbfc4;
}

::-ms-input-placeholder {
  color: #bdbfc4;
}

::placeholder {
  color: #bdbfc4;
}

.nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  min-height: 5rem;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}

.nav img {
  max-height: 3rem;
}

.nav-center, .nav-left, .nav-right, .nav > .container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.nav-center, .nav-left, .nav-right {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.nav-left {
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.nav-right {
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.nav-center {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

@media screen and (max-width: 480px) {
  .nav, .nav > .container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .nav-center, .nav-left, .nav-right {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
}
.nav .brand, .nav a {
  text-decoration: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 1rem 2rem;
  color: var(--color-darkGrey);
}

.nav .active:not(.button) {
  color: #000;
  color: var(--color-primary);
}

.nav .brand {
  font-size: 1.75em;
  padding-top: 0;
  padding-bottom: 0;
}

.nav .brand img {
  padding-right: 1rem;
}

.nav .button {
  margin: auto 1rem;
}

.card {
  padding: 1rem 2rem;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

.card p:last-child {
  margin: 0;
}

.card header > * {
  margin-top: 0;
  margin-bottom: 1rem;
}

.tabs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.tabs a {
  text-decoration: none;
}

.tabs > a {
  padding: 1rem 2rem;
  -webkit-box-flex: 0;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  color: var(--color-darkGrey);
  border-bottom: 2px solid var(--color-lightGrey);
  text-align: center;
}

.tabs > a.active, .tabs > a:hover {
  opacity: 1;
  border-bottom: 2px solid var(--color-darkGrey);
}

.tabs > a.active {
  border-color: var(--color-primary);
}

.tabs.is-full a {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}

.tag {
  display: inline-block;
  border: 1px solid var(--color-lightGrey);
  text-transform: uppercase;
  color: var(--color-grey);
  padding: 0.5rem;
  line-height: 1;
  letter-spacing: 0.5px;
}

.tag.is-small {
  padding: 0.4rem;
  font-size: 0.75em;
}

.tag.is-large {
  padding: 0.7rem;
  font-size: 1.125em;
}

.tag + .tag {
  margin-left: 1rem;
}

.bg-primary {
  background-color: var(--color-primary) !important;
}

.bg-light {
  background-color: var(--color-lightGrey) !important;
}

.bg-dark {
  background-color: var(--color-darkGrey) !important;
}

.bg-grey {
  background-color: var(--color-grey) !important;
}

.bg-error {
  background-color: var(--color-error) !important;
}

.bg-success {
  background-color: var(--color-success) !important;
}

.bd-primary {
  border: 1px solid var(--color-primary) !important;
}

.bd-light {
  border: 1px solid var(--color-lightGrey) !important;
}

.bd-dark {
  border: 1px solid var(--color-darkGrey) !important;
}

.bd-grey {
  border: 1px solid var(--color-grey) !important;
}

.bd-error {
  border: 1px solid var(--color-error) !important;
}

.bd-success {
  border: 1px solid var(--color-success) !important;
}

.text-primary {
  color: var(--color-primary) !important;
}

.text-light {
  color: var(--color-lightGrey) !important;
}

.text-dark {
  color: var(--color-darkGrey) !important;
}

.text-grey {
  color: var(--color-grey) !important;
}

.text-error {
  color: var(--color-error) !important;
}

.text-success {
  color: var(--color-success) !important;
}

.text-white {
  color: #fff !important;
}

.pull-right {
  float: right !important;
}

.pull-left {
  float: left !important;
}

.is-text-center {
  text-align: center;
}

.is-text-left {
  text-align: left;
}

.is-text-right {
  text-align: right;
}

.is-text-uppercase {
  text-transform: uppercase;
}

.is-text-lowercase {
  text-transform: lowercase;
}

.is-text-capitalize {
  text-transform: capitalize;
}

.is-full-screen {
  width: 100%;
  min-height: 100vh;
}

.is-full-width {
  width: 100% !important;
}

.is-vertical-align {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.is-center, .is-horizontal-align {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.is-center {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.is-right {
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.is-left, .is-right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.is-left {
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.is-fixed {
  position: fixed;
  width: 100%;
}

.is-paddingless {
  padding: 0 !important;
}

.is-marginless {
  margin: 0 !important;
}

.clearfix {
  content: "";
  display: table;
  clear: both;
}

.is-hidden {
  display: none !important;
}

@media screen and (max-width: 599px) {
  .hide-sm {
    display: none !important;
  }
}
@media screen and (min-width: 600px) and (max-width: 1199px) {
  .hide-md {
    display: none !important;
  }
}
@media screen and (min-width: 1200px) {
  .hide-lg {
    display: none !important;
  }
}
/* Este es el mecanismo de importación de SASS, con Jekyll los busca en
 * _sass/ */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100;
  src: url("font-files/Inter-Thin.woff2?v=3.3") format("woff2"), url("font-files/Inter-Thin.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 100;
  src: url("font-files/Inter-ThinItalic.woff2?v=3.3") format("woff2"), url("font-files/Inter-ThinItalic.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 200;
  src: url("font-files/Inter-ExtraLight.woff2?v=3.3") format("woff2"), url("font-files/Inter-ExtraLight.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 200;
  src: url("font-files/Inter-ExtraLightItalic.woff2?v=3.3") format("woff2"), url("font-files/Inter-ExtraLightItalic.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 300;
  src: url("font-files/Inter-Light.woff2?v=3.3") format("woff2"), url("font-files/Inter-Light.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 300;
  src: url("font-files/Inter-LightItalic.woff2?v=3.3") format("woff2"), url("font-files/Inter-LightItalic.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  src: url("font-files/Inter-Regular.woff2?v=3.3") format("woff2"), url("font-files/Inter-Regular.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 400;
  src: url("font-files/Inter-Italic.woff2?v=3.3") format("woff2"), url("font-files/Inter-Italic.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 500;
  src: url("font-files/Inter-Medium.woff2?v=3.3") format("woff2"), url("font-files/Inter-Medium.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 500;
  src: url("font-files/Inter-MediumItalic.woff2?v=3.3") format("woff2"), url("font-files/Inter-MediumItalic.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  src: url("font-files/Inter-SemiBold.woff2?v=3.3") format("woff2"), url("font-files/Inter-SemiBold.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 600;
  src: url("font-files/Inter-SemiBoldItalic.woff2?v=3.3") format("woff2"), url("font-files/Inter-SemiBoldItalic.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  src: url("font-files/Inter-Bold.woff2?v=3.3") format("woff2"), url("font-files/Inter-Bold.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 700;
  src: url("font-files/Inter-BoldItalic.woff2?v=3.3") format("woff2"), url("font-files/Inter-BoldItalic.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 800;
  src: url("font-files/Inter-ExtraBold.woff2?v=3.3") format("woff2"), url("font-files/Inter-ExtraBold.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 800;
  src: url("font-files/Inter-ExtraBoldItalic.woff2?v=3.3") format("woff2"), url("font-files/Inter-ExtraBoldItalic.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 900;
  src: url("font-files/Inter-Black.woff2?v=3.3") format("woff2"), url("font-files/Inter-Black.woff?v=3.3") format("woff");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 900;
  src: url("font-files/Inter-BlackItalic.woff2?v=3.3") format("woff2"), url("font-files/Inter-BlackItalic.woff?v=3.3") format("woff");
}
/* -------------------------------------------------------
Variable font.
Usage:

  html { font-family: 'Inter', sans-serif; }
  @supports (font-variation-settings: normal) {
    html { font-family: 'Inter var', sans-serif; }
  }
*/
@font-face {
  font-family: "Inter var";
  font-weight: 100 900;
  font-style: normal;
  font-named-instance: "Regular";
  src: url("font-files/Inter-upright.var.woff2?v=3.3") format("woff2");
}
@font-face {
  font-family: "Inter var";
  font-weight: 100 900;
  font-style: italic;
  font-named-instance: "Italic";
  src: url("font-files/Inter-italic.var.woff2?v=3.3") format("woff2");
}
/* Legacy naming compatibility */
@font-face {
  font-family: "Inter var alt";
  font-weight: 100 900;
  font-style: normal;
  font-named-instance: "Regular";
  src: url("font-files/Inter-upright.var.woff2?v=3.3") format("woff2");
}
@font-face {
  font-family: "Inter var alt";
  font-weight: 100 900;
  font-style: italic;
  font-named-instance: "Italic";
  src: url("font-files/Inter-italic.var.woff2?v=3.3") format("woff2");
}
/* --------------------------------------------------------------------------
[EXPERIMENTAL] Multi-axis, single variable font.

Slant axis is not yet widely supported (as of February 2019) and thus this
multi-axis single variable font is opt-in rather than the default.

When using this, you will probably need to set font-variation-settings
explicitly, e.g.

  * { font-variation-settings: "slnt" 0deg }
  .italic { font-variation-settings: "slnt" 10deg }

*/
@font-face {
  font-family: "Inter var experimental";
  font-weight: 100 900;
  font-style: oblique 0deg 10deg;
  src: url("font-files/Inter.var.woff2?v=3.3") format("woff2");
}
/* Estas son variables de SASS */
:root {
  --fontSize: 15px;
  --lineHeight: calc(var(--fontSize) * 1.5);
  --spacing: 2rem;
  --spacingv: calc(var(--lineHeight) / 2);
}

body {
  background-color: #f4f4f4;
  color: #111;
  /* Esta definición la copié del sitio de Inter */
  font: 15px/22px "Inter", system-ui, sans-serif;
  font-kerning: normal;
  font-weight: 400;
  letter-spacing: -0.004em;
  font-variant-ligatures: contextual common-ligatures;
}

/* Bug de chota? */
.row {
  margin: 0;
}
.row .col {
  margin: 0;
  padding: 1rem;
}

h1, h2, h3, h4, h5, h6 {
  clear: both;
}

h1 {
  margin-left: -0.15rem;
  font-weight: 700;
  font-size: 4rem;
  letter-spacing: -0.07em;
  line-height: calc(var(--spacingv) * 6);
  margin-bottom: calc(var(--spacingv) * 2);
}
h1 a {
  text-decoration: none;
}

h2 {
  font-weight: 700;
  font-size: 1.8rem;
  letter-spacing: -0.03em;
  line-height: calc(var(--spacingv) * 3);
  margin-bottom: calc(var(--spacingv) * 2);
}

h3 {
  font-weight: 700;
  font-size: 1.2rem;
  letter-spacing: -0.018em;
  line-height: calc(var(--spacingv) * 2);
  margin-bottom: calc(var(--spacingv) * 2);
}

img.circle {
  border-radius: 50%;
}
img.square {
  object-fit: cover;
  width: 20vw;
  height: 20vw;
}

article > p {
  text-align: justify;
  -webkit-hyphens: auto;
  -webkit-hyphenate-limit-before: 3;
  -webkit-hyphenate-limit-after: 3;
  -webkit-hyphenate-limit-chars: 6 3 3;
  -webkit-hyphenate-limit-lines: 2;
  -webkit-hyphenate-limit-last: always;
  -webkit-hyphenate-limit-zone: 8%;
  -moz-hyphens: auto;
  -moz-hyphenate-limit-chars: 6 3 3;
  -moz-hyphenate-limit-lines: 2;
  -moz-hyphenate-limit-last: always;
  -moz-hyphenate-limit-zone: 8%;
  -ms-hyphens: auto;
  -ms-hyphenate-limit-chars: 6 3 3;
  -ms-hyphenate-limit-lines: 2;
  -ms-hyphenate-limit-last: always;
  -ms-hyphenate-limit-zone: 8%;
  hyphens: auto;
  hyphenate-limit-chars: 6 3 3;
  hyphenate-limit-lines: 2;
  hyphenate-limit-last: always;
  hyphenate-limit-zone: 8%;
}
article blockquote {
  border: none;
  font-size: 2rem;
  padding: 0.5rem;
  max-width: 25%;
}
article blockquote:nth-of-type(even) {
  float: left;
}
article blockquote:nth-of-type(odd) {
  float: right;
}

/* Acá estoy redefiniendo chota.css */
.is-white .tabs {
  /* El & se refiere a la regla madre (?)  */
  /* O sea compila a .tabs > a que es como define chota el color de los
  * botones de navegación */
}
.is-white .tabs > a {
  color: #f4f4f4;
}

/* Acá van a ir todos los estilos para la pantalla de inicio */
#inicio {
  /* Margen negativo para que el menú entre en la pantalla principal */
  margin-top: -50px;
  /* Con SASS se pueden declarar estilos que sólo aplican dentro de
   * otros */
  background-image: url("images/inicio.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  /* Esto solo aplica a los h1 dentro de #inicio */
}
#inicio h1, #inicio h2 {
  color: #f4f4f4;
  /* Sin sombra el texto no se lee sobre la foto */
  text-shadow: 2px 2px #111;
}
#inicio h1 {
  font-size: 5rem;
}
#inicio h2 {
  font-size: 3rem;
}

#footer {
  background-color: #111;
  color: #f4f4f4;
  /* Por alguna razón chota calcula mal los márgenes del footer */
}
#footer .row {
  margin: 0;
}
#footer ul {
  list-style: none;
  padding: 0;
}
#footer ul li {
  margin-bottom: 2rem;
}

/* Reglas para tablets */
@media screen and (min-width: 600px) and (max-width: 1199px) {
  #inicio {
    background-image: url("images/inicio_768px.jpg");
  }
}
/* Reglas para celulares */
@media screen and (max-width: 599px) {
  #inicio {
    background-image: url("images/inicio_480px.jpg");
    /* En responsive no queremos que el título pise la cabeza de Elio */
  }
  #inicio .is-vertical-align {
    align-items: flex-start;
  }
  #inicio h1 {
    margin-top: 20%;
  }
  img.square {
    width: 60vw;
    height: 60vw;
  }
  article {
    padding: 1rem;
  }
  article blockquote {
    max-width: 100%;
  }
  article blockquote:nth-of-type(even) {
    float: none;
  }
  article blockquote:nth-of-type(odd) {
    float: none;
  }
}

/*# sourceMappingURL=main.css.map */