/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2022-02-28 16:26
 * @copyright Copyright Base4
 */
/**
 * style.less
 *
 * Template style file
 */
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2025-07-17 13:25
 * @copyright Copyright Base4
 */
/**
 * variables.less
 *
 * All CSS variables currently used
 *
 * Color conversion used for some variables:
 *
 * cfe2ff	rgba(var(--bs-primary-rgb), 0.2)
 * bacbe6	rgba(var(--bs-primary-rgb), 0.3)
 * bfd1ec	rgba(var(--bs-primary-rgb), 0.25)
 * e2e3e5	rgba(var(--bs-primary-rgb), 0.2)
 * cbccce	rgba(var(--bs-primary-rgb), 0.3)
 * d1d2d4	rgba(var(--bs-primary-rgb), 0.25)
 *
 * dfe0e1	rgba(var(--bs-dark-rgb), 0.15)
 * e5e6e7	rgba(var(--bs-dark-rgb), 0.1)
 * 373b3e	rgba(var(--bs-dark-rgb), 0.9)
 *
 * 0d6efd	rgb(var(--bs-primary-rgb))
 * 0b5ed7	rgba(var(--bs-primary-rgb), 0.9)
 * 0a58ca	rgba(var(--bs-primary-rgb), 0.95)
 * 0a53be	rgba(var(--bs-primary-rgb), 0.98)
 *
 * 86b7fe	rgba(var(--bs-primary-rgb), 0.5)
 * 0c63e4	rgb(var(--bs-primary-rgb))
 * e7f1ff	rgba(var(--bs-primary-rgb), 0.1)
 *
 * b6d4fe rgba(var(--bs-primary-rgb), 0.3)
 */
:root {
  --bs-primary-rgb: 13, 110, 253;
  --bs-secondary-rgb: 108, 117, 125;
  --bs-success-rgb: 25, 135, 84;
  --bs-info-rgb: 13, 202, 240;
  --bs-warning-rgb: 255, 193, 7;
  --bs-danger-rgb: 220, 53, 69;
  --bs-light-rgb: 248, 249, 250;
  --bs-dark-rgb: 33, 37, 41;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-body-color-rgb: 33, 37, 41;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --header-background: rgb(var(--bs-body-bg-rgb));
  --main-background: rgb(var(--bs-body-bg-rgb));
  --footer-background: rgb(var(--bs-body-bg-rgb));
  --font-family-h: var(--bs-font-sans-serif);
  --font-size-h1: calc(1.375em + 1.5vw);
  --font-size-h1-max: 2.5rem;
  --font-size-h2: calc(1.325em + 0.9vw);
  --font-size-h2-max: 2rem;
  --font-size-h3: calc(1.3em + 0.6vw);
  --font-size-h3-max: 1.75rem;
  --font-size-h4: calc(1.275em + 0.3vw);
  --font-size-h4-max: 1.5rem;
  --font-size-h5: 1.25em;
  --font-size-h6: 1em;
  --spacer: 1rem;
  --spacer-1: calc(var(--spacer) * 0.25);
  --spacer-2: calc(var(--spacer) * 0.5);
  --spacer-3: var(--spacer);
  --spacer-4: calc(var(--spacer) * 1.5);
  --spacer-5: calc(var(--spacer) * 3);
  --list-style-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIBJREFUeNrk1FEKwCAIBuDcCbrxumE7ym7gchT8tEiZvfWDD0F+IILEzGFljrA4G4JBltLqR2KpEx0PKFgWq1Tygohd8vaAH8wz8hDTwIQfLdgMTLUhdw1TbAbG2oCoimkj96iKWZaCqIpZt9xQFUOQECKiESq5LeBr7HdgHwEGAOpN1UlSrmcyAAAAAElFTkSuQmCC');
  --animation-speed: 1s;
  --zindex-behind-page: -1;
  --zindex-position-fixed: 1030;
  --zindex-consent-overlay: 1040;
  --zindex-cookie-message: 1045;
  --zindex-modal-close: 1057;
  --zindex-btn-scrolltop: 1036;
  --zindex-max: 16777271;
  --zindex-n1: -1;
  --zindex-0: 0;
  --zindex-1: 1;
  --zindex-2: 2;
  --zindex-3: 3;
}
/**
 * Make it easier to set global Bootstrap colors onto all Bootstrap objects
 * So for example when we change the primary color, also all primary buttons and hover effects etc. change
 * They can still be individually overruled by custom CSS vars settings
 */
