/* design.css is imported here rather than linked from _header.html on purpose. The platform moves
its managed Bootstrap to AFTER the theme's own tags, but keeps main.css in its
managed tail — so a linked design.css loses every base rule to Bootstrap's defaults (body font
falls back to system-ui instead of Overpass, body colour to #212529 instead of black). Importing
it from main.css puts the design system back after Bootstrap in the cascade, which is where the
old site had it. Same fix as easysystems.ch. */
@import url("design.css");
html {
position:relative;
min-height:100%;
overflow-x: hidden;
scroll-behavior: smooth;
}
body{
width: 100%;
overflow:hidden;
-webkit-font-smoothing:antialiased;
}
a,a:focus,a:hover;a:focus;a:focus-within,a:visited,button{
text-decoration:none;
outline:none;
}
/* Restore Font Awesome's own style weights.
The wizard icons are . Bootstrap's
.display-4 sets font-weight:300 and Font Awesome's .fa-duotone sets font-weight:900 — both are
single-class selectors, so specificity ties and SOURCE ORDER decides. The platform injects its
managed Bootstrap AFTER the theme's own tags (verified in the live DOM 2026-07-28:
grid-framework(0), pro.min.css(1), bootstrap.min.css(2), main.css(3)), so Bootstrap wins and
every fa-duotone icon resolved against the light-300 face — which contains no duotone glyphs,
so all five wizard questions rendered as empty "tofu" boxes.
The old EasyWeb 1.0 site never hit this because it loaded the Font Awesome kit LAST, at the very
end of . We cannot reproduce that ordering here, but main.css sits after the injected
Bootstrap, so restating FA's weights here puts them back on top.
Keep this after the design.css @import above. */
.fa-duotone, .fad { font-weight: 900; }
.fa-solid, .fas { font-weight: 900; }
.fa-regular, .far { font-weight: 400; }
.fa-light, .fal { font-weight: 300; }
.fa-thin, .fat { font-weight: 100; }
/*********/
.carousel, .carousel-inner {
height: 45vh;
}
.carousel-item {
background-color: rgb(0 0 0 / 33%) !important;
background-blend-mode: color;
background-position: center !important;
background-size: cover !important;
filter: hue-rotate(45deg);
}
/* ew-site-design */
:root {
--ew-color-primary: #0d6efd;
--ew-color-secondary: #6c757d;
--ew-color-accent: #198754;
--ew-nav-bg: #f8f9fa;
--ew-nav-text: #212529;
--ew-link-color: #0d6efd;
--ew-link-hover: #0a58ca;
--ew-heading-color: #212529;
--ew-footer-bg: #212529;
--ew-footer-text: #ffffff;
--ew-footer-link: #ffffff;
}
.text-ew-primary{color:var(--ew-color-primary)!important}.bg-ew-primary{background-color:var(--ew-color-primary)!important}.border-ew-primary{border-color:var(--ew-color-primary)!important}.text-ew-secondary{color:var(--ew-color-secondary)!important}.bg-ew-secondary{background-color:var(--ew-color-secondary)!important}.border-ew-secondary{border-color:var(--ew-color-secondary)!important}.text-ew-accent{color:var(--ew-color-accent)!important}.bg-ew-accent{background-color:var(--ew-color-accent)!important}.border-ew-accent{border-color:var(--ew-color-accent)!important}hr{border-top:solid 0.25px #0d6efd;opacity:.25;}#ewSiteFooter{background-color:var(--ew-footer-bg);color:var(--ew-footer-text);}#ewSiteFooter a,#ewSiteFooter .nav-link{color:var(--ew-footer-link);}#ewSiteFooter .ew-footer-bottom{border-top:1px solid color-mix(in srgb, var(--ew-footer-text) 18%, transparent);}#ewSiteFooter .ew-footer-nav{gap:.25rem 1rem;flex-wrap:wrap;}
#ewMainNav { background-color: var(--ew-nav-bg) !important; }
#ewMainNav .navbar-brand,#ewMainNav .nav-link { color: var(--ew-nav-text) !important; }
#ewMainNav .navbar-toggler { border-color: color-mix(in srgb, var(--ew-nav-text) 35%, transparent); }
/* /ew-site-design */
/* ew-page-styles:home */
/* /ew-page-styles:home */