commit e34a61ebe4241ac6b7a8124cfd0a5842f3fae1f8 Author: Marcel Schoengens <> Date: Sun Jan 11 21:33:57 2026 +0100 Publii: update content diff --git a/404.html b/404.html new file mode 100644 index 0000000..2b52416 --- /dev/null +++ b/404.html @@ -0,0 +1,12 @@ +Error 404 - Tymets Bau

404

The page you were looking for appears to have been moved, deleted or does not exist. You could go back to where you were or head straight to our home page.

Go home

\ No newline at end of file diff --git a/assets/css/editor.css b/assets/css/editor.css new file mode 100755 index 0000000..37d7353 --- /dev/null +++ b/assets/css/editor.css @@ -0,0 +1,3 @@ +/* + * Add your own CSS code for the WYSIWYG editor + */ diff --git a/assets/css/main.css b/assets/css/main.css new file mode 100644 index 0000000..0f8ae68 --- /dev/null +++ b/assets/css/main.css @@ -0,0 +1,2182 @@ +*, +*:before, +*:after { + -webkit-box-sizing: border-box; + box-sizing: border-box; + margin: 0; + padding: 0; +} + +article, +aside, +footer, +header, +hgroup, +main, +nav, +section { + display: block; +} + +li { + list-style: none; +} + +img { + height: auto; + max-width: 100%; + vertical-align: top; +} + +button, +input, +select, +textarea { + font: inherit; +} + +address { + font-style: normal; +} + +::-moz-selection { + background: var(--color); + color: var(--white); +} + +::selection { + background: var(--color); + color: var(--white); +} + +:focus-visible { + outline: 2px solid var(--color) !important; + outline-offset: 2px; +} + +html { + font-size: var(--font-size); + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + scroll-behavior: smooth; +} +html.no-scroll { + overflow: hidden; + position: fixed; +} + +body { + background: var(--page-bg); + color: var(--text-color); + font-family: var(--body-font); + font-variation-settings: "wght" var(--font-weight-normal); + letter-spacing: var(--letter-spacing); + line-height: var(--line-height); + -ms-scroll-chaining: none; + overscroll-behavior: none; +} + +a { + text-decoration: none; +} +a { + color: var(--link-color); + -webkit-transition: all 0.24s ease-out; + transition: all 0.24s ease-out; +} +a:hover { + color: var(--link-color-hover); +} +a:active { + color: var(--link-color-hover); +} +a:focus { + outline: none; +} + +.invert { + color: var(--link-color-hover); + -webkit-transition: all 0.24s ease-out; + transition: all 0.24s ease-out; +} +.invert:hover { + color: var(--link-color); +} +.invert:active { + color: var(--link-color); +} +.invert:focus { + outline: none; +} + +p, +ul, +ol, +dl { + margin-top: calc(var(--baseline) * 4 + 0.25vw); +} + +blockquote, +figure, +hr, +pre, +table { + margin-top: calc(var(--baseline) * 6 + 0.5vw); + margin-bottom: calc(var(--baseline) * 6 + 0.5vw); +} + +h1, +h2, +h3, +h4, +h5, +h6 { + color: var(--headings-color); + font-family: var(--heading-font); + font-variation-settings: "wght" var(--headings-weight); + font-style: var(--headings-style); + -ms-hyphens: manual; + hyphens: manual; + letter-spacing: var(--headings-letter-spacing); + line-height: var(--headings-line-height); + margin-top: calc(var(--baseline) * 6 + 1vw); + text-transform: var(--headings-transform); +} + +h1, +.h1 { + font-size: clamp(1.5710900065rem, 1.5710900065rem + 1.424540906 * (100vw - 20rem) / 70, 2.9956309125rem); + font-family: var(--heading-font); +} + +h2, +.h2 { + font-size: clamp(1.3808408252rem, 1.3808408252rem + 0.9332127447 * (100vw - 20rem) / 70, 2.3140535699rem); +} + +h3, +.h3 { + font-size: clamp(1.2136296308rem, 1.2136296308rem + 0.4621997101 * (100vw - 20rem) / 70, 1.6758293408rem); +} + +h4, +.h4 { + font-size: clamp(1.1377777785rem, 1.1377777785rem + 0.1567604947 * (100vw - 20rem) / 70, 1.2945382732rem); +} + +h5, +.h5 { + font-size: clamp(1.066666667rem, 1.066666667rem + 0.0711111115 * (100vw - 20rem) / 70, 1.1377777785rem); +} + +h6, +.h6 { + font-size: clamp(1rem, 1rem + 0 * (100vw - 20rem) / 70, 1rem); +} + +h2 + *, +h3 + *, +h4 + *, +h5 + *, +h6 + * { + margin-top: calc(var(--baseline) * 2 + 0.25vw); +} + +b, +strong { + font-variation-settings: "wght" var(--font-weight-bold); +} + +blockquote { + border-top: 2px solid var(--dark); + border-bottom: 2px solid var(--dark); + color: var(--headings-color); + font-family: var(--heading-font); + font-style: italic; + font-variation-settings: "wght" var(--font-weight-bold); + padding: calc(var(--baseline) * 6 + 1vw) 2rem; + font-size: clamp(1.1377777785rem, 1.1377777785rem + 0.1567604947 * (100vw - 20rem) / 70, 1.2945382732rem); +} +blockquote > :nth-child(1) { + margin-top: 0; +} + +ul, +ol { + margin-left: 3ch; +} +ul > li, +ol > li { + list-style: inherit; + padding: 0 0 var(--baseline) 1ch; +} + +dl dt { + font-variation-settings: "wght" var(--font-weight-bold); +} + +pre { + background-color: var(--lighter); + font-size: 0.8239746086rem; + padding: calc(var(--baseline) * 6); + white-space: pre-wrap; + word-wrap: break-word; +} +pre > code { + color: var(--text-color); + display: inline-block; + font-size: inherit; + padding: 0; +} + +code { + background-color: var(--lighter); + color: var(--color); + font-size: 0.8239746086rem; + font-family: Menlo, Monaco, Consolas, Courier New, monospace; +} + +table { + border: 1px solid var(--light); + border-collapse: collapse; + border-spacing: 0; + vertical-align: top; + text-align: left; + width: 100%; +} +@media all and (max-width: 37.4375em) { + table { + display: block; + overflow-x: auto; + } +} +table th { + font-variation-settings: "wght" var(--font-weight-bold); + padding: calc(var(--baseline) * 2.5) calc(var(--baseline) * 4); +} +table td { + border-top: 1px solid var(--light); + padding: calc(var(--baseline) * 2.5) calc(var(--baseline) * 4); +} + +.table-striped tr:nth-child(2n) { + background: var(--lighter); +} +.table-bordered th, +.table-bordered td { + border: 1px solid var(--light); +} +.table-title th { + background: var(--lighter); +} + +figcaption { + clear: both; + color: var(--gray); + font-style: italic; + font-size: 0.7241964329rem; + padding: calc(var(--baseline) * 3) 0 0; + text-align: center; +} + +kbd { + background: var(--dark); + border-radius: 2px; + color: var(--white); + font-family: Menlo, Monaco, Consolas, Courier New, monospace; + font-size: 0.8789062495rem; + padding: calc(var(--baseline) * 0.5) calc(var(--baseline) * 1.5); +} + +sub, +sup { + font-size: 65%; +} + +small { + font-size: 0.8789062495rem; +} + +hr, +.separator { + background: none; + border: none; + height: auto; + line-height: 1; + max-width: none; + text-align: center; +} +hr::before, +.separator::before { + content: "•••"; + color: var(--dark); + font-size: 1rem; + font-variation-settings: "wght" var(--font-weight-bold); + letter-spacing: 1.1377777785rem; + padding-left: 1.1377777785rem; +} + +.separator--dot::before { + content: "•"; + color: var(--dark); + font-size: 1rem; + font-variation-settings: "wght" var(--font-weight-bold); + letter-spacing: 1.1377777785rem; + padding-left: 1.1377777785rem; +} +.separator--long-line { + position: relative; +} +.separator--long-line::before { + content: ""; + height: 1rem; +} +.separator--long-line::after { + border-top: 1px solid var(--light); + content: ""; + height: 1px; + position: absolute; + width: 100%; + top: 50%; + left: 0; +} + +.btn, [type=button], +[type=submit], +button { + align-items: center; + background: none; + border: 1px solid var(--dark); + border-radius: calc(var(--border-radius) * 10); + color: var(--dark); + cursor: pointer; + display: inline-flex; + font-family: var(--menu-font); + font-size: 0.8239746086rem; + font-variation-settings: "wght" var(--font-weight-bold); + overflow: hidden; + padding: calc(var(--baseline) * 2) calc(var(--baseline) * 4); + text-align: center; + -webkit-transition: all 0.24s ease-out; + transition: all 0.24s ease-out; + vertical-align: middle; + will-change: transform; +} +@media all and (max-width: 19.9375em) { + .btn, [type=button], + [type=submit], + button { + width: 100%; + } +} +.btn:hover, [type=button]:hover, +[type=submit]:hover, +button:hover, .btn:active, [type=button]:active, +[type=submit]:active, +button:active, .btn:focus, [type=button]:focus, +[type=submit]:focus, +button:focus { + background-color: var(--dark); + color: var(--helper); +} +.btn--icon { + gap: 0.3rem; + justify-content: center; +} +.btn--icon svg { + stroke: currentColor; +} +@media all and (min-width: 20em) { + .btn + .btn, [type=button] + .btn, + [type=submit] + .btn, + button + .btn, .btn + [type=button], [type=button] + [type=button], + [type=submit] + [type=button], + button + [type=button], + .btn + [type=submit], + [type=button] + [type=submit], + [type=submit] + [type=submit], + button + [type=submit], + .btn + button, + [type=button] + button, + [type=submit] + button, + button + button { + margin-left: calc(var(--baseline) * 2); + } +} +@media all and (max-width: 37.4375em) { + .btn + .btn, [type=button] + .btn, + [type=submit] + .btn, + button + .btn, .btn + [type=button], [type=button] + [type=button], + [type=submit] + [type=button], + button + [type=button], + .btn + [type=submit], + [type=button] + [type=submit], + [type=submit] + [type=submit], + button + [type=submit], + .btn + button, + [type=button] + button, + [type=submit] + button, + button + button { + margin-bottom: calc(var(--baseline) * 2); + } +} +.btn:disabled, [type=button]:disabled, +[type=submit]:disabled, +button:disabled, .btn[disabled], [disabled][type=button], +[disabled][type=submit], +button[disabled] { + background-color: var(--light); + border-color: var(--light); + color: var(--gray); + cursor: not-allowed; + pointer-events: none; +} + +[type=button], +[type=submit], +button { + -webkit-appearance: none; + -moz-appearance: none; +} + +::-webkit-search-cancel-button { + -webkit-appearance: none; +} + +fieldset { + border: 1px solid var(--light); + margin: calc(var(--baseline) * 6 + 1vw) 0 0; + padding: calc(var(--baseline) * 6); +} +fieldset > legend { + margin-left: -1rem; + padding: 0 1rem; +} + +legend { + font-variation-settings: "wght" 500; + padding: 0; +} + +label { + font-variation-settings: "wght" 500; + margin: 0 calc(var(--baseline) * 4) calc(var(--baseline) * 3) 0; +} + +[type=text], +[type=url], +[type=tel], +[type=number], +[type=email], +[type=search], +textarea, +select { + background-color: var(--page-bg); + border: none; + border: 1px solid var(--light); + color: var(--text-color); + font-size: 1rem; + outline: none; + padding: calc(var(--baseline) * 1.2) calc(var(--baseline) * 3); + vertical-align: middle; + width: 100%; + -webkit-appearance: none; + -moz-appearance: none; +} +@media all and (min-width: 37.5em) { + [type=text], + [type=url], + [type=tel], + [type=number], + [type=email], + [type=search], + textarea, + select { + width: auto; + } +} +[type=text]:focus, +[type=url]:focus, +[type=tel]:focus, +[type=number]:focus, +[type=email]:focus, +[type=search]:focus, +textarea:focus, +select:focus { + border-color: var(--dark); +} + +input[type=checkbox], +input[type=radio] { + opacity: 0; + position: absolute; +} +input[type=checkbox] + label, +input[type=radio] + label { + position: relative; + margin-left: -1px; + cursor: pointer; + padding: 0; +} +input[type=checkbox] + label:before, +input[type=radio] + label:before { + background-color: var(--white); + border: 1px solid var(--light); + border-radius: 2px; + content: ""; + display: inline-block; + height: calc(var(--baseline) * 5); + line-height: calc(var(--baseline) * 5); + margin-right: calc(var(--baseline) * 4); + vertical-align: middle; + text-align: center; + width: calc(var(--baseline) * 5); +} +input[type=checkbox]:checked + label:before, +input[type=radio]:checked + label:before { + content: ""; + background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 8'%3e%3cpolygon points='9.53 0 4.4 5.09 1.47 2.18 0 3.64 2.93 6.54 4.4 8 5.87 6.54 11 1.46 9.53 0' fill='%23d73a42'/%3e%3c/svg%3e"); + background-repeat: no-repeat; + background-size: 11px 8px; + background-position: 50% 50%; +} + +input[type=radio] + label:before { + border-radius: 50%; +} +input[type=radio]:checked + label:before { + background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3ccircle cx='4' cy='4' r='4' fill='%23d73a42'/%3e%3c/svg%3e"); +} + +[type=file] { + margin-bottom: calc(var(--baseline) * 6); + width: 100%; +} + +select { + max-width: 100%; + width: auto; + position: relative; +} +select:not([multiple]) { + background: url('data:image/svg+xml;utf8,') no-repeat 90% 50%; + background-size: 8px; + padding-right: calc(var(--baseline) * 12); +} + +select[multiple] { + border: 1px solid var(--light); + padding: calc(var(--baseline) * 6); + width: 100%; +} +select[multiple]:hover { + border-color: var(--light); +} +select[multiple]:focus { + border-color: var(--dark); +} +select[multiple]:disabled { + background-color: var(--light); + cursor: not-allowed; +} +select[multiple]:disabled:hover { + border-color: var(--light); +} + +textarea { + display: block; + overflow: auto; + resize: vertical; + max-width: 100%; +} + +.top { + align-items: center; + display: flex; + height: var(--navbar-height); + position: relative; + padding: 0 var(--page-margin); + -webkit-transition: background 0.5s ease; + transition: background 0.5s ease; + width: 100%; + z-index: 2; +} +@media all and (min-width: 56.25em) { + .top { + justify-content: space-between; + height: var(--navbar-height); + } +} +.top.sticky { + background: var(--page-bg); + position: sticky; + top: -100px; + -webkit-animation: slideDown 0.5s cubic-bezier(0.17, 0.67, 0, 1) forwards; + animation: slideDown 0.5s cubic-bezier(0.17, 0.67, 0, 1) forwards; +} +@-webkit-keyframes slideDown { + from { + opacity: 0; + top: -100px; + } + to { + opacity: 1; + top: 0; + } +} +@keyframes slideDown { + from { + opacity: 0; + top: -100px; + } + to { + opacity: 1; + top: 0; + } +} + +.logo { + color: var(--logo-color) !important; + font-size: 1.2136296308rem; + font-family: var(--logo-font); + font-variation-settings: "wght" var(--font-weight-bold); + margin-right: auto; + order: 1; +} +.logo > img { + height: var(--navbar-height); + -o-object-fit: contain; + object-fit: contain; + padding: calc(var(--baseline) * 2) 0; + width: auto; +} + +.search { + order: 2; +} +@media all and (min-width: 56.25em) { + .search { + order: 3; + } +} +.search__btn { + border-color: var(--light); + margin: 0; + height: 2.2rem; + padding: 0; + width: 2.2rem; +} +@media all and (min-width: 56.25em) { + .search__btn { + margin-left: 2rem; + } +} +.search__btn:hover, .search__btn:focus { + border-color: var(--dark); +} +.search__form { + display: flex; + justify-content: space-between; + width: 100%; +} +.search__form button { + width: auto; + flex-shrink: 0; +} +.search__input { + background: none; + border: none; + border-bottom: 1px solid var(--dark); + display: block; + font-family: var(--heading-font); + padding: 0; + width: 90%; +} +.search__input:focus-visible { + outline: none !important; +} +.search__overlay { + background-color: var(--page-bg); + -webkit-box-shadow: 0 3px 30px rgba(0, 0, 0, 0.05); + box-shadow: 0 3px 30px rgba(0, 0, 0, 0.05); + left: 0; + opacity: 0; + position: fixed; + -webkit-transition: all 0.24s ease-out; + transition: all 0.24s ease-out; + top: 0; + visibility: hidden; + width: 100%; + z-index: 2005; +} +.search__overlay-inner { + -webkit-animation: slideininput 0.24s 1s forwards; + animation: slideininput 0.24s 1s forwards; + align-items: center; + display: flex; + height: calc(var(--navbar-height) * 3); + justify-content: space-between; + padding: 0 var(--page-margin); + opacity: 0; + scale: 0.9; +} +@-webkit-keyframes slideininput { + 60% { + opacity: 0; + scale: 0.9; + } + 100% { + opacity: 1; + scale: 1; + } +} +@keyframes slideininput { + 60% { + opacity: 0; + scale: 0.9; + } + 100% { + opacity: 1; + scale: 1; + } +} +.search__overlay.expanded { + -webkit-transform: translate(0, 0); + transform: translate(0, 0); + opacity: 1; + display: block; + visibility: visible; +} + +.navbar { + order: 3; +} +.navbar .navbar__menu { + display: flex; + flex-wrap: wrap; + list-style: none; + margin: 0; + padding: 0; +} +@media all and (max-width: 56.1875em) { + .navbar .navbar__menu { + display: none; + } +} +.navbar .navbar__menu li { + font-family: var(--menu-font); + display: block; + font-size: 0.8789062495rem; + line-height: var(--line-height); + font-variation-settings: "wght" 500; + padding: 0; + position: relative; + width: auto; +} +.navbar .navbar__menu li a, +.navbar .navbar__menu li span[aria-haspopup=true] { + color: var(--nav-link-color); + display: block; + padding: 0 0.6rem; + -webkit-transition: all 0.24s ease-out; + transition: all 0.24s ease-out; +} +.navbar .navbar__menu li a:active, .navbar .navbar__menu li a:focus, .navbar .navbar__menu li a:hover, +.navbar .navbar__menu li span[aria-haspopup=true]:active, +.navbar .navbar__menu li span[aria-haspopup=true]:focus, +.navbar .navbar__menu li span[aria-haspopup=true]:hover { + color: var(--nav-link-color-hover); +} +.navbar .navbar__menu li span { + color: var(--nav-link-color); + cursor: default; + display: block; + padding: 0 0.6rem; +} +.navbar .navbar__menu > li:hover > a, .navbar .navbar__menu > li:hover > span[aria-haspopup=true] { + color: var(--nav-link-color-hover); +} +.navbar .has-submenu:active > .navbar__submenu, +.navbar .has-submenu:focus > .navbar__submenu, +.navbar .has-submenu:hover > .navbar__submenu { + left: 0; + opacity: 1; + -webkit-transform: scale(1); + transform: scale(1); + visibility: visible; + margin-top: 0.8rem; +} +.navbar .has-submenu:active > .navbar__submenu:before, +.navbar .has-submenu:focus > .navbar__submenu:before, +.navbar .has-submenu:hover > .navbar__submenu:before { + content: ""; + height: 1rem; + left: 0; + position: absolute; + width: 100%; + top: -1rem; +} +.navbar .has-submenu:active > .navbar__submenu.is-right-submenu, +.navbar .has-submenu:focus > .navbar__submenu.is-right-submenu, +.navbar .has-submenu:hover > .navbar__submenu.is-right-submenu { + left: auto; + right: 0; + -webkit-transform-origin: right top; + transform-origin: right top; +} +.navbar .has-submenu .has-submenu:active > .navbar__submenu, +.navbar .has-submenu .has-submenu:focus > .navbar__submenu, +.navbar .has-submenu .has-submenu:hover > .navbar__submenu { + top: 0; + margin-top: 0; +} +.navbar .has-submenu .has-submenu:active > .navbar__submenu.is-right-submenu, +.navbar .has-submenu .has-submenu:focus > .navbar__submenu.is-right-submenu, +.navbar .has-submenu .has-submenu:hover > .navbar__submenu.is-right-submenu { + top: 0; + margin-top: 0; +} +.navbar .navbar__submenu { + background: var(--lighter); + border-radius: calc(var(--border-radius) * 4); + left: -9999px; + list-style-type: none; + margin: 0; + padding: 1rem 0.85rem; + position: absolute; + visibility: hidden; + white-space: nowrap; + z-index: 1; + opacity: 0; + -webkit-transform: scale(0.8); + transform: scale(0.8); + -webkit-transform-origin: 0 top; + transform-origin: 0 top; + -webkit-transition: opacity 0.15s, -webkit-transform 0.3s cubic-bezier(0.275, 1.375, 0.8, 1); + transition: opacity 0.15s, -webkit-transform 0.3s cubic-bezier(0.275, 1.375, 0.8, 1); + transition: opacity 0.15s, transform 0.3s cubic-bezier(0.275, 1.375, 0.8, 1); + transition: opacity 0.15s, transform 0.3s cubic-bezier(0.275, 1.375, 0.8, 1), -webkit-transform 0.3s cubic-bezier(0.275, 1.375, 0.8, 1); +} +.navbar .navbar__submenu__submenu { + z-index: 2; +} +.navbar .navbar__submenu li { + line-height: 1.5; + font-size: 0.8789062495rem; +} +.navbar .navbar__submenu li a, +.navbar .navbar__submenu li span[aria-haspopup=true] { + border-radius: calc(var(--border-radius) * 3); + color: var(--nav-link-color-hover); + padding: 0.5rem 1rem; + -webkit-transition: all 0.24s ease; + transition: all 0.24s ease; +} +.navbar .navbar__submenu li a:active, .navbar .navbar__submenu li a:focus, .navbar .navbar__submenu li a:hover, +.navbar .navbar__submenu li span[aria-haspopup=true]:active, +.navbar .navbar__submenu li span[aria-haspopup=true]:focus, +.navbar .navbar__submenu li span[aria-haspopup=true]:hover { + background: var(--page-bg); + color: var(--nav-link-color); +} +.navbar .navbar__submenu li span { + color: var(--nav-link-color-hover) !important; + padding: 0.5rem 1rem; +} +.navbar .navbar__submenu li:hover > a, .navbar .navbar__submenu li:hover > span[aria-haspopup=true] { + color: var(--nav-link-color); +} +.navbar .navbar__toggle { + background: var(--black); + -webkit-box-shadow: none; + box-shadow: none; + border: none; + cursor: pointer; + display: block; + line-height: 1; + margin: 0; + overflow: visible; + padding: 0; + position: relative; + right: 0; + margin-left: 0.75rem; + text-transform: none; + z-index: 2004; + height: 3.2rem; + padding: 0; + width: 3.2rem; +} +@media all and (min-width: 56.25em) { + .navbar .navbar__toggle { + display: none; + } +} +.navbar .navbar__toggle:hover, .navbar .navbar__toggle:focus { + -webkit-box-shadow: none; + box-shadow: none; + outline: none; + -webkit-transform: none; + transform: none; +} +.navbar .navbar__toggle-box { + width: 20px; + height: 14px; + display: inline-block; + position: relative; +} +.navbar .navbar__toggle-inner { + display: block; + top: 50%; + text-indent: -9999999em; +} +.navbar .navbar__toggle-inner::before { + content: ""; + display: block; + top: -5px; +} +.navbar .navbar__toggle-inner::after { + content: ""; + display: block; + bottom: -5px; +} +.navbar .navbar__toggle-inner, .navbar .navbar__toggle-inner::before, .navbar .navbar__toggle-inner::after { + width: 20px; + height: 1px; + background-color: var(--white); + position: absolute; + -webkit-transition: opacity 0.14s ease-out, -webkit-transform; + transition: opacity 0.14s ease-out, -webkit-transform; + transition: transform, opacity 0.14s ease-out; + transition: transform, opacity 0.14s ease-out, -webkit-transform; +} +.navbar .navbar__toggle-inner { + -webkit-transition-duration: 0.075s; + transition-duration: 0.075s; + -webkit-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); + transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); +} +.navbar .navbar__toggle-inner::before { + -webkit-transition: top 0.075s ease 0.12s, opacity 0.075s ease; + transition: top 0.075s ease 0.12s, opacity 0.075s ease; +} +.navbar .navbar__toggle-inner::after { + -webkit-transition: bottom 0.075s ease 0.12s, -webkit-transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19); + transition: bottom 0.075s ease 0.12s, -webkit-transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19); + transition: bottom 0.075s ease 0.12s, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19); + transition: bottom 0.075s ease 0.12s, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19); +} +.navbar .navbar__toggle.is-active .navbar__toggle-inner { + -webkit-transform: rotate(45deg); + transform: rotate(45deg); + -webkit-transition-delay: 0.12s; + transition-delay: 0.12s; + -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); + transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); +} +.navbar .navbar__toggle.is-active .navbar__toggle-inner::before { + top: 0; + opacity: 0; + -webkit-transition: top 0.075s ease, opacity 0.075s ease 0.12s; + transition: top 0.075s ease, opacity 0.075s ease 0.12s; +} +.navbar .navbar__toggle.is-active .navbar__toggle-inner::after { + bottom: 0; + -webkit-transform: rotate(-90deg); + transform: rotate(-90deg); + -webkit-transition: bottom 0.075s ease, -webkit-transform 0.075s cubic-bezier(0.215, 0.61, 0.355, 1) 0.12s; + transition: bottom 0.075s ease, -webkit-transform 0.075s cubic-bezier(0.215, 0.61, 0.355, 1) 0.12s; + transition: bottom 0.075s ease, transform 0.075s cubic-bezier(0.215, 0.61, 0.355, 1) 0.12s; + transition: bottom 0.075s ease, transform 0.075s cubic-bezier(0.215, 0.61, 0.355, 1) 0.12s, -webkit-transform 0.075s cubic-bezier(0.215, 0.61, 0.355, 1) 0.12s; +} + +.navbar_mobile_overlay { + background: var(--page-bg); + height: calc(100vh - 4.4rem); + left: 0; + opacity: 1; + overflow: auto; + pointer-events: auto; + position: fixed; + top: 4.4rem; + -webkit-transition: all 0.3s cubic-bezier(0, 0, 0.3, 1); + transition: all 0.3s cubic-bezier(0, 0, 0.3, 1); + width: 100%; + z-index: 1001; +} +.navbar_mobile_overlay.is-hidden { + opacity: 0; + pointer-events: none; +} +.navbar_mobile_overlay .navbar__menu { + margin: 24px; +} +.navbar_mobile_overlay .navbar__menu li { + list-style: none; + margin: 0; + padding: 0; + text-align: center; +} +.navbar_mobile_overlay .navbar__menu li a, +.navbar_mobile_overlay .navbar__menu li span { + color: var(--dark); + display: block; + padding: calc(var(--baseline) * 2); + position: relative; +} +.navbar_mobile_overlay .navbar__menu li a:active, .navbar_mobile_overlay .navbar__menu li a:focus, .navbar_mobile_overlay .navbar__menu li a:hover, +.navbar_mobile_overlay .navbar__menu li span:active, +.navbar_mobile_overlay .navbar__menu li span:focus, +.navbar_mobile_overlay .navbar__menu li span:hover { + color: var(--dark); +} +.navbar_mobile_overlay .navbar__menu li a[aria-haspopup=true]::after, +.navbar_mobile_overlay .navbar__menu li span[aria-haspopup=true]::after { + content: ""; + width: 0; + height: 0; + border-style: solid; + border-width: 5px 5px 0 5px; + border-color: currentColor transparent transparent transparent; + left: calc(var(--baseline) * 2); + top: 15px; + position: relative; +} +.navbar_mobile_overlay .navbar__submenu { + margin: 0; + padding: 0; + visibility: hidden; +} +.navbar_mobile_overlay .navbar__submenu[aria-hidden=false] { + visibility: visible; +} +.navbar_mobile_overlay .navbar__submenu_wrapper { + height: 0; + opacity: 0; + overflow: hidden; + -webkit-transition: all 0.3s cubic-bezier(0.275, 1.375, 0.8, 1); + transition: all 0.3s cubic-bezier(0.275, 1.375, 0.8, 1); +} +.navbar_mobile_overlay .navbar__submenu_wrapper.is-active { + height: auto; + opacity: 1; +} + +.navbar_mobile_sidebar { + background: var(--page-bg); + -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.25); + box-shadow: 0 0 5px rgba(0, 0, 0, 0.25); + height: 100vh; + left: 0; + max-width: 400px; + overflow: auto; + position: fixed; + top: 0; + -webkit-transition: all 0.3s cubic-bezier(0, 0, 0.3, 1); + transition: all 0.3s cubic-bezier(0, 0, 0.3, 1); + width: 80%; + z-index: 1001; +} +.navbar_mobile_sidebar.is-hidden { + left: -400px; +} +.navbar_mobile_sidebar .navbar__menu { + margin: 24px; +} +.navbar_mobile_sidebar .navbar__menu li { + font-family: var(--menu-font); + font-size: 16px; + list-style: none; + line-height: 1.3; + margin: 0; + padding: 0; +} +.navbar_mobile_sidebar .navbar__menu li a, +.navbar_mobile_sidebar .navbar__menu li .is-separator { + color: var(--dark); + display: block; + padding: 10px 20px 10px 0; + position: relative; +} +.navbar_mobile_sidebar .navbar__menu li a:active, .navbar_mobile_sidebar .navbar__menu li a:focus, .navbar_mobile_sidebar .navbar__menu li a:hover, +.navbar_mobile_sidebar .navbar__menu li .is-separator:active, +.navbar_mobile_sidebar .navbar__menu li .is-separator:focus, +.navbar_mobile_sidebar .navbar__menu li .is-separator:hover { + color: var(--dark); +} +.navbar_mobile_sidebar .navbar__menu li a[aria-haspopup=true]::after, +.navbar_mobile_sidebar .navbar__menu li .is-separator[aria-haspopup=true]::after { + content: ""; + width: 0; + height: 0; + border-style: solid; + border-width: 5px 5px 0 5px; + border-color: currentColor transparent transparent transparent; + right: 0; + top: 18px; + position: absolute; +} +.navbar_mobile_sidebar .navbar__submenu { + margin: 0 0 0 24px; + padding: 0; + visibility: hidden; +} +.navbar_mobile_sidebar .navbar__submenu[aria-hidden=false] { + visibility: visible; +} +.navbar_mobile_sidebar .navbar__submenu_wrapper { + height: 0; + opacity: 0; + overflow: hidden; + -webkit-transition: all 0.3s cubic-bezier(0.275, 1.375, 0.8, 1); + transition: all 0.3s cubic-bezier(0.275, 1.375, 0.8, 1); +} +.navbar_mobile_sidebar .navbar__submenu_wrapper.is-active { + height: auto; + opacity: 1; +} +.navbar_mobile_sidebar__overlay { + background: rgba(0, 0, 0, 0.5); + height: 100%; + opacity: 1; + pointer-events: auto; + position: fixed; + top: 0; + -webkit-transition: all 0.3s cubic-bezier(0, 0, 0.3, 1); + transition: all 0.3s cubic-bezier(0, 0, 0.3, 1); + width: 100%; + z-index: 10; +} +.navbar_mobile_sidebar__overlay.is-hidden { + opacity: 0; + pointer-events: none; +} + +.wrapper { + -webkit-box-sizing: content-box; + box-sizing: content-box; + max-width: var(--page-width); + margin-left: auto; + margin-right: auto; + padding-left: var(--page-margin); + padding-right: var(--page-margin); +} + +.entry-wrapper { + -webkit-box-sizing: content-box; + box-sizing: content-box; + max-width: var(--entry-width); + margin-left: auto; + margin-right: auto; + padding-left: var(--page-margin); + padding-right: var(--page-margin); +} + +.hero { + position: relative; + z-index: 1; +} +.hero--noimage::after { + background: var(--dark); + content: ""; + display: block; + height: 1px; + bottom: 0; + width: calc(100% - var(--page-margin) * 2); + z-index: -1; + max-width: var(--page-width); + position: absolute; + left: 50%; + -webkit-transform: translate(-50%, 0); + transform: translate(-50%, 0); +} +.hero__content { + padding-bottom: calc(var(--baseline) * 6 + 1.5vw); +} +.hero__content h1 > sup { + font-size: 1.066666667rem; + vertical-align: top; +} +.hero__content--centered { + text-align: center; +} +.hero__content--centered .content__meta { + justify-content: center; +} +.hero__cta { + margin-top: calc(var(--baseline) * 6); +} +.hero__image { + margin: 0 var(--page-margin); +} +.hero__image-wrapper { + position: relative; + background: var(--lighter); + border-radius: calc(var(--border-radius) * 4); +} +@media all and (min-width: 56.25em) { + .hero__image-wrapper { + height: var(--hero-height); + } +} +.hero__image-wrapper img { + border-radius: inherit; + display: block; + height: 100%; + -o-object-fit: cover; + object-fit: cover; + width: 100%; +} +@media all and (min-width: 56.25em) { + .hero__image-wrapper img { + height: var(--hero-height); + } +} +.hero__image > figcaption { + background: var(--page-bg); +} +@media all and (min-width: 56.25em) { + .hero__image > figcaption { + text-align: right; + } +} + +.feed__item { + display: flex; + flex-wrap: wrap; + gap: calc(2rem + 2vw); + margin-top: calc(var(--baseline) * 12 + 2vw); +} +@media all and (min-width: 37.5em) { + .feed__item { + flex-wrap: nowrap; + } +} +.feed__item--centered { + justify-content: center; +} +.feed__content { + max-width: var(--entry-width); +} +.feed__image { + background: var(--lighter); + border-radius: calc(var(--border-radius) * 4); + flex-shrink: 0; + height: 100%; + margin: 0; + width: 100%; +} +@media all and (min-width: 37.5em) { + .feed__image { + height: calc(var(--feed-image-size) + 4vw); + width: calc(var(--feed-image-size) + 4vw); + } +} +.feed__image > img { + border-radius: inherit; + display: inline-block; + height: 100%; + -o-object-fit: cover; + object-fit: cover; + width: 100%; +} +.feed__image--wide { + max-width: var(--page-width); +} +.feed__meta { + align-items: center; + color: var(--gray); + display: flex; + font-size: 0.8239746086rem; + gap: 0.8rem; + margin-bottom: calc(var(--baseline) * 3); +} +.feed__author { + font-family: var(--menu-font); + font-variation-settings: "wght" var(--font-weight-bold); + text-decoration: none; +} +.feed__author-thumb { + border-radius: 50%; + height: 1.7rem; + margin-right: -0.2rem; + width: 1.7rem; +} +.feed__date { + color: var(--gray); + font-style: italic; +} +.feed__author + .feed__date::before { + content: ""; + background: var(--light); + display: inline-block; + height: 1px; + margin-right: 4px; + width: 1rem; + vertical-align: middle; +} +.feed__readmore { + margin-top: calc(var(--baseline) * 4 + 0.25vw); +} +.feed__title { + margin-top: 0; +} +.feed--grid { + margin: 0; +} +@media all and (min-width: 37.5em) { + .feed--grid { + display: grid; + grid-template-columns: 100%; + gap: 0 3rem; + } +} +@media all and (min-width: 56.25em) { + .feed--grid { + grid-template-columns: repeat(2, 1fr); + } +} +.feed--grid h2 { + margin-top: 0; +} +.feed--grid sup { + font-size: 1.066666667rem; + vertical-align: top; +} +.feed--grid li { + align-items: center; + list-style: none; + gap: 2rem; + padding: 0; +} + +.content { + overflow: hidden; +} +.content__meta { + margin-top: calc(var(--baseline) * 4 + 0.25vw); + margin-bottom: 0; +} +.content__meta--centered { + justify-content: center; +} +.content__entry { + margin-top: calc(var(--baseline) * 6 + 1.5vw); + overflow-wrap: break-word; +} +.content__entry > :nth-child(1) { + margin-top: 0; +} +.content__entry a:not(.btn):not([type=button]):not([type=submit]):not(button):not(.post__toc a):not(.gallery__item a) { + color: var(--link-color-hover); + text-decoration: underline; + text-decoration-thickness: 1px; + text-underline-offset: 0.2em; + -webkit-text-decoration-skip: ink; + text-decoration-skip-ink: auto; +} +.content__entry a:not(.btn):not([type=button]):not([type=submit]):not(button):not(.post__toc a):not(.gallery__item a):hover, .content__entry a:not(.btn):not([type=button]):not([type=submit]):not(button):not(.post__toc a):not(.gallery__item a):active, .content__entry a:not(.btn):not([type=button]):not([type=submit]):not(button):not(.post__toc a):not(.gallery__item a):focus { + color: var(--link-color); +} +.content__entry--nospace { + margin-top: 0; +} +.content__avatar-thumbs { + border-radius: 50%; + height: 4.5rem; + width: 4.5rem; +} +.content__footer { + margin-top: calc(var(--baseline) * 9 + 1vw); +} +.content__updated { + color: var(--gray); + font-size: 0.8789062495rem; + font-style: italic; +} +.content__actions { + align-items: baseline; + display: flex; + flex-basis: auto; + gap: 2rem; + justify-content: space-between; + margin-top: calc(var(--baseline) * 4 + 0.25vw); + position: relative; +} +.content__share { + flex-shrink: 0; +} +.content__share-button { + border-color: var(--light); +} +.content__share-popup { + background: var(--lighter); + border-radius: calc(var(--border-radius) * 4); + bottom: 140%; + display: none; + padding: 1rem 0.85rem; + position: absolute; + right: 0; + text-align: left; + z-index: 1; +} +.content__share-popup.is-visible { + -webkit-animation: share-popup 0.48s cubic-bezier(0.17, 0.67, 0.6, 1.34) backwards; + animation: share-popup 0.48s cubic-bezier(0.17, 0.67, 0.6, 1.34) backwards; + display: block; +} +@-webkit-keyframes share-popup { + from { + -webkit-transform: scale(0.9); + transform: scale(0.9); + } + to { + -webkit-transform: scale(1); + transform: scale(1); + } +} +@keyframes share-popup { + from { + -webkit-transform: scale(0.9); + transform: scale(0.9); + } + to { + -webkit-transform: scale(1); + transform: scale(1); + } +} +.content__share-popup > a { + border-radius: calc(var(--border-radius) * 3); + color: var(--text-color); + display: block; + font-family: var(--menu-font); + font-size: 0.8239746086rem; + padding: 0.4rem 0.8rem; +} +.content__share-popup > a:hover { + background: var(--page-bg); + color: var(--text-color); + text-decoration: none; +} +.content__share-popup > a > svg { + fill: var(--text-color); + display: inline-block; + height: 0.9rem; + margin-right: 0.5666666667rem; + pointer-events: none; + vertical-align: middle; + width: 0.9rem; +} +.content__tag { + margin: 0; + font-family: var(--menu-font); + font-size: 0.8239746086rem; +} +.content__tag > li { + display: inline-flex; + margin: 0.3rem 0.3rem 0.3rem 0; + padding: 0; +} +.content__tag > li > a { + border: 1px solid var(--light); + border-radius: calc(var(--border-radius) * 10); + color: var(--dark); + font-size: 0.7241964329rem; + font-variation-settings: "wght" var(--font-weight-normal); + padding: calc(var(--baseline) * 1) calc(var(--baseline) * 2.5); +} +.content__tag > li > a:hover { + border-color: var(--dark); +} +.content__bio { + display: flex; + margin: calc(var(--baseline) * 12 + 1vw) 0; +} +@media all and (min-width: 37.5em) { + .content__bio { + align-items: center; + } +} +@media all and (min-width: 37.5em) { + .content__bio::before { + content: ""; + border-top: 1px solid var(--light); + height: 1px; + margin-right: 2rem; + width: 30%; + } +} +.bio__avatar { + border-radius: 50%; + flex-shrink: 0; + height: 2.5rem; + margin-right: 1.2rem; + width: 2.5rem; +} +@media all and (min-width: 37.5em) { + .bio__avatar { + height: 4rem; + margin-right: 2rem; + width: 4rem; + } +} +.bio__name { + margin: 0; +} +.bio__desc { + font-family: var(--body-font); + font-size: 0.8789062495rem; + line-height: 1.5; +} +.bio__desc > :nth-child(1) { + margin-top: calc(var(--baseline) * 2); +} +.bio__desc a { + text-decoration: underline; + text-decoration-thickness: 1px; + text-underline-offset: 0.2em; + -webkit-text-decoration-skip: ink; + text-decoration-skip-ink: auto; +} +.bio__desc a { + color: var(--link-color-hover); + -webkit-transition: all 0.24s ease-out; + transition: all 0.24s ease-out; +} +.bio__desc a:hover { + color: var(--link-color); +} +.bio__desc a:active { + color: var(--link-color); +} +.bio__desc a:focus { + outline: none; +} + +.content__nav { + margin-top: calc(var(--baseline) * 16 + 1vw); +} +.content__nav-inner { + border-top: 1px solid var(--dark); + border-bottom: 1px solid var(--dark); + padding: calc(var(--baseline) * 16) 0; +} +@media all and (min-width: 37.5em) { + .content__nav-inner { + display: flex; + gap: 1rem; + justify-content: space-between; + } +} +@media all and (min-width: 56.25em) { + .content__nav-inner { + gap: 2rem; + } +} +@media all and (max-width: 37.4375em) { + .content__nav-prev + .content__nav-next { + margin-top: calc(var(--baseline) * 6 + 1vw); + } +} +@media all and (min-width: 37.5em) { + .content__nav-next { + margin-left: auto; + text-align: right; + } +} +.content__nav-link { + font-family: var(--heading-font); + font-variation-settings: "wght" var(--font-weight-bold); + font-style: italic; + height: 100%; + line-height: 1.5; + display: flex; + gap: 1rem; + justify-content: space-between; + align-items: center; +} +@media all and (min-width: 37.5em) { + .content__nav-link { + gap: 2rem; + } +} +.content__nav-link > div { + overflow: hidden; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-line-clamp: 3; + -webkit-box-orient: vertical; +} +@media all and (min-width: 56.25em) { + .content__nav-link > div { + -webkit-line-clamp: 4; + } +} +.content__nav-link span { + color: var(--gray); + display: block; + font-size: 0.7724761953rem; + font-family: var(--menu-font); + font-style: normal; + font-variation-settings: "wght" var(--font-weight-normal); + margin-bottom: var(--baseline); +} +.content__nav-image { + flex: 1 0 4rem; + margin: 0; + height: 4rem; +} +@media all and (min-width: 37.5em) and (max-width: 56.1875em) { + .content__nav-image { + flex-basis: 6rem; + height: 6rem; + } +} +@media all and (min-width: 56.25em) { + .content__nav-image { + flex-basis: 8rem; + height: 8rem; + } +} +.content__nav-image > img { + border-radius: calc(var(--border-radius) * 4); + display: block; + height: 100%; + -o-object-fit: cover; + object-fit: cover; + width: 100%; +} +.content__related { + background: var(--lighter); + margin-top: calc(var(--baseline) * 16 + 1vw); + padding: calc(var(--baseline) * 12 + 3vw) 0; +} +.related__title { + margin-top: 0; +} + +.content__comments { + margin-top: calc(var(--baseline) * 9); + overflow: hidden; +} + +.post__image:not(.post__image--wide):not(.post__image--full) { + display: inline-block; + margin-bottom: calc(var(--baseline) * 2 + 0.25vw); +} +.post__image a, +.post__image img { + border-radius: calc(var(--border-radius) * 4); + display: inline-block; +} +.post__image > figcaption { + background-color: var(--page-bg); +} +.post__image--left { + float: left; + margin-right: 2rem; + max-width: 50%; +} +.post__image--right { + float: right; + margin-left: 2rem; + max-width: 50%; +} +.post__image--center { + display: block; + margin-left: auto; + margin-right: auto; + text-align: center; +} +.post__image--wide { + display: block; +} +@media all and (min-width: 56.25em) { + .post__image--wide { + margin-left: calc(-50vw + 50%); + margin-right: calc(-50vw + 50%); + padding: 0 var(--page-margin); + text-align: center; + } + .post__image--wide a, + .post__image--wide img { + display: block; + height: auto; + margin: auto; + max-width: var(--page-width); + width: 100%; + } +} +.post__image--full { + background-color: var(--lighter); + display: block; + margin-left: calc(-50vw + 50%); + margin-right: calc(-50vw + 50%); + text-align: center; +} +.post__image--full a, +.post__image--full img { + border-radius: 0; + display: block; + height: auto; + width: 100%; +} +.post__video, .post__iframe { + display: block; + margin-top: calc(var(--baseline) * 6 + 0.5vw); + margin-bottom: calc(var(--baseline) * 6 + 0.5vw); + overflow: hidden; + padding: 0; + position: relative; + width: 100%; +} +.post__video::before, .post__iframe::before { + display: block; + content: ""; + padding-top: var(--embed-aspect-ratio); +} +.post__video iframe[height*="%"][width*="%"], +.post__video video[height*="%"][width*="%"], +.post__video iframe[height]:not([height*="%"])[width]:not([width*="%"]), +.post__video video[height]:not([height*="%"])[width]:not([width*="%"]), .post__iframe iframe[height*="%"][width*="%"], +.post__iframe video[height*="%"][width*="%"], +.post__iframe iframe[height]:not([height*="%"])[width]:not([width*="%"]), +.post__iframe video[height]:not([height*="%"])[width]:not([width*="%"]) { + border: none; + height: 100%; + left: 0; + position: absolute; + top: 0; + bottom: 0; + width: 100%; +} +.post__video:has(iframe:not([height]))::before, .post__video:has(iframe:not([width]))::before, .post__video:has(video:not([height]))::before, .post__video:has(video:not([width]))::before, .post__iframe:has(iframe:not([height]))::before, .post__iframe:has(iframe:not([width]))::before, .post__iframe:has(video:not([height]))::before, .post__iframe:has(video:not([width]))::before { + display: none; +} +.post__toc { + margin-top: calc(var(--baseline) * 6 + 0.5vw); +} +.post__toc h3 { + border-bottom: 1px solid var(--dark); + font-size: 1rem; + margin: 0; + padding-bottom: calc(var(--baseline) * 2 + 0.25vw); +} +.post__toc ul { + counter-reset: item; + list-style: decimal; + margin: calc(var(--baseline) * 3 + 0.25vw) 0 0 3ch; +} +.post__toc ul li { + counter-increment: item; + padding: 0; +} +.post__toc ul ul { + margin-top: 0; +} +.post__toc ul ul li { + display: block; +} +.post__toc ul ul li:before { + content: counters(item, ".") ". "; + margin-left: -3ch; +} + +.banner { + text-align: center; +} +.banner--after-content { + margin-top: calc(var(--baseline) * 9 + 1vw); +} + +.page__desc a { + text-decoration: underline; + text-decoration-thickness: 1px; + text-underline-offset: 0.2em; + -webkit-text-decoration-skip: ink; + text-decoration-skip-ink: auto; +} +@media all and (min-width: 37.5em) { + .page--author__wrapper { + display: flex; + gap: 2rem; + } +} +@media all and (min-width: 56.25em) { + .page--author__wrapper { + gap: 3rem; + } +} +.page--author__avatar { + border-radius: 50%; + height: calc(var(--baseline) * 10 + 2vw); + margin-top: calc(var(--baseline) * 6 + 1vw); + width: calc(var(--baseline) * 10 + 2vw); +} +.page--author__website { + margin-top: calc(var(--baseline) * 4 + 0.25vw); +} +.page--search form { + align-items: flex-start; + display: flex; + flex-wrap: wrap; +} +@media all and (max-width: 37.4375em) { + .page--search input { + margin-bottom: calc(var(--baseline) * 2); + } +} +@media all and (min-width: 20em) { + .page--search input { + flex: 1 0 auto; + margin-right: calc(var(--baseline) * 2); + } +} +@media all and (max-width: 37.4375em) { + .page--search button { + width: 100%; + } +} + +.subpages__title { + border-top: 1px solid var(--light); + padding-top: calc(var(--baseline) * 6 + 0.5vw); +} +.subpages__list { + list-style: initial; + margin-left: 2ch; +} +.subpages__list ul { + list-style: initial; + margin: 0 0 0 2ch; +} +.subpages__list li { + padding-bottom: 0; +} + +.readmore { + display: inline-block; + color: var(--gray); + font-size: 0.9374999997rem; + font-style: italic; + text-decoration: underline; + -webkit-text-decoration-skip: ink; + text-decoration-skip-ink: auto; +} + +.align-left { + text-align: left; +} + +.align-right { + text-align: right; +} + +.align-center { + text-align: center; +} + +.align-justify { + text-align: justify; +} + +.msg { + background-color: var(--lighter); + border-left: 3px solid var(--light); + font-size: 0.9374999997rem; + padding: calc(var(--baseline) * 4) calc(var(--baseline) * 6); + position: relative; +} +.msg--highlight { + border-left-color: var(--highlight-color); +} +.msg--info { + border-left-color: var(--info-color); +} +.msg--success { + border-left-color: var(--success-color); +} +.msg--warning { + border-left-color: var(--warning-color); +} + +.ordered-list { + counter-reset: listCounter; +} +.ordered-list li { + counter-increment: listCounter; + list-style: none; + padding-left: 0.3rem; + position: relative; +} +.ordered-list li::before { + color: var(--color); + content: counter(listCounter, decimal-leading-zero) "."; + font-variation-settings: "wght" var(--font-weight-bold); + left: -2rem; + position: absolute; +} + +.dropcap:first-letter { + color: var(--headings-color); + float: left; + font-size: 3.6355864383rem; + line-height: 0.7; + margin-right: 0.6rem; + padding: calc(var(--baseline) * 2) calc(var(--baseline) * 2) calc(var(--baseline) * 2) 0; +} + +.pec-wrapper { + height: 100%; + left: 0; + position: absolute; + top: 0; + width: 100%; +} +.pec-overlay { + align-items: center; + background-color: var(--lighter); + font-size: 14px; + display: none; + height: inherit; + justify-content: center; + line-height: 1.4; + padding: 1rem; + position: relative; + text-align: center; +} +@media all and (min-width: 37.5em) { + .pec-overlay { + font-size: 16px; + line-height: var(--line-height); + padding: 1rem 2rem; + } +} +.pec-overlay.is-active { + display: flex; +} +.pec-overlay-inner p { + margin: 0 0 1rem; +} + +.pagination { + display: flex; + gap: calc(var(--baseline) * 2); + justify-content: center; + margin-top: calc(var(--baseline) * 12 + 1vw); +} +@media all and (min-width: 56.25em) { + .pagination { + margin-top: calc(var(--baseline) * 18 + 1vw); + } +} + +/* Footer ------------------------ */ +.footer { + border-top: 1px solid var(--light); + font-size: 0.9374999997rem; + padding: calc(var(--baseline) * 9 + 1vw) 0 calc(var(--baseline) * 6 + 1vw); + margin: calc(var(--baseline) * 12 + 1vw) auto 0; + max-width: var(--page-width); + text-align: center; +} +.footer--glued { + border: none; + padding-top: 0; +} +.footer__nav ul { + list-style: none; + margin: 0; +} +.footer__nav ul li { + display: inline-block; + padding: var(--baseline) 0.5rem; +} +* + .footer__social { + margin-top: calc(var(--baseline) * 6 + 0.5vw); +} +.footer__social svg { + fill: var(--dark); + height: 1rem; + margin: 0 0.5rem; + -webkit-transition: all 0.12s linear 0s; + transition: all 0.12s linear 0s; + width: 1rem; +} +.footer__social svg:hover { + fill: var(--gray); +} +.footer__copyright { + font-size: 0.8239746086rem; + margin-top: var(--baseline); +} +.footer__copyright > *:first-child { + margin: 0; +} +.footer__bttop { + background: var(--page-bg); + bottom: calc(var(--baseline) * 5); + border-radius: 50%; + border-color: var(--light); + line-height: 1; + opacity: 0; + padding: calc(var(--baseline) * 2); + position: fixed; + right: 2rem; + text-align: center; + width: auto !important; + visibility: hidden; + z-index: 999; +} +@media all and (min-width: 56.25em) { + .footer__bttop { + bottom: calc(var(--baseline) * 10); + } +} +.footer__bttop:hover { + border-color: var(--dark); + opacity: 1; +} +.footer__bttop.is-visible { + visibility: visible; + opacity: 1; +} + +.gallery { + margin: calc(var(--baseline) * 6 + 1vw) calc(var(--gallery-gap) * -1); +} +@media all and (min-width: 20em) { + .gallery { + display: flex; + flex-wrap: wrap; + } +} +@media all and (min-width: 56.25em) { + .gallery-wrapper--wide { + display: flex; + justify-content: center; + margin-left: calc(-50vw + 50%); + margin-right: calc(-50vw + 50%); + padding: 0 var(--page-margin); + } + .gallery-wrapper--wide .gallery { + max-width: var(--page-width); + } +} +@media all and (min-width: 56.25em) { + .gallery-wrapper--full { + margin-left: calc(-50vw + 50%); + margin-right: calc(-50vw + 50%); + padding: 0 var(--page-margin); + } +} +@media all and (min-width: 20em) { + .gallery[data-columns="1"] .gallery__item { + flex: 1 0 100%; + } +} +@media all and (min-width: 30em) { + .gallery[data-columns="2"] .gallery__item { + flex: 1 0 50%; + } +} +@media all and (min-width: 37.5em) { + .gallery[data-columns="3"] .gallery__item { + flex: 1 0 33.333%; + } +} +@media all and (min-width: 56.25em) { + .gallery[data-columns="4"] .gallery__item { + flex: 0 1 25%; + } +} +@media all and (min-width: 56.25em) { + .gallery[data-columns="5"] .gallery__item { + flex: 0 1 20%; + } +} +@media all and (min-width: 56.25em) { + .gallery[data-columns="6"] .gallery__item { + flex: 0 1 16.666%; + } +} +@media all and (min-width: 56.25em) { + .gallery[data-columns="7"] .gallery__item { + flex: 1 0 14.285%; + } +} +@media all and (min-width: 56.25em) { + .gallery[data-columns="8"] .gallery__item { + flex: 1 0 12.5%; + } +} +.gallery__item { + margin: 0; + padding: var(--gallery-gap); + position: relative; +} +@media all and (min-width: 20em) { + .gallery__item { + flex: 1 0 50%; + } +} +@media all and (min-width: 30em) { + .gallery__item { + flex: 1 0 33.333%; + } +} +@media all and (min-width: 37.5em) { + .gallery__item { + flex: 1 0 25%; + } +} +.gallery__item a { + border-radius: calc(var(--border-radius) * 4); + display: block; + height: 100%; + width: 100%; +} +.gallery__item a::after { + background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.4)), to(rgba(0, 0, 0, 0))); + background: linear-gradient(to top, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%); + border-radius: inherit; + bottom: var(--gallery-gap); + content: ""; + display: block; + opacity: 0; + left: var(--gallery-gap); + height: calc(100% - var(--gallery-gap) * 2); + position: absolute; + right: var(--gallery-gap); + top: var(--gallery-gap); + -webkit-transition: all 0.24s ease-out; + transition: all 0.24s ease-out; + width: calc(100% - var(--gallery-gap) * 2); +} +.gallery__item a:hover::after { + opacity: 1; +} +.gallery__item img { + border-radius: inherit; + display: block; + height: 100%; + -o-object-fit: cover; + object-fit: cover; + width: 100%; +} +.gallery__item figcaption { + bottom: 1.2rem; + color: var(--white); + left: 50%; + opacity: 0; + position: absolute; + text-align: center; + -webkit-transform: translate(-50%, 1.2rem); + transform: translate(-50%, 1.2rem); + -webkit-transition: all 0.24s ease-out; + transition: all 0.24s ease-out; +} +.gallery__item:hover figcaption { + opacity: 1; + -webkit-transform: translate(-50%, 0); + transform: translate(-50%, 0); +} \ No newline at end of file diff --git a/assets/css/style.css b/assets/css/style.css new file mode 100755 index 0000000..738cafe --- /dev/null +++ b/assets/css/style.css @@ -0,0 +1 @@ +:root{--page-margin:6vw;--page-width:66rem;--entry-width:42rem;--navbar-height:4.4rem;--border-radius:3px;--baseline:0.28333rem;--gallery-gap:calc(var(--baseline) * 1.5);--body-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";--heading-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";--logo-font:var(--body-font);--menu-font:var(--body-font);--font-size:clamp(1rem, 1rem + (0.19999999999999996 * ((100vw - 20rem) / 70)), 1.2rem);--font-weight-normal:399;--font-weight-bold:499;--line-height:1.5;--letter-spacing:0em;--headings-weight:500;--headings-transform:none;--headings-style:normal;--headings-letter-spacing:0em;--headings-line-height:1.2;--hero-height:30vh;--feed-image-size:8rem;--white:#FFFFFF;--black:#17181E;--helper:#FFFFFF;--dark:#17181E;--gray:#57585a;--light:#CACBCF;--lighter:#F3F3F3;--page-bg:#FFFFFF;--color:#C9C9C9;--text-color:#17181E;--headings-color:#17181E;--link-color:#17181E;--link-color-hover:#C9C9C9;--nav-link-color:#17181E;--nav-link-color-hover:#17181E;--logo-color:#17181E;--highlight-color:#FFC700;--info-color:#67B1F3;--success-color:#00A563;--warning-color:#EE4E4E}@media all and (min-width:56.25em){:root{--navbar-height:6rem}}*,:after,:before{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0}article,aside,footer,header,hgroup,main,nav,section{display:block}li{list-style:none}img{height:auto;max-width:100%;vertical-align:top}button,input,select,textarea{font:inherit}address{font-style:normal}::-moz-selection{background:var(--color);color:var(--white)}::selection{background:var(--color);color:var(--white)}:focus-visible{outline:2px solid var(--color)!important;outline-offset:2px}html{font-size:var(--font-size);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth}html.no-scroll{overflow:hidden;position:fixed}body{background:var(--page-bg);color:var(--text-color);font-family:var(--body-font);font-variation-settings:"wght" var(--font-weight-normal);letter-spacing:var(--letter-spacing);line-height:var(--line-height);-ms-scroll-chaining:none;overscroll-behavior:none}a{text-decoration:none}a{color:var(--link-color);-webkit-transition:all .24s ease-out;transition:all .24s ease-out}a:hover{color:var(--link-color-hover)}a:active{color:var(--link-color-hover)}a:focus{outline:0}.invert{color:var(--link-color-hover);-webkit-transition:all .24s ease-out;transition:all .24s ease-out}.invert:hover{color:var(--link-color)}.invert:active{color:var(--link-color)}.invert:focus{outline:0}dl,ol,p,ul{margin-top:calc(var(--baseline) * 4 + .25vw)}blockquote,figure,hr,pre,table{margin-top:calc(var(--baseline) * 6 + .5vw);margin-bottom:calc(var(--baseline) * 6 + .5vw)}h1,h2,h3,h4,h5,h6{color:var(--headings-color);font-family:var(--heading-font);font-variation-settings:"wght" var(--headings-weight);font-style:var(--headings-style);-ms-hyphens:manual;hyphens:manual;letter-spacing:var(--headings-letter-spacing);line-height:var(--headings-line-height);margin-top:calc(var(--baseline) * 6 + 1vw);text-transform:var(--headings-transform)}.h1,h1{font-size:clamp(1.5710900065rem, 1.5710900065rem + 1.424540906 * (100vw - 20rem) / 70, 2.9956309125rem);font-family:var(--heading-font)}.h2,h2{font-size:clamp(1.3808408252rem, 1.3808408252rem + .9332127447 * (100vw - 20rem) / 70, 2.3140535699rem)}.h3,h3{font-size:clamp(1.2136296308rem, 1.2136296308rem + .4621997101 * (100vw - 20rem) / 70, 1.6758293408rem)}.h4,h4{font-size:clamp(1.1377777785rem, 1.1377777785rem + .1567604947 * (100vw - 20rem) / 70, 1.2945382732rem)}.h5,h5{font-size:clamp(1.066666667rem, 1.066666667rem + .0711111115 * (100vw - 20rem) / 70, 1.1377777785rem)}.h6,h6{font-size:clamp(1rem, 1rem + 0 * (100vw - 20rem) / 70, 1rem)}h2+*,h3+*,h4+*,h5+*,h6+*{margin-top:calc(var(--baseline) * 2 + .25vw)}b,strong{font-variation-settings:"wght" var(--font-weight-bold)}blockquote{border-top:2px solid var(--dark);border-bottom:2px solid var(--dark);color:var(--headings-color);font-family:var(--heading-font);font-style:italic;font-variation-settings:"wght" var(--font-weight-bold);padding:calc(var(--baseline) * 6 + 1vw) 2rem;font-size:clamp(1.1377777785rem, 1.1377777785rem + .1567604947 * (100vw - 20rem) / 70, 1.2945382732rem)}blockquote>:first-child{margin-top:0}ol,ul{margin-left:3ch}ol>li,ul>li{list-style:inherit;padding:0 0 var(--baseline) 1ch}dl dt{font-variation-settings:"wght" var(--font-weight-bold)}pre{background-color:var(--lighter);font-size:.8239746086rem;padding:calc(var(--baseline) * 6);white-space:pre-wrap;word-wrap:break-word}pre>code{color:var(--text-color);display:inline-block;font-size:inherit;padding:0}code{background-color:var(--lighter);color:var(--color);font-size:.8239746086rem;font-family:Menlo,Monaco,Consolas,Courier New,monospace}table{border:1px solid var(--light);border-collapse:collapse;border-spacing:0;vertical-align:top;text-align:left;width:100%}@media all and (max-width:37.4375em){table{display:block;overflow-x:auto}}table th{font-variation-settings:"wght" var(--font-weight-bold);padding:calc(var(--baseline) * 2.5) calc(var(--baseline) * 4)}table td{border-top:1px solid var(--light);padding:calc(var(--baseline) * 2.5) calc(var(--baseline) * 4)}.table-striped tr:nth-child(2n){background:var(--lighter)}.table-bordered td,.table-bordered th{border:1px solid var(--light)}.table-title th{background:var(--lighter)}figcaption{clear:both;color:var(--gray);font-style:italic;font-size:.7241964329rem;padding:calc(var(--baseline) * 3) 0 0;text-align:center}kbd{background:var(--dark);border-radius:2px;color:var(--white);font-family:Menlo,Monaco,Consolas,Courier New,monospace;font-size:.8789062495rem;padding:calc(var(--baseline) * .5) calc(var(--baseline) * 1.5)}sub,sup{font-size:65%}small{font-size:.8789062495rem}.separator,hr{background:0 0;border:none;height:auto;line-height:1;max-width:none;text-align:center}.separator::before,hr::before{content:"•••";color:var(--dark);font-size:1rem;font-variation-settings:"wght" var(--font-weight-bold);letter-spacing:1.1377777785rem;padding-left:1.1377777785rem}.separator--dot::before{content:"•";color:var(--dark);font-size:1rem;font-variation-settings:"wght" var(--font-weight-bold);letter-spacing:1.1377777785rem;padding-left:1.1377777785rem}.separator--long-line{position:relative}.separator--long-line::before{content:"";height:1rem}.separator--long-line::after{border-top:1px solid var(--light);content:"";height:1px;position:absolute;width:100%;top:50%;left:0}.btn,[type=button],[type=submit],button{align-items:center;background:0 0;border:1px solid var(--dark);border-radius:calc(var(--border-radius) * 10);color:var(--dark);cursor:pointer;display:inline-flex;font-family:var(--menu-font);font-size:.8239746086rem;font-variation-settings:"wght" var(--font-weight-bold);overflow:hidden;padding:calc(var(--baseline) * 2) calc(var(--baseline) * 4);text-align:center;-webkit-transition:all .24s ease-out;transition:all .24s ease-out;vertical-align:middle;will-change:transform}@media all and (max-width:19.9375em){.btn,[type=button],[type=submit],button{width:100%}}.btn:active,.btn:focus,.btn:hover,[type=button]:active,[type=button]:focus,[type=button]:hover,[type=submit]:active,[type=submit]:focus,[type=submit]:hover,button:active,button:focus,button:hover{background-color:var(--dark);color:var(--helper)}.btn--icon{gap:.3rem;justify-content:center}.btn--icon svg{stroke:currentColor}@media all and (min-width:20em){.btn+.btn,.btn+[type=button],.btn+[type=submit],.btn+button,[type=button]+.btn,[type=button]+[type=button],[type=button]+[type=submit],[type=button]+button,[type=submit]+.btn,[type=submit]+[type=button],[type=submit]+[type=submit],[type=submit]+button,button+.btn,button+[type=button],button+[type=submit],button+button{margin-left:calc(var(--baseline) * 2)}}@media all and (max-width:37.4375em){.btn+.btn,.btn+[type=button],.btn+[type=submit],.btn+button,[type=button]+.btn,[type=button]+[type=button],[type=button]+[type=submit],[type=button]+button,[type=submit]+.btn,[type=submit]+[type=button],[type=submit]+[type=submit],[type=submit]+button,button+.btn,button+[type=button],button+[type=submit],button+button{margin-bottom:calc(var(--baseline) * 2)}}.btn:disabled,.btn[disabled],[disabled][type=button],[disabled][type=submit],[type=button]:disabled,[type=submit]:disabled,button:disabled,button[disabled]{background-color:var(--light);border-color:var(--light);color:var(--gray);cursor:not-allowed;pointer-events:none}[type=button],[type=submit],button{-webkit-appearance:none;-moz-appearance:none}::-webkit-search-cancel-button{-webkit-appearance:none}fieldset{border:1px solid var(--light);margin:calc(var(--baseline) * 6 + 1vw) 0 0;padding:calc(var(--baseline) * 6)}fieldset>legend{margin-left:-1rem;padding:0 1rem}legend{font-variation-settings:"wght" 500;padding:0}label{font-variation-settings:"wght" 500;margin:0 calc(var(--baseline) * 4) calc(var(--baseline) * 3) 0}[type=email],[type=number],[type=search],[type=tel],[type=text],[type=url],select,textarea{background-color:var(--page-bg);border:none;border:1px solid var(--light);color:var(--text-color);font-size:1rem;outline:0;padding:calc(var(--baseline) * 1.2) calc(var(--baseline) * 3);vertical-align:middle;width:100%;-webkit-appearance:none;-moz-appearance:none}@media all and (min-width:37.5em){[type=email],[type=number],[type=search],[type=tel],[type=text],[type=url],select,textarea{width:auto}}[type=email]:focus,[type=number]:focus,[type=search]:focus,[type=tel]:focus,[type=text]:focus,[type=url]:focus,select:focus,textarea:focus{border-color:var(--dark)}input[type=checkbox],input[type=radio]{opacity:0;position:absolute}input[type=checkbox]+label,input[type=radio]+label{position:relative;margin-left:-1px;cursor:pointer;padding:0}input[type=checkbox]+label:before,input[type=radio]+label:before{background-color:var(--white);border:1px solid var(--light);border-radius:2px;content:"";display:inline-block;height:calc(var(--baseline) * 5);line-height:calc(var(--baseline) * 5);margin-right:calc(var(--baseline) * 4);vertical-align:middle;text-align:center;width:calc(var(--baseline) * 5)}input[type=checkbox]:checked+label:before,input[type=radio]:checked+label:before{content:"";background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 8'%3e%3cpolygon points='9.53 0 4.4 5.09 1.47 2.18 0 3.64 2.93 6.54 4.4 8 5.87 6.54 11 1.46 9.53 0' fill='%23d73a42'/%3e%3c/svg%3e");background-repeat:no-repeat;background-size:11px 8px;background-position:50% 50%}input[type=radio]+label:before{border-radius:50%}input[type=radio]:checked+label:before{background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3ccircle cx='4' cy='4' r='4' fill='%23d73a42'/%3e%3c/svg%3e")}[type=file]{margin-bottom:calc(var(--baseline) * 6);width:100%}select{max-width:100%;width:auto;position:relative}select:not([multiple]){background:url('data:image/svg+xml;utf8,') no-repeat 90% 50%;background-size:8px;padding-right:calc(var(--baseline) * 12)}select[multiple]{border:1px solid var(--light);padding:calc(var(--baseline) * 6);width:100%}select[multiple]:hover{border-color:var(--light)}select[multiple]:focus{border-color:var(--dark)}select[multiple]:disabled{background-color:var(--light);cursor:not-allowed}select[multiple]:disabled:hover{border-color:var(--light)}textarea{display:block;overflow:auto;resize:vertical;max-width:100%}.top{align-items:center;display:flex;height:var(--navbar-height);position:relative;padding:0 var(--page-margin);-webkit-transition:background .5s ease;transition:background .5s ease;width:100%;z-index:2}@media all and (min-width:56.25em){.top{justify-content:space-between;height:var(--navbar-height)}}.top.sticky{background:var(--page-bg);position:sticky;top:-100px;-webkit-animation:slideDown .5s cubic-bezier(.17,.67,0,1) forwards;animation:slideDown .5s cubic-bezier(.17,.67,0,1) forwards}@-webkit-keyframes slideDown{from{opacity:0;top:-100px}to{opacity:1;top:0}}@keyframes slideDown{from{opacity:0;top:-100px}to{opacity:1;top:0}}.logo{color:var(--logo-color)!important;font-size:1.2136296308rem;font-family:var(--logo-font);font-variation-settings:"wght" var(--font-weight-bold);margin-right:auto;order:1}.logo>img{height:var(--navbar-height);-o-object-fit:contain;object-fit:contain;padding:calc(var(--baseline) * 2) 0;width:auto}.search{order:2}@media all and (min-width:56.25em){.search{order:3}}.search__btn{border-color:var(--light);margin:0;height:2.2rem;padding:0;width:2.2rem}@media all and (min-width:56.25em){.search__btn{margin-left:2rem}}.search__btn:focus,.search__btn:hover{border-color:var(--dark)}.search__form{display:flex;justify-content:space-between;width:100%}.search__form button{width:auto;flex-shrink:0}.search__input{background:0 0;border:none;border-bottom:1px solid var(--dark);display:block;font-family:var(--heading-font);padding:0;width:90%}.search__input:focus-visible{outline:0!important}.search__overlay{background-color:var(--page-bg);-webkit-box-shadow:0 3px 30px rgba(0,0,0,.05);box-shadow:0 3px 30px rgba(0,0,0,.05);left:0;opacity:0;position:fixed;-webkit-transition:all .24s ease-out;transition:all .24s ease-out;top:0;visibility:hidden;width:100%;z-index:2005}.search__overlay-inner{-webkit-animation:slideininput .24s 1s forwards;animation:slideininput .24s 1s forwards;align-items:center;display:flex;height:calc(var(--navbar-height) * 3);justify-content:space-between;padding:0 var(--page-margin);opacity:0;scale:0.9}@-webkit-keyframes slideininput{60%{opacity:0;scale:0.9}100%{opacity:1;scale:1}}@keyframes slideininput{60%{opacity:0;scale:0.9}100%{opacity:1;scale:1}}.search__overlay.expanded{-webkit-transform:translate(0,0);transform:translate(0,0);opacity:1;display:block;visibility:visible}.navbar{order:3}.navbar .navbar__menu{display:flex;flex-wrap:wrap;list-style:none;margin:0;padding:0}@media all and (max-width:56.1875em){.navbar .navbar__menu{display:none}}.navbar .navbar__menu li{font-family:var(--menu-font);display:block;font-size:.8789062495rem;line-height:var(--line-height);font-variation-settings:"wght" 500;padding:0;position:relative;width:auto}.navbar .navbar__menu li a,.navbar .navbar__menu li span[aria-haspopup=true]{color:var(--nav-link-color);display:block;padding:0 .6rem;-webkit-transition:all .24s ease-out;transition:all .24s ease-out}.navbar .navbar__menu li a:active,.navbar .navbar__menu li a:focus,.navbar .navbar__menu li a:hover,.navbar .navbar__menu li span[aria-haspopup=true]:active,.navbar .navbar__menu li span[aria-haspopup=true]:focus,.navbar .navbar__menu li span[aria-haspopup=true]:hover{color:var(--nav-link-color-hover)}.navbar .navbar__menu li span{color:var(--nav-link-color);cursor:default;display:block;padding:0 .6rem}.navbar .navbar__menu>li:hover>a,.navbar .navbar__menu>li:hover>span[aria-haspopup=true]{color:var(--nav-link-color-hover)}.navbar .has-submenu:active>.navbar__submenu,.navbar .has-submenu:focus>.navbar__submenu,.navbar .has-submenu:hover>.navbar__submenu{left:0;opacity:1;-webkit-transform:scale(1);transform:scale(1);visibility:visible;margin-top:.8rem}.navbar .has-submenu:active>.navbar__submenu:before,.navbar .has-submenu:focus>.navbar__submenu:before,.navbar .has-submenu:hover>.navbar__submenu:before{content:"";height:1rem;left:0;position:absolute;width:100%;top:-1rem}.navbar .has-submenu:active>.navbar__submenu.is-right-submenu,.navbar .has-submenu:focus>.navbar__submenu.is-right-submenu,.navbar .has-submenu:hover>.navbar__submenu.is-right-submenu{left:auto;right:0;-webkit-transform-origin:right top;transform-origin:right top}.navbar .has-submenu .has-submenu:active>.navbar__submenu,.navbar .has-submenu .has-submenu:focus>.navbar__submenu,.navbar .has-submenu .has-submenu:hover>.navbar__submenu{top:0;margin-top:0}.navbar .has-submenu .has-submenu:active>.navbar__submenu.is-right-submenu,.navbar .has-submenu .has-submenu:focus>.navbar__submenu.is-right-submenu,.navbar .has-submenu .has-submenu:hover>.navbar__submenu.is-right-submenu{top:0;margin-top:0}.navbar .navbar__submenu{background:var(--lighter);border-radius:calc(var(--border-radius) * 4);left:-9999px;list-style-type:none;margin:0;padding:1rem .85rem;position:absolute;visibility:hidden;white-space:nowrap;z-index:1;opacity:0;-webkit-transform:scale(.8);transform:scale(.8);-webkit-transform-origin:0 top;transform-origin:0 top;-webkit-transition:opacity .15s,-webkit-transform .3s cubic-bezier(.275, 1.375, .8, 1);transition:opacity .15s,-webkit-transform .3s cubic-bezier(.275, 1.375, .8, 1);transition:opacity .15s,transform .3s cubic-bezier(.275, 1.375, .8, 1);transition:opacity .15s,transform .3s cubic-bezier(.275, 1.375, .8, 1),-webkit-transform .3s cubic-bezier(.275, 1.375, .8, 1)}.navbar .navbar__submenu__submenu{z-index:2}.navbar .navbar__submenu li{line-height:1.5;font-size:.8789062495rem}.navbar .navbar__submenu li a,.navbar .navbar__submenu li span[aria-haspopup=true]{border-radius:calc(var(--border-radius) * 3);color:var(--nav-link-color-hover);padding:.5rem 1rem;-webkit-transition:all .24s ease;transition:all .24s ease}.navbar .navbar__submenu li a:active,.navbar .navbar__submenu li a:focus,.navbar .navbar__submenu li a:hover,.navbar .navbar__submenu li span[aria-haspopup=true]:active,.navbar .navbar__submenu li span[aria-haspopup=true]:focus,.navbar .navbar__submenu li span[aria-haspopup=true]:hover{background:var(--page-bg);color:var(--nav-link-color)}.navbar .navbar__submenu li span{color:var(--nav-link-color-hover)!important;padding:.5rem 1rem}.navbar .navbar__submenu li:hover>a,.navbar .navbar__submenu li:hover>span[aria-haspopup=true]{color:var(--nav-link-color)}.navbar .navbar__toggle{background:var(--black);-webkit-box-shadow:none;box-shadow:none;border:none;cursor:pointer;display:block;line-height:1;margin:0;overflow:visible;padding:0;position:relative;right:0;margin-left:.75rem;text-transform:none;z-index:2004;height:3.2rem;padding:0;width:3.2rem}@media all and (min-width:56.25em){.navbar .navbar__toggle{display:none}}.navbar .navbar__toggle:focus,.navbar .navbar__toggle:hover{-webkit-box-shadow:none;box-shadow:none;outline:0;-webkit-transform:none;transform:none}.navbar .navbar__toggle-box{width:20px;height:14px;display:inline-block;position:relative}.navbar .navbar__toggle-inner{display:block;top:50%;text-indent:-9999999em}.navbar .navbar__toggle-inner::before{content:"";display:block;top:-5px}.navbar .navbar__toggle-inner::after{content:"";display:block;bottom:-5px}.navbar .navbar__toggle-inner,.navbar .navbar__toggle-inner::after,.navbar .navbar__toggle-inner::before{width:20px;height:1px;background-color:var(--white);position:absolute;-webkit-transition:opacity .14s ease-out,-webkit-transform;transition:opacity .14s ease-out,-webkit-transform;transition:transform,opacity .14s ease-out;transition:transform,opacity .14s ease-out,-webkit-transform}.navbar .navbar__toggle-inner{-webkit-transition-duration:75ms;transition-duration:75ms;-webkit-transition-timing-function:cubic-bezier(0.55,0.055,0.675,0.19);transition-timing-function:cubic-bezier(0.55,0.055,0.675,0.19)}.navbar .navbar__toggle-inner::before{-webkit-transition:top 75ms ease .12s,opacity 75ms ease;transition:top 75ms ease .12s,opacity 75ms ease}.navbar .navbar__toggle-inner::after{-webkit-transition:bottom 75ms ease .12s,-webkit-transform 75ms cubic-bezier(.55, .055, .675, .19);transition:bottom 75ms ease .12s,-webkit-transform 75ms cubic-bezier(.55, .055, .675, .19);transition:bottom 75ms ease .12s,transform 75ms cubic-bezier(.55, .055, .675, .19);transition:bottom 75ms ease .12s,transform 75ms cubic-bezier(.55, .055, .675, .19),-webkit-transform 75ms cubic-bezier(.55, .055, .675, .19)}.navbar .navbar__toggle.is-active .navbar__toggle-inner{-webkit-transform:rotate(45deg);transform:rotate(45deg);-webkit-transition-delay:0.12s;transition-delay:0.12s;-webkit-transition-timing-function:cubic-bezier(0.215,0.61,0.355,1);transition-timing-function:cubic-bezier(0.215,0.61,0.355,1)}.navbar .navbar__toggle.is-active .navbar__toggle-inner::before{top:0;opacity:0;-webkit-transition:top 75ms ease,opacity 75ms ease .12s;transition:top 75ms ease,opacity 75ms ease .12s}.navbar .navbar__toggle.is-active .navbar__toggle-inner::after{bottom:0;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);-webkit-transition:bottom 75ms ease,-webkit-transform 75ms cubic-bezier(.215, .61, .355, 1) .12s;transition:bottom 75ms ease,-webkit-transform 75ms cubic-bezier(.215, .61, .355, 1) .12s;transition:bottom 75ms ease,transform 75ms cubic-bezier(.215, .61, .355, 1) .12s;transition:bottom 75ms ease,transform 75ms cubic-bezier(.215, .61, .355, 1) .12s,-webkit-transform 75ms cubic-bezier(.215, .61, .355, 1) .12s}.navbar_mobile_overlay{background:var(--page-bg);height:calc(100vh - 4.4rem);left:0;opacity:1;overflow:auto;pointer-events:auto;position:fixed;top:4.4rem;-webkit-transition:all .3s cubic-bezier(0, 0, .3, 1);transition:all .3s cubic-bezier(0, 0, .3, 1);width:100%;z-index:1001}.navbar_mobile_overlay.is-hidden{opacity:0;pointer-events:none}.navbar_mobile_overlay .navbar__menu{margin:24px}.navbar_mobile_overlay .navbar__menu li{list-style:none;margin:0;padding:0;text-align:center}.navbar_mobile_overlay .navbar__menu li a,.navbar_mobile_overlay .navbar__menu li span{color:var(--dark);display:block;padding:calc(var(--baseline) * 2);position:relative}.navbar_mobile_overlay .navbar__menu li a:active,.navbar_mobile_overlay .navbar__menu li a:focus,.navbar_mobile_overlay .navbar__menu li a:hover,.navbar_mobile_overlay .navbar__menu li span:active,.navbar_mobile_overlay .navbar__menu li span:focus,.navbar_mobile_overlay .navbar__menu li span:hover{color:var(--dark)}.navbar_mobile_overlay .navbar__menu li a[aria-haspopup=true]::after,.navbar_mobile_overlay .navbar__menu li span[aria-haspopup=true]::after{content:"";width:0;height:0;border-style:solid;border-width:5px 5px 0 5px;border-color:currentColor transparent transparent transparent;left:calc(var(--baseline) * 2);top:15px;position:relative}.navbar_mobile_overlay .navbar__submenu{margin:0;padding:0;visibility:hidden}.navbar_mobile_overlay .navbar__submenu[aria-hidden=false]{visibility:visible}.navbar_mobile_overlay .navbar__submenu_wrapper{height:0;opacity:0;overflow:hidden;-webkit-transition:all .3s cubic-bezier(.275, 1.375, .8, 1);transition:all .3s cubic-bezier(.275, 1.375, .8, 1)}.navbar_mobile_overlay .navbar__submenu_wrapper.is-active{height:auto;opacity:1}.navbar_mobile_sidebar{background:var(--page-bg);-webkit-box-shadow:0 0 5px rgba(0,0,0,.25);box-shadow:0 0 5px rgba(0,0,0,.25);height:100vh;left:0;max-width:400px;overflow:auto;position:fixed;top:0;-webkit-transition:all .3s cubic-bezier(0, 0, .3, 1);transition:all .3s cubic-bezier(0, 0, .3, 1);width:80%;z-index:1001}.navbar_mobile_sidebar.is-hidden{left:-400px}.navbar_mobile_sidebar .navbar__menu{margin:24px}.navbar_mobile_sidebar .navbar__menu li{font-family:var(--menu-font);font-size:16px;list-style:none;line-height:1.3;margin:0;padding:0}.navbar_mobile_sidebar .navbar__menu li .is-separator,.navbar_mobile_sidebar .navbar__menu li a{color:var(--dark);display:block;padding:10px 20px 10px 0;position:relative}.navbar_mobile_sidebar .navbar__menu li .is-separator:active,.navbar_mobile_sidebar .navbar__menu li .is-separator:focus,.navbar_mobile_sidebar .navbar__menu li .is-separator:hover,.navbar_mobile_sidebar .navbar__menu li a:active,.navbar_mobile_sidebar .navbar__menu li a:focus,.navbar_mobile_sidebar .navbar__menu li a:hover{color:var(--dark)}.navbar_mobile_sidebar .navbar__menu li .is-separator[aria-haspopup=true]::after,.navbar_mobile_sidebar .navbar__menu li a[aria-haspopup=true]::after{content:"";width:0;height:0;border-style:solid;border-width:5px 5px 0 5px;border-color:currentColor transparent transparent transparent;right:0;top:18px;position:absolute}.navbar_mobile_sidebar .navbar__submenu{margin:0 0 0 24px;padding:0;visibility:hidden}.navbar_mobile_sidebar .navbar__submenu[aria-hidden=false]{visibility:visible}.navbar_mobile_sidebar .navbar__submenu_wrapper{height:0;opacity:0;overflow:hidden;-webkit-transition:all .3s cubic-bezier(.275, 1.375, .8, 1);transition:all .3s cubic-bezier(.275, 1.375, .8, 1)}.navbar_mobile_sidebar .navbar__submenu_wrapper.is-active{height:auto;opacity:1}.navbar_mobile_sidebar__overlay{background:rgba(0,0,0,.5);height:100%;opacity:1;pointer-events:auto;position:fixed;top:0;-webkit-transition:all .3s cubic-bezier(0, 0, .3, 1);transition:all .3s cubic-bezier(0, 0, .3, 1);width:100%;z-index:10}.navbar_mobile_sidebar__overlay.is-hidden{opacity:0;pointer-events:none}.wrapper{-webkit-box-sizing:content-box;box-sizing:content-box;max-width:var(--page-width);margin-left:auto;margin-right:auto;padding-left:var(--page-margin);padding-right:var(--page-margin)}.entry-wrapper{-webkit-box-sizing:content-box;box-sizing:content-box;max-width:var(--entry-width);margin-left:auto;margin-right:auto;padding-left:var(--page-margin);padding-right:var(--page-margin)}.hero{position:relative;z-index:1}.hero--noimage::after{background:var(--dark);content:"";display:block;height:1px;bottom:0;width:calc(100% - var(--page-margin) * 2);z-index:-1;max-width:var(--page-width);position:absolute;left:50%;-webkit-transform:translate(-50%,0);transform:translate(-50%,0)}.hero__content{padding-bottom:calc(var(--baseline) * 6 + 1.5vw)}.hero__content h1>sup{font-size:1.066666667rem;vertical-align:top}.hero__content--centered{text-align:center}.hero__content--centered .content__meta{justify-content:center}.hero__cta{margin-top:calc(var(--baseline) * 6)}.hero__image{margin:0 var(--page-margin)}.hero__image-wrapper{position:relative;background:var(--lighter);border-radius:calc(var(--border-radius) * 4)}@media all and (min-width:56.25em){.hero__image-wrapper{height:var(--hero-height)}}.hero__image-wrapper img{border-radius:inherit;display:block;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}@media all and (min-width:56.25em){.hero__image-wrapper img{height:var(--hero-height)}}.hero__image>figcaption{background:var(--page-bg)}@media all and (min-width:56.25em){.hero__image>figcaption{text-align:right}}.feed__item{display:flex;flex-wrap:wrap;gap:calc(2rem + 2vw);margin-top:calc(var(--baseline) * 12 + 2vw)}@media all and (min-width:37.5em){.feed__item{flex-wrap:nowrap}}.feed__item--centered{justify-content:center}.feed__content{max-width:var(--entry-width)}.feed__image{background:var(--lighter);border-radius:calc(var(--border-radius) * 4);flex-shrink:0;height:100%;margin:0;width:100%}@media all and (min-width:37.5em){.feed__image{height:calc(var(--feed-image-size) + 4vw);width:calc(var(--feed-image-size) + 4vw)}}.feed__image>img{border-radius:inherit;display:inline-block;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.feed__image--wide{max-width:var(--page-width)}.feed__meta{align-items:center;color:var(--gray);display:flex;font-size:.8239746086rem;gap:.8rem;margin-bottom:calc(var(--baseline) * 3)}.feed__author{font-family:var(--menu-font);font-variation-settings:"wght" var(--font-weight-bold);text-decoration:none}.feed__author-thumb{border-radius:50%;height:1.7rem;margin-right:-.2rem;width:1.7rem}.feed__date{color:var(--gray);font-style:italic}.feed__author+.feed__date::before{content:"";background:var(--light);display:inline-block;height:1px;margin-right:4px;width:1rem;vertical-align:middle}.feed__readmore{margin-top:calc(var(--baseline) * 4 + .25vw)}.feed__title{margin-top:0}.feed--grid{margin:0}@media all and (min-width:37.5em){.feed--grid{display:grid;grid-template-columns:100%;gap:0 3rem}}@media all and (min-width:56.25em){.feed--grid{grid-template-columns:repeat(2,1fr)}}.feed--grid h2{margin-top:0}.feed--grid sup{font-size:1.066666667rem;vertical-align:top}.feed--grid li{align-items:center;list-style:none;gap:2rem;padding:0}.content{overflow:hidden}.content__meta{margin-top:calc(var(--baseline) * 4 + .25vw);margin-bottom:0}.content__meta--centered{justify-content:center}.content__entry{margin-top:calc(var(--baseline) * 6 + 1.5vw);overflow-wrap:break-word}.content__entry>:first-child{margin-top:0}.content__entry a:not(.btn):not([type=button]):not([type=submit]):not(button):not(.post__toc a):not(.gallery__item a){color:var(--link-color-hover);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:0.2em;-webkit-text-decoration-skip:ink;text-decoration-skip-ink:auto}.content__entry a:not(.btn):not([type=button]):not([type=submit]):not(button):not(.post__toc a):not(.gallery__item a):active,.content__entry a:not(.btn):not([type=button]):not([type=submit]):not(button):not(.post__toc a):not(.gallery__item a):focus,.content__entry a:not(.btn):not([type=button]):not([type=submit]):not(button):not(.post__toc a):not(.gallery__item a):hover{color:var(--link-color)}.content__entry--nospace{margin-top:0}.content__avatar-thumbs{border-radius:50%;height:4.5rem;width:4.5rem}.content__footer{margin-top:calc(var(--baseline) * 9 + 1vw)}.content__updated{color:var(--gray);font-size:.8789062495rem;font-style:italic}.content__actions{align-items:baseline;display:flex;flex-basis:auto;gap:2rem;justify-content:space-between;margin-top:calc(var(--baseline) * 4 + .25vw);position:relative}.content__share{flex-shrink:0}.content__share-button{border-color:var(--light)}.content__share-popup{background:var(--lighter);border-radius:calc(var(--border-radius) * 4);bottom:140%;display:none;padding:1rem .85rem;position:absolute;right:0;text-align:left;z-index:1}.content__share-popup.is-visible{-webkit-animation:share-popup .48s cubic-bezier(.17,.67,.6,1.34) backwards;animation:share-popup .48s cubic-bezier(.17,.67,.6,1.34) backwards;display:block}@-webkit-keyframes share-popup{from{-webkit-transform:scale(.9);transform:scale(.9)}to{-webkit-transform:scale(1);transform:scale(1)}}@keyframes share-popup{from{-webkit-transform:scale(.9);transform:scale(.9)}to{-webkit-transform:scale(1);transform:scale(1)}}.content__share-popup>a{border-radius:calc(var(--border-radius) * 3);color:var(--text-color);display:block;font-family:var(--menu-font);font-size:.8239746086rem;padding:.4rem .8rem}.content__share-popup>a:hover{background:var(--page-bg);color:var(--text-color);text-decoration:none}.content__share-popup>a>svg{fill:var(--text-color);display:inline-block;height:.9rem;margin-right:.5666666667rem;pointer-events:none;vertical-align:middle;width:.9rem}.content__tag{margin:0;font-family:var(--menu-font);font-size:.8239746086rem}.content__tag>li{display:inline-flex;margin:.3rem .3rem .3rem 0;padding:0}.content__tag>li>a{border:1px solid var(--light);border-radius:calc(var(--border-radius) * 10);color:var(--dark);font-size:.7241964329rem;font-variation-settings:"wght" var(--font-weight-normal);padding:calc(var(--baseline) * 1) calc(var(--baseline) * 2.5)}.content__tag>li>a:hover{border-color:var(--dark)}.content__bio{display:flex;margin:calc(var(--baseline) * 12 + 1vw) 0}@media all and (min-width:37.5em){.content__bio{align-items:center}}@media all and (min-width:37.5em){.content__bio::before{content:"";border-top:1px solid var(--light);height:1px;margin-right:2rem;width:30%}}.bio__avatar{border-radius:50%;flex-shrink:0;height:2.5rem;margin-right:1.2rem;width:2.5rem}@media all and (min-width:37.5em){.bio__avatar{height:4rem;margin-right:2rem;width:4rem}}.bio__name{margin:0}.bio__desc{font-family:var(--body-font);font-size:.8789062495rem;line-height:1.5}.bio__desc>:first-child{margin-top:calc(var(--baseline) * 2)}.bio__desc a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:0.2em;-webkit-text-decoration-skip:ink;text-decoration-skip-ink:auto}.bio__desc a{color:var(--link-color-hover);-webkit-transition:all .24s ease-out;transition:all .24s ease-out}.bio__desc a:hover{color:var(--link-color)}.bio__desc a:active{color:var(--link-color)}.bio__desc a:focus{outline:0}.content__nav{margin-top:calc(var(--baseline) * 16 + 1vw)}.content__nav-inner{border-top:1px solid var(--dark);border-bottom:1px solid var(--dark);padding:calc(var(--baseline) * 16) 0}@media all and (min-width:37.5em){.content__nav-inner{display:flex;gap:1rem;justify-content:space-between}}@media all and (min-width:56.25em){.content__nav-inner{gap:2rem}}@media all and (max-width:37.4375em){.content__nav-prev+.content__nav-next{margin-top:calc(var(--baseline) * 6 + 1vw)}}@media all and (min-width:37.5em){.content__nav-next{margin-left:auto;text-align:right}}.content__nav-link{font-family:var(--heading-font);font-variation-settings:"wght" var(--font-weight-bold);font-style:italic;height:100%;line-height:1.5;display:flex;gap:1rem;justify-content:space-between;align-items:center}@media all and (min-width:37.5em){.content__nav-link{gap:2rem}}.content__nav-link>div{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}@media all and (min-width:56.25em){.content__nav-link>div{-webkit-line-clamp:4}}.content__nav-link span{color:var(--gray);display:block;font-size:.7724761953rem;font-family:var(--menu-font);font-style:normal;font-variation-settings:"wght" var(--font-weight-normal);margin-bottom:var(--baseline)}.content__nav-image{flex:1 0 4rem;margin:0;height:4rem}@media all and (min-width:37.5em) and (max-width:56.1875em){.content__nav-image{flex-basis:6rem;height:6rem}}@media all and (min-width:56.25em){.content__nav-image{flex-basis:8rem;height:8rem}}.content__nav-image>img{border-radius:calc(var(--border-radius) * 4);display:block;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.content__related{background:var(--lighter);margin-top:calc(var(--baseline) * 16 + 1vw);padding:calc(var(--baseline) * 12 + 3vw) 0}.related__title{margin-top:0}.content__comments{margin-top:calc(var(--baseline) * 9);overflow:hidden}.post__image:not(.post__image--wide):not(.post__image--full){display:inline-block;margin-bottom:calc(var(--baseline) * 2 + .25vw)}.post__image a,.post__image img{border-radius:calc(var(--border-radius) * 4);display:inline-block}.post__image>figcaption{background-color:var(--page-bg)}.post__image--left{float:left;margin-right:2rem;max-width:50%}.post__image--right{float:right;margin-left:2rem;max-width:50%}.post__image--center{display:block;margin-left:auto;margin-right:auto;text-align:center}.post__image--wide{display:block}@media all and (min-width:56.25em){.post__image--wide{margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);padding:0 var(--page-margin);text-align:center}.post__image--wide a,.post__image--wide img{display:block;height:auto;margin:auto;max-width:var(--page-width);width:100%}}.post__image--full{background-color:var(--lighter);display:block;margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);text-align:center}.post__image--full a,.post__image--full img{border-radius:0;display:block;height:auto;width:100%}.post__iframe,.post__video{display:block;margin-top:calc(var(--baseline) * 6 + .5vw);margin-bottom:calc(var(--baseline) * 6 + .5vw);overflow:hidden;padding:0;position:relative;width:100%}.post__iframe::before,.post__video::before{display:block;content:"";padding-top:var(--embed-aspect-ratio)}.post__iframe iframe[height*="%"][width*="%"],.post__iframe iframe[height]:not([height*="%"])[width]:not([width*="%"]),.post__iframe video[height*="%"][width*="%"],.post__iframe video[height]:not([height*="%"])[width]:not([width*="%"]),.post__video iframe[height*="%"][width*="%"],.post__video iframe[height]:not([height*="%"])[width]:not([width*="%"]),.post__video video[height*="%"][width*="%"],.post__video video[height]:not([height*="%"])[width]:not([width*="%"]){border:none;height:100%;left:0;position:absolute;top:0;bottom:0;width:100%}.post__iframe:has(iframe:not([height]))::before,.post__iframe:has(iframe:not([width]))::before,.post__iframe:has(video:not([height]))::before,.post__iframe:has(video:not([width]))::before,.post__video:has(iframe:not([height]))::before,.post__video:has(iframe:not([width]))::before,.post__video:has(video:not([height]))::before,.post__video:has(video:not([width]))::before{display:none}.post__toc{margin-top:calc(var(--baseline) * 6 + .5vw)}.post__toc h3{border-bottom:1px solid var(--dark);font-size:1rem;margin:0;padding-bottom:calc(var(--baseline) * 2 + .25vw)}.post__toc ul{counter-reset:item;list-style:decimal;margin:calc(var(--baseline) * 3 + .25vw) 0 0 3ch}.post__toc ul li{counter-increment:item;padding:0}.post__toc ul ul{margin-top:0}.post__toc ul ul li{display:block}.post__toc ul ul li:before{content:counters(item, ".") ". ";margin-left:-3ch}.banner{text-align:center}.banner--after-content{margin-top:calc(var(--baseline) * 9 + 1vw)}.page__desc a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:0.2em;-webkit-text-decoration-skip:ink;text-decoration-skip-ink:auto}@media all and (min-width:37.5em){.page--author__wrapper{display:flex;gap:2rem}}@media all and (min-width:56.25em){.page--author__wrapper{gap:3rem}}.page--author__avatar{border-radius:50%;height:calc(var(--baseline) * 10 + 2vw);margin-top:calc(var(--baseline) * 6 + 1vw);width:calc(var(--baseline) * 10 + 2vw)}.page--author__website{margin-top:calc(var(--baseline) * 4 + .25vw)}.page--search form{align-items:flex-start;display:flex;flex-wrap:wrap}@media all and (max-width:37.4375em){.page--search input{margin-bottom:calc(var(--baseline) * 2)}}@media all and (min-width:20em){.page--search input{flex:1 0 auto;margin-right:calc(var(--baseline) * 2)}}@media all and (max-width:37.4375em){.page--search button{width:100%}}.subpages__title{border-top:1px solid var(--light);padding-top:calc(var(--baseline) * 6 + .5vw)}.subpages__list{list-style:initial;margin-left:2ch}.subpages__list ul{list-style:initial;margin:0 0 0 2ch}.subpages__list li{padding-bottom:0}.readmore{display:inline-block;color:var(--gray);font-size:.9374999997rem;font-style:italic;text-decoration:underline;-webkit-text-decoration-skip:ink;text-decoration-skip-ink:auto}.align-left{text-align:left}.align-right{text-align:right}.align-center{text-align:center}.align-justify{text-align:justify}.msg{background-color:var(--lighter);border-left:3px solid var(--light);font-size:.9374999997rem;padding:calc(var(--baseline) * 4) calc(var(--baseline) * 6);position:relative}.msg--highlight{border-left-color:var(--highlight-color)}.msg--info{border-left-color:var(--info-color)}.msg--success{border-left-color:var(--success-color)}.msg--warning{border-left-color:var(--warning-color)}.ordered-list{counter-reset:listCounter}.ordered-list li{counter-increment:listCounter;list-style:none;padding-left:.3rem;position:relative}.ordered-list li::before{color:var(--color);content:counter(listCounter,decimal-leading-zero) ".";font-variation-settings:"wght" var(--font-weight-bold);left:-2rem;position:absolute}.dropcap:first-letter{color:var(--headings-color);float:left;font-size:3.6355864383rem;line-height:.7;margin-right:.6rem;padding:calc(var(--baseline) * 2) calc(var(--baseline) * 2) calc(var(--baseline) * 2) 0}.pec-wrapper{height:100%;left:0;position:absolute;top:0;width:100%}.pec-overlay{align-items:center;background-color:var(--lighter);font-size:14px;display:none;height:inherit;justify-content:center;line-height:1.4;padding:1rem;position:relative;text-align:center}@media all and (min-width:37.5em){.pec-overlay{font-size:16px;line-height:var(--line-height);padding:1rem 2rem}}.pec-overlay.is-active{display:flex}.pec-overlay-inner p{margin:0 0 1rem}.pagination{display:flex;gap:calc(var(--baseline) * 2);justify-content:center;margin-top:calc(var(--baseline) * 12 + 1vw)}@media all and (min-width:56.25em){.pagination{margin-top:calc(var(--baseline) * 18 + 1vw)}}.footer{border-top:1px solid var(--light);font-size:.9374999997rem;padding:calc(var(--baseline) * 9 + 1vw) 0 calc(var(--baseline) * 6 + 1vw);margin:calc(var(--baseline) * 12 + 1vw) auto 0;max-width:var(--page-width);text-align:center}.footer--glued{border:none;padding-top:0}.footer__nav ul{list-style:none;margin:0}.footer__nav ul li{display:inline-block;padding:var(--baseline) .5rem}*+.footer__social{margin-top:calc(var(--baseline) * 6 + .5vw)}.footer__social svg{fill:var(--dark);height:1rem;margin:0 .5rem;-webkit-transition:all .12s linear 0s;transition:all .12s linear 0s;width:1rem}.footer__social svg:hover{fill:var(--gray)}.footer__copyright{font-size:.8239746086rem;margin-top:var(--baseline)}.footer__copyright>:first-child{margin:0}.footer__bttop{background:var(--page-bg);bottom:calc(var(--baseline) * 5);border-radius:50%;border-color:var(--light);line-height:1;opacity:0;padding:calc(var(--baseline) * 2);position:fixed;right:2rem;text-align:center;width:auto!important;visibility:hidden;z-index:999}@media all and (min-width:56.25em){.footer__bttop{bottom:calc(var(--baseline) * 10)}}.footer__bttop:hover{border-color:var(--dark);opacity:1}.footer__bttop.is-visible{visibility:visible;opacity:1}.gallery{margin:calc(var(--baseline) * 6 + 1vw) calc(var(--gallery-gap) * -1)}@media all and (min-width:20em){.gallery{display:flex;flex-wrap:wrap}}@media all and (min-width:56.25em){.gallery-wrapper--wide{display:flex;justify-content:center;margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);padding:0 var(--page-margin)}.gallery-wrapper--wide .gallery{max-width:var(--page-width)}}@media all and (min-width:56.25em){.gallery-wrapper--full{margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);padding:0 var(--page-margin)}}@media all and (min-width:20em){.gallery[data-columns="1"] .gallery__item{flex:1 0 100%}}@media all and (min-width:30em){.gallery[data-columns="2"] .gallery__item{flex:1 0 50%}}@media all and (min-width:37.5em){.gallery[data-columns="3"] .gallery__item{flex:1 0 33.333%}}@media all and (min-width:56.25em){.gallery[data-columns="4"] .gallery__item{flex:0 1 25%}}@media all and (min-width:56.25em){.gallery[data-columns="5"] .gallery__item{flex:0 1 20%}}@media all and (min-width:56.25em){.gallery[data-columns="6"] .gallery__item{flex:0 1 16.666%}}@media all and (min-width:56.25em){.gallery[data-columns="7"] .gallery__item{flex:1 0 14.285%}}@media all and (min-width:56.25em){.gallery[data-columns="8"] .gallery__item{flex:1 0 12.5%}}.gallery__item{margin:0;padding:var(--gallery-gap);position:relative}@media all and (min-width:20em){.gallery__item{flex:1 0 50%}}@media all and (min-width:30em){.gallery__item{flex:1 0 33.333%}}@media all and (min-width:37.5em){.gallery__item{flex:1 0 25%}}.gallery__item a{border-radius:calc(var(--border-radius) * 4);display:block;height:100%;width:100%}.gallery__item a::after{background:-webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.4)),to(rgba(0,0,0,0)));background:linear-gradient(to top,rgba(0,0,0,.4) 0,rgba(0,0,0,0) 100%);border-radius:inherit;bottom:var(--gallery-gap);content:"";display:block;opacity:0;left:var(--gallery-gap);height:calc(100% - var(--gallery-gap) * 2);position:absolute;right:var(--gallery-gap);top:var(--gallery-gap);-webkit-transition:all .24s ease-out;transition:all .24s ease-out;width:calc(100% - var(--gallery-gap) * 2)}.gallery__item a:hover::after{opacity:1}.gallery__item img{border-radius:inherit;display:block;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.gallery__item figcaption{bottom:1.2rem;color:var(--white);left:50%;opacity:0;position:absolute;text-align:center;-webkit-transform:translate(-50%,1.2rem);transform:translate(-50%,1.2rem);-webkit-transition:all .24s ease-out;transition:all .24s ease-out}.gallery__item:hover figcaption{opacity:1;-webkit-transform:translate(-50%,0);transform:translate(-50%,0)}input[type=checkbox]:checked+label:before{background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 8'%3e%3cpolygon points='9.53 0 4.4 5.09 1.47 2.18 0 3.64 2.93 6.54 4.4 8 5.87 6.54 11 1.46 9.53 0' fill='%23C9C9C9'/%3e%3c/svg%3e")}input[type=radio]:checked+label:before{background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3ccircle cx='4' cy='4' r='4' fill='%23C9C9C9'/%3e%3c/svg%3e")}img[loading]{opacity:0}img.is-loaded{opacity:1;transition:opacity 1s cubic-bezier(.215, .61, .355, 1)} \ No newline at end of file diff --git a/assets/js/scripts.js b/assets/js/scripts.js new file mode 100755 index 0000000..5faf56d --- /dev/null +++ b/assets/js/scripts.js @@ -0,0 +1,619 @@ +// Sticky header position on page scrolling up +const header = document.querySelector('.js-header'); +const stickyClass = 'sticky'; +let lastScrollTop = 0; +let isWaiting = false; + +window.addEventListener('scroll', () => { + if (!isWaiting) { + window.requestAnimationFrame(() => { + let currentScroll = window.scrollY || window.pageYOffset || document.documentElement.scrollTop; + + if (currentScroll > lastScrollTop) { + header.classList.remove(stickyClass); + } else if (currentScroll < lastScrollTop && currentScroll > 0) { + header.classList.add(stickyClass); + } else if (currentScroll <= 0) { + header.classList.remove(stickyClass); + } + + lastScrollTop = currentScroll; + isWaiting = false; + }); + isWaiting = true; + } +}, false); + +// Dropdown menu +(function (menuConfig) { + /** + * Merge default config with the theme overrided ones + */ + var defaultConfig = { + // behaviour + mobileMenuMode: 'overlay', + animationSpeed: 300, + submenuWidth: 300, + doubleClickTime: 500, + mobileMenuExpandableSubmenus: false, + isHoverMenu: true, + // selectors + wrapperSelector: '.navbar', + buttonSelector: '.navbar__toggle', + menuSelector: '.navbar__menu', + submenuSelector: '.navbar__submenu', + mobileMenuSidebarLogoSelector: null, + mobileMenuSidebarLogoUrl: null, + relatedContainerForOverlayMenuSelector: null, + // attributes + ariaButtonAttribute: 'aria-haspopup', + // CSS classes + separatorItemClass: 'is-separator', + parentItemClass: 'has-submenu', + submenuLeftPositionClass: 'is-left-submenu', + submenuRightPositionClass: 'is-right-submenu', + mobileMenuOverlayClass: 'navbar_mobile_overlay', + mobileMenuSubmenuWrapperClass: 'navbar__submenu_wrapper', + mobileMenuSidebarClass: 'navbar_mobile_sidebar', + mobileMenuSidebarOverlayClass: 'navbar_mobile_sidebar__overlay', + hiddenElementClass: 'is-hidden', + openedMenuClass: 'is-active', + noScrollClass: 'no-scroll', + relatedContainerForOverlayMenuClass: 'is-visible' + }; + + var config = {}; + + Object.keys(defaultConfig).forEach(function (key) { + config[key] = defaultConfig[key]; + }); + + if (typeof menuConfig === 'object') { + Object.keys(menuConfig).forEach(function (key) { + config[key] = menuConfig[key]; + }); + } + + /** + * Menu initializer + */ + function init() { + if (!document.querySelectorAll(config.wrapperSelector).length) { + return; + } + + initSubmenuPositions(); + + if (config.mobileMenuMode === 'overlay') { + initMobileMenuOverlay(); + } else if (config.mobileMenuMode === 'sidebar') { + initMobileMenuSidebar(); + } + + initClosingMenuOnClickLink(); + + if (!config.isHoverMenu) { + initAriaAttributes(); + } + }; + + /** + * Function responsible for the submenu positions + */ + function initSubmenuPositions() { + var submenuParents = document.querySelectorAll(config.wrapperSelector + ' .' + config.parentItemClass); + + for (var i = 0; i < submenuParents.length; i++) { + var eventTrigger = config.isHoverMenu ? 'mouseenter' : 'click'; + + submenuParents[i].addEventListener(eventTrigger, function () { + var submenu = this.querySelector(config.submenuSelector); + var itemPosition = this.getBoundingClientRect().left; + var widthMultiplier = 2; + + if (this.parentNode === document.querySelector(config.menuSelector)) { + widthMultiplier = 1; + } + + if (config.submenuWidth !== 'auto') { + var submenuPotentialPosition = itemPosition + (config.submenuWidth * widthMultiplier); + + if (window.innerWidth < submenuPotentialPosition) { + submenu.classList.remove(config.submenuLeftPositionClass); + submenu.classList.add(config.submenuRightPositionClass); + } else { + submenu.classList.remove(config.submenuRightPositionClass); + submenu.classList.add(config.submenuLeftPositionClass); + } + } else { + var submenuPotentialPosition = 0; + var submenuPosition = 0; + + if (widthMultiplier === 1) { + submenuPotentialPosition = itemPosition + submenu.clientWidth; + } else { + submenuPotentialPosition = itemPosition + this.clientWidth + submenu.clientWidth; + } + + if (window.innerWidth < submenuPotentialPosition) { + submenu.classList.remove(config.submenuLeftPositionClass); + submenu.classList.add(config.submenuRightPositionClass); + submenuPosition = -1 * submenu.clientWidth; + submenu.removeAttribute('style'); + + if (widthMultiplier === 1) { + submenuPosition = 0; + submenu.style.right = submenuPosition + 'px'; + } else { + submenu.style.right = this.clientWidth + 'px'; + } + } else { + submenu.classList.remove(config.submenuRightPositionClass); + submenu.classList.add(config.submenuLeftPositionClass); + submenuPosition = this.clientWidth; + + if (widthMultiplier === 1) { + submenuPosition = 0; + } + + submenu.removeAttribute('style'); + submenu.style.left = submenuPosition + 'px'; + } + } + + submenu.setAttribute('aria-hidden', false); + }); + + if (config.isHoverMenu) { + submenuParents[i].addEventListener('mouseleave', function () { + var submenu = this.querySelector(config.submenuSelector); + submenu.removeAttribute('style'); + submenu.setAttribute('aria-hidden', true); + }); + } + } + } + + /** + * Function used to init mobile menu - overlay mode + */ + function initMobileMenuOverlay() { + var menuWrapper = document.createElement('div'); + menuWrapper.classList.add(config.mobileMenuOverlayClass); + menuWrapper.classList.add(config.hiddenElementClass); + var menuContentHTML = document.querySelector(config.menuSelector).outerHTML; + menuWrapper.innerHTML = menuContentHTML; + document.body.appendChild(menuWrapper); + + // Init toggle submenus + if (config.mobileMenuExpandableSubmenus) { + wrapSubmenusIntoContainer(menuWrapper); + initToggleSubmenu(menuWrapper); + } else { + setAriaForSubmenus(menuWrapper); + } + + // Init button events + var button = document.querySelector(config.buttonSelector); + + button.addEventListener('click', function () { + var relatedContainer = document.querySelector(config.relatedContainerForOverlayMenuSelector); + menuWrapper.classList.toggle(config.hiddenElementClass); + button.classList.toggle(config.openedMenuClass); + button.setAttribute(config.ariaButtonAttribute, button.classList.contains(config.openedMenuClass)); + + if (button.classList.contains(config.openedMenuClass)) { + document.documentElement.classList.add(config.noScrollClass); + + if (relatedContainer) { + relatedContainer.classList.add(config.relatedContainerForOverlayMenuClass); + } + } else { + document.documentElement.classList.remove(config.noScrollClass); + + if (relatedContainer) { + relatedContainer.classList.remove(config.relatedContainerForOverlayMenuClass); + } + } + }); + } + + /** + * Function used to init mobile menu - sidebar mode + */ + function initMobileMenuSidebar() { + // Create menu structure + var menuWrapper = document.createElement('div'); + menuWrapper.classList.add(config.mobileMenuSidebarClass); + menuWrapper.classList.add(config.hiddenElementClass); + var menuContentHTML = ''; + + if (config.mobileMenuSidebarLogoSelector !== null) { + menuContentHTML = document.querySelector(config.mobileMenuSidebarLogoSelector).outerHTML; + } else if (config.mobileMenuSidebarLogoUrl !== null) { + menuContentHTML = '

'; + } + + menuContentHTML += document.querySelector(config.menuSelector).outerHTML; + menuWrapper.innerHTML = menuContentHTML; + + var menuOverlay = document.createElement('div'); + menuOverlay.classList.add(config.mobileMenuSidebarOverlayClass); + menuOverlay.classList.add(config.hiddenElementClass); + + document.body.appendChild(menuOverlay); + document.body.appendChild(menuWrapper); + + // Init toggle submenus + if (config.mobileMenuExpandableSubmenus) { + wrapSubmenusIntoContainer(menuWrapper); + initToggleSubmenu(menuWrapper); + } else { + setAriaForSubmenus(menuWrapper); + } + + // Menu events + menuWrapper.addEventListener('click', function (e) { + e.stopPropagation(); + }); + + menuOverlay.addEventListener('click', function () { + menuWrapper.classList.add(config.hiddenElementClass); + menuOverlay.classList.add(config.hiddenElementClass); + button.classList.remove(config.openedMenuClass); + button.setAttribute(config.ariaButtonAttribute, false); + document.documentElement.classList.remove(config.noScrollClass); + }); + + // Init button events + var button = document.querySelector(config.buttonSelector); + + button.addEventListener('click', function () { + menuWrapper.classList.toggle(config.hiddenElementClass); + menuOverlay.classList.toggle(config.hiddenElementClass); + button.classList.toggle(config.openedMenuClass); + button.setAttribute(config.ariaButtonAttribute, button.classList.contains(config.openedMenuClass)); + document.documentElement.classList.toggle(config.noScrollClass); + }); + } + + /** + * Set aria-hidden="false" for submenus + */ + function setAriaForSubmenus(menuWrapper) { + var submenus = menuWrapper.querySelectorAll(config.submenuSelector); + + for (var i = 0; i < submenus.length; i++) { + submenus[i].setAttribute('aria-hidden', false); + } + } + + /** + * Wrap all submenus into div wrappers + */ + function wrapSubmenusIntoContainer(menuWrapper) { + var submenus = menuWrapper.querySelectorAll(config.submenuSelector); + + for (var i = 0; i < submenus.length; i++) { + var submenuWrapper = document.createElement('div'); + submenuWrapper.classList.add(config.mobileMenuSubmenuWrapperClass); + submenus[i].parentNode.insertBefore(submenuWrapper, submenus[i]); + submenuWrapper.appendChild(submenus[i]); + } + } + + /** + * Initialize submenu toggle events + */ + function initToggleSubmenu(menuWrapper) { + // Init parent menu item events + var parents = menuWrapper.querySelectorAll('.' + config.parentItemClass); + + for (var i = 0; i < parents.length; i++) { + // Add toggle events + parents[i].addEventListener('click', function (e) { + e.stopPropagation(); + var submenu = this.querySelector('.' + config.mobileMenuSubmenuWrapperClass); + var content = submenu.firstElementChild; + + if (submenu.classList.contains(config.openedMenuClass)) { + var height = content.clientHeight; + submenu.style.height = height + 'px'; + + setTimeout(function () { + submenu.style.height = '0px'; + }, 0); + + setTimeout(function () { + submenu.removeAttribute('style'); + submenu.classList.remove(config.openedMenuClass); + }, config.animationSpeed); + + content.setAttribute('aria-hidden', true); + content.parentNode.firstElementChild.setAttribute('aria-expanded', false); + } else { + var height = content.clientHeight; + submenu.classList.add(config.openedMenuClass); + submenu.style.height = '0px'; + + setTimeout(function () { + submenu.style.height = height + 'px'; + }, 0); + + setTimeout(function () { + submenu.removeAttribute('style'); + }, config.animationSpeed); + + content.setAttribute('aria-hidden', false); + content.parentNode.firstElementChild.setAttribute('aria-expanded', true); + } + }); + + // Block links + var childNodes = parents[i].children; + + for (var j = 0; j < childNodes.length; j++) { + if (childNodes[j].tagName === 'A') { + childNodes[j].addEventListener('click', function (e) { + var lastClick = parseInt(this.getAttribute('data-last-click'), 10); + var currentTime = +new Date(); + + if (isNaN(lastClick)) { + e.preventDefault(); + this.setAttribute('data-last-click', currentTime); + } else if (lastClick + config.doubleClickTime <= currentTime) { + e.preventDefault(); + this.setAttribute('data-last-click', currentTime); + } else if (lastClick + config.doubleClickTime > currentTime) { + e.stopPropagation(); + closeMenu(this, true); + } + }); + } + } + } + } + + /** + * Set aria-* attributes according to the current activity state + */ + function initAriaAttributes() { + var allAriaElements = document.querySelectorAll(config.wrapperSelector + ' ' + '*[aria-hidden]'); + + for (var i = 0; i < allAriaElements.length; i++) { + var ariaElement = allAriaElements[i]; + + if ( + ariaElement.parentNode.classList.contains('active') || + ariaElement.parentNode.classList.contains('active-parent') + ) { + ariaElement.setAttribute('aria-hidden', 'false'); + ariaElement.parentNode.firstElementChild.setAttribute('aria-expanded', true); + } else { + ariaElement.setAttribute('aria-hidden', 'true'); + ariaElement.parentNode.firstElementChild.setAttribute('aria-expanded', false); + } + } + } + + /** + * Close menu on click link + */ + function initClosingMenuOnClickLink() { + var links = document.querySelectorAll(config.menuSelector + ' a'); + + for (var i = 0; i < links.length; i++) { + if (links[i].parentNode.classList.contains(config.parentItemClass)) { + continue; + } + + links[i].addEventListener('click', function (e) { + closeMenu(this, false); + }); + } + } + + /** + * Close menu + */ + function closeMenu(clickedLink, forceClose) { + if (forceClose === false) { + if (clickedLink.parentNode.classList.contains(config.parentItemClass)) { + return; + } + } + + var relatedContainer = document.querySelector(config.relatedContainerForOverlayMenuSelector); + var button = document.querySelector(config.buttonSelector); + var menuWrapper = document.querySelector('.' + config.mobileMenuOverlayClass); + + if (!menuWrapper) { + menuWrapper = document.querySelector('.' + config.mobileMenuSidebarClass); + } + + menuWrapper.classList.add(config.hiddenElementClass); + button.classList.remove(config.openedMenuClass); + button.setAttribute(config.ariaButtonAttribute, false); + document.documentElement.classList.remove(config.noScrollClass); + + if (relatedContainer) { + relatedContainer.classList.remove(config.relatedContainerForOverlayMenuClass); + } + + var menuOverlay = document.querySelector('.' + config.mobileMenuSidebarOverlayClass); + + if (menuOverlay) { + menuOverlay.classList.add(config.hiddenElementClass); + } + } + + /** + * Run menu scripts + */ + init(); +})(window.publiiThemeMenuConfig); + +// Load search input area +const searchButton = document.querySelector('.js-search-btn'); +const searchOverlay = document.querySelector('.js-search-overlay'); +const searchInput = document.querySelector('input[type="search"]'); + +if (searchButton && searchOverlay && searchInput) { + searchButton.addEventListener('click', (event) => { + event.stopPropagation(); + searchOverlay.classList.toggle('expanded'); + + if (searchOverlay.classList.contains('expanded')) { + setTimeout(() => { + searchInput.focus(); + }, 60); + } + }); + + searchOverlay.addEventListener('click', (event) => { + event.stopPropagation(); + }); + + document.body.addEventListener('click', () => { + searchOverlay.classList.remove('expanded'); + }); +} + + +// Share buttons pop-up +(function () { + // share popup + const shareButton = document.querySelector('.js-content__share-button'); + const sharePopup = document.querySelector('.js-content__share-popup'); + + if (shareButton && sharePopup) { + sharePopup.addEventListener('click', function (e) { + e.stopPropagation(); + }); + + shareButton.addEventListener('click', function (e) { + e.preventDefault(); + e.stopPropagation(); + sharePopup.classList.toggle('is-visible'); + }); + + document.body.addEventListener('click', function () { + sharePopup.classList.remove('is-visible'); + }); + } + + // link selector and pop-up window size + const Config = { + Link: ".js-share", + Width: 500, + Height: 500 + }; + + // add handler to links + const shareLinks = document.querySelectorAll(Config.Link); + shareLinks.forEach(link => { + link.addEventListener('click', PopupHandler); + }); + + // create popup + function PopupHandler(e) { + e.preventDefault(); + + const target = e.target.closest(Config.Link); + if (!target) return; + + // hide share popup + if (sharePopup) { + sharePopup.classList.remove('is-visible'); + } + + // popup position + const px = Math.floor((window.innerWidth - Config.Width) / 2); + const py = Math.floor((window.innerHeight - Config.Height) / 2); + + // open popup + const linkHref = target.href; + const popup = window.open(linkHref, "social", ` + width=${Config.Width}, + height=${Config.Height}, + left=${px}, + top=${py}, + location=0, + menubar=0, + toolbar=0, + status=0, + scrollbars=1, + resizable=1 + `); + + if (popup) { + popup.focus(); + } + } +})(); + +// Back to top +document.addEventListener('DOMContentLoaded', () => { + const backToTopButton = document.getElementById('backToTop'); + + if (backToTopButton) { + const backToTopScrollFunction = () => { + if (document.body.scrollTop > 400 || document.documentElement.scrollTop > 400) { + backToTopButton.classList.add('is-visible'); + } else { + backToTopButton.classList.remove('is-visible'); + } + }; + + const backToTopFunction = () => { + window.scrollTo({ + top: 0, + behavior: 'smooth' + }); + }; + + window.addEventListener('scroll', backToTopScrollFunction); + backToTopButton.addEventListener('click', backToTopFunction); + } +}); + + +// Responsive embeds script +(function () { + let wrappers = document.querySelectorAll('.post__video, .post__iframe'); + + for (let i = 0; i < wrappers.length; i++) { + let embed = wrappers[i].querySelector('iframe, embed, video, object'); + + if (!embed) { + continue; + } + + if (embed.getAttribute('data-responsive') === 'false') { + continue; + } + + let w = embed.getAttribute('width'); + let h = embed.getAttribute('height'); + let ratio = false; + + if (!w || !h) { + continue; + } + + if (w.indexOf('%') > -1 && h.indexOf('%') > -1) { // percentage mode + w = parseFloat(w.replace('%', '')); + h = parseFloat(h.replace('%', '')); + ratio = h / w; + } else if (w.indexOf('%') === -1 && h.indexOf('%') === -1) { // pixels mode + w = parseInt(w, 10); + h = parseInt(h, 10); + ratio = h / w; + } + + if (ratio !== false) { + let ratioValue = (ratio * 100) + '%'; + wrappers[i].setAttribute('style', '--embed-aspect-ratio:' + ratioValue); + } + } +})(); \ No newline at end of file diff --git a/assets/js/scripts.min.js b/assets/js/scripts.min.js new file mode 100755 index 0000000..333cf83 --- /dev/null +++ b/assets/js/scripts.min.js @@ -0,0 +1,32 @@ +const header=document.querySelector('.js-header');const stickyClass='sticky';let lastScrollTop=0;let isWaiting=false;window.addEventListener('scroll',()=>{if(!isWaiting){window.requestAnimationFrame(()=>{let currentScroll=window.scrollY||window.pageYOffset||document.documentElement.scrollTop;if(currentScroll>lastScrollTop){header.classList.remove(stickyClass);}else if(currentScroll0){header.classList.add(stickyClass);}else if(currentScroll<=0){header.classList.remove(stickyClass);} +lastScrollTop=currentScroll;isWaiting=false;});isWaiting=true;}},false);(function(menuConfig){var defaultConfig={mobileMenuMode:'overlay',animationSpeed:300,submenuWidth:300,doubleClickTime:500,mobileMenuExpandableSubmenus:false,isHoverMenu:true,wrapperSelector:'.navbar',buttonSelector:'.navbar__toggle',menuSelector:'.navbar__menu',submenuSelector:'.navbar__submenu',mobileMenuSidebarLogoSelector:null,mobileMenuSidebarLogoUrl:null,relatedContainerForOverlayMenuSelector:null,ariaButtonAttribute:'aria-haspopup',separatorItemClass:'is-separator',parentItemClass:'has-submenu',submenuLeftPositionClass:'is-left-submenu',submenuRightPositionClass:'is-right-submenu',mobileMenuOverlayClass:'navbar_mobile_overlay',mobileMenuSubmenuWrapperClass:'navbar__submenu_wrapper',mobileMenuSidebarClass:'navbar_mobile_sidebar',mobileMenuSidebarOverlayClass:'navbar_mobile_sidebar__overlay',hiddenElementClass:'is-hidden',openedMenuClass:'is-active',noScrollClass:'no-scroll',relatedContainerForOverlayMenuClass:'is-visible'};var config={};Object.keys(defaultConfig).forEach(function(key){config[key]=defaultConfig[key];});if(typeof menuConfig==='object'){Object.keys(menuConfig).forEach(function(key){config[key]=menuConfig[key];});} +function init(){if(!document.querySelectorAll(config.wrapperSelector).length){return;} +initSubmenuPositions();if(config.mobileMenuMode==='overlay'){initMobileMenuOverlay();}else if(config.mobileMenuMode==='sidebar'){initMobileMenuSidebar();} +initClosingMenuOnClickLink();if(!config.isHoverMenu){initAriaAttributes();}};function initSubmenuPositions(){var submenuParents=document.querySelectorAll(config.wrapperSelector+' .'+config.parentItemClass);for(var i=0;i';} +menuContentHTML+=document.querySelector(config.menuSelector).outerHTML;menuWrapper.innerHTML=menuContentHTML;var menuOverlay=document.createElement('div');menuOverlay.classList.add(config.mobileMenuSidebarOverlayClass);menuOverlay.classList.add(config.hiddenElementClass);document.body.appendChild(menuOverlay);document.body.appendChild(menuWrapper);if(config.mobileMenuExpandableSubmenus){wrapSubmenusIntoContainer(menuWrapper);initToggleSubmenu(menuWrapper);}else{setAriaForSubmenus(menuWrapper);} +menuWrapper.addEventListener('click',function(e){e.stopPropagation();});menuOverlay.addEventListener('click',function(){menuWrapper.classList.add(config.hiddenElementClass);menuOverlay.classList.add(config.hiddenElementClass);button.classList.remove(config.openedMenuClass);button.setAttribute(config.ariaButtonAttribute,false);document.documentElement.classList.remove(config.noScrollClass);});var button=document.querySelector(config.buttonSelector);button.addEventListener('click',function(){menuWrapper.classList.toggle(config.hiddenElementClass);menuOverlay.classList.toggle(config.hiddenElementClass);button.classList.toggle(config.openedMenuClass);button.setAttribute(config.ariaButtonAttribute,button.classList.contains(config.openedMenuClass));document.documentElement.classList.toggle(config.noScrollClass);});} +function setAriaForSubmenus(menuWrapper){var submenus=menuWrapper.querySelectorAll(config.submenuSelector);for(var i=0;icurrentTime){e.stopPropagation();closeMenu(this,true);}});}}}} +function initAriaAttributes(){var allAriaElements=document.querySelectorAll(config.wrapperSelector+' '+'*[aria-hidden]');for(var i=0;i{event.stopPropagation();searchOverlay.classList.toggle('expanded');if(searchOverlay.classList.contains('expanded')){setTimeout(()=>{searchInput.focus();},60);}});searchOverlay.addEventListener('click',(event)=>{event.stopPropagation();});document.body.addEventListener('click',()=>{searchOverlay.classList.remove('expanded');});} +(function(){const shareButton=document.querySelector('.js-content__share-button');const sharePopup=document.querySelector('.js-content__share-popup');if(shareButton&&sharePopup){sharePopup.addEventListener('click',function(e){e.stopPropagation();});shareButton.addEventListener('click',function(e){e.preventDefault();e.stopPropagation();sharePopup.classList.toggle('is-visible');});document.body.addEventListener('click',function(){sharePopup.classList.remove('is-visible');});} +const Config={Link:".js-share",Width:500,Height:500};const shareLinks=document.querySelectorAll(Config.Link);shareLinks.forEach(link=>{link.addEventListener('click',PopupHandler);});function PopupHandler(e){e.preventDefault();const target=e.target.closest(Config.Link);if(!target)return;if(sharePopup){sharePopup.classList.remove('is-visible');} +const px=Math.floor((window.innerWidth-Config.Width)/2);const py=Math.floor((window.innerHeight-Config.Height)/2);const linkHref=target.href;const popup=window.open(linkHref,"social",`width=${Config.Width},height=${Config.Height},left=${px},top=${py},location=0,menubar=0,toolbar=0,status=0,scrollbars=1,resizable=1`);if(popup){popup.focus();}}})();document.addEventListener('DOMContentLoaded',()=>{const backToTopButton=document.getElementById('backToTop');if(backToTopButton){const backToTopScrollFunction=()=>{if(document.body.scrollTop>400||document.documentElement.scrollTop>400){backToTopButton.classList.add('is-visible');}else{backToTopButton.classList.remove('is-visible');}};const backToTopFunction=()=>{window.scrollTo({top:0,behavior:'smooth'});};window.addEventListener('scroll',backToTopScrollFunction);backToTopButton.addEventListener('click',backToTopFunction);}});(function(){let wrappers=document.querySelectorAll('.post__video, .post__iframe');for(let i=0;i-1&&h.indexOf('%')>-1){w=parseFloat(w.replace('%',''));h=parseFloat(h.replace('%',''));ratio=h/w;}else if(w.indexOf('%')===-1&&h.indexOf('%')===-1){w=parseInt(w,10);h=parseInt(h,10);ratio=h/w;} +if(ratio!==false){let ratioValue=(ratio*100)+'%';wrappers[i].setAttribute('style','--embed-aspect-ratio:'+ratioValue);}}})(); \ No newline at end of file diff --git a/assets/js/svg-fix.js b/assets/js/svg-fix.js new file mode 100755 index 0000000..7a622a3 --- /dev/null +++ b/assets/js/svg-fix.js @@ -0,0 +1,19 @@ +// SVG map fix +(function() { + var allItems = document.querySelectorAll('use'); + + for (var i = 0; i < allItems.length; i++) { + var item = allItems[i]; + var anchor = '#' + item.getAttribute('xlink:href').split('#')[1]; + var itemData = window.publiiSvgFix[anchor]; + + if(!itemData) { + console.log('ANCHOR', anchor, i); + continue; + } + + var svgItem = item.parentNode; + svgItem.innerHTML = itemData.content; + svgItem.setAttribute('viewBox', itemData.viewbox); + } +})(); \ No newline at end of file diff --git a/assets/js/svg-map.js b/assets/js/svg-map.js new file mode 100755 index 0000000..17d62ac --- /dev/null +++ b/assets/js/svg-map.js @@ -0,0 +1,67 @@ +window.publiiSvgFix = { + + "#search": { + "viewbox": "0 0 24 24", + "content": "" + }, + "#share": { + "viewbox": "0 0 24 24", + "content": "" + }, + "#arrow-prev": { + "viewbox": "0 0 24 24", + "content": "" + }, + "#arrow-next": { + "viewbox": "0 0 24 24", + "content": "" + }, + "#toparrow": { + "viewbox": "0 0 24 24", + "content": "" + }, + "#website": { + "viewbox": "0 0 24 24", + "content": "" + }, + "#facebook": { + "viewbox": "0 0 32 32", + "content": "" + }, + "#twitter": { + "viewbox": "0 0 24 24", + "content": "" + }, + "#instagram": { + "viewbox": "0 0 32 32", + "content": "" + }, + "#linkedin": { + "viewbox": "0 0 34.48 32", + "content": "" + }, + "#vimeo": { + "viewbox": "0 0 24.999 20.159", + "content": "" + }, + "#youtube": { + "viewbox": "0 0 32 22.507", + "content": "" + }, + "#pinterest": { + "viewbox": "0 0 32 32", + "content": "" + }, + "#mix": { + "viewbox": "0 0 32 32", + "content": "" + }, + "#buffer": { + "viewbox": "0 0 32 32", + "content": "" + }, + "#whatsapp": { + "viewbox": "0 0 32 32", + "content": "" + } +}; diff --git a/assets/svg/svg-map.svg b/assets/svg/svg-map.svg new file mode 100755 index 0000000..970e16b --- /dev/null +++ b/assets/svg/svg-map.svg @@ -0,0 +1,80 @@ + diff --git a/authors/roman-tymets/index.html b/authors/roman-tymets/index.html new file mode 100644 index 0000000..25cec44 --- /dev/null +++ b/authors/roman-tymets/index.html @@ -0,0 +1,12 @@ +Author: Roman Tymets - Tymets Bau

