@import "normalize";
@import "fonts";
@import "variables";
@import "btn";

html {
  box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

p {
  line-height: 30px;
}

a {
  color: #26abe8;
}

body,
html {
  height: 100%;
  color: $regent-gray;
  font-size: 16px;
  font-family: $primary;
  line-height: 1.5;
}

body {
  display: flex;
  flex-direction: column;
}

// hack since ember insits on throwing a random div
// that messes up the height of the border.
body > .ember-view {
  flex: 1;
}

.page-content-border {
  height: 100%;
  background-image: url('images/background.svg');
  background-repeat: no-repeat;
  background-size: 100%;
  padding: 20px;
}

.page-content {
  height: 100%;
  padding: 20px;
  background: white;
}

.addon-nav {
  margin-top: 25px;
}
.nav-link {
  &.active {
    background-color: #26abe8 !important;
  }
}

pre {
  margin-top: 1em;
}