.site-header {

min-height: $spacing-unit * 1.865;
line-height: $base-line-height * $base-font-size * 2.25;

// Positioning context for the mobile navigation icon
position: relative;

.blinking_cursor {
  animation: blinker 1s none infinite;
  font-size: $base-font-size * 1.25;
}

.command_prompt {
  color: $color-blue;
  font-size: $base-font-size;
  margin-left: 0.1em;

  &:before {
    content: $icon-chevron-right;
    @include font-awesome-icon;
    margin-right: 0.2em;
  }
}

}

.site-title {

@include relative-font-size(1.625);
font-weight: 300;
margin-bottom: 0;
float: left;

@include media-query($on-palm) {
  padding-right: 45px;
}

&,
&:visited,
&:hover {
  @include themed() {
     color: t('foreground-color');
  }
  text-decoration: none;
}

}

.site-footer {

margin-bottom: 2em

}

.wrapper {

text-align: justify;

}

/**

* Author box
*/

.author-box {
  margin-bottom: 1em;
  text-align: left;
  min-height: 72px;
  font-style: italic;
  & > .author-avatar {
    float: left;
    white-space: pre-line;
    margin-right: 1em;
    width: 72px;
    height: 72px;
    border-radius: 0.3em;
  }
}

.site-header {

margin-bottom: 1em;

}

.post-title {

@include themed() {
   color: t('foreground-color');
}
text-align: left;

}

.post-description {

margin-top: 1em;
font-size: $base-font-size * 1.15;
@include themed() {
   color: t('foreground-color');
}
white-space: nowrap;
overflow: hidden;
width: 100%;
animation: type 2s steps(60, end);
margin-bottom: 1em;
margin-left: 0.5em;

&:after {
  content: "_";
  animation: blinker 1s none infinite;
  font-size: 16px;
}

&:before {
  content: $icon-chevron-right;
  @include font-awesome-icon;
  margin-right: 0.5em;
  color: $color-blue;
}

}

.post {

margin-bottom: 2em;
.post-date {
  margin-top: 1em;
  @include themed() {
     color: t('foreground-color-alt');
  }
  font-size: 12px;
  margin-top: 1em;
  margin-left: 0.5em;
}

strong {
  @include themed() {
     color: t('foreground-color-contrast');
  }
}

img {
  border-radius: 0.3em;
  width: 100%;
}

ol > li {
  margin-left: 1em;
  text-align: left;
  margin-bottom: 0.6em;
}

ul > li {
  text-align: left;
  margin-bottom: 0.6em;
  @include themed() {
     color: t('list-primary');
  }
  list-style: none;
  margin-left: 0;

  &:before {
    content: $icon-check;
    @include font-awesome-icon;
    margin-right: 0.5em;
  }
}

ul, ol {
  padding: 0;
  margin-left: 0.5em;
}

& > blockquote {
  margin-top: 2em;
  margin-bottom: 1em;
  margin-left: 0.5em;
  font-style: italic;
  @include themed() {
     color: t('quote-primary');
  }

  & > p {
      display: block;
      padding-left: 3em;
  }

  &:before {
    content: $icon-quote-right;
    @include font-awesome-icon;
    margin-right: -2em;
    float: left;

    font-size: 2em;
  }

  li {
    @include themed() {
       color: t('quote-secondary');
    }
    &:before {
      content: $icon-minus;
    }
  }
}

}

.post-link-wrapper {

  margin-bottom: 1.1em;
  & > .post-link {
    font-size: $base-font-size;
    font-size: $post-link-font-size;
    display: inline-block;
    text-align: initial;
  }

  & > .post-meta {
    @include themed() {
       color: t('foreground-color-alt');
    }
    font-size: $small-font-size;
  }
}

.tag-cloud {
  margin-bottom: 2em;
  text-align: left;
  & > a {
    display: inline-block;
    margin: 0.3em 0.3em 0.3em 0;
  }
}

.tag, .tag-cloud > a {

color: $color-green;
@include themed() {
   background-color: t('background-color');
}
padding: 0.3em 0.6em;
border-radius: 0.3em;
&:hover {
  text-decoration: none;
  color: lighten($color-green, 20%) !important;
  @include themed() {
     background-color: lighten(t('background-color'), 5%);
  }
}

&:before {
  content: $icon-tag;
  @include font-awesome-icon;
  margin-right: 0.5em;
}

}

.tag {

display: inline-block;
margin: 0.3em 0.3em 0.3em 0;

}

.post-tags {

margin-top: 0.3em;
margin-bottom: 0.5em;
text-align: initial;

}

.credits {

font-size: 10px;
@include themed() {
   color: lighten(t('background-color'), 5%);
}

& > a {
  @include themed() {
       color: lighten(t('background-color'), 10%);
  }
  text-decoration: underline;
}

}

.pagination {

font-size: $post-link-font-size;
margin: 1em 0;
& > a, & > span {
  font-weight: normal;
  display: inline-block;
  min-width: 1em;

  padding: 0.3em 0.6em;
  border-radius: 0.3em;
  text-align: center;

  &:hover {
    text-decoration: none;
  }
}

& > a {
  color: $color-green;
  @include themed() {
     background-color: t('background-color');
  }
  &:hover {
    color: lighten($color-green, 20%);
    @include themed() {
       background-color: lighten(t('background-color'), 5%);
    }
  }
}

& > span {
  @include themed() {
     color: darken(t('foreground-color'), 20%);
     background-color: darken(t('background-color'), 3%);
  }
}

}

.social_links {

float: right;
text-align: right;
display: inline-block;
& > a {
  @include themed() {
     color: darken(t('foreground-color'), 10%);
  }
  display: inline-block;
  padding-left: 0.3em;
  font-size: $post-link-font-size * 1.35;
}

}

ul.related-posts {

  margin: 0;
  margin-left: 1em;
  padding: 0;

& > li {
  list-style: none;
  margin-left: 0;

  a {
    display: inline-block;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
  }
  h3 {
    display: inline-block;
    margin: 0;
  }

  &:before {
    content: $icon-flask;
    @include font-awesome-icon;
    color: $color-green;
    margin-right: 0.5em;
  }
}

}

theme-toggle {

background-color: transparent;
border: none;
float: right;
display: inline-block;
&.dark {
    &:before {
        content: $icon-flask;
        @include font-awesome-icon;
    }
     @include themed() {
        color: t('foreground-color');
     }
}

&.light {
    &:before {
        content: $icon-flask;
        @include font-awesome-icon;
    }
    color: $color-yellow;
}

}