Tymets Bau

Roman Tymets ⁽⁰⁾

\ No newline at end of file diff --git a/feed.json b/feed.json new file mode 100644 index 0000000..a05c0dd --- /dev/null +++ b/feed.json @@ -0,0 +1,13 @@ +{ + "version": "https://jsonfeed.org/version/1", + "title": "Tymets Bau", + "description": "", + "home_page_url": "https://tymetsbau.ch", + "feed_url": "https://tymetsbau.ch/feed.json", + "user_comment": "", + "author": { + "name": "Roman Tymets" + }, + "items": [ + ] +} diff --git a/feed.xml b/feed.xml new file mode 100644 index 0000000..594d274 --- /dev/null +++ b/feed.xml @@ -0,0 +1,12 @@ + + + Tymets Bau + + + 1970-01-01T01:00:00+01:00 + + Roman Tymets + + https://tymetsbau.ch + + diff --git a/index.html b/index.html new file mode 100644 index 0000000..6262dfa --- /dev/null +++ b/index.html @@ -0,0 +1,12 @@ +Professioneller Innenausbau aus einer Hand - Tymets Bau

Tymets Bau

Professioneller Innenausbau aus einer Hand

Wir sind Ihr zuverlässiger Partner für Innenausbau und Trockenbau im privaten, gewerblichen und öffentlichen Bereich.
Als Fachbetrieb realisieren wir hochwertige Innenausbau-Lösungen für Wohnungen, Einfamilienhäuser, Büros und Gewerbeobjekte – sauber, termingerecht und professionell.

