/* Theme Name: Twenty Seventeen Description: Used to style blocks. */ /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- 1.0 General Block Styles 2.0 Blocks - Common Blocks 3.0 Blocks - Formatting 4.0 Blocks - Layout Elements 5.0 Blocks - Widgets 6.0 Blocks - Colors --------------------------------------------------------------*/ /*-------------------------------------------------------------- 1.0 General Block Styles --------------------------------------------------------------*/ /* Captions */ [class^="wp-block-"]:not(.wp-block-gallery) figcaption { font-style: italic; margin-bottom: 1.5em; text-align: left; } .rtl [class^="wp-block-"]:not(.wp-block-gallery) figcaption { text-align: right; } /*-------------------------------------------------------------- 2.0 Blocks - Common Blocks --------------------------------------------------------------*/ /* Paragraph */ p.has-drop-cap:not(:focus)::first-letter { font-size: 5em; margin-top: 0.075em; } /* Image */ .wp-block-image { margin-bottom: 1.5em; } .wp-block-image figure { margin-bottom: 0; margin-top: 0; } .wp-block-image figure.alignleft { margin-right: 1.5em; } .wp-block-image figure.alignright { margin-left: 1.5em; } /* Gallery */ .wp-block-gallery { margin-bottom: 1.5em; } .wp-block-gallery figcaption { font-style: italic; } .wp-block-gallery.aligncenter { display: flex; margin: 0 -8px; } /* Quote */ .wp-block-quote:not(.is-large):not(.is-style-large) { border: 0; padding: 0; } .wp-block-quote.alignleft p:last-of-type, .wp-block-quote.alignright p:last-of-type { margin-bottom: 0; } .wp-block-quote cite { color: inherit; font-size: inherit; } /* Audio */ .wp-block-audio audio { display: block; width: 100%; } /* Cover */ .wp-block-cover-image.alignright, .wp-block-cover.alignright, .wp-block-cover-image.alignleft, .wp-block-cover.alignleft, .wp-block-cover-image.aligncenter, .wp-block-cover.aligncenter { display: flex; } /* File */ .wp-block-file .wp-block-file__button { background-color: #222; -webkit-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: none; box-shadow: none; color: #fff; display: inline-block; font-size: 14px; font-size: 0.875rem; font-weight: 800; margin-top: 2em; padding: 0.7em 2em; -webkit-transition: background-color 0.2s ease-in-out; transition: background-color 0.2s ease-in-out; white-space: nowrap; } .wp-block-file .wp-block-file__button:hover, .wp-block-file .wp-block-file__button:focus { background-color: #767676; -webkit-box-shadow: none; box-shadow: none; } /*-------------------------------------------------------------- 3.0 Blocks - Formatting --------------------------------------------------------------*/ /* Code */ .wp-block-code { background: transparent; border: 0; padding: 0; } /* Pullquote */ .wp-block-pullquote { border: 0; } .wp-block-pullquote__citation, .wp-block-pullquote cite { font-size: inherit; text-transform: none; } /* Table */ .wp-block-table thead th { border-bottom: 2px solid #bbb; padding-bottom: 0.5em; } .wp-block-table tr { border-bottom: 1px solid #eee; } .wp-block-table th, .wp-block-table td { border: 0; } .rtl .wp-block-table th, .rtl .wp-block-table td { text-align: right; } /*-------------------------------------------------------------- 4.0 Blocks - Layout Elements --------------------------------------------------------------*/ /* Buttons */ .wp-block-button .wp-block-button__link { -webkit-box-shadow: none; box-shadow: none; display: inline-block; font-size: 14px; font-size: 0.875rem; font-weight: 800; line-height: 1.66; margin-top: 2em; padding: 0.7em 2em; -webkit-transition: background-color 0.2s ease-in-out; transition: background-color 0.2s ease-in-out; white-space: nowrap; } .entry-content .wp-block-button__link { background-color: #222; color: #fff; } .entry-content .is-style-outline .wp-block-button__link:not(.has-background) { background-color: transparent; } .entry-content .is-style-outline .wp-block-button__link:not(.has-text-color) { color: #222; } .colors-dark .wp-block-button__link { background-color: #fff; color: #000; } .entry-content .wp-block-button__link:hover, .entry-content .wp-block-button__link:focus, .entry-content .is-style-outline .wp-block-button__link:not(.has-background):hover, .entry-content .is-style-outline .wp-block-button__link:not(.has-background):focus { background-color: #767676; -webkit-box-shadow: none; box-shadow: none; color: #fff; } .colors-dark .entry-content .wp-block-button__link:hover, .colors-dark .entry-content .wp-block-button__link:focus, .colors-dark .entry-content .is-style-outline .wp-block-button__link:not(.has-background):hover, .colors-dark .entry-content .is-style-outline .wp-block-button__link:not(.has-background):focus { background-color: #bbb; color: #000; } .colors-dark .entry-content .is-style-outline .wp-block-button__link:not(.has-text-color) { color: #fff; } .colors-dark .entry-content .is-style-outline .wp-block-button__link:not(.has-text-color):hover, .colors-dark .entry-content .is-style-outline .wp-block-button__link:not(.has-text-color):focus { color: #222; } .colors-custom .entry-content .wp-block-button__link, .colors-custom .entry-content .wp-block-button__link:hover, .colors-custom .entry-content .wp-block-button__link:focus, .colors-dark .entry-content .wp-block-button__link, .colors-dark .entry-content .wp-block-button__link:hover, .colors-dark .entry-content .wp-block-button__link:focus { -webkit-box-shadow: none; box-shadow: none; } .colors-custom .entry-content .wp-block-button__link:hover, .colors-custom .entry-content .wp-block-button__link:focus { color: #fff; } /* Separator */ .wp-block-separator { border: 0; } .wp-block-separator:not(.is-style-wide):not(.is-style-dots) { max-width: 100px; } /* Media & Text */ .wp-block-media-text { margin-bottom: 1.5em; } .wp-block-media-text *:last-child { margin-bottom: 0; } /*-------------------------------------------------------------- 5.0 Blocks - Widgets --------------------------------------------------------------*/ /* Archives, Categories & Latest Posts */ .wp-block-archives.aligncenter, .wp-block-categories.aligncenter, .wp-block-latest-posts.aligncenter { list-style-position: inside; text-align: center; } /* Comments */ .wp-block-latest-comments article { margin-bottom: 4em; } .blog:not(.has-sidebar) #primary .wp-block-latest-comments article, .archive:not(.page-one-column):not(.has-sidebar) #primary .wp-block-latest-comments article, .search:not(.has-sidebar) #primary .wp-block-latest-comments article { float: none; width: 100%; } .wp-block-latest-comments .avatar, .wp-block-latest-comments__comment-avatar { border-radius: 0; } .wp-block-latest-comments a { -webkit-box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 1); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 1); } .wp-block-latest-comments__comment-meta { font-size: 16px; font-size: 1rem; margin-bottom: 0.4em; } .wp-block-latest-comments__comment-author, .wp-block-latest-comments__comment-link { font-weight: 700; text-decoration: none; } .wp-block-latest-comments__comment-date { color: #767676; font-size: 10px; font-size: 0.625rem; font-weight: 800; letter-spacing: 0.1818em; margin-top: 0.4em; text-transform: uppercase; } .editor-block-list__block .wp-block-latest-comments__comment-excerpt p { font-size: 14px; font-size: 0.875rem; } /*-------------------------------------------------------------- 6.0 Blocks - Colors --------------------------------------------------------------*/ .entry-content .has-pale-pink-color { color: #f78da7; } .entry-content .has-pale-pink-background-color, .wp-block-button.is-style-outline .has-pale-pink-background-color:link { background-color: #f78da7; } .entry-content .has-vivid-red-color { color: #cf2e2e; } .entry-content .has-vivid-red-background-color, .wp-block-button.is-style-outline .has-vivid-red-background-color:link { background-color: #cf2e2e; } .entry-content .has-luminous-vivid-orange-color { color: #ff6900; } .entry-content .has-luminous-vivid-orange-background-color, .wp-block-button.is-style-outline .has-luminous-vivid-orange-background-color:link { background-color: #ff6900; } .entry-content .has-luminous-vivid-amber-color { color: #fcb900; } .entry-content .has-luminous-vivid-amber-background-color, .wp-block-button.is-style-outline .has-luminous-vivid-amber-background-color:link { background-color: #fcb900; } .entry-content .has-light-green-cyan-color { color: #7bdcb5; } .entry-content .has-light-green-cyan-background-color, .wp-block-button.is-style-outline .has-light-green-cyan-background-color:link { background-color: #7bdcb5; } .entry-content .has-vivid-green-cyan-color { color: #00d084; } .entry-content .has-vivid-green-cyan-background-color, .wp-block-button.is-style-outline .has-vivid-green-cyan-background-color:link { background-color: #00d084; } .entry-content .has-pale-cyan-blue-color { color: #8ed1fc; } .entry-content .has-pale-cyan-blue-background-color, .wp-block-button.is-style-outline .has-pale-cyan-blue-background-color:link { background-color: #8ed1fc; } .entry-content .has-vivid-cyan-blue-color { color: #0693e3; } .entry-content .has-vivid-cyan-blue-background-color, .wp-block-button.is-style-outline .has-vivid-cyan-blue-background-color:link { background-color: #0693e3; } .entry-content .has-very-light-gray-color { color: #eee; } .entry-content .has-very-light-gray-background-color, .wp-block-button.is-style-outline .has-very-light-gray-background-color:link { background-color: #eee; } .entry-content .has-cyan-bluish-gray-color { color: #abb8c3; } .entry-content .has-cyan-bluish-gray-background-color, .wp-block-button.is-style-outline .has-cyan-bluish-gray-background-color:link { background-color: #abb8c3; } .entry-content .has-very-dark-gray-color { color: #313131; } .entry-content .has-very-dark-gray-background-color, .wp-block-button.is-style-outline .has-very-dark-gray-background-color:link { background-color: #313131; }