@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.6 Requires PHP: 5.6 Version: 2.3 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, blog, portfolio Twenty Twenty-One WordPress Theme, (C) 2020 WordPress.org Twenty Twenty-One is distributed under the terms of the GNU GPL. */ @import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap'); @import url("https://fonts.googleapis.com/css2?family=Archivo:wght@300;400;500;600;700;800&family=Old+Standard+TT:wght@400;700&display=swap"); /* Variables */ :root { /* Font Family */ --global--font-primary: var(--font-headings, -apple-system, BlinkMacSystemFont, "Noto Sans", serif); --global--font-secondary: var(--font-base, -apple-system, BlinkMacSystemFont, "Noto 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-h5); /* 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--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-sm); --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; } } /*! 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:none; } /** * 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 */ 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 */ :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 */ .post-thumbnail, .entry-content .wp-audio-shortcode, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), *[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .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-main, .widget-area, .site-footer { /*padding-top: var(--global--spacing-vertical); padding-bottom: var(--global--spacing-vertical);*/ margin-left: auto; margin-right: auto; } /** * 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-footer { margin-top: var(--global--spacing-vertical); margin-right: auto; margin-bottom: var(--global--spacing-vertical); margin-left: auto; } .author-bio { margin-top: 0; margin-right: auto; margin-bottom: var(--global--spacing-vertical); margin-left: auto; position: relative; font-size: var(--global--font-size-xs); max-width: 100%; float: left; width: 100%; } .author-bio .author-link{ display:none; } /* * 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 > *.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); 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: "โ€œ"; 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-style: var(--quote--font-style-cite); } @media only screen and (max-width: 481.98px) { 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; } .entry-content > code { display: block; } /* * 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 { color: var(--tg-theme-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); } /** * 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: flow-root; } .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: 481.98px) { .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:where(:not([class*=-font-size]):not([style*=font-size])) .wp-block-latest-comments__comment { font-size: var(--global--font-size-sm); } .wp-block-latest-comments .wp-block-latest-comments__comment { 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: inherit; font-size: inherit; } .wp-block-latest-comments .wp-block-latest-comments__comment-excerpt p { font-size: inherit; 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.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 .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; 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__submenu-icon { display: none; } .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; } .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; font-size: var(--pullquote--font-size); font-style: var(--pullquote--font-style); font-weight: 700; letter-spacing: var(--pullquote--letter-spacing); /** * 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: inherit; font-style: inherit; font-weight: inherit; letter-spacing: inherit; line-height: inherit; margin: 0; } .wp-block-pullquote:where(:not([style*=line-height])) p { line-height: var(--pullquote--line-height); } .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; 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); /** * Block Options */ } .wp-block-quote p { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; line-height: inherit; letter-spacing: inherit; } .wp-block-quote:before { content: "โ€œ"; left: 8px; } .wp-block-quote .wp-block-quote__citation, .wp-block-quote cite, .wp-block-quote footer { font-family: inherit; font-style: inherit; font-weight: inherit; line-height: inherit; letter-spacing: inherit; } .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:where(:not([style*=font-style])) .wp-block-quote__citation, .wp-block-quote:where(:not([style*=font-style])) cite, .wp-block-quote:where(:not([style*=font-style])) footer { font-style: var(--quote--font-style-cite); } .wp-block-quote:where(:not([style*=font-weight])) .wp-block-quote__citation, .wp-block-quote:where(:not([style*=font-weight])) cite, .wp-block-quote:where(:not([style*=font-weight])) footer { font-weight: normal; } .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: "โ€"; 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: 481.98px) { .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: 481.98px) { .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)); margin-left: 0; 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; } 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; } .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: calc(var(--primary-nav--padding) - 0.3em);*/ } } .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; */ text-align: center; } .site-header > .site-logo { width: 100%; /*padding-bottom: calc(var(--global--spacing-vertical) * 1.5); border-bottom: 1px solid;*/ text-align: center; } @media only screen and (max-width: 990px) { .site-logo { text-align: left; } } @media only screen and (max-width: 481.98px) { .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: 481.98px) { .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: 481.98px) { .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); display: flex; } .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%; max-width:60px; max-height:60px; } .author-bio.show-avatars .author-bio-content { display: inline-block; padding-left: 15px; 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 { margin-top: 5px; margin-bottom: calc(0.5 * var(--global--spacing-vertical)); font-size: 14px !important; } .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; } .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: 481.98px) { .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: 481.98px) { .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: 481.98px) { .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: 481.98px) { .primary-navigation-open .primary-navigation { width: 100%; position: fixed; z-index: 2; } } .primary-navigation-open .primary-navigation > .primary-menu-container { position: relative; visibility: visible; opacity: 1; transform: translateY(0); } @media only screen and (max-width: 481.98px) { .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: 481.98px) { .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: 481.98px) { .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; } .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: 481.98px) { .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: 481.98px) { .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: none; 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: 821.98px) { .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: 481.98px) { .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: 481.98px) { .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)); padding: 10px; } .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)); padding: 10px; } .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-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-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: 481.98px) { .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; } .is-IE .wp-block-group:before, .is-IE .wp-block-group:after { content: ""; display: block; clear: both; } /************** custom css ********************/ .site { position: relative; } .site-content { padding-top: 126px; padding-bottom: 50px; } .offCanvas__logo img { max-height: 34px; } .tgmobile__menu .nav-logo img, .tgmobile__menu .site-logo img { max-height: 28px; max-width: none; width: auto; } @media (max-width: 1200px) { .site-content { padding-top: 110px; } } @media (max-width: 990px) { .site-content { padding-top: 74px; } } /*============================================ /* 01. Theme Default CSS ==============================================*/ :root { --tg-body-font-family: "Noto Sans", serif; /*--tg-heading-font-family: 'Old Standard TT', serif; --tg-body-font-family: 'Archivo', sans-serif;*/ --tg-heading-font-family: "Noto Sans", serif; --tg-icon-font-family: "Font Awesome 5 Free"; --tg-body-font-size: 16px; --tg-body-line-height: 1.5; --tg-heading-line-height: 1.2; --tg-body-color: #424242; --tg-heading-color: #222222; --tg-theme-primary: #8143B1; --tg-theme-secondary: #000000; --tg-color-dark-blue: #222222; --tg-color-yellow-light: #FEF6E6; --tg-color-yellow-light-2: #FFFBF3; --tg-color-white-default: #ffffff; --tg-theme-white:#ffffff; --tg-color-gray-1: #f1f1f1; --tg-color-gray-2: #B8B9DA; --tg-color-gray-3: #ECF6FA; --tg-color-gray-4: #818298; --tg-color-gray-5: #E2E3F1; --tg-color-gray-6: #F7F7F8; --tg-color-dark: #1C1A4A; --tg-color-black-1: #06042E; --tg-color-black-2: #161439; --tg-border-1: #CFDDE2; --tg-border-2: #E6E7F3; --tg-border-3: #C5C6E4; --tg-border-4: #DBE3EB; --tg-border-5: #9597C8; --tg-border-6: #DADBEC; --tg-fw-extra-bold: 800; --tg-fw-bold: 700; --tg-fw-semi-bold: 600; --tg-fw-medium: 500; --tg-fw-regular: 400; --tg-fw-light: 300; } /*============================= Typography css start ===============================*/ body { overflow-x: hidden; font-family: var(--tg-body-font-family); font-size: var(--tg-body-font-size); font-weight: var(--tg-fw-regular); color: var(--tg-body-color); line-height: var(--tg-body-line-height); } img, .img { max-width: 100%; transition: all 0.3s ease-out 0s; aspect-ratio: auto 640 / 360; } a, button { color: var(--tg-theme-primary); outline: none; text-decoration: none; transition: all 0.3s ease-out 0s; } a:focus, .btn:focus, .button:focus { text-decoration: none; outline: none; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; } a:hover, button:hover { color: var(--tg-theme-primary) !important; text-decoration: none; } button:focus, input:focus, input:focus, textarea, textarea:focus { outline: 0; } h1, h2, h3, h4, h5, h6 { font-family: var(--tg-heading-font-family); color: var(--tg-heading-color); margin-top: 0px; font-weight: var(--tg-fw-semi-bold); line-height: var(--tg-heading-line-height); /*text-transform: capitalize;*/ margin-bottom: 30px; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; } h1 { font-size: 46px; line-height: 48px; } h2 { font-size: 42px; line-height: 44px; } h3 { font-size: 36px; line-height: 38px; } h4 { font-size: 32px; line-height: 36px; } h5 { font-size: 22px; line-height: 26px; margin-bottom: 15px; } h6 { font-size: 20px; line-height: 26px; } .title-20{ font-size: 20px; } .title-24{ font-size: 24px; } .title-26{ font-size: 26px; } .title-28{ font-size: 28px; } .title-30{ font-size: 30px; } .title-32{ font-size: 32px; } .title-36{ font-size: 36px; } .title-40{ font-size: 40px; } .title-42{ font-size: 42px; } .title-46{ font-size: 46px; } .list-wrap { margin: 0px; padding: 0px; } .list-wrap li { list-style: none; } p { font-family: var(--tg-body-font-family); font-size: var(--tg-body-font-size); line-height: var(--tg-body-line-height); font-weight: var(--tg-fw-regular); color: var(--tg-body-color); margin-bottom: 20px; line-height: 24px; } hr { border-bottom: 1px solid var(--tg-color-gray-1); border-top: 0 none; margin: 30px 0; padding: 0; } label { color: var(--tg-heading-color); cursor: pointer; font-size: var(--tg-body-font-size); font-weight: var(--tg-fw-regular); } input[type=color] { appearance: none; -moz-appearance: none; -webkit-appearance: none; background: none; border: 0; cursor: pointer; height: 100%; width: 100%; padding: 0; border-radius: 50%; } *::-moz-selection { background: var(--tg-theme-primary); color: var(--tg-color-white-default); text-shadow: none; } ::-moz-selection { background: var(--tg-theme-primary); color: var(--tg-color-white-default); text-shadow: none; } ::selection { background: var(--tg-theme-primary); color: var(--tg-color-white-default); text-shadow: none; } /*============================= - Input Placeholder ===============================*/ input, textarea { color: var(--tg-body-color); } *::-moz-placeholder { color: var(--tg-body-color); font-size: var(--tg-body-font-size); opacity: 1; } *::placeholder { color: var(--tg-body-color); font-size: var(--tg-body-font-size); opacity: 1; } /*============================= - Common Classes ===============================*/ .fix { overflow: hidden; position: relative; min-height: 600px; } .fix.about { overflow: visible; position: relative; } .clear { clear: both; } p.uppercase{ text-transform: uppercase; } /*============================= - Bootstrap Custom =============================*/ .container { padding-left: 15px; padding-right: 15px; } .row { --bs-gutter-x: 30px; } .gutter-y-30 { --bs-gutter-y: 30px; } .gx-0 { --bs-gutter-x: 0; } .gutter-24 { --bs-gutter-x: 24px; } .container { max-width: 1250px; } @media (max-width: 1500px) { .container { max-width: 1250px; } } @media (max-width: 1199.98px) { .container { max-width: 960px; } } @media (max-width: 991.98px) { .container { max-width: 720px; } } @media (max-width: 767.98px) { .container { max-width: 100%; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .container { max-width: 570px; } } .custom-container { max-width: 1760px; } @media (max-width: 1800px) { .custom-container { max-width: 1680px; } } @media (max-width: 1500px) { .custom-container { max-width: 100%; } } @media (max-width: 1199.98px) { .custom-container { max-width: 100%; } } @media (max-width: 991.98px) { .custom-container { max-width: 720px; } } @media (max-width: 767.98px) { .custom-container { max-width: 100%; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .custom-container { max-width: 540px; } } .custom-container-two { max-width: 1740px; } @media (max-width: 1800px) { .custom-container-two { max-width: 1540px; } } @media (max-width: 1500px) { .custom-container-two { max-width: 100%; } } @media (max-width: 1199.98px) { .custom-container-two { max-width: 960px; } } @media (max-width: 991.98px) { .custom-container-two { max-width: 720px; } } @media (max-width: 767.98px) { .custom-container-two { max-width: 100%; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .custom-container-two { max-width: 540px; } } .include-bg { background-position: center; background-size: cover; background-repeat: no-repeat; } /*============================= 1. Button style ===============================*/ .tg-button-wrap { display: flex; } .btn { -webkit-user-select: none; user-select: none; -moz-user-select: none; background: var(--tg-theme-primary) none repeat scroll 0 0; border: medium none; border-radius: 0px; color: var(--tg-color-white-default); cursor: pointer; display: inline-flex; align-items: center; font-size: 14px; font-weight: 400; letter-spacing: 0; line-height: 1; margin-bottom: 0; padding: 18px 24px; text-align: center; text-transform: uppercase; touch-action: manipulation; transition: all 0.3s ease-out 0s; vertical-align: middle; white-space: nowrap; position: relative; overflow: hidden; z-index: 1; } .btn::before { content: ""; position: absolute; transition-duration: 800ms; width: 200%; height: 200%; top: 110%; left: 50%; background: var(--tg-theme-secondary); transform: translateX(-50%); border-radius: 50%; z-index: -1; } /*.btn::after { content: "\f10a"; font-family: flaticon; font-weight: var(--tg-fw-bold); margin-left: 8px; font-size: 20px; line-height: 0; transition: all 0.3s ease-out 0s; --arrow-hover-move-x: 110%; --arrow-hover-move-y: 100%; }*/ .btn:hover, .btn:focus-visible { color: var(--tg-color-white-default); background: var(--tg-theme-primary); } .btn:hover:before, .btn:focus-visible:before { top: -40%; } /*.btn:hover:after{ transform: translateX(var(--arrow-hover-move-x)) translateY(calc(-1 * var(--arrow-hover-move-y))); transition-delay: 0.15s, 0.15s; }*/ /******************************/ .btn__arrow { display: inline-block; vertical-align: middle; position: relative; width: 18px; height:18px; margin-left: 10px; margin-top: -5px; overflow: hidden; --arrow-hover-move-x: 110%; --arrow-hover-move-y: 0%; } .btn__arrow i{ font-size: 24px; } .btn__arrow__arrow { position: absolute; top: 0; right: 0; height: 1rem; transition: transform 0.38s cubic-bezier(0.37, 0.08, 0.02, 0.93), opacity 0.18s ease-out; } .btn__arrow__arrow svg { fill: #fff; width: 18px; } .btn__arrow__arrow--main { transform: translateX(0) translateY(0); opacity: 1; transition-delay: 0.15s, 0.15s; } .btn__arrow__arrow--hover { transform: translateX(calc(-1 * var(--arrow-hover-move-x))) translateY(var(--arrow-hover-move-y)); opacity: 0.5; transition-delay: 0s, 0s; } .btn:hover .btn__arrow__arrow--main { transform: translateX(var(--arrow-hover-move-x)) translateY(calc(-1 * var(--arrow-hover-move-y))); opacity: 0; transition-delay: 0s, 0s; } .btn:hover .btn__arrow__arrow--hover { transform: translateX(0) translateY(0); opacity: 1; transition-delay: 0.15s, 0.15s; } /**************/ .button-next, .button-prev{ display: inline-block; cursor: pointer; vertical-align: middle; position: relative; z-index: 1; width: 60px; height: 60px; border-radius: 50%; background: var(--tg-theme-primary); color: var(--tg-color-white-default); line-height: 0; margin-left: 10px; margin-top: -5px; overflow: hidden; --arrow-hover-move-x: 110%; --arrow-hover-move-y: 0%; } .button-next::before, .button-next::after{ transition: transform 0.38s cubic-bezier(0.37, 0.08, 0.02, 0.93), opacity 0.18s ease-out; } .button-next::before { content: "\f10a"; font-family: flaticon; font-weight: var(--tg-fw-bold); margin-left: 8px; font-size: 28px; transform: translateX(0) translateY(0); opacity: 1; transition-delay: 0.15s, 0.15s; position: absolute; top: 0; right: 0; width: 60px; height: 60px; line-height: 60px; text-align: center; } .button-next::after { content: "\f10a"; font-family: flaticon; font-weight: var(--tg-fw-bold); margin-left: 8px; font-size: 28px; transform: translateX(calc(-1 * var(--arrow-hover-move-x))) translateY(var(--arrow-hover-move-y)); opacity: 0.5; transition-delay: 0s, 0s; position: absolute; top: 0; right: 0; width: 60px; height: 60px; line-height: 60px; text-align: center; } .button-next:hover{ background: var(--tg-theme-secondary); color: var(--tg-color-white-default); } .button-next:hover::before { transform: translateX(var(--arrow-hover-move-x)) translateY(calc(-1 * var(--arrow-hover-move-y))); opacity: 0; transition-delay: 0s, 0s; } .button-next:hover::after { transform: translateX(0) translateY(0); opacity: 1; transition-delay: 0.15s, 0.15s; } /***********/ .button-prev{ transform: rotate(180deg); } .button-prev::before, .button-prev::after{ transition: transform 0.38s cubic-bezier(0.37, 0.08, 0.02, 0.93), opacity 0.18s ease-out; } .button-prev::before { content: "\f10a"; font-family: flaticon; font-weight: var(--tg-fw-bold); margin-left: 8px; font-size: 28px; transform: translateX(0) translateY(0); opacity: 1; transition-delay: 0.15s, 0.15s; position: absolute; top: 0; right: 0; width: 60px; height: 60px; line-height: 60px; text-align: center; } .button-prev::after { content: "\f10a"; font-family: flaticon; font-weight: var(--tg-fw-bold); margin-left: 8px; font-size: 28px; transform: translateX(calc(-1 * var(--arrow-hover-move-x))) translateY(var(--arrow-hover-move-y)); opacity: 0.5; transition-delay: 0s, 0s; position: absolute; top: 0; right: 0; width: 60px; height: 60px; line-height: 60px; text-align: center; } .button-prev:hover{ background: var(--tg-theme-secondary); color: var(--tg-color-white-default); } .button-prev:hover::before { transform: translateX(var(--arrow-hover-move-x)) translateY(calc(-1 * var(--arrow-hover-move-y))); opacity: 0; transition-delay: 0s, 0s; } .button-prev:hover::after { transform: translateX(0) translateY(0); opacity: 1; transition-delay: 0.15s, 0.15s; } /*************************************/ .btn-two { background: var(--tg-theme-secondary); } .btn-two:hover { background: var(--tg-theme-secondary); } .btn-two::before { background: var(--tg-theme-primary); } .border-btn { border: 1px solid var(--tg-theme-secondary); background: transparent; color: var(--tg-theme-secondary); padding: 17px 24px; } .border-btn::before { display: none; } .border-btn:hover { background: var(--tg-theme-secondary); } /*============================= 00. Preloader ===============================*/ #preloader { background-color: var(--tg-color-white-default); height: 100%; width: 100%; position: fixed; margin-top: 0px; top: 0px; z-index: 1; } #preloader .loader .loader-container { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100px; height: 100px; border: 3px solid var(--tg-color-gray-1); border-radius: 50%; } #preloader .loader .loader-container::before { position: absolute; content: ""; display: block; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100px; height: 100px; border-top: 3px solid var(--tg-theme-primary); border-radius: 50%; animation: loaderspin 1.8s infinite ease-in-out; -webkit-animation: loaderspin 1.8s infinite ease-in-out; } #preloader .loader .loader-icon { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 80px; text-align: center; } #preloader .loader .loader-icon img, #preloader .loader .loader-icon svg{ animation: loaderpulse alternate 900ms infinite; width: 40px; } @keyframes loaderspin { 0% { transform: translate(-50%, -50%) rotate(0deg); } 100% { transform: translate(-50%, -50%) rotate(360deg); } } @keyframes loaderpulse { 0% { transform: scale(1); } 100% { transform: scale(1.2); } } /*============================= - Background color ===============================*/ .grey-bg { background: var(--tg-color-gray-1); } .white-bg { background: var(--tg-color-white-default); } .black-bg { background: var(--tg-color-black-1); } /*============================= 04. OffCanvas ===============================*/ .offCanvas__info { background: var(--tg-color-white-default) none repeat scroll 0 0; height: 100%; padding: 30px; position: fixed; left: 0; top: 0; transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); -moz-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); -webkit-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); -ms-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); -o-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); width: 340px; z-index: 999; /*overflow-y: scroll;*/ transform: translateX(-100%); } .offCanvas__info.active { transform: translateX(0); } .offCanvas__info::-webkit-scrollbar { width: 0px; } .offCanvas__close-icon { margin-top: -16px; text-align: right; } .offCanvas__close-icon button { background: transparent; border: 0 none; color: var(--tg-theme-primary); cursor: pointer; font-size: 20px; padding: 0; } .offCanvas__logo img { max-height: 34px; } .offCanvas__side-info { border-top: 1px solid var(--tg-theme-primary); padding-top: 25px; } .offCanvas__side-info .contact-list h4 { color: var(--tg-heading-color); font-weight: 700; font-size: 18px; } .offCanvas__side-info .contact-list p { color: var(--tg-body-color); margin: 0; margin-bottom: 2px; line-height: 26px; } .offCanvas__social-icon a { color: var(--tg-theme-primary); display: inline-block; margin-right: 20px; text-align: center; float:left; } .offCanvas__social-icon a:hover { color: var(--tg-theme-secondary); } .offCanvas__overly { position: fixed; background: #000; top: 0; left: 0; height: 100%; width: 100%; z-index: 99; opacity: 0; visibility: hidden; transition: all 0.3s ease-out 0s; } .offCanvas__overly.active { opacity: 0.7; visibility: visible; } /*============================= 04. Search ===============================*/ .search__popup { padding-top: 20px; padding-bottom: 40px; position: fixed; top: 0; left: 0; right: 0; width: 100%; background: var(--tg-color-white-default); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); z-index: 99; transform: translateY(calc(-100% - 80px)); transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out; transition-delay: 0.5s; } .search__popup.search-opened { transform: translateY(0%); transition-delay: 0s; z-index: 99999999; } .search__popup.search-opened .search__input { transform: translateY(0px); opacity: 1; transition-delay: 0.3s; } .search__popup.search-opened .search__input::after { width: 100%; transition-delay: 0.5s; } .search__input { position: relative; height: 80px; transform: translateY(-40px); transition: all 0.3s ease-out 0s; transition-delay: 0.5s; opacity: 0; } .search__input::after { position: absolute; content: ""; left: 0; bottom: 0; width: 0%; height: 1px; background-color: var(--tg-theme-primary); transition-delay: 0.3s; transition: all 0.3s ease-out 0s; } .search__input input { width: 100%; height: 100%; background-color: transparent; border: 0; outline: 0; font-size: 24px; color: var(--tg-heading-color); border-bottom: 1px solid transparent; padding: 0; padding-right: 30px; } .search__input input::-moz-placeholder { font-size: 24px; } .search__input input::placeholder { font-size: 24px; } .search__input button { position: absolute; top: 50%; right: 0; transform: translateY(-50%); font-size: 18px; color: var(--tg-theme-primary); border: none; padding: 0 0; background: transparent; border-radius: 50px; height: 40px; width: 40px; line-height: 40px; text-align: center; } .search__input button:hover, .search__input button:focus{ background: var(--tg-theme-primary); color: #fff; } .search__input span.mic { position: absolute; top: 50%; right: 50px; transform: translateY(-50%); cursor: pointer; background: transparent; color: var(--tg-theme-primary); border-radius: 50px; height: 40px; width: 40px; line-height: 40px; text-align: center; } .search__input span.mic:hover, .search__input span.mic:focus{ background: var(--tg-theme-primary); color: #fff; } .search__input span.mic.active{ background: var(--tg-theme-primary); color: #fff; } .search__input span.mic.active::after { content: ""; position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; border: 1px solid var(--tg-theme-primary); background: var(--tg-theme-primary); border-radius: 50%; transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); animation: pulse-border 1500ms ease-out infinite; z-index: -1; } .tgmobile__search .search__input{ opacity: 1; transform: translateY(-0px); } .search__close { position: absolute; top: 10%; right: 2%; z-index: 2; } .search-close-btn { margin: 0; padding: 0; border: none; color: var(--tg-theme-primary); cursor: pointer; background: transparent; } .search-popup-overlay { position: fixed; right: 0; top: 0; width: 100%; height: 100%; z-index: 4; transition: all 0.3s ease-out 0s; transition-delay: 0.5s; opacity: 0; visibility: hidden; background: #000d25; } .search-popup-overlay.search-popup-overlay-open { opacity: 0.55; visibility: visible; transition-delay: 0s; } .search-input-field ~ .search-focus-border { position: absolute; bottom: 0; left: auto; right: 0; width: 0; height: 1px; background-color: var(--tg-theme-primary); transition: all 0.5s; } .search-input-field:focus ~ .search-focus-border { width: 100%; left: 0; right: auto; transition: all 0.5s; } /*========================= 04. Breadcrumb ===========================*/ .breadcrumb__bg { background-size: cover; background-position: center; padding: 40px 0 40px; position: relative; z-index: 2; } @media (max-width: 991.98px) { .breadcrumb__bg { padding: 40px 0 40px; } } .breadcrumb__content .title { font-family: var(--tg-heading-font-family); color: var(--tg-heading-color); margin-top: 0px; font-weight: var(--tg-fw-bold); line-height: var(--tg-heading-line-height); margin-bottom: 10px; font-size: 28px; text-transform: capitalize; } @media (max-width: 991.98px) { .breadcrumb__content .title { font-size: 26px; } } @media (max-width: 767.98px) { .breadcrumb__content .title { font-size: 24px; } } .breadcrumb__content .breadcrumb { margin-bottom: 0; justify-content: center; } .breadcrumb__content .breadcrumb-item { font-size: 16px; color: var(--tg-theme-primary); text-transform: capitalize; } .breadcrumb__content .breadcrumb-item a { color: var(--tg-body-color); } .breadcrumb__content .breadcrumb-item a:hover { color: var(--tg-theme-primary); } .breadcrumb__shape img { position: absolute; z-index: -1; } .breadcrumb__shape img:nth-child(1) { left: 8%; bottom: 20%; animation: rightToLeft 4s infinite linear; } @media (max-width: 767.98px) { .breadcrumb__shape img:nth-child(1) { left: 10%; bottom: 10%; } } .breadcrumb__shape img:nth-child(3) { left: 23%; bottom: 0; } .breadcrumb__shape img:nth-child(4) { right: 42%; top: 0; } @media (max-width: 767.98px) { .breadcrumb__shape img:nth-child(4) { display: none; } } .breadcrumb__shape img:nth-child(2) { right: 25%; top: 15%; } @media (max-width: 767.98px) { .breadcrumb__shape img:nth-child(2) { display: none; } } .breadcrumb-item + .breadcrumb-item { padding-left: 10px; } .breadcrumb-item + .breadcrumb-item::before { padding-right: 10px; color: var(--tg-body-color); content: "\f054"; font-family: var(--tg-icon-font-family); font-weight: 700; font-size: 14px; line-height: 1; margin-top: 6px; } /*============================= 00. Scroll Top ===============================*/ .scroll__top { width: 40px; height: 40px; line-height: 40px; text-align: center; position: fixed; bottom: -10%; right: 50px; font-size: 16px; border-radius: 0px; z-index: 5; color: var(--tg-color-white-default); text-align: center; cursor: pointer; background: var(--tg-theme-primary); transition: 1s ease; border: none; } @media (max-width: 1199.98px) { .scroll__top { right: 25px; bottom: 25px; } } @media (max-width: 991.98px) { .scroll__top { right: 30px; } } @media (max-width: 767.98px) { .scroll__top { display:none; right: 5px; width: 48px; height: 48px; line-height: 30px; text-align: center; } } .scroll__top.open { bottom: 80px; } @media (max-width: 767.98px) { .scroll__top.open { bottom: 85px; right:5px; } .fixed-bottom-right a.btn { /*padding: 10px;*/ margin-bottom: 8px; right: 5px; font-size: 12px; } } .scroll__top::after { position: absolute; z-index: -1; content: ""; top: 100%; left: 5%; height: 10px; width: 90%; opacity: 1; background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%); } .scroll__top:hover { background: var(--tg-theme-secondary); color: var(--tg-color-white-default); } /*============================= 00. Section Title ===============================*/ .section-title .sub-title { display: block; text-transform: uppercase; font-size: 15px; font-weight: 400; line-height: normal; color: var(--tg-body-color); margin-bottom: 12px; } .section-title .title { font-size: 42px; text-transform: unset; } .about__content-three .section-title h1.title { font-size: 46px; line-height: 46px; margin-bottom: 20px; } .project-area .section-title .title { font-size: 46px; } .contact__content .section-title .title { margin-bottom: 0; font-size: 42px; } .services__area-five .section-title .title { font-size: 36px; text-transform: capitalize; line-height: 36px; } .services__area-five .section-title h3.title { font-size: 36px; line-height: 36px; text-transform: capitalize; } @media (max-width: 768px) { .project-area .section-title .title { font-size: 28px; } .contact__content .section-title .title { font-size: 28px; } .services__area-five .section-title .title { font-size: 28px; } } .language__area-seven .section-title .title { margin-bottom: 20px; font-size: 46px; text-transform: unset; line-height: 46px; } .about__content-seven h1.title { font-size: 46px; line-height: 46px; } .services__area-seven .section-title .title { margin-bottom: 40px; text-transform: unset; } @media (max-width: 1199.98px) { .section-title h1.title { font-size: 30px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .section-title .title { font-size: 28px; } } @media (max-width: 991.98px) { .section-title .title br { display: none; } } .section-title p { margin-bottom: 0; margin-bottom: 20px; } @media (max-width: 767.98px) { .section-title p br { display: none; } } .section-title.white-title .title { color: var(--tg-color-white-default); } /*============================= 02. Header ===============================*/ .transparent-header { position: absolute; left: 0; top: 0px; width: 100%; z-index: 9; height: auto; } .tg-header__top { background: var(--tg-color-dark-blue); padding: 12px 0; } @media (max-width: 767.98px) { .tg-header__top { display: none; } } .tg-header__top-info { display: flex; align-items: center; gap: 25px; } @media (max-width: 1199.98px) { .tg-header__top-info { gap: 15px; } } @media (max-width: 991.98px) { .tg-header__top-info { justify-content: center; margin-bottom: 10px; } } .tg-header__top-info li { display: flex; align-items: center; gap: 8px; color: var(--tg-color-gray-1); font-size: 14px; font-weight: 500; } .tg-header__top-info li i { color: var(--tg-color-gray-2); font-size: 18px; line-height: 0; } .tg-header__top-info li a { color: var(--tg-color-gray-1); } .tg-header__top-info li a:hover { color: var(--tg-theme-primary); } .tg-header__top-info-three li { color: var(--tg-body-color); } .tg-header__top-info-three li i { color: var(--tg-color-gray-4); } .tg-header__top-info-three li a { color: var(--tg-body-color); } .tg-header__top-info-three li a:hover { color: var(--tg-theme-primary); } .tg-header__top-right { display: flex; align-items: center; justify-content: flex-end; gap: 25px; } @media (max-width: 1199.98px) { .tg-header__top-right { gap: 15px; } } @media (max-width: 991.98px) { .tg-header__top-right { justify-content: center; } } .tg-header__top-right li { display: flex; align-items: center; gap: 8px; color: var(--tg-color-gray-1); font-size: 14px; font-weight: 500; } .tg-header__top-right li i { color: var(--tg-color-gray-2); font-size: 18px; line-height: 0; } .tg-header__top-right li a { color: var(--tg-color-gray-1); } .tg-header__top-right li a:hover { color: var(--tg-theme-primary); } .tg-header__top-right-three li { color: var(--tg-body-color); } .tg-header__top-right-three li i { color: var(--tg-color-gray-4); } .tg-header__top-right-three li a { color: var(--tg-body-color); } .tg-header__top-right-three li a:hover { color: var(--tg-theme-primary); } .tg-header__top-two { padding: 15px 30px; border-bottom: 1px solid var(--tg-color-gray-5); background: transparent; } @media (max-width: 1199.98px) { .tg-header__top-two { padding: 15px 20px; } } .tg-header__top-two .list-wrap li { color: var(--tg-body-color); font-size: 15px; font-weight: 400; } .tg-header__top-two .list-wrap li i { color: var(--tg-color-gray-4); font-size: 20px; line-height: 0; } @media (max-width: 1199.98px) { .tg-header__top-two .list-wrap li i { font-size: 18px; } } .tg-header__top-two .list-wrap li a { color: var(--tg-body-color); } .tg-header__top-two .list-wrap li a:hover { color: var(--tg-theme-primary); } .tg-header__top-three { background: transparent; padding: 20px 0; } .tg-header__inner-wrap { display: flex; align-items: center; } .tg-header__logo-wrap { width: 12.5%; flex: 0 0 auto; text-align: center; } @media (max-width: 1199.98px) { .tg-header__logo-wrap { display: none; } } .tg-header__right-side { flex-grow: 1; border-left: 1px solid var(--tg-color-gray-5); } .tg-header__area { background: rgba(255, 255, 255, 0.3); box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 5px 0px; width:100%; } @media (max-width: 991.98px) { .tg-header__area { padding: 10px 0; } } .tg-header__area-two { padding: 0 30px; } @media (max-width: 1199.98px) { .tg-header__area-two { padding: 0 20px; } } @media (max-width: 991.98px) { .tg-header__area-two { padding: 20px 20px; } } @media (max-width: 767.98px) { .tg-header__area-two { padding: 20px 15px; } } @media (max-width: 1199.98px) { .tg-header__area-two .logo.d-none { display: flex !important; align-items: center; } } .tg-header__area-two .tgmenu__nav { align-items: normal; } @media (max-width: 991.98px) { .tg-header__area-two .tgmenu__nav { align-items: center; } } .tg-header__area-two .tgmenu__navbar-wrap ul { margin: 0; } @media (max-width: 1199.98px) { .tg-header__area-two .tgmenu__navbar-wrap ul { margin: 0 0 0 auto; } } .tg-header__area-two .tgmenu__navbar-wrap ul li a { padding: 37px 0px; } .tg-header__area-two.sticky-menu .logo.d-none { display: flex !important; align-items: center; margin-right: 100px; } @media (max-width: 1199.98px) { .tg-header__area-two.sticky-menu .logo.d-none { margin-right: 0; } } .tg-header__area-three { background: transparent; box-shadow: none; } .tg-header__area-three .tgmenu__navbar-wrap ul { margin: 0 0; } .tg-header__area-four { background: transparent; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; } @media (max-width: 991.98px) { .tg-header__area-four { padding: 0 0; } } @media (max-width: 767.98px) { .tg-header__area-four { background: var(--tg-color-white-default); padding: 20px 0; -ms-box-shadow: 0px 5px 10px 0px #EEF4F6; -o-box-shadow: 0px 5px 10px 0px #EEF4F6; box-shadow: 0px 5px 10px 0px #EEF4F6; } } .tg-header__area-four.sticky-menu .tgmenu__wrap { border: none; border-radius: 0; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; } .tg-header__area-four .tgmenu__wrap { background: var(--tg-color-white-default); -ms-box-shadow: 0px 5px 10px 0px #EEF4F6; -o-box-shadow: 0px 5px 10px 0px #EEF4F6; box-shadow: 0px 5px 10px 0px #EEF4F6; border: 1px solid #D7E4EA; border-radius: 10px; padding: 0 20px; } @media (max-width: 991.98px) { .tg-header__area-four .tgmenu__wrap { padding: 15px 20px; } } @media (max-width: 767.98px) { .tg-header__area-four .tgmenu__wrap { padding: 0; border: none; border-radius: 0; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; } } .tg-header__area-four .tgmenu__navbar-wrap ul { margin: 0 auto; } .tg-header__area-four .tgmenu__navbar-wrap ul li a { padding: 26px 0px; } .tg-header__area-five { background: transparent; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; } .tg-header__area-five .tgmenu__navbar-wrap ul { margin: 0 auto; } .tg-header__area .mobile-nav-toggler { position: relative; float: right; cursor: pointer; line-height: 1; color: var(--tg-theme-secondary); display: none; width: 50px; height: 50px; align-items: center; justify-content: center; font-size: 18px; /*box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.2);*/ background: var(--tg-color-white-default); border-radius: 10px; } .tg-header__area .mobile-nav-toggler img{ width: 26px; height: 26px; } @media (max-width: 991.98px) { .tg-header__area .mobile-nav-toggler { display: flex; margin-left: 10px; } } .tg-header__area .mobile-nav-toggler svg { width: 18px; } .tgmenu__nav { /*display: flex;*/ align-items: center; flex-wrap: nowrap; justify-content: space-between; display: grid; grid-template-columns: repeat(3, 1fr); /*border:1px solid #ff0000;*/ } .tgmenu__nav .flex-grow { flex-grow: 1; } @media (max-width: 991.98px) { .tgmenu__nav { justify-content: space-between; display: flex; } .tgmenu__wrap .logo { text-align: left !important; } .header-search, .header-phone{ display:none !important; } } .tgmenu__nav .logo img { width:300px; height: 50px; } @media (max-width: 1199.98px) { .tgmenu__nav .logo img { width:auto; height: 34px; } } .tgmenu__navbar-wrap { display: flex; /*flex-grow: 1;*/ align-items: center; } .tgmenu__wrap .logo { text-align: center; padding: 10px 0; } .tgmenu__navbar-wrap.tgmenu__full_width { grid-column: span 3; padding: 0 20px; margin-bottom: 10px; } .tgmenu__navbar-wrap > ul { display: flex; flex-direction: row; flex-wrap: wrap; padding: 0 0; margin: 0 0 0 125px; } @media (max-width: 1199.98px) { .tgmenu__navbar-wrap > ul { margin: 0 0 0 100px; } } .tgmenu__navbar-wrap > ul > li { list-style: none; display: block; position: relative; margin-right: 30px; } @media (max-width:1024px) { .tgmenu__navbar-wrap > ul > li { margin-right: 15px; } } .tgmenu__navbar-wrap > ul > li:last-child { margin-right: 0; } .tgmenu__navbar-wrap > ul > li a, .tgmenu__navbar-wrap > ul > li span { font-size: 16px; font-weight: 500; text-transform: capitalize; color: var(--tg-color-dark-blue); padding: 15px 0px; display: block; line-height: 1; position: relative; z-index: 1; cursor: pointer; } .tgmenu__navbar-wrap > ul > li .sub-menu { position: absolute; left: 0; top: 100%; min-width: 180px; width: max-content; border: 1px solid #f5f5f5; background: var(--tg-color-white-default); margin: 0; transform: scale(1, 0); transform-origin: 0 0; transition: all 0.3s ease-out 0s; box-shadow: 0px 15px 30px 0px rgba(137, 139, 142, 0.50); border-radius: 6px; padding: 18px 0; display: block; visibility: hidden; opacity: 0; z-index: 9; } .tgmenu__navbar-wrap > ul > li .sub-menu .sub-menu { right: auto; left: 100%; top: 0; background-color: #ffffff; width: 240px; transition: all 0.25s ease 0s; opacity: 0; visibility: hidden; border-radius: 10px; margin-top: 0px; border: 1px solid #ececec; box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.05); } .tgmenu__navbar-wrap > ul > li .sub-menu > li:hover > .sub-menu { opacity: 1; visibility: visible; transform: scale(1); } .tgmenu__navbar-wrap > ul > li .sub-menu > li { margin-left: 0; text-align: left; display: block; position:relative; } .tgmenu__navbar-wrap > ul > li .sub-menu > li a { padding: 5px 15px 5px 15px; line-height: 1.4; display: block; color: var(--tg-heading-color); text-transform: capitalize; } .tgmenu__navbar-wrap > ul > li .sub-menu > li:hover > a, .tgmenu__navbar-wrap > ul > li .sub-menu > li.active > a { color: var(--tg-theme-primary); } .tgmenu__navbar-wrap > ul > li .sub-menu > li:hover > a { transform: translateX(8px); } .tgmenu__navbar-wrap > ul > li:hover > .sub-menu { opacity: 1; visibility: visible; transform: scale(1); } .tgmenu__navbar-wrap > ul > li.active a, .tgmenu__navbar-wrap > ul > li:hover a { color: var(--tg-theme-primary); } .tgmenu__main-menu li.menu-item-has-children .dropdown-btn { display: none; } .tgmenu__main-menu li.menu-item-has-children > a::after, .tgmenu__main-menu li.menu-item-has-children > span::after { content: "\f107"; font-weight: 700; font-family: var(--tg-icon-font-family); color: var(--tg-color-dark-blue); margin-left: 5px; -webkit-transition: all .5s; transition: all .5s; -webkit-transform: rotate(0deg); transform: rotate(0deg); position: absolute; top: calc(50% - 8px); font-size: 14px; height:16px; line-height: 16px; } .tgmenu__main-menu li ul li.menu-item-has-children > a::after { content: "\f107"; font-weight: 700; font-family: var(--tg-icon-font-family); color: var(--tg-color-dark-blue); margin-left: 5px; -webkit-transition: all .5s; transition: all .5s; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); position: absolute; top: calc(50% - 8px); right: 0; font-size: 14px; height:16px; line-height: 16px; } .tgmenu__main-menu li ul li.menu-item-has-children:hover > a::after, .tgmenu__main-menu li ul li.menu-item-has-children:hover > span::after { color: var(--tg-theme-primary); -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } .tgmenu__main-menu li.menu-item-has-children{ padding-right:20px; } .tgmenu__main-menu li.menu-item-has-children > a:hover, .tgmenu__main-menu li.menu-item-has-children > span:hover { color: var(--tg-theme-primary); } .tgmenu__main-menu li.menu-item-has-children:hover > a::after, .tgmenu__main-menu li.menu-item-has-children:hover > span::after { color: var(--tg-theme-primary); -webkit-transform: rotate(180deg); transform: rotate(180deg); } .tgmenu__main-menu li.menu-item-has-children.active > a::after { color: var(--tg-theme-primary); } @media (max-width: 991.98px) { .tgmenu__action { margin-right: 0px; margin-left: auto; } } .tgmenu__action ul { display: flex; align-items: center; margin-left: 10px; justify-content: flex-end; margin-right: 20px; } .tgmenu__action ul li { position: relative; margin-left: 30px; } @media (max-width: 768px) { .tgmenu__action ul { margin-right: 0px; } } .tgmenu__action ul li a { color: var(--tg-theme-secondary); font-size: 14px; } .tgmenu__action ul li:first-child { margin-left: 0; } .tgmenu__nav .tgmenu__action ul li:first-child { margin:0 30px 0 20px; } .tgmenu__nav .tgmenu__action ul li.header-search:first-child { margin:0 0px 0 20px; } .tgmenu__action ul .header-search a { font-size: 20px; line-height: 0; color: var(--tg-theme-secondary); } .tgmenu__action ul .header-search a svg { width: 20px; } .tgmenu__action ul .header-search a:hover { color: var(--tg-theme-primary); } .tgmenu__action ul .mic-search a svg { width: 24px; color: var(--tg-theme-secondary); } .tgmenu__action ul .mic-search a:hover { color: var(--tg-theme-primary); } .tgmenu__action ul .header-phone { padding-left: 50px; position: relative; height: 27px; } .tgmenu__action ul .header-phone i { position: absolute; left: 0; top: -5px; height: 40px; width: 40px; text-align: center; line-height: 46px; border-radius: 40px; background: #8147AE; color: #fff; font-size: 18px; } .tgmenu__action ul .header-phone span { font-weight: 300; font-size: 14px; padding-bottom: 4px; color:#222222; } .tgmenu__action ul .header-phone a { display: block; font-size: 18px; font-weight: 500; color:#222222; min-width: 152px; } @media (max-width: 991.98px) { .tgmenu__action ul .offCanvas-menu { display: none; } } .tgmenu__action ul .offCanvas-menu .menu-tigger { width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; background: var(--tg-color-white-default); border-radius: 10px; font-size: 18px; box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.2); } .tgmenu__action ul .offCanvas-menu .menu-tigger img{ width: 26px; height: 26px; } .tgmenu__action ul .offCanvas-menu .menu-tigger svg { width: 18px; height: 18px; } .tgmenu__action ul .offCanvas-menu .menu-tigger:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } @media (max-width: 1199.98px) { .tgmenu__action ul .header-btn { display: none; } } .tgmenu__action ul .header-btn .btn { color: var(--tg-color-white-default); font-size: 14px; } .tgmenu__action ul .header-btn .btn::after { display: none; } .tgmenu__action-two > .list-wrap { height: 100%; align-items: normal; } @media (max-width: 1199.98px) { .tgmenu__action-two > .list-wrap { margin-left: 40px; } } .tgmenu__action-two > .list-wrap li { margin-left: 0; } .tgmenu__action-two > .list-wrap li.header-search a { width: 85px; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid var(--tg-color-gray-5); border-top: none; border-bottom: none; } @media (max-width: 991.98px) { .tgmenu__action-two > .list-wrap li.header-search a { width: auto; height: auto; border: none; } } .tgmenu__action-two > .list-wrap li.offCanvas-menu .menu-tigger { width: 85px; height: 100%; display: flex; align-items: center; justify-content: center; background: transparent; border-radius: 0; box-shadow: none; font-size: 24px; line-height: 0; border: 1px solid var(--tg-color-gray-5); border-top: none; border-bottom: none; margin-left: -1px; } .tgmenu__action-two > .list-wrap li.offCanvas-menu .menu-tigger:hover { background: transparent; color: var(--tg-theme-primary); } .tgmenu__action-two > .list-wrap li.header-btn { display: flex; align-items: center; } @media (max-width: 1199.98px) { .tgmenu__action-two > .list-wrap li.header-btn { display: none; } } .tgmenu__action-two > .list-wrap li.header-btn .btn { border-radius: 30px; gap: 8px; } .tgmenu__action-two > .list-wrap li:last-child { margin-left: 25px; } .tgmenu__action-three > .list-wrap li { margin-left: 20px; } @media (max-width: 767px) { .tgmenu__action-three > .list-wrap li { margin-left: 0px; } } .tgmenu__action-three > .list-wrap li.header-phone:hover > i{ animation: tilt-shaking 0.5s; animation-iteration-count: infinite; } @keyframes tilt-shaking { 0% { transform: translate(1px, 1px) rotate(0deg); } 10% { transform: translate(-1px, -2px) rotate(-1deg); } 20% { transform: translate(-3px, 0px) rotate(1deg); } 30% { transform: translate(3px, 2px) rotate(0deg); } 40% { transform: translate(1px, -1px) rotate(1deg); } 50% { transform: translate(-1px, 2px) rotate(-1deg); } 60% { transform: translate(-3px, 1px) rotate(0deg); } 70% { transform: translate(3px, 1px) rotate(-1deg); } 80% { transform: translate(-1px, -1px) rotate(1deg); } 90% { transform: translate(1px, 2px) rotate(0deg); } 100% { transform: translate(1px, -2px) rotate(-1deg); } } .tgmenu__action-three > .list-wrap li.offCanvas-menu .menu-tigger { width: auto; height: auto; background: transparent; box-shadow: none; border-radius: 0; line-height: 0; display: block; } .tgmenu__action-three > .list-wrap li.offCanvas-menu .menu-tigger svg { width: 22px; height: 22px; } .tgmenu__action-three > .list-wrap li.offCanvas-menu .menu-tigger:hover { color: var(--tg-theme-primary); } .tgmenu__action-four .list-wrap li { margin-left: 20px; } .tgmenu__action-four .list-wrap li.header-btn .btn { padding: 13px 22px; } .tgmenu__action-four .list-wrap li.offCanvas-menu { margin-left: 40px; position: relative; } .tgmenu__action-four .list-wrap li.offCanvas-menu .menu-tigger { width: auto; height: auto; background: transparent; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; } .tgmenu__action-four .list-wrap li.offCanvas-menu .menu-tigger:hover { color: var(--tg-theme-primary); } .tgmenu__action-four .list-wrap li.offCanvas-menu::before { content: ""; position: absolute; left: -20px; top: 50%; transform: translateY(-50%); width: 1px; height: 40px; background: #D7E4EA; } .tgmenu__action-five .list-wrap li { margin-left: 10px; } .tgmenu__action-five .list-wrap li.header-btn .btn { padding: 13px 24px; } .tgmenu__action-five .list-wrap li.header-btn-two .btn.border-btn { border-color: var(--tg-color-gray-2); color: var(--tg-body-color); padding: 12px 21px; } .tgmenu__action-five .list-wrap li.header-btn-two .btn.border-btn::after { display: none; } .tgmenu__action-five .list-wrap li.header-btn-two .btn.border-btn:hover { color: var(--tg-color-white-default); border-color: var(--tg-theme-secondary); } .sticky-menu { position: fixed; left: 0; margin: auto; top: -2px; width: 100%; z-index: 99; background: var(--tg-color-white-default); animation: 1000ms ease-in-out 0s normal none 1 running fadeInDown; box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1); border-radius: 0; } .sticky-menu ul li .sub-menu { border-radius: 0 0 6px 6px; } #header-fixed-height.active-height { display: block; height: 90px; } /*************** mega-menu ****************/ .tgmenu__navbar-wrap>ul>li.mega-menu-s .sub-menu { display: grid; grid-template-columns: repeat(2, auto); /* Two columns */ gap: 0 30px; /* Space between items */ } /* Manually placing items in a vertical-first order */ .tgmenu__navbar-wrap>ul>li.mega-menu-s .sub-menu li:nth-child(1) { grid-row: 1; grid-column: 1; padding-right: 30px; border-right: 1px solid var(--tg-theme-primary); } .tgmenu__navbar-wrap>ul>li.mega-menu-s .sub-menu li:nth-child(2) { grid-row: 2; grid-column: 1; padding-right: 30px; border-right: 1px solid var(--tg-theme-primary); } .tgmenu__navbar-wrap>ul>li.mega-menu-s .sub-menu li:nth-child(3) { grid-row: 3; grid-column: 1; padding-right: 30px; border-right: 1px solid var(--tg-theme-primary); } .tgmenu__navbar-wrap>ul>li.mega-menu-s .sub-menu li:nth-child(4) { grid-row: 4; grid-column: 1; padding-right: 30px; border-right: 1px solid var(--tg-theme-primary); } .tgmenu__navbar-wrap>ul>li.mega-menu-s .sub-menu li:nth-child(5) { grid-row: 5; grid-column: 1; padding-right: 30px; border-right: 1px solid var(--tg-theme-primary); } .tgmenu__navbar-wrap>ul>li.mega-menu-s .sub-menu li:nth-child(6) { grid-row: 6; grid-column: 1; padding-right: 30px; border-right: 1px solid var(--tg-theme-primary); } .tgmenu__navbar-wrap>ul>li.mega-menu-s .sub-menu li:nth-child(7) { grid-row: 1; grid-column: 2; } .tgmenu__navbar-wrap>ul>li.mega-menu-s .sub-menu li:nth-child(8) { grid-row: 2; grid-column: 2; } .tgmenu__navbar-wrap>ul>li.mega-menu-s .sub-menu li:nth-child(9) { grid-row: 3; grid-column: 2; } .tgmenu__navbar-wrap>ul>li.mega-menu-s .sub-menu li:nth-child(10) { grid-row: 4; grid-column: 2; } .tgmenu__navbar-wrap>ul>li.mega-menu-s .sub-menu li:nth-child(11) { grid-row: 5; grid-column: 2; } .tgmenu__navbar-wrap>ul>li.mega-menu-s .sub-menu li:nth-child(12) { grid-row: 6; grid-column: 2; } /************* Industries Mega Menu ***********/ .tgmenu__navbar-wrap>ul>li.mega-menu .sub-menu { display: grid; grid-template-columns: repeat(2, auto); /* Two columns */ gap: 0 30px; /* Space between items */ } /* Manually placing items in a vertical-first order */ .tgmenu__navbar-wrap>ul>li.mega-menu .sub-menu li:nth-child(1) { grid-row: 1; grid-column: 1; padding-right: 30px; border-right: 1px solid var(--tg-theme-primary); } .tgmenu__navbar-wrap>ul>li.mega-menu .sub-menu li:nth-child(2) { grid-row: 2; grid-column: 1; padding-right: 30px; border-right: 1px solid var(--tg-theme-primary); } .tgmenu__navbar-wrap>ul>li.mega-menu .sub-menu li:nth-child(3) { grid-row: 3; grid-column: 1; padding-right: 30px; border-right: 1px solid var(--tg-theme-primary); } .tgmenu__navbar-wrap>ul>li.mega-menu .sub-menu li:nth-child(4) { grid-row: 4; grid-column: 1; padding-right: 30px; border-right: 1px solid var(--tg-theme-primary); } .tgmenu__navbar-wrap>ul>li.mega-menu .sub-menu li:nth-child(5) { grid-row: 5; grid-column: 1; padding-right: 30px; border-right: 1px solid var(--tg-theme-primary); } .tgmenu__navbar-wrap>ul>li.mega-menu .sub-menu li:nth-child(6) { grid-row: 6; grid-column: 1; padding-right: 30px; border-right: 1px solid var(--tg-theme-primary); } .tgmenu__navbar-wrap>ul>li.mega-menu .sub-menu li:nth-child(7) { grid-row: 7; grid-column: 1; padding-right: 30px; border-right: 1px solid var(--tg-theme-primary); } .tgmenu__navbar-wrap>ul>li.mega-menu .sub-menu li:nth-child(8) { grid-row: 8; grid-column: 1; padding-right: 30px; border-right: 1px solid var(--tg-theme-primary); } .tgmenu__navbar-wrap>ul>li.mega-menu .sub-menu li:nth-child(9) { grid-row: 1; grid-column: 2; } .tgmenu__navbar-wrap>ul>li.mega-menu .sub-menu li:nth-child(10) { grid-row: 2; grid-column: 2; } .tgmenu__navbar-wrap>ul>li.mega-menu .sub-menu li:nth-child(11) { grid-row: 3; grid-column: 2; } .tgmenu__navbar-wrap>ul>li.mega-menu .sub-menu li:nth-child(12) { grid-row: 4; grid-column: 2; } /*============================= 03. Mobile Menu ===============================*/ .tgmobile__search { padding: 0 20px 25px 25px; } .tgmobile__search form { position: relative; } .tgmobile__search input { display: block; width: 100%; border: none; padding: 10px 90px 10px 20px; font-size: 15px; height: 45px; background: var(--tg-color-gray-3); border-radius: 4px; } .tgmobile__search input::-moz-placeholder { font-size: 15px; color: var(--tg-body-color); } .tgmobile__search input::placeholder { font-size: 15px; color: var(--tg-body-color); } .tgmobile__search button { position: absolute; top: 50%; transform: translateY(-50%); border: none; padding: 0; right: 10px; line-height: 1; background: transparent; color: var(--tg-heading-color); } .tgmobile__search span.mic { top: 50%; } .tgmobile__search .search__input { height:auto; } .tgmobile__menu { position: fixed; right: 0; top: 0; width: 300px; padding-right: 30px; max-width: 100%; height: 100%; z-index: 99; border-radius: 0px; transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); -moz-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); -webkit-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); -ms-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); -o-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); transform: translateX(101%); } .tgmobile__menu .navbar-collapse { display: block !important; } .tgmobile__menu .nav-logo { position: relative; padding: 30px 25px; text-align: left; } .tgmobile__menu .nav-logo .site-logo{ text-align: left; } .tgmobile__menu .nav-logo img { max-height: 28px; max-width: none; width: auto; } .tgmobile__menu .navigation { position: relative; display: block; width: 100%; float: none; margin: 0; padding: 0; } .tgmobile__menu .navigation li { position: relative; display: block; border-top: 1px solid rgba(0, 0, 0, 0.1); } .tgmobile__menu .navigation li.active > a { color: var(--tg-theme-primary); } .tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn { position: absolute; right: 20px; top: 6px; width: 32px; height: 32px; text-align: center; font-size: 16px; line-height: 32px; color: var(--tg-heading-color); background: var(--tg-color-gray-3); cursor: pointer; border-radius: 2px; transition: all 500ms ease; z-index: 5; } .tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn .plus-line { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(0); border-radius: 10px; width: 12px; height: 2px; background-color: var(--tg-color-black-1); transition: all 500ms ease; } .tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn .plus-line::after { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(0); border-radius: 10px; width: 2px; height: 12px; background-color: var(--tg-color-black-1); transition: all 500ms ease; } .tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn.open { background-color: var(--tg-theme-primary); } .tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn.open .plus-line { background-color: var(--tg-color-white-default); } .tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn.open .plus-line::after { display: none; } .tgmobile__menu .navigation li > a { position: relative; display: block; line-height: 1.5; padding: 10px 60px 10px 25px; font-size: 15px; font-weight: 500; color: var(--tg-heading-color); text-transform: capitalize; transition: all 500ms ease; border: none; } .tgmobile__menu .navigation li > a::before { content: ""; position: absolute; left: 0; top: 0; height: 0; transition: all 500ms ease; width: 2px; background: var(--tg-theme-primary); pointer-events: none; } .tgmobile__menu .navigation li ul li > a { margin-left: 20px; } .tgmobile__menu .navigation li ul li ul li a { margin-left: 40px; } .tgmobile__menu .navigation li ul li ul li ul li a { margin-left: 60px; } .tgmobile__menu .navigation li > ul { display: none; } .tgmobile__menu .navigation li > ul > li > ul { display: none; } .tgmobile__menu .navigation ul { padding: 0; margin: 0; } .tgmobile__menu .navigation ul li a { display: block; } .tgmobile__menu .navigation ul li ul li > a { font-size: 15px; margin-left: 20px; text-transform: capitalize; } .tgmobile__menu .navigation:last-child { border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .tgmobile__menu .navigation > li > ul > li:first-child { border-top: 1px solid rgba(0, 0, 0, 0.1); } .tgmobile__menu .navigation > li.active > a::before { height: 100%; } .tgmobile__menu .close-btn { position: absolute; right: 15px; top: 28px; line-height: 30px; width: 35px; text-align: center; font-size: 20px; color: var(--tg-theme-primary); cursor: pointer; z-index: 10; transition: all 0.5s ease; } .tgmobile__menu .close-btn i[class^=flaticon-]:before { font-weight: var(--tg-fw-bold) !important; } .tgmobile__menu-backdrop { position: fixed; right: 0; top: 0; width: 100%; height: 100%; z-index: 2; transition: all 700ms ease; -moz-transition: all 700ms ease; -webkit-transition: all 700ms ease; -ms-transition: all 700ms ease; -o-transition: all 700ms ease; opacity: 0; visibility: hidden; background: rgba(0, 0, 0, 0.5); } .tgmobile__menu .tgmenu__action { padding: 0 0; margin: 0 0; } .tgmobile__menu .tgmenu__action > ul { margin: 0 0; padding: 30px 20px 0; justify-content: center; gap: 0 15px; } .tgmobile__menu .tgmenu__action > ul li { margin: 0 0; } .tgmobile__menu .tgmenu__action > ul .header-btn { display: block; } .tgmobile__menu-box { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; max-height: 100%; overflow-y: auto; overflow-x: hidden; background: var(--tg-color-white-default); padding: 0px 0px; z-index: 99; /*box-shadow: -9px 0 14px 0px rgba(0, 0, 0, 0.06);*/ display: flex; flex-direction: column; } .tgmobile__menu-bottom { padding: 30px 25px 25px; margin-top: auto; } .tgmobile__menu-bottom .contact-info .list-wrap li a { color: var(--tg-theme-secondary); display: inline-block; font-weight: 500; margin-bottom: 5px; } .tgmobile__menu-bottom .contact-info .list-wrap li a:hover { color: var(--tg-theme-primary); } .tgmobile__menu-bottom .social-links ul { display: flex; position: relative; text-align: center; align-items: center; flex-wrap: wrap; padding: 15px 0 0; gap: 15px; } .tgmobile__menu-bottom .social-links ul li { position: relative; display: inline-block; } .tgmobile__menu-bottom .social-links ul li a { display: flex; align-items: center; justify-content: center; position: relative; font-size: 18px; color: var(--tg-theme-primary); transition: all 500ms ease; } .tgmobile__menu-bottom .social-links ul li a:hover { color: var(--tg-theme-primary); } .tgmobile__menu-outer .mobile-nav-toggler { position: relative; float: right; font-size: 40px; line-height: 50px; cursor: pointer; display: none; color: var(--tg-color-white-default); margin-right: 30px; top: 15px; } @media (max-width: 991.98px) { .tgmobile__menu-outer .mobile-nav-toggler { display: block !important; } } .mobile-menu-visible { overflow: hidden; } .mobile-menu-visible .tgmobile__menu { transform: translateX(0%); } .mobile-menu-visible .tgmobile__menu-backdrop { opacity: 1; visibility: visible; } .mobile-menu-visible .tgmobile__menu .close-btn { transform: rotate(360deg); } .fa-x::before { content: "X"; } .mic-search a.language-icon{ height: 27px; display: inline-block; } /*============================= 23. Footer ===============================*/ .footer-area { position: relative; overflow: hidden; } .footer__area-two { background: var(--tg-color-dark-blue); } .footer__area-three { background: var(--tg-color-dark-blue); } .footer__area-four { background: var(--tg-color-dark-blue); position: relative; z-index: 1; } .footer-top { padding: 80px 0 30px; position: relative; overflow: hidden; } @media (max-width: 767.98px) { .footer-top { padding: 60px 0 30px; } } .footer-top .row > *:nth-child(2) .footer-widget { margin-left: 50px; } @media (max-width: 991.98px) { .footer-top .row > *:nth-child(2) .footer-widget { margin-left: 0; } } .footer-top .row > *:nth-child(3) .footer-widget { margin-left: 70px; } @media (max-width: 991.98px) { .footer-top .row > *:nth-child(3) .footer-widget { margin-left: 0; } } .footer__top-two { padding: 60px 0 30px; } .footer__top-two .fw-title { color: var(--tg-color-white-default); } .footer__top-two .footer-link-list .list-wrap li a { font-weight: 700; color: var(--tg-color-gray-2); } .footer__top-two .row > *:nth-child(3) .footer-widget { margin-left: 65px; } @media (max-width: 991.98px) { .footer__top-two .row > *:nth-child(3) .footer-widget { margin-left: 0; } } .footer__top-three { padding: 110px 0 70px; } @media (max-width: 767.98px) { .footer__top-three { padding: 90px 0 40px; } } .footer__top-three .fw-title { color: var(--tg-color-white-default); } .footer__top-three .footer-link-list .list-wrap li a { color: var(--tg-color-gray-2); } .footer__top-three .footer-info-list .list-wrap li .icon, .footer__top-three .footer-info-list .list-wrap li p, .footer__top-three .footer-info-list .list-wrap li a { color: var(--tg-color-gray-2); } .footer-widget { margin-bottom: 40px; } .footer-widget .site-logo{ text-align:left; } .footer-content p { margin-bottom: 25px; } .footer__content-two { width: 80%; } @media (max-width: 991.98px) { .footer__content-two { width: 100%; } } .footer__content-two > p { color: var(--tg-color-gray-2); margin-bottom: 15px; font-weight: 700; } .footer-social .list-wrap { display: flex; align-items: center; gap: 10px; } .footer-social .list-wrap li a { width: 45px; height: 45px; display: flex; align-items: center; justify-content: center; background: #EAF1F4; border-radius: 5px; font-size: 20px; color: var(--tg-heading-color); } .footer-social .list-wrap li a:hover { background: var(--tg-theme-secondary); color: var(--tg-color-white-default); } .footer__social-two { flex-grow: 1; z-index: 9; position: relative; } @media (max-width: 767px) { .footer__social-two { max-width: 230px; margin: 0 auto; } } .footer__social-two .list-wrap { display: flex; align-items: center; justify-content: flex-end; gap: 10px; } @media (max-width: 991.98px) { .footer__social-two{ margin-top:15px; } .footer__social-two .list-wrap { justify-content: center; } } .footer__social-two .list-wrap li a { width: 45px; height: 45px; display: flex; align-items: center; justify-content: center; background: var(--tg-theme-primary); border-radius: 50%; font-size: 20px; color: var(--tg-color-white-default); } .footer__social-two .list-wrap li a i{ transform: scale(1); transition-duration: 1s; } .footer__social-two .list-wrap li a:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .footer__social-two .list-wrap li a:hover i{ transform: scale(1.5); transition-duration: 1s; } .footer__social-three .title { display: block; color: #7375A5; text-transform: capitalize; margin-bottom: 15px; } .footer__social-three .list-wrap { display: flex; align-items: center; gap: 10px; } .footer__social-three .list-wrap li a { width: 45px; height: 45px; display: flex; align-items: center; justify-content: center; background: #232563; border-radius: 50%; font-size: 20px; color: var(--tg-color-gray-2); } .footer__social-three .list-wrap li a:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .footer-info-list .list-wrap li { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 20px; } .footer-info-list .list-wrap li .icon { font-size: 24px; line-height: 0; } .footer-info-list .list-wrap li:hover .icon{ color:var(--tg-theme-primary); } .footer-info-list .list-wrap li a { color: var(--tg-body-color); } .footer-info-list .list-wrap li a:hover { color: var(--tg-theme-primary); } .footer-info-list .list-wrap li:last-child { margin-bottom: 0; } .footer-info-list .list-wrap li .content p { margin-bottom: 0; } .footer-link-list .list-wrap li { margin-bottom: 10px; float: left; width: 50%; } .footer-link-list .list-wrap li:last-child { margin-bottom: 0; } .footer-link-list .list-wrap li a { color: var(--tg-body-color); position: relative; } .footer-link-list .list-wrap li a::before { content: ""; position: absolute; left: 0; bottom: -3px; width: 100%; height: 2px; background: var(--tg-theme-primary); transform-origin: right top; transform: scale(0, 1); transition: transform 0.4s cubic-bezier(0.74, 0.72, 0.27, 0.24); } .footer-link-list .list-wrap li a:hover { color: var(--tg-theme-primary); } .footer-link-list .list-wrap li a:hover::before { transform-origin: left top; transform: scale(1, 1); } .footer-instagram .list-wrap { display: flex; flex-wrap: wrap; gap: 13px; } .footer-instagram .list-wrap li a img { width: 85px; height: 85px; -o-object-fit: cover; object-fit: cover; mix-blend-mode: luminosity; border-radius: 10px; } .footer-bottom { background: var(--tg-color-gray-3); border-top: 1px solid var(--tg-border-1); padding: 35px 0; } @media (max-width: 767.98px) { .footer-bottom { padding: 25px 0; } } .footer__bottom-two { border-top: 1px solid #272A68; padding: 40px 0; } @media (max-width: 767.98px) { .footer__bottom-two { padding: 30px 0; } } .footer__bottom-three { border-top: 1px solid #272A68; padding: 40px 0; } @media (max-width: 767.98px) { .footer__bottom-three { padding: 25px 0; } } @media (max-width: 767.98px) { .footer__bottom-three .fw-logo { text-align: center; margin-bottom: 20px; } } .footer__bottom-three .copyright-text { text-align: left; } .copyright { background-color: #1a252f !important; } @media (max-width: 767.98px) { .footer__bottom-three .copyright-text { text-align: center; } } .footer__bottom-three .copyright-text p { color: #5F6196; } .footer__bottom-three .copyright-text p a { color: #5F6196; } .footer__bottom-four { border-top: 1px solid #272A68; padding: 65px 0; } @media (max-width: 991.98px) { .footer__bottom-four { padding: 25px 0; } } .footer__bottom-four .copyright-text { text-align: right; } @media (max-width: 991.98px) { .footer__bottom-four .copyright-text { text-align: center; } } .footer__bottom-four .copyright-text p { color: #5F6196; } .footer__bottom-four .copyright-text p a { color: #5F6196; } .footer-newsletter { display: flex; align-items: center; gap: 15px; } @media (max-width: 991.98px) { .footer-newsletter { margin-bottom: 20px; } } @media (max-width: 767.98px) { .footer-newsletter { flex-wrap: wrap; justify-content: center; } } .footer-newsletter .title { margin-bottom: 0; font-size: 20px; font-weight: 600; } @media (max-width: 1199.98px) { .footer-newsletter .title { font-size: 18px; } } .footer-newsletter form { position: relative; flex-grow: 1; } .footer-newsletter form input { width: 100%; border: 1px solid var(--tg-border-1); background: var(--tg-color-white-default); border-radius: 30px; font-size: 14px; line-height: 0; color: var(--tg-theme-secondary); padding: 16px 140px 16px 22px; height: 50px; } .footer-newsletter form input::-moz-placeholder { font-size: 14px; text-transform: capitalize; color: #667594; } .footer-newsletter form input::placeholder { font-size: 14px; text-transform: capitalize; color: #667594; } .footer-newsletter .btn { border-radius: 30px; position: absolute; right: 0; top: 0; } .footer-newsletter .btn::after { display: none; } .footer__newsletter-two { padding: 80px 0 60px; border-bottom: 1px solid #272A68; } @media (max-width: 767.98px) { .footer__newsletter-two { padding: 60px 0 50px; } } .footer__newsletter-three { width: 90%; } @media (max-width: 767.98px) { .footer__newsletter-three { width: 100%; } } .footer__newsletter-three .title { margin-bottom: 20px; color: var(--tg-color-white-default); font-size: 24px; text-transform: capitalize; font-weight: 600; } @media (max-width: 767.98px) { .footer__newsletter-three .title br { display: none; } } .footer__newsletter-three form { margin-bottom: 25px; } .footer__newsletter-three form input { background: #212356; border: none; border-radius: 30px; font-size: 14px; font-weight: 500; color: var(--tg-color-white-default); padding: 15px 25px; height: 50px; width: 100%; display: block; margin-bottom: 10px; } .footer__newsletter-three form input::-moz-placeholder { font-size: 14px; font-weight: 500; text-transform: capitalize; color: #595B81; } .footer__newsletter-three form input::placeholder { font-size: 14px; font-weight: 500; text-transform: capitalize; color: #595B81; } .footer__newsletter-three form .btn { width: 100%; border-radius: 30px; justify-content: center; } .footer__newsletter-three form .btn::after { display: none; } .footer__newsletter-four { display: flex; align-items: center; gap: 25px; } @media (max-width: 991.98px) { .footer__newsletter-four { justify-content: center; margin-bottom: 20px; } } @media (max-width: 767.98px) { .footer__newsletter-four { flex-wrap: wrap; } } .footer__newsletter-four .title { margin-bottom: 0; color: var(--tg-color-white-default); font-size: 24px; } .footer__newsletter-four form { display: flex; align-items: center; gap: 10px; flex-grow: 1; } @media (max-width: 767.98px) { .footer__newsletter-four form { flex-wrap: wrap; justify-content: center; } } .footer__newsletter-four form input { flex-grow: 1; border: none; background: var(--tg-color-white-default); border-radius: 30px; font-size: 14px; font-weight: 500; color: var(--tg-theme-secondary); padding: 15px 25px; height: 50px; } .footer__newsletter-four form input::-moz-placeholder { font-size: 14px; font-weight: 500; text-transform: capitalize; color: #667594; } .footer__newsletter-four form input::placeholder { font-size: 14px; font-weight: 500; text-transform: capitalize; color: #667594; } .footer__newsletter-four form .btn { width: 127px; border-radius: 30px; } .footer__newsletter-four form .btn::after { display: none; } .footer__newsletter-inner { display: flex; align-items: center; } @media (max-width: 1199.98px) { .footer__newsletter-inner { flex-wrap: wrap; justify-content: center; gap: 30px; } } .footer__newsletter-inner .title { margin-bottom: 0; color: var(--tg-color-white-default); font-size: 24px; text-transform: capitalize; width: 20%; margin-right: 30px; } @media (max-width: 1199.98px) { .footer__newsletter-inner .title { width: 100%; text-align: center; margin-right: 0; } } .footer__newsletter-inner form { position: relative; width: 620px; } .footer__newsletter-inner form input { width: 100%; background: var(--tg-color-white-default); border: none; border-radius: 30px; font-size: 14px; font-weight: var(--tg-fw-bold); color: var(--tg-theme-secondary); padding: 20px 145px 20px 28px; height: 50px; } .footer__newsletter-inner form input::-moz-placeholder { font-size: 14px; font-weight: var(--tg-fw-bold); color: #667594; text-transform: capitalize; } .footer__newsletter-inner form input::placeholder { font-size: 14px; font-weight: var(--tg-fw-bold); color: #667594; text-transform: capitalize; } .footer__newsletter-inner form .btn { position: absolute; right: 0; top: 0; height: 50px; border-radius: 30px; } .footer__newsletter-inner form .btn::after { display: none; } .footer-shape img { position: absolute; z-index: -1; } .footer-shape img:nth-child(1) { left: 0; bottom: 0; } .footer-shape img:nth-child(2) { right: 0; top: 0; } .footer-shape img:nth-child(3) { right: 6%; top: 30%; } .copyright .copyright-text{ padding:10px 0; } @media (max-width: 991.98px) { .footer-shape img:nth-child(3) { right: 11%; top: 24%; } .copyright .copyright-text{ text-align: center; } } .footer-shape-two img { position: absolute; z-index: -1; left: 0; top: 0; } .fw-logo img { max-height: 50px; } .fw-title { font-size: 22px; margin-bottom: 20px; font-weight: 600; position: relative; padding-bottom: 18px; } .fw-title::before { content: ""; position: absolute; left: 0; bottom: 0; width: 30px; height: 4px; border-radius: 4px; background: var(--tg-theme-primary); } .footer-info-two .list-wrap li .icon { color: var(--tg-color-gray-2); } .footer-info-two .list-wrap li .content a { font-weight: 700; color: var(--tg-color-gray-2); } .footer-info-two .list-wrap li .content a:hover { color: var(--tg-theme-primary); } .footer-info-two .list-wrap li .content p { font-weight: 700; color: var(--tg-color-gray-2); } @media (max-width: 991.98px) { .copyright-text { text-align: center; } } .copyright-text p { margin-bottom: 0; font-size: 14px; font-weight: 500; } .copyright-text p a { color: var(--tg-body-color); } .copyright-text p a:hover { color: var(--tg-theme-primary); } .copyright-text a { color: var(--tg-body-color); font-size: 14px; font-weight: 500; } .copyright-text a:hover { color: var(--tg-theme-primary); } .copyright-text-two p { margin-bottom: 0; text-align: center; font-size: 14px; font-weight: 700; color: #5F6196; } .copyright-text-two p a { color: #5F6196; } .copyright-text-two p a:hover { color: var(--tg-theme-primary); } .footer-bottom-menu{ list-style: none; padding:10px 0; margin:0; } .footer-bottom-menu li{ display:inline-block; } .footer-bottom-menu li a{ display:block; padding:0 15px; color:#fff; } .footer-bottom-menu li a:hover{ color: var(--tg-theme-primary); } .footer-shape-wrap img { position: absolute; z-index: -1; } .footer-shape-wrap img:nth-child(1) { left: 0; top: 0; } @media (max-width: 767.98px) { .footer-shape-wrap img:nth-child(1) { width: 200px; } } .footer-shape-wrap img:nth-child(2) { right: 0; bottom: 0; } @media (max-width: 767.98px) { .footer-shape-wrap img:nth-child(2) { width: 200px; } } /**************/ .fixed-bottom-right { position: fixed; bottom: 20px; right: 0px; z-index: 1000; } .fixed-bottom-right .button-icon{ float: right; } .fixed-bottom-right a.btn{ display: inline-block; } @media only screen and (max-width: 768px) { .fixed-bottom-right a.btn{ display: block; } } .fixed-bottom-right a.btn:after{ content: none; } .fixed-bottom-right a.btn.btn-phone{ /*background:#0065a7;*/ } .phone-div{ background: var(--tg-theme-primary);; padding: 20px; color:#fff; position: absolute; bottom: 50px; right: 0; transition: all .3s cubic-bezier(.785,.135,.15,.86); -moz-transition: all .3s cubic-bezier(.785,.135,.15,.86); -webkit-transition: all .3s cubic-bezier(.785,.135,.15,.86); -ms-transition: all .3s cubic-bezier(.785,.135,.15,.86); -o-transition: all .3s cubic-bezier(.785,.135,.15,.86); transform: translate(101%); } .phone-div a{ color:#fff; white-space: nowrap; } .fixed-bottom-right .phone-div.show{ transform: translate(0%); } .contact-div{ width:300px; min-height:385px; background: var(--tg-theme-primary); padding: 20px 5px; position: absolute; bottom: 50px; right: 0; transition: all .3s cubic-bezier(.785,.135,.15,.86); -moz-transition: all .3s cubic-bezier(.785,.135,.15,.86); -webkit-transition: all .3s cubic-bezier(.785,.135,.15,.86); -ms-transition: all .3s cubic-bezier(.785,.135,.15,.86); -o-transition: all .3s cubic-bezier(.785,.135,.15,.86); transform: translate(101%); } .fixed-bottom-right .contact-div.show{ transform: translate(0%); } .form-response{ text-align: center; display:block; color:#fff; } @media only screen and (max-width: 768px) { .contact-div, .phone-div{ bottom: 65px; } .btn.large { font-size: 12px; } } .fixed-bottom-right .form-control::placeholder{ color: #818181; font-size: 13px; opacity: 1; } .fixed-bottom-right .form-control{ border-radius:0; font-size: 14px; } .btn.btn-small{ padding: 12px 18px; font-size: 13px; } .fixed-bottom-right button.btn.btn-small{ background-color: #000; } .fixed-bottom-right .error{ color: #fff; font-size: 12px; } .fixed-bottom-right .form-group{ margin-bottom: 10px; } .services__bg-seven .accordion_content a{ color:#ffffff; text-decoration: underline; } app-privacy-policy p { margin: 0; word-wrap: break-word; } .error{ display: block; } .has-error{ border-bottom: 0px solid #900 !important; } .contact__form-wrap form .form-grp.has-error input, .contact__form-wrap form .form-grp.has-error textarea { border-bottom: 2px solid #900 !important; } .fixed-bottom-right .button-icon { display: flex; gap: 0; } .btn-chat{ background: #009e82 !important; border-color: #009e82 !important; color: #fff !important; } .close-right { cursor: pointer; height: 24px; width: 24px; color: #fff; line-height: 24px; border-radius: 50px; position: absolute; left: 2px; top: -3px; padding: 0; } .fab.fa-x { font-family: sans sarif; } .entry-content .listing-banner { float: left; width: 100%; overflow: hidden; position: relative; top: 0; } .entry-content .listing-banner img{ width: 100%; } .wpspw_pagination a.page-numbers, .wpspw_pagination span.page-numbers { display: inline-block; background: transparent; color: var(--tg-body-color) !important; font-weight: 600; font-size: 16px; line-height: 26px !important; min-width: 40px; height: 40px; border-radius: 5px; box-sizing: border-box; border: 1px solid var(--tg-border-1); } .wpspw_pagination a.page-numbers:hover, .wpspw_pagination span.page-numbers.current { color: var(--tg-color-white-default) !important; background-color: var(--tg-theme-primary); border-color: var(--tg-theme-primary); } .wpspw_pagination span.page-numbers.dots{ line-height: 40px !important; } .relatedblogs { position: relative; } .slick-arrow.button-prev{ position: absolute; color:#fff; margin-top: -60px; } .slick-arrow.button-next{ position: absolute; color:#fff; margin-top: -30px; right: 0; } .slick-arrow.button-prev:before, .slick-arrow.button-next:before{ color:#fff; background: var(--tg-theme-primary); } .relatedblogs .swiper-wrapper { box-sizing: border-box; } .author-social{ display: flex; gap: 10px; list-style: none; margin: 0; padding: 0; } .author-social a{ align-items: center; background: var(--tg-theme-primary); border-radius: 100%; border: none; color: #fff; display: flex; font-size: calc(16rem / 16); height: 32px; justify-content: center; padding: 0; width: 32px; } .author-social a:hover{ background: var(--tg-theme-secondary); color: #fff !important; } .start-conversation { -webkit-user-select: none; user-select: none; -moz-user-select: none; background: var(--tg-theme-primary) none repeat scroll 0 0; border: medium none; border-radius: 0; color: var(--tg-color-white-default); cursor: pointer; display: inline-flex; align-items: center; font-size: 14px; font-weight: 400; letter-spacing: 0; line-height: 1; margin-bottom:15px; padding: 18px 24px; text-align: center; text-transform: uppercase; touch-action: manipulation; transition: all .3s ease-out 0s; vertical-align: middle; white-space: nowrap; position: relative; overflow: hidden; z-index: 1; } .start-conversation:hover{ color: var(--tg-color-white-default) !important; } .start-conversation:hover:before { top: -40%; } .start-conversation:before { content: ""; position: absolute; transition-duration: .8s; width: 200%; height: 200%; top: 110%; left: 50%; background: var(--tg-theme-secondary); transform: translate(-50%); border-radius: 50%; z-index: -1; } .search-results .page-header, .no-results .page-header, .error404 .page-header, .not-found .page-header{ padding: 20px 0; margin-top: 20px; border-width: 1px; border-color: #ccc; margin-bottom: 20px; } .search-results .h1, .search-results h1, .error404 h1, .no-results h1, .not-found h1 { font-size: 36px; font-weight: 600; margin-bottom: 0; } .search-results .entry-title, .error404 .entry-title { font-size:1.5rem; } body.search-results .post-thumbnail{ max-width:450px; } body.search-results .post-thumbnail .wp-post-image { margin-top: 0; } .byline { display: none; } @media only screen and (max-width: 990px) { body .details-right { top: 100px; } } @media only screen and (max-width: 767.98px) { .author-bio.show-avatars .author-bio-content { max-width: none; } .search-results .h1, .search-results h1, .no-results h1, .not-found h1 { font-size: 24px; } .search-results .entry-title { font-size: 1.3rem; } } .language-box{ display:none; position: absolute; top: 30px; background-color: #FFF; text-decoration: none; border: 1px solid #6B90DA; overflow: hidden; padding: 4px; box-shadow: 0 3px 8px 2px #999; width: 128px; z-index: 9; } .language-box.active{ display:block; } .language-box a { font-family: arial; font-size: 10pt!important; box-sizing: border-box; line-height: 16px; padding: 4px; width: 100%; display: block; text-decoration: none; white-space: nowrap; color: #00C; background: #FFF; } .language-box a:hover{ color: #FFF !important; background: #36C; } /********* mic-search **********/ .search__popup .mic-search { display: inline-block; position: absolute; right: 45px; top: 21px; } .tgmobile__search .mic-search{ position: absolute; top: 50%; right: 50px; transform: translateY(-50%); cursor: pointer; background: transparent; color: var(--tg-theme-primary); border-radius: 50px; height: 40px; width: 40px; line-height: 40px; text-align: center; } .mic-search { display: inline-block; } .mic-search input { height: 30px; padding: 0 10px; } .mic-search .fas { font: normal normal normal 18px/1 FontAwesome; position: relative; top: 0; right: 5px; transform: translateY(0%); cursor: pointer; background: transparent; color: var(--tg-theme-primary); border-radius: 50%; height: 40px; width: 40px; line-height: 40px; text-align: center; transition: color 0.3s; } .mic-search .fas:hover { background: var(--tg-theme-primary); color: #fff; } .mic-search .fas.active { color: #fff; /* Icon color when active */ } /* Pulse bubble effect */ .mic-search .fas.active::after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: var(--tg-theme-primary); border-radius: 50%; z-index: -1; animation: pulse-border 1.5s ease-out infinite; } /* Corrected keyframes syntax */ @keyframes pulse-border { 0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(129, 67, 177, 0.7); } 70% { transform: scale(1.2); box-shadow: 0 0 0 10px rgba(129, 67, 177, 0); } 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(129, 67, 177, 0); } } .search-submit{ -webkit-user-select: none; user-select: none; -moz-user-select: none; background: var(--tg-theme-primary) none repeat scroll 0 0; border: medium none; border-radius: 0px; color: var(--tg-color-white-default); cursor: pointer; display: inline-flex; align-items: center; font-size: 14px; font-weight: 400; letter-spacing: 0; line-height: 1; margin-bottom: 0; padding: 18px 24px; text-align: center; text-transform: uppercase; touch-action: manipulation; transition: all 0.3s ease-out 0s; vertical-align: middle; white-space: nowrap; position: relative; overflow: hidden; z-index: 1; } .search-submit:hover, .search-submit:focus { color: var(--tg-color-white-default); background: var(--tg-theme-secondary); } .wpspw-post-content div { padding-bottom: 15px !important; } .wpspw-post-image-bg a, .crp-list-item-image a{ display: block; overflow: hidden; position: relative; z-index: 1; } .wpspw-post-image-bg a:before, .crp-list-item-image a:before { position: absolute; top: 0; left: -100%; display: block; content: ""; width: 50%; height: 100%; background: linear-gradient(to right,#fff0,#ffffff4d); transform: skew(-25deg); } .wpspw-post-grid-content:hover .wpspw-post-image-bg a:before, .wpspw-post-list-content:hover .wpspw-post-image-bg a:before, .crp-list-item:hover .crp-list-item-image a:before { animation: hoverShine 2.2s; } @keyframes hoverShine { 100% { left: 125%; } }