// =============================================================================
// _TOPBAR.SCSS
// -----------------------------------------------------------------------------
// Site styles.
// =============================================================================

// =============================================================================
// TABLE OF CONTENTS
// -----------------------------------------------------------------------------
//   01. Base Styles
// =============================================================================

// Base Styles
// =============================================================================

.x-topbar {
  position: relative;
  min-height: 46px;
  border-bottom: 1px solid darken($navbarBackground, 5%);
  background-color: $navbarBackground;
  z-index: $zindexNavbar + 1;
  @include clearfix();
  @include break(middle-bear) { text-align: center; }

  .p-info {
    float: left;
    margin: 13px 0 0;
    @include font-size(1.1);
    line-height: 1.3;
    color: $navbarLinkColor;
    @include break(middle-bear) {
      float: none;
      margin: 0;
      padding: 0.8em 1em 1em;
      background-color: darken($navbarBackground, 3.5%);
      border-radius: 0 0 4px 4px;
    }

    a {
      border-bottom: 1px dotted;
      color: $navbarLinkColor;

      &:hover {
        color: auto;
      }
    }
  }

  .x-social-global {
    float: right;
    margin-top: 10px;
    @include translate3d(0, 0, 0);
    @include break(middle-bear) {
      float: none;
      margin-bottom: 8px;
    }

    a {
      margin-left: 7px;
      @include font-size(2.4);
      @include break(middle-bear) {
        margin: 0 1.5%;
      }

      &.foursquare {
        @include font-size(2.2);
      }

      i {
        display: block;
      }
    }
  }
}

.x-navbar-fixed-left-active,
.x-navbar-fixed-right-active {
  .x-topbar {
    z-index: $zindexNavbar - 2;
    @include break(cubs) {
      z-index: $zindexNavbar + 1;
    }
  }
}