/*  ----------------------------------------------------------------------------
    Breadcrumbs
*/
.td-crumb-container {
  min-height: 35px; //42px;
  margin-bottom: 9px;
  padding-top: 21px;

  /* responsive portrait tablet */
  @media (min-width: @responsive_p_tablet_min) and (max-width: @responsive_p_tablet_max) {
      padding-top: 16px;
  }

  /* responsive portrait phone */
  @media (max-width: @responsive_p_phone_max) {
      padding-top: 11px;
  }
}
.single-post .td-bred-no-url-last {
  /* responsive portrait phone */
  @media (max-width: @responsive_p_phone_max) {
      display: none;
  }
}

.entry-crumbs {
  font-family: @font1;
  font-size: 12px;
  color: #c3c3c3;
  line-height: 18px;
  padding-top: 1px;
  padding-bottom: 2px;

  a {
    color: #c3c3c3;

    &:hover {
      color: #777;
    }
  }

  .td-bread-sep {
    font-size: 8px;
    margin: 0 5px;
  }
}

// align breadcrumb when sidebar left
.td-sidebar-left {
  .td-crumb-container {
    padding-left: 372px;

    /* responsive landscape tablet */
    @media (min-width: @responsive_l_tablet_min) and (max-width: @responsive_l_tablet_max) {
      padding-left: 341px;
    }
    /* responsive portrait tablet */
    @media (min-width: @responsive_p_tablet_min) and (max-width: @responsive_p_tablet_max) {
      padding-left: 256px;
    }
    /* responsive portrait phone */
    @media (max-width: @responsive_p_phone_max) {
      padding-left: 0;
    }
  }
}
// float the left sidebar to fix on mobile the sidebar first issue
.td-sidebar-left-content {
  float: right !important;

  /* responsive portrait phone */
  @media (max-width: @responsive_p_phone_max) {
    float: none !important;
  }
}

/*  ----------------------------------------------------------------------------
    Category
*/
.td-category {
  list-style: none;
  font-family: @font1;
  font-size: 10px;
  margin-top: 0;
  margin-bottom: 10px;
  line-height: 1;

  li {
    display: inline-block;
    margin: 0 5px 5px 0;
    line-height: 1;
  }

  a {
    color: #fff;
    background-color: @td_black;
    padding: 3px 6px 4px 6px;
    white-space: nowrap;
    display: inline-block;

    &:hover {
      opacity: 0.9;
    }
  }
}


/*  ----------------------------------------------------------------------------
    Post title
*/
.post {
  background-color: #fff;

  header .entry-title {
    margin-top: 0;
    margin-bottom: 7px;
    word-wrap: break-word;
    font-size: 40px;
    line-height: 50px;

    @media (max-width: @responsive_p_tablet_max) {
      font-size: 32px;
      line-height: 40px;
    }
  }
}


/*  ----------------------------------------------------------------------------
    Subtitle
*/
.td-post-sub-title {
  font-family: @font1;
  font-size: 16px;
  font-style: italic;
  font-weight: 300;
  line-height: 24px;
  color: #999;
  margin: 9px 0 14px 0;

  @media (max-width: @responsive_p_phone_max) {
    margin: 0 0 16px;
  }
}

/*  ----------------------------------------------------------------------------
    Author - Date - Comments - Count views
*/

.bypostauthor {
  line-height: 1;
}//wordpress requirement

header {
  .td-module-meta-info {
    margin-bottom: 16px;

    /* responsive portrait phone */
    @media (max-width: @responsive_p_phone_max) {
        margin-bottom: 10px;
    }
  }

  //author name
  .td-post-author-name {
    font-weight: 400;
    color: #444;

    a {
      font-weight: 700;
      margin-right: 3px;
    }
  }

  //post date
  .td-post-date {
    margin-left: 4px;
    color: #444;
  }

  //post views
  .td-post-views {
    float: right;
    margin-right: 22px;

    span {
      line-height: 15px;
      vertical-align: top;
    }
  }

  .td-icon-views {
    position: relative;
    line-height: 17px;
    font-size: 14px;
    margin-right: 5px;
  }


  //comments
  .td-post-comments {
    float: right;
    position: relative;
    top: 2px;

    a {
      color: #444;
    }

    i {
      vertical-align: middle;
    }
  }

  .td-icon-comments {
    margin-right: 5px;
    font-size: 9px;
  }
}


