///////////////////////// Blockquotes and Alert Blocks /////////////////////////

blockquote,
.block, {
  padding: 1.65rem 2rem .1rem 2rem;
  margin: 1rem 0 2rem;
  border-width: 0 0 0 4px;
  border-style: solid;
  border-radius: 0 $radius $radius 0;
  font-size: 1.05rem;

  ul,ol {
    &:last-child { margin-bottom: 1.85rem; }
  }

  & > h2,
  & > h3,
  & > h4,
  & > h5,
  & > h6 {
    &:first-child {margin-top: 0; padding-top: 0.25em;}
  }

  &.note,
  &.tip,
  &.important,
  &.warning, &.warn,
  &.caution {
    position: relative;
    &:before {
      position: absolute;
      font-family: "alert-icons";
      font-size: 1em;
      line-height: 1em;
      padding: .3rem;
      text-align: center;
      top: -.5rem;
      left: -.95rem;
      display: block;
      border-radius: 50%;
      box-shadow: 1px 3px 5px rgba($article-shadow, .5);
    }
  }
}

h2, h3, h4, h5, h6 {
  & + .note,
  & + .tip,
  & + .important,
  & + .warning,
  & + .caution {
    margin-top: 1.25rem;
  }
}


blockquote {
  padding: 1rem 1rem 1rem 1.25rem;
  border-color: rgba($article-text, .25);
  p, li {
    font-size: 1.15rem;
    font-style: italic;
    color: rgba($article-text, .5);
  }
  *:last-child {margin-bottom: 0;}
  .cite {
    display: block;
    margin-top: -1rem;
    font-style: italic;
    font-size: .85rem;
    opacity: .8;
  }
}

// Normal paragraph citations
& > p span.cite {
  vertical-align: super;
  line-height: 0;
  font-size: .7rem;
  font-style: italic;
}

////////////////////////////////////////////////////////////////////////////////
///////////////////////////////// MEDIA QUERIES ////////////////////////////////
////////////////////////////////////////////////////////////////////////////////

@include media(small) {
  blockquote,
  .block {
    padding: 1.35rem 1.25rem .1rem 1.25rem;
    margin: .5rem 0 1rem;
  }
}

@import "blocks/note",
  "blocks/tip",
  "blocks/important",
  "blocks/warning",
  "blocks/caution",
  "blocks/beta";