#loading {
  text-align: center;
  display: block;
  position: fixed;
  width: 100%;
  top: 20%;
}

hr {
  margin-top: 2rem;
  margin-bottom: 2.5rem;
}

a {
  text-decoration: underline;
  color: #ababab;
  cursor: pointer;
}

.nounderline {
  text-decoration: none;
}

.inline {
  display: inline
}

.black {
  color: black
}

.top-half-em {
  margin-top: .5em
}

.thin {
  max-width: 60rem
}

.center-block {
  margin:auto;
  display:block;
}

.navbar {
  position: fixed;
  width: 100%;
  opacity: 1;
  background: rgb(255, 255, 255);
  z-index: 99;
}

.navbar a {
  text-decoration: none;
  color: inherit;
}

a:hover {
  color: black;
}

.text-center {
  text-align: center
}

.light {
  color: #707070
}

.breaker {
  word-break: break-all;
}

.app {
  padding-top: 9rem
}

.user-id .fa {
  margin-right: .25rem;
}

.whitelist .user-id {
  display: inline;
  margin-right: .3em
}

.post {
  display: block;
  max-width: 65rem;
  border: 1px solid #bbb;
  border-radius: .5rem;
  margin: 3rem auto;
}

.post .content {
  display: block;
  margin: 2rem;
}

.post .content img {
  margin: auto;
  max-width: 60rem;
}

.icons .fa, .comment .icons .fa {
  color: #707070;
}

.icons .a {
  color: #707070;
}

.icons .user-id {
  display: inline;
}

.icons .not-first{
  margin-left: 1rem;
}

.post-page .user-id {
  display: inline
}

.comment-page .user-id {
  display: inline
}

.comment .icons {
  margin-bottom: 1rem;
}

.comment .icons .user-id {
  margin-right: 1rem;
}

.shifted {
  margin-left: 2rem;
}

.navbar {
  border-bottom: 1px solid #eee;
  display: block;
  height: 4em
}

.navbar .container {
  padding-top: 1em
}

.navbar .iconbar {
  margin-top: -5.2rem;
}

.iconbar .fa {
  margin-left: .5rem;
}

.homepage {
  text-align: center;
  max-width: 70rem;
  margin: auto;
}

.homepage li {
  text-decoration: none;
}

.itsok p, h5 {
  display: inline-block;
  margin-bottom: 1rem;
}

.itsok h5 {
  margin-right: 1rem;
}

.your-profile {
  text-align: center
}

.new-profile {
  display: block;
  margin: 3rem auto;
}

.buttons .button {
  display: block;
  margin: auto;
  width: 80%
}

.buttons .not-first {
  /* mobile only */
  margin-top: 1rem;
}

@media (min-width: 550px) {
  /* larger than mobile */
  .navbar {
    height: 4.5em
  }
}

@media (min-width: 500px) {
  /* larger than mobile */
  .buttons {
    text-align: inherit;
  }
  .buttons .not-first {
    margin-left: 1rem;
    margin-top: auto;
  }
  .buttons .button {
    display: inline-block;
    width: auto;
  }
}