/*  ----------------------------------------------------------------------------
    Sharing Top
*/
.td-post-sharing {
  font-family: @font1;
  margin-bottom: 21px;

  a {
    display: inline-block;
  }
}

.td-default-sharing {
  display: inline-block;
  vertical-align: middle;
}

// buttons a
.td-social-sharing-buttons {
  font-size: 11px;
  color: #fff;
  .border-radius(2px);
  padding: 10px 13px 8px 13px;
  margin-right: 10px;
  height: 40px;
  min-width: 40px;
  text-align: center;

  &:hover {
    opacity: 0.8;
  }

  .td-sp {
    width: 14px;
    height: 20px;
  }
}

.td-social-but-text {
  display: inline-block;
  position: relative;
  top: -1px;
  line-height: 16px;
  padding-left: 10px;
  margin-left: 12px;
}

//facebook
.td-social-facebook {
  background-color: #516eab;

  .td-icon-facebook {
    font-size: 14px;
    position: relative;
    top: 1px;
  }

  .td-social-but-text {
    border-left: 1px solid rgba(255, 255, 255, 0.1);
  }
}


//twitter
.td-social-twitter {
  background-color: #29c5f6;

  .td-icon-twitter {
    font-size: 10px;
  }

  .td-social-but-text {
    border-left: 1px solid rgba(255, 255, 255, 0.2);
  }
}


//google
.td-social-google {
  background-color: #eb4026;

  .td-icon-googleplus {
    font-size: 15px;
    position: relative;
    top: 2px;
    left: 1px;
  }
}

.td-social-pinterest {
  background-color: #ca212a;
  margin-right: 0;

  .td-icon-pinterest {
    font-size: 13px;
    position: relative;
    top: 1px;
  }
}


// classic share buttons
.td-classic-sharing {
  display: inline-block;
  vertical-align: middle;

  ul {
    margin: 0 0 0 30px;
    height: 20px;
  }

  li {
    display: inline-block;
    height: 20px;
    margin-left: 0;
  }
}

.td-classic-twitter {
  position: relative;
  top: -1px;
  left: 2px;

  .twitter-share-button {
    margin: 0 !important;
  }
}


/*  ----------------------------------------------------------------------------
    Sharing Bottom
*/

.td-post-sharing-bottom {
  border: 1px solid @td_grid_border_color;
  padding: 10px 26px;
  margin-bottom: 40px;

  .td-social-sharing-buttons {
    .border-radius(0);
    height: 32px;
    min-width: 32px;
    padding: 6px 9px 4px 9px;
  }

  .td-social-but-text {
    margin-left: 8px;
    padding-left: 9px;
  }
}
// firefox fix
@-moz-document url-prefix() {
  .td-post-sharing-bottom .td-social-sharing-buttons {
    padding: 7px 9px 4px;
  }
}

.td-post-share-title {
  font-weight: 700;
  font-size: 14px;
  position: relative;
  margin-right: 20px;
  vertical-align: middle;
}


/* responsive landscape tablet */
@media (max-width: @responsive_l_tablet_max) {
  .td-pb-span8 {
    .td-with-like {
      .td-social-but-text {
        display: none;
      }
    }
  }
}

/* responsive portrait tablet */
@media (max-width: @responsive_p_tablet_max) {
  .td-pb-span8 {
    .td-with-like {
      .td-post-share-title {
        display: none;
      }
    }

    .td-post-sharing-bottom.td-with-like {
      padding: 18px;
    }
  }
}


/* responsive portrait phone */
@media (max-width: @responsive_p_phone_max) {

  .td-post-sharing {
    text-align: center;
  }

  .td-with-like {
    .td-social-but-text,
    .td-post-share-title {
      display: none;
    }
  }

  .td-post-sharing-top {
    margin-top: 30px;
    margin-bottom: 30px;
  }

  .td-post-sharing-bottom {
    padding: 20px 0;
  }
}


