/*--------------------------------------------------------------------------------- Block Editor styles for Rowling ---------------------------------------------------------------------------------*/ /* Structure --------------------------------- */ .editor-styles-wrapper { color: #111; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } .editor-styles-wrapper > * { font-family: Lato, Helvetica, sans-serif; font-size: 17px; } .wp-block { max-width: 616px; } .editor-styles-wrapper .editor-block-list__block[data-align="full"] { max-width: none; } .editor-styles-wrapper .editor-block-list__block[data-align="wide"] { max-width: 93%; } .editor-styles-wrapper .editor-block-list__block[data-align="right"] .editor-block-list__block-edit, .editor-styles-wrapper .editor-block-list__block[data-align="left"] .editor-block-list__block-edit { max-width: 50%; } /* Block Colors ------------------------------ */ :root .has-background { background-color: #272F38; } :root .has-accent-color { color: #0093C2; } :root .has-accent-background-color { background-color: #0093C2; } :root .has-black-color { color: #111; } :root .has-black-background-color { background-color: #111; } :root .has-dark-gray-color { color: #333; } :root .has-dark-gray-background-color { background-color: #333; } :root .has-medium-gray-color { color: #555; } :root .has-medium-gray-background-color { background-color: #555; } :root .has-light-gray-color { color: #777; } :root .has-light-gray-background-color { background-color: #777; } :root .has-white-color { color: #fff; } :root .has-white-background-color { background-color: #fff; } /* Typography -------------------------------- */ .editor-post-title__block .editor-post-title__input { color: #111; font-family: Merriweather, Georgia, serif !important; font-size: 44px; font-weight: 700; line-height: 1.2; text-align: left; } .editor-styles-wrapper .editor-block-list__layout a, .editor-styles-wrapper .block-editor-block-list__layout a { color: #007C89; text-decoration: underline; } .editor-styles-wrapper p { font-size: inherit; } .editor-styles-wrapper .editor-block-list__block, .editor-styles-wrapper .editor-block-list__block p { font-size: inherit; } .editor-styles-wrapper .wp-block h1, .editor-styles-wrapper .wp-block h2, .editor-styles-wrapper .wp-block h3, .editor-styles-wrapper .wp-block h4, .editor-styles-wrapper .wp-block h5, .editor-styles-wrapper .wp-block h6 { font-family: Merriweather, Georgia, serif !important; color: #111; font-weight: 900; line-height: 1.2 !important; margin: 50px 0 25px; } .editor-styles-wrapper .wp-block h4, .editor-styles-wrapper .wp-block h5, .editor-styles-wrapper .wp-block h6 { font-family: Lato, Helvetica, sans-serif !important; font-weight: 700; } .editor-styles-wrapper .wp-block h1 { font-size: 2.5em; } .editor-styles-wrapper .wp-block h2 { font-size: 2em; } .editor-styles-wrapper .wp-block h3 { font-size: 1.6em; } .editor-styles-wrapper .wp-block h4 { font-size: 1.4em; } .editor-styles-wrapper .wp-block h5 { font-size: 1.2em; } .editor-styles-wrapper .wp-block h6 { font-size: 13px; font-weight: 900; letter-spacing: 1px; text-transform: uppercase; } p.has-drop-cap:not(:focus):first-letter { font-size: 6.2em; font-weight: 400; } /* Monospace --------------------------------- */ .editor-styles-wrapper code, .editor-styles-wrapper kbd, .editor-styles-wrapper pre, .editor-styles-wrapper samp { font-family: Menlo, Monaco, monospace !important; } kbd, pre, samp { background: #eee; border: 1px solid #ddd; border-radius: none; color: #111; font-size: .85em; padding: 2% 2.5%; } pre { line-height: 1.4; padding: 1em; } /* Custom Text Sizes ------------------------- */ .editor-styles-wrapper p.has-large-font-size, .editor-styles-wrapper p.has-large-font-size.mce-content-body, .editor-styles-wrapper p.has-larger-font-size, .editor-styles-wrapper p.has-larger-font-size.mce-content-body { line-height: 1.5; } /* Post Media -------------------------------- */ figure { margin: 0; } .alignleft, .alignright { margin-bottom: 1.2em; max-width: 40%; } .wp-caption .alignleft, .wp-caption .alignright { margin-bottom: 0; } .alignleft { float: left; margin-right: 1em; } .alignright { float: right; margin-left: 1em; } .editor-writing-flow figcaption { color: #666; font-size: 16px; font-style: normal; font-weight: 400; } /* Block: Cover Image ------------------------ */ .editor-styles-wrapper .wp-block-cover p { font-size: 1.25em; font-weight: 400; } /* Block: More ------------------------------- */ .wp-block-more input[type=text] { color: #666; letter-spacing: 1px; text-transform: uppercase; font-weight: 800; } /* Block: Table ------------------------------ */ table.wp-block-table { border: none; border-collapse: collapse; border-spacing: 0; empty-cells: show; font-size: 18px; margin-bottom: 1.1em; width: 100%; } table.wp-block-table tbody { border-top: 1px solid #DADADA; } table.wp-block-table thead + tbody { border-top: none; } .wp-block-table th, .wp-block-table td { border: none; border-bottom: 1px solid #DADADA; line-height: 120%; margin: 0; overflow: visible; padding: 0; } .wp-block-table caption { color: inherit; padding: 0; text-align: center; } .wp-block-table thead { vertical-align: bottom; white-space: nowrap; } .wp-block-table th { color: inherit; font-weight: 600; } .wp-block-table tbody > tr:nth-child(odd) > td { background: rgba( 0, 0, 0, 0.05 ); } /* Block: Separator -------------------------- */ hr.wp-block-separator { border: none !important; color: #888; margin: 2em auto; } .wp-block-separator:not(.is-style-wide):not(.is-style-dots) { background: #eee; height: 4px; max-width: none; width: 50%; } .wp-block-separator.is-style-wide { background: #eee; height: 4px; width: 100%; } .wp-block-separator.is-style-dots:before { color: inherit; } /* Block: File ------------------------------- */ .wp-block-file { background: rgba( 0, 0, 0, 0.05 ); border-radius: 4px; padding: 15px 20px; } .wp-block-file__content-wrapper { align-items: center; display: flex; justify-content: space-between; } .wp-block-file .wp-block-file__textlink { color: inherit; font-weight: 400; text-decoration: none; } .wp-block-file .wp-block-file__button { border-radius: 4px; color: #fff; font-weight: 700; padding: .8em 1.4em; } /* Block: Pull Quote ------------------------- */ .wp-block-pullquote { border: none; color: #111; font-style: italic; padding: 0; text-align: left; } .wp-block-pullquote.alignleft, .wp-block-pullquote.alignright { max-width: 50%; } .editor-styles-wrapper .wp-block-pullquote.alignleft p, .editor-styles-wrapper .wp-block-pullquote.alignright p { font-size: 1.25em; line-height: 1.45; } /* Block: Quote ------------------------------ */ blockquote { margin: 0; } .wp-block-quote { background: #fafafa; border: 1px solid #eee; clear: both; color: #111; display: block; font-size: 1em; font-style: italic; margin: 2.5em 0; padding: 30px 30px 30px 90px; position: relative; } .wp-block-quote:after { color: #0093C2; content: '”'; font-family: 'Georgia', serif; font-size: 72px; font-style: normal; font-weight: 700; line-height: 72px; position: absolute; left: 0px; top: 31px; text-align: center; width: 90px; } .wp-block-quote, .wp-block-quote.is-large, .wp-block-quote.is-style-large, .wp-block-quote:not(.is-large):not(.is-style-large) { border: 1px solid #eee; padding: 30px 30px 30px 90px; } .editor-styles-wrapper .wp-block-quote p { line-height: 1.5; } cite, .wp-block-quote__citation, .wp-block-pullquote__citation, .wp-block-quote cite, .wp-block-quote footer, .wp-block-pullquote cite, .wp-block-quote.is-large cite, .wp-block-quote.is-large footer, .wp-block-quote.is-style-large cite, .wp-block-quote.is-style-large footer { color: #111; font-size: 13px; font-style: normal; font-weight: 900; letter-spacing: 1px; line-height: 140%; margin-top: 1em; text-transform: uppercase; } cite:before, .wp-block-quote footer:before, .wp-block-quote__citation:before, .wp-block-pullquote__citation:before { content: "— "; } .wp-block-quote.is-large, .wp-block-quote.is-style-large { font-size: 1.25em; } /* Block: Button ----------------------------- */ :root .wp-block-button__link, :root .wp-block-file__button { padding: 16px 20px; margin: 0; border: none; border-radius: 2px; background: #0093C2; font-size: 0.85rem; line-height: 1; font-weight: 900; text-transform: uppercase; letter-spacing: 1px; color: #fff; text-shadow: 0 1px 0 rgba(0,0,0,0.1); -webkit-appearance: none; }