/* Auto-generated CSS Module: global | ISO: de_DE */
/* --- Source: nl_NL / 01-a-reset.css --- */
/* templates/nl_NL/css/global/01-a-reset.css */
/* 
   =============================================================
   HTML RESETS & BASE TYPOGRAPHY
   =============================================================
*/
* { padding: 0; margin: 0; }
html {
  font-size: 62.5%;
  overflow-y: scroll;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
} 
body { margin: 0; background-color: #fff; font-family: Arial,sans-serif; color: #103e5f; font-size: 12px; line-height: 1.4; }
ol, ul { list-style: none; }
img { border: 0; -ms-interpolation-mode: bicubic; }
hr, legend { display: none; }
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; }
audio:not([controls]) { display: none; }
table { border-collapse: collapse; border-spacing: 0; }
fieldset { border: 0; display: block; }
a { outline: 0; text-decoration: none; color: inherit; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

/* Base Form Resets */
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; }
button, input { line-height: normal; }
button, input[type=button], input[type=reset], input[type=submit] { cursor: pointer; -webkit-appearance: button; }
input[type=checkbox], input[type=radio] { box-sizing: border-box; padding: 0; }
input[type=search] { -webkit-appearance: textfield; box-sizing: content-box; }
textarea { overflow: auto; vertical-align: top; width: 100%; line-height: 16px; font-size: 12px; margin: 0 0 2px 0; border: 1px solid #b0b0b0; color: #48b; font-weight: 700; border-radius: 4px; padding: 4px 6px; box-sizing: border-box; background: #fff; box-shadow: inset 0 2px 8px rgba(0,0,0,.3); }

input[type=email], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], select {
  font-size: 11px; margin: 0 0 2px 0; border: 1px solid #b0b0b0; color: #48b; font-weight: 700; border-radius: 4px; padding: 4px 6px; width: 100%; box-sizing: border-box; background: #fff; box-shadow: inset 0 2px 8px rgba(0,0,0,.3);
}
input[type=password]:focus, input[type=text]:focus { border: 1px solid #000; }
select { display: block; width: 100%; }
input.sendInput { padding: 5px; font-family: Arial,sans-serif; border: 1px solid #cdcdcd; color: #ababab; box-shadow: none; }

/* Typography */
p { margin-bottom: 15px; }
p:last-child { margin-bottom: 0; }
p a { color: #840000; text-decoration: underline; }
address { font-style: normal; }
blockquote { color: #8dbb0c; font-style: italic; margin: 0 0 10px 0; }
i { font-style: normal; }
small { font-size: 11px; }

h1, h2, h3, h4, h5, h6 { font-weight: 400; }
h1.afterSpace, h2.afterSpace, h3.afterSpace, h4.afterSpace, h5.afterSpace, h6.afterSpace { margin-bottom: 15px; }
h1 { font-size: 30px; line-height: 30px; }
h2 { font-size: 24px; }
h3 { font-size: 20px; }
h4 { font-size: 18px; }
h5 { font-size: 16px; }
h6 { font-size: 14px; }

/* Global structural resets */
.clearfix { clear: both; }
.errorblock .inside { color: black; }
.errorblock .inside ul { margin-top:10px;margin-bottom:0px; font-size:14px; padding-left:20px; list-style:disc; }

/* --- Source: nl_NL / 01-b-grid.css --- */
/* templates/nl_NL/css/global/01-b-grid.css */
/* 
   =============================================================
   CORE CSS GRID SYSTEM
   =============================================================
*/
.grid { margin-left: auto; margin-right: auto; position: relative; }
.grid:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
* html .grid { zoom: 1; }
:first-child + html .grid { zoom: 1; }

.grid.debug { outline: 1px dotted red; }
.grid.debug > aside, .grid.debug > div, .grid.debug > footer, .grid.debug > header, .grid.debug > section { outline: 1px dotted red; }

.grid.gridMain .gridSpan3 { width: 210px; margin: 0; padding: 10px 0 10px 10px; z-index: 200000; }
.grid.gridMain .gridSpan9 { width: 745px; margin: 0; padding: 10px 10px 10px 5px; opacity: 1; transition: opacity .2s; z-index: 100; }

.grid > .gridSpan1, .grid > .gridSpan10, .grid > .gridSpan11, .grid > .gridSpan12, .grid > .gridSpan2, .grid > .gridSpan3, .grid > .gridSpan4, .grid > .gridSpan5, .grid > .gridSpan6, .grid > .gridSpan7, .grid > .gridSpan8, .grid > .gridSpan9 {
  position: relative; float: left; margin-left: 2%; margin-right: 0;
}
.grid .gridSpan1:first-child, .grid .gridSpan2:first-child, .grid .gridSpan3:first-child, .grid .gridSpan4:first-child, .grid .gridSpan5:first-child, .grid .gridSpan6:first-child, .grid .gridSpan7:first-child, .grid .gridSpan8:first-child, .grid .gridSpan9:first-child, .grid .gridSpan10:first-child, .grid .gridSpan11:first-child, .grid .gridSpan12:first-child { margin-left: 0; }
.grid .gridSpan1.first, .grid .gridSpan2.first, .grid .gridSpan3.first, .grid .gridSpan4.first, .grid .gridSpan5.first, .grid .gridSpan6.first, .grid .gridSpan7.first, .grid .gridSpan8.first, .grid .gridSpan9.first, .grid .gridSpan10.first, .grid .gridSpan11.first, .grid .gridSpan12.first { margin-left: 0; }

.grid .gridSpan1 { width: 6.5%; }
.grid .gridSpan2 { width: 15%; }
.grid .gridSpan3 { width: 23.5%; }
.grid .gridSpan4 { width: 32%; }
.grid .gridSpan5 { width: 40.5%; }
.grid .gridSpan6 { width: 49%; }
.grid .gridSpan7 { width: 57.5%; }
.grid .gridSpan8 { width: 66%; }
.grid .gridSpan9 { width: 74.5%; }
.grid .gridSpan10 { width: 83%; }
.grid .gridSpan11 { width: 91%; }
.grid .gridSpan12 { width: 100%; }

.gridMove1 { margin-left: 9.5%; } .gridMove1:first-child { margin-left: 8.5%; }
.gridMove2 { margin-left: 18%; } .gridMove2:first-child { margin-left: 17%; }
.gridMove3 { margin-left: 26.5%; } .gridMove3:first-child { margin-left: 25.5%; }
.gridMove4 { margin-left: 35%; } .gridMove4:first-child { margin-left: 34%; }
.gridMove5 { margin-left: 43.5%; } .gridMove5:first-child { margin-left: 42.5%; }
.gridMove6 { margin-left: 52%; } .gridMove6:first-child { margin-left: 51%; }
.gridMove7 { margin-left: 60.5%; } .gridMove7:first-child { margin-left: 59.5%; }
.gridMove8 { margin-left: 69%; } .gridMove8:first-child { margin-left: 68%; }
.gridMove9 { margin-left: 77.5%; } .gridMove9:first-child { margin-left: 76.5%; }
.gridMove10 { margin-left: 86%; } .gridMove10:first-child { margin-left: 85%; }
.gridMove11 { margin-left: 94.5%; } .gridMove11:first-child { margin-left: 93.5%; }

.grid.noGutter > .gridSpan1, .grid.noGutter > .gridSpan2, .grid.noGutter > .gridSpan3, .grid.noGutter > .gridSpan4, .grid.noGutter > .gridSpan5, .grid.noGutter > .gridSpan6, .grid.noGutter > .gridSpan7, .grid.noGutter > .gridSpan8, .grid.noGutter > .gridSpan9, .grid.noGutter > .gridSpan10, .grid.noGutter > .gridSpan11, .grid.noGutter > .gridSpan12 { margin-left: 0; margin-right: 0; }
.grid.noGutter > .gridSpan1 { width: 8.333%; }
.grid.noGutter > .gridSpan2 { width: 16.666%; }
.grid.noGutter > .gridSpan3 { width: 24.999%; }
.grid.noGutter > .gridSpan4 { width: 33.332%; }
.grid.noGutter > .gridSpan5 { width: 41.665%; }
.grid.noGutter > .gridSpan6 { width: 49.998%; }
.grid.noGutter > .gridSpan7 { width: 58.331%; }
.grid.noGutter > .gridSpan8 { width: 66.664%; }
.grid.noGutter > .gridSpan9 { width: 74.997%; }
.grid.noGutter > .gridSpan10 { width: 83.33%; }
.grid.noGutter > .gridSpan11 { width: 91.663%; }
.grid.noGutter > .gridSpan12 { width: 100%; }

/* Grid specific responsive breakpoints */
@media (min-width: 1024px) {
    .grid.gridMain { display: flex !important; }
    .grid.gridMain .gridSpan3 { flex-shrink: 0; }
    .grid.gridMain .gridSpan9 { flex: 1; }
}

@media (max-width: 1024px) {
    .gridSpan9 { max-width: 100%; box-sizing: border-box; overflow: hidden; width: 745px!important; padding-right: 0!important; padding-left: 0!important; }
    .gridSpan3 { display: block!important; height: 0!important; padding: 0!important; margin: 0!important; }
}

@media (max-width: 768px) {
    .boxProductSection > section > .grid { display: flex; box-sizing: border-box; margin: 0; flex-wrap: wrap; width: 100%; justify-content: center; }
    .boxProductSection > section > .grid .gridSpan6 { width: 50%; max-width: 50%; flex: 1 1 0%; box-sizing: border-box; }
    .gridSpan6.inf { padding-top: 0; }
    gridspan6.img .productInfo { padding-top: 0; }
}

@media (max-width: 600px) {
    .boxProductSection .gridSpan6 { width: 100%; min-width: 100%; }
}

/* --- Source: nl_NL / 01-c-utilities.css --- */
/* templates/nl_NL/css/global/01-c-utilities.css */
/* 
   =============================================================
   POSITIONING, VISIBILITY & TYPOGRAPHY UTILITIES
   =============================================================
*/

/* Positioning */
.floatLeft { float: left; }
.floatRight { float: right; }
.marginAuto { margin-left: auto; margin-right: auto; }
.alignLeft { text-align: left; }
.alignRight { text-align: right; }
.alignCenter { text-align: center; }
.alignJustify { text-align: justify; }
.alignTop { vertical-align: top; }
.alignMiddle { vertical-align: middle; }
.alignBottom { vertical-align: bottom; }

/* Margins */
.noPush { margin: 0; }
.pushLeft { margin-left: 10px; } .pushLeftGrand { margin-left: 50px; } .pushLeftHeavy { margin-left: 40px; } .pushLeftGreater { margin-left: 30px; } .pushLeftBase { margin-left: 20px; } .pushLeftLesser { margin-left: 15px; } .pushLeftLight { margin-left: 10px; } .pushLeftMinimal { margin-left: 5px; }
.pushRight { margin-right: 10px; } .pushRightGrand { margin-right: 50px; } .pushRightHeavy { margin-right: 40px; } .pushRightGreater { margin-right: 30px; } .pushRightBase { margin-right: 20px; } .pushRightLesser { margin-right: 15px; } .pushRightLight { margin-right: 10px; } .pushRightMinimal { margin-right: 5px; }
.pushTop { margin-top: 10px; } .pushTopGrand { margin-top: 50px; } .pushTopHeavy { margin-top: 40px; } .pushTopGreater { margin-top: 30px; } .pushTopBase { margin-top: 20px; } .pushTopLesser { margin-top: 15px; } .pushTopLight { margin-top: 10px; } .pushTopMinimal { margin-top: 5px; }
.pushBottom { margin-bottom: 10px; } .pushBottomGrand { margin-bottom: 50px; } .pushBottomHeavy { margin-bottom: 40px; } .pushBottomGreater { margin-bottom: 30px; } .pushBottomBase { margin-bottom: 20px; } .pushBottomLesser { margin-bottom: 15px; } .pushBottomLight { margin-bottom: 10px; } .pushBottomMinimal { margin-bottom: 5px; }

/* Positioning pull */
.noPull { top: 0; }
.pullLeft { position: relative; left: -10px; } .pullLeftGrand { position: relative; left: -50px; } .pullLeftHeavy { position: relative; left: -40px; } .pullLeftGreater { position: relative; left: -30px; } .pullLeftBase { position: relative; left: -20px; } .pullLeftLesser { position: relative; left: -15px; } .pullLeftLight { position: relative; left: -10px; } .pullLeftMinimal { position: relative; left: -5px; }
.pullRight { position: relative; right: -10px; } .pullRightGrand { position: relative; right: -50px; } .pullRightHeavy { position: relative; right: -40px; } .pullRightGreater { position: relative; right: -30px; } .pullRightBase { position: relative; right: -20px; } .pullRightLesser { position: relative; right: -15px; } .pullRightLight { position: relative; right: -10px; } .pullRightMinimal { position: relative; right: -5px; }
.pullTop { position: relative; top: -10px; } .pullTopGrand { position: relative; top: -50px; } .pullTopHeavy { position: relative; top: -40px; } .pullTopGreater { position: relative; top: -30px; } .pullTopBase { position: relative; top: -20px; } .pullTopLesser { position: relative; top: -15px; } .pullTopLight { position: relative; top: -10px; } .pullTopMinimal { position: relative; top: -5px; }
.pullBottom { position: relative; bottom: -10px; } .pullBottomGrand { position: relative; bottom: -50px; } .pullBottomHeavy { position: relative; bottom: -40px; } .pullBottomGreater { position: relative; bottom: -30px; } .pullBottomBase { position: relative; bottom: -20px; } .pullBottomLesser { position: relative; bottom: -15px; } .pullBottomLight { position: relative; bottom: -10px; } .pullBottomMinimal { position: relative; bottom: -5px; }

/* Absolute Positioning */
.posBottomRight { position: absolute!important; bottom: 0; right: 0; z-index: 100; }
.posBottomLeft { position: absolute!important; bottom: 0; left: 0; z-index: 100; }
.posTopRight { position: absolute!important; top: 0; right: 0; z-index: 100; }
.posTopLeft { position: absolute!important; top: 0; left: 0; z-index: 100; }

/* Opacity Variables */
.opGrand { opacity: 0; } .opHeavy { opacity: .15; } .opGreater { opacity: .35; } .opBase { opacity: .5; } .opLesser { opacity: .65; } .opLight { opacity: .85; } .opMinimal { opacity: 1; }

/* Display */
.show { display: block; }
.hide { display: none; }
.showBlock { display: block!important; }
.showInline { display: inline; }
.showInlineBlock { display: inline-block; }

/* Display Overrides */
.show-loggedin { display: none!important; }
html.loggedin .show-loggedin { display: unset!important; }
html.loggedin .hide-loggedin { display: none!important; }
.scroll-spacer-extend { height: 0; visibility: hidden; }

/* Formatting */
.bold { font-weight: 700; }
.italic { font-style: italic; }
.underline { text-decoration: underline; }
.linethrough { text-decoration: line-through; }
.uppercase { text-transform: uppercase; }

/* Brand Colors & Helpers */
.cTip { color: #438cc3; }
.cInfo { color: #2d5da4; }
.cAction { color: red; }
.cNeutral { color: #fff; }
.cSpot { color: #000; }
.cross { text-decoration: line-through; margin-right: 4px; }
.green { background: none repeat scroll 0 0 #7dbb1d; padding: 5px; color: #fff!important; font-weight: bolder; text-decoration: none!important; margin-bottom: 1px; display: inline-block; }

/* Common Structural Elements */
[class^=ico], [class^=img] { text-indent: -4000px; overflow: hidden; display: inline-block; background-repeat: no-repeat; }
[class^=ico] { vertical-align: middle; }
.sprite-global { vertical-align: middle; }

[class^=list]:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.list { overflow: hidden; }
.list.extraPadding { margin: 0 0 -2px 0; }
.list.extraPadding li { padding: 2px 0 2px 0; }
.list.columns li { width: 50%; float: left; }

.listBestellingBeheer { margin: 0; text-align: center; }
.listBestellingBeheer li { padding: 3px 0; display: inline-block; }
.listBestellingBeheer li a { display: block; text-align: center; width: 130px; }
.listBestellingBeheer li a:hover { border: 0; border-right: 1px solid #6ea715; border-bottom: 1px solid #6ea715; background: #78b41d; background: linear-gradient(to bottom,rgba(120,180,29,1) 0,rgba(146,222,27,1) 100%); }

/* BoxBar Structural Base */
.boxBar { height: 50px; overflow: hidden; text-align: center; font-size: 14px; line-height: 50px; color: #fff; }
.boxBar a { text-decoration: underline; opacity: .7; }
.boxBar .button { font-size: 12px!important; background: #0e3855; text-decoration: none; opacity: 1; }
.boxBar .button.primary, .boxBar .button.special { color: #fff!important; }
.boxBar .button.secondary { background: #0e3855; }

/* Pagination */
.pagination { overflow: hidden; font-size: 18px; margin: 20px 0; }
.pagination li { float: left; margin-right: 3px; color: #428ac1; }
.pagination li a { padding: 0 5px; line-height: 35px; vertical-align: middle; position: relative; cursor: pointer; display: flex; align-items: center; gap: 2px; border-radius: 3px; }
.pagination .next a, .pagination .next a:hover, .pagination .prev a, .pagination .prev a:hover { background-color: #0c324e; line-height: 35px; font-size: 20px; margin: 0 10px; color: #fff; padding: 0 10px; }
.pagination .prev a, .pagination .prev a:hover { font-size: 30px; }
.category-prodlist .pagination .prev a { font-size: 20px; }
.pagination li.active a { color: #09192f; font-size: 24px; }
.pagination.centered { text-align: center; display: flex; justify-content: center; flex-wrap: wrap; }
.pagination.centered li { float: none; display: inline-block; margin-right: 0; padding-left: 5px; padding-right: 5px; }
.pagination.centered li.floatLeft { float: left; margin-right: 3px; }
.pagination.centered li.floatRight { float: right; margin-left: 3px; }

@media (max-width: 768px) {
    .alignCenter { font-size: 14px; }
    .cNeutral { color: inherit; }
    .boxBar { white-space: wrap; overflow: visible; height: unset; line-height: 22px; padding: 5px 10px; margin-top: 5px; }
}
@media (max-width: 600px) {
    .pagination.centered { font-size: 24px; }
}

/* --- Source: nl_NL / 01-d-buttons.css --- */
/* templates/nl_NL/css/global/01-d-buttons.css */
/* 
   =============================================================
   BUTTON FOUNDATION & VARIANTS
   =============================================================
*/
.button {
  display: inline-block;
  line-height: normal;
  padding: 2px 5px 2px 5px;
  font-size: 12px;
  text-align: left;
  position: relative;
  color: #fff;
  border: 0;
  border-radius: 3px;
  box-sizing: border-box;
  border-bottom: 1px solid #103e5f;
  background: #2a638e;
  background: linear-gradient(to bottom,rgba(42,99,142,1) 0,rgba(16,62,95,1) 100%);
}
.button.block {
  display: block;
  text-align: center;
}
.button.primary {
  padding: 5px 10px;
  border: 0;
  color: #fff;
  border-right: 1px solid #6ea715;
  border-bottom: 1px solid #6ea715;
  background: #78b41d;
  background: linear-gradient(to bottom,rgba(120,180,29,1) 0,rgba(146,222,27,1) 100%);
}
.button.primary:hover {
  text-decoration: none;
  border: 0;
  color: #fff;
  border-right: 1px solid #6ea715;
  border-bottom: 1px solid #6ea715;
  background: #78b41d;
  background: linear-gradient(to bottom,rgba(120,180,29,1) 0,rgba(146,222,27,1) 100%);
}
.button.primary.disabled {
  background: #d3d3d3;
  border: 1px solid #d3d3d3;
  opacity: .7;
}
.button.secondary {
  padding: 5px 10px;
  color: #fff;
  border: 0;
  border-right: 1px solid #103e5f;
  border-bottom: 1px solid #103e5f;
  background: #2a638e;
  background: linear-gradient(to bottom,rgba(42,99,142,1) 0,rgba(16,62,95,1) 100%);
}
.button.secondary:hover {
  border-right: 1px solid #6ea715;
  color: #fff;
  text-decoration: none;
  border-bottom: 1px solid #6ea715;
  background: #78b41d;
  background: linear-gradient(to bottom,rgba(120,180,29,1) 0,rgba(146,222,27,1) 100%);
}
.button.alert {
  padding: 5px 10px;
  border: 0;
  border-right: 1px solid #936262;
  border-bottom: 1px solid #936262;
  background: #d26666;
  background: linear-gradient(to bottom,rgba(210,102,102,1) 0,rgba(222,147,147,1) 100%);
}
.button.guide {
  padding: 5px 10px;
  border: 0;
  border-right: 1px solid #a79415;
  border-bottom: 1px solid #a79415;
  background: #afa10b;
  background: linear-gradient(to bottom,rgba(175,161,11,1) 0,rgba(223,198,27,1) 100%);
}
.button.offline {
  padding: 5px 10px;
  border: 0;
  border-right: 1px solid #103e5f;
  border-bottom: 1px solid #103e5f;
  background: #e8357a;
  background: linear-gradient(to bottom,rgba(232,53,122,1) 0,rgba(242,17,21,1) 100%);
}
.button.special {
  padding: 5px 10px;
  background: #7d0101;
}
.button.bigSign {
  margin: 5px 0;
  font-size: 14px;
  color: #fff;
  font-weight: 700;
  border: 0;
  text-align: center;
  display: block;
  line-height: 42px;
  background: #e8357a;
  background: linear-gradient(to bottom,rgba(232,53,122,1) 0,rgba(242,17,21,1) 100%);
}
.button.big {
  line-height: 55px;
  font-size: 24px;
  padding: 0 40px;
  margin: 20px 0 0 0;
}
.multibtn a {
  background: 0 0;
  color: #555;
  display: inline-block;
  padding-right: 0;
  padding-left: 0;
  box-sizing: border-box;
  width: calc(33.3333%)!important;
  padding-top: 10px!important;
  padding-bottom: 10px!important;
  border-right: 1px solid rgba(0,0,0,.13)!important;
  font-size: 14px;
  text-align: center;
  font-weight: 400;
}
.buyBtns {
  float: right;
}
.toolBar .button {
  margin-right: 5px;
}

@media (max-width: 768px) {
  .toolBar {
    display: flex;
    flex-direction: column;
    width: auto;
    justify-content: center;
    float: left;
  }
  .toolBar .button {
    color: #fff;
    text-align: center;
    margin-bottom: 5px;
    margin-right: 0;
  }
}

/* --- Source: nl_NL / 01-e-layout.css --- */
/* templates/nl_NL/css/global/01-e-layout.css */
/* 
   =============================================================
   PAGE LAYOUT & STRUCTURAL WRAPPERS
   =============================================================
*/
.layoutCenter { width: 980px; position: relative; margin: 0 auto 0 auto; box-sizing: border-box; }
.layoutSection .layoutCenter { background-color: #fff; }
.layoutSection.splash { background: 0 0; }

.layoutFooter nav { overflow: hidden; background: #2a638e; background: linear-gradient(to bottom,rgba(42,99,142,1) 0,rgba(68,141,195,1) 100%); }
.layoutFooter nav ul { width: 100%; display: flex; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.layoutFooter nav li { float: left; margin: 0 0 0 10px; }
.layoutFooter nav a { display: block; font-weight: 700; font-size: 14px; line-height: 52px; padding: 0 15px; color: #fff; }
.layoutFooter nav a:hover { color: #d4d4d4; }
.layoutFooter nav li.active a { background-color: rgba(61,129,181,.7); }
.layoutFooter nav li.active a:hover { color: #fff; }
.layoutFooter nav li.right { display: none; background: white; border-radius: 5px; padding: 5px; margin-bottom: .5em; }

.footerInfo { border-top: 1px solid #103e5f; font-size: 14px; background: #2a638e; background: linear-gradient(to bottom,rgba(42,99,142,1) 0,rgba(16,62,95,1) 100%); line-height: 48px; color: #fff; }
.footerInfo p a { text-decoration: none; color: #fff; }
.footerInfo .div { margin: 0 5px; }
.footerInfo .phone { font-size: 18px; margin: 0 10px 0 0; }

[class^=box] { position: relative; box-sizing: border-box; }
[class^=box]:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.box { background-color: #ededed; border-bottom: 2px solid #438cc3; padding: 10px 15px 15px 15px; }
.boxCal { width: 13px; height: 30px; position: relative; display: inline-block; vertical-align: middle; margin-left: 5px; }
.boxCal.off { opacity: .5; }
.boxCal a { width: 13px; height: 13px; background-color: #103957; line-height: 14px; text-align: center; color: #fff; display: block; position: absolute; top: 0; left: 0; border-radius: 100px; }
.boxCal a + a { position: absolute; top: auto; bottom: 0; left: 0; }
.boxCal a:hover { background-color: #0091ff; }
.boxCal.off a:hover { background-color: #103957; }

.boxArticle { background-color: #103957; margin: 5px 0 10px 0; padding: 15px 25px; color: #fff; }
.boxArticle h4 { font-size: 24px; }
.boxArticle p { font-size: 18px; }
.boxArticle .hr { margin: 10px 0 15px 0; border-top-color: #58758a; border-bottom-color: #000; }
.boxArticle .icoInfo { margin-top: 7px; }
.boxArticle .floatRight.toSide { padding: 0 0 0 20px; margin-right: -25px; }
.boxHelpdesk { cursor: pointer; }
.boxHelpdesk .info { font-size: 11px; }

.boxLinkBlock { padding: 5px 0 5px 10px; }
.boxLinkBlock a { margin: 0 5px; }
.boxLinkBlock a i { position: relative; top: -2px; }
.boxWhere { font-weight: 700; padding: 5px 0 5px 10px; display: flex; gap: 5px; }
.boxWhere span { color: #438cc3; white-space: nowrap; }
.boxWhere span.bits { display: inline-flex; align-items: center; gap: 5px; }
.boxWhere span.bits a { display: block; overflow: hidden; text-overflow: ellipsis; max-width: 200px; }
.boxWhere span a span { color: #103e5f; }
.boxWhere a:hover { text-decoration: underline; }
.bcrumbs { display: flex; gap: 10px; }
.bcrumbs > .boxWhere { flex: 1; }
.bcrumbs > .boxLinkBlock > strong { display: flex; gap: 2px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.bcrumbs > .boxLinkBlock > strong > a { display: flex; align-items: center; gap: 4px; }

.boxProductSection { color: #fff; }
.boxProductSection header { padding: 0 0 0 20px; line-height: 40px; height: 40px; border: 1px solid #232323; border-bottom: 1px solid #0e3855; }
.boxProductSection header h2 { font-size: 18px; font-weight: 700; }
.boxProductSection > header { display: flex; align-items: center; }
.boxProductSection > header > h2 { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.boxProductSection > header > ul.pagination { align-items: center; font-size: 16px; line-height: 1.4em; margin: 0; }
.boxProductSection > header > ul.pagination li { padding: 0; }
.boxProductSection > header > ul.pagination li a { color: white; }
.boxProductSection > header > ul.pagination li.active a { font-weight: bold; }
.boxProductSection > header > ul.pagination li.prev a, .boxProductSection > header > ul.pagination li.next a { font-size: 16px; line-height: 1.4em; }
.boxProductSection header .search { position: absolute; top: 0; right: 2px; }
.boxProductSection header .search strong { color: #48b; font-size: 14px; margin: 0 10px 0 0; }
.boxProductSection header .search input { width: 245px; height: 36px; line-height: 36px; box-shadow: none; }
.boxProductSection header .search button { border: none; position: absolute; top: 10px; right: 10px; }
.boxProductSection header .alignRight { position: absolute; top: 0; right: 10px; }
.boxProductSection section { padding: 20px 20px; margin: 0 0 6px 0; position: relative; background: #3676a7; background: linear-gradient(to bottom,rgba(54,118,167,1) 0,rgba(67,139,194,1) 100%); font-size: 14px; line-height: 18px; font-weight: 400; }
.boxProductSection section a { color: #fff; }
.boxProductSection .social { position: absolute; bottom: 0; right: 0; width: 105px; height: 27px; padding: 5px 0 0 30px; box-sizing: border-box; }
.boxProductSection .social li { float: left; margin: 0 3px; }
.boxProductSection .note, .boxProductSection .note a { font-size: 14px; color: #c2d5e8; }
.boxProductSection .note button { color: #fff; line-height: 40px; text-decoration: none; }
.boxProductSection .note.background { background-color: #3d80b2; }
.boxProductSection .toolBar a { vertical-align: top; }
.boxProductSection .toolBar .primary { line-height: 30px; margin: 0 0 0 20px; }
.boxProductSection .headingInfo { margin-bottom: 10px; color: #fff; text-align: center; background-color: #3573a1; padding: 5px 0; }
.boxProductSection.white section { background: #fff; }
.boxProductSection.white footer .info { background-color: #000; position: relative; padding: 10px 20px; color: #fff; text-align: center; font-size: 18px; }
.boxProductSection.white footer .info p { margin: 0; }
.boxProductSection.white footer .info .social { position: absolute; bottom: 0; right: 0; width: 105px; height: 27px; padding: 0 0 0 30px; box-sizing: border-box; }
.boxProductSection.white footer .info .social li { float: left; margin: 0 3px; }

.boxSearch { padding: 5px 5px; margin: 5px 0 5px 0; background: #2a638e; background: linear-gradient(to bottom,rgba(42,99,142,1) 0,rgba(16,62,95,1) 100%); }
.boxSearch .search input { width: 100%; height: 36px; line-height: 36px; box-shadow: none; }
.boxSearch .search button { border: none; position: absolute; top: 10px; right: 10px; }

/* Media Queries */
@media (max-width: 1024px) {
  .layoutCenter { width: 745px; }
  .boxProductSection section a { color: inherit; }
  .boxProductSection section .listAccount a { color: white; }
  .layoutFooter nav { background: 0 0; color: inherit; }
  .layoutFooter nav ul { display: flex; flex-wrap: wrap; justify-content: center; }
  .layoutFooter nav li { float: none; display: inline-block; }
  .footerInfo .layoutCenter { text-align: center; font-size: 16px; }
  .layoutFooter nav li a { color: inherit; font-size: 18px; }
  .layoutFooter nav li a:hover { color: inherit; text-decoration: underline; }
  .layoutFooter nav li.active a, .layoutFooter nav li.active a:hover { color: inherit; background: 0 0; }
  .footerInfo { background: 0 0; color: inherit; margin-bottom: 4em; border: none; }
  .footerInfo .phone img { display: none; }
  .footerInfo .phone, .footerInfo .social { display: block; }
  .footerInfo .div:nth-last-child(4) { display: none; }
  .footerInfo .phone { padding-bottom: 15px; }
  .footerInfo .social { display: flex; justify-content: center; }
  .footerInfo .social a { flex: 1 1 0%; }
  .footerInfo .social a img { -webkit-transform: scale(3); transform: scale(3); }
  .footerInfo .phone a { color: #000; font-size: 24px; font-weight: 700; }
  .layoutFooter nav li.right { display: block; right: auto; left: auto; flex: 1; flex-basis: 100%; text-align: center; margin-top: 1em; background: none; border-radius: 0; padding: 0; margin-bottom: 0; }
  .layoutFooter nav li.right > img { width: 100%; height: inherit; max-width: 210px; }
  
  .boxProductSection { position: relative; }
  .boxProductSection header { width: 50%; position: absolute; right: 0; top: 0; }
  .boxProductSection header.t h2 { padding: 0 0 0 5px; margin: 0; line-height: 20px; top: 5px; position: relative; }
  .gridSpan9 .boxProductSection header { width: 100%; position: relative; right: auto; top: auto; text-align: center; }
  .gridSpan9 .boxProductSection header.t h2 { display: none; }
  .boxProductSection > header > ul.pagination { display: none; }
  .boxProductSection > header > h2 { line-height: 1.4em; padding: 20px 20px 0 20px; }
  
  /* Absorbed from 02-menu.css */
  .boxProductSection header .search { margin-bottom: 10px; }
  .boxProductSection header .search input { font-size: 18px; text-align: center; width: 100%; height: 50px; }
  form.search#headsearch .quickresults { max-width: 90%; }
  
  .boxProductSection .buyBtns { display: block; }
  .boxProductSection .buyBtns .button { margin-bottom: 2px; z-index: 1005; }
  body.td .boxProductSection .buyBtns { position: fixed; top: 4px; right: 130px; height: auto; z-index: 1005; }
  
  .footerInfo .layoutCenter .phone { margin-top: 1em; }
  .boxProductSection section a.download { color: #fff; }
}

@media (max-width: 768px) {
  .layoutCenter { width: 100%; }
  .boxProductSection section + section.chat-init-box { margin-top: 1em; }
  .gridSpan9 .boxProductSection header.t h2 { display: block; }
  .boxLinkBlock { display: none; }
  .bcrumbs { margin-bottom: 1em; }
  .boxWhere { display: flex; flex-direction: column; align-items: center; justify-content: center; }
  .boxWhere .t { display: block; }
  .boxWhere .bits { font-size: 16px; line-height: 20px; }
  .boxProductSection > header.t { margin-bottom: 1em; }
  .boxProductSection > header.t > h2 { display: block; text-align: center; font-size: 24px; line-height: 30px; margin: 0; padding: 0; }
  .layoutSection { background: 0 0; }
  .boxProductSection .note, .boxProductSection .note a { color: inherit; }
  .boxProductSection .social { display: none; }
  .boxProductSection { color: inherit; }
  .boxProductSection section { padding-top: 0; padding-bottom: 0; background: 0 0!important; }
  .boxProductSection .simsale header { width: 100%; z-index: 1009; height: 40px; position: relative; padding-left: 10px; margin-top: 3em; margin-bottom: 1em; text-align: center; }
  .boxProductSection .simsale header h2 { font-size: 26px!important; }
}

@media (max-width: 600px) {
  .footerInfo { margin-bottom: 4em; }
  .footerInfo .layoutCenter p { margin-top: 1em; line-height: 26px; }
  .footerInfo .layoutCenter p .div { visibility: hidden; display: block; height: 1px; margin: 0; padding: 0; }
  .footerInfo .layoutCenter .phone { margin-top: 1em; padding-bottom: 2em; }
  .boxProductSection .buyBtns { position: fixed; top: 4px; right: 130px; height: auto; z-index: 1005; }
  .boxProductSection .buyBtns { text-align: right; line-height: 20px; position: fixed; top: 5px; }
  .boxProductSection .buyBtns .button { margin-bottom: 5px; }
}

@media (max-width: 450px) {
  .boxProductSection .simsale header h2 { font-size: 20px!important; }
  .boxProductSection .buyBtns { text-align: left; padding-left: 5px; left: 0; }
}

/* --- Source: nl_NL / 01-f-legacy-tables.css --- */
/* templates/nl_NL/css/global/01-f-legacy-tables.css */
/* 
   =============================================================
   LEGACY TABLES (Retained for Registration, Password, Contact)
   =============================================================
*/

.tableCart {
  width: 100%;
  margin-bottom: 5px;
}
.tableCart th {
  text-align: left;
  background-color: #3472a0;
  padding: 5px 10px;
  color: #fff;
}
.tableCart td {
  padding: 10px 10px;
  color: #000;
  vertical-align: top;
}
.tableCart .total {
  color: #fff;
  font-size: 14px;
  vertical-align: middle;
}
.tableCart .price {
  font-size: 18px;
}
.tableCart .priceBig {
  font-size: 30px;
}
.tableCart .amount {
  width: 70%;
}
.tableCart tr:nth-child(odd) td {
  background-color: #3a7bad;
}
.tableCart.noZebra tr:nth-child(odd) td {
  background-color: inherit;
}
.tableCart .alignCenter {
  text-align: center;
}

.tableSend {
  width: 100%;
}
.tableSend td {
  padding: 2px 10px 2px 0;
}
.tableSend td + td,
.tableSend td[colspan="2"] {
  padding: 2px 0 2px 0;
}
.tableSend .greater {
  line-height: 25px;
  vertical-align: top;
}
.tableSend textarea {
  margin-bottom: 20px;
}
.tableSend .button {
  text-align: center;
}
.tableSend .ico-send-png {
  display: block;
  margin: -13px auto 0 auto;
}

.tableSignup td {
  padding: 0 10px 0 0;
}
.tableSignup td + td {
  padding: 0;
}

/* --- Source: nl_NL / 01-g-chat-init.css --- */
/* templates/nl_NL/css/global/01-g-chat-init.css */
/* 
   =============================================================
   GLOBAL CHAT INITIALIZER UI
   =============================================================
*/
section.chat-init-box {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 10px;
}
body.outofstock section.chat-init-box.in-stock,
section.chat-init-box.out-of-stock {
    display: none;
}
body.outofstock section.chat-init-box.out-of-stock {
    display: flex;
}
section.chat-init-box > i.sprite-global,
section.chat-init-box > img {
    border-radius: 50%;
    border: 2px solid rgba(255,40,151,.5);
}
section.chat-init-box > i.barry-png,
section.chat-init-box > img.barry {
    border-color: rgba(16, 62, 95, 0.5);
}
section.chat-init-box > div {
    flex: 1;
    padding-right: 10px;
}
section.chat-init-box > div > div.chat-input {
    display: flex;
    gap: 10px;
}
section.chat-init-box > div > div.chat-input input {
    font-size: 14px;
    line-height: 18px;
    width: 100%;
}
section.chat-init-box > div > div.chat-input button {
    white-space: nowrap;
}
section.chat-init-box.kitt {
    width: 100%;
    box-sizing: border-box;
    background: none;
    color: black;
}
section.chat-init-box.kitt img[alt="K.I.T.T."] {
    border-radius: 0;
    border: none;
}

section.product-chat {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 10px;
}
section.product-chat > img {
    border-radius: 50%;
    border: 2px solid rgba(255,40,151,.5);
    display: flex;
    align-items: center;
    justify-content: center;
}
section.product-chat > div {
    flex: 1;
    padding-right: 10px;
}
section.product-chat > div > div.chat-input {
    display: flex;
    gap: 10px;
}
section.product-chat > div > div.chat-input input {
    font-size: 14px;
    line-height: 18px;
}
section.product-chat > div > div.chat-input button {
    white-space: nowrap;   
}

.vat-nr-chat-link#vat_nr_chat {
    font-size: 12px;
    line-height: 14px;
    margin-top: 4px;
    display: block;
    color: #afcade;
    text-decoration: none;
}
.vat-nr-chat-link#vat_nr_chat span {
    text-decoration: underline 1px;
    text-decoration-style: dotted;
    text-underline-offset: 2px;
    color: #afcade;
    transition: color 0.2s ease, text-decoration-color 0.2s ease;
}
.vat-nr-chat-link#vat_nr_chat:hover span {
    color: #ffffff;
    text-decoration-color: #ffffff;
}

@media (max-width: 768px) {
  .boxProductSection section + section.chat-init-box {
    margin-top: 1em;
  }
}

/* --- Source: nl_NL / 01-h-grabbelton.css --- */
/* templates/nl_NL/css/global/01-h-grabbelton.css */
/* 
   =============================================================
   GRABBELTON (3D CSS DICE)
   =============================================================
*/

#grabbel {
  display: none;
}
#grabbel:checked ~ label {
  display: none;
}
#grabbel:checked ~ .dobbelsteen > #dice {
  animation: spin-duplicate 2s linear 0s infinite normal none running;
}
#grabbel:checked ~ .dobbelsteen {
  width: 200px;
  height: 200px;
  transform-style: preserve-3d;
  animation: roll 1.6s linear 0s infinite normal none running;
}

.grabbelton {
  position: relative;
  display: block;
  box-sizing: border-box;
  width: 60px;
  height: 60px;
  margin: 0 auto;
  cursor: -webkit-grab;
  cursor: grab;
}
.dobbelsteen {
  position: absolute;
  left: 10px;
  top: -6px;
  transform: scale(.2);
}

#dice span {
  position: absolute;
  margin: 100px 0 0 100px;
  display: block;
  font-size: 2.5em;
  padding: 10px;
}
#dice {
  position: absolute;
  width: 200px;
  height: 200px;
  transform-style: preserve-3d;
  animation: spin 50s linear 0s infinite normal none running;
  cursor: -webkit-grab;
  cursor: grab;
}

.side {
  position: absolute;
  width: 200px;
  height: 200px;
  background: #fff;
  box-shadow: #ccc 0 0 40px inset;
  border-radius: 40px;
}
#dice .cover,
#dice .inner {
  background: #e0e0e0;
  box-shadow: none;
}
#dice .cover {
  border-radius: 0;
  transform: translateZ(0);
}
#dice .cover.x { transform: rotateY(90deg); }
#dice .cover.z { transform: rotateX(90deg); }

#dice .front { transform: translateZ(100px); }
#dice .front.inner { transform: translateZ(98px); }
#dice .back { transform: rotateX(-180deg) translateZ(100px); }
#dice .back.inner { transform: rotateX(-180deg) translateZ(98px); }
#dice .right { transform: rotateY(90deg) translateZ(100px); }
#dice .right.inner { transform: rotateY(90deg) translateZ(98px); }
#dice .left { transform: rotateY(-90deg) translateZ(100px); }
#dice .left.inner { transform: rotateY(-90deg) translateZ(98px); }
#dice .top { transform: rotateX(90deg) translateZ(100px); }
#dice .top.inner { transform: rotateX(90deg) translateZ(98px); }
#dice .bottom { transform: rotateX(-90deg) translateZ(100px); }
#dice .bottom.inner { transform: rotateX(-90deg) translateZ(98px); }

.dot {
  position: absolute;
  width: 46px;
  height: 46px;
  border-radius: 23px;
  background: #444;
  box-shadow: #000 5px 0 10px inset;
}
.dot.center { margin: 77px 0 0 77px; }
.dot.dtop { margin-top: 20px; }
.dot.dleft { margin-left: 134px; }
.dot.dright { margin-left: 20px; }
.dot.dbottom { margin-top: 134px; }
.dot.center.dleft { margin: 77px 0 0 20px; }
.dot.center.dright { margin: 77px 0 0 134px; }

.grabbelton input[type=checkbox]::before {
  position: absolute; overflow: hidden; top: 40px; left: 40px; display: block; width: 120px; padding-top: 9px; height: 31px; cursor: pointer; text-align: center; font-size: 1.2em; font-weight: 700; color: #fff; border-radius: 6px; border: 1px solid; background: 0 0; border-color: transparent;
}
.grabbelton input[type=checkbox] {
  display: none;
}

[draggable] {
  -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; -khtml-user-drag: element; -webkit-user-drag: element;
}

@keyframes spin {
  0% { transform: translateZ(-100px) rotateX(0) rotateY(0) rotateZ(0); }
  16% { transform: translateZ(-100px) rotateX(180deg) rotateY(180deg) rotateZ(0); }
  33% { transform: translateZ(-100px) rotateX(360deg) rotateY(90deg) rotateZ(180deg); }
  50% { transform: translateZ(-100px) rotateX(360deg) rotateY(360deg) rotateZ(360deg); }
  66% { transform: translateZ(-100px) rotateX(180deg) rotateY(360deg) rotateZ(270deg); }
  83% { transform: translateZ(-100px) rotateX(270deg) rotateY(180deg) rotateZ(180deg); }
  100% { transform: translateZ(-100px) rotateX(360deg) rotateY(360deg) rotateZ(360deg); }
}

@keyframes spin-duplicate {
  0% { transform: translateZ(-100px) rotateX(0) rotateY(0) rotateZ(0); }
  16% { transform: translateZ(-100px) rotateX(180deg) rotateY(180deg) rotateZ(0); }
  33% { transform: translateZ(-100px) rotateX(360deg) rotateY(90deg) rotateZ(180deg); }
  50% { transform: translateZ(-100px) rotateX(360deg) rotateY(360deg) rotateZ(360deg); }
  66% { transform: translateZ(-100px) rotateX(180deg) rotateY(360deg) rotateZ(270deg); }
  83% { transform: translateZ(-100px) rotateX(270deg) rotateY(180deg) rotateZ(180deg); }
  100% { transform: translateZ(-100px) rotateX(360deg) rotateY(360deg) rotateZ(360deg); }
}

@keyframes roll {
  0% { transform: translate3d(-200px,-50px,-400px); }
  12% { transform: translate3d(0,0,-100px); }
  25% { transform: translate3d(200px,-50px,-400px); }
  37% { transform: translate3d(0,-100px,-800px); }
  50% { transform: translate3d(-200px,-50px,-400px); }
  62% { transform: translate3d(0,0,-100px); }
  75% { transform: translate3d(200px,-50px,-400px); }
  87% { transform: translate3d(0,-100px,-800px); }
  100% { transform: translate3d(-200px,-50px,-400px); }
}

/* --- Source: nl_NL / 01-i-butterfly.css --- */
/* templates/nl_NL/css/global/01-i-butterfly.css */
/* 
   =============================================================
   DECORATIVE BUTTERFLY GRAPHICS
   =============================================================
*/
.layoutHeader .main .butterfly {
  position: absolute;
  width: 149px;
  height: 135px;
  display: block;
  left: -60px;
  top: 47px;
  z-index: 100;
}
.layout.sticky .layoutHeader .main .butterfly {
  display: none;
}
.layoutFooter .butterfly {
  position: absolute;
  left: -40px;
  top: 0px;
  transform: translateY(-210px);
  z-index: 100;
  scale: .6;
}

@media (max-width: 1024px) {
  .layoutFooter .butterfly {
    width: 80px;
    height: 72px;
    left: 10px;
    top: -100px;
  }
}
@media (max-width: 768px) {
  .layoutHeader .main .butterfly {
    display: none;
  }
}
@media (max-width: 600px) {
  .layoutFooter .butterfly {
    top: -140px;
  }
}
@media (max-width: 450px) {
  .layoutFooter .butterfly {
    top: -210px;
  }
}
@media (min-width: 1025px) {
  body.td .butterfly {
    height: 40px;
    width: auto!important;
    top: 40px!important;
    left: -9px!important;
  }
}

/* --- Source: nl_NL / 02-menu.css --- */
/* templates/nl_NL/css/global/02-menu.css */
.tableCart.kassa td {
  padding: 5px 10px
}
.tableCart.kassa.off td {
  opacity: .5
}
.layoutHeader .main .loggedin .buttons > a.logout {
  width: 100%;
  text-align: right;
}
.layoutHeader .kassa {
  display: none
}
.layout.sticky .layoutHeader .kassa {
  display: block;
  position: absolute;
  top: 7px;
  right: 0
}
.boxNewsletter .info {
  font-size: 11px
}
.boxNewsletter .ico-news-png {
  float: left;
  margin: 0 10px 0 0
}
.boxNewsletter .signup input {
  margin: 0 0 5px 0
}
.boxNewsletter .signup .button {
  display: block;
  width: 100%;
  text-align: center
}
.boxNewsletter .signup a.newsletterunsub {
  margin-top: 4px;
  display: block;
  text-align: right;
  opacity: .5;
}
.boxNewsletter .signup a.newsletterunsub:hover {
  opacity: 1;
}
.boxInloggen .info {
  font-size: 11px
}
.boxInloggen .ico-lock-png {
  float: left;
  margin: 0 10px 0 0
}
.boxInloggen .signup input {
  margin: 0 0 5px 0
}
.boxInloggen .signup .button {
  display: block;
  width: 100%;
  text-align: center
}
.boxWinkelwagen .articles {
  font-size: 14px;
  font-weight: 700;
  color: #438cc3
}
.boxWinkelwagen .buttons {
  display: flex;
  gap: 5px;
}
.boxWinkelwagen .buttons > a {
  display: flex;
  align-items: center;
  overflow: hidden;
  text-overflow: ellipsis;
}
.boxSearch {
  padding: 5px 5px;
  margin: 5px 0 5px 0;
  background: #2a638e;
  background: linear-gradient(to bottom,rgba(42,99,142,1) 0,rgba(16,62,95,1) 100%)
}
.boxSearch .search input {
  width: 100%;
  height: 36px;
  line-height: 36px;
  box-shadow: none
}
.boxSearch .search button {
  border: none;
  position: absolute;
  top: 10px;
  right: 10px
}
.boxSidemenu {
  background-color: #103e5f;
  color: #fff;
  padding: 15px 5px;
  margin: 5px 0 5px 0
}
.boxSidemenuContainer .stickytop {
  display: none;
  padding:0;
}
.boxSidemenuContainer .stickytop > form {
  padding: 0px;
}
.boxSidemenuContainer .stickytop > form > input {
  font-size: 14px;
  line-height: 30px;
}
.boxSidemenu ul {
  margin: 0 0 25px 0;
  border-bottom: 1px solid #28526f
}
.boxSidemenu ul li {
  border-top: 1px solid #28526f
}
.boxSidemenu ul li a {
  color: #fff;
  font-weight: 700;
  display: block;
  padding: 5px 20px
}
.boxSidemenu ul li.special a {
  color: #fff
}
.boxSidemenu ul li a span {
  color: #bdbdbd
}
.boxSidemenu ul li a:hover {
  background-color: #1a4e73
}
.boxSidemenu h2 {
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  padding: 5px 0 5px 20px
}
.boxSidemenu p {
  font-size: 14px;
  font-weight: 700;
  padding: 5px 0 5px 20px
}
.boxSidemenu p span {
  color: #bdbdbd
}
.boxSidemenu .hr {
  border: 0;
  border-top: 1px solid #3b7fb2;
  margin: 25px 0 25px 0
}
.boxSidemenu span.subtoggle-carret {
  position: relative;
    top: -2px;
    color: white;
    display: none;
}
.boxSidemenu ul.subtoggle-menu {
  max-height: unset!important;
}
.gridSpan3 .kassa {
  position: fixed;
  bottom: 7px;
  right: 10px;
  z-index: 9999999
}
.gridSpan3 .kassa .primary {
  line-height: 18px;
  padding-top: 4px;
  display: flex;
  white-space: nowrap;
  gap: 2px;
  align-items: center;
}
.gridSpan3 .kassa .primary span {
  font-size: 14px;
  flex: 1;
}
.layoutHeader.splash div.logo {
  display: none
}
.nav-menu-txt {
  display: none
}
.nav-menu-txt,
.nav-txt,
div.nav-toggle {
  z-index: 9999999;
  position: fixed;
  color: #fff;
  font-weight: 400;
  font-size: 12px;
  white-space: nowrap;
  bottom: 5px;
  left: 60px;
  transition: opacity .55s ease 0s;
  top: inherit;
  box-sizing: border-box;
  background: 0 0!important;
  clip: inherit!important;
  width: auto!important;
  height: auto!important;
  margin: inherit!important
}
body.guest .nav-btns span.tel,
body.loggedin .nav-btns .button.login,
body.loggedin #menubar .boxInloggen {
  display: none;
}
.gridSpan3 .kassa,
.mobilemenulink,
.nav-txt,
div.nav-toggle,
input.nav-toggle {
  display: none
}
.sprite-global.swipe-up {
    display: none;
  }
.swipe-up {
  position: absolute;
  right: 15px;
  top: 50px;
  z-index: 2147483647;
  width: 40px;
  opacity: .9
}
.gridSpan3 .kassa {
  position: fixed;
  bottom: 7px;
  right: 10px;
  z-index: 9999999
}
.boxSidemenu .google-review { 
  display: none;
}
.boxSidemenu .google-review > a span {
  font-size: 20px;
  line-height: 1.2em;
}
#grabbelton.spin .dobbelsteen > #dice {
  animation: spin -2s linear 1s infinite normal none running;
}
.menuSearch {
  padding: 5px;
  background: none;
  border: none;
}
.menuSearch form {
  text-align: center;
}
.menuSearch h4 {
  text-align: center;
  margin-bottom: 4px;
}
.menuSearch form > input.q {
  padding: 10px;
  font-size: 14px;
  text-align: center;
  margin-bottom: 7px;
}
.menuSearch form > button {
  padding: 10px;
  font-size: 14px;
  text-align: center;
}
.menuSearch form > .price-select {
  display: flex;
  gap: 5px;
  align-items: center;
  margin-bottom: 5px;
}
.menuSearch form > .price-select > input {
  text-align: center;
}
.menuSearch form.search .quickresults {
  margin-top: -108px;
  margin-left: 204px;
  border-top-width: 2px;
}

.boxNewsletterMobile > h4 {
  color: black;
}
.boxNewsletterMobile .social-icons {
  float:right;
  display: flex;
  gap:3px;
}
.boxNewsletterMobile .button {
  white-space: nowrap;
  max-width: 50px;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width:1024px) {

  .sprite-global.swipe-up {
    display: block
  }
  .nav-menu-txt {
    display: block;
    font-size: 24px;
    font-weight: 700
  }
  input.nav-toggle:checked ~ .boxSidemenuContainer,
  input.nav-toggle:checked ~ .menu-sticky-wrapper .boxSidemenuContainer {
    -webkit-transform: none;
    transform: translateX(0);
    box-shadow: 1px 1px 1px rgba(0,0,0,.3);
    z-index: 200000;
    overflow: unset;
  }
  input.nav-toggle:checked ~ .nav-txt {
    display: inline;
    white-space: normal;
    width: 165px!important
  }
  input.nav-toggle:checked ~ .nav-menu-txt {
    display: none
  }
  input.nav-toggle:checked ~ .chat {
    left: 250px;
    opacity: 1
  }
  .gridSpan3 .kassa {
    display: block
  }
  .boxSidemenu .nav-menuitems {
    flex: 1 1 0%;
    overflow: hidden auto
  }
  .boxSidemenu {
    font-size: 20px
  }
  input.nav-toggle {
    display: block;
    width: 120px;
    height: 40px;
    position: fixed;
    bottom: 0;
    left: 0;
    top: inherit;
    cursor: pointer;
    opacity: 0;
    z-index: 99999999
  }
  div.nav-toggle {
    display: block;
    bottom: 4px;
    left: 0;
    padding: 10px;
    margin-top: 0;
    margin-bottom: 0;
    border-radius: 0;
    float: left;
    height: 45px
  }
  div.nav-toggle span {
    cursor: pointer;
    border-radius: 3px;
    content: "";
    display: block;
    width: 37px;
    height: 5px;
    margin-bottom: 5px;
    margin-left: 0;
    position: relative;
    z-index: 1;
    -webkit-transform-origin: 4px 0 0;
    transform-origin: 4px 0 0;
    transition: background .5s cubic-bezier(.77,.2,.05,1) 0s,opacity .55s ease 0s,-webkit-transform .5s cubic-bezier(.77,.2,.05,1) 0s;
    transition: transform .5s cubic-bezier(.77,.2,.05,1) 0s,background .5s cubic-bezier(.77,.2,.05,1) 0s,opacity .55s ease 0s;
    transition: transform .5s cubic-bezier(.77,.2,.05,1) 0s,background .5s cubic-bezier(.77,.2,.05,1) 0s,opacity .55s ease 0s,-webkit-transform .5s cubic-bezier(.77,.2,.05,1) 0s
  }
  div.nav-toggle span::after {
    cursor: pointer;
    position: absolute;
    display: block;
    content: "";
    transition: all .5s ease-in-out 0s;
    background: #397aac;
    border-radius: 3px;
    width: 37px;
    height: 5px;
    bottom: -10px
  }
  div.nav-toggle span::before {
    cursor: pointer;
    position: absolute;
    display: block;
    content: "";
    transition: all .5s ease-in-out 0s;
    border-radius: 3px;
    width: 37px;
    height: 5px;
    top: -10px
  }
  div.nav-toggle span,
  div.nav-toggle span::after,
  div.nav-toggle span::before {
    background: #fff
  }
  .boxSidemenuContainer {
    position: fixed;
    overflow: hidden;
    width: 100%;
    width: var(--vw);
    width: 100dvw;

    max-width: 340px;
    -webkit-font-smoothing: antialiased;
    -webkit-transform-origin: 0 0 0;
    transform-origin: 0 0 0;
    -webkit-transform: translate(-100%,0);
    transform: translateX(-100%);
    transition: transform .5s cubic-bezier(.77,.2,.05,1) 0s,-webkit-transform .5s cubic-bezier(.77,.2,.05,1) 0s;
    margin: 0;
    z-index: 9999;
    bottom: 42px;
    left: 0;
    background: linear-gradient(rgba(54,118,167,.9) 0,rgba(67,139,194,.9) 100%);
    border-width: 0 1px 1px 0;
    border-right-style: solid;
    border-bottom-style: solid;
    border-right-color: #2a638e;
    border-bottom-color: #2a638e;
    -o-border-image: initial;
    border-image: initial;
    border-top-right-radius: 5px;
    border-top-style: initial;
    border-top-color: initial;
    border-left-style: initial;
    border-left-color: initial;


    height: 80%;
    height: calc(var(--vh) - 42px);
    height: calc(100dvh - 42px);

  }
  
  .boxSidemenu {
    overflow-y: auto;
    flex: 1 1 0%;
    height: calc(100% - 80px);
    margin-bottom: 0;
    margin-top: 40px;
    position: relative;
    box-sizing: border-box;
    padding-bottom: 0
  }
  .boxSidemenu > ul > li > a {
    padding-left: 5px
  }
  .boxSidemenu .lbl {
    right: 0!important
  }
  .boxSidemenu > ul > li > ul {
    max-height: unset!important;
  }

  .boxSidemenu ul.subtoggle-menu a {
    padding-left: 5px;
    padding-right: 0;
  }
  .boxSidemenu ul.subtoggle-menu {
    background-color: unset;
  }
  .boxSidemenu span.subtoggle-carret {
    display:none;
  }

  .boxSidemenuContainer .stickytop {
    position: absolute;
    top: 0px;
    left: 0;
    width: 100%;
    z-index: 2147483647;
    display: block;
    height: 40px;
    overflow: hidden;
  }

  .boxSidemenu .google-review { 
    display: block;
  }
  .gridSpan3 .bigSign,
  .gridSpan3 .box,
  .gridSpan3 .boxSearch {
    display: none
  }


  .layoutHeader .cart .ico-basket-png,
  .layoutHeader .contact .ico-phone-png,
  .layoutHeader .main .cart .grid,
  .layoutHeader .main .contact,
  .layout.sticky .layoutHeader .main .kassa {
    display: none
  }

}

@media (max-width:768px) {

html.chat-large .nav-menu-txt,
  html.chat-large .nav-toggle {
    display: none;
  }
  .layoutHeader.splash div.logo {
    display: block!important;
    width: 256px;
    margin: 0 auto;
    margin-top: 10px
  }
}

@media (max-width:1024px) and (max-height:500px) {
  .boxSidemenu {
    height: calc(100% - 50px);
  }
}
@media (min-width:1025px) {
  .nav-toggle,
  .nav-txt {
    display: none!important
  }
}

/* --- RESPONSIVE IMPROVEMENTS (Menu Overlay & Scroll Lock) --- */
@media (max-width: 1024px) {
  /* Prevent body scrolling when the menu is open */
  html.sidemenu, 
  html.sidemenu body {
    overflow: hidden;
  }
  /* Full-screen backdrop overlay with grayscale effect */
  body::after {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(75, 142, 192, 0.4);
    backdrop-filter: grayscale(100%);
    -webkit-backdrop-filter: grayscale(100%);
    z-index: 199999; /* Below the menu container (200000) */
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.4s ease;
  }
  /* Trigger the overlay visibility when menu is active */
  html.sidemenu body::after {
    opacity: 1;
    pointer-events: auto;
  }
  /* Hardware acceleration for the menu sliding animation */
  .boxSidemenuContainer {
    will-change: transform;
  }
}

/* Separator reset */
.boxSidemenu ul li.separator {
  height: 15px;
  border-top: none;
  border-bottom: none;
  background: transparent;
  padding: 0;
  margin: 0;
}

/* Style specific parent menu item (Zoek op Thema) */
.boxSidemenu ul li.parent.menu-item-663 > a {
  font-size: 120%;
}


@media (max-width:1024px) and (max-height:500px) {
  .sprite-global.swipe-up {
    display: none;
  }
}

/* --- Source: nl_NL / 03-menu-ribbon.css --- */
/* Ensure the anchor is positioned so the absolutely positioned ribbon aligns correctly */
.boxSidemenu ul li a {
  position: relative;
}

.menu-ribbon-container {
  position: absolute;
  top: 3px;
  right: 0;
  overflow: visible;
  font-size: var(--rb-size, 11px);
  line-height: var(--rb-size, 14px);
  z-index: 10;
  padding-left: 10px;
}

/* Drop shadow part 1 */
.menu-ribbon-container:before {
  content: "";
  height: 0;
  width: 0;
  display: block;
  position: absolute;
  top: 2px;
  left: 0;
  border-top: 10px solid rgba(0, 0, 0, .3);
  border-bottom: 10px solid rgba(0, 0, 0, .3);
  border-right: 10px solid rgba(0, 0, 0, .3);
  border-left: 10px solid transparent;
}

/* Drop shadow part 2 */
.menu-ribbon-container:after {
  content: "";
  height: 2px;
  background: rgba(0, 0, 0, .3);
  display: block;
  position: absolute;
  bottom: -2px;
  left: 20px;
  right: 2px;
}

.menu-ribbon-container .ribbon-text {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 0 8px 0 2px;
  position: relative;
  background: var(--ribbon-color, #0089d0);
  overflow: visible;
  height: 20px;
  /*margin-left: 10px;*/
  right: -10px;
  left: unset;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  text-transform: uppercase;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
  box-shadow: 0px 1px 2px rgba(0,0,0,0.2);
}

/* Fold shadow */
.menu-ribbon-container .ribbon-text:after {
  content: "";
  height: 0;
  width: 0;
  display: block;
  position: absolute;
  bottom: -6px;
  right: 0;
  border-top: 6px solid rgba(0,0,0,0.4); 
  border-right: 6px solid transparent;
}

/* Forked part */
.menu-ribbon-container .ribbon-text:before {
  content: "";
  height: 0;
  width: 0;
  display: block;
  position: absolute;
  top: 0;
  left: -10px;
  border-top: 10px solid var(--ribbon-color, #0089d0);
  border-bottom: 10px solid var(--ribbon-color, #0089d0);
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
}

/* --- Source: nl_NL / 04-cookie-consent.css --- */
/* ==========================================================================
   COOKIE CONSENT BANNER & IFRAME OVERLAY
   ========================================================================== */

/* Hoofd Cookie Banner */
.cookie-banner { 
    position: relative;
    width: 100%; 
    background-color: #ffffff; 
    z-index: 99999; 
    padding: 15px 20px; 
    font-family: Arial, sans-serif; 
    border-bottom: 1px solid #e5e5e5; 
    box-sizing: border-box; 
    display: block; /* Zichtbaar by default */
}

.layout.sticky .cookie-banner {
    display: none;
}

/* Verberg de banner ALTIJD direct als de bezoeker al geaccepteerd heeft (voorkomt flicker) */
html.cookie-consent-granted #cookie-consent-banner,
html.cookie-consent-denied-hidden #cookie-consent-banner {
    display: none !important;
}

.cookie-content { 
    max-width: 1200px; 
    margin: 0 auto; 
    display: flex; 
    flex-wrap: wrap; 
    align-items: center; 
    justify-content: space-between; 
    gap: 15px; 
}
.cookie-content p { 
    margin: 0; 
    font-size: 14px; 
    line-height: 1.4; 
    color: #333; 
}
.cookie-text-default, .cookie-text-denied { 
    flex: 1 1 300px; 
}

/* Tekst Swap Logica voor Denied State */
.cookie-text-denied { display: none; }
html.cookie-consent-denied .cookie-banner .cookie-text-default { display: none; }
html.cookie-consent-denied .cookie-banner .cookie-text-denied { display: block; }
html.cookie-consent-denied .cookie-banner .btn-deny { display: none; }

/* Sluitknop Styling (Onopvallend) */
.btn-cookie-close {
    display: none; /* Standaard verborgen */
    position: absolute;
    top: 10px;
    right: 15px;
    background: transparent;
    border: none;
    font-size: 24px;
    color: #999;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    transition: color 0.2s;
}
.btn-cookie-close:hover {
    color: #333;
}

/* Zichtbaarheid van de sluitknop (alleen als denied actief is) */
html.cookie-consent-denied .btn-cookie-close { display: block; }

/* Knoppen Styling */
.cookie-buttons { 
    display: flex; 
    gap: 10px; 
}
.btn-cookie { 
    padding: 10px 20px; 
    font-size: 14px; 
    font-weight: bold; 
    cursor: pointer; 
    border: 2px solid #156bab; 
    border-radius: 4px; 
    transition: all 0.2s ease; 
    text-decoration: none; 
    display: inline-block; 
    text-align: center; 
}
.btn-deny { 
    background-color: #ffffff; 
    color: #156bab; 
}
.btn-deny:hover { 
    background-color: #f0f0f0; 
}
.btn-accept { 
    background-color: #156bab; 
    color: #ffffff; 
}
.btn-accept:hover { 
    background-color: #0e405d; 
}

/* Iframe Consent Wrapper & Overlay (Voor video's) */
.iframe-consent-wrapper { 
    position: relative; 
    width: 100%; 
    height: 100%; 
    display: block; 
    background: #f9f9f9; 
    border-radius: inherit; 
    overflow: hidden; 
    min-height: 200px; 
}
.iframe-consent-overlay { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    background-color: rgba(245, 245, 245, 0.95); 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    justify-content: center; 
    text-align: center; 
    padding: 20px; 
    box-sizing: border-box; 
    z-index: 10; 
    backdrop-filter: blur(5px); 
}
.iframe-consent-overlay .ico-lock { 
    font-size: 32px; 
    margin-bottom: 10px; 
    color: #666; 
}
.iframe-consent-overlay h4 { 
    margin: 0 0 10px 0; 
    font-size: 18px; 
    color: #333; 
    font-family: Arial, sans-serif; 
}
.iframe-consent-overlay p { 
    font-size: 14px; 
    color: #555; 
    margin-bottom: 20px; 
    max-width: 400px; 
    line-height: 1.4; 
    font-family: Arial, sans-serif; 
}
.iframe-consent-actions { 
    display: flex; 
    gap: 10px; 
    flex-wrap: wrap; 
    justify-content: center; 
}
.btn-external-link { 
    background-color: transparent; 
    color: #555; 
    border: 1px solid #ccc; 
    padding: 10px 15px; 
    font-size: 13px; 
    text-decoration: none; 
    border-radius: 4px; 
    font-weight: normal; 
    transition: all 0.2s; 
}
.btn-external-link:hover { 
    background-color: #eee; 
    color: #333; 
}

.footerInfo .cookie {
    float:right;
}


@media (max-width:1024px) { 

    .footerInfo .cookie {
        float:none;
    }
    .footerInfo .cookie a {
        color: inherit;
    font-size: 18px;
    }
}

/* Mobile Responsiveness */
@media (max-width: 600px) {
    .cookie-content { 
        flex-direction: column; 
        text-align: center; 
    }
    .cookie-buttons { 
        flex-direction: column; 
        width: 100%; 
    }
    .btn-cookie { 
        width: 100%; 
    }
    .iframe-consent-actions { 
        flex-direction: column; 
        width: 100%; 
    }
}

/* --- Source: nl_NL / 05-popup.css --- */
/* --- SHARED POPUP SYSTEM OVERHAUL --- */

/* Prevent scrolling on body when popup is open */
html.noscroll {
  overflow: hidden;
}

/* Darker, cooler overlay */
.popup-bg {
  position: fixed;
  z-index: 490000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #0f172a; /* Slate 900 */
  opacity: 0.65; /* Slightly more transparent, softer feel */
  backdrop-filter: blur(3px); /* Modern blur effect */
}

.popup-wrap {
  position: fixed;
  z-index: 500000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px; /* Prevents edge-touching on mobile */
  box-sizing: border-box;
  backdrop-filter: blur(3px); /* Modern blur effect */
}

.popup-wrap > .contents {
  max-height: 100%;
  overflow-y: auto;
}

/* Base Popup Form Styling */
.popupform {
  background: #ffffff;
  border-radius: 12px; /* Smoother corners */
  padding: 32px; /* More breathing room */
  width: 600px;
  max-width: 100%;
  position: relative;
  box-sizing: border-box;
  box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.2);
  font-family: 'Inter', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  color: #1e293b;
}

/* Modernize H2 */
.popupform > h2 {
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 16px 0;
  color: #0f172a;
  /* Replaced the bottom border with clean typography spacing */
}

/* Global Input Blocks */
.popupform .inputblock label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #475569;
  margin-bottom: 6px;
}

/* Global Button Layout */
.popupform .buttons {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: flex-end; /* Pushes buttons to the right */
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid #e2e8f0; /* Subtle divider */
}

/* Modern Button Styles */
.popupform .button {
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.2s ease;
  border: none;
}

/* Primary "Save/Action" Button */
.popupform .button.primary {
  box-shadow: 0 2px 4px rgba(37, 99, 235, 0.2);
}

.popupform .button.primary:hover {
}

/* Secondary "Cancel/Close" Button */
.popupform .buttons .button.close {
  background: #f1f5f9;
  color: #475569;
}

.popupform .buttons .button.close:hover {
  background: #e2e8f0;
  color: #0f172a;
}

.contactpopup p {
  font-size: 18px;
  line-height: 1.4em;
}

/* --- Source: nl_NL / 06-cartpopup.css --- */
/* ==========================================================================
   CART POPUP UI (B2B Optimized)
   Extends global popup.css without modifying base properties
   ========================================================================== */

/* Subtle Header Gradients based on State */
.cartpopup.state-success { border-top: 6px solid #22c55e; background: linear-gradient(to bottom, #f0fdf4 0%, #ffffff 40px); }
.cartpopup.state-warning { border-top: 6px solid #f59e0b; background: linear-gradient(to bottom, #fffbeb 0%, #ffffff 40px); }
.cartpopup.state-error   { border-top: 6px solid #cf0119; background: linear-gradient(to bottom, #fef2f2 0%, #ffffff 40px); }

.cartpopup .popup-close-icon {
  position: absolute;
  top: 16px;
  right: 16px;
  background: transparent;
  border: none;
  color: #94a3b8;
  cursor: pointer;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  transition: all 0.2s;
  padding: 0;
}
.cartpopup .popup-close-icon:hover {
  background-color: #e2e8f0;
  color: #0f172a;
}

/* Status Icons */
.cartpopup .status-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  color: #fff;
  margin-right: 12px;
  flex-shrink: 0;
}
.cartpopup .status-icon.success { background-color: #22c55e; }
.cartpopup .status-icon.warning { background-color: #f59e0b; }
.cartpopup .status-icon.error   { background-color: #cf0119; }

/* Product Context B2B Optimization (Visual + SKU) */
.cartpopup .cart-product-context {
  margin-bottom: 24px;
  padding: 16px;
  background: #f8fafc;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  display: flex;
  align-items: center;
  gap: 16px;
  text-align: left;
}
.cartpopup .cart-product-context .prod-img {
  width: 50px;
  height: 50px;
  flex-shrink: 0;
  background: #fff;
  border-radius: 6px;
  border: 1px solid #cbd5e1;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.cartpopup .cart-product-context .prod-img img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.cartpopup .cart-product-context .prod-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.cartpopup .cart-product-context .prod-sku {
  font-family: monospace;
  color: #64748b;
  font-size: 13px;
  font-weight: 600;
}
.cartpopup .cart-product-context .prod-name {
  color: #0f172a;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
}

/* Split Choice UI for Bulk Buying */
.cartpopup .split-choice-ui {
  display: flex;
  gap: 20px;
  margin-bottom: 20px;
  align-items: stretch;
}
.cartpopup .choice-box {
  flex: 1;
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  padding: 20px 16px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 12px;
}
.cartpopup .choice-box label {
  font-size: 14px;
  font-weight: 600;
  color: #334155;
  margin: 0;
}
.cartpopup .choice-box .pricebits {
  font-size: 13px;
  color: #64748b;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* Merged Input/Button Touch Targets */
.cartpopup .input-group {
  display: flex;
  width: 100%;
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}
.cartpopup .input-group input[type="number"] {
  width: 80px;
  height: 44px; /* Mobile minimal height */
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  border: 1px solid #cbd5e1;
  border-right: none;
  border-radius: 6px 0 0 6px !important;
  color: #0f172a;
  margin: 0 !important;
  box-sizing: border-box;
  box-shadow: none;
}
.cartpopup .input-group input[type="number"]:focus {
  border-color: #3b82f6;
  outline: none;
}
.cartpopup .input-group .button.add {
  flex: 1;
  height: 44px;
  border-radius: 0 6px 6px 0 !important;
  margin: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  gap: 5px;
}

.cartpopup .choice-box.overbox .button.add {
  height: 44px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  gap: 5px;
}

body.de_de {
  .cartpopup .button.add {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }
}

/* Info Blocks */
.cartpopup .info-block {
  background: #f1f5f9;
  padding: 16px;
  border-radius: 8px;
  color: #334155;
  font-size: 14px;
  line-height: 1.5;
  margin-bottom: 20px;
}
.cartpopup .info-block.highlight {
  background: #fffbeb;
  border: 1px solid #fde68a;
  color: #92400e;
}
.cartpopup .info-block.lead-text {
  font-size: 16px;
  font-weight: 500;
}
.cartpopup .info-block p { margin: 0; }

/* Realtime Stock Styling */
.cartpopup .productbits .updated,
.cartpopup .productbits .removed {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid rgba(0,0,0,0.05);
  padding: 8px 0;
}
.cartpopup .productbits .updated:last-child,
.cartpopup .productbits .removed:last-child {
  border-bottom: none;
}

/* AI Button Highlight */
.cartpopup .ai-chat-btn {
  background: linear-gradient(135deg, #6366f1, #8b5cf6) !important;
  color: #fff !important;
  border: none !important;
}

/* Loader */
/* Loader - Optimized for UX and conversion */
.loading-popup {
  background: #fffcfc99;
  width: 200px;
  height: 200px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  border: solid 2px #61739a;
}

.loading-popup .sprite-global.thumb-png {
  width: 110px;
  height: 120px;
  display: block;
  transform-origin: center center;
  /* Smooth, calming ease-in-out timing function */
  animation: subtle-thumb-breathe 1.5s ease-in-out infinite;
}

/* 
  Subtle breathing effect:
  1. Base scale is reduced (0.75 - 0.85) to be less overbearing.
  2. Gentle opacity and size shifts communicate "processing" 
     without erratic, distracting movement.
*/
@keyframes subtle-thumb-breathe {
  0% {
    transform: scale(0.75);
    opacity: 0.5;
  }
  50% {
    transform: scale(0.85);
    opacity: 1;
  }
  100% {
    transform: scale(0.75);
    opacity: 0.5;
  }
}

/* ==========================================================================
   MOBILE RESPONSIVENESS
   ========================================================================== */
@media (max-width: 500px) {
  .cartpopup.popupform {
    padding: 24px 20px;
  }
  .cartpopup .split-choice-ui {
    flex-direction: column;
    gap: 12px;
  }
  
  .cartpopup .choice-box .button.add {
    white-space: normal;
    line-height: 1.2;
  }
  
  /* Stack Action Buttons */
  .cartpopup.popupform .buttons {
    flex-direction: column-reverse; 
    align-items: stretch;
    gap: 12px;
  }
  .cartpopup.popupform .buttons .button {
    width: 100%;
    text-align: center;
    justify-content: center;
    height: 48px;
    display: flex;
    align-items: center;
  }
}

/* --- Source: nl_NL / 08-forms.css --- */
.formstatus {
  display: none;
  background: white;
  padding: 10px;
  color: black;
  border-radius: 3px;
}
.formstatus.show {
  display: block;
}
.formstatus.error {
  color: #842029;
  background-color: #f8d7da;
  border: 1px solid #f5c2c7;
}

/* Fix numbered list being outside container */
.formstatus ol,
.loginstatus ol {
  margin: 5px 0 0 0;
  padding-left: 25px;
}

.loginstatus {
  display: none;
  padding: 10px;
  border-radius: 4px;
  font-size: 13px;
  margin-top: 10px;
}
.loginstatus.show {
  display: block;
}
.loginstatus.error {
  color: #842029;
  background-color: #f8d7da;
  border: 1px solid #f5c2c7;
}

/* Input error state highlighting */
input, select, textarea {
  transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

input.error, select.error, textarea.error {
  border-color: #dc3545 !important;
  background-color: #fffafa !important;
}

input.error:focus, select.error:focus, textarea.error:focus {
  box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25) !important;
  outline: none;
}

.loginbtns .formstatus {
  margin-top: 1em;
}

/* --- Source: nl_NL / 09-chat.css --- */
#ai-chat {
  position: fixed;
  bottom: 0;
  right: 0;
  width: 0;
  height: 0;
  z-index: 400000;
}
#ai-chat .avatar {
  display: flex;
  cursor: pointer;
  z-index: 1042;
  position: absolute;
  bottom: 20px;
  right: 10px;
  width: 50px;
  height: 50px;
  align-items: center;
  justify-content: center;
  -moz-user-select: none; -webkit-user-select: none; -ms-user-select:none; user-select:none;-o-user-select:none;
  opacity: 1;
  transition: opacity .2s;
}
#ai-chat .avatar img {
  border-radius: 50%;
  border: 2px solid rgba(67,139,194,.5);
  opacity: .5;
  width: 50px;
  height: 50px;
  transition: opacity .4s;
  background: #f2f2f2;
}
#ai-chat .avatar img.status,
#ai-chat .avatar.status img.agent {
  display: none;
}
#ai-chat .avatar.status img.status {
  display: block;
}
html.chat-small #ai-chat .avatar {
  display: none;
}
#ai-chat .bubble,
#ai-chat .desk {
  position: absolute
}
html.chat-large #ai-chat .avatar img, 
#ai-chat .avatar.status img,
#ai-chat .avatar:hover img {
  opacity: 1;
}
#ai-chat .avatar .button {
  position: absolute;
  bottom: -10px;
  font-size: 10px;
  padding: 4px 7px;
  margin: 0 auto;
  white-space: nowrap;
}
#ai-chat .avatar video {
  display: none;
  border-radius: 50%;
    border: 2px solid rgba(67,139,194,.5);
    width: 50px;
    height: 50px;
    object-fit: cover;
}
#ai-chat .avatar.video img,
#ai-chat .avatar.video .button,
#ai-chat .avatar.status.video img.status {
  display: none;
}
#ai-chat .avatar.video video {
  display: block;
}
#ai-chat .desk {
  bottom: 0;
  right: 0;
  opacity: 1;
  transition: bottom .4s,opacity .4s
}
#ai-chat.kitt .desk {
  width: 321px;
  height: 150px;
}
#ai-chat .bubble {
  background-color: #f2f2f2;
  border-radius: 10px;
  box-shadow: #b2b2b2 0 0 6px;
  display: block;
  padding: 10px;
  vertical-align: top;
  transition: bottom .5s, right .5s, bottom .5s,opacity .5s, width .5s, height .5s;
  /*bottom .6s,opacity .5s .3s;*/
  opacity: 0;
  bottom: -500px;
  max-height: 100px;
}
#ai-chat .desk {
  opacity: 0;
  bottom: -500px;
  transition: bottom 1s .2s,opacity 1s .2s
}
html.chat-small #ai-chat .bubble,
html.chat-large #ai-chat .bubble {
  opacity: 1;
  max-height: unset;
}
html.chat-small #ai-chat .desk,
html.chat-large #ai-chat .desk {
  bottom: 0;
  right: 0;
  opacity: 1;
  transition: bottom .4s,opacity .4s, height .4s;
}
html.chat-small #ai-chat .bubble {
  width: 200px;
  height: 120px;
  bottom: 230px;
  right: 5px;
  transition: bottom .5s, right .5s, bottom .5s,opacity .5s, width .5s, height .5s;
}
html.chat-large #ai-chat .bubble {
  width: 450px;
  height: 250px;
  bottom: 10px;
  right: 5px;
  margin: 5px 0 5px 45px;
  transition: bottom .5s, right .5s, bottom .5s,opacity .5s, width .5s, height .5s;
}
html.chat-small #ai-chat.notrans .desk,
html.chat-small #ai-chat.notrans .bubble {
  transition: none;
}
html.chat-small #ai-chat.kitt .bubble {
  bottom: 165px;
}
#ai-chat .bubble .inner {
  position: relative;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%
}
#ai-chat .bubble .txt {
  cursor: default;
  margin: 0;
  width: 95%;
  overflow: hidden
}
#ai-chat .bubble .messages {
  overflow: hidden;
  transition: opacity .5s;
}
#ai-chat .bubble .messages > div:not(.scroll-anchor) {
  margin-bottom: 2px;
  padding-bottom: 2px;
  min-height: 12px;
  transition: opacity .2s;
}
html.chat-large #ai-chat .bubble .messages > div {
  margin-bottom: 3px;
  padding-bottom: 3px;
}
#ai-chat:hover .bubble .messages > div {
  opacity: .2;
}
#ai-chat .bubble .messages > div:last-child {
  border-bottom: none;
}
#ai-chat .bubble .messages > div.user > span.name,
#ai-chat .bubble .messages > div.agent > div.name {
  float:left;
  margin-right: 2px;
  color: #2f70a1;
  font-weight: bold;
}
#ai-chat .bubble .messages > div.agent > div.name {
  display: inline-flex;
  gap: 2px;
}
#ai-chat .bubble .messages > div.agent > div.text {
  display: inline;
}
#ai-chat .bubble .messages > div.system {
  transition: opacity .5s;
}
#ai-chat .bubble .messages > div.system.removed {
  opacity:0;
}
#ai-chat .bubble .messages > div.system.not-connected {
  z-index: 20;
  opacity: 1;
  position: relative;
}
#ai-chat .bubble .messages > div.system.cart {
  padding-left: 3px;
  margin-bottom: 0;
  font-size: 10px;
  min-height: 10px;
}
#ai-chat .bubble .messages > div.system.cart a {
  font-style: italic;
}
#ai-chat .bubble .messages > div.system.cart.rm a {
  text-decoration: line-through;
}
html.chat-small #ai-chat .bubble .messages > div.system.cart {
  font-size: 9px;
  line-height: 11px;
  min-height: unset;
}
html.chat-small #ai-chat .bubble .messages > div.system.cart a {
  font-style: normal;
}
#ai-chat .bubble .messages > div.loading:after {
  content: ".."; /* Unicode ellipsis character */
  animation: dots 1s infinite;
}
html.chat-small #ai-chat .bubble .messages .txt {
  margin-bottom: 2px
}
html.chat-small #ai-chat .bubble .messages {
  font-size: 10px;
  line-height: 1.3em;
height: 85px;
  box-sizing: border-box;
}
html.chat-large #ai-chat .bubble .messages {
  font-size: 12px;
  line-height: 1.3em;
  max-height: 215px;
}
#ai-chat .bubble .messages .txt .operator {
  color: #2f70a1;
  font-weight: 700
}
#ai-chat .bubble .messages .txt .customer {
  color: #ed6198;
  font-weight: 700
}
#ai-chat .bubble .messages .txt.system {
  font-style:italic;
}
#ai-chat .bubble .messages .txt.system .i {
  font-style:normal;
}
#ai-chat .bubble .messages .txt a {
  text-decoration:underline;
}
#ai-chat .bubble .connecting {
  position: absolute;
  width: 100%;
  height: 85px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #3777a9;
  background: #f2f2f2d6;
  opacity: 0;
}
#ai-chat .bubble .connecting > span {
  display: inline-block;
  background: #f2f2f2d6;
  border-radius: 10px;
  opacity: .5;
  animation: connecting 1.5s infinite;
}
#ai-chat:hover .bubble .connecting {
  opacity: 1;
}
html.connected #ai-chat .bubble .connecting {
  display: none;
}
html.connected #ai-chat .bubble .messages {
  overflow: hidden auto;
}
html.connected #ai-chat .bubble .messages > div,
html.connected #ai-chat:hover .bubble .messages > div {
  opacity: 1;
}
html.chat-large #ai-chat .bubble .connecting {
  height: 215px;
  font-size: 22px;
}
#ai-chat .bubble .input {
    font-size: 12px;
    line-height: 1.2em;
    margin: 0px 0px 2px;
    border: 1px solid rgb(176, 176, 176);
    color: rgb(68, 136, 187);
    font-weight: 400;
    border-radius: 4px;
    padding: 4px 6px;
    width: 100%;
    box-sizing: border-box;
    background: rgb(255, 255, 255);
    box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 8px inset;
    outline: none;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 30px;
  background: #fff;
  resize: none;
  padding-top: 8px;
  padding-right: 25px;
}
html.chat-large #ai-chat .bubble .input {
  padding-right: 45px;
}
#ai-chat .bubble .input.has-input {
  font-size: 11px;
}
#ai-chat .menu-btn {
  z-index: 1042;
  position: absolute;
  top: -5px;
  right: -5px;
  width:20px;
  height: 20px;
  display: flex;
  cursor: pointer;
  background: #f2f2f299;
  transition: background-color .2s;
}
#ai-chat .menu-btn > svg {
  stroke: #3676a7;
  width:20px;
  height: 20px;
}
html.chat-large #ai-chat .menu-btn {
  width:24px;
  height: 24px;
}
html.chat-large #ai-chat .menu-btn > svg {
  width:24px;
  height:24px;
}
#ai-chat .menu {
  display: flex;
  font-size: 12px;
  line-height: 14px;
  white-space: nowrap;
  position: absolute;
  top: -1px;
  right: 13px;
  box-shadow: #518fbf 0 0 1px;
  z-index: 1041;
  flex-direction: column;
  gap: 0px;
  border-radius: 2px;
  text-align: center;
  background: #f2f2f2;
  opacity: 0;
  top: -20px;
  transition: top .5s, opacity .5s;
  visibility: hidden;
}
html.chat-large #ai-chat .menu {
  right: 17px; 
}
#ai-chat .menu > a {
  padding: 5px 7px;
  border-bottom: solid 1px #efefef;
  display: block;
}
#ai-chat .menu > a.chat-small {
  display: none;
}
html.chat-large #ai-chat .menu > a.chat-small {
  display: block;
}
#ai-chat .menu > a.chat-large {
  display: none;
}
html.chat-small #ai-chat .menu > a.chat-large {
  display: block;
}
#ai-chat .menu > a:hover {
  background: #397bad1f;
}
#ai-chat .menu > a:last-child {
  border-bottom: 0;
}
#ai-chat.menu-open .menu-btn {
  background: #4f8cba;
  box-shadow: none;
  border-radius: 2px; 
}
#ai-chat.menu-open .menu-btn > svg {
  stroke: #fff;
}
#ai-chat.menu-open .menu {
  opacity: 1;
  top: 0px;
  visibility: visible;
}
#ai-chat.menu-open .messages {
  opacity: .2;
}
#ai-chat .bubble .submit {
  display: none;
}
html.chat-small #ai-chat .bubble .submit {
  cursor: pointer;
  position: absolute;
  bottom: 7px;
  right: 6px;
  width: 20px;
  padding: 2px 5px;
  font-size: 14px;
  line-height: 14px;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: .4;
  filter: grayscale(1);
  transition: opacity .4s, filter .4s;
}
html.chat-small #ai-chat .bubble .input.has-input.notrans + .submit {
  transition: none;
}
html.chat-small #ai-chat .bubble .input.has-input + .submit {
  opacity: 1;
  filter:none;
}
html.chat-large #ai-chat .bubble::after,
html.chat-small #ai-chat .bubble::after {
  content: "";
  position: absolute;
  bottom: -15px;
  border-style: solid;
  border-width: 15px 15px 0;
  border-color: #f2f2f2 transparent;
  display: block;
  width: 0;
}
html.chat-small #ai-chat .bubble::after {
  left: 32px
}
html.chat-large #ai-chat .bubble::after {
  right: 32px
}
html.chat-small #ai-chat .bubble {
  margin: 5px 20px 5px 45px
}
html.chat-large #ai-chat .bubble::before,
html.chat-small #ai-chat .bubble::before {
  box-shadow: rgba(178,178,178,.4) 2px -2px 2px 0;
  right: -9px
}
#ai-chat .bubble .txt {
margin-bottom:2px;
}
#ai-chat .bubble .txt:last-child {
  margin-bottom: .5em;
}
#ai-chat .bubble .txt .t p:first-child {
  display:inline;
}
#ai-chat .bubble .txt .t p:first-child + p {
  margin-top:10px;
}
#ai-chat .bubble .txt > p {
margin-bottom:10px;
}
#ai-chat .bubble .txt .t h1 {
  font-size: 18px;
  line-height: 22px;
}
#ai-chat .bubble .txt .t h2{
  font-size: 16px;
  line-height: 20px;
}
#ai-chat .bubble .txt .t h3,
#ai-chat .bubble .txt .t h4 {
  font-size: 14px;
  line-height: 18px;
