.blog-details { padding: 8.438rem 0rem; @media (max-width: 1024px) { padding: 3.75rem 0rem; } .postbox-content { p { padding-bottom: 0.938rem; } .postbox-category { columns: var(--wc-primary-color); line-height: 1.2rem; } .postbox-share { display: flex; gap: 20px; li { color: var(--wc-gray-light-color); font-weight: 500; a { color: var(--wc-gray-light-color); } } } .postbox-share-box { display: flex; justify-content: space-between; padding: 1.25rem 0 0.625rem; } .postbox-title { a { font-size: 1.75rem; font-weight: 600; color: var(--wc-dark-gray-color); line-height: 2.1rem; @media screen and (max-width: 768px) { font-size: 1.25rem; } } } .postbox-meta { display: flex; justify-content: space-between; padding-bottom: 0.938rem; @media screen and (max-width: 768px) { flex-direction: column; } li { font-weight: 500; margin-bottom: 0.625rem; a { margin-left: 0.313rem; } } } .postbox-blockquote { padding: 0.625rem 0rem; h3 { font-size: 1.75rem; line-height: 2.625rem; font-weight: 600; @media screen and (max-width: 991px) { font-size: 1.25rem; line-height: 1.8; } } } } .postbox-pagination { display: flex; justify-content: space-between; padding-bottom: 1.313rem; border-bottom: 1px solid var(--wc-gray-thin-color); li { a { font-size: 1.125rem; line-height: 1.8rem; font-weight: 500; color: var(--wc-dark-gray-color); font-family: var(--wc-heading-font); } } } .postbox-comments { max-width: 32.5rem; padding-top: 2.563rem; @media screen and (max-width: 768px) { padding-top: 1rem; } .comment-title { font-size: 1.375rem; line-height: 2.2rem; font-weight: 500; color: var(--wc-gray-light-color); padding-bottom: 1.75rem; } .comments-avatar { img { max-width: 55px; } } .comments-inner { display: flex; justify-content: space-between; .avatar-name { font-size: 1.125rem; font-weight: 600; @media screen and (max-width: 768px) { font-size: 0.875rem; } } .comments-date { font-weight: 500; @media screen and (max-width: 768px) { font-size: 0.875rem; } span { color: var(--wc-primary-color); } } } } .comments-group { display: flex; flex-direction: column; margin-bottom: 2.438rem; label { font-weight: 300; } span { padding-top: 1.125rem; color: var(--wc-primary-color); font-family: var(--wc-heading-font); font-weight: 500; @media screen and (max-width: 768px) { font-size: 0.938rem; } } } .comments-box { display: flex; gap: 1.313rem; margin-bottom: 3.625rem; @media screen and (max-width: 768px) { margin-bottom: 1.875rem; } } .comments-input { width: 100%; display: block; border: 0; padding: 0rem 0.625rem; border-bottom: 1px solid var(--wc-dark-gray-color); &:focus { outline: 0; } } .review-title { font-size: 1.375rem; padding-bottom: 1.75rem; font-weight: 500; } }