Von der persönlichen Beratung über die Planung bis zur Umsetzung legen wir größten Wert auf Qualität, Präzision und Kundenzufriedenheit.
Unser Einsatzgebiet umfasst die Region Schweiz und Umgebung.

Unsere Leistungen auf einen Blick:
Innenausbau & Trockenbau
Trennwände und Decken
Bodenbeläge: Fliesen und Parkett
Dachgeschossausbau
Sanierung & Renovierung

👉 Kontaktieren Sie uns für ein unverbindliches Angebot.

Leistungen

Innenausbau & Trockenbau

Wir übernehmen komplette Innenausbauarbeiten für Neu- und Umbauten.
Dazu gehören Raumaufteilungen, Wand- und Deckensysteme sowie individuelle Lösungen im Trockenbau – funktional, langlebig und exakt auf Ihre Anforderungen abgestimmt.

Trennwände & Decken

Ob Leichtbauwände, Systemtrennwände oder abgehängte Decken:
Wir schaffen klare Strukturen, optimale Raumnutzung und ein sauberes Erscheinungsbild für Wohn- und Arbeitsräume.

Bodenbeläge – Fliesen & Parkett

Wir verlegen hochwertige Bodenbeläge für Wohn- und Gewerberäume.
Dazu zählen Fliesenarbeiten in Bad, Küche und Wohnbereich sowie die fachgerechte Verlegung von Parkett- und Holzfußböden – präzise, langlebig und optisch ansprechend.