font-weight:bold;
}
#ai-chat .bubble .txt .t.flex {
    display:flex;
    gap: 5px;
}
#ai-chat .bubble .txt .t .cart-table {
  display: grid;
  grid-template-columns: min-content 3fr;
  grid-gap: 2px;
  width: 100%;
  border-collapse: collapse;
}
#ai-chat .bubble .txt.connecting,
#ai-chat .bubble .txt.connect-error{
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  line-height: 20px;
  position: absolute;
  top: 0;
  height: 100%;
  background: #f2f2f2;
}
#ai-chat .bubble.connecting .input,
#ai-chat .bubble.connect-error .input{
  display:none;
}
#ai-chat .bubble.connecting .messages .txt .i,
#ai-chat .bubble.connect-error .messages .txt .i{
  font-size: 30px;
  line-height: 34px;
  margin-bottom: 3px;
}
#ai-chat .bubble.connect-error .messages .txt .t {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
#ai-chat .bubble.connecting .messages .txt {
  flex-direction: column;
}
#ai-chat .bubble .messages .txt img.kitt {
  width:44px;
  height: 50px;
  background: black;
  border-radius: 5px;
  padding-left: 5px;
  padding-right: 5px;
  margin-bottom: 5px;
  display: block
}
#ai-chat .bubble .kittInput {
  height: 24px;
  position: absolute;
  display:none;
  z-index: 1042;
  right: 0px;
  left: unset;
  border-radius: 50%;
  bottom: 5px;
  right: 4px;
  width: 16px;
  height: 16px;

  object-fit: cover;
  border: solid 3px #000;
}
html.chat-large #ai-chat .bubble .kittInput {
  bottom: 0px;
  right: 35px;
  width: 20px;
  height: 20px;

}
#ai-chat .bubble .input.agentTyping ~ .kittInput {
  display: block;
}
#ai-chat .bubble .input.agentTyping ~ .submit {
  display: none;
}
#ai-chat .bubble .txt .t pre {
  white-space:pre-wrap;
}
#ai-chat .bubble .txt.error .t {
  color:maroon;
}
#ai-chat .bubble .txt.youtube {
  margin-top: 5px;
}
#ai-chat .bubble .txt.youtube > .t {
  display:flex;
  gap:5px;
}
#ai-chat .bubble .txt.youtube img {
  border-radius: 5px;
  width: 100px;
}
#ai-chat .bubble .txt img {
  max-width: 100px;
  max-height: 100px;
  object-fit: cover;
  display: block;
}
#ai-chat .bubble .txt.has-html img {
  max-width: 100%;
}


