.inspiratorBox .importantButtonBar { display: flex; flex-flow: row wrap; justify-content: center; align-items: stretch; align-content: flex-start; gap: 1rem;}.inspiratorBox .importantButtonBar > * { flex: 0 1 auto;}.inspiratorBox .categoryBoxWrapper { position: relative; max-width: 100%; --button-padding: 2rem; --button-size: 2rem; --background-fade-reach-inside: 1rem;}.inspiratorBox .scrollCategoriesButton { z-index: 5; display: block; position: absolute; top: 0; bottom: 0;  background-color: transparent; border: none; transition: color 0.3s ease-out; color: var(--defaulttextcolor, #ddd); display: grid; place-items: center;}.inspiratorBox .scrollCategoriesButton:focus-within:not(:active),.inspiratorBox .scrollCategoriesButton:hover:not(:active) { color: var(--maincolor, #fff);}.inspiratorBox .categoryBoxWrapper:not(.is-wide) > .scrollCategoriesButton { display: none;}.inspiratorBox .scrollCategoriesButton > i { display: block; border: 0.25rem solid currentColor; border-radius: 0.15rem; transform: rotateZ(-45deg); filter: drop-shadow(0rem 0rem 0.1rem #000) drop-shadow(0.1rem 0.1rem 0.3rem #000); width: var(--button-size, 5rem); height: var(--button-size, 5rem);}.inspiratorBox .button-scrollCategoriesToLeft > i { border-right-width: 0; border-bottom-width: 0;}.inspiratorBox .button-scrollCategoriesToRight > i { border-left-width: 0; border-top-width: 0;}.inspiratorBox .scrollCategoriesButton { padding-inline: var(--button-padding, 2rem);}.inspiratorBox .button-scrollCategoriesToLeft { left: 0;}.inspiratorBox .button-scrollCategoriesToRight { right: 0;}.inspiratorBox .scrollCategoriesButtonBackground { z-index: 3; position: absolute; top: 0; bottom: 0; width: calc(var(--button-size, 1rem) + 2 * var(--button-padding, 1rem) + var(--background-fade-reach-inside, 0rem)); pointer-events: none;}.inspiratorBox .scrollCategoriesButtonBackground[data-direction="left"] { left: 0; background: linear-gradient(-90deg, transparent, var(--inspiratorbackgroundcolor, #000) 80%);}.inspiratorBox .scrollCategoriesButtonBackground[data-direction="right"] { right: 0; background: linear-gradient(90deg, transparent, var(--inspiratorbackgroundcolor, #000) 80%);}.inspiratorBox .categoryBox { display: flex; flex-flow: row nowrap; justify-content: flex-start; justify-content: safe center; align-items: stretch; align-content: flex-start; gap: 1rem; overflow: hidden; scroll-behavior: smooth; padding: 1rem calc(var(--button-size) + 2 * var(--button-padding));}.inspiratorBox .categoryBox > * {  flex: 0 0 12rem;}.inspiratorBox .categoryEntry { background-color: var(--backcolor); transition: transform 0.3s ease-out; transform-origin: 50% 50%; transform: scale(1, 1);}.inspiratorBox .categoryEntry:hover { transform: scale(1.05, 1.05); will-change: transform;}.inspiratorBox .categoryEntryHeader { padding: 0.5rem 1rem; display: flex; flex-flow: row wrap; justify-content: space-between; align-items: baseline; align-content: flex-start; gap: 0.25rem 1rem; background-color: rgba(0, 0, 0, 0.3);}.inspiratorBox .categoryEntryHeader > * { flex: 0 1 auto; text-transform: uppercase; font-size: 0.75em; line-height: 1;}.inspiratorBox .categoryEntryHeader-isRootCategory.isRootCategory { text-shadow: 1px 0 0 currentColor; letter-spacing: 0.5px;}.inspiratorBox .categoryEntryHeader-isRootCategory.isSubCategory { opacity: 0.75;}.inspiratorBox .categoryEntryHeader-isActive.isActive { color: #3f3;}.inspiratorBox .categoryEntryHeader-isActive.isInactive { color: #f33;}.inspiratorBox .categoryImage { height: 10rem;  background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; margin-bottom: 0.25rem;}.inspiratorBox .categoryName { padding: 0.5rem 1rem; text-align: center; word-break: break-word; text-wrap: balance;}.inspiratorBox .categoryEntry,.inspiratorBox .categoryImage,.inspiratorBox .categoryName { cursor: pointer;}.inspiratorBox .categoryEntryHeader { cursor: default;}.inspiratorBox .inspiratorCodeHelper {}.inspiratorBox .inspiratorCodeHelper > .description {}.inspiratorBox .inspiratorCodeHelper > .jsCode { border: 1px solid rgba(0, 0, 0, 0.45); padding: 0.5rem; background-color: rgba(255, 255, 255, 0.05);}.inspiratorBox .inspiratorCodeHelper > .description + .jsCode { margin-top: 0.5rem;}.inspiratorBox .inspiratorCodeHelper > .jsCode + .description { margin-top: 2rem;}.inspiratorBox .categoryPathBox { display: flex; flex-flow: row wrap; justify-content: flex-start; align-items: baseline; align-content: flex-start; gap: 0.5em; font-size: 0.8em; margin-bottom: 1rem;}.inspiratorBox .categoryPathBox > * { flex: 0 1 auto;}.inspiratorBox .categoryPathBox > label::after { content: ":";}.inspiratorBox .categoryPathEntry { border: none; text-decoration: underline; cursor: pointer; transition: background-color 0.3s ease-out, color 0.3s ease-out, transform 0.3s ease-out; background-color: transparent; color: var(--defaulttextcolor); transform: scale(1, 1); will-change: transform; backface-visibility: hidden;}.inspiratorBox .categoryPathEntry:last-child { color: var(--maincolor); }.inspiratorBox .categoryPathEntry:not(:last-child) { opacity: 0.8;}.inspiratorBox .categoryPathEntry:hover { background-color: var(--text-on-maincolor); color: var(--maincolor);}.inspiratorBox .inspiratorOverlay .questionText { text-align: center; margin-bottom: 2rem;}.inspiratorBox { --inspiratorbackgroundcolor: #383838; --defaulttextcolor: #eee; --maincolor: rgb(148, 193, 30); --text-on-maincolor: #000; --backcolor: #333; --text-on-backcolor: #eee; font-family: "Open Sans", Tahoma, sans-serif; display: grid; grid-template-areas: "overlap"; place-items: stretch; width: 100%; max-width: 100%; min-height: 10rem; position: relative; background-color: var(--inspiratorbackgroundcolor, #000); color: var(--defaulttextcolor, #eee);}.inspiratorBox a { color: var(--defaulttextcolor, #eee); text-decoration: none;}.inspiratorBox > * { grid-area: overlap; padding: 0.75rem 1rem;}.inspiratorBox .categoryBoxWrapper + .inspiratorEntriesBoxWrapper { margin-top: 2rem;}.inspiratorBox .inspiratorEntriesBox { display: flex; flex-flow: row wrap; justify-content: flex-start; justify-content: safe center; align-items: stretch; align-content: flex-start; gap: 1rem;}.inspiratorBox .inspiratorEntriesBox > .inspiratorEntry {  flex: 0 0 20rem; background-color: var(--backcolor, rgba(0, 0, 0, 0.2)); transition: transform 0.3s ease-out; transform-origin: 50% 50%; transform: scale(1, 1);}@media all and (max-width: 30rem) { .inspiratorBox .inspiratorEntriesBox > .inspiratorEntry { flex: 1 1 100%; }}.inspiratorBox .inspiratorEntriesBox > a.inspiratorEntry { cursor: pointer;}.inspiratorBox .inspiratorEntriesBox > .inspiratorEntry:focus-within,.inspiratorBox .inspiratorEntriesBox > .inspiratorEntry:hover { transform: scale(1.05, 1.05); will-change: transform;}.inspiratorBox .inspiratorEntriesBox > [data-entrytype="select"] {}.inspiratorBox .inspiratorEntriesBox .inspiratorHeader { padding: 0.5rem 1rem; background-color: rgba(0, 0, 0, 0.3);}.inspiratorBox .inspiratorEntriesBox .inspiratorThumbnail { aspect-ratio: 16 / 9; min-width: 100%; max-width: 100%; object-fit: cover; object-position: center center;}.inspiratorBox .inspiratorEntriesBox .inspiratorEntryName { padding: 0.5rem 1rem; text-align: center; word-break: break-word; text-wrap: balance;}.inspiratorBox .inspiratorOverlay { position: relative; z-index: 8; background-color: var(--neutral-color_3, rgba(30, 30, 30, 0.75)); display: flex; justify-content: center; padding-block: 10vh; max-height: 80vh; overflow: auto; overflow-x: hidden; transition: opacity 0.3s ease-out; opacity: 1;}.inspiratorBox .inspiratorOverlay,.inspiratorBox .inspiratorOverlay-contents { overscroll-behavior: none;}.inspiratorBox .inspiratorOverlay.is-closing,.inspiratorBox .inspiratorOverlay:not(.active) { opacity: 0; pointer-events: none;}.inspiratorBox .inspiratorOverlay .inspiratorOverlay-inner { flex: 0 1 auto; height: fit-content; min-width: 60rem; max-width: min(94%, 60rem);  backdrop-filter: blur(10px); box-shadow: 0.1rem 0.1rem 0.5rem #0005, 0.5rem 0.5rem 3rem #0005;}.inspiratorBox .inspiratorOverlay .inspiratorOverlay-header { display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; align-content: flex-start; background-color: var(--main-color_4, rgba(255, 255, 255, 0.1));}.inspiratorBox .inspiratorOverlay .inspiratorOverlay-header > * { padding: 0.5rem 0.75rem;}.inspiratorBox .inspiratorOverlay .inspiratorOverlay-title { flex: 0 1 auto; font-size: 1.2rem; line-height: 1.25; padding-right: 0;}.inspiratorBox .inspiratorOverlay .inspiratorOverlay-button-close { flex: 0 0 auto;  background-color: rgba(0, 0, 0, 0.2); }.inspiratorBox .inspiratorOverlay .inspiratorOverlay-button-close:focus,.inspiratorBox .inspiratorOverlay .inspiratorOverlay-button-close:focus-within,.inspiratorBox .inspiratorOverlay .inspiratorOverlay-button-close:active,.inspiratorBox .inspiratorOverlay .inspiratorOverlay-button-close:hover { background-color: rgba(255, 255, 255, 0.2);}.inspiratorBox .inspiratorOverlay .inspiratorOverlay-contents { min-height: 5rem; max-height: 40vh; max-height: calc(60vh - 4rem); padding: 0.5rem 0.75rem; overflow: auto; overflow-x: hidden; background-color: var(--neutral-color_2, rgba(255, 255, 255, 0.1));}.inspiratorBox .inspiratorOverlay .important-side-info { font-weight: bold; font-style: italic;}.inspiratorBox .loadingWrapper.relativeToTop { top: 30vh;}.inspiratorBox .loadingWrapper:not(.relativeToTop) { bottom: 0; top: 0;}.inspiratorBox .loadingWrapper { position: absolute; left: 0; right: 0; display: flex; justify-content: center; align-items: center; align-content: center; transition: opacity 0.8s ease-in-out 0.3s; background-color: rgba(0, 0, 0, 0.75); opacity: 0; pointer-events: none; z-index: 10;}.inspiratorBox .loadingWrapper.show-loading,.inspiratorBox .show-loading > .loadingWrapper { transition: opacity 0.15s ease-in-out 0s; opacity: 1; pointer-events: auto;}.inspiratorBox .loadingWrapper.loadingWrapper-removingNow { transition: opacity 0.8s ease-in-out 0.3s; opacity: 0; pointer-events: none;}.inspiratorBox .loadingWrapper > .loading { flex: 0 1 auto;}.inspiratorBox .loading { background-image: url('../img/loading-v2.svg.php'); background-position: center center; background-size: contain; background-repeat: no-repeat; min-width: 100px; min-height: 100px;}.inspiratorBox > .mainUI { display: grid; grid-template-columns: 1fr; align-items: stretch; align-content: start;}.inspiratorBox > .mainUI > * {}.inspiratorBox .pagesV2,.inspiratorBox .perPageV2 { display: flex; flex-flow: row wrap; justify-content: center; align-items: center; align-content: flex-start; margin: 0.8rem 0;}.inspiratorBox .perPageV2 { justify-content: flex-end;}.inspiratorBox .pagesV2 > .label,.inspiratorBox .perPageV2 > .label { display: none; margin: 5px; color: rgba(255, 255, 255, 0.75); font-size: 1em; line-height: 1em;}.inspiratorBox .pagesV2 > .page,.inspiratorBox .perPageV2 > .perPageAmount { transition: background-color 0.15s ease-out, border-color 0.15s ease-out, color 0.15s ease-out; padding: 2px; margin: 2px; text-align: center; display: grid; place-items: center; background-color: rgba(255, 255, 255, 0.05); border: 1px solid transparent; color: #fff; cursor: pointer; font-weight: 100; min-width: 2rem; min-height: 2rem;}.inspiratorBox .perPageV2 > .perPageAmount {}.inspiratorBox .pagesV2 > .page.page-symbol { font-weight: 100;}.inspiratorBox .pagesV2 > .page:hover,.inspiratorBox .perPageV2 > .perPageAmount:hover { background-color: var(--maincolor, #ddd); color: #fff;}.inspiratorBox .pagesV2 > .page:active,.inspiratorBox .perPageV2 > .perPageAmount:active { background-color: var(--maincolor, #ddd); color: #fff;}.inspiratorBox .pagesV2 > .page.active,.inspiratorBox .perPageV2 > .perPageAmount.active { background-color: rgba(0, 0, 0, 0.5); border-color: var(--maincolor, #ddd); color: var(--maincolor, #ddd);}.inspiratorBox .feedbackWrapper { position: absolute; left: 20vw; right: 20vw; top: 1rem; z-index: 20; pointer-events: none; display: grid; grid-template-columns: 1fr; gap: 1rem;}.inspiratorBox .feedbackWrapper .feedbackEntry { pointer-events: auto; padding: 0.5rem 0.75rem; box-shadow: 0 0 2rem 0.25rem rgba(0, 0, 0, 0.75); border: 1px solid currentColor; background-color: rgba(0, 0, 0, 0.6); color: #eee; font-weight: bold; backdrop-filter: blur(10px); display: flex; flex-flow: row nowrap; justify-content: flex-start; align-items: baseline; align-content: flex-start;}.inspiratorBox .feedbackWrapper .feedbackIcon { flex: 0 0 3ch; aspect-ratio: 1; line-height: 1; border: 2px solid currentColor; border-radius: 100rem; margin-right: 1rem; display: grid; place-items: center;}.inspiratorBox .feedbackWrapper .feedbackType-success { color: #7f7;}.inspiratorBox .feedbackWrapper .feedbackType-error { color: #f33;}.inspiratorBox .feedbackWrapper .feedbackType-notice { color: #7bf;}.inspiratorBox .feedbackWrapper .feedbackText { flex: 1 1 auto; color: #eee;}.inspiratorBox .feedbackWrapper .button-removeFeedbackEntry { flex: 0 1 auto; align-self: flex-start; margin-left: auto; padding-left: 1rem;}