.post-list, .post { margin-top: 24px; }
.post-list .tags h3 { padding-bottom: 8px; border-bottom: 1px solid #C8C8C8; color: #121212; font-size: 14px; margin-top: 0; }
.post-list .tags .body { display: flex; gap: 14px; flex-wrap: wrap; }
.post-list { position: relative; }
.post-list .tags .tag span { padding: 7px 16px; background-color: #EEEEEE; border-radius: 10px; cursor: pointer; color: #676D7C; }
.post-list .tags .tag input { display: none; }
.post-list .tags .tag input:checked ~ span { background-color: #E30D29; color: #F7F7F7; }
.post-list .post-item { background-color: #FFF; display: inline-block; border-radius: 5px; text-decoration: none; margin-bottom: 10px; }
.post-list .post-item:hover { text-decoration: none; }
.post-list .post-item img { width: 100%; }
.post-list .post-item h3 { font-weight: 700; color: #121212; font-size: 16px; margin: 12px; }
.post-list .post-item p { color: #676D7C; font-size: 13px; font-weight: 400; margin: 0 12px 12px; line-height: 25px; text-align: justify; }
.post-list .post-item p span { color: #0460E4; font-size: 13px; font-weight: 400; }

.post .tags h3 { padding-bottom: 8px; border-bottom: 1px solid #C8C8C8; color: #121212; font-size: 14px; margin-top: 0; }
.post .tags .tag span { padding: 7px 16px; border-radius: 10px; cursor: pointer; background-color: #E30D29; color: #F7F7F7; }
.post .post-detail { display: flex; gap: 20px; }
.post .post-detail > div.text { flex: 4; }
.post .post-detail > div.image { flex: 2; }
.post .post-detail > div.image img { width: 100%; }

.post .text .title { display: flex; align-items: center; padding-bottom: 16px; border-bottom: 1px solid #676D7C; }
.post .text .title h2 { flex: 1; margin: 0; color: #121212; font-size: 16px; font-weight: 800; }
.post .text .date { color: #676D7C; font-size: 13px; }
.post .text .body { color: #676D7C; line-height: 24px; font-size: 0.9rem; }

#search-form { margin-top: 10px; }

@media (max-width: 959px) {
    .post-list .tags { display: none; }
    .post .tags { display: none; }
}

@media (max-width: 640px) {
    .post .post-detail { flex-direction: column-reverse; }
    .post .post-detail > div.text { flex: 1; }
    .post .post-detail > div.image { flex: 1; }

    .post .text .date { display: none; }
}

[data-f-id=pbf] { display: none !important; }

.tags-body { display: flex; flex-wrap: wrap; gap: 5px; }
.tags-body .tag { display: flex; }