.gridSpan3 .chat {
  display: none
}


html.sidemenu #ai-chat {
      filter: grayscale(1);
    }
html.sidemenu #ai-chat .avatar {
      opacity: 0;
    }
.nav-menu-chat {
      display: none;
      align-items: center;
      gap: 7px;
      z-index: 9999999;
      position: fixed;
        color: #fff;
        font-size: 18px;
          font-weight: 700;
        white-space: nowrap;
        bottom: 5px;
        left: 10px;
        transition: opacity .55s ease 0s;
        box-sizing: border-box;
        height: 32px;
    }
.nav-menu-chat > span { 
      border: solid 3px white;
        border-radius: 4px;
        padding: 10px;
        width: 24px;
        height: 24px;
        background: none;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 12px;
        line-height: 12px;
        font-weight: bold;
    }

@media (max-width:1024px) {

  #ai-chat .chatimg {
    bottom: 60px
  }
  html.chat-large #ai-chat .bubble {
    bottom: 40px
  }
  .gridSpan3 .chat {
    opacity: 0;
    position: fixed;
    left: -240px;
    z-index: 99999;
    bottom: 70px;
    text-align: center;
    transition: left 0s ease 0s,opacity .4s ease .35s;
    display: flex;
    flex-direction: column
  }
  .gridSpan3 .chat img {
    border-radius: 50%;
    border: 2px solid rgba(67,139,194,.5);
    opacity: .9;
    width: 100px;
    height: 100px
  }
  .gridSpan3 .chat .button {
    position: relative;
    top: -20px;
    display: inline-block;
    margin: 0 auto
  }
  
  .chatbtn {
    bottom: 50px!important;
    z-index: 9995
  }
  .gridSpan3.scrll .chat img {
    opacity: 1;
    transition: opacity .4s ease 0s
  }
  .gridSpan3.scrll .chat img {
    opacity: 0
  }




