page.php000064400000001116152377522560006206 0ustar00 template-parts/excerpt/excerpt-aside.php000064400000000434152377522560014445 0ustar00
template-parts/header/entry-header.php000064400000000267152377522560014061 0ustar00', '' ); template-parts/header/excerpt-header.php000064400000001043152377522560014363 0ustar00
', esc_url( get_permalink() ) ), '' ); twenty_twenty_one_post_thumbnail(); ?>
template-parts/header/site-nav.php000064400000002432152377522560013214 0ustar00 template-parts/header/site-branding.php000064400000002774152377522560014225 0ustar00

template-parts/post/author-bio.php000064400000002174152377522560013277 0ustar00

%2$s', esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ), sprintf( /* translators: %s: Author name. */ esc_html__( 'View all of %s\'s posts.', 'twentytwentyone' ), get_the_author() ) ); ?>
template-parts/content/content-single.php000064400000002171152377522560014641 0ustar00
>
', '' ); ?>
'', /* translators: %: Page number. */ 'pagelink' => esc_html__( 'Page %', 'twentytwentyone' ), ) ); ?>
template-parts/content/content-excerpt.php000064400000001313152377522560015027 0ustar00
>
template-parts/content/content.php000064400000002373152377522560013366 0ustar00
>
', '' ); ?> ', esc_url( get_permalink() ) ), '' ); ?>
'', /* translators: %: Page number. */ 'pagelink' => esc_html__( 'Page %', 'twentytwentyone' ), ) ); ?>
template-parts/content/content-page.php000064400000003044152377522560014274 0ustar00
>
'', /* translators: %: Page number. */ 'pagelink' => esc_html__( 'Page %', 'twentytwentyone' ), ) ); ?>
template-parts/content/content-none.php000064400000003330152377522560014315 0ustar00

' . esc_html( get_search_query() ) . '' ); ?>

' . wp_kses( /* translators: %s: Link to WP admin new post page. */ __( 'Ready to publish your first post? Get started here.', 'twentytwentyone' ), array( 'a' => array( 'href' => array(), ), ) ) . '

', esc_url( admin_url( 'post-new.php' ) ) ); ?>

index.php000064400000002256152377522560006407 0ustar00

tag in the document head, * WordPress will provide it for us. */ add_theme_support( 'title-tag' ); /** * Add post-formats support. */ add_theme_support( 'post-formats', array( 'link', 'aside', 'gallery', 'image', 'quote', 'status', 'video', 'audio', 'chat', ) ); /* * Enable support for Post Thumbnails on posts and pages. * * @link https://developer.wordpress.org/themes/functionality/featured-images-post-thumbnails/ */ add_theme_support( 'post-thumbnails' ); set_post_thumbnail_size( 1568, 9999 ); register_nav_menus( array( 'primary' => esc_html__( 'Primary menu', 'twentytwentyone' ), 'footer' => esc_html__( 'Secondary menu', 'twentytwentyone' ), ) ); /* * Switch default core markup for search form, comment form, and comments * to output valid HTML5. */ add_theme_support( 'html5', array( 'comment-form', 'comment-list', 'gallery', 'caption', 'style', 'script', 'navigation-widgets', ) ); /* * Add support for core custom logo. * * @link https://codex.wordpress.org/Theme_Logo */ $logo_width = 300; $logo_height = 100; add_theme_support( 'custom-logo', array( 'height' => $logo_height, 'width' => $logo_width, 'flex-width' => true, 'flex-height' => true, 'unlink-homepage-logo' => true, ) ); // Add theme support for selective refresh for widgets. add_theme_support( 'customize-selective-refresh-widgets' ); // Add support for Block Styles. add_theme_support( 'wp-block-styles' ); // Add support for full and wide align images. add_theme_support( 'align-wide' ); // Add support for editor styles. add_theme_support( 'editor-styles' ); $background_color = get_theme_mod( 'background_color', 'D1E4DD' ); if ( 127 > Twenty_Twenty_One_Custom_Colors::get_relative_luminance_from_hex( $background_color ) ) { add_theme_support( 'dark-editor-style' ); } $editor_stylesheet_path = './assets/css/style-editor.css'; // Note, the is_IE global variable is defined by WordPress and is used // to detect if the current browser is internet explorer. global $is_IE; if ( $is_IE ) { $editor_stylesheet_path = './assets/css/ie-editor.css'; } // Enqueue editor styles. add_editor_style( $editor_stylesheet_path ); // Add custom editor font sizes. add_theme_support( 'editor-font-sizes', array( array( 'name' => esc_html__( 'Extra small', 'twentytwentyone' ), 'shortName' => esc_html_x( 'XS', 'Font size', 'twentytwentyone' ), 'size' => 16, 'slug' => 'extra-small', ), array( 'name' => esc_html__( 'Small', 'twentytwentyone' ), 'shortName' => esc_html_x( 'S', 'Font size', 'twentytwentyone' ), 'size' => 18, 'slug' => 'small', ), array( 'name' => esc_html__( 'Normal', 'twentytwentyone' ), 'shortName' => esc_html_x( 'M', 'Font size', 'twentytwentyone' ), 'size' => 20, 'slug' => 'normal', ), array( 'name' => esc_html__( 'Large', 'twentytwentyone' ), 'shortName' => esc_html_x( 'L', 'Font size', 'twentytwentyone' ), 'size' => 24, 'slug' => 'large', ), array( 'name' => esc_html__( 'Extra large', 'twentytwentyone' ), 'shortName' => esc_html_x( 'XL', 'Font size', 'twentytwentyone' ), 'size' => 40, 'slug' => 'extra-large', ), array( 'name' => esc_html__( 'Huge', 'twentytwentyone' ), 'shortName' => esc_html_x( 'XXL', 'Font size', 'twentytwentyone' ), 'size' => 96, 'slug' => 'huge', ), array( 'name' => esc_html__( 'Gigantic', 'twentytwentyone' ), 'shortName' => esc_html_x( 'XXXL', 'Font size', 'twentytwentyone' ), 'size' => 144, 'slug' => 'gigantic', ), ) ); // Custom background color. add_theme_support( 'custom-background', array( 'default-color' => 'd1e4dd', ) ); // Editor color palette. $black = '#000000'; $dark_gray = '#28303D'; $gray = '#39414D'; $green = '#D1E4DD'; $blue = '#D1DFE4'; $purple = '#D1D1E4'; $red = '#E4D1D1'; $orange = '#E4DAD1'; $yellow = '#EEEADD'; $white = '#FFFFFF'; add_theme_support( 'editor-color-palette', array( array( 'name' => esc_html__( 'Black', 'twentytwentyone' ), 'slug' => 'black', 'color' => $black, ), array( 'name' => esc_html__( 'Dark gray', 'twentytwentyone' ), 'slug' => 'dark-gray', 'color' => $dark_gray, ), array( 'name' => esc_html__( 'Gray', 'twentytwentyone' ), 'slug' => 'gray', 'color' => $gray, ), array( 'name' => esc_html__( 'Green', 'twentytwentyone' ), 'slug' => 'green', 'color' => $green, ), array( 'name' => esc_html__( 'Blue', 'twentytwentyone' ), 'slug' => 'blue', 'color' => $blue, ), array( 'name' => esc_html__( 'Purple', 'twentytwentyone' ), 'slug' => 'purple', 'color' => $purple, ), array( 'name' => esc_html__( 'Red', 'twentytwentyone' ), 'slug' => 'red', 'color' => $red, ), array( 'name' => esc_html__( 'Orange', 'twentytwentyone' ), 'slug' => 'orange', 'color' => $orange, ), array( 'name' => esc_html__( 'Yellow', 'twentytwentyone' ), 'slug' => 'yellow', 'color' => $yellow, ), array( 'name' => esc_html__( 'White', 'twentytwentyone' ), 'slug' => 'white', 'color' => $white, ), ) ); add_theme_support( 'editor-gradient-presets', array( array( 'name' => esc_html__( 'Purple to yellow', 'twentytwentyone' ), 'gradient' => 'linear-gradient(160deg, ' . $purple . ' 0%, ' . $yellow . ' 100%)', 'slug' => 'purple-to-yellow', ), array( 'name' => esc_html__( 'Yellow to purple', 'twentytwentyone' ), 'gradient' => 'linear-gradient(160deg, ' . $yellow . ' 0%, ' . $purple . ' 100%)', 'slug' => 'yellow-to-purple', ), array( 'name' => esc_html__( 'Green to yellow', 'twentytwentyone' ), 'gradient' => 'linear-gradient(160deg, ' . $green . ' 0%, ' . $yellow . ' 100%)', 'slug' => 'green-to-yellow', ), array( 'name' => esc_html__( 'Yellow to green', 'twentytwentyone' ), 'gradient' => 'linear-gradient(160deg, ' . $yellow . ' 0%, ' . $green . ' 100%)', 'slug' => 'yellow-to-green', ), array( 'name' => esc_html__( 'Red to yellow', 'twentytwentyone' ), 'gradient' => 'linear-gradient(160deg, ' . $red . ' 0%, ' . $yellow . ' 100%)', 'slug' => 'red-to-yellow', ), array( 'name' => esc_html__( 'Yellow to red', 'twentytwentyone' ), 'gradient' => 'linear-gradient(160deg, ' . $yellow . ' 0%, ' . $red . ' 100%)', 'slug' => 'yellow-to-red', ), array( 'name' => esc_html__( 'Purple to red', 'twentytwentyone' ), 'gradient' => 'linear-gradient(160deg, ' . $purple . ' 0%, ' . $red . ' 100%)', 'slug' => 'purple-to-red', ), array( 'name' => esc_html__( 'Red to purple', 'twentytwentyone' ), 'gradient' => 'linear-gradient(160deg, ' . $red . ' 0%, ' . $purple . ' 100%)', 'slug' => 'red-to-purple', ), ) ); /* * Adds starter content to highlight the theme on fresh sites. * This is done conditionally to avoid loading the starter content on every * page load, as it is a one-off operation only needed once in the customizer. */ if ( is_customize_preview() ) { require get_template_directory() . '/inc/starter-content.php'; add_theme_support( 'starter-content', twenty_twenty_one_get_starter_content() ); } // Add support for responsive embedded content. add_theme_support( 'responsive-embeds' ); // Add support for custom line height controls. add_theme_support( 'custom-line-height' ); // Add support for experimental link color control. add_theme_support( 'experimental-link-color' ); // Add support for experimental cover block spacing. add_theme_support( 'custom-spacing' ); // Add support for custom units. // This was removed in WordPress 5.6 but is still required to properly support WP 5.5. add_theme_support( 'custom-units' ); // Remove feed icon link from legacy RSS widget. add_filter( 'rss_widget_feed_link', '__return_false' ); } } add_action( 'after_setup_theme', 'twenty_twenty_one_setup' ); /** * Register widget area. * * @since Twenty Twenty-One 1.0 * * @link https://developer.wordpress.org/themes/functionality/sidebars/#registering-a-sidebar * * @return void */ function twenty_twenty_one_widgets_init() { register_sidebar( array( 'name' => esc_html__( 'Footer', 'twentytwentyone' ), 'id' => 'sidebar-1', 'description' => esc_html__( 'Add widgets here to appear in your footer.', 'twentytwentyone' ), 'before_widget' => '
', 'after_widget' => '
', 'before_title' => '

', 'after_title' => '

', ) ); } add_action( 'widgets_init', 'twenty_twenty_one_widgets_init' ); /** * Set the content width in pixels, based on the theme's design and stylesheet. * * Priority 0 to make it available to lower priority callbacks. * * @since Twenty Twenty-One 1.0 * * @global int $content_width Content width. * * @return void */ function twenty_twenty_one_content_width() { // This variable is intended to be overruled from themes. // Open WPCS issue: {@link https://github.com/WordPress-Coding-Standards/WordPress-Coding-Standards/issues/1043}. // phpcs:ignore WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound $GLOBALS['content_width'] = apply_filters( 'twenty_twenty_one_content_width', 750 ); } add_action( 'after_setup_theme', 'twenty_twenty_one_content_width', 0 ); /** * Enqueue scripts and styles. * * @since Twenty Twenty-One 1.0 * * @return void */ function twenty_twenty_one_scripts() { // Note, the is_IE global variable is defined by WordPress and is used // to detect if the current browser is internet explorer. global $is_IE, $wp_scripts; if ( $is_IE ) { // If IE 11 or below, use a flattened stylesheet with static values replacing CSS Variables. wp_enqueue_style( 'twenty-twenty-one-style', get_template_directory_uri() . '/assets/css/ie.css', array(), wp_get_theme()->get( 'Version' ) ); } else { // If not IE, use the standard stylesheet. wp_enqueue_style( 'twenty-twenty-one-style', get_template_directory_uri() . '/style.css', array(), wp_get_theme()->get( 'Version' ) ); } // RTL styles. wp_style_add_data( 'twenty-twenty-one-style', 'rtl', 'replace' ); // Print styles. wp_enqueue_style( 'twenty-twenty-one-print-style', get_template_directory_uri() . '/assets/css/print.css', array(), wp_get_theme()->get( 'Version' ), 'print' ); // Threaded comment reply styles. if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) { wp_enqueue_script( 'comment-reply' ); } // Register the IE11 polyfill file. wp_register_script( 'twenty-twenty-one-ie11-polyfills-asset', get_template_directory_uri() . '/assets/js/polyfills.js', array(), wp_get_theme()->get( 'Version' ), true ); // Register the IE11 polyfill loader. wp_register_script( 'twenty-twenty-one-ie11-polyfills', null, array(), wp_get_theme()->get( 'Version' ), true ); wp_add_inline_script( 'twenty-twenty-one-ie11-polyfills', wp_get_script_polyfill( $wp_scripts, array( 'Element.prototype.matches && Element.prototype.closest && window.NodeList && NodeList.prototype.forEach' => 'twenty-twenty-one-ie11-polyfills-asset', ) ) ); // Main navigation scripts. if ( has_nav_menu( 'primary' ) ) { wp_enqueue_script( 'twenty-twenty-one-primary-navigation-script', get_template_directory_uri() . '/assets/js/primary-navigation.js', array( 'twenty-twenty-one-ie11-polyfills' ), wp_get_theme()->get( 'Version' ), true ); } // Responsive embeds script. wp_enqueue_script( 'twenty-twenty-one-responsive-embeds-script', get_template_directory_uri() . '/assets/js/responsive-embeds.js', array( 'twenty-twenty-one-ie11-polyfills' ), wp_get_theme()->get( 'Version' ), true ); } add_action( 'wp_enqueue_scripts', 'twenty_twenty_one_scripts' ); /** * Enqueue block editor script. * * @since Twenty Twenty-One 1.0 * * @return void */ function twentytwentyone_block_editor_script() { wp_enqueue_script( 'twentytwentyone-editor', get_theme_file_uri( '/assets/js/editor.js' ), array( 'wp-blocks', 'wp-dom' ), wp_get_theme()->get( 'Version' ), true ); } add_action( 'enqueue_block_editor_assets', 'twentytwentyone_block_editor_script' ); /** * Fix skip link focus in IE11. * * This does not enqueue the script because it is tiny and because it is only for IE11, * thus it does not warrant having an entire dedicated blocking script being loaded. * * @since Twenty Twenty-One 1.0 * * @link https://git.io/vWdr2 */ function twenty_twenty_one_skip_link_focus_fix() { // If SCRIPT_DEBUG is defined and true, print the unminified file. if ( defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ) { echo ''; } else { // The following is minified via `npx terser --compress --mangle -- assets/js/skip-link-focus-fix.js`. ?> get( 'Version' ), true ); wp_enqueue_script( 'twentytwentyone-customize-preview', get_theme_file_uri( '/assets/js/customize-preview.js' ), array( 'customize-preview', 'customize-selective-refresh', 'jquery', 'twentytwentyone-customize-helpers' ), wp_get_theme()->get( 'Version' ), true ); } add_action( 'customize_preview_init', 'twentytwentyone_customize_preview_init' ); /** * Enqueue scripts for the customizer. * * @since Twenty Twenty-One 1.0 * * @return void */ function twentytwentyone_customize_controls_enqueue_scripts() { wp_enqueue_script( 'twentytwentyone-customize-helpers', get_theme_file_uri( '/assets/js/customize-helpers.js' ), array(), wp_get_theme()->get( 'Version' ), true ); } add_action( 'customize_controls_enqueue_scripts', 'twentytwentyone_customize_controls_enqueue_scripts' ); /** * Calculate classes for the main element. * * @since Twenty Twenty-One 1.0 * * @return void */ function twentytwentyone_the_html_classes() { /** * Filters the classes for the main element. * * @since Twenty Twenty-One 1.0 * * @param string The list of classes. Default empty string. */ $classes = apply_filters( 'twentytwentyone_html_classes', '' ); if ( ! $classes ) { return; } echo 'class="' . esc_attr( $classes ) . '"'; } /** * Add "is-IE" class to body if the user is on Internet Explorer. * * @since Twenty Twenty-One 1.0 * * @return void */ function twentytwentyone_add_ie_class() { ?> *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce), *[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce), .default-max-width { max-width: var(--responsive--aligndefault-width); margin-left: auto; margin-right: auto; } .widget-area, .pagination, .comments-pagination, .post-navigation, .site-footer, .site-header, .alignwide, .wide-max-width { max-width: var(--responsive--alignwide-width); margin-left: auto; margin-right: auto; } .alignfull, .wp-block-group .wp-block-group__inner-container > *.alignfull, .full-max-width { max-width: var(--responsive--alignfull-width); width: var(--responsive--alignfull-width); margin-left: auto; margin-right: auto; } @media only screen and (min-width: 482px) { .alignfull, .full-max-width { max-width: var(--responsive--alignfull-width); width: auto; margin-left: auto; margin-right: auto; } } .entry-header .post-thumbnail, .singular .post-thumbnail, .alignfull [class*=inner-container] > .alignwide, .alignwide [class*=inner-container] > .alignwide { margin-left: auto; margin-right: auto; width: var(--responsive--alignwide-width); max-width: var(--responsive--alignfull-width); } @media only screen and (min-width: 482px) { .entry-content > .alignleft { /*rtl:ignore*/ margin-left: var(--responsive--alignleft-margin); /*rtl:ignore*/ margin-right: var(--global--spacing-horizontal); } } @media only screen and (min-width: 482px) { .entry-content > .alignright { /*rtl:ignore*/ margin-left: var(--global--spacing-horizontal); /*rtl:ignore*/ margin-right: var(--responsive--alignright-margin); } } /** * Site Structure * * - Set vertical margins and responsive widths on * top-level wrappers and content wrappers * - `--global--width-content` is a responsive variable * - See: globals/_global-width-responsive.scss */ /** * Top Level Wrappers (header, main, footer) * - Set vertical padding and horizontal margins */ .site-header, .site-main, .widget-area, .site-footer { padding-top: var(--global--spacing-vertical); padding-bottom: var(--global--spacing-vertical); margin-left: auto; margin-right: auto; } .site-header { padding-top: calc(0.75 * var(--global--spacing-vertical)); padding-bottom: calc(2 * var(--global--spacing-vertical)); } @media only screen and (min-width: 482px) { .site-header { padding-bottom: calc(3 * var(--global--spacing-vertical)); } } /** * Site-main children wrappers * - Add double vertical margins here for clearer hierarchy */ .site-main > * { margin-top: calc(3 * var(--global--spacing-vertical)); margin-bottom: calc(3 * var(--global--spacing-vertical)); } .site-main > *:first-child { margin-top: 0; } .site-main > *:last-child { margin-bottom: 0; } /** * Set the default maximum responsive content-width */ /** * Set the wide maximum responsive content-width */ /** * Set the full maximum responsive content-width */ /* * Block & non-gutenberg content wrappers * - Set margins */ .entry-header, .post-thumbnail, .entry-content, .entry-footer, .author-bio { margin-top: var(--global--spacing-vertical); margin-right: auto; margin-bottom: var(--global--spacing-vertical); margin-left: auto; } /* * Block & non-gutenberg content wrapper children * - Sets spacing-vertical margin logic */ .site-main > article > *, .site-main > .not-found > *, .entry-content > *, [class*=inner-container] > *, .wp-block-template-part > *, .wp-block-post-template :where(li > *) { margin-top: calc(0.666 * var(--global--spacing-vertical)); margin-bottom: calc(0.666 * var(--global--spacing-vertical)); } @media only screen and (min-width: 482px) { .site-main > article > *, .site-main > .not-found > *, .entry-content > *, [class*=inner-container] > *, .wp-block-template-part > *, .wp-block-post-template :where(li > *) { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } } .site-main > article > *:first-child, .site-main > .not-found > *:first-child, .entry-content > *:first-child, [class*=inner-container] > *:first-child, .wp-block-template-part > *:first-child, .wp-block-post-template :where(li > *):first-child { margin-top: 0; } .site-main > article > *:last-child, .site-main > .not-found > *:last-child, .entry-content > *:last-child, [class*=inner-container] > *:last-child, .wp-block-template-part > *:last-child, .wp-block-post-template :where(li > *):last-child { margin-bottom: 0; } .site-footer > *, .widget-area > * { margin-top: calc(0.666 * var(--global--spacing-vertical)); margin-bottom: calc(0.666 * var(--global--spacing-vertical)); } @media only screen and (min-width: 482px) { .site-footer > *, .widget-area > * { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } } /* * Block & non-gutenberg content wrapper children * - Sets spacing-unit margins */ .entry-header > *, .post-thumbnail > *, .page-content > *, .comment-content > *, .widget > * { margin-top: var(--global--spacing-unit); margin-bottom: var(--global--spacing-unit); } .entry-header > *:first-child, .post-thumbnail > *:first-child, .page-content > *:first-child, .comment-content > *:first-child, .widget > *:first-child { margin-top: 0; } .entry-header > *:last-child, .post-thumbnail > *:last-child, .page-content > *:last-child, .comment-content > *:last-child, .widget > *:last-child { margin-bottom: 0; } /* * .entry-content children specific controls * - Adds special margin overrides for alignment utility classes */ .entry-content > * { /* Reset alignleft and alignright margins after alignfull */ } .entry-content > *.alignleft, .entry-content > *.alignright, .entry-content > *.alignleft:first-child + *, .entry-content > *.alignright:first-child + *, .entry-content > *.alignfull.has-background { margin-top: 0; } .entry-content > *:last-child, .entry-content > *.alignfull.has-background { margin-bottom: 0; } .entry-content > *.alignfull + .alignleft, .entry-content > *.alignfull + .alignright { margin-top: var(--global--spacing-vertical); } /** * Reset specific elements to make them easier to style in other contexts. */ html, body, p, ol, ul, li, dl, dt, dd, blockquote, figure, fieldset, form, legend, textarea, pre, iframe, hr, h1, h2, h3, h4, h5, h6 { padding: 0; margin: 0; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } /** * Apply generic border-box to all elements. * See: * https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ html { /* Apply border-box across the entire page. */ box-sizing: border-box; font-family: var(--global--font-secondary); line-height: var(--global--line-height-body); } /** * Relax the definition a bit, to allow components to override it manually. */ *, *::before, *::after { box-sizing: inherit; } body { font-size: var(--global--font-size-base); font-weight: normal; color: var(--global--color-primary); text-align: left; background-color: var(--global--color-background); } button { cursor: pointer; } .clear:before, .clear:after, .entry-content:before, .entry-content:after, .comment-content:before, .comment-content:after, .site-header:before, .site-header:after, .site-content:before, .site-content:after, .site-footer:before, .site-footer:after { content: ""; display: table; table-layout: fixed; } .clear:after, .entry-content:after, .comment-content:after, .site-header:after, .site-content:after, .site-footer:after { clear: both; } /* Category 04 can contain any default HTML element. Do not add classes here, just give the elements some basic styles. */ blockquote { padding: 0; position: relative; margin: var(--global--spacing-vertical) 0 var(--global--spacing-vertical) var(--global--spacing-horizontal); } blockquote > * { margin-top: var(--global--spacing-unit); margin-bottom: var(--global--spacing-unit); } blockquote > *:first-child { margin-top: 0; } blockquote > *:last-child { margin-bottom: 0; } blockquote p { letter-spacing: var(--heading--letter-spacing-h4); font-family: var(--quote--font-family); font-size: var(--quote--font-size); font-style: var(--quote--font-style); font-weight: var(--quote--font-weight); line-height: var(--quote--line-height); } blockquote cite, blockquote footer { font-weight: normal; color: var(--global--color-primary); font-size: var(--global--font-size-xs); letter-spacing: var(--global--letter-spacing); } blockquote.alignleft, blockquote.alignright { padding-left: inherit; } blockquote.alignleft p, blockquote.alignright p { font-size: var(--heading--font-size-h5); max-width: inherit; width: inherit; } blockquote.alignleft cite, blockquote.alignleft footer, blockquote.alignright cite, blockquote.alignright footer { font-size: var(--global--font-size-xs); letter-spacing: var(--global--letter-spacing); } blockquote strong { font-weight: var(--quote--font-weight-strong); } blockquote:before { content: "“"; font-size: var(--quote--font-size); line-height: var(--quote--line-height); position: absolute; left: calc(-0.5 * var(--global--spacing-horizontal)); } blockquote .wp-block-quote__citation, blockquote cite, blockquote footer { color: var(--global--color-primary); font-size: var(--global--font-size-xs); font-style: var(--quote--font-style-cite); } @media only screen and (max-width: 481px) { blockquote { padding-left: calc(0.5 * var(--global--spacing-horizontal)); } blockquote:before { left: 0; } } input[type=text], input[type=email], input[type=url], input[type=password], input[type=search], input[type=number], input[type=tel], input[type=date], input[type=month], input[type=week], input[type=time], input[type=datetime], input[type=datetime-local], input[type=color], .site textarea { border: var(--form--border-width) solid var(--form--border-color); border-radius: var(--form--border-radius); color: var(--form--color-text); line-height: var(--global--line-height-body); padding: var(--form--spacing-unit); margin: 0 2px; max-width: 100%; } input[type=text]:focus, input[type=email]:focus, input[type=url]:focus, input[type=password]:focus, input[type=search]:focus, input[type=number]:focus, input[type=tel]:focus, input[type=date]:focus, input[type=month]:focus, input[type=week]:focus, input[type=time]:focus, input[type=datetime]:focus, input[type=datetime-local]:focus, input[type=color]:focus, .site textarea:focus { color: var(--form--color-text); outline-offset: 2px; outline: 2px dotted var(--form--border-color); } input[type=text]:disabled, input[type=email]:disabled, input[type=url]:disabled, input[type=password]:disabled, input[type=search]:disabled, input[type=number]:disabled, input[type=tel]:disabled, input[type=date]:disabled, input[type=month]:disabled, input[type=week]:disabled, input[type=time]:disabled, input[type=datetime]:disabled, input[type=datetime-local]:disabled, input[type=color]:disabled, .site textarea:disabled { opacity: 0.7; } .is-dark-theme input[type=text], .is-dark-theme input[type=email], .is-dark-theme input[type=url], .is-dark-theme input[type=password], .is-dark-theme input[type=search], .is-dark-theme input[type=number], .is-dark-theme input[type=tel], .is-dark-theme input[type=date], .is-dark-theme input[type=month], .is-dark-theme input[type=week], .is-dark-theme input[type=time], .is-dark-theme input[type=datetime], .is-dark-theme input[type=datetime-local], .is-dark-theme input[type=color], .is-dark-theme .site textarea { background: var(--global--color-white-90); } input[type=search]:focus { outline-offset: -7px; } .is-dark-theme input[type=search]:focus { outline-color: var(--global--color-background); } input[type=color] { padding: calc(var(--form--spacing-unit) / 2); height: calc(4 * var(--form--spacing-unit)); } input[type=email], input[type=url] { /*rtl:ignore*/ direction: ltr; } select { border: var(--form--border-width) solid var(--form--border-color); color: var(--form--color-text); -moz-appearance: none; -webkit-appearance: none; appearance: none; line-height: var(--global--line-height-body); padding: var(--form--spacing-unit) calc(3 * var(--form--spacing-unit)) var(--form--spacing-unit) var(--form--spacing-unit); background: var(--global--color-white) url("data:image/svg+xml;utf8,") no-repeat; background-position: right var(--form--spacing-unit) top 60%; } select:focus { outline-offset: 2px; outline: 2px dotted var(--form--border-color); } .is-dark-theme select { background: var(--global--color-white-90) url("data:image/svg+xml;utf8,") no-repeat; background-position: right var(--form--spacing-unit) top 60%; } textarea { width: 100%; } label { font-size: var(--form--font-size); font-weight: var(--form--label-weight); margin-bottom: calc(var(--global--spacing-vertical) / 3); } /** https://css-tricks.com/custom-styling-form-inputs-with-modern-css-features/ https://codepen.io/aaroniker/pen/ZEYoxEY by Aaron Iker. License: MIT. */ @supports (-webkit-appearance: none) or (-moz-appearance: none) { input[type=checkbox], input[type=radio] { -webkit-appearance: none; -moz-appearance: none; position: relative; width: 25px; height: 25px; border: var(--form--border-width) solid var(--form--border-color); background: var(--global--color-white); } input[type=checkbox]:disabled, input[type=radio]:disabled { opacity: 0.7; } .is-dark-theme input[type=checkbox], .is-dark-theme input[type=radio] { background: var(--global--color-white-90); } input[type=checkbox]:focus { outline-offset: 2px; outline: 2px dotted var(--form--border-color); } input[type=checkbox]:after { content: ""; opacity: 0; display: block; left: 5px; top: 2px; position: absolute; width: 7px; height: 13px; border: 3px solid var(--form--color-text); border-top: 0; border-left: 0; transform: rotate(30deg); } input[type=checkbox]:checked { color: var(--form--color-text); } input[type=checkbox]:checked:after { opacity: 1; } input[type=radio] { border-radius: 50%; } input[type=radio]:focus { outline-offset: 2px; outline: 2px dotted var(--form--border-color); } input[type=radio]:after { content: ""; opacity: 0; display: block; left: 3px; top: 3px; position: absolute; width: 11px; height: 11px; border-radius: 50%; background: var(--form--color-text); } input[type=radio]:checked { border: 4px solid var(--form--border-color); } input[type=radio]:checked:after { opacity: 1; } input[type=radio]:checked:focus { outline-offset: 4px; outline: 2px dotted var(--form--border-color); } } input[type=checkbox] + label, input[type=radio] + label { display: inline-block; padding-left: 10px; font-size: var(--global--font-size-xs); vertical-align: top; } /** * https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/ */ @supports (-webkit-appearance: none) or (-moz-appearance: none) { input[type=range] { -webkit-appearance: none; /* Hides the slider so that custom slider can be made */ width: 100%; /* Specific width is required for Firefox. */ height: 6px; background: var(--form--color-ranged); border-radius: 6px; outline-offset: 10px; } input[type=range]:disabled { opacity: 0.7; } input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; border: 3px solid var(--form--color-ranged); height: 44px; width: 44px; border-radius: 50%; background: var(--global--color-background); cursor: pointer; } input[type=range]::-moz-range-thumb { border: 3px solid var(--form--color-ranged); height: 44px; width: 44px; border-radius: 50%; background: var(--global--color-background); cursor: pointer; box-sizing: border-box; } } input[type=range]::-ms-track { width: 100%; height: 6px; border-radius: 6px; border-width: 19px 0; border-color: var(--global--color-background); background: transparent; color: transparent; cursor: pointer; } input[type=range]::-ms-fill-upper { background: var(--form--color-ranged); border-radius: 6px; } input[type=range]::-ms-fill-lower { background: var(--form--color-ranged); border-radius: 6px; } input[type=range]::-ms-thumb { border: 3px solid var(--form--color-ranged); height: 44px; width: 44px; border-radius: 50%; background: var(--global--color-background); cursor: pointer; } fieldset { display: grid; border-color: var(--global--color-secondary); padding: var(--global--spacing-horizontal); } fieldset legend { font-size: var(--global--font-size-lg); } fieldset input[type=submit] { max-width: max-content; } fieldset input:not([type=submit]) { margin-bottom: var(--global--spacing-unit); } fieldset input[type=radio], fieldset input[type=checkbox] { margin-bottom: 0; } fieldset input[type=radio] + label, fieldset input[type=checkbox] + label { font-size: var(--form--font-size); padding-left: 0; margin-bottom: var(--global--spacing-unit); } ::-moz-placeholder { opacity: 1; } .post-password-message { font-size: var(--global--font-size-lg); } .post-password-form { display: flex; flex-wrap: wrap; } .post-password-form__label { width: 100%; margin-bottom: 0; } .post-password-form input[type=password] { flex-grow: 1; margin-top: calc(var(--global--spacing-vertical) / 3); margin-right: calc(0.66 * var(--global--spacing-horizontal)); } .post-password-form__submit { margin-top: calc(var(--global--spacing-vertical) / 3); } @media only screen and (min-width: 592px) { .post-password-form__submit { margin-left: calc(0.4 * var(--global--spacing-horizontal)); } } img { height: auto; max-width: 100%; vertical-align: middle; } /* Classic editor images */ .entry-content img { max-width: 100%; } /* Make sure embeds and iframes fit their containers. */ embed, iframe, object, video { max-width: 100%; } /* Media captions */ figcaption, .wp-caption, .wp-caption-text, .wp-block-embed figcaption { color: currentColor; font-size: var(--global--font-size-xs); line-height: var(--global--line-height-body); margin-top: calc(0.5 * var(--global--spacing-unit)); margin-bottom: var(--global--spacing-unit); text-align: center; } .alignleft figcaption, .alignright figcaption, .alignleft .wp-caption, .alignright .wp-caption, .alignleft .wp-caption-text, .alignright .wp-caption-text, .alignleft .wp-block-embed figcaption, .alignright .wp-block-embed figcaption { margin-bottom: 0; } /* WP Smiley */ .page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } /* Over here, place any elements that do not need to have their own file. */ b, strong { font-weight: 700; } dfn, cite, em, i { font-style: italic; } pre { white-space: pre; overflow-x: auto; } /* * text-underline-offset doesn't work in Chrome at all 👎 * But looks nice in Safari/Firefox, so let's keep it and * maybe Chrome will support it soon. */ a { cursor: pointer; color: var(--wp--style--color--link, var(--global--color-primary)); text-underline-offset: 3px; text-decoration-skip-ink: all; } a:hover { text-decoration-style: dotted; text-decoration-skip-ink: none; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; text-decoration: underline 1px dotted currentColor; text-decoration-skip-ink: none; background: rgba(255, 255, 255, 0.9); } .is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { background: var(--global--color-black); color: var(--global--color-white); text-decoration: none; } .is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav { color: var(--wp--style--color--link, var(--global--color-white)); } .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { background: rgba(0, 0, 0, 0.9); color: var(--wp--style--color--link, var(--global--color-white)); } .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav { color: var(--wp--style--color--link, var(--global--color-white)); } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link { /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; outline-offset: -2px; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link:focus { color: #21759b; background-color: #f1f1f1; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).custom-logo-link { background: none; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) img { outline: 2px dotted var(--wp--style--color--link, var(--global--color-primary)); } .has-background .has-link-color a, .has-background.has-link-color a { color: var(--wp--style--color--link, var(--global--color-primary)); } /* Category 05 is all about adjusting the default block styles to the given layout. I only added three blocks as examples. */ .wp-block-audio audio:focus { outline-offset: 5px; outline: 2px solid var(--global--color-primary); } /** * Button */ .site .button, button, input[type=submit], input[type=reset], .wp-block-search .wp-block-search__button, .wp-block-button .wp-block-button__link, .wp-block-file a.wp-block-file__button { border: var(--button--border-width) solid transparent; border-radius: var(--button--border-radius); cursor: pointer; font-weight: var(--button--font-weight); font-family: var(--button--font-family); font-size: var(--button--font-size); line-height: var(--button--line-height); padding: var(--button--padding-vertical) var(--button--padding-horizontal); text-decoration: none; } .site .button:not(:hover):not(:active):not(.has-text-color), button:not(:hover):not(:active):not(.has-text-color), input[type=submit]:not(:hover):not(:active):not(.has-text-color), input[type=reset]:not(:hover):not(:active):not(.has-text-color), .wp-block-search .wp-block-search__button:not(:hover):not(:active):not(.has-text-color), .wp-block-button .wp-block-button__link:not(:hover):not(:active):not(.has-text-color), .wp-block-file a.wp-block-file__button:not(:hover):not(:active):not(.has-text-color) { color: var(--global--color-background); } .has-background .site .button:not(:hover):not(:active):not(.has-text-color), .has-background button:not(:hover):not(:active):not(.has-text-color), .has-background input[type=submit]:not(:hover):not(:active):not(.has-text-color), .has-background input[type=reset]:not(:hover):not(:active):not(.has-text-color), .has-background .wp-block-search .wp-block-search__button:not(:hover):not(:active):not(.has-text-color), .has-background .wp-block-button .wp-block-button__link:not(:hover):not(:active):not(.has-text-color), .has-background .wp-block-file a.wp-block-file__button:not(:hover):not(:active):not(.has-text-color) { color: var(--local--color-background, var(--global--color-primary)); } .has-background .site .button:not(:hover):not(:active):not(.has-text-color).has-background, .has-background button:not(:hover):not(:active):not(.has-text-color).has-background, .has-background input[type=submit]:not(:hover):not(:active):not(.has-text-color).has-background, .has-background input[type=reset]:not(:hover):not(:active):not(.has-text-color).has-background, .has-background .wp-block-search .wp-block-search__button:not(:hover):not(:active):not(.has-text-color).has-background, .has-background .wp-block-button .wp-block-button__link:not(:hover):not(:active):not(.has-text-color).has-background, .has-background .wp-block-file a.wp-block-file__button:not(:hover):not(:active):not(.has-text-color).has-background { color: var(--global--color-primary); } .site .button:not(:hover):not(:active):not(.has-background), button:not(:hover):not(:active):not(.has-background), input[type=submit]:not(:hover):not(:active):not(.has-background), input[type=reset]:not(:hover):not(:active):not(.has-background), .wp-block-search .wp-block-search__button:not(:hover):not(:active):not(.has-background), .wp-block-button .wp-block-button__link:not(:hover):not(:active):not(.has-background), .wp-block-file a.wp-block-file__button:not(:hover):not(:active):not(.has-background) { background-color: var(--global--color-primary); } .has-background .site .button:not(:hover):not(:active):not(.has-background), .has-background button:not(:hover):not(:active):not(.has-background), .has-background input[type=submit]:not(:hover):not(:active):not(.has-background), .has-background input[type=reset]:not(:hover):not(:active):not(.has-background), .has-background .wp-block-search .wp-block-search__button:not(:hover):not(:active):not(.has-background), .has-background .wp-block-button .wp-block-button__link:not(:hover):not(:active):not(.has-background), .has-background .wp-block-file a.wp-block-file__button:not(:hover):not(:active):not(.has-background) { background-color: var(--local--color-primary, var(--global--color-primary)); } .site .button:hover, .site .button:active, button:hover, button:active, input[type=submit]:hover, input[type=submit]:active, input[type=reset]:hover, input[type=reset]:active, .wp-block-search .wp-block-search__button:hover, .wp-block-search .wp-block-search__button:active, .wp-block-button .wp-block-button__link:hover, .wp-block-button .wp-block-button__link:active, .wp-block-file a.wp-block-file__button:hover, .wp-block-file a.wp-block-file__button:active { background-color: transparent; border-color: currentColor; color: inherit; } .site .button:focus, button:focus, input[type=submit]:focus, input[type=reset]:focus, .wp-block-search .wp-block-search__button:focus, .wp-block-button .wp-block-button__link:focus, .wp-block-file a.wp-block-file__button:focus { outline-offset: -6px; outline: 2px dotted currentColor; } .site .button:disabled, button:disabled, input[type=submit]:disabled, input[type=reset]:disabled, .wp-block-search .wp-block-search__button:disabled, .wp-block-button .wp-block-button__link:disabled, .wp-block-file a.wp-block-file__button:disabled { background-color: var(--global--color-white-50); border-color: var(--global--color-white-50); color: var(--button--color-text-active); } /** * Block Options */ .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: var(--global--color-background); } .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: var(--local--color-background, var(--global--color-background)); } .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color).has-background { color: var(--global--color-primary); } .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: var(--global--color-primary); } .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: var(--local--color-primary, var(--global--color-primary)); } .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover, .wp-block-button:not(.is-style-outline) .wp-block-button__link:active { border-color: currentColor !important; background-color: transparent !important; color: inherit !important; } .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color), .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-background), .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active).has-background { border-color: currentColor; } .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: var(--global--color-primary); } .has-background .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: var(--local--color-primary, var(--global--color-primary)); } .has-background .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active).has-background:not(.has-text-color) { color: inherit; } .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: transparent; } .wp-block-button.is-style-outline .wp-block-button__link:hover, .wp-block-button.is-style-outline .wp-block-button__link:active { border-color: transparent !important; background-color: var(--global--color-primary) !important; color: var(--global--color-background) !important; } .has-background .wp-block-button.is-style-outline .wp-block-button__link:hover, .has-background .wp-block-button.is-style-outline .wp-block-button__link:active { background-color: var(--local--color-primary, var(--global--color-primary)) !important; color: var(--local--color-background, var(--global--color-background)) !important; } .has-text-color .wp-block-button.is-style-outline .wp-block-button__link:hover, .has-text-color .wp-block-button.is-style-outline .wp-block-button__link:active { color: var(--local--color-background, var(--global--color-background)) !important; } .wp-block-button .is-style-squared .wp-block-button__link { border-radius: 0; } .is-style-outline .wp-block-button__link[style*=radius]:focus, .wp-block-button a.wp-block-button__link[style*=radius]:focus { outline-offset: 2px; outline: 2px dotted var(--button--color-background); } .wp-block-code { border-color: var(--global--color-border); border-radius: 0; border-style: solid; border-width: 0.1rem; padding: var(--global--spacing-unit); } .wp-block-code code { color: var(--global--color-primary); white-space: pre; overflow-x: auto; display: block; } .wp-block-columns:not(.alignwide):not(.alignfull) { clear: both; } .wp-block-columns .wp-block-column > * { margin-top: calc(0.66 * var(--global--spacing-vertical)); margin-bottom: calc(0.66 * var(--global--spacing-vertical)); } @media only screen and (min-width: 482px) { .wp-block-columns .wp-block-column > * { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } } .wp-block-columns .wp-block-column > *:first-child { margin-top: 0; } .wp-block-columns .wp-block-column > *:last-child { margin-bottom: 0; } .wp-block-columns .wp-block-column:last-child { margin-bottom: 0; } .wp-block-columns .wp-block-column:not(:last-child) { margin-bottom: calc(0.66 * var(--global--spacing-vertical)); } @media only screen and (min-width: 482px) { .wp-block-columns .wp-block-column:not(:last-child) { margin-bottom: var(--global--spacing-vertical); } } @media only screen and (min-width: 822px) { .wp-block-columns .wp-block-column:not(:last-child) { margin-bottom: 0; } } .wp-block-columns.is-style-twentytwentyone-columns-overlap { justify-content: space-around; } @media only screen and (min-width: 652px) { .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) { margin-left: calc(-2 * var(--global--spacing-horizontal)); margin-top: calc(2.5 * var(--global--spacing-horizontal)); z-index: 2; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > p:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h1:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h2:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h3:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h4:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h5:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h6:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ul:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ol:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > pre:not(.has-background) { background-color: var(--global--color-background); padding: var(--global--spacing-unit); } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ul:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ol:not(.has-background) { padding-left: calc(2 * var(--global--spacing-horizontal)); } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n).is-vertically-aligned-center { margin-top: 0; } } .wp-block-columns.alignfull .wp-block-column p:not(.has-background), .wp-block-columns.alignfull .wp-block-column h1:not(.has-background), .wp-block-columns.alignfull .wp-block-column h2:not(.has-background), .wp-block-columns.alignfull .wp-block-column h3:not(.has-background), .wp-block-columns.alignfull .wp-block-column h4:not(.has-background), .wp-block-columns.alignfull .wp-block-column h5:not(.has-background), .wp-block-columns.alignfull .wp-block-column h6:not(.has-background) { padding-left: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); } .wp-block-cover, .wp-block-cover-image { background-color: var(--cover--color-background); min-height: var(--cover--height); margin-top: inherit; margin-bottom: inherit; /* default & custom background-color */ /* Treating H2 separately to account for legacy /core styles */ /* Block Styles */ /* The background color class is used just for the overlay, and does not need to be applied to the inner container. */ } .wp-block-cover:not(.alignwide):not(.alignfull), .wp-block-cover-image:not(.alignwide):not(.alignfull) { clear: both; } .wp-block-cover.alignfull, .wp-block-cover-image.alignfull { margin-top: 0; margin-bottom: 0; } .wp-block-cover .wp-block-cover__inner-container, .wp-block-cover .wp-block-cover-image-text, .wp-block-cover .wp-block-cover-text, .wp-block-cover-image .wp-block-cover__inner-container, .wp-block-cover-image .wp-block-cover-image-text, .wp-block-cover-image .wp-block-cover-text { color: currentColor; margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } .wp-block-cover .wp-block-cover__inner-container a:not(.wp-block-button__link):not(.wp-block-file__button), .wp-block-cover .wp-block-cover-image-text a:not(.wp-block-button__link):not(.wp-block-file__button), .wp-block-cover .wp-block-cover-text a:not(.wp-block-button__link):not(.wp-block-file__button), .wp-block-cover-image .wp-block-cover__inner-container a:not(.wp-block-button__link):not(.wp-block-file__button), .wp-block-cover-image .wp-block-cover-image-text a:not(.wp-block-button__link):not(.wp-block-file__button), .wp-block-cover-image .wp-block-cover-text a:not(.wp-block-button__link):not(.wp-block-file__button) { color: currentColor; } .wp-block-cover .wp-block-cover__inner-container .has-link-color a, .wp-block-cover .wp-block-cover-image-text .has-link-color a, .wp-block-cover .wp-block-cover-text .has-link-color a, .wp-block-cover-image .wp-block-cover__inner-container .has-link-color a, .wp-block-cover-image .wp-block-cover-image-text .has-link-color a, .wp-block-cover-image .wp-block-cover-text .has-link-color a { color: var(--wp--style--color--link, var(--global--color-primary)); } .wp-block-cover:not([class*=background-color]) .wp-block-cover__inner-container, .wp-block-cover:not([class*=background-color]) .wp-block-cover-image-text, .wp-block-cover:not([class*=background-color]) .wp-block-cover-text, .wp-block-cover-image:not([class*=background-color]) .wp-block-cover__inner-container, .wp-block-cover-image:not([class*=background-color]) .wp-block-cover-image-text, .wp-block-cover-image:not([class*=background-color]) .wp-block-cover-text { color: var(--cover--color-foreground); } .wp-block-cover h2, .wp-block-cover-image h2 { font-size: var(--heading--font-size-h2); letter-spacing: var(--heading--letter-spacing-h2); line-height: var(--heading--line-height-h2); max-width: inherit; text-align: inherit; padding: 0; } .wp-block-cover h2.has-text-align-left, .wp-block-cover-image h2.has-text-align-left { text-align: left; } .wp-block-cover h2.has-text-align-center, .wp-block-cover-image h2.has-text-align-center { text-align: center; } .wp-block-cover h2.has-text-align-right, .wp-block-cover-image h2.has-text-align-right { text-align: right; } .wp-block-cover .wp-block-cover__inner-container, .wp-block-cover-image .wp-block-cover__inner-container { width: calc(100% - 2 * var(--global--spacing-vertical)); } .wp-block-cover .wp-block-cover__inner-container > *, .wp-block-cover-image .wp-block-cover__inner-container > * { margin-top: calc(0.666 * var(--global--spacing-vertical)); margin-bottom: calc(0.666 * var(--global--spacing-vertical)); } @media only screen and (min-width: 482px) { .wp-block-cover .wp-block-cover__inner-container > *, .wp-block-cover-image .wp-block-cover__inner-container > * { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } } .wp-block-cover .wp-block-cover__inner-container > *:first-child, .wp-block-cover-image .wp-block-cover__inner-container > *:first-child { margin-top: 0; } .wp-block-cover .wp-block-cover__inner-container > *:last-child, .wp-block-cover-image .wp-block-cover__inner-container > *:last-child { margin-bottom: 0; } .wp-block-cover.alignleft, .wp-block-cover.alignright, .wp-block-cover-image.alignleft, .wp-block-cover-image.alignright { margin-top: 0; } .wp-block-cover.alignleft > *, .wp-block-cover.alignright > *, .wp-block-cover-image.alignleft > *, .wp-block-cover-image.alignright > * { margin-top: calc(2 * var(--global--spacing-vertical)); margin-bottom: calc(2 * var(--global--spacing-vertical)); padding-left: var(--global--spacing-horizontal); padding-right: var(--global--spacing-horizontal); width: 100%; } .wp-block-cover.has-left-content, .wp-block-cover.has-right-content, .wp-block-cover-image.has-left-content, .wp-block-cover-image.has-right-content { justify-content: center; } .wp-block-cover.is-style-twentytwentyone-border, .wp-block-cover-image.is-style-twentytwentyone-border { border: calc(3 * var(--separator--height)) solid var(--global--color-border); } .wp-block-cover[class*=-background-color][class] .wp-block-cover__inner-container, .wp-block-cover-image[class*=-background-color][class] .wp-block-cover__inner-container { background-color: unset; } .wp-block-file a.wp-block-file__button:active, .wp-block-file a.wp-block-file__button:focus, .wp-block-file a.wp-block-file__button:hover { opacity: inherit; } .wp-block-file a.wp-block-file__button { display: inline-block; } .wp-block-gallery { margin: 0 auto; } .wp-block-gallery .blocks-gallery-image, .wp-block-gallery .blocks-gallery-item { width: calc((100% - var(--global--spacing-unit)) / 2); } .wp-block-gallery .blocks-gallery-image figcaption, .wp-block-gallery .blocks-gallery-item figcaption { margin: 0; color: var(--global--color-white); font-size: var(--global--font-size-xs); } .wp-block-gallery .blocks-gallery-image figcaption a, .wp-block-gallery .blocks-gallery-item figcaption a { color: var(--global--color-white); } .wp-block-gallery .blocks-gallery-image figcaption a:focus, .wp-block-gallery .blocks-gallery-item figcaption a:focus { background-color: transparent; outline: 2px solid var(--wp--style--color--link, var(--global--color-primary)); text-decoration: none; } .wp-block-gallery .blocks-gallery-image a:focus img, .wp-block-gallery .blocks-gallery-item a:focus img { outline-offset: 2px; } .wp-block-group { display: block; clear: both; display: flow-root; } .wp-block-group:before, .wp-block-group:after { content: ""; display: block; clear: both; } .wp-block-group .wp-block-group__inner-container { margin-left: auto; margin-right: auto; } .wp-block-group .wp-block-group__inner-container > * { margin-top: calc(0.666 * var(--global--spacing-vertical)); margin-bottom: calc(0.666 * var(--global--spacing-vertical)); } @media only screen and (min-width: 482px) { .wp-block-group .wp-block-group__inner-container > * { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } } .wp-block-group .wp-block-group__inner-container > *:first-child { margin-top: 0; } .wp-block-group .wp-block-group__inner-container > *:last-child { margin-bottom: 0; } .wp-block-group.has-background { padding: calc(0.666 * var(--global--spacing-vertical)); } @media only screen and (min-width: 482px) { .wp-block-group.has-background { padding: var(--global--spacing-vertical); } } .wp-block-group.is-style-twentytwentyone-border { border: calc(3 * var(--separator--height)) solid var(--global--color-border); padding: var(--global--spacing-vertical); } .wp-block-group.has-background .wp-block-group__inner-container > .alignfull, .wp-block-group.has-background .wp-block-group__inner-container > hr.wp-block-separator:not(.is-style-dots):not(.alignwide).alignfull, .wp-block-group.is-style-twentytwentyone-border .wp-block-group__inner-container > .alignfull, .wp-block-group.is-style-twentytwentyone-border .wp-block-group__inner-container > hr.wp-block-separator:not(.is-style-dots):not(.alignwide).alignfull { max-width: calc(var(--responsive--alignfull-width) + 2 * var(--global--spacing-vertical)); width: calc(var(--responsive--alignfull-width) + 2 * var(--global--spacing-vertical)); margin-left: calc(-1 * var(--global--spacing-vertical)); } h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { clear: both; font-family: var(--heading--font-family); font-weight: var(--heading--font-weight); } h1 strong, .h1 strong, h2 strong, .h2 strong, h3 strong, .h3 strong, h4 strong, .h4 strong, h5 strong, .h5 strong, h6 strong, .h6 strong { font-weight: var(--heading--font-weight-strong); } h1, .h1 { font-size: var(--heading--font-size-h1); letter-spacing: var(--heading--letter-spacing-h1); line-height: var(--heading--line-height-h1); } h2, .h2 { font-size: var(--heading--font-size-h2); letter-spacing: var(--heading--letter-spacing-h2); line-height: var(--heading--line-height-h2); } h3, .h3 { font-size: var(--heading--font-size-h3); letter-spacing: var(--heading--letter-spacing-h3); line-height: var(--heading--line-height-h3); } h4, .h4 { font-size: var(--heading--font-size-h4); font-weight: var(--heading--font-weight-strong); letter-spacing: var(--heading--letter-spacing-h4); line-height: var(--heading--line-height-h4); } h5, .h5 { font-size: var(--heading--font-size-h5); font-weight: var(--heading--font-weight-strong); letter-spacing: var(--heading--letter-spacing-h5); line-height: var(--heading--line-height-h5); } h6, .h6 { font-size: var(--heading--font-size-h6); font-weight: var(--heading--font-weight-strong); letter-spacing: var(--heading--letter-spacing-h6); line-height: var(--heading--line-height-h6); } .wp-block-image { text-align: center; } .wp-block-image figcaption { color: var(--global--color-primary); font-size: var(--global--font-size-xs); line-height: var(--global--line-height-body); margin-top: calc(0.5 * var(--global--spacing-unit)); margin-bottom: var(--global--spacing-unit); text-align: center; } .wp-block-image .alignright { margin-left: var(--global--spacing-horizontal); } .wp-block-image .alignleft { margin-right: var(--global--spacing-horizontal); } .wp-block-image a:focus img { outline-offset: 2px; } .entry-content > *[class=wp-block-image], .entry-content [class*=inner-container] > *[class=wp-block-image] { margin-top: 0; margin-bottom: 0; } .entry-content > *[class=wp-block-image] + *, .entry-content [class*=inner-container] > *[class=wp-block-image] + * { margin-top: 0; } .wp-block-image.is-style-twentytwentyone-border img, .wp-block-image.is-style-twentytwentyone-image-frame img { border: calc(3 * var(--separator--height)) solid var(--global--color-border); } .wp-block-image.is-style-twentytwentyone-image-frame img { padding: var(--global--spacing-unit); } @media only screen and (min-width: 482px) { .entry-content > .wp-block-image > .alignleft, .entry-content > .wp-block-image > .alignright { max-width: 50%; } } @media only screen and (max-width: 481px) { .entry-content > .wp-block-image > .alignleft, .entry-content > .wp-block-image > .alignright { margin-left: 0; margin-right: 0; } } .wp-block-latest-comments { padding-left: 0; } .wp-block-latest-comments .wp-block-latest-comments__comment { font-size: var(--global--font-size-sm); line-height: var(--global--line-height-body); /* Vertical margins logic */ margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } .wp-block-latest-comments .wp-block-latest-comments__comment:first-child { margin-top: 0; } .wp-block-latest-comments .wp-block-latest-comments__comment:last-child { margin-bottom: 0; } .wp-block-latest-comments .wp-block-latest-comments__comment-meta { font-family: var(--heading--font-family); } .wp-block-latest-comments .wp-block-latest-comments__comment-date { color: var(--global--color-primary); font-size: var(--global--font-size-sm); } .wp-block-latest-comments .wp-block-latest-comments__comment-excerpt p { font-size: var(--global--font-size-sm); line-height: var(--global--line-height-body); margin: 0; } .wp-block-latest-posts { padding-left: 0; } .wp-block-latest-posts:not(.is-grid) > li { margin-top: calc(1.666 * var(--global--spacing-vertical)); margin-bottom: calc(1.666 * var(--global--spacing-vertical)); } .wp-block-latest-posts:not(.is-grid) > li:first-child { margin-top: 0; } .wp-block-latest-posts:not(.is-grid) > li:last-child { margin-bottom: 0; } .widget-area .wp-block-latest-posts:not(.is-grid) > li { margin-top: 0; margin-bottom: 0; } .wp-block-latest-posts.is-grid { word-wrap: break-word; word-break: break-word; } .wp-block-latest-posts.is-grid > li { margin-bottom: var(--global--spacing-vertical); } .wp-block-latest-posts.is-grid > li:last-child { margin-bottom: 0; } .wp-block-latest-posts.is-grid.columns-2 > li:nth-last-child(-n+2):nth-child(2n+1), .wp-block-latest-posts.is-grid.columns-2 > li:nth-last-child(-n+2):nth-child(2n+1) ~ li, .wp-block-latest-posts.is-grid.columns-3 > li:nth-last-child(-n+3):nth-child(3n+1), .wp-block-latest-posts.is-grid.columns-3 > li:nth-last-child(-n+3):nth-child(3n+1) ~ li, .wp-block-latest-posts.is-grid.columns-4 > li:nth-last-child(-n+4):nth-child(4n+1), .wp-block-latest-posts.is-grid.columns-4 > li:nth-last-child(-n+4):nth-child(4n+1) ~ li, .wp-block-latest-posts.is-grid.columns-5 > li:nth-last-child(-n+5):nth-child(5n+1), .wp-block-latest-posts.is-grid.columns-5 > li:nth-last-child(-n+5):nth-child(5n+1) ~ li, .wp-block-latest-posts.is-grid.columns-6 > li:nth-last-child(-n+6):nth-child(6n+1), .wp-block-latest-posts.is-grid.columns-6 > li:nth-last-child(-n+6):nth-child(6n+1) ~ li { margin-bottom: 0; } .wp-block-latest-posts > li > * { margin-top: calc(0.333 * var(--global--spacing-vertical)); margin-bottom: calc(0.333 * var(--global--spacing-vertical)); } .wp-block-latest-posts > li > *:first-child { margin-top: 0; } .wp-block-latest-posts > li > *:last-child { margin-bottom: 0; } .wp-block-latest-posts > li > a { display: inline-block; font-family: var(--latest-posts--title-font-family); font-size: var(--latest-posts--title-font-size); font-weight: var(--heading--font-weight); line-height: var(--global--line-height-heading); margin-bottom: calc(0.333 * var(--global--spacing-vertical)); } .widget-area .wp-block-latest-posts > li > a { font-size: var(--global--font-size-sm); margin-bottom: 0; } .wp-block-latest-posts .wp-block-latest-posts__post-author { color: var(--global--color-primary); font-size: var(--global--font-size-md); line-height: var(--global--line-height-body); } .wp-block-latest-posts .wp-block-latest-posts__post-date { color: var(--global--color-primary); font-size: var(--global--font-size-xs); line-height: var(--global--line-height-body); } [class*=inner-container] .wp-block-latest-posts .wp-block-latest-posts__post-date, .has-background .wp-block-latest-posts .wp-block-latest-posts__post-date { color: currentColor; } .wp-block-latest-posts .wp-block-latest-posts__post-excerpt, .wp-block-latest-posts .wp-block-latest-posts__post-full-content { font-family: var(--latest-posts--description-font-family); font-size: var(--latest-posts--description-font-size); line-height: var(--global--line-height-body); margin-top: calc(0.666 * var(--global--spacing-vertical)); } .wp-block-latest-posts.alignfull { padding-left: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); } .entry-content [class*=inner-container] .wp-block-latest-posts.alignfull, .entry-content .has-background .wp-block-latest-posts.alignfull { padding-left: 0; padding-right: 0; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers { border-top: calc(3 * var(--separator--height)) solid var(--global--color-border); border-bottom: calc(3 * var(--separator--height)) solid var(--global--color-border); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers:not(.is-grid) > li, .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers > li { padding-bottom: var(--global--spacing-vertical); border-bottom: var(--separator--height) solid var(--global--color-border); margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers:not(.is-grid) > li:last-child, .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers > li:last-child { padding-bottom: 0; border-bottom: none; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid { box-shadow: inset 0 -1px 0 0 var(--global--color-border); border-bottom: calc(2 * var(--separator--height)) solid var(--global--color-border); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid li { margin: 0; padding-top: var(--global--spacing-vertical); padding-right: var(--global--spacing-horizontal); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid li:last-child { padding-bottom: var(--global--spacing-vertical); } @media screen and (min-width: 600px) { .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-2 li { width: calc(100% / 2); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-3 li { width: calc(100% / 3); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-4 li { width: calc(100% / 4); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-5 li { width: calc(100% / 5); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-6 li { width: calc(100% / 6); } } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders li { border: calc(3 * var(--separator--height)) solid var(--global--color-border); padding: var(--global--spacing-vertical) var(--global--spacing-horizontal); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders li:last-child { padding-bottom: var(--global--spacing-vertical); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders:not(.is-grid) li { margin-top: var(--global--spacing-horizontal); margin-bottom: var(--global--spacing-horizontal); } .gallery-item { display: inline-block; text-align: center; vertical-align: top; width: 100%; } .gallery-item a { display: block; } .gallery-item a:focus img { outline-offset: -2px; } .gallery-columns-2 .gallery-item { max-width: 50%; } .gallery-columns-3 .gallery-item { max-width: 33.33%; } .gallery-columns-4 .gallery-item { max-width: 25%; } .gallery-columns-5 .gallery-item { max-width: 20%; } .gallery-columns-6 .gallery-item { max-width: 16.66%; } .gallery-columns-7 .gallery-item { max-width: 14.28%; } .gallery-columns-8 .gallery-item { max-width: 12.5%; } .gallery-columns-9 .gallery-item { max-width: 11.11%; } .gallery-caption { display: block; } figure.wp-caption a:focus img { outline-offset: 2px; } ul, ol { font-family: var(--list--font-family); margin: 0; padding-left: calc(2 * var(--global--spacing-horizontal)); } ul.aligncenter, ol.aligncenter { list-style-position: inside; padding: 0; } ul.alignright, ol.alignright { list-style-position: inside; text-align: right; padding: 0; } ul { list-style-type: disc; } ul ul { list-style-type: circle; } ol { list-style-type: decimal; } ol ul { list-style-type: circle; } dt { font-family: var(--definition-term--font-family); font-weight: bold; } dd { margin: 0; padding-left: calc(2 * var(--global--spacing-horizontal)); } .wp-block-media-text { /** * Block Options */ } .wp-block-media-text.alignfull { margin-top: 0; margin-bottom: 0; } .wp-block-media-text a:focus img { outline-offset: -1px; } .wp-block-media-text .wp-block-media-text__content { padding: var(--global--spacing-horizontal); } @media only screen and (min-width: 592px) { .wp-block-media-text .wp-block-media-text__content { padding: var(--global--spacing-vertical); } } .wp-block-media-text .wp-block-media-text__content > * { margin-top: calc(0.666 * var(--global--spacing-vertical)); margin-bottom: calc(0.666 * var(--global--spacing-vertical)); } @media only screen and (min-width: 482px) { .wp-block-media-text .wp-block-media-text__content > * { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } } .wp-block-media-text .wp-block-media-text__content > *:first-child { margin-top: 0; } .wp-block-media-text .wp-block-media-text__content > *:last-child { margin-bottom: 0; } @media only screen and (min-width: 482px) { .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content { padding-top: var(--global--spacing-vertical); padding-bottom: var(--global--spacing-vertical); } } .wp-block-media-text.is-style-twentytwentyone-border { border: calc(3 * var(--separator--height)) solid var(--global--color-border); } .wp-block-navigation .wp-block-navigation-link { padding: 0; } .wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__content { padding: var(--primary-nav--padding); } .wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__label { font-family: var(--primary-nav--font-family); font-size: var(--primary-nav--font-size); font-weight: var(--primary-nav--font-weight); } .wp-block-navigation .wp-block-navigation-link__submenu-icon { padding: 0; } .wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation-link { display: inherit; } .wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container { border: none; left: 0; margin-left: var(--primary-nav--padding); min-width: max-content; opacity: 0; padding: 0; position: inherit; top: inherit; } .wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container .wp-block-navigation-link .wp-block-navigation-link__content { display: inline-block; padding: calc(0.5 * var(--primary-nav--padding)) var(--primary-nav--padding); } .wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container .wp-block-navigation-link__submenu-icon { display: none; } .wp-block-navigation > .wp-block-navigation__container .has-child:hover .wp-block-navigation__container, .wp-block-navigation > .wp-block-navigation__container .has-child:focus-within .wp-block-navigation__container { display: block; opacity: 1; visibility: visible; } .wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container { background: var(--global--color-background); margin: 0; padding: 0; position: absolute; top: 100%; border: 1px solid var(--primary-nav--border-color); } .wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container:before, .wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container:after { content: ""; display: block; position: absolute; width: 0; top: -10px; left: var(--global--spacing-horizontal); border-style: solid; border-color: var(--primary-nav--border-color) transparent; border-width: 0 7px 10px 7px; } .wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container:after { top: -9px; border-color: var(--global--color-background) transparent; } .wp-block-navigation:not(.has-background) .wp-block-navigation__container { background: var(--global--color-background); } .wp-block-navigation:not(.has-background) .wp-block-navigation__container .wp-block-navigation__container { background: var(--global--color-background); } .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:hover, .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:focus { color: var(--primary-nav--color-link-hover); } .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:hover { text-decoration: underline; text-decoration-style: dotted; } .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link__content { color: currentColor; } p { line-height: var(--wp--typography--line-height, var(--global--line-height-body)); } p.has-background { padding: var(--global--spacing-unit); } p.has-text-color a { color: var(--wp--style--color--link, var(--global--color-primary)); } pre.wp-block-preformatted { overflow-x: auto; white-space: pre; } .wp-block-pullquote { padding: calc(2 * var(--global--spacing-unit)) 0; text-align: center; border-width: var(--pullquote--border-width); border-bottom-style: solid; border-top-style: solid; color: currentColor; border-color: currentColor; position: relative; /** * Block Options */ } .wp-block-pullquote blockquote::before { color: currentColor; content: "“"; display: block; position: relative; left: 0; font-size: 3rem; font-weight: 500; line-height: 1; } .wp-block-pullquote p { font-family: var(--pullquote--font-family); font-size: var(--pullquote--font-size); font-style: var(--pullquote--font-style); font-weight: 700; letter-spacing: var(--pullquote--letter-spacing); line-height: var(--pullquote--line-height); margin: 0; } .wp-block-pullquote a { color: currentColor; } .wp-block-pullquote .wp-block-pullquote__citation, .wp-block-pullquote cite, .wp-block-pullquote footer { color: currentColor; display: block; font-size: var(--global--font-size-xs); font-style: var(--pullquote--font-style); text-transform: none; } .wp-block-pullquote:not(.is-style-solid-color) { background: none; } .wp-block-pullquote.alignleft:not(.is-style-solid-color) blockquote:before, .wp-block-pullquote.alignleft:not(.is-style-solid-color) cite { text-align: center; } .wp-block-pullquote.alignwide > p, .wp-block-pullquote.alignwide blockquote { max-width: var(--responsive--alignwide-width); } .wp-block-pullquote.alignfull:not(.is-style-solid-color) > p, .wp-block-pullquote.alignfull:not(.is-style-solid-color) blockquote { padding: 0 calc(2 * var(--global--spacing-unit)); } .wp-block-pullquote.is-style-solid-color { color: var(--pullquote--color-foreground); padding: calc(2.5 * var(--global--spacing-unit)); border-width: var(--pullquote--border-width); border-style: solid; border-color: var(--pullquote--border-color); } @media (min-width: 600px) { .wp-block-pullquote.is-style-solid-color { padding: calc(5 * var(--global--spacing-unit)); } } .wp-block-pullquote.is-style-solid-color blockquote::before { text-align: left; } .wp-block-pullquote.is-style-solid-color blockquote { margin: 0; max-width: inherit; } .wp-block-pullquote.is-style-solid-color blockquote p { font-size: var(--pullquote--font-size); } .wp-block-pullquote.is-style-solid-color .wp-block-pullquote__citation, .wp-block-pullquote.is-style-solid-color cite, .wp-block-pullquote.is-style-solid-color footer { color: currentColor; } .wp-block-pullquote.is-style-solid-color.alignleft, .wp-block-pullquote.is-style-solid-color.alignright { padding: var(--global--spacing-unit); } .wp-block-pullquote.is-style-solid-color.alignleft blockquote, .wp-block-pullquote.is-style-solid-color.alignright blockquote { max-width: initial; } .wp-block-query.has-background { padding: calc(0.666 * var(--global--spacing-vertical)); } @media only screen and (min-width: 482px) { .wp-block-query.has-background { padding: var(--global--spacing-vertical); } } .wp-block-quote { border-left: none; /** * Block Options */ } .wp-block-quote:before { content: "“"; font-size: var(--quote--font-size); line-height: var(--quote--line-height); left: 8px; } .has-background .wp-block-quote .wp-block-quote__citation, [class*=background-color] .wp-block-quote .wp-block-quote__citation, [style*=background-color] .wp-block-quote .wp-block-quote__citation, .wp-block-cover[style*=background-image] .wp-block-quote .wp-block-quote__citation, .has-background .wp-block-quote cite, [class*=background-color] .wp-block-quote cite, [style*=background-color] .wp-block-quote cite, .wp-block-cover[style*=background-image] .wp-block-quote cite, .has-background .wp-block-quote footer, [class*=background-color] .wp-block-quote footer, [style*=background-color] .wp-block-quote footer, .wp-block-cover[style*=background-image] .wp-block-quote footer { color: currentColor; } .wp-block-quote.has-text-align-right { margin: var(--global--spacing-vertical) var(--global--spacing-horizontal) var(--global--spacing-vertical) auto; padding-right: 0; border-right: none; } .wp-block-quote.has-text-align-right:before { display: none; } .wp-block-quote.has-text-align-right p:before { content: "”"; font-size: var(--quote--font-size); font-weight: normal; line-height: var(--quote--line-height); margin-right: 5px; } .wp-block-quote.has-text-align-center { margin: var(--global--spacing-vertical) auto; } .wp-block-quote.has-text-align-center:before { display: none; } .wp-block-quote.is-large, .wp-block-quote.is-style-large { padding-left: 0; padding-right: 0; /* Resetting margins to match _block-container.scss */ margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } .wp-block-quote.is-large p, .wp-block-quote.is-style-large p { font-size: var(--quote--font-size-large); font-style: var(--quote--font-style-large); line-height: var(--quote--line-height-large); } .wp-block-quote.is-large:before, .wp-block-quote.is-style-large:before { font-size: var(--quote--font-size-large); line-height: var(--quote--line-height-large); left: calc(-1 * var(--global--spacing-horizontal)); } .wp-block-quote.is-large.has-text-align-right:before, .wp-block-quote.is-style-large.has-text-align-right:before { display: none; } .wp-block-quote.is-large.has-text-align-right p:before, .wp-block-quote.is-style-large.has-text-align-right p:before { content: "”"; font-size: var(--quote--font-size-large); font-weight: normal; line-height: var(--quote--line-height-large); margin-right: 10px; } .wp-block-quote.is-large .wp-block-quote__citation, .wp-block-quote.is-large cite, .wp-block-quote.is-large footer, .wp-block-quote.is-style-large .wp-block-quote__citation, .wp-block-quote.is-style-large cite, .wp-block-quote.is-style-large footer { color: var(--global--color-primary); font-size: var(--global--font-size-sm); } @media only screen and (max-width: 481px) { .wp-block-quote.is-large, .wp-block-quote.is-style-large { padding-left: var(--global--spacing-horizontal); } .wp-block-quote.is-large:before, .wp-block-quote.is-style-large:before { left: 0; } .wp-block-quote.is-large.has-text-align-right, .wp-block-quote.is-style-large.has-text-align-right { padding-left: 0; padding-right: var(--global--spacing-horizontal); } .wp-block-quote.is-large.has-text-align-right:before, .wp-block-quote.is-style-large.has-text-align-right:before { right: 0; } .wp-block-quote.is-large.has-text-align-center, .wp-block-quote.is-style-large.has-text-align-center { padding-left: 0; padding-right: 0; } } @media only screen and (max-width: 481px) { .wp-block-quote.has-text-align-right { padding-left: 0; padding-right: calc(0.5 * var(--global--spacing-horizontal)); } .wp-block-quote.has-text-align-right:before { right: 0; } .wp-block-quote.has-text-align-center { padding-left: 0; padding-right: 0; } } .wp-block-rss { padding-left: 0; } .wp-block-rss > li { list-style: none; } .wp-block-rss:not(.is-grid) > li { margin-top: calc(1.666 * var(--global--spacing-vertical)); margin-bottom: calc(1.666 * var(--global--spacing-vertical)); } .wp-block-rss:not(.is-grid) > li:first-child { margin-top: 0; } .wp-block-rss:not(.is-grid) > li:last-child { margin-bottom: 0; } .wp-block-rss.is-grid > li { margin-bottom: var(--global--spacing-vertical); } .wp-block-rss.is-grid > li:last-child { margin-bottom: 0; } .wp-block-rss.is-grid.columns-2 > li:nth-last-child(-n+2):nth-child(2n+1), .wp-block-rss.is-grid.columns-2 > li:nth-last-child(-n+2):nth-child(2n+1) ~ li, .wp-block-rss.is-grid.columns-3 > li:nth-last-child(-n+3):nth-child(3n+1), .wp-block-rss.is-grid.columns-3 > li:nth-last-child(-n+3):nth-child(3n+1) ~ li, .wp-block-rss.is-grid.columns-4 > li:nth-last-child(-n+4):nth-child(4n+1), .wp-block-rss.is-grid.columns-4 > li:nth-last-child(-n+4):nth-child(4n+1) ~ li, .wp-block-rss.is-grid.columns-5 > li:nth-last-child(-n+5):nth-child(5n+1), .wp-block-rss.is-grid.columns-5 > li:nth-last-child(-n+5):nth-child(5n+1) ~ li, .wp-block-rss.is-grid.columns-6 > li:nth-last-child(-n+6):nth-child(6n+1), .wp-block-rss.is-grid.columns-6 > li:nth-last-child(-n+6):nth-child(6n+1) ~ li { margin-bottom: 0; } .wp-block-rss > li > * { margin-top: calc(0.333 * var(--global--spacing-vertical)); margin-bottom: calc(0.333 * var(--global--spacing-vertical)); } .wp-block-rss > li > *:first-child { margin-top: 0; } .wp-block-rss > li > *:last-child { margin-bottom: 0; } .wp-block-rss .wp-block-rss__item-title > a { display: inline-block; font-family: var(--latest-posts--title-font-family); font-size: var(--latest-posts--title-font-size); font-weight: var(--heading--font-weight); line-height: var(--global--line-height-heading); margin-bottom: calc(0.333 * var(--global--spacing-vertical)); } .wp-block-rss .wp-block-rss__item-author { color: var(--global--color-primary); font-size: var(--global--font-size-md); line-height: var(--global--line-height-body); } .wp-block-rss .wp-block-rss__item-publish-date { color: var(--global--color-primary); font-size: var(--global--font-size-xs); line-height: var(--global--line-height-body); } [class*=inner-container] .wp-block-rss .wp-block-rss__item-publish-date, .has-background .wp-block-rss .wp-block-rss__item-publish-date { color: currentColor; } .wp-block-rss .wp-block-rss__item-excerpt, .wp-block-rss .wp-block-rss__item-full-content { font-family: var(--latest-posts--description-font-family); font-size: var(--latest-posts--description-font-size); line-height: var(--global--line-height-body); margin-top: calc(0.666 * var(--global--spacing-vertical)); } .wp-block-rss.alignfull { padding-left: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); } .entry-content [class*=inner-container] .wp-block-rss.alignfull, .entry-content .has-background .wp-block-rss.alignfull { padding-left: 0; padding-right: 0; } .wp-block-search { max-width: var(--responsive--aligndefault-width); } .wp-block-search__button-only.aligncenter .wp-block-search__inside-wrapper { justify-content: center; } .wp-block-search .wp-block-search__label { font-size: var(--form--font-size); font-weight: var(--form--label-weight); margin-bottom: calc(var(--global--spacing-vertical) / 3); } .wp-block-search .wp-block-search__input { border: var(--form--border-width) solid var(--form--border-color); border-radius: var(--form--border-radius); color: var(--form--color-text); line-height: var(--form--line-height); max-width: inherit; margin-right: calc(-1 * var(--button--border-width)); padding: var(--form--spacing-unit); } .wp-block-search .wp-block-search__input:focus { color: var(--form--color-text); border-color: var(--form--border-color); } .has-background .wp-block-search .wp-block-search__input { border-color: var(--local--color-primary, var(--global--color-primary)) !important; } .wp-block-search button.wp-block-search__button { margin-left: 0; line-height: 1; } .wp-block-search button.wp-block-search__button.has-icon { padding: 6px calc(0.5 * var(--button--padding-horizontal)); } .wp-block-search button.wp-block-search__button.has-icon svg { width: 40px; height: 40px; fill: currentColor; } .has-background .wp-block-search button.wp-block-search__button:hover, .has-background .wp-block-search button.wp-block-search__button:active { background-color: var(--local--color-background, var(--global--color-background)) !important; color: var(--local--color-primary, var(--global--color-primary)) !important; } .has-text-color .wp-block-search button.wp-block-search__button:hover, .has-text-color .wp-block-search button.wp-block-search__button:active { color: var(--local--color-primary, var(--global--color-primary)) !important; } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper { background-color: var(--global--color-white); border: var(--form--border-width) solid var(--form--border-color); border-radius: var(--form--border-radius); padding: var(--form--border-width); } .has-background .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper { border-color: var(--local--color-primary, var(--global--color-primary)) !important; } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input { margin-left: 0; margin-right: 0; padding-left: var(--form--spacing-unit); } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input:focus { color: var(--form--color-text); outline-offset: -2px; outline: 2px dotted var(--form--border-color); } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper button.wp-block-search__button { padding: var(--button--padding-vertical) var(--button--padding-horizontal); } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper button.wp-block-search__button:hover { color: var(--global--color-dark-gray); } .is-dark-theme .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper button.wp-block-search__button { color: var(--global--color-dark-gray); } .is-dark-theme .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper button.wp-block-search__button:hover { background-color: var(--global--color-dark-gray); color: var(--global--color-white); } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper button.wp-block-search__button.has-icon { padding: 6px calc(0.5 * var(--button--padding-horizontal)); } .wp-block-search__button { box-shadow: none; } hr { border-style: none; border-bottom: var(--separator--height) solid var(--separator--border-color); clear: both; margin-left: auto; margin-right: auto; } hr.wp-block-separator { border-bottom: var(--separator--height) solid var(--separator--border-color); opacity: 1; /** * Block Options */ } hr.wp-block-separator:not(.is-style-dots):not(.alignwide) { max-width: var(--responsive--aligndefault-width); } hr.wp-block-separator:not(.is-style-dots).alignwide { max-width: var(--responsive--alignwide-width); } hr.wp-block-separator:not(.is-style-dots).alignfull { max-width: var(--responsive--alignfull-width); } hr.wp-block-separator.is-style-twentytwentyone-separator-thick { border-bottom-width: calc(3 * var(--separator--height)); } hr.wp-block-separator.is-style-dots.has-background, hr.wp-block-separator.is-style-dots.has-text-color { background-color: transparent !important; } hr.wp-block-separator.is-style-dots.has-background:before, hr.wp-block-separator.is-style-dots.has-text-color:before { color: currentColor !important; } hr.wp-block-separator.is-style-dots:before { color: var(--separator--border-color); font-size: var(--global--font-size-xl); letter-spacing: var(--global--font-size-sm); padding-left: var(--global--font-size-sm); } .has-background hr.wp-block-separator, [class*=background-color] hr.wp-block-separator, [style*=background-color] hr.wp-block-separator, .wp-block-cover[style*=background-image] hr.wp-block-separator { border-color: currentColor; } .wp-block-social-links a:focus { color: var(--global--color-primary); } .wp-block-social-links.is-style-twentytwentyone-social-icons-color a { color: var(--global--color-primary); } .wp-block-social-links.is-style-twentytwentyone-social-icons-color .wp-social-link, .wp-block-social-links.is-style-twentytwentyone-social-icons-color.has-icon-background-color.has-icon-background-color .wp-social-link { background: none; } .wp-block-spacer { display: block; margin-bottom: 0 !important; margin-top: 0 !important; } @media only screen and (max-width: 481px) { .wp-block-spacer[style] { height: var(--global--spacing-unit) !important; } } table, .wp-block-table { width: 100%; min-width: 240px; border-collapse: collapse; } table thead, table tfoot, .wp-block-table thead, .wp-block-table tfoot { text-align: center; } table th, .wp-block-table th { font-family: var(--heading--font-family); } table td, table th, .wp-block-table td, .wp-block-table th { padding: calc(0.5 * var(--global--spacing-unit)); border: 1px solid; } table figcaption, .wp-block-table figcaption { color: var(--global--color-primary); font-size: var(--global--font-size-xs); } table.is-style-regular .has-background, table.is-style-stripes .has-background, table.is-style-stripes .has-background thead tr, table.is-style-stripes .has-background tfoot tr, table.is-style-stripes .has-background tbody tr, .wp-block-table.is-style-regular .has-background, .wp-block-table.is-style-stripes .has-background, .wp-block-table.is-style-stripes .has-background thead tr, .wp-block-table.is-style-stripes .has-background tfoot tr, .wp-block-table.is-style-stripes .has-background tbody tr { color: var(--table--has-background-text-color); } table.is-style-stripes, .wp-block-table.is-style-stripes { border-color: var(--table--stripes-border-color); } table.is-style-stripes th, table.is-style-stripes td, .wp-block-table.is-style-stripes th, .wp-block-table.is-style-stripes td { border-width: 0; } table.is-style-stripes tbody tr:nth-child(odd), .wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background-color: var(--table--stripes-background-color); } table.is-style-stripes .has-background tbody tr:nth-child(odd), .wp-block-table.is-style-stripes .has-background tbody tr:nth-child(odd) { background-color: var(--global--color-white-90); } table.wp-calendar-table td, table.wp-calendar-table th { background: transparent; border: 0; text-align: center; line-height: 2; vertical-align: middle; word-break: normal; } table.wp-calendar-table th { font-weight: bold; } table.wp-calendar-table thead, table.wp-calendar-table tbody { color: currentColor; border: 1px solid; } table.wp-calendar-table caption { font-weight: bold; text-align: left; margin-bottom: var(--global--spacing-unit); color: currentColor; } .wp-calendar-nav { text-align: left; margin-top: calc(var(--global--spacing-unit) / 2); } .wp-calendar-nav svg { height: 1em; vertical-align: middle; } .wp-calendar-nav svg path { fill: currentColor; } .wp-calendar-nav .wp-calendar-nav-next { float: right; } .wp-block-tag-cloud.alignfull { padding-left: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); } .wp-block-verse { font-family: var(--entry-content--font-family); } .wp-block-video figcaption { color: var(--global--color-primary); font-size: var(--global--font-size-xs); margin-top: calc(0.5 * var(--global--spacing-unit)); margin-bottom: var(--global--spacing-unit); text-align: center; } * > figure > video { max-width: unset; width: 100%; vertical-align: middle; } :root .is-extra-small-text, :root .has-extra-small-font-size { font-size: var(--global--font-size-xs); } :root .is-small-text, :root .has-small-font-size { font-size: var(--global--font-size-sm); } :root .is-regular-text, :root .has-regular-font-size, :root .is-normal-font-size, :root .has-normal-font-size, :root .has-medium-font-size { font-size: var(--global--font-size-base); } :root .is-large-text, :root .has-large-font-size { font-size: var(--global--font-size-lg); line-height: var(--global--line-height-heading); } :root .is-larger-text, :root .has-larger-font-size, :root .is-extra-large-text, :root .has-extra-large-font-size { font-size: var(--global--font-size-xl); line-height: var(--global--line-height-heading); } :root .is-huge-text, :root .has-huge-font-size { font-size: var(--global--font-size-xxl); line-height: var(--global--line-height-heading); font-weight: var(--heading--font-weight-page-title); } :root .is-gigantic-text, :root .has-gigantic-font-size { font-size: var(--global--font-size-xxxl); line-height: var(--global--line-height-heading); font-weight: var(--heading--font-weight-page-title); } /* Block Alignments */ /** * These selectors set the default max width for content appearing inside a post or page. */ /** * .alignleft */ .alignleft { /*rtl:ignore*/ text-align: left; margin-top: 0; } .entry-content > .alignleft { max-width: var(--responsive--aligndefault-width); } @media only screen and (min-width: 482px) { .alignleft { /*rtl:ignore*/ float: left; /*rtl:ignore*/ margin-right: var(--global--spacing-horizontal); margin-bottom: var(--global--spacing-vertical); } .entry-content > .alignleft { max-width: calc(50% - var(--responsive--alignleft-margin)); } } /** * .aligncenter */ .aligncenter { clear: both; display: block; float: none; margin-right: auto; margin-left: auto; text-align: center; } /** * .alignright */ .alignright { margin-top: 0; margin-bottom: var(--global--spacing-vertical); } .entry-content > .alignright { max-width: var(--responsive--aligndefault-width); } @media only screen and (min-width: 482px) { .alignright { /*rtl:ignore*/ float: right; /*rtl:ignore*/ margin-left: var(--global--spacing-horizontal); } .entry-content > .alignright { max-width: calc(50% - var(--responsive--alignright-margin)); } } [class*=inner-container] > .alignleft + *, [class*=inner-container] > .alignright + * { margin-top: 0; } /** * .alignwide */ .alignwide { clear: both; } /** * .alignfull */ .alignfull { clear: both; } .has-left-content { justify-content: flex-start; } .has-right-content { justify-content: flex-end; } .has-parallax { background-attachment: fixed; } .has-drop-cap:not(:focus)::first-letter { font-family: var(--heading--font-family); font-weight: var(--heading--font-weight); line-height: 0.66; text-transform: uppercase; font-style: normal; float: left; margin: 0.1em 0.1em 0 0; font-size: calc(1.2 * var(--heading--font-size-h1)); } .has-drop-cap:not(:focus)::after { content: ""; display: table; clear: both; padding-top: 14px; } .desktop-only { display: none; } @media only screen and (min-width: 482px) { .desktop-only { display: block; } } /* Category 06 contains all "bigger" components which contain elements of the previous two categories like header, footer, page template, single template, comments section, archives, ... */ .site-header { display: flex; align-items: flex-start; flex-wrap: wrap; row-gap: var(--global--spacing-vertical); } .wp-custom-logo .site-header { align-items: center; } @media only screen and (min-width: 482px) { .site-header { padding-top: calc(var(--global--spacing-vertical) / 0.75); } } @media only screen and (min-width: 822px) { .site-header { padding-top: calc(2.4 * var(--global--spacing-vertical)); } } .site-branding { color: var(--branding--color-text); margin-right: 140px; } .site-branding:last-child { margin-right: 0; width: 100%; text-align: center; } @media only screen and (min-width: 482px) { .site-branding { margin-right: initial; margin-top: 4px; } } .site-title { color: var(--branding--color-link); font-family: var(--branding--title--font-family); font-size: var(--branding--title--font-size-mobile); letter-spacing: normal; text-transform: var(--branding--title--text-transform); line-height: var(--global--line-height-heading); margin-bottom: calc(var(--global--spacing-vertical) / 6); } .site-title a { color: currentColor; font-weight: var(--branding--title--font-weight); } .site-title a:link, .site-title a:visited, .site-title a:active { color: currentColor; } .site-title a:hover, .site-title a:focus { color: var(--branding--color-link-hover); } @media only screen and (min-width: 482px) { .site-title { font-size: var(--branding--title--font-size); } } .site-description { color: currentColor; font-family: var(--branding--description--font-family); font-size: var(--branding--description--font-size); line-height: 1.4; } .site-title > a { text-decoration-color: var(--global--color-secondary); } .site-logo { margin: calc(var(--global--spacing-vertical) / 2) 0; } .site-header > .site-logo { width: 100%; padding-bottom: calc(var(--global--spacing-vertical) * 1.5); border-bottom: 1px solid; text-align: center; } .site-logo .custom-logo { margin-left: auto; margin-right: auto; max-width: var(--branding--logo--max-width-mobile); max-height: var(--branding--logo--max-height-mobile); height: auto; display: inline-block; width: auto; } @media only screen and (min-width: 482px) { .site-logo .custom-logo { max-width: var(--branding--logo--max-width); max-height: var(--branding--logo--max-height); height: auto; width: auto; } } @media only screen and (max-width: 481px) { .site-header.has-logo:not(.has-title-and-tagline).has-menu .site-logo { position: absolute; padding-top: calc(0.5 * var(--global--spacing-vertical)); margin-top: 0; top: var(--global--admin-bar--height); } .primary-navigation-open .site-header.has-logo:not(.has-title-and-tagline).has-menu .site-logo { display: none; } .site-header.has-logo:not(.has-title-and-tagline).has-menu .site-logo img { max-height: calc(var(--button--padding-vertical) - 0.25 * var(--global--spacing-unit) + 1.7em); } .site-header.has-logo.has-title-and-tagline { align-items: flex-start; } .site-header.has-logo.has-title-and-tagline.has-menu { justify-content: space-between; } .site-header.has-logo.has-title-and-tagline.has-menu .site-branding { max-width: calc(100% - 160px); } .site-header.has-logo.has-title-and-tagline .site-branding { margin-right: 0; } body:not(.primary-navigation-open) .site-header.has-logo.has-title-and-tagline:after { display: none; } body:not(.primary-navigation-open) .site-header.has-logo.has-title-and-tagline .primary-navigation { position: relative; top: 0; } body:not(.primary-navigation-open) .site-header.has-logo.has-title-and-tagline .menu-button-container { position: relative; padding-top: 0; margin-top: calc(0px - var(--button--padding-vertical) + 0.25 * var(--global--spacing-unit)); } body:not(.primary-navigation-open) .site-header.has-logo.has-title-and-tagline .menu-button-container #primary-mobile-menu { padding-left: calc(var(--global--spacing-horizontal) * 0.6 - 4.5px); padding-right: calc(var(--global--spacing-horizontal) * 0.6 - 4.5px); margin-right: calc(0px - var(--global--spacing-horizontal) * 0.6); } .site-header:not(.has-logo).has-title-and-tagline .site-branding { margin-right: 0; max-width: calc(100% - 160px); } .site-header:not(.has-menu) { justify-content: center; } } .site-footer { padding-top: 0; padding-bottom: calc(1.7 * var(--global--spacing-vertical)); } .no-widgets .site-footer { margin-top: calc(6 * var(--global--spacing-vertical)); } @media only screen and (max-width: 481px) { .no-widgets .site-footer { margin-top: calc(3 * var(--global--spacing-vertical)); } } .site-footer > .site-info { padding-top: var(--global--spacing-vertical); color: var(--footer--color-text); font-family: var(--footer--font-family); font-size: var(--footer--font-size); line-height: var(--global--line-height-body); border-top: 3px solid var(--global--color-border); } .site-footer > .site-info .site-name { text-transform: var(--branding--title--text-transform); font-size: var(--branding--title--font-size); } .site-footer > .site-info .privacy-policy, .site-footer > .site-info .powered-by { margin-top: calc(0.5 * var(--global--spacing-vertical)); } @media only screen and (min-width: 822px) { .site-footer > .site-info { display: flex; align-items: center; } .site-footer > .site-info .site-name { margin-right: calc(0.5 * var(--global--spacing-vertical)); } .site-footer > .site-info .privacy-policy, .site-footer > .site-info .powered-by { margin-top: initial; margin-left: auto; } .site-footer > .site-info .privacy-policy + .powered-by { margin-left: calc(0.5 * var(--global--spacing-vertical)); } } .site-footer > .site-info a { color: var(--footer--color-link); } .site-footer > .site-info a:link, .site-footer > .site-info a:visited, .site-footer > .site-info a:active { color: var(--footer--color-link); } .site-footer > .site-info a:hover { color: var(--footer--color-link-hover); } .site-footer > .site-info a:focus { color: var(--footer--color-link-hover); } .is-dark-theme .site-footer > .site-info a:focus { color: var(--wp--style--color--link, var(--global--color-background)); } .has-background-white .site-footer > .site-info a:focus { color: var(--wp--style--color--link, var(--global--color-white)); } .singular .entry-header { border-bottom: 3px solid var(--global--color-border); padding-bottom: calc(2 * var(--global--spacing-vertical)); margin-bottom: calc(3 * var(--global--spacing-vertical)); } .home .entry-header { border-bottom: none; padding-bottom: 0; margin-bottom: 0; } .singular .has-post-thumbnail .entry-header { border-bottom: none; padding-bottom: calc(1.3 * var(--global--spacing-vertical)); margin-bottom: 0; } .no-results.not-found > *:first-child { margin-bottom: calc(3 * var(--global--spacing-vertical)); } .page-links { clear: both; } .page-links .post-page-numbers { display: inline-block; margin-left: calc(0.66 * var(--global--spacing-unit)); margin-right: calc(0.66 * var(--global--spacing-unit)); min-width: 44px; min-height: 44px; } .page-links .post-page-numbers:first-child { margin-left: 0; } .entry-title { color: var(--entry-header--color); font-size: var(--entry-header--font-size); letter-spacing: var(--heading--letter-spacing-h2); line-height: var(--heading--line-height-h2); overflow-wrap: break-word; } .entry-title a { color: var(--entry-header--color-link); text-underline-offset: 0.15em; } .entry-title a:hover { color: var(--entry-header--color-hover); } .entry-title a:focus { color: var(--entry-header--color-focus); } .entry-title a:active { color: var(--entry-header--color-link); } .singular .entry-title { font-size: var(--global--font-size-page-title); } h1.entry-title { line-height: var(--heading--line-height-h1); font-weight: var(--heading--font-weight-page-title); } /** * Entry Content */ .entry-content, .entry-summary { font-family: var(--entry-content--font-family); } .entry-content p { word-wrap: break-word; } .entry-content > iframe[style] { margin: var(--global--spacing-vertical) 0 !important; max-width: 100% !important; } .entry-footer { color: var(--global--color-primary); clear: both; float: none; font-size: var(--global--font-size-xs); display: block; } .entry-footer > span { display: inline-block; } .entry-footer a { color: currentColor; } .entry-footer a:hover, .entry-footer a:focus { color: var(--global--color-primary-hover); } .entry-footer a:active { color: currentColor; } .site-main > article > .entry-footer { margin-top: var(--global--spacing-vertical); padding-top: var(--global--spacing-unit); padding-bottom: calc(3 * var(--global--spacing-vertical)); border-bottom: var(--separator--height) solid var(--separator--border-color); } body:not(.single) .site-main > article:last-of-type .entry-footer { border-bottom: var(--separator--height) solid transparent; } .single .site-main > article > .entry-footer { margin-top: calc(3.4 * var(--global--spacing-vertical)); margin-bottom: calc(3.4 * var(--global--spacing-vertical)); padding-bottom: 0; padding-top: calc(0.8 * var(--global--spacing-vertical)); border-top: 3px solid var(--separator--border-color); border-bottom: var(--separator--height) solid transparent; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: calc(2 * var(--global--spacing-horizontal)); } .single .site-main > article > .entry-footer .post-taxonomies, .single .site-main > article > .entry-footer .full-size-link { justify-content: flex-end; text-align: right; } .single .site-main > article > .entry-footer .full-size-link:first-child:last-child { grid-column: span 2; } .single .site-main > article > .entry-footer .posted-on, .single .site-main > article > .entry-footer .byline, .single .site-main > article > .entry-footer .cat-links, .single .site-main > article > .entry-footer .tags-links { display: block; } @media only screen and (max-width: 481px) { .single .site-main > article > .entry-footer { display: block; } .single .site-main > article > .entry-footer .full-size-link { display: block; } .single .site-main > article > .entry-footer .post-taxonomies, .single .site-main > article > .entry-footer .full-size-link { text-align: left; } } /** * Post Thumbnails */ .post-thumbnail { text-align: center; } .post-thumbnail .wp-post-image { display: block; width: auto; max-width: 100%; margin-left: auto; margin-right: auto; margin-top: calc(2 * var(--global--spacing-vertical)); } /** * Author */ .author-bio { position: relative; font-size: var(--global--font-size-xs); max-width: var(--responsive--aligndefault-width); } .site-main > article > .author-bio { margin-top: calc(2 * var(--global--spacing-vertical)); } .author-bio.show-avatars .avatar { display: inline-block; vertical-align: top; border-radius: 50%; } .author-bio.show-avatars .author-bio-content { display: inline-block; padding-left: var(--global--spacing-horizontal); max-width: calc(var(--responsive--aligndefault-width) - 90px); } .author-bio .author-bio-content .author-title { font-family: var(--entry-author-bio--font-family); font-size: var(--entry-author-bio--font-size); display: inline; } .author-bio .author-bio-content .author-description { font-size: var(--global--font-size-xs); margin-top: calc(0.5 * var(--global--spacing-vertical)); margin-bottom: calc(0.5 * var(--global--spacing-vertical)); } .page-title { font-size: var(--global--font-size-page-title); } h1.page-title, h2.page-title { font-weight: var(--heading--font-weight-page-title); } h1.page-title { line-height: var(--heading--line-height-h1); } .page-header { border-bottom: 3px solid var(--global--color-border); padding-bottom: calc(2 * var(--global--spacing-vertical)); } .archive .content-area .format-aside .entry-content, .archive .content-area .format-status .entry-content, .archive .content-area .format-link .entry-content, .search .content-area .format-aside .entry-content, .search .content-area .format-status .entry-content, .search .content-area .format-link .entry-content, .blog .content-area .format-aside .entry-content, .blog .content-area .format-status .entry-content, .blog .content-area .format-link .entry-content { font-size: var(--global--font-size-lg); } .archive .format-image .entry-content, .archive .format-gallery .entry-content, .archive .format-video .entry-content, .search .format-image .entry-content, .search .format-gallery .entry-content, .search .format-video .entry-content, .blog .format-image .entry-content, .blog .format-gallery .entry-content, .blog .format-video .entry-content { margin-top: calc(2 * var(--global--spacing-vertical)); } .archive .entry-footer .cat-links, .archive .entry-footer .tags-links, .search .entry-footer .cat-links, .search .entry-footer .tags-links, .blog .entry-footer .cat-links, .blog .entry-footer .tags-links { display: block; } .archive.logged-in .entry-footer .posted-on, .search.logged-in .entry-footer .posted-on, .blog.logged-in .entry-footer .posted-on { margin-right: calc(0.5 * var(--global--spacing-unit)); } .archive-description { margin-top: var(--global--spacing-vertical); font-size: var(--global--font-size-xl); line-height: var(--global--line-height-heading); } .error404 main p { font-size: var(--global--font-size-lg); margin-bottom: calc(var(--global--spacing-vertical) * 1.6666666667); } .search-no-results .page-content { margin-top: calc(3 * var(--global--spacing-vertical)); } /** * Comments Wrapper */ .comments-area > * { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } .comments-area > *:first-child { margin-top: 0; } .comments-area > *:last-child { margin-bottom: 0; } .comments-area.show-avatars .avatar { border-radius: 50%; position: absolute; top: 10px; } .comments-area.show-avatars .fn { display: inline-block; padding-left: 85px; } .comments-area.show-avatars .comment-metadata { padding: 8px 0 9px 85px; } /** * Comment Title */ .comments-title, .comment-reply-title { font-size: var(--heading--font-size-h2); letter-spacing: var(--heading--letter-spacing-h2); } .comment-reply-title { display: flex; justify-content: space-between; } .comment-reply-title small a { font-family: var(--global--font-secondary); font-size: var(--global--font-size-xs); font-style: normal; font-weight: normal; letter-spacing: normal; } /* Nested comment reply title*/ .comment .comment-respond .comment-reply-title { font-size: var(--global--font-size-lg); } /** * Comment Lists */ .comment-list { padding-left: 0; list-style: none; } .comment-list > li { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } .comment-list .children { list-style: none; padding-left: 0; } .comment-list .children > li { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } @media only screen and (min-width: 482px) { .comment-list .depth-2, .comment-list .depth-3 { padding-left: calc(4 * var(--global--spacing-horizontal)); } } /** * Comment Meta */ .comment-meta .comment-author { line-height: var(--global--line-height-heading); margin-bottom: calc(0.25 * var(--global--spacing-unit)); } @media only screen and (min-width: 482px) { .comment-meta .comment-author { margin-bottom: 0; padding-right: 0; } } .comment-meta .comment-author .fn { font-family: var(--global--font-secondary); font-weight: normal; font-size: var(--global--font-size-lg); hyphens: auto; word-wrap: break-word; word-break: break-word; } .comment-meta .comment-metadata { color: var(--global--color-primary); font-size: var(--global--font-size-xs); padding: 8px 0 9px 0; } .comment-meta .comment-metadata .edit-link { margin-left: var(--global--spacing-horizontal); } @media only screen and (min-width: 482px) { .comment-meta { margin-right: inherit; } .comment-meta .comment-author { max-width: inherit; } } .reply { font-size: var(--global--font-size-sm); line-height: var(--global--line-height-heading); } .bypostauthor { display: block; } .says { display: none; } .pingback .url, .trackback .url { font-family: var(--global--font-primary); } .comment-body { position: relative; margin-bottom: calc(1.7 * var(--global--spacing-vertical)); } .comment-body > * { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } .comment-body .reply { margin: 0; } .comment-content { word-wrap: break-word; } .pingback .comment-body, .trackback .comment-body { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } .comment-respond { margin-top: var(--global--spacing-vertical); } .comment-respond > * { margin-top: var(--global--spacing-unit); margin-bottom: var(--global--spacing-unit); } .comment-respond > *:first-child { margin-top: 0; } .comment-respond > *:last-child { margin-bottom: 0; } .comment-respond > *:last-child.comment-form { margin-bottom: var(--global--spacing-vertical); } .comment-author { padding-top: 3px; } .comment-author .url { color: currentColor; } .comment-form { display: flex; flex-wrap: wrap; } .comment-form > * { flex-basis: 100%; } .comment-form .comment-notes { font-size: var(--global--font-size-sm); } .comment-form .comment-form-url, .comment-form .comment-form-comment { width: 100%; } .comment-form .comment-form-author, .comment-form .comment-form-email { flex-basis: 0; flex-grow: 1; } @media only screen and (max-width: 481px) { .comment-form .comment-form-author, .comment-form .comment-form-email { flex-basis: 100%; } } .comment-form .comment-form-cookies-consent > label, .comment-form .comment-notes { font-size: var(--global--font-size-xs); font-weight: normal; } .comment-form > p { margin-bottom: var(--global--spacing-unit); } .comment-form > p:first-of-type { margin-top: 0; } .comment-form > p:last-of-type { margin-bottom: 0; } .comment-form > p label, .comment-form > p input[type=email], .comment-form > p input[type=text], .comment-form > p input[type=url], .comment-form > p textarea { display: block; font-size: var(--global--font-size-sm); margin-bottom: calc(0.5 * var(--global--spacing-unit)); width: 100%; font-weight: var(--form--label-weight); } .comment-form > p.comment-form-cookies-consent { display: flex; } @media only screen and (min-width: 482px) { .comment-form > p.comment-form-author { margin-right: calc(1.5 * var(--global--spacing-horizontal)); } .comment-form > p.comment-notes, .comment-form > p.logged-in-as { display: block; } } .menu-button-container { display: none; justify-content: space-between; position: absolute; right: 0; padding-top: calc(0.5 * var(--global--spacing-vertical)); padding-bottom: calc(0.25 * var(--global--spacing-vertical)); } @media only screen and (max-width: 481px) { .menu-button-container { display: flex; } } .menu-button-container #primary-mobile-menu { display: flex; margin-left: auto; padding: calc(var(--button--padding-vertical) - 0.25 * var(--global--spacing-unit)) calc(0.5 * var(--button--padding-horizontal)); font-size: var(--primary-nav--font-size-button); font-weight: var(--primary-nav--font-weight-button); background-color: transparent; border: none; color: var(--primary-nav--color-link); } .menu-button-container #primary-mobile-menu .dropdown-icon { display: flex; align-items: center; } .menu-button-container #primary-mobile-menu .dropdown-icon .svg-icon { margin-left: calc(0.25 * var(--global--spacing-unit)); } .menu-button-container #primary-mobile-menu .dropdown-icon.open .svg-icon { position: relative; top: -1px; } .menu-button-container #primary-mobile-menu .dropdown-icon.close { display: none; } .menu-button-container #primary-mobile-menu[aria-expanded*=true] .dropdown-icon.open { display: none; } .menu-button-container #primary-mobile-menu[aria-expanded*=true] .dropdown-icon.close { display: flex; } .has-logo.has-title-and-tagline .menu-button-container #primary-mobile-menu[aria-expanded*=true] .dropdown-icon.close { animation-name: twentytwentyone-close-button-transition; animation-duration: 0.3s; } .primary-navigation-open .menu-button-container { width: 100%; z-index: 500; background-color: var(--global--color-background); } .primary-navigation-open .menu-button-container #primary-mobile-menu { position: static; } .primary-navigation { position: absolute; top: var(--global--admin-bar--height); right: 0; color: var(--primary-nav--color-text); font-size: var(--primary-nav--font-size); line-height: 1.15; margin-top: 0; margin-bottom: 0; } .primary-navigation > .primary-menu-container { position: fixed; visibility: hidden; opacity: 0; top: 0; right: 0; bottom: 0; left: 0; padding-top: calc(var(--button--line-height) * var(--primary-nav--font-size-button) + 42px + 5px); padding-left: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); padding-bottom: var(--global--spacing-horizontal); background-color: var(--global--color-background); transform: translateY(var(--global--spacing-vertical)); } @media (prefers-reduced-motion: no-preference) { .primary-navigation > .primary-menu-container { transition: all 0.15s ease-in-out; } } @media only screen and (max-width: 481px) { .primary-navigation > .primary-menu-container { height: 100vh; z-index: 499; overflow-x: hidden; overflow-y: auto; border: 2px solid transparent; } .has-logo.has-title-and-tagline .primary-navigation > .primary-menu-container { position: fixed; transform: translateY(0) translateX(100%); } .admin-bar .has-logo.has-title-and-tagline .primary-navigation > .primary-menu-container { top: var(--global--admin-bar--height); } .admin-bar .primary-navigation > .primary-menu-container { height: calc(100vh - var(--global--admin-bar--height)); } .primary-navigation > .primary-menu-container:focus { border: 2px solid var(--global--color-primary); } } @media only screen and (max-width: 481px) { .primary-navigation-open .primary-navigation { width: 100%; position: fixed; z-index: 2; } } .primary-navigation-open .primary-navigation > .primary-menu-container { position: absolute; visibility: visible; opacity: 1; transform: translateY(0); } @media only screen and (max-width: 481px) { .primary-navigation-open .has-logo.has-title-and-tagline .primary-navigation > .primary-menu-container { transform: translateX(0) translateY(0); } } @media only screen and (min-width: 482px) { .primary-navigation { position: relative; margin-left: auto; } .primary-navigation > .primary-menu-container { visibility: visible; opacity: 1; position: relative; padding: 0; background-color: transparent; overflow: initial; transform: none; } .primary-navigation #toggle-menu { display: none; } .primary-navigation > .primary-menu-container ul > li .sub-menu-toggle[aria-expanded=false] ~ ul { display: none; } .admin-bar .primary-navigation { top: initial; } .admin-bar .primary-navigation > .primary-menu-container { top: initial; } } .primary-navigation > div > .menu-wrapper { display: flex; justify-content: flex-start; flex-wrap: wrap; list-style: none; margin: 0; max-width: none; padding-left: 0; position: relative; } @media only screen and (max-width: 481px) { .primary-navigation > div > .menu-wrapper { padding-bottom: 100px; } .primary-navigation > div > .menu-wrapper ul { padding-left: 0; } } .primary-navigation > div > .menu-wrapper li { display: block; position: relative; width: 100%; } @media only screen and (min-width: 482px) { .primary-navigation > div > .menu-wrapper li { margin: 0; width: inherit; } .primary-navigation > div > .menu-wrapper li:last-child { margin-right: 0; } } .primary-navigation > div > .menu-wrapper .sub-menu-toggle { display: flex; height: calc(2 * var(--primary-nav--padding) + 1.15em + 1px); width: 44px; padding: 0; justify-content: center; align-items: center; background: transparent; color: currentColor; border: none; } .primary-navigation > div > .menu-wrapper .sub-menu-toggle:focus { outline: 2px solid var(--wp--style--color--link, var(--global--color-primary)); } @media only screen and (max-width: 481px) { .primary-navigation > div > .menu-wrapper .sub-menu-toggle { display: none; } } .primary-navigation > div > .menu-wrapper .sub-menu-toggle .icon-plus, .primary-navigation > div > .menu-wrapper .sub-menu-toggle .icon-minus { height: 100%; display: flex; align-items: center; } .primary-navigation > div > .menu-wrapper .sub-menu-toggle .icon-plus svg, .primary-navigation > div > .menu-wrapper .sub-menu-toggle .icon-minus svg { margin-top: -1px; } .primary-navigation > div > .menu-wrapper .sub-menu-toggle .icon-minus { display: none; } .primary-navigation > div > .menu-wrapper .sub-menu-toggle[aria-expanded=true] .icon-minus { display: flex; } .primary-navigation > div > .menu-wrapper .sub-menu-toggle[aria-expanded=true] .icon-plus { display: none; } .primary-navigation > div > .menu-wrapper > li > .sub-menu { position: relative; } @media only screen and (min-width: 482px) and (prefers-reduced-motion: no-preference) { .primary-navigation > div > .menu-wrapper > li > .sub-menu { transition: all 0.5s ease; } } @media only screen and (min-width: 482px) { .primary-navigation > div > .menu-wrapper > li > .sub-menu { left: 0; margin: 0; min-width: max-content; position: absolute; top: 100%; padding-top: 3px; z-index: 88888; } .primary-navigation > div > .menu-wrapper > li > .sub-menu:before, .primary-navigation > div > .menu-wrapper > li > .sub-menu:after { content: ""; display: block; position: absolute; width: 0; top: -10px; left: var(--global--spacing-horizontal); border-style: solid; border-color: var(--primary-nav--border-color) transparent; border-width: 0 7px 10px 7px; } .primary-navigation > div > .menu-wrapper > li > .sub-menu:after { top: -9px; border-color: var(--global--color-background) transparent; } .primary-navigation > div > .menu-wrapper > li > .sub-menu li { background: var(--global--color-background); } .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-left { /* rtl:ignore */ left: 0; /* rtl:ignore */ right: auto; } .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-left:before, .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-left:after { /* rtl:ignore */ left: var(--global--spacing-horizontal); /* rtl:ignore */ right: auto; } .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-right { /* rtl:ignore */ right: 0; /* rtl:ignore */ left: auto; } .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-right:before, .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-right:after { /* rtl:ignore */ left: auto; /* rtl:ignore */ right: var(--global--spacing-horizontal); } } .primary-navigation .primary-menu > .menu-item:hover > a { color: var(--primary-nav--color-link-hover); } @media only screen and (min-width: 482px) { .primary-navigation .primary-menu-container { margin-right: calc(0px - var(--primary-nav--padding)); margin-left: calc(0px - var(--primary-nav--padding)); } .primary-navigation .primary-menu-container > ul > .menu-item { display: flex; } .primary-navigation .primary-menu-container > ul > .menu-item > a { padding-left: var(--primary-nav--padding); padding-right: var(--primary-nav--padding); } .primary-navigation .primary-menu-container > ul > .menu-item > a + .sub-menu-toggle { margin-left: calc(5px - var(--primary-nav--padding)); } } .primary-navigation a { display: block; font-family: var(--primary-nav--font-family-mobile); font-size: var(--primary-nav--font-size-mobile); font-weight: var(--primary-nav--font-weight); padding: var(--primary-nav--padding) 0; text-decoration: none; } @media only screen and (min-width: 482px) { .primary-navigation a { display: block; font-family: var(--primary-nav--font-family); font-size: var(--primary-nav--font-size); font-weight: var(--primary-nav--font-weight); } } .primary-navigation a + svg { fill: var(--primary-nav--color-text); } .primary-navigation a:hover, .primary-navigation a:link, .primary-navigation a:visited { color: var(--primary-nav--color-link-hover); } .primary-navigation a:hover { text-decoration: underline; text-decoration-style: dotted; } .primary-navigation a:focus { position: relative; z-index: 99999; outline-offset: 0; text-decoration-thickness: 2px; } .primary-navigation .current-menu-item > a:first-child, .primary-navigation .current_page_item > a:first-child { text-decoration: underline; text-decoration-style: solid; } .primary-navigation .current-menu-item > a:first-child:hover, .primary-navigation .current_page_item > a:first-child:hover { text-decoration: underline; text-decoration-style: dotted; } .primary-navigation .sub-menu { margin: 0; padding: 0; list-style: none; margin-left: var(--primary-nav--padding); border: 1px solid var(--primary-nav--border-color); } .primary-navigation .sub-menu .sub-menu { border: none; } @media only screen and (min-width: 482px) { .primary-navigation .sub-menu > .menu-item > .sub-menu { padding: 0; } } @media only screen and (max-width: 481px) { .primary-navigation .sub-menu .menu-item:last-child { margin-bottom: 0; } } .primary-navigation .sub-menu .menu-item > a { padding: calc(1.25 * var(--primary-nav--padding)) var(--primary-nav--padding); display: block; font-size: var(--primary-nav--font-size-sub-menu-mobile); font-style: var(--primary-nav--font-style-sub-menu-mobile); } @media only screen and (min-width: 482px) { .primary-navigation .sub-menu .menu-item > a { font-size: var(--primary-nav--font-size-sub-menu); font-style: var(--primary-nav--font-style); } } .primary-navigation .menu-item-has-children > .svg-icon { display: none; } @media only screen and (min-width: 482px) { .primary-navigation .menu-item-has-children > .svg-icon { display: inline-block; height: 100%; } .primary-navigation .menu-item-has-children .sub-menu .svg-icon { display: none; } } .primary-navigation .menu-item-description { display: block; clear: both; font-size: var(--global--font-size-xs); text-transform: none; line-height: 1.7; } .primary-navigation .menu-item-description > span { display: inline-block; } @media only screen and (max-width: 481px) { .lock-scrolling .site { position: fixed; max-width: 100%; width: 100%; } } @keyframes twentytwentyone-close-button-transition { from { opacity: 0; } to { opacity: 1; } } .footer-navigation { margin-top: calc(2 * var(--global--spacing-vertical)); margin-bottom: var(--global--spacing-vertical); color: var(--footer--color-text); font-size: var(--global--font-size-xs); font-family: var(--footer--font-family); } .footer-navigation-wrapper { display: flex; justify-content: center; flex-wrap: wrap; list-style: none; padding-left: 0; } .footer-navigation-wrapper li { display: inline; line-height: 3; } .footer-navigation-wrapper li a { padding: calc(1.25 * var(--primary-nav--padding)) var(--primary-nav--padding); color: var(--footer--color-link); } .footer-navigation-wrapper li a:link, .footer-navigation-wrapper li a:visited, .footer-navigation-wrapper li a:active { color: var(--footer--color-link); } .footer-navigation-wrapper li a:hover { text-decoration: underline; text-decoration-style: dotted; text-decoration-skip-ink: none; color: var(--footer--color-link-hover); } .is-dark-theme .footer-navigation-wrapper li a:focus .svg-icon { fill: var(--wp--style--color--link, var(--global--color-background)); } .has-background-white .footer-navigation-wrapper li a:focus .svg-icon { fill: var(--wp--style--color--link, var(--global--color-white)); } .footer-navigation-wrapper li .svg-icon { vertical-align: middle; fill: var(--footer--color-link); } .footer-navigation-wrapper li .svg-icon:hover { transform: scale(1.1); } @media (prefers-reduced-motion: no-preference) { .footer-navigation-wrapper li .svg-icon { transition: transform 0.1s ease; } } .footer-navigation-wrapper .sub-menu-toggle, .footer-navigation-wrapper .menu-item-description { display: none; } /* Next/Previous navigation */ .navigation { color: var(--global--color-primary); } .navigation a { color: var(--global--color-primary); text-decoration: none; } .navigation a:hover { color: var(--global--color-primary-hover); text-decoration: underline; text-decoration-style: dotted; } .navigation a:focus { color: var(--global--color-secondary); } .navigation a:active { color: var(--global--color-primary); } .navigation .nav-links > * { min-width: 44px; min-height: 44px; } .navigation .nav-links .nav-next a, .navigation .nav-links .nav-previous a { display: flex; flex-direction: column; } .navigation .nav-links .dots { text-align: center; } @media only screen and (min-width: 592px) { .navigation .nav-links { display: flex; justify-content: center; flex-wrap: wrap; } .navigation .nav-links .nav-next, .navigation .nav-links .nav-previous { flex: 0 1 auto; margin-bottom: inherit; margin-top: inherit; max-width: calc(50% - 0.5 * var(--global--spacing-unit)); } .navigation .nav-links .nav-next { text-align: right; } } .navigation .svg-icon { display: inline-block; fill: currentColor; vertical-align: middle; position: relative; } .navigation .nav-previous .svg-icon, .navigation .prev .svg-icon { top: -2px; margin-right: calc(0.25 * var(--global--spacing-unit)); } .navigation .nav-next .svg-icon, .navigation .next .svg-icon { top: -1px; margin-left: calc(0.25 * var(--global--spacing-unit)); } .post-navigation { margin: var(--global--spacing-vertical) auto; } @media only screen and (min-width: 822px) { .post-navigation { margin: var(--global--spacing-vertical) auto; } } .post-navigation .meta-nav { line-height: var(--global--line-height-body); color: var(--global--color-primary); } .post-navigation .post-title { display: inline-block; font-family: var(--global--font-primary); font-size: var(--global--font-size-lg); font-weight: var(--pagination--font-weight-strong); line-height: var(--global--line-height-heading); } @media only screen and (min-width: 822px) { .post-navigation .post-title { margin: 5px calc(24px + 0.25 * var(--global--spacing-unit)) 0; } } @media only screen and (min-width: 482px) { .post-navigation .nav-links { justify-content: space-between; } } .post-navigation .nav-next, .post-navigation .nav-previous { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } .post-navigation .nav-next:first-child, .post-navigation .nav-previous:first-child { margin-top: 0; } .post-navigation .nav-next:last-child, .post-navigation .nav-previous:last-child { margin-bottom: 0; } .pagination, .comments-pagination { border-top: 3px solid var(--global--color-border); padding-top: var(--global--spacing-vertical); margin: var(--global--spacing-vertical) auto; } @media only screen and (min-width: 822px) { .pagination, .comments-pagination { margin: var(--global--spacing-vertical) auto; } } .pagination .nav-links, .comments-pagination .nav-links { margin-top: calc(-1 * var(--global--spacing-vertical)); } .pagination .nav-links a:hover, .comments-pagination .nav-links a:hover { color: var(--pagination--color-link-hover); } .is-dark-theme .pagination .nav-links a:active, .is-dark-theme .pagination .nav-links a:hover:active, .is-dark-theme .pagination .nav-links a:hover:focus, .is-dark-theme .comments-pagination .nav-links a:active, .is-dark-theme .comments-pagination .nav-links a:hover:active, .is-dark-theme .comments-pagination .nav-links a:hover:focus { color: var(--global--color-background); } .has-background-white .pagination .nav-links a:active, .has-background-white .pagination .nav-links a:hover:active, .has-background-white .pagination .nav-links a:hover:focus, .has-background-white .comments-pagination .nav-links a:active, .has-background-white .comments-pagination .nav-links a:hover:active, .has-background-white .comments-pagination .nav-links a:hover:focus { color: var(--global--color-white); } .pagination .nav-links > *, .comments-pagination .nav-links > * { color: var(--pagination--color-text); font-family: var(--pagination--font-family); font-size: var(--pagination--font-size); font-weight: var(--pagination--font-weight); margin-top: var(--global--spacing-vertical); margin-left: calc(0.66 * var(--global--spacing-unit)); margin-right: calc(0.66 * var(--global--spacing-unit)); } .pagination .nav-links > *.current, .comments-pagination .nav-links > *.current { text-decoration: underline; } .pagination .nav-links > *:not(.dots):not(.current):hover, .comments-pagination .nav-links > *:not(.dots):not(.current):hover { text-decoration-style: dotted; } .pagination .nav-links > *:first-child, .comments-pagination .nav-links > *:first-child { margin-left: 0; } .pagination .nav-links > *:last-child, .comments-pagination .nav-links > *:last-child { margin-right: 0; } .pagination .nav-links > *.next, .comments-pagination .nav-links > *.next { margin-left: auto; } .pagination .nav-links > *.prev, .comments-pagination .nav-links > *.prev { margin-right: auto; } @media only screen and (max-width: 821px) { .pagination .nav-links, .comments-pagination .nav-links { display: flex; flex-wrap: wrap; } .pagination .page-numbers, .comments-pagination .page-numbers { display: none; } .pagination .page-numbers.prev, .pagination .page-numbers.next, .comments-pagination .page-numbers.prev, .comments-pagination .page-numbers.next { display: inline-block; flex: 0 1 auto; } } @media only screen and (max-width: 481px) { .pagination .nav-short, .comments-pagination .nav-short { display: none; } } .comments-pagination { padding-top: calc(0.66 * var(--global--spacing-vertical)); margin: calc(3 * var(--global--spacing-vertical)) auto; } @media only screen and (min-width: 822px) { .comments-pagination { margin: calc(3 * var(--global--spacing-vertical)) auto calc(4 * var(--global--spacing-vertical)) auto; } } .comments-pagination .nav-links > * { font-size: var(--global--font-size-md); } .widget-area { margin-top: calc(6 * var(--global--spacing-vertical)); padding-bottom: calc(var(--global--spacing-vertical) / 3); color: var(--footer--color-text); font-size: var(--footer--font-size); font-family: var(--footer--font-family); } @media only screen and (min-width: 652px) { .widget-area { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: calc(2 * var(--global--spacing-horizontal)); } } @media only screen and (min-width: 1024px) { .widget-area { grid-template-columns: repeat(3, 1fr); } } @media only screen and (max-width: 481px) { .widget-area { margin-top: calc(3 * var(--global--spacing-vertical)); } } .widget-area .wp-block-social-links.alignright { margin-top: var(--global--spacing-vertical); justify-content: flex-end; } .widget-area .wp-block-social-links.alignleft { margin-top: var(--global--spacing-vertical); } .widget-area:after { content: ""; display: table; clear: both; } .widget h1, .widget h2, .widget h3, .widget h4, .widget h5, .widget h6 { font-weight: var(--widget--font-weight-title); line-height: var(--widget--line-height-title); } .widget h1 { font-size: var(--global--font-size-md); } .widget h2 { font-size: var(--global--font-size-sm); } .widget h3 { font-size: var(--global--font-size-xs); } .widget h4 { font-size: var(--global--font-size-xs); } .widget h5 { font-size: var(--global--font-size-xs); } .widget h6 { font-size: var(--global--font-size-xs); } .widget ul { list-style-type: none; padding: 0; } .widget ul li { line-height: var(--widget--line-height-list); } .widget ul.sub-menu, .widget ul.children { margin-left: var(--widget--spacing-menu); } .widget ul .sub-menu-toggle { display: none; } .widget a { color: var(--footer--color-link); text-decoration: underline; text-decoration-style: solid; text-decoration-color: currentColor; } .widget a:link, .widget a:visited, .widget a:active { color: var(--footer--color-link); } .widget a:hover { color: var(--footer--color-link-hover); text-decoration-style: dotted; } .search-form { display: flex; flex-wrap: wrap; margin: auto; max-width: var(--responsive--aligndefault-width); } .search-form > label { width: 100%; margin-bottom: 0; font-weight: var(--form--label-weight); } .search-form .search-field { flex-grow: 1; max-width: inherit; margin-top: calc(var(--global--spacing-vertical) / 3); margin-right: calc(0.66 * var(--global--spacing-horizontal)); } .search-form .search-submit { margin-top: calc(var(--global--spacing-vertical) / 3); margin-left: 10px; } .widget_search > .search-form .search-field { margin-right: calc(-1 * var(--button--border-width)); -webkit-appearance: none; margin-bottom: calc(0.5 * var(--global--spacing-vertical)); } .widget_search > .search-form .search-submit { margin-left: 0; margin-bottom: calc(0.5 * var(--global--spacing-vertical)); } .widget_rss a.rsswidget .rss-widget-icon { display: none; } /* Category 07 is for any utility classes that are not assigned to a specific component. */ .screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); -webkit-clip-path: inset(50%); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; word-break: normal; } .skip-link:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; -webkit-clip-path: none; clip-path: none; color: #21759b; display: block; font-size: 0.875rem; font-weight: 700; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; } /* Do not show the outline on the skip link target. */ #content[tabindex="-1"]:focus { outline: 0; } .has-black-color[class] { color: var(--global--color-black); } .has-black-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-black, #000); color: var(--local--color-primary); } .has-gray-color[class] { color: var(--global--color-gray); } .has-gray-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-gray, #000); color: var(--local--color-primary); } .has-dark-gray-color[class] { color: var(--global--color-dark-gray); } .has-dark-gray-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-dark-gray, #000); color: var(--local--color-primary); } .has-green-color[class] { color: var(--global--color-green); } .has-green-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-green, #fff); color: var(--local--color-primary); } .has-blue-color[class] { color: var(--global--color-blue); } .has-blue-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-blue, #fff); color: var(--local--color-primary); } .has-purple-color[class] { color: var(--global--color-purple); } .has-purple-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-purple, #fff); color: var(--local--color-primary); } .has-red-color[class] { color: var(--global--color-red); } .has-red-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-red, #fff); color: var(--local--color-primary); } .has-orange-color[class] { color: var(--global--color-orange); } .has-orange-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-orange, #fff); color: var(--local--color-primary); } .has-yellow-color[class] { color: var(--global--color-yellow); } .has-yellow-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-yellow, #fff); color: var(--local--color-primary); } .has-white-color[class] { color: var(--global--color-white); } .has-white-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-white, #fff); color: var(--local--color-primary); } .has-background a, .has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6 { color: currentColor; } .has-black-background-color[class] { background-color: var(--global--color-black); } .has-black-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-black, #000); background-color: var(--local--color-background); } .has-dark-gray-background-color[class] { background-color: var(--global--color-dark-gray); } .has-dark-gray-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-dark-gray, #000); background-color: var(--local--color-background); } .has-gray-background-color[class] { background-color: var(--global--color-gray); } .has-gray-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-gray, #000); background-color: var(--local--color-background); } .has-light-gray-background-color[class] { background-color: var(--global--color-light-gray); } .has-light-gray-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-light-gray, #fff); background-color: var(--local--color-background); } .has-green-background-color[class] { background-color: var(--global--color-green); } .has-green-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-green, #fff); background-color: var(--local--color-background); } .has-blue-background-color[class] { background-color: var(--global--color-blue); } .has-blue-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-blue, #fff); background-color: var(--local--color-background); } .has-purple-background-color[class] { background-color: var(--global--color-purple); } .has-purple-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-purple, #fff); background-color: var(--local--color-background); } .has-red-background-color[class] { background-color: var(--global--color-red); } .has-red-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-red, #fff); background-color: var(--local--color-background); } .has-orange-background-color[class] { background-color: var(--global--color-orange); } .has-orange-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-orange, #fff); background-color: var(--local--color-background); } .has-yellow-background-color[class] { background-color: var(--global--color-yellow); } .has-yellow-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-yellow, #fff); background-color: var(--local--color-background); } .has-white-background-color[class] { background-color: var(--global--color-white); } .has-white-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-white, #fff); background-color: var(--local--color-background); } .has-background:not(.has-text-color).has-black-background-color[class], .has-background:not(.has-text-color).has-gray-background-color[class], .has-background:not(.has-text-color).has-dark-gray-background-color[class] { color: var(--global--color-white); } .has-background:not(.has-text-color).has-black-background-color[class] > [class*=__inner-container], .has-background:not(.has-text-color).has-gray-background-color[class] > [class*=__inner-container], .has-background:not(.has-text-color).has-dark-gray-background-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-background, #fff); color: var(--local--color-primary, var(--global--color-primary)); } .is-dark-theme .has-background:not(.has-text-color).has-black-background-color[class] > [class*=__inner-container], .is-dark-theme .has-background:not(.has-text-color).has-gray-background-color[class] > [class*=__inner-container], .is-dark-theme .has-background:not(.has-text-color).has-dark-gray-background-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-primary, #000); } .has-background:not(.has-text-color).has-green-background-color[class], .has-background:not(.has-text-color).has-blue-background-color[class], .has-background:not(.has-text-color).has-purple-background-color[class], .has-background:not(.has-text-color).has-red-background-color[class], .has-background:not(.has-text-color).has-orange-background-color[class], .has-background:not(.has-text-color).has-yellow-background-color[class], .has-background:not(.has-text-color).has-white-background-color[class] { color: var(--global--color-dark-gray); } .has-background:not(.has-text-color).has-green-background-color[class] > [class*=__inner-container], .has-background:not(.has-text-color).has-blue-background-color[class] > [class*=__inner-container], .has-background:not(.has-text-color).has-purple-background-color[class] > [class*=__inner-container], .has-background:not(.has-text-color).has-red-background-color[class] > [class*=__inner-container], .has-background:not(.has-text-color).has-orange-background-color[class] > [class*=__inner-container], .has-background:not(.has-text-color).has-yellow-background-color[class] > [class*=__inner-container], .has-background:not(.has-text-color).has-white-background-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-primary, #000); color: var(--local--color-primary, var(--global--color-primary)); } .is-dark-theme .has-background:not(.has-text-color).has-green-background-color[class] > [class*=__inner-container], .is-dark-theme .has-background:not(.has-text-color).has-blue-background-color[class] > [class*=__inner-container], .is-dark-theme .has-background:not(.has-text-color).has-purple-background-color[class] > [class*=__inner-container], .is-dark-theme .has-background:not(.has-text-color).has-red-background-color[class] > [class*=__inner-container], .is-dark-theme .has-background:not(.has-text-color).has-orange-background-color[class] > [class*=__inner-container], .is-dark-theme .has-background:not(.has-text-color).has-yellow-background-color[class] > [class*=__inner-container], .is-dark-theme .has-background:not(.has-text-color).has-white-background-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-background, #fff); } .has-purple-to-yellow-gradient-background { background: linear-gradient(160deg, var(--global--color-purple), var(--global--color-yellow)); } .has-yellow-to-purple-gradient-background { background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-purple)); } .has-green-to-yellow-gradient-background { background: linear-gradient(160deg, var(--global--color-green), var(--global--color-yellow)); } .has-yellow-to-green-gradient-background { background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-green)); } .has-red-to-yellow-gradient-background { background: linear-gradient(160deg, var(--global--color-red), var(--global--color-yellow)); } .has-yellow-to-red-gradient-background { background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-red)); } .has-purple-to-red-gradient-background { background: linear-gradient(160deg, var(--global--color-purple), var(--global--color-red)); } .has-red-to-purple-gradient-background { background: linear-gradient(160deg, var(--global--color-red), var(--global--color-purple)); } header *, main *, footer * { max-width: var(--global--spacing-measure); } html, body, div, header, nav, article, figure, hr, main, section, footer { max-width: none; } .is-IE.is-dark-theme { color: #fff; } .is-IE.is-dark-theme *, .is-IE.is-dark-theme a, .is-IE.is-dark-theme .site-description, .is-IE.is-dark-theme .entry-title, .is-IE.is-dark-theme .entry-footer, .is-IE.is-dark-theme .widget-area, .is-IE.is-dark-theme .post-navigation .meta-nav, .is-IE.is-dark-theme .footer-navigation-wrapper li a:link, .is-IE.is-dark-theme .site-footer > .site-info, .is-IE.is-dark-theme .site-footer > .site-info a, .is-IE.is-dark-theme .site-footer > .site-info a:visited { color: #fff; } .is-IE.is-dark-theme .sub-menu-toggle svg, .is-IE.is-dark-theme .sub-menu-toggle path, .is-IE.is-dark-theme .post-navigation .meta-nav svg, .is-IE.is-dark-theme .post-navigation .meta-nav path { fill: #fff; } .is-IE.is-dark-theme .primary-navigation > div > .menu-wrapper > li > .sub-menu li { background: #000; } @media only screen and (max-width: 481px) { .is-IE.is-dark-theme.primary-navigation-open .primary-navigation > .primary-menu-container, .is-IE.is-dark-theme.primary-navigation-open .menu-button-container { background-color: #000; } } .is-IE.is-dark-theme .skip-link:focus { color: #21759b; } .is-IE .navigation .nav-links { display: block; } .is-IE .post-thumbnail .wp-post-image { min-width: auto; } footer.php000064400000004317152377522560006576 0ustar00 404.php000064400000001321152377522560005577 0ustar00

source on its own array key, without adding either * the `width` or `height` attributes, since these are added dynamically, * before rendering the SVG code. * * All icons are assumed to have equal width and height, hence the option * to only specify a `$size` parameter in the svg methods. * * @since Twenty Twenty-One 1.0 */ class Twenty_Twenty_One_SVG_Icons { /** * User Interface icons – svg sources. * * @since Twenty Twenty-One 1.0 * * @var array */ protected static $icons = array( 'arrow_right' => '', 'arrow_left' => '', 'close' => '', 'menu' => '', 'plus' => '', 'minus' => '', ); /** * Social Icons – svg sources. * * @since Twenty Twenty-One 1.0 * * @var array */ protected static $social_icons = array( '500px' => '', 'amazon' => '', 'bandcamp' => '', 'behance' => '', 'codepen' => '', 'deviantart' => '', 'dribbble' => '', 'dropbox' => '', 'etsy' => '', 'facebook' => '', 'feed' => '', 'flickr' => '', 'foursquare' => '', 'goodreads' => '', 'google' => '', 'github' => '', 'instagram' => '', 'lastfm' => '', 'linkedin' => '', 'mail' => '', 'mastodon' => '', 'medium' => '', 'meetup' => '', 'pinterest' => '', 'pocket' => '', 'reddit' => '', 'skype' => '', 'snapchat' => '', 'soundcloud' => '', 'spotify' => '', 'tumblr' => '', 'twitch' => '', 'twitter' => '', 'vimeo' => '', 'vk' => '', 'wordpress' => '', 'yelp' => '', 'youtube' => '', ); /** * Social Icons – domain mappings. * * By default, each Icon ID is matched against a .com TLD. To override this behavior, * specify all the domains it covers (including the .com TLD too, if applicable). * * @since Twenty Twenty-One 1.0 * * @var array */ protected static $social_icons_map = array( 'amazon' => array( 'amazon.com', 'amazon.cn', 'amazon.in', 'amazon.fr', 'amazon.de', 'amazon.it', 'amazon.nl', 'amazon.es', 'amazon.co', 'amazon.ca', ), 'behance' => array( 'behance.net', ), 'codepen' => array( 'codepen.io', ), 'facebook' => array( 'facebook.com', 'fb.me', ), 'feed' => array( 'feed', ), 'lastfm' => array( 'last.fm', ), 'mail' => array( 'mailto:', ), 'pocket' => array( 'getpocket.com', ), 'twitch' => array( 'twitch.tv', ), 'wordpress' => array( 'wordpress.com', 'wordpress.org', ), ); /** * Gets the SVG code for a given icon. * * @static * * @since Twenty Twenty-One 1.0 * * @param string $group The icon group. * @param string $icon The icon. * @param int $size The icon-size in pixels. * @return string */ public static function get_svg( $group, $icon, $size ) { if ( 'ui' === $group ) { $arr = self::$icons; } elseif ( 'social' === $group ) { $arr = self::$social_icons; } else { $arr = array(); } /** * Filters Twenty Twenty-Ones's array of icons. * * The dynamic portion of the hook name, `$group`, refers to * the name of the group of icons, either "ui" or "social". * * @since Twenty Twenty-One 1.0 * * @param array $arr Array of icons. */ $arr = apply_filters( "twenty_twenty_one_svg_icons_{$group}", $arr ); $svg = ''; if ( array_key_exists( $icon, $arr ) ) { $repl = sprintf( ''; } } return null; } } classes/class-twenty-twenty-one-dark-mode.php000064400000027621152377522560015345 0ustar00 in the dashboard. add_filter( 'admin_body_class', array( $this, 'admin_body_classes' ) ); // Add the switch on the frontend & customizer. add_action( 'wp_footer', array( $this, 'the_switch' ) ); // Add the privacy policy content. add_action( 'admin_init', array( $this, 'add_privacy_policy_content' ) ); } /** * Editor custom color variables & scripts. * * @since Twenty Twenty-One 1.0 * * @return void */ public function editor_custom_color_variables() { if ( ! $this->switch_should_render() ) { return; } $background_color = get_theme_mod( 'background_color', 'D1E4DD' ); $should_respect_color_scheme = get_theme_mod( 'respect_user_color_preference', false ); if ( $should_respect_color_scheme && Twenty_Twenty_One_Custom_Colors::get_relative_luminance_from_hex( $background_color ) > 127 ) { // Add Dark Mode variable overrides. wp_add_inline_style( 'twenty-twenty-one-custom-color-overrides', '.is-dark-theme.is-dark-theme .editor-styles-wrapper { --global--color-background: var(--global--color-dark-gray); --global--color-primary: var(--global--color-light-gray); --global--color-secondary: var(--global--color-light-gray); --button--color-text: var(--global--color-background); --button--color-text-hover: var(--global--color-secondary); --button--color-text-active: var(--global--color-secondary); --button--color-background: var(--global--color-secondary); --button--color-background-active: var(--global--color-background); --global--color-border: #9ea1a7; --table--stripes-border-color: rgba(240, 240, 240, 0.15); --table--stripes-background-color: rgba(240, 240, 240, 0.15); }' ); } wp_enqueue_script( 'twentytwentyone-dark-mode-support-toggle', get_template_directory_uri() . '/assets/js/dark-mode-toggler.js', array(), '1.0.0', true ); wp_enqueue_script( 'twentytwentyone-editor-dark-mode-support', get_template_directory_uri() . '/assets/js/editor-dark-mode-support.js', array( 'twentytwentyone-dark-mode-support-toggle' ), '1.0.0', true ); } /** * Enqueue scripts and styles. * * @since Twenty Twenty-One 1.0 * * @return void */ public function enqueue_scripts() { if ( ! $this->switch_should_render() ) { return; } $url = get_template_directory_uri() . '/assets/css/style-dark-mode.css'; if ( is_rtl() ) { $url = get_template_directory_uri() . '/assets/css/style-dark-mode-rtl.css'; } wp_enqueue_style( 'tt1-dark-mode', $url, array( 'twenty-twenty-one-style' ), wp_get_theme()->get( 'Version' ) ); // @phpstan-ignore-line. Version is always a string. } /** * Enqueue scripts for the customizer. * * @since Twenty Twenty-One 1.0 * * @return void */ public function customize_controls_enqueue_scripts() { if ( ! $this->switch_should_render() ) { return; } wp_enqueue_script( 'twentytwentyone-customize-controls', get_template_directory_uri() . '/assets/js/customize.js', array( 'customize-base', 'customize-controls', 'underscore', 'jquery', 'twentytwentyone-customize-helpers' ), '1.0.0', true ); } /** * Register customizer options. * * @since Twenty Twenty-One 1.0 * * @param WP_Customize_Manager $wp_customize Theme Customizer object. * @return void */ public function customizer_controls( $wp_customize ) { $colors_section = $wp_customize->get_section( 'colors' ); if ( is_object( $colors_section ) ) { $colors_section->title = __( 'Colors & Dark Mode', 'twentytwentyone' ); } // Custom notice control. include_once get_theme_file_path( 'classes/class-twenty-twenty-one-customize-notice-control.php' ); // phpcs:ignore WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound $wp_customize->add_setting( 'respect_user_color_preference_notice', array( 'capability' => 'edit_theme_options', 'default' => '', 'sanitize_callback' => '__return_empty_string', ) ); $wp_customize->add_control( new Twenty_Twenty_One_Customize_Notice_Control( $wp_customize, 'respect_user_color_preference_notice', array( 'section' => 'colors', 'priority' => 100, 'active_callback' => static function() { return 127 >= Twenty_Twenty_One_Custom_Colors::get_relative_luminance_from_hex( get_theme_mod( 'background_color', 'D1E4DD' ) ); }, ) ) ); $wp_customize->add_setting( 'respect_user_color_preference', array( 'capability' => 'edit_theme_options', 'default' => false, 'sanitize_callback' => static function( $value ) { return (bool) $value; }, ) ); $description = '

'; $description .= sprintf( /* translators: %s: Twenty Twenty-One support article URL. */ __( 'Dark Mode is a device setting. If a visitor to your site requests it, your site will be shown with a dark background and light text. Learn more about Dark Mode.', 'twentytwentyone' ), esc_url( __( 'https://wordpress.org/support/article/twenty-twenty-one/#dark-mode-support', 'twentytwentyone' ) ) ); $description .= '

'; $description .= '

' . __( 'Dark Mode can also be turned on and off with a button that you can find in the bottom corner of the page.', 'twentytwentyone' ) . '

'; $wp_customize->add_control( 'respect_user_color_preference', array( 'type' => 'checkbox', 'section' => 'colors', 'label' => esc_html__( 'Dark Mode support', 'twentytwentyone' ), 'priority' => 110, 'description' => $description, 'active_callback' => static function( $value ) { return 127 < Twenty_Twenty_One_Custom_Colors::get_relative_luminance_from_hex( get_theme_mod( 'background_color', 'D1E4DD' ) ); }, ) ); // Add partial for background_color. $wp_customize->selective_refresh->add_partial( 'background_color', array( 'selector' => '#dark-mode-toggler', 'container_inclusive' => true, 'render_callback' => function() { $attrs = ( $this->switch_should_render() ) ? array() : array( 'style' => 'display:none;' ); $this->the_html( $attrs ); }, ) ); } /** * Calculate classes for the main element. * * @since Twenty Twenty-One 1.0 * * @param string $classes The classes for element. * @return string */ public function html_classes( $classes ) { if ( ! $this->switch_should_render() ) { return $classes; } $background_color = get_theme_mod( 'background_color', 'D1E4DD' ); $should_respect_color_scheme = get_theme_mod( 'respect_user_color_preference', false ); if ( $should_respect_color_scheme && 127 <= Twenty_Twenty_One_Custom_Colors::get_relative_luminance_from_hex( $background_color ) ) { return ( $classes ) ? ' respect-color-scheme-preference' : 'respect-color-scheme-preference'; } return $classes; } /** * Adds a class to the element in the editor to accommodate dark-mode. * * @since Twenty Twenty-One 1.0 * * @param string $classes The admin body-classes. * @return string */ public function admin_body_classes( $classes ) { if ( ! $this->switch_should_render() ) { return $classes; } global $current_screen; if ( empty( $current_screen ) ) { set_current_screen(); } if ( $current_screen->is_block_editor() ) { $should_respect_color_scheme = get_theme_mod( 'respect_user_color_preference', false ); $background_color = get_theme_mod( 'background_color', 'D1E4DD' ); if ( $should_respect_color_scheme && Twenty_Twenty_One_Custom_Colors::get_relative_luminance_from_hex( $background_color ) > 127 ) { $classes .= ' twentytwentyone-supports-dark-theme'; } } return $classes; } /** * Determine if we want to print the dark-mode switch or not. * * @since Twenty Twenty-One 1.0 * * @return bool */ public function switch_should_render() { global $is_IE; return ( get_theme_mod( 'respect_user_color_preference', false ) && ! $is_IE && 127 <= Twenty_Twenty_One_Custom_Colors::get_relative_luminance_from_hex( get_theme_mod( 'background_color', 'D1E4DD' ) ) ); } /** * Add night/day switch. * * @since Twenty Twenty-One 1.0 * * @return void */ public function the_switch() { if ( ! $this->switch_should_render() ) { return; } $this->the_html(); $this->the_script(); } /** * Print the dark-mode switch HTML. * * Inspired from https://codepen.io/aaroniker/pen/KGpXZo (MIT-licensed) * * @since Twenty Twenty-One 1.0 * * @param array $attrs The attributes to add to our '; ?> '; include get_template_directory() . '/assets/js/dark-mode-toggler.js'; // phpcs:ignore WPThemeReview.CoreFunctionality.FileInclude echo ''; } /** * Adds information to the privacy policy. * * @since Twenty Twenty-One 1.0 * * @return void */ public function add_privacy_policy_content() { if ( ! function_exists( 'wp_add_privacy_policy_content' ) ) { return; } $content = '

' . __( 'Twenty Twenty-One uses LocalStorage when Dark Mode support is enabled.', 'twentytwentyone' ) . '

' . '' . __( 'Suggested text:', 'twentytwentyone' ) . ' ' . __( 'This website uses LocalStorage to save the setting when Dark Mode support is turned on or off.
LocalStorage is necessary for the setting to work and is only used when a user clicks on the Dark Mode button.
No data is saved in the database or transferred.', 'twentytwentyone' ); wp_add_privacy_policy_content( 'Twenty Twenty-One', wp_kses_post( wpautop( $content, false ) ) ); } } classes/class-twenty-twenty-one-custom-colors.php000064400000011664152377522560016313 0ustar00custom_get_readable_color( $background_color ) . ';'; $theme_css .= '--global--color-secondary: ' . $this->custom_get_readable_color( $background_color ) . ';'; $theme_css .= '--button--color-background: ' . $this->custom_get_readable_color( $background_color ) . ';'; $theme_css .= '--button--color-text-hover: ' . $this->custom_get_readable_color( $background_color ) . ';'; if ( '#fff' === $this->custom_get_readable_color( $background_color ) ) { $theme_css .= '--table--stripes-border-color: rgba(240, 240, 240, 0.15);'; $theme_css .= '--table--stripes-background-color: rgba(240, 240, 240, 0.15);'; } } $theme_css .= '}'; return $theme_css; } /** * Customizer & frontend custom color variables. * * @since Twenty Twenty-One 1.0 * * @return void */ public function custom_color_variables() { if ( 'd1e4dd' !== strtolower( get_theme_mod( 'background_color', 'D1E4DD' ) ) ) { wp_add_inline_style( 'twenty-twenty-one-style', $this->generate_custom_color_variables() ); } } /** * Editor custom color variables. * * @since Twenty Twenty-One 1.0 * * @return void */ public function editor_custom_color_variables() { wp_enqueue_style( 'twenty-twenty-one-custom-color-overrides', get_theme_file_uri( 'assets/css/custom-color-overrides.css' ), array(), wp_get_theme()->get( 'Version' ) ); $background_color = get_theme_mod( 'background_color', 'D1E4DD' ); if ( 'd1e4dd' !== strtolower( $background_color ) ) { wp_add_inline_style( 'twenty-twenty-one-custom-color-overrides', $this->generate_custom_color_variables( 'editor' ) ); } } /** * Get luminance from a HEX color. * * @static * * @since Twenty Twenty-One 1.0 * * @param string $hex The HEX color. * @return int Returns a number (0-255). */ public static function get_relative_luminance_from_hex( $hex ) { // Remove the "#" symbol from the beginning of the color. $hex = ltrim( $hex, '#' ); // Make sure there are 6 digits for the below calculations. if ( 3 === strlen( $hex ) ) { $hex = substr( $hex, 0, 1 ) . substr( $hex, 0, 1 ) . substr( $hex, 1, 1 ) . substr( $hex, 1, 1 ) . substr( $hex, 2, 1 ) . substr( $hex, 2, 1 ); } // Get red, green, blue. $red = hexdec( substr( $hex, 0, 2 ) ); $green = hexdec( substr( $hex, 2, 2 ) ); $blue = hexdec( substr( $hex, 4, 2 ) ); // Calculate the luminance. $lum = ( 0.2126 * $red ) + ( 0.7152 * $green ) + ( 0.0722 * $blue ); return (int) round( $lum ); } /** * Adds a class to if the background-color is dark. * * @since Twenty Twenty-One 1.0 * * @param array $classes The existing body classes. * @return array */ public function body_class( $classes ) { $background_color = get_theme_mod( 'background_color', 'D1E4DD' ); $luminance = self::get_relative_luminance_from_hex( $background_color ); if ( 127 > $luminance ) { $classes[] = 'is-dark-theme'; } else { $classes[] = 'is-light-theme'; } if ( 225 <= $luminance ) { $classes[] = 'has-background-white'; } return $classes; } } classes/class-twenty-twenty-one-customize-notice-control.php000064400000002115152377522560020450 0ustar00

get( 'Version' ), false ); } /** * Refresh the parameters passed to the JavaScript via JSON. * * @since Twenty Twenty-One 1.0 * * @uses WP_Customize_Control::to_json() * * @return void */ public function to_json() { parent::to_json(); $this->json['palette'] = $this->palette; } } classes/class-twenty-twenty-one-customize.php000064400000011521152377522560015514 0ustar00get_setting( 'blogname' )->transport = 'postMessage'; // @phpstan-ignore-line. Assume that this setting exists. $wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage'; // @phpstan-ignore-line. Assume that this setting exists. // Add partial for blogname. $wp_customize->selective_refresh->add_partial( 'blogname', array( 'selector' => '.site-title', 'render_callback' => array( $this, 'partial_blogname' ), ) ); // Add partial for blogdescription. $wp_customize->selective_refresh->add_partial( 'blogdescription', array( 'selector' => '.site-description', 'render_callback' => array( $this, 'partial_blogdescription' ), ) ); // Add "display_title_and_tagline" setting for displaying the site-title & tagline. $wp_customize->add_setting( 'display_title_and_tagline', array( 'capability' => 'edit_theme_options', 'default' => true, 'sanitize_callback' => array( __CLASS__, 'sanitize_checkbox' ), ) ); // Add control for the "display_title_and_tagline" setting. $wp_customize->add_control( 'display_title_and_tagline', array( 'type' => 'checkbox', 'section' => 'title_tagline', 'label' => esc_html__( 'Display Site Title & Tagline', 'twentytwentyone' ), ) ); /** * Add excerpt or full text selector to customizer */ $wp_customize->add_section( 'excerpt_settings', array( 'title' => esc_html__( 'Excerpt Settings', 'twentytwentyone' ), 'priority' => 120, ) ); $wp_customize->add_setting( 'display_excerpt_or_full_post', array( 'capability' => 'edit_theme_options', 'default' => 'excerpt', 'sanitize_callback' => static function( $value ) { return 'excerpt' === $value || 'full' === $value ? $value : 'excerpt'; }, ) ); $wp_customize->add_control( 'display_excerpt_or_full_post', array( 'type' => 'radio', 'section' => 'excerpt_settings', 'label' => esc_html__( 'On Archive Pages, posts show:', 'twentytwentyone' ), 'choices' => array( 'excerpt' => esc_html__( 'Summary', 'twentytwentyone' ), 'full' => esc_html__( 'Full text', 'twentytwentyone' ), ), ) ); // Background color. // Include the custom control class. include_once get_theme_file_path( 'classes/class-twenty-twenty-one-customize-color-control.php' ); // phpcs:ignore WPThemeReview.CoreFunctionality.FileInclude.FileIncludeFound // Register the custom control. $wp_customize->register_control_type( 'Twenty_Twenty_One_Customize_Color_Control' ); // Get the palette from theme-supports. $palette = get_theme_support( 'editor-color-palette' ); // Build the colors array from theme-support. $colors = array(); if ( isset( $palette[0] ) && is_array( $palette[0] ) ) { foreach ( $palette[0] as $palette_color ) { $colors[] = $palette_color['color']; } } // Add the control. Overrides the default background-color control. $wp_customize->add_control( new Twenty_Twenty_One_Customize_Color_Control( $wp_customize, 'background_color', array( 'label' => esc_html_x( 'Background color', 'Customizer control', 'twentytwentyone' ), 'section' => 'colors', 'palette' => $colors, ) ) ); } /** * Sanitize boolean for checkbox. * * @since Twenty Twenty-One 1.0 * * @param bool $checked Whether or not a box is checked. * @return bool */ public static function sanitize_checkbox( $checked = null ) { return (bool) isset( $checked ) && true === $checked; } /** * Render the site title for the selective refresh partial. * * @since Twenty Twenty-One 1.0 * * @return void */ public function partial_blogname() { bloginfo( 'name' ); } /** * Render the site tagline for the selective refresh partial. * * @since Twenty Twenty-One 1.0 * * @return void */ public function partial_blogdescription() { bloginfo( 'description' ); } } } .stylelintrc-css.json000064400000001261152377522560010675 0ustar00{ "extends": [ "@wordpress/stylelint-config" ], "rules": { "indentation": "tab", "no-duplicate-selectors": null, "function-url-quotes": null, "selector-attribute-quotes": null, "declaration-block-no-duplicate-properties": null, "function-calc-no-unspaced-operator": null, "selector-pseudo-class-no-unknown": null, "selector-class-pattern": null, "font-weight-notation": null, "selector-type-no-unknown": null, "max-line-length": null, "at-rule-empty-line-before": null, "selector-pseudo-element-colon-notation": null, "number-leading-zero": null, "no-descending-specificity": null, "length-zero-no-unit": [true, {"ignore": ["custom-properties"]}] } } single.php000064400000003242152377522560006555 0ustar00 sprintf( __( 'Published in%s', 'twentytwentyone' ), '%title' ), ) ); } // If comments are open or there is at least one comment, load up the comment template. if ( comments_open() || get_comments_number() ) { comments_template(); } // Previous/next post navigation. $twentytwentyone_next = is_rtl() ? twenty_twenty_one_get_icon_svg( 'ui', 'arrow_left' ) : twenty_twenty_one_get_icon_svg( 'ui', 'arrow_right' ); $twentytwentyone_prev = is_rtl() ? twenty_twenty_one_get_icon_svg( 'ui', 'arrow_right' ) : twenty_twenty_one_get_icon_svg( 'ui', 'arrow_left' ); $twentytwentyone_next_label = esc_html__( 'Next post', 'twentytwentyone' ); $twentytwentyone_previous_label = esc_html__( 'Previous post', 'twentytwentyone' ); the_post_navigation( array( 'next_text' => '

' . $twentytwentyone_next_label . $twentytwentyone_next . '

%title

', 'prev_text' => '

' . $twentytwentyone_prev . $twentytwentyone_previous_label . '

%title

', ) ); endwhile; // End of the loop. get_footer(); package.json000064400000004555152377522560007061 0ustar00{ "name": "twentytwentyone", "version": "1.6.0", "description": "Default WP Theme", "author": "The WordPress Contributors", "license": "GPL-2.0-or-later", "keywords": [ "WordPress", "Theme" ], "bugs": { "url": "https://core.trac.wordpress.org/" }, "homepage": "https://wordpress.org/themes/twentytwentyone/", "devDependencies": { "@wordpress/browserslist-config": "^4.1.2", "@wordpress/eslint-plugin": "^9.3.0", "@wordpress/stylelint-config": "^19.1.0", "autoprefixer": "^10.4.5", "chokidar-cli": "^3.0.0", "eslint": "^8.14.0", "minimist": "^1.2.6", "npm-run-all": "^4.1.5", "postcss": "^8.4.12", "postcss-calc": "^8.2.4", "postcss-cli": "^9.1.0", "postcss-css-variables": "^0.18.0", "postcss-custom-media": "^8.0.0", "postcss-discard-duplicates": "^5.1.0", "postcss-focus-within": "^5.0.4", "postcss-merge-rules": "^5.1.1", "postcss-nested": "^5.0.6", "rtlcss": "^3.5.0", "sass": "^1.51.0", "stylelint": "^13.13.1", "stylelint-config-recommended-scss": "^5.0.2" }, "rtlcssConfig": { "options": { "autoRename": false, "autoRenameStrict": false, "blacklist": {}, "clean": true, "greedy": false, "processUrls": false, "stringMap": [] }, "plugins": [], "map": false }, "browserslist": [ "extends @wordpress/browserslist-config" ], "scripts": { "start": "chokidar \"**/*.scss\" -c \"npm run build\" --initial", "build:style": "sass assets/sass/style.scss:style.css --style=expanded --source-map", "build:style-editor": "sass assets/sass/style-editor.scss:assets/css/style-editor.css --style=expanded --source-map", "build:style-dark-mode": "sass assets/sass/style-dark-mode.scss:assets/css/style-dark-mode.css --style=expanded --source-map", "build:rtl": "rtlcss style.css style-rtl.css", "build:dark-rtl": "rtlcss assets/css/style-dark-mode.css assets/css/style-dark-mode-rtl.css", "build:print": "sass assets/sass/07-utilities/print.scss:assets/css/print.css --style=expanded --source-map", "build:ie": "postcss style.css -o assets/css/ie.css", "build:ie-editor": "postcss assets/css/style-editor.css -o assets/css/ie-editor.css", "build:stylelint": "stylelint **/*.css --fix --config .stylelintrc-css.json", "build": "run-s \"build:*\"", "watch": "chokidar \"**/*.scss\" -c \"npm run build\" --initial", "lint:scss": "stylelint **/*.scss", "lint-fix:scss": "stylelint **/*.scss --fix" } } comments.php000064400000005110152377522560007115 0ustar00

    60, 'style' => 'ol', 'short_ping' => true, ) ); ?>
esc_html__( 'Page', 'twentytwentyone' ) . ' ', 'mid_size' => 0, 'prev_text' => sprintf( '%s %s', is_rtl() ? twenty_twenty_one_get_icon_svg( 'ui', 'arrow_right' ) : twenty_twenty_one_get_icon_svg( 'ui', 'arrow_left' ), esc_html__( 'Older comments', 'twentytwentyone' ) ), 'next_text' => sprintf( '%s %s', esc_html__( 'Newer comments', 'twentytwentyone' ), is_rtl() ? twenty_twenty_one_get_icon_svg( 'ui', 'arrow_left' ) : twenty_twenty_one_get_icon_svg( 'ui', 'arrow_right' ) ), ) ); ?>

esc_html__( 'Leave a comment', 'twentytwentyone' ), 'title_reply_before' => '

', 'title_reply_after' => '

', ) ); ?>
postcss.config.js000064400000000433152377522560010062 0ustar00module.exports = { plugins: [ require('postcss-nested'), require('postcss-css-variables')({ preserve: false, preserveAtRulesOrder: true }), require('postcss-calc')({ precision: 0 }), require('postcss-discard-duplicates'), require('postcss-merge-rules') ] }; header.php000064400000001712152377522560006524 0ustar00 section and everything up until main. * * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials * * @package WordPress * @subpackage Twenty_Twenty_One * @since Twenty Twenty-One 1.0 */ ?> > >
assets/css/ie-editor.css000064400000176570152377522560011267 0ustar00@charset "UTF-8"; /** * These styles should be loaded by the Block Editor only */ /* Variables */ :root { /* Font Family */ /* Font Size */ /* Line Height */ /* Headings */ /* Block: Latest posts */ /* Colors */ /* Body text color, site title, footer text color. */ /* Headings */ /* Mint, default body background */ /* Used for borders (separators) */ /* Spacing */ /* Elevation */ /* Forms */ /* Cover block */ /* Buttons */ /* entry */ /* Header */ /* Main navigation */ /* Pagination */ /* Footer */ /* Block: Pull quote */ /* Block: Table */ /* Widgets */ /* Admin-bar height */ } /** * Responsive Styles */ /** * Required Variables */ /** * Root Media Query Variables */ /** * Extends */ .default-max-width { max-width: calc(100vw - 30px); margin-left: auto; margin-right: auto; } @media only screen and (min-width: 482px) { .default-max-width { max-width: min(calc(100vw - 100px), 610px); } } @media only screen and (min-width: 822px) { .default-max-width { max-width: min(calc(100vw - 200px), 610px); } } .wide-max-width { max-width: calc(100vw - 30px); margin-left: auto; margin-right: auto; } @media only screen and (min-width: 482px) { .wide-max-width { max-width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .wide-max-width { max-width: min(calc(100vw - 200px), 1240px); } } @media only screen and (min-width: 482px) { .full-max-width { max-width: 100%; width: auto; margin-left: auto; margin-right: auto; } } blockquote { padding: 0; position: relative; margin: 30px 0 30px 25px; } blockquote > * { margin-top: 20px; margin-bottom: 20px; } blockquote > *:first-child { margin-top: 0; } blockquote > *:last-child { margin-bottom: 0; } blockquote p { letter-spacing: normal; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.25rem; font-style: normal; font-weight: 700; line-height: 1.7; } blockquote cite, blockquote footer { font-weight: normal; letter-spacing: normal; } blockquote.alignleft, blockquote.alignright { padding-left: inherit; } blockquote.alignleft p, blockquote.alignright p { font-size: 1.125rem; max-width: inherit; width: inherit; } blockquote.alignleft cite, blockquote.alignleft footer, blockquote.alignright cite, blockquote.alignright footer { font-size: 1rem; letter-spacing: normal; } blockquote strong { font-weight: bolder; } blockquote:before { content: "“"; font-size: 1.25rem; line-height: 1.7; position: absolute; left: -12px; } blockquote .wp-block-quote__citation, blockquote cite, blockquote footer { color: #28303d; font-size: 1rem; font-style: normal; } @media only screen and (max-width: 481px) { blockquote { padding-left: 13px; } blockquote:before { left: 0; } } img { height: auto; vertical-align: middle; } /* Classic editor images */ /* Make sure embeds and iframes fit their containers. */ img, .entry-content img, embed, iframe, object, video { max-width: 100%; } /* Media captions */ figcaption, .wp-caption, .wp-caption-text, .wp-block-embed figcaption { color: currentColor; font-size: 1rem; line-height: 1.7; margin-top: 10px; margin-bottom: 20px; text-align: center; } .alignleft figcaption, .alignright figcaption, .alignleft .wp-caption, .alignright .wp-caption, .alignleft .wp-caption-text, .alignright .wp-caption-text, .alignleft .wp-block-embed figcaption, .alignright .wp-block-embed figcaption { margin-bottom: 0; } /* WP Smiley */ .page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } select { border: 3px solid #39414d; border-radius: 0; color: #28303d; font-size: 1.125rem; -moz-appearance: none; -webkit-appearance: none; appearance: none; padding: 10px 30px 10px 10px; background: #fff url("data:image/svg+xml;utf8,") no-repeat; background-position: right 10px top 60%; } select:focus { border: 3px solid #39414d; border-radius: 0; color: #28303d; font-size: 1.125rem; -moz-appearance: none; -webkit-appearance: none; appearance: none; padding: 10px 30px 10px 10px; background: #fff url("data:image/svg+xml;utf8,") no-repeat; background-position: right 10px top 60%; } /* * text-underline-offset doesn't work in Chrome at all 👎 * But looks nice in Safari/Firefox, so let's keep it and * maybe Chrome will support it soon. */ a { cursor: pointer; color: #28303d; text-underline-offset: 3px; text-decoration-skip-ink: all; } a:hover { text-decoration-style: dotted; text-decoration-skip-ink: none; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; text-decoration: underline 1px dotted currentColor; text-decoration-skip-ink: none; background: rgba(255, 255, 255, 0.9); } .is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { background: #000; color: #fff; text-decoration: none; } .is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav { color: #fff; } .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { background: rgba(0, 0, 0, 0.9); color: #fff; } .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav { color: #fff; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link { /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; outline-offset: -2px; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link:focus { color: #21759b; background-color: #f1f1f1; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).custom-logo-link { background: none; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) img { outline: 2px dotted #28303d; } .wp-block-button__link { border: 3px solid transparent; border-radius: 0; cursor: pointer; font-weight: 500; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.25rem; line-height: 1.5; padding: 15px 30px; text-decoration: none; } .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: #d1e4dd; } .has-background .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: #28303d; } .has-background .wp-block-button__link:not(:hover):not(:active):not(.has-text-color).has-background { color: #28303d; } .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .has-background .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .wp-block-button__link:hover, .wp-block-button__link:active { background-color: transparent; border-color: currentColor; color: inherit; } .wp-block-button__link:focus { outline-offset: -6px; outline: 2px dotted currentColor; } .wp-block-button__link:disabled { background-color: rgba(255, 255, 255, 0.5); border-color: rgba(255, 255, 255, 0.5); color: #39414d; } /** * Block Options */ .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: #d1e4dd; } .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: #d1e4dd; } .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color).has-background { color: #28303d; } .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover, .wp-block-button:not(.is-style-outline) .wp-block-button__link:active { border-color: currentColor !important; background-color: transparent !important; color: inherit !important; } .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus { outline-offset: inherit; outline: inherit; } .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color), .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-background), .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active).has-background { border-color: currentColor; } .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: #28303d; } .has-background .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: #28303d; } .has-background .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active).has-background:not(.has-text-color) { color: inherit; } .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: transparent; } .wp-block-button.is-style-outline .wp-block-button__link:hover { background-color: #28303d !important; border-color: transparent !important; color: #d1e4dd !important; } .wp-block-button.is-style-outline .wp-block-button__link:active { background-color: #28303d !important; border-color: transparent !important; color: #d1e4dd !important; } .has-background .wp-block-button.is-style-outline .wp-block-button__link:hover { background-color: #28303d !important; color: #d1e4dd !important; } .has-background .wp-block-button.is-style-outline .wp-block-button__link:active { background-color: #28303d !important; color: #d1e4dd !important; } .has-text-color .wp-block-button.is-style-outline .wp-block-button__link:hover { color: #d1e4dd !important; } .has-text-color .wp-block-button.is-style-outline .wp-block-button__link:active { color: #d1e4dd !important; } .wp-block-button.is-style-outline .wp-block-button__link:focus { outline-offset: inherit; outline: inherit; } .wp-block-button.is-style-squared { border-radius: 0; } .is-style-outline .wp-block-button__link[style*=radius], .wp-block-button__link[style*=radius] { outline-offset: 2px; } .wp-block-code code { white-space: pre !important; overflow-x: auto; } .wp-block-code { border-color: #28303d; border-radius: 0; border-style: solid; border-width: 0.1rem; padding: 20px; color: currentColor; } .wp-block-cover, .wp-block-cover-image { background-color: #000; min-height: 450px; margin-top: inherit; margin-bottom: inherit; } .wp-block-cover:not(.alignwide):not(.alignfull), .wp-block-cover-image:not(.alignwide):not(.alignfull) { clear: both; } [data-align=full] .wp-block-cover, [data-align=full] .wp-block-cover-image { margin-top: 0; margin-bottom: 0; } .wp-block-cover > .wp-block-cover__inner-container > *:first-child, .wp-block-cover-image > .wp-block-cover__inner-container > *:first-child { margin-top: 0; } .wp-block-cover > .wp-block-cover__inner-container > *:last-child:not(.block-list-appender), .wp-block-cover-image > .wp-block-cover__inner-container > *:last-child:not(.block-list-appender) { margin-bottom: 0; } .wp-block-cover.has-child-selected > .wp-block-cover__inner-container > *:nth-last-child(2), .wp-block-cover.is-selected > .wp-block-cover__inner-container > *:nth-last-child(2), .wp-block-cover-image.has-child-selected > .wp-block-cover__inner-container > *:nth-last-child(2), .wp-block-cover-image.is-selected > .wp-block-cover__inner-container > *:nth-last-child(2) { margin-bottom: 0; } .wp-block-cover .wp-block-cover__inner-container, .wp-block-cover .wp-block-cover-image-text, .wp-block-cover .wp-block-cover-text, .wp-block-cover .block-editor-block-list__block, .wp-block-cover-image .wp-block-cover__inner-container, .wp-block-cover-image .wp-block-cover-image-text, .wp-block-cover-image .wp-block-cover-text, .wp-block-cover-image .block-editor-block-list__block, .wp-block-cover .wp-block-cover__inner-container a, .wp-block-cover .wp-block-cover-image-text a, .wp-block-cover .wp-block-cover-text a, .wp-block-cover .block-editor-block-list__block a, .wp-block-cover-image .wp-block-cover__inner-container a, .wp-block-cover-image .wp-block-cover-image-text a, .wp-block-cover-image .wp-block-cover-text a, .wp-block-cover-image .block-editor-block-list__block a { color: currentColor; } .wp-block-cover .wp-block-cover__inner-container .has-link-color a, .wp-block-cover .wp-block-cover-image-text .has-link-color a, .wp-block-cover .wp-block-cover-text .has-link-color a, .wp-block-cover .block-editor-block-list__block .has-link-color a, .wp-block-cover-image .wp-block-cover__inner-container .has-link-color a, .wp-block-cover-image .wp-block-cover-image-text .has-link-color a, .wp-block-cover-image .wp-block-cover-text .has-link-color a, .wp-block-cover-image .block-editor-block-list__block .has-link-color a { color: #28303d; } .wp-block-cover:not([class*=background-color]) .wp-block-cover__inner-container { color: #fff; } .wp-block-cover:not([class*=background-color]) .wp-block-cover-image-text { color: #fff; } .wp-block-cover:not([class*=background-color]) .wp-block-cover-text { color: #fff; } .wp-block-cover:not([class*=background-color]) .block-editor-block-list__block { color: #fff; } .wp-block-cover-image:not([class*=background-color]) .wp-block-cover__inner-container { color: #fff; } .wp-block-cover-image:not([class*=background-color]) .wp-block-cover-image-text { color: #fff; } .wp-block-cover-image:not([class*=background-color]) .wp-block-cover-text { color: #fff; } .wp-block-cover-image:not([class*=background-color]) .block-editor-block-list__block { color: #fff; } .wp-block-cover h2 { font-size: 2.25rem; letter-spacing: normal; line-height: 1.3; padding: 0; max-width: inherit; text-align: inherit; } @media only screen and (min-width: 652px) { .wp-block-cover h2 { font-size: 3rem; } } .wp-block-cover-image h2 { font-size: 2.25rem; letter-spacing: normal; line-height: 1.3; padding: 0; max-width: inherit; text-align: inherit; } @media only screen and (min-width: 652px) { .wp-block-cover-image h2 { font-size: 3rem; } } .wp-block-cover h2.has-text-align-left, .wp-block-cover-image h2.has-text-align-left { text-align: left; } .wp-block-cover h2.has-text-align-center, .wp-block-cover-image h2.has-text-align-center { text-align: center; } .wp-block-cover h2.has-text-align-right, .wp-block-cover-image h2.has-text-align-right { text-align: right; } .wp-block-cover.is-style-twentytwentyone-border, .wp-block-cover-image.is-style-twentytwentyone-border { border: 3px solid #28303d; } .wp-block-cover[class*=-background-color][class] .wp-block-cover__inner-container, .wp-block-cover-image[class*=-background-color][class] .wp-block-cover__inner-container { background-color: unset; } .wp-block-columns:not(.alignwide):not(.alignfull) { clear: both; } .wp-block-columns .wp-block, .wp-block-columns .wp-block-column { max-width: inherit; } .wp-block-columns > .wp-block-column > *:first-child { margin-top: 0; } .wp-block-columns > .wp-block-column > *:last-child:not(.block-list-appender) { margin-bottom: 0; } .wp-block-columns.has-child-selected > .wp-block-column > *:nth-last-child(2), .wp-block-columns.is-selected > .wp-block-column > *:nth-last-child(2) { margin-bottom: 0; } @media only screen and (min-width: 652px) { .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) { margin-left: -50px; margin-top: 63px; z-index: 2; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > p:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h1:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h2:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h3:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h4:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h5:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h6:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ul:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ol:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > pre:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ul:not(.has-background) { padding-left: 50px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ol:not(.has-background) { padding-left: 50px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n).is-vertically-aligned-center { margin-top: 0; } } .wp-block[data-align=full] > .wp-block-columns p:not(.has-background) { padding-left: 20px; padding-right: 20px; } .wp-block[data-align=full] > .wp-block-columns h1:not(.has-background) { padding-left: 20px; padding-right: 20px; } .wp-block[data-align=full] > .wp-block-columns h2:not(.has-background) { padding-left: 20px; padding-right: 20px; } .wp-block[data-align=full] > .wp-block-columns h3:not(.has-background) { padding-left: 20px; padding-right: 20px; } .wp-block[data-align=full] > .wp-block-columns h4:not(.has-background) { padding-left: 20px; padding-right: 20px; } .wp-block[data-align=full] > .wp-block-columns h5:not(.has-background) { padding-left: 20px; padding-right: 20px; } .wp-block[data-align=full] > .wp-block-columns h6:not(.has-background) { padding-left: 20px; padding-right: 20px; } .wp-block-file .wp-block-file__textlink { text-decoration: underline; text-decoration-style: solid; text-decoration-thickness: 1px; } .wp-block-file .wp-block-file__textlink:hover { text-decoration: underline; text-decoration-style: dotted; } .wp-block-file .wp-block-file__button { border: 3px solid transparent; border-radius: 0; cursor: pointer; font-weight: 500; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.25rem; line-height: 1.5; padding: 15px 30px; text-decoration: none; display: inline-block; } .wp-block-file .wp-block-file__button:not(:hover):not(:active):not(.has-text-color) { color: #d1e4dd; } .has-background .wp-block-file .wp-block-file__button:not(:hover):not(:active):not(.has-text-color) { color: #28303d; } .has-background .wp-block-file .wp-block-file__button:not(:hover):not(:active):not(.has-text-color).has-background { color: #28303d; } .wp-block-file .wp-block-file__button:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .has-background .wp-block-file .wp-block-file__button:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .wp-block-file .wp-block-file__button:hover, .wp-block-file .wp-block-file__button:active { background-color: transparent; border-color: currentColor; color: inherit; } .wp-block-file .wp-block-file__button:focus { outline-offset: -6px; outline: 2px dotted currentColor; } .wp-block-file .wp-block-file__button:disabled { background-color: rgba(255, 255, 255, 0.5); border-color: rgba(255, 255, 255, 0.5); color: #39414d; } .wp-block-file .wp-block-file__button:focus { outline-offset: inherit; outline: inherit; } .wp-block-gallery figcaption { margin-bottom: 0; } .wp-block-gallery figcaption a { color: #fff; } .wp-block-group { display: block; clear: both; display: flow-root; } .wp-block-group:before, .wp-block-group:after { content: ""; display: block; clear: both; } .wp-block-group.has-background { padding: 30px; } [data-align=full] .wp-block-group.has-background { margin-top: 0; margin-bottom: 0; } .wp-block-group.is-style-twentytwentyone-border { border: 3px solid #28303d; padding: 30px; } .wp-block-group.is-style-twentytwentyone-border .wp-block-group__inner-container > [data-align=full] { max-width: calc(100% + 60px); width: calc(100% + 60px); margin-left: -30px; } .wp-block-group > .wp-block-group__inner-container > *:first-child { margin-top: 0; } .wp-block-group > .wp-block-group__inner-container > *:last-child:not(.block-list-appender) { margin-bottom: 0; } .wp-block-group.has-child-selected > .wp-block-group__inner-container > *:nth-last-child(2), .wp-block-group.is-selected > .wp-block-group__inner-container > *:nth-last-child(2) { margin-bottom: 0; } .wp-block-group .wp-block-group.has-background > .block-editor-block-list__layout > [data-align=full] { margin: 0; width: 100%; } .wp-block-heading h1, h1, .h1, .wp-block-heading h2, h2, .h2, .wp-block-heading h3, h3, .h3, .wp-block-heading h4, h4, .h4, .wp-block-heading h5, h5, .h5, .wp-block-heading h6, h6, .h6 { clear: both; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-weight: normal; } .wp-block-heading h1 strong, h1 strong, .h1 strong, .wp-block-heading h2 strong, h2 strong, .h2 strong, .wp-block-heading h3 strong, h3 strong, .h3 strong, .wp-block-heading h4 strong, h4 strong, .h4 strong, .wp-block-heading h5 strong, h5 strong, .h5 strong, .wp-block-heading h6 strong, h6 strong, .h6 strong { font-weight: 600; } .wp-block-heading h1[style*="--wp--typography--line-height"] { line-height: 1.7; } h1[style*="--wp--typography--line-height"] { line-height: 1.7; } .h1[style*="--wp--typography--line-height"] { line-height: 1.7; } .wp-block-heading h2[style*="--wp--typography--line-height"] { line-height: 1.7; } h2[style*="--wp--typography--line-height"] { line-height: 1.7; } .h2[style*="--wp--typography--line-height"] { line-height: 1.7; } .wp-block-heading h3[style*="--wp--typography--line-height"] { line-height: 1.7; } h3[style*="--wp--typography--line-height"] { line-height: 1.7; } .h3[style*="--wp--typography--line-height"] { line-height: 1.7; } .wp-block-heading h4[style*="--wp--typography--line-height"] { line-height: 1.7; } h4[style*="--wp--typography--line-height"] { line-height: 1.7; } .h4[style*="--wp--typography--line-height"] { line-height: 1.7; } .wp-block-heading h5[style*="--wp--typography--line-height"] { line-height: 1.7; } h5[style*="--wp--typography--line-height"] { line-height: 1.7; } .h5[style*="--wp--typography--line-height"] { line-height: 1.7; } .wp-block-heading h6[style*="--wp--typography--line-height"] { line-height: 1.7; } h6[style*="--wp--typography--line-height"] { line-height: 1.7; } .h6[style*="--wp--typography--line-height"] { line-height: 1.7; } .wp-block-heading h1 { font-size: 4rem; letter-spacing: normal; line-height: 1.1; } @media only screen and (min-width: 652px) { .wp-block-heading h1 { font-size: 6rem; } } h1 { font-size: 4rem; letter-spacing: normal; line-height: 1.1; } @media only screen and (min-width: 652px) { h1 { font-size: 6rem; } } .h1 { font-size: 4rem; letter-spacing: normal; line-height: 1.1; } @media only screen and (min-width: 652px) { .h1 { font-size: 6rem; } } .wp-block-heading h2 { font-size: 2.25rem; letter-spacing: normal; line-height: 1.3; } @media only screen and (min-width: 652px) { .wp-block-heading h2 { font-size: 3rem; } } h2 { font-size: 2.25rem; letter-spacing: normal; line-height: 1.3; } @media only screen and (min-width: 652px) { h2 { font-size: 3rem; } } .h2 { font-size: 2.25rem; letter-spacing: normal; line-height: 1.3; } @media only screen and (min-width: 652px) { .h2 { font-size: 3rem; } } .wp-block-heading h3 { font-size: 2rem; letter-spacing: normal; line-height: 1.3; } @media only screen and (min-width: 652px) { .wp-block-heading h3 { font-size: 2rem; } } h3 { font-size: 2rem; letter-spacing: normal; line-height: 1.3; } @media only screen and (min-width: 652px) { h3 { font-size: 2rem; } } .h3 { font-size: 2rem; letter-spacing: normal; line-height: 1.3; } @media only screen and (min-width: 652px) { .h3 { font-size: 2rem; } } .wp-block-heading h4, h4, .h4 { font-size: 1.5rem; font-weight: 600; letter-spacing: normal; line-height: 1.3; } .wp-block-heading h5, h5, .h5 { font-size: 1.125rem; font-weight: 600; letter-spacing: 0.05em; line-height: 1.3; } .wp-block-heading h6, h6, .h6 { font-size: 1rem; font-weight: 600; letter-spacing: 0.05em; line-height: 1.3; } [data-type="core/html"] textarea { color: #28303d; border-radius: 0; padding: 20px; } /* Center image block by default in the editor */ .wp-block-image, .wp-block-image > div:not(.components-placeholder) { text-align: center; } [data-type="core/image"] .block-editor-block-list__block-edit figure.is-resized { margin: 0 auto; } /* Block Styles */ .wp-block-image.is-style-twentytwentyone-border img, .wp-block-image.is-style-twentytwentyone-image-frame img { border: 3px solid #28303d; } .wp-block-image.is-style-twentytwentyone-image-frame img { padding: 20px; } .wp-block-latest-comments, .wp-block-latest-posts { padding-left: 0; } .wp-block-latest-posts:not(.is-grid) > li { margin-top: 50px; margin-bottom: 50px; } .wp-block-latest-posts:not(.is-grid) > li:first-child { margin-top: 0; } .wp-block-latest-posts:not(.is-grid) > li:last-child { margin-bottom: 0; } .wp-block-latest-posts.is-grid { word-wrap: break-word; word-break: break-word; } .wp-block-latest-posts.is-grid > li { margin-bottom: 30px; } .wp-block-latest-posts.is-grid > li:last-child { margin-bottom: 0; } .wp-block-latest-posts > li > * { margin-top: 10px; margin-bottom: 10px; } .wp-block-latest-posts > li > *:first-child { margin-top: 0; } .wp-block-latest-posts > li > *:last-child { margin-bottom: 0; } .wp-block-latest-posts > li > a { display: inline-block; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 2rem; font-weight: normal; line-height: 1.3; margin-bottom: 10px; } @media only screen and (min-width: 652px) { .wp-block-latest-posts > li > a { font-size: 2rem; } } .wp-block-latest-posts .wp-block-latest-posts__post-author { color: #28303d; font-size: 1.25rem; line-height: 1.7; } .wp-block-latest-posts .wp-block-latest-posts__post-date { color: #28303d; font-size: 1rem; line-height: 1.7; } [class*=inner-container] .wp-block-latest-posts .wp-block-latest-posts__post-date, .has-background .wp-block-latest-posts .wp-block-latest-posts__post-date { color: currentColor; } .wp-block-latest-posts .wp-block-latest-posts__post-excerpt, .wp-block-latest-posts .wp-block-latest-posts__post-full-content { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.125rem; line-height: 1.7; margin-top: 20px; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers { border-top: 3px solid #28303d; border-bottom: 3px solid #28303d; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers:not(.is-grid) > li { padding-bottom: 30px; border-bottom: 1px solid #28303d; margin-top: 30px; margin-bottom: 30px; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers > li { padding-bottom: 30px; border-bottom: 1px solid #28303d; margin-top: 30px; margin-bottom: 30px; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers:not(.is-grid) > li:last-child, .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers > li:last-child { padding-bottom: 0; border-bottom: none; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid { box-shadow: inset 0 -1px 0 0 #28303d; border-bottom: 2px solid #28303d; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid li { margin: 0; padding-top: 30px; padding-right: 25px; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid li:last-child { padding-bottom: 30px; } @media screen and (min-width: 600px) { .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-2 li { width: 50%; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-3 li { width: 33%; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-4 li { width: 25%; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-5 li { width: 20%; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-6 li { width: 17%; } } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders li { border: 3px solid #28303d; padding: 30px 25px; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders li:last-child { padding-bottom: 30px; margin-bottom: 30px; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders:not(.is-grid) li { margin-top: 25px; margin-bottom: 25px; } .gallery-item { display: inline-block; text-align: center; vertical-align: top; width: 100%; } .gallery-columns-2 .gallery-item { max-width: 50%; } .gallery-columns-3 .gallery-item { max-width: 33.33%; } .gallery-columns-4 .gallery-item { max-width: 25%; } .gallery-columns-5 .gallery-item { max-width: 20%; } .gallery-columns-6 .gallery-item { max-width: 16.66%; } .gallery-columns-7 .gallery-item { max-width: 14.28%; } .gallery-columns-8 .gallery-item { max-width: 12.5%; } .gallery-columns-9 .gallery-item { max-width: 11.11%; } .gallery-caption { display: block; } ul, ol { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; margin: 30px 0; padding-left: 50px; } ul.aligncenter, ol.aligncenter { list-style-position: inside; padding: 0; text-align: center; } ul.alignright, ol.alignright { list-style-position: inside; padding: 0; text-align: right; } li > ul, li > ol { margin: 0; } dt { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-weight: bold; } [data-align=full] .wp-block-media-text { margin-top: 0; margin-bottom: 0; } .wp-block-media-text > .wp-block-media-text__content > *:first-child { margin-top: 0; } .wp-block-media-text > .wp-block-media-text__content > *:last-child:not(.block-list-appender) { margin-bottom: 0; } .wp-block-media-text.has-child-selected > .wp-block-media-text__content > *:nth-last-child(2), .wp-block-media-text.is-selected > .wp-block-media-text__content > *:nth-last-child(2) { margin-bottom: 0; } .wp-block-media-text .wp-block-media-text__content { padding: 25px; } .wp-block-media-text.is-style-twentytwentyone-border { border: 3px solid #28303d; } .wp-block-navigation .wp-block-navigation__container { background: #d1e4dd; padding: 0; } .wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__content { padding: 13px; } .wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__label { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.25rem; font-weight: normal; } .wp-block-navigation .has-child .wp-block-navigation__container { box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.2); } .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:hover { color: #28303d; } .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:focus { color: #28303d; } .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link__content { color: currentColor; } p { line-height: 1.7; } p.has-background { padding: 20px; } pre.wp-block-preformatted { overflow-x: auto; white-space: pre !important; font-size: 1rem; } .wp-block-pullquote { padding: 40px 0; text-align: center; border-width: 3px; border-bottom-style: solid; border-top-style: solid; color: currentColor; border-color: currentColor; position: relative; } .wp-block-pullquote blockquote::before { color: currentColor; content: "“"; display: block; position: relative; left: 0; font-size: 3rem; font-weight: 500; line-height: 1; } .wp-block-pullquote p { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 2rem; font-style: normal; font-weight: 700; letter-spacing: normal; line-height: 1.3; margin: 0; } @media only screen and (min-width: 652px) { .wp-block-pullquote p { font-size: 2rem; } } .wp-block-pullquote a { color: currentColor; } .wp-block-pullquote .wp-block-pullquote__citation, .wp-block-pullquote cite, .wp-block-pullquote footer { font-size: 1rem; font-style: normal; text-transform: none; } .wp-block-pullquote:not(.is-style-solid-color) { background: none; } .wp-block-pullquote.is-style-solid-color { margin-left: auto; margin-right: auto; padding: 50px; border-width: 3px; border-style: solid; border-color: #28303d; } @media (min-width: 600px) { .wp-block-pullquote.is-style-solid-color { padding: 100px; } } .wp-block-pullquote.is-style-solid-color blockquote::before { text-align: left; } .wp-block-pullquote.is-style-solid-color.alignleft blockquote, .wp-block-pullquote.is-style-solid-color.alignright blockquote { padding-left: 20px; padding-right: 20px; max-width: inherit; } .wp-block-pullquote.is-style-solid-color blockquote { margin: 0; max-width: 100%; } .wp-block-pullquote.is-style-solid-color blockquote p { font-size: 2rem; } @media only screen and (min-width: 652px) { .wp-block-pullquote.is-style-solid-color blockquote p { font-size: 2rem; } } .wp-block-pullquote.is-style-solid-color .wp-block-pullquote__citation, .wp-block-pullquote.is-style-solid-color cite, .wp-block-pullquote.is-style-solid-color footer { color: currentColor; } .wp-block[data-align=full] .wp-block-pullquote:not(.is-style-solid-color) blockquote { padding: 0 40px; } .wp-block[data-align=left] .wp-block-pullquote.is-style-solid-color { padding: 20px; } .wp-block[data-align=right] .wp-block-pullquote.is-style-solid-color { padding: 20px; } .wp-block-query.has-background { padding: 20px; } @media only screen and (min-width: 482px) { .wp-block-query.has-background { padding: 30px; } } .wp-block-quote { position: relative; border-left: none; margin: 30px auto 30px 25px; } .wp-block-quote p { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.25rem; font-style: normal; font-weight: 700; line-height: 1.7; } .wp-block-quote strong { font-weight: bolder; } .wp-block-quote:before { content: "“"; font-size: 1.25rem; line-height: 1.7; left: -12px; } .wp-block-quote .wp-block-quote__citation { color: #28303d; font-size: 1rem; font-style: normal; } .has-background .wp-block-quote .wp-block-quote__citation, [class*=background-color] .wp-block-quote .wp-block-quote__citation, [style*=background-color] .wp-block-quote .wp-block-quote__citation, .wp-block-cover[style*=background-image] .wp-block-quote .wp-block-quote__citation { color: currentColor; } .wp-block-quote.has-text-align-right { margin: 30px 25px 30px auto; padding-right: 0; border-right: none; } .wp-block-quote.has-text-align-right:before { display: none; } .wp-block-quote.has-text-align-right p:before { content: "”"; font-size: 1.25rem; font-weight: normal; line-height: 1.7; margin-right: 5px; } .wp-block-quote.has-text-align-center { margin: 30px auto; } .wp-block-quote.has-text-align-center:before { display: none; } .wp-block-quote.is-large, .wp-block-quote.is-style-large { padding-left: 0; /* Resetting margins to match _block-container.scss */ margin-top: 30px; margin-bottom: 30px; } .wp-block-quote.is-large p { font-size: 2.25rem; font-style: normal; line-height: 1.35; } @media only screen and (min-width: 652px) { .wp-block-quote.is-large p { font-size: 2.5rem; } } .wp-block-quote.is-style-large p { font-size: 2.25rem; font-style: normal; line-height: 1.35; } @media only screen and (min-width: 652px) { .wp-block-quote.is-style-large p { font-size: 2.5rem; } } .wp-block-quote.is-large:before { font-size: 2.25rem; line-height: 1.35; left: -25px; } @media only screen and (min-width: 652px) { .wp-block-quote.is-large:before { font-size: 2.5rem; } } .wp-block-quote.is-style-large:before { font-size: 2.25rem; line-height: 1.35; left: -25px; } @media only screen and (min-width: 652px) { .wp-block-quote.is-style-large:before { font-size: 2.5rem; } } .wp-block-quote.is-large.has-text-align-right:before, .wp-block-quote.is-style-large.has-text-align-right:before { display: none; } .wp-block-quote.is-large.has-text-align-right p:before { content: "”"; font-size: 2.25rem; font-weight: normal; line-height: 1.35; margin-right: 10px; } @media only screen and (min-width: 652px) { .wp-block-quote.is-large.has-text-align-right p:before { font-size: 2.5rem; } } .wp-block-quote.is-style-large.has-text-align-right p:before { content: "”"; font-size: 2.25rem; font-weight: normal; line-height: 1.35; margin-right: 10px; } @media only screen and (min-width: 652px) { .wp-block-quote.is-style-large.has-text-align-right p:before { font-size: 2.5rem; } } @media only screen and (max-width: 481px) { .wp-block-quote.is-large, .wp-block-quote.is-style-large { padding-left: 25px; } .wp-block-quote.is-large:before, .wp-block-quote.is-style-large:before { left: 0; } .wp-block-quote.is-large.has-text-align-right, .wp-block-quote.is-style-large.has-text-align-right { padding-left: 0; padding-right: 25px; } .wp-block-quote.is-large.has-text-align-right:before, .wp-block-quote.is-style-large.has-text-align-right:before { right: 0; } } @media only screen and (max-width: 481px) { .wp-block-quote { padding-left: 13px; } .wp-block-quote:before { left: 0; } .wp-block-quote.has-text-align-right { padding-left: 0; padding-right: 13px; } .wp-block-quote.has-text-align-right:before { right: 0; } .wp-block-quote.has-text-align-center { padding-left: 0; padding-right: 0; } } @media only screen and (min-width: 482px) { .wp-block-quote { margin-left: auto; } .wp-block-quote.has-text-align-right { margin-right: auto; } } .wp-block-rss { padding-left: 0; } .wp-block-rss > li { list-style: none; } .wp-block-rss:not(.is-grid) > li { margin-top: 50px; margin-bottom: 50px; } .wp-block-rss:not(.is-grid) > li:first-child { margin-top: 0; } .wp-block-rss:not(.is-grid) > li:last-child { margin-bottom: 0; } .wp-block-rss.is-grid > li { margin-bottom: 30px; } .wp-block-rss.is-grid > li:last-child { margin-bottom: 0; } .wp-block-rss.is-grid.columns-2 > li:nth-last-child(-n+2):nth-child(2n+1), .wp-block-rss.is-grid.columns-2 > li:nth-last-child(-n+2):nth-child(2n+1) ~ li, .wp-block-rss.is-grid.columns-3 > li:nth-last-child(-n+3):nth-child(3n+1), .wp-block-rss.is-grid.columns-3 > li:nth-last-child(-n+3):nth-child(3n+1) ~ li, .wp-block-rss.is-grid.columns-4 > li:nth-last-child(-n+4):nth-child(4n+1), .wp-block-rss.is-grid.columns-4 > li:nth-last-child(-n+4):nth-child(4n+1) ~ li, .wp-block-rss.is-grid.columns-5 > li:nth-last-child(-n+5):nth-child(5n+1), .wp-block-rss.is-grid.columns-5 > li:nth-last-child(-n+5):nth-child(5n+1) ~ li, .wp-block-rss.is-grid.columns-6 > li:nth-last-child(-n+6):nth-child(6n+1), .wp-block-rss.is-grid.columns-6 > li:nth-last-child(-n+6):nth-child(6n+1) ~ li { margin-bottom: 0; } .wp-block-rss > li > * { margin-top: 10px; margin-bottom: 10px; } .wp-block-rss > li > *:first-child { margin-top: 0; } .wp-block-rss > li > *:last-child { margin-bottom: 0; } .wp-block-rss .wp-block-rss__item-title > a { display: inline-block; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 2rem; font-weight: normal; line-height: 1.3; margin-bottom: 10px; } @media only screen and (min-width: 652px) { .wp-block-rss .wp-block-rss__item-title > a { font-size: 2rem; } } .wp-block-rss .wp-block-rss__item-author { color: #28303d; font-size: 1.25rem; line-height: 1.7; } .wp-block-rss .wp-block-rss__item-publish-date { color: #28303d; font-size: 1rem; line-height: 1.7; } [class*=inner-container] .wp-block-rss .wp-block-rss__item-publish-date, .has-background .wp-block-rss .wp-block-rss__item-publish-date { color: currentColor; } .wp-block-rss .wp-block-rss__item-excerpt, .wp-block-rss .wp-block-rss__item-full-content { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.125rem; line-height: 1.7; margin-top: 20px; } .wp-block-rss.alignfull { padding-left: 20px; padding-right: 20px; } .entry-content [class*=inner-container] .wp-block-rss.alignfull, .entry-content .has-background .wp-block-rss.alignfull { padding-left: 0; padding-right: 0; } .wp-block-search { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .wp-block-search { max-width: min(calc(100vw - 100px), 610px); } } @media only screen and (min-width: 822px) { .wp-block-search { max-width: min(calc(100vw - 200px), 610px); } } .wp-block-search .wp-block-search__label { font-size: 1.125rem; font-weight: 500; margin-bottom: 10px; } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper, .wp-block-search .wp-block-search__input { border: 3px solid #39414d; border-radius: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.125rem; line-height: 1.7; max-width: inherit; margin-right: -3px; padding: 10px; } .is-dark-theme .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper, .is-dark-theme .wp-block-search .wp-block-search__input { background: rgba(255, 255, 255, 0.9); } .has-background .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper, .has-background .wp-block-search .wp-block-search__input { border-color: #28303d !important; } .wp-block-search .wp-block-search__button.wp-block-search__button { border: 3px solid transparent; border-radius: 0; cursor: pointer; font-weight: 500; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.25rem; line-height: 1.5; padding: 15px 30px; text-decoration: none; box-shadow: none; margin-left: 0; } .wp-block-search .wp-block-search__button.wp-block-search__button:not(:hover):not(:active):not(.has-text-color) { color: #d1e4dd; } .has-background .wp-block-search .wp-block-search__button.wp-block-search__button:not(:hover):not(:active):not(.has-text-color) { color: #28303d; } .has-background .wp-block-search .wp-block-search__button.wp-block-search__button:not(:hover):not(:active):not(.has-text-color).has-background { color: #28303d; } .wp-block-search .wp-block-search__button.wp-block-search__button:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .has-background .wp-block-search .wp-block-search__button.wp-block-search__button:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .wp-block-search .wp-block-search__button.wp-block-search__button:hover, .wp-block-search .wp-block-search__button.wp-block-search__button:active { background-color: transparent; border-color: currentColor; color: inherit; } .wp-block-search .wp-block-search__button.wp-block-search__button:focus { outline-offset: -6px; outline: 2px dotted currentColor; } .wp-block-search .wp-block-search__button.wp-block-search__button:disabled { background-color: rgba(255, 255, 255, 0.5); border-color: rgba(255, 255, 255, 0.5); color: #39414d; } .wp-block-search .wp-block-search__button.wp-block-search__button.has-icon { padding: 6px 15px; display: inherit; } .wp-block-search .wp-block-search__button.wp-block-search__button.has-icon svg { width: 40px; height: 40px; } .has-background .wp-block-search .wp-block-search__button.wp-block-search__button:hover { background-color: #d1e4dd !important; color: #28303d !important; } .has-background .wp-block-search .wp-block-search__button.wp-block-search__button:active { background-color: #d1e4dd !important; color: #28303d !important; } .has-text-color .wp-block-search .wp-block-search__button.wp-block-search__button:hover { color: #28303d !important; } .has-text-color .wp-block-search .wp-block-search__button.wp-block-search__button:active { color: #28303d !important; } .wp-block-search .wp-block-search__button.wp-block-search__button:focus { outline-offset: inherit; outline: inherit; } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper { padding: 3px; } .wp-block-search.wp-block-search__button-inside .wp-block-search__input { border: none; } .wp-block-search.wp-block-search__button-inside.wp-block-search__text-button .wp-block-search__button:hover { color: #28303d; } .wp-block-search.wp-block-search__button-inside.wp-block-search__icon-button .wp-block-search__button:hover { color: #28303d; } .is-dark-theme .wp-block-search.wp-block-search__button-inside.wp-block-search__text-button .wp-block-search__button, .is-dark-theme .wp-block-search.wp-block-search__button-inside.wp-block-search__icon-button .wp-block-search__button { color: #28303d; } .is-dark-theme .wp-block-search.wp-block-search__button-inside.wp-block-search__text-button .wp-block-search__button:hover { background-color: #28303d; color: #fff; } .is-dark-theme .wp-block-search.wp-block-search__button-inside.wp-block-search__icon-button .wp-block-search__button:hover { background-color: #28303d; color: #fff; } .wp-block-search.wp-block-search__button-inside.wp-block-search__text-button .wp-block-search__button { padding: 15px 30px; } .wp-block[data-align=center] > * { text-align: center; } .wp-block[data-align=center] .wp-block-search__button-only .wp-block-search__inside-wrapper { justify-content: center; } .wp-block-separator, hr { border-bottom: 1px solid #28303d; clear: both; opacity: 1; } .wp-block-separator[style*="text-align:right"] { border-right-color: #28303d; } .wp-block-separator[style*="text-align: right"] { border-right-color: #28303d; } hr[style*="text-align:right"] { border-right-color: #28303d; } hr[style*="text-align: right"] { border-right-color: #28303d; } .wp-block-separator:not(.is-style-dots) { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .wp-block-separator:not(.is-style-dots) { max-width: min(calc(100vw - 100px), 610px); } } @media only screen and (min-width: 822px) { .wp-block-separator:not(.is-style-dots) { max-width: min(calc(100vw - 200px), 610px); } } hr:not(.is-style-dots) { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { hr:not(.is-style-dots) { max-width: min(calc(100vw - 100px), 610px); } } @media only screen and (min-width: 822px) { hr:not(.is-style-dots) { max-width: min(calc(100vw - 200px), 610px); } } [data-align=full] > .wp-block-separator, [data-align=wide] > .wp-block-separator, [data-align=full] > hr, [data-align=wide] > hr { max-width: inherit; } .wp-block-separator.is-style-twentytwentyone-separator-thick, hr.is-style-twentytwentyone-separator-thick { border-bottom-width: 3px; } .wp-block-separator.is-style-dots, hr.is-style-dots { border-bottom: none; } .wp-block-separator.is-style-dots.has-background, .wp-block-separator.is-style-dots.has-text-color, hr.is-style-dots.has-background, hr.is-style-dots.has-text-color { background-color: transparent !important; } .wp-block-separator.is-style-dots.has-background:before, .wp-block-separator.is-style-dots.has-text-color:before, hr.is-style-dots.has-background:before, hr.is-style-dots.has-text-color:before { color: currentColor !important; } .wp-block-separator.is-style-dots:before { color: #28303d; } hr.is-style-dots:before { color: #28303d; } .has-background .wp-block-separator, [class*=background-color] .wp-block-separator, [style*=background-color] .wp-block-separator, .wp-block-cover[style*=background-image] .wp-block-separator, .has-background hr, [class*=background-color] hr, [style*=background-color] hr, .wp-block-cover[style*=background-image] hr { border-color: currentColor; } .wp-block-social-links [data-block] { margin-top: 0; margin-bottom: 0; } .wp-block-social-links.is-style-twentytwentyone-social-icons-color button { color: #28303d; } .wp-block-social-links.is-style-twentytwentyone-social-icons-color .wp-social-link { background: none; } table thead, table tfoot, .wp-block-table thead, .wp-block-table tfoot { text-align: center; } table th, .wp-block-table th { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; } table td, table th, .wp-block-table td, .wp-block-table th { padding: 10px; } table.is-style-regular .has-background, table.is-style-stripes .has-background, table.is-style-stripes .has-background thead tr, table.is-style-stripes .has-background tfoot tr, table.is-style-stripes .has-background tbody tr, .wp-block-table.is-style-regular .has-background, .wp-block-table.is-style-stripes .has-background, .wp-block-table.is-style-stripes .has-background thead tr, .wp-block-table.is-style-stripes .has-background tfoot tr, .wp-block-table.is-style-stripes .has-background tbody tr { color: #28303d; } table.is-style-stripes, .wp-block-table.is-style-stripes { border-color: #f0f0f0; } table.is-style-stripes th, table.is-style-stripes td, .wp-block-table.is-style-stripes th, .wp-block-table.is-style-stripes td { border-width: 0; } table.is-style-stripes tbody tr:nth-child(odd) { background-color: #f0f0f0; } .wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background-color: #f0f0f0; } table.is-style-stripes .has-background tbody tr:nth-child(odd) { background-color: rgba(255, 255, 255, 0.9); } .wp-block-table.is-style-stripes .has-background tbody tr:nth-child(odd) { background-color: rgba(255, 255, 255, 0.9); } table.wp-calendar-table td, table.wp-calendar-table th { background: transparent; border: 0; text-align: center; line-height: 2; vertical-align: middle; } table.wp-calendar-table th { font-weight: bold; } table.wp-calendar-table thead, table.wp-calendar-table tbody { color: currentColor; border: 1px solid; } table.wp-calendar-table caption { font-weight: bold; text-align: left; margin-bottom: 20px; color: currentColor; } .wp-calendar-nav { text-align: left; margin-top: 10px; } .wp-calendar-nav svg { height: 1em; vertical-align: middle; } .wp-calendar-nav svg path { fill: currentColor; } .wp-calendar-nav .wp-calendar-nav-next { float: right; } .wp-block-tag-cloud.aligncenter { text-align: center; } pre.wp-block-verse { padding: 0; color: currentColor; } :root .is-extra-small-text { font-size: 1rem; } :root .has-extra-small-font-size { font-size: 1rem; } :root .is-small-text { font-size: 1.125rem; } :root .has-small-font-size { font-size: 1.125rem; } :root .is-regular-text { font-size: 1.25rem; } :root .has-regular-font-size { font-size: 1.25rem; } :root .is-normal-font-size { font-size: 1.25rem; } :root .has-normal-font-size { font-size: 1.25rem; } :root .has-medium-font-size { font-size: 1.25rem; } :root .is-large-text { font-size: 1.5rem; line-height: 1.3; } :root .has-large-font-size { font-size: 1.5rem; line-height: 1.3; } :root .is-larger-text { font-size: 2.5rem; line-height: 1.3; } @media only screen and (min-width: 652px) { :root .is-larger-text { font-size: 2.5rem; } } :root .has-larger-font-size { font-size: 2.5rem; line-height: 1.3; } @media only screen and (min-width: 652px) { :root .has-larger-font-size { font-size: 2.5rem; } } :root .is-extra-large-text { font-size: 2.5rem; line-height: 1.3; } @media only screen and (min-width: 652px) { :root .is-extra-large-text { font-size: 2.5rem; } } :root .has-extra-large-font-size { font-size: 2.5rem; line-height: 1.3; } @media only screen and (min-width: 652px) { :root .has-extra-large-font-size { font-size: 2.5rem; } } :root .is-huge-text { font-size: 6rem; line-height: 1.3; font-weight: 300; } @media only screen and (min-width: 652px) { :root .is-huge-text { font-size: 6rem; } } :root .has-huge-font-size { font-size: 6rem; line-height: 1.3; font-weight: 300; } @media only screen and (min-width: 652px) { :root .has-huge-font-size { font-size: 6rem; } } :root .is-gigantic-text { font-size: 9rem; line-height: 1.3; font-weight: 300; } @media only screen and (min-width: 652px) { :root .is-gigantic-text { font-size: 9rem; } } :root .has-gigantic-font-size { font-size: 9rem; line-height: 1.3; font-weight: 300; } @media only screen and (min-width: 652px) { :root .has-gigantic-font-size { font-size: 9rem; } } /** * Editor Post Title * - Needs a special styles */ .wp-block.editor-post-title__block { border-bottom: 3px solid #28303d; padding-bottom: 60px; margin-bottom: 90px; max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .wp-block.editor-post-title__block { max-width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .wp-block.editor-post-title__block { max-width: min(calc(100vw - 200px), 1240px); } } .wp-block.editor-post-title__block .editor-post-title__input { color: #39414d; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 4rem; font-weight: 300; line-height: 1.1; } @media only screen and (min-width: 652px) { .wp-block.editor-post-title__block .editor-post-title__input { font-size: 6rem; } } .wp-block.block-editor-default-block-appender > textarea { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.25rem; } .has-primary-color[class] { color: #28303d; } .has-secondary-color[class] { color: #39414d; } .has-primary-background-color[class] { background-color: #28303d; color: #d1e4dd; } .has-secondary-background-color[class] { background-color: #39414d; color: #d1e4dd; } .has-white-background-color[class] { color: #39414d; } .has-black-background-color[class] { color: #28303d; } [data-block] { margin-top: 30px; margin-bottom: 30px; } .wp-block { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .wp-block { max-width: min(calc(100vw - 100px), 610px); } } @media only screen and (min-width: 822px) { .wp-block { max-width: min(calc(100vw - 200px), 610px); } } .wp-block[data-align=wide] { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .wp-block[data-align=wide] { max-width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .wp-block[data-align=wide] { max-width: min(calc(100vw - 200px), 1240px); } } .wp-block.alignwide { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .wp-block.alignwide { max-width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .wp-block.alignwide { max-width: min(calc(100vw - 200px), 1240px); } } .wp-block[data-align=full], .wp-block.alignfull { max-width: none; } .alignleft { margin: 0; margin-right: 25px; } .alignright { margin: 0; margin-left: 25px; } .has-drop-cap:not(:focus)::first-letter { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-weight: normal; line-height: 0.66; text-transform: uppercase; font-style: normal; float: left; margin: 0.1em 0.1em 0 0; font-size: 5rem; } @media only screen and (min-width: 652px) { .has-drop-cap:not(:focus)::first-letter { font-size: 7rem; } } @media only screen and (min-width: 482px) { .wp-block[data-align=left] > * { max-width: 290px; margin-right: 25px; } .wp-block[data-align=right] > * { max-width: 290px; margin-left: 25px; } } .wp-block-freeform.block-library-rich-text__tinymce blockquote { border: none; } .wp-block-freeform.block-library-rich-text__tinymce blockquote:before { left: 5px; } html { line-height: 1.7; } html, body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; } body { background-color: #d1e4dd; font-size: 1.25rem; font-weight: normal; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } body, .wp-block a { color: #28303d; } .wp-block a:hover { text-decoration-style: dotted; } .wp-block a:focus { outline: 2px solid #28303d; text-decoration: none; } .has-background .has-link-color a, .has-background.has-link-color a { color: #28303d; } button, a { cursor: pointer; } .has-black-color[class] { color: #000; } .has-black-color[class] > [class*=__inner-container] { color: #000; } .has-gray-color[class] { color: #39414d; } .has-gray-color[class] > [class*=__inner-container] { color: #39414d; } .has-dark-gray-color[class] { color: #28303d; } .has-dark-gray-color[class] > [class*=__inner-container] { color: #28303d; } .has-green-color[class] { color: #d1e4dd; } .has-green-color[class] > [class*=__inner-container] { color: #d1e4dd; } .has-blue-color[class] { color: #d1dfe4; } .has-blue-color[class] > [class*=__inner-container] { color: #d1dfe4; } .has-purple-color[class] { color: #d1d1e4; } .has-purple-color[class] > [class*=__inner-container] { color: #d1d1e4; } .has-red-color[class] { color: #e4d1d1; } .has-red-color[class] > [class*=__inner-container] { color: #e4d1d1; } .has-orange-color[class] { color: #e4dad1; } .has-orange-color[class] > [class*=__inner-container] { color: #e4dad1; } .has-yellow-color[class] { color: #eeeadd; } .has-yellow-color[class] > [class*=__inner-container] { color: #eeeadd; } .has-white-color[class] { color: #fff; } .has-white-color[class] > [class*=__inner-container] { color: #fff; } .has-background a, .has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6 { color: currentColor; } .has-black-background-color[class] { background-color: #000; } .has-black-background-color[class] > [class*=__inner-container] { background-color: #000; } .has-dark-gray-background-color[class] { background-color: #28303d; } .has-dark-gray-background-color[class] > [class*=__inner-container] { background-color: #28303d; } .has-gray-background-color[class] { background-color: #39414d; } .has-gray-background-color[class] > [class*=__inner-container] { background-color: #39414d; } .has-light-gray-background-color[class] { background-color: #f0f0f0; } .has-light-gray-background-color[class] > [class*=__inner-container] { background-color: #f0f0f0; } .has-green-background-color[class] { background-color: #d1e4dd; } .has-green-background-color[class] > [class*=__inner-container] { background-color: #d1e4dd; } .has-blue-background-color[class] { background-color: #d1dfe4; } .has-blue-background-color[class] > [class*=__inner-container] { background-color: #d1dfe4; } .has-purple-background-color[class] { background-color: #d1d1e4; } .has-purple-background-color[class] > [class*=__inner-container] { background-color: #d1d1e4; } .has-red-background-color[class] { background-color: #e4d1d1; } .has-red-background-color[class] > [class*=__inner-container] { background-color: #e4d1d1; } .has-orange-background-color[class] { background-color: #e4dad1; } .has-orange-background-color[class] > [class*=__inner-container] { background-color: #e4dad1; } .has-yellow-background-color[class] { background-color: #eeeadd; } .has-yellow-background-color[class] > [class*=__inner-container] { background-color: #eeeadd; } .has-white-background-color[class] { background-color: #fff; } .has-white-background-color[class] > [class*=__inner-container] { background-color: #fff; } .has-background:not(.has-text-color).has-black-background-color[class] { color: #fff; } .has-background:not(.has-text-color).has-gray-background-color[class] { color: #fff; } .has-background:not(.has-text-color).has-dark-gray-background-color[class] { color: #fff; } .has-background:not(.has-text-color).has-black-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-gray-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-dark-gray-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-green-background-color[class] { color: #28303d; } .has-background:not(.has-text-color).has-blue-background-color[class] { color: #28303d; } .has-background:not(.has-text-color).has-purple-background-color[class] { color: #28303d; } .has-background:not(.has-text-color).has-red-background-color[class] { color: #28303d; } .has-background:not(.has-text-color).has-orange-background-color[class] { color: #28303d; } .has-background:not(.has-text-color).has-yellow-background-color[class] { color: #28303d; } .has-background:not(.has-text-color).has-white-background-color[class] { color: #28303d; } .has-background:not(.has-text-color).has-green-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-blue-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-purple-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-red-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-orange-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-yellow-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-white-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-purple-to-yellow-gradient-background { background: linear-gradient(160deg, #d1d1e4, #eeeadd); } .has-yellow-to-purple-gradient-background { background: linear-gradient(160deg, #eeeadd, #d1d1e4); } .has-green-to-yellow-gradient-background { background: linear-gradient(160deg, #d1e4dd, #eeeadd); } .has-yellow-to-green-gradient-background { background: linear-gradient(160deg, #eeeadd, #d1e4dd); } .has-red-to-yellow-gradient-background { background: linear-gradient(160deg, #e4d1d1, #eeeadd); } .has-yellow-to-red-gradient-background { background: linear-gradient(160deg, #eeeadd, #e4d1d1); } .has-purple-to-red-gradient-background { background: linear-gradient(160deg, #d1d1e4, #e4d1d1); } .has-red-to-purple-gradient-background { background: linear-gradient(160deg, #e4d1d1, #d1d1e4); } assets/css/style-dark-mode.css000064400000005420152377522560012370 0ustar00/* OS dark theme preference */ @media only screen { .is-dark-theme.is-dark-theme { --global--color-background: var(--global--color-dark-gray); --global--color-primary: var(--global--color-light-gray); --global--color-secondary: var(--global--color-light-gray); --button--color-text: var(--global--color-background); --button--color-text-hover: var(--global--color-secondary); --button--color-text-active: var(--global--color-secondary); --button--color-background: var(--global--color-secondary); --button--color-background-active: var(--global--color-background); --global--color-border: #9ea1a7; /* Block: Table */ --table--stripes-border-color: rgba(240, 240, 240, 0.15); --table--stripes-background-color: rgba(240, 240, 240, 0.15); } .is-dark-theme img { filter: brightness(0.85) contrast(1.1); } .respect-color-scheme-preference.is-dark-theme body { background-color: var(--global--color-background); } #dark-mode-toggler { cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: var(--global--font-size-xs); padding: 0.5em; min-height: 44px; min-width: max-content; border: 2px solid currentColor; box-shadow: none; background: var(--button--color-text); color: var(--button--color-background); z-index: 9998; } .no-js #dark-mode-toggler { display: none; } #dark-mode-toggler.fixed-bottom { position: fixed; bottom: 5px; right: 5px; } #dark-mode-toggler.fixed-bottom.hide:not(:focus) { bottom: -80px; } #dark-mode-toggler.relative { position: absolute; height: 44px; top: calc(2.4 * var(--global--spacing-vertical) - 44px); right: calc(50vw - var(--responsive--alignwide-width) / 2 - 0.5em); } .admin-bar #dark-mode-toggler.relative { top: calc(2.4 * var(--global--spacing-vertical) - 44px + 32px); } } @media only screen and (max-width: 782px) { .admin-bar #dark-mode-toggler.relative { top: calc(2.4 * var(--global--spacing-vertical) - 44px + 46px); } } @media only screen and (max-width: 481px) { .admin-bar #dark-mode-toggler.relative { top: calc(2.4 * var(--global--spacing-vertical) - 44px + 26px); } } @media only screen and (max-width: 481px) { body:not(.primary-navigation-open) #dark-mode-toggler.relative ~ nav { top: 88px; } } @media only screen { .primary-navigation-open #dark-mode-toggler { display: none; } } @media only screen { #dark-mode-toggler:hover, #dark-mode-toggler:focus { color: var(--button--color-background-active); border: 2px solid var(--button--color-text-active); background-color: var(--button--color-text-active); } } @media only screen { .is-IE #dark-mode-toggler { display: none; } } @media only screen and (prefers-reduced-motion: no-preference) { #dark-mode-toggler.fixed-bottom { transition: bottom 0.5s; } } assets/css/custom-color-overrides.css000064400000000202152377522560014006 0ustar00/** * Custom Color Overrides * * This file is automatically populated if the user chooses custom colors in the Customizer. */ assets/css/ie.css000064400000443115152377522560007773 0ustar00@charset "UTF-8"; /* Theme Name: Twenty Twenty-One Theme URI: https://wordpress.org/themes/twentytwentyone/ Author: the WordPress team Author URI: https://wordpress.org/ Description: Twenty Twenty-One is a blank canvas for your ideas and it makes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See how Twenty Twenty-One elevates your portfolio, business website, or personal blog. Requires at least: 5.3 Tested up to: 6.0 Requires PHP: 5.6 Version: 1.6 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: twentytwentyone Tags: one-column, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready Twenty Twenty-One WordPress Theme, (C) 2020 WordPress.org Twenty Twenty-One is distributed under the terms of the GNU GPL. */ /** * SETTINGS * File-header..........The file header for the themes style.css file. * Fonts................Any font files, if the project needs specific fonts. * Global...............Project-specific, globally available variables. * * TOOLS * Functions............Global functions. * Mixins...............Global mixins. * * GENERIC * Normalize.css........Normalise browser defaults. * Breakpoints..........Mixins and variables for responsive styles * Vertical-margins.....Vertical spacing for the main components. * Reset................Reset specific elements to make them easier to style in other contexts. * Clearings............Clearings for the main components. * * ELEMENTS * Blockquote...........Default blockquote. * Forms................Element-level form styling. * Headings.............H1–H6 * Links................Default links. * Lists................Default lists. * Media................Images, Figure, Figcaption, Embed, iFrame, Objects, Video. * * BLOCKS * Audio................Specific styles for the audio block. * Button...............Specific styles for the button block. * Code.................Specific styles for the code block. * Columns..............Specific styles for the columns block. * Cover................Specific styles for the cover block. * File.................Specific styles for the file block. * Gallery..............Specific styles for the gallery block. * Group................Specific styles for the group block. * Heading..............Specific styles for the heading block. * Image................Specific styles for the image block. * Latest comments......Specific styles for the latest comments block. * Latest posts.........Specific styles for the latest posts block. * Legacy...............Specific styles for the legacy gallery. * List.................Specific styles for the list block. * Media text...........Specific styles for the media and text block. * Navigation...........Specific styles for the navigation block. * Paragraph............Specific styles for the paragraph block. * Pullquote............Specific styles for the pullquote block. * Quote................Specific styles for the quote block. * Search...............Specific styles for the search block. * Separator............Specific styles for the separator block. * Spacer...............Specific styles for the spacer block. * Table................Specific styles for the table block. * Verse................Specific styles for the verse block. * Video................Specific styles for the video block. * Utilities............Block alignments. * * COMPONENTS * Header...............Header styles. * Footer...............Footer styles. * Comments.............Comment styles. * Archives.............Archive styles. * 404..................404 styles. * Search...............Search styles. * Navigation...........Navigation styles. * Footer Navigation....Footer Navigation styles. * Pagination...........Pagination styles. * Single...............Single page and post styles. * Posts and pages......Misc, sticky post styles. * Entry................Entry, author biography. * Widget...............Widget styles. * Editor...............Editor styles. * * UTILITIES * A11y.................Screen reader text, prefers reduced motion etc. * Color Palette........Classes for the color palette colors. * Editor Font Sizes....Editor Font Sizes. * Measure..............The width of a line of text, in characters. */ /* Categories 01 to 03 are the basics. */ /* Variables */ :root { /* Font Family */ /* Font Size */ /* Line Height */ /* Headings */ /* Block: Latest posts */ /* Colors */ /* Body text color, site title, footer text color. */ /* Headings */ /* Mint, default body background */ /* Used for borders (separators) */ /* Spacing */ /* Elevation */ /* Forms */ /* Cover block */ /* Buttons */ /* entry */ /* Header */ /* Main navigation */ /* Pagination */ /* Footer */ /* Block: Pull quote */ /* Block: Table */ /* Widgets */ /* Admin-bar height */ } /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ /* Document ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ html { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ } /* Sections ========================================================================== */ /** * Remove the margin in all browsers. */ body { margin: 0; } /** * Render the `main` element consistently in IE. */ main { display: block; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Firefox, and Safari. */ h1 { font-size: 2em; margin: 0.67em 0; } /* Grouping content ========================================================================== */ /** * 1. Add the correct box sizing in Firefox. * 2. Show the overflow in Edge and IE. */ hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ pre { font-family: monospace; /* 1 */ font-size: 1em; /* 2 */ } /* Text-level semantics ========================================================================== */ /** * Remove the gray background on active links in IE 10. */ a { background-color: transparent; text-decoration-thickness: 1px; } /** * 1. Remove the bottom border in Chrome 57- * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */ abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ text-decoration-style: dotted; /* 2 */ } /** * Add the correct font weight in Chrome, Edge, and Safari. */ b, strong { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp { font-family: monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` elements from affecting the line height in * all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* Embedded content ========================================================================== */ /** * Remove the border on images inside links in IE 10. */ img { border-style: none; } /* Forms ========================================================================== */ /** * 1. Change the font styles in all browsers. * 2. Remove the margin in Firefox and Safari. */ button, input, optgroup, select, textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ } /** * Show the overflow in IE. * 1. Show the overflow in Edge. */ button, input { /* 1 */ overflow: visible; } /** * Remove the inheritance of text transform in Edge, Firefox, and IE. * 1. Remove the inheritance of text transform in Firefox. */ button, select { /* 1 */ text-transform: none; } /** * Correct the inability to style clickable types in iOS and Safari. */ button, [type=button], [type=reset], [type=submit] { -webkit-appearance: button; } /** * Remove the inner border and padding in Firefox. */ button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus styles unset by the previous rule. */ button:-moz-focusring, [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring { outline: 1px dotted ButtonText; } /** * Correct the padding in Firefox. */ fieldset { padding: 0.35em 0.75em 0.625em; } /** * 1. Correct the text wrapping in Edge and IE. * 2. Correct the color inheritance from `fieldset` elements in IE. * 3. Remove the padding so developers are not caught out when they zero out * `fieldset` elements in all browsers. */ legend { box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ } /** * Add the correct vertical alignment in Chrome, Firefox, and Opera. */ progress { vertical-align: baseline; } /** * Remove the default vertical scrollbar in IE 10+. */ textarea { overflow: auto; } /** * 1. Add the correct box sizing in IE 10. * 2. Remove the padding in IE 10. */ [type=checkbox], [type=radio] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Chrome. */ [type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button { height: auto; } /** * 1. Correct the odd appearance in Chrome and Safari. * 2. Correct the outline style in Safari. */ [type=search] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Remove the inner padding in Chrome and Safari on macOS. */ [type=search]::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style clickable types in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Interactive ========================================================================== */ /* * Add the correct display in Edge, IE 10+, and Firefox. */ details { display: block; } /* * Add the correct display in all browsers. */ summary { display: list-item; } /* Misc ========================================================================== */ /** * Add the correct display in IE 10+. */ template { display: none; } /** * Add the correct display in IE 10. */ [hidden] { display: none; } /** * Responsive Styles */ /** * Required Variables */ /** * Root Media Query Variables */ /** * Extends */ .post-thumbnail { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .post-thumbnail { max-width: min(calc(100vw - 100px), 610px); } } @media only screen and (min-width: 822px) { .post-thumbnail { max-width: min(calc(100vw - 200px), 610px); } } .entry-content .wp-audio-shortcode { max-width: calc(100vw - 30px); margin-left: auto; margin-right: auto; } @media only screen and (min-width: 482px) { .entry-content .wp-audio-shortcode { max-width: min(calc(100vw - 100px), 610px); } } @media only screen and (min-width: 822px) { .entry-content .wp-audio-shortcode { max-width: min(calc(100vw - 200px), 610px); } } .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) { max-width: calc(100vw - 30px); margin-left: auto; margin-right: auto; } @media only screen and (min-width: 482px) { .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) { max-width: min(calc(100vw - 100px), 610px); } } @media only screen and (min-width: 822px) { .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) { max-width: min(calc(100vw - 200px), 610px); } } *[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) { max-width: calc(100vw - 30px); margin-left: auto; margin-right: auto; } @media only screen and (min-width: 482px) { *[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) { max-width: min(calc(100vw - 100px), 610px); } } @media only screen and (min-width: 822px) { *[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) { max-width: min(calc(100vw - 200px), 610px); } } .default-max-width { max-width: calc(100vw - 30px); margin-left: auto; margin-right: auto; } @media only screen and (min-width: 482px) { .default-max-width { max-width: min(calc(100vw - 100px), 610px); } } @media only screen and (min-width: 822px) { .default-max-width { max-width: min(calc(100vw - 200px), 610px); } } .widget-area { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .widget-area { max-width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .widget-area { max-width: min(calc(100vw - 200px), 1240px); } } .pagination { max-width: calc(100vw - 30px); margin-left: auto; margin-right: auto; } @media only screen and (min-width: 482px) { .pagination { max-width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .pagination { max-width: min(calc(100vw - 200px), 1240px); } } .comments-pagination { max-width: calc(100vw - 30px); margin-left: auto; margin-right: auto; } @media only screen and (min-width: 482px) { .comments-pagination { max-width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .comments-pagination { max-width: min(calc(100vw - 200px), 1240px); } } .post-navigation { max-width: calc(100vw - 30px); margin-left: auto; margin-right: auto; } @media only screen and (min-width: 482px) { .post-navigation { max-width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .post-navigation { max-width: min(calc(100vw - 200px), 1240px); } } .site-footer { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .site-footer { max-width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .site-footer { max-width: min(calc(100vw - 200px), 1240px); } } .site-header { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .site-header { max-width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .site-header { max-width: min(calc(100vw - 200px), 1240px); } } .alignwide { max-width: calc(100vw - 30px); margin-left: auto; margin-right: auto; } @media only screen and (min-width: 482px) { .alignwide { max-width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .alignwide { max-width: min(calc(100vw - 200px), 1240px); } } .wide-max-width { max-width: calc(100vw - 30px); margin-left: auto; margin-right: auto; } @media only screen and (min-width: 482px) { .wide-max-width { max-width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .wide-max-width { max-width: min(calc(100vw - 200px), 1240px); } } .alignfull { max-width: 100%; width: 100%; margin-left: auto; margin-right: auto; } .wp-block-group .wp-block-group__inner-container > *.alignfull { max-width: 100%; width: 100%; margin-left: auto; margin-right: auto; } .full-max-width { max-width: 100%; width: 100%; margin-left: auto; margin-right: auto; } @media only screen and (min-width: 482px) { .alignfull, .full-max-width { max-width: 100%; width: auto; margin-left: auto; margin-right: auto; } } .entry-header .post-thumbnail { margin-left: auto; margin-right: auto; width: calc(100vw - 30px); max-width: 100%; } @media only screen and (min-width: 482px) { .entry-header .post-thumbnail { width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .entry-header .post-thumbnail { width: min(calc(100vw - 200px), 1240px); } } .singular .post-thumbnail { margin-left: auto; margin-right: auto; width: calc(100vw - 30px); max-width: 100%; } @media only screen and (min-width: 482px) { .singular .post-thumbnail { width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .singular .post-thumbnail { width: min(calc(100vw - 200px), 1240px); } } .alignfull [class*=inner-container] > .alignwide { margin-left: auto; margin-right: auto; width: calc(100vw - 30px); max-width: 100%; } @media only screen and (min-width: 482px) { .alignfull [class*=inner-container] > .alignwide { width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .alignfull [class*=inner-container] > .alignwide { width: min(calc(100vw - 200px), 1240px); } } .alignwide [class*=inner-container] > .alignwide { margin-left: auto; margin-right: auto; width: calc(100vw - 30px); max-width: 100%; } @media only screen and (min-width: 482px) { .alignwide [class*=inner-container] > .alignwide { width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .alignwide [class*=inner-container] > .alignwide { width: min(calc(100vw - 200px), 1240px); } } @media only screen and (min-width: 482px) { .entry-content > .alignleft { /*rtl:ignore*/ margin-left: calc((100vw - min(calc(100vw - 4 * 25px), 610px)) *1); /*rtl:ignore*/ margin-right: 25px; } @media only screen and (min-width: 482px) { .entry-content > .alignleft { margin-left: calc((100vw - min(calc(100vw - 4 * 25px), 610px)) *1); } } @media only screen and (min-width: 822px) { .entry-content > .alignleft { margin-left: calc((100vw - min(calc(100vw - 4 * 25px), 610px)) *1); } } } @media only screen and (min-width: 482px) { .entry-content > .alignright { /*rtl:ignore*/ margin-left: 25px; /*rtl:ignore*/ margin-right: calc((100vw - min(calc(100vw - 4 * 25px), 610px)) *1); } @media only screen and (min-width: 482px) { .entry-content > .alignright { margin-right: calc((100vw - min(calc(100vw - 4 * 25px), 610px)) *1); } } @media only screen and (min-width: 822px) { .entry-content > .alignright { margin-right: calc((100vw - min(calc(100vw - 4 * 25px), 610px)) *1); } } } /** * Site Structure * * - Set vertical margins and responsive widths on * top-level wrappers and content wrappers * - `--global--width-content` is a responsive variable * - See: globals/_global-width-responsive.scss */ /** * Top Level Wrappers (header, main, footer) * - Set vertical padding and horizontal margins */ .site-header, .site-main, .widget-area, .site-footer { padding-top: 30px; padding-bottom: 30px; margin-left: auto; margin-right: auto; } .site-header { padding-top: 23px; padding-bottom: 60px; } @media only screen and (min-width: 482px) { .site-header { padding-bottom: 90px; } } /** * Site-main children wrappers * - Add double vertical margins here for clearer hierarchy */ .site-main > * { margin-top: 90px; margin-bottom: 90px; } .site-main > *:first-child { margin-top: 0; } .site-main > *:last-child { margin-bottom: 0; } /** * Set the default maximum responsive content-width */ /** * Set the wide maximum responsive content-width */ /** * Set the full maximum responsive content-width */ /* * Block & non-gutenberg content wrappers * - Set margins */ .entry-header, .post-thumbnail, .entry-content, .entry-footer, .author-bio { margin-top: 30px; margin-right: auto; margin-bottom: 30px; margin-left: auto; } /* * Block & non-gutenberg content wrapper children * - Sets spacing-vertical margin logic */ .site-main > article > * { margin-top: 20px; margin-bottom: 20px; } .site-main > .not-found > * { margin-top: 20px; margin-bottom: 20px; } .entry-content > * { margin-top: 20px; margin-bottom: 20px; } [class*=inner-container] > * { margin-top: 20px; margin-bottom: 20px; } .wp-block-template-part > * { margin-top: 20px; margin-bottom: 20px; } .wp-block-post-template :where(li > *) { margin-top: 20px; margin-bottom: 20px; } @media only screen and (min-width: 482px) { .site-main > article > * { margin-top: 30px; margin-bottom: 30px; } .site-main > .not-found > * { margin-top: 30px; margin-bottom: 30px; } .entry-content > * { margin-top: 30px; margin-bottom: 30px; } [class*=inner-container] > * { margin-top: 30px; margin-bottom: 30px; } .wp-block-template-part > * { margin-top: 30px; margin-bottom: 30px; } .wp-block-post-template :where(li > *) { margin-top: 30px; margin-bottom: 30px; } } .site-main > article > *:first-child, .site-main > .not-found > *:first-child, .entry-content > *:first-child, [class*=inner-container] > *:first-child, .wp-block-template-part > *:first-child, .wp-block-post-template :where(li > *):first-child { margin-top: 0; } .site-main > article > *:last-child, .site-main > .not-found > *:last-child, .entry-content > *:last-child, [class*=inner-container] > *:last-child, .wp-block-template-part > *:last-child, .wp-block-post-template :where(li > *):last-child { margin-bottom: 0; } .site-footer > * { margin-top: 20px; margin-bottom: 20px; } .widget-area > * { margin-top: 20px; margin-bottom: 20px; } @media only screen and (min-width: 482px) { .site-footer > * { margin-top: 30px; margin-bottom: 30px; } .widget-area > * { margin-top: 30px; margin-bottom: 30px; } } /* * Block & non-gutenberg content wrapper children * - Sets spacing-unit margins */ .entry-header > * { margin-top: 20px; margin-bottom: 20px; } .post-thumbnail > * { margin-top: 20px; margin-bottom: 20px; } .page-content > * { margin-top: 20px; margin-bottom: 20px; } .comment-content > * { margin-top: 20px; margin-bottom: 20px; } .widget > * { margin-top: 20px; margin-bottom: 20px; } .entry-header > *:first-child, .post-thumbnail > *:first-child, .page-content > *:first-child, .comment-content > *:first-child, .widget > *:first-child { margin-top: 0; } .entry-header > *:last-child, .post-thumbnail > *:last-child, .page-content > *:last-child, .comment-content > *:last-child, .widget > *:last-child { margin-bottom: 0; } /* * .entry-content children specific controls * - Adds special margin overrides for alignment utility classes */ .entry-content > * { /* Reset alignleft and alignright margins after alignfull */ } .entry-content > *.alignleft, .entry-content > *.alignright, .entry-content > *.alignleft:first-child + *, .entry-content > *.alignright:first-child + *, .entry-content > *.alignfull.has-background { margin-top: 0; } .entry-content > *:last-child, .entry-content > *.alignfull.has-background { margin-bottom: 0; } .entry-content > *.alignfull + .alignleft { margin-top: 30px; } .entry-content > *.alignfull + .alignright { margin-top: 30px; } /** * Reset specific elements to make them easier to style in other contexts. */ html, body, p, ol, ul, li, dl, dt, dd, blockquote, figure, fieldset, form, legend, textarea, pre, iframe, hr, h1, h2, h3, h4, h5, h6 { padding: 0; margin: 0; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } /** * Apply generic border-box to all elements. * See: * https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ html { /* Apply border-box across the entire page. */ box-sizing: border-box; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; line-height: 1.7; } /** * Relax the definition a bit, to allow components to override it manually. */ *, *::before, *::after { box-sizing: inherit; } body { font-size: 1.25rem; font-weight: normal; color: #28303d; text-align: left; background-color: #d1e4dd; } .clear:before, .clear:after, .entry-content:before, .entry-content:after, .comment-content:before, .comment-content:after, .site-header:before, .site-header:after, .site-content:before, .site-content:after, .site-footer:before, .site-footer:after { content: ""; display: table; table-layout: fixed; } .clear:after, .entry-content:after, .comment-content:after, .site-header:after, .site-content:after, .site-footer:after { clear: both; } /* Category 04 can contain any default HTML element. Do not add classes here, just give the elements some basic styles. */ blockquote { padding: 0; position: relative; margin: 30px 0 30px 25px; } blockquote > * { margin-top: 20px; margin-bottom: 20px; } blockquote > *:first-child { margin-top: 0; } blockquote > *:last-child { margin-bottom: 0; } blockquote p { letter-spacing: normal; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.25rem; font-style: normal; font-weight: 700; line-height: 1.7; } blockquote cite, blockquote footer { font-weight: normal; letter-spacing: normal; } blockquote.alignleft, blockquote.alignright { padding-left: inherit; } blockquote.alignleft p, blockquote.alignright p { font-size: 1.125rem; max-width: inherit; width: inherit; } blockquote.alignleft cite, blockquote.alignleft footer, blockquote.alignright cite, blockquote.alignright footer { font-size: 1rem; letter-spacing: normal; } blockquote strong { font-weight: bolder; } blockquote:before { content: "“"; font-size: 1.25rem; line-height: 1.7; position: absolute; left: -12px; } blockquote .wp-block-quote__citation, blockquote cite, blockquote footer { color: #28303d; font-size: 1rem; font-style: normal; } @media only screen and (max-width: 481px) { blockquote { padding-left: 13px; } blockquote:before { left: 0; } } input[type=text] { border: 3px solid #39414d; border-radius: 0; color: #28303d; line-height: 1.7; padding: 10px; margin: 0 2px; max-width: 100%; } input[type=email] { border: 3px solid #39414d; border-radius: 0; color: #28303d; line-height: 1.7; padding: 10px; margin: 0 2px; max-width: 100%; } input[type=url] { border: 3px solid #39414d; border-radius: 0; color: #28303d; line-height: 1.7; padding: 10px; margin: 0 2px; max-width: 100%; } input[type=password] { border: 3px solid #39414d; border-radius: 0; color: #28303d; line-height: 1.7; padding: 10px; margin: 0 2px; max-width: 100%; } input[type=search] { border: 3px solid #39414d; border-radius: 0; color: #28303d; line-height: 1.7; padding: 10px; margin: 0 2px; max-width: 100%; } input[type=number] { border: 3px solid #39414d; border-radius: 0; color: #28303d; line-height: 1.7; padding: 10px; margin: 0 2px; max-width: 100%; } input[type=tel] { border: 3px solid #39414d; border-radius: 0; color: #28303d; line-height: 1.7; padding: 10px; margin: 0 2px; max-width: 100%; } input[type=date] { border: 3px solid #39414d; border-radius: 0; color: #28303d; line-height: 1.7; padding: 10px; margin: 0 2px; max-width: 100%; } input[type=month] { border: 3px solid #39414d; border-radius: 0; color: #28303d; line-height: 1.7; padding: 10px; margin: 0 2px; max-width: 100%; } input[type=week] { border: 3px solid #39414d; border-radius: 0; color: #28303d; line-height: 1.7; padding: 10px; margin: 0 2px; max-width: 100%; } input[type=time] { border: 3px solid #39414d; border-radius: 0; color: #28303d; line-height: 1.7; padding: 10px; margin: 0 2px; max-width: 100%; } input[type=datetime] { border: 3px solid #39414d; border-radius: 0; color: #28303d; line-height: 1.7; padding: 10px; margin: 0 2px; max-width: 100%; } input[type=datetime-local] { border: 3px solid #39414d; border-radius: 0; color: #28303d; line-height: 1.7; padding: 10px; margin: 0 2px; max-width: 100%; } input[type=color] { border: 3px solid #39414d; border-radius: 0; color: #28303d; line-height: 1.7; padding: 10px; margin: 0 2px; max-width: 100%; } .site textarea { border: 3px solid #39414d; border-radius: 0; color: #28303d; line-height: 1.7; padding: 10px; margin: 0 2px; max-width: 100%; } input[type=text]:focus { color: #28303d; outline-offset: 2px; outline: 2px dotted #39414d; } input[type=email]:focus { color: #28303d; outline-offset: 2px; outline: 2px dotted #39414d; } input[type=url]:focus { color: #28303d; outline-offset: 2px; outline: 2px dotted #39414d; } input[type=password]:focus { color: #28303d; outline-offset: 2px; outline: 2px dotted #39414d; } input[type=search]:focus { color: #28303d; outline-offset: 2px; outline: 2px dotted #39414d; } input[type=number]:focus { color: #28303d; outline-offset: 2px; outline: 2px dotted #39414d; } input[type=tel]:focus { color: #28303d; outline-offset: 2px; outline: 2px dotted #39414d; } input[type=date]:focus { color: #28303d; outline-offset: 2px; outline: 2px dotted #39414d; } input[type=month]:focus { color: #28303d; outline-offset: 2px; outline: 2px dotted #39414d; } input[type=week]:focus { color: #28303d; outline-offset: 2px; outline: 2px dotted #39414d; } input[type=time]:focus { color: #28303d; outline-offset: 2px; outline: 2px dotted #39414d; } input[type=datetime]:focus { color: #28303d; outline-offset: 2px; outline: 2px dotted #39414d; } input[type=datetime-local]:focus { color: #28303d; outline-offset: 2px; outline: 2px dotted #39414d; } input[type=color]:focus { color: #28303d; outline-offset: 2px; outline: 2px dotted #39414d; } .site textarea:focus { color: #28303d; outline-offset: 2px; outline: 2px dotted #39414d; } input[type=text]:disabled, input[type=email]:disabled, input[type=url]:disabled, input[type=password]:disabled, input[type=search]:disabled, input[type=number]:disabled, input[type=tel]:disabled, input[type=date]:disabled, input[type=month]:disabled, input[type=week]:disabled, input[type=time]:disabled, input[type=datetime]:disabled, input[type=datetime-local]:disabled, input[type=color]:disabled, .site textarea:disabled { opacity: 0.7; } .is-dark-theme input[type=text] { background: rgba(255, 255, 255, 0.9); } .is-dark-theme input[type=email] { background: rgba(255, 255, 255, 0.9); } .is-dark-theme input[type=url] { background: rgba(255, 255, 255, 0.9); } .is-dark-theme input[type=password] { background: rgba(255, 255, 255, 0.9); } .is-dark-theme input[type=search] { background: rgba(255, 255, 255, 0.9); } .is-dark-theme input[type=number] { background: rgba(255, 255, 255, 0.9); } .is-dark-theme input[type=tel] { background: rgba(255, 255, 255, 0.9); } .is-dark-theme input[type=date] { background: rgba(255, 255, 255, 0.9); } .is-dark-theme input[type=month] { background: rgba(255, 255, 255, 0.9); } .is-dark-theme input[type=week] { background: rgba(255, 255, 255, 0.9); } .is-dark-theme input[type=time] { background: rgba(255, 255, 255, 0.9); } .is-dark-theme input[type=datetime] { background: rgba(255, 255, 255, 0.9); } .is-dark-theme input[type=datetime-local] { background: rgba(255, 255, 255, 0.9); } .is-dark-theme input[type=color] { background: rgba(255, 255, 255, 0.9); } .is-dark-theme .site textarea { background: rgba(255, 255, 255, 0.9); } input[type=search]:focus { outline-offset: -7px; } .is-dark-theme input[type=search]:focus { outline-color: #d1e4dd; } input[type=color] { padding: 5px; height: 40px; } input[type=email], input[type=url] { /*rtl:ignore*/ direction: ltr; } select { border: 3px solid #39414d; color: #28303d; -moz-appearance: none; -webkit-appearance: none; appearance: none; line-height: 1.7; padding: 10px 30px 10px 10px; background: #fff url("data:image/svg+xml;utf8,") no-repeat; background-position: right 10px top 60%; } select:focus { outline-offset: 2px; outline: 2px dotted #39414d; } .is-dark-theme select { background: rgba(255, 255, 255, 0.9) url("data:image/svg+xml;utf8,") no-repeat; background-position: right 10px top 60%; } textarea { width: 100%; } label { font-size: 1.125rem; font-weight: 500; margin-bottom: 10px; } /** https://css-tricks.com/custom-styling-form-inputs-with-modern-css-features/ https://codepen.io/aaroniker/pen/ZEYoxEY by Aaron Iker. License: MIT. */ @supports (-webkit-appearance: none) or (-moz-appearance: none) { input[type=checkbox] { -webkit-appearance: none; -moz-appearance: none; position: relative; width: 25px; height: 25px; border: 3px solid #39414d; background: #fff; } input[type=radio] { -webkit-appearance: none; -moz-appearance: none; position: relative; width: 25px; height: 25px; border: 3px solid #39414d; background: #fff; } input[type=checkbox]:disabled, input[type=radio]:disabled { opacity: 0.7; } .is-dark-theme input[type=checkbox] { background: rgba(255, 255, 255, 0.9); } .is-dark-theme input[type=radio] { background: rgba(255, 255, 255, 0.9); } input[type=checkbox]:focus { outline-offset: 2px; outline: 2px dotted #39414d; } input[type=checkbox]:after { content: ""; opacity: 0; display: block; left: 5px; top: 2px; position: absolute; width: 7px; height: 13px; border: 3px solid #28303d; border-top: 0; border-left: 0; transform: rotate(30deg); } input[type=checkbox]:checked { color: #28303d; } input[type=checkbox]:checked:after { opacity: 1; } input[type=radio] { border-radius: 50%; } input[type=radio]:focus { outline-offset: 2px; outline: 2px dotted #39414d; } input[type=radio]:after { content: ""; opacity: 0; display: block; left: 3px; top: 3px; position: absolute; width: 11px; height: 11px; border-radius: 50%; background: #28303d; } input[type=radio]:checked { border: 4px solid #39414d; } input[type=radio]:checked:after { opacity: 1; } input[type=radio]:checked:focus { outline-offset: 4px; outline: 2px dotted #39414d; } } input[type=checkbox] + label { display: inline-block; padding-left: 10px; font-size: 1rem; vertical-align: top; } input[type=radio] + label { display: inline-block; padding-left: 10px; font-size: 1rem; vertical-align: top; } /** * https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/ */ @supports (-webkit-appearance: none) or (-moz-appearance: none) { input[type=range] { -webkit-appearance: none; /* Hides the slider so that custom slider can be made */ width: 100%; /* Specific width is required for Firefox. */ height: 6px; background: #39414d; border-radius: 6px; outline-offset: 10px; } input[type=range]:disabled { opacity: 0.7; } input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; border: 3px solid #39414d; height: 44px; width: 44px; border-radius: 50%; background: #d1e4dd; cursor: pointer; } input[type=range]::-moz-range-thumb { border: 3px solid #39414d; height: 44px; width: 44px; border-radius: 50%; background: #d1e4dd; cursor: pointer; box-sizing: border-box; } } input[type=range]::-ms-track { width: 100%; height: 6px; border-radius: 6px; border-width: 19px 0; border-color: #d1e4dd; background: transparent; color: transparent; cursor: pointer; } input[type=range]::-ms-fill-upper { background: #39414d; border-radius: 6px; } input[type=range]::-ms-fill-lower { background: #39414d; border-radius: 6px; } input[type=range]::-ms-thumb { border: 3px solid #39414d; height: 44px; width: 44px; border-radius: 50%; background: #d1e4dd; cursor: pointer; } fieldset { display: grid; border-color: #39414d; padding: 25px; } fieldset legend { font-size: 1.5rem; } fieldset input[type=submit] { max-width: max-content; } fieldset input:not([type=submit]) { margin-bottom: 20px; } fieldset input[type=radio], fieldset input[type=checkbox] { margin-bottom: 0; } fieldset input[type=radio] + label { font-size: 1.125rem; padding-left: 0; margin-bottom: 20px; } fieldset input[type=checkbox] + label { font-size: 1.125rem; padding-left: 0; margin-bottom: 20px; } ::-moz-placeholder { opacity: 1; } .post-password-message { font-size: 1.5rem; } .post-password-form { display: flex; flex-wrap: wrap; } .post-password-form__label { width: 100%; margin-bottom: 0; } .post-password-form input[type=password] { flex-grow: 1; margin-top: 10px; margin-right: 17px; } .post-password-form__submit { margin-top: 10px; } @media only screen and (min-width: 592px) { .post-password-form__submit { margin-left: 10px; } } img { height: auto; vertical-align: middle; } /* Classic editor images */ /* Make sure embeds and iframes fit their containers. */ img, .entry-content img, embed, iframe, object, video { max-width: 100%; } /* Media captions */ figcaption, .wp-caption, .wp-caption-text, .wp-block-embed figcaption { color: currentColor; font-size: 1rem; line-height: 1.7; margin-top: 10px; margin-bottom: 20px; text-align: center; } .alignleft figcaption, .alignright figcaption, .alignleft .wp-caption, .alignright .wp-caption, .alignleft .wp-caption-text, .alignright .wp-caption-text, .alignleft .wp-block-embed figcaption, .alignright .wp-block-embed figcaption { margin-bottom: 0; } /* WP Smiley */ .page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } /* Over here, place any elements that do not need to have their own file. */ b, strong { font-weight: 700; } dfn, cite, em, i { font-style: italic; } pre { white-space: pre; overflow-x: auto; } /* * text-underline-offset doesn't work in Chrome at all 👎 * But looks nice in Safari/Firefox, so let's keep it and * maybe Chrome will support it soon. */ a { cursor: pointer; color: #28303d; text-underline-offset: 3px; text-decoration-skip-ink: all; } a:hover { text-decoration-style: dotted; text-decoration-skip-ink: none; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; text-decoration: underline 1px dotted currentColor; text-decoration-skip-ink: none; background: rgba(255, 255, 255, 0.9); } .is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { background: #000; color: #fff; text-decoration: none; } .is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav { color: #fff; } .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { background: rgba(0, 0, 0, 0.9); color: #fff; } .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav { color: #fff; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link { /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; outline-offset: -2px; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link:focus { color: #21759b; background-color: #f1f1f1; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).custom-logo-link { background: none; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) img { outline: 2px dotted #28303d; } .has-background .has-link-color a, .has-background.has-link-color a { color: #28303d; } /* Category 05 is all about adjusting the default block styles to the given layout. I only added three blocks as examples. */ .wp-block-audio audio:focus { outline-offset: 5px; outline: 2px solid #28303d; } /** * Button */ .site .button, button { border: 3px solid transparent; border-radius: 0; cursor: pointer; font-weight: 500; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.25rem; line-height: 1.5; padding: 15px 30px; text-decoration: none; } input[type=submit] { border: 3px solid transparent; border-radius: 0; cursor: pointer; font-weight: 500; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.25rem; line-height: 1.5; padding: 15px 30px; text-decoration: none; } input[type=reset] { border: 3px solid transparent; border-radius: 0; cursor: pointer; font-weight: 500; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.25rem; line-height: 1.5; padding: 15px 30px; text-decoration: none; } .wp-block-search .wp-block-search__button, .wp-block-button .wp-block-button__link, .wp-block-file a.wp-block-file__button { border: 3px solid transparent; border-radius: 0; cursor: pointer; font-weight: 500; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.25rem; line-height: 1.5; padding: 15px 30px; text-decoration: none; } .site .button:not(:hover):not(:active):not(.has-text-color) { color: #d1e4dd; } button:not(:hover):not(:active):not(.has-text-color) { color: #d1e4dd; } input[type=submit]:not(:hover):not(:active):not(.has-text-color) { color: #d1e4dd; } input[type=reset]:not(:hover):not(:active):not(.has-text-color) { color: #d1e4dd; } .wp-block-search .wp-block-search__button:not(:hover):not(:active):not(.has-text-color) { color: #d1e4dd; } .wp-block-button .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: #d1e4dd; } .wp-block-file a.wp-block-file__button:not(:hover):not(:active):not(.has-text-color) { color: #d1e4dd; } .has-background .site .button:not(:hover):not(:active):not(.has-text-color) { color: #28303d; } .has-background button:not(:hover):not(:active):not(.has-text-color) { color: #28303d; } .has-background input[type=submit]:not(:hover):not(:active):not(.has-text-color) { color: #28303d; } .has-background input[type=reset]:not(:hover):not(:active):not(.has-text-color) { color: #28303d; } .has-background .wp-block-search .wp-block-search__button:not(:hover):not(:active):not(.has-text-color) { color: #28303d; } .has-background .wp-block-button .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: #28303d; } .has-background .wp-block-file a.wp-block-file__button:not(:hover):not(:active):not(.has-text-color) { color: #28303d; } .has-background .site .button:not(:hover):not(:active):not(.has-text-color).has-background { color: #28303d; } .has-background button:not(:hover):not(:active):not(.has-text-color).has-background { color: #28303d; } .has-background input[type=submit]:not(:hover):not(:active):not(.has-text-color).has-background { color: #28303d; } .has-background input[type=reset]:not(:hover):not(:active):not(.has-text-color).has-background { color: #28303d; } .has-background .wp-block-search .wp-block-search__button:not(:hover):not(:active):not(.has-text-color).has-background { color: #28303d; } .has-background .wp-block-button .wp-block-button__link:not(:hover):not(:active):not(.has-text-color).has-background { color: #28303d; } .has-background .wp-block-file a.wp-block-file__button:not(:hover):not(:active):not(.has-text-color).has-background { color: #28303d; } .site .button:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } button:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } input[type=submit]:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } input[type=reset]:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .wp-block-search .wp-block-search__button:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .wp-block-button .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .wp-block-file a.wp-block-file__button:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .has-background .site .button:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .has-background button:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .has-background input[type=submit]:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .has-background input[type=reset]:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .has-background .wp-block-search .wp-block-search__button:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .has-background .wp-block-button .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .has-background .wp-block-file a.wp-block-file__button:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .site .button:hover, .site .button:active, button:hover, button:active, input[type=submit]:hover, input[type=submit]:active, input[type=reset]:hover, input[type=reset]:active, .wp-block-search .wp-block-search__button:hover, .wp-block-search .wp-block-search__button:active, .wp-block-button .wp-block-button__link:hover, .wp-block-button .wp-block-button__link:active, .wp-block-file a.wp-block-file__button:hover, .wp-block-file a.wp-block-file__button:active { background-color: transparent; border-color: currentColor; color: inherit; } .site .button:focus, button:focus, input[type=submit]:focus, input[type=reset]:focus, .wp-block-search .wp-block-search__button:focus, .wp-block-button .wp-block-button__link:focus, .wp-block-file a.wp-block-file__button:focus { outline-offset: -6px; outline: 2px dotted currentColor; } .site .button:disabled { background-color: rgba(255, 255, 255, 0.5); border-color: rgba(255, 255, 255, 0.5); color: #39414d; } button:disabled { background-color: rgba(255, 255, 255, 0.5); border-color: rgba(255, 255, 255, 0.5); color: #39414d; } input[type=submit]:disabled { background-color: rgba(255, 255, 255, 0.5); border-color: rgba(255, 255, 255, 0.5); color: #39414d; } input[type=reset]:disabled { background-color: rgba(255, 255, 255, 0.5); border-color: rgba(255, 255, 255, 0.5); color: #39414d; } .wp-block-search .wp-block-search__button:disabled { background-color: rgba(255, 255, 255, 0.5); border-color: rgba(255, 255, 255, 0.5); color: #39414d; } .wp-block-button .wp-block-button__link:disabled { background-color: rgba(255, 255, 255, 0.5); border-color: rgba(255, 255, 255, 0.5); color: #39414d; } .wp-block-file a.wp-block-file__button:disabled { background-color: rgba(255, 255, 255, 0.5); border-color: rgba(255, 255, 255, 0.5); color: #39414d; } /** * Block Options */ .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: #d1e4dd; } .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: #d1e4dd; } .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color).has-background { color: #28303d; } .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: #28303d; } .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover, .wp-block-button:not(.is-style-outline) .wp-block-button__link:active { border-color: currentColor !important; background-color: transparent !important; color: inherit !important; } .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color), .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-background), .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active).has-background { border-color: currentColor; } .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: #28303d; } .has-background .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: #28303d; } .has-background .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active).has-background:not(.has-text-color) { color: inherit; } .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: transparent; } .wp-block-button.is-style-outline .wp-block-button__link:hover { border-color: transparent !important; background-color: #28303d !important; color: #d1e4dd !important; } .wp-block-button.is-style-outline .wp-block-button__link:active { border-color: transparent !important; background-color: #28303d !important; color: #d1e4dd !important; } .has-background .wp-block-button.is-style-outline .wp-block-button__link:hover { background-color: #28303d !important; color: #d1e4dd !important; } .has-background .wp-block-button.is-style-outline .wp-block-button__link:active { background-color: #28303d !important; color: #d1e4dd !important; } .has-text-color .wp-block-button.is-style-outline .wp-block-button__link:hover { color: #d1e4dd !important; } .has-text-color .wp-block-button.is-style-outline .wp-block-button__link:active { color: #d1e4dd !important; } .wp-block-button .is-style-squared .wp-block-button__link { border-radius: 0; } .is-style-outline .wp-block-button__link[style*=radius]:focus { outline-offset: 2px; outline: 2px dotted #39414d; } .wp-block-button a.wp-block-button__link[style*=radius]:focus { outline-offset: 2px; outline: 2px dotted #39414d; } .wp-block-code { border-color: #28303d; border-radius: 0; border-style: solid; border-width: 0.1rem; padding: 20px; } .wp-block-code code { color: #28303d; white-space: pre; overflow-x: auto; display: block; } .wp-block-columns:not(.alignwide):not(.alignfull) { clear: both; } .wp-block-columns .wp-block-column > * { margin-top: 20px; margin-bottom: 20px; } @media only screen and (min-width: 482px) { .wp-block-columns .wp-block-column > * { margin-top: 30px; margin-bottom: 30px; } } .wp-block-columns .wp-block-column > *:first-child { margin-top: 0; } .wp-block-columns .wp-block-column > *:last-child { margin-bottom: 0; } .wp-block-columns .wp-block-column:last-child { margin-bottom: 0; } .wp-block-columns .wp-block-column:not(:last-child) { margin-bottom: 20px; } @media only screen and (min-width: 482px) { .wp-block-columns .wp-block-column:not(:last-child) { margin-bottom: 30px; } } @media only screen and (min-width: 822px) { .wp-block-columns .wp-block-column:not(:last-child) { margin-bottom: 0; } } .wp-block-columns.is-style-twentytwentyone-columns-overlap { justify-content: space-around; } @media only screen and (min-width: 652px) { .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) { margin-left: -50px; margin-top: 63px; z-index: 2; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > p:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h1:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h2:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h3:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h4:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h5:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h6:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ul:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ol:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > pre:not(.has-background) { background-color: #d1e4dd; padding: 20px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ul:not(.has-background) { padding-left: 50px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ol:not(.has-background) { padding-left: 50px; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n).is-vertically-aligned-center { margin-top: 0; } } .wp-block-columns.alignfull .wp-block-column p:not(.has-background) { padding-left: 20px; padding-right: 20px; } .wp-block-columns.alignfull .wp-block-column h1:not(.has-background) { padding-left: 20px; padding-right: 20px; } .wp-block-columns.alignfull .wp-block-column h2:not(.has-background) { padding-left: 20px; padding-right: 20px; } .wp-block-columns.alignfull .wp-block-column h3:not(.has-background) { padding-left: 20px; padding-right: 20px; } .wp-block-columns.alignfull .wp-block-column h4:not(.has-background) { padding-left: 20px; padding-right: 20px; } .wp-block-columns.alignfull .wp-block-column h5:not(.has-background) { padding-left: 20px; padding-right: 20px; } .wp-block-columns.alignfull .wp-block-column h6:not(.has-background) { padding-left: 20px; padding-right: 20px; } .wp-block-cover, .wp-block-cover-image { background-color: #000; min-height: 450px; margin-top: inherit; margin-bottom: inherit; /* default & custom background-color */ /* Treating H2 separately to account for legacy /core styles */ /* Block Styles */ /* The background color class is used just for the overlay, and does not need to be applied to the inner container. */ } .wp-block-cover:not(.alignwide):not(.alignfull), .wp-block-cover-image:not(.alignwide):not(.alignfull) { clear: both; } .wp-block-cover.alignfull, .wp-block-cover-image.alignfull { margin-top: 0; margin-bottom: 0; } .wp-block-cover .wp-block-cover__inner-container, .wp-block-cover .wp-block-cover-image-text, .wp-block-cover .wp-block-cover-text, .wp-block-cover-image .wp-block-cover__inner-container, .wp-block-cover-image .wp-block-cover-image-text, .wp-block-cover-image .wp-block-cover-text { color: currentColor; margin-top: 30px; margin-bottom: 30px; } .wp-block-cover .wp-block-cover__inner-container a:not(.wp-block-button__link):not(.wp-block-file__button), .wp-block-cover .wp-block-cover-image-text a:not(.wp-block-button__link):not(.wp-block-file__button), .wp-block-cover .wp-block-cover-text a:not(.wp-block-button__link):not(.wp-block-file__button), .wp-block-cover-image .wp-block-cover__inner-container a:not(.wp-block-button__link):not(.wp-block-file__button), .wp-block-cover-image .wp-block-cover-image-text a:not(.wp-block-button__link):not(.wp-block-file__button), .wp-block-cover-image .wp-block-cover-text a:not(.wp-block-button__link):not(.wp-block-file__button) { color: currentColor; } .wp-block-cover .wp-block-cover__inner-container .has-link-color a, .wp-block-cover .wp-block-cover-image-text .has-link-color a, .wp-block-cover .wp-block-cover-text .has-link-color a, .wp-block-cover-image .wp-block-cover__inner-container .has-link-color a, .wp-block-cover-image .wp-block-cover-image-text .has-link-color a, .wp-block-cover-image .wp-block-cover-text .has-link-color a { color: #28303d; } .wp-block-cover:not([class*=background-color]) .wp-block-cover__inner-container { color: #fff; } .wp-block-cover:not([class*=background-color]) .wp-block-cover-image-text { color: #fff; } .wp-block-cover:not([class*=background-color]) .wp-block-cover-text { color: #fff; } .wp-block-cover-image:not([class*=background-color]) .wp-block-cover__inner-container { color: #fff; } .wp-block-cover-image:not([class*=background-color]) .wp-block-cover-image-text { color: #fff; } .wp-block-cover-image:not([class*=background-color]) .wp-block-cover-text { color: #fff; } .wp-block-cover h2 { font-size: 2.25rem; letter-spacing: normal; line-height: 1.3; max-width: inherit; text-align: inherit; padding: 0; } @media only screen and (min-width: 652px) { .wp-block-cover h2 { font-size: 3rem; } } .wp-block-cover-image h2 { font-size: 2.25rem; letter-spacing: normal; line-height: 1.3; max-width: inherit; text-align: inherit; padding: 0; } @media only screen and (min-width: 652px) { .wp-block-cover-image h2 { font-size: 3rem; } } .wp-block-cover h2.has-text-align-left, .wp-block-cover-image h2.has-text-align-left { text-align: left; } .wp-block-cover h2.has-text-align-center, .wp-block-cover-image h2.has-text-align-center { text-align: center; } .wp-block-cover h2.has-text-align-right, .wp-block-cover-image h2.has-text-align-right { text-align: right; } .wp-block-cover .wp-block-cover__inner-container, .wp-block-cover-image .wp-block-cover__inner-container { width: calc(100% - 60px); } .wp-block-cover .wp-block-cover__inner-container > * { margin-top: 20px; margin-bottom: 20px; } .wp-block-cover-image .wp-block-cover__inner-container > * { margin-top: 20px; margin-bottom: 20px; } @media only screen and (min-width: 482px) { .wp-block-cover .wp-block-cover__inner-container > * { margin-top: 30px; margin-bottom: 30px; } .wp-block-cover-image .wp-block-cover__inner-container > * { margin-top: 30px; margin-bottom: 30px; } } .wp-block-cover .wp-block-cover__inner-container > *:first-child, .wp-block-cover-image .wp-block-cover__inner-container > *:first-child { margin-top: 0; } .wp-block-cover .wp-block-cover__inner-container > *:last-child, .wp-block-cover-image .wp-block-cover__inner-container > *:last-child { margin-bottom: 0; } .wp-block-cover.alignleft, .wp-block-cover.alignright, .wp-block-cover-image.alignleft, .wp-block-cover-image.alignright { margin-top: 0; } .wp-block-cover.alignleft > * { margin-top: 60px; margin-bottom: 60px; padding-left: 25px; padding-right: 25px; width: 100%; } .wp-block-cover.alignright > * { margin-top: 60px; margin-bottom: 60px; padding-left: 25px; padding-right: 25px; width: 100%; } .wp-block-cover-image.alignleft > * { margin-top: 60px; margin-bottom: 60px; padding-left: 25px; padding-right: 25px; width: 100%; } .wp-block-cover-image.alignright > * { margin-top: 60px; margin-bottom: 60px; padding-left: 25px; padding-right: 25px; width: 100%; } .wp-block-cover.has-left-content, .wp-block-cover.has-right-content, .wp-block-cover-image.has-left-content, .wp-block-cover-image.has-right-content { justify-content: center; } .wp-block-cover.is-style-twentytwentyone-border, .wp-block-cover-image.is-style-twentytwentyone-border { border: 3px solid #28303d; } .wp-block-cover[class*=-background-color][class] .wp-block-cover__inner-container, .wp-block-cover-image[class*=-background-color][class] .wp-block-cover__inner-container { background-color: unset; } .wp-block-file a.wp-block-file__button:active, .wp-block-file a.wp-block-file__button:focus, .wp-block-file a.wp-block-file__button:hover { opacity: inherit; } .wp-block-file a.wp-block-file__button { display: inline-block; } .wp-block-gallery { margin: 0 auto; } .wp-block-gallery .blocks-gallery-image, .wp-block-gallery .blocks-gallery-item { width: calc(50% - 10px); } .wp-block-gallery .blocks-gallery-image figcaption, .wp-block-gallery .blocks-gallery-item figcaption { margin: 0; color: #fff; font-size: 1rem; } .wp-block-gallery .blocks-gallery-image figcaption a, .wp-block-gallery .blocks-gallery-item figcaption a { color: #fff; } .wp-block-gallery .blocks-gallery-image figcaption a:focus { background-color: transparent; outline: 2px solid #28303d; text-decoration: none; } .wp-block-gallery .blocks-gallery-item figcaption a:focus { background-color: transparent; outline: 2px solid #28303d; text-decoration: none; } .wp-block-gallery .blocks-gallery-image a:focus img, .wp-block-gallery .blocks-gallery-item a:focus img { outline-offset: 2px; } .wp-block-group { display: block; clear: both; display: flow-root; } .wp-block-group:before, .wp-block-group:after { content: ""; display: block; clear: both; } .wp-block-group .wp-block-group__inner-container { margin-left: auto; margin-right: auto; } .wp-block-group .wp-block-group__inner-container > * { margin-top: 20px; margin-bottom: 20px; } @media only screen and (min-width: 482px) { .wp-block-group .wp-block-group__inner-container > * { margin-top: 30px; margin-bottom: 30px; } } .wp-block-group .wp-block-group__inner-container > *:first-child { margin-top: 0; } .wp-block-group .wp-block-group__inner-container > *:last-child { margin-bottom: 0; } .wp-block-group.has-background { padding: 20px; } @media only screen and (min-width: 482px) { .wp-block-group.has-background { padding: 30px; } } .wp-block-group.is-style-twentytwentyone-border { border: 3px solid #28303d; padding: 30px; } .wp-block-group.has-background .wp-block-group__inner-container > .alignfull { max-width: calc(100% + 60px); width: calc(100% + 60px); margin-left: -30px; } .wp-block-group.has-background .wp-block-group__inner-container > hr.wp-block-separator:not(.is-style-dots):not(.alignwide).alignfull { max-width: calc(100% + 60px); width: calc(100% + 60px); margin-left: -30px; } .wp-block-group.is-style-twentytwentyone-border .wp-block-group__inner-container > .alignfull { max-width: calc(100% + 60px); width: calc(100% + 60px); margin-left: -30px; } .wp-block-group.is-style-twentytwentyone-border .wp-block-group__inner-container > hr.wp-block-separator:not(.is-style-dots):not(.alignwide).alignfull { max-width: calc(100% + 60px); width: calc(100% + 60px); margin-left: -30px; } h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { clear: both; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-weight: normal; } h1 strong, .h1 strong, h2 strong, .h2 strong, h3 strong, .h3 strong, h4 strong, .h4 strong, h5 strong, .h5 strong, h6 strong, .h6 strong { font-weight: 600; } h1 { font-size: 4rem; letter-spacing: normal; line-height: 1.1; } @media only screen and (min-width: 652px) { h1 { font-size: 6rem; } } .h1 { font-size: 4rem; letter-spacing: normal; line-height: 1.1; } @media only screen and (min-width: 652px) { .h1 { font-size: 6rem; } } h2 { font-size: 2.25rem; letter-spacing: normal; line-height: 1.3; } @media only screen and (min-width: 652px) { h2 { font-size: 3rem; } } .h2 { font-size: 2.25rem; letter-spacing: normal; line-height: 1.3; } @media only screen and (min-width: 652px) { .h2 { font-size: 3rem; } } h3 { font-size: 2rem; letter-spacing: normal; line-height: 1.3; } @media only screen and (min-width: 652px) { h3 { font-size: 2rem; } } .h3 { font-size: 2rem; letter-spacing: normal; line-height: 1.3; } @media only screen and (min-width: 652px) { .h3 { font-size: 2rem; } } h4, .h4 { font-size: 1.5rem; font-weight: 600; letter-spacing: normal; line-height: 1.3; } h5, .h5 { font-size: 1.125rem; font-weight: 600; letter-spacing: 0.05em; line-height: 1.3; } h6, .h6 { font-size: 1rem; font-weight: 600; letter-spacing: 0.05em; line-height: 1.3; } .wp-block-image { text-align: center; } .wp-block-image figcaption { color: #28303d; font-size: 1rem; line-height: 1.7; margin-top: 10px; margin-bottom: 20px; text-align: center; } .wp-block-image .alignright { margin-left: 25px; } .wp-block-image .alignleft { margin-right: 25px; } .wp-block-image a:focus img { outline-offset: 2px; } .entry-content > *[class=wp-block-image], .entry-content [class*=inner-container] > *[class=wp-block-image] { margin-top: 0; margin-bottom: 0; } .entry-content > *[class=wp-block-image] + *, .entry-content [class*=inner-container] > *[class=wp-block-image] + * { margin-top: 0; } .wp-block-image.is-style-twentytwentyone-border img, .wp-block-image.is-style-twentytwentyone-image-frame img { border: 3px solid #28303d; } .wp-block-image.is-style-twentytwentyone-image-frame img { padding: 20px; } @media only screen and (min-width: 482px) { .entry-content > .wp-block-image > .alignleft, .entry-content > .wp-block-image > .alignright { max-width: 50%; } } @media only screen and (max-width: 481px) { .entry-content > .wp-block-image > .alignleft, .entry-content > .wp-block-image > .alignright { margin-left: 0; margin-right: 0; } } .wp-block-latest-comments { padding-left: 0; } .wp-block-latest-comments .wp-block-latest-comments__comment { font-size: 1.125rem; line-height: 1.7; /* Vertical margins logic */ margin-top: 30px; margin-bottom: 30px; } .wp-block-latest-comments .wp-block-latest-comments__comment:first-child { margin-top: 0; } .wp-block-latest-comments .wp-block-latest-comments__comment:last-child { margin-bottom: 0; } .wp-block-latest-comments .wp-block-latest-comments__comment-meta { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; } .wp-block-latest-comments .wp-block-latest-comments__comment-date { color: #28303d; font-size: 1.125rem; } .wp-block-latest-comments .wp-block-latest-comments__comment-excerpt p { font-size: 1.125rem; line-height: 1.7; margin: 0; } .wp-block-latest-posts { padding-left: 0; } .wp-block-latest-posts:not(.is-grid) > li { margin-top: 50px; margin-bottom: 50px; } .wp-block-latest-posts:not(.is-grid) > li:first-child { margin-top: 0; } .wp-block-latest-posts:not(.is-grid) > li:last-child { margin-bottom: 0; } .widget-area .wp-block-latest-posts:not(.is-grid) > li { margin-top: 0; margin-bottom: 0; } .wp-block-latest-posts.is-grid { word-wrap: break-word; word-break: break-word; } .wp-block-latest-posts.is-grid > li { margin-bottom: 30px; } .wp-block-latest-posts.is-grid > li:last-child { margin-bottom: 0; } .wp-block-latest-posts.is-grid.columns-2 > li:nth-last-child(-n+2):nth-child(2n+1), .wp-block-latest-posts.is-grid.columns-2 > li:nth-last-child(-n+2):nth-child(2n+1) ~ li, .wp-block-latest-posts.is-grid.columns-3 > li:nth-last-child(-n+3):nth-child(3n+1), .wp-block-latest-posts.is-grid.columns-3 > li:nth-last-child(-n+3):nth-child(3n+1) ~ li, .wp-block-latest-posts.is-grid.columns-4 > li:nth-last-child(-n+4):nth-child(4n+1), .wp-block-latest-posts.is-grid.columns-4 > li:nth-last-child(-n+4):nth-child(4n+1) ~ li, .wp-block-latest-posts.is-grid.columns-5 > li:nth-last-child(-n+5):nth-child(5n+1), .wp-block-latest-posts.is-grid.columns-5 > li:nth-last-child(-n+5):nth-child(5n+1) ~ li, .wp-block-latest-posts.is-grid.columns-6 > li:nth-last-child(-n+6):nth-child(6n+1), .wp-block-latest-posts.is-grid.columns-6 > li:nth-last-child(-n+6):nth-child(6n+1) ~ li { margin-bottom: 0; } .wp-block-latest-posts > li > * { margin-top: 10px; margin-bottom: 10px; } .wp-block-latest-posts > li > *:first-child { margin-top: 0; } .wp-block-latest-posts > li > *:last-child { margin-bottom: 0; } .wp-block-latest-posts > li > a { display: inline-block; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 2rem; font-weight: normal; line-height: 1.3; margin-bottom: 10px; } @media only screen and (min-width: 652px) { .wp-block-latest-posts > li > a { font-size: 2rem; } } .widget-area .wp-block-latest-posts > li > a { font-size: 1.125rem; margin-bottom: 0; } .wp-block-latest-posts .wp-block-latest-posts__post-author { color: #28303d; font-size: 1.25rem; line-height: 1.7; } .wp-block-latest-posts .wp-block-latest-posts__post-date { color: #28303d; font-size: 1rem; line-height: 1.7; } [class*=inner-container] .wp-block-latest-posts .wp-block-latest-posts__post-date, .has-background .wp-block-latest-posts .wp-block-latest-posts__post-date { color: currentColor; } .wp-block-latest-posts .wp-block-latest-posts__post-excerpt, .wp-block-latest-posts .wp-block-latest-posts__post-full-content { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.125rem; line-height: 1.7; margin-top: 20px; } .wp-block-latest-posts.alignfull { padding-left: 20px; padding-right: 20px; } .entry-content [class*=inner-container] .wp-block-latest-posts.alignfull, .entry-content .has-background .wp-block-latest-posts.alignfull { padding-left: 0; padding-right: 0; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers { border-top: 3px solid #28303d; border-bottom: 3px solid #28303d; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers:not(.is-grid) > li { padding-bottom: 30px; border-bottom: 1px solid #28303d; margin-top: 30px; margin-bottom: 30px; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers > li { padding-bottom: 30px; border-bottom: 1px solid #28303d; margin-top: 30px; margin-bottom: 30px; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers:not(.is-grid) > li:last-child, .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers > li:last-child { padding-bottom: 0; border-bottom: none; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid { box-shadow: inset 0 -1px 0 0 #28303d; border-bottom: 2px solid #28303d; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid li { margin: 0; padding-top: 30px; padding-right: 25px; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid li:last-child { padding-bottom: 30px; } @media screen and (min-width: 600px) { .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-2 li { width: 50%; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-3 li { width: 33%; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-4 li { width: 25%; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-5 li { width: 20%; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-6 li { width: 17%; } } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders li { border: 3px solid #28303d; padding: 30px 25px; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders li:last-child { padding-bottom: 30px; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders:not(.is-grid) li { margin-top: 25px; margin-bottom: 25px; } .gallery-item { display: inline-block; text-align: center; vertical-align: top; width: 100%; } .gallery-item a { display: block; } .gallery-item a:focus img { outline-offset: -2px; } .gallery-columns-2 .gallery-item { max-width: 50%; } .gallery-columns-3 .gallery-item { max-width: 33.33%; } .gallery-columns-4 .gallery-item { max-width: 25%; } .gallery-columns-5 .gallery-item { max-width: 20%; } .gallery-columns-6 .gallery-item { max-width: 16.66%; } .gallery-columns-7 .gallery-item { max-width: 14.28%; } .gallery-columns-8 .gallery-item { max-width: 12.5%; } .gallery-columns-9 .gallery-item { max-width: 11.11%; } .gallery-caption { display: block; } figure.wp-caption a:focus img { outline-offset: 2px; } ul, ol { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; margin: 0; padding-left: 50px; } ul.aligncenter, ol.aligncenter, ul.alignright, ol.alignright { list-style-position: inside; padding: 0; } ul.alignright, ol.alignright { text-align: right; } ul { list-style-type: disc; } ul ul { list-style-type: circle; } ol { list-style-type: decimal; } ol ul { list-style-type: circle; } dt { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-weight: bold; } dd { margin: 0; padding-left: 50px; } .wp-block-media-text { /** * Block Options */ } .wp-block-media-text.alignfull { margin-top: 0; margin-bottom: 0; } .wp-block-media-text a:focus img { outline-offset: -1px; } .wp-block-media-text .wp-block-media-text__content { padding: 25px; } @media only screen and (min-width: 592px) { .wp-block-media-text .wp-block-media-text__content { padding: 30px; } } .wp-block-media-text .wp-block-media-text__content > * { margin-top: 20px; margin-bottom: 20px; } @media only screen and (min-width: 482px) { .wp-block-media-text .wp-block-media-text__content > * { margin-top: 30px; margin-bottom: 30px; } } .wp-block-media-text .wp-block-media-text__content > *:first-child { margin-top: 0; } .wp-block-media-text .wp-block-media-text__content > *:last-child { margin-bottom: 0; } @media only screen and (min-width: 482px) { .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content { padding-top: 30px; padding-bottom: 30px; } } .wp-block-media-text.is-style-twentytwentyone-border { border: 3px solid #28303d; } .wp-block-navigation .wp-block-navigation-link { padding: 0; } .wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__content { padding: 13px; } .wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__label { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.25rem; font-weight: normal; } .wp-block-navigation .wp-block-navigation-link__submenu-icon { padding: 0; } .wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation-link { display: inherit; } .wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container { border: none; left: 0; margin-left: 13px; min-width: max-content; opacity: 0; padding: 0; position: inherit; top: inherit; } .wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container .wp-block-navigation-link .wp-block-navigation-link__content { display: inline-block; padding: 7px 13px; } .wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container .wp-block-navigation-link__submenu-icon { display: none; } .wp-block-navigation > .wp-block-navigation__container .has-child:hover .wp-block-navigation__container, .wp-block-navigation > .wp-block-navigation__container .has-child:focus-within .wp-block-navigation__container { display: block; opacity: 1; visibility: visible; } .wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container { background: #d1e4dd; margin: 0; padding: 0; position: absolute; top: 100%; border: 1px solid #28303d; } .wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container:before { content: ""; display: block; position: absolute; width: 0; top: -10px; left: 25px; border-style: solid; border-color: #28303d transparent; border-width: 0 7px 10px 7px; } .wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container:after { content: ""; display: block; position: absolute; width: 0; top: -10px; left: 25px; border-style: solid; border-color: #28303d transparent; border-width: 0 7px 10px 7px; } .wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container:after { top: -9px; border-color: #d1e4dd transparent; } .wp-block-navigation:not(.has-background) .wp-block-navigation__container { background: #d1e4dd; } .wp-block-navigation:not(.has-background) .wp-block-navigation__container .wp-block-navigation__container { background: #d1e4dd; } .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:hover { color: #28303d; } .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:focus { color: #28303d; } .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:hover { text-decoration: underline; text-decoration-style: dotted; } .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link__content { color: currentColor; } p { line-height: 1.7; } p.has-background { padding: 20px; } p.has-text-color a { color: #28303d; } pre.wp-block-preformatted { overflow-x: auto; white-space: pre; } .wp-block-pullquote { padding: 40px 0; text-align: center; border-width: 3px; border-bottom-style: solid; border-top-style: solid; color: currentColor; border-color: currentColor; position: relative; /** * Block Options */ } .wp-block-pullquote blockquote::before { color: currentColor; content: "“"; display: block; position: relative; left: 0; font-size: 3rem; font-weight: 500; line-height: 1; } .wp-block-pullquote p { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 2rem; font-style: normal; font-weight: 700; letter-spacing: normal; line-height: 1.3; margin: 0; } @media only screen and (min-width: 652px) { .wp-block-pullquote p { font-size: 2rem; } } .wp-block-pullquote a { color: currentColor; } .wp-block-pullquote .wp-block-pullquote__citation, .wp-block-pullquote cite, .wp-block-pullquote footer { color: currentColor; display: block; font-size: 1rem; font-style: normal; text-transform: none; } .wp-block-pullquote:not(.is-style-solid-color) { background: none; } .wp-block-pullquote.alignleft:not(.is-style-solid-color) blockquote:before, .wp-block-pullquote.alignleft:not(.is-style-solid-color) cite { text-align: center; } .wp-block-pullquote.alignwide > p { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .wp-block-pullquote.alignwide > p { max-width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .wp-block-pullquote.alignwide > p { max-width: min(calc(100vw - 200px), 1240px); } } .wp-block-pullquote.alignwide blockquote { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .wp-block-pullquote.alignwide blockquote { max-width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { .wp-block-pullquote.alignwide blockquote { max-width: min(calc(100vw - 200px), 1240px); } } .wp-block-pullquote.alignfull:not(.is-style-solid-color) > p { padding: 0 40px; } .wp-block-pullquote.alignfull:not(.is-style-solid-color) blockquote { padding: 0 40px; } .wp-block-pullquote.is-style-solid-color { color: #28303d; padding: 50px; border-width: 3px; border-style: solid; border-color: #28303d; } @media (min-width: 600px) { .wp-block-pullquote.is-style-solid-color { padding: 100px; } } .wp-block-pullquote.is-style-solid-color blockquote::before { text-align: left; } .wp-block-pullquote.is-style-solid-color blockquote { margin: 0; max-width: inherit; } .wp-block-pullquote.is-style-solid-color blockquote p { font-size: 2rem; } @media only screen and (min-width: 652px) { .wp-block-pullquote.is-style-solid-color blockquote p { font-size: 2rem; } } .wp-block-pullquote.is-style-solid-color .wp-block-pullquote__citation, .wp-block-pullquote.is-style-solid-color cite, .wp-block-pullquote.is-style-solid-color footer { color: currentColor; } .wp-block-pullquote.is-style-solid-color.alignleft, .wp-block-pullquote.is-style-solid-color.alignright { padding: 20px; } .wp-block-pullquote.is-style-solid-color.alignleft blockquote, .wp-block-pullquote.is-style-solid-color.alignright blockquote { max-width: initial; } .wp-block-query.has-background { padding: 20px; } @media only screen and (min-width: 482px) { .wp-block-query.has-background { padding: 30px; } } .wp-block-quote { border-left: none; /** * Block Options */ } .wp-block-quote:before { content: "“"; font-size: 1.25rem; line-height: 1.7; left: 8px; } .has-background .wp-block-quote .wp-block-quote__citation, [class*=background-color] .wp-block-quote .wp-block-quote__citation, [style*=background-color] .wp-block-quote .wp-block-quote__citation, .wp-block-cover[style*=background-image] .wp-block-quote .wp-block-quote__citation, .has-background .wp-block-quote cite, [class*=background-color] .wp-block-quote cite, [style*=background-color] .wp-block-quote cite, .wp-block-cover[style*=background-image] .wp-block-quote cite, .has-background .wp-block-quote footer, [class*=background-color] .wp-block-quote footer, [style*=background-color] .wp-block-quote footer, .wp-block-cover[style*=background-image] .wp-block-quote footer { color: currentColor; } .wp-block-quote.has-text-align-right { margin: 30px 25px 30px auto; padding-right: 0; border-right: none; } .wp-block-quote.has-text-align-right:before { display: none; } .wp-block-quote.has-text-align-right p:before { content: "”"; font-size: 1.25rem; font-weight: normal; line-height: 1.7; margin-right: 5px; } .wp-block-quote.has-text-align-center { margin: 30px auto; } .wp-block-quote.has-text-align-center:before { display: none; } .wp-block-quote.is-large, .wp-block-quote.is-style-large { padding-left: 0; padding-right: 0; /* Resetting margins to match _block-container.scss */ margin-top: 30px; margin-bottom: 30px; } .wp-block-quote.is-large p { font-size: 2.25rem; font-style: normal; line-height: 1.35; } @media only screen and (min-width: 652px) { .wp-block-quote.is-large p { font-size: 2.5rem; } } .wp-block-quote.is-style-large p { font-size: 2.25rem; font-style: normal; line-height: 1.35; } @media only screen and (min-width: 652px) { .wp-block-quote.is-style-large p { font-size: 2.5rem; } } .wp-block-quote.is-large:before { font-size: 2.25rem; line-height: 1.35; left: -25px; } @media only screen and (min-width: 652px) { .wp-block-quote.is-large:before { font-size: 2.5rem; } } .wp-block-quote.is-style-large:before { font-size: 2.25rem; line-height: 1.35; left: -25px; } @media only screen and (min-width: 652px) { .wp-block-quote.is-style-large:before { font-size: 2.5rem; } } .wp-block-quote.is-large.has-text-align-right:before, .wp-block-quote.is-style-large.has-text-align-right:before { display: none; } .wp-block-quote.is-large.has-text-align-right p:before { content: "”"; font-size: 2.25rem; font-weight: normal; line-height: 1.35; margin-right: 10px; } @media only screen and (min-width: 652px) { .wp-block-quote.is-large.has-text-align-right p:before { font-size: 2.5rem; } } .wp-block-quote.is-style-large.has-text-align-right p:before { content: "”"; font-size: 2.25rem; font-weight: normal; line-height: 1.35; margin-right: 10px; } @media only screen and (min-width: 652px) { .wp-block-quote.is-style-large.has-text-align-right p:before { font-size: 2.5rem; } } .wp-block-quote.is-large .wp-block-quote__citation, .wp-block-quote.is-large cite, .wp-block-quote.is-large footer, .wp-block-quote.is-style-large .wp-block-quote__citation, .wp-block-quote.is-style-large cite, .wp-block-quote.is-style-large footer { color: #28303d; font-size: 1.125rem; } @media only screen and (max-width: 481px) { .wp-block-quote.is-large, .wp-block-quote.is-style-large { padding-left: 25px; } .wp-block-quote.is-large:before, .wp-block-quote.is-style-large:before { left: 0; } .wp-block-quote.is-large.has-text-align-right, .wp-block-quote.is-style-large.has-text-align-right { padding-left: 0; padding-right: 25px; } .wp-block-quote.is-large.has-text-align-right:before, .wp-block-quote.is-style-large.has-text-align-right:before { right: 0; } .wp-block-quote.is-large.has-text-align-center, .wp-block-quote.is-style-large.has-text-align-center { padding-left: 0; padding-right: 0; } .wp-block-quote.has-text-align-right { padding-left: 0; padding-right: 13px; } } @media only screen and (max-width: 481px) { .wp-block-quote.has-text-align-right:before { right: 0; } .wp-block-quote.has-text-align-center { padding-left: 0; padding-right: 0; } } .wp-block-rss { padding-left: 0; } .wp-block-rss > li { list-style: none; } .wp-block-rss:not(.is-grid) > li { margin-top: 50px; margin-bottom: 50px; } .wp-block-rss:not(.is-grid) > li:first-child { margin-top: 0; } .wp-block-rss:not(.is-grid) > li:last-child { margin-bottom: 0; } .wp-block-rss.is-grid > li { margin-bottom: 30px; } .wp-block-rss.is-grid > li:last-child { margin-bottom: 0; } .wp-block-rss.is-grid.columns-2 > li:nth-last-child(-n+2):nth-child(2n+1), .wp-block-rss.is-grid.columns-2 > li:nth-last-child(-n+2):nth-child(2n+1) ~ li, .wp-block-rss.is-grid.columns-3 > li:nth-last-child(-n+3):nth-child(3n+1), .wp-block-rss.is-grid.columns-3 > li:nth-last-child(-n+3):nth-child(3n+1) ~ li, .wp-block-rss.is-grid.columns-4 > li:nth-last-child(-n+4):nth-child(4n+1), .wp-block-rss.is-grid.columns-4 > li:nth-last-child(-n+4):nth-child(4n+1) ~ li, .wp-block-rss.is-grid.columns-5 > li:nth-last-child(-n+5):nth-child(5n+1), .wp-block-rss.is-grid.columns-5 > li:nth-last-child(-n+5):nth-child(5n+1) ~ li, .wp-block-rss.is-grid.columns-6 > li:nth-last-child(-n+6):nth-child(6n+1), .wp-block-rss.is-grid.columns-6 > li:nth-last-child(-n+6):nth-child(6n+1) ~ li { margin-bottom: 0; } .wp-block-rss > li > * { margin-top: 10px; margin-bottom: 10px; } .wp-block-rss > li > *:first-child { margin-top: 0; } .wp-block-rss > li > *:last-child { margin-bottom: 0; } .wp-block-rss .wp-block-rss__item-title > a { display: inline-block; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 2rem; font-weight: normal; line-height: 1.3; margin-bottom: 10px; } @media only screen and (min-width: 652px) { .wp-block-rss .wp-block-rss__item-title > a { font-size: 2rem; } } .wp-block-rss .wp-block-rss__item-author { color: #28303d; font-size: 1.25rem; line-height: 1.7; } .wp-block-rss .wp-block-rss__item-publish-date { color: #28303d; font-size: 1rem; line-height: 1.7; } [class*=inner-container] .wp-block-rss .wp-block-rss__item-publish-date, .has-background .wp-block-rss .wp-block-rss__item-publish-date { color: currentColor; } .wp-block-rss .wp-block-rss__item-excerpt, .wp-block-rss .wp-block-rss__item-full-content { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.125rem; line-height: 1.7; margin-top: 20px; } .wp-block-rss.alignfull { padding-left: 20px; padding-right: 20px; } .entry-content [class*=inner-container] .wp-block-rss.alignfull, .entry-content .has-background .wp-block-rss.alignfull { padding-left: 0; padding-right: 0; } .wp-block-search { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .wp-block-search { max-width: min(calc(100vw - 100px), 610px); } } @media only screen and (min-width: 822px) { .wp-block-search { max-width: min(calc(100vw - 200px), 610px); } } .wp-block-search__button-only.aligncenter .wp-block-search__inside-wrapper { justify-content: center; } .wp-block-search .wp-block-search__label { font-size: 1.125rem; font-weight: 500; margin-bottom: 10px; } .wp-block-search .wp-block-search__input { border: 3px solid #39414d; border-radius: 0; color: #28303d; line-height: 1.7; max-width: inherit; margin-right: -3px; padding: 10px; } .wp-block-search .wp-block-search__input:focus { color: #28303d; border-color: #39414d; } .has-background .wp-block-search .wp-block-search__input { border-color: #28303d !important; } .wp-block-search button.wp-block-search__button { margin-left: 0; line-height: 1; } .wp-block-search button.wp-block-search__button.has-icon { padding: 6px 15px; } .wp-block-search button.wp-block-search__button.has-icon svg { width: 40px; height: 40px; fill: currentColor; } .has-background .wp-block-search button.wp-block-search__button:hover { background-color: #d1e4dd !important; color: #28303d !important; } .has-background .wp-block-search button.wp-block-search__button:active { background-color: #d1e4dd !important; color: #28303d !important; } .has-text-color .wp-block-search button.wp-block-search__button:hover { color: #28303d !important; } .has-text-color .wp-block-search button.wp-block-search__button:active { color: #28303d !important; } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper { background-color: #fff; border: 3px solid #39414d; border-radius: 0; padding: 3px; } .has-background .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper { border-color: #28303d !important; } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input { margin-left: 0; margin-right: 0; padding-left: 10px; } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input:focus { color: #28303d; outline-offset: -2px; outline: 2px dotted #39414d; } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper button.wp-block-search__button { padding: 15px 30px; } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper button.wp-block-search__button:hover { color: #28303d; } .is-dark-theme .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper button.wp-block-search__button { color: #28303d; } .is-dark-theme .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper button.wp-block-search__button:hover { background-color: #28303d; color: #fff; } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper button.wp-block-search__button.has-icon { padding: 6px 15px; } .wp-block-search__button { box-shadow: none; } hr { border-style: none; clear: both; margin-left: auto; margin-right: auto; } hr, hr.wp-block-separator { border-bottom: 1px solid #28303d; } hr.wp-block-separator { opacity: 1; /** * Block Options */ } hr.wp-block-separator:not(.is-style-dots):not(.alignwide) { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { hr.wp-block-separator:not(.is-style-dots):not(.alignwide) { max-width: min(calc(100vw - 100px), 610px); } } @media only screen and (min-width: 822px) { hr.wp-block-separator:not(.is-style-dots):not(.alignwide) { max-width: min(calc(100vw - 200px), 610px); } } hr.wp-block-separator:not(.is-style-dots).alignwide { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { hr.wp-block-separator:not(.is-style-dots).alignwide { max-width: calc(100vw - 100px); } } @media only screen and (min-width: 822px) { hr.wp-block-separator:not(.is-style-dots).alignwide { max-width: min(calc(100vw - 200px), 1240px); } } hr.wp-block-separator:not(.is-style-dots).alignfull { max-width: 100%; } hr.wp-block-separator.is-style-twentytwentyone-separator-thick { border-bottom-width: 3px; } hr.wp-block-separator.is-style-dots.has-background, hr.wp-block-separator.is-style-dots.has-text-color { background-color: transparent !important; } hr.wp-block-separator.is-style-dots.has-background:before, hr.wp-block-separator.is-style-dots.has-text-color:before { color: currentColor !important; } hr.wp-block-separator.is-style-dots:before { color: #28303d; font-size: 2.25rem; letter-spacing: 1.125rem; padding-left: 1.125rem; } @media only screen and (min-width: 652px) { hr.wp-block-separator.is-style-dots:before { font-size: 2.5rem; } } .has-background hr.wp-block-separator, [class*=background-color] hr.wp-block-separator, [style*=background-color] hr.wp-block-separator, .wp-block-cover[style*=background-image] hr.wp-block-separator { border-color: currentColor; } .wp-block-social-links a:focus { color: #28303d; } .wp-block-social-links.is-style-twentytwentyone-social-icons-color a { color: #28303d; } .wp-block-social-links.is-style-twentytwentyone-social-icons-color .wp-social-link, .wp-block-social-links.is-style-twentytwentyone-social-icons-color.has-icon-background-color.has-icon-background-color .wp-social-link { background: none; } .wp-block-spacer { display: block; margin-bottom: 0 !important; margin-top: 0 !important; } @media only screen and (max-width: 481px) { .wp-block-spacer[style] { height: 20px !important; } } table, .wp-block-table { width: 100%; min-width: 240px; border-collapse: collapse; } table thead, table tfoot, .wp-block-table thead, .wp-block-table tfoot { text-align: center; } table th, .wp-block-table th { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; } table td, table th, .wp-block-table td, .wp-block-table th { padding: 10px; border: 1px solid; } table figcaption, .wp-block-table figcaption { color: #28303d; font-size: 1rem; } table.is-style-regular .has-background, table.is-style-stripes .has-background, table.is-style-stripes .has-background thead tr, table.is-style-stripes .has-background tfoot tr, table.is-style-stripes .has-background tbody tr, .wp-block-table.is-style-regular .has-background, .wp-block-table.is-style-stripes .has-background, .wp-block-table.is-style-stripes .has-background thead tr, .wp-block-table.is-style-stripes .has-background tfoot tr, .wp-block-table.is-style-stripes .has-background tbody tr { color: #28303d; } table.is-style-stripes, .wp-block-table.is-style-stripes { border-color: #f0f0f0; } table.is-style-stripes th, table.is-style-stripes td, .wp-block-table.is-style-stripes th, .wp-block-table.is-style-stripes td { border-width: 0; } table.is-style-stripes tbody tr:nth-child(odd) { background-color: #f0f0f0; } .wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background-color: #f0f0f0; } table.is-style-stripes .has-background tbody tr:nth-child(odd) { background-color: rgba(255, 255, 255, 0.9); } .wp-block-table.is-style-stripes .has-background tbody tr:nth-child(odd) { background-color: rgba(255, 255, 255, 0.9); } table.wp-calendar-table td, table.wp-calendar-table th { background: transparent; border: 0; text-align: center; line-height: 2; vertical-align: middle; word-break: normal; } table.wp-calendar-table th { font-weight: bold; } table.wp-calendar-table thead, table.wp-calendar-table tbody { color: currentColor; border: 1px solid; } table.wp-calendar-table caption { font-weight: bold; text-align: left; margin-bottom: 20px; color: currentColor; } .wp-calendar-nav { text-align: left; margin-top: 10px; } .wp-calendar-nav svg { height: 1em; vertical-align: middle; } .wp-calendar-nav svg path { fill: currentColor; } .wp-calendar-nav .wp-calendar-nav-next { float: right; } .wp-block-tag-cloud.alignfull { padding-left: 20px; padding-right: 20px; } .wp-block-verse { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; } .wp-block-video figcaption { color: #28303d; font-size: 1rem; margin-top: 10px; margin-bottom: 20px; text-align: center; } * > figure > video { max-width: unset; width: 100%; vertical-align: middle; } :root .is-extra-small-text { font-size: 1rem; } :root .has-extra-small-font-size { font-size: 1rem; } :root .is-small-text { font-size: 1.125rem; } :root .has-small-font-size { font-size: 1.125rem; } :root .is-regular-text { font-size: 1.25rem; } :root .has-regular-font-size { font-size: 1.25rem; } :root .is-normal-font-size { font-size: 1.25rem; } :root .has-normal-font-size { font-size: 1.25rem; } :root .has-medium-font-size { font-size: 1.25rem; } :root .is-large-text { font-size: 1.5rem; line-height: 1.3; } :root .has-large-font-size { font-size: 1.5rem; line-height: 1.3; } :root .is-larger-text { font-size: 2.5rem; line-height: 1.3; } @media only screen and (min-width: 652px) { :root .is-larger-text { font-size: 2.5rem; } } :root .has-larger-font-size { font-size: 2.5rem; line-height: 1.3; } @media only screen and (min-width: 652px) { :root .has-larger-font-size { font-size: 2.5rem; } } :root .is-extra-large-text { font-size: 2.5rem; line-height: 1.3; } @media only screen and (min-width: 652px) { :root .is-extra-large-text { font-size: 2.5rem; } } :root .has-extra-large-font-size { font-size: 2.5rem; line-height: 1.3; } @media only screen and (min-width: 652px) { :root .has-extra-large-font-size { font-size: 2.5rem; } } :root .is-huge-text { font-size: 6rem; line-height: 1.3; font-weight: 300; } @media only screen and (min-width: 652px) { :root .is-huge-text { font-size: 6rem; } } :root .has-huge-font-size { font-size: 6rem; line-height: 1.3; font-weight: 300; } @media only screen and (min-width: 652px) { :root .has-huge-font-size { font-size: 6rem; } } :root .is-gigantic-text { font-size: 9rem; line-height: 1.3; font-weight: 300; } @media only screen and (min-width: 652px) { :root .is-gigantic-text { font-size: 9rem; } } :root .has-gigantic-font-size { font-size: 9rem; line-height: 1.3; font-weight: 300; } @media only screen and (min-width: 652px) { :root .has-gigantic-font-size { font-size: 9rem; } } /* Block Alignments */ /** * These selectors set the default max width for content appearing inside a post or page. */ /** * .alignleft */ .alignleft { /*rtl:ignore*/ text-align: left; margin-top: 0; } .entry-content > .alignleft { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .entry-content > .alignleft { max-width: min(calc(100vw - 100px), 610px); } } @media only screen and (min-width: 822px) { .entry-content > .alignleft { max-width: min(calc(100vw - 200px), 610px); } } @media only screen and (min-width: 482px) { .alignleft { /*rtl:ignore*/ float: left; /*rtl:ignore*/ margin-right: 25px; margin-bottom: 30px; } .entry-content > .alignleft { max-width: calc(50% - (100vw - min(calc(100vw - 4 * 25px), 610px)) *1); } @media only screen and (min-width: 482px) { .entry-content > .alignleft { max-width: calc(50% - (100vw - min(calc(100vw - 4 * 25px), 610px)) *1); } } @media only screen and (min-width: 822px) { .entry-content > .alignleft { max-width: calc(50% - (100vw - min(calc(100vw - 4 * 25px), 610px)) *1); } } } /** * .aligncenter */ .aligncenter { clear: both; display: block; float: none; margin-right: auto; margin-left: auto; text-align: center; } /** * .alignright */ .alignright { margin-top: 0; margin-bottom: 30px; } .entry-content > .alignright { max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .entry-content > .alignright { max-width: min(calc(100vw - 100px), 610px); } } @media only screen and (min-width: 822px) { .entry-content > .alignright { max-width: min(calc(100vw - 200px), 610px); } } @media only screen and (min-width: 482px) { .alignright { /*rtl:ignore*/ float: right; /*rtl:ignore*/ margin-left: 25px; } .entry-content > .alignright { max-width: calc(50% - (100vw - min(calc(100vw - 4 * 25px), 610px)) *1); } @media only screen and (min-width: 482px) { .entry-content > .alignright { max-width: calc(50% - (100vw - min(calc(100vw - 4 * 25px), 610px)) *1); } } @media only screen and (min-width: 822px) { .entry-content > .alignright { max-width: calc(50% - (100vw - min(calc(100vw - 4 * 25px), 610px)) *1); } } } [class*=inner-container] > .alignleft + *, [class*=inner-container] > .alignright + * { margin-top: 0; } /** * .alignwide */ /** * .alignfull */ .alignwide, .alignfull { clear: both; } .has-left-content { justify-content: flex-start; } .has-right-content { justify-content: flex-end; } .has-parallax { background-attachment: fixed; } .has-drop-cap:not(:focus)::first-letter { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-weight: normal; line-height: 0.66; text-transform: uppercase; font-style: normal; float: left; margin: 0.1em 0.1em 0 0; font-size: 5rem; } @media only screen and (min-width: 652px) { .has-drop-cap:not(:focus)::first-letter { font-size: 7rem; } } .has-drop-cap:not(:focus)::after { content: ""; display: table; clear: both; padding-top: 14px; } .desktop-only { display: none; } @media only screen and (min-width: 482px) { .desktop-only { display: block; } } /* Category 06 contains all "bigger" components which contain elements of the previous two categories like header, footer, page template, single template, comments section, archives, ... */ .site-header { display: flex; align-items: flex-start; flex-wrap: wrap; row-gap: 30px; } .wp-custom-logo .site-header { align-items: center; } @media only screen and (min-width: 482px) { .site-header { padding-top: 40px; } } @media only screen and (min-width: 822px) { .site-header { padding-top: 72px; } } .site-branding { color: #28303d; margin-right: 140px; } .site-branding:last-child { margin-right: 0; width: 100%; text-align: center; } @media only screen and (min-width: 482px) { .site-branding { margin-right: initial; margin-top: 4px; } } .site-title { color: #28303d; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.5rem; letter-spacing: normal; text-transform: uppercase; line-height: 1.3; margin-bottom: 5px; } .site-title a { color: currentColor; font-weight: normal; } .site-title a:link, .site-title a:visited, .site-title a:active { color: currentColor; } .site-title a:hover { color: #39414d; } .site-title a:focus { color: #39414d; } @media only screen and (min-width: 482px) { .site-title { font-size: 1.5rem; } } .site-description { color: currentColor; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.125rem; line-height: 1.4; } .site-title > a { text-decoration-color: #39414d; } .site-logo { margin: 15px 0; } .site-header > .site-logo { width: 100%; padding-bottom: 45px; border-bottom: 1px solid; text-align: center; } .site-logo .custom-logo { margin-left: auto; margin-right: auto; max-width: 96px; max-height: 96px; height: auto; display: inline-block; width: auto; } @media only screen and (min-width: 482px) { .site-logo .custom-logo { max-width: 300px; max-height: 100px; height: auto; width: auto; } } @media only screen and (max-width: 481px) { .site-header.has-logo:not(.has-title-and-tagline).has-menu .site-logo { position: absolute; padding-top: 15px; margin-top: 0; top: 0; } .primary-navigation-open .site-header.has-logo:not(.has-title-and-tagline).has-menu .site-logo { display: none; } .site-header.has-logo:not(.has-title-and-tagline).has-menu .site-logo img { max-height: calc(10px + 2em); } .site-header.has-logo.has-title-and-tagline { align-items: flex-start; } .site-header.has-logo.has-title-and-tagline.has-menu { justify-content: space-between; } .site-header.has-logo.has-title-and-tagline.has-menu .site-branding { max-width: calc(100% - 160px); } .site-header.has-logo.has-title-and-tagline .site-branding { margin-right: 0; } body:not(.primary-navigation-open) .site-header.has-logo.has-title-and-tagline:after { display: none; } body:not(.primary-navigation-open) .site-header.has-logo.has-title-and-tagline .primary-navigation { position: relative; top: 0; } body:not(.primary-navigation-open) .site-header.has-logo.has-title-and-tagline .menu-button-container { position: relative; padding-top: 0; margin-top: -10px; } body:not(.primary-navigation-open) .site-header.has-logo.has-title-and-tagline .menu-button-container #primary-mobile-menu { padding-left: 11px; padding-right: 11px; margin-right: -15px; } .site-header:not(.has-logo).has-title-and-tagline .site-branding { margin-right: 0; max-width: calc(100% - 160px); } .site-header:not(.has-menu) { justify-content: center; } } .site-footer { padding-top: 0; padding-bottom: 51px; } .no-widgets .site-footer { margin-top: 180px; } @media only screen and (max-width: 481px) { .no-widgets .site-footer { margin-top: 90px; } } .site-footer > .site-info { padding-top: 30px; color: #28303d; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.125rem; line-height: 1.7; border-top: 3px solid #28303d; } .site-footer > .site-info .site-name { text-transform: uppercase; font-size: 1.5rem; } .site-footer > .site-info .privacy-policy { margin-top: 15px; } .site-footer > .site-info .powered-by { margin-top: 15px; } @media only screen and (min-width: 822px) { .site-footer > .site-info { display: flex; align-items: center; } .site-footer > .site-info .site-name { margin-right: 15px; } .site-footer > .site-info .privacy-policy, .site-footer > .site-info .powered-by { margin-top: initial; margin-left: auto; } .site-footer > .site-info .privacy-policy + .powered-by { margin-left: 15px; } } .site-footer > .site-info a { color: #28303d; } .site-footer > .site-info a:link { color: #28303d; } .site-footer > .site-info a:visited { color: #28303d; } .site-footer > .site-info a:active { color: #28303d; } .site-footer > .site-info a:hover { color: #28303d; } .site-footer > .site-info a:focus { color: #28303d; } .is-dark-theme .site-footer > .site-info a:focus { color: #d1e4dd; } .has-background-white .site-footer > .site-info a:focus { color: #fff; } .singular .entry-header { border-bottom: 3px solid #28303d; padding-bottom: 60px; margin-bottom: 90px; } .home .entry-header { border-bottom: none; padding-bottom: 0; margin-bottom: 0; } .singular .has-post-thumbnail .entry-header { border-bottom: none; padding-bottom: 39px; margin-bottom: 0; } .no-results.not-found > *:first-child { margin-bottom: 90px; } .page-links { clear: both; } .page-links .post-page-numbers { display: inline-block; margin-left: 13px; margin-right: 13px; min-width: 44px; min-height: 44px; } .page-links .post-page-numbers:first-child { margin-left: 0; } .entry-title { color: #28303d; font-size: 2.25rem; letter-spacing: normal; line-height: 1.3; overflow-wrap: break-word; } @media only screen and (min-width: 652px) { .entry-title { font-size: 3rem; } } .entry-title a { color: currentColor; text-underline-offset: 0.15em; } .entry-title a:hover { color: #28303d; } .entry-title a:focus { color: #39414d; } .entry-title a:active { color: currentColor; } .singular .entry-title { font-size: 4rem; } @media only screen and (min-width: 652px) { .singular .entry-title { font-size: 6rem; } } h1.entry-title { line-height: 1.1; font-weight: 300; } /** * Entry Content */ .entry-content, .entry-summary { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; } .entry-content p { word-wrap: break-word; } .entry-content > iframe[style] { margin: 30px 0 !important; max-width: 100% !important; } .entry-footer { color: #28303d; clear: both; float: none; font-size: 1rem; display: block; } .entry-footer > span { display: inline-block; } .entry-footer a { color: currentColor; } .entry-footer a:hover { color: #28303d; } .entry-footer a:focus { color: #28303d; } .entry-footer a:active { color: currentColor; } .site-main > article > .entry-footer { margin-top: 30px; padding-top: 20px; padding-bottom: 90px; border-bottom: 1px solid #28303d; } body:not(.single) .site-main > article:last-of-type .entry-footer { border-bottom: 1px solid transparent; } .single .site-main > article > .entry-footer { margin-top: 102px; margin-bottom: 102px; padding-bottom: 0; padding-top: 24px; border-top: 3px solid #28303d; border-bottom: 1px solid transparent; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 50px; } .single .site-main > article > .entry-footer .post-taxonomies, .single .site-main > article > .entry-footer .full-size-link { justify-content: flex-end; text-align: right; } .single .site-main > article > .entry-footer .full-size-link:first-child:last-child { grid-column: span 2; } .single .site-main > article > .entry-footer .posted-on, .single .site-main > article > .entry-footer .byline, .single .site-main > article > .entry-footer .cat-links, .single .site-main > article > .entry-footer .tags-links { display: block; } @media only screen and (max-width: 481px) { .single .site-main > article > .entry-footer { display: block; } .single .site-main > article > .entry-footer .full-size-link { display: block; } .single .site-main > article > .entry-footer .post-taxonomies, .single .site-main > article > .entry-footer .full-size-link { text-align: left; } } /** * Post Thumbnails */ .post-thumbnail { text-align: center; } .post-thumbnail .wp-post-image { display: block; width: auto; max-width: 100%; margin-left: auto; margin-right: auto; margin-top: 60px; } /** * Author */ .author-bio { position: relative; font-size: 1rem; max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .author-bio { max-width: min(calc(100vw - 100px), 610px); } } @media only screen and (min-width: 822px) { .author-bio { max-width: min(calc(100vw - 200px), 610px); } } .site-main > article > .author-bio { margin-top: 60px; } .author-bio.show-avatars .avatar { display: inline-block; vertical-align: top; border-radius: 50%; } .author-bio.show-avatars .author-bio-content { display: inline-block; padding-left: 25px; max-width: calc(100vw - 120px); } @media only screen and (min-width: 482px) { .author-bio.show-avatars .author-bio-content { max-width: calc(min(calc(100vw - 4 * 25px), 610px) - 90px); } } @media only screen and (min-width: 822px) { .author-bio.show-avatars .author-bio-content { max-width: calc(min(calc(100vw - 8 * 25px), 610px) - 90px); } } .author-bio .author-bio-content .author-title { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.5rem; display: inline; } .author-bio .author-bio-content .author-description { font-size: 1rem; margin-top: 15px; margin-bottom: 15px; } .page-title { font-size: 4rem; } @media only screen and (min-width: 652px) { .page-title { font-size: 6rem; } } h1.page-title, h2.page-title { font-weight: 300; } h1.page-title { line-height: 1.1; } .page-header { border-bottom: 3px solid #28303d; padding-bottom: 60px; } .archive .content-area .format-aside .entry-content, .archive .content-area .format-status .entry-content, .archive .content-area .format-link .entry-content, .search .content-area .format-aside .entry-content, .search .content-area .format-status .entry-content, .search .content-area .format-link .entry-content, .blog .content-area .format-aside .entry-content, .blog .content-area .format-status .entry-content, .blog .content-area .format-link .entry-content { font-size: 1.5rem; } .archive .format-image .entry-content, .archive .format-gallery .entry-content, .archive .format-video .entry-content, .search .format-image .entry-content, .search .format-gallery .entry-content, .search .format-video .entry-content, .blog .format-image .entry-content, .blog .format-gallery .entry-content, .blog .format-video .entry-content { margin-top: 60px; } .archive .entry-footer .cat-links, .archive .entry-footer .tags-links, .search .entry-footer .cat-links, .search .entry-footer .tags-links, .blog .entry-footer .cat-links, .blog .entry-footer .tags-links { display: block; } .archive.logged-in .entry-footer .posted-on, .search.logged-in .entry-footer .posted-on, .blog.logged-in .entry-footer .posted-on { margin-right: 10px; } .archive-description { margin-top: 30px; font-size: 2.25rem; line-height: 1.3; } @media only screen and (min-width: 652px) { .archive-description { font-size: 2.5rem; } } .error404 main p { font-size: 1.5rem; margin-bottom: 50px; } .search-no-results .page-content { margin-top: 90px; } /** * Comments Wrapper */ .comments-area > * { margin-top: 30px; margin-bottom: 30px; } .comments-area > *:first-child { margin-top: 0; } .comments-area > *:last-child { margin-bottom: 0; } .comments-area.show-avatars .avatar { border-radius: 50%; position: absolute; top: 10px; } .comments-area.show-avatars .fn { display: inline-block; padding-left: 85px; } .comments-area.show-avatars .comment-metadata { padding: 8px 0 9px 85px; } /** * Comment Title */ .comments-title { font-size: 2.25rem; letter-spacing: normal; } @media only screen and (min-width: 652px) { .comments-title { font-size: 3rem; } } .comment-reply-title { font-size: 2.25rem; letter-spacing: normal; } @media only screen and (min-width: 652px) { .comment-reply-title { font-size: 3rem; } } .comment-reply-title { display: flex; justify-content: space-between; } .comment-reply-title small a { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1rem; font-style: normal; font-weight: normal; letter-spacing: normal; } /* Nested comment reply title*/ .comment .comment-respond .comment-reply-title { font-size: 1.5rem; } /** * Comment Lists */ .comment-list { padding-left: 0; list-style: none; } .comment-list > li { margin-top: 30px; margin-bottom: 30px; } .comment-list .children { list-style: none; padding-left: 0; } .comment-list .children > li { margin-top: 30px; margin-bottom: 30px; } @media only screen and (min-width: 482px) { .comment-list .depth-2, .comment-list .depth-3 { padding-left: 100px; } } /** * Comment Meta */ .comment-meta .comment-author { line-height: 1.3; margin-bottom: 5px; } @media only screen and (min-width: 482px) { .comment-meta .comment-author { margin-bottom: 0; padding-right: 0; } } .comment-meta .comment-author .fn { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-weight: normal; font-size: 1.5rem; hyphens: auto; word-wrap: break-word; word-break: break-word; } .comment-meta .comment-metadata { color: #28303d; font-size: 1rem; padding: 8px 0 9px 0; } .comment-meta .comment-metadata .edit-link { margin-left: 25px; } @media only screen and (min-width: 482px) { .comment-meta { margin-right: inherit; } .comment-meta .comment-author { max-width: inherit; } } .reply { font-size: 1.125rem; line-height: 1.3; } .bypostauthor { display: block; } .says { display: none; } .pingback .url, .trackback .url { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; } .comment-body { position: relative; margin-bottom: 51px; } .comment-body > * { margin-top: 30px; margin-bottom: 30px; } .comment-body .reply { margin: 0; } .comment-content { word-wrap: break-word; } .pingback .comment-body, .trackback .comment-body { margin-top: 30px; margin-bottom: 30px; } .comment-respond { margin-top: 30px; } .comment-respond > * { margin-top: 20px; margin-bottom: 20px; } .comment-respond > *:first-child { margin-top: 0; } .comment-respond > *:last-child { margin-bottom: 0; } .comment-respond > *:last-child.comment-form { margin-bottom: 30px; } .comment-author { padding-top: 3px; } .comment-author .url { color: currentColor; } .comment-form { display: flex; flex-wrap: wrap; } .comment-form > * { flex-basis: 100%; } .comment-form .comment-notes { font-size: 1.125rem; } .comment-form .comment-form-url, .comment-form .comment-form-comment { width: 100%; } .comment-form .comment-form-author, .comment-form .comment-form-email { flex-basis: 0; flex-grow: 1; } @media only screen and (max-width: 481px) { .comment-form .comment-form-author, .comment-form .comment-form-email { flex-basis: 100%; } } .comment-form .comment-form-cookies-consent > label { font-size: 1rem; font-weight: normal; } .comment-form .comment-notes { font-size: 1rem; font-weight: normal; } .comment-form > p { margin-bottom: 20px; } .comment-form > p:first-of-type { margin-top: 0; } .comment-form > p:last-of-type { margin-bottom: 0; } .comment-form > p label { display: block; font-size: 1.125rem; margin-bottom: 10px; width: 100%; font-weight: 500; } .comment-form > p input[type=email] { display: block; font-size: 1.125rem; margin-bottom: 10px; width: 100%; font-weight: 500; } .comment-form > p input[type=text] { display: block; font-size: 1.125rem; margin-bottom: 10px; width: 100%; font-weight: 500; } .comment-form > p input[type=url] { display: block; font-size: 1.125rem; margin-bottom: 10px; width: 100%; font-weight: 500; } .comment-form > p textarea { display: block; font-size: 1.125rem; margin-bottom: 10px; width: 100%; font-weight: 500; } .comment-form > p.comment-form-cookies-consent { display: flex; } @media only screen and (min-width: 482px) { .comment-form > p.comment-form-author { margin-right: 38px; } .comment-form > p.comment-notes, .comment-form > p.logged-in-as { display: block; } } .menu-button-container { display: none; justify-content: space-between; position: absolute; right: 0; padding-top: 15px; padding-bottom: 8px; } @media only screen and (max-width: 481px) { .menu-button-container { display: flex; } } .menu-button-container #primary-mobile-menu { display: flex; margin-left: auto; padding: 10px 15px; font-size: 1rem; font-weight: 500; background-color: transparent; border: none; color: #28303d; } .menu-button-container #primary-mobile-menu .dropdown-icon { display: flex; align-items: center; } .menu-button-container #primary-mobile-menu .dropdown-icon .svg-icon { margin-left: 5px; } .menu-button-container #primary-mobile-menu .dropdown-icon.open .svg-icon { position: relative; top: -1px; } .menu-button-container #primary-mobile-menu .dropdown-icon.close { display: none; } .menu-button-container #primary-mobile-menu[aria-expanded*=true] .dropdown-icon.open { display: none; } .menu-button-container #primary-mobile-menu[aria-expanded*=true] .dropdown-icon.close { display: flex; } .has-logo.has-title-and-tagline .menu-button-container #primary-mobile-menu[aria-expanded*=true] .dropdown-icon.close { animation-name: twentytwentyone-close-button-transition; animation-duration: 0.3s; } .primary-navigation-open .menu-button-container { width: 100%; z-index: 500; background-color: #d1e4dd; } .primary-navigation-open .menu-button-container #primary-mobile-menu { position: static; } .primary-navigation { position: absolute; top: 0; right: 0; color: #28303d; font-size: 1.25rem; line-height: 1.15; margin-top: 0; margin-bottom: 0; } .primary-navigation > .primary-menu-container { position: fixed; visibility: hidden; opacity: 0; top: 0; right: 0; bottom: 0; left: 0; padding-top: calc(2rem + 47px); padding-left: 20px; padding-right: 20px; padding-bottom: 25px; background-color: #d1e4dd; transform: translateY(30px); } @media (prefers-reduced-motion: no-preference) { .primary-navigation > .primary-menu-container { transition: all 0.15s ease-in-out; } } @media only screen and (max-width: 481px) { .primary-navigation > .primary-menu-container { height: 100vh; z-index: 499; overflow-x: hidden; overflow-y: auto; border: 2px solid transparent; } .has-logo.has-title-and-tagline .primary-navigation > .primary-menu-container { position: fixed; transform: translateY(0) translateX(100%); } .admin-bar .has-logo.has-title-and-tagline .primary-navigation > .primary-menu-container { top: 32px; } @media only screen and (max-width: 782px) { .admin-bar .has-logo.has-title-and-tagline .primary-navigation > .primary-menu-container { top: 46px; } } .admin-bar .primary-navigation > .primary-menu-container { height: calc(100vh - 32px); } @media only screen and (max-width: 782px) { .admin-bar .primary-navigation > .primary-menu-container { height: calc(100vh - 46px); } } .primary-navigation > .primary-menu-container:focus { border: 2px solid #28303d; } } @media only screen and (max-width: 481px) { .primary-navigation-open .primary-navigation { width: 100%; position: fixed; z-index: 2; } } .primary-navigation-open .primary-navigation > .primary-menu-container { position: absolute; visibility: visible; opacity: 1; transform: translateY(0); } @media only screen and (max-width: 481px) { .primary-navigation-open .has-logo.has-title-and-tagline .primary-navigation > .primary-menu-container { transform: translateX(0) translateY(0); } } @media only screen and (min-width: 482px) { .primary-navigation { position: relative; margin-left: auto; } .primary-navigation > .primary-menu-container { visibility: visible; opacity: 1; position: relative; padding: 0; background-color: transparent; overflow: initial; transform: none; } .primary-navigation #toggle-menu { display: none; } .primary-navigation > .primary-menu-container ul > li .sub-menu-toggle[aria-expanded=false] ~ ul { display: none; } .admin-bar .primary-navigation { top: initial; } .admin-bar .primary-navigation > .primary-menu-container { top: initial; } } .primary-navigation > div > .menu-wrapper { display: flex; justify-content: flex-start; flex-wrap: wrap; list-style: none; margin: 0; max-width: none; padding-left: 0; position: relative; } @media only screen and (max-width: 481px) { .primary-navigation > div > .menu-wrapper { padding-bottom: 100px; } .primary-navigation > div > .menu-wrapper ul { padding-left: 0; } } .primary-navigation > div > .menu-wrapper li { display: block; position: relative; width: 100%; } @media only screen and (min-width: 482px) { .primary-navigation > div > .menu-wrapper li { margin: 0; width: inherit; } .primary-navigation > div > .menu-wrapper li:last-child { margin-right: 0; } } .primary-navigation > div > .menu-wrapper .sub-menu-toggle { display: flex; height: calc(27px + 1em); width: 44px; padding: 0; justify-content: center; align-items: center; background: transparent; color: currentColor; border: none; } .primary-navigation > div > .menu-wrapper .sub-menu-toggle:focus { outline: 2px solid #28303d; } @media only screen and (max-width: 481px) { .primary-navigation > div > .menu-wrapper .sub-menu-toggle { display: none; } } .primary-navigation > div > .menu-wrapper .sub-menu-toggle .icon-plus, .primary-navigation > div > .menu-wrapper .sub-menu-toggle .icon-minus { height: 100%; display: flex; align-items: center; } .primary-navigation > div > .menu-wrapper .sub-menu-toggle .icon-plus svg, .primary-navigation > div > .menu-wrapper .sub-menu-toggle .icon-minus svg { margin-top: -1px; } .primary-navigation > div > .menu-wrapper .sub-menu-toggle .icon-minus { display: none; } .primary-navigation > div > .menu-wrapper .sub-menu-toggle[aria-expanded=true] .icon-minus { display: flex; } .primary-navigation > div > .menu-wrapper .sub-menu-toggle[aria-expanded=true] .icon-plus { display: none; } .primary-navigation > div > .menu-wrapper > li > .sub-menu { position: relative; } @media only screen and (min-width: 482px) and (prefers-reduced-motion: no-preference) { .primary-navigation > div > .menu-wrapper > li > .sub-menu { transition: all 0.5s ease; } } @media only screen and (min-width: 482px) { .primary-navigation > div > .menu-wrapper > li > .sub-menu { left: 0; margin: 0; min-width: max-content; position: absolute; top: 100%; padding-top: 3px; z-index: 88888; } .primary-navigation > div > .menu-wrapper > li > .sub-menu:before { content: ""; display: block; position: absolute; width: 0; top: -10px; left: 25px; border-style: solid; border-color: #28303d transparent; border-width: 0 7px 10px 7px; } .primary-navigation > div > .menu-wrapper > li > .sub-menu:after { content: ""; display: block; position: absolute; width: 0; top: -10px; left: 25px; border-style: solid; border-color: #28303d transparent; border-width: 0 7px 10px 7px; } .primary-navigation > div > .menu-wrapper > li > .sub-menu:after { top: -9px; border-color: #d1e4dd transparent; } .primary-navigation > div > .menu-wrapper > li > .sub-menu li { background: #d1e4dd; } .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-left { /* rtl:ignore */ left: 0; /* rtl:ignore */ right: auto; } .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-left:before { /* rtl:ignore */ left: 25px; /* rtl:ignore */ right: auto; } .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-left:after { /* rtl:ignore */ left: 25px; /* rtl:ignore */ right: auto; } .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-right { /* rtl:ignore */ right: 0; /* rtl:ignore */ left: auto; } .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-right:before { /* rtl:ignore */ left: auto; /* rtl:ignore */ right: 25px; } .primary-navigation > div > .menu-wrapper > li > .sub-menu.submenu-reposition-right:after { /* rtl:ignore */ left: auto; /* rtl:ignore */ right: 25px; } } .primary-navigation .primary-menu > .menu-item:hover > a { color: #28303d; } @media only screen and (min-width: 482px) { .primary-navigation .primary-menu-container { margin-right: -13px; margin-left: -13px; } .primary-navigation .primary-menu-container > ul > .menu-item { display: flex; } .primary-navigation .primary-menu-container > ul > .menu-item > a { padding-left: 13px; padding-right: 13px; } .primary-navigation .primary-menu-container > ul > .menu-item > a + .sub-menu-toggle { margin-left: -8px; } } .primary-navigation a { display: block; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.125rem; font-weight: normal; padding: 13px 0; text-decoration: none; } @media only screen and (min-width: 482px) { .primary-navigation a { display: block; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.25rem; font-weight: normal; } } .primary-navigation a + svg { fill: #28303d; } .primary-navigation a:hover { color: #28303d; } .primary-navigation a:link { color: #28303d; } .primary-navigation a:visited { color: #28303d; } .primary-navigation a:hover { text-decoration: underline; text-decoration-style: dotted; } .primary-navigation a:focus { position: relative; z-index: 99999; outline-offset: 0; text-decoration-thickness: 2px; } .primary-navigation .current-menu-item > a:first-child, .primary-navigation .current_page_item > a:first-child { text-decoration: underline; text-decoration-style: solid; } .primary-navigation .current-menu-item > a:first-child:hover, .primary-navigation .current_page_item > a:first-child:hover { text-decoration: underline; text-decoration-style: dotted; } .primary-navigation .sub-menu { margin: 0; padding: 0; list-style: none; margin-left: 13px; border: 1px solid #28303d; } .primary-navigation .sub-menu .sub-menu { border: none; } @media only screen and (min-width: 482px) { .primary-navigation .sub-menu > .menu-item > .sub-menu { padding: 0; } } @media only screen and (max-width: 481px) { .primary-navigation .sub-menu .menu-item:last-child { margin-bottom: 0; } } .primary-navigation .sub-menu .menu-item > a { padding: 17px 13px; display: block; font-size: 1.125rem; font-style: normal; } @media only screen and (min-width: 482px) { .primary-navigation .sub-menu .menu-item > a { font-size: 1rem; font-style: normal; } } .primary-navigation .menu-item-has-children > .svg-icon { display: none; } @media only screen and (min-width: 482px) { .primary-navigation .menu-item-has-children > .svg-icon { display: inline-block; height: 100%; } .primary-navigation .menu-item-has-children .sub-menu .svg-icon { display: none; } } .primary-navigation .menu-item-description { display: block; clear: both; font-size: 1rem; text-transform: none; line-height: 1.7; } .primary-navigation .menu-item-description > span { display: inline-block; } @media only screen and (max-width: 481px) { .lock-scrolling .site { position: fixed; max-width: 100%; width: 100%; } } @keyframes twentytwentyone-close-button-transition { from { opacity: 0; } to { opacity: 1; } } .footer-navigation { margin-top: 60px; margin-bottom: 30px; color: #28303d; font-size: 1rem; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; } .footer-navigation-wrapper { display: flex; justify-content: center; flex-wrap: wrap; list-style: none; padding-left: 0; } .footer-navigation-wrapper li { display: inline; line-height: 3; } .footer-navigation-wrapper li a { padding: 17px 13px; color: #28303d; } .footer-navigation-wrapper li a:link { color: #28303d; } .footer-navigation-wrapper li a:visited { color: #28303d; } .footer-navigation-wrapper li a:active { color: #28303d; } .footer-navigation-wrapper li a:hover { text-decoration: underline; text-decoration-style: dotted; text-decoration-skip-ink: none; color: #28303d; } .is-dark-theme .footer-navigation-wrapper li a:focus .svg-icon { fill: #d1e4dd; } .has-background-white .footer-navigation-wrapper li a:focus .svg-icon { fill: #fff; } .footer-navigation-wrapper li .svg-icon { vertical-align: middle; fill: #28303d; } .footer-navigation-wrapper li .svg-icon:hover { transform: scale(1.1); } @media (prefers-reduced-motion: no-preference) { .footer-navigation-wrapper li .svg-icon { transition: transform 0.1s ease; } } .footer-navigation-wrapper .sub-menu-toggle, .footer-navigation-wrapper .menu-item-description { display: none; } /* Next/Previous navigation */ .navigation, .navigation a { color: #28303d; } .navigation a { text-decoration: none; } .navigation a:hover { color: #28303d; text-decoration: underline; text-decoration-style: dotted; } .navigation a:focus { color: #39414d; } .navigation a:active { color: #28303d; } .navigation .nav-links > * { min-width: 44px; min-height: 44px; } .navigation .nav-links .nav-next a, .navigation .nav-links .nav-previous a { display: flex; flex-direction: column; } .navigation .nav-links .dots { text-align: center; } @media only screen and (min-width: 592px) { .navigation .nav-links { display: flex; justify-content: center; flex-wrap: wrap; } .navigation .nav-links .nav-next, .navigation .nav-links .nav-previous { flex: 0 1 auto; margin-bottom: inherit; margin-top: inherit; max-width: calc(50% - 10px); } .navigation .nav-links .nav-next { text-align: right; } } .navigation .svg-icon { display: inline-block; fill: currentColor; vertical-align: middle; position: relative; } .navigation .nav-previous .svg-icon, .navigation .prev .svg-icon { top: -2px; margin-right: 5px; } .navigation .nav-next .svg-icon, .navigation .next .svg-icon { top: -1px; margin-left: 5px; } .post-navigation { margin: 30px auto; } @media only screen and (min-width: 822px) { .post-navigation { margin: 30px auto; } } .post-navigation .meta-nav { line-height: 1.7; color: #28303d; } .post-navigation .post-title { display: inline-block; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.5rem; font-weight: 600; line-height: 1.3; } @media only screen and (min-width: 822px) { .post-navigation .post-title { margin: 5px 29px 0; } } @media only screen and (min-width: 482px) { .post-navigation .nav-links { justify-content: space-between; } } .post-navigation .nav-next, .post-navigation .nav-previous { margin-top: 30px; margin-bottom: 30px; } .post-navigation .nav-next:first-child, .post-navigation .nav-previous:first-child { margin-top: 0; } .post-navigation .nav-next:last-child, .post-navigation .nav-previous:last-child { margin-bottom: 0; } .pagination, .comments-pagination { border-top: 3px solid #28303d; padding-top: 30px; margin: 30px auto; } @media only screen and (min-width: 822px) { .pagination, .comments-pagination { margin: 30px auto; } } .pagination .nav-links, .comments-pagination .nav-links { margin-top: -30px; } .pagination .nav-links a:hover { color: #28303d; } .comments-pagination .nav-links a:hover { color: #28303d; } .is-dark-theme .pagination .nav-links a:active { color: #d1e4dd; } .is-dark-theme .pagination .nav-links a:hover:active { color: #d1e4dd; } .is-dark-theme .pagination .nav-links a:hover:focus { color: #d1e4dd; } .is-dark-theme .comments-pagination .nav-links a:active { color: #d1e4dd; } .is-dark-theme .comments-pagination .nav-links a:hover:active { color: #d1e4dd; } .is-dark-theme .comments-pagination .nav-links a:hover:focus { color: #d1e4dd; } .has-background-white .pagination .nav-links a:active { color: #fff; } .has-background-white .pagination .nav-links a:hover:active { color: #fff; } .has-background-white .pagination .nav-links a:hover:focus { color: #fff; } .has-background-white .comments-pagination .nav-links a:active { color: #fff; } .has-background-white .comments-pagination .nav-links a:hover:active { color: #fff; } .has-background-white .comments-pagination .nav-links a:hover:focus { color: #fff; } .pagination .nav-links > * { color: #28303d; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.5rem; font-weight: normal; margin-top: 30px; margin-left: 13px; margin-right: 13px; } .comments-pagination .nav-links > * { color: #28303d; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 1.5rem; font-weight: normal; margin-top: 30px; margin-left: 13px; margin-right: 13px; } .pagination .nav-links > *.current, .comments-pagination .nav-links > *.current { text-decoration: underline; } .pagination .nav-links > *:not(.dots):not(.current):hover, .comments-pagination .nav-links > *:not(.dots):not(.current):hover { text-decoration-style: dotted; } .pagination .nav-links > *:first-child, .comments-pagination .nav-links > *:first-child { margin-left: 0; } .pagination .nav-links > *:last-child, .comments-pagination .nav-links > *:last-child { margin-right: 0; } .pagination .nav-links > *.next, .comments-pagination .nav-links > *.next { margin-left: auto; } .pagination .nav-links > *.prev, .comments-pagination .nav-links > *.prev { margin-right: auto; } @media only screen and (max-width: 821px) { .pagination .nav-links, .comments-pagination .nav-links { display: flex; flex-wrap: wrap; } .pagination .page-numbers, .comments-pagination .page-numbers { display: none; } .pagination .page-numbers.prev, .pagination .page-numbers.next, .comments-pagination .page-numbers.prev, .comments-pagination .page-numbers.next { display: inline-block; flex: 0 1 auto; } } @media only screen and (max-width: 481px) { .pagination .nav-short, .comments-pagination .nav-short { display: none; } } .comments-pagination { padding-top: 20px; margin: 90px auto; } @media only screen and (min-width: 822px) { .comments-pagination { margin: 90px auto 120px auto; } } .comments-pagination .nav-links > * { font-size: 1.25rem; } .widget-area { margin-top: 180px; padding-bottom: 10px; color: #28303d; font-size: 1.125rem; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; } @media only screen and (min-width: 652px) { .widget-area { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 50px; } } @media only screen and (min-width: 1024px) { .widget-area { grid-template-columns: repeat(3, 1fr); } } @media only screen and (max-width: 481px) { .widget-area { margin-top: 90px; } } .widget-area .wp-block-social-links.alignright { margin-top: 30px; justify-content: flex-end; } .widget-area .wp-block-social-links.alignleft { margin-top: 30px; } .widget-area:after { content: ""; display: table; clear: both; } .widget h1, .widget h2, .widget h3, .widget h4, .widget h5, .widget h6 { font-weight: 700; line-height: 1.4; } .widget h1 { font-size: 1.25rem; } .widget h2 { font-size: 1.125rem; } .widget h3, .widget h4, .widget h5, .widget h6 { font-size: 1rem; } .widget ul { list-style-type: none; padding: 0; } .widget ul li { line-height: 1.9; } .widget ul.sub-menu, .widget ul.children { margin-left: 13px; } .widget ul .sub-menu-toggle { display: none; } .widget a { color: #28303d; text-decoration: underline; text-decoration-style: solid; text-decoration-color: currentColor; } .widget a:link { color: #28303d; } .widget a:visited { color: #28303d; } .widget a:active { color: #28303d; } .widget a:hover { color: #28303d; text-decoration-style: dotted; } .search-form { display: flex; flex-wrap: wrap; margin: auto; max-width: calc(100vw - 30px); } @media only screen and (min-width: 482px) { .search-form { max-width: min(calc(100vw - 100px), 610px); } } @media only screen and (min-width: 822px) { .search-form { max-width: min(calc(100vw - 200px), 610px); } } .search-form > label { width: 100%; margin-bottom: 0; font-weight: 500; } .search-form .search-field { flex-grow: 1; max-width: inherit; margin-top: 10px; margin-right: 17px; } .search-form .search-submit { margin-top: 10px; margin-left: 10px; } .widget_search > .search-form .search-field { margin-right: -3px; -webkit-appearance: none; margin-bottom: 15px; } .widget_search > .search-form .search-submit { margin-left: 0; margin-bottom: 15px; } .widget_rss a.rsswidget .rss-widget-icon { display: none; } /* Category 07 is for any utility classes that are not assigned to a specific component. */ .screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); -webkit-clip-path: inset(50%); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; word-break: normal; } .skip-link:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; -webkit-clip-path: none; clip-path: none; color: #21759b; display: block; font-size: 0.875rem; font-weight: 700; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; } /* Do not show the outline on the skip link target. */ #content[tabindex="-1"]:focus { outline: 0; } .has-black-color[class] { color: #000; } .has-black-color[class] > [class*=__inner-container] { color: #000; } .has-gray-color[class] { color: #39414d; } .has-gray-color[class] > [class*=__inner-container] { color: #39414d; } .has-dark-gray-color[class] { color: #28303d; } .has-dark-gray-color[class] > [class*=__inner-container] { color: #28303d; } .has-green-color[class] { color: #d1e4dd; } .has-green-color[class] > [class*=__inner-container] { color: #d1e4dd; } .has-blue-color[class] { color: #d1dfe4; } .has-blue-color[class] > [class*=__inner-container] { color: #d1dfe4; } .has-purple-color[class] { color: #d1d1e4; } .has-purple-color[class] > [class*=__inner-container] { color: #d1d1e4; } .has-red-color[class] { color: #e4d1d1; } .has-red-color[class] > [class*=__inner-container] { color: #e4d1d1; } .has-orange-color[class] { color: #e4dad1; } .has-orange-color[class] > [class*=__inner-container] { color: #e4dad1; } .has-yellow-color[class] { color: #eeeadd; } .has-yellow-color[class] > [class*=__inner-container] { color: #eeeadd; } .has-white-color[class] { color: #fff; } .has-white-color[class] > [class*=__inner-container] { color: #fff; } .has-background a, .has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6 { color: currentColor; } .has-black-background-color[class] { background-color: #000; } .has-black-background-color[class] > [class*=__inner-container] { background-color: #000; } .has-dark-gray-background-color[class] { background-color: #28303d; } .has-dark-gray-background-color[class] > [class*=__inner-container] { background-color: #28303d; } .has-gray-background-color[class] { background-color: #39414d; } .has-gray-background-color[class] > [class*=__inner-container] { background-color: #39414d; } .has-light-gray-background-color[class] { background-color: #f0f0f0; } .has-light-gray-background-color[class] > [class*=__inner-container] { background-color: #f0f0f0; } .has-green-background-color[class] { background-color: #d1e4dd; } .has-green-background-color[class] > [class*=__inner-container] { background-color: #d1e4dd; } .has-blue-background-color[class] { background-color: #d1dfe4; } .has-blue-background-color[class] > [class*=__inner-container] { background-color: #d1dfe4; } .has-purple-background-color[class] { background-color: #d1d1e4; } .has-purple-background-color[class] > [class*=__inner-container] { background-color: #d1d1e4; } .has-red-background-color[class] { background-color: #e4d1d1; } .has-red-background-color[class] > [class*=__inner-container] { background-color: #e4d1d1; } .has-orange-background-color[class] { background-color: #e4dad1; } .has-orange-background-color[class] > [class*=__inner-container] { background-color: #e4dad1; } .has-yellow-background-color[class] { background-color: #eeeadd; } .has-yellow-background-color[class] > [class*=__inner-container] { background-color: #eeeadd; } .has-white-background-color[class] { background-color: #fff; } .has-white-background-color[class] > [class*=__inner-container] { background-color: #fff; } .has-background:not(.has-text-color).has-black-background-color[class] { color: #fff; } .has-background:not(.has-text-color).has-gray-background-color[class] { color: #fff; } .has-background:not(.has-text-color).has-dark-gray-background-color[class] { color: #fff; } .has-background:not(.has-text-color).has-black-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-gray-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-dark-gray-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-green-background-color[class] { color: #28303d; } .has-background:not(.has-text-color).has-blue-background-color[class] { color: #28303d; } .has-background:not(.has-text-color).has-purple-background-color[class] { color: #28303d; } .has-background:not(.has-text-color).has-red-background-color[class] { color: #28303d; } .has-background:not(.has-text-color).has-orange-background-color[class] { color: #28303d; } .has-background:not(.has-text-color).has-yellow-background-color[class] { color: #28303d; } .has-background:not(.has-text-color).has-white-background-color[class] { color: #28303d; } .has-background:not(.has-text-color).has-green-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-blue-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-purple-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-red-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-orange-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-yellow-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-background:not(.has-text-color).has-white-background-color[class] > [class*=__inner-container] { color: #28303d; } .has-purple-to-yellow-gradient-background { background: linear-gradient(160deg, #d1d1e4, #eeeadd); } .has-yellow-to-purple-gradient-background { background: linear-gradient(160deg, #eeeadd, #d1d1e4); } .has-green-to-yellow-gradient-background { background: linear-gradient(160deg, #d1e4dd, #eeeadd); } .has-yellow-to-green-gradient-background { background: linear-gradient(160deg, #eeeadd, #d1e4dd); } .has-red-to-yellow-gradient-background { background: linear-gradient(160deg, #e4d1d1, #eeeadd); } .has-yellow-to-red-gradient-background { background: linear-gradient(160deg, #eeeadd, #e4d1d1); } .has-purple-to-red-gradient-background { background: linear-gradient(160deg, #d1d1e4, #e4d1d1); } .has-red-to-purple-gradient-background { background: linear-gradient(160deg, #e4d1d1, #d1d1e4); } header *, main *, footer * { max-width: unset; } html, body, div, header, nav, article, figure, hr, main, section, footer { max-width: none; } .is-IE.is-dark-theme { color: #fff; } .is-IE.is-dark-theme *, .is-IE.is-dark-theme a, .is-IE.is-dark-theme .site-description, .is-IE.is-dark-theme .entry-title, .is-IE.is-dark-theme .entry-footer, .is-IE.is-dark-theme .widget-area, .is-IE.is-dark-theme .post-navigation .meta-nav, .is-IE.is-dark-theme .footer-navigation-wrapper li a:link, .is-IE.is-dark-theme .site-footer > .site-info, .is-IE.is-dark-theme .site-footer > .site-info a, .is-IE.is-dark-theme .site-footer > .site-info a:visited { color: #fff; } .is-IE.is-dark-theme .sub-menu-toggle svg, .is-IE.is-dark-theme .sub-menu-toggle path, .is-IE.is-dark-theme .post-navigation .meta-nav svg, .is-IE.is-dark-theme .post-navigation .meta-nav path { fill: #fff; } .is-IE.is-dark-theme .primary-navigation > div > .menu-wrapper > li > .sub-menu li { background: #000; } @media only screen and (max-width: 481px) { .is-IE.is-dark-theme.primary-navigation-open .primary-navigation > .primary-menu-container, .is-IE.is-dark-theme.primary-navigation-open .menu-button-container { background-color: #000; } } .is-IE.is-dark-theme .skip-link:focus { color: #21759b; } .is-IE .navigation .nav-links { display: block; } .is-IE .post-thumbnail .wp-post-image { min-width: auto; } assets/css/style-editor-customizer.css000064400000000156152377522560014216 0ustar00/** * These styles are generated by the Customizer and only loaded when a custom color scheme is active. */ assets/css/print.css000064400000005521152377522560010525 0ustar00/* Adding print support. The print styles are based on the the great work of Andreas Hecht in https://www.jotform.com/blog/css-perfect-print-stylesheet-98272/. */ /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- # Margins & paddings # Typography # Page breaks # Links # Visibility --------------------------------------------------------------*/ @media print { /* Margins & paddings */ @page { margin: 2cm; } .entry .entry-header, .entry, .single .site-main > article > .entry-footer { margin-top: 0; margin-bottom: 0; } .site-footer .site-info { margin: 0; } .site-header { padding: 0; } /* Fonts */ body { font: 13pt Georgia, "Times New Roman", Times, serif; font: 13pt var(--global--font-secondary, Georgia, "Times New Roman", Times, serif); line-height: 1.3; background: #fff !important; color: #000; } .has-background-dark * { color: #000 !important; } h1, .entry-title, .singular .entry-title, .page-title { font-size: 22pt; font-weight: bold; } h2, h3, h4, .has-regular-font-size, .has-large-font-size, h2.author-title, p.author-bio, .comments-title, .archive-description { font-size: 14pt; margin-top: 25px; } .comment-meta, .comment-meta .comment-author .fn { font-size: 13pt; } /* Page breaks */ a { page-break-inside: avoid; } blockquote { page-break-inside: avoid; } h1, h2, h3, h4, h5, h6 { page-break-after: avoid; page-break-inside: avoid; } img { page-break-inside: avoid; page-break-after: avoid; } table, pre, figure { page-break-inside: avoid; } ul, ol, dl { page-break-before: avoid; } /* Links */ a:link, a:visited, a { background: transparent; font-weight: bold; text-decoration: underline; text-align: left; } a[href^=http]:after { content: " < " attr(href) "> "; } a:after > img { content: ""; } article a[href^="#"]:after { content: ""; } a:not(:local-link):after { content: " < " attr(href) "> "; } .entry-title a:after { content: "\a< " attr(href) "> "; white-space: pre; font-size: 14pt; } .cat-links a:after, .tags-links a:after, .byline a:after, .comment-metadata a:after, .wp-block-calendar a:after, .wp-block-tag-cloud a:after, .page-links a:after { content: ""; } /* Visibility */ .primary-navigation, .site-title + .primary-navigation, .footer-navigation, .entry-footer, .post-navigation, .navigation.pagination, .widget-area, .edit-link, .more-link, .comment-reply, .reply, .comment .comment-metadata .edit-link, .comment-respond, #dark-mode-toggler { display: none !important; } .entry .entry-content .wp-block-button .wp-block-button__link, .entry .entry-content .button, .entry .entry-content .wp-block-file__button { color: #000; background: none; } } assets/css/style-dark-mode-rtl.css000064400000005416152377522560013174 0ustar00/* OS dark theme preference */ @media only screen { .is-dark-theme.is-dark-theme { --global--color-background: var(--global--color-dark-gray); --global--color-primary: var(--global--color-light-gray); --global--color-secondary: var(--global--color-light-gray); --button--color-text: var(--global--color-background); --button--color-text-hover: var(--global--color-secondary); --button--color-text-active: var(--global--color-secondary); --button--color-background: var(--global--color-secondary); --button--color-background-active: var(--global--color-background); --global--color-border: #9ea1a7; /* Block: Table */ --table--stripes-border-color: rgba(240, 240, 240, 0.15); --table--stripes-background-color: rgba(240, 240, 240, 0.15); } .is-dark-theme img { filter: brightness(0.85) contrast(1.1); } .respect-color-scheme-preference.is-dark-theme body { background-color: var(--global--color-background); } #dark-mode-toggler { cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: var(--global--font-size-xs); padding: 0.5em; min-height: 44px; min-width: max-content; border: 2px solid currentColor; box-shadow: none; background: var(--button--color-text); color: var(--button--color-background); z-index: 9998; } .no-js #dark-mode-toggler { display: none; } #dark-mode-toggler.fixed-bottom { position: fixed; bottom: 5px; left: 5px; } #dark-mode-toggler.fixed-bottom.hide:not(:focus) { bottom: -80px; } #dark-mode-toggler.relative { position: absolute; height: 44px; top: calc(2.4 * var(--global--spacing-vertical) - 44px); left: calc(50vw - var(--responsive--alignwide-width) / 2 - 0.5em); } .admin-bar #dark-mode-toggler.relative { top: calc(2.4 * var(--global--spacing-vertical) - 44px + 32px); } } @media only screen and (max-width: 782px) { .admin-bar #dark-mode-toggler.relative { top: calc(2.4 * var(--global--spacing-vertical) - 44px + 46px); } } @media only screen and (max-width: 481px) { .admin-bar #dark-mode-toggler.relative { top: calc(2.4 * var(--global--spacing-vertical) - 44px + 26px); } } @media only screen and (max-width: 481px) { body:not(.primary-navigation-open) #dark-mode-toggler.relative ~ nav { top: 88px; } } @media only screen { .primary-navigation-open #dark-mode-toggler { display: none; } } @media only screen { #dark-mode-toggler:hover, #dark-mode-toggler:focus { color: var(--button--color-background-active); border: 2px solid var(--button--color-text-active); background-color: var(--button--color-text-active); } } @media only screen { .is-IE #dark-mode-toggler { display: none; } } @media only screen and (prefers-reduced-motion: no-preference) { #dark-mode-toggler.fixed-bottom { transition: bottom 0.5s; } } assets/css/style-editor.css000064400000232677152377522560012033 0ustar00@charset "UTF-8"; /** * These styles should be loaded by the Block Editor only */ /* Variables */ :root { /* Font Family */ --global--font-primary: var(--font-headings, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif); --global--font-secondary: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif); /* Font Size */ --global--font-size-base: 1.25rem; --global--font-size-xs: 1rem; --global--font-size-sm: 1.125rem; --global--font-size-md: 1.25rem; --global--font-size-lg: 1.5rem; --global--font-size-xl: 2.25rem; --global--font-size-xxl: 4rem; --global--font-size-xxxl: 5rem; --global--font-size-page-title: var(--global--font-size-xxl); --global--letter-spacing: normal; /* Line Height */ --global--line-height-body: 1.7; --global--line-height-heading: 1.3; --global--line-height-page-title: 1.1; /* Headings */ --heading--font-family: var(--global--font-primary); --heading--font-size-h6: var(--global--font-size-xs); --heading--font-size-h5: var(--global--font-size-sm); --heading--font-size-h4: var(--global--font-size-lg); --heading--font-size-h3: calc(1.25 * var(--global--font-size-lg)); --heading--font-size-h2: var(--global--font-size-xl); --heading--font-size-h1: var(--global--font-size-page-title); --heading--letter-spacing-h6: 0.05em; --heading--letter-spacing-h5: 0.05em; --heading--letter-spacing-h4: var(--global--letter-spacing); --heading--letter-spacing-h3: var(--global--letter-spacing); --heading--letter-spacing-h2: var(--global--letter-spacing); --heading--letter-spacing-h1: var(--global--letter-spacing); --heading--line-height-h6: var(--global--line-height-heading); --heading--line-height-h5: var(--global--line-height-heading); --heading--line-height-h4: var(--global--line-height-heading); --heading--line-height-h3: var(--global--line-height-heading); --heading--line-height-h2: var(--global--line-height-heading); --heading--line-height-h1: var(--global--line-height-page-title); --heading--font-weight: normal; --heading--font-weight-page-title: 300; --heading--font-weight-strong: 600; /* Block: Latest posts */ --latest-posts--title-font-family: var(--heading--font-family); --latest-posts--title-font-size: var(--heading--font-size-h3); --latest-posts--description-font-family: var(--global--font-secondary); --latest-posts--description-font-size: var(--global--font-size-sm); --list--font-family: var(--global--font-secondary); --definition-term--font-family: var(--global--font-primary); /* Colors */ --global--color-black: #000; --global--color-dark-gray: #28303d; --global--color-gray: #39414d; --global--color-light-gray: #f0f0f0; --global--color-green: #d1e4dd; --global--color-blue: #d1dfe4; --global--color-purple: #d1d1e4; --global--color-red: #e4d1d1; --global--color-orange: #e4dad1; --global--color-yellow: #eeeadd; --global--color-white: #fff; --global--color-white-50: rgba(255, 255, 255, 0.5); --global--color-white-90: rgba(255, 255, 255, 0.9); --global--color-primary: var(--global--color-dark-gray); /* Body text color, site title, footer text color. */ --global--color-secondary: var(--global--color-gray); /* Headings */ --global--color-primary-hover: var(--global--color-primary); --global--color-background: var(--global--color-green); /* Mint, default body background */ --global--color-border: var(--global--color-primary); /* Used for borders (separators) */ /* Spacing */ --global--spacing-unit: 20px; --global--spacing-measure: unset; --global--spacing-horizontal: 25px; --global--spacing-vertical: 30px; /* Elevation */ --global--elevation: 1px 1px 3px 0 rgba(0, 0, 0, 0.2); /* Forms */ --form--font-family: var(--global--font-secondary); --form--font-size: var(--global--font-size-sm); --form--line-height: var(--global--line-height-body); --form--color-text: var(--global--color-dark-gray); --form--color-ranged: var(--global--color-secondary); --form--label-weight: 500; --form--border-color: var(--global--color-secondary); --form--border-width: 3px; --form--border-radius: 0; --form--spacing-unit: calc(0.5 * var(--global--spacing-unit)); /* Cover block */ --cover--height: calc(15 * var(--global--spacing-vertical)); --cover--color-foreground: var(--global--color-white); --cover--color-background: var(--global--color-black); /* Buttons */ --button--color-text: var(--global--color-background); --button--color-text-hover: var(--global--color-secondary); --button--color-text-active: var(--global--color-secondary); --button--color-background: var(--global--color-secondary); --button--color-background-active: var(--global--color-background); --button--font-family: var(--global--font-primary); --button--font-size: var(--global--font-size-base); --button--font-weight: 500; --button--line-height: 1.5; --button--border-width: 3px; --button--border-radius: 0; --button--padding-vertical: 15px; --button--padding-horizontal: calc(2 * var(--button--padding-vertical)); /* entry */ --entry-header--color: var(--global--color-primary); --entry-header--color-link: currentColor; --entry-header--color-hover: var(--global--color-primary-hover); --entry-header--color-focus: var(--global--color-secondary); --entry-header--font-size: var(--heading--font-size-h2); --entry-content--font-family: var(--global--font-secondary); --entry-author-bio--font-family: var(--heading--font-family); --entry-author-bio--font-size: var(--heading--font-size-h4); /* Header */ --branding--color-text: var(--global--color-primary); --branding--color-link: var(--global--color-primary); --branding--color-link-hover: var(--global--color-secondary); --branding--title--font-family: var(--global--font-primary); --branding--title--font-size: var(--global--font-size-lg); --branding--title--font-size-mobile: var(--heading--font-size-h4); --branding--title--font-weight: normal; --branding--title--text-transform: uppercase; --branding--description--font-family: var(--global--font-secondary); --branding--description--font-size: var(--global--font-size-sm); --branding--description--font-family: var(--global--font-secondary); --branding--logo--max-width: 300px; --branding--logo--max-height: 100px; --branding--logo--max-width-mobile: 96px; --branding--logo--max-height-mobile: 96px; /* Main navigation */ --primary-nav--font-family: var(--global--font-secondary); --primary-nav--font-family-mobile: var(--global--font-primary); --primary-nav--font-size: var(--global--font-size-md); --primary-nav--font-size-sub-menu: var(--global--font-size-xs); --primary-nav--font-size-mobile: var(--global--font-size-sm); --primary-nav--font-size-sub-menu-mobile: var(--global--font-size-sm); --primary-nav--font-size-button: var(--global--font-size-xs); --primary-nav--font-style: normal; --primary-nav--font-style-sub-menu-mobile: normal; --primary-nav--font-weight: normal; --primary-nav--font-weight-button: 500; --primary-nav--color-link: var(--global--color-primary); --primary-nav--color-link-hover: var(--global--color-primary-hover); --primary-nav--color-text: var(--global--color-primary); --primary-nav--padding: calc(0.66 * var(--global--spacing-unit)); --primary-nav--border-color: var(--global--color-primary); /* Pagination */ --pagination--color-text: var(--global--color-primary); --pagination--color-link-hover: var(--global--color-primary-hover); --pagination--font-family: var(--global--font-secondary); --pagination--font-size: var(--global--font-size-lg); --pagination--font-weight: normal; --pagination--font-weight-strong: 600; /* Footer */ --footer--color-text: var(--global--color-primary); --footer--color-link: var(--global--color-primary); --footer--color-link-hover: var(--global--color-primary-hover); --footer--font-family: var(--global--font-primary); --footer--font-size: var(--global--font-size-sm); /* Block: Pull quote */ --pullquote--font-family: var(--global--font-primary); --pullquote--font-size: var(--heading--font-size-h3); --pullquote--font-style: normal; --pullquote--letter-spacing: var(--heading--letter-spacing-h4); --pullquote--line-height: var(--global--line-height-heading); --pullquote--border-width: 3px; --pullquote--border-color: var(--global--color-primary); --pullquote--color-foreground: var(--global--color-primary); --pullquote--color-background: var(--global--color-background); --quote--font-family: var(--global--font-secondary); --quote--font-size: var(--global--font-size-md); --quote--font-size-large: var(--global--font-size-xl); --quote--font-style: normal; --quote--font-weight: 700; --quote--font-weight-strong: bolder; --quote--font-style-large: normal; --quote--font-style-cite: normal; --quote--line-height: var(--global--line-height-body); --quote--line-height-large: 1.35; --separator--border-color: var(--global--color-border); --separator--height: 1px; /* Block: Table */ --table--stripes-border-color: var(--global--color-light-gray); --table--stripes-background-color: var(--global--color-light-gray); --table--has-background-text-color: var(--global--color-dark-gray); /* Widgets */ --widget--line-height-list: 1.9; --widget--line-height-title: 1.4; --widget--font-weight-title: 700; --widget--spacing-menu: calc(0.66 * var(--global--spacing-unit)); /* Admin-bar height */ --global--admin-bar--height: 0px; } .admin-bar { --global--admin-bar--height: 32px; } @media only screen and (max-width: 782px) { .admin-bar { --global--admin-bar--height: 46px; } } @media only screen and (min-width: 652px) { :root { --global--font-size-xl: 2.5rem; --global--font-size-xxl: 6rem; --global--font-size-xxxl: 9rem; --heading--font-size-h3: 2rem; --heading--font-size-h2: 3rem; } } /** * Responsive Styles */ /** * Required Variables */ /** * Root Media Query Variables */ :root { --responsive--spacing-horizontal: calc(2 * var(--global--spacing-horizontal) * 0.6); --responsive--aligndefault-width: calc(100vw - var(--responsive--spacing-horizontal)); --responsive--alignwide-width: calc(100vw - var(--responsive--spacing-horizontal)); --responsive--alignfull-width: 100%; --responsive--alignright-margin: var(--global--spacing-horizontal); --responsive--alignleft-margin: var(--global--spacing-horizontal); } @media only screen and (min-width: 482px) { :root { --responsive--aligndefault-width: min(calc(100vw - 4 * var(--global--spacing-horizontal)), 610px); --responsive--alignwide-width: calc(100vw - 4 * var(--global--spacing-horizontal)); --responsive--alignright-margin: calc(0.5 * (100vw - var(--responsive--aligndefault-width))); --responsive--alignleft-margin: calc(0.5 * (100vw - var(--responsive--aligndefault-width))); } } @media only screen and (min-width: 822px) { :root { --responsive--aligndefault-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 610px); --responsive--alignwide-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 1240px); } } /** * Extends */ .default-max-width { max-width: var(--responsive--aligndefault-width); margin-left: auto; margin-right: auto; } .wide-max-width { max-width: var(--responsive--alignwide-width); margin-left: auto; margin-right: auto; } @media only screen and (min-width: 482px) { .full-max-width { max-width: var(--responsive--alignfull-width); width: auto; margin-left: auto; margin-right: auto; } } blockquote { padding: 0; position: relative; margin: var(--global--spacing-vertical) 0 var(--global--spacing-vertical) var(--global--spacing-horizontal); } blockquote > * { margin-top: var(--global--spacing-unit); margin-bottom: var(--global--spacing-unit); } blockquote > *:first-child { margin-top: 0; } blockquote > *:last-child { margin-bottom: 0; } blockquote p { letter-spacing: var(--heading--letter-spacing-h4); font-family: var(--quote--font-family); font-size: var(--quote--font-size); font-style: var(--quote--font-style); font-weight: var(--quote--font-weight); line-height: var(--quote--line-height); } blockquote cite, blockquote footer { font-weight: normal; color: var(--global--color-primary); font-size: var(--global--font-size-xs); letter-spacing: var(--global--letter-spacing); } blockquote.alignleft, blockquote.alignright { padding-left: inherit; } blockquote.alignleft p, blockquote.alignright p { font-size: var(--heading--font-size-h5); max-width: inherit; width: inherit; } blockquote.alignleft cite, blockquote.alignleft footer, blockquote.alignright cite, blockquote.alignright footer { font-size: var(--global--font-size-xs); letter-spacing: var(--global--letter-spacing); } blockquote strong { font-weight: var(--quote--font-weight-strong); } blockquote:before { content: "“"; font-size: var(--quote--font-size); line-height: var(--quote--line-height); position: absolute; left: calc(-0.5 * var(--global--spacing-horizontal)); } blockquote .wp-block-quote__citation, blockquote cite, blockquote footer { color: var(--global--color-primary); font-size: var(--global--font-size-xs); font-style: var(--quote--font-style-cite); } @media only screen and (max-width: 481px) { blockquote { padding-left: calc(0.5 * var(--global--spacing-horizontal)); } blockquote:before { left: 0; } } img { height: auto; max-width: 100%; vertical-align: middle; } /* Classic editor images */ .entry-content img { max-width: 100%; } /* Make sure embeds and iframes fit their containers. */ embed, iframe, object, video { max-width: 100%; } /* Media captions */ figcaption, .wp-caption, .wp-caption-text, .wp-block-embed figcaption { color: currentColor; font-size: var(--global--font-size-xs); line-height: var(--global--line-height-body); margin-top: calc(0.5 * var(--global--spacing-unit)); margin-bottom: var(--global--spacing-unit); text-align: center; } .alignleft figcaption, .alignright figcaption, .alignleft .wp-caption, .alignright .wp-caption, .alignleft .wp-caption-text, .alignright .wp-caption-text, .alignleft .wp-block-embed figcaption, .alignright .wp-block-embed figcaption { margin-bottom: 0; } /* WP Smiley */ .page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } select, select:focus { border: var(--form--border-width) solid var(--form--border-color); border-radius: var(--form--border-radius); color: var(--form--color-text); font-size: var(--form--font-size); -moz-appearance: none; -webkit-appearance: none; appearance: none; padding: var(--form--spacing-unit) calc(3 * var(--form--spacing-unit)) var(--form--spacing-unit) var(--form--spacing-unit); background: var(--global--color-white) url("data:image/svg+xml;utf8,") no-repeat; background-position: right var(--form--spacing-unit) top 60%; } /* * text-underline-offset doesn't work in Chrome at all 👎 * But looks nice in Safari/Firefox, so let's keep it and * maybe Chrome will support it soon. */ a { cursor: pointer; color: var(--wp--style--color--link, var(--global--color-primary)); text-underline-offset: 3px; text-decoration-skip-ink: all; } a:hover { text-decoration-style: dotted; text-decoration-skip-ink: none; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; text-decoration: underline 1px dotted currentColor; text-decoration-skip-ink: none; background: rgba(255, 255, 255, 0.9); } .is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { background: var(--global--color-black); color: var(--global--color-white); text-decoration: none; } .is-dark-theme .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav { color: var(--wp--style--color--link, var(--global--color-white)); } .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { background: rgba(0, 0, 0, 0.9); color: var(--wp--style--color--link, var(--global--color-white)); } .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav { color: var(--wp--style--color--link, var(--global--color-white)); } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link { /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; outline-offset: -2px; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).skip-link:focus { color: #21759b; background-color: #f1f1f1; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button).custom-logo-link { background: none; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) img { outline: 2px dotted var(--wp--style--color--link, var(--global--color-primary)); } .has-background .has-link-color a, .has-background.has-link-color a { color: var(--wp--style--color--link, var(--global--color-primary)); } .wp-block-button__link { border: var(--button--border-width) solid transparent; border-radius: var(--button--border-radius); cursor: pointer; font-weight: var(--button--font-weight); font-family: var(--button--font-family); font-size: var(--button--font-size); line-height: var(--button--line-height); padding: var(--button--padding-vertical) var(--button--padding-horizontal); text-decoration: none; } .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: var(--global--color-background); } .has-background .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: var(--local--color-background, var(--global--color-primary)); } .has-background .wp-block-button__link:not(:hover):not(:active):not(.has-text-color).has-background { color: var(--global--color-primary); } .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: var(--global--color-primary); } .has-background .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: var(--local--color-primary, var(--global--color-primary)); } .wp-block-button__link:hover, .wp-block-button__link:active { background-color: transparent; border-color: currentColor; color: inherit; } .wp-block-button__link:focus { outline-offset: -6px; outline: 2px dotted currentColor; } .wp-block-button__link:disabled { background-color: var(--global--color-white-50); border-color: var(--global--color-white-50); color: var(--button--color-text-active); } /** * Block Options */ .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: var(--global--color-background); } .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: var(--local--color-background, var(--global--color-background)); } .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color).has-background { color: var(--global--color-primary); } .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: var(--global--color-primary); } .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: var(--local--color-primary, var(--global--color-primary)); } .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover, .wp-block-button:not(.is-style-outline) .wp-block-button__link:active { border-color: currentColor !important; background-color: transparent !important; color: inherit !important; } .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus { outline-offset: inherit; outline: inherit; } .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color), .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-background), .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active).has-background { border-color: currentColor; } .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: var(--global--color-primary); } .has-background .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: var(--local--color-primary, var(--global--color-primary)); } .has-background .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active).has-background:not(.has-text-color) { color: inherit; } .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: transparent; } .wp-block-button.is-style-outline .wp-block-button__link:hover, .wp-block-button.is-style-outline .wp-block-button__link:active { background-color: var(--global--color-primary) !important; border-color: transparent !important; color: var(--global--color-background) !important; } .has-background .wp-block-button.is-style-outline .wp-block-button__link:hover, .has-background .wp-block-button.is-style-outline .wp-block-button__link:active { background-color: var(--local--color-primary, var(--global--color-primary)) !important; color: var(--local--color-background, var(--global--color-background)) !important; } .has-text-color .wp-block-button.is-style-outline .wp-block-button__link:hover, .has-text-color .wp-block-button.is-style-outline .wp-block-button__link:active { color: var(--local--color-background, var(--global--color-background)) !important; } .wp-block-button.is-style-outline .wp-block-button__link:focus { outline-offset: inherit; outline: inherit; } .wp-block-button.is-style-squared { border-radius: 0; } .is-style-outline .wp-block-button__link[style*=radius], .wp-block-button__link[style*=radius] { outline-offset: 2px; } .wp-block-code code { white-space: pre !important; overflow-x: auto; } .wp-block-code { border-color: var(--global--color-border); border-radius: 0; border-style: solid; border-width: 0.1rem; padding: var(--global--spacing-unit); color: currentColor; } .wp-block-cover, .wp-block-cover-image { background-color: var(--cover--color-background); min-height: var(--cover--height); margin-top: inherit; margin-bottom: inherit; } .wp-block-cover:not(.alignwide):not(.alignfull), .wp-block-cover-image:not(.alignwide):not(.alignfull) { clear: both; } [data-align=full] .wp-block-cover, [data-align=full] .wp-block-cover-image { margin-top: 0; margin-bottom: 0; } .wp-block-cover > .wp-block-cover__inner-container > *:first-child, .wp-block-cover-image > .wp-block-cover__inner-container > *:first-child { margin-top: 0; } .wp-block-cover > .wp-block-cover__inner-container > *:last-child:not(.block-list-appender), .wp-block-cover-image > .wp-block-cover__inner-container > *:last-child:not(.block-list-appender) { margin-bottom: 0; } .wp-block-cover.has-child-selected > .wp-block-cover__inner-container > *:nth-last-child(2), .wp-block-cover.is-selected > .wp-block-cover__inner-container > *:nth-last-child(2), .wp-block-cover-image.has-child-selected > .wp-block-cover__inner-container > *:nth-last-child(2), .wp-block-cover-image.is-selected > .wp-block-cover__inner-container > *:nth-last-child(2) { margin-bottom: 0; } .wp-block-cover .wp-block-cover__inner-container, .wp-block-cover .wp-block-cover-image-text, .wp-block-cover .wp-block-cover-text, .wp-block-cover .block-editor-block-list__block, .wp-block-cover-image .wp-block-cover__inner-container, .wp-block-cover-image .wp-block-cover-image-text, .wp-block-cover-image .wp-block-cover-text, .wp-block-cover-image .block-editor-block-list__block { color: currentColor; } .wp-block-cover .wp-block-cover__inner-container a, .wp-block-cover .wp-block-cover-image-text a, .wp-block-cover .wp-block-cover-text a, .wp-block-cover .block-editor-block-list__block a, .wp-block-cover-image .wp-block-cover__inner-container a, .wp-block-cover-image .wp-block-cover-image-text a, .wp-block-cover-image .wp-block-cover-text a, .wp-block-cover-image .block-editor-block-list__block a { color: currentColor; } .wp-block-cover .wp-block-cover__inner-container .has-link-color a, .wp-block-cover .wp-block-cover-image-text .has-link-color a, .wp-block-cover .wp-block-cover-text .has-link-color a, .wp-block-cover .block-editor-block-list__block .has-link-color a, .wp-block-cover-image .wp-block-cover__inner-container .has-link-color a, .wp-block-cover-image .wp-block-cover-image-text .has-link-color a, .wp-block-cover-image .wp-block-cover-text .has-link-color a, .wp-block-cover-image .block-editor-block-list__block .has-link-color a { color: var(--wp--style--color--link, var(--global--color-primary)); } .wp-block-cover:not([class*=background-color]) .wp-block-cover__inner-container, .wp-block-cover:not([class*=background-color]) .wp-block-cover-image-text, .wp-block-cover:not([class*=background-color]) .wp-block-cover-text, .wp-block-cover:not([class*=background-color]) .block-editor-block-list__block, .wp-block-cover-image:not([class*=background-color]) .wp-block-cover__inner-container, .wp-block-cover-image:not([class*=background-color]) .wp-block-cover-image-text, .wp-block-cover-image:not([class*=background-color]) .wp-block-cover-text, .wp-block-cover-image:not([class*=background-color]) .block-editor-block-list__block { color: var(--cover--color-foreground); } .wp-block-cover h2, .wp-block-cover-image h2 { font-size: var(--heading--font-size-h2); letter-spacing: var(--heading--letter-spacing-h2); line-height: var(--heading--line-height-h2); padding: 0; max-width: inherit; text-align: inherit; } .wp-block-cover h2.has-text-align-left, .wp-block-cover-image h2.has-text-align-left { text-align: left; } .wp-block-cover h2.has-text-align-center, .wp-block-cover-image h2.has-text-align-center { text-align: center; } .wp-block-cover h2.has-text-align-right, .wp-block-cover-image h2.has-text-align-right { text-align: right; } .wp-block-cover.is-style-twentytwentyone-border, .wp-block-cover-image.is-style-twentytwentyone-border { border: calc(3 * var(--separator--height)) solid var(--global--color-border); } .wp-block-cover[class*=-background-color][class] .wp-block-cover__inner-container, .wp-block-cover-image[class*=-background-color][class] .wp-block-cover__inner-container { background-color: unset; } .wp-block-columns:not(.alignwide):not(.alignfull) { clear: both; } .wp-block-columns .wp-block, .wp-block-columns .wp-block-column { max-width: inherit; } .wp-block-columns > .wp-block-column > *:first-child { margin-top: 0; } .wp-block-columns > .wp-block-column > *:last-child:not(.block-list-appender) { margin-bottom: 0; } .wp-block-columns.has-child-selected > .wp-block-column > *:nth-last-child(2), .wp-block-columns.is-selected > .wp-block-column > *:nth-last-child(2) { margin-bottom: 0; } @media only screen and (min-width: 652px) { .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) { margin-left: calc(-2 * var(--global--spacing-horizontal)); margin-top: calc(2.5 * var(--global--spacing-horizontal)); z-index: 2; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > p:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h1:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h2:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h3:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h4:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h5:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > h6:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ul:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ol:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > pre:not(.has-background) { background-color: var(--global--color-background); padding: var(--global--spacing-unit); } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ul:not(.has-background), .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n) > ol:not(.has-background) { padding-left: calc(2 * var(--global--spacing-horizontal)); } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2n).is-vertically-aligned-center { margin-top: 0; } } .wp-block[data-align=full] > .wp-block-columns p:not(.has-background), .wp-block[data-align=full] > .wp-block-columns h1:not(.has-background), .wp-block[data-align=full] > .wp-block-columns h2:not(.has-background), .wp-block[data-align=full] > .wp-block-columns h3:not(.has-background), .wp-block[data-align=full] > .wp-block-columns h4:not(.has-background), .wp-block[data-align=full] > .wp-block-columns h5:not(.has-background), .wp-block[data-align=full] > .wp-block-columns h6:not(.has-background) { padding-left: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); } .wp-block-file .wp-block-file__textlink { text-decoration: underline; text-decoration-style: solid; text-decoration-thickness: 1px; } .wp-block-file .wp-block-file__textlink:hover { text-decoration: underline; text-decoration-style: dotted; } .wp-block-file .wp-block-file__button { border: var(--button--border-width) solid transparent; border-radius: var(--button--border-radius); cursor: pointer; font-weight: var(--button--font-weight); font-family: var(--button--font-family); font-size: var(--button--font-size); line-height: var(--button--line-height); padding: var(--button--padding-vertical) var(--button--padding-horizontal); text-decoration: none; display: inline-block; } .wp-block-file .wp-block-file__button:not(:hover):not(:active):not(.has-text-color) { color: var(--global--color-background); } .has-background .wp-block-file .wp-block-file__button:not(:hover):not(:active):not(.has-text-color) { color: var(--local--color-background, var(--global--color-primary)); } .has-background .wp-block-file .wp-block-file__button:not(:hover):not(:active):not(.has-text-color).has-background { color: var(--global--color-primary); } .wp-block-file .wp-block-file__button:not(:hover):not(:active):not(.has-background) { background-color: var(--global--color-primary); } .has-background .wp-block-file .wp-block-file__button:not(:hover):not(:active):not(.has-background) { background-color: var(--local--color-primary, var(--global--color-primary)); } .wp-block-file .wp-block-file__button:hover, .wp-block-file .wp-block-file__button:active { background-color: transparent; border-color: currentColor; color: inherit; } .wp-block-file .wp-block-file__button:focus { outline-offset: -6px; outline: 2px dotted currentColor; } .wp-block-file .wp-block-file__button:disabled { background-color: var(--global--color-white-50); border-color: var(--global--color-white-50); color: var(--button--color-text-active); } .wp-block-file .wp-block-file__button:focus { outline-offset: inherit; outline: inherit; } .wp-block-gallery figcaption { margin-bottom: 0; } .wp-block-gallery figcaption a { color: var(--global--color-white); } .wp-block-group { display: block; clear: both; display: flow-root; } .wp-block-group:before, .wp-block-group:after { content: ""; display: block; clear: both; } .wp-block-group.has-background { padding: var(--global--spacing-vertical); } [data-align=full] .wp-block-group.has-background { margin-top: 0; margin-bottom: 0; } .wp-block-group.is-style-twentytwentyone-border { border: calc(3 * var(--separator--height)) solid var(--global--color-border); padding: var(--global--spacing-vertical); } .wp-block-group.is-style-twentytwentyone-border .wp-block-group__inner-container > [data-align=full] { max-width: calc(var(--responsive--alignfull-width) + 2 * var(--global--spacing-vertical)); width: calc(var(--responsive--alignfull-width) + 2 * var(--global--spacing-vertical)); margin-left: calc(-1 * var(--global--spacing-vertical)); } .wp-block-group > .wp-block-group__inner-container > *:first-child { margin-top: 0; } .wp-block-group > .wp-block-group__inner-container > *:last-child:not(.block-list-appender) { margin-bottom: 0; } .wp-block-group.has-child-selected > .wp-block-group__inner-container > *:nth-last-child(2), .wp-block-group.is-selected > .wp-block-group__inner-container > *:nth-last-child(2) { margin-bottom: 0; } .wp-block-group .wp-block-group.has-background > .block-editor-block-list__layout > [data-align=full] { margin: 0; width: 100%; } .wp-block-heading h1, h1, .h1, .wp-block-heading h2, h2, .h2, .wp-block-heading h3, h3, .h3, .wp-block-heading h4, h4, .h4, .wp-block-heading h5, h5, .h5, .wp-block-heading h6, h6, .h6 { clear: both; font-family: var(--heading--font-family); font-weight: var(--heading--font-weight); } .wp-block-heading h1 strong, h1 strong, .h1 strong, .wp-block-heading h2 strong, h2 strong, .h2 strong, .wp-block-heading h3 strong, h3 strong, .h3 strong, .wp-block-heading h4 strong, h4 strong, .h4 strong, .wp-block-heading h5 strong, h5 strong, .h5 strong, .wp-block-heading h6 strong, h6 strong, .h6 strong { font-weight: var(--heading--font-weight-strong); } .wp-block-heading h1[style*="--wp--typography--line-height"], h1[style*="--wp--typography--line-height"], .h1[style*="--wp--typography--line-height"], .wp-block-heading h2[style*="--wp--typography--line-height"], h2[style*="--wp--typography--line-height"], .h2[style*="--wp--typography--line-height"], .wp-block-heading h3[style*="--wp--typography--line-height"], h3[style*="--wp--typography--line-height"], .h3[style*="--wp--typography--line-height"], .wp-block-heading h4[style*="--wp--typography--line-height"], h4[style*="--wp--typography--line-height"], .h4[style*="--wp--typography--line-height"], .wp-block-heading h5[style*="--wp--typography--line-height"], h5[style*="--wp--typography--line-height"], .h5[style*="--wp--typography--line-height"], .wp-block-heading h6[style*="--wp--typography--line-height"], h6[style*="--wp--typography--line-height"], .h6[style*="--wp--typography--line-height"] { line-height: var(--wp--typography--line-height, var(--global--line-height-body)); } .wp-block-heading h1, h1, .h1 { font-size: var(--heading--font-size-h1); letter-spacing: var(--heading--letter-spacing-h1); line-height: var(--heading--line-height-h1); } .wp-block-heading h2, h2, .h2 { font-size: var(--heading--font-size-h2); letter-spacing: var(--heading--letter-spacing-h2); line-height: var(--heading--line-height-h2); } .wp-block-heading h3, h3, .h3 { font-size: var(--heading--font-size-h3); letter-spacing: var(--heading--letter-spacing-h3); line-height: var(--heading--line-height-h3); } .wp-block-heading h4, h4, .h4 { font-size: var(--heading--font-size-h4); font-weight: var(--heading--font-weight-strong); letter-spacing: var(--heading--letter-spacing-h4); line-height: var(--heading--line-height-h4); } .wp-block-heading h5, h5, .h5 { font-size: var(--heading--font-size-h5); font-weight: var(--heading--font-weight-strong); letter-spacing: var(--heading--letter-spacing-h5); line-height: var(--heading--line-height-h5); } .wp-block-heading h6, h6, .h6 { font-size: var(--heading--font-size-h6); font-weight: var(--heading--font-weight-strong); letter-spacing: var(--heading--letter-spacing-h6); line-height: var(--heading--line-height-h6); } [data-type="core/html"] textarea { color: var(--global--color-dark-gray); border-radius: 0; padding: var(--global--spacing-unit); } /* Center image block by default in the editor */ .wp-block-image, .wp-block-image > div:not(.components-placeholder) { text-align: center; } [data-type="core/image"] .block-editor-block-list__block-edit figure.is-resized { margin: 0 auto; } /* Block Styles */ .wp-block-image.is-style-twentytwentyone-border img, .wp-block-image.is-style-twentytwentyone-image-frame img { border: calc(3 * var(--separator--height)) solid var(--global--color-border); } .wp-block-image.is-style-twentytwentyone-image-frame img { padding: var(--global--spacing-unit); } .wp-block-latest-comments { padding-left: 0; } .wp-block-latest-posts { padding-left: 0; } .wp-block-latest-posts:not(.is-grid) > li { margin-top: calc(1.666 * var(--global--spacing-vertical)); margin-bottom: calc(1.666 * var(--global--spacing-vertical)); } .wp-block-latest-posts:not(.is-grid) > li:first-child { margin-top: 0; } .wp-block-latest-posts:not(.is-grid) > li:last-child { margin-bottom: 0; } .wp-block-latest-posts.is-grid { word-wrap: break-word; word-break: break-word; } .wp-block-latest-posts.is-grid > li { margin-bottom: var(--global--spacing-vertical); } .wp-block-latest-posts.is-grid > li:last-child { margin-bottom: 0; } .wp-block-latest-posts > li > * { margin-top: calc(0.333 * var(--global--spacing-vertical)); margin-bottom: calc(0.333 * var(--global--spacing-vertical)); } .wp-block-latest-posts > li > *:first-child { margin-top: 0; } .wp-block-latest-posts > li > *:last-child { margin-bottom: 0; } .wp-block-latest-posts > li > a { display: inline-block; font-family: var(--latest-posts--title-font-family); font-size: var(--latest-posts--title-font-size); font-weight: var(--heading--font-weight); line-height: var(--global--line-height-heading); margin-bottom: calc(0.333 * var(--global--spacing-vertical)); } .wp-block-latest-posts .wp-block-latest-posts__post-author { color: var(--global--color-primary); font-size: var(--global--font-size-md); line-height: var(--global--line-height-body); } .wp-block-latest-posts .wp-block-latest-posts__post-date { color: var(--global--color-primary); font-size: var(--global--font-size-xs); line-height: var(--global--line-height-body); } [class*=inner-container] .wp-block-latest-posts .wp-block-latest-posts__post-date, .has-background .wp-block-latest-posts .wp-block-latest-posts__post-date { color: currentColor; } .wp-block-latest-posts .wp-block-latest-posts__post-excerpt, .wp-block-latest-posts .wp-block-latest-posts__post-full-content { font-family: var(--latest-posts--description-font-family); font-size: var(--latest-posts--description-font-size); line-height: var(--global--line-height-body); margin-top: calc(0.666 * var(--global--spacing-vertical)); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers { border-top: calc(3 * var(--separator--height)) solid var(--global--color-border); border-bottom: calc(3 * var(--separator--height)) solid var(--global--color-border); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers:not(.is-grid) > li, .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers > li { padding-bottom: var(--global--spacing-vertical); border-bottom: var(--separator--height) solid var(--global--color-border); margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers:not(.is-grid) > li:last-child, .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers > li:last-child { padding-bottom: 0; border-bottom: none; } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid { box-shadow: inset 0 -1px 0 0 var(--global--color-border); border-bottom: calc(2 * var(--separator--height)) solid var(--global--color-border); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid li { margin: 0; padding-top: var(--global--spacing-vertical); padding-right: var(--global--spacing-horizontal); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid li:last-child { padding-bottom: var(--global--spacing-vertical); } @media screen and (min-width: 600px) { .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-2 li { width: calc(100% / 2); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-3 li { width: calc(100% / 3); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-4 li { width: calc(100% / 4); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-5 li { width: calc(100% / 5); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers.is-grid.columns-6 li { width: calc(100% / 6); } } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders li { border: calc(3 * var(--separator--height)) solid var(--global--color-border); padding: var(--global--spacing-vertical) var(--global--spacing-horizontal); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders li:last-child { padding-bottom: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } .wp-block-latest-posts.is-style-twentytwentyone-latest-posts-borders:not(.is-grid) li { margin-top: var(--global--spacing-horizontal); margin-bottom: var(--global--spacing-horizontal); } .gallery-item { display: inline-block; text-align: center; vertical-align: top; width: 100%; } .gallery-columns-2 .gallery-item { max-width: 50%; } .gallery-columns-3 .gallery-item { max-width: 33.33%; } .gallery-columns-4 .gallery-item { max-width: 25%; } .gallery-columns-5 .gallery-item { max-width: 20%; } .gallery-columns-6 .gallery-item { max-width: 16.66%; } .gallery-columns-7 .gallery-item { max-width: 14.28%; } .gallery-columns-8 .gallery-item { max-width: 12.5%; } .gallery-columns-9 .gallery-item { max-width: 11.11%; } .gallery-caption { display: block; } ul, ol { font-family: var(--list--font-family); margin: var(--global--spacing-vertical) 0; padding-left: calc(2 * var(--global--spacing-horizontal)); } ul.aligncenter, ol.aligncenter { list-style-position: inside; padding: 0; text-align: center; } ul.alignright, ol.alignright { list-style-position: inside; padding: 0; text-align: right; } li > ul, li > ol { margin: 0; } dt { font-family: var(--definition-term--font-family); font-weight: bold; } [data-align=full] .wp-block-media-text { margin-top: 0; margin-bottom: 0; } .wp-block-media-text > .wp-block-media-text__content > *:first-child { margin-top: 0; } .wp-block-media-text > .wp-block-media-text__content > *:last-child:not(.block-list-appender) { margin-bottom: 0; } .wp-block-media-text.has-child-selected > .wp-block-media-text__content > *:nth-last-child(2), .wp-block-media-text.is-selected > .wp-block-media-text__content > *:nth-last-child(2) { margin-bottom: 0; } .wp-block-media-text .wp-block-media-text__content { padding: var(--global--spacing-horizontal); } .wp-block-media-text.is-style-twentytwentyone-border { border: calc(3 * var(--separator--height)) solid var(--global--color-border); } .wp-block-navigation .wp-block-navigation__container { background: var(--global--color-background); padding: 0; } .wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__content { padding: var(--primary-nav--padding); } .wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__label { font-family: var(--primary-nav--font-family); font-size: var(--primary-nav--font-size); font-weight: var(--primary-nav--font-weight); } .wp-block-navigation .has-child .wp-block-navigation__container { box-shadow: var(--global--elevation); } .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:hover, .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:focus { color: var(--primary-nav--color-link-hover); } .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link__content { color: currentColor; } p { line-height: var(--wp--typography--line-height, var(--global--line-height-body)); } p.has-background { padding: var(--global--spacing-unit); } pre.wp-block-preformatted { overflow-x: auto; white-space: pre !important; font-size: var(--global--font-size-xs); } .wp-block-pullquote { padding: calc(2 * var(--global--spacing-unit)) 0; text-align: center; border-width: var(--pullquote--border-width); border-bottom-style: solid; border-top-style: solid; color: currentColor; border-color: currentColor; position: relative; } .wp-block-pullquote blockquote::before { color: currentColor; content: "“"; display: block; position: relative; left: 0; font-size: 3rem; font-weight: 500; line-height: 1; } .wp-block-pullquote p { font-family: var(--pullquote--font-family); font-size: var(--pullquote--font-size); font-style: var(--pullquote--font-style); font-weight: 700; letter-spacing: var(--pullquote--letter-spacing); line-height: var(--pullquote--line-height); margin: 0; } .wp-block-pullquote a { color: currentColor; } .wp-block-pullquote .wp-block-pullquote__citation, .wp-block-pullquote cite, .wp-block-pullquote footer { font-size: var(--global--font-size-xs); font-style: var(--pullquote--font-style); text-transform: none; } .wp-block-pullquote:not(.is-style-solid-color) { background: none; } .wp-block-pullquote.is-style-solid-color { margin-left: auto; margin-right: auto; padding: calc(2.5 * var(--global--spacing-unit)); border-width: var(--pullquote--border-width); border-style: solid; border-color: var(--pullquote--border-color); } @media (min-width: 600px) { .wp-block-pullquote.is-style-solid-color { padding: calc(5 * var(--global--spacing-unit)); } } .wp-block-pullquote.is-style-solid-color blockquote::before { text-align: left; } .wp-block-pullquote.is-style-solid-color.alignleft blockquote, .wp-block-pullquote.is-style-solid-color.alignright blockquote { padding-left: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); max-width: inherit; } .wp-block-pullquote.is-style-solid-color blockquote { margin: 0; max-width: 100%; } .wp-block-pullquote.is-style-solid-color blockquote p { font-size: var(--pullquote--font-size); } .wp-block-pullquote.is-style-solid-color .wp-block-pullquote__citation, .wp-block-pullquote.is-style-solid-color cite, .wp-block-pullquote.is-style-solid-color footer { color: currentColor; } .wp-block[data-align=full] .wp-block-pullquote:not(.is-style-solid-color) blockquote { padding: 0 calc(2 * var(--global--spacing-unit)); } .wp-block[data-align=left] .wp-block-pullquote.is-style-solid-color, .wp-block[data-align=right] .wp-block-pullquote.is-style-solid-color { padding: var(--global--spacing-unit); } .wp-block-query.has-background { padding: calc(0.666 * var(--global--spacing-vertical)); } @media only screen and (min-width: 482px) { .wp-block-query.has-background { padding: var(--global--spacing-vertical); } } .wp-block-quote { position: relative; border-left: none; margin: var(--global--spacing-vertical) auto var(--global--spacing-vertical) var(--global--spacing-horizontal); } .wp-block-quote p { font-family: var(--quote--font-family); font-size: var(--quote--font-size); font-style: var(--quote--font-style); font-weight: var(--quote--font-weight); line-height: var(--quote--line-height); } .wp-block-quote strong { font-weight: var(--quote--font-weight-strong); } .wp-block-quote:before { content: "“"; font-size: var(--quote--font-size); line-height: var(--quote--line-height); left: calc(-0.5 * var(--global--spacing-horizontal)); } .wp-block-quote .wp-block-quote__citation { color: var(--global--color-primary); font-size: var(--global--font-size-xs); font-style: var(--quote--font-style-cite); } .has-background .wp-block-quote .wp-block-quote__citation, [class*=background-color] .wp-block-quote .wp-block-quote__citation, [style*=background-color] .wp-block-quote .wp-block-quote__citation, .wp-block-cover[style*=background-image] .wp-block-quote .wp-block-quote__citation { color: currentColor; } .wp-block-quote.has-text-align-right { margin: var(--global--spacing-vertical) var(--global--spacing-horizontal) var(--global--spacing-vertical) auto; padding-right: 0; border-right: none; } .wp-block-quote.has-text-align-right:before { display: none; } .wp-block-quote.has-text-align-right p:before { content: "”"; font-size: var(--quote--font-size); font-weight: normal; line-height: var(--quote--line-height); margin-right: 5px; } .wp-block-quote.has-text-align-center { margin: var(--global--spacing-vertical) auto; } .wp-block-quote.has-text-align-center:before { display: none; } .wp-block-quote.is-large, .wp-block-quote.is-style-large { padding-left: 0; /* Resetting margins to match _block-container.scss */ margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } .wp-block-quote.is-large p, .wp-block-quote.is-style-large p { font-size: var(--quote--font-size-large); font-style: var(--quote--font-style-large); line-height: var(--quote--line-height-large); } .wp-block-quote.is-large:before, .wp-block-quote.is-style-large:before { font-size: var(--quote--font-size-large); line-height: var(--quote--line-height-large); left: calc(-1 * var(--global--spacing-horizontal)); } .wp-block-quote.is-large.has-text-align-right:before, .wp-block-quote.is-style-large.has-text-align-right:before { display: none; } .wp-block-quote.is-large.has-text-align-right p:before, .wp-block-quote.is-style-large.has-text-align-right p:before { content: "”"; font-size: var(--quote--font-size-large); font-weight: normal; line-height: var(--quote--line-height-large); margin-right: 10px; } @media only screen and (max-width: 481px) { .wp-block-quote.is-large, .wp-block-quote.is-style-large { padding-left: var(--global--spacing-horizontal); } .wp-block-quote.is-large:before, .wp-block-quote.is-style-large:before { left: 0; } .wp-block-quote.is-large.has-text-align-right, .wp-block-quote.is-style-large.has-text-align-right { padding-left: 0; padding-right: var(--global--spacing-horizontal); } .wp-block-quote.is-large.has-text-align-right:before, .wp-block-quote.is-style-large.has-text-align-right:before { right: 0; } } @media only screen and (max-width: 481px) { .wp-block-quote { padding-left: calc(0.5 * var(--global--spacing-horizontal)); } .wp-block-quote:before { left: 0; } .wp-block-quote.has-text-align-right { padding-left: 0; padding-right: calc(0.5 * var(--global--spacing-horizontal)); } .wp-block-quote.has-text-align-right:before { right: 0; } .wp-block-quote.has-text-align-center { padding-left: 0; padding-right: 0; } } @media only screen and (min-width: 482px) { .wp-block-quote { margin-left: auto; } .wp-block-quote.has-text-align-right { margin-right: auto; } } .wp-block-rss { padding-left: 0; } .wp-block-rss > li { list-style: none; } .wp-block-rss:not(.is-grid) > li { margin-top: calc(1.666 * var(--global--spacing-vertical)); margin-bottom: calc(1.666 * var(--global--spacing-vertical)); } .wp-block-rss:not(.is-grid) > li:first-child { margin-top: 0; } .wp-block-rss:not(.is-grid) > li:last-child { margin-bottom: 0; } .wp-block-rss.is-grid > li { margin-bottom: var(--global--spacing-vertical); } .wp-block-rss.is-grid > li:last-child { margin-bottom: 0; } .wp-block-rss.is-grid.columns-2 > li:nth-last-child(-n+2):nth-child(2n+1), .wp-block-rss.is-grid.columns-2 > li:nth-last-child(-n+2):nth-child(2n+1) ~ li, .wp-block-rss.is-grid.columns-3 > li:nth-last-child(-n+3):nth-child(3n+1), .wp-block-rss.is-grid.columns-3 > li:nth-last-child(-n+3):nth-child(3n+1) ~ li, .wp-block-rss.is-grid.columns-4 > li:nth-last-child(-n+4):nth-child(4n+1), .wp-block-rss.is-grid.columns-4 > li:nth-last-child(-n+4):nth-child(4n+1) ~ li, .wp-block-rss.is-grid.columns-5 > li:nth-last-child(-n+5):nth-child(5n+1), .wp-block-rss.is-grid.columns-5 > li:nth-last-child(-n+5):nth-child(5n+1) ~ li, .wp-block-rss.is-grid.columns-6 > li:nth-last-child(-n+6):nth-child(6n+1), .wp-block-rss.is-grid.columns-6 > li:nth-last-child(-n+6):nth-child(6n+1) ~ li { margin-bottom: 0; } .wp-block-rss > li > * { margin-top: calc(0.333 * var(--global--spacing-vertical)); margin-bottom: calc(0.333 * var(--global--spacing-vertical)); } .wp-block-rss > li > *:first-child { margin-top: 0; } .wp-block-rss > li > *:last-child { margin-bottom: 0; } .wp-block-rss .wp-block-rss__item-title > a { display: inline-block; font-family: var(--latest-posts--title-font-family); font-size: var(--latest-posts--title-font-size); font-weight: var(--heading--font-weight); line-height: var(--global--line-height-heading); margin-bottom: calc(0.333 * var(--global--spacing-vertical)); } .wp-block-rss .wp-block-rss__item-author { color: var(--global--color-primary); font-size: var(--global--font-size-md); line-height: var(--global--line-height-body); } .wp-block-rss .wp-block-rss__item-publish-date { color: var(--global--color-primary); font-size: var(--global--font-size-xs); line-height: var(--global--line-height-body); } [class*=inner-container] .wp-block-rss .wp-block-rss__item-publish-date, .has-background .wp-block-rss .wp-block-rss__item-publish-date { color: currentColor; } .wp-block-rss .wp-block-rss__item-excerpt, .wp-block-rss .wp-block-rss__item-full-content { font-family: var(--latest-posts--description-font-family); font-size: var(--latest-posts--description-font-size); line-height: var(--global--line-height-body); margin-top: calc(0.666 * var(--global--spacing-vertical)); } .wp-block-rss.alignfull { padding-left: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); } .entry-content [class*=inner-container] .wp-block-rss.alignfull, .entry-content .has-background .wp-block-rss.alignfull { padding-left: 0; padding-right: 0; } .wp-block-search { max-width: var(--responsive--aligndefault-width); } .wp-block-search .wp-block-search__label { font-size: var(--form--font-size); font-weight: var(--form--label-weight); margin-bottom: calc(var(--global--spacing-vertical) / 3); } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper, .wp-block-search .wp-block-search__input { border: var(--form--border-width) solid var(--form--border-color); border-radius: var(--form--border-radius); font-family: var(--form--font-family); font-size: var(--form--font-size); line-height: var(--form--line-height); max-width: inherit; margin-right: calc(-1 * var(--button--border-width)); padding: var(--form--spacing-unit); } .is-dark-theme .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper, .is-dark-theme .wp-block-search .wp-block-search__input { background: var(--global--color-white-90); } .has-background .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper, .has-background .wp-block-search .wp-block-search__input { border-color: var(--local--color-primary, var(--global--color-primary)) !important; } .wp-block-search .wp-block-search__button.wp-block-search__button { border: var(--button--border-width) solid transparent; border-radius: var(--button--border-radius); cursor: pointer; font-weight: var(--button--font-weight); font-family: var(--button--font-family); font-size: var(--button--font-size); line-height: var(--button--line-height); padding: var(--button--padding-vertical) var(--button--padding-horizontal); text-decoration: none; box-shadow: none; margin-left: 0; } .wp-block-search .wp-block-search__button.wp-block-search__button:not(:hover):not(:active):not(.has-text-color) { color: var(--global--color-background); } .has-background .wp-block-search .wp-block-search__button.wp-block-search__button:not(:hover):not(:active):not(.has-text-color) { color: var(--local--color-background, var(--global--color-primary)); } .has-background .wp-block-search .wp-block-search__button.wp-block-search__button:not(:hover):not(:active):not(.has-text-color).has-background { color: var(--global--color-primary); } .wp-block-search .wp-block-search__button.wp-block-search__button:not(:hover):not(:active):not(.has-background) { background-color: var(--global--color-primary); } .has-background .wp-block-search .wp-block-search__button.wp-block-search__button:not(:hover):not(:active):not(.has-background) { background-color: var(--local--color-primary, var(--global--color-primary)); } .wp-block-search .wp-block-search__button.wp-block-search__button:hover, .wp-block-search .wp-block-search__button.wp-block-search__button:active { background-color: transparent; border-color: currentColor; color: inherit; } .wp-block-search .wp-block-search__button.wp-block-search__button:focus { outline-offset: -6px; outline: 2px dotted currentColor; } .wp-block-search .wp-block-search__button.wp-block-search__button:disabled { background-color: var(--global--color-white-50); border-color: var(--global--color-white-50); color: var(--button--color-text-active); } .wp-block-search .wp-block-search__button.wp-block-search__button.has-icon { padding: 6px calc(0.5 * var(--button--padding-horizontal)); display: inherit; } .wp-block-search .wp-block-search__button.wp-block-search__button.has-icon svg { width: 40px; height: 40px; } .has-background .wp-block-search .wp-block-search__button.wp-block-search__button:hover, .has-background .wp-block-search .wp-block-search__button.wp-block-search__button:active { background-color: var(--local--color-background, var(--global--color-background)) !important; color: var(--local--color-primary, var(--global--color-primary)) !important; } .has-text-color .wp-block-search .wp-block-search__button.wp-block-search__button:hover, .has-text-color .wp-block-search .wp-block-search__button.wp-block-search__button:active { color: var(--local--color-primary, var(--global--color-primary)) !important; } .wp-block-search .wp-block-search__button.wp-block-search__button:focus { outline-offset: inherit; outline: inherit; } .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper { padding: var(--form--border-width); } .wp-block-search.wp-block-search__button-inside .wp-block-search__input { border: none; } .wp-block-search.wp-block-search__button-inside.wp-block-search__text-button .wp-block-search__button:hover, .wp-block-search.wp-block-search__button-inside.wp-block-search__icon-button .wp-block-search__button:hover { color: var(--global--color-dark-gray); } .is-dark-theme .wp-block-search.wp-block-search__button-inside.wp-block-search__text-button .wp-block-search__button, .is-dark-theme .wp-block-search.wp-block-search__button-inside.wp-block-search__icon-button .wp-block-search__button { color: var(--global--color-dark-gray); } .is-dark-theme .wp-block-search.wp-block-search__button-inside.wp-block-search__text-button .wp-block-search__button:hover, .is-dark-theme .wp-block-search.wp-block-search__button-inside.wp-block-search__icon-button .wp-block-search__button:hover { background-color: var(--global--color-dark-gray); color: var(--global--color-white); } .wp-block-search.wp-block-search__button-inside.wp-block-search__text-button .wp-block-search__button { padding: var(--button--padding-vertical) var(--button--padding-horizontal); } .wp-block[data-align=center] > * { text-align: center; } .wp-block[data-align=center] .wp-block-search__button-only .wp-block-search__inside-wrapper { justify-content: center; } .wp-block-separator, hr { border-bottom: var(--separator--height) solid var(--separator--border-color); clear: both; opacity: 1; } .wp-block-separator[style*="text-align:right"], .wp-block-separator[style*="text-align: right"], hr[style*="text-align:right"], hr[style*="text-align: right"] { border-right-color: var(--separator--border-color); } .wp-block-separator:not(.is-style-dots), hr:not(.is-style-dots) { max-width: var(--responsive--aligndefault-width); } [data-align=full] > .wp-block-separator, [data-align=wide] > .wp-block-separator, [data-align=full] > hr, [data-align=wide] > hr { max-width: inherit; } .wp-block-separator.is-style-twentytwentyone-separator-thick, hr.is-style-twentytwentyone-separator-thick { border-bottom-width: calc(3 * var(--separator--height)); } .wp-block-separator.is-style-dots, hr.is-style-dots { border-bottom: none; } .wp-block-separator.is-style-dots.has-background, .wp-block-separator.is-style-dots.has-text-color, hr.is-style-dots.has-background, hr.is-style-dots.has-text-color { background-color: transparent !important; } .wp-block-separator.is-style-dots.has-background:before, .wp-block-separator.is-style-dots.has-text-color:before, hr.is-style-dots.has-background:before, hr.is-style-dots.has-text-color:before { color: currentColor !important; } .wp-block-separator.is-style-dots:before, hr.is-style-dots:before { color: var(--separator--border-color); } .has-background .wp-block-separator, [class*=background-color] .wp-block-separator, [style*=background-color] .wp-block-separator, .wp-block-cover[style*=background-image] .wp-block-separator, .has-background hr, [class*=background-color] hr, [style*=background-color] hr, .wp-block-cover[style*=background-image] hr { border-color: currentColor; } .wp-block-social-links [data-block] { margin-top: 0; margin-bottom: 0; } .wp-block-social-links.is-style-twentytwentyone-social-icons-color button { color: var(--global--color-primary); } .wp-block-social-links.is-style-twentytwentyone-social-icons-color .wp-social-link { background: none; } table thead, table tfoot, .wp-block-table thead, .wp-block-table tfoot { text-align: center; } table th, .wp-block-table th { font-family: var(--heading--font-family); } table td, table th, .wp-block-table td, .wp-block-table th { padding: calc(0.5 * var(--global--spacing-unit)); } table.is-style-regular .has-background, table.is-style-stripes .has-background, table.is-style-stripes .has-background thead tr, table.is-style-stripes .has-background tfoot tr, table.is-style-stripes .has-background tbody tr, .wp-block-table.is-style-regular .has-background, .wp-block-table.is-style-stripes .has-background, .wp-block-table.is-style-stripes .has-background thead tr, .wp-block-table.is-style-stripes .has-background tfoot tr, .wp-block-table.is-style-stripes .has-background tbody tr { color: var(--table--has-background-text-color); } table.is-style-stripes, .wp-block-table.is-style-stripes { border-color: var(--table--stripes-border-color); } table.is-style-stripes th, table.is-style-stripes td, .wp-block-table.is-style-stripes th, .wp-block-table.is-style-stripes td { border-width: 0; } table.is-style-stripes tbody tr:nth-child(odd), .wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background-color: var(--table--stripes-background-color); } table.is-style-stripes .has-background tbody tr:nth-child(odd), .wp-block-table.is-style-stripes .has-background tbody tr:nth-child(odd) { background-color: var(--global--color-white-90); } table.wp-calendar-table td, table.wp-calendar-table th { background: transparent; border: 0; text-align: center; line-height: 2; vertical-align: middle; } table.wp-calendar-table th { font-weight: bold; } table.wp-calendar-table thead, table.wp-calendar-table tbody { color: currentColor; border: 1px solid; } table.wp-calendar-table caption { font-weight: bold; text-align: left; margin-bottom: var(--global--spacing-unit); color: currentColor; } .wp-calendar-nav { text-align: left; margin-top: calc(var(--global--spacing-unit) / 2); } .wp-calendar-nav svg { height: 1em; vertical-align: middle; } .wp-calendar-nav svg path { fill: currentColor; } .wp-calendar-nav .wp-calendar-nav-next { float: right; } .wp-block-tag-cloud.aligncenter { text-align: center; } pre.wp-block-verse { padding: 0; color: currentColor; } :root .is-extra-small-text, :root .has-extra-small-font-size { font-size: var(--global--font-size-xs); } :root .is-small-text, :root .has-small-font-size { font-size: var(--global--font-size-sm); } :root .is-regular-text, :root .has-regular-font-size, :root .is-normal-font-size, :root .has-normal-font-size, :root .has-medium-font-size { font-size: var(--global--font-size-base); } :root .is-large-text, :root .has-large-font-size { font-size: var(--global--font-size-lg); line-height: var(--global--line-height-heading); } :root .is-larger-text, :root .has-larger-font-size, :root .is-extra-large-text, :root .has-extra-large-font-size { font-size: var(--global--font-size-xl); line-height: var(--global--line-height-heading); } :root .is-huge-text, :root .has-huge-font-size { font-size: var(--global--font-size-xxl); line-height: var(--global--line-height-heading); font-weight: var(--heading--font-weight-page-title); } :root .is-gigantic-text, :root .has-gigantic-font-size { font-size: var(--global--font-size-xxxl); line-height: var(--global--line-height-heading); font-weight: var(--heading--font-weight-page-title); } /** * Editor Post Title * - Needs a special styles */ .wp-block.editor-post-title__block { border-bottom: 3px solid var(--global--color-border); padding-bottom: calc(2 * var(--global--spacing-vertical)); margin-bottom: calc(3 * var(--global--spacing-vertical)); max-width: var(--responsive--alignwide-width); } .wp-block.editor-post-title__block .editor-post-title__input { color: var(--global--color-secondary); font-family: var(--heading--font-family); font-size: var(--global--font-size-page-title); font-weight: var(--heading--font-weight-page-title); line-height: var(--heading--line-height-h1); } .wp-block.block-editor-default-block-appender > textarea { font-family: var(--global--font-secondary); font-size: var(--global--font-size-md); } .has-primary-color[class] { color: var(--global--color-primary); } .has-secondary-color[class] { color: var(--global--color-secondary); } .has-background a, .has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6 { color: currentColor; } .has-primary-background-color[class] { background-color: var(--global--color-primary); color: var(--global--color-background); } .has-secondary-background-color[class] { background-color: var(--global--color-secondary); color: var(--global--color-background); } .has-white-background-color[class] { background-color: var(--global--color-white); color: var(--global--color-secondary); } .has-black-background-color[class] { background-color: var(--global--color-black); color: var(--global--color-primary); } [data-block] { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } .wp-block { max-width: var(--responsive--aligndefault-width); } .wp-block[data-align=wide], .wp-block.alignwide { max-width: var(--responsive--alignwide-width); } .wp-block[data-align=full], .wp-block.alignfull { max-width: none; } .alignleft { margin: 0; margin-right: var(--global--spacing-horizontal); } .alignright { margin: 0; margin-left: var(--global--spacing-horizontal); } .has-drop-cap:not(:focus)::first-letter { font-family: var(--heading--font-family); font-weight: var(--heading--font-weight); line-height: 0.66; text-transform: uppercase; font-style: normal; float: left; margin: 0.1em 0.1em 0 0; font-size: calc(1.2 * var(--heading--font-size-h1)); } @media only screen and (min-width: 482px) { .wp-block[data-align=left] > * { max-width: 290px; margin-right: var(--global--spacing-horizontal); } .wp-block[data-align=right] > * { max-width: 290px; margin-left: var(--global--spacing-horizontal); } } .wp-block-freeform.block-library-rich-text__tinymce blockquote { border: none; } .wp-block-freeform.block-library-rich-text__tinymce blockquote:before { left: 5px; } html { font-family: var(--global--font-secondary); line-height: var(--global--line-height-body); } body { --wp--typography--line-height: var(--global--line-height-body); color: var(--global--color-primary); background-color: var(--global--color-background); font-family: var(--global--font-secondary); font-size: var(--global--font-size-base); font-weight: normal; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } .wp-block a { color: var(--wp--style--color--link, var(--global--color-primary)); } .wp-block a:hover { text-decoration-style: dotted; } .wp-block a:focus { outline: 2px solid var(--wp--style--color--link, var(--global--color-primary)); text-decoration: none; } .has-background .has-link-color a, .has-background.has-link-color a { color: var(--wp--style--color--link, var(--global--color-primary)); } button, a { cursor: pointer; } .has-black-color[class] { color: var(--global--color-black); } .has-black-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-black, #000); color: var(--local--color-primary); } .has-gray-color[class] { color: var(--global--color-gray); } .has-gray-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-gray, #000); color: var(--local--color-primary); } .has-dark-gray-color[class] { color: var(--global--color-dark-gray); } .has-dark-gray-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-dark-gray, #000); color: var(--local--color-primary); } .has-green-color[class] { color: var(--global--color-green); } .has-green-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-green, #fff); color: var(--local--color-primary); } .has-blue-color[class] { color: var(--global--color-blue); } .has-blue-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-blue, #fff); color: var(--local--color-primary); } .has-purple-color[class] { color: var(--global--color-purple); } .has-purple-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-purple, #fff); color: var(--local--color-primary); } .has-red-color[class] { color: var(--global--color-red); } .has-red-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-red, #fff); color: var(--local--color-primary); } .has-orange-color[class] { color: var(--global--color-orange); } .has-orange-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-orange, #fff); color: var(--local--color-primary); } .has-yellow-color[class] { color: var(--global--color-yellow); } .has-yellow-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-yellow, #fff); color: var(--local--color-primary); } .has-white-color[class] { color: var(--global--color-white); } .has-white-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-white, #fff); color: var(--local--color-primary); } .has-background a, .has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6 { color: currentColor; } .has-black-background-color[class] { background-color: var(--global--color-black); } .has-black-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-black, #000); background-color: var(--local--color-background); } .has-dark-gray-background-color[class] { background-color: var(--global--color-dark-gray); } .has-dark-gray-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-dark-gray, #000); background-color: var(--local--color-background); } .has-gray-background-color[class] { background-color: var(--global--color-gray); } .has-gray-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-gray, #000); background-color: var(--local--color-background); } .has-light-gray-background-color[class] { background-color: var(--global--color-light-gray); } .has-light-gray-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-light-gray, #fff); background-color: var(--local--color-background); } .has-green-background-color[class] { background-color: var(--global--color-green); } .has-green-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-green, #fff); background-color: var(--local--color-background); } .has-blue-background-color[class] { background-color: var(--global--color-blue); } .has-blue-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-blue, #fff); background-color: var(--local--color-background); } .has-purple-background-color[class] { background-color: var(--global--color-purple); } .has-purple-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-purple, #fff); background-color: var(--local--color-background); } .has-red-background-color[class] { background-color: var(--global--color-red); } .has-red-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-red, #fff); background-color: var(--local--color-background); } .has-orange-background-color[class] { background-color: var(--global--color-orange); } .has-orange-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-orange, #fff); background-color: var(--local--color-background); } .has-yellow-background-color[class] { background-color: var(--global--color-yellow); } .has-yellow-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-yellow, #fff); background-color: var(--local--color-background); } .has-white-background-color[class] { background-color: var(--global--color-white); } .has-white-background-color[class] > [class*=__inner-container] { --local--color-background: var(--global--color-white, #fff); background-color: var(--local--color-background); } .has-background:not(.has-text-color).has-black-background-color[class], .has-background:not(.has-text-color).has-gray-background-color[class], .has-background:not(.has-text-color).has-dark-gray-background-color[class] { color: var(--global--color-white); } .has-background:not(.has-text-color).has-black-background-color[class] > [class*=__inner-container], .has-background:not(.has-text-color).has-gray-background-color[class] > [class*=__inner-container], .has-background:not(.has-text-color).has-dark-gray-background-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-background, #fff); color: var(--local--color-primary, var(--global--color-primary)); } .is-dark-theme .has-background:not(.has-text-color).has-black-background-color[class] > [class*=__inner-container], .is-dark-theme .has-background:not(.has-text-color).has-gray-background-color[class] > [class*=__inner-container], .is-dark-theme .has-background:not(.has-text-color).has-dark-gray-background-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-primary, #000); } .has-background:not(.has-text-color).has-green-background-color[class], .has-background:not(.has-text-color).has-blue-background-color[class], .has-background:not(.has-text-color).has-purple-background-color[class], .has-background:not(.has-text-color).has-red-background-color[class], .has-background:not(.has-text-color).has-orange-background-color[class], .has-background:not(.has-text-color).has-yellow-background-color[class], .has-background:not(.has-text-color).has-white-background-color[class] { color: var(--global--color-dark-gray); } .has-background:not(.has-text-color).has-green-background-color[class] > [class*=__inner-container], .has-background:not(.has-text-color).has-blue-background-color[class] > [class*=__inner-container], .has-background:not(.has-text-color).has-purple-background-color[class] > [class*=__inner-container], .has-background:not(.has-text-color).has-red-background-color[class] > [class*=__inner-container], .has-background:not(.has-text-color).has-orange-background-color[class] > [class*=__inner-container], .has-background:not(.has-text-color).has-yellow-background-color[class] > [class*=__inner-container], .has-background:not(.has-text-color).has-white-background-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-primary, #000); color: var(--local--color-primary, var(--global--color-primary)); } .is-dark-theme .has-background:not(.has-text-color).has-green-background-color[class] > [class*=__inner-container], .is-dark-theme .has-background:not(.has-text-color).has-blue-background-color[class] > [class*=__inner-container], .is-dark-theme .has-background:not(.has-text-color).has-purple-background-color[class] > [class*=__inner-container], .is-dark-theme .has-background:not(.has-text-color).has-red-background-color[class] > [class*=__inner-container], .is-dark-theme .has-background:not(.has-text-color).has-orange-background-color[class] > [class*=__inner-container], .is-dark-theme .has-background:not(.has-text-color).has-yellow-background-color[class] > [class*=__inner-container], .is-dark-theme .has-background:not(.has-text-color).has-white-background-color[class] > [class*=__inner-container] { --local--color-primary: var(--global--color-background, #fff); } .has-purple-to-yellow-gradient-background { background: linear-gradient(160deg, var(--global--color-purple), var(--global--color-yellow)); } .has-yellow-to-purple-gradient-background { background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-purple)); } .has-green-to-yellow-gradient-background { background: linear-gradient(160deg, var(--global--color-green), var(--global--color-yellow)); } .has-yellow-to-green-gradient-background { background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-green)); } .has-red-to-yellow-gradient-background { background: linear-gradient(160deg, var(--global--color-red), var(--global--color-yellow)); } .has-yellow-to-red-gradient-background { background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-red)); } .has-purple-to-red-gradient-background { background: linear-gradient(160deg, var(--global--color-purple), var(--global--color-red)); } .has-red-to-purple-gradient-background { background: linear-gradient(160deg, var(--global--color-red), var(--global--color-purple)); } assets/sass/07-utilities/a11y.scss000064400000001423152377522560012744 0ustar00.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); -webkit-clip-path: inset(50%); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; word-break: normal; } .skip-link:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; -webkit-clip-path: none; clip-path: none; color: #21759b; display: block; font-size: 0.875rem; font-weight: 700; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; } /* Do not show the outline on the skip link target. */ #content[tabindex="-1"]:focus { outline: 0; } assets/sass/07-utilities/measure.scss000064400000000401152377522560013625 0ustar00// Measure // - The width of a line of text, in characters, is known as its measure. header *, main *, footer * { max-width: var(--global--spacing-measure); } html, body, div, header, nav, article, figure, hr, main, section, footer { max-width: none; } assets/sass/07-utilities/color-palette.scss000064400000020404152377522560014743 0ustar00// Gutenberg text color options .has-black-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-primary: var(--global--color-black, #000000); color: var(--local--color-primary); } color: var(--global--color-black); } .has-gray-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-primary: var(--global--color-gray, #000000); color: var(--local--color-primary); } color: var(--global--color-gray); } .has-dark-gray-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-primary: var(--global--color-dark-gray, #000000); color: var(--local--color-primary); } color: var(--global--color-dark-gray); } .has-green-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-primary: var(--global--color-green, #FFFFFF); color: var(--local--color-primary); } color: var(--global--color-green); } .has-blue-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-primary: var(--global--color-blue, #FFFFFF); color: var(--local--color-primary); } color: var(--global--color-blue); } .has-purple-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-primary: var(--global--color-purple, #FFFFFF); color: var(--local--color-primary); } color: var(--global--color-purple); } .has-red-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-primary: var(--global--color-red, #FFFFFF); color: var(--local--color-primary); } color: var(--global--color-red); } .has-orange-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-primary: var(--global--color-orange, #FFFFFF); color: var(--local--color-primary); } color: var(--global--color-orange); } .has-yellow-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-primary: var(--global--color-yellow, #FFFFFF); color: var(--local--color-primary); } color: var(--global--color-yellow); } .has-white-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-primary: var(--global--color-white, #FFFFFF); color: var(--local--color-primary); } color: var(--global--color-white); } // Gutenberg background-color options .has-background { a, p, h1, h2, h3, h4, h5, h6 { color: currentColor; } } .has-black-background-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-background: var(--global--color-black, #000000); background-color: var(--local--color-background); } background-color: var(--global--color-black); } .has-dark-gray-background-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-background: var(--global--color-dark-gray, #000000); background-color: var(--local--color-background); } background-color: var(--global--color-dark-gray); } .has-gray-background-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-background: var(--global--color-gray, #000000); background-color: var(--local--color-background); } background-color: var(--global--color-gray); } .has-light-gray-background-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-background: var(--global--color-light-gray, #FFFFFF); background-color: var(--local--color-background); } background-color: var(--global--color-light-gray); } .has-green-background-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-background: var(--global--color-green, #FFFFFF); background-color: var(--local--color-background); } background-color: var(--global--color-green); } .has-blue-background-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-background: var(--global--color-blue, #FFFFFF); background-color: var(--local--color-background); } background-color: var(--global--color-blue); } .has-purple-background-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-background: var(--global--color-purple, #FFFFFF); background-color: var(--local--color-background); } background-color: var(--global--color-purple); } .has-red-background-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-background: var(--global--color-red, #FFFFFF); background-color: var(--local--color-background); } background-color: var(--global--color-red); } .has-orange-background-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-background: var(--global--color-orange, #FFFFFF); background-color: var(--local--color-background); } background-color: var(--global--color-orange); } .has-yellow-background-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-background: var(--global--color-yellow, #FFFFFF); background-color: var(--local--color-background); } background-color: var(--global--color-yellow); } .has-white-background-color[class] { // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-background: var(--global--color-white, #FFFFFF); background-color: var(--local--color-background); } background-color: var(--global--color-white); } .has-background:not(.has-text-color) { &.has-black-background-color[class], &.has-gray-background-color[class], &.has-dark-gray-background-color[class] { color: var(--global--color-white); // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-primary: var(--global--color-background, #FFFFFF); // Reverse the local foreground color in darkmode .is-dark-theme & { --local--color-primary: var(--global--color-primary, #000000); } color: var(--local--color-primary, var(--global--color-primary)); } } &.has-green-background-color[class], &.has-blue-background-color[class], &.has-purple-background-color[class], &.has-red-background-color[class], &.has-orange-background-color[class], &.has-yellow-background-color[class], &.has-white-background-color[class] { color: var(--global--color-dark-gray); // Localize CSS-variables to limit relationship scope > [class*="__inner-container"] { --local--color-primary: var(--global--color-primary, #000000); // Reverse the local foreground color in darkmode .is-dark-theme & { --local--color-primary: var(--global--color-background, #FFFFFF); } color: var(--local--color-primary, var(--global--color-primary)); } } } // Custom gradients .has-purple-to-yellow-gradient-background { background: linear-gradient(160deg, var(--global--color-purple), var(--global--color-yellow)); } .has-yellow-to-purple-gradient-background { background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-purple)); } .has-green-to-yellow-gradient-background { background: linear-gradient(160deg, var(--global--color-green), var(--global--color-yellow)); } .has-yellow-to-green-gradient-background { background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-green)); } .has-red-to-yellow-gradient-background { background: linear-gradient(160deg, var(--global--color-red), var(--global--color-yellow)); } .has-yellow-to-red-gradient-background { background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-red)); } .has-purple-to-red-gradient-background { background: linear-gradient(160deg, var(--global--color-purple), var(--global--color-red)); } .has-red-to-purple-gradient-background { background: linear-gradient(160deg, var(--global--color-red), var(--global--color-purple)); } assets/sass/07-utilities/print.scss000064400000006010152377522560013322 0ustar00/* Adding print support. The print styles are based on the the great work of Andreas Hecht in https://www.jotform.com/blog/css-perfect-print-stylesheet-98272/. */ /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- # Margins & paddings # Typography # Page breaks # Links # Visibility --------------------------------------------------------------*/ @media print { /* Margins & paddings */ @page { margin: 2cm; } .entry .entry-header, .entry, .single .site-main > article > .entry-footer { margin-top: 0; margin-bottom: 0; } .site-footer .site-info { margin: 0; } .site-header { padding: 0; } /* Fonts */ body { font: 13pt Georgia, "Times New Roman", Times, serif; // Fallback for browsers without CSS variables support. font: 13pt var(--global--font-secondary, Georgia, "Times New Roman", Times, serif); line-height: 1.3; background: #fff !important; color: #000; } // Override color settings that changes the text to white. .has-background-dark * { color: #000 !important; } h1, .entry-title, .singular .entry-title, .page-title { font-size: 22pt; font-weight: bold; } h2, h3, h4, .has-regular-font-size, .has-large-font-size, h2.author-title, p.author-bio, .comments-title, .archive-description { font-size: 14pt; margin-top: 25px; } .comment-meta, .comment-meta .comment-author .fn { font-size: 13pt; } /* Page breaks */ a { page-break-inside: avoid; } blockquote { page-break-inside: avoid; } h1, h2, h3, h4, h5, h6 { page-break-after: avoid; page-break-inside: avoid; } img { page-break-inside: avoid; page-break-after: avoid; } table, pre, figure { page-break-inside: avoid; } ul, ol, dl { page-break-before: avoid; } /* Links */ a:link, a:visited, a { background: transparent; font-weight: bold; text-decoration: underline; text-align: left; } a[href^="http"]:after { content: " < " attr(href) "> "; } a:after > img { content: ""; } article a[href^="#"]:after { content: ""; } a:not(:local-link):after { // stylelint-disable-line selector-pseudo-class-no-unknown content: " < " attr(href) "> "; } .entry-title a:after { content: "\a < " attr(href) "> "; white-space: pre; font-size: 14pt; } .cat-links a:after, .tags-links a:after, .byline a:after, .comment-metadata a:after, .wp-block-calendar a:after, .wp-block-tag-cloud a:after, .page-links a:after { content: ""; } /* Visibility */ .primary-navigation, .site-title + .primary-navigation, .footer-navigation, .entry-footer, .post-navigation, .navigation.pagination, .widget-area, .edit-link, .more-link, .comment-reply, .reply, .comment .comment-metadata .edit-link, .comment-respond, #dark-mode-toggler { display: none !important; } .entry .entry-content .wp-block-button .wp-block-button__link, .entry .entry-content .button, .entry .entry-content .wp-block-file__button { color: #000; background: none; } } assets/sass/07-utilities/ie.scss000064400000001572152377522560012573 0ustar00.is-IE { &.is-dark-theme { color: #fff; *, a, .site-description, .entry-title, .entry-footer, .widget-area, .post-navigation .meta-nav, .footer-navigation-wrapper li a:link, .site-footer > .site-info, .site-footer > .site-info a, .site-footer > .site-info a:visited { color: #fff; } .sub-menu-toggle svg, .sub-menu-toggle path, .post-navigation .meta-nav svg, .post-navigation .meta-nav path { fill: #fff; } .primary-navigation > div > .menu-wrapper > li > .sub-menu li { background: #000; } &.primary-navigation-open { @include media(mobile-only) { .primary-navigation > .primary-menu-container, .menu-button-container { background-color: #000; } } } .skip-link:focus { color: #21759b; } } .navigation .nav-links { display: block; } .post-thumbnail .wp-post-image { min-width: auto; } } assets/sass/style-editor.scss000064400000000707152377522560012362 0ustar00/** * These styles should be loaded by the Block Editor only */ @import "01-settings/fonts"; @import "01-settings/global"; @import "02-tools/mixins"; @import "02-tools/functions"; @import "03-generic/breakpoints"; @import "04-elements/blockquote"; @import "04-elements/media"; @import "04-elements/forms-editor"; @import "04-elements/links"; @import "05-blocks/blocks-editor"; @import "06-components/editor"; @import "07-utilities/color-palette"; assets/sass/05-blocks/quote/_style.scss000064400000005065152377522560014073 0ustar00.wp-block-quote { border-left: none; &:before { content: "\201C"; font-size: var(--quote--font-size); line-height: var(--quote--line-height); left: 8px; } .wp-block-quote__citation, cite, footer { .has-background &, [class*="background-color"] &, [style*="background-color"] &, .wp-block-cover[style*="background-image"] & { color: currentColor; } } /** * Block Options */ &.has-text-align-right { margin: var(--global--spacing-vertical) var(--global--spacing-horizontal) var(--global--spacing-vertical) auto; padding-right: 0; border-right: none; // Hide the left aligned quote. &:before { display: none; } // Align the quote left of the text. p:before { content: "\201D"; font-size: var(--quote--font-size); font-weight: normal; line-height: var(--quote--line-height); margin-right: 5px; } } &.has-text-align-center { margin: var(--global--spacing-vertical) auto; &:before { display: none; } } &.is-large, &.is-style-large { padding-left: 0; padding-right: 0; /* Resetting margins to match _block-container.scss */ margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); p { font-size: var(--quote--font-size-large); font-style: var(--quote--font-style-large); line-height: var(--quote--line-height-large); } &:before { font-size: var(--quote--font-size-large); line-height: var(--quote--line-height-large); left: calc(-1 * var(--global--spacing-horizontal)); } &.has-text-align-right { // Hide the left aligned quote. &:before { display: none; } // Align the quote left of the text. p:before { content: "\201D"; font-size: var(--quote--font-size-large); font-weight: normal; line-height: var(--quote--line-height-large); margin-right: 10px; } } .wp-block-quote__citation, cite, footer { color: var(--global--color-primary); font-size: var(--global--font-size-sm); } @include media(mobile-only) { padding-left: var(--global--spacing-horizontal); &:before { left: 0; } &.has-text-align-right { padding-left: 0; padding-right: var(--global--spacing-horizontal); &:before { right: 0; } } &.has-text-align-center { padding-left: 0; padding-right: 0; } } } @include media(mobile-only) { &.has-text-align-right { padding-left: 0; padding-right: calc(0.5 * var(--global--spacing-horizontal)); &:before { right: 0; } } &.has-text-align-center { padding-left: 0; padding-right: 0; } } } assets/sass/05-blocks/quote/_editor.scss000064400000006051152377522560014215 0ustar00.wp-block-quote { position: relative; border-left: none; margin: var(--global--spacing-vertical) auto var(--global--spacing-vertical) var(--global--spacing-horizontal); p { font-family: var(--quote--font-family); font-size: var(--quote--font-size); font-style: var(--quote--font-style); font-weight: var(--quote--font-weight); line-height: var(--quote--line-height); } strong { font-weight: var(--quote--font-weight-strong); } &:before { content: "\201C"; font-size: var(--quote--font-size); line-height: var(--quote--line-height); left: calc(-0.5 * var(--global--spacing-horizontal)); } .wp-block-quote__citation { color: var(--global--color-primary); font-size: var(--global--font-size-xs); font-style: var(--quote--font-style-cite); .has-background &, [class*="background-color"] &, [style*="background-color"] &, .wp-block-cover[style*="background-image"] & { color: currentColor; } } &.has-text-align-right { margin: var(--global--spacing-vertical) var(--global--spacing-horizontal) var(--global--spacing-vertical) auto; padding-right: 0; border-right: none; // Hide the left aligned quote. &:before { display: none; } // Align the quote left of the text. p:before { content: "\201D"; font-size: var(--quote--font-size); font-weight: normal; line-height: var(--quote--line-height); margin-right: 5px; } } &.has-text-align-center { margin: var(--global--spacing-vertical) auto; &:before { display: none; } } &.is-large, &.is-style-large { padding-left: 0; /* Resetting margins to match _block-container.scss */ margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); p { font-size: var(--quote--font-size-large); font-style: var(--quote--font-style-large); line-height: var(--quote--line-height-large); } &:before { font-size: var(--quote--font-size-large); line-height: var(--quote--line-height-large); left: calc(-1 * var(--global--spacing-horizontal)); } &.has-text-align-right { // Hide the left aligned quote. &:before { display: none; } // Align the quote left of the text. p:before { content: "\201D"; font-size: var(--quote--font-size-large); font-weight: normal; line-height: var(--quote--line-height-large); margin-right: 10px; } } @include media(mobile-only) { padding-left: var(--global--spacing-horizontal); &:before { left: 0; } &.has-text-align-right { padding-left: 0; padding-right: var(--global--spacing-horizontal); &:before { right: 0; } } } } @include media(mobile-only) { padding-left: calc(0.5 * var(--global--spacing-horizontal)); &:before { left: 0; } &.has-text-align-right { padding-left: 0; padding-right: calc(0.5 * var(--global--spacing-horizontal)); &:before { right: 0; } } &.has-text-align-center { padding-left: 0; padding-right: 0; } } @include media(mobile) { margin-left: auto; &.has-text-align-right { margin-right: auto; } } } assets/sass/05-blocks/preformatted/_style.scss000064400000000104152377522560015417 0ustar00pre.wp-block-preformatted { overflow-x: auto; white-space: pre; } assets/sass/05-blocks/preformatted/_editor.scss000064400000000171152377522560015551 0ustar00pre.wp-block-preformatted { overflow-x: auto; white-space: pre !important; font-size: var(--global--font-size-xs); } assets/sass/05-blocks/code/_style.scss000064400000000423152377522560013641 0ustar00.wp-block-code { border-color: var(--global--color-border); border-radius: 0; border-style: solid; border-width: 0.1rem; padding: var(--global--spacing-unit); code { color: var(--global--color-primary); white-space: pre; overflow-x: auto; display: block; } } assets/sass/05-blocks/code/_editor.scss000064400000000406152377522560013770 0ustar00.wp-block-code code { white-space: pre !important; overflow-x: auto; } .wp-block-code { border-color: var(--global--color-border); border-radius: 0; border-style: solid; border-width: 0.1rem; padding: var(--global--spacing-unit); color: currentColor; } assets/sass/05-blocks/paragraph/_style.scss000064400000000530152377522560014673 0ustar00p { line-height: var(--wp--typography--line-height, var(--global--line-height-body)); // inherits general font style set at &.has-background { padding: var(--global--spacing-unit); } // Override `color: inherit` from Core styles. &.has-text-color a { color: var(--wp--style--color--link, var(--global--color-primary)); } } assets/sass/05-blocks/paragraph/_editor.scss000064400000000231152377522560015017 0ustar00p { line-height: var(--wp--typography--line-height, var(--global--line-height-body)); &.has-background { padding: var(--global--spacing-unit); } } assets/sass/05-blocks/list/_style.scss000064400000001123152377522560013700 0ustar00ul, ol { font-family: var(--list--font-family); margin: 0; padding-left: calc(2 * var(--global--spacing-horizontal)); // Utility classes &.aligncenter { list-style-position: inside; padding: 0; } &.alignright { list-style-position: inside; text-align: right; padding: 0; } } ul { list-style-type: disc; ul { list-style-type: circle; } } ol { list-style-type: decimal; ul { list-style-type: circle; } } dt { font-family: var(--definition-term--font-family); font-weight: bold; } dd { margin: 0; padding-left: calc(2 * var(--global--spacing-horizontal)); } assets/sass/05-blocks/list/_editor.scss000064400000000724152377522560014034 0ustar00ul, ol { font-family: var(--list--font-family); margin: var(--global--spacing-vertical) 0; padding-left: calc(2 * var(--global--spacing-horizontal)); // Utility classes &.aligncenter { list-style-position: inside; padding: 0; text-align: center; } &.alignright { list-style-position: inside; padding: 0; text-align: right; } } li { > ul, > ol { margin: 0; } } dt { font-family: var(--definition-term--font-family); font-weight: bold; } assets/sass/05-blocks/image/_style.scss000064400000002511152377522560014011 0ustar00.wp-block-image { text-align: center; figcaption { color: var(--global--color-primary); font-size: var(--global--font-size-xs); line-height: var(--global--line-height-body); margin-top: calc(0.5 * var(--global--spacing-unit)); margin-bottom: var(--global--spacing-unit); text-align: center; } .alignright { margin-left: var(--global--spacing-horizontal); } .alignleft { margin-right: var(--global--spacing-horizontal); } a:focus img { outline-offset: 2px; } } // Remove vertical margins from image block wrappers when floated .entry-content > *[class="wp-block-image"], .entry-content [class*="inner-container"] > *[class="wp-block-image"] { margin-top: 0; margin-bottom: 0; // Remove top margins from the following element when previous image block is floated + * { margin-top: 0; } } // Block Styles .wp-block-image.is-style-twentytwentyone-border img, .wp-block-image.is-style-twentytwentyone-image-frame img { border: calc(3 * var(--separator--height)) solid var(--global--color-border); } .wp-block-image.is-style-twentytwentyone-image-frame img { padding: var(--global--spacing-unit); } .entry-content { > .wp-block-image { > .alignleft, > .alignright { @include media(mobile) { max-width: 50%; } @include media(mobile-only) { margin-left: 0; margin-right: 0; } } } } assets/sass/05-blocks/image/_editor.scss000064400000001061152377522560014136 0ustar00/* Center image block by default in the editor */ .wp-block-image, .wp-block-image > div:not(.components-placeholder) { text-align: center; } [data-type="core/image"] .block-editor-block-list__block-edit figure.is-resized { margin: 0 auto; } /* Block Styles */ .wp-block-image.is-style-twentytwentyone-border img, .wp-block-image.is-style-twentytwentyone-image-frame img { border: calc(3 * var(--separator--height)) solid var(--global--color-border); } .wp-block-image.is-style-twentytwentyone-image-frame img { padding: var(--global--spacing-unit); } assets/sass/05-blocks/blocks.scss000064400000002212152377522560012703 0ustar00// Blocks // - These styles replace key Gutenberg Block styles with font, color, and // spacing with CSS-variables overrides // - In the future the Block styles may get compiled to individual .css // files and conditionally loaded @import "audio/style"; @import "button/style"; @import "code/style"; @import "columns/style"; @import "cover/style"; @import "file/style"; @import "gallery/style"; @import "group/style"; @import "heading/style"; @import "image/style"; @import "latest-comments/style"; @import "latest-posts/style"; @import "legacy/style"; // "Blocks" from the legacy WP editor, ie: galleries, .button class, etc. @import "list/style"; @import "media-text/style"; @import "navigation/style"; @import "paragraph/style"; @import "preformatted/style"; @import "pullquote/style"; @import "query-loop/style"; @import "quote/style"; @import "rss/style"; @import "search/style"; @import "separator/style"; @import "social-icons/style"; @import "spacer/style"; @import "table/style"; @import "tag-clould/style"; @import "verse/style"; @import "video/style"; @import "utilities/font-sizes"; @import "utilities/style"; // Import LAST to cascade properly assets/sass/05-blocks/utilities/_style.scss000064400000006035152377522560014747 0ustar00/* Block Alignments */ /** * These selectors set the default max width for content appearing inside a post or page. */ .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce), *[class*="inner-container"] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) { @extend %responsive-aligndefault-width; } /** * .alignleft */ .alignleft { /*rtl:ignore*/ text-align: left; margin-top: 0; } // Targeting the .entry-content class is necessary to ensure these styles // only apply when the block isn't nested. .entry-content > .alignleft { max-width: var(--responsive--aligndefault-width); @extend %responsive-alignleft; } @include media(mobile) { .alignleft { /*rtl:ignore*/ float: left; /*rtl:ignore*/ margin-right: var(--global--spacing-horizontal); margin-bottom: var(--global--spacing-vertical); } .entry-content > .alignleft { max-width: calc(50% - var(--responsive--alignleft-margin)); } } /** * .aligncenter */ .aligncenter { clear: both; display: block; float: none; margin-right: auto; margin-left: auto; text-align: center; } /** * .alignright */ .alignright { margin-top: 0; margin-bottom: var(--global--spacing-vertical); } // Targeting the .entry-content class is necessary to ensure these styles // only apply when the block isn't nested. .entry-content > .alignright { max-width: var(--responsive--aligndefault-width); @extend %responsive-alignright; } @include media(mobile) { .alignright { /*rtl:ignore*/ float: right; /*rtl:ignore*/ margin-left: var(--global--spacing-horizontal); } .entry-content > .alignright { max-width: calc(50% - var(--responsive--alignright-margin)); } } // Make sure siblings of floated elements are top-aligned when nested [class*="inner-container"] > .alignleft + *, [class*="inner-container"] > .alignright + * { margin-top: 0; } /** * .alignwide */ .alignwide { clear: both; @extend %responsive-alignwide-width; } .alignwide [class*="inner-container"] > .alignwide { @extend %responsive-alignwide-width-nested; } /** * .alignfull */ .alignfull { clear: both; @extend %responsive-alignfull-width-mobile; @extend %responsive-alignfull-width; } .alignfull [class*="inner-container"] > .alignwide { @extend %responsive-alignwide-width-nested; } // Content alignment .has-left-content { justify-content: flex-start; } .has-right-content { justify-content: flex-end; } // Parallax .has-parallax { background-attachment: fixed; } // Drop caps .has-drop-cap:not(:focus)::first-letter { font-family: var(--heading--font-family); font-weight: var(--heading--font-weight); line-height: 0.66; text-transform: uppercase; font-style: normal; float: left; margin: 0.1em 0.1em 0 0; font-size: calc(1.2 * var(--heading--font-size-h1)); } .has-drop-cap:not(:focus)::after { content: ""; display: table; clear: both; padding-top: 14px; } .desktop-only { display: none; @include media(mobile) { display: block; } } assets/sass/05-blocks/utilities/_font-sizes.scss000064400000002430152377522560015703 0ustar00// Gutenberg Font-size utility classes :root { .is-extra-small-text, .has-extra-small-font-size { font-size: var(--global--font-size-xs); } .is-small-text, .has-small-font-size { font-size: var(--global--font-size-sm); } .is-regular-text, .has-regular-font-size, .is-normal-font-size, .has-normal-font-size, .has-medium-font-size { font-size: var(--global--font-size-base); } .is-large-text, .has-large-font-size { font-size: var(--global--font-size-lg); line-height: var(--global--line-height-heading); } .is-larger-text, .has-larger-font-size, .is-extra-large-text, .has-extra-large-font-size { font-size: var(--global--font-size-xl); line-height: var(--global--line-height-heading); } .is-huge-text, .has-huge-font-size { font-size: var(--global--font-size-xxl); line-height: var(--global--line-height-heading); // This size is meant to mimic the page titles, so the font weight is reduced to match. font-weight: var(--heading--font-weight-page-title); } .is-gigantic-text, .has-gigantic-font-size { font-size: var(--global--font-size-xxxl); line-height: var(--global--line-height-heading); // This size is meant to mimic the page titles, so the font weight is reduced to match. font-weight: var(--heading--font-weight-page-title); } } assets/sass/05-blocks/utilities/_editor.scss000064400000006243152377522560015076 0ustar00/** * Editor Post Title * - Needs a special styles */ // Post title style .wp-block.editor-post-title__block { border-bottom: 3px solid var(--global--color-border); padding-bottom: calc(2 * var(--global--spacing-vertical)); margin-bottom: calc(3 * var(--global--spacing-vertical)); max-width: var(--responsive--alignwide-width); .editor-post-title__input { color: var(--global--color-secondary); font-family: var(--heading--font-family); font-size: var(--global--font-size-page-title); font-weight: var(--heading--font-weight-page-title); line-height: var(--heading--line-height-h1); } } // Editor UI font styles .wp-block.block-editor-default-block-appender > textarea { font-family: var(--global--font-secondary); font-size: var(--global--font-size-md); } // Gutenberg text color options .has-primary-color[class] { color: var(--global--color-primary); } .has-secondary-color[class] { color: var(--global--color-secondary); } // Gutenberg background-color options .has-background { a, p, h1, h2, h3, h4, h5, h6 { color: currentColor; } } .has-primary-background-color[class] { background-color: var(--global--color-primary); color: var(--global--color-background); } .has-secondary-background-color[class] { background-color: var(--global--color-secondary); color: var(--global--color-background); } .has-white-background-color[class] { background-color: var(--global--color-white); color: var(--global--color-secondary); } .has-black-background-color[class] { background-color: var(--global--color-black); color: var(--global--color-primary); } // Spacing Overrides [data-block] { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } // Block Alignments .wp-block { // Gutenberg injects a rule that limits the max width of .wp-block to 580px // This line overrides it to use the responsive spacing rules for default width content max-width: var(--responsive--aligndefault-width); // Use the theme's max-width for wide alignment. &[data-align="wide"], &.alignwide { max-width: var(--responsive--alignwide-width); } &[data-align="full"], &.alignfull { max-width: none; } } .alignleft { margin: 0; margin-right: var(--global--spacing-horizontal); } .alignright { margin: 0; margin-left: var(--global--spacing-horizontal); } // Drop cap .has-drop-cap:not(:focus)::first-letter { font-family: var(--heading--font-family); font-weight: var(--heading--font-weight); line-height: 0.66; text-transform: uppercase; font-style: normal; float: left; margin: 0.1em 0.1em 0 0; font-size: calc(1.2 * var(--heading--font-size-h1)); } @media only screen and (min-width: 482px) { .wp-block[data-align="left"] > * { max-width: 290px; margin-right: var(--global--spacing-horizontal); } .wp-block[data-align="right"] > * { max-width: 290px; margin-left: var(--global--spacing-horizontal); } } // Remove the border of blockquotes inside the classic block. .wp-block-freeform.block-library-rich-text__tinymce blockquote { border: none; } // Adjust the position of the quote symbol for blockquotes inside the classic block. .wp-block-freeform.block-library-rich-text__tinymce blockquote:before { left: 5px; } assets/sass/05-blocks/legacy/_style.scss000064400000001240152377522560014171 0ustar00.gallery-item { display: inline-block; text-align: center; vertical-align: top; width: 100%; a { display: block; } a:focus img { outline-offset: -2px; } .gallery-columns-2 & { max-width: 50%; } .gallery-columns-3 & { max-width: 33.33%; } .gallery-columns-4 & { max-width: 25%; } .gallery-columns-5 & { max-width: 20%; } .gallery-columns-6 & { max-width: 16.66%; } .gallery-columns-7 & { max-width: 14.28%; } .gallery-columns-8 & { max-width: 12.5%; } .gallery-columns-9 & { max-width: 11.11%; } } .gallery-caption { display: block; } // Legacy images, linked figure.wp-caption a:focus img { outline-offset: 2px; } assets/sass/05-blocks/legacy/_editor.scss000064400000001010152377522560014312 0ustar00.gallery-item { display: inline-block; text-align: center; vertical-align: top; width: 100%; .gallery-columns-2 & { max-width: 50%; } .gallery-columns-3 & { max-width: 33.33%; } .gallery-columns-4 & { max-width: 25%; } .gallery-columns-5 & { max-width: 20%; } .gallery-columns-6 & { max-width: 16.66%; } .gallery-columns-7 & { max-width: 14.28%; } .gallery-columns-8 & { max-width: 12.5%; } .gallery-columns-9 & { max-width: 11.11%; } } .gallery-caption { display: block; } assets/sass/05-blocks/query-loop/_style.scss000064400000000263152377522560015045 0ustar00.wp-block-query { &.has-background { padding: calc(0.666 * var(--global--spacing-vertical)); @include media(mobile) { padding: var(--global--spacing-vertical); } } } assets/sass/05-blocks/query-loop/_editor.scss000064400000000263152377522560015173 0ustar00.wp-block-query { &.has-background { padding: calc(0.666 * var(--global--spacing-vertical)); @include media(mobile) { padding: var(--global--spacing-vertical); } } } assets/sass/05-blocks/audio/_style.scss000064400000000161152377522560014027 0ustar00.wp-block-audio { audio:focus { outline-offset: 5px; outline: 2px solid var(--global--color-primary); } } assets/sass/05-blocks/latest-posts/_style.scss000064400000011312152377522560015370 0ustar00.wp-block-latest-posts { padding-left: 0; // Vertical margins logic &:not(.is-grid) > li { margin-top: calc(1.666 * var(--global--spacing-vertical)); margin-bottom: calc(1.666 * var(--global--spacing-vertical)); &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } .widget-area &:not(.is-grid) > li { margin-top: 0; margin-bottom: 0; } &.is-grid { word-wrap: break-word; word-break: break-word; > li { margin-bottom: var(--global--spacing-vertical); &:last-child { margin-bottom: 0; } } // Remove bottom margins in grid columns &.columns-2 > li:nth-last-child(-n + 2):nth-child(2n + 1), &.columns-2 > li:nth-last-child(-n + 2):nth-child(2n + 1) ~ li, &.columns-3 > li:nth-last-child(-n + 3):nth-child(3n + 1), &.columns-3 > li:nth-last-child(-n + 3):nth-child(3n + 1) ~ li, &.columns-4 > li:nth-last-child(-n + 4):nth-child(4n + 1), &.columns-4 > li:nth-last-child(-n + 4):nth-child(4n + 1) ~ li, &.columns-5 > li:nth-last-child(-n + 5):nth-child(5n + 1), &.columns-5 > li:nth-last-child(-n + 5):nth-child(5n + 1) ~ li, &.columns-6 > li:nth-last-child(-n + 6):nth-child(6n + 1), &.columns-6 > li:nth-last-child(-n + 6):nth-child(6n + 1) ~ li { margin-bottom: 0; } } > li > * { margin-top: calc(0.333 * var(--global--spacing-vertical)); margin-bottom: calc(0.333 * var(--global--spacing-vertical)); &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } // Post title > li > a { display: inline-block; font-family: var(--latest-posts--title-font-family); font-size: var(--latest-posts--title-font-size); font-weight: var(--heading--font-weight); line-height: var(--global--line-height-heading); margin-bottom: calc(0.333 * var(--global--spacing-vertical)); } .widget-area & > li > a { font-size: var(--global--font-size-sm); margin-bottom: 0; } // Post author .wp-block-latest-posts__post-author { color: var(--global--color-primary); font-size: var(--global--font-size-md); line-height: var(--global--line-height-body); } // Post date .wp-block-latest-posts__post-date { color: var(--global--color-primary); font-size: var(--global--font-size-xs); line-height: var(--global--line-height-body); [class*="inner-container"] &, .has-background & { color: currentColor; } } // Post content .wp-block-latest-posts__post-excerpt, .wp-block-latest-posts__post-full-content { font-family: var(--latest-posts--description-font-family); font-size: var(--latest-posts--description-font-size); line-height: var(--global--line-height-body); margin-top: calc(0.666 * var(--global--spacing-vertical)); } // Utility classes &.alignfull { padding-left: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); .entry-content [class*="inner-container"] &, .entry-content .has-background & { padding-left: 0; padding-right: 0; } } // Block Styles &.is-style-twentytwentyone-latest-posts-dividers { border-top: calc(3 * var(--separator--height)) solid var(--global--color-border); border-bottom: calc(3 * var(--separator--height)) solid var(--global--color-border); &:not(.is-grid) > li, > li { padding-bottom: var(--global--spacing-vertical); border-bottom: var(--separator--height) solid var(--global--color-border); margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); &:last-child { padding-bottom: 0; border-bottom: none; } } &.is-grid { // Border moves up 1px to overlap the li borders in the last row. box-shadow: inset 0 -1px 0 0 var(--global--color-border); border-bottom: calc(2 * var(--separator--height)) solid var(--global--color-border); li { margin: 0; padding-top: var(--global--spacing-vertical); padding-right: var(--global--spacing-horizontal); &:last-child { padding-bottom: var(--global--spacing-vertical); } } // This is using a non-standard media query because it is directly overriding the gutenberg-provided widths. // https://github.com/WordPress/gutenberg/blob/master/packages/block-library/src/latest-posts/style.scss#L28-L34 @media screen and (min-width: 600px) { @for $i from 2 through 6 { &.columns-#{ $i } li { width: calc((100% / #{ $i })); } } } } } &.is-style-twentytwentyone-latest-posts-borders { li { border: calc(3 * var(--separator--height)) solid var(--global--color-border); padding: var(--global--spacing-vertical) var(--global--spacing-horizontal); &:last-child { padding-bottom: var(--global--spacing-vertical); } } &:not(.is-grid) li { margin-top: var(--global--spacing-horizontal); margin-bottom: var(--global--spacing-horizontal); } } } assets/sass/05-blocks/latest-posts/_editor.scss000064400000007216152377522560015526 0ustar00.wp-block-latest-posts { padding-left: 0; // Vertical margins logic &:not(.is-grid) > li { margin-top: calc(1.666 * var(--global--spacing-vertical)); margin-bottom: calc(1.666 * var(--global--spacing-vertical)); &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } &.is-grid { word-wrap: break-word; word-break: break-word; > li { margin-bottom: var(--global--spacing-vertical); &:last-child { margin-bottom: 0; } } } > li > * { margin-top: calc(0.333 * var(--global--spacing-vertical)); margin-bottom: calc(0.333 * var(--global--spacing-vertical)); &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } // Post title > li > a { display: inline-block; font-family: var(--latest-posts--title-font-family); font-size: var(--latest-posts--title-font-size); font-weight: var(--heading--font-weight); line-height: var(--global--line-height-heading); margin-bottom: calc(0.333 * var(--global--spacing-vertical)); } // Post author .wp-block-latest-posts__post-author { color: var(--global--color-primary); font-size: var(--global--font-size-md); line-height: var(--global--line-height-body); } // Post date .wp-block-latest-posts__post-date { color: var(--global--color-primary); font-size: var(--global--font-size-xs); line-height: var(--global--line-height-body); [class*="inner-container"] &, .has-background & { color: currentColor; } } // Post content .wp-block-latest-posts__post-excerpt, .wp-block-latest-posts__post-full-content { font-family: var(--latest-posts--description-font-family); font-size: var(--latest-posts--description-font-size); line-height: var(--global--line-height-body); margin-top: calc(0.666 * var(--global--spacing-vertical)); } // Block Styles &.is-style-twentytwentyone-latest-posts-dividers { border-top: calc(3 * var(--separator--height)) solid var(--global--color-border); border-bottom: calc(3 * var(--separator--height)) solid var(--global--color-border); &:not(.is-grid) > li, > li { padding-bottom: var(--global--spacing-vertical); border-bottom: var(--separator--height) solid var(--global--color-border); margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); &:last-child { padding-bottom: 0; border-bottom: none; } } &.is-grid { // Border moves up 1px to overlap the li borders in the last row. box-shadow: inset 0 -1px 0 0 var(--global--color-border); border-bottom: calc(2 * var(--separator--height)) solid var(--global--color-border); li { margin: 0; padding-top: var(--global--spacing-vertical); padding-right: var(--global--spacing-horizontal); &:last-child { padding-bottom: var(--global--spacing-vertical); } } // This is using a non-standard media query because it is directly overriding the gutenberg-provided widths. // https://github.com/WordPress/gutenberg/blob/master/packages/block-library/src/latest-posts/style.scss#L28-L34 @media screen and (min-width: 600px) { @for $i from 2 through 6 { &.columns-#{ $i } li { width: calc((100% / #{ $i })); } } } } } &.is-style-twentytwentyone-latest-posts-borders { li { border: calc(3 * var(--separator--height)) solid var(--global--color-border); padding: var(--global--spacing-vertical) var(--global--spacing-horizontal); &:last-child { padding-bottom: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } } &:not(.is-grid) li { margin-top: var(--global--spacing-horizontal); margin-bottom: var(--global--spacing-horizontal); } } } assets/sass/05-blocks/media-text/_style.scss000064400000001760152377522560014775 0ustar00.wp-block-media-text { &.alignfull { margin-top: 0; margin-bottom: 0; } a:focus img { outline-offset: -1px; } .wp-block-media-text__content { padding: var(--global--spacing-horizontal); @include media(tablet) { padding: var(--global--spacing-vertical); } > * { margin-top: calc(0.666 * var(--global--spacing-vertical)); margin-bottom: calc(0.666 * var(--global--spacing-vertical)); @include media(mobile) { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } } /** * Block Options */ &.is-stacked-on-mobile .wp-block-media-text__content { @include media(mobile) { padding-top: var(--global--spacing-vertical); padding-bottom: var(--global--spacing-vertical); } } // Block Styles &.is-style-twentytwentyone-border { border: calc(3 * var(--separator--height)) solid var(--global--color-border); } } assets/sass/05-blocks/media-text/_editor.scss000064400000000575152377522560015126 0ustar00.wp-block-media-text { [data-align="full"] & { margin-top: 0; margin-bottom: 0; } @include innerblock-margin-clear(".wp-block-media-text__content"); .wp-block-media-text__content { padding: var(--global--spacing-horizontal); } // Block Styles &.is-style-twentytwentyone-border { border: calc(3 * var(--separator--height)) solid var(--global--color-border); } } assets/sass/05-blocks/spacer/_style.scss000064400000000343152377522560014205 0ustar00.wp-block-spacer { display: block; // Remove vertical margins margin-bottom: 0 !important; margin-top: 0 !important; @include media(mobile-only) { &[style] { height: var(--global--spacing-unit) !important; } } } assets/sass/05-blocks/group/_style.scss000064400000003406152377522560014067 0ustar00.wp-block-group { // Start IE clearfix. // This hack is only necessary because we want to support IE11. // If we don't want to support IE11, then "display: flow-root" would suffice. display: block; clear: both; display: flow-root; // stylelint-disable-line declaration-block-no-duplicate-properties &:before, &:after { content: ""; display: block; clear: both; } // End IE clearfix. .wp-block-group__inner-container { margin-left: auto; margin-right: auto; > * { margin-top: calc(0.666 * var(--global--spacing-vertical)); margin-bottom: calc(0.666 * var(--global--spacing-vertical)); &.alignfull { @extend %responsive-alignfull-width-mobile; } @include media(mobile) { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } } &.has-background { padding: calc(0.666 * var(--global--spacing-vertical)); @include media(mobile) { padding: var(--global--spacing-vertical); } } // Block Styles &.is-style-twentytwentyone-border { border: calc(3 * var(--separator--height)) solid var(--global--color-border); padding: var(--global--spacing-vertical); } // Adjust alignfull items to account for left and right padding. &.has-background, &.is-style-twentytwentyone-border { .wp-block-group__inner-container > .alignfull, .wp-block-group__inner-container > hr.wp-block-separator:not(.is-style-dots):not(.alignwide).alignfull { max-width: calc(var(--responsive--alignfull-width) + (2 * var(--global--spacing-vertical))); width: calc(var(--responsive--alignfull-width) + (2 * var(--global--spacing-vertical))); margin-left: calc(-1 * var(--global--spacing-vertical)); } } } assets/sass/05-blocks/group/_editor.scss000064400000002332152377522560014212 0ustar00.wp-block-group { // Start IE clearfix. // This hack is only necessary because we want to support IE11. // If we don't want to support IE11, then "display: flow-root" would suffice. display: block; clear: both; display: flow-root; // stylelint-disable-line declaration-block-no-duplicate-properties &:before, &:after { content: ""; display: block; clear: both; } // End IE clearfix. &.has-background { padding: var(--global--spacing-vertical); [data-align="full"] & { margin-top: 0; margin-bottom: 0; } } // Block Styles &.is-style-twentytwentyone-border { border: calc(3 * var(--separator--height)) solid var(--global--color-border); padding: var(--global--spacing-vertical); .wp-block-group__inner-container > [data-align="full"] { max-width: calc(var(--responsive--alignfull-width) + (2 * var(--global--spacing-vertical))); width: calc(var(--responsive--alignfull-width) + (2 * var(--global--spacing-vertical))); margin-left: calc(-1 * var(--global--spacing-vertical)); } } @include innerblock-margin-clear(".wp-block-group__inner-container"); } .wp-block-group .wp-block-group.has-background > .block-editor-block-list__layout > [data-align="full"] { margin: 0; width: 100%; } assets/sass/05-blocks/separator/_style.scss000064400000002354152377522560014734 0ustar00hr { border-style: none; border-bottom: var(--separator--height) solid var(--separator--border-color); clear: both; margin-left: auto; margin-right: auto; &.wp-block-separator { border-bottom: var(--separator--height) solid var(--separator--border-color); opacity: 1; &:not(.is-style-dots):not(.alignwide) { max-width: var(--responsive--aligndefault-width); } &:not(.is-style-dots) { &.alignwide { max-width: var(--responsive--alignwide-width); } &.alignfull { max-width: var(--responsive--alignfull-width); } } /** * Block Options */ &.is-style-twentytwentyone-separator-thick { border-bottom-width: calc(3 * var(--separator--height)); } &.is-style-dots { &.has-background, &.has-text-color { background-color: transparent !important; &:before { color: currentColor !important; } } &:before { color: var(--separator--border-color); font-size: var(--global--font-size-xl); letter-spacing: var(--global--font-size-sm); padding-left: var(--global--font-size-sm); } } .has-background &, [class*="background-color"] &, [style*="background-color"] &, .wp-block-cover[style*="background-image"] & { border-color: currentColor; } } } assets/sass/05-blocks/separator/_editor.scss000064400000001660152377522560015061 0ustar00.wp-block-separator, hr { border-bottom: var(--separator--height) solid var(--separator--border-color); clear: both; opacity: 1; &[style*="text-align:right"], &[style*="text-align: right"] { border-right-color: var(--separator--border-color); } &:not(.is-style-dots) { max-width: var(--responsive--aligndefault-width); } [data-align="full"] > &, [data-align="wide"] > & { max-width: inherit; } &.is-style-twentytwentyone-separator-thick { border-bottom-width: calc(3 * var(--separator--height)); } &.is-style-dots { border-bottom: none; &.has-background, &.has-text-color { background-color: transparent !important; &:before { color: currentColor !important; } } &:before { color: var(--separator--border-color); } } .has-background &, [class*="background-color"] &, [style*="background-color"] &, .wp-block-cover[style*="background-image"] & { border-color: currentColor; } } assets/sass/05-blocks/verse/_style.scss000064400000000105152377522560014050 0ustar00.wp-block-verse { font-family: var(--entry-content--font-family); } assets/sass/05-blocks/verse/_editor.scss000064400000000072152377522560014201 0ustar00pre.wp-block-verse { padding: 0; color: currentColor; } assets/sass/05-blocks/social-icons/_style.scss000064400000000461152377522560015314 0ustar00.wp-block-social-links { a:focus { color: var(--global--color-primary); } &.is-style-twentytwentyone-social-icons-color { a { color: var(--global--color-primary); } .wp-social-link, &.has-icon-background-color.has-icon-background-color .wp-social-link { background: none; } } } assets/sass/05-blocks/social-icons/_editor.scss000064400000000466152377522560015447 0ustar00.wp-block-social-links { // Social icons are horizontal, so they don't need vertical spacing. [data-block] { margin-top: 0; margin-bottom: 0; } &.is-style-twentytwentyone-social-icons-color { button { color: var(--global--color-primary); } .wp-social-link { background: none; } } } assets/sass/05-blocks/tag-clould/_style.scss000064400000000206152377522560014761 0ustar00.wp-block-tag-cloud { &.alignfull { padding-left: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); } } assets/sass/05-blocks/tag-clould/_editor.scss000064400000000103152377522560015103 0ustar00.wp-block-tag-cloud { &.aligncenter { text-align: center; } } assets/sass/05-blocks/rss/_style.scss000064400000005277152377522560013552 0ustar00.wp-block-rss { padding-left: 0; > li { list-style: none; } // Vertical margins logic &:not(.is-grid) > li { margin-top: calc(1.666 * var(--global--spacing-vertical)); margin-bottom: calc(1.666 * var(--global--spacing-vertical)); &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } &.is-grid { > li { margin-bottom: var(--global--spacing-vertical); &:last-child { margin-bottom: 0; } } // Remove bottom margins in grid columns &.columns-2 > li:nth-last-child(-n + 2):nth-child(2n + 1), &.columns-2 > li:nth-last-child(-n + 2):nth-child(2n + 1) ~ li, &.columns-3 > li:nth-last-child(-n + 3):nth-child(3n + 1), &.columns-3 > li:nth-last-child(-n + 3):nth-child(3n + 1) ~ li, &.columns-4 > li:nth-last-child(-n + 4):nth-child(4n + 1), &.columns-4 > li:nth-last-child(-n + 4):nth-child(4n + 1) ~ li, &.columns-5 > li:nth-last-child(-n + 5):nth-child(5n + 1), &.columns-5 > li:nth-last-child(-n + 5):nth-child(5n + 1) ~ li, &.columns-6 > li:nth-last-child(-n + 6):nth-child(6n + 1), &.columns-6 > li:nth-last-child(-n + 6):nth-child(6n + 1) ~ li { margin-bottom: 0; } } > li > * { margin-top: calc(0.333 * var(--global--spacing-vertical)); margin-bottom: calc(0.333 * var(--global--spacing-vertical)); &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } // Post title .wp-block-rss__item-title > a { display: inline-block; font-family: var(--latest-posts--title-font-family); font-size: var(--latest-posts--title-font-size); font-weight: var(--heading--font-weight); line-height: var(--global--line-height-heading); margin-bottom: calc(0.333 * var(--global--spacing-vertical)); } // Post author .wp-block-rss__item-author { color: var(--global--color-primary); font-size: var(--global--font-size-md); line-height: var(--global--line-height-body); } // Post date .wp-block-rss__item-publish-date { color: var(--global--color-primary); font-size: var(--global--font-size-xs); line-height: var(--global--line-height-body); [class*="inner-container"] &, .has-background & { color: currentColor; } } // Post content .wp-block-rss__item-excerpt, .wp-block-rss__item-full-content { font-family: var(--latest-posts--description-font-family); font-size: var(--latest-posts--description-font-size); line-height: var(--global--line-height-body); margin-top: calc(0.666 * var(--global--spacing-vertical)); } // Utility classes &.alignfull { padding-left: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); .entry-content [class*="inner-container"] &, .entry-content .has-background & { padding-left: 0; padding-right: 0; } } } assets/sass/05-blocks/rss/_editor.scss000064400000005277152377522560013700 0ustar00.wp-block-rss { padding-left: 0; > li { list-style: none; } // Vertical margins logic &:not(.is-grid) > li { margin-top: calc(1.666 * var(--global--spacing-vertical)); margin-bottom: calc(1.666 * var(--global--spacing-vertical)); &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } &.is-grid { > li { margin-bottom: var(--global--spacing-vertical); &:last-child { margin-bottom: 0; } } // Remove bottom margins in grid columns &.columns-2 > li:nth-last-child(-n + 2):nth-child(2n + 1), &.columns-2 > li:nth-last-child(-n + 2):nth-child(2n + 1) ~ li, &.columns-3 > li:nth-last-child(-n + 3):nth-child(3n + 1), &.columns-3 > li:nth-last-child(-n + 3):nth-child(3n + 1) ~ li, &.columns-4 > li:nth-last-child(-n + 4):nth-child(4n + 1), &.columns-4 > li:nth-last-child(-n + 4):nth-child(4n + 1) ~ li, &.columns-5 > li:nth-last-child(-n + 5):nth-child(5n + 1), &.columns-5 > li:nth-last-child(-n + 5):nth-child(5n + 1) ~ li, &.columns-6 > li:nth-last-child(-n + 6):nth-child(6n + 1), &.columns-6 > li:nth-last-child(-n + 6):nth-child(6n + 1) ~ li { margin-bottom: 0; } } > li > * { margin-top: calc(0.333 * var(--global--spacing-vertical)); margin-bottom: calc(0.333 * var(--global--spacing-vertical)); &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } // Post title .wp-block-rss__item-title > a { display: inline-block; font-family: var(--latest-posts--title-font-family); font-size: var(--latest-posts--title-font-size); font-weight: var(--heading--font-weight); line-height: var(--global--line-height-heading); margin-bottom: calc(0.333 * var(--global--spacing-vertical)); } // Post author .wp-block-rss__item-author { color: var(--global--color-primary); font-size: var(--global--font-size-md); line-height: var(--global--line-height-body); } // Post date .wp-block-rss__item-publish-date { color: var(--global--color-primary); font-size: var(--global--font-size-xs); line-height: var(--global--line-height-body); [class*="inner-container"] &, .has-background & { color: currentColor; } } // Post content .wp-block-rss__item-excerpt, .wp-block-rss__item-full-content { font-family: var(--latest-posts--description-font-family); font-size: var(--latest-posts--description-font-size); line-height: var(--global--line-height-body); margin-top: calc(0.666 * var(--global--spacing-vertical)); } // Utility classes &.alignfull { padding-left: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); .entry-content [class*="inner-container"] &, .entry-content .has-background & { padding-left: 0; padding-right: 0; } } } assets/sass/05-blocks/file/_style.scss000064400000000347152377522560013653 0ustar00.wp-block-file { // Undo Gutenberg hover defaults a.wp-block-file__button:active, a.wp-block-file__button:focus, a.wp-block-file__button:hover { opacity: inherit; } a.wp-block-file__button { display: inline-block; } } assets/sass/05-blocks/file/_editor.scss000064400000000672152377522560014002 0ustar00.wp-block-file { .wp-block-file__textlink { text-decoration: underline; text-decoration-style: solid; text-decoration-thickness: 1px; &:hover { text-decoration: underline; text-decoration-style: dotted; } } .wp-block-file__button { // Extend button style @include button-style(); display: inline-block; // Remove :focus styles in the editor &:focus { outline-offset: inherit; outline: inherit; } } } assets/sass/05-blocks/blocks-editor.scss000064400000002241152377522560014171 0ustar00// Block Styles for the Editor // - These styles replace key Gutenberg Block styles for fonts, colors, and // spacing with CSS-variables overrides in the Block Editor // - In the future the Block styles may get compiled to individual .css // files and conditionally loaded @import "button/editor"; @import "code/editor"; @import "cover/editor"; @import "columns/editor"; @import "file/editor"; @import "gallery/editor"; @import "group/editor"; @import "heading/editor"; @import "html/editor"; @import "image/editor"; @import "latest-comments/editor"; @import "latest-posts/editor"; @import "legacy/editor"; // "Blocks" from the legacy WP editor, ie: galleries, .button class, etc. @import "list/editor"; @import "media-text/editor"; @import "navigation/editor"; @import "paragraph/editor"; @import "preformatted/editor"; @import "pullquote/editor"; @import "query-loop/editor"; @import "quote/editor"; @import "rss/editor"; @import "search/editor"; @import "separator/editor"; @import "social-icons/editor"; @import "table/editor"; @import "tag-clould/editor"; @import "verse/editor"; @import "utilities/font-sizes"; @import "utilities/editor"; // Import LAST to cascade properly assets/sass/05-blocks/cover/_style.scss000064400000005231152377522560014047 0ustar00.wp-block-cover, .wp-block-cover-image { &:not(.alignwide):not(.alignfull) { clear: both; } &.alignfull { margin-top: 0; margin-bottom: 0; } background-color: var(--cover--color-background); min-height: var(--cover--height); margin-top: inherit; margin-bottom: inherit; .wp-block-cover__inner-container, .wp-block-cover-image-text, .wp-block-cover-text { color: currentColor; // Uses text color specified with background-color options in 07-utilities\color-palette.scss margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); a:not(.wp-block-button__link):not(.wp-block-file__button) { color: currentColor; } .has-link-color a { color: var(--wp--style--color--link, var(--global--color-primary)); } } /* default & custom background-color */ &:not([class*="background-color"]) { .wp-block-cover__inner-container, .wp-block-cover-image-text, .wp-block-cover-text { color: var(--cover--color-foreground); } } /* Treating H2 separately to account for legacy /core styles */ h2 { font-size: var(--heading--font-size-h2); letter-spacing: var(--heading--letter-spacing-h2); line-height: var(--heading--line-height-h2); max-width: inherit; // undo opinionated styles text-align: inherit; // undo opinionated styles padding: 0; &.has-text-align-left { text-align: left; } &.has-text-align-center { text-align: center; } &.has-text-align-right { text-align: right; } } .wp-block-cover__inner-container { width: calc(100% - calc(2 * var(--global--spacing-vertical))); > * { margin-top: calc(0.666 * var(--global--spacing-vertical)); margin-bottom: calc(0.666 * var(--global--spacing-vertical)); @include media(mobile) { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } } &.alignleft, &.alignright { margin-top: 0; > * { margin-top: calc(2 * var(--global--spacing-vertical)); margin-bottom: calc(2 * var(--global--spacing-vertical)); padding-left: var(--global--spacing-horizontal); padding-right: var(--global--spacing-horizontal); width: 100%; } } &.has-left-content, &.has-right-content { justify-content: center; } /* Block Styles */ &.is-style-twentytwentyone-border { border: calc(3 * var(--separator--height)) solid var(--global--color-border); } /* The background color class is used just for the overlay, and does not need to be applied to the inner container. */ &[class*="-background-color"][class] .wp-block-cover__inner-container { background-color: unset; } } assets/sass/05-blocks/cover/_editor.scss000064400000003434152377522560014200 0ustar00.wp-block-cover, .wp-block-cover-image { &:not(.alignwide):not(.alignfull) { clear: both; } background-color: var(--cover--color-background); min-height: var(--cover--height); margin-top: inherit; margin-bottom: inherit; [data-align="full"] & { margin-top: 0; margin-bottom: 0; } @include innerblock-margin-clear(".wp-block-cover__inner-container"); .wp-block-cover__inner-container, .wp-block-cover-image-text, .wp-block-cover-text, .block-editor-block-list__block { color: currentColor; // uses text color specified with background-color options in /blocks/utilities/_style.scss a { color: currentColor; } .has-link-color a { color: var(--wp--style--color--link, var(--global--color-primary)); } } // Default & custom background-color &:not([class*="background-color"]) { .wp-block-cover__inner-container, .wp-block-cover-image-text, .wp-block-cover-text, .block-editor-block-list__block { color: var(--cover--color-foreground); } } // Treating H2 separately to account for legacy /core styles h2 { font-size: var(--heading--font-size-h2); letter-spacing: var(--heading--letter-spacing-h2); line-height: var(--heading--line-height-h2); padding: 0; max-width: inherit; // undo opinionated styles text-align: inherit; &.has-text-align-left { text-align: left; } &.has-text-align-center { text-align: center; } &.has-text-align-right { text-align: right; } } // Block Styles &.is-style-twentytwentyone-border { border: calc(3 * var(--separator--height)) solid var(--global--color-border); } // The background color class is used just for the overlay, and does not need to be applied to the inner container. &[class*="-background-color"][class] .wp-block-cover__inner-container { background-color: unset; } } assets/sass/05-blocks/html/_editor.scss000064400000000337152377522560014025 0ustar00[data-type="core/html"] textarea { // Make sure that the color is not white on white when a dark body background is used. color: var(--global--color-dark-gray); border-radius: 0; padding: var(--global--spacing-unit); } assets/sass/05-blocks/button/_style.scss000064400000005256152377522560014253 0ustar00/** * Button */ .site .button, button, input[type="submit"], input[type="reset"], .wp-block-search .wp-block-search__button, .wp-block-button .wp-block-button__link, .wp-block-file a.wp-block-file__button { // Extend button style @include button-style(); } /** * Block Options */ .wp-block-button { // Target the default and filled button states. &:not(.is-style-outline) { .wp-block-button__link:not(:hover):not(:active) { // Text colors &:not(.has-text-color) { color: var(--global--color-background); // Nested .has-background & { color: var(--local--color-background, var(--global--color-background)); &.has-background { color: var(--global--color-primary); } } } // Background-colors &:not(.has-background) { background-color: var(--global--color-primary); // Nested .has-background & { background-color: var(--local--color-primary, var(--global--color-primary)); } } } // Hover Button color should match parent element foreground color .wp-block-button__link:hover, .wp-block-button__link:active { border-color: currentColor !important; background-color: transparent !important; color: inherit !important; } } // Outline Style. &.is-style-outline { .wp-block-button__link:not(:hover):not(:active) { // Border colors &:not(.has-text-color), &:not(.has-background), &.has-background { border-color: currentColor; } // Text colors &:not(.has-text-color) { color: var(--global--color-primary); // Nested .has-background & { color: var(--local--color-primary, var(--global--color-primary)); } } &.has-background { // Nested .has-background &:not(.has-text-color) { color: inherit; } } // Background-colors &:not(.has-background) { background-color: transparent; } } .wp-block-button__link:hover, .wp-block-button__link:active { border-color: transparent !important; background-color: var(--global--color-primary) !important; color: var(--global--color-background) !important; .has-background & { background-color: var(--local--color-primary, var(--global--color-primary)) !important; color: var(--local--color-background, var(--global--color-background)) !important; } .has-text-color & { color: var(--local--color-background, var(--global--color-background)) !important; } } } // Squared Style .is-style-squared .wp-block-button__link { border-radius: 0; } } .is-style-outline .wp-block-button__link[style*="radius"]:focus, .wp-block-button a.wp-block-button__link[style*="radius"]:focus { outline-offset: 2px; outline: 2px dotted var(--button--color-background); } assets/sass/05-blocks/button/_editor.scss000064400000005305152377522560014374 0ustar00.wp-block-button__link { // Extend button style @include button-style(); } /** * Block Options */ .wp-block-button { // Target the default and filled button states. &:not(.is-style-outline) { .wp-block-button__link:not(:hover):not(:active) { // Text colors &:not(.has-text-color) { color: var(--global--color-background); // Nested .has-background & { color: var(--local--color-background, var(--global--color-background)); &.has-background { color: var(--global--color-primary); } } } // Background-colors &:not(.has-background) { background-color: var(--global--color-primary); // Nested .has-background & { background-color: var(--local--color-primary, var(--global--color-primary)); } } } // Hover Button color should match parent element foreground color .wp-block-button__link:hover, .wp-block-button__link:active { border-color: currentColor !important; background-color: transparent !important; color: inherit !important; } // Remove :focus styles in the editor .wp-block-button__link:focus { outline-offset: inherit; outline: inherit; } } // Outline Style. &.is-style-outline { .wp-block-button__link:not(:hover):not(:active) { // Border colors &:not(.has-text-color), &:not(.has-background), &.has-background { border-color: currentColor; } // Text colors &:not(.has-text-color) { color: var(--global--color-primary); // Nested .has-background & { color: var(--local--color-primary, var(--global--color-primary)); } } &.has-background { // Nested .has-background &:not(.has-text-color) { color: inherit; } } // Background-colors &:not(.has-background) { background-color: transparent; } } // Hover Button color should match default button style .wp-block-button__link:hover, .wp-block-button__link:active { background-color: var(--global--color-primary) !important; border-color: transparent !important; color: var(--global--color-background) !important; .has-background & { background-color: var(--local--color-primary, var(--global--color-primary)) !important; color: var(--local--color-background, var(--global--color-background)) !important; } .has-text-color & { color: var(--local--color-background, var(--global--color-background)) !important; } } // Remove :focus styles in the editor .wp-block-button__link:focus { outline-offset: inherit; outline: inherit; } } // Squared Style &.is-style-squared { border-radius: 0; } } .is-style-outline .wp-block-button__link[style*="radius"], .wp-block-button__link[style*="radius"] { outline-offset: 2px; } assets/sass/05-blocks/latest-comments/_style.scss000064400000001377152377522560016057 0ustar00.wp-block-latest-comments { padding-left: 0; .wp-block-latest-comments__comment { font-size: var(--global--font-size-sm); line-height: var(--global--line-height-body); /* Vertical margins logic */ margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } .wp-block-latest-comments__comment-meta { font-family: var(--heading--font-family); } .wp-block-latest-comments__comment-date { color: var(--global--color-primary); font-size: var(--global--font-size-sm); } .wp-block-latest-comments__comment-excerpt p { font-size: var(--global--font-size-sm); line-height: var(--global--line-height-body); margin: 0; } } assets/sass/05-blocks/latest-comments/_editor.scss000064400000000060152377522560016171 0ustar00.wp-block-latest-comments { padding-left: 0; } assets/sass/05-blocks/heading/_style.scss000064400000002412152377522560014326 0ustar00h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { clear: both; font-family: var(--heading--font-family); font-weight: var(--heading--font-weight); strong { font-weight: var(--heading--font-weight-strong); } } h1, .h1 { font-size: var(--heading--font-size-h1); letter-spacing: var(--heading--letter-spacing-h1); line-height: var(--heading--line-height-h1); } h2, .h2 { font-size: var(--heading--font-size-h2); letter-spacing: var(--heading--letter-spacing-h2); line-height: var(--heading--line-height-h2); } h3, .h3 { font-size: var(--heading--font-size-h3); letter-spacing: var(--heading--letter-spacing-h3); line-height: var(--heading--line-height-h3); } h4, .h4 { font-size: var(--heading--font-size-h4); font-weight: var(--heading--font-weight-strong); letter-spacing: var(--heading--letter-spacing-h4); line-height: var(--heading--line-height-h4); } h5, .h5 { font-size: var(--heading--font-size-h5); font-weight: var(--heading--font-weight-strong); letter-spacing: var(--heading--letter-spacing-h5); line-height: var(--heading--line-height-h5); } h6, .h6 { font-size: var(--heading--font-size-h6); font-weight: var(--heading--font-weight-strong); letter-spacing: var(--heading--letter-spacing-h6); line-height: var(--heading--line-height-h6); } assets/sass/05-blocks/heading/_editor.scss000064400000003227152377522560014461 0ustar00.wp-block-heading h1, h1, .h1, .wp-block-heading h2, h2, .h2, .wp-block-heading h3, h3, .h3, .wp-block-heading h4, h4, .h4, .wp-block-heading h5, h5, .h5, .wp-block-heading h6, h6, .h6 { clear: both; font-family: var(--heading--font-family); font-weight: var(--heading--font-weight); strong { font-weight: var(--heading--font-weight-strong); } &[style*="--wp--typography--line-height"] { line-height: var(--wp--typography--line-height, var(--global--line-height-body)); } } .wp-block-heading h1, h1, .h1 { font-size: var(--heading--font-size-h1); letter-spacing: var(--heading--letter-spacing-h1); line-height: var(--heading--line-height-h1); } .wp-block-heading h2, h2, .h2 { font-size: var(--heading--font-size-h2); letter-spacing: var(--heading--letter-spacing-h2); line-height: var(--heading--line-height-h2); } .wp-block-heading h3, h3, .h3 { font-size: var(--heading--font-size-h3); letter-spacing: var(--heading--letter-spacing-h3); line-height: var(--heading--line-height-h3); } .wp-block-heading h4, h4, .h4 { font-size: var(--heading--font-size-h4); font-weight: var(--heading--font-weight-strong); letter-spacing: var(--heading--letter-spacing-h4); line-height: var(--heading--line-height-h4); } .wp-block-heading h5, h5, .h5 { font-size: var(--heading--font-size-h5); font-weight: var(--heading--font-weight-strong); letter-spacing: var(--heading--letter-spacing-h5); line-height: var(--heading--line-height-h5); } .wp-block-heading h6, h6, .h6 { font-size: var(--heading--font-size-h6); font-weight: var(--heading--font-weight-strong); letter-spacing: var(--heading--letter-spacing-h6); line-height: var(--heading--line-height-h6); } assets/sass/05-blocks/gallery/_style.scss000064400000001264152377522560014372 0ustar00.wp-block-gallery { margin: 0 auto; .blocks-gallery-image, .blocks-gallery-item { // On mobile and responsive viewports, we allow only 1 or 2 columns at the most. width: calc((100% - var(--global--spacing-unit)) / 2); figcaption { margin: 0; // Text color is always white to account for default gradient background color: var(--global--color-white); font-size: var(--global--font-size-xs); a { color: var(--global--color-white); &:focus { background-color: transparent; outline: 2px solid var(--wp--style--color--link, var(--global--color-primary)); text-decoration: none; } } } a:focus img { outline-offset: 2px; } } } assets/sass/05-blocks/gallery/_editor.scss000064400000000155152377522560014516 0ustar00.wp-block-gallery { figcaption { margin-bottom: 0; a { color: var(--global--color-white); } } } assets/sass/05-blocks/search/_style.scss000064400000005341152377522560014200 0ustar00.wp-block-search { max-width: var(--responsive--aligndefault-width); &__button-only.aligncenter { .wp-block-search__inside-wrapper { justify-content: center; } } .wp-block-search__label { font-size: var(--form--font-size); font-weight: var(--form--label-weight); margin-bottom: calc(var(--global--spacing-vertical) / 3); } .wp-block-search__input { border: var(--form--border-width) solid var(--form--border-color); border-radius: var(--form--border-radius); color: var(--form--color-text); line-height: var(--form--line-height); max-width: inherit; margin-right: calc(-1 * var(--button--border-width)); padding: var(--form--spacing-unit); &:focus { color: var(--form--color-text); border-color: var(--form--border-color); } .has-background & { border-color: var(--local--color-primary, var(--global--color-primary)) !important; } } button.wp-block-search__button { margin-left: 0; line-height: 1; &.has-icon { padding: 6px calc(0.5 * var(--button--padding-horizontal)); svg { width: 40px; height: 40px; fill: currentColor; } } &:hover, &:active { .has-background & { background-color: var(--local--color-background, var(--global--color-background)) !important; color: var(--local--color-primary, var(--global--color-primary)) !important; } .has-text-color & { color: var(--local--color-primary, var(--global--color-primary)) !important; } } } &.wp-block-search__button-inside { .wp-block-search__inside-wrapper { background-color: var(--global--color-white); border: var(--form--border-width) solid var(--form--border-color); border-radius: var(--form--border-radius); padding: var(--form--border-width); .has-background & { border-color: var(--local--color-primary, var(--global--color-primary)) !important; } .wp-block-search__input { margin-left: 0; margin-right: 0; padding-left: var(--form--spacing-unit); // Add outline for focus styles to override default &:focus { color: var(--form--color-text); outline-offset: -2px; outline: 2px dotted var(--form--border-color); } } button.wp-block-search__button { padding: var(--button--padding-vertical) var(--button--padding-horizontal); // Search button always needs black contrast against white form background &:hover { color: var(--global--color-dark-gray); } .is-dark-theme & { color: var(--global--color-dark-gray); &:hover { background-color: var(--global--color-dark-gray); color: var(--global--color-white); } } &.has-icon { padding: 6px calc(0.5 * var(--button--padding-horizontal)); } } } } } .wp-block-search__button { box-shadow: none; } assets/sass/05-blocks/search/_editor.scss000064400000005101152377522560014320 0ustar00.wp-block-search { max-width: var(--responsive--aligndefault-width); .wp-block-search__label { font-size: var(--form--font-size); font-weight: var(--form--label-weight); margin-bottom: calc(var(--global--spacing-vertical) / 3); } &.wp-block-search__button-inside .wp-block-search__inside-wrapper, .wp-block-search__input { border: var(--form--border-width) solid var(--form--border-color); border-radius: var(--form--border-radius); font-family: var(--form--font-family); font-size: var(--form--font-size); line-height: var(--form--line-height); max-width: inherit; margin-right: calc(-1 * var(--button--border-width)); padding: var(--form--spacing-unit); .is-dark-theme & { background: var(--global--color-white-90); } .has-background & { border-color: var(--local--color-primary, var(--global--color-primary)) !important; } } .wp-block-search__button.wp-block-search__button { @include button-style(); box-shadow: none; margin-left: 0; &.has-icon { padding: 6px calc(0.5 * var(--button--padding-horizontal)); display: inherit; svg { width: 40px; height: 40px; } } &:hover, &:active { .has-background & { background-color: var(--local--color-background, var(--global--color-background)) !important; color: var(--local--color-primary, var(--global--color-primary)) !important; } .has-text-color & { color: var(--local--color-primary, var(--global--color-primary)) !important; } } // Remove :focus styles in the editor &:focus { outline-offset: inherit; outline: inherit; } } &.wp-block-search__button-inside { .wp-block-search__inside-wrapper { padding: var(--form--border-width); } .wp-block-search__input { border: none; } &.wp-block-search__text-button, &.wp-block-search__icon-button { .wp-block-search__button { // Search button always needs black contrast against white form background &:hover { color: var(--global--color-dark-gray); } .is-dark-theme & { color: var(--global--color-dark-gray); &:hover { background-color: var(--global--color-dark-gray); color: var(--global--color-white); } } } } &.wp-block-search__text-button .wp-block-search__button { // Match the text button size with the icon button. padding: var(--button--padding-vertical) var(--button--padding-horizontal); } } } .wp-block[data-align="center"] > * { text-align: center; } .wp-block[data-align="center"] { .wp-block-search__button-only { .wp-block-search__inside-wrapper { justify-content: center; } } } assets/sass/05-blocks/_config.scss000064400000000257152377522560013041 0ustar00// Variable Configuration // - Import all config files for display in // the editor, customizer, and front end. @import "separator/config"; @import "utilities/config"; assets/sass/05-blocks/columns/_style.scss000064400000003762152377522560014420 0ustar00.wp-block-columns { &:not(.alignwide):not(.alignfull) { clear: both; } .wp-block-column { > * { margin-top: calc(0.66 * var(--global--spacing-vertical)); margin-bottom: calc(0.66 * var(--global--spacing-vertical)); @include media(mobile) { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } &:last-child { margin-bottom: 0; } } .wp-block-column:not(:last-child) { margin-bottom: calc(0.66 * var(--global--spacing-vertical)); @include media(mobile) { margin-bottom: var(--global--spacing-vertical); } @include media(desktop) { margin-bottom: 0; } } &.is-style-twentytwentyone-columns-overlap { justify-content: space-around; @include media(laptop) { .wp-block-column { &:nth-child(2n) { margin-left: calc(-2 * var(--global--spacing-horizontal)); margin-top: calc(2.5 * var(--global--spacing-horizontal)); z-index: 2; // Provide text-based child blocks with a default background color to ensure they're readable. > p, > h1, > h2, > h3, > h4, > h5, > h6, > ul, > ol, > pre { &:not(.has-background) { background-color: var(--global--color-background); padding: var(--global--spacing-unit); } } // Lists should still have their usual left padding. > ul:not(.has-background), > ol:not(.has-background) { padding-left: calc(2 * var(--global--spacing-horizontal)); } &.is-vertically-aligned-center { margin-top: 0; } } } } } &.alignfull { .wp-block-column { p:not(.has-background), h1:not(.has-background), h2:not(.has-background), h3:not(.has-background), h4:not(.has-background), h5:not(.has-background), h6:not(.has-background) { padding-left: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); } } } } assets/sass/05-blocks/columns/_editor.scss000064400000002700152377522560014535 0ustar00.wp-block-columns { &:not(.alignwide):not(.alignfull) { clear: both; } .wp-block, .wp-block-column { // Allow Gutenberg to set the width of a block that lives inside the columns block. max-width: inherit; } @include innerblock-margin-clear(".wp-block-column"); &.is-style-twentytwentyone-columns-overlap { @include media(laptop) { .wp-block-column:nth-child(2n) { margin-left: calc(-2 * var(--global--spacing-horizontal)); margin-top: calc(2.5 * var(--global--spacing-horizontal)); z-index: 2; // Provide text-based child blocks with a default background color to ensure they're readable. > p, > h1, > h2, > h3, > h4, > h5, > h6, > ul, > ol, > pre { &:not(.has-background) { background-color: var(--global--color-background); padding: var(--global--spacing-unit); } } // Lists should still have their usual left padding. > ul:not(.has-background), > ol:not(.has-background) { padding-left: calc(2 * var(--global--spacing-horizontal)); } &.is-vertically-aligned-center { margin-top: 0; } } } } .wp-block[data-align="full"] > & { p:not(.has-background), h1:not(.has-background), h2:not(.has-background), h3:not(.has-background), h4:not(.has-background), h5:not(.has-background), h6:not(.has-background) { padding-left: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); } } } assets/sass/05-blocks/pullquote/_style.scss000064400000004121152377522560014760 0ustar00.wp-block-pullquote { padding: calc(2 * var(--global--spacing-unit)) 0; text-align: center; border-width: var(--pullquote--border-width); border-bottom-style: solid; border-top-style: solid; color: currentColor; border-color: currentColor; position: relative; blockquote::before { color: currentColor; content: "\201C"; display: block; position: relative; // Override the absolute position. left: 0; font-size: 3rem; font-weight: 500; line-height: 1; } p { font-family: var(--pullquote--font-family); font-size: var(--pullquote--font-size); font-style: var(--pullquote--font-style); font-weight: 700; letter-spacing: var(--pullquote--letter-spacing); line-height: var(--pullquote--line-height); margin: 0; } a { color: currentColor; } .wp-block-pullquote__citation, cite, footer { color: currentColor; display: block; font-size: var(--global--font-size-xs); font-style: var(--pullquote--font-style); text-transform: none; } /** * Block Options */ &:not(.is-style-solid-color) { background: none; } &.alignleft:not(.is-style-solid-color) { blockquote:before, cite { text-align: center; } } &.alignwide > p, &.alignwide blockquote { max-width: var(--responsive--alignwide-width); } &.alignfull:not(.is-style-solid-color) > p, &.alignfull:not(.is-style-solid-color) blockquote { padding: 0 calc(2 * var(--global--spacing-unit)); } &.is-style-solid-color { color: var(--pullquote--color-foreground); padding: calc(2.5 * var(--global--spacing-unit)); border-width: var(--pullquote--border-width); border-style: solid; border-color: var(--pullquote--border-color); @media (min-width: 600px) { padding: calc(5 * var(--global--spacing-unit)); } blockquote::before { text-align: left; } blockquote { margin: 0; max-width: inherit; p { font-size: var(--pullquote--font-size); } } .wp-block-pullquote__citation, cite, footer { color: currentColor; } &.alignleft, &.alignright { padding: var(--global--spacing-unit); blockquote { max-width: initial; } } } } assets/sass/05-blocks/pullquote/_editor.scss000064400000004046152377522560015114 0ustar00.wp-block-pullquote { padding: calc(2 * var(--global--spacing-unit)) 0; text-align: center; border-width: var(--pullquote--border-width); border-bottom-style: solid; border-top-style: solid; color: currentColor; border-color: currentColor; position: relative; blockquote::before { color: currentColor; content: "\201C"; display: block; position: relative; // Override the absolute position. left: 0; font-size: 3rem; font-weight: 500; line-height: 1; } p { font-family: var(--pullquote--font-family); font-size: var(--pullquote--font-size); font-style: var(--pullquote--font-style); font-weight: 700; letter-spacing: var(--pullquote--letter-spacing); line-height: var(--pullquote--line-height); margin: 0; } a { color: currentColor; } .wp-block-pullquote__citation, cite, footer { font-size: var(--global--font-size-xs); font-style: var(--pullquote--font-style); text-transform: none; } // Block Options &:not(.is-style-solid-color) { background: none; } &.is-style-solid-color { margin-left: auto; margin-right: auto; padding: calc(2.5 * var(--global--spacing-unit)); border-width: var(--pullquote--border-width); border-style: solid; border-color: var(--pullquote--border-color); @media ( min-width: 600px ) { padding: calc(5 * var(--global--spacing-unit)); } blockquote::before { text-align: left; } &.alignleft blockquote, &.alignright blockquote { padding-left: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); max-width: inherit; } blockquote { margin: 0; max-width: 100%; p { font-size: var(--pullquote--font-size); } } .wp-block-pullquote__citation, cite, footer { color: currentColor; } } } .wp-block[data-align="full"] { .wp-block-pullquote:not(.is-style-solid-color) { blockquote { padding: 0 calc(2 * var(--global--spacing-unit)); } } } .wp-block[data-align="left"], .wp-block[data-align="right"] { .wp-block-pullquote.is-style-solid-color { padding: var(--global--spacing-unit); } } assets/sass/05-blocks/navigation/_style.scss000064400000004515152377522560015074 0ustar00.wp-block-navigation { .wp-block-navigation-link { padding: 0; .wp-block-navigation-link__content { padding: var(--primary-nav--padding); } .wp-block-navigation-link__label { font-family: var(--primary-nav--font-family); font-size: var(--primary-nav--font-size); font-weight: var(--primary-nav--font-weight); } } .wp-block-navigation-link__submenu-icon { padding: 0; } // Top level navigation container. > .wp-block-navigation__container { .has-child { .wp-block-navigation-link { display: inherit; } .wp-block-navigation__container { border: none; left: 0; margin-left: var(--primary-nav--padding); min-width: max-content; opacity: 0; padding: 0; position: inherit; top: inherit; .wp-block-navigation-link { .wp-block-navigation-link__content { display: inline-block; padding: calc(0.5 * var(--primary-nav--padding)) var(--primary-nav--padding); } } .wp-block-navigation-link__submenu-icon { display: none; } } &:hover, &:focus-within { .wp-block-navigation__container { display: block; opacity: 1; visibility: visible; } } } > .has-child { > .wp-block-navigation__container { background: var(--global--color-background); margin: 0; padding: 0; position: absolute; top: 100%; border: 1px solid var(--primary-nav--border-color); &:before, &:after { content: ""; display: block; position: absolute; width: 0; top: -10px; left: var(--global--spacing-horizontal); border-style: solid; border-color: var(--primary-nav--border-color) transparent; border-width: 0 7px 10px 7px; } &:after { top: -9px; border-color: var(--global--color-background) transparent; } } } } &:not(.has-background) { .wp-block-navigation__container { background: var(--global--color-background); .wp-block-navigation__container { background: var(--global--color-background); } } } &:not(.has-text-color) { .wp-block-navigation-link { > a { &:hover, &:focus { color: var(--primary-nav--color-link-hover); } &:hover { text-decoration: underline; text-decoration-style: dotted; } } } .wp-block-navigation-link__content { color: currentColor; } } } assets/sass/05-blocks/navigation/_editor.scss000064400000001370152377522560015216 0ustar00.wp-block-navigation { .wp-block-navigation__container { background: var(--global--color-background); padding: 0; } .wp-block-navigation-link { .wp-block-navigation-link__content { padding: var(--primary-nav--padding); } .wp-block-navigation-link__label { font-family: var(--primary-nav--font-family); font-size: var(--primary-nav--font-size); font-weight: var(--primary-nav--font-weight); } } .has-child { .wp-block-navigation__container { box-shadow: var(--global--elevation); } } &:not(.has-text-color) { .wp-block-navigation-link { > a { &:hover, &:focus { color: var(--primary-nav--color-link-hover); } } } .wp-block-navigation-link__content { color: currentColor; } } } assets/sass/05-blocks/table/_style.scss000064400000003042152377522560014016 0ustar00table, .wp-block-table { width: 100%; min-width: 240px; border-collapse: collapse; thead, tfoot { text-align: center; } th { font-family: var(--heading--font-family); } td, th { padding: calc(0.5 * var(--global--spacing-unit)); border: 1px solid; } figcaption { color: var(--global--color-primary); font-size: var(--global--font-size-xs); } &.is-style-regular .has-background, &.is-style-stripes .has-background, &.is-style-stripes .has-background thead tr, &.is-style-stripes .has-background tfoot tr, &.is-style-stripes .has-background tbody tr { color: var(--table--has-background-text-color); } &.is-style-stripes { border-color: var(--table--stripes-border-color); th, td { border-width: 0; } tbody tr:nth-child(odd) { background-color: var(--table--stripes-background-color); } .has-background tbody tr:nth-child(odd) { background-color: var(--global--color-white-90); } } } table.wp-calendar-table { td, th { background: transparent; border: 0; text-align: center; line-height: 2; vertical-align: middle; word-break: normal; } th { font-weight: bold; } thead, tbody { color: currentColor; border: 1px solid; } caption { font-weight: bold; text-align: left; margin-bottom: var(--global--spacing-unit); color: currentColor; } } .wp-calendar-nav { text-align: left; margin-top: calc(var(--global--spacing-unit) / 2); svg { height: 1em; vertical-align: middle; path { fill: currentColor; } } .wp-calendar-nav-next { float: right; } } assets/sass/05-blocks/table/_editor.scss000064400000002527152377522560014153 0ustar00table, .wp-block-table { thead, tfoot { text-align: center; } th { font-family: var(--heading--font-family); } td, th { padding: calc(0.5 * var(--global--spacing-unit)); } &.is-style-regular .has-background, &.is-style-stripes .has-background, &.is-style-stripes .has-background thead tr, &.is-style-stripes .has-background tfoot tr, &.is-style-stripes .has-background tbody tr { color: var(--table--has-background-text-color); } &.is-style-stripes { border-color: var(--table--stripes-border-color); th, td { border-width: 0; } tbody tr:nth-child(odd) { background-color: var(--table--stripes-background-color); } .has-background tbody tr:nth-child(odd) { background-color: var(--global--color-white-90); } } } table.wp-calendar-table { td, th { background: transparent; border: 0; text-align: center; line-height: 2; vertical-align: middle; } th { font-weight: bold; } thead, tbody { color: currentColor; border: 1px solid; } caption { font-weight: bold; text-align: left; margin-bottom: var(--global--spacing-unit); color: currentColor; } } .wp-calendar-nav { text-align: left; margin-top: calc(var(--global--spacing-unit) / 2); svg { height: 1em; vertical-align: middle; path { fill: currentColor; } } .wp-calendar-nav-next { float: right; } } assets/sass/05-blocks/video/_style.scss000064400000000504152377522560014035 0ustar00.wp-block-video { figcaption { color: var(--global--color-primary); font-size: var(--global--font-size-xs); margin-top: calc(0.5 * var(--global--spacing-unit)); margin-bottom: var(--global--spacing-unit); text-align: center; } } * > figure > video { max-width: unset; width: 100%; vertical-align: middle; } assets/sass/02-tools/mixins.scss000064400000004355152377522560012627 0ustar00// Responsive breakpoints mixin @mixin add_variables( $view: frontend ) { @if frontend == $view { :root { @content; } } @if editor == $view { :root, body { @content; } } } // Button style // - Applies button styles to blocks and elements that share them. @mixin button-style() { border: var(--button--border-width) solid transparent; border-radius: var(--button--border-radius); cursor: pointer; font-weight: var(--button--font-weight); font-family: var(--button--font-family); font-size: var(--button--font-size); line-height: var(--button--line-height); padding: var(--button--padding-vertical) var(--button--padding-horizontal); text-decoration: none; // Standard Button Color Relationship Logic &:not(:hover):not(:active) { // Text colors &:not(.has-text-color) { color: var(--global--color-background); // Nested .has-background & { color: var(--local--color-background, var(--global--color-primary)); &.has-background { color: var(--global--color-primary); } } } // Background-colors &:not(.has-background) { background-color: var(--global--color-primary); // Nested .has-background & { background-color: var(--local--color-primary, var(--global--color-primary)); } } } // Hover Button color should match parent element foreground color &:hover, &:active { background-color: transparent; border-color: currentColor; color: inherit; } // Focus Button outline color should always match the current text color &:focus { outline-offset: -6px; outline: 2px dotted currentColor; } // Disabled Button colors &:disabled { background-color: var(--global--color-white-50); border-color: var(--global--color-white-50); color: var(--button--color-text-active); } } @mixin innerblock-margin-clear($container) { // Clear the top margin for the first-child. > #{$container} > *:first-child { margin-top: 0; } // Last child that is not the appender. > #{$container} > *:last-child:not(.block-list-appender) { margin-bottom: 0; } // When selected, the last item becomes the second last because of the appender. &.has-child-selected > #{$container} > *:nth-last-child(2), &.is-selected > #{$container} > *:nth-last-child(2) { margin-bottom: 0; } } assets/sass/02-tools/functions.scss000064400000011045152377522560013322 0ustar00// Remove the unit of a length // @param {Number} $number - Number to remove unit from // @return {Number} - Unitless number @function strip-unit($number) { @if type-of($number) == "number" and not unitless($number) { @return $number / ($number * 0 + 1); } @return $number; } // ---- // Sass (v3.3.14) // Compass (v1.0.0.rc.1) // ---- @function pow($x, $y) { $ret: 1; @if $y > 0 { @for $i from 1 through $y { $ret: $ret * $x; } } @else { @for $i from $y to 0 { $ret: $ret / $x; } } @return $ret; } // Map deep get // @author Hugo Giraudel // @access public // @param {Map} $map - Map // @param {Arglist} $keys - Key chain // @return {*} - Desired value // // Example: // $m-breakpoint: map-deep-get($__prefix-default-config, "layouts", "M"); @function map-deep-get($map, $keys...) { @each $key in $keys { $map: map-get($map, $key); } @return $map; } // Deep set function to set a value in nested maps // @author Hugo Giraudel // @access public // @param {Map} $map - Map // @param {List} $keys - Key chaine // @param {*} $value - Value to assign // @return {Map} // // Example: // $__prefix-default-config: map-deep-set($__prefix-default-config, "layouts" "M", 650px); @function map-deep-set($map, $keys, $value) { $maps: ($map); $result: null; // If the last key is a map already // Warn the user we will be overriding it with $value @if type-of(nth($keys, -1)) == "map" { @warn "The last key you specified is a map; it will be overridden with `#{$value}`."; } // If $keys is a single key // Just merge and return @if length($keys) == 1 { @return map-merge($map, ($keys: $value)); } // Loop from the first to the second to last key from $keys // Store the associated map to this key in the $maps list // If the key doesn't exist, throw an error @for $i from 1 through length($keys) - 1 { $current-key: nth($keys, $i); $current-map: nth($maps, -1); $current-get: map-get($current-map, $current-key); @if $current-get == null { @error "Key `#{$key}` doesn't exist at current level in map."; } $maps: append($maps, $current-get); } // Loop from the last map to the first one // Merge it with the previous one @for $i from length($maps) through 1 { $current-map: nth($maps, $i); $current-key: nth($keys, $i); $current-val: if($i == length($maps), $value, $result); $result: map-merge($current-map, ($current-key: $current-val)); } // Return result @return $result; } // jQuery-style extend function // - Child themes can use this function to `reset` the values in // config maps without editing the `master` Sass files. // - src: https://www.sitepoint.com/extra-map-functions-sass/ // - About `map-merge()`: // - - only takes 2 arguments // - - is not recursive // @param {Map} $map - first map // @param {ArgList} $maps - other maps // @param {Bool} $deep - recursive mode // @return {Map} // Examples: // $grid-configuration-default: ( // 'columns': 12, // 'layouts': ( // 'small': 800px, // 'medium': 1000px, // 'large': 1200px, // ), // ); // $grid-configuration-custom: ( // 'layouts': ( // 'large': 1300px, // 'huge': 1500px // ), // ); // $grid-configuration-user: ( // 'direction': 'ltr', // 'columns': 16, // 'layouts': ( // 'large': 1300px, // 'huge': 1500px // ), // ); // $deep: false // $grid-configuration: map-extend($grid-configuration-default, $grid-configuration-custom, $grid-configuration-user); // --> ("columns": 16, "layouts": (("large": 1300px, "huge": 1500px)), "direction": "ltr") // $deep: true // $grid-configuration: map-extend($grid-configuration-default, $grid-configuration-custom, $grid-configuration-user, true); // --> ("columns": 16, "layouts": (("small": 800px, "medium": 1000px, "large": 1300px, "huge": 1500px)), "direction": "ltr") @function map-extend($map, $maps.../*, $deep */) { $last: nth($maps, -1); $deep: $last == true; $max: if($deep, length($maps) - 1, length($maps)); // Loop through all maps in $maps... @for $i from 1 through $max { // Store current map $current: nth($maps, $i); // If not in deep mode, simply merge current map with map @if not $deep { $map: map-merge($map, $current); } @else { // If in deep mode, loop through all tuples in current map @each $key, $value in $current { // If value is a nested map and same key from map is a nested map as well @if type-of($value) == "map" and type-of(map-get($map, $key)) == "map" { // Recursive extend $value: map-extend(map-get($map, $key), $value, true); } // Merge current tuple with map $map: map-merge($map, ($key: $value)); } } } @return $map; } assets/sass/01-settings/global.scss000064400000024221152377522560013251 0ustar00/* Variables */ // Vertical Rhythm Multiplier $baseline-unit: 10px; :root { /* Font Family */ --global--font-primary: var(--font-headings, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif); --global--font-secondary: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif); /* Font Size */ --global--font-size-base: 1.25rem; // 20px / 16px --global--font-size-xs: 1rem; // 16px / 16px --global--font-size-sm: 1.125rem; // 18px / 16px --global--font-size-md: 1.25rem; // 20px / 16px --global--font-size-lg: 1.5rem; // 24px / 16px --global--font-size-xl: 2.25rem; // 36px / 16px --global--font-size-xxl: 4rem; // 64px / 16px --global--font-size-xxxl: 5rem; // 80px / 16px --global--font-size-page-title: var(--global--font-size-xxl); --global--letter-spacing: normal; /* Line Height */ --global--line-height-body: 1.7; --global--line-height-heading: 1.3; --global--line-height-page-title: 1.1; /* Headings */ --heading--font-family: var(--global--font-primary); --heading--font-size-h6: var(--global--font-size-xs); --heading--font-size-h5: var(--global--font-size-sm); --heading--font-size-h4: var(--global--font-size-lg); --heading--font-size-h3: calc(1.25 * var(--global--font-size-lg)); --heading--font-size-h2: var(--global--font-size-xl); --heading--font-size-h1: var(--global--font-size-page-title); --heading--letter-spacing-h6: 0.05em; --heading--letter-spacing-h5: 0.05em; --heading--letter-spacing-h4: var(--global--letter-spacing); --heading--letter-spacing-h3: var(--global--letter-spacing); --heading--letter-spacing-h2: var(--global--letter-spacing); --heading--letter-spacing-h1: var(--global--letter-spacing); --heading--line-height-h6: var(--global--line-height-heading); --heading--line-height-h5: var(--global--line-height-heading); --heading--line-height-h4: var(--global--line-height-heading); --heading--line-height-h3: var(--global--line-height-heading); --heading--line-height-h2: var(--global--line-height-heading); --heading--line-height-h1: var(--global--line-height-page-title); --heading--font-weight: normal; --heading--font-weight-page-title: 300; --heading--font-weight-strong: 600; /* Block: Latest posts */ --latest-posts--title-font-family: var(--heading--font-family); --latest-posts--title-font-size: var(--heading--font-size-h3); --latest-posts--description-font-family: var(--global--font-secondary); --latest-posts--description-font-size: var(--global--font-size-sm); --list--font-family: var(--global--font-secondary); --definition-term--font-family: var(--global--font-primary); /* Colors */ --global--color-black: #000; --global--color-dark-gray: #28303d; --global--color-gray: #39414d; --global--color-light-gray: #f0f0f0; --global--color-green: #d1e4dd; --global--color-blue: #d1dfe4; --global--color-purple: #d1d1e4; --global--color-red: #e4d1d1; --global--color-orange: #e4dad1; --global--color-yellow: #eeeadd; --global--color-white: #fff; --global--color-white-50: rgba(255, 255, 255, 0.5); // Used for disabled buttons --global--color-white-90: rgba(255, 255, 255, 0.9); // Used in form fields. --global--color-primary: var(--global--color-dark-gray); /* Body text color, site title, footer text color. */ --global--color-secondary: var(--global--color-gray); /* Headings */ --global--color-primary-hover: var(--global--color-primary); --global--color-background: var(--global--color-green); /* Mint, default body background */ --global--color-border: var(--global--color-primary); /* Used for borders (separators) */ /* Spacing */ --global--spacing-unit: #{2 * $baseline-unit}; // 20px --global--spacing-measure: unset; // Use ch units here. ie: 60ch = 60 character max-width --global--spacing-horizontal: #{2.5 * $baseline-unit}; // 25px --global--spacing-vertical: #{3 * $baseline-unit}; // 30px. /* Elevation */ --global--elevation: 1px 1px 3px 0 rgba(0, 0, 0, 0.2); /* Forms */ --form--font-family: var(--global--font-secondary); --form--font-size: var(--global--font-size-sm); --form--line-height: var(--global--line-height-body); --form--color-text: var(--global--color-dark-gray); // Text color in input fields is always dark over light background. --form--color-ranged: var(--global--color-secondary); --form--label-weight: 500; --form--border-color: var(--global--color-secondary); --form--border-width: 3px; --form--border-radius: 0; --form--spacing-unit: calc(0.5 * var(--global--spacing-unit)); /* Cover block */ --cover--height: calc(15 * var(--global--spacing-vertical)); --cover--color-foreground: var(--global--color-white); --cover--color-background: var(--global--color-black); /* Buttons */ // Colors --button--color-text: var(--global--color-background); --button--color-text-hover: var(--global--color-secondary); --button--color-text-active: var(--global--color-secondary); --button--color-background: var(--global--color-secondary); --button--color-background-active: var(--global--color-background); // Fonts --button--font-family: var(--global--font-primary); --button--font-size: var(--global--font-size-base); --button--font-weight: 500; --button--line-height: 1.5; // Borders --button--border-width: 3px; --button--border-radius: 0; // Spacing --button--padding-vertical: 15px; --button--padding-horizontal: calc(2 * var(--button--padding-vertical)); /* entry */ --entry-header--color: var(--global--color-primary); --entry-header--color-link: currentColor; --entry-header--color-hover: var(--global--color-primary-hover); --entry-header--color-focus: var(--global--color-secondary); --entry-header--font-size: var(--heading--font-size-h2); --entry-content--font-family: var(--global--font-secondary); --entry-author-bio--font-family: var(--heading--font-family); --entry-author-bio--font-size: var(--heading--font-size-h4); /* Header */ --branding--color-text: var(--global--color-primary); --branding--color-link: var(--global--color-primary); --branding--color-link-hover: var(--global--color-secondary); --branding--title--font-family: var(--global--font-primary); --branding--title--font-size: var(--global--font-size-lg); --branding--title--font-size-mobile: var(--heading--font-size-h4); --branding--title--font-weight: normal; --branding--title--text-transform: uppercase; --branding--description--font-family: var(--global--font-secondary); --branding--description--font-size: var(--global--font-size-sm); --branding--description--font-family: var(--global--font-secondary); --branding--logo--max-width: 300px; --branding--logo--max-height: 100px; --branding--logo--max-width-mobile: 96px; --branding--logo--max-height-mobile: 96px; /* Main navigation */ --primary-nav--font-family: var(--global--font-secondary); --primary-nav--font-family-mobile: var(--global--font-primary); --primary-nav--font-size: var(--global--font-size-md); --primary-nav--font-size-sub-menu: var(--global--font-size-xs); --primary-nav--font-size-mobile: var(--global--font-size-sm); --primary-nav--font-size-sub-menu-mobile: var(--global--font-size-sm); --primary-nav--font-size-button: var(--global--font-size-xs); --primary-nav--font-style: normal; --primary-nav--font-style-sub-menu-mobile: normal; --primary-nav--font-weight: normal; --primary-nav--font-weight-button: 500; --primary-nav--color-link: var(--global--color-primary); --primary-nav--color-link-hover: var(--global--color-primary-hover); --primary-nav--color-text: var(--global--color-primary); --primary-nav--padding: calc(0.66 * var(--global--spacing-unit)); --primary-nav--border-color: var(--global--color-primary); /* Pagination */ --pagination--color-text: var(--global--color-primary); --pagination--color-link-hover: var(--global--color-primary-hover); --pagination--font-family: var(--global--font-secondary); --pagination--font-size: var(--global--font-size-lg); --pagination--font-weight: normal; --pagination--font-weight-strong: 600; /* Footer */ --footer--color-text: var(--global--color-primary); --footer--color-link: var(--global--color-primary); --footer--color-link-hover: var(--global--color-primary-hover); --footer--font-family: var(--global--font-primary); --footer--font-size: var(--global--font-size-sm); /* Block: Pull quote */ --pullquote--font-family: var(--global--font-primary); --pullquote--font-size: var(--heading--font-size-h3); --pullquote--font-style: normal; --pullquote--letter-spacing: var(--heading--letter-spacing-h4); --pullquote--line-height: var(--global--line-height-heading); --pullquote--border-width: 3px; --pullquote--border-color: var(--global--color-primary); --pullquote--color-foreground: var(--global--color-primary); --pullquote--color-background: var(--global--color-background); --quote--font-family: var(--global--font-secondary); --quote--font-size: var(--global--font-size-md); --quote--font-size-large: var(--global--font-size-xl); --quote--font-style: normal; --quote--font-weight: 700; --quote--font-weight-strong: bolder; --quote--font-style-large: normal; --quote--font-style-cite: normal; --quote--line-height: var(--global--line-height-body); --quote--line-height-large: 1.35; --separator--border-color: var(--global--color-border); --separator--height: 1px; /* Block: Table */ --table--stripes-border-color: var(--global--color-light-gray); --table--stripes-background-color: var(--global--color-light-gray); --table--has-background-text-color: var(--global--color-dark-gray); /* Widgets */ --widget--line-height-list: 1.9; --widget--line-height-title: 1.4; --widget--font-weight-title: 700; --widget--spacing-menu: calc(0.66 * var(--global--spacing-unit)); /* Admin-bar height */ --global--admin-bar--height: 0px; } .admin-bar { --global--admin-bar--height: 32px; @media only screen and (max-width: 782px) { --global--admin-bar--height: 46px; } } @media only screen and (min-width: 652px) { // Not using the mixin because it's compiled after this file :root { --global--font-size-xl: 2.5rem; // 40px / 16px --global--font-size-xxl: 6rem; // 96px / 16px --global--font-size-xxxl: 9rem; // 144px / 16px --heading--font-size-h3: 2rem; // 32px / 16px --heading--font-size-h2: 3rem; // 48px / 16px } } assets/sass/01-settings/file-header.scss000064400000002123152377522560014153 0ustar00/* Theme Name: Twenty Twenty-One Theme URI: https://wordpress.org/themes/twentytwentyone/ Author: the WordPress team Author URI: https://wordpress.org/ Description: Twenty Twenty-One is a blank canvas for your ideas and it makes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See how Twenty Twenty-One elevates your portfolio, business website, or personal blog. Requires at least: 5.3 Tested up to: 6.0 Requires PHP: 5.6 Version: 1.6 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: twentytwentyone Tags: one-column, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready Twenty Twenty-One WordPress Theme, (C) 2020 WordPress.org Twenty Twenty-One is distributed under the terms of the GNU GPL. */ assets/sass/01-settings/fonts.scss000064400000000077152377522560013145 0ustar00// Do we need to serve a font? Add the @font-face styles here. assets/sass/style-dark-mode.scss000064400000005133152377522560012735 0ustar00/* OS dark theme preference */ @media only screen { .is-dark-theme.is-dark-theme { --global--color-background: var(--global--color-dark-gray); --global--color-primary: var(--global--color-light-gray); --global--color-secondary: var(--global--color-light-gray); --button--color-text: var(--global--color-background); --button--color-text-hover: var(--global--color-secondary); --button--color-text-active: var(--global--color-secondary); --button--color-background: var(--global--color-secondary); --button--color-background-active: var(--global--color-background); --global--color-border: #9ea1a7; /* Block: Table */ --table--stripes-border-color: rgba(240, 240, 240, 0.15); --table--stripes-background-color: rgba(240, 240, 240, 0.15); } .is-dark-theme img { filter: brightness(.85) contrast(1.1); } .respect-color-scheme-preference.is-dark-theme body { background-color: var(--global--color-background); } #dark-mode-toggler { cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: var(--global--font-size-xs); padding: 0.5em; min-height: 44px; // A11y requirement for minimum clickable area. min-width: max-content; border: 2px solid currentColor; box-shadow: none; background: var(--button--color-text); color: var(--button--color-background); z-index: 9998; .no-js & { display: none; } &.fixed-bottom { position: fixed; bottom: 5px; // The bottom property has transition (see below). right: 5px; &.hide:not(:focus) { bottom: -80px; } } &.relative { position: absolute; height: 44px; top: calc(2.4 * var(--global--spacing-vertical) - 44px); right: calc(50vw - var(--responsive--alignwide-width) / 2 - 0.5em); .admin-bar & { top: calc(2.4 * var(--global--spacing-vertical) - 44px + 32px); @media only screen and (max-width: 782px) { top: calc(2.4 * var(--global--spacing-vertical) - 44px + 46px); } @media only screen and (max-width: 481px) { top: calc(2.4 * var(--global--spacing-vertical) - 44px + 26px); } } ~ nav { body:not(.primary-navigation-open) & { @media only screen and (max-width: 481px) { top: calc(44px + 44px); } } } } .primary-navigation-open & { display: none; } &:hover, &:focus { color: var(--button--color-background-active); border: 2px solid var(--button--color-text-active); background-color: var(--button--color-text-active); } .is-IE & { display: none; } &.fixed-bottom { @media (prefers-reduced-motion: no-preference) { transition: bottom 0.5s; } } } } assets/sass/03-generic/reset.scss000064400000002020152377522560012702 0ustar00/** * Reset specific elements to make them easier to style in other contexts. */ html, body, p, ol, ul, li, dl, dt, dd, blockquote, figure, fieldset, form, legend, textarea, pre, iframe, hr, h1, h2, h3, h4, h5, h6 { padding: 0; margin: 0; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } /** * Apply generic border-box to all elements. * See: * https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ html { /* Apply border-box across the entire page. */ box-sizing: border-box; // HTML resets font-family: var(--global--font-secondary); line-height: var(--global--line-height-body); } /** * Relax the definition a bit, to allow components to override it manually. */ * { &, &::before, &::after { box-sizing: inherit; } } // body resets body { font-size: var(--global--font-size-base); font-weight: normal; color: var(--global--color-primary); text-align: left; background-color: var(--global--color-background); } button { cursor: pointer; } assets/sass/03-generic/vertical-margins.scss000064400000007173152377522560015045 0ustar00/** * Site Structure * * - Set vertical margins and responsive widths on * top-level wrappers and content wrappers * - `--global--width-content` is a responsive variable * - See: globals/_global-width-responsive.scss */ /** * Top Level Wrappers (header, main, footer) * - Set vertical padding and horizontal margins */ .site-header, .site-main, .widget-area, .site-footer { padding-top: var(--global--spacing-vertical); padding-bottom: var(--global--spacing-vertical); margin-left: auto; margin-right: auto; } .site-header { padding-top: calc(0.75 * var(--global--spacing-vertical)); padding-bottom: calc(2 * var(--global--spacing-vertical)); @include media(mobile) { padding-bottom: calc(3 * var(--global--spacing-vertical)); } } /** * Site-main children wrappers * - Add double vertical margins here for clearer hierarchy */ .site-main > * { margin-top: calc(3 * var(--global--spacing-vertical)); margin-bottom: calc(3 * var(--global--spacing-vertical)); &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } /** * Set the default maximum responsive content-width */ .default-max-width { @extend %responsive-aligndefault-width; } /** * Set the wide maximum responsive content-width */ .wide-max-width { @extend %responsive-alignwide-width; } /** * Set the full maximum responsive content-width */ .full-max-width { @extend %responsive-alignfull-width-mobile; @extend %responsive-alignfull-width; } /* * Block & non-gutenberg content wrappers * - Set margins */ .entry-header, .post-thumbnail, .entry-content, .entry-footer, .author-bio { margin-top: var(--global--spacing-vertical); margin-right: auto; margin-bottom: var(--global--spacing-vertical); margin-left: auto; } /* * Block & non-gutenberg content wrapper children * - Sets spacing-vertical margin logic */ .site-main > article > *, // apply vertical margins to article level .site-main > .not-found > *, // apply vertical margins to article level .entry-content > *, [class*="inner-container"] > *, .wp-block-template-part > *, .wp-block-post-template :where(li > *) { // using :where keeps specificity low. margin-top: calc(0.666 * var(--global--spacing-vertical)); margin-bottom: calc(0.666 * var(--global--spacing-vertical)); @include media(mobile) { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } .site-footer > *, .widget-area > * { margin-top: calc(0.666 * var(--global--spacing-vertical)); margin-bottom: calc(0.666 * var(--global--spacing-vertical)); @include media(mobile) { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } } /* * Block & non-gutenberg content wrapper children * - Sets spacing-unit margins */ //.site-header > *, // Removed, to align site title and menu. .entry-header > *, .post-thumbnail > *, .page-content > *, .comment-content > *, .widget > * { margin-top: var(--global--spacing-unit); margin-bottom: var(--global--spacing-unit); &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } /* * .entry-content children specific controls * - Adds special margin overrides for alignment utility classes */ .entry-content > * { &.alignleft, &.alignright, &.alignleft:first-child + *, &.alignright:first-child + *, &.alignfull.has-background { margin-top: 0; } &:last-child, &.alignfull.has-background { margin-bottom: 0; } /* Reset alignleft and alignright margins after alignfull */ &.alignfull + .alignleft, &.alignfull + .alignright { margin-top: var(--global--spacing-vertical); } } assets/sass/03-generic/clearings.scss000064400000000673152377522560013543 0ustar00.clear:before, .clear:after, .entry-content:before, .entry-content:after, .comment-content:before, .comment-content:after, .site-header:before, .site-header:after, .site-content:before, .site-content:after, .site-footer:before, .site-footer:after { content: ""; display: table; table-layout: fixed; } .clear:after, .entry-content:after, .comment-content:after, .site-header:after, .site-content:after, .site-footer:after { clear: both; } assets/sass/03-generic/normalize.scss000064400000013710152377522560013570 0ustar00/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ /* Document ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ html { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ } /* Sections ========================================================================== */ /** * Remove the margin in all browsers. */ body { margin: 0; } /** * Render the `main` element consistently in IE. */ main { display: block; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Firefox, and Safari. */ h1 { font-size: 2em; margin: 0.67em 0; } /* Grouping content ========================================================================== */ /** * 1. Add the correct box sizing in Firefox. * 2. Show the overflow in Edge and IE. */ hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ pre { font-family: monospace; /* 1 */ font-size: 1em; /* 2 */ } /* Text-level semantics ========================================================================== */ /** * Remove the gray background on active links in IE 10. */ a { background-color: transparent; text-decoration-thickness: 1px; } /** * 1. Remove the bottom border in Chrome 57- * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */ abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ text-decoration-style: dotted; /* 2 */ } /** * Add the correct font weight in Chrome, Edge, and Safari. */ b, strong { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp { font-family: monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` elements from affecting the line height in * all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* Embedded content ========================================================================== */ /** * Remove the border on images inside links in IE 10. */ img { border-style: none; } /* Forms ========================================================================== */ /** * 1. Change the font styles in all browsers. * 2. Remove the margin in Firefox and Safari. */ button, input, optgroup, select, textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ } /** * Show the overflow in IE. * 1. Show the overflow in Edge. */ button, input { /* 1 */ overflow: visible; } /** * Remove the inheritance of text transform in Edge, Firefox, and IE. * 1. Remove the inheritance of text transform in Firefox. */ button, select { /* 1 */ text-transform: none; } /** * Correct the inability to style clickable types in iOS and Safari. */ button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } /** * Remove the inner border and padding in Firefox. */ button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus styles unset by the previous rule. */ button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } /** * Correct the padding in Firefox. */ fieldset { padding: 0.35em 0.75em 0.625em; } /** * 1. Correct the text wrapping in Edge and IE. * 2. Correct the color inheritance from `fieldset` elements in IE. * 3. Remove the padding so developers are not caught out when they zero out * `fieldset` elements in all browsers. */ legend { box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ } /** * Add the correct vertical alignment in Chrome, Firefox, and Opera. */ progress { vertical-align: baseline; } /** * Remove the default vertical scrollbar in IE 10+. */ textarea { overflow: auto; } /** * 1. Add the correct box sizing in IE 10. * 2. Remove the padding in IE 10. */ [type="checkbox"], [type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Chrome. */ [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } /** * 1. Correct the odd appearance in Chrome and Safari. * 2. Correct the outline style in Safari. */ [type="search"] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Remove the inner padding in Chrome and Safari on macOS. */ [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style clickable types in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Interactive ========================================================================== */ /* * Add the correct display in Edge, IE 10+, and Firefox. */ details { display: block; } /* * Add the correct display in all browsers. */ summary { display: list-item; } /* Misc ========================================================================== */ /** * Add the correct display in IE 10+. */ template { display: none; } /** * Add the correct display in IE 10. */ [hidden] { display: none; } assets/sass/03-generic/breakpoints.scss000064400000011072152377522560014110 0ustar00/** * Responsive Styles */ /** * Required Variables */ $default_width: 610px; $max_content_width: 1240px; $breakpoint_sm: 482px; $breakpoint_md: 592px; $breakpoint_lg: 652px; $breakpoint_xl: 822px; $breakpoint_xxl: 1024px; // Responsive breakpoints mixin @mixin media( $res ) { @if mobile-only == $res { @media only screen and (max-width: #{$breakpoint_sm - 1}) { @content; } } @if mobile == $res { @media only screen and (min-width: #{$breakpoint_sm}) { @content; } } @if tablet-only == $res { @media only screen and (max-width: #{$breakpoint_md - 1}) { @content; } } @if tablet == $res { @media only screen and (min-width: #{$breakpoint_md}) { @content; } } @if laptop-only == $res { @media only screen and (max-width: #{$breakpoint_lg - 1}) { @content; } } @if laptop == $res { @media only screen and (min-width: #{$breakpoint_lg}) { @content; } } @if desktop-only == $res { @media only screen and (max-width: #{$breakpoint_xl - 1}) { @content; } } @if desktop == $res { @media only screen and (min-width: #{$breakpoint_xl}) { @content; } } @if wide-only == $res { @media only screen and (max-width: #{$breakpoint_xxl - 1}) { @content; } } @if wide == $res { @media only screen and (min-width: #{$breakpoint_xxl}) { @content; } } } /** * Root Media Query Variables */ :root { --responsive--spacing-horizontal: calc(2 * var(--global--spacing-horizontal) * 0.6); --responsive--aligndefault-width: calc(100vw - var(--responsive--spacing-horizontal)); --responsive--alignwide-width: calc(100vw - var(--responsive--spacing-horizontal)); --responsive--alignfull-width: 100%; --responsive--alignright-margin: var(--global--spacing-horizontal); --responsive--alignleft-margin: var(--global--spacing-horizontal); } @include media(mobile) { :root { --responsive--aligndefault-width: min(calc(100vw - 4 * var(--global--spacing-horizontal)), #{$default_width}); --responsive--alignwide-width: calc(100vw - 4 * var(--global--spacing-horizontal)); --responsive--alignright-margin: calc(0.5 * (100vw - var(--responsive--aligndefault-width))); --responsive--alignleft-margin: calc(0.5 * (100vw - var(--responsive--aligndefault-width))); } } @include media(desktop) { :root { --responsive--aligndefault-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), #{$default_width}); --responsive--alignwide-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), #{$max_content_width}); } } /** * Extends */ %responsive-aligndefault-width { max-width: var(--responsive--aligndefault-width); margin-left: auto; margin-right: auto; } %responsive-alignwide-width { max-width: var(--responsive--alignwide-width); margin-left: auto; margin-right: auto; } %responsive-alignfull-width-mobile { max-width: var(--responsive--alignfull-width); width: var(--responsive--alignfull-width); margin-left: auto; margin-right: auto; } @include media(mobile) { %responsive-alignfull-width { max-width: var(--responsive--alignfull-width); width: auto; margin-left: auto; margin-right: auto; } } %responsive-alignwide-width-nested { margin-left: auto; margin-right: auto; width: var(--responsive--alignwide-width); max-width: var(--responsive--alignfull-width); } %responsive-alignfull-width-nested { margin-left: auto; margin-right: auto; width: calc(var(--responsive--alignfull-width) - calc(2 * var(--responsive--spacing-horizontal))); max-width: var(--responsive--alignfull-width); } @include media(desktop) { %responsive-alignfull-width-nested { margin-left: auto; margin-right: auto; width: calc(var(--responsive--alignfull-width) - calc(4 * var(--responsive--spacing-horizontal))); max-width: var(--responsive--alignfull-width); } } %responsive-alignleft-mobile { /*rtl:ignore*/ margin-left: 0; /*rtl:ignore*/ margin-right: var(--responsive--spacing-horizontal); } @include media(mobile) { %responsive-alignleft { /*rtl:ignore*/ margin-left: var(--responsive--alignleft-margin); /*rtl:ignore*/ margin-right: var(--global--spacing-horizontal); } } %responsive-alignright-mobile { /*rtl:ignore*/ margin-left: var(--responsive--spacing-horizontal); /*rtl:ignore*/ margin-right: 0; } @include media(mobile) { %responsive-alignright { /*rtl:ignore*/ margin-left: var(--global--spacing-horizontal); /*rtl:ignore*/ margin-right: var(--responsive--alignright-margin); } } // Output .default-max-width { @extend %responsive-aligndefault-width; } .wide-max-width { @extend %responsive-alignwide-width; } .full-max-width { @extend %responsive-alignfull-width; } assets/sass/04-elements/links.scss000064400000003563152377522560013116 0ustar00/* * text-underline-offset doesn't work in Chrome at all 👎 * But looks nice in Safari/Firefox, so let's keep it and * maybe Chrome will support it soon. */ a { cursor: pointer; color: var(--wp--style--color--link, var(--global--color-primary)); text-underline-offset: 3px; text-decoration-skip-ink: all; } a:hover { text-decoration-style: dotted; text-decoration-skip-ink: none; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; text-decoration: underline 1px dotted currentColor; text-decoration-skip-ink: none; background: rgba(255, 255, 255, .9); // Change text color when the body background is dark. .is-dark-theme & { background: var(--global--color-black); color: var(--global--color-white); text-decoration: none; .meta-nav { color: var(--wp--style--color--link, var(--global--color-white)); } } // Change colors when the body background is white. .has-background-white & { background: rgba(0, 0, 0, .9); color: var(--wp--style--color--link, var(--global--color-white)); .meta-nav { color: var(--wp--style--color--link, var(--global--color-white)); } } &.skip-link { /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; outline-offset: -2px; &:focus { color: #21759b; background-color: #f1f1f1; } } &.custom-logo-link { background: none; } img { outline: 2px dotted var(--wp--style--color--link, var(--global--color-primary)); } } // Enforce the custom link color even if a custom background color has been set. // The extra specificity here is required to override the background color styles. .has-background { // Target both current level and nested block. .has-link-color a, &.has-link-color a { color: var(--wp--style--color--link, var(--global--color-primary)); } } assets/sass/04-elements/blockquote.scss000064400000003121152377522560014134 0ustar00blockquote { padding: 0; position: relative; margin: var(--global--spacing-vertical) 0 var(--global--spacing-vertical) var(--global--spacing-horizontal); > * { margin-top: var(--global--spacing-unit); margin-bottom: var(--global--spacing-unit); &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } p { letter-spacing: var(--heading--letter-spacing-h4); font-family: var(--quote--font-family); font-size: var(--quote--font-size); font-style: var(--quote--font-style); font-weight: var(--quote--font-weight); line-height: var(--quote--line-height); } cite, footer { font-weight: normal; color: var(--global--color-primary); font-size: var(--global--font-size-xs); letter-spacing: var(--global--letter-spacing); } &.alignleft, &.alignright { padding-left: inherit; p { font-size: var(--heading--font-size-h5); max-width: inherit; width: inherit; } cite, footer { font-size: var(--global--font-size-xs); letter-spacing: var(--global--letter-spacing); } } strong { font-weight: var(--quote--font-weight-strong); } &:before { content: "\201C"; font-size: var(--quote--font-size); line-height: var(--quote--line-height); position: absolute; left: calc(-0.5 * var(--global--spacing-horizontal)); } .wp-block-quote__citation, cite, footer { color: var(--global--color-primary); font-size: var(--global--font-size-xs); font-style: var(--quote--font-style-cite); } @include media(mobile-only) { padding-left: calc(0.5 * var(--global--spacing-horizontal)); &:before { left: 0; } } } assets/sass/04-elements/forms-editor.scss000064400000001307152377522560014402 0ustar00select, select:focus { border: var(--form--border-width) solid var(--form--border-color); border-radius: var(--form--border-radius); color: var(--form--color-text); font-size: var(--form--font-size); -moz-appearance: none; -webkit-appearance: none; appearance: none; padding: var(--form--spacing-unit) calc(3 * var(--form--spacing-unit)) var(--form--spacing-unit) var(--form--spacing-unit); background: var(--global--color-white) url("data:image/svg+xml;utf8,") no-repeat; // stylelint-disable-line function-url-quotes background-position: right var(--form--spacing-unit) top 60%; } assets/sass/04-elements/misc.scss000064400000000310152377522560012714 0ustar00/* Over here, place any elements that do not need to have their own file. */ b, strong { font-weight: 700; } dfn, cite, em, i { font-style: italic; } pre { white-space: pre; overflow-x: auto; } assets/sass/04-elements/media.scss000064400000001430152377522560013044 0ustar00img { height: auto; max-width: 100%; vertical-align: middle; } /* Classic editor images */ .entry-content img { max-width: 100%; } /* Make sure embeds and iframes fit their containers. */ embed, iframe, object, video { max-width: 100%; } /* Media captions */ figcaption, .wp-caption, .wp-caption-text, .wp-block-embed figcaption { color: currentColor; font-size: var(--global--font-size-xs); line-height: var(--global--line-height-body); margin-top: calc(0.5 * var(--global--spacing-unit)); margin-bottom: var(--global--spacing-unit); text-align: center; .alignleft &, .alignright & { margin-bottom: 0; } } /* WP Smiley */ .page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } assets/sass/04-elements/forms.scss000064400000015655152377522560013131 0ustar00input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], .site textarea { border: var(--form--border-width) solid var(--form--border-color); border-radius: var(--form--border-radius); color: var(--form--color-text); line-height: var(--global--line-height-body); padding: var(--form--spacing-unit); // Gives a little more space for the outline offset. margin: 0 2px; max-width: 100%; &:focus { color: var(--form--color-text); outline-offset: 2px; outline: 2px dotted var(--form--border-color); } &:disabled { opacity: 0.7; } .is-dark-theme & { background: var(--global--color-white-90); } } // Reset the negative offset from normalize to make the thicker "border" work on focus. input[type="search"] { &:focus { outline-offset: -7px; .is-dark-theme & { outline-color: var(--global--color-background); } } } input[type="color"] { padding: calc(var(--form--spacing-unit) / 2); height: calc(4 * var(--form--spacing-unit)); } input[type="email"], input[type="url"] { /*rtl:ignore*/ direction: ltr; } select { border: var(--form--border-width) solid var(--form--border-color); color: var(--form--color-text); -moz-appearance: none; -webkit-appearance: none; appearance: none; line-height: var(--global--line-height-body); padding: var(--form--spacing-unit) calc(3 * var(--form--spacing-unit)) var(--form--spacing-unit) var(--form--spacing-unit); background: var(--global--color-white) url("data:image/svg+xml;utf8,") no-repeat; // stylelint-disable-line function-url-quotes background-position: right var(--form--spacing-unit) top 60%; &:focus { outline-offset: 2px; outline: 2px dotted var(--form--border-color); } .is-dark-theme & { background: var(--global--color-white-90) url("data:image/svg+xml;utf8,") no-repeat; // stylelint-disable-line function-url-quotes background-position: right var(--form--spacing-unit) top 60%; } } textarea { width: 100%; } label { font-size: var(--form--font-size); font-weight: var(--form--label-weight); margin-bottom: calc(var(--global--spacing-vertical) / 3); } /** https://css-tricks.com/custom-styling-form-inputs-with-modern-css-features/ https://codepen.io/aaroniker/pen/ZEYoxEY by Aaron Iker. License: MIT. */ @supports (-webkit-appearance: none) or (-moz-appearance: none) { input[type="checkbox"], input[type="radio"] { -webkit-appearance: none; -moz-appearance: none; position: relative; width: 25px; height: 25px; border: var(--form--border-width) solid var(--form--border-color); background: var(--global--color-white); &:disabled { opacity: 0.7; } .is-dark-theme & { background: var(--global--color-white-90); } } input[type="checkbox"] { &:focus { outline-offset: 2px; outline: 2px dotted var(--form--border-color); } &:after { content: ""; opacity: 0; display: block; left: 5px; top: 2px; position: absolute; width: 7px; height: 13px; border: 3px solid var(--form--color-text); border-top: 0; border-left: 0; transform: rotate(30deg); } &:checked { color: var(--form--color-text); &:after { opacity: 1; } } } input[type="radio"] { border-radius: 50%; &:focus { outline-offset: 2px; outline: 2px dotted var(--form--border-color); } &:after { content: ""; opacity: 0; display: block; left: 3px; top: 3px; position: absolute; width: 11px; height: 11px; border-radius: 50%; background: var(--form--color-text); } &:checked { border: 4px solid var(--form--border-color); &:after { opacity: 1; } // Focus style for checked radio buttons. &:focus { outline-offset: 4px; outline: 2px dotted var(--form--border-color); } } } } input[type="checkbox"] + label, input[type="radio"] + label { display: inline-block; padding-left: 10px; font-size: var(--global--font-size-xs); vertical-align: top; } /** * https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/ */ @supports (-webkit-appearance: none) or (-moz-appearance: none) { input[type="range"] { -webkit-appearance: none; /* Hides the slider so that custom slider can be made */ width: 100%; /* Specific width is required for Firefox. */ height: 6px; background: var(--form--color-ranged); border-radius: 6px; outline-offset: 10px; &:disabled { opacity: 0.7; } } input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; border: 3px solid var(--form--color-ranged); height: 44px; width: 44px; border-radius: 50%; background: var(--global--color-background); cursor: pointer; } input[type="range"]::-moz-range-thumb { border: 3px solid var(--form--color-ranged); height: 44px; width: 44px; border-radius: 50%; background: var(--global--color-background); cursor: pointer; box-sizing: border-box; } } input[type="range"]::-ms-track { width: 100%; height: 6px; border-radius: 6px; border-width: 19px 0; border-color: var(--global--color-background); background: transparent; color: transparent; cursor: pointer; } input[type="range"]::-ms-fill-upper { background: var(--form--color-ranged); border-radius: 6px; } input[type="range"]::-ms-fill-lower { background: var(--form--color-ranged); border-radius: 6px; } input[type="range"]::-ms-thumb { border: 3px solid var(--form--color-ranged); height: 44px; width: 44px; border-radius: 50%; background: var(--global--color-background); cursor: pointer; } fieldset { display: grid; border-color: var(--global--color-secondary); padding: var(--global--spacing-horizontal); legend { font-size: var(--global--font-size-lg); } input { &[type="submit"] { max-width: max-content; } &:not([type="submit"]) { margin-bottom: var(--global--spacing-unit); } &[type="radio"], &[type="checkbox"] { margin-bottom: 0; } &[type="radio"] + label, &[type="checkbox"] + label { font-size: var(--form--font-size); padding-left: 0; margin-bottom: var(--global--spacing-unit); } } } ::-moz-placeholder { // Firefox 19+ opacity: 1; } .post-password-message { font-size: var(--global--font-size-lg); } .post-password-form { display: flex; flex-wrap: wrap; &__label { width: 100%; margin-bottom: 0; } input[type="password"] { flex-grow: 1; margin-top: calc(var(--global--spacing-vertical) / 3); margin-right: calc(0.66 * var(--global--spacing-horizontal)); } &__submit { margin-top: calc(var(--global--spacing-vertical) / 3); @include media(tablet) { margin-left: calc(0.4 * var(--global--spacing-horizontal)); } } } assets/sass/style.scss000064400000012076152377522560011100 0ustar00@import "01-settings/file-header"; /** * SETTINGS * File-header..........The file header for the themes style.css file. * Fonts................Any font files, if the project needs specific fonts. * Global...............Project-specific, globally available variables. * * TOOLS * Functions............Global functions. * Mixins...............Global mixins. * * GENERIC * Normalize.css........Normalise browser defaults. * Breakpoints..........Mixins and variables for responsive styles * Vertical-margins.....Vertical spacing for the main components. * Reset................Reset specific elements to make them easier to style in other contexts. * Clearings............Clearings for the main components. * * ELEMENTS * Blockquote...........Default blockquote. * Forms................Element-level form styling. * Headings.............H1–H6 * Links................Default links. * Lists................Default lists. * Media................Images, Figure, Figcaption, Embed, iFrame, Objects, Video. * * BLOCKS * Audio................Specific styles for the audio block. * Button...............Specific styles for the button block. * Code.................Specific styles for the code block. * Columns..............Specific styles for the columns block. * Cover................Specific styles for the cover block. * File.................Specific styles for the file block. * Gallery..............Specific styles for the gallery block. * Group................Specific styles for the group block. * Heading..............Specific styles for the heading block. * Image................Specific styles for the image block. * Latest comments......Specific styles for the latest comments block. * Latest posts.........Specific styles for the latest posts block. * Legacy...............Specific styles for the legacy gallery. * List.................Specific styles for the list block. * Media text...........Specific styles for the media and text block. * Navigation...........Specific styles for the navigation block. * Paragraph............Specific styles for the paragraph block. * Pullquote............Specific styles for the pullquote block. * Quote................Specific styles for the quote block. * Search...............Specific styles for the search block. * Separator............Specific styles for the separator block. * Spacer...............Specific styles for the spacer block. * Table................Specific styles for the table block. * Verse................Specific styles for the verse block. * Video................Specific styles for the video block. * Utilities............Block alignments. * * COMPONENTS * Header...............Header styles. * Footer...............Footer styles. * Comments.............Comment styles. * Archives.............Archive styles. * 404..................404 styles. * Search...............Search styles. * Navigation...........Navigation styles. * Footer Navigation....Footer Navigation styles. * Pagination...........Pagination styles. * Single...............Single page and post styles. * Posts and pages......Misc, sticky post styles. * Entry................Entry, author biography. * Widget...............Widget styles. * Editor...............Editor styles. * * UTILITIES * A11y.................Screen reader text, prefers reduced motion etc. * Color Palette........Classes for the color palette colors. * Editor Font Sizes....Editor Font Sizes. * Measure..............The width of a line of text, in characters. */ // Print................Print styles /* Categories 01 to 03 are the basics. */ @import "01-settings/fonts"; @import "01-settings/global"; @import "02-tools/mixins"; @import "02-tools/functions"; @import "03-generic/normalize"; @import "03-generic/breakpoints"; @import "03-generic/vertical-margins"; @import "03-generic/reset"; @import "03-generic/clearings"; /* Category 04 can contain any default HTML element. Do not add classes here, just give the elements some basic styles. */ @import "04-elements/blockquote"; @import "04-elements/forms"; @import "04-elements/media"; @import "04-elements/misc"; @import "04-elements/links"; /* Category 05 is all about adjusting the default block styles to the given layout. I only added three blocks as examples. */ @import "05-blocks/blocks"; /* Category 06 contains all "bigger" components which contain elements of the previous two categories like header, footer, page template, single template, comments section, archives, ... */ @import "06-components/header"; @import "06-components/footer"; @import "06-components/single"; @import "06-components/posts-and-pages"; @import "06-components/entry"; @import "06-components/archives"; @import "06-components/404"; @import "06-components/search"; @import "06-components/comments"; @import "06-components/navigation"; @import "06-components/footer-navigation"; @import "06-components/pagination"; @import "06-components/widgets"; /* Category 07 is for any utility classes that are not assigned to a specific component. */ @import "07-utilities/a11y"; @import "07-utilities/color-palette"; @import "07-utilities/measure"; @import "07-utilities/ie"; assets/sass/06-components/single.scss000064400000000670152377522560013626 0ustar00.singular .entry-header { border-bottom: 3px solid var(--global--color-border); padding-bottom: calc(2 * var(--global--spacing-vertical)); margin-bottom: calc(3 * var(--global--spacing-vertical)); } .home .entry-header { border-bottom: none; padding-bottom: 0; margin-bottom: 0; } .singular .has-post-thumbnail .entry-header { border-bottom: none; padding-bottom: calc(1.3 * var(--global--spacing-vertical)); margin-bottom: 0; } assets/sass/06-components/posts-and-pages.scss000064400000000725152377522560015353 0ustar00.sticky { // This class is required to pass ThemeCheck. } .no-results.not-found > *:first-child { margin-bottom: calc(3 * var(--global--spacing-vertical)); } // Styling for wp_link_pages. .page-links { clear: both; .post-page-numbers { display: inline-block; margin-left: calc(0.66 * var(--global--spacing-unit)); margin-right: calc(0.66 * var(--global--spacing-unit)); min-width: 44px; min-height: 44px; &:first-child { margin-left: 0; } } } assets/sass/06-components/header.scss000064400000010017152377522560013571 0ustar00// Site header .site-header { @extend %responsive-alignwide-width; display: flex; align-items: flex-start; flex-wrap: wrap; row-gap: var(--global--spacing-vertical); // Add space in case the menu wraps below the site branding. .wp-custom-logo & { align-items: center; } @include media(mobile) { padding-top: calc(var(--global--spacing-vertical) / 0.75); // 40px } @include media(desktop) { padding-top: calc(2.4 * var(--global--spacing-vertical)); // 60px } } // Site branding .site-branding { color: var(--branding--color-text); margin-right: 140px; &:last-child { margin-right: 0; width: 100%; text-align: center; } @include media(mobile) { margin-right: initial; margin-top: 4px; // Align the baseline of the site title with the primary menu } } // Site title .site-title { color: var(--branding--color-link); font-family: var(--branding--title--font-family); font-size: var(--branding--title--font-size-mobile); letter-spacing: normal; text-transform: var(--branding--title--text-transform); line-height: var(--global--line-height-heading); margin-bottom: calc(var(--global--spacing-vertical) / 6); a { color: currentColor; font-weight: var(--branding--title--font-weight); &:link, &:visited, &:active { color: currentColor; } &:hover, &:focus { color: var(--branding--color-link-hover); } } @include media(mobile) { font-size: var(--branding--title--font-size); } } // Site description .site-description { color: currentColor; font-family: var(--branding--description--font-family); font-size: var(--branding--description--font-size); line-height: 1.4; } .site-title > a { text-decoration-color: var(--global--color-secondary); } // Site logo .site-logo { margin: calc(var(--global--spacing-vertical) / 2) 0; .site-header > & { width: 100%; padding-bottom: calc(var(--global--spacing-vertical) * 1.5); border-bottom: 1px solid; text-align: center; } .custom-logo { margin-left: auto; margin-right: auto; max-width: var(--branding--logo--max-width-mobile); max-height: var(--branding--logo--max-height-mobile); height: auto; display: inline-block; width: auto; } @include media(mobile) { .custom-logo { max-width: var(--branding--logo--max-width); max-height: var(--branding--logo--max-height); height: auto; width: auto; } } } @include media(mobile-only) { .site-header { &.has-logo { &:not(.has-title-and-tagline) { &.has-menu { .site-logo { position: absolute; padding-top: calc(0.5 * var(--global--spacing-vertical)); margin-top: 0; top: var(--global--admin-bar--height); .primary-navigation-open & { display: none; } img { max-height: calc(var(--button--padding-vertical) - (0.25 * var(--global--spacing-unit)) + 1.7em); } } } } &.has-title-and-tagline { align-items: flex-start; &.has-menu { justify-content: space-between; .site-branding { max-width: calc(100% - 160px); } } .site-branding { margin-right: 0; } body:not(.primary-navigation-open) & { &:after { display: none; } .primary-navigation { position: relative; top: 0; } .menu-button-container { position: relative; padding-top: 0; margin-top: calc(0px - var(--button--padding-vertical) + (0.25 * var(--global--spacing-unit))); #primary-mobile-menu { // The 4.5px here is to offset the icon size horizontallly // (the icon's width is larger than the path's width and has extra space on the sides). padding-left: calc(var(--global--spacing-horizontal) * 0.6 - 4.5px); padding-right: calc(var(--global--spacing-horizontal) * 0.6 - 4.5px); margin-right: calc(0px - var(--global--spacing-horizontal) * 0.6); } } } } } &:not(.has-logo) { &.has-title-and-tagline { .site-branding { margin-right: 0; max-width: calc(100% - 160px); } } } &:not(.has-menu) { justify-content: center; } } } assets/sass/06-components/archives.scss000064400000002004152377522560014142 0ustar00.page-title { font-size: var(--global--font-size-page-title); } h1.page-title, h2.page-title { font-weight: var(--heading--font-weight-page-title); } h1.page-title { line-height: var(--heading--line-height-h1); } .page-header { border-bottom: 3px solid var(--global--color-border); padding-bottom: calc(2 * var(--global--spacing-vertical)); } .archive, .search, .blog { .content-area { .format-aside, .format-status, .format-link { .entry-content { font-size: var(--global--font-size-lg); } } } .format-image, .format-gallery, .format-video { .entry-content { margin-top: calc(2 * var(--global--spacing-vertical)); } } .entry-footer { .cat-links, .tags-links { display: block; } } &.logged-in { .entry-footer { .posted-on { margin-right: calc(0.5 * var(--global--spacing-unit)); } } } } .archive-description { margin-top: var(--global--spacing-vertical); font-size: var(--global--font-size-xl); line-height: var(--global--line-height-heading); } assets/sass/06-components/footer-navigation.scss000064400000002741152377522560016001 0ustar00 .footer-navigation { margin-top: calc(2 * var(--global--spacing-vertical)); margin-bottom: var(--global--spacing-vertical); color: var(--footer--color-text); font-size: var(--global--font-size-xs); font-family: var(--footer--font-family); } .footer-navigation-wrapper { display: flex; justify-content: center; flex-wrap: wrap; list-style: none; padding-left: 0; li { display: inline; // This is to prevent hover styles from overlapping when the menu wraps. line-height: 3; a { padding: calc(1.25 * var(--primary-nav--padding)) var(--primary-nav--padding); color: var(--footer--color-link); &:link, &:visited, &:active { color: var(--footer--color-link); } &:hover { text-decoration: underline; text-decoration-style: dotted; text-decoration-skip-ink: none; color: var(--footer--color-link-hover); } &:focus { .is-dark-theme & { .svg-icon { fill: var(--wp--style--color--link, var(--global--color-background)); } } // Change colors when the body background is white. .has-background-white & { .svg-icon { fill: var(--wp--style--color--link, var(--global--color-white)); } } } } .svg-icon { vertical-align: middle; fill: var(--footer--color-link); &:hover { transform: scale(1.1); } @media (prefers-reduced-motion: no-preference) { transition: transform 0.1s ease; } } } .sub-menu-toggle, .menu-item-description { display: none; } } assets/sass/06-components/search.scss000064400000000135152377522560013606 0ustar00.search-no-results .page-content { margin-top: calc(3 * var(--global--spacing-vertical)); } assets/sass/06-components/404.scss000064400000000204152377522560012645 0ustar00.error404 main p { font-size: var(--global--font-size-lg); margin-bottom: calc(var(--global--spacing-vertical) * 1.6666666667); } assets/sass/06-components/editor.scss000064400000002120152377522560013623 0ustar00html { font-family: var(--global--font-secondary); line-height: var(--global--line-height-body); } body { --wp--typography--line-height: var(--global--line-height-body); color: var(--global--color-primary); background-color: var(--global--color-background); font-family: var(--global--font-secondary); font-size: var(--global--font-size-base); font-weight: normal; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } // Links styles .wp-block a { color: var(--wp--style--color--link, var(--global--color-primary)); &:hover { text-decoration-style: dotted; } &:focus { outline: 2px solid var(--wp--style--color--link, var(--global--color-primary)); text-decoration: none; } } // Enforce the custom link color even if a custom background color has been set. // The extra specificity here is required to override the background color styles. .has-background { // Target both current level and nested block. .has-link-color a, &.has-link-color a { color: var(--wp--style--color--link, var(--global--color-primary)); } } button, a { cursor: pointer; } assets/sass/06-components/comments.scss000064400000010664152377522560014176 0ustar00/** * Comments Wrapper */ .comments-area { > * { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } &.show-avatars { .avatar { border-radius: 50%; position: absolute; top: 10px; } .fn { display: inline-block; padding-left: 85px; } .comment-metadata { padding: 8px 0 9px 85px; } } } /** * Comment Title */ .comments-title, .comment-reply-title { font-size: var(--heading--font-size-h2); letter-spacing: var(--heading--letter-spacing-h2); } .comment-reply-title { display: flex; justify-content: space-between; small { a { font-family: var(--global--font-secondary); font-size: var(--global--font-size-xs); font-style: normal; font-weight: normal; letter-spacing: normal; } } } /* Nested comment reply title*/ .comment .comment-respond .comment-reply-title { font-size: var(--global--font-size-lg); } /** * Comment Lists */ .comment-list { padding-left: 0; list-style: none; > li { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } } .comment-list .children { list-style: none; padding-left: 0; > li { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } } .comment-list .depth-2, .comment-list .depth-3 { @include media(mobile) { padding-left: calc(4 * var(--global--spacing-horizontal)); } } /** * Comment Meta */ .comment-meta { .comment-author { line-height: var(--global--line-height-heading); margin-bottom: calc(0.25 * var(--global--spacing-unit)); @include media(mobile) { margin-bottom: 0; padding-right: 0; } .fn { font-family: var(--global--font-secondary); font-weight: normal; font-size: var(--global--font-size-lg); hyphens: auto; word-wrap: break-word; word-break: break-word; } } .comment-metadata { color: var(--global--color-primary); font-size: var(--global--font-size-xs); padding: 8px 0 9px 0; .edit-link { margin-left: var(--global--spacing-horizontal); } } @include media(mobile) { margin-right: inherit; .comment-author { max-width: inherit; } } } .reply { font-size: var(--global--font-size-sm); line-height: var(--global--line-height-heading); } .bypostauthor { display: block; } .says { display: none; } .pingback .url, .trackback .url { font-family: var(--global--font-primary); } // Comment body .comment-body { position: relative; margin-bottom: calc(1.7 * var(--global--spacing-vertical)); > * { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } .reply { margin: 0; } } .comment-content { word-wrap: break-word; } // Pingbacks & Trackbacks .pingback .comment-body, .trackback .comment-body { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); } .comment-respond { margin-top: var(--global--spacing-vertical); } .comment-respond > * { margin-top: var(--global--spacing-unit); margin-bottom: var(--global--spacing-unit); &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; &.comment-form { margin-bottom: var(--global--spacing-vertical); } } } .comment-author { padding-top: 3px; .url { color: currentColor; } } .comment-form { display: flex; flex-wrap: wrap; > * { flex-basis: 100%; } .comment-notes { font-size: var(--global--font-size-sm); } .comment-form-url, .comment-form-comment { width: 100%; } .comment-form-author, .comment-form-email { flex-basis: 0; flex-grow: 1; @include media(mobile-only) { flex-basis: 100%; } } .comment-form-cookies-consent > label, .comment-notes { font-size: var(--global--font-size-xs); font-weight: normal; } } .comment-form > p { margin-bottom: var(--global--spacing-unit); &:first-of-type { margin-top: 0; } &:last-of-type { margin-bottom: 0; } label, input[type="email"], input[type="text"], input[type="url"], textarea { display: block; font-size: var(--global--font-size-sm); margin-bottom: calc(.5 * var(--global--spacing-unit)); width: 100%; font-weight: var(--form--label-weight); } &.comment-form-cookies-consent { display: flex; } @include media(mobile) { &.comment-form-author { margin-right: calc(1.5 * var(--global--spacing-horizontal)); } &.comment-notes, &.logged-in-as { display: block; } } } assets/sass/06-components/footer.scss000064400000003366152377522560013650 0ustar00// Footer .site-footer { padding-top: 0; padding-bottom: calc(1.7 * var(--global--spacing-vertical)); @extend %responsive-alignwide-width; // Increase the top vertical spacing when there is no widget area. .no-widgets & { margin-top: calc(6 * var(--global--spacing-vertical)); } @include media(mobile-only) { .no-widgets & { margin-top: calc(3 * var(--global--spacing-vertical)); } } } // Footer Branding .site-footer > .site-info { padding-top: var(--global--spacing-vertical); color: var(--footer--color-text); font-family: var(--footer--font-family); font-size: var(--footer--font-size); line-height: var(--global--line-height-body); border-top: 3px solid var(--global--color-border); .site-name { text-transform: var(--branding--title--text-transform); font-size: var(--branding--title--font-size); } .privacy-policy, .powered-by { margin-top: calc(0.5 * var(--global--spacing-vertical)); } @include media(desktop) { display: flex; align-items: center; .site-name { margin-right: calc(0.5 * var(--global--spacing-vertical)); } .privacy-policy, .powered-by { margin-top: initial; margin-left: auto; } .privacy-policy + .powered-by { margin-left: calc(0.5 * var(--global--spacing-vertical)); } } a { color: var(--footer--color-link); &:link, &:visited, &:active { color: var(--footer--color-link); } &:hover { color: var(--footer--color-link-hover); } &:focus { color: var(--footer--color-link-hover); .is-dark-theme & { color: var(--wp--style--color--link, var(--global--color-background)); } // Change colors when the body background is white. .has-background-white & { color: var(--wp--style--color--link, var(--global--color-white)); } } } } assets/sass/06-components/widgets.scss000064400000005271152377522560014015 0ustar00.widget-area { @extend %responsive-alignwide-width; margin-top: calc(6 * var(--global--spacing-vertical)); padding-bottom: calc(var(--global--spacing-vertical) / 3); color: var(--footer--color-text); font-size: var(--footer--font-size); font-family: var(--footer--font-family); @include media(laptop) { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: calc(2 * var(--global--spacing-horizontal)); } @include media(wide) { grid-template-columns: repeat(3, 1fr); } @include media(mobile-only) { margin-top: calc(3 * var(--global--spacing-vertical)); } .wp-block-social-links { &.alignright { margin-top: var(--global--spacing-vertical); justify-content: flex-end; } &.alignleft { margin-top: var(--global--spacing-vertical); } } &:after { content: ""; display: table; clear: both; } } .widget { h1, h2, h3, h4, h5, h6 { font-weight: var(--widget--font-weight-title); line-height: var(--widget--line-height-title); } h1 { font-size: var(--global--font-size-md); } h2 { font-size: var(--global--font-size-sm); } h3 { font-size: var(--global--font-size-xs); } h4 { font-size: var(--global--font-size-xs); } h5 { font-size: var(--global--font-size-xs); } h6 { font-size: var(--global--font-size-xs); } ul { list-style-type: none; padding: 0; li { line-height: var(--widget--line-height-list); } &.sub-menu, &.children { margin-left: var(--widget--spacing-menu); } .sub-menu-toggle { display: none; } } a { color: var(--footer--color-link); text-decoration: underline; text-decoration-style: solid; text-decoration-color: currentColor; &:link, &:visited, &:active { color: var(--footer--color-link); } &:hover { color: var(--footer--color-link-hover); text-decoration-style: dotted; } } } // Search widget styles .search-form { display: flex; flex-wrap: wrap; margin: auto; max-width: var(--responsive--aligndefault-width); > label { width: 100%; margin-bottom: 0; font-weight: var(--form--label-weight); } .search-field { flex-grow: 1; max-width: inherit; margin-top: calc(var(--global--spacing-vertical) / 3); margin-right: calc(0.66 * var(--global--spacing-horizontal)); } .search-submit { margin-top: calc(var(--global--spacing-vertical) / 3); margin-left: 10px; } } .widget_search > .search-form { .search-field { margin-right: calc(-1 * var(--button--border-width)); -webkit-appearance: none; margin-bottom: calc(0.5 * var(--global--spacing-vertical)); } .search-submit { margin-left: 0; margin-bottom: calc(0.5 * var(--global--spacing-vertical)); } } .widget_rss a.rsswidget .rss-widget-icon { display: none; } assets/sass/06-components/navigation.scss000064400000024231152377522560014503 0ustar00 // Navigation // Mobile menu toggles .menu-button-container { display: none; justify-content: space-between; position: absolute; right: 0; padding-top: calc(0.5 * var(--global--spacing-vertical)); padding-bottom: calc(0.25 * var(--global--spacing-vertical)); @include media(mobile-only) { display: flex; } // Override specificity from default button styles. #primary-mobile-menu { display: flex; margin-left: auto; padding: calc(var(--button--padding-vertical) - (0.25 * var(--global--spacing-unit))) calc(0.5 * var(--button--padding-horizontal)); font-size: var(--primary-nav--font-size-button); font-weight: var(--primary-nav--font-weight-button); background-color: transparent; border: none; color: var(--primary-nav--color-link); .dropdown-icon { display: flex; align-items: center; .svg-icon { margin-left: calc(0.25 * var(--global--spacing-unit)); } // Menu icon is off-center vertically to prevent blurry pixels. &.open .svg-icon { position: relative; top: -1px; } &.close { display: none; } } &[aria-expanded*="true"] { .dropdown-icon { &.open { display: none; } &.close { display: flex; .has-logo.has-title-and-tagline & { animation-name: twentytwentyone-close-button-transition; animation-duration: 0.3s; } } } } } // When the menu is open, hide the close button and show the hide button. .primary-navigation-open & { width: 100%; z-index: 500; background-color: var(--global--color-background); #primary-mobile-menu { position: static; } } } .primary-navigation { position: absolute; top: var(--global--admin-bar--height); right: 0; color: var(--primary-nav--color-text); font-size: var(--primary-nav--font-size); line-height: 1.15; margin-top: 0; margin-bottom: 0; // Mobile menu closed > .primary-menu-container { position: fixed; visibility: hidden; opacity: 0; top: 0; right: 0; bottom: 0; left: 0; // Height of the menu-button-container using font size, line height, and total padding, plus 5px so the focus of the first item is visible. padding-top: calc(var(--button--line-height) * var(--primary-nav--font-size-button) + 42px + 5px); padding-left: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); padding-bottom: var(--global--spacing-horizontal); background-color: var(--global--color-background); transform: translateY(var(--global--spacing-vertical)); @media (prefers-reduced-motion: no-preference) { transition: all .15s ease-in-out; } @include media(mobile-only) { height: 100vh; z-index: 499; overflow-x: hidden; overflow-y: auto; border: 2px solid transparent; .has-logo.has-title-and-tagline & { position: fixed; transform: translateY(0) translateX(100%); } .admin-bar .has-logo.has-title-and-tagline & { top: var(--global--admin-bar--height); } .admin-bar & { height: calc(100vh - var(--global--admin-bar--height)); } &:focus { border: 2px solid var(--global--color-primary); } } } // Mobile menu open .primary-navigation-open & { @include media(mobile-only) { width: 100%; position: fixed; z-index: 2; // To be greater than the cover block and embeds. } > .primary-menu-container { position: absolute; visibility: visible; opacity: 1; transform: translateY(0); } } .primary-navigation-open .has-logo.has-title-and-tagline & { @include media(mobile-only) { > .primary-menu-container { transform: translateX(0) translateY(0); } } } @include media(mobile) { position: relative; margin-left: auto; // Hide Mobile menu on desktop > .primary-menu-container { visibility: visible; opacity: 1; position: relative; padding: 0; background-color: transparent; overflow: initial; transform: none; } // Hide mobile menu toggle #toggle-menu { display: none; } // Hide sub-sub-menus > .primary-menu-container ul > li .sub-menu-toggle[aria-expanded="false"] ~ ul { display: none; } // Don't adjust position when logged-in .admin-bar & { top: initial; > .primary-menu-container { top: initial; } } } // Menu list wrapper > div > .menu-wrapper { display: flex; justify-content: flex-start; flex-wrap: wrap; list-style: none; margin: 0; max-width: none; padding-left: 0; position: relative; @include media(mobile-only) { padding-bottom: 100px; ul { padding-left: 0; } } li { display: block; position: relative; width: 100%; @include media(mobile) { margin: 0; width: inherit; &:last-child { margin-right: 0; } } } // Sub-menu buttons .sub-menu-toggle { display: flex; height: calc(2 * var(--primary-nav--padding) + 1.15em + 1px); width: 44px; padding: 0; justify-content: center; align-items: center; background: transparent; color: currentColor; border: none; &:focus { outline: 2px solid var(--wp--style--color--link, var(--global--color-primary)); } @include media(mobile-only) { display: none; } .icon-plus, .icon-minus { height: 100%; display: flex; align-items: center; svg { margin-top: -1px; } } .icon-minus { display: none; } // When the sub-menu is open, display the minus icon &[aria-expanded="true"] { .icon-minus { display: flex; } .icon-plus { display: none; } } } // Sub-menus Flyout > li > .sub-menu { position: relative; @include media(mobile) { @media (prefers-reduced-motion: no-preference) { transition: all 0.5s ease; } } @include media(mobile) { left: 0; margin: 0; min-width: max-content; position: absolute; top: 100%; padding-top: 3px; z-index: 88888; &:before, &:after { content: ""; display: block; position: absolute; width: 0; top: -10px; left: var(--global--spacing-horizontal); border-style: solid; border-color: var(--primary-nav--border-color) transparent; border-width: 0 7px 10px 7px; } &:after { top: -9px; border-color: var(--global--color-background) transparent; } li { background: var(--global--color-background); } &.submenu-reposition-left { /* rtl:ignore */ left: 0; /* rtl:ignore */ right: auto; &:before, &:after { /* rtl:ignore */ left: var(--global--spacing-horizontal); /* rtl:ignore */ right: auto; } } &.submenu-reposition-right { /* rtl:ignore */ right: 0; /* rtl:ignore */ left: auto; &:before, &:after { /* rtl:ignore */ left: auto; /* rtl:ignore */ right: var(--global--spacing-horizontal); } } } } } // Top-level Item Link Colors .primary-menu > .menu-item:hover > a { color: var(--primary-nav--color-link-hover); } .primary-menu-container { @include media(mobile) { // Better align with the site title when the menu wraps. margin-right: calc(0px - var(--primary-nav--padding)); margin-left: calc(0px - var(--primary-nav--padding)); // Top-level Menu Item > ul > .menu-item { display: flex; > a { padding-left: var(--primary-nav--padding); padding-right: var(--primary-nav--padding); + .sub-menu-toggle { margin-left: calc(5px - var(--primary-nav--padding)); } } } } } // Menu Item Link a { display: block; font-family: var(--primary-nav--font-family-mobile); font-size: var(--primary-nav--font-size-mobile); font-weight: var(--primary-nav--font-weight); padding: var(--primary-nav--padding) 0; text-decoration: none; @include media(mobile) { display: block; font-family: var(--primary-nav--font-family); font-size: var(--primary-nav--font-size); font-weight: var(--primary-nav--font-weight); } + svg { fill: var(--primary-nav--color-text); } &:hover, &:link, &:visited { color: var(--primary-nav--color-link-hover); } &:hover { text-decoration: underline; text-decoration-style: dotted; } &:focus { position: relative; z-index: 99999; // Ensure focus styles appear above absolute positioned elements outline-offset: 0; text-decoration-thickness: 2px; } } .current-menu-item > a:first-child, .current_page_item > a:first-child { text-decoration: underline; text-decoration-style: solid; &:hover { text-decoration: underline; text-decoration-style: dotted; } } // Sub-menu depth indicators + text styles .sub-menu { margin: 0; padding: 0; list-style: none; margin-left: var(--primary-nav--padding); border: 1px solid var(--primary-nav--border-color); .sub-menu { border: none; } // Sub-menu items om wide screens. @include media(mobile) { // For nested sub-menus, don't duplicate the padding > .menu-item > .sub-menu { padding: 0; } } .menu-item { @include media(mobile-only) { &:last-child { margin-bottom: 0; } } > a { padding: calc(1.25 * var(--primary-nav--padding)) var(--primary-nav--padding); display: block; font-size: var(--primary-nav--font-size-sub-menu-mobile); font-style: var(--primary-nav--font-style-sub-menu-mobile); @include media(mobile) { font-size: var(--primary-nav--font-size-sub-menu); font-style: var(--primary-nav--font-style); } } } } // Show top-level sub-menu indicators above mobile-breakpoint-only .menu-item-has-children { > .svg-icon { display: none; } @include media(mobile) { > .svg-icon { display: inline-block; height: 100%; } .sub-menu .svg-icon { display: none; } } } .menu-item-description { display: block; clear: both; font-size: var(--global--font-size-xs); text-transform: none; line-height: 1.7; > span { display: inline-block; } } } // Keep the menu pinned to the top when the menu is open. @include media(mobile-only) { .lock-scrolling .site { position: fixed; max-width: 100%; width: 100%; } } // Close button animation for when a custom logo is present. @keyframes twentytwentyone-close-button-transition { from { opacity: 0; } to { opacity: 1; } } assets/sass/06-components/pagination.scss000064400000010337152377522560014477 0ustar00/* Next/Previous navigation */ // All navigation .navigation { color: var(--global--color-primary); a { color: var(--global--color-primary); text-decoration: none; &:hover { color: var(--global--color-primary-hover); text-decoration: underline; text-decoration-style: dotted; } &:focus { color: var(--global--color-secondary); } &:active { color: var(--global--color-primary); } } .nav-links { > * { min-width: 44px; min-height: 44px; } .nav-next a, .nav-previous a { display: flex; flex-direction: column; } .dots { text-align: center; } @include media(tablet) { display: flex; justify-content: center; flex-wrap: wrap; .nav-next, .nav-previous { flex: 0 1 auto; margin-bottom: inherit; margin-top: inherit; max-width: calc(50% - (0.5 * var(--global--spacing-unit))); } .nav-next { text-align: right; } } } .svg-icon { display: inline-block; fill: currentColor; vertical-align: middle; position: relative; } .nav-previous .svg-icon, .prev .svg-icon { top: -2px; margin-right: calc(0.25 * var(--global--spacing-unit)); } .nav-next .svg-icon, .next .svg-icon { top: -1px; margin-left: calc(0.25 * var(--global--spacing-unit)); } } // Singular navigation .post-navigation { margin: var(--global--spacing-vertical) auto; @include media(desktop) { margin: var(--global--spacing-vertical) auto; } @extend %responsive-alignwide-width; .meta-nav { line-height: var(--global--line-height-body); color: var(--global--color-primary); } .post-title { display: inline-block; font-family: var(--global--font-primary); font-size: var(--global--font-size-lg); font-weight: var(--pagination--font-weight-strong); line-height: var(--global--line-height-heading); @include media(desktop) { margin: 5px calc(24px + (0.25 * var(--global--spacing-unit))) 0; } } .nav-links { @include media(mobile) { justify-content: space-between; } } .nav-next, .nav-previous { margin-top: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical); &:first-child { margin-top: 0; } &:last-child { margin-bottom: 0; } } } // Index/archive navigation .pagination, .comments-pagination { border-top: 3px solid var(--global--color-border); padding-top: var(--global--spacing-vertical); margin: var(--global--spacing-vertical) auto; @include media(desktop) { margin: var(--global--spacing-vertical) auto; } @extend %responsive-alignwide-width; // Resets the top margin added to the .nav-links items below. .nav-links { margin-top: calc(-1 * var(--global--spacing-vertical)); a:hover { color: var(--pagination--color-link-hover); } .is-dark-theme & { a:active, a:hover:active, a:hover:focus { color: var(--global--color-background); } } .has-background-white & { a:active, a:hover:active, a:hover:focus { color: var(--global--color-white); } } } .nav-links > * { color: var(--pagination--color-text); font-family: var(--pagination--font-family); font-size: var(--pagination--font-size); font-weight: var(--pagination--font-weight); margin-top: var(--global--spacing-vertical); margin-left: calc(0.66 * var(--global--spacing-unit)); margin-right: calc(0.66 * var(--global--spacing-unit)); &.current { text-decoration: underline; } &:not(.dots):not(.current):hover { text-decoration-style: dotted; } &:first-child { margin-left: 0; } &:last-child { margin-right: 0; } &.next { margin-left: auto; } &.prev { margin-right: auto; } } @include media(desktop-only) { .nav-links { display: flex; flex-wrap: wrap; } .page-numbers { display: none; &.prev, &.next { display: inline-block; flex: 0 1 auto; } } } @include media(mobile-only) { .nav-short { display: none; } } } // Comments pagination .comments-pagination { padding-top: calc(0.66 * var(--global--spacing-vertical)); margin: calc(3 * var(--global--spacing-vertical)) auto; @include media(desktop) { margin: calc(3 * var(--global--spacing-vertical)) auto calc(4 * var(--global--spacing-vertical)) auto; } .nav-links > * { font-size: var(--global--font-size-md); } } assets/sass/06-components/entry.scss000064400000010001152377522560013473 0ustar00.entry-title { color: var(--entry-header--color); font-size: var(--entry-header--font-size); letter-spacing: var(--heading--letter-spacing-h2); line-height: var(--heading--line-height-h2); overflow-wrap: break-word; a { color: var(--entry-header--color-link); text-underline-offset: 0.15em; &:hover { color: var(--entry-header--color-hover); } &:focus { color: var(--entry-header--color-focus); } &:active { color: var(--entry-header--color-link); } } } .singular .entry-title { font-size: var(--global--font-size-page-title); } h1.entry-title { line-height: var(--heading--line-height-h1); font-weight: var(--heading--font-weight-page-title); } /** * Entry Content */ .entry-content, .entry-summary { font-family: var(--entry-content--font-family); } .entry-content { p { word-wrap: break-word; } // Overwrite iframe embeds that have inline styles. > iframe[style] { margin: var(--global--spacing-vertical) 0 !important; max-width: 100% !important; } // Classic editor audio embeds. .wp-audio-shortcode { @extend %responsive-aligndefault-width; } } .entry-footer { color: var(--global--color-primary); clear: both; float: none; font-size: var(--global--font-size-xs); display: block; > span { display: inline-block; } a { color: currentColor; &:hover, &:focus { color: var(--global--color-primary-hover); } &:active { color: currentColor; } } } // Extra specificity to override rules in _vertical-margins.scss .site-main > article > .entry-footer { margin-top: var(--global--spacing-vertical); padding-top: var(--global--spacing-unit); padding-bottom: calc(3 * var(--global--spacing-vertical)); border-bottom: var(--separator--height) solid var(--separator--border-color); } body:not(.single) .site-main > article:last-of-type .entry-footer { border-bottom: var(--separator--height) solid transparent; } .single .site-main > article > .entry-footer { margin-top: calc(3.4 * var(--global--spacing-vertical)); margin-bottom: calc(3.4 * var(--global--spacing-vertical)); padding-bottom: 0; padding-top: calc(0.8 * var(--global--spacing-vertical)); border-top: 3px solid var(--separator--border-color); border-bottom: var(--separator--height) solid transparent; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: calc(2 * var(--global--spacing-horizontal)); .post-taxonomies, .full-size-link { justify-content: flex-end; text-align: right; } .full-size-link:first-child:last-child { grid-column: span 2; } .posted-on, .byline, .cat-links, .tags-links { display: block; } @include media(mobile-only) { display: block; .full-size-link { display: block; } .post-taxonomies, .full-size-link { text-align: left; } } } /** * Post Thumbnails */ .post-thumbnail { @extend %responsive-aligndefault-width; text-align: center; .entry-header &, .singular & { @extend %responsive-alignwide-width-nested; } .wp-post-image { display: block; width: auto; max-width: 100%; margin-left: auto; margin-right: auto; margin-top: calc(2 * var(--global--spacing-vertical)); } } /** * Author */ .author-bio { position: relative; font-size: var(--global--font-size-xs); max-width: var(--responsive--aligndefault-width); .site-main > article > & { margin-top: calc(2 * var(--global--spacing-vertical)); } // Avatars are optional and can be turned off. &.show-avatars { .avatar { display: inline-block; vertical-align: top; border-radius: 50%; } .author-bio-content { display: inline-block; padding-left: var(--global--spacing-horizontal); max-width: calc(var(--responsive--aligndefault-width) - 90px); } } .author-bio-content { .author-title { font-family: var(--entry-author-bio--font-family); font-size: var(--entry-author-bio--font-size); display: inline; } .author-description { font-size: var(--global--font-size-xs); margin-top: calc(0.5 * var(--global--spacing-vertical)); margin-bottom: calc(0.5 * var(--global--spacing-vertical)); } } } assets/js/customize-preview.js000064400000004745152377522560012551 0ustar00/* global twentytwentyoneGetHexLum, jQuery */ ( function() { // Add listener for the "background_color" control. wp.customize( 'background_color', function( value ) { value.bind( function( to ) { var lum = twentytwentyoneGetHexLum( to ), isDark = 127 > lum, textColor = ! isDark ? 'var(--global--color-dark-gray)' : 'var(--global--color-light-gray)', tableColor = ! isDark ? 'var(--global--color-light-gray)' : 'var(--global--color-dark-gray)', stylesheetID = 'twentytwentyone-customizer-inline-styles', stylesheet, styles; // Modify the html & body classes depending on whether this is a dark background or not. if ( isDark ) { document.body.classList.add( 'is-dark-theme' ); document.documentElement.classList.add( 'is-dark-theme' ); document.body.classList.remove( 'is-light-theme' ); document.documentElement.classList.remove( 'is-light-theme' ); document.documentElement.classList.remove( 'respect-color-scheme-preference' ); } else { document.body.classList.remove( 'is-dark-theme' ); document.documentElement.classList.remove( 'is-dark-theme' ); document.body.classList.add( 'is-light-theme' ); document.documentElement.classList.add( 'is-light-theme' ); if ( wp.customize( 'respect_user_color_preference' ).get() ) { document.documentElement.classList.add( 'respect-color-scheme-preference' ); } } // Toggle the white background class. if ( 225 <= lum ) { document.body.classList.add( 'has-background-white' ); } else { document.body.classList.remove( 'has-background-white' ); } stylesheet = jQuery( '#' + stylesheetID ); styles = ''; // If the stylesheet doesn't exist, create it and append it to . if ( ! stylesheet.length ) { jQuery( '#twenty-twenty-one-style-inline-css' ).after( '' ); stylesheet = jQuery( '#' + stylesheetID ); } // Generate the styles. styles += '--global--color-primary:' + textColor + ';'; styles += '--global--color-secondary:' + textColor + ';'; styles += '--global--color-background:' + to + ';'; styles += '--button--color-background:' + textColor + ';'; styles += '--button--color-text:' + to + ';'; styles += '--button--color-text-hover:' + textColor + ';'; styles += '--table--stripes-border-color:' + tableColor + ';'; styles += '--table--stripes-background-color:' + tableColor + ';'; // Add the styles. stylesheet.html( ':root{' + styles + '}' ); } ); } ); }() ); assets/js/editor.js000064400000001631152377522560010325 0ustar00/* global setTimeout */ wp.domReady( function() { // Unregister "Wide" Separator Style. wp.blocks.unregisterBlockStyle( 'core/separator', 'wide' ); // Add to ".block-editor__typewriter" the "is-dark-theme" class if needed. function twentytwentyoneCopyDarkThemeClass() { var editor, attemptDelay = 25, attempt = 0, maxAttempts = 10; if ( ! document.body.classList.contains( 'is-dark-theme' ) ) { return; } editor = document.querySelector( '.block-editor__typewriter' ); if ( null === editor ) { // Try again. if ( attempt < maxAttempts ) { setTimeout( function() { twentytwentyoneCopyDarkThemeClass(); }, attemptDelay ); // Increment the attempts counter. attempt++; // Double the delay, give the server some time to breathe. attemptDelay *= 2; } return; } editor.classList.add( 'is-dark-theme' ); } twentytwentyoneCopyDarkThemeClass(); } ); assets/js/responsive-embeds.js000064400000002147152377522560012474 0ustar00/** * File responsive-embeds.js. * * Make embeds responsive so they don't overflow their container. */ /** * Add max-width & max-height to