/** * Theme Name: Fivek 5eva * Theme URI: https://bizbudding.com/mai-theme/ * Description: Mai Slate starter theme for the Genesis Framework. * Author: BizBudding * Author URI: https://bizbudding.com/ * Version: 2.1.1 * Text Domain: mai-slate * Template: genesis * Template Version: 3.3.5 * License: GPL-2.0-or-later * License URI: http://www.gnu.org/licenses/gpl-2.0.html */ @font-face { font-family: "DM Sans"; src: url("assets/fonts/DMSans-Variable_opsz_wght.woff2") format("woff2"); font-weight: 100 1000; font-style: normal; font-display: swap; font-feature-settings: "ss02" 1, "ss03" 1, "case" 1; font-optical-sizing: auto; unicode-range: U+000D, U+0020-007E, U+00A0-00AC, U+00AE-0107, U+010A-011B, U+011E-0123, U+0126-0133, U+0136-0137, U+0139-0148, U+014A-015B, U+015E-0165, U+0168-017E, U+018F, U+0192, U+01FC-01FD, U+0218-021B, U+0237, U+0259, U+02C6-02C7, U+02D8-02DD, U+0300-0304, U+0306-0308, U+030A-030C, U+0312, U+0326-0328, U+03C0, U+1E80-1E85, U+1E9E, U+1EBC-1EBD, U+1EF2-1EF3, U+1EF8-1EF9, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+2074, U+20A8, U+20AC, U+20B9-20BA, U+20BD, U+2113, U+2122, U+2126, U+212E, U+2190-2199, U+2202, U+2206, U+220F, U+2211-2212, U+2215, U+221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+FB01-FB02; } @font-face { font-family: "DM Sans"; src: url("assets/fonts/DMSans-Italic-Variable_opsz_wght.woff2") format("woff2"); font-weight: 100 1000; font-style: italic; font-display: swap; font-feature-settings: "ss02" 1, "ss03" 1, "case" 1; font-optical-sizing: auto; unicode-range: U+000D, U+0020-007E, U+00A0-00AC, U+00AE-0107, U+010A-011B, U+011E-0123, U+0126-0133, U+0136-0137, U+0139-0148, U+014A-015B, U+015E-0165, U+0168-017E, U+018F, U+0192, U+01FC-01FD, U+0218-021B, U+0237, U+0259, U+02C6-02C7, U+02D8-02DD, U+0300-0304, U+0306-0308, U+030A-030C, U+0312, U+0326-0328, U+03C0, U+1E80-1E85, U+1E9E, U+1EBC-1EBD, U+1EF2-1EF3, U+1EF8-1EF9, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+2074, U+20A8, U+20AC, U+20B9-20BA, U+20BD, U+2113, U+2122, U+2126, U+212E, U+2190-2199, U+2202, U+2206, U+220F, U+2211-2212, U+2215, U+221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+FB01-FB02;; } @font-face { font-family: "Playfair Display"; src: url("assets/fonts/PlayfairDisplay-VariableFont_wght.woff2") format("woff2"); font-style: normal; font-weight: 400 900; font-display: swap; font-feature-settings: "onum" 1, "liga" 1; unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00B4, U+00B6-017F, U+018F, U+0192, U+01A0-01A1, U+01AF-01B0, U+01B7, U+01CD-01CE, U+01D3-01D4, U+01E4-01E9, U+01EE-01EF, U+01F4-01F5, U+01FE-01FF, U+0218-021B, U+021E-021F, U+0237, U+0259, U+0292, U+02BB-02BC, U+02C6-02C7, U+02D8-02DD, U+0300-0304, U+0306-030C, U+0323, U+0326-0328, U+0335, U+0337-0338, U+0394, U+03A9, U+03BC, U+03C0, U+0400-045F, U+0462-0463, U+046A-046B, U+0490-0493, U+0496-0497, U+049A-049B, U+04A2-04A3, U+04AE-04B1, U+04BA-04BB, U+04C9-04CA, U+04D8-04D9, U+04E8-04E9, U+1E80-1E85, U+1E9E, U+1EA0-1EF9, U+2009, U+2010, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2032-2033, U+2039-203A, U+2044, U+2052, U+20AC, U+20B9, U+2105, U+2116, U+2122, U+212A-212B, U+2153-2154, U+2190-2194, U+2196-2199, U+2202, U+220F, U+2211-2212, U+221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25A0-25A1, U+25CA, U+FB01-FB02; } @font-face { font-family: "Playfair Display"; src: url("assets/fonts/PlayfairDisplay-Italic-VariableFont_wght.woff2") format("woff2"); font-style: italic; font-weight: 400 900; font-display: swap; font-feature-settings: "onum" 1, "liga" 1; unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00B4, U+00B6-017F, U+018F, U+0192, U+01A0-01A1, U+01AF-01B0, U+01B7, U+01CD-01CE, U+01D3-01D4, U+01E4-01E9, U+01EE-01EF, U+01F4-01F5, U+01FE-01FF, U+0218-021B, U+021E-021F, U+0237, U+0259, U+0292, U+02BB-02BC, U+02C6-02C7, U+02D8-02DD, U+0300-0304, U+0306-030C, U+0323, U+0326-0328, U+0335, U+0337-0338, U+0394, U+03A9, U+03BC, U+03C0, U+0400-045F, U+0462-0463, U+046A-046B, U+0490-0493, U+0496-0497, U+049A-049B, U+04A2-04A3, U+04AE-04B1, U+04BA-04BB, U+04C9-04CA, U+04D8-04D9, U+04E8-04E9, U+1E80-1E85, U+1E9E, U+1EA0-1EF9, U+2009, U+2010, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2032-2033, U+2039-203A, U+2044, U+2052, U+20AC, U+20B9, U+2105, U+2116, U+2122, U+212A-212B, U+2153-2154, U+2190-2194, U+2196-2199, U+2202, U+220F, U+2211-2212, U+221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25A0-25A1, U+25CA, U+FB01-FB02; } @font-face { font-family: "Recia Variable"; src: url("assets/fonts/Recia-Variable.woff2") format("woff2"); font-weight: 300 700; font-style: normal; font-feature-settings: "onum" 1; unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00B4, U+00B6-0137, U+0139-0148, U+014C-017E, U+0192, U+0218-021B, U+0237, U+02C6-02C7, U+02D8-02DD, U+0326, U+0394, U+03A9, U+03BC, U+03C0, U+1E80-1E85, U+1EF2-1EF3, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+2070, U+2074-2079, U+2080-2089, U+20A8, U+20AC, U+2113, U+2122, U+2126, U+212E, U+2150-2151, U+2153-215E, U+2202, U+2206, U+220F, U+2211-2212, U+2215, U+221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+E01A, U+E020-E025, U+E027-E031, U+E039-E043, U+E04B-E05B, U+E05D-E067, U+E083-E087, U+E089-E0A1, U+E0A3-E0AA, U+E166, U+E189-E18A, U+FB00-FB04; } @font-face { font-family: "Recia Variable"; src: url("assets/fonts/Recia-VariableItalic.woff2") format("woff2"); font-weight: 300 700; font-style: italic; font-feature-settings: "onum" 1; unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00B4, U+00B6-0137, U+0139-0148, U+014C-017E, U+0192, U+0218-021B, U+0237, U+02C6-02C7, U+02D8-02DD, U+0326, U+0394, U+03A9, U+03BC, U+03C0, U+1E80-1E85, U+1EF2-1EF3, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+2070, U+2074-2079, U+2080-2089, U+20A8, U+20AC, U+2113, U+2122, U+2126, U+212E, U+2150-2151, U+2153-215E, U+2202, U+2206, U+220F, U+2211-2212, U+2215, U+221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+E01A, U+E020-E025, U+E027-E031, U+E039-E043, U+E04B-E05B, U+E05D-E067, U+E083-E087, U+E089-E0A1, U+E0A3-E0AA, U+E166, U+E189-E18A, U+FB00-FB04; } @font-face { font-family: "Satoshi Variable"; src: url("assets/fonts/Satoshi-Variable.woff2"); font-weight: 300 800; font-display: swap; font-style: normal; font-feature-settings: "case" 1, "ss01" 1; } @font-face { font-family: "Satoshi Variable"; src: url("assets/fonts/Satoshi-VariableItalic.woff2"); font-weight: 300 800; font-display: swap; font-style: italic; font-feature-settings: "case" 1, "ss01" 1; } @font-face { font-family: "Cabinet Grotesk"; src: url("assets/fonts/CabinetGrotesk-Variable.woff2"); font-weight: 100 900; font-display: swap; font-style: normal; font-feature-settings: "ss04" 1, "ss05" 1; } :root { interpolate-size: allow-keywords; --color-primary-50: #f2f7fd; --color-primary-100: #e4eefa; --color-primary-200: #c4dcf3; --color-primary-300: #8fbfea; --color-primary-400: #549ddc; --color-primary-500: #2d80c8; --color-primary: #1e65ab; --color-primary-700: #1a518a; --color-heading: #194673; --color-primary-900: #1a3c60; --color-primary-950: #112640; --color-secondary-50: #d9fbff; --color-secondary-100: #cbeeff; --color-secondary-200: #81e2ff; --color-secondary-300: #5fc6ee; --color-secondary-400: #2da0c3; --color-secondary: #00809e; --color-secondary-600: #006883; --color-secondary-700: #00556d; --color-secondary-800: #004157; --color-secondary-900: #002f3c; --color-secondary-950: #001e29; --color-highlight-50: #f2f5fb; --color-highlight-100: #e8edf7; --color-highlight-200: #d5def0; --color-highlight-300: #bbc8e6; --color-highlight-400: #a0add9; --color-highlight-500: #8893cc; --color-highlight-600: #6269b6; --color-highlight-700: #5e63a4; --color-highlight-800: #4e5285; --color-highlight-900: #43476c; --color-highlight-950: #27293f; --color-bittersweet-100: #ffe3e1; --color-bittersweet-400: #fe776c; --color-bittersweet-500: #f74a3c; --color-bittersweet-700: #c02215; --color-alt: #f3f3f3; --color-neutral-200: #e4e4e4; --color-neutral-300: #0a0808; --color-neutral-400: #bababa; --color-neutral-500: #a6a6a6; --color-neutral-600: #838383; --color-body: #6a6a6a; --color-neutral-800: #4b4b4b; --color-neutral-900: #2e2e2e; --color-neutral-950: #141414; --color-border: hsl(from var(--color-black) h s l / 0.1); --body-font-family: "DM Sans", sans-serif !important; --body-line-height: 1.5; --body-font-size: var(--step-0); --heading-font-family: "DM Sans", serif !important; --serif-font-family: "Recia Variable", serif !important; --menu-font-family: var(--body-font-family); --menu-font-weight: 700; --menu-font-size: var(--font-size-base); --site-header-border-bottom: none; --image-border-radius: 0; --button-border-radius: 0; --button-font-weight: 500; --button-font-size: var(--font-size-md); --button-letter-spacing: .3px; --button-secondary-color: var(--color-neutral-900); --button-secondary-background: var(--color-secondary-400); --button-secondary-background-hover: var(--color-secondary); --alignfull-first-margin-top: calc((var(--content-sidebar-wrap-margin-top) + 2em) * -1); /* @link https://utopia.fyi/type/calculator?c=360,17,1.2,1440,20,1.333,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */ --step--2: clamp(0.7035rem, 0.7493rem + -0.0509cqi, 0.7378rem); --step--1: clamp(0.8854rem, 0.868rem + 0.0775cqi, 0.9377rem); --step-0: clamp(1.0625rem, 1rem + 0.2778cqi, 1.25rem); --step-1: clamp(1.275rem, 1.1446rem + 0.5796cqi, 1.6663rem); --step-2: clamp(1.53rem, 1.2996rem + 1.0239cqi, 2.2211rem); --step-3: clamp(1.836rem, 1.4611rem + 1.6663cqi, 2.9607rem); --step-4: clamp(2.2032rem, 1.622rem + 2.5829cqi, 3.9467rem); --step-5: clamp(2.6438rem, 1.7715rem + 3.8771cqi, 5.2609rem); } /* -------------------------------- defaults -------------------------------- */ body { --body-font-weight: 460; text-wrap: pretty; font-optical-sizing: auto; } p { margin-bottom: 1lh; } h1, h2, h3, h4, h5, h6, .is-style-heading, .is-style-subheading { --heading-font-weight: 400; --heading-line-height: 1.2; text-wrap: pretty; font-style: normal; color: var(--color-heading); font-optical-sizing: auto; margin-bottom: .4lh; } h1.entry-title { font-family: var(--serif-font-family); } .hide { display: none; } h1, h2 { line-height: 1.1; } .is-style-heading { font-size: var(--step-1); font-weight: 500; } .has-lg-font-size { line-height: 1.3; } .serif { font-family: var(--serif-font-family); font-weight: 400; letter-spacing: -1px; font-feature-settings: "ss01" 1, "case" 1, "liga" 1; } .entry-excerpt.entry-excerpt-single { font-family: var(--serif-font-family); font-weight: 460; margin-bottom: inherit; } .wp-block-list { list-style-type: square; margin-left: 16px; } h2 + h3 { margin-top: calc(var(--spacing-xs) * -1); font-style: italic; font-weight: 400; font-family: var(--serif-font-family); letter-spacing: -1px; color: var(--color-neutral-600); } @media only screen and (min-width: 1000px) { .pull { max-width: 40%; overflow: hidden; border: none !important; float: left; margin: 0 var(--spacing-xl) 0 -20% !important; .is-style-heading { color: var(--color-white); } } } /* -------------------------------- pullquote ------------------------------- */ .wp-block-pullquote { border-bottom: 4px solid var(--color-secondary-400); border-top: 4px solid var(--color-secondary-400); color: var(--color-heading); font-family: var(--serif-font-family); } .wp-block-quote { font-family: var(--serif-font-family); --blockquote-padding: var(--spacing-md) 0; border-left: none; padding-left: 0; font-size: var(--font-size-xl); color: var(--color-secondary-800); font-style: italic; font-weight: 700; } @media only screen and (min-width: 1000px) { .wp-block-pullquote { max-width: 36%; overflow: hidden; border: none !important; float: left; text-align: right; margin: 0 var(--spacing-xl) 0 -20% !important; &::before { content: ""; display: inline-block; width: 40%; border-top: 6px solid var(--color-secondary-300); } } .wp-block-pullquote { blockquote { border-left: none; padding: var(--spacing-lg) inherit; /* margin-bottom: var(--spacing-lg); */ p { font-size: 1em; font-weight: 400; letter-spacing: -1px; line-height: 1.3; font-style: normal; } } } } /* ---------------------------------- links --------------------------------- */ .entry-title-link { --entry-title-text-decoration: underline; text-decoration-color: var(--color-primary-900); text-decoration-thickness: 1.5px; text-underline-offset: 2px; &:focus-visible, &:hover { color: var(--color-primary); text-decoration-color: var(--color-primary); text-decoration-thickness: 1.5px; text-underline-offset: 4px; } } .entry-content a:not([class]) { --ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1); text-decoration: underline; text-decoration-color: var(--color-primary-900); text-decoration-thickness: 1.5px; text-underline-offset: 2px; &:focus-visible, &:hover { color: var(--color-primary); text-decoration-color: var(--color-primary); text-decoration-thickness: 1.5px; text-underline-offset: 4px; } } /* ------------------------------- backgrounds ------------------------------ */ /* From https://css.glass */ .glass { background: rgba(255, 255, 255, 0.2); border-radius: 16px; box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); border: 1px solid rgba(255, 255, 255, 0.3); } /* --------------------------------- buttons -------------------------------- */ .button-secondary { --button-color: var(--color-white); // Color contrast automatically generated. --button-color-hover: var(--color-secondary-100); --button-background: var(--color-secondary); --button-background-hover: var(--color-secondary-600); } .is-style-button-arrow a::after { display: inline-flex; width: 0.9rem; height: 0.9rem; background: currentcolor; mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA0NDggNTEyJz48IS0tIUZvbnQgQXdlc29tZSBQcm8gNi43LjIgYnkgQGZvbnRhd2Vzb21lIC0gaHR0cHM6Ly9mb250YXdlc29tZS5jb20gTGljZW5zZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tL2xpY2Vuc2UgKENvbW1lcmNpYWwgTGljZW5zZSkgQ29weXJpZ2h0IDIwMjUgRm9udGljb25zLCBJbmMuLS0+PHBhdGggZD0nTTQyMi42IDI3OC42TDQ0NS4zIDI1NmwtMjIuNi0yMi42LTE0NC0xNDRMMjU2IDY2LjcgMjEwLjggMTEybDIyLjYgMjIuNkwzMjIuOCAyMjQgMzIgMjI0IDAgMjI0bDAgNjQgMzIgMCAyOTAuNyAwLTg5LjQgODkuNEwyMTAuOCA0MDAgMjU2IDQ0NS4zbDIyLjYtMjIuNiAxNDQtMTQ0eicvPjwvc3ZnPg=="); mask-position: center .5px; mask-repeat: no-repeat; mask-size: contain; transition: var(--transition); content: ""; } .is-style-button-arrow a:hover::after { transform: translateX(4px); } /* -------------------------------- wp blocks ------------------------------- */ .wp-block-media-text { h1,h2 { font-family: var(--serif-font-family); } } .wp-block-media-text > .wp-block-media-text__content { padding: 8% 0 4%; } @media only screen and (min-width: 1000px) { .wp-block-media-text > .wp-block-media-text__content { padding: 12% 6%; } } /* --------------------------------- layout --------------------------------- */ /* .alignfull.has-md-padding-bottom + .alignfull.has-md-padding-top { margin-top: calc(var(--spacing-md) * -1); } */ .wide-content { .entry-excerpt.entry-excerpt-single { margin-bottom: 1.75rem; } .entry-content { max-width: var(--breakpoint-lg); margin-inline: auto; .wp-block-columns.is-layout-flex { --column-gap: var(--spacing-xxl); } } } @media only screen and (min-width: 800px) { /* media text block content overlaps image */ /* .wp-block-media-text.overlap { .wp-block-media-text__content { padding: 12%; margin-right: -320px; z-index: 1; h1 { font-size: var(--step-5); font-weight: 300; margin-bottom: var(--spacing-lg); } } .wp-block-media-text__media { z-index: -1; } } } */ .page-template-default:not(.home) { --content-sidebar-wrap-margin-top: calc(var(--spacing-xxl) * 2); } .home { --content-sidebar-wrap-margin-top: 0; } @media only screen and (min-width: 400px) { /* Your CSS here. */ } @media only screen and (min-width: 600px) { /* Your CSS here. */ } @media only screen and (max-width: 800px) { .wp-block-columns.easy { flex-direction: row-reverse; } } @media only screen and (min-width: 1000px) { /* Your CSS here. */ } .home { .content-sidebar-wrap > .content > .entry > .entry-wrap > .entry-content:first-child > .alignfull:first-child { --alignfull-first-margin-top: 0; } } /* .bg-top-gradient { background-image: linear-gradient( to right, #eee, #eee 70%, transparent 70% ); background-repeat: no-repeat; background-position: bottom 0 right 0; background-size: 100%; } */ @media only screen and (min-width: 1000px) { .hero { /* background-image: url("assets/images/5kwebsite-affinity-star-top-45.svg"), linear-gradient( to bottom, var(--color-alt), var(--color-alt) 73%, transparent 73% ); background-repeat: no-repeat, no-repeat; background-position: center left, bottom 0 right 0; background-size: 50%, 100%; */ /* z-index: -1; */ } .hero { background-image: url("assets/images/5kwebsite-affinity-star-top-45.svg"); background-repeat: no-repeat; background-position: center left; /* z-index: -1; */ } /* 2 cols wide layout */ :not(.home).wide-content { .entry-excerpt.entry-excerpt-single { max-width: 66%; text-wrap: pretty; margin-bottom: inherit; } } } .center { h1.entry-title, .entry-excerpt.entry-excerpt-single { text-align: center; } .entry-excerpt.entry-excerpt-single { margin-left: auto; margin-right: auto; } } /* ------------------------------- navigation ------------------------------- */ .nav-header { --menu-item-link-color: var(--color-heading); --menu-item-link-color-hover: var(--color-primary); --menu-item-width: auto; --menu-letter-spacing: 0.1px; .menu-item-link { background-blend-mode: screen; text-decoration: none; padding: 16px 20px; font-weight: var(--menu-font-weight); & span { /* font-weight: var(--menu-font-weight); */ } } } .sub-menu { --sub-menu-border: 1px solid rgba(170, 212, 248, 0.3); --sub-menu-border-radius: 0; --sub-menu-background: var(--color-heading); --sub-menu-link-color: var(--color-white); --sub-menu-font-size: var(--menu-font-size); --sub-menu-padding: 0; --sub-menu-width: 15em; --menu-item-link-color-hover: var(--color-primary-300); box-shadow: var(--shadow); /* filter: var(--drop-shadow); */ .menu-item-link { border-bottom: var(--sub-menu-border); font-weight: inherit; } li:last-child .menu-item-link { border-bottom: none; } } /* ---------------------------- home page custom ---------------------------- */ .hero { .wp-block-media-text{ >.wp-block-media-text__content { .step1 { font-size: var(--step-0); } .entry-title { font-size: var(--step-4); line-height: .9; .word6 { color: var(--color-secondary); font-style: italic; } } } .wp-block-media-text { >.wp-block-media-text__media { position: relative; } } } } @media only screen and (min-width: 1000px) { .hero { .entry-title { max-width: 12ch; } .wp-block-media-text { >.wp-block-media-text__media { position: relative; &::after { content: ""; background: url('data:image/svg+xml,') no-repeat; position: absolute; left: 0px; bottom: 0px; display: block; background-size: 90px 105px; width: 90px; height: 105px; z-index: 1; } } } } /* -------------------------------------------------------------------------- */ /* plugins */ /* -------------------------------------------------------------------------- */ /* -------------------------------- mai list -------------------------------- */ .mai-list-content { p:nth-child(1) { margin-bottom: .25lh; } } /* -------------------------------- mai grid -------------------------------- */ .has-boxed { --entry-border: none; --entry-box-shadow: none; article { border-radius: 0; line-height: 1.3; --entry-wrap-padding: var(--spacing-xl) var(--spacing-lg); } } .mai-grid.has-boxed.primary-shades { article:nth-child(1) { background-color: var(--color-primary-500); } article:nth-child(2) { background-color: var(--color-primary); } article:nth-child(3) { background-color: var(--color-heading); } article:nth-child(4) { background-color: var(--color-primary-900); } article { color: var(--color-primary-50); } article:nth-child(1), article:nth-child(2){ .entry-title-link { color: var(--color-white); text-decoration-color: var(--color-primary-100); } } article:nth-child(3), article:nth-child(4){ .entry-title-link { color: var(--color-primary-200); text-decoration-color: var(--color-primary-300); } } } .wp-block-group.alignfull.reverse { h2 { font-size: var(--font-size-xxxl); } color: var(--color-primary-300); .mai-grid { .entry-wrap-grid { .entry-excerpt { --entry-excerpt-font-size: 1em; line-height: var(--body-line-height); } } .has-boxed { --entry-border: none; --entry-box-shadow: none; } .entry-title-link { /* --entry-title-text-decoration: underline; */ text-decoration-color: var(--color-primary-400); &:active, &:hover { color: var(--color-primary-300); } } } } .mai-grid.counter { counter-reset: entry-counter; .entry-wrap { cursor: pointer; /* background-color: var(--color-heading); box-shadow: var(--shadow); color: var(--color-primary-100); .entry-title-link { color: var(--color-primary-100); --entry-title-text-decoration: underline; text-decoration-color: var(--color-primary-300); text-decoration-thickness: 1.5px; text-underline-offset: 2px; &:focus-visible, &:hover { color: var(--color-primary-300); text-decoration-color: var(--color-primary-300); text-decoration-thickness: 1.5px; text-underline-offset: 4px; } } */ } .short-blurb { font-size: .95em; line-height: 1.4; &::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; } } } .mai-grid.counter { h3.entry-title { font-weight: 600; --entry-title-font-size: calc(var(--font-size-xl) * .9); display: list-item; list-style-type: none; } .entry-title-link { text-decoration-color: var(--color-primary-300); color: var(--color-primary-700); counter-increment: entry-counter; position: relative; &::before { content: counter(entry-counter, decimal); font-weight: 400; font-family: var(--body-font-family); /* color: var(--color-primary-300); */ position: absolute; left: calc(var(--spacing-xxs) * -1); top: -3rem; font-size: 2rem; font-weight: 500; } z-index: 2; } } @media only screen and (min-width: 1000px) { .blocks-bg { position: relative; z-index: 1; .wp-block-image { box-shadow: var(--shadow); } &::after { content: ''; position: absolute; background: url("assets/images/5kwebsite-diamond-pattern.svg") repeat-y; top: 0; right: 0; bottom: 0; left: 0; background-size: 140px; z-index: -1; } } } /* -------------------------------- slabtext -------------------------------- */ .slab { font-family: var(--body-font-family); font-weight: 1000; text-transform: uppercase; line-height: .95; } .slabtexted .slabtext { display: -moz-inline-box; display: inline-block; white-space: nowrap; } .slabtextinactive .slabtext { display: inline; white-space: normal; font-size: 1em !important; letter-spacing: inherit !important; word-spacing: inherit !important; *letter-spacing: normal !important; *word-spacing: normal !important; } .slabtextdone .slabtext { display: block; } /* ------------------------------- mai columns ------------------------------ */ .center { .mai-column.mai-column.has-background { padding: var(--spacing-xl); p:not(.is-style-heading), li { line-height: 1.3; font-size: var(--font-size-base); } } } /* ------------------------------ mai accordion ----------------------------- */ .mai-accordion { --icon-plus: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA2NDAgNjQwJz48IS0tIUZvbnQgQXdlc29tZSBQcm8gNy4xLjAgYnkgQGZvbnRhd2Vzb21lIC0gaHR0cHM6Ly9mb250YXdlc29tZS5jb20gTGljZW5zZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tL2xpY2Vuc2UgKENvbW1lcmNpYWwgTGljZW5zZSkgQ29weXJpZ2h0IDIwMjYgRm9udGljb25zLCBJbmMuLS0+PHBhdGggZD0nTTMyMC4zIDQ2MS4zTDUwMi45IDI3OC43TDUyNS41IDI1Ni4xTDQ4MC4yIDIxMC44TDQ1Ny42IDIzMy40TDMyMC4yIDM3MC44TDE4Mi44IDIzMy40TDE2MC4yIDIxMC44TDExNC45IDI1Ni4xTDEzNy41IDI3OC43TDI5Ny41IDQzOC43TDMyMC4xIDQ2MS4zeicvPjwvc3ZnPg==") !important; --icon-minus: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA2NDAgNjQwJz48IS0tIUZvbnQgQXdlc29tZSBQcm8gNy4xLjAgYnkgQGZvbnRhd2Vzb21lIC0gaHR0cHM6Ly9mb250YXdlc29tZS5jb20gTGljZW5zZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tL2xpY2Vuc2UgKENvbW1lcmNpYWwgTGljZW5zZSkgQ29weXJpZ2h0IDIwMjYgRm9udGljb25zLCBJbmMuLS0+PHBhdGggZD0nTTMyMC4zIDE3OC43TDM0Mi45IDIwMS4zTDUyNS41IDM4My45TDQ4MC4yIDQyOS4yTDQ1Ny42IDQwNi42TDMyMC4yIDI2OS4yTDE4Mi44IDQwNi42TDE2MC4yIDQyOS4yTDExNC45IDM4My45TDEzNy41IDM2MS4zTDI5Ny41IDIwMS4zTDMyMC4xIDE3OC43eicvPjwvc3ZnPg==") !important; --accordion-item-border: none; } .mai-accordion.faq { counter-reset: item; } .mai-accordion.faq > .mai-accordion-item { counter-increment: item; --accordion-item-background: transparent; position: relative; display: list-item; list-style-type: none; &::before { font-family: var(--heading-font-family); font-size: var(--font-size-lg); font-weight: 600; line-height: 1; position: absolute; left: 0.5em; top: calc(var(--spacing-md) + 1px); content: counter(item, decimal-leading-zero); color: var(--color-neutral-500); } } .mai-accordion-summary { --accordion-summary-padding: var(--spacing-md) var(--spacing-lg) var(--spacing-md) var(--spacing-xxxl); border-bottom: 1px solid var(--color-neutral-300); color: var(--color-body); &::after { font-size: 1em; } .mai-accordion-title { color: var(--color-heading); font-size: calc(var(--font-size-lg) + 1px); line-height: 1.2; } } .mai-accordion-item[open] > .mai-accordion-content { border-bottom: 2px solid var(--color-body); } .mai-accordion-content { --accordion-content-padding: var(--spacing-lg) var(--spacing-xl) var(--spacing-xl) var(--spacing-xxxl); ul:last-child, ol:last-child { margin-bottom: 0; } } /* ---------------------------------- ctas ---------------------------------- */ .cta.highlight { background-color: var(--color-highlight-200); h2, h3 { color: var(--color-highlight-950); } p { color: var(--color-highlight-600) } } .mai-columns.cta { p { line-height: 1.4; } .mai-column:nth-child(1) { background: url("assets/images/5kwebsite-affinity-star-top.svg"), var(--color-secondary-800); background-repeat: no-repeat, no-repeat; background-position: center bottom -1px, 0 0; background-size: contain, cover; } } .one-shot { .mai-column:nth-child(1) { /* background-color: var(--color-primary-700); */ color: var(--color-primary-50); h2, h3 { color: var(--color-primary-100); } line-height: 1.3; } .mai-column:nth-child(2) { /* background: url("assets/images/5kwebsite-target.svg"), var(--color-neutral-200); */ /* background-size: 200px; background-repeat: no-repeat; background-position: right -100px bottom -100px; */ } } /* --------------------------------- footer --------------------------------- */ .site-footer > div { font-family: var(--body-font-family); font-size: var(--step--1); letter-spacing: normal; } footer a { text-decoration: underline; color: var(--color-primary-200); text-decoration-color: var(--color-primary-200); text-decoration-thickness: 1; text-underline-offset: 2px; &:focus-visible, &:hover { color: var(--color-primary-200); text-decoration-color: var(--color-primary-300); text-decoration-thickness: 1px; text-underline-offset: 4px; filter: brightness(1); } } footer { background-color: var(--color-primary-950); /* background-repeat: no-repeat, no-repeat; background-size: 200px, cover; background-position: bottom right, top left; mix-blend-mode: color-dodge, normal; */ font-size: var(--step--1); color: var(--color-primary-100); ul { list-style-type: none; margin-left: 0px; li { margin-bottom: var(--spacing-xxxs); } } h5 { font-family: var(--body-font-family); font-weight: 600; color: var(--color-primary-100); letter-spacing: .3px; } .footer-credits { .wp-block-group__inner-container { border-top: 1px solid hsl(from var(--color-white) h s l / 0.2); padding-top: var(--spacing-xs); } } } }}