html.chat-large,
html.chat-large body {
  overflow: hidden;
}  

#ai-chat {
  right:auto;
  left:0;
    bottom: 40px!important;
    width: 100%;
}
#ai-chat .menu {
  right: 17px;
}
html.chat-large #ai-chat .menu {
  right: 21px;
}

html.chat-small #ai-chat,
html.chat-large #ai-chat {
  z-index: 200000;
}

#ai-chat .avatar {
  right: 10px;
  bottom: 10px;
  width: unset;
  height: unset;
}
#ai-chat .avatar > span.button {
  position: relative;
  bottom: unset;
}

html.chat-large #ai-chat .bubble .connecting,
html.chat-small #ai-chat .bubble .connecting {
  height: calc(100% - 55px);
}
  html.chat-large .nav-menu-chat {
    display: flex;
  }
 #ai-chat .avatar img,
 html.chat-large #ai-chat .avatar {
    display:none;
  }
  html.chat-large #ai-chat .bubble .submit {
  cursor: pointer;
  position: absolute;
  bottom: 7px;
  right: 6px;
  width: 20px;
  padding: 2px 5px;
  font-size: 14px;
  line-height: 14px;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: .4;
  filter: grayscale(1);
  transition: opacity .4s, filter .4s;
}
html.chat-large #ai-chat .bubble .input.has-input.notrans + .submit {
  transition: none;
}
html.chat-large #ai-chat .bubble .input.has-input + .submit {
  opacity: 1;
  filter:none;
}

  html.chat-large #ai-chat .bubble,
  html.chat-small #ai-chat .bubble {
    right: auto;
    bottom: 0px!important;
