body {
  margin-top: $navbar-height;
  padding: none;
}

.container-fluid { max-width: $screen-lg-min; }

// These names are generated by a rails controller
// scss-lint:disable SelectorFormat
.page-contacts,
.page-conversations,
.page-notifications,
.page-people.action-show,
.page-people.action-contacts,
.page-photos,
.page-posts,
.page-profiles.action-edit,
.page-services.action-index,
.page-streams,
.page-tags,
.page-user_applications,
.page-users.action-edit,
.page-users.action-update,
.page-users.action-privacy_settings {
  background-color: $main-background;
}
// scss-lint:enable SelectorFormat

// Overflow
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
code,
pre { word-wrap: break-word; }

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

.avatar {
  border-radius: 4px;

  &.micro {
    height: 20px;
    width: 20px;
  }

  &.small {
    height: 35px;
    width: 35px;
  }

  &.medium {
    height: auto;
    max-width: 75px;
    width: auto;
  }
}

.back-to-top {
  background-color: $border-dark-grey;
  border-radius: 4px;
  bottom: 20px;
  color: $white;
  display: block;
  font-size: 3.5em;
  height: 50px;
  line-height: 50px;
  opacity: 0;
  pointer-events: none;
  position: fixed;
  right: 20px;
  text-decoration: none;
  transition: opacity ease 400ms;
  width: 50px;
  z-index: 49;

  &:hover,
  &:focus,
  &:active {
    color: $white;
    text-decoration: none;
  }

  &.visible {
    opacity: .5;
    pointer-events: auto;

    &:hover {
      opacity: .85;
    }
  }
}

.noscript {
  background-color: rgba($black, .9);
  height: 100%;
  margin-top: -50px;
  position: fixed;
  width: 100%;
  z-index: 9001;

  h3 {
    background-color: $white;
    margin: 100px;
    padding: 50px;
  }
}

// general purpose classes

.small-horizontal-spacer {
  min-height: 20px;
}

// badge color
.badge-important {
  background-color: $red;
}