/* responsive 480px phone */
@media (max-width: 484px) {

  .td-post-sharing-top {
    .td-social-but-text {
      display: none;
    }
  }

  .td-default-sharing {
    margin-right: 0;
  }

  .td-classic-sharing {
    width: 100%;
    margin-top: 20px;

    ul {
      margin-left: 0;
    }
  }

  .td-post-share-title {
    display: none;
  }
}

// fix when a photo is float
.post footer {
  clear: both;
}


/*  ----------------------------------------------------------------------------
    Source and Via
*/

// source/via + tag group
.td-post-source-tags {
  margin-bottom: 30px;
  font-size: 11px;

  a {
    font-size: 11px;
  }
}

.td-post-source-via {
  font-family: @font1;
  font-weight: 600;
}

.td-post-small-box {
  margin-bottom: 4px;
  line-height: 20px;
  clear: left;
  height: 20px;
  display: table;

  span {
    background-color: @td_black;
    padding: 5px 9px;
    color: #fff;
    display: block;
    text-transform: uppercase;
    line-height: 10px;
    float: left;
    height: 20px;
  }

  a {
    display: block;
    float: left;
    border: 1px solid @td_grid_border_color;
    margin-left: 4px;
    line-height: 8px;
    color: @td_text_color;
    padding: 5px 8px;
    height: 20px;

    &:hover {
      color: #fff;
      background-color: @td_theme_color;
      border-color: @td_theme_color;
    }
  }
}


/*  ----------------------------------------------------------------------------
    Tags
*/
.td-tags {
  font-family: @font1;
  display: table;
  margin: 0;
  line-height: 20px;
  font-weight: 600;

  li {
    list-style: none;
    display: inline-block;
    line-height: 20px;
    margin-left: 0;
    float: left;
    margin-bottom: 4px;
  }

  span, a {
    margin-right: 4px;
    margin-left: 0;
  }
}


/*  ----------------------------------------------------------------------------
    Next / Prev article
*/
.td-post-next-prev-content {
  display: inline-block;
  font-family: @font3;

  span {
    display: block;
    font-size: 12px;
    color: #c1c1c1;
    margin-bottom: 7px;
  }

  a {
    display: block;
    font-size: 15px;
    color: #222;
    line-height: 21px;
    margin-bottom: 43px;

    &:hover {
      color: @td_theme_color;
    }
  }
}

.td-post-next-post {
  text-align: right;
}


.td-next-prev-separator {  //this is from wp_010 - it is not used here but the core is still generating it
  display: none;
}

.td-post-prev-post,
.td-post-next-post {
  /* responsive portrait phone */
  @media (max-width: @responsive_p_phone_max) {
    width: 50%;
  }
}

/*  ----------------------------------------------------------------------------
    Author box
*/
.author-box-wrap {
  border: 1px solid @td_grid_border_color;
  padding: 21px;
  margin-bottom: 48px;

  /* responsive portrait phone */
  @media (max-width: @responsive_p_phone_max) {
      text-align: center;
  }

  .avatar {
    float: left;
    width: 100px;

    /* responsive portrait phone */
    @media (max-width: @responsive_p_phone_max) {
      margin-bottom: 5px;
      float: none;
    }
  }

  .desc {
    margin-left: 117px;
    font-size: 12px;

    /* responsive portrait phone */
    @media (max-width: @responsive_p_phone_max) {
        margin-left: 0;
    }
  }

  .td-social-icon-wrap .td-icon-font {
    color: #222;
  }

  .td-author-social {
    margin-bottom: -5px;

    a {
      color: #444;
      margin-top: 11px;

      &:hover {
        color: @td_theme_color;
      }
    }

    .td-icon-font {
      font-size: 15px;
      width: auto;
      min-width: 18px;
      height: auto;
      margin-right: 15px;
    }
  }
}

