/**
 * Import Compass
 */
/* ==========================================================================
   Buttons
   ========================================================================== */
/**
 * Core Button Component
 *
 * This is a core button component.  This only contains the relevant structural
 * styles necessary to render a button.  This class can be applied to buttons,
 * links, or input buttons.
 *
 * Example HTML:
 *
 * <button class="t-Button [modifiers]" type="submit">Button Label</button>
 * <a class="t-Button [modifiers]" href="#" role="button">Button Label</a>
 * <input class="t-Button [modifiers]" type="submit" value="Button Label">
 *
 */
/**
 * Button
 *
 * 1. Use proper box-model for button sizing across all browsers
 * 2. Reset webkit based browser appearance
 * 4. Inherit font from ancestor
 * 5. Normalize line-height
 * 6. Prevent text selection on buttons
 * 7. Prevent wrapping of text in buttons
 */
.t-Button {
  box-sizing: border-box;
  /* 1 */
  -webkit-appearance: none;
  /* 2 */
  background: transparent;
  border: 0.1rem solid;
  cursor: pointer;
  display: inline-block;
  font: inherit;
  /* 4 */
  line-height: normal;
  /* 5 */
  margin: 0;
  padding: 0.4rem 1.2rem;
  position: relative;
  text-align: center;
  text-decoration: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  /* 6 */
  vertical-align: middle;
  white-space: nowrap;
  /* 7 */
  -webkit-font-smoothing: antialiased; }

/**
 * Hover, Focus and Click States
 */
.t-Button:hover, .t-Button:focus, .t-Button:active {
  text-decoration: none; }

/**
 * Disabled States
 */
.t-Button:disabled, .t-Button.is-disabled {
  cursor: default; }

/**
 * Firefox padding / border issue
 */
.t-Button::-moz-focus-inner {
  border: 0;
  padding: 0; }

/**
 * Spacing between buttons
 */
.t-Button + .t-Button {
  margin-left: 0.4rem; }
  .t-Button + .t-Button.t-Button--pill, .t-Button + .t-Button.t-Button--pillEnd {
    margin-left: -0.1rem !important; }
  .t-Button + .t-Button.t-Button--stretch {
    margin-left: 0 !important; }

/**
 * Pill Buttons
 */
.t-Button--pillStart {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  margin-right: 0 !important; }

.t-Button--pillEnd {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  margin-left: 0 !important; }

.t-Button--pillStart + .t-Button--pillEnd {
  margin-left: -0.1rem !important; }

.t-Button--pill {
  border-radius: 0 !important;
  margin-right: -0.1rem !important; }

.t-Button--padLeft {
  margin-left: 0.4rem !important; }

.t-Button--padRight {
  margin-right: 0.4rem !important; }

.t-Button--gapLeft {
  margin-left: 1.2rem !important; }

.t-Button--gapRight {
  margin-right: 1.2rem !important; }

.t-Button-badge {
  padding: 0 0.6rem;
  display: inline-block;
  margin-left: 0.4rem; }
  .t-Button-badge:empty {
    display: none; }

/**
 * Stretch Button
 */
.t-Button--stretch {
  width: 100%;
  display: block;
  margin-bottom: 0.8rem; }
  .t-Button--stretch:last-child {
    margin-bottom: 0; }

/**
 * Buttons with Icons or Icon and Text
 */
.t-Button--icon {
  line-height: 1.6rem;
  min-width: 4rem;
  text-align: center; }
  .t-Button--icon .t-Icon.fa {
    vertical-align: bottom;
    line-height: 1.4rem;
    padding: 0.1rem 0;
    font-size: 1.4rem; }
  .t-Button--icon.t-Button--slim {
    padding-right: 0.8rem;
    padding-left: 0.8rem;
    min-width: 3.2rem; }

/**
 * Buttons with Icons or Icon and Text
 */
.t-Button--iconLeft .t-Icon {
  margin-right: 0.4rem; }
.t-Button--iconLeft .t-Icon.t-Icon--right {
  display: none; }

.t-Button--iconRight .t-Icon {
  margin-left: 0.4rem; }
.t-Button--iconRight .t-Icon.t-Icon--left {
  display: none; }

.t-Button {
  font-size: 1.2rem;
  line-height: 1.6rem;
  padding: 0.8rem 1.2rem;
  font-weight: 400; }

/**
 * Button Label
 */
/**
 * Small Button
 */
.t-Button--small {
  font-size: 1.1rem;
  line-height: 1.6rem;
  padding: 0.4rem 0.8rem; }

/**
 * Hot Button
 */
.t-Button--hot {
  -webkit-font-smoothing: normal; }

/**
 * Hide Show Icon
 */
.t-Button--hideShow {
  font-size: 1.1rem;
  line-height: 1.4rem;
  padding: 0.4rem;
  min-width: 2.4rem; }
  .t-Button--hideShow.t-Button {
    border-radius: 100%; }

/**
 * Large Button
 */
.t-Button--large {
  padding: 1.4rem 1.6rem;
  line-height: 1.6rem;
  font-size: 1.4rem; }
  .t-Button--large.t-Button--withIcon {
    line-height: 1.6rem;
    padding: 1.2rem 1.4rem; }

/**
 * Nav Control Button
 */
.t-Button.t-Button--header {
  padding: 1.2rem;
  vertical-align: top;
  box-shadow: none;
  border-radius: 0;
  text-align: center; }
  .t-Button.t-Button--header + .t-Button.t-Button--header {
    margin: 0; }
  .t-Button.t-Button--header.t-Button--headerTree, .t-Button.t-Button--header.t-Button--headerRight {
    width: 40px;
    height: 40px; }

.t-Button--navBar {
  min-width: 40px;
  -webkit-font-smoothing: antialiased; }
  .t-Button--navBar .t-Button-badge {
    margin-left: 4px;
    font-size: 11px; }
  .t-Button--navBar .t-Button-label {
    display: inline-block;
    line-height: 16px; }
  .t-Button--navBar .t-Icon {
    line-height: 16px; }
    .t-Button--navBar .t-Icon.fa, .t-Button--navBar .t-Icon.a-Icon {
      margin-right: 4px; }
  @media only screen and (max-width: 640px) {
    .t-Button--navBar .t-Button-badge {
      position: absolute;
      margin-left: 0;
      top: 4px;
      right: 4px;
      font-size: 10px;
      line-height: 1.4rem;
      padding: 0 0.4rem; }

    .t-Button--navBar .t-Button-label {
      display: none; }

    .t-Button--navBar .a-Icon.icon-down-arrow {
      margin-right: -4px; }
 }

.t-Button--headerUser {
  text-transform: lowercase;
  cursor: default; }

/******************************************************************************
Button in Region Header
******************************************************************************/
.t-Region-headerItems--buttons .t-Button + .js-maximizeButtonContainer {
  margin-left: 1.1rem; }

.js-maximizeButtonContainer .t-Button {
  margin-right: 0.4rem; }

.t-Region-headerItems--buttons .t-Button--icon + .t-Button--icon {
  margin-left: 0; }

.t-Region--hideShow .t-Region-headerItems--buttons .t-Button:last-child {
  margin-right: 1.1rem; }

.t-Button--noUI, .t-Button--noUI:hover, .t-Button--noUI:active {
  text-shadow: none !important;
  background-color: transparent !important; }

.t-Button.t-Button--noUI {
  box-shadow: none; }