//
// Typography
// --------------------------------------------------


// Headings
// -------------------------

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: @headings-font-family;
  font-weight: @headings-font-weight;
  line-height: @headings-line-height;
  color: @headings-color;

  small {
    color: @headings-small-color;
  }
}

h1,
h2,
h3 {
  margin-top: @line-height-computed;
  margin-bottom: (@line-height-computed / 2);
}
h4,
h5,
h6 {
  margin-top: (@line-height-computed / 2);
  margin-bottom: (@line-height-computed / 2);
}

h6 {
  font-weight: normal;
}

h1, .h1 { font-size: @font-size-h1; } // ~62px
h2, .h2 { font-size: @font-size-h2; } // ~52px
h3, .h3 { font-size: @font-size-h3; } // ~40px
h4, .h4 { font-size: @font-size-h4; } // ~29px
h5, .h5 { font-size: @font-size-h5; } // ~28px
h6, .h6 { font-size: @font-size-h6; } // ~24px


// Body text
// -------------------------

p {
  font-size:   @font-size-base;
  line-height: @line-height-base;
  margin: 0 0 (@line-height-computed / 2);
}

.lead {
  margin-bottom: @line-height-computed;
  font-size:   floor((@font-size-base * 1.556));  // ~28px
  line-height: 1.46428571;                      // ~41px
  font-weight: 300;

  @media (min-width: @screen-sm-min) {
    font-size: (@font-size-base * 1.667);       // ~30px
  }
}

// Emphasis & misc
// -------------------------

// Ex: 18px base font * 83% = about 15px
small,
.small {
  font-size: 83%;     // ~15px
  line-height: 2.067; // ~31px
}

// Contextual emphasis
.text-muted {
  color: @text-muted;
}
.text-inverse {
  color: @inverse;
}
.text-primary {
  .text-emphasis-variant(@brand-secondary);
}
.text-warning {
  .text-emphasis-variant(@state-warning-text);
}
.text-danger {
  .text-emphasis-variant(@state-danger-text);
}
.text-success {
  .text-emphasis-variant(@state-success-text);
}
.text-info {
  .text-emphasis-variant(@state-info-text);
}

// Contextual backgrounds
.bg-primary {
  // Given the contrast here, this is the only class to have its color inverted
  // automatically.
  color: @inverse;
  .bg-variant(@brand-primary);
}
.bg-success {
  .bg-variant(@state-success-bg);
}
.bg-info {
  .bg-variant(@state-info-bg);
}
.bg-warning {
  .bg-variant(@state-warning-bg);
}
.bg-danger {
  .bg-variant(@state-danger-bg);
}


// Page header
// -------------------------

.page-header {
  padding-bottom: ((@line-height-computed / 2) - 1);
  margin: (@line-height-computed * 2) 0 @line-height-computed;
  border-bottom: 2px solid @page-header-border-color;
}


// Lists
// --------------------------------------------------

// Unordered and Ordered lists
ul,
ol {
  margin-bottom: (@line-height-computed / 2);
}

// Description Lists
dl {
  margin-bottom: @line-height-computed;
}
dt,
dd {
  line-height: @line-height-base;
}

// Horizontal description lists
//
// Defaults to being stacked without any of the below styles applied, until the
// grid breakpoint is reached (default of ~768px).

@media (min-width: @grid-float-breakpoint) {
  .dl-horizontal {
    dt {
      width: (@dl-horizontal-offset - 20);
    }
    dd {
      margin-left: @dl-horizontal-offset;
    }
  }
}

// MISC
// ----

// Abbreviations and acronyms
abbr[title],
abbr[data-original-title] {
  border-bottom: 1px dotted @abbr-border-color;
}

// Blockquotes
blockquote {
  border-left: 3px solid @blockquote-border-color;
  padding: 0 0 0 16px;
  margin: 0 0 @line-height-computed;

  p {
    font-size: ceil((@font-size-base * 1.111)); // ~20px
    line-height: 1.55;                        // ~31px
    font-weight: normal;
    margin-bottom: .4em;
  }
  small,
  .small {
    font-size: @font-size-base;
    line-height: @line-height-base;
    font-style: italic;
    color: @blockquote-small-color;

    &:before {
      content: "";
    }
  }

  // Float right with text-align: right
  &.pull-right {
    padding-right: 16px;
    padding-left: 0;
    border-right: 3px solid @blockquote-border-color;
    border-left: 0;

    small:after {
      content: "";
    }
  }
}

// Addresses
address {
  margin-bottom: @line-height-computed;
  line-height: @line-height-base;
}

// Sup and Sub
sub,
sup {
  font-size: 70%;
}