body{
  background-color: $main-bg-color;
  font-family: $sys-font;
  color: $main-text-color;
  overflow: hidden;
}

.simple-padding{
  padding-top: 4px;
  padding-left: 8px;
  padding-right: 8px;
}

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

// Overriding some purecss settings. WHY have the grid do anything
// other than GRID related stuff! Leave text/font alone!
.pure-g {
  font-family: inherit;
}

.pure-g [class *= "pure-u"] {
  font-family: inherit;
}

// Allow for the disabling of the flex-flow: wrap.
// This allows me to use overflow:hidden without pure-g wrapping on
// me! ... but only for those pure-g elements I want.
.pure-g-nw{
  flex-flow: row;
}

// Used to hide the ENTIRE page until the system has finished readying
// everything.
.cover {
  @include cover();  
}


.coverFadeout {
  -webkit-animation: coverFadeout 1s linear 1 forwards;
  animation: coverFadeout 1s linear 1 forwards;
}

@-webkit-keyframes coverFadeout {
  0% {@include opacity(1);}
  100% {@include opacity(0);}
}


@keyframes coverFadeout {
  0% {@include opacity(1);}
  100% {@include opacity(0);}
}