left:0;
    box-sizing: border-box;
    z-index: 1041;
    background: #fff
  }
  html.chat-small #ai-chat .bubble::after,
  html.chat-large #ai-chat .bubble::after {
    content: '';
    display: none;
  }
  #ai-chat .bubble .connecting {
    border-radius: 5px;
  }
  html.chat-large #ai-chat .bubble,
  html.chat-small #ai-chat .bubble {
    margin: 0;
    width: 100%;
    width: var(--vw);
    width: 100dvw;
    border-radius: 0
  }
  #ai-chat .bubble .input {
    font-size: 14px;
    padding: 10px;
    height: auto
  }
  html.chat-small #ai-chat .bubble {
    height: auto;
    padding: 10px;
    padding-bottom: 5px;
  }
  html.chat-large #ai-chat .bubble {

    height: 80%;
    height: calc(var(--vh) - 42px);
    height: calc(100dvh - 42px);

    padding: 10px;
    padding-bottom: 5px;
  }
html.chat-large #ai-chat .bubble .messages {
  max-height: calc(var(--vh) - 110px);
  max-height: calc(100dvh - 110px);
}

  #ai-chat .bubble .close {
    top: -2px;
    right: -2px
  }
  #ai-chat .desk {
    display: none;
  }

   #ai-chat .menu-btn {
    background: none;
    box-shadow: none;
  }
  #ai-chat .menu-btn,
  #ai-chat .menu-btn > svg {
    width:24px;
    height:24px;
  }
  html.chat-large #ai-chat .menu-btn,
  html.chat-large #ai-chat .menu-btn > svg {
    width:28px;
    height:28px;
  }


  html.chat-small #ai-chat .bubble .input {
    position: relative;
    margin-top: 10px
  }

}


