.loop-docs.style-default .post-box { padding: var(--space-half); } :where(.loop-docs) .col-style, :where(.loop-docs) .post-box { border-top: 5px solid var(--color-primary); } .loop-docs.style-default .col-style, .loop-docs.style-default .post-box { background-color: var(--color-content-bg); border-radius: var(--radius-s); box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.2); } .loop-docs.style-minimal .post-box, .loop-docs.style-minimal .col-style { padding-block: var(--space-half); } .loop-docs .col-head { border-bottom: 1px solid var(--color-border); } .loop-docs.style-minimal .col-head { margin-block-end: var(--space-half); padding-block-end: var(--space-half); } .loop-docs .featured-image { float: left; width: 15%; } .loop-docs .featured-image + .post-content { float: left; padding-inline-start: var(--space-half); width: 85%; } .loop-docs .teaser-title .badge { background-color: #999; padding-inline: 0.375rem; top: -0.25rem; } .loop-docs .list { margin-inline-start: 0; } .loop-docs.style-default .col-head, .loop-docs.style-default .col-content { padding: var(--space-half); } .docs-nav { margin-block-end: var(--space-single); margin-inline: auto; max-width: 1050px; } .content-full .docs-nav { margin-block-end: var(--space-mid); text-align: center; } .content-full.loop-docs .breadcrumbs { text-align: center; } @media (min-width: 992px) { .docs-nav { padding-block-end: 0; } .loop-docs .docs-category { margin-block-end: var(--space-single); } .loop-docs.style-default .post-box { margin-block-end: var(--space-half); padding: var(--space-single); } .loop-docs.style-default .col-head, .loop-docs.style-default .col-content { padding: var(--space-single); } } .blog-teasers .col { margin-block-end: var(--space-single); } .blog-teasers .post-box { font-size: 17px; line-height: 28px; margin-block-end: var(--space-single); vertical-align: middle; } :where(.style-default) .blog-teaser { background-color: var(--color-content-bg); border-radius: var(--radius-s); box-shadow: var(--shadow-md); padding: var(--space-half); position: relative; } .loop-teasers .cta-box { border-radius: var(--radius-s); } .blog-teasers .featured-image img { border-radius: var(--radius-s); box-shadow: var(--shadow-md); } .featured-image + .blog-teaser { top: calc(var(--space-half) * -1); } .teaser-title { font-size: 20px; line-height: 30px; } .loop-teasers .teaser-title { margin-block-end: var(--space-xs); } .loop-teasers .content .byline { margin-block-end: var(--space-third); } .loop-blocks .post-box { margin-block-end: var(--space-mid); } :where(.loop-blocks.style-default) .post-box { background-color: var(--color-content-bg); box-shadow: var(--shadow-md); } .loop-blocks.style-default.content-sidebar .post-box:not(:last-child) { margin-block-end: var(--space-single); } .loop-blocks .content-headline { margin-block-end: var(--space-third); } :where(.loop-blocks) .content-text { color: var(--color-text-sec); } :where(.loop-blocks) .post-box .content-inner { border-bottom: 1px solid var(--color-border); max-width: 100%; } .loop-blocks .wp-post-image { box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.4); transition: var(--transition-slow); } .loop-blocks .post-box:hover .wp-post-image { transform: scale(0.97); } .loop-blocks .content .byline { margin-block-end: var(--space-xs); } .loop-blocks .content-footer .avatar { top: -0.3125rem; } .loop-blocks .byline-author-name { font-weight: 600; } @media (min-width: 992px) { .blog-teasers .post-box { margin-block-end: var(--space-half); } .loop-blocks.style-default.content-sidebar .post-box { padding: var(--space-single); } .loop-blocks.style-default.content-full .post-box { padding: var(--space-mid); } } @media (min-width: 640px) { .blog-teasers[class*="columns-"] .featured-col, .blog-teasers[class*="columns-"] .cta-box { clear: both; margin-inline-start: var(--space-single); } .loop-blocks .post-box .content-inner { margin-block-end: var(--space-single); padding-block-end: var(--space-single); } .loop-blocks .featured-image { float: left; } .loop-blocks .featured-image + .post-content { float: left; padding-inline-start: 1.625rem; } .loop-blocks .content-footer-author { float: right; } .loop-blocks .byline-comments { margin-block-start: var(--space-third); } .loop-blocks.content-full .byline-comments { margin-block-start: var(--space-half); } } @media (max-width: 992px) { .loop-blocks .post-box .content-inner { margin-block-end: var(--space-half); padding-block: var(--space-half); } .blog-teasers .post-box, .loop-blocks .featured-image { margin-block-end: var(--space-half); } .loop-blocks .content-footer { padding-block-end: var(--space-half); padding-inline: var(--space-half); } } @media (max-width: 640px) { .loop-blocks .byline-comments { float: left; } .loop-blocks .byline-edit { display: none; } .loop-blocks .content-footer-author { text-align: right; } .loop-blocks .more-link { margin-block-start: var(--space-xs); } } .archives-title-search { background: color-mix(in srgb, var(--color-content-bg), var(--color-bg) 24%); border: 1px solid color-mix(in srgb, var(--color-border), transparent 15%); border-radius: var(--radius-l); box-shadow: var(--shadow-sm); padding: var(--space-single); } .archives-title-search .archives-label { font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.08em; margin-block-end: var(--space-xs); text-transform: uppercase; } .archives-title-search .archives-description { margin-block-end: var(--space-half); max-width: 52rem; } .archives-title-search .search-query { border-bottom: 0; color: var(--color-primary); } .archives-search-form { max-width: 42rem; } .archives-search-form .search-form { background: var(--color-content-bg); border: 1px solid var(--color-border); border-radius: var(--radius-full); box-shadow: var(--shadow-sm); padding: 0.375rem; } .archives-search-form .search-input { background: transparent; border: 0; box-shadow: none; } .archives-search-form .search-submit { border-radius: var(--radius-full); } @media (min-width: 992px) { .archives-title.featured-image-cover { padding-block-start: var(--space-double); } .style-minimal .archives-title .content-inner, .style-default.loop-teasers .archives-title:not(.featured-image-cover) .content-inner, .loop-blocks .archives-title:not(.featured-image-cover) .content-inner { max-width: 100%; } } @media (max-width: 992px) { .archives-title.featured-image-cover { padding-block-start: var(--space-single); } .style-minimal .archives-title .content-inner { max-width: 100%; } }