/**
 * Setting the html and body to be 100%. It works in conjunction with PageWrapper's
 *  .page-container and .page-push style to put the footer at the bottom.
 * This is one approach to having footer stick on the bottom without resorting to
 * absolute positioning. If however, these styles needs to be removed, then the
 * footer needs to be redesigned.
 */
html, body, .app-container {
  height: 100%;
}

a:-webkit-any-link {
  color: -webkit-link;
  text-decoration: underline;
}

.page-container {
  margin: 1em;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.u-flr {
  float: right;
}

.u-fll {
  float: left;
}

.ui-g-nopad-tb {
  padding-top: 0;
  padding-bottom: 0;
}

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

/** This pushes the content to the bottom.
  Used when you want to bottom align a text*/
.u-bottom-align {
  display: inline-block;
  height: 100%;
  vertical-align: bottom;
  width: 3px;
  margin-bottom: -3em;
}


.u-spin-icon {
  display: inline-block;
  animation: doSpin 2s infinite linear;
}

@keyframes doSpin {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}