@charset "UTF-8"; /** * Styles for the editor. * @package Amble * @since 2.0.0 */ /* VARIABLES ==================================================== */ :root { /* Font Families */ --amble-primary-font: Lora, Georgia, serif; --amble-primary-italic-font: Lora-Italic; --amble-sans-font: "Helvetica Neue", Helvetica, Arial, sans-serif; /* Colours */ --amble-primary: #bba579; --amble-secondary: #c6975e; --amble-tertiary: #2b789b; --amble-body: #465156; --amble-content-bg: #fff; --amble-text: #333; --amble-black: #000; --amble-white: #fff; --amble-grey-900: #212529; --amble-grey-800: #343a40; --amble-grey-700: #495057; --amble-grey-600: #6c757d; --amble-grey-500: #adb5bd; --amble-grey-400: #ced4da; --amble-grey-300: #dee2e6; --amble-grey-200: #e9ecef; --amble-grey-100: #f2f1f1; /* Styling */ --amble-headings: #292929; --amble-box-shadow: 0 0.5rem 1.563rem -0.625rem rgba(0, 0, 0, 0.27); --amble-hover-opacity: 0.8; --amble-thead-bg: #adb5bd; --amble-list: #bba579; --amble-list-numbers: #6c757d; /* Sizing */ --amble-padding: 1.875rem; } /* Lora - variable font */ @font-face { font-family: 'Lora'; font-display: swap; font-style: normal; font-weight: 300 900; /* Super Modern Browsers */ src: url('../fonts/Lora-VariableFont_wght.woff2') format('woff2'), /* Modern Browsers */ url('../fonts/Lora-VariableFont_wght.woff') format('woff'); } /* Lora Italic - variable font */ @font-face { font-family: 'Lora-Italic'; font-display: swap; font-style: normal; font-weight: 300 900; /* Super Modern Browsers */ src: url('../fonts/Lora-Italic-VariableFont_wght.woff2') format('woff2'), /* Modern Browsers */ url('../fonts/Lora-Italic-VariableFont_wght.woff') format('woff'); } /* BASE ==================================================== */ body#tinymce.wp-editor.content { background: var(--amble-content-bg); color: var(--amble-text); font-family: var(--amble-primary-font); font-size: 1.063rem; font-weight: 400; line-height: 1.7; -ms-word-wrap: break-word; word-wrap: break-word; word-break: break-word; width: 800px; margin: 2rem auto; } body#tinymce.wp-editor.content * { box-sizing: border-box; -webkit-font-smoothing: antialiased; } /* TYPOGRAPHY ==================================================== */ body#tinymce.wp-editor.content p { margin-bottom: 1.5rem; } /* Headings */ body#tinymce.wp-editor.content h1, body#tinymce.wp-editor.content h2, body#tinymce.wp-editor.content h3, body#tinymce.wp-editor.content h4, body#tinymce.wp-editor.content h5, body#tinymce.wp-editor.content h6, h1, h2, h3, h4, h5, h6 { color: var(--amble-headings); font-family: var(--amble-primary-font); font-weight: 600; line-height: 1.2; margin: 2rem 0 1rem; text-rendering: optimizeLegibility; } body#tinymce.wp-editor.content h1, h1 { font-size: 2rem; line-height: 1.1; } h1 { font-size: 2.125rem; } body#tinymce.wp-editor.content h2, h2 { font-size: 1.75rem; line-height: 1.3; } h2 { font-size: 1.875rem; } body#tinymce.wp-editor.content h3, h3 { font-size: 1.438rem; line-height: 1.5; } h3 { font-size: 1.5rem; } body#tinymce.wp-editor.content h4, h4 { font-size: 1.25rem; line-height: 1.7; } h4 { font-size: 1.375rem; } body#tinymce.wp-editor.content h5, h5 { font-size: 1.125rem; line-height: 1.8; } h5 { font-size: 1.25rem; } body#tinymce.wp-editor.content h6 h6 { font-size: 1rem; line-height: 1.8; } h6 { font-size: 1.125rem; } /* Paragraph */ body#tinymce.wp-editor.content p { margin-top: 0; margin-bottom: 1rem; } /* Drop cap */ .has-drop-cap:not(:focus):first-letter { float: left; font-family: var(--amble-primary-italic-font); font-size: 6rem; line-height: 0.75; font-weight: 600; margin: .25rem 1rem 0 0; text-transform: uppercase; } /* Text elements */ sup, sub { font-size: 70%; } /* Text Sizing */ .has-extra-small-font-size { font-size: 0.875rem; } .has-small-font-size { font-size: 1rem; } .has-medium-font-size { font-size: 1.125rem; } .has-large-font-size { font-size: 1.25rem; line-height: 1.5; } .has-extra-large-font-size { font-size: 1.375rem; line-height: 1.3; } .has-huge-font-size { font-size: 1.625rem; line-height: 1.3; } .has-gigantic-font-size { font-size: 2rem; line-height: 1.3; } /* LISTS ==================================================== */ body#tinymce.wp-editor.content ul, body#tinymce.wp-editor.content ol { margin: 0 0 1.813rem 2rem; padding: 0; } body#tinymce.wp-editor.content ul { list-style: disc; } body#tinymce.wp-editor.content ol { list-style: decimal; margin-left: 2rem; } body#tinymce.wp-editor.content li>ul, body#tinymce.wp-editor.content li>ol { margin-bottom: 0; } body#tinymce.wp-editor.content ul li::marker, ul.wp-block-list li::marker { color: var(--amble-list); font-weight: 500; } body#tinymce.wp-editor.content ol li::marker, ol.wp-block-list li::marker { color: var(--amble-list-numbers); font-weight: 500; } body#tinymce.wp-editor.content del { opacity: 0.8; } body#tinymce.wp-editor.content address { font-style: italic; margin: 0 0 1.875rem; } body#tinymce.wp-editor.content dt { font-weight: 700; } body#tinymce.wp-editor.content dl { margin: 0 0 1.813rem; } body#tinymce.wp-editor.content dd { margin: 0 0 1rem 1rem; } /* LINKS ==================================================== */ body#tinymce.wp-editor.content a, body#tinymce.wp-editor.content a:visited { color: var(--amble-tertiary); text-underline-offset: 0.188rem; font-weight: 600; } /* CODE ==================================================== */ body#tinymce.wp-editor.content pre, body#tinymce.wp-editor.content code, body#tinymce.wp-editor.content kbd, body#tinymce.wp-editor.content samp { font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 0.813rem; direction: ltr; /* rtl:ignore */ unicode-bidi: bidi-override; } body#tinymce.wp-editor.content kbd, .editor-styles-wrapper kbd { background: var(--amble-grey-800); border-radius: 0.125rem; color: var(--amble-white); display: inline-block; font-size: 0.75rem; font-weight: 700; line-height: 1; padding: 0.125rem 0.375rem; white-space: nowrap; position: relative; bottom: 0.125rem; } body#tinymce.wp-editor.content pre { background: var(--amble-grey-100); border: 1px solid var(--amble-grey-300); display: block; overflow: auto; font-size: 0.875rem; max-width: 100%; margin: 1.5rem 0; padding: 1rem; white-space: break-spaces; } body#tinymce.wp-editor.content pre code { background: transparent; font-size: inherit; color: inherit; padding: 0; word-break: normal; } body#tinymce.wp-editor.content code { padding: 0.125rem 0.25rem; font-size: 90%; color: #c7254e; background-color: #f9f2f4; border-radius: 0.25rem; word-wrap: break-word; } body#tinymce.wp-editor.content a>code { color: inherit; } /* MISC. ELEMENTS ==================================================== */ hr, body#tinymce.wp-editor.content hr, .wp-block-separator { border: none; border-bottom: 0.125rem solid var(--amble-grey-400); margin: 3rem auto; } .wp-block-separator.alignwide, .wp-block-separator.is-style-wide { width: 50%; } .wp-block-separator.alignfull, .wp-block-separator.alignfull.is-style-wide { width: 100%; } .wp-block-separator.is-style-dots { background: none !important; border: none; text-align: center; line-height: 1; height: auto; margin: 2rem auto; } .wp-block-separator.is-style-dots:before { content: "ยทยทยท"; color: currentColor; font-size: 2rem; letter-spacing: 2rem; padding-left: 2rem; } /* BLOCKQUOTES ==================================================== */ body#tinymce.wp-editor.content blockquote, .wp-block-quote, .wp-block-pullquote { position: relative; font-size: 1.063rem; line-height: 1.6; margin-top: 2rem; margin-bottom: 2rem; border: none; border-left: 0.375rem solid var(--amble-primary); margin-left: 0; padding-left: 1.25rem; } .wp-block-quote, .wp-block-pullquote { margin-left: auto; padding-top: 0; padding-bottom: 0; } body#tinymce.wp-editor.content blockquote, body#tinymce.wp-editor.content blockquote p, .wp-block-quote p, .wp-block-pullquote p { font-family: var(--amble-primary-italic-font); } /* Pull Quote alignments - left and right */ .wp-block[data-align=left]>.wp-block-pullquote, .wp-block[data-align=right]>.wp-block-pullquote { max-width: 40%; } .wp-block-pullquote blockquote, .wp-block[data-align=left]>.wp-block-pullquote p, .wp-block[data-align=right]>.wp-block-pullquote p { margin: 0; } .wp-block[data-align=left]>.wp-block-pullquote { margin: 0.375rem 3rem 2rem 0; text-align: left; } .wp-block[data-align=right]>.wp-block-pullquote { border-left: none; border-right: 0.375rem solid var(--amble-primary); margin: 0.375rem 0 2rem 3rem; padding-left: 0; padding-right: 1.25rem; text-align: right; } body#tinymce.wp-editor.content blockquote cite, .wp-block-quote .wp-block-quote__citation, .wp-block-pullquote .wp-block-pullquote__citation { font-family: var(--amble-sans-font); font-style: normal; font-size: 0.75rem; color: var(--amble-grey-600); text-transform: capitalize; } .wp-block-quote .wp-block-quote__citation, .wp-block-pullquote .wp-block-pullquote__citation { margin-top: 1rem; } body#tinymce.wp-editor.content blockquote cite::before, /* Blockquote and Pull Quote cite */ .wp-block-quote .wp-block-quote__citation::before, .wp-block-pullquote .wp-block-pullquote__citation::before, .wp-block-pullquote cite::before, .wp-block-pullquote footer::before { content: "\2014"; } /* TABLES ==================================================== */ body#tinymce.wp-editor.content table, body#tinymce.wp-editor.content th, body#tinymce.wp-editor.content td, .wp-block-table table { border: 1px solid var(--amble-grey-200); } body#tinymce.wp-editor.content table, .wp-block-table table { border-collapse: collapse; border-spacing: 0; border-width: 1px 0 0 1px; font-family: var(--amble-sans-font); margin: 1.5rem 0; table-layout: auto; width: 100%; } body#tinymce.wp-editor.content thead, .wp-block-table thead { background: var(--amble-thead-bg); color: var(--amble-white); } body#tinymce.wp-editor.content caption, body#tinymce.wp-editor.content th, body#tinymce.wp-editor.content td { font-weight: normal; } body#tinymce.wp-editor.content th, .wp-block-table table th { border-width: 0 1px 1px 0; } body#tinymce.wp-editor.content th, body#tinymce.wp-editor.content td, .wp-block-table table th, .wp-block-table table td { padding: 0.5rem 0.75rem; text-align: left; } body#tinymce.wp-editor.content td, .wp-block-table table td { font-size: 0.813rem; } /* DROP CAP ==================================================== */ body#tinymce.wp-editor.content .has-drop-cap::first-letter { float: left; font-family: var(--amble-primary-italic-font); font-size: 6rem; line-height: 0.75; font-weight: 600; margin: .25rem 1rem 0 0; text-transform: uppercase; } /* MEDIA ==================================================== */ body#tinymce.wp-editor.content img { height: auto; max-width: 100%; vertical-align: middle; } body#tinymce.wp-editor.content figure { margin: 0; max-width: 100%; } .mce-content-body .wpview-wrap { margin-bottom: 2rem; } .mce-content-body .wp-audio-playlist { margin: 0; } /* Media captions */ body#tinymce.wp-editor.content figcaption, body#tinymce.wp-editor.content .gallery-caption, body#tinymce.wp-editor.content .wp-caption, body#tinymce.wp-editor.content .wp-caption-text, body#tinymce.wp-editor.content .wp-caption-dd, .wp-block-image figcaption { font-size: 0.875rem; font-family: var(--amble-primary-italic-font); padding: 1rem 0 0; text-align: center; } body#tinymce.wp-editor.content .wp-caption-dd { margin: 0; padding: 1.5rem 0 0; } /* ALIGNMENT ==================================================== */ body#tinymce.wp-editor.content .alignleft, body#tinymce.wp-editor.content .alignright { position: relative; } body#tinymce.wp-editor.content .alignleft { display: inline; float: left; margin: 0.375rem 3rem 2rem 0; } body#tinymce.wp-editor.content .alignright { display: inline; float: right; margin: 0.375rem 0 2rem 3rem; } body#tinymce.wp-editor.content .alignnone, body#tinymce.wp-editor.content .aligncenter { clear: both; margin: 3rem auto; } body#tinymce.wp-editor.content .aligncenter { margin-left: auto; margin-right: auto; } body#tinymce.wp-editor.content .alignleft, body#tinymce.wp-editor.content .alignright, body#tinymce.wp-editor.content .wp-caption.alignleft, body#tinymce.wp-editor.content .wp-caption.alignright { max-width: 50%; margin-bottom: 1.25rem; } .wp-block[data-align=full] { max-width: 100%; } .block-editor-block-list__layout.is-root-container>.wp-block[data-align=full] { margin: auto; } /** * Block editor - base style * @since 2.0.0 */ .wp-block { max-width: 800px; /* 760px + 30px to account for padding. */ } /* Editor post title */ .editor-post-title { color: var(--amble-headings); font-family: var(--amble-primary-font); font-size: 2.25rem; line-height: 1.1; font-weight: 600; margin: 0 auto 2rem; } .editor-styles-wrapper a { color: var(--amble-tertiary); cursor: pointer; text-underline-offset: 0.188rem; font-weight: 600; } p, .wp-block-list li { color: var(--amble-text); font-family: var(--amble-primary-font); font-size: 1.063rem; line-height: 1.7; } /* Buttons */ .wp-block-button__link { font-family: var(--amble-sans-font); } .wp-block-button.is-style-outline>.wp-block-button__link, .wp-block-button .wp-block-button__link.is-style-outline { border: 1px solid var(--amble-grey-500); }