/*
    Sticky footer
-------------------------------
http://mystrd.at/modern-clean-css-sticky-footer/
*/

:root {
  --footer-height: calc(var(--unit) * 6);
}

html {
  position: relative;
  height: 100%;
}

body {
  min-height: 100%;
}

.layout {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
}

.main {
  flex: 1;
}

.footer {
  background-color: var(--color-inverse);
  color: var(--color-bg);
  margin-top: var(--unit-xl);
}

.footer a {
  color: var(--color-bg);
}

@media (--viewport-tablet) {
  .footer {
    height: var(--footer-height);
  }
}