.td-author-name {
  font-family: @font1;
  font-size: 15px;
  line-height: 21px;
  font-weight: 700;
  margin: 7px 0 8px 0;

  a {
    color: #222;

    &:hover {
      color: @td_theme_color;
    }
  }
}


.td-author-url {
  font-size: 11px;
  font-style: italic;
  line-height: 21px;
  margin-bottom: 6px;

  a {
    color: #444;

    &:hover {
      color: @td_theme_color;
    }
  }
}


/*  ----------------------------------------------------------------------------
    Related / similar articles
*/

/* related_posts_row */
//3columns
.td-related-row {
  margin-right: -21px;

  .mx-row-and-span(td-related-span);

  .td-related-span4 {
    width: 33.33333333%;
    padding-left: 0;
    padding-right: 21px;

    /* responsive 500px phone */
    @media (max-width: 500px) {
      padding-right: 10px;

      .td-module-title {
        font-size: 11px;
        line-height: 18px;
        margin-bottom: 20px;
      }
    }
  }

  /* responsive 500px phone */
  @media (max-width: 500px) {
    margin-right: -10px;

    .td-video-play-ico img {
      width: 20px;
    }
  }
}

//5columns
.td-related-full-width {

  .td-related-row {
    margin-right: -22px;

    .td-related-span4 {
      width: 20%;
      padding-right: 22px;
      position: relative;

      /* responsive portrait phone */
      @media (max-width: @responsive_p_phone_max) {
        padding-right: 10px;
      }

      /* responsive 500px phone */
      @media (max-width: 500px) {
        padding-right: 0;
        margin-bottom: 20px;
        width: 100%;
        min-height: 62px;
      }
    }

    /* responsive portrait phone */
    @media (max-width: @responsive_p_phone_max) {
      margin-right: -10px;

      .td-module-title {
        font-size: 11px;
        line-height: 18px;
      }

      .td-video-play-ico img {
        width: 20px;
      }
    }

    /* responsive 500px phone */
    @media (max-width: 500px) {
      margin-right: 0;

      .td-module-image {
        width: 80px;
        position: absolute;
        top: 0;
        left: 0;
      }

      .item-details {
        width: 100%;
        padding-left: 90px;
      }

      .td-post-category {
        width: 100%;
      }

      .td-module-title {
        font-size: 13px;
        line-height: 20px;
        margin-bottom: 0;
      }
    }
  }
}
//end columns


.td_block_related_posts {
  position: relative;

  .td-module-thumb {
    margin-bottom: 7px;
  }

  .td-module-title {
    font-family: @font3;
    font-weight: 500;
    font-size: 13px;
    line-height: 20px;
    margin-top: 0;
  }
}

.td-related-title {
  font-family: @font3;
  font-size: 14px;
  line-height: 1;
  margin-top: 0;
  margin-bottom: 27px;
  border-bottom: 2px solid @td_black;

  & > .td-related-left,
  & > .td-related-right {
    line-height: 1;
    display: inline-block;
    padding: 9px 12px 5px 12px;
    white-space: nowrap;

    /* responsive 500px phone */
    @media (max-width: 500px) {
      width: 100%;
    }

    &:hover {
      color: inherit;
    }
  }

  .td-cur-simple-item {
    background-color: @td_black;
    color: #fff;

    &:hover {
      color: #fff;
    }
  }
}
// firefox fix
@-moz-document url-prefix() {
  .td-related-title > .td-related-left,
  .td-related-title > .td-related-right {
    padding: 8px 12px 6px 12px;
  }
}

.td_mod_related_posts:hover {
  h3 > a {
    color: @td_theme_color;
  }
}

/*  ----------------------------------
    Parallax header
*/
.td-parallax-header {
  margin-bottom: 60px;

  /* responsive portrait tablet */
  @media (min-width: @responsive_p_tablet_min) and (max-width: @responsive_p_tablet_max) {
    margin-bottom: 36px;
  }

  /* responsive portrait phone */
  @media (max-width: @responsive_p_phone_max) {
    margin-bottom: 25px;
  }

  @media (max-width: 500px) {
    //min-height: 400px;
    //padding-top: 130px;
  }
}