Dachgeschossausbau

Wir verwandeln ungenutzte Dachräume in funktionalen Wohn- oder Arbeitsraum.
Von der Dämmung über die Verkleidung bis zum fertigen Ausbau erhalten Sie alle Arbeiten koordiniert aus einer Hand.

Sanierung & Renovierung

Bei Sanierungs- und Renovierungsarbeiten modernisieren wir bestehende Räume, verbessern die Nutzung und sorgen für ein zeitgemäßes Erscheinungsbild – zuverlässig, sauber und effizient umgesetzt.

Über uns

Als Fachbetrieb für Innenausbau und Trockenbau stehen wir für handwerkliche Qualität, transparente Kommunikation und eine saubere Ausführung.
Unser erfahrenes Team begleitet Ihr Projekt von der Planung bis zur Fertigstellung mit hoher Sorgfalt und fachlichem Know-how.

Warum wir?
Langjährige Erfahrung im Innenausbau
Persönliche und ehrliche Beratung
Zuverlässige Planung und Koordination
Saubere, präzise Ausführung

Unsere Projekte

Ob Einfamilienhaus, Wohnung, Bürofläche oder Gewerbeobjekt – wir haben zahlreiche Innenausbau- und Trockenbauprojekte erfolgreich umgesetzt und individuell auf die Wünsche unserer Kunden abgestimmt.