:root {
  --bs-link-color: rgb(var(--bs-primary-rgb));
  --bs-link-hover-color: rgba(var(--bs-primary-rgb), 0.95);
}
.table-primary {
  --bs-table-bg: rgba(var(--bs-primary-rgb), 0.2);
  --bs-table-border-color: rgba(var(--bs-primary-rgb), 0.3);
  --bs-table-hover-bg: rgba(var(--bs-primary-rgb), 0.25);
}
.table-secondary {
  --bs-table-bg: rgba(var(--bs-secondary-rgb), 0.2);
  --bs-table-border-color: rgba(var(--bs-secondary-rgb), 0.3);
  --bs-table-hover-bg: rgba(var(--bs-secondary-rgb), 0.25);
}
.table-success {
  --bs-table-bg: rgba(var(--bs-success-rgb), 0.2);
  --bs-table-border-color: rgba(var(--bs-success-rgb), 0.3);
  --bs-table-hover-bg: rgba(var(--bs-success-rgb), 0.25);
}
.table-info {
  --bs-table-bg: rgba(var(--bs-info-rgb), 0.2);
  --bs-table-border-color: rgba(var(--bs-info-rgb), 0.3);
  --bs-table-hover-bg: rgba(var(--bs-info-rgb), 0.25);
}
.table-warning {
  --bs-table-bg: rgba(var(--bs-warning-rgb), 0.2);
  --bs-table-border-color: rgba(var(--bs-warning-rgb), 0.3);
  --bs-table-hover-bg: rgba(var(--bs-warning-rgb), 0.25);
}
.table-danger {
  --bs-table-bg: rgba(var(--bs-danger-rgb), 0.2);
  --bs-table-border-color: rgba(var(--bs-danger-rgb), 0.3);
  --bs-table-hover-bg: rgba(var(--bs-danger-rgb), 0.25);
}
.table-light {
  --bs-table-bg: var(--bs-light-rgb);
  --bs-table-border-color: rgba(var(--bs-light-rgb), 0.9);
  --bs-table-hover-bg: rgba(var(--bs-light-rgb), 0.95);
}
.table-dark {
  --bs-table-bg: var(--bs-dark-rgb);
  --bs-table-border-color: rgba(var(--bs-dark-rgb), 0.9);
  --bs-table-hover-bg: rgba(var(--bs-dark-rgb), 0.95);
}
.btn {
  --bs-btn-border-radius: var(--btn-border-radius, 0.375rem);
  --bs-btn-box-shadow: var(--btn-box-shadow, none);
  --bs-btn-focus-box-shadow: var(--btn-focus-box-shadow, none);
}
.btn-primary {
  --bs-btn-bg: rgb(var(--bs-primary-rgb));
  --bs-btn-border-color: rgb(var(--bs-primary-rgb));
  --bs-btn-hover-bg: rgba(var(--bs-primary-rgb), 0.9);
  --bs-btn-hover-border-color: rgba(var(--bs-primary-rgb), 0.95);
  --bs-btn-focus-shadow-rgb: --bs-light-rgb;
  --bs-btn-active-bg: rgba(var(--bs-primary-rgb), 0.95);
  --bs-btn-active-border-color: rgba(var(--bs-primary-rgb), 0.98);
  --bs-btn-disabled-bg: rgb(var(--bs-primary-rgb));
  --bs-btn-disabled-border-color: rgb(var(--bs-primary-rgb));
}
.btn-secondary {
  --bs-btn-bg: rgb(var(--bs-secondary-rgb));
  --bs-btn-border-color: rgb(var(--bs-secondary-rgb));
  --bs-btn-hover-bg: rgba(var(--bs-secondary-rgb), 0.9);
  --bs-btn-hover-border-color: rgba(var(--bs-secondary-rgb), 0.95);
  --bs-btn-focus-shadow-rgb: --bs-light-rgb;
  --bs-btn-active-bg: rgba(var(--bs-secondary-rgb), 0.95);
  --bs-btn-active-border-color: rgba(var(--bs-secondary-rgb), 0.98);
  --bs-btn-disabled-bg: rgb(var(--bs-secondary-rgb));
  --bs-btn-disabled-border-color: rgb(var(--bs-secondary-rgb));
}
.btn-success {
  --bs-btn-bg: rgb(var(--bs-success-rgb));
  --bs-btn-border-color: rgb(var(--bs-success-rgb));
  --bs-btn-hover-bg: rgba(var(--bs-success-rgb), 0.9);
  --bs-btn-hover-border-color: rgba(var(--bs-success-rgb), 0.95);
  --bs-btn-focus-shadow-rgb: --bs-light-rgb;
  --bs-btn-active-bg: rgba(var(--bs-success-rgb), 0.95);
  --bs-btn-active-border-color: rgba(var(--bs-success-rgb), 0.98);
  --bs-btn-disabled-bg: rgb(var(--bs-success-rgb));
  --bs-btn-disabled-border-color: rgb(var(--bs-success-rgb));
}
.btn-info {
  --bs-btn-bg: rgb(var(--bs-info-rgb));
  --bs-btn-border-color: rgb(var(--bs-info-rgb));
  --bs-btn-hover-bg: rgba(var(--bs-info-rgb), 0.9);
  --bs-btn-hover-border-color: rgba(var(--bs-info-rgb), 0.95);
  --bs-btn-focus-shadow-rgb: --bs-light-rgb;
  --bs-btn-active-bg: rgba(var(--bs-info-rgb), 0.95);
  --bs-btn-active-border-color: rgba(var(--bs-info-rgb), 0.98);
  --bs-btn-disabled-bg: rgb(var(--bs-info-rgb));
  --bs-btn-disabled-border-color: rgb(var(--bs-info-rgb));
}
.btn-warning {
  --bs-btn-bg: rgb(var(--bs-warning-rgb));
  --bs-btn-border-color: rgb(var(--bs-warning-rgb));
  --bs-btn-hover-bg: rgba(var(--bs-warning-rgb), 0.9);
  --bs-btn-hover-border-color: rgba(var(--bs-warning-rgb), 0.95);
  --bs-btn-focus-shadow-rgb: --bs-light-rgb;
  --bs-btn-active-bg: rgba(var(--bs-warning-rgb), 0.95);
  --bs-btn-active-border-color: rgba(var(--bs-warning-rgb), 0.98);
  --bs-btn-disabled-bg: rgb(var(--bs-warning-rgb));
  --bs-btn-disabled-border-color: rgb(var(--bs-warning-rgb));
}
.btn-danger {
  --bs-btn-bg: rgb(var(--bs-danger-rgb));
  --bs-btn-border-color: rgb(var(--bs-danger-rgb));
  --bs-btn-hover-bg: rgba(var(--bs-danger-rgb), 0.9);
  --bs-btn-hover-border-color: rgba(var(--bs-danger-rgb), 0.95);
  --bs-btn-focus-shadow-rgb: --bs-light-rgb;
  --bs-btn-active-bg: rgba(var(--bs-danger-rgb), 0.95);
  --bs-btn-active-border-color: rgba(var(--bs-danger-rgb), 0.98);
  --bs-btn-disabled-bg: rgb(var(--bs-danger-rgb));
  --bs-btn-disabled-border-color: rgb(var(--bs-danger-rgb));
}
.btn-light {
  --bs-btn-bg: rgb(var(--bs-light-rgb));
  --bs-btn-border-color: rgb(var(--bs-light-rgb));
  --bs-btn-hover-bg: rgba(var(--bs-light-rgb), 0.9);
  --bs-btn-hover-border-color: rgba(var(--bs-light-rgb), 0.95);
  --bs-btn-focus-shadow-rgb: --bs-light-rgb;
  --bs-btn-active-bg: rgba(var(--bs-light-rgb), 0.95);
  --bs-btn-active-border-color: rgba(var(--bs-light-rgb), 0.98);
  --bs-btn-disabled-bg: rgb(var(--bs-light-rgb));
  --bs-btn-disabled-border-color: rgb(var(--bs-light-rgb));
}
.btn-dark {
  --bs-btn-bg: rgb(var(--bs-dark-rgb));
  --bs-btn-border-color: rgb(var(--bs-dark-rgb));
  --bs-btn-hover-bg: rgba(var(--bs-dark-rgb), 0.9);
  --bs-btn-hover-border-color: rgba(var(--bs-dark-rgb), 0.95);
  --bs-btn-focus-shadow-rgb: --bs-light-rgb;
  --bs-btn-active-bg: rgba(var(--bs-dark-rgb), 0.95);
  --bs-btn-active-border-color: rgba(var(--bs-dark-rgb), 0.98);
  --bs-btn-disabled-bg: rgb(var(--bs-dark-rgb));
  --bs-btn-disabled-border-color: rgb(var(--bs-dark-rgb));
}
.btn-outline-primary {
  --bs-btn-color: rgb(var(--bs-primary-rgb));
  --bs-btn-border-color: rgb(var(--bs-primary-rgb));
  --bs-btn-hover-bg: rgb(var(--bs-primary-rgb));
  --bs-btn-hover-border-color: rgb(var(--bs-primary-rgb));
  --bs-btn-focus-shadow-rgb: --bs-light-rgb;
  --bs-btn-active-bg: rgb(var(--bs-primary-rgb));
  --bs-btn-active-border-color: rgb(var(--bs-primary-rgb));
  --bs-btn-disabled-color: rgb(var(--bs-primary-rgb));
  --bs-btn-disabled-border-color: rgb(var(--bs-primary-rgb));
}
.btn-outline-secondary {
  --bs-btn-color: rgb(var(--bs-secondary-rgb));
  --bs-btn-border-color: rgb(var(--bs-secondary-rgb));
  --bs-btn-hover-bg: rgb(var(--bs-secondary-rgb));
  --bs-btn-hover-border-color: rgb(var(--bs-secondary-rgb));
  --bs-btn-focus-shadow-rgb: --bs-light-rgb;
  --bs-btn-active-bg: rgb(var(--bs-secondary-rgb));
  --bs-btn-active-border-color: rgb(var(--bs-secondary-rgb));
  --bs-btn-disabled-color: rgb(var(--bs-secondary-rgb));
  --bs-btn-disabled-border-color: rgb(var(--bs-secondary-rgb));
}
.btn-outline-success {
  --bs-btn-color: rgb(var(--bs-success-rgb));
  --bs-btn-border-color: rgb(var(--bs-success-rgb));
  --bs-btn-hover-bg: rgb(var(--bs-success-rgb));
  --bs-btn-hover-border-color: rgb(var(--bs-success-rgb));
  --bs-btn-focus-shadow-rgb: --bs-light-rgb;
  --bs-btn-active-bg: rgb(var(--bs-success-rgb));
  --bs-btn-active-border-color: rgb(var(--bs-success-rgb));
  --bs-btn-disabled-color: rgb(var(--bs-success-rgb));
  --bs-btn-disabled-border-color: rgb(var(--bs-success-rgb));
}
.btn-outline-info {
  --bs-btn-color: rgb(var(--bs-info-rgb));
  --bs-btn-border-color: rgb(var(--bs-info-rgb));
  --bs-btn-hover-bg: rgb(var(--bs-info-rgb));
  --bs-btn-hover-border-color: rgb(var(--bs-info-rgb));
  --bs-btn-focus-shadow-rgb: --bs-light-rgb;
  --bs-btn-active-bg: rgb(var(--bs-info-rgb));
  --bs-btn-active-border-color: rgb(var(--bs-info-rgb));
  --bs-btn-disabled-color: rgb(var(--bs-info-rgb));
  --bs-btn-disabled-border-color: rgb(var(--bs-info-rgb));
}
.btn-outline-warning {
  --bs-btn-color: rgb(var(--bs-warning-rgb));
  --bs-btn-border-color: rgb(var(--bs-warning-rgb));
  --bs-btn-hover-bg: rgb(var(--bs-warning-rgb));
  --bs-btn-hover-border-color: rgb(var(--bs-warning-rgb));
  --bs-btn-focus-shadow-rgb: --bs-light-rgb;
  --bs-btn-active-bg: rgb(var(--bs-warning-rgb));
  --bs-btn-active-border-color: rgb(var(--bs-warning-rgb));
  --bs-btn-disabled-color: rgb(var(--bs-warning-rgb));
  --bs-btn-disabled-border-color: rgb(var(--bs-warning-rgb));
}
.btn-outline-danger {
  --bs-btn-color: rgb(var(--bs-danger-rgb));
  --bs-btn-border-color: rgb(var(--bs-danger-rgb));
  --bs-btn-hover-bg: rgb(var(--bs-danger-rgb));
  --bs-btn-hover-border-color: rgb(var(--bs-danger-rgb));
  --bs-btn-focus-shadow-rgb: --bs-light-rgb;
  --bs-btn-active-bg: rgb(var(--bs-danger-rgb));
  --bs-btn-active-border-color: rgb(var(--bs-danger-rgbrgb));
  --bs-btn-disabled-color: rgb(var(--bs-danger-rgb));
  --bs-btn-disabled-border-color: rgb(var(--bs-danger-rgb));
}
.btn-outline-light {
  --bs-btn-color: rgb(var(--bs-dark-rgb));
  --bs-btn-border-color: rgb(var(--bs-light-rgb));
  --bs-btn-hover-bg: rgb(var(--bs-light-rgb));
  --bs-btn-hover-border-color: rgb(var(--bs-light-rgb));
  --bs-btn-focus-shadow-rgb: --bs-light-rgb;
  --bs-btn-active-bg: rgb(var(--bs-light-rgb));
  --bs-btn-active-border-color: rgb(var(--bs-light-rgb));
  --bs-btn-disabled-color: rgb(var(--bs-light-rgb));
  --bs-btn-disabled-border-color: rgb(var(--bs-light-rgb));
}
.btn-outline-dark {
  --bs-btn-color: rgb(var(--bs-dark-rgb));
  --bs-btn-border-color: rgb(var(--bs-dark-rgb));
  --bs-btn-hover-bg: rgb(var(--bs-dark-rgb));
  --bs-btn-hover-border-color: rgb(var(--bs-dark-rgb));
  --bs-btn-focus-shadow-rgb: --bs-light-rgb;
  --bs-btn-active-bg: rgb(var(--bs-dark-rgb));
  --bs-btn-active-border-color: rgb(var(--bs-dark-rgb));
  --bs-btn-disabled-color: rgb(var(--bs-dark-rgb));
  --bs-btn-disabled-border-color: rgb(var(--bs-dark-rgb));
}
.dropdown-menu,
.dropdown-menu-dark {
  --bs-dropdown-link-active-bg: rgb(var(--bs-primary-rgb));
}
.nav-pills {
  --bs-nav-pills-link-active-bg: rgb(var(--bs-primary-rgb));
}
.accordion {
  --bs-accordion-btn-focus-border-color: rgba(var(--bs-primary-rgb), 0.5);
  --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-light-rgb), 0.25);
  --bs-accordion-active-color: rgb(var(--bs-primary-rgb));
  --bs-accordion-active-bg: rgba(var(--bs-primary-rgb), 0.1);
  /* @todo:later: accordion is the only one using --bs-body-color instead of --bs-body-color-rgb, can we fix this? */
  --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='var%28--bs-body-color%29'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  /* @todo:later: replace all colors in URL data, search for "fill='%23" */
  --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230c63e4'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.pagination {
  --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bg-light-rgb), 0.25);
  --bs-pagination-active-bg: rgb(var(--bs-primary-rgb));
  --bs-pagination-active-border-color: rgb(var(--bs-primary-rgb));
  --bs-pagination-bg: transparant;
  --bs-pagination-disabled-bg: transparant;
}
.alert-primary {
  --bs-alert-color: rgba(var(--bs-dark-rgb), 0.9);
  --bs-alert-bg: rgba(var(--bs-primary-rgb), 0.2);
  --bs-alert-border-color: rgba(var(--bs-primary-rgb), 0.3);
}
.alert-primary .alert-link {
  color: rgba(var(--bs-dark-rgb), 0.95);
}
.alert-secondary {
  --bs-alert-color: rgba(var(--bs-dark-rgb), 0.9);
  --bs-alert-bg: rgba(var(--bs-secondary-rgb), 0.2);
  --bs-alert-border-color: rgba(var(--bs-secondary-rgb), 0.3);
}
.alert-secondary .alert-link {
  color: rgba(var(--bs-dark-rgb), 0.95);
}
.alert-success {
  --bs-alert-color: rgba(var(--bs-dark-rgb), 0.9);
  --bs-alert-bg: rgba(var(--bs-success-rgb), 0.2);
  --bs-alert-border-color: rgba(var(--bs-success-rgb), 0.3);
}
.alert-success .alert-link {
  color: rgba(var(--bs-dark-rgb), 0.95);
}
.alert-info {
  --bs-alert-color: rgba(var(--bs-dark-rgb), 0.9);
  --bs-alert-bg: rgba(var(--bs-info-rgb), 0.2);
  --bs-alert-border-color: rgba(var(--bs-info-rgb), 0.3);
}
.alert-info .alert-link {
  color: rgba(var(--bs-dark-rgb), 0.95);
}
.alert-warning {
  --bs-alert-color: rgba(var(--bs-dark-rgb), 0.9);
  --bs-alert-bg: rgba(var(--bs-warning-rgb), 0.2);
  --bs-alert-border-color: rgba(var(--bs-warning-rgb), 0.3);
}
.alert-warning .alert-link {
  color: rgba(var(--bs-dark-rgb), 0.95);
}
.alert-danger {
  --bs-alert-color: rgba(var(--bs-dark-rgb), 0.9);
  --bs-alert-bg: rgba(var(--bs-danger-rgb), 0.2);
  --bs-alert-border-color: rgba(var(--bs-danger-rgb), 0.3);
}
.alert-danger .alert-link {
  color: rgba(var(--bs-dark-rgb), 0.95);
}
.alert-light {
  --bs-alert-color: rgba(var(--bs-dark-rgb), 0.9);
  --bs-alert-bg: rgba(var(--bs-light-rgb), 0.2);
  --bs-alert-border-color: rgba(var(--bs-light-rgb), 0.3);
}
.alert-light .alert-link {
  color: rgba(var(--bs-dark-rgb), 0.95);
}
.alert-dark {
  --bs-alert-color: rgba(var(--bs-dark-rgb), 0.9);
  --bs-alert-bg: rgba(var(--bs-dark-rgb), 0.2);
  --bs-alert-border-color: rgba(var(--bs-dark-rgb), 0.3);
}
.alert-dark .alert-link {
  color: rgba(var(--bs-dark-rgb), 0.95);
}
.progress {
  --bs-progress-bar-bg: rgb(var(--bs-primary-rgb));
}
.list-group {
  --bs-list-group-active-bg: rgb(var(--bs-primary-rgb));
  --bs-list-group-active-border-color: rgb(var(--bs-primary-rgb));
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2025-07-18 12:07
 * @copyright Copyright Base4
 */
/**
 * general.less
 *
 * General page style
 */
.animation {
  animation-duration: var(--animation-speed);
  animation-fill-mode: both;
  animation-play-state: paused;
}
.animation-play {
  animation-play-state: running;
}
.animation-skip {
  animation-direction: reverse;
  animation-play-state: paused;
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fadeIn {
  --animation-name: fadeIn;
  animation-name: var(--animation-name);
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, var(--animation-distance, 20px), 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fadeInUp {
  --animation-distance: 20px;
  --animation-name: fadeInUp;
  animation-name: var(--animation-name);
}
@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translate3d(calc(-1 * var(--animation-distance, 80%)), 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
.fadeInLeft {
  --animation-distance: 80%;
  --animation-name: fadeInLeft;
  animation-name: var(--animation-name);
}
@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translate3d(var(--animation-distance, 80%), 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
.fadeInRight {
  --animation-distance: 80%;
  --animation-name: fadeInRight;
  animation-name: var(--animation-name);
}
/**
 * STANDAARD HTML5 ELEMENTS
 */
/* Full body is hidden until this css file has loaded */
body {
  --scrollbar-width: 0px;
  --viewport-width: calc(100vw - var(--scrollbar-width));
  /* The full viewport width without scrollbars, updated by javascript on load/resize */
  opacity: 1 !important;
  overflow-y: scroll;
  /* Always show scrollbar to make sure the calculated width is always the same, for calculating negative margins */
  overflow-x: hidden;
  /* Never show scrollbar to prevent any issues with sticking out content, also for sliding in content from left or right */
}
/* On mobile, specifically never show scrollbar to prevent any issues with sticking out content */
body.responsive-xs .block > .container {
  max-width: var(--viewport-width);
  overflow-x: clip;
}
/**
 * Header font family and font sizes
 */
h1,
h2,
h3,
h4,
h5,
h6,
legend {
  overflow-wrap: break-word;
  /* To prevent long words in small containers to overflow the container */
  hyphens: auto;
  /* To allow auto break of words, can also be trigger manually with a ­ character */
  font-family: var(--font-family-h);
}
h1 {
  font-size: var(--font-size-h1);
}
h2 {
  font-size: var(--font-size-h2);
}
h3 {
  font-size: var(--font-size-h3);
}
h4 {
  font-size: var(--font-size-h4);
}
h5 {
  font-size: var(--font-size-h5);
}
h6 {
  font-size: var(--font-size-h6);
}
@media (min-width: 1200px) {
  h1 {
    font-size: var(--font-size-h1-max);
  }
  h2 {
    font-size: var(--font-size-h2-max);
  }
  h3 {
    font-size: var(--font-size-h3-max);
  }
  h4 {
    font-size: var(--font-size-h4-max);
  }
}
/**
 * Legend should be equal to h4 to make things easy
 */
legend {
  font-size: var(--font-size-h4);
  color: inherit;
}
@media (min-width: 1200px) {
  legend {
    font-size: var(--font-size-h4-max);
  }
}
/**
 * Make sure the invisble anchors are (only) visible to scripts
 */
header > a[id],
main > a[id],
footer > a[id] {
  display: block;
  height: 0;
  overflow: hidden;
}
/**
 * Style external links by adding a popup icon next to the link
 */
a[target="_blank"]::after {
  content: "\29C9";
  margin: 0 0 0 0.2em;
  display: inline-block;
  transform: rotate(90deg);
}
a[target="_blank"].d-flex::after {
  display: none;
}
.no-wcag a[target="_blank"]::after {
  display: none;
}
a[target="_blank"].no-wcag::after {
  display: none;
}
a.no-wcag {
  /* Allow in WYSIWYG editor */
}
/*
 * Use classes to create multi-column lists
 */
ul.list-columns-2 {
  column-count: 2;
}
ul.list-columns-3 {
  column-count: 3;
}
ul.list-columns-4 {
  column-count: 4;
}
/**
 * For outputting debug dumps
 */
.pre-scrollable {
  border: 1px dashed #f00;
  background-color: rgba(0, 0, 0, 0.1);
  padding: 0.4em;
  max-height: 340px;
  overflow-y: scroll;
  line-height: 0.9rem;
  font-size: 0.8rem;
  position: relative;
  z-index: 2147483600;
}
.pre-scrollable::selection {
  color: #eee;
  background: #f00;
}
/**
 * No hover cursor on inactive links
 */
a[href="javascript:;"],
a[href="#0"],
a:not([href]) {
  cursor: default;
  pointer-events: none;
}
/**
 * Allow to escape a streched link on a card
 */
.stretched-link-escape {
  z-index: 100;
  position: relative;
}
/**
 * Make default selection look good
 */
::selection {
  color: rgb(var(--bs-primary-rgb));
  background-color: rgba(var(--bs-primary-rgb), 0.1);
}
/**
 * When list group items get a specific border, make sure it ony applies to the bottom, because otherwise it would
 * appear twice as thick. This is default in bootstrap but gets overruled by applying a "border-x" class.
 */
.list-group-item.border + .list-group-item.border {
  border-top-width: 0!important;
}
/**
 * Add option to capitalize only first letter of content
 */
.text-uppercase-first:first-letter {
  text-transform: capitalize;
}
/**
 * GRID SYSTEM
 * Convert the indicated column widths to the correct library styling without using the specific library classes
 */
div[style*='--col-width:'] {
  width: 100%;
  /* Small screens always full width */
  flex: 0 0 auto;
}
@media screen and (max-width: 575px) {
  div[style*='--col-width-xs:'] {
    width: var(--col-width-xs);
  }
  div[style*='--col-width-xs:0%;'] {
    display: none;
  }
  div[style*='--col-width-xs:auto;'] {
    flex: 1 0 0;
  }
}
@media screen and (min-width: 576px) and (max-width: 767px) {
  div[style*='--col-width-sm:'] {
    width: var(--col-width-sm);
  }
  div[style*='--col-width-sm:0%;'] {
    display: none;
  }
  div[style*='--col-width-sm:auto;'] {
    flex: 1 0 0;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  div[style*='--col-width-md:'] {
    width: var(--col-width-md);
  }
  div[style*='--col-width-md:0%;'] {
    display: none;
  }
  div[style*='--col-width-md:auto;'] {
    flex: 1 0 0;
  }
}
@media screen and (min-width: 992px) and (max-width: 1199px) {
  div[style*='--col-width-lg:'] {
    width: var(--col-width-lg);
  }
  div[style*='--col-width-lg:0%;'] {
    display: none;
  }
  div[style*='--col-width-lg:auto;'] {
    flex: 1 0 0;
  }
}
@media screen and (min-width: 1200px) and (max-width: 1399px) {
  div[style*='--col-width-xl:'] {
    width: var(--col-width-xl);
  }
  div[style*='--col-width-xl:0%;'] {
    display: none;
  }
  div[style*='--col-width-xl:auto;'] {
    flex: 1 0 0;
  }
}
@media screen and (min-width: 1400px) {
  div[style*='--col-width-xxl:'] {
    width: var(--col-width-xxl);
  }
  div[style*='--col-width-xxl:0%;'] {
    display: none;
  }
  div[style*='--col-width-xxl:auto;'] {
    flex: 1 0 0;
  }
}
@media print {
  div[style*='--col-width-print:'] {
    width: var(--col-width-print);
  }
  div[style*='--col-width-print:0%;'] {
    display: none;
  }
  div[style*='--col-width-print:auto;'] {
    flex: 1 0 0;
  }
}
body {
  --container-width: var(--viewport-width);
}
@media screen and (min-width: 576px) {
  body {
    --container-width: 540px;
  }
}
@media screen and (min-width: 768px) {
  body {
    --container-width: 720px;
  }
}
@media screen and (min-width: 992px) {
  body {
    --container-width: 960px;
  }
}
@media screen and (min-width: 1200px) {
  body {
    --container-width: 1140px;
  }
}
@media screen and (min-width: 1400px) {
  body {
    --container-width: 1320px;
  }
}
/**
 * Negative auto margins to expand an item from a responsive column to the edge of the screen (left and/or right)
 * Also adding a automatic padding to correct this margin, for example when we would like to fill a background color
 * to the edge of the screen but do not want the content to be touching that edge
 */
.mx-nauto > .row {
  margin-right: 0;
  margin-left: 0;
}
.me-nauto > .row {
  margin-right: 0;
}
.ms-nauto > .row {
  margin-left: 0;
}
.me-nauto {
  margin-right: calc(-1 * ((var(--bs-gutter-x) * 0.5) + ((var(--viewport-width) - var(--container-width)) * 0.5))) !important;
}
.pe-auto {
  padding-right: calc(1 * ((var(--bs-gutter-x) * 0.5) + ((var(--viewport-width) - var(--container-width)) * 0.5))) !important;
}
.ms-nauto {
  margin-left: calc(-1 * ((var(--bs-gutter-x) * 0.5) + ((var(--viewport-width) - var(--container-width)) * 0.5))) !important;
}
.ps-auto {
  padding-left: calc(1 * ((var(--bs-gutter-x) * 0.5) + ((var(--viewport-width) - var(--container-width)) * 0.5))) !important;
}
.mx-nauto {
  margin-right: calc(-1 * ((var(--bs-gutter-x) * 0.5) + ((var(--viewport-width) - var(--container-width)) * 0.5))) !important;
  margin-left: calc(-1 * ((var(--bs-gutter-x) * 0.5) + ((var(--viewport-width) - var(--container-width)) * 0.5))) !important;
}
.px-auto {
  padding-right: calc(1 * ((var(--bs-gutter-x) * 0.5) + ((var(--viewport-width) - var(--container-width)) * 0.5))) !important;
  padding-left: calc(1 * ((var(--bs-gutter-x) * 0.5) + ((var(--viewport-width) - var(--container-width)) * 0.5))) !important;
}
@media screen and (max-width: 575px) {
  .me-nauto {
    margin-right: calc(-1 * (var(--bs-gutter-x) * 0.5)) !important;
  }
  .pe-auto {
    padding-right: calc(1 * (var(--bs-gutter-x) * 0.5)) !important;
  }
  .ms-nauto {
    margin-left: calc(-1 * (var(--bs-gutter-x) * 0.5)) !important;
  }
  .ps-auto {
    padding-left: calc(1 * (var(--bs-gutter-x) * 0.5)) !important;
  }
  .mx-nauto {
    margin-right: calc(-1 * (var(--bs-gutter-x) * 0.5)) !important;
    margin-left: calc(-1 * (var(--bs-gutter-x) * 0.5)) !important;
  }
  .px-auto {
    padding-right: calc(1 * (var(--bs-gutter-x) * 0.5)) !important;
    padding-left: calc(1 * (var(--bs-gutter-x) * 0.5)) !important;
  }
}
/**
 * Negative margin (as they are also optionally available in Bootstrap)
 */
.m-n1 {
  margin: -0.25rem !important;
}
.m-n2 {
  margin: -0.5rem !important;
}
.m-n3 {
  margin: -1rem !important;
}
.m-n4 {
  margin: -1.5rem !important;
}
.m-n5 {
  margin: -3rem !important;
}
.mx-n1 {
  margin-right: -0.25rem !important;
  margin-left: -0.25rem !important;
}
.mx-n2 {
  margin-right: -0.5rem !important;
  margin-left: -0.5rem !important;
}
.mx-n3 {
  margin-right: -1rem !important;
  margin-left: -1rem !important;
}
.mx-n4 {
  margin-right: -1.5rem !important;
  margin-left: -1.5rem !important;
}
.mx-n5 {
  margin-right: -3rem !important;
  margin-left: -3rem !important;
}
.my-n1 {
  margin-top: -0.25rem !important;
  margin-bottom: -0.25rem !important;
}
.my-n2 {
  margin-top: -0.5rem !important;
  margin-bottom: -0.5rem !important;
}
.my-n3 {
  margin-top: -1rem !important;
  margin-bottom: -1rem !important;
}
.my-n4 {
  margin-top: -1.5rem !important;
  margin-bottom: -1.5rem !important;
}
.my-n5 {
  margin-top: -3rem !important;
  margin-bottom: -3rem !important;
}
.mt-n1 {
  margin-top: -0.25rem !important;
}
.mt-n2 {
  margin-top: -0.5rem !important;
}
.mt-n3 {
  margin-top: -1rem !important;
}
.mt-n4 {
  margin-top: -1.5rem !important;
}
.mt-n5 {
  margin-top: -3rem !important;
}
.me-n1 {
  margin-right: -0.25rem !important;
}
.me-n2 {
  margin-right: -0.5rem !important;
}
.me-n3 {
  margin-right: -1rem !important;
}
.me-n4 {
  margin-right: -1.5rem !important;
}
.me-n5 {
  margin-right: -3rem !important;
}
.mb-n1 {
  margin-bottom: -0.25rem !important;
}
.mb-n2 {
  margin-bottom: -0.5rem !important;
}
.mb-n3 {
  margin-bottom: -1rem !important;
}
.mb-n4 {
  margin-bottom: -1.5rem !important;
}
.mb-n5 {
  margin-bottom: -3rem !important;
}
.ms-n1 {
  margin-left: -0.25rem !important;
}
.ms-n2 {
  margin-left: -0.5rem !important;
}
.ms-n3 {
  margin-left: -1rem !important;
}
.ms-n4 {
  margin-left: -1.5rem !important;
}
.ms-n5 {
  margin-left: -3rem !important;
}
/**
 * CUSTOM CLASSES
 */
/**
 * Make sure when using cols-auto there is not only one item per row because of large images of long text/titles
 * Also make sure there is at least some width so items will not be so small that they are barely (in)visible
 */
.row-cols-auto > * {
  max-width: 18.5rem;
  min-width: 4rem;
}
/**
 * Always select the focus on the whole input group, not yust the single field
 */
.input-group:focus-within {
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
  border-radius: 0.25rem;
}
.form-control:focus {
  border-color: var(--bs-gray-400);
  box-shadow: none;
}
/**
 * Always select the focus on the whole input group, not yust the single field
 */
.form-check-input:checked {
  background-color: rgb(var(--bs-primary-rgb));
  border-color: rgb(var(--bs-primary-rgb));
}
/**
 * When there is a link in an active dropdown item, it should be white
 */
.dropdown-item.active a,
.dropdown-item:active a {
  color: var(--color-white);
}
.alert,
.alert > :nth-last-child(1),
.alert.alert-dismissible > :nth-last-child(2) {
  margin-bottom: 0;
}
.card {
  background-color: transparent;
}
.card > * > div:nth-last-child(1) {
  margin-bottom: 0;
}
/* Make sure the image fits within the card even when a larger size is set */
.card img[width][height] {
  max-width: 100%;
  height: auto !important;
}
.card.rounded-0 .card-img,
.card.rounded-0 .card-img-top {
  --bs-card-inner-border-radius: 0;
}
.card-body:empty {
  display: none;
}
.card-header + .card-img-top,
.card-header + picture > .card-img-top {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.card:has(.card-footer) .card-img-bottom {
  /* "has()" will only work on very new browsers, but for now there is no alternative */
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.text-justify {
  text-align: justify;
  text-justify: inter-word;
}
.card-footer:empty,
.card-text:empty {
  display: none;
}
/**
 * Star rating design
 */
.stars {
  --star-color: rgb(var(--bs-success-rgb));
  --star-background: rgb(var(--bs-white-rgb));
  --star-stroke: 0.5;
  --percent: calc(var(--rating) / 5 * 100%);
  display: inline-block;
  font-family: Times;
  /* make sure ★ appears correctly */
  line-height: 1;
}
.stars::before {
  content: '★★★★★';
  letter-spacing: calc(4px + 2px * var(--star-stroke));
  background: linear-gradient(90deg, var(--star-color) var(--percent), var(--star-background) var(--percent));
  background-position: right calc(2px + 2px * var(--star-stroke)) center;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: calc(1px * var(--star-stroke)) var(--star-color);
}
.rating-current {
  font-weight: bold;
}
.rating-max::before {
  content: "/";
}
.rating-total::before {
  content: " - ";
}
/**
 * Loader modal should be smaller when there is no text and horizontal and vertically centered
 */
.modal-small-square .modal-content {
  width: auto;
}
#loader .modal-dialog {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100% - 3.5rem);
}
#loader .modal-dialog .modal-body span {
  vertical-align: text-top;
}
#loader .modal-dialog .modal-body img:first-child {
  padding-right: var(--spacer-3);
  padding-left: var(--spacer-3);
}
/**
 * Text color and position over carousel should be determined by the template settings, not by CSS
 */
.carousel-caption,
.carousel-dark .carousel-caption {
  color: inherit;
  width: fit-content;
}
/**
 * Carousel in header (middle) should have larger title (and description)
 */
header .loc-center .carousel-caption h5 {
  font-size: var(--font-size-h2);
}
header .loc-center .carousel-caption p {
  font-size: var(--font-size-h5);
}
@media (min-width: 1200px) {
  header .loc-center .carousel-caption h5 {
    font-size: var(--font-size-h2-max);
  }
  header .loc-center .carousel-caption p {
    font-size: var(--font-size-h5-max);
  }
}
/**
 * Carousel text indent should be higher by default, otherwise the text is still on the screen
 * If there would be any text, the style should be taken from the parent becasue we coudl set the general carousel
 * text alignment or color there
 */
.carousel-indicators [data-bs-target] {
  text-indent: -200vw;
  text-align: inherit;
  color: inherit;
}
/**
 * Default button style (for buttons without style)
 */
.btn-default {
  --bs-btn-color: inherit;
  --bs-btn-border-color: var(--bs-gray-400);
}
.btn-check:active + .btn-default,
.btn-check:checked + .btn-default,
.btn-default.active,
.btn-default.dropdown-toggle.show,
.btn-default:active {
  --bs-btn-color: inherit;
  --bs-btn-bg: var(--bs-gray-200);
  --bs-btn-border-color: var(--bs-gray-400);
}
.btn-check:focus + .btn-default,
.btn-default:focus {
  --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(108, 117, 125, 0.5);
}
.btn-default:hover,
.btn-default:first-child:hover,
:not(.btn-check) + .btn-default:hover {
  --bs-btn-color: inherit;
  --bs-btn-hover-bg: var(--bs-gray-200);
  --bs-btn-hover-border-color: var(--bs-gray-400);
}
/**
 * Scroll to top button
 * Will be shown automatically when scrolling down
 */
.btn-scrolltop {
  background-color: rgb(var(--bs-body-bg-rgb));
  transition: opacity 0.2s;
  opacity: 0.8;
  content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='var%28--bs-body-color%29'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  transform: scaleY(-1);
  /* Flip the image */
  padding: var(--spacer-2);
  position: fixed;
  bottom: var(--spacer-4);
  right: var(--spacer-4);
  z-index: var(--zindex-btn-scrolltop);
  width: 32px;
  height: 32px;
  border-radius: 0.375rem;
}
.btn-scrolltop:active,
.btn-scrolltop:hover {
  opacity: 1;
}
/**
 * Bootstrap Collapse elements with peek option, to show first few lines even when collapsed
 */
.btn-collapse-peek {
  --bs-btn-border-radius: 0;
  --bs-btn-border-width: 0;
  --bs-btn-border-color: var(--bs-gray-400);
  border-bottom: 1px solid var(--bs-btn-border-color);
  background-color: transparent;
  background: linear-gradient(0, rgba(var(--element-color-back, var(--bs-body-bg-rgb)), 1) 0%, rgba(var(--element-color-back, var(--bs-body-bg-rgb)), 0) 100%);
  transform: translateY(-100%);
  width: 100%;
  height: 0;
  margin-bottom: 1rem;
  color: var(--bs-btn-color);
}
.btn-collapse-peek > * {
  position: relative;
  bottom: -1rem;
  padding: 1rem;
}
.btn-collapse-peek:hover span,
.btn-collapse-peek:hover svg {
  transform: none !important;
}
.btn-collapse-peek:hover,
.btn-collapse-peek:first-child:hover,
:not(.btn-check) + .btn-collapse-peek:hover {
  background-color: transparent;
  background: linear-gradient(0, rgba(var(--element-color-back, var(--bs-body-bg-rgb)), 1) 0%, rgba(var(--element-color-back, var(--bs-body-bg-rgb)), 0) 100%);
  border-bottom: 1px solid var(--bs-btn-border-color);
}
.btn-collapse-peek:focus {
  box-shadow: none;
}
.collapse-peek {
  --peek-size: 10em;
  min-height: var(--peek-size);
  padding-bottom: 2em;
}
.collapse-peek:not(.show) {
  display: block;
  height: var(--peek-size);
  overflow: hidden;
}
.collapsing + a[data-bs-toggle="collapse"] .text-collapse-shown,
.collapse + a[data-bs-toggle="collapse"] .text-collapse-shown {
  display: none;
}
.collapse.show + a[data-bs-toggle="collapse"] .text-collapse-shown {
  display: inline;
}
.collapse.show + a[data-bs-toggle="collapse"] .text-collapse-hidden {
  display: none;
}
/**
 * Bootstrap list-group-limit to show only first few lines initially, and alow to extend with button click
 */
.btn-list-group-limit {
  --bs-btn-border-radius: 0;
  --bs-btn-border-width: 0;
  --bs-btn-border-color: var(--bs-gray-400);
  border-bottom: 1px solid var(--bs-btn-border-color);
  background-color: transparent;
  background: linear-gradient(0, rgba(var(--element-color-back, var(--bs-body-bg-rgb)), 1) 0%, rgba(var(--element-color-back, var(--bs-body-bg-rgb)), 0) 100%);
  transform: translateY(-100%);
  width: 100%;
  height: 0;
  margin-bottom: 1rem;
  color: var(--bs-btn-color);
}
.btn-list-group-limit > * {
  position: relative;
  bottom: -1rem;
  padding: 1rem;
}
.btn-list-group-limit:hover span,
.btn-list-group-limit:hover svg {
  transform: none !important;
}
.btn-list-group-limit:hover,
.btn-list-group-limit:first-child:hover,
:not(.btn-check) + .btn-list-group-limit:hover {
  background-color: transparent;
  background: linear-gradient(0, rgba(var(--element-color-back, var(--bs-body-bg-rgb)), 1) 0%, rgba(var(--element-color-back, var(--bs-body-bg-rgb)), 0) 100%);
  border-bottom: 1px solid var(--bs-btn-border-color);
}
.btn-list-group-limit:focus {
  box-shadow: none;
}
.list-group-limit {
  --limit-size: 3;
  --padding-bottom: 0em;
  overflow: auto;
  max-height: calc(var(--padding-bottom) + var(--limit-size) * calc(var(--bs-list-group-item-padding-y) + var(--bs-list-group-item-padding-y) + calc(var(--bs-body-line-height) * var(--bs-body-font-size))));
  transition: max-height 0.2s ease-in-out;
  padding-bottom: var(--padding-bottom);
}
[data-limit-collapsed] .list-group-limit {
  --padding-bottom: 1em;
}
[data-limit-collapsed="true"] .btn-list-group-limit .text-limit-shown {
  display: none;
}
[data-limit-collapsed="false"] .btn-list-group-limit .text-limit-shown {
  display: inline;
}
[data-limit-collapsed="true"] .btn-list-group-limit .text-limit-hidden {
  display: inline;
}
[data-limit-collapsed="false"] .btn-list-group-limit .text-limit-hidden {
  display: none;
}
/* Apply custom list check image */
ul.list-checks:not(.list-unstyled) {
  list-style: none;
}
ul.list-checks:not(.list-unstyled) li:not(.list-unstyled) {
  position: relative;
}
ul.list-checks:not(.list-unstyled) li:not(.list-unstyled):before {
  position: absolute;
  display: block;
  content: '\2022';
  /* bullet point, for screen readers */
  text-indent: -999999px;
  /* move the bullet point out of sight */
  left: -1.5em;
  width: 1em;
  /* desired width of the image */
  height: 1.5em;
  /* unrelated to image height; this is so it gets snipped */
  background-repeat: no-repeat;
  background-image: var(--list-style-image);
  background-size: 1em;
  background-position: 0 0.3em;
}
/* When on dark background, make sure image is inverted */
[style*="--element-color-back:"][style*="--element-color-front:"] ul.list-checks li:before {
  filter: invert();
}
/**
 * Show the consent overlay
 */
/* All divs with consent should by default have relative positioning, otherwise the consent overlay might not work correct */
/* Alwyas use the first DIV in the entity div, because the entity div might have different positioning (for example sticky-top) */
div[id^="item"][class^="entity-"] > div,
div[id^="item"][class*=" entity-"] > div,
div[data-consent],
div[data-consent] .tab-pane {
  position: relative;
}
.consent-overlay {
  --element-color-back-opacity: 0.9;
  --element-color-border-opacity: 0.2;
  position: absolute;
  background-color: rgba(var(--bs-white-rgb), var(--element-color-back-opacity));
  z-index: var(--zindex-consent-overlay);
  border: 1px dotted rgba(var(--bs-black-rgb), var(--element-color-border-opacity));
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.consent-overlay .consent-container {
  padding: var(--spacer-3);
}
/* When there are multiple button (accept or decline), split them with some margin */
.consent-overlay .consent-container .btn {
  margin-bottom: var(--spacer-2);
  margin-right: var(--spacer-2);
}
.consent-overlay .consent-container .btn:last-child {
  margin-right: 0;
}
/**
 * By default keep icon small, after loading the actual item it will be reset to the correct size
 * This is done because the icons and style (size) are laoded with AJAX so initially on the first
 * pageload there might be a large empty space visible for a short moment wherever there should be
 * an icon
 */
svg[class] {
  width: 1em;
  height: 1em;
}
/**
 * All entities will have a default z-index, this can then be overruled later
 */
div[id^="item"][class^="entity-"] {
  z-index: 10;
  z-index: 11;
}
/**
 * Allow to disable animation for specific links
 */
a.no-animation {
  /* Allow in WYSIWYG editor */
}
a.no-animation:hover > svg:last-child,
a.no-animation:hover > span:last-child svg,
a:hover svg.no-animation {
  transform: none !important;
}
/* Pagination */
.pagination .page-link:hover {
  background-color: transparent;
}
/**
 * .mw-100 = "max-width:100%", but "min-width:100%" is not available in BS5, so we add it here
 */
.min-w-100 {
  min-width: 100%;
}
.min-h-100 {
  min-height: 100%;
}
.max-vw-100 {
  max-width: var(--viewport-width);
}
/**
 * Z-index basic values to stack elements on top of one another
 */
.z-n1 {
  z-index: var(--zindex-n1);
}
.z-0 {
  z-index: var(--zindex-0);
}
.z-1 {
  z-index: var(--zindex-1);
}
.z-2 {
  z-index: var(--zindex-2);
}
.z-3 {
  z-index: var(--zindex-3);
}
/**
 * Hide the colorbox titlebar when it is empty
 */
#cboxTitle:empty {
  display: none !important;
}
/**
 * No outline for colorbox, sometimes does not work with some templates
 */
#colorbox *,
#colorbox {
  outline: 0 !important;
}
/**
* Added support for a double range bar
* Extended HTML5 range with start/end dragging slider
* @todo: @bug: does not work perfect yet in firefox, only able to drag the second/top slider, not the first one
 */
.range-double-container {
  position: relative;
}
.range-double {
  position: absolute;
  width: 100%;
  height: calc(var(--spacer-3) * 2);
  overflow: hidden;
  cursor: pointer;
  outline: none;
}
.range-double-end {
  position: relative;
}
.range-double,
.range-double::-webkit-slider-runnable-track,
.range-double::-webkit-slider-thumb {
  -webkit-appearance: none;
  background: none;
}
.range-double::-moz-range-track {
  -webkit-appearance: none;
  background: none;
}
.range-double::-webkit-slider-runnable-track {
  height: calc(var(--spacer-3) * 0.5);
  background: rgba(var(--bs-dark-rgb), 0.2);
  border-radius: var(--spacer-3);
}
.range-double::-moz-range-track {
  height: calc(var(--spacer-3) * 0.5);
  background: rgba(var(--bs-dark-rgb), 0.2);
  border-radius: var(--spacer-3);
}
.range-double-end::-webkit-slider-runnable-track {
  background: none;
}
.range-double-end::-moz-range-track {
  background: none;
}
.range-double::-webkit-slider-thumb {
  position: relative;
  height: var(--spacer-3);
  width: var(--spacer-3);
  margin-top: calc(-0.25 * var(--spacer-3));
  border-radius: var(--spacer-3);
  z-index: 1;
  background: rgb(var(--bs-primary-rgb));
}
.range-double::-moz-range-thumb {
  position: relative;
  height: var(--spacer-3);
  width: var(--spacer-3);
  margin-top: calc(-0.25 * var(--spacer-3));
  border-radius: var(--spacer-3);
  z-index: 1;
  background: rgb(var(--bs-primary-rgb));
}
.range-double-end::-webkit-slider-thumb {
  z-index: 2;
}
.range-double-end::-moz-range-thumb {
  z-index: 2;
}
.range-content-end {
  float: right;
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2022-11-03 13:03
 * @copyright Copyright Base4
 */
/**
 * colors.less
 *
 * Color definitions
 */
header {
  background-color: var(--header-background);
}
main {
  background-color: var(--main-background);
}
footer {
  background-color: var(--footer-background);
}
/**
 * Colors based on variables
 */
[style*="--element-color-back:"] {
  background-color: rgba(var(--element-color-back), var(--element-color-back-opacity, 1));
}
[style*="--element-color-front:"] {
  color: rgba(var(--element-color-front), var(--element-color-front-opacity, 1));
}
[style*="--element-color-border:"] {
  border-color: rgba(var(--element-color-border), var(--element-color-border-opacity, 1)) !important;
}
/**
 * Correct default colors for links
 */
[style*="--element-color-front:"] a:not(.btn) {
  color: inherit;
}
[style*="--element-color-front:"] a:active:not(.btn),
[style*="--element-color-front:"] a.active:not(.btn),
[style*="--element-color-front:"] a:focus:not(.btn),
[style*="--element-color-front:"] a:hover:not(.btn) {
  color: rgba(var(--element-color-front), var(--element-color-front-opacity, 1));
}
[style*="--element-color-back:"] a:not([style*="--element-color-back:"]):not(.btn) {
  background-color: transparent;
}
/**
 * Correct color for links and pills
 @todo add more options (all from bootstrap, later when available)
 */
.nav-link[style*="--element-color-front:"] {
  color: rgba(var(--element-color-front), var(--element-color-front-opacity, 1));
}
.nav-pills .nav-link[style*="--element-color-back:"].active,
.nav-tabs .nav-link[style*="--element-color-back:"].active,
.nav-pills .show > .nav-link[style*="--element-color-back:"],
.nav-tabs .show > .nav-link[style*="--element-color-back:"] {
  background-color: rgba(var(--element-color-back), var(--element-color-back-opacity, 1));
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2024-05-19 02:08
 * @copyright Copyright Base4
 */
/**
 * entities.less
 */
/**
 * Filter for master sub (with filter and categories)
 */
.entity-view-master-sub > .card {
  margin-bottom: var(--spacer-3);
}
.entity-view-master-sub .card-header {
  font-size: unset;
}
.entity-view-master-sub .card-body .list-group {
  margin-left: calc(-1 * var(--bs-card-spacer-x));
  margin-right: calc(-1 * var(--bs-card-spacer-x));
  border-radius: 0;
}
.entity-view-master-sub .list-group .list-group-item {
  border: none;
  background-color: inherit;
}
.entity-view-master-sub a {
  color: inherit;
}
.entity-view-master-sub a h4,
.entity-view-master-sub a h5 {
  padding-right: var(--bs-card-cap-padding-x);
}
.entity-view-master-sub a h4:before,
.entity-view-master-sub a h5:before {
  content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='var%28--bs-body-color%29'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  position: absolute;
  right: var(--bs-card-cap-padding-x);
  width: 0.5em;
  height: 1.5em;
}
.entity-view-master-sub a.collapsed h4:before,
.entity-view-master-sub a.collapsed h5:before {
  transform: scaleY(-1);
  /* Flip the image */
}
.entity-view-master-sub .filter-search .input-group {
  margin-top: var(--spacer-3);
}
/**
 * Master view
 */
.entity-view-master-main > .view-header {
  margin-bottom: var(--spacer-3);
}
/*
 * Add all default entity styles
 */
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2024-05-29 15:29
 * @copyright Copyright Base4
 */
/**
 * entities/article.less
 *
 * Basic style for single entity
 */
.entity-article {
  /* Split consecutive buttons by some margin (on bottom), for when buttons are wrapped to the next line */
  /* Apply custom list image */
  /* When article on dark background, make sure image is inverted */
  /* Article is only for when texts are actually used for content (more than just one image or two words) */
}
.entity-article .btn {
  margin-bottom: var(--spacer-1);
}
.entity-article ul:not(.list-unstyled) {
  list-style: none;
}
.entity-article ul:not(.list-unstyled) li:not(.list-unstyled) {
  position: relative;
}
.entity-article ul:not(.list-unstyled) li:not(.list-unstyled):before {
  position: absolute;
  display: block;
  content: '\2022';
  /* bullet point, for screen readers */
  text-indent: -999999px;
  /* move the bullet point out of sight */
  left: -1.5em;
  width: 1em;
  /* desired width of the image */
  height: 1.5em;
  /* unrelated to image height; this is so it gets snipped */
  background-repeat: no-repeat;
  background-image: var(--list-style-image);
  background-size: 1em;
  background-position: 0 0.3em;
}
.entity-article [style*="--element-color-front:var(--bs-white"] ul li:before,
.entity-article [style*="--element-color-front:var(--bs-light"] ul li:before,
.entity-article [style*="--element-color-back:"][style*="--element-color-front:"] ul li:before {
  filter: invert();
}
.entity-article p:last-child {
  margin-bottom: 0;
}
.entity-article article,
.entity-article.article {
  /* Add some margin to images in text */
}
.entity-article article img,
.entity-article.article img {
  max-width: 100%;
  /* Make sure they do not overflow the article */
}
.entity-article article img[style*="float: left"],
.entity-article.article img[style*="float: left"],
.entity-article article img[style*="float:left"],
.entity-article.article img[style*="float:left"] {
  margin-right: var(--spacer-2);
}
.entity-article article img[style*="float: right"],
.entity-article.article img[style*="float: right"],
.entity-article article img[style*="float:right"],
.entity-article.article img[style*="float:right"] {
  margin-left: var(--spacer-2);
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2022-03-15 09:23
 * @copyright Copyright Base4
 */
/**
 * entities/breadcrumb.less
 *
 * Basic style for single entity
 */
.entity-breadcrumb .breadcrumb {
  margin-bottom: 0;
}
.entity-breadcrumb .breadcrumb .breadcrumb-item::before,
.entity-breadcrumb .breadcrumb .breadcrumb-item.active {
  color: inherit;
}
.entity-breadcrumb .breadcrumb-prefix + .breadcrumb-item {
  --bs-breadcrumb-divider: "\00A0" !important;
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2024-11-21 23:32
 * @copyright Copyright Base4
 */
/**
 * entities/catalog.less
 *
 * Basic style for single entity
 */
.entity-catalogview .price-container span:not(.price-noprice) {
  white-space: nowrap;
}
.entity-catalogview .price-container .price-container-info,
.entity-catalogview .price-container .price-container-info span {
  white-space: normal;
}
.entity-catalogview .price-container .price-price,
.entity-catalogview .price-container .price-discount,
.entity-catalogview .price-container .price-tax,
.entity-catalogview .price-container .price-excise[data-value="0"],
.entity-catalogview .price-container .price-container-sell .price-discountpercentage,
.entity-catalogview .price-container .price-discountpercentage[data-value="0"],
.entity-catalogview .price-container .price-taxpercentage,
.entity-catalogview .price-container .price-excisepercentage {
  display: none;
}
.entity-catalogview .price-container .price-discount span:before,
.entity-catalogview .price-container .price-discountpercentage span:before {
  content: '-';
}
.entity-catalogview .price-container.price-has-sale .price-container-single .price-container-sell span {
  text-decoration: line-through;
}
.entity-catalogview .price-container.price-has-sale .price-container-single .price-container-sell svg {
  margin-left: 0.5em;
  font-size: 75%;
}
.entity-catalogview .price-container.price-has-sale .price-container-single .price-container-sell svg[data-bs-title=""] {
  display: none;
}
.entity-catalogview .price-container .price-container-info .price-info-invat,
.entity-catalogview .price-container .price-container-info .price-info-exvat {
  display: none;
}
.entity-catalogview .price-container.price-show-invat .price-total-exvat {
  display: none;
}
.entity-catalogview .price-container.price-show-invat .price-container-info .price-info-exvatpercentage {
  display: none;
}
.entity-catalogview .price-container.price-show-exvat .price-total-invat {
  display: none;
}
.entity-catalogview .price-container.price-show-exvat .price-container-info .price-info-invatpercentage {
  display: none;
}
.entity-catalogview .entity-view-master-main .view-categories {
  padding-bottom: var(--spacer-3);
  margin-bottom: var(--spacer-3);
}
.entity-catalogview .entity-view-master-main .view-items .versions-container .btn {
  margin-right: var(--spacer-1);
  margin-bottom: var(--spacer-1);
}
.entity-catalogview .entity-view-master-sub .view-filter-color-values .btn {
  margin-right: var(--spacer-2);
  margin-bottom: var(--spacer-2);
  --bs-btn-font-size: 0;
  --bs-btn-padding-x: 0;
  --bs-btn-padding-y: 0;
  --bs-btn-border-color: #fff;
  --bs-btn-hover-border-color: #fff;
  --bs-btn-active-border-color: #fff;
  --bs-btn-border-width: 1px;
  width: calc(2 * var(--bs-body-font-size));
  height: calc(2 * var(--bs-body-font-size));
  -webkit-box-shadow: 0 0 0 2px transparent;
  -moz-box-shadow: 0 0 0 2px transparent;
  box-shadow: 0 0 0 2px transparent;
}
.entity-catalogview .entity-view-master-sub .view-filter-color-values .btn[style*="--bs-btn-bg:#FFFFFF"] {
  --bs-btn-border-color: var(--bs-gray-400);
}
.entity-catalogview .entity-view-master-sub .view-filter-color-values .btn[style*="--bs-btn-bg:transparent"] {
  background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8"%3F><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path d="M0 0h8v16h8V8H0z" opacity=".08"/></svg>');
}
.entity-catalogview .entity-view-master-sub .view-filter-color-values .btn:hover,
.entity-catalogview .entity-view-master-sub .view-filter-color-values .btn:active,
.entity-catalogview .entity-view-master-sub .view-filter-color-values .btn.active {
  -webkit-box-shadow: 0 0 0 2px var(--bs-dark);
  -moz-box-shadow: 0 0 0 2px var(--bs-dark);
  box-shadow: 0 0 0 2px var(--bs-dark);
}
.entity-catalogview .entity-view-detail .view-media figcapture {
  display: block;
}
.entity-catalogview .entity-view-detail .view-configurable .form-check [data-value="0"] span {
  display: none;
}
.entity-catalogview.entity-catalogview-catalog-search .autocomplete {
  --aa-primary-color-rgb: var(--element-color-front, --bs-body-color-rgb) !important;
  --aa-primary-color-alpha: var(--element-color-front-opacity, 1) !important;
  --aa-text-color-rgb: var(--element-color-front) !important;
  --aa-text-color-alpha: var(--element-color-front-opacity, 1) !important;
}
.entity-catalogview.entity-catalogview-catalog-search .autocomplete .aa-Label svg,
.entity-catalogview.entity-catalogview-catalog-search .aa-LoadingIndicator svg {
  color: rgba(var(--aa-primary-color-rgb), var(--aa-primary-color-alpha));
}
.entity-catalogview.entity-catalogview-catalog-search .aa-Form[focus-within],
.entity-catalogview.entity-catalogview-catalog-search .aa-Form:focus-within {
  border-color: rgba(var(--aa-primary-color-rgb), 1);
  box-shadow: rgba(var(--aa-primary-color-rgb), 0.1) 0 0 0 2px, inset rgba(var(--aa-primary-color-rgb), 0.1) 0 0 0 2px;
}
.view-modal .modal-title:first-letter {
  text-transform: capitalize;
}
.view-modal .price-container[data-value="0"] {
  display: none;
}
.view-modal .price-container span:not(.price-noprice) {
  white-space: nowrap;
}
.view-modal .price-container span.price-container-info {
  white-space: normal;
}
.view-modal .price-container .price-price {
  display: none;
}
:root {
  --aa-panel-max-height: 33vh !important;
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2022-01-20 15:19
 * @copyright Copyright Base4
 */
/**
 * entities/iframe.less
 *
 * Basic style for single entity
 */
.entity-iframe {
  font-size: 0;
}
.entity-iframe > div {
  font-size: 1rem;
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2024-11-06 17:19
 * @copyright Copyright Base4
 */
/**
 * entities/imagelist.less
 *
 * Basic style for single entity
 */
.entity-imagelist {
  padding: 0.01px;
  /* Styling for a carousel slider of cards */
}
.entity-imagelist figure {
  margin: 0;
}
.entity-imagelist .figure-img {
  margin-bottom: 0;
}
.entity-imagelist p:empty,
.entity-imagelist h5:empty,
.entity-imagelist .figure-caption:empty {
  display: none;
}
.entity-imagelist.entity-imagelist-cards-carousel > div > .container-fluid {
  overflow-x: hidden;
}
.entity-imagelist.entity-imagelist-cards-carousel > div > .container-fluid > .card-carousel {
  --col-count: 1;
  --col-count-sm: 1;
  --col-count-md: 1;
  --col-count-lg: 1;
  --col-count-xl: 1;
  --col-count-xxl: 1;
  flex-wrap: nowrap;
  overflow-x: scroll;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  /* Firefox */
  -ms-overflow-style: none;
  /* IE 10+ */
}
.entity-imagelist.entity-imagelist-cards-carousel > div > .container-fluid > .card-carousel::-webkit-scrollbar {
  background: transparent;
  /* Chrome/Safari/Webkit */
  width: 0;
}
.entity-imagelist.entity-imagelist-cards-carousel > div > .container-fluid > .card-carousel > * {
  width: calc(100% / var(--col-count));
  flex: none;
  scroll-snap-align: center start;
}
@media (min-width: 576px) {
  .entity-imagelist.entity-imagelist-cards-carousel > div > .container-fluid > .card-carousel > * {
    width: calc(100% / var(--col-count-sm));
  }
}
@media (min-width: 786px) {
  .entity-imagelist.entity-imagelist-cards-carousel > div > .container-fluid > .card-carousel > * {
    width: calc(100% / var(--col-count-md));
  }
}
@media (min-width: 992px) {
  .entity-imagelist.entity-imagelist-cards-carousel > div > .container-fluid > .card-carousel > * {
    width: calc(100% / var(--col-count-lg));
  }
}
@media (min-width: 1200px) {
  .entity-imagelist.entity-imagelist-cards-carousel > div > .container-fluid > .card-carousel > * {
    width: calc(100% / var(--col-count-xl));
  }
}
@media (min-width: 1400px) {
  .entity-imagelist.entity-imagelist-cards-carousel > div > .container-fluid > .card-carousel > * {
    width: calc(100% / var(--col-count-xxl));
  }
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2022-10-18 11:17
 * @copyright Copyright Base4
 */
/**
 * entities/infolist.less
 */
.entity-infolist.entity-infolist-accordion .accordion-header img {
  padding-right: var(--spacer-2);
  max-height: 2em;
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2022-10-18 11:17
 * @copyright Copyright Base4
 */
/**
 * entities/localeselect.less
 *
 * Basic style for single entity
 */
.entity-localeselect img {
  margin-top: -3px;
  max-height: 1em;
  margin-right: var(--spacer-2);
  image-rendering: pixelated;
}
.entity-localeselect .dropdown-toggle img {
  margin-top: 0;
}
.entity-localeselect a > picture:last-child img,
.entity-localeselect a > img:last-child {
  display: block;
  margin-right: auto;
  margin-left: auto;
  max-height: 1.5em;
}
.entity-localeselect .list-group-item {
  background-color: transparent;
}
.entity-localeselect .list-group-item.active {
  background-color: var(--bs-gray-500);
}
.entity-localeselect .dropdown-menu {
  min-width: 100%;
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2024-03-24 14:50
 * @copyright Copyright Base4
 */
/**
 * entities/loginform.less
 *
 * Basic style for single entity
 */
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2022-03-11 17:09
 * @copyright Copyright Base4
 */
/**
 * entities/map.less
 *
 * Basic style for single entity
 */
.entity-map .googlemap {
  min-height: 12em;
}
.entity-map .gm-style,
.entity-map .adp,
.entity-map .adp table {
  font-family: inherit !important;
}
.entity-map img.adp-marker,
.entity-map img.adp-marker2 {
  margin: 5px 10px 5px 5px;
}
.entity-map .adp-directions {
  width: 100%;
}
@media print {
  .entity-map .googlemap,
  .entity-map .input-group {
    display: none;
  }
  .entity-map img.adp-marker,
  .entity-map img.adp-marker2 {
    display: none;
  }
  .entity-map .adp-placemark {
    width: 100%;
    border: none;
    font-weight: bold;
  }
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2025-07-17 13:25
 * @copyright Copyright Base4
 */
/**
 * entities/menu.less
 *
 * Basic style for single entity
 */
.entity-menu .btn + .btn,
.entity-menu .btn + .btn-group,
.entity-menu .btn-group + .btn,
.entity-menu .btn-group + .btn-group {
  margin-left: var(--spacer-1);
}
.entity-menu .btn img,
.entity-menu .dropdown-item img {
  max-height: 1em;
}
.entity-menu .btn picture + span,
.entity-menu .btn img + span,
.entity-menu .dropdown-item picture + span,
.entity-menu .dropdown-item img + span {
  margin-left: var(--spacer-1);
}
@media (max-width: 575.98px) {
  .entity-menu .navbar-expand-sm {
    max-height: 100vh;
    overflow: auto;
  }
}
@media (max-width: 767.98px) {
  .entity-menu .navbar-expand-md {
    max-height: 100vh;
    overflow: auto;
  }
}
@media (max-width: 991.98px) {
  .entity-menu .navbar-expand-lg {
    max-height: 100vh;
    overflow: auto;
  }
}
@media (max-width: 1199.98px) {
  .entity-menu .navbar-expand-xl {
    max-height: 100vh;
    overflow: auto;
  }
}
@media (max-width: 1399.98px) {
  .entity-menu .navbar-expand-xxl {
    max-height: 100vh;
    overflow: auto;
  }
}
.entity-menu ul {
  list-style: none;
}
.entity-menu .navbar {
  --bs-navbar-color: var(--bs-body-color);
}
.entity-menu .nav-link img,
.entity-menu .nav-item img {
  margin-top: -3px;
  max-height: 1em;
  margin-right: var(--spacer-2);
}
.entity-menu .navbar-nav :active > img,
.entity-menu .navbar-nav :active > picture img,
.entity-menu .navbar-nav .active > img,
.entity-menu .navbar-nav .active > picture img {
  filter: invert();
}
.entity-menu .navbar-brand {
  min-width: 3rem;
}
.entity-menu .navbar-brand:empty {
  display: none;
}
.entity-menu .navbar-toggler .navbar-toggler-closed {
  display: none;
}
.entity-menu .navbar-toggler.collapsed .navbar-toggler-closed {
  display: inline;
}
.entity-menu .navbar-toggler.collapsed .navbar-toggler-opened {
  display: none;
}
.entity-menu .navbar-nav .nav-link {
  padding-right: var(--spacer-2);
  padding-left: var(--spacer-2);
}
.entity-menu .navbar-nav .dropdown-menu ul {
  min-width: 10rem;
  padding: var(--spacer-2) 0;
  margin: 0;
  font-size: 1rem;
}
.entity-menu .navbar-nav .dropdown {
  position: static;
}
.entity-menu .navbar-nav .dropdown .dropdown-menu {
  top: calc(100% - 1rem);
  left: auto;
}
@media (min-width: 767.98px) {
  .entity-menu .navbar-nav .dropdown .dropdown-menu {
    max-width: 12rem;
  }
}
.entity-menu .navbar-nav .dropdown .dropdown-menu.dropdown-menu-large {
  left: 0;
  max-width: 100%;
}
.entity-menu .btn-toolbar > .btn,
.entity-menu .btn-toolbar > .btn-group {
  margin-right: var(--spacer-1);
  margin-bottom: var(--spacer-1);
}
.entity-menu .btn-toolbar > .btn:last-child,
.entity-menu .btn-toolbar > .btn-group:last-child {
  margin-right: 0;
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2022-11-18 14:07
 * @copyright Copyright Base4
 */
/**
 * entities/newsview.less
 *
 * Basic style for single entity
 */
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2023-12-24 10:34
 * @copyright Copyright Base4
 */
/**
 * entities/shopcart.less
 *
 * Basic style for single entity
 */
.entity-shopcart .shopcart-price-total[data-value="0"] {
  display: none !important;
}
.entity-shopcart .shopcart-count[data-value="0"] {
  display: none !important;
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2024-12-16 22:48
 * @copyright Copyright Base4
 */
/**
 * entities/shoporder.less
 *
 * Basic style for single entity
 */
.entity-shoporder {
  /* Hide the dropdown arrow on select field */
  /* Not on Safari because it is already hidden there */
}
@supports not (-webkit-touch-callout: none) {
  .entity-shoporder span:has(select.btn) {
    display: inline-block;
    overflow: hidden;
  }
  .entity-shoporder span:has(select.btn) select.btn {
    border: 0;
    margin-right: -16px;
    /* Firefox needs 19px, Edge/Chrome could do with 16px */
  }
  .entity-shoporder span:has(select.btn) select.btn:focus-visible,
  .entity-shoporder span:has(select.btn) select.btn:focus {
    outline: none;
    box-shadow: none;
  }
}
.entity-shoporder .shoporder-shipping label:not("col-*"),
.entity-shoporder .shoporder-payment label:not("col-*") {
  width: 100%;
}
.entity-shoporder .shoporder-line[data-entity="trip"] .shoporder-line-count select {
  display: none;
}
.entity-shoporder .shoporder-line .shoporder-sublines span:after {
  content: ', ';
}
.entity-shoporder .shoporder-back {
  display: none;
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2022-02-28 16:26
 * @copyright Copyright Base4
 */
/**
 * entities/videolist.less
 *
 * Basic style for single entity
 */
.entity-videolist video {
  object-fit: cover;
}
.entity-videolist figure {
  margin: 0;
}
.entity-videolist .figure-img {
  margin-bottom: 0;
}
.entity-videolist .figure-caption:empty {
  display: none;
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2022-11-25 09:49
 * @copyright Copyright Base4
 */
/**
 * entities/webform.less
 *
 * Basic style for single entity
 */
.entity-webform .form-floating {
  width: 100%;
  min-width: 10em;
  overflow: hidden;
}
.entity-webform .form-floating > .form-label {
  white-space: nowrap;
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2022-10-19 11:16
 * @copyright Copyright Base4
 */
/**
 * locations.less
 *
 * Style for all locations on page
 */
/**
 * Make all following blocks have a lower z-index than the previous one to allow
 * dropdown menu`s and ther content to float over them instead of under them
 * header and footer will always be above content
 * Inside footer, the overlap is different because dropdowns will drop-up there
 */
header {
  z-index: 50;
}
header .loc-h-1 {
  z-index: 59;
}
header .loc-h-2 {
  z-index: 58;
}
header .loc-h-3 {
  z-index: 57;
}
main {
  z-index: 10;
}
main .loc-m-1 {
  z-index: 39;
}
main .loc-m-2 {
  z-index: 38;
}
main .loc-m-3 {
  z-index: 37;
}
main .loc-m-4 {
  z-index: 36;
}
main .loc-m-5 {
  z-index: 35;
}
main .loc-m-6 {
  z-index: 34;
}
main .loc-m-7 {
  z-index: 33;
}
main .loc-m-8 {
  z-index: 32;
}
footer {
  z-index: 40;
}
footer .loc-f-1 {
  z-index: 41;
}
footer .loc-f-2 {
  z-index: 42;
}
footer .loc-f-3 {
  z-index: 43;
}
/**
 * To make the page loader flow over all content while loading.
 * And position all content in the vertical middle. Horizontal center should be done in content, can easily be achieved.
 */
.loc-s-1 {
  width: 100vw;
  min-height: 100vh;
  background-color: rgb(var(--bs-body-bg-rgb));
  position: fixed;
  z-index: var(--zindex-max);
}
.loc-s-1-a {
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
}
/**
 * The popover content shall not create a horizontal scrollbar
 * With this we could use negative margins so the content will run fully to the edge of the popup (ie. a video or image)
 */
.loc-s-3 .modal-body {
  overflow-x: hidden;
}
/**
 * The popover close button should go over the content
 */
.loc-s-3 .popover-close {
  z-index: var(--zindex-modal-close);
  background-color: rgb(var(--bs-body-bg-rgb));
}
/**
 * Cookie message
 */
.loc-s-6 {
  position: fixed;
  z-index: var(--zindex-cookie-message);
  bottom: var(--spacer-4);
  width: 60vw;
  margin-left: calc(50% - 30vw);
  background-color: var(--bs-body-bg);
  /* Add a background because the cookie message alert in it might be (semi-)transparent */
  border-radius: 0.375rem;
  /* Equal to alert in it */
}
@media screen and (max-width: 575.98px) {
  .loc-s-6 {
    width: 80vw;
    margin-left: 1vw;
  }
}
/*
 * @author D. Tiems (info-at-dennistiems-dot-com)
 * @version 2021-06-02 19:01
 * @copyright Copyright Base4
 */
/**
 * print.less
 *
 * Print style
 */
@media print {
  .block {
    width: 100%;
    margin: 0;
    padding: 0 0 1cm 0;
    height: auto;
  }
  .cboxOverlay {
    display: none !important;
  }
  /* When popover is open, print that content only, not the rest of the page */
  .loc-s-3 {
    width: 100vw;
    max-width: none;
    height: 100%;
    margin: 0;
  }
  /* Do not show links after header and footer content */
  header a[href]:after,
  footer a[href]:after {
    content: "";
  }
}
@page {
  /* Minimal margin for every printer */
  margin: 13mm 13mm 13mm 13mm;
  /* Keep texts nice combined on every page */
  orphans: 4;
  widows: 2;
}