/**

 * Single Post CSS

 */



.title {

    margin-bottom: 4rem;

    text-transform: none;

}



.post-info {

    margin: 0 auto 3rem;

    width: var(--wide-width);

}



.table-of-content {

    font-size: 0.95em;

    margin-left: auto;

    margin-right: auto;

    margin-top: 1em;

}



.table-of-content a {

    font-weight: 400;

    padding: 0;

}



.social-share {

    margin: 4rem auto;

    width: var(--narrow-width);

}



.social-share-top {

    margin: 1.5rem auto 2rem;

    width: var(--narrow-width);

}



.box-contact-form {

    border-top: 1px solid var(--light-grayscale-400-border);

    margin: 0 auto;

    padding-top: 4rem;

    width: var(--narrow-width);

}



.cta-blog-post {

    margin-bottom: 4rem;

}





/*----------------------------- Author Box */



.post-author {

    border: 1px solid var(--light-grayscale-400-border);

    margin: 3em auto;

    padding: 1.5em 1.75em;

    width: var(--narrow-width);

}



.author-avatar {

    margin: 0;

}



.author-avatar img {

    border-radius: 50%;

}



.author-name {

    display: block;

    color: var(--light-primary-kone-blue);

    font-family: var(--font-secondary);

    margin-bottom: 0.5em;

}



.author-name:after {

    display: block;

    content: "\e900";

    font-family: "KONE-Icon-Font";

    font-size: 1.75em;

}





/*----------------------------- Related Posts */



.related-posts {

    list-style: none;

    margin: 5rem auto;

    padding: 0;

    width: var(--narrow-width);

}



.related-posts h3 {

    font-weight: 400;

    margin-bottom: 3rem;

}



.related-posts ul {

    list-style: none;

    margin-left: 0;

}



.related-posts ul li {

    background-color: var(--light-grayscale-600-bg-tertiary);

    margin-bottom: 1em;

}



.related-posts ul li a {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-align: center;

    -ms-flex-align: center;

    align-items: center;

}



.related-posts ul li h4 {

    color: var(--custom-accent);

    margin: 0;

    padding: var(--gutter);

}



.related-posts ul li img {

    display: block;

    max-width: calc(100% / 3);

}





/*----------------------------- Comments */



.comments-area {

    clear: both;

    margin: 4rem auto;

    max-width: var(--narrow-width);

}



.comments-title {

    margin-bottom: 1.5em;

    text-align: center;

}



.comment-list,

.comment-list .children {

    list-style: none;

    margin: 0;

    padding: 0;

}



.comment-list li:before {

    display: none;

}



.comment-body {

    margin-left: 65px;

}



.comment-author {

    font-size: 16px;

    font-size: 1rem;

    margin-bottom: 0.4em;

    position: relative;

    z-index: 2;

}



.comment-author .avatar {

    height: 50px;

    left: -65px;

    position: absolute;

    width: 50px;

}



.comment-author .says {

    display: none;

}



.comment-meta {

    margin-bottom: 1.5em;

}



.comment-metadata {

    color: #767676;

    font-size: 10px;

    font-size: 0.625rem;

    font-weight: normal;

    text-transform: uppercase;

}



.comment-metadata a {

    color: #767676;

}



.comment-metadata a.comment-edit-link {

    color: #222;

    margin-left: 1em;

}



.comment-body {

    color: #333;

    font-size: 14px;

    font-size: 0.875rem;

    margin-bottom: 4em;

}



.comment-reply-link {

    font-weight: normal;

    position: relative;

}



.comment-reply-link .icon {

    color: #222;

    left: -2em;

    height: 1em;

    position: absolute;

    top: 0;

    width: 1em;

}



.children .comment-author .avatar {

    height: 30px;

    left: -45px;

    width: 30px;

}



.bypostauthor>.comment-body>.comment-meta>.comment-author .avatar {

    border: 1px solid #333;

    padding: 2px;

}



.no-comments,

.comment-awaiting-moderation {

    color: #767676;

    font-size: 14px;

    font-size: 0.875rem;

    font-style: italic;

}



.comments-pagination {

    margin: 2em 0 3em;

}