// Typography

// Body Text

body {
  font-weight: normal;
  font-size: $baseFontSize;
  line-height: $baseLineHeight;
  font-family: $font-stack;
  color: $baseFontColor;
}

p {
  margin-bottom: $baseLineHeight;
}

// Links

a {
  color: $linkColor;
  text-decoration: none;
  cursor: pointer;

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

  &.lnk-title {
    color: mix(#ffffff, $black, 40%);

    &:hover {
      color: $black;
    }
  }

  &.lnk-text {
    color: $baseFontColor;

    &:hover {
      color: $black;
    }
  }
}

// Headings

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
  font-weight: bold;
  margin-bottom: ($baseLineHeight / 2.5);
  color: lighten($baseFontColor, 10%);
}
.h1, .h2, .h3, .h4, .h5, .h6, .h-lead {
  font-weight: normal;
}
h1, .h1 { font-size: 20px; }
h2, .h2 { font-size: 18px; }
h3, .h3 { font-size: 16px; }
h4, .h4 { font-size: 15px; }
h5, .h5 { font-size: 14px; padding-bottom: ($baseLineHeight / 3); }
h6, .h6 { font-size: 13px; padding-bottom: ($baseLineHeight / 3); }

.h-lead { font-size: 32px; }
.h-sub { font-size: 15px; font-weight: normal; }

.h-alt, .subh-alt  {
   border-top: 3px solid $borderColor;
   font-size: 14px;
   margin: 0;
   padding: $spacingXs 0;
}

.subh-divider {
  padding-bottom: $spacingXs;
  border-bottom: 1px solid $panelBorder;
  font-size: 14px;
}

.h-bx {
  $_h-bx-font-size: 14px;
  border-bottom: 1px solid $grayLighter;
  color: $grayDark;
  margin-bottom: $spacingM;
  padding: 0 0 $spacingS 0;
  font-size: $_h-bx-font-size;
  font-weight: 700;

  small {
    font-size: $_h-bx-font-size;
    font-weight: 300;
    display: block;
    text-transform: none;
    color: $gray;
  }

  .h-bx-link {
    position: relative;
    @include float-right($rtl);
    @include left($rtl, 7px);
    top: (-1 * $spacingS);

    &:hover,
    &:focus {
      .vicon {
        color: $gray;
      }
    }

    .vicon {
      color: $grayLight;
      font-size: 14px;
      margin: 0 -1px 0 0;
    }

  }

  &.uppercase {
    font-size: 13px;
    small {
      font-size: 13px;
    }
    .vicon,.tooltip-content {
      text-transform: none;
    }
  }

  &.h-bx-normal {
    font-family: "Arial", sans-serif;
  }

  &.h-bx-main {
    border-bottom-color: $orange1;
    .h-bx-link {
      .vicon {
        color: $orange1;
      }
      &:hover,
      &:focus {
        .vicon {
          color: darken($orange1, 10%);
        }
      }
    }
  }
}

// Lists

ul.link-list {
   list-style: none;
   margin: 0;
   padding: 0;

   li {
    position: relative;
    margin: 0 0 $spacingXs 0;
    padding: 0;
    @include padding-left($rtl, 7px);

    &:before {
      @if $rtl == false { @mixin position($rtl){ left: 0; }}
      @if $rtl == true { @mixin position($rtl){ right: 0; }}

      content: '';
      position: absolute;
      @include position($rtl);
      top: 0.5em;
      width: 3px;
      height: 3px;
      background: $linkColor;
    }
   }
}

ul.list-square li {
  list-style: square;
  @include margin-left($rtl, $spacingM);
}

ul.list-disc li {
  list-style: disc;
  @include margin-left($rtl, $spacingM);
}

.list-bx {
  list-style: none;

  li {
    border-top: 1px solid mix(#ffffff, $blueSoft, 70%);
    padding: ($spacingXs * 1.5) 0;

    &:first-child {
      border-top: none;
    }
  }
}

// Panels
.panel {
   border-top: 1px solid #E6EAED;
   background: #F7F9FA;
   padding: $spacingS;
}

// Horizontal dividers
.divider-before {
  padding-top: $spacingS;
  border-top: 1px dotted $borderColor;
}

.divider-after {
  padding-bottom: $spacingS;
  border-bottom: 1px dotted $borderColor;
}

// Emphasis
strong {
  font-style: inherit;
  font-weight: bold;
}
em {
  font-style: italic;
  font-weight: inherit;
  line-height: inherit;
}
.muted {
  color: $gray;
}

 // Inline and block code styles
code, pre {
    padding: 0 3px 2px;
    @include font-code();
}
code {
    padding: 1px 3px;
    display: inline-block;
    @include border-radius($borderRadiusS);
}
pre {
	overflow-x: scroll;
	overflow: auto;
}