Kontakt

Sie planen einen Innenausbau, eine Renovierung oder Trockenbauarbeiten?
Wir beraten Sie gerne persönlich.

Kontaktdaten:
Telefon: 01234 567890
E-Mail: info@tymetsbau.ch
Adresse: Musterstraße 12, 12345 Musterstadt

\ No newline at end of file diff --git a/media/posts/2/banner.jpg b/media/posts/2/banner.jpg new file mode 100644 index 0000000..277169f Binary files /dev/null and b/media/posts/2/banner.jpg differ diff --git a/media/posts/2/responsive/banner-2xl.jpg b/media/posts/2/responsive/banner-2xl.jpg new file mode 100644 index 0000000..a445b69 Binary files /dev/null and b/media/posts/2/responsive/banner-2xl.jpg differ diff --git a/media/posts/2/responsive/banner-lg.jpg b/media/posts/2/responsive/banner-lg.jpg new file mode 100644 index 0000000..a445b69 Binary files /dev/null and b/media/posts/2/responsive/banner-lg.jpg differ diff --git a/media/posts/2/responsive/banner-md.jpg b/media/posts/2/responsive/banner-md.jpg new file mode 100644 index 0000000..a445b69 Binary files /dev/null and b/media/posts/2/responsive/banner-md.jpg differ diff --git a/media/posts/2/responsive/banner-sm.jpg b/media/posts/2/responsive/banner-sm.jpg new file mode 100644 index 0000000..f6599d0 Binary files /dev/null and b/media/posts/2/responsive/banner-sm.jpg differ diff --git a/media/posts/2/responsive/banner-xl.jpg b/media/posts/2/responsive/banner-xl.jpg new file mode 100644 index 0000000..a445b69 Binary files /dev/null and b/media/posts/2/responsive/banner-xl.jpg differ diff --git a/media/posts/2/responsive/banner-xs.jpg b/media/posts/2/responsive/banner-xs.jpg new file mode 100644 index 0000000..e604156 Binary files /dev/null and b/media/posts/2/responsive/banner-xs.jpg differ diff --git a/media/website/banner.jpg b/media/website/banner.jpg new file mode 100644 index 0000000..277169f Binary files /dev/null and b/media/website/banner.jpg differ diff --git a/media/website/responsive/banner-2xl.jpg b/media/website/responsive/banner-2xl.jpg new file mode 100644 index 0000000..a445b69 Binary files /dev/null and b/media/website/responsive/banner-2xl.jpg differ diff --git a/media/website/responsive/banner-lg.jpg b/media/website/responsive/banner-lg.jpg new file mode 100644 index 0000000..a445b69 Binary files /dev/null and b/media/website/responsive/banner-lg.jpg differ diff --git a/media/website/responsive/banner-md.jpg b/media/website/responsive/banner-md.jpg new file mode 100644 index 0000000..a445b69 Binary files /dev/null and b/media/website/responsive/banner-md.jpg differ diff --git a/media/website/responsive/banner-sm.jpg b/media/website/responsive/banner-sm.jpg new file mode 100644 index 0000000..f6599d0 Binary files /dev/null and b/media/website/responsive/banner-sm.jpg differ diff --git a/media/website/responsive/banner-xl.jpg b/media/website/responsive/banner-xl.jpg new file mode 100644 index 0000000..a445b69 Binary files /dev/null and b/media/website/responsive/banner-xl.jpg differ diff --git a/media/website/responsive/banner-xs.jpg b/media/website/responsive/banner-xs.jpg new file mode 100644 index 0000000..e604156 Binary files /dev/null and b/media/website/responsive/banner-xs.jpg differ diff --git a/robots.txt b/robots.txt new file mode 100644 index 0000000..d9f9e62 --- /dev/null +++ b/robots.txt @@ -0,0 +1,3 @@ +User-agent: * +Disallow: +Sitemap: https://tymetsbau.ch/sitemap.xml \ No newline at end of file diff --git a/sitemap.xml b/sitemap.xml new file mode 100644 index 0000000..ee4fa3d --- /dev/null +++ b/sitemap.xml @@ -0,0 +1,7 @@ + + + + +https://tymetsbau.ch/ + + \ No newline at end of file diff --git a/sitemap.xsl b/sitemap.xsl new file mode 100644 index 0000000..c8017a8 --- /dev/null +++ b/sitemap.xsl @@ -0,0 +1,103 @@ + + + + + + + Sitemap XML + + + + +

+ + +

This sitemap contains URLs.

+ + + + + + + + + + + + + + + + + +

URL	Images	Last Modified
+ + +	+ +	+ +

+ + + + diff --git a/tags/index.html b/tags/index.html new file mode 100644 index 0000000..c74318e --- /dev/null +++ b/tags/index.html @@ -0,0 +1,12 @@ +All tags - Tymets Bau

Tymets Bau