@media (max-width:768px) {


  .chatbtn {
    display: none!important
  }

  @keyframes connecting {
  from { opacity: 1; }
  30% { opacity: .5; }
  to { opacity: 1; }
}
@keyframes dots {
  0% {
    content: "";
  }
  50% {
    content: ".";
  }
  100% {
    content: "..";
  }
}

/* --- Source: nl_NL / 10-banners.css --- */
.boxTextBanner {
  position: relative;
}

/* --- Source: nl_NL / 11-langmenu.css --- */
/* templates/nl_NL/css/langmenu/01-langmenu.css */
/* 
   =============================================================
   ASYNC LANGUAGE MENU MODULE
   =============================================================
*/
.layoutHeader .optionbar .btn-langmenu {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    padding: 0 10px;
    background: rgba(0,0,0,0.2);
    border-radius: 4px;
    transition: background 0.2s;
    height: 20px;
    line-height: 20px;
    margin-top: 3px;
    user-select: none;
    font-weight: bold;
}
.layoutHeader .optionbar .btn-langmenu:hover {
    background: rgba(0,0,0,0.4);
}
.layoutHeader .optionbar .btn-langmenu span:first-child {
    margin-right: 5px;
    font-size: 14px;
}
#lang-menu-toggle {
    display: none;
}
.lang-menu-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    z-index: 9999998;
    backdrop-filter: grayscale(100%);
    -webkit-backdrop-filter: grayscale(100%);
    animation: fadeInOverlay 0.2s forwards;
}
#lang-menu-toggle:checked ~ .lang-menu-overlay {
    display: block;
}
#lang-menu-toggle:checked ~ #langmenu {
    display: flex;
}

html.noscroll, html.langmenu-open, body.noscroll, body.langmenu-open {
    overflow: hidden !important;
}
  
.widget.language-index {
    display: none; /*  */
}

@keyframes fadeInOverlay {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* --- Source: de_DE / 99-de.css --- */
.layoutHeader .main .butterfly {
  top: 55px;
}
.layoutFooter .butterfly {
  transform: translateY(-190px);
}