@charset "UTF-8"; /* Theme Name: Blogauthor Theme URI: https://themeinwp.com/themes/blogauthor Author: themeinwp Author URI: https://www.themeinwp.com/ Description: Blogauthor is a captivating and user-friendly free WordPress blog theme tailor-made for passionate bloggers and social media influencers. With its visually stunning design and intuitive interface, it empowers storytellers to share their narratives in a beautiful and engaging manner, captivating readers with every word. Requires at least: 5.3 Tested up to: 6.3 Requires PHP: 5.6 Version: 1.0.4 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: blogauthor Tags: blog, news, photography, grid-layout, one-column, two-columns, three-columns, left-sidebar, right-sidebar, custom-background, custom-header, custom-logo, custom-menu, featured-images, featured-image-header, flexible-header, post-formats, rtl-language-support, translation-ready, theme-options, threaded-comments, footer-widgets */ /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- # Generic - Normalize - Box sizing # Base - Typography - Elements - Links - Forms ## Layouts # Components - Base - Progress Bar - Preloader - Top Bar - Site Branding - Navigation - Color Mode - Posts and pages - Site Content - Banner - Comments - Widgets - Media - Captions - Galleries - Footer # plugins - Jetpack infinite scroll # Utilities - Accessibility - Alignments - Plugin Support --------------------------------------------------------------*/ /*-------------------------------------------------------------- # Generic --------------------------------------------------------------*/ :root { --theme-bg-color: #ffffff; --theme-text-color: #404040; --theme-component-color: #0f0f0f; --theme-accent-color: #d72924; --theme-accent-rgb-color: 247, 119, 94; --theme-accent-hover-color: #404040; --swiper-theme-color: var(--theme-accent-color); --theme-white-color: #fff; --theme-white-rgb-color: 255, 255, 255; --theme-font-size-normal: 1.6rem; --theme-font-size-small: 2rem; --theme-font-size-medium: 2.4rem; --theme-font-size-big: 2.8rem; --theme-font-size-large: 3.8rem; --theme-font-family-general: 'Inter', -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif; --theme-font-family-heading: 'Noto Serif', serif; --theme-line-height-small: 1.4; --theme-line-height-normal: 1.6; --theme-line-height-big: 1.8; } /* Normalize --------------------------------------------- */ html { line-height: 1.15; -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } body { border: none; margin: 0; padding: 0; } main { display: block; } h1 { font-size: 2em; margin: 0.67em 0; } hr { box-sizing: content-box; height: 0; overflow: visible; } pre { font-family: monospace, monospace; font-size: 1em; } a { background-color: transparent; } abbr[title] { border-bottom: none; text-decoration: underline; text-decoration: underline dotted; } b, strong { font-weight: bolder; } code, kbd, samp { font-family: monospace, monospace; font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } img { border-style: none; vertical-align: top; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { overflow: visible; } button, select { text-transform: none; } button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } fieldset { padding: 0.35em 0.75em 0.625em; } legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; } progress { vertical-align: baseline; } textarea { overflow: auto; } [type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } details { display: block; } summary { display: list-item; } template { display: none; } [hidden] { display: none; } *, *::before, *::after { -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit; word-break: break-word; word-wrap: break-word; } /*-------------------------------------------------------------- # Base --------------------------------------------------------------*/ html { font-size: 62.5%; /* 1rem = 10px */ scroll-behavior: smooth; } @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } } body { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow-x: hidden; } /* Typography --------------------------------------------- */ body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } body, button, input, select, optgroup, textarea { color: var(--theme-text-color); font-family: var(--theme-font-family-general); font-size: var(--theme-font-size-normal); line-height: var(--theme-line-height-normal); letter-spacing: normal; } h1, h2, h3, h4, h5, h6 { font-family: var(--theme-font-family-heading); font-weight: 400; clear: both; margin-top: 0; } h1, h2, h3 { margin-bottom: 1.5rem; } h4, h5, h6 { margin-bottom: 1rem; } p { margin-bottom: 1.5em; } dfn, cite, em, i { font-style: italic; } blockquote { margin: 0 1.5em; } address { margin: 0 0 1.5em; } pre { background: #eee; font-family: "Courier 10 Pitch", courier, monospace; line-height: 1.6; margin-bottom: 1.6em; max-width: 100%; overflow: auto; padding: 1.6em; } code, kbd, tt, var { font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace; } abbr, acronym { border-bottom: 1px dotted #666; cursor: help; } mark, ins { background: #fff9c0; text-decoration: none; } big { font-size: 125%; } .entry-title, .site-section-title { line-height: 1.4; } .site-section-title, .entry-title-large { font-size: var(--theme-font-size-large); } .entry-title-big { font-size: var(--theme-font-size-big); } .entry-title-medium, .widget-title, .widget_block .wp-block-group__inner-container > h2, .single-component-title { font-size: var(--theme-font-size-medium); } .site-section-subtitle, .entry-title-small { font-size: var(--theme-font-size-small); } .entry-title-normal{ font-size: var(--theme-font-size-normal); } @media (max-width: 767px) { .entry-title-large { font-size: var(--theme-font-size-big); } } .entry-title:not(.entry-title-large) { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .entry-title a { background: -webkit-gradient(linear, left top, right top, from(currentColor), to(currentColor)); background: linear-gradient(to right, currentColor 0%, currentColor 100%); background-size: 0px 3px; background-repeat: no-repeat; background-position: left 100%; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; } .entry-title a:hover, .entry-title a:focus { background-size: 100% 3px; } /* Elements --------------------------------------------- */ body { background-color: var(--theme-bg-color); } hr { background-color: #ccc; border: 0; height: 1px; margin-bottom: 1.5em; } ul, ol { margin: 0 0 1.5em 3em; } ul { list-style: disc; } ol { list-style: decimal; } li > ul, li > ol { margin-bottom: 0; margin-left: 1.5em; } .reset-list-style, .reset-list-style ul, .reset-list-style ol { list-style: none; margin: 0; padding: 0; } .reset-list-style li { margin: 0; } dt { font-weight: 700; } dd { margin: 0 1.5em 1.5em; } /* Make sure embeds and iframes fit their containers. */ embed, iframe, object { max-width: 100%; } img { height: auto; max-width: 100%; } figure { margin: 1em 0; } table { margin: 0 0 1.5em; width: 100%; } @media (min-width: 768px) { .cursor-dot, .cursor-dot-outline { z-index: 1100; pointer-events: none; position: fixed; top: 50%; left: 50% /* rtl:ignore */; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border-radius: 50%; opacity: 0; -webkit-transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out; transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; } .cursor-dot { width: 8px; height: 8px; background-color: var(--theme-accent-color); } .cursor-dot-outline { width: 30px; height: 30px; background-color: var(--theme-accent-color); opacity: 0.4 !important; } } .h-100 { height: 100% !important; } .align-self-center { -ms-flex-item-align: center !important; align-self: center !important; } .align-self-bottom { -ms-flex-item-align: flex-end !important; align-self: flex-end !important; } .align-content-center { -ms-flex-line-pack: center !important; align-content: center !important; } .justify-content-center { -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } .text-center { text-align: center !important; } /*rtl:begin:ignore*/ .text-left { text-align: left !important; } .text-right { text-align: right !important; } /*rtl:end:ignore*/ .data-bg { background-color: #d8d8d8; background-size: cover; background-position: center; background-repeat: no-repeat; display: block; position: relative; } .data-bg-fixed { background-attachment: fixed; } .data-bg-large { height: 600px; } @media (max-width: 1600px) { .data-bg-large { height: 500px; } } @media (max-width: 767px) { .data-bg-large { height: 450px; } } .data-bg-overlay { position: relative; } .data-bg-overlay:before { content: " "; background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), color-stop(58%, rgba(0, 0, 0, 0.9))); background-image: linear-gradient(-180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.9) 58%); position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; } .article-has-effect .entry-image:before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; top: 0; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='3' height='3'%3E%3Ccircle cx='2.5' cy='2.5' r='.5' /%3E%3C/svg%3E") repeat bottom right; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='3' height='3'%3E%3Ccircle cx='2.5' cy='2.5' r='.5' /%3E%3C/svg%3E") repeat bottom right; background-color: var(--theme-bg-color); } .article-has-effect .featured-media { transition: transform .2s linear; } .article-has-effect:hover .featured-media, .article-has-effect:focus .featured-media { transform: translate(-12px, -12px); } .article-has-effect:hover .entry-image:before, .article-has-effect:focus .entry-image:before { background-color: var(--theme-component-color); } .theme-menu { display: -ms-flexbox; display: flex; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; gap: 1rem; } .theme-social-navigation a { display: block; } .theme-social-navigation .svg-icon { display: block; height: 2rem; width: 2rem; } ::-moz-selection { background: #000000; color: #ffffff; } ::selection { background: #000000; color: #ffffff; } /* Links --------------------------------------------- */ a { color: #000; text-decoration: none; } a:hover, a:focus, a:active { color: var(--theme-accent-color); outline: 0; } a:focus-visible { outline: 1px solid; } .page-content a:not(.more-link):not(.button):not(.wp-block-button__link):not(.read-more-link), .entry-content a:not(.more-link):not(.button):not(.wp-block-button__link):not(.read-more-link), .entry-summary a:not(.more-link):not(.button):not(.wp-block-button__link):not(.read-more-link), .widget_text a:not(.more-link):not(.button) { text-decoration: underline; } .read-more-link { white-space: nowrap; } /* Forms --------------------------------------------- */ fieldset { border: 0.2rem solid #dcd7ca; padding: 2rem; } legend { font-size: 0.85em; font-weight: 700; padding: 0 1rem; } label { display: block; font-size: 1.6rem; font-weight: 400; margin: 0 0 0.5rem 0; } label.inline, input[type="checkbox"] + label { display: inline; font-weight: 400; margin-left: 0.5rem; } input[type="checkbox"] { -webkit-appearance: none; -moz-appearance: none; position: relative; top: 2px; display: inline-block; margin: 0; width: 1.5rem; min-width: 1.5rem; height: 1.5rem; background: #fff; border-radius: 0; border-style: solid; border-width: 0.1rem; border-color: #dcd7ca; box-shadow: none; cursor: pointer; } input[type="checkbox"]:checked::before { /* Use the "Yes" SVG Dashicon */ content: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20d%3D%27M14.83%204.89l1.34.94-5.81%208.38H9.02L5.78%209.67l1.34-1.25%202.57%202.4z%27%20fill%3D%27%23000000%27%2F%3E%3C%2Fsvg%3E"); position: absolute; display: inline-block; margin: -0.1875rem 0 0 -0.25rem; height: 1.75rem; width: 1.75rem; } input, textarea, button, .button { line-height: 1; } input, textarea { color: #000; } code, input[type="url"], input[type="email"], input[type="tel"] { /*rtl:ignore*/ direction: ltr; } input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="date"], input[type="month"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="week"], input[type="number"], input[type="search"], input[type="tel"], input[type="color"], textarea { -webkit-appearance: none; -moz-appearance: none; background: #fff; border-radius: 0; border-style: solid; border-width: 0.1rem; box-shadow: none; display: block; font-size: 1.6rem; letter-spacing: -0.015em; margin: 0; max-width: 100%; padding: 1.5rem 1.8rem; min-height: 5.5rem; width: 100%; } input[type="number"] { padding-right: 0.5rem; } select { font-size: 1em; } textarea { height: 12rem; line-height: 1.5; width: 100%; } input::-webkit-input-placeholder { line-height: normal; } input:-ms-input-placeholder { line-height: normal; } input::-moz-placeholder { line-height: revert; /* Reset to the value from the user-agent stylesheet. */ } input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-results-button, input[type="search"]::-webkit-search-results-decoration { display: none; } button, .theme-button, .wp-block-search__button, input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: none; -moz-appearance: none; border: 1px solid; border-color: var(--theme-accent-color); border-radius: 3px; background-color: var(--theme-accent-color); border-radius: 0; color: var(--theme-bg-color); cursor: pointer; display: inline-block; font-weight: 700; line-height: 1.25; margin: 0; opacity: 1; padding: 1.1em 1.44em; text-align: center; text-decoration: none; transition: opacity 0.15s linear; min-height: 5.5rem; } button:focus, button:hover, .theme-button:focus, .theme-button:hover, .wp-block-search__button:focus, .wp-block-search__button:hover, input[type="button"]:focus, input[type="button"]:hover, input[type="reset"]:focus, input[type="reset"]:hover, input[type="submit"]:focus, input[type="submit"]:hover { background: var(--theme-accent-hover-color); border-color: var(--theme-accent-hover-color); color: var(--theme-bg-color); } input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="number"]:focus, input[type="tel"]:focus, input[type="range"]: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, textarea:focus { border-color: currentColor; } input[type="search"]:focus { outline: thin dotted; outline-offset: -4px; } .theme-button .svg-icon { display: block; height: 2rem; width: 2rem; } [data-theme="dark"] .theme-button.theme-button-transparent, [data-theme="light"] .theme-button.theme-button-transparent, .theme-button-transparent { background: none; border: none; box-shadow: none; border-radius: 0; padding: 0; } .theme-button.theme-button-transparent { color: var(--theme-text-color); } [data-theme="dark"] .theme-button.theme-button-transparent:hover, [data-theme="light"] .theme-button.theme-button-transparent:hover, [data-theme="dark"] .theme-button.theme-button-transparent:focus, [data-theme="light"] .theme-button.theme-button-transparent:focus, .theme-button.theme-button-transparent:hover, .theme-button.theme-button-transparent:focus { background: none; border: none; box-shadow: none; } .theme-button.theme-button-transparent:hover, .theme-button.theme-button-transparent:focus { color: var(--theme-accent-color); } .theme-button.theme-button-transparent:focus-visible { outline: thin dotted; text-decoration: none; } /*-------------------------------------------------------------- # Layouts --------------------------------------------------------------*/ /*-------------------------------------------------------------- # Components --------------------------------------------------------------*/ /* Base --------------------------------------------- */ .column-row { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; } .column-row-collapse { margin-right: 0; margin-left: 0; } .column-row-small { margin-right: -5px; margin-left: -5px; } .column-row-center .column { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; align-content: center; align-items: center; } .column { position: relative; width: 100%; padding-right: 15px; padding-left: 15px; } .column-row-collapse > .column { padding-right: 0; padding-left: 0; } .column-row-small > .column { padding-right: 5px; padding-left: 5px; } .column-1 { -ms-flex: 0 0 8.333333%; flex: 0 0 8.333333%; max-width: 8.333333%; } .column-2 { -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%; } .column-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .column-4 { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; } .column-5 { -ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%; max-width: 41.666667%; } .column-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .column-7 { -ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333%; } .column-8 { -ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667%; } .column-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .column-10 { -ms-flex: 0 0 83.333333%; flex: 0 0 83.333333%; max-width: 83.333333%; } .column-11 { -ms-flex: 0 0 91.666667%; flex: 0 0 91.666667%; max-width: 91.666667%; } .column-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } @media (min-width: 992px) { .column-order-1 { -ms-flex-order: 1; order: 1; } .column-order-2 { -ms-flex-order: 2; order: 2; } .column-order-3 { -ms-flex-order: 3; order: 3; } } @media (max-width: 1200px) { .order-md-1 { -ms-flex-order: 1; order: 1; } .order-md-2 { -ms-flex-order: 2; order: 2; } .order-md-3 { -ms-flex-order: 3; order: 3; } } @media (max-width: 1200px) and (min-width: 992px) { .column-md-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .column-md-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .column-md-4 { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; } .column-md-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } } @media (max-width: 991px) { .column-sm-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .column-sm-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .column-sm-4 { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; } .column-sm-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } } @media (max-width: 767px) { .column-xs-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .column-xs-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .column-xs-4 { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; } .column-xs-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .hidden-xs-screen { display: none; visibility: hidden; opacity: 0; } } @media (max-width: 767px) { .hide-on-mobile { display: none !important; visibility: hidden !important; opacity: 0 !important; } } @media (min-width: 768px) and (max-width: 1024px) { .hide-on-tablet { display: none !important; visibility: hidden !important; opacity: 0 !important; } } @media (min-width: 1025px) { .hide-on-desktop { display: none !important; visibility: hidden !important; opacity: 0 !important; } } .wrapper { width: calc(100vw - 3rem); margin-left: auto; margin-right: auto; max-width: 100%; } .single.no-sidebar .entry-content { margin-left: auto; margin-right: auto; } .wp-block-group .wp-block-group__inner-container > *.alignfull, .wrapper-fluid { max-width: 100%; width: 100%; margin-left: auto; margin-right: auto; } .alignfull [class*="inner-container"] > .alignwide, .alignwide [class*="inner-container"] > .alignwide { margin-left: auto; margin-right: auto; width: calc(100vw - 3rem); max-width: 100%; } @media only screen and (min-width: 482px) { .wrapper { max-width: calc(100vw - 10rem); } .wrapper-fluid { max-width: 100%; width: auto; } .single.no-sidebar .entry-content { max-width: min(calc(100vw - 10rem), 68rem); } .alignfull [class*="inner-container"] > .alignwide, .alignwide [class*="inner-container"] > .alignwide { width: calc(100vw - 10rem); } .header-style-aside .wrapper, .header-style-aside .alignfull [class*="inner-container"] > .alignwide, .header-style-aside .alignwide [class*="inner-container"] > .alignwide { width: 100%; } } @media only screen and (min-width: 992px) { .wrapper { max-width: min(calc(100vw - 20rem), 124rem); } .single.no-sidebar .entry-content { max-width: min(calc(100vw - 20rem), 68rem); } .no-sidebar .alignfull { margin: 3rem calc(50% - 50vw); max-width: 100vw; width: 100vw; } .no-sidebar .alignwide { margin-left: calc(50% - 62rem); margin-right: calc(50% - 62rem); max-width: min(100vw, 124rem); } .alignfull [class*="inner-container"] > .alignwide, .alignwide [class*="inner-container"] > .alignwide { width: min(calc(100vw - 20rem), 124rem); } } @media only screen and (min-width: 482px) { .no-sidebar .entry-content > .alignleft { /*rtl:ignore*/ margin-left: calc(0.5 * (100vw - min(calc(100vw - 20rem), 68rem))); /*rtl:ignore*/ margin-right: 2.5rem; } } @media only screen and (min-width: 482px) { .no-sidebar .entry-content > .alignright { /*rtl:ignore*/ margin-left: 2.5rem; /*rtl:ignore*/ margin-right: calc(0.5 * (100vw - min(calc(100vw - 20rem), 68rem))); } } .site-header, #site-content, .site-footer { margin-left: auto; margin-right: auto; } .blogauthor-entry-meta { display: flex; align-items: center; gap: 2rem; } .blogauthor-meta { display: flex; align-items: center; line-height: 1; } .blogauthor-meta .meta-icon { margin-right: .5rem; } .entry-meta-footer { display: flex; gap: 2rem; align-items: center; } .entry-image { position: relative; } .entry-image .post-read-time { position: absolute; top: 1.5rem; right: 1.5rem; } .post-read-time { background-color: var(--theme-accent-color); color: #fff; padding: 0.5rem 1rem; border-radius: 4px; max-width: 14rem; justify-content: center; } .entry-categories { margin-bottom: 1rem; } .entry-categories a { display: inline-block; position: relative; text-decoration: none; padding: 0.2rem 0.5rem; font-size: 1rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2rem; background-color: var(--theme-accent-color); color: var(--theme-white-color); -webkit-transition: all 0.234s ease-in-out; -o-transition: all 0.234s ease-in-out; transition: all 0.234s ease-in-out; } .entry-categories a:nth-child(7n+2) { background-color: #8e65c0; } .entry-categories a:nth-child(7n+3) { background-color: #0987f5; } .entry-categories a:nth-child(7n+4) { background-color: #de1651; } .entry-categories a:nth-child(7n+5) { background-color: #46af4b; } .entry-categories a:nth-child(7n+6) { background-color: #ea8d03; } .entry-categories a:nth-child(7n+7) { background-color: #ff5722; } .entry-categories a:hover, .entry-categories a:focus { background-color: var(--theme-accent-color); color: var(--theme-white-color); } /* Progress Bar *----------------------------------- */ #blogauthor-progress-bar { background-color: var(--theme-accent-color); position: fixed; width: 0; height: 4px; z-index: 99999; } #blogauthor-progress-bar.top { top: 0; } .admin-bar #blogauthor-progress-bar.top { top: 32px; } @media only screen and (max-width: 782px) { .admin-bar #blogauthor-progress-bar.top { top: 46px; } } @media only screen and (max-width: 600px) { .admin-bar #blogauthor-progress-bar.top { top: 0; } } #blogauthor-progress-bar.bottom { bottom: 0; } /* Preloader --------------------------------------------- */ .theme-preloader { width: 100%; height: 100vh; position: fixed; background-color: #fff; z-index: 999999; display: flex; justify-content: center; align-items: center; opacity: 1; } .theme-preloader-spinner { width: 100vw; height: 100vh; position: relative; display: block; background-color: var(--theme-component-color); } .theme-preloader-spinner-1 .theme-preloader-throbber { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .theme-preloader-spinner-1 .theme-preloader-throbber::after { content: ""; display: block; width: 64px; height: 64px; margin: 8px; border-radius: 50%; border: 6px solid var(--theme-accent-color); border-color: var(--theme-accent-color) transparent var(--theme-accent-color) transparent; animation: preloader 1s linear infinite; } .theme-preloader-spinner-2 .theme-preloader-throbber { border-radius: 100%; height: 10px; width: 10px; background-color: #ffffff; position: absolute; left: 0; right: 0; margin: auto; top: 0; bottom: 0; box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff; -webkit-animation: load 3s infinite linear; -moz-animation: load 3s infinite linear; -o-animation: load 3s infinite linear; animation: load 3s infinite linear; } @keyframes preloader { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @-webkit-keyframes load { 0% { -webkit-transform: translate(0px, 0px), rotate(0deg); box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff; } 25% { box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff; } 50% { box-shadow: 0px -40px 0px 0px #ffffff, 0px 40px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff; } 70% { box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; } 75% { box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; height: 10px; width: 10px; } 80% { -webkit-transform: translate(0px, 0px) rotate(360deg); box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; background-color: #ffffff; height: 40px; width: 40px; } 85% { -webkit-transform: translate(0px, 0px) rotate(360deg); box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; background-color: #ffffff; height: 40px; width: 40px; } 90% { -webkit-transform: translate(0px, 0px) rotate(360deg); box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; background-color: #ffffff; height: 10px; width: 10px; } 95% { box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff; } 100% { -webkit-transform: rotate(360deg); box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff; } } @-moz-keyframes load { 0% { -moz-transform: translate(0px, 0px), rotate(0deg); box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff; } 25% { box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff; } 50% { box-shadow: 0px -40px 0px 0px #ffffff, 0px 40px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff; } 70% { box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; } 75% { box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; height: 10px; width: 10px; } 80% { -moz-transform: translate(0px, 0px) rotate(360deg); box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; background-color: #ffffff; height: 40px; width: 40px; } 85% { -moz-transform: translate(0px, 0px) rotate(360deg); box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; background-color: #ffffff; height: 40px; width: 40px; } 90% { -moz-transform: translate(0px, 0px) rotate(360deg); box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; background-color: #ffffff; height: 10px; width: 10px; } 95% { box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff; } 100% { -moz-transform: rotate(360deg); box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff; } } @keyframes load { 0% { transform: translate(0px, 0px), rotate(0deg); box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff; } 25% { box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff; } 50% { box-shadow: 0px -40px 0px 0px #ffffff, 0px 40px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff; } 70% { box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; } 75% { box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; height: 10px; width: 10px; } 80% { transform: translate(0px, 0px) rotate(360deg); box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; background-color: #ffffff; height: 40px; width: 40px; } 85% { transform: translate(0px, 0px) rotate(360deg); box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; background-color: #ffffff; height: 40px; width: 40px; } 90% { transform: translate(0px, 0px) rotate(360deg); box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; background-color: #ffffff; height: 10px; width: 10px; } 95% { box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff; } 100% { transform: rotate(360deg); box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff; } } @-o-keyframes load { 0% { -o-transforms: translate(0px, 0px), rotate(0deg); box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff; } 25% { box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff; } 50% { box-shadow: 0px -40px 0px 0px #ffffff, 0px 40px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff; } 70% { box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; } 75% { box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; height: 10px; width: 10px; } 80% { -o-transforms: translate(0px, 0px) rotate(360deg); box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; background-color: #ffffff; height: 40px; width: 40px; } 85% { -o-transforms: translate(0px, 0px) rotate(360deg); box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; background-color: #ffffff; height: 40px; width: 40px; } 90% { -o-transforms: translate(0px, 0px) rotate(360deg); box-shadow: 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff, 0px 0px 0px 0px #ffffff; background-color: #ffffff; height: 10px; width: 10px; } 95% { box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff; } 100% { -o-transforms: rotate(360deg); box-shadow: 0px 40px 0px 0px #ffffff, 0px -40px 0px 0px #ffffff, 40px 0px 0px 0px #ffffff, -40px 0px 0px 0px #ffffff, 40px 40px 0px 0px #ffffff, -40px -40px 0px 0px #ffffff, 40px -40px 0px 0px #ffffff, -40px 40px 0px 0px #ffffff; } } .theme-preloader-spinner-3 .theme-preloader-throbber { width: 48px; height: 48px; border-radius: 50%; display: inline-block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border: 3px solid; border-color: #FFF #FFF transparent transparent; -webkit-animation: rotation 1s linear infinite; animation: rotation 1s linear infinite; } .theme-preloader-spinner-3 .theme-preloader-throbber:after, .theme-preloader-spinner-3 .theme-preloader-throbber:before { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border: 3px solid; border-color: transparent transparent var(--theme-accent-color) var(--theme-accent-color); width: 40px; height: 40px; border-radius: 50%; -webkit-animation: rotationBack 0.5s linear infinite; animation: rotationBack 0.5s linear infinite; transform-origin: center center; } .theme-preloader-spinner-3 .theme-preloader-throbber:before { width: 32px; height: 32px; border-color: #FFF #FFF transparent transparent; -webkit-animation: rotation 1.5s linear infinite; animation: rotation 1.5s linear infinite; } @-webkit-keyframes rotation { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes rotation { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @-webkit-keyframes rotationBack { 0% { transform: rotate(0deg); } 100% { transform: rotate(-360deg); } } @keyframes rotationBack { 0% { transform: rotate(0deg); } 100% { transform: rotate(-360deg); } } .theme-preloader-spinner-4 .theme-preloader-throbber { width: 0; height: 4.8px; display: inline-block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #FFF; box-shadow: 0 0 10px rgba(255, 255, 255, 0.5); -webkit-animation: animFw 8s linear infinite; animation: animFw 8s linear infinite; } .theme-preloader-spinner-4 .theme-preloader-throbber::after, .theme-preloader-spinner-4 .theme-preloader-throbber::before { content: ""; width: 10px; height: 1px; background: #FFF; position: absolute; top: 9px; right: -2px; opacity: 0; transform: rotate(-45deg) translateX(0px); -webkit-animation: coli1 0.3s linear infinite; animation: coli1 0.3s linear infinite; } .theme-preloader-spinner-4 .theme-preloader-throbber::before { top: -4px; transform: rotate(45deg); -webkit-animation: coli2 0.3s linear infinite; animation: coli2 0.3s linear infinite; } @-webkit-keyframes animFw { 0% { width: 0; } 100% { width: 100%; } } @keyframes animFw { 0% { width: 0; } 100% { width: 100%; } } @-webkit-keyframes coli1 { 0% { transform: rotate(-45deg) translateX(0px); opacity: 0.7; } 100% { transform: rotate(-45deg) translateX(-45px); opacity: 0; } } @keyframes coli1 { 0% { transform: rotate(-45deg) translateX(0px); opacity: 0.7; } 100% { transform: rotate(-45deg) translateX(-45px); opacity: 0; } } @-webkit-keyframes coli2 { 0% { transform: rotate(45deg) translateX(0px); opacity: 1; } 100% { transform: rotate(45deg) translateX(-45px); opacity: 0.7; } } @keyframes coli2 { 0% { transform: rotate(45deg) translateX(0px); opacity: 1; } 100% { transform: rotate(45deg) translateX(-45px); opacity: 0.7; } } /* Top Bar --------------------------------------------- */ .site-topbar { border-bottom: 0.1rem solid; padding-bottom: 1rem; padding-top: 1rem; } .site-topbar .site-topbar-wrapper { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1.5rem; } .site-topbar-wrapper .site-topbar-item { display: -ms-flexbox; display: flex; align-items: center; gap: 1.5rem; } .site-topbar-wrapper .site-topbar-item .theme-button { display: flex; align-items: center; gap: 0.3rem; } .site-header .header-component-center { display: flex; align-items: center; justify-content: center; gap: 2rem; } .site-header .site-header-component { display: -ms-flexbox; display: flex; align-items: center; gap: 1rem; line-height: 1; } .site-header { border-bottom: 0.1rem solid; display: flex; flex-direction: column; justify-content: center; position: relative; } .header-style-aside .site-header, .home .site-header, .blog .site-header { border-bottom: none; } .site-header.header-has-overlay:before { content: " "; background-color: var(--theme-component-color); background: -moz-linear-gradient( top, black 0, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.63) 63%, rgba(0, 0, 0, 1) 100% ); background: -webkit-linear-gradient( top, black 0, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.63) 63%, rgba(0, 0, 0, 1) 100% ); background: linear-gradient( to bottom, black 0, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.63) 63%, rgba(0, 0, 0, 1) 100% ); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#c9000000', GradientType=0); opacity: 0.4; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; } .site-header.header-has-height-small { min-height: 20rem; } .site-header.header-has-height-medium { min-height: 30rem; } .site-header.header-has-height-large { min-height: 40rem; } @media (max-width: 991px) { .site-header.header-has-height-large { min-height: 30rem; } } @media (max-width: 575px) { .site-header.header-has-height-medium, .site-header.header-has-height-large { min-height: 25rem; } } .site-header .masthead-main-navigation { padding-top: 2rem; padding-bottom: 2rem; position: relative; } .site-header .has-sticky-header.sticky-header-active { position: fixed; top: 0; z-index: 9999; background: #fff; width: 100%; padding: 1rem 0; -webkit-box-shadow: 0px 0px 40px rgba(83, 88, 93, 0.2); box-shadow: 0px 0px 40px rgba(83, 88, 93, 0.2); transition: padding 150ms linear; } .admin-bar .site-header .has-sticky-header.sticky-header-active { top: 32px; } @media screen and (max-width: 782px) { .admin-bar .site-header .has-sticky-header.sticky-header-active { top: 46px; } } @media screen and (max-width: 600px) { .admin-bar .site-header .has-sticky-header.sticky-header-active { top: 0; } } .site-header-wrapper { display: grid; align-items: center; justify-items: center; } .blogauthor-header_style_2 .site-header-wrapper { grid-template-columns: auto 1fr auto; } .blogauthor-header_style_4 .masthead-main-navigation { margin-top: auto; margin-bottom: 0; } .blogauthor-header_style_4 .site-header.data-bg .masthead-main-navigation { background-color: var(--theme-bg-color); padding-top: 1rem; padding-bottom: 1rem; } .site-header-left, .site-header-right { gap: 2rem; display: flex; align-content: center; } .site-header-left { justify-content: flex-start; justify-self: start; } .site-header-center { justify-content: center; justify-self: center; } .site-header-right { justify-content: flex-end; justify-self: end; } .blogauthor-header_style_3 .site-header-left { justify-self: start; } .blogauthor-header_style_3 .site-header-right { justify-self: end; } .site-content-area .main-page-wrapper { background-color: #f3f3f3; } .site-content-area .main-page-wrapper { background-color: rgba(0, 0, 0, 0.045); } .has-sidebar #site-content #secondary { background-color: var(--theme-bg-color); min-height: 100vh; } @media only screen and (min-width: 1025px) { .header-style-aside .site-content-area { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; } .header-style-aside.header-style-aside-fixed .site-content-area .site-header, .header-style-aside.header-style-aside-fixed .site-content-area .main-page-wrapper { position: -webkit-sticky; position: sticky; top: 0; -ms-flex-item-align: start; align-self: flex-start; } .header-style-aside .site-content-area .site-header { width: 100%; -ms-flex: 0 0 380px; flex: 0 0 380px; max-width: 380px; justify-content: flex-start; } .header-style-aside .header-individual-component { padding: 2rem; border-bottom: 0.1rem solid; } .header-style-aside .header-individual-component.extras-components { display: flex; align-items: center; gap: 2rem; } .header-style-aside .header-individual-component.extras-components .theme-button { min-height: auto; } .header-style-aside .site-content-area .main-page-wrapper { min-height: 100vh; -ms-flex: 0 0 calc(100% - 380px); flex: 0 0 calc(100% - 380px); max-width: calc(100% - 380px); } .site-categories-section .main-page-wrapper .site-section-subtitle { padding-left: 10rem; padding-right: 10rem; } } @media only screen and (min-width: 1400px) { .header-style-aside .site-content-area .site-header { margin-left: 60px; } .header-style-aside .site-content-area .site-header.data-bg { padding-left: 20px; } .header-style-aside .site-content-area .main-page-wrapper { -ms-flex: 0 0 calc(100% - 440px); flex: 0 0 calc(100% - 440px); max-width: calc(100% - 440px); } .header-style-aside .header-individual-component { padding-left: 0; } } @media only screen and (max-width: 1024px) { .header-style-aside .branding-components { display: flex; align-items: center; justify-content: space-between; gap: 3rem; padding: 2rem 5rem; } .header-style-aside .branding-components-extras { display: flex; gap: 2rem; flex-shrink: 0; } } @media only screen and (max-width: 482px) { .header-style-aside .branding-components { padding-left: 1.5rem; padding-right: 1.5rem } } /* Site Branding --------------------------------------------- */ .site-branding { display: inline-block; } .site-title, .site-logo, .site-description { line-height: 1; margin: 0; } .site-title { font-family: var(--theme-font-family-heading); font-size: 5.2rem; font-weight: 700; letter-spacing: -2.4px; margin: 0; } .blogauthor-header_style_4 .site-title, .blogauthor-header_style_3 .site-title { font-size: 14rem; margin-bottom: 3rem; text-transform: inherit; } @media only screen and (max-width: 991px) { .blogauthor-header_style_4 .site-title, .blogauthor-header_style_3 .site-title { font-size: 9rem; margin-bottom: 2rem; margin-top: 1rem; } } @media only screen and (max-width: 767px) { .blogauthor-header_style_4 .site-title, .blogauthor-header_style_3 .site-title { font-size: 6rem; } } @media only screen and (max-width: 575px) { .blogauthor-header_style_4 .site-title, .blogauthor-header_style_3 .site-title { font-size: 4.5rem; } } .site-title a { display: block; text-decoration: none; } .site-logo a, .site-logo img { display: block; } .header-has-overlay .site-title a, .header-has-overlay .site-description { color: var(--theme-bg-color); } .site-logo img { max-width: 30rem; margin: 0 auto; width: auto; } .blogauthor-header_style_2 .site-logo img, .blogauthor-header_style_3 .site-logo img { max-height: 6rem; } .site-logo + .site-title { margin-top: 1rem; } .site-description { margin-top: 2rem; font-size: 1.8rem; filter: alpha(opacity=85); opacity: .85; position: relative; transition: all 0.15s linear; } .blogauthor-header_style_4 .site-description span, .blogauthor-header_style_3 .site-description span { background: var(--theme-bg-color); padding: 0 30px; } .blogauthor-header_style_4 .site-description:after, .blogauthor-header_style_3 .site-description:after { content: ""; height: 1px; background: #e4e4e4; position: absolute; bottom: 50%; left: 0; right: 0; margin-left: auto; margin-right: auto; width: calc(100% - 6rem); z-index: -1; } @media only screen and (max-width: 767px) { .blogauthor-header_style_4 .site-description span, .blogauthor-header_style_3 .site-description span { padding: 0; } } .site-branding-center { padding-bottom: 2rem; padding-top: 4rem; position: relative; text-align: center; z-index: 1; } @media (max-width: 767px) { .site-title { font-size: var(--theme-font-size-big); } } /* Navigation --------------------------------------------- */ .theme-primary-menu { display: none; } @media only screen and (min-width: 992px) { .theme-primary-menu { display: block; } } ul.primary-menu { display: -ms-flexbox; display: flex; font-size: 2rem; font-weight: 500; letter-spacing: 0.01rem; flex-wrap: wrap; align-items: center; } .primary-menu li { font-size: 1.5rem; line-height: 1.25; position: relative; } .primary-menu > li { margin: 0 2rem 0 0; } .primary-menu > li .icon { font-size: inherit; vertical-align: middle; } .primary-menu svg { width: 1.2rem; height: 1.2rem; display: inline-block; margin-left: 1rem; fill: currentColor; } .primary-menu a { display: block; font-size: 2rem; line-height: 1.2; padding: 1rem 0; text-decoration: none; word-break: normal; word-wrap: normal; } .primary-menu li.current-menu-item > a, .primary-menu li.current-menu-item > .link-icon-wrapper > a { text-decoration: underline; } .primary-menu li.current-menu-item > a:hover, .primary-menu li.current-menu-item > .link-icon-wrapper > a:hover, .primary-menu li.current-menu-item > a:focus, .primary-menu li.current-menu-item > .link-icon-wrapper > a:focus { text-decoration: none; } /* SUB MENU */ .primary-menu ul { background-color: var(--theme-bg-color); font-size: 1.4rem; position: absolute; right: 9999rem; top: calc(100% + 1.1rem); padding: 1rem 0; width: 25rem; opacity: 0; z-index: 10; transition: opacity 0.15s linear, transform 0.15s linear, right 0s 0.15s; transform: translateY(0.6rem); box-shadow: 0 15px 45px 15px rgba(0, 0, 0, .07); } .primary-menu li.menu-item-has-children:hover > ul, .primary-menu li.menu-item-has-children:focus > ul, .primary-menu li.menu-item-has-children.focus > ul { right: 0; opacity: 1; transform: translateY(0); transition: opacity 0.15s linear, transform 0.15s linear; } .primary-menu ul::before { content: ""; display: block; position: absolute; bottom: 100%; left: 0; right: 0; border: 1rem solid transparent; } .primary-menu ul a { background: transparent; border: none; color: inherit; display: block; padding: 1rem 2rem; transition: background-color 0.15s linear; width: 100%; } .primary-menu ul a .icon { position: absolute; right: 2rem; } .primary-menu ul a:hover { color: #066ac6; } /* DEEP DOWN */ .primary-menu ul ul { top: -1rem; } .primary-menu ul li.menu-item-has-children:hover > ul, .primary-menu ul li.menu-item-has-children:focus > ul, .primary-menu ul li.menu-item-has-children.focus > ul { right: 100%; } /* * Enable nav submenu expansion with tapping on arrows on large-viewport * touch interfaces (e.g. tablets or laptops with touch screens). * These rules are supported by all browsers (>IE11) and when JS is disabled. */ @media (any-pointer: coarse) { .primary-menu > li.menu-item-has-children > a { padding-right: 0; margin-right: 2rem; } .primary-menu ul li.menu-item-has-children > a { margin-right: 4.5rem; padding-right: 0; width: unset; } } /* Repeat previous rules for IE11 (when JS enabled for polyfill). */ body.touch-enabled .primary-menu > li.menu-item-has-children > a { padding-right: 0; margin-right: 2rem; } body.touch-enabled .primary-menu ul li.menu-item-has-children > a { margin-right: 4.5rem; padding-right: 0; width: unset; } #page.site { position: relative; width: 100%; min-height: 100%; z-index: 1; transition: transform 0.5s ease-in-out; } #page.site::before { content: ""; display: block; position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%; background-color: rgba(21, 32, 53, 0.3); z-index: 9; opacity: 0; visibility: hidden; transition: all 0.5s ease-in-out; } /* Search Canvas **------------------------------------------------ */ .blogauthor-search-canvas-open #page.site::before { display: block; opacity: 1; visibility: visible; } .theme-search-panel { position: fixed; top: 0; left: 0; width: 100vw; padding: 10rem 0; background-color: var(--theme-bg-color); z-index: 9999; opacity: 0; visibility: hidden; transform: translateY(-100%); transition: all 0.5s ease-in-out; } .admin-bar .theme-search-panel { top: 32px; } @media only screen and (max-width: 782px) { .admin-bar .theme-search-panel { top: 46px; } } @media only screen and (max-width: 600px) { .admin-bar .theme-search-panel { top: 0; } } .blogauthor-search-canvas-open .theme-search-panel { transform: translateY(0); opacity: 1; visibility: visible; } .search-panel-wrapper .search-form { margin: 0; padding: 0; display: block; } .theme-search-panel input.search-field { background-color: transparent; border: 0; border-radius: 0; border-bottom: 1px solid #ddd; font-size: 1.8rem; letter-spacing: 1px; width: 20rem; max-width: 100%; padding: 0 0 2rem 0; transition: width 0.3s ease 0.3s; } .blogauthor-search-canvas-open .theme-search-panel input.search-field { width: calc(100% - 5rem); } .theme-search-panel input:focus.search-field { border-bottom-color: var(--theme-accent-color); outline: none; } .theme-search-panel .search-submit { position: absolute; right: -9999rem; top: 45%; transform: translateY(-45%); } .theme-search-panel .search-submit { flex-shrink: 0; } .theme-search-panel .search-submit:focus { right: 15rem; } #theme-toggle-search-button:focus, .theme-search-panel .search-close:focus { outline: thin dotted; outline-offset: 3px; } .theme-search-panel .search-close { position: absolute; top: 3.5rem; right: 4.5rem; cursor: pointer; fill: var(--theme-accent-color); } .theme-search-panel .search-close svg { width: 4rem; height: 4rem; } .search-form-default { color: var(--theme-text-color); display: flex; position: relative; margin: 0; } .search-form-default label { width: 100%; } .search-form-default .search-field-default { -webkit-appearance: none; -moz-appearance: none; appearance: none; height: 50px; margin: 0; padding: 10px 20px 10px 45px; } .search-form-default .search-field-default:focus { outline: thin dotted; } .search-form-default .search-field-default:hover, .search-form-default .search-field-default:active { outline: 0; } .search-form-default svg { height: 20px; left: 15px; margin-top: -10px; position: absolute; top: 50%; transition: fill .2s; width: 20px; } /* Off Canvas **------------------------------------------------ */ .blogauthor-offcanvas-menu-open #page.site { position: fixed; transform: translateX(-42rem); } .blogauthor-offcanvas-widget-open #page.site { position: fixed; transform: translateX(42rem); } .blogauthor-offcanvas-menu-open #page.site::before, .blogauthor-offcanvas-widget-open #page.site::before { opacity: 1; visibility: visible; } .theme-offcanvas-panel { background-color: var(--theme-bg-color); position: fixed; top: 0; bottom: 0; width: 42rem; height: 100vh; overflow: hidden; display: -ms-flexbox; display: flex; flex-direction: column; opacity: 0; visibility: hidden; transition: all 0.5s ease-in-out; z-index: 999; } .theme-offcanvas-panel-menu { right: 0; transform: translateX(42rem); } .theme-offcanvas-panel-widget { left: 0; transform: translateX(-42rem); } @media only screen and (max-width: 575px) { .blogauthor-offcanvas-menu-open #page.site { transform: translateX(-31rem); } .blogauthor-offcanvas-widget-open #page.site { transform: translateX(31rem); } .theme-offcanvas-panel { width: 31rem; } .theme-offcanvas-panel-menu { transform: translateX(31rem); } .theme-offcanvas-panel-widget { transform: translateX(-31rem); } } .blogauthor-offcanvas-menu-open .theme-offcanvas-panel-menu { opacity: 1; visibility: visible; } .blogauthor-offcanvas-widget-open .theme-offcanvas-panel-widget { opacity: 1; visibility: visible; } .theme-offcanvas-header { padding: 2rem; border-bottom: 2px solid; align-items: center; display: -ms-flexbox; display: flex; font-size: 1.6rem; font-weight: 500; justify-content: flex-end; width: 100%; } .theme-offcanvas-content { height: 100%; overflow-y: auto; overflow-x: hidden; margin-bottom: 6rem; padding: 2rem; } .theme-offcanvas-header #theme-offcanvas-close { display: -ms-flexbox; display: flex; align-items: center; justify-content: flex-end; line-height: 1.2; padding: 0.5rem; cursor: pointer; } .theme-offcanvas-header #theme-offcanvas-close span { display: inline-block; margin: 0; margin-right: 0.5rem; padding: 0; } .offcanvas-sidebar .widget { margin: 0; padding: 2rem 0; } .offcanvas-sidebar .widget:last-child { margin-bottom: 3rem; } /* Canvas Mobile Menu **------------------------------------------------ */ .theme-offcanvas-content nav { margin-bottom: 3rem; } .theme-offcanvas-content .after-menu-offcanvas { padding-bottom: 3rem; } .theme-offcanvas-menu { position: relative; width: 100%; } .theme-offcanvas-menu li { line-height: 1; margin: 0; } .theme-offcanvas-menu .ancestor-wrapper { display: -ms-flexbox; display: flex; justify-content: space-between; } .theme-offcanvas-menu a { display: block; padding: 1.5rem 0; text-decoration: none; width: 100%; } .theme-offcanvas-menu a:focus-visible { outline: none; border: 0.1rem solid var(--theme-accent-color); } button.sub-menu-toggle { border-left: 0.1rem solid #dedfdf; flex-shrink: 0; min-height: inherit; padding: 0 2.5rem; } button.sub-menu-toggle:focus { outline: thin dotted; } button.sub-menu-toggle svg { height: 0.9rem; transition: transform 0.15s linear; width: 1.5rem; } button.sub-menu-toggle.active svg { transform: rotate(180deg); } .theme-offcanvas-menu ul { margin: 0; width: 100%; display: none; height: 0; overflow: hidden; transition: height 350ms ease; } .theme-offcanvas-menu ul li { padding-left: 1rem; } .theme-offcanvas-menu ul li a { color: inherit; font-weight: 500; } /* Color Mode --------------------------------------------- */ #colormode-switch-area { display: flex; align-items: center; } #colormode-switch-area #mode-icon-switch { background: #666; box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.05); position: relative; display: block; width: 52px; height: 26px; margin-right: 1rem; border-radius: 15px; } #colormode-switch-area #mode-icon-switch:before { background: #333; transition: all .25s; border: 4px solid #ffffff; box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.16); content: ""; position: absolute; left: 2px; top: 2px; width: 22px; height: 22px; border-radius: 50%; } [data-theme="dark"] #colormode-switch-area #mode-icon-switch:before { background: #fff; border-color: #1a1a1a; left: 28px; } #colormode-switch-area .mode-icon-change:before { content: ""; background-color: currentColor; height: 20px; width: 20px; display: block; margin-left: auto; margin-right: auto; -webkit-mask-size: 20px; mask-size: 20px; } #colormode-switch-area .mode-icon-change:before { -webkit-mask: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='20px' height='20px' viewBox='0 0 22 22' version='1.1'%3E%3Cpath d='M 15.53125 0.0507812 C 15.75 0.140625 15.902344 0.335938 15.945312 0.5625 L 16.800781 5.199219 L 21.4375 6.050781 C 21.664062 6.09375 21.859375 6.246094 21.949219 6.460938 C 22.039062 6.675781 22.011719 6.921875 21.878906 7.117188 L 19.203125 11 L 21.878906 14.878906 C 22.011719 15.074219 22.039062 15.320312 21.949219 15.53125 C 21.859375 15.75 21.664062 15.902344 21.4375 15.945312 L 16.800781 16.800781 L 15.945312 21.4375 C 15.902344 21.664062 15.75 21.859375 15.53125 21.949219 C 15.320312 22.039062 15.074219 22.011719 14.878906 21.878906 L 11 19.203125 L 7.121094 21.878906 C 6.925781 22.011719 6.679688 22.039062 6.46875 21.949219 C 6.25 21.859375 6.097656 21.664062 6.054688 21.4375 L 5.199219 16.800781 L 0.5625 15.945312 C 0.335938 15.902344 0.140625 15.75 0.0507812 15.53125 C -0.0390625 15.320312 -0.0117188 15.074219 0.121094 14.878906 L 2.796875 11 L 0.121094 7.121094 C -0.0117188 6.925781 -0.0390625 6.679688 0.0507812 6.46875 C 0.140625 6.25 0.335938 6.097656 0.5625 6.054688 L 5.199219 5.199219 L 6.054688 0.5625 C 6.097656 0.335938 6.25 0.140625 6.46875 0.0507812 C 6.679688 -0.0390625 6.925781 -0.0117188 7.121094 0.121094 L 11 2.796875 L 14.878906 0.121094 C 15.074219 -0.0117188 15.320312 -0.0390625 15.53125 0.0507812 Z M 15.125 11 C 15.125 13.277344 13.277344 15.125 11 15.125 C 8.722656 15.125 6.875 13.277344 6.875 11 C 6.875 8.722656 8.722656 6.875 11 6.875 C 13.277344 6.875 15.125 8.722656 15.125 11 Z M 16.5 11 C 16.5 7.960938 14.039062 5.5 11 5.5 C 7.960938 5.5 5.5 7.960938 5.5 11 C 5.5 14.039062 7.960938 16.5 11 16.5 C 14.039062 16.5 16.5 14.039062 16.5 11 Z M 16.5 11 '/%3E%3C/svg%3E%0A") no-repeat; mask: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='20px' height='20px' viewBox='0 0 22 22' version='1.1'%3E%3Cpath d='M 15.53125 0.0507812 C 15.75 0.140625 15.902344 0.335938 15.945312 0.5625 L 16.800781 5.199219 L 21.4375 6.050781 C 21.664062 6.09375 21.859375 6.246094 21.949219 6.460938 C 22.039062 6.675781 22.011719 6.921875 21.878906 7.117188 L 19.203125 11 L 21.878906 14.878906 C 22.011719 15.074219 22.039062 15.320312 21.949219 15.53125 C 21.859375 15.75 21.664062 15.902344 21.4375 15.945312 L 16.800781 16.800781 L 15.945312 21.4375 C 15.902344 21.664062 15.75 21.859375 15.53125 21.949219 C 15.320312 22.039062 15.074219 22.011719 14.878906 21.878906 L 11 19.203125 L 7.121094 21.878906 C 6.925781 22.011719 6.679688 22.039062 6.46875 21.949219 C 6.25 21.859375 6.097656 21.664062 6.054688 21.4375 L 5.199219 16.800781 L 0.5625 15.945312 C 0.335938 15.902344 0.140625 15.75 0.0507812 15.53125 C -0.0390625 15.320312 -0.0117188 15.074219 0.121094 14.878906 L 2.796875 11 L 0.121094 7.121094 C -0.0117188 6.925781 -0.0390625 6.679688 0.0507812 6.46875 C 0.140625 6.25 0.335938 6.097656 0.5625 6.054688 L 5.199219 5.199219 L 6.054688 0.5625 C 6.097656 0.335938 6.25 0.140625 6.46875 0.0507812 C 6.679688 -0.0390625 6.925781 -0.0117188 7.121094 0.121094 L 11 2.796875 L 14.878906 0.121094 C 15.074219 -0.0117188 15.320312 -0.0390625 15.53125 0.0507812 Z M 15.125 11 C 15.125 13.277344 13.277344 15.125 11 15.125 C 8.722656 15.125 6.875 13.277344 6.875 11 C 6.875 8.722656 8.722656 6.875 11 6.875 C 13.277344 6.875 15.125 8.722656 15.125 11 Z M 16.5 11 C 16.5 7.960938 14.039062 5.5 11 5.5 C 7.960938 5.5 5.5 7.960938 5.5 11 C 5.5 14.039062 7.960938 16.5 11 16.5 C 14.039062 16.5 16.5 14.039062 16.5 11 Z M 16.5 11 '/%3E%3C/svg%3E%0A") no-repeat; } [data-theme="dark"] #colormode-switch-area .mode-icon-change:before { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='svg-icon' viewBox='0 0 20 20'%3E%3Cpath d='M10.544,8.717l1.166-0.855l1.166,0.855l-0.467-1.399l1.012-0.778h-1.244L11.71,5.297l-0.466,1.244H10l1.011,0.778L10.544,8.717z M15.986,9.572l-0.467,1.244h-1.244l1.011,0.777l-0.467,1.4l1.167-0.855l1.165,0.855l-0.466-1.4l1.011-0.777h-1.244L15.986,9.572z M7.007,6.552c0-2.259,0.795-4.33,2.117-5.955C4.34,1.042,0.594,5.07,0.594,9.98c0,5.207,4.211,9.426,9.406,9.426c2.94,0,5.972-1.354,7.696-3.472c-0.289,0.026-0.987,0.044-1.283,0.044C11.219,15.979,7.007,11.759,7.007,6.552 M10,18.55c-4.715,0-8.551-3.845-8.551-8.57c0-3.783,2.407-6.999,5.842-8.131C6.549,3.295,6.152,4.911,6.152,6.552c0,5.368,4.125,9.788,9.365,10.245C13.972,17.893,11.973,18.55,10,18.55 M19.406,2.304h-1.71l-0.642-1.71l-0.642,1.71h-1.71l1.39,1.069l-0.642,1.924l1.604-1.176l1.604,1.176l-0.642-1.924L19.406,2.304z'%3E%3C/path%3E%3C/svg%3E") no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='svg-icon' viewBox='0 0 20 20'%3E%3Cpath d='M10.544,8.717l1.166-0.855l1.166,0.855l-0.467-1.399l1.012-0.778h-1.244L11.71,5.297l-0.466,1.244H10l1.011,0.778L10.544,8.717z M15.986,9.572l-0.467,1.244h-1.244l1.011,0.777l-0.467,1.4l1.167-0.855l1.165,0.855l-0.466-1.4l1.011-0.777h-1.244L15.986,9.572z M7.007,6.552c0-2.259,0.795-4.33,2.117-5.955C4.34,1.042,0.594,5.07,0.594,9.98c0,5.207,4.211,9.426,9.406,9.426c2.94,0,5.972-1.354,7.696-3.472c-0.289,0.026-0.987,0.044-1.283,0.044C11.219,15.979,7.007,11.759,7.007,6.552 M10,18.55c-4.715,0-8.551-3.845-8.551-8.57c0-3.783,2.407-6.999,5.842-8.131C6.549,3.295,6.152,4.911,6.152,6.552c0,5.368,4.125,9.788,9.365,10.245C13.972,17.893,11.973,18.55,10,18.55 M19.406,2.304h-1.71l-0.642-1.71l-0.642,1.71h-1.71l1.39,1.069l-0.642,1.924l1.604-1.176l1.604,1.176l-0.642-1.924L19.406,2.304z'%3E%3C/path%3E%3C/svg%3E") no-repeat; } /* Posts and pages --------------------------------------------- */ .sticky { display: block; } .updated:not(.published) { display: none; } .page-content, .entry-content, .entry-summary { font-size: 1.8rem; margin: 1.5em 0 0; } .featured-media { margin: 0; position: relative; } .featured-media img { display: block; width: 100%; } .featured-media-big img { height: 400px; object-fit: cover; } .featured-media-medium img { height: 240px; object-fit: cover; } .featured-media-small img { height: 160px; object-fit: cover; } .featured-media-thumbnail img { height: 90px; object-fit: cover; } .has-post-thumbnail .featured-media .featured-media-fullscreen { background-color: var(--theme-accent-color); color: #fff; position: absolute; bottom: 1.5rem; right: 1.5rem; z-index: 1; padding: 1rem; } .has-post-thumbnail .featured-media .featured-media-fullscreen:hover, .has-post-thumbnail .featured-media .featured-media-fullscreen:focus { background-color: var(--theme-accent-hover-color); } .featured-media-fullscreen .svg-icon { display: block; } .page-links { clear: both; margin: 0 0 1.5em; } /* Pagination */ .pagination .nav-links { align-items: baseline; display: flex; flex-wrap: wrap; margin: -1.5rem 0 0 -2.5rem; width: calc(100% + 2.5rem); } .pagination .nav-links > * { margin: 1.5rem 0 0 2.5rem; } .pagination .nav-links .placeholder { display: none; visibility: hidden; } .pagination .dots { transform: translateY(-0.3em); opacityfilter: alpha(opacity=85); opacity: .85; } @media (min-width: 700px) { .pagination .nav-links { margin: -2.5rem 0 0 -4rem; } .pagination .nav-links > * { margin: 2.5rem 0 0 4rem; } } @media (min-width: 1000px) { .pagination .nav-links { justify-content: space-between; margin: 0; width: 100%; } .pagination .nav-links > * { margin: 0 2rem; } .pagination .nav-links > span.page-numbers { margin-left: 0; } .pagination .next, .pagination .prev { display: block; } .pagination .prev { margin: 0 auto 0 0; } .pagination .next { text-align: right; margin: 0 0 0 auto; } } .post-navigation, .blogauthor-nav-pagination .posts-navigation, .blogauthor-nav-pagination .pagination { background-color: var(--theme-bg-color); font-size: var(--theme-font-size-small); margin-top: 4rem; padding: 3rem 2rem; } .post-navigation .nav-links, .posts-navigation .nav-links { display: flex; flex-direction: column; } .post-navigation .nav-links > a + a, .posts-navigation .nav-links > div + div { margin-top: 1rem; } .post-navigation a, .posts-navigation a { align-items: baseline; display: flex; } .post-navigation a .arrow, .post-navigation a .post-thumb, .posts-navigation a .arrow, .posts-navigation a .post-thumb { margin-right: 1rem; } .post-navigation a .post-thumb, .posts-navigation a .post-thumb { width: 100px; height: 100px; } @media (min-width: 700px) { .post-navigation .nav-links, .posts-navigation .nav-links { flex-direction: row; justify-content: space-between; align-items: center; } .post-navigation .nav-links .nav-previous, .post-navigation .nav-links .nav-next { flex: 1 1 0px; } .post-navigation a.nav-next, .posts-navigation .nav-next a { flex-direction: row-reverse; text-align: right; } .post-navigation a.nav-next .arrow, .post-navigation a.nav-next .post-thumb, .posts-navigation .nav-next a .arrow, .posts-navigation .nav-next a .post-thumb { margin-right: 0; margin-left: 1rem; } .post-navigation .nav-links > a + a, .posts-navigation .nav-links > div + div { margin: 0 0 0 2rem; } .post-navigation .nav-next:only-child, .posts-navigation .nav-next:only-child { margin-left: auto; } } .post-navigation .nav-links a { flex-direction: column; } .sticky-article-link { box-sizing: border-box; overflow: hidden; display: block; width: 48px; min-height: 90px; position: fixed; z-index: 99; top: 50%; margin-top: -40px; box-shadow: 0 0 20px rgba(0, 0, 0, .2); transition: width 375ms ease-in-out; background-color: var(--theme-bg-color); color: var(--theme-text-color); } .sticky-article-link:hover, .sticky-article-link:focus { width: 448px; } .sticky-article-prev, .sticky-article-prev .sticky-article-icon { left: 0; right: auto; } .sticky-article-next, .sticky-article-next .sticky-article-icon { right: 0; left: auto; } .sticky-article-link .sticky-article-icon { display: flex; height: 100%; align-items: center; justify-content: center; width: 48px; position: absolute; z-index: 2; margin: 0; text-align: center; cursor: pointer; background-color: inherit; } .sticky-article-link .theme-sticky-article { box-sizing: border-box; display: -ms-flexbox; display: -webkit-flex; display: flex; gap: 1rem; -ms-flex-align: center; -webkit-align-items: center; align-items: center; width: 400px; min-height: 90px; position: absolute; top: 0; } .sticky-article-link .theme-sticky-article .entry-image { width: 100px; flex-shrink: 0; } .sticky-article-prev .theme-sticky-article { left: auto; right: 0; padding-right: 15px; } .sticky-article-next .theme-sticky-article { -webkit-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; padding-left: 15px; left: 0; right: auto; } @media only screen and (max-width: 575px) { .sticky-article-navigation { display: none; visibility: hidden; opacity: 0; } } .theme-single-post-component { margin-bottom: 3rem; padding-bottom: 3rem; } .theme-single-post-component .entry-details a { text-decoration: none; } .theme-single-post-component .entry-image { margin-top: 0; margin-bottom: 1.5rem; } .theme-single-post-component .entry-image:hover { opacity: 0.8; } .theme-single-post-component .single-component-content { display: grid; gap: 3rem; } @media only screen and (min-width: 482px) { .theme-single-post-component .single-component-content { grid-template-columns: repeat(2, 1fr); } } @media only screen and (min-width: 1000px) { body.has-sidebar .theme-single-post-component .single-component-content { grid-template-columns: repeat(3, 1fr); } body.no-sidebar .theme-single-post-component .single-component-content { grid-template-columns: repeat(4, 1fr); } } .theme-single-post-component { position: relative; } .single-author-info-area { margin-top: 3rem; padding: 2rem; } .single-author-info-area:before { content: ""; height: 100%; width: 100%; position: absolute; top: 0; background-color: var(--theme-text-color); left: 0; right: 0; -webkit-mask: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAADklEQVQIW2NgQAXGZHAAGioAza6+Hk0AAAAASUVORK5CYII=) top left repeat; mask: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAADklEQVQIW2NgQAXGZHAAGioAza6+Hk0AAAAASUVORK5CYII=) top left repeat; } @media only screen and (min-width: 482px) { .single-author-info-area { margin-top: 4rem; } } @media only screen and (min-width: 992px) { .single-author-info-area { margin-top: 6rem; } } .single-author-info-wrapper { background-color: var(--theme-bg-color); display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 2rem; margin: 2rem; position: relative; z-index: 1; } .single-author-info-area .author-image { width: 11.6rem; height: 11.6rem; } .single-author-info-area .author-image a { display: block; } .single-author-info-area .author-name { font-size: 1.8rem; text-decoration: none; display: block; font-weight: 700; margin-bottom: 0.6rem; } .single-author-info-area .author-site { font-size: 1.2rem; display: inline-block; text-decoration: none; margin-bottom: 0.6rem; } @media only screen and (max-width: 575px) { .single-author-info-area .single-author-info-wrapper { display: flex; flex-direction: column; } .single-author-info-area .author-image { width: 100%; height: 100%; } .single-author-info-area .author-details { width: 100%; padding: 0 20px 20px; } } /* Site Content --------------------------------------------- */ #site-content .content-area, #site-content .widget-area { margin-bottom: 6rem; margin-top: 3rem; } #site-content #secondary .widget { border-bottom: 1px solid; } #site-content #secondary .widget:last-child { border-bottom: none; } .has-sidebar #site-content .wrapper { display: -ms-flexbox; display: flex; justify-content: space-between; flex-direction: column; } .has-sidebar #site-content #primary, .has-sidebar #site-content #secondary { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } #site-content #secondary { padding: 2rem; } @media only screen and (min-width: 992px) { .has-sidebar #site-content .wrapper { flex-direction: row; } .has-sidebar.left-sidebar #site-content .wrapper { flex-direction: row-reverse; } .has-sidebar #site-content #primary { -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .has-sidebar #site-content #secondary { -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .has-sidebar.right-sidebar #site-content #primary { padding-right: 3rem; } .has-sidebar.left-sidebar #site-content #primary { padding-left: 3rem; } } @media only screen and (max-width: 991px) { .has-sidebar #site-content #primary, .has-sidebar #site-content #secondary { width: 100%; flex: 1; } } @media only screen and (min-width: 1200px) { body.header-style-aside .site-content-area .wrapper { padding-left: 3rem; padding-right: 3rem; } } @media only screen and (min-width: 992px) { body.header-style-aside .wrapper { max-width: calc(100vw - 12rem); } } @media only screen and (max-width: 1299px) { body.header-style-aside .site-content-area .wrapper { flex-direction: column; } body.header-style-aside .site-content-area #site-content .wrapper { flex-direction: column; } body.header-style-aside .site-content-area #site-content #primary, body.header-style-aside .site-content-area #site-content #secondary { width: 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; position: relative; } body.header-style-aside .site-content-area #site-content #secondary { border: none; } } @media only screen and (max-width: 1299px) and (min-width: 1025px) { body.header-style-aside .site-content-area .wrapper { padding-left: 4rem; padding-right: 4rem; } } article.has-post-thumbnail .entry-header { margin-bottom: 2rem; } /* Archive style 1 *-------------------------------------------*/ .blogauthor-archive_style_1 > article { background-color: var(--theme-bg-color); margin-bottom: 4rem; padding-bottom: 4rem; text-align: center; } .blogauthor-archive_style_1 .entry-header { padding: 2rem; } .blogauthor-archive_style_1 .entry-summary { padding-left: 2rem; padding-right: 2rem; } .blogauthor-archive_style_1 > article .blogauthor-entry-meta, .blogauthor-archive_style_1 > article .entry-meta-footer { justify-content: center; } /* Archive style 2 *-------------------------------------------*/ .blogauthor-archive_style_2 { display: grid; gap: 3rem; } @media only screen and (min-width: 576px) { .blogauthor-archive_style_2 { grid-template-columns: 1fr 1fr; } } .blogauthor-archive_style_2 > article { margin-bottom: 0; } /* Archive style 3 *-------------------------------------------*/ .blogauthor-archive_style_3 { display: grid; } .blogauthor-archive_style_3 > article { border-width: 0.1rem; margin-bottom: 2rem; } .blogauthor-archive_style_3 > article .article-block-wrapper { padding: 3rem; } @media only screen and (min-width: 576px) { .blogauthor-archive_style_3 { grid-template-columns: 1fr 1fr; } .blogauthor-archive_style_3 > article:nth-child(3n + 1) { grid-column: span 2; } .blogauthor-archive_style_3 > article:not(:nth-child(3n + 1)) .entry-title { font-size: 2rem; } .blogauthor-archive_style_3 > article:nth-child(3n-2) { border-width: 0.1rem; } .blogauthor-archive_style_3 > article:nth-child(3n-1) { border-width: 0 0.05rem 0 0.1rem; } .blogauthor-archive_style_3 > article:nth-child(3n) { border-width: 0 0.1rem 0 0.05rem; } .blogauthor-archive_style_3 > article { margin-bottom: 0; } } /* Archive style 4 *-------------------------------------------*/ .blogauthor-archive_style_4 { display: grid; border-width: 1px 0 0 1px; } .blogauthor-archive_style_4 .blogauthor-bg-image { margin-bottom: 0; min-height: 30rem; border: none; outline: 3px solid var(--theme-bg-color); position: relative; } .blogauthor-archive_style_4 .blogauthor-bg-image .entry-summary, .blogauthor-archive_style_4 .blogauthor-bg-image .entry-image, .blogauthor-archive_style_4 .blogauthor-bg-image .entry-meta, .blogauthor-archive_style_4 .blogauthor-bg-image .tags-links, .blogauthor-archive_style_4 .blogauthor-bg-image .edit-link { display: none; } .blogauthor-archive_style_4 .blogauthor-bg-image a { color: #ffffff; } .blogauthor-archive_style_4 .blogauthor-bg-image a:hover { color: var(--theme-accent-color); } .blogauthor-archive_style_4 .blogauthor-bg-image .entry-title { font-size: 2rem; } .blogauthor-archive_style_4 .blogauthor-bg-image .post-categories { justify-content: center; } .blogauthor-archive_style_4 .blogauthor-bg-image::before { position: absolute; content: ""; top: 0; left: 0; background: #000; opacity: 0.6; height: 100%; width: 100%; } .blogauthor-archive_style_4 .blogauthor-bg-image .article-block-wrapper { margin: 0; padding: 0 2rem; max-width: 100%; width: 100%; position: absolute; top: 50%; left: 0%; transform: translateY(-50%); text-align: center; } @media only screen and (min-width: 576px) { .blogauthor-archive_style_4 { grid-template-columns: 1fr 1fr; } } .theme-sticky-component { position: -webkit-sticky; position: sticky; top: 0; -ms-flex-item-align: start; align-self: flex-start; } @media (max-width: 991px) { .theme-sticky-component { position: relative; } } .site-section-header { margin-top: 3rem; } .site-section { padding-bottom: 6rem; position: relative; overflow: hidden; width: 100%; } .site-about-section { padding-bottom: 8rem; padding-top: 10rem; } .about-section-profile { display: flex; align-items: center; list-style: none; margin: 0 auto; padding: 0; gap: 1.5rem; } .site-section-signature { margin-top: 8rem; } .site-categories-panel { background-color: #000; position: relative; height: 46rem; overflow: hidden; margin-top: 2rem; margin-bottom: 2rem; } .site-categories-panel::before, .site-categories-panel::after { content: ""; position: absolute; width: 36px; height: 36px; z-index: 1; -webkit-transition: all ease 0.35s; -o-transition: all ease 0.35s; transition: all ease 0.35s; } .site-categories-panel::before { right: 1rem; bottom: 1rem; border-right: 3px solid rgba(var(--theme-white-rgb-color), 0.8); border-bottom: 3px solid rgba(var(--theme-white-rgb-color), 0.8); } .site-categories-panel::after { left: 1rem; top: 1rem; border-left: 3px solid rgba(var(--theme-white-rgb-color), 0.8); border-top: 3px solid rgba(var(--theme-white-rgb-color), 0.8); } .site-categories-panel a { display: block; text-decoration: none; text-align: center; -webkit-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; } .site-categories-panel a img { -webkit-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .site-categories-panel a img { display: block; height: 46rem; object-fit: cover; width: 100%; } .site-categories-panel:hover::before, .site-categories-panel:hover:after, .site-categories-panel:focus::before, .site-categories-panel:focus:after { width: -webkit-calc(100% - 20px); width: calc(100% - 20px); height: -webkit-calc(100% - 23px); height: calc(100% - 23px); } .site-categories-panel:hover img, .site-categories-panel:focus img { -webkit-transform: scale(1.2) rotate(5deg); -ms-transform: scale(1.2) rotate(5deg); -o-transform: scale(1.2) rotate(5deg); transform: scale(1.2) rotate(5deg); } .site-categories-panel a.btn-readmore { position: absolute; left: 50%; top: 50%; width: unset; white-space: nowrap; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background-color: var(--theme-accent-color); color: var(--theme-white-color); margin: auto; text-transform: none; padding: 18px 35px; z-index: 3; } .site-categories-panel a.btn-readmore::after { content: ""; border: 1px solid var(--theme-accent-color); background: none; position: absolute; top: -3px; left: -3px; right: -3px; bottom: -3px; width: auto; height: auto; -webkit-transition: all ease 0.35s; -o-transition: all ease 0.35s; transition: all ease 0.35s; } .site-categories-panel a.btn-readmore:hover, .site-categories-panel a.btn-readmore:focus { background-color: var(--theme-accent-hover-color); color: var(--theme-white-color); } .site-categories-panel a.btn-readmore:hover:after, .site-categories-panel a.btn-readmore:focus:after { top: -8px; right: -8px; bottom: -8px; left: -8px; opacity: 0; visibility: hidden; } .site-banner-section .theme-banner-slider, .site-banner-section .theme-banner-slider a { color: #fff; } .theme-banner-slider .swiper-slide .column { -ms-flex: 1; flex: 1; } .theme-swiper-pagination .swiper-pagination-bullet { display: inline-block; margin: 0 4px; padding: 0; border-radius: 50%; overflow: hidden; background-color: transparent; position: relative; height: 17px; width: 17px; -webkit-box-shadow: inset 0 0 0 2px transparent; box-shadow: inset 0 0 0 2px transparent; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; border: 0; } .theme-swiper-pagination .swiper-pagination-bullet:after { content: ""; position: absolute; top: 6px; bottom: 0; left: 6px; height: 5px; width: 5px; background: var(--theme-component-color); display: block; border-radius: 50%; overflow: hidden; -webkit-box-shadow: 0 0 1px #a1a1a8; box-shadow: 0 0 1px #a1a1a8; -webkit-transition: height 0.3s ease-in-out; transition: height 0.3s ease-in-out; } .theme-swiper-pagination .swiper-pagination-bullet-active { -webkit-box-shadow: inset 0 0 0 2px var(--theme-component-color); box-shadow: inset 0 0 0 2px var(--theme-component-color); } /* Single Featured Banner --------------------------------------------- */ .single-featured-banner { position: relative; margin-top: 4rem; min-height: 60rem; } .single-featured-banner .featured-banner-content { position: absolute; left: 0; right: 0; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); height: auto; width: 100%; z-index: 10; } .single-featured-banner .featured-banner-content .post-read-time { display: inline-block; margin-bottom: 2rem; } @media (max-width: 767px) { .single-featured-banner .featured-banner-content a:not(:hover):not(:focus) { color: inherit; } } .single-featured-banner .featured-banner-content a:not(:hover):not(:focus) { color: inherit; } .single-featured-banner .featured-banner-media { position: relative; width: 70%; margin-left: auto; background-color: #e9e9e9; } @media (max-width: 767px) { .single-featured-banner .featured-banner-media { width: 100%; } .single-featured-banner .featured-banner-media::before { position: absolute; content: ''; inset: 0; height: 100%; width: 100%; background-color: rgba(0, 0, 0, .6); z-index: 9; } } .single-featured-banner .featured-banner-media .data-bg { width: 100%; } .single-featured-banner .featured-banner-content *:where(.entry-breadcrumb .breadcrumbs, .blogauthor-entry-meta, .entry-title) { color: #fff; padding: .4rem; margin-bottom: 1.6rem; } .single-featured-banner .featured-banner-content .entry-title { display: block; } .single-featured-banner .featured-banner-content *:where(.entry-breadcrumb .breadcrumbs, .blogauthor-entry-meta) { display: inline-flex; } @media (max-width: 575px) { .single-featured-banner .featured-banner-content *:where(.entry-breadcrumb .breadcrumbs, .blogauthor-entry-meta, .entry-title) { margin-bottom: .8rem; } } @media (min-width: 768px) { .single-featured-banner .featured-banner-content *:where(.entry-breadcrumb .breadcrumbs, .blogauthor-entry-meta, .entry-title) { background-color: rgba(0, 0, 0, .6); } } /* Banner --------------------------------------------- */ .site-banner-section .slider-content { margin-bottom: 4rem; } .site-banner-section .site-banner-layout-carousal .slider-content { padding-left: 1.5rem; padding-right: 1.5rem; } .site-banner-section .site-banner-layout-carousal .swiper-button-prev, .site-banner-section .site-banner-layout-carousal .swiper-button-next { top: calc(50% - 6rem); border-radius: 0; width: 3rem; padding: 4rem 0; } .site-banner-section .swiper-button-next:after, .site-banner-section .swiper-button-prev:after{ font-size:2rem; } .site-banner-section .site-banner-layout-carousal .swiper-button-prev { left: 1rem; } .site-banner-section .site-banner-layout-carousal .swiper-button-next { right: 1rem; } @media (min-width: 1025px) and (max-width: 1500px) { .site-banner-section .site-banner-layout-carousal .data-bg-large { height: 480px; } } /* Comments --------------------------------------------- */ .single-comments-area { margin-bottom: 0; padding-top: 3rem; position: relative; border-top: 1px solid; } .single-comments-area:before { content: ""; position: absolute; left: 1.5rem; top: 3em; bottom: 0; border-left: 1px solid; } .single-comments-area.no-comments:after { display: none; } .comment-number { display: inline-block; width: 3rem; height: 3rem; margin-right: 3rem; line-height: 3rem; border: 1px solid #afafaf; text-align: center; color: #afafaf; background: white; } .comment-number.no-comments { position: relative; z-index: 1; } .comments-area-title .comments-title, .comments-area-title a, .comment-reply-title .comments-title, .comment-reply-title a { display: inline-block; vertical-align: middle; } .comments-area-title .comments-title, .comment-reply-title .comments-title, .comment-reply-title { margin: 0; margin-right: 6px; font-size: var(--theme-font-size-medium); text-transform: none; -webkit-transform: none; transform: none; } .comments-area-title { position: relative; } .comments-area-title .comment-number { position: relative; } .commentlist > .comment, .commentlist > .pingback, .commentlist > .trackback { padding-left: 3rem; } @media not screen and (min-width: 992px) { .depth-1 > .comment-article > .comment-number { left: 0; } } .comments_add-comment { margin-top: 3px; } .commentlist { list-style: none; margin: 0; border-left: 0; padding-left: 0; } li.comment, li.pingback, li.trackback { position: relative; display: block; margin-top: 3em; margin-bottom: 3em; } li.comment .comment-number, li.pingback .comment-number, li.trackback .comment-number { position: absolute; left: 0; top: 0; z-index: 1; } @media not screen and (min-width: 992px) { li.comment .comment-number, li.pingback .comment-number, li.trackback .comment-number { left: -3em; } } li.comment:last-child, li.pingback:last-child, li.trackback:last-child { margin-bottom: 0; } li.comment .children, li.pingback .children, li.trackback .children { position: relative; margin: 3rem 0; } @media not screen and (min-width: 992px) { li.comment .children, li.pingback .children, li.trackback .children { margin-left: 0; } } @media only screen and (min-width: 992px) { li.comment .children li, li.pingback .children li, li.trackback .children li { padding-left: 2em; } li.comment .children li:before, li.pingback .children li:before, li.trackback .children li:before { content: ""; position: absolute; top: 1.5rem; border-top: 1px solid; } } li.comment .children li .comment-number, li.pingback .children li .comment-number, li.trackback .children li .comment-number { border: 1px solid #afafaf; background: #afafaf; color: white; } li.depth-2:before { left: -54px; width: 60px; } @media only screen and (min-width: 992px) { li.depth-3:before { left: -126px; width: 126px; } li.depth-4:before { left: -198px; width: 198px; } li.depth-5:before { left: -272px; width: 272px; } } .comment__author-name { font-size: 14px; } .comment__author-name a { color: black; } .bypostauthor { color: inherit; } .comment-article { margin-bottom: 0; margin-left: 3rem; } .comment-article:hover .comment-edit-link, .comment-article:hover .comment-reply-link { opacity: 1; } .comment__avatar { margin-right: 0.75em; } .comment__avatar img { width: 3.75em; height: auto; } .comment__avatar:empty { display: none; } .comment__timestamp { color: #3d3e40; } .comment__avatar { margin-bottom: 24px; } .comment__content { position: relative; margin-bottom: 3rem; font-size: 0.875em; line-height: 1.71429; color: #8c888c; } .comment__links { display: inline-block; margin-left: 1.71429em; font-size: 0.875em; line-height: 1.71429; } .comment-edit-link, .comment-reply-link { color: #3d3e40; opacity: 0; margin-right: 0.85714em; -webkit-transition: opacity .15s ease-in-out; transition: opacity .15s ease-in-out; -webkit-transform: translateZ(0); transform: translateZ(0); } @media not screen and (min-width: 992px) { .comment-edit-link, .comment-reply-link { opacity: 1; } } .comment-reply-link { color: #8c888c; } .comment-form p.logged-in-as { margin-bottom: 0.75em; } .comment-respond { position: relative; margin-bottom: 1.5em; } @media only screen and (min-width: 992px) { .comment .comment-respond { padding-left: 0; margin-right: 0; } } .comment .comment-respond { margin-left: 1.5em; } #cancel-comment-reply-link { text-decoration: underline; } /* Comments Form */ @media only screen and (min-width: 992px) { .comment-form { padding-left: 4.5em; } } .comment .comment-form { padding-left: 0; } .comment-form iframe { padding-left: 36px; } @media only screen and (min-width: 992px) { .comment-form > .comment-subscription-form { width: 70%; } } .comment-form-author, .comment-form-email, .comment-form-url { margin-bottom: 0; } .comment-form-author input, .comment-form-email input, .comment-form-url input { width: 100%; margin-bottom: 1.5em; } @media not screen and (min-width: 992px) { .comment-form-author input, .comment-form-email input, .comment-form-url input { margin-bottom: 0.75em; } } .comment-form-comment, .logged-in-as { width: 100%; } .comment-form-comment textarea, .comment-subscription-form textarea { width: 100%; max-width: 100%; line-height: 1.5; } .form-submit { margin-top: 0.75em; margin-bottom: 0; text-align: right; } .form-submit #submit { border: 0; } @media not screen and (min-width: 992px) { .form-submit #submit { width: 100%; } } .comment-subscription-form { float: left; clear: left; margin-top: 0.75em; margin-bottom: 0.375em; } .comment-subscription-form + .comment-subscription-form { margin-top: 0; } .comment-subscription-form input[type="checkbox"] { margin-right: 0.75em; position: relative; top: -0.05em; } .add-comment { margin-top: 3em; } .add-comment .add-comment__button { position: relative; z-index: 1; margin-right: 0.5em; font-size: 1.5em; line-height: 1.5; } .add-comment .add-comment__text { font-size: 1.25em; line-height: 1.2; font-weight: bold; } /* Comments Navigation */ .comment-navigation { position: relative; padding-left: 3.75em; margin-top: 3em; margin-bottom: 3em; } .comment-navigation .comment-number { position: absolute; left: 0; top: 0; line-height: 30px; } .comment-navigation .assistive-text { margin-top: 0; margin-left: 8px; font-size: 28px; -webkit-transform: none; transform: none; } .comment-navigation .nav-previous a, .comment-navigation .nav-next a { font-size: 18px; } .comment-navigation .nav-previous { float: left; } .comment-navigation .nav-previous a:before { content: "\2190 "; } .comment-navigation .nav-previous a:after { content: ""; } .comment-navigation .nav-next { float: right; } .comment-navigation .nav-next a:before { content: ""; } .comment-navigation .nav-next a:after { content: " \2192"; } .nocomments { -webkit-transform: none; transform: none; } .nocomments span { display: inline-block; vertical-align: middle; font-size: 1.75em; line-height: 1.28571; line-height: 48px; } .no-comments-box { position: relative; z-index: 1; } div#respond { padding-top: 0; } div#respond #reply-title { padding-left: 4rem; } div#respond p.comment-subscription-form label { color: #999; } .comment-form-cookies-consent input[type="checkbox"] { margin-right: 0.75em; } /* Widgets --------------------------------------------- */ .widget{ margin-bottom: 3rem; padding-bottom: 3rem; } .widget ul, .widget ol { list-style: none; margin: 0; padding: 0; } .widget li { margin: 0; } .widget select { max-width: 100%; } .widget_recent_entries ul, .widget_recent_entries ol, .widget_categories ul, .widget_categories ol, .widget_archive ul, .widget_archive ol, .widget_meta ul, .widget_meta ol, .widget_recent_comments ul, .widget_recent_comments ol, .widget_nav_menu ul, .widget_nav_menu ol, .widget_block .wp-block-group__inner-container ul, .widget_block .wp-block-group__inner-container ol { list-style: none; margin: 0; padding: 0; } .widget_recent_entries ul li, .widget_recent_entries ol li, .widget_categories ul li, .widget_categories ol li, .widget_archive ul li, .widget_archive ol li, .widget_meta ul li, .widget_meta ol li, .widget_recent_comments ul li, .widget_recent_comments ol li, .widget_nav_menu ul li, .widget_nav_menu ol li, .widget_block .wp-block-group__inner-container ul li, .widget_block .wp-block-group__inner-container ol li { border-bottom: 1px solid; margin-bottom: 1.5rem; padding-bottom: 1.5rem; } .widget_recent_entries ul li:last-child, .widget_recent_entries ol li:last-child, .widget_categories ul li:last-child, .widget_categories ol li:last-child, .widget_archive ul li:last-child, .widget_archive ol li:last-child, .widget_meta ul li:last-child, .widget_meta ol li:last-child, .widget_recent_comments ul li:last-child, .widget_recent_comments ol li:last-child, .widget_nav_menu ul li:last-child, .widget_nav_menu ol li:last-child, .widget_block .wp-block-group__inner-container ul li:last-child, .widget_block .wp-block-group__inner-container ol li:last-child { border: 0; margin-bottom: 0; padding-bottom: 0; } .theme-widget-list .theme-widget-article { display: -ms-flexbox; display: flex; gap: 2rem; align-items: flex-start; margin-bottom: 1rem; padding-bottom: 1rem; } .theme-widget-list.style_2 .theme-widget-article { flex-direction: row-reverse; } .theme-widget-list.style_1 .theme-widget-article .entry-image, .theme-widget-list.style_2 .theme-widget-article .entry-image { height: 10rem; width: 10rem; } .theme-widget-list.style_1 .theme-widget-article .entry-image, .theme-widget-list.style_2 .theme-widget-article .entry-image { -ms-flex-negative: 0; flex-shrink: 0; -ms-flex-item-align: start; align-self: flex-start; } .theme-widget-list.style_1 .theme-widget-article .entry-details, .theme-widget-list.style_2 .theme-widget-article .entry-details { -ms-flex-positive: 1; flex-grow: 1; } .theme-widget-list.style_3 .theme-widget-article { flex-direction: column; text-align: center; justify-content: center; align-items: center; } .theme-widget-tab { width: 100%; } .widget-tab-header { margin-bottom: 2rem; padding-bottom: 1rem; border-bottom: 1px solid; } .tab-header-list { display: flex; list-style: none; margin: 0; padding: 0; } .tab-header-list li { flex: 1; text-align: center; } .tab-header-list li a { display: block; padding: 10px; color: var(--theme-text-color); text-decoration: none; } .tab-header-list li.active a, .tab-header-list li a:hover, .tab-header-list li a:focus { background-color: rgba(0, 0, 0, 0.1); } .tab-header-list li .tab-icon { display: inline-block; vertical-align: middle; line-height: 1; } .tab-header-list li .svg-icon { height: 3rem; width: 3rem; } .widget-tab-content .tab-content-panel { display: none; } .widget-tab-content .tab-content-panel.active { display: block; } .theme-author-widget { display: grid; gap: 2rem; max-width: 40rem; } .theme-author-widget.has-round-image .author-image { border-radius: 100%; overflow: hidden; width: 20rem; height: 20rem; } .theme-author-widget.has-round-image .author-image img { width: 100%; height: 100%; object-fit: cover; display: block; } .theme-author-widget .author-social { display: -ms-flexbox; display: flex; flex-wrap: wrap; gap: 0.5rem; } .theme-author-widget .author-social a .svg-icon { display: flex; width: 3.6rem; height: 3.6rem; border: 1px solid #dcd7ca; padding: 0.5rem; } .theme-author-widget .author-social a:hover .svg-icon { border-color: var(--theme-accent-color); fill: var(--theme-accent-color); } .theme-author-widget .author-details .author-name { font-size: var(--theme-font-size-medium); } .theme-author-widget .author-desc p:last-child { margin-bottom: 0; } .theme-author-widget.style_2 { justify-items: center; align-items: center; margin: 0 auto; } .theme-author-widget.style_2 .author-details { display: grid; justify-items: center; align-items: center; text-align: center; } .theme-author-widget.style_3 { max-width: 100%; grid-template-columns: auto 1fr; align-items: center; } @media only screen and (max-width: 767px) { .theme-author-widget.style_3 { display: grid; grid-template-columns: 1fr; justify-items: center; } .theme-author-widget.style_3 .author-details { display: grid; justify-items: center; align-items: center; text-align: center; } } .blogauthor-social-menu-widget.style_1 .social-media-title { clip: rect(1px, 1px, 1px, 1px); word-wrap: normal !important; border: 0; -webkit-clip-path: inset(50%); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .blogauthor-social-menu-widget ul li a { background-color: var(--theme-component-color); color: #fff; } .blogauthor-social-menu-widget ul li a[href*="bitbucket.org"] { background-color: #205081; } .blogauthor-social-menu-widget ul li a[href*="dribbble.com"] { background-color: #ea4c89; } .blogauthor-social-menu-widget ul li a[href*="facebook.com"] { background-color: #3b5998; } .blogauthor-social-menu-widget ul li a[href*="skype.com"] { background-color: #00aff0; } .blogauthor-social-menu-widget ul li a[href*="foursquare.com"] { background-color: #f94877; } .blogauthor-social-menu-widget ul li a[href*="github.com"] { background-color: #2ea44f; } .blogauthor-social-menu-widget ul li a[href*="instagram.com"] { background-color: #8a3ab9; } .blogauthor-social-menu-widget ul li a[href*="linkedin.com"] { background-color: #0077b5; } .blogauthor-social-menu-widget ul li a[href*="pinterest.com"] { background-color: #e60023; } .blogauthor-social-menu-widget ul li a[href*="reddit.com"] { background-color: #ff4500; } .blogauthor-social-menu-widget ul li a[href*="slack.com"] { background-color: #e01563; } .blogauthor-social-menu-widget ul li a[href*="snapchat.com"] { background-color: #fffc00; color: #000; } .blogauthor-social-menu-widget ul li a[href*="tumblr.com"] { background-color: #35465c; } .blogauthor-social-menu-widget ul li a[href*="twitch.tv"] { background-color: #9146ff; } .blogauthor-social-menu-widget ul li a[href*="twitter.com"] { background-color: #1da1f2; } .blogauthor-social-menu-widget ul li a[href*="vimeo.com"] { background-color: #1ab7ea; } .blogauthor-social-menu-widget ul li a[href*="vk.com"] { background-color: #45668e; } .blogauthor-social-menu-widget ul li a[href*="whatsapp.com"] { background-color: #075e54; } .blogauthor-social-menu-widget ul li a[href*="wordpress.org"], .blogauthor-social-menu-widget ul li a[href*="wordpress.com"] { background-color: #0087be; } .blogauthor-social-menu-widget ul li a[href*="yelp.com"] { background-color: #c41200; } .blogauthor-social-menu-widget ul li a[href*="youtube.com"] { background-color: #ff0000; } .blogauthor-social-menu-widget ul li a[href*="mailto"] { background-color: #CC0010; } .blogauthor-social-menu-widget ul li a[href*="spotify.com"] { background: #1DB954; } .blogauthor-social-menu-widget ul li a:hover, .blogauthor-social-menu-widget ul li a:focus { background-color: var(--theme-component-color); color: #fff; } .blogauthor-social-menu-widget.style_1 .blogauthor-social-icons { display: flex; flex-wrap: wrap; gap: 0.5rem; } .blogauthor-social-menu-widget.style_1 .blogauthor-social-icons li, .blogauthor-social-menu-widget.style_3 .blogauthor-social-icons li { text-align: center; } .blogauthor-social-menu-widget.style_1 .blogauthor-social-icons li a, .blogauthor-social-menu-widget.style_3 .blogauthor-social-icons li a { border-radius: 2px; display: flex; line-height: 1; align-items: center; justify-content: center; } .blogauthor-social-menu-widget.style_1 .blogauthor-social-icons li a { width: 4rem; height: 4rem; } .blogauthor-social-menu-widget.style_2 .blogauthor-social-icons li:not(:last-child) { margin-bottom: 0.5rem; padding-bottom: 0.5rem; } .blogauthor-social-menu-widget.style_2 .blogauthor-social-icons li a { border-radius: 0.6rem; display: flex; flex-wrap: wrap; gap: 1rem; padding: 1rem 1.5rem; width: 100% } .blogauthor-social-menu-widget.style_2 .blogauthor-social-icons li a .svg-icon { order: 1; } .blogauthor-social-menu-widget.style_2 .blogauthor-social-icons li a .social-media-title { order: 2; } .blogauthor-social-menu-widget.style_3 .blogauthor-social-icons { display: grid; grid-gap: 1rem; grid-template-columns: repeat(3, 1fr); } .blogauthor-social-menu-widget.style_3 .blogauthor-social-icons li a { height: 7rem; flex-direction: column-reverse; } .blogauthor-social-menu-widget.style_3 .blogauthor-social-icons li a .social-media-title { font-size: 80%; margin: .5rem 0; } .blogauthor-cover-block { position: relative; background-size: cover; background-position: 50%; min-height: 20rem; background-color: #000; width: 100%; display: flex; justify-content: center; align-items: center; padding-bottom: 5rem; padding-top: 5rem; } .blogauthor-block-overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; opacity: 0.5; background-color: #000; } .blogauthor-cover-block img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: 0; padding: 0; width: 100%; height: 100%; max-width: none; max-height: none; -o-object-fit: cover; object-fit: cover; outline: none; border: none; box-shadow: none; z-index: 0; } .blogauthor-block-inner-wrapper { width: 100%; z-index: 1; margin-left: auto; margin-right: auto; } @media only screen and (min-width: 482px) { .theme-widgetarea-full .blogauthor-block-inner-wrapper { max-width: calc(100vw - 10rem); } } .theme-widgetarea-full .widget-title{ margin-top: 2rem; padding-top: 2rem; } .theme-widgetarea-full .blogauthor-cta-widget, .theme-widgetarea-full .blogauthor-mailchimp-widget { padding-bottom: 10rem; padding-top: 10rem; } @media only screen and (min-width: 992px) { .theme-widgetarea-full .blogauthor-mailchimp-widget.style_1 .blogauthor-mailchimp-inner-wrapper { max-width: min(calc(100vw - 20rem), 72rem); } .theme-widgetarea-full .blogauthor-mailchimp-widget.style_2 .blogauthor-mailchimp-inner-wrapper { display: flex; justify-content: space-between; } .mailchimp-content-group_1, .mailchimp-content-group_2 { flex: 1; } .theme-widgetarea-full .blogauthor-mailchimp-widget.style_2 .blogauthor-mailchimp-inner-wrapper, .theme-widgetarea-full .blogauthor-cta-inner-wrapper { max-width: min(calc(100vw - 20rem), 124rem); } } .header-style-aside .site-content-area .theme-widgetarea.theme-widgetarea-full .blogauthor-block-inner-wrapper{ padding-left: 3rem; padding-right: 3rem; } @media (max-width: 575px) { .header-style-aside .site-content-area .theme-widgetarea.theme-widgetarea-full .blogauthor-block-inner-wrapper { padding-left: 1.5rem; padding-right: 1.5rem; } } .widget_blogauthor_mailchimp_form, .widget_blogauthor_call_to_action{ margin-bottom: 0; padding-bottom: 0; } .widget_blogauthor_mailchimp_form .widget-content, .widget_blogauthor_call_to_action .widget-content { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); max-width: 1000%; width: auto; } .header-style-aside .widget_blogauthor_mailchimp_form .widget-content, .header-style-aside .widget_blogauthor_call_to_action .widget-content { margin-left: auto; margin-right: auto; max-width: 100%; width: auto; } /* Media --------------------------------------------- */ .page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } /* Make sure logo link wraps around logo image. */ .custom-logo-link { display: inline-block; } /* Captions --------------------------------------------- */ .wp-caption { margin-bottom: 1.5em; max-width: 100%; } .wp-caption img[class*="wp-image-"] { display: block; margin-left: auto; margin-right: auto; } .wp-caption .wp-caption-text { margin: 0.8075em 0; } .wp-caption-text { text-align: center; } /* Galleries --------------------------------------------- */ .gallery { margin-bottom: 1.5em; display: grid; grid-gap: 1rem; } .gallery-item { display: inline-block; margin: 0; text-align: center; width: 100%; } .gallery-columns-2 { grid-template-columns: repeat(2, 1fr); } .gallery-columns-3 { grid-template-columns: repeat(3, 1fr); } .gallery-columns-4 { grid-template-columns: repeat(4, 1fr); } .gallery-columns-5 { grid-template-columns: repeat(5, 1fr); } .gallery-columns-6 { grid-template-columns: repeat(6, 1fr); } .gallery-columns-7 { grid-template-columns: repeat(7, 1fr); } .gallery-columns-8 { grid-template-columns: repeat(8, 1fr); } .gallery-columns-9 { grid-template-columns: repeat(9, 1fr); } .gallery-caption { display: block; } /* Footer --------------------------------------------- */ .site-recommendation-section { border-bottom: 0; } .site-recommendation-section .theme-recommended-post, .site-recommendation-section .theme-recommended-post .entry-image { margin-bottom: 2rem; } .theme-widgetarea-full { border-top: 1px solid; } .site-footer { background-color: var(--theme-component-color); padding-bottom: 6rem; padding-top: 6rem; } .site-footer, .site-footer a:not(:hover):not(:focus) { color: var(--theme-white-color); } @media screen and (min-width: 1200px) { .has-sticky-footer .site, .has-sticky-footer .site .site-content-area { background-color: inherit; } .has-sticky-footer .site-content-area { position: relative; } .has-sticky-footer:not(.blogauthor-search-canvas-open) .site-content-area { z-index: 1; } .site-footer[data-sticky-footer="true"] { margin: 0; position: fixed; bottom: 0; left: 0; right: 0; opacity: 0; visibility: hidden; z-index: 0; } .site-footer[data-sticky-footer="true"].has-footer-stuck { opacity: 1; visibility: visible; } } @media screen and (max-width: 1199px) { .sticky-footer-spacer { display: none !important; height: 0 !important; } } .theme-footer-top { border-bottom: 0.1rem solid; margin-bottom: 3rem; padding-bottom: 3rem; } .theme-footer-bottom { display: -ms-flexbox; display: flex; flex-direction: column-reverse; gap: 1.5rem; } .theme-footer-bottom .theme-author-credit { display: flex; gap: 1rem; flex-shrink: 0; } [lang^="en-"] .theme-author-credit .theme-copyright-info { text-transform: capitalize; } @media (min-width: 992px) { .theme-footer-bottom { flex-direction: row; align-items: center; justify-content: space-between; } } @media (max-width: 991px) { .theme-footer-bottom > div { margin-bottom: 2rem; } } @media (max-width: 767px) { .theme-footer-bottom .theme-author-credit { display: block; } } #theme-scroll-to-start { display: none; position: fixed; bottom: 6rem; right: 6rem; cursor: pointer; width: 3rem; height: 4rem; z-index: 20; -o-transform: rotate(180deg); -ms-transform: rotate(180deg); -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); } #theme-scroll-to-start.visible { display: inline-block; } #theme-scroll-to-start.svg-icon { position: absolute; left: 50%; margin-left: -30px; bottom: 20px; } #theme-scroll-to-start .svg-icon path { stroke: #fff; fill: transparent; stroke-width: 3px; animation: arrow 2s infinite; -webkit-animation: arrow 2s infinite; } @keyframes arrow { 0% { opacity: 0 } 40% { opacity: 1 } 80% { opacity: 0 } 100% { opacity: 0 } } #theme-scroll-to-start .svg-icon path { animation-delay: -0.5s; -webkit-animation-delay: -0.5s; /* Safari 和 Chrome */ } #theme-scroll-to-start .svg-icon path:first-child { animation-delay: -1s; -webkit-animation-delay: -1s; /* Safari 和 Chrome */ } #theme-scroll-to-start .svg-icon path:last-child { animation-delay: 0s; -webkit-animation-delay: 0s; /* Safari 和 Chrome */ } /*-------------------------------------------------------------- # Plugins --------------------------------------------------------------*/ /* Jetpack infinite scroll --------------------------------------------- */ /* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */ .infinite-scroll .posts-navigation, .infinite-scroll.neverending .site-footer { display: none; } /* Re-display the Theme Footer when Infinite Scroll has reached its end. */ .infinity-end.neverending .site-footer { display: block; } /*-------------------------------------------------------------- # Utilities --------------------------------------------------------------*/ /* Accessibility --------------------------------------------- */ /* Text meant only for screen readers. */ .screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; } .screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; 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; } .skip-link.screen-reader-text:focus { background-color: #eee; color: #444; font-size: 1.6rem; } /* Do not show the outline on the skip link target. */ #primary[tabindex="-1"]:focus { outline: 0; } /* Alignments --------------------------------------------- */ .alignleft { /*rtl:ignore*/ text-align: left; margin-top: 0; } .no-sidebar .entry-content > .alignleft { max-width: min(calc(100vw - 20rem), 68rem); } @media only screen and (min-width: 482px) { .alignleft { /*rtl:ignore*/ float: left; /*rtl:ignore*/ margin-right: 2.5rem; margin-bottom: 3rem; } .no-sidebar .entry-content > .alignleft { max-width: calc(50% - calc(0.5 * (100vw - min(calc(100vw - 20rem), 68rem)))); } } .aligncenter { clear: both; display: block; float: none; margin-right: auto; margin-left: auto; text-align: center; } .alignright { margin-top: 0; margin-bottom: 3rem; } .no-sidebar .entry-content > .alignright { max-width: min(calc(100vw - 20rem), 68rem); } @media only screen and (min-width: 482px) { .alignright { /*rtl:ignore*/ float: right; /*rtl:ignore*/ margin-left: 2.5rem; } .no-sidebar .entry-content > .alignright { max-width: calc(50% - calc(0.5 * (100vw - min(calc(100vw - 20rem), 68rem)))); } } [class*="inner-container"] > .alignleft + *, [class*="inner-container"] > .alignright + * { margin-top: 0; } input, textarea, .site-topbar, .theme-offcanvas-header, .single-comments-area, .single-comments-area:before, .single-comments-area li.comment .children li:before, .single-comments-area li.pingback .children li:before, .single-comments-area li.trackback .children li:before, .site-header, .theme-widgetarea-full, #site-content #secondary .widget, .widget_recent_entries ul li, .widget_recent_entries ol li, .widget_categories ul li, .widget_categories ol li, .widget_archive ul li, .widget_archive ol li, .widget_meta ul li, .widget_meta ol li, .widget_recent_comments ul li, .widget_recent_comments ol li, .widget_nav_menu ul li, .widget_nav_menu ol li, .widget_block .wp-block-group__inner-container ul li, .widget_block .wp-block-group__inner-container ol li, .wp-block-tag-cloud.is-style-outline a, .wp-block-search__input, .widget-tab-header, .header-style-aside .header-individual-component { border-color: rgba(0, 0, 0, 0.1); } .site-footer .theme-footer-top, .site-footer .widget_recent_entries ul li, .site-footer .widget_recent_entries ol li, .site-footer .widget_categories ul li, .site-footer .widget_categories ol li, .site-footer .widget_archive ul li, .site-footer .widget_archive ol li, .site-footer .widget_meta ul li, .site-footer .widget_meta ol li, .site-footer .widget_recent_comments ul li, .site-footer .widget_recent_comments ol li, .site-footer .widget_nav_menu ul li, .site-footer .widget_nav_menu ol li, .site-footer .widget_block .wp-block-group__inner-container ul li, .site-footer .widget_block .wp-block-group__inner-container ol li, .site-footer .wp-block-tag-cloud.is-style-outline a, .site-footer .wp-block-search__input, .site-footer .widget-tab-header { border-color: rgba(255, 255, 255, 0.1); } .welcome-screen-banner { background-color: var(--theme-bg-color); width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 99999; text-align: center; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; transition: all 0.6s ease; } .welcome-screen-banner.welcome-screen-vanished { transform: translateY(-100%); -o-transform: translateY(-100%); -ms-transform: translateY(-100%); -webkit-transform: translateY(-100%); z-index: -1; } .welcome-screen-banner img { object-fit: cover; } .welcome-screen-banner .welcome-banner-full-viewport img { width: 100vw; height: 100vh; } .welcome-screen-banner .welcome-banner-default, .welcome-screen-banner .welcome-banner-default .welcome-screen-header, .welcome-screen-banner .welcome-banner-default .welcome-screen-image { display: flex; } .welcome-screen-banner .welcome-banner-default { height: 100vh; flex-direction: column; justify-content: center; background-color: var(--plain-white); width: 100%; max-width: 100rem; margin: 0 auto; } @media only screen and (min-width: 482px) { .welcome-screen-banner .welcome-banner-default { max-width: 30rem; } } @media only screen and (min-width: 768px) { .welcome-screen-banner .welcome-banner-default { max-width: 70rem; } } @media only screen and (min-width: 992px) { .welcome-screen-banner .welcome-banner-default { max-width: 80rem; } } .welcome-screen-banner .welcome-banner-default .welcome-screen-image img { height: 100%; width: 100%; } .welcome-screen-banner .welcome-banner-default .welcome-screen-header { align-items: center; justify-content: space-between; margin-bottom: 3rem; } .welcome-screen-banner .welcome-banner-default .welcome-screen-header .welcome-screen-title { font-weight: 700; } .welcome-screen-banner .welcome-banner-default .welcome-screen-header .welcome-screen-skip { padding: 0.3rem 1.5rem; border-radius: 2rem; text-transform: capitalize; } .welcome-screen-banner .welcome-banner-contained { display: flex; align-items: center; justify-content: center; gap: 3rem; } .welcome-screen-banner .welcome-banner-contained .welcome-screen-header { order: 2; } .welcome-screen-banner .welcome-banner-full-viewport .welcome-screen-cursor { position: absolute; left: 0; right: 0; bottom: 6rem; width: 2rem; margin: 0 auto; z-index: 100; background: none; border: none; } .mouse-wrapper { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .mouse-icon { height: 35px; width: 22px; border-radius: 12px; border: 2px solid var(--theme-accent-color); position: relative; } .mouse-icon:after { content: ''; height: 5px; width: 3px; display: block; margin: 5px auto; border: 2px solid var(--theme-accent-color); -webkit-border-radius: 8px; border-radius: 8px; -webkit-animation: mouse-wheel 0.6s linear infinite; -moz-animation: mouse-wheel 0.6s linear infinite; } .mouse-arrow { display: block; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); border-right: 2px solid var(--theme-accent-color); border-bottom: 2px solid var(--theme-accent-color); margin: 2px 0 3px 6px; width: 8px; height: 8px; -webkit-animation: mouse-scroll 1s infinite; -moz-animation: mouse-scroll 1s infinite; -webkit-animation-delay: 100ms; -moz-animation-delay: 100ms; -webkit-animation-direction: alternate; } .mouse-arrow:after, .mouse-arrow:before { position: absolute; content: ''; display: block; border-right: 2px solid var(--theme-accent-color); border-bottom: 2px solid var(--theme-accent-color); width: 8px; height: 8px; -webkit-animation: mouse-scroll 1s infinite; -moz-animation: mouse-scroll 1s infinite; } .mouse-arrow:after { margin: 7px 0 3px 7px; -webkit-animation-delay: 200ms; -moz-animation-delay: 200ms; -webkit-animation-direction: alternate; } .mouse-arrow:before { margin: 14px 0 3px 14px; -webkit-animation-delay: 300ms; -moz-animation-delay: 300ms; -webkit-animation-direction: alternate; } @-webkit-keyframes mouse-wheel { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(6px); -ms-transform: translateY(6px); transform: translateY(6px); } } @-webkit-keyframes mouse-scroll { 0% { opacity: 0; } 50% { opacity: 0.5; } 100% { opacity: 1; } } /* Plugin Support --------------------------------------------- */ .elementor-html .theme-preloader { display: none; } .mc4wp-form .mc4wp-alert { color: #5BC0DE; font-size: 13px; } .mc4wp-form .mc4wp-error { color: #D9534F; } .mc4wp-form .mc4wp-success { color: #5CB85C; } .mc4wp-form label { font-size: 1.2rem; display: block; font-weight: 400; margin-bottom: 0; } .mc4wp-form input[type=email] { border: 1px solid #ddd; margin-bottom: 0; width: 100%; } .mc4wp-form input[type=email]::-webkit-input-placeholder { color: gray; font-size: 1.4rem; } .mc4wp-form input[type=email]:-moz-placeholder { color: gray; font-size: 1.4rem; } .mc4wp-form input[type=email]::-moz-placeholder { color: gray; font-size: 1.4rem; } .mc4wp-form input[type=email]:-ms-input-placeholder { color: gray; font-size: 1.4rem; } .mc4wp-form input[type=submit] { padding: 10px 30px; width: 100%; } .site-section-content { font-size: 2rem; } .blogauthor-load-posts-btn-wrapper { position: relative; margin-top: 6rem; margin-bottom: 6rem; } .blogauthor-load-posts-btn-wrapper > hr { border: 0; height: 1px; background-color: rgba(0, 0, 0, 0.1); margin-top: 4rem; margin-bottom: 2rem; } .blogauthor-load-posts-btn-wrapper > .ajax-viewmore-link { display: block; position: absolute; top: 60%; left: 50%; transform: translate(-50%, -50%); } .ajax-viewmore-link .load-btn { padding: 1rem 4rem; } .ajax-viewmore-link .blogauthor-ajax-loader { width: 2rem; height: 2rem; border: 5px solid var(--theme-accent-color); border-bottom-color: #FF3D00; border-radius: 50%; display: none; visibility: hidden; box-sizing: border-box; animation: rotation 1s linear infinite; position: absolute; top: calc(50% - 1rem); left: 1rem; z-index: 1; } .ajax-viewmore-link .blogauthor-ajax-loader.active { display: inline-block; visibility: visible; } @keyframes rotation { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }