/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Sep 19 2026 | 15:10:40 */
/* Header responsief, toegevoegd 8 september 2026.

   Tussen 768 en 980 pixels breed had de header helemaal geen navigatie.
   Divi verbergt in die band namelijk zowel de code-modules (het bureaumenu)
   als de mobiele menumodule, dus daar viel het menu weg en schoof de rij uit
   elkaar. Hieronder krijgt dat bereik dezelfde opzet als de telefoon:
   hamburger links, logo ernaast, winkelwagen rechts, zoekbalk eronder.

   Daarnaast liep de bureaubalk tussen 981 en 1200 pixels over twee regels,
   doordat "Hoe activeer ik mijn aankoop?" niet meer paste. Daar staat de
   balk nu iets compacter. */

/* --- 1. hamburger terug in de hele band, ook op precies 768 (iPad staand) --- */
@media only screen and (min-width:768px) and (max-width:980px){
  header.et-l .et_pb_module.et_pb_menu_0_tb_header{display:block !important;}
}

/* --- 2. layout voor 769-980: onder 769 doet de bestaande telefoonstijl het werk --- */
@media only screen and (min-width:769px) and (max-width:980px){

  /* rij als flexbox zodat de kolommen kunnen herschikken */
  header.et-l .et_pb_row_0_tb_header{display:flex !important;flex-wrap:wrap;align-items:center;position:static !important;}
  header.et-l .et_pb_row_0_tb_header > .et_pb_column{float:none !important;margin:0 !important;}

  /* hamburger en logo links */
  header.et-l .et_pb_row_0_tb_header > .et_pb_column_0_tb_header{
    width:auto !important;order:1;display:flex !important;align-items:center;gap:14px;
    margin-right:auto !important;position:static !important;}
  header.et-l .et_pb_image_0_tb_header{margin:0 !important;}
  header.et-l .et_pb_image_0_tb_header img{width:180px !important;max-width:180px !important;}
  header.et-l .et_pb_module.et_pb_menu_0_tb_header{
    order:-1;position:static !important;background:transparent !important;
    margin:0 !important;width:auto !important;}
  header.et-l .et_pb_menu_0_tb_header .et_pb_menu_inner_container{
    background:transparent !important;position:static !important;}

  /* uitklappaneel over de volle breedte, netjes onder de header */
  header.et-l #main-site-header{position:relative !important;}
  header.et-l .et_pb_menu_0_tb_header .et_mobile_nav_menu ul#mobile_menu1.et_mobile_menu{
    position:absolute !important;top:100% !important;left:0 !important;right:0 !important;
    width:auto !important;margin:0 !important;max-height:75vh;overflow-y:auto;box-sizing:border-box;}

  /* winkelwagen rechts, en niet als tweede hamburger */
  header.et-l .et_pb_row_0_tb_header > .et_pb_column_2_tb_header{
    width:150px !important;flex:0 0 150px;order:2;display:flex !important;align-items:center;}
  header.et-l .et_pb_menu_1_tb_header{width:100% !important;margin:0 !important;}
  header.et-l .et_pb_menu_1_tb_header .et_pb_menu__menu{display:flex !important;}
  header.et-l .et_pb_menu_1_tb_header .et_mobile_nav_menu{display:none !important;}

  /* lege accountkolom weg, zoekbalk op een eigen regel */
  header.et-l .et_pb_row_0_tb_header > .et_pb_column_3_tb_header{display:none !important;}
  header.et-l .et_pb_row_0_tb_header > .et_pb_column_1_tb_header{
    width:100% !important;order:3;margin-top:14px !important;top:0 !important;}
}

/* --- 3. bureaubalk compacter tussen 981 en 1200 --- */
@media only screen and (min-width:981px) and (max-width:1200px){
  .sk-menu .sk-bar > li:not(.sk-service) > a{font-size:15px !important;padding-left:8px !important;padding-right:8px !important;}
  .sk-menu .sk-bar > li.sk-service{padding-left:12px !important;}
  .sk-menu .sk-bar > li.sk-service + li.sk-service{padding-left:10px !important;}
  .sk-menu .sk-bar > li.sk-service a{font-size:11px !important;white-space:nowrap !important;}
}

/* servicelinks nooit afbreken */
.sk-menu .sk-bar > li.sk-service a{white-space:nowrap;}