.post { margin-bottom: 0rem; } .post .post-archive-item { margin-bottom: 2rem; } .post h1, .post h2, .post h3, .post h4, .post h5, .post h6 { line-height: 1.4; font-weight: bold; color: var(--bs-body-color); word-break: break-word; } .post .post-title, .post .post-title { text-decoration: none; color: var(--bs-body-color); } .post .post-title:hover, .post .post-title:hover { text-decoration: underline; } .post .post-content { font-size: 1.2rem; line-height: 1.6; font-family: var(--bs-font-sans-serif); } .post .post-content > * { margin-bottom: 1rem; } .post .post-content > p, .post .post-content > h1, .post .post-content > h2, .post .post-content > h3, .post .post-content > h4, .post .post-content > h5, .post .post-content > h6, .post .post-content > blockquote, .post .post-content > span, .post .post-content > ul, .post .post-content pre, .post .post-content > ol { max-width: 35rem; margin-left: auto; margin-right: auto; } .post .post-content h1, .post .post-content h2 { font-weight: 600; } .post .post-content blockquote { font-style: italic; padding-bottom: 3px; padding-right: 20px; padding-left: 20px; letter-spacing: .01rem; border-left: 4px solid var(--bs-border-color); margin-top: 2rem; margin-bottom: 2rem; } .post .post-content blockquote > p:before, .post .post-content blockquote > p:after { font-family: 'Line Awesome Free'; font-weight: 900; font-style: normal; } .post .post-content blockquote > p:before { content: "\f10d "; } .post .post-content blockquote > p:after { content: " \f10e"; } .post .post-content blockquote i { font-size: 2rem; color: var(--bs-gray); } .post .post-content q:before, .post .post-content q:after { font-family: 'Line Awesome Free'; font-weight: 900; font-style: normal; } .post .post-content q:before { content: "\f10d "; } .post .post-content q:after { content: " \f10e"; } .post .post-content img, .post .post-content svg, .post .post-content video { vertical-align: middle; max-width: 100%; margin: 0 auto; height: auto; } .post .post-content iframe { vertical-align: middle; max-width: 100%; margin: 0 auto; display: block; } .post .post-content div.iframe { display: flex; justify-content: center; position: relative; } .post .post-content .align-left { margin-right: 1rem; } .post .post-content .align-right { margin-left: 1rem; } .post .post-content pre { padding: 0 1rem 1rem; background: var(--bs-secondary-bg); } .post .post-content pre code { background: transparent; } .post .align-left { float: left; margin-bottom: 25px; max-width: 50%; margin: .5em 1em .5em 0; } .post .align-right { float: right; margin-bottom: 25px; max-width: 50%; margin: .5em 0 .5em 1em; } .post .align-center { margin-left: auto; margin-right: auto; } .post img.align-center { display: block; } .post figure.align-center { display: table; } .post .tags, .post .comments-form, .post .post-comments { max-width: 35rem; margin-left: auto; margin-right: auto; } .post .card-header { margin-bottom: 0rem; } .post .card-footer { /* padding: 0.5rem 1rem; */ padding: 0 0rem 1rem; } .post .post-meta { list-style: none; text-align: center; margin-bottom: 2rem; } .post .post-meta li { margin-right: 1rem; display: inline-block; margin-top: 0.5rem; color: var(--bs-body-color); } .post .post-meta li i { font-size: 1.4rem; line-height: 1; vertical-align: top; } .post .post-meta li a { text-decoration: none; color: var(--bs-body-color); } .post .post-meta li a:hover { text-decoration: underline; } .single-blog-post-thumb { position: relative; max-height: 300px; overflow: hidden; } .single-blog-post-thumb .title-container { position: relative; width: 100%; height: 100%; display: flex; align-content: center; align-items: center; text-align: center; z-index: 1; padding: 5rem 0 0rem; } .single-blog-post-thumb .title-container::before { width: 100%; height: 100%; content: " "; background: rgba(var(--bs-body-bg-rgb), 0.5); top: 0px; left: 0px; position: absolute; z-index: -1; } .single-blog-post-thumb .title-container h1 { width: 100%; z-index: 1; } .single-blog-post-thumb img { width: 100%; top: -30vw; position: absolute; } /* comments */ .post-comments { position: relative; } .post-comments a { text-decoration: none; } .comment-author-avatar { position: absolute; left: -5rem; min-width: 60px; background: var(--bs-secondary-bg); min-height: 60px; } .comment { position: relative; } .comment.level-1 { margin-left: 1rem; } .comment.level-2 { margin-left: 2rem; } .comment.level-3 { margin-left: 3rem; } .site-header { display: flex; flex-direction: column; position: relative; } .site-header .background { position: absolute; width: 100%; height: 100%; left: 0; top: 0; transform: none; } .site-header .background img { width: 100%; height: 100%; left: 0; top: 0; object-fit: cover; } .site-header .background:before { display: block; position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-color: #000; background-color: var(--bs-body-bg); opacity: 0.7; z-index: 5; } .site-header .title-container { position: relative; margin-top: auto; z-index: 100; }