body{background-color:#fff}

main{align-items:start;display:grid;grid-template-columns:100%;grid-template-rows:auto auto auto auto;grid-template-areas:'nav' 'images' 'buy' 'info' 'reviews' 'recommend';height:100%;width:100%}
main{-ms-grid-columns:100%;-ms-grid-rows:auto auto auto auto}

#images{grid-area:images;width:100%}
#images{-ms-grid-row:1;-ms-grid-row-span:1;-ms-grid-column:1;-ms-grid-column-span:1}
#images-inner{overflow:hidden;position:relative;width:100%}
#images-main img{
    font-size:24px;height:100%;object-fit:contain;width:100%;
    cursor: pointer;
    /*cursor:zoom-in;*/
}
.main-slider .fullscreen img { cursor: zoom-out; }
#images-thumbs img{border:1px solid #f0f4f7}

#buy{grid-area:buy;height:100%;padding-left:12px;padding-right:12px;width:100%}
#buy{-ms-grid-row:1;-ms-grid-row-span:2;-ms-grid-column:2;-ms-grid-column-span:1}
#buy-addtocart{margin-bottom:8px}
#buy-addtocart a,
#buy-addtocart button {
    align-items:flex-start;background-color:green;border:1px solid green;border-radius:2px;color:#fff;cursor:pointer;display:inline-block;font-size:18px;font-weight:400;line-height:30px;margin:0;min-width:160px;padding:8px 24px 8px 32px;position:relative;text-align:center;transition:box-shadow .3s;user-select:none;width:100%
}
#buy-addtocart a:hover,
#buy-addtocart button:hover {box-shadow: 0 0 11px rgba(33,33,33,.2)}
#buy-addtocart a span,
#buy-addtocart button span {margin-right:12px}
#buy-addtocart a i {vertical-align:middle}
/*#buy-addtocart a i:before,*/
/*#buy-addtocart button i:before{content:"\f136";font-style:normal;font-family:"bootstrap-icons"}*/
#buy-colorpicker{display:flex;flex-flow:row wrap;list-style:none;margin:0 -4px 24px -4px;padding:0}
#buy-colorpicker li{flex:0 1 auto;margin:4px;min-width:calc(25% - 8px);padding:0;width:calc(25% - 8px);-webkit-box-flex:0;-ms-flex:0 1 auto}
#buy-colorpicker a{align-items:flex-start;border-radius:2px;box-shadow:0 2px 4px 0 rgba(17,34,68,0.2);display:inline-block;overflow:hidden;position:relative;width:100%}
#buy-colorpicker a::before{content:"";display:block;padding-bottom:100%}
#buy-colorpicker a:hover{box-shadow:inset 0 -1px 0 0 rgba(17,34,68,0.2), 0 8px 16px 0 rgba(17,34,68,0.2)}
#buy-colorpicker img{height:100%;left:0;object-fit:contain;position:absolute;top:0;width:100%}
#buy-color-active{border-bottom:2px #FF6600 solid}

#buy-header{display:grid;grid-template-columns:1fr -webkit-min-content;grid-template-columns:1fr min-content;grid-template-rows:1fr;grid-template-areas: 'title' 'reviews' 'price' 'price-in3';width:100%} /* grid-gap:0 16px; */
#buy-header span.icon-info        { color: #777; }
#buy-header span.icon-info:hover  { color: #FFF; }
#buy-header span.icon-info:before { font-family: "bootstrap-icons"; font-style: normal; content: "\f433"; }

#buy-payoff{font-weight:100;text-align:center}
#buy-price{grid-area:price;display:flex;justify-content:flex-end;flex-wrap:wrap;align-content:flex-start;line-height:24px;margin-bottom:8px}
#buy-price{display:-webkit-box;-webkit-box-pack:end}
#buy-price{display:-ms-flexbox;-ms-flex-pack:end;-ms-flex-wrap:wrap;-ms-flex-line-pack:start}
#buy-price b{font-size:18px;font-weight:700;line-height:30px;position:relative}
#buy-price i, .specials-price i { font-size:16px;font-style:normal;font-weight:100;margin-right:5px;position:relative; }
#buy-price i::before, .specials-price i::before { border-bottom:2px solid #FF6600;content:'';height:1px;left:-2px;position:absolute;top:.5em;width:100%;transform:rotate(-15deg); }

#buy-price div { display: inline-block; margin-right: 8px; }
#buy-price .sale { color: #9ab; text-decoration: line-through }
#buy-price .single_price { font-weight: bold; }
#buy-price .now { color: #FF6600}
#buy-price .price-original{font-weight:100;line-height:22px; position: relative}
#buy-price .price-original:before{top:.7em;border-bottom:2px solid #f9aa33;color:#f9aa33;content:"";height:1px;left:0;position:absolute;width:100%;transform:rotate(-15deg)}


#buy-price-txt{font-size:14px;font-weight:100;} /* margin-left:5px */
#buy-price-in3{grid-area:price-in3;display:flex;justify-content:flex-end;flex-wrap:wrap;align-content:flex-start;line-height:24px;margin-bottom:8px;background-color:#eee;padding:16px 12px}


#buy-reviews{align-items:center;grid-area:reviews;display:-ms-flexbox;display:flex;line-height:24px;margin:8px 0}
#buy-reviews a{color:#567;display:inline-block; margin:6px 0; text-decoration:none; }
#buy-reviews a:hover{color:#9ab}
#buy-stars-empty{color:#f0f4f7;position:relative;top:-2px}
#buy-stars-full{color:#FF6600;left:0;overflow:hidden;position:absolute;top:0;width:89%}
#buy-stars-empty::before,#buy-stars-full::before{content:"\f586\f586\f586\f586\f586";font-size:14px;font-family:"bootstrap-icons";letter-spacing:2px}
#buy-sticky{color:#124;top:12px} /* position:-webkit-sticky;position:sticky; */
#buy-sticky label { display: block; margin: 12px 0 4px; }
#buy-sticky select { display: block; width: 100%; margin-bottom: 12px; padding: 2px; }
#buy-title{grid-area:title}
#buy-title h2{display:block;font-size:20px;font-weight:700;line-height:30px;margin:0;padding:0}
#buy-title p {display:block;font-size:16px;font-style:normal;font-weight:100;line-height:24px;margin:0;padding:0}
#buy-title a { color:#567;}
#buy-usp{background-color:#eee;border-bottom:1px solid #bcd;border-top:1px solid #bcd;padding:16px 12px}
#buy-usp li{font-size:14px;font-weight:100;line-height:21px;list-style:none;margin:8px 0;padding:0 0 0 24px;position:relative}
#buy-usp li::before{color:#567;content:'\f138';font-family:"bootstrap-icons";left:0;position:absolute;top:-1px}
#buy-usp li a{color:#124;font-weight:400}
#buy-usp li a:hover{text-decoration:underline}

ul#auto-usp,
ul#scooter-usp {
    border: 1px solid green;
    border-radius: 2px;
    padding: 16px 12px;
}

ul#auto-usp li,
#scooter-usp li {
    list-style: none;
    height: 24px;
}
ul#auto-usp li {
    line-height: 30px;height: auto;
}

ul#auto-usp li::before,
#scooter-usp li::before {
    color: green;
    font-family:"bootstrap-icons";
    content: "\f26e";
    font-size: 24px;
    vertical-align:middle;
}

/* thumb slider */
.thumb-slider .tns-item img, .recent-slider img {
    display: block;
    width: calc(100% - 5px);
    /*max-width: 130px;*/
    height: auto;
    margin-right: auto;
    margin-left: auto;
}

.tns-nav {
    text-align: center;
    margin: 10px 0;
}
.tns-nav > [aria-controls] {
    width: 9px;
    height: 9px;
    padding: 0;
    margin: 0 5px;
    border-radius: 50%;
    background: #ddd;
    border: 0;
}
.tns-nav > .tns-nav-active { background: #999; }
/* end thumb slider */

.kenteken {
    text-align:center;vertical-align:middle;padding:3px;border:1px solid #000;border-radius:2px;display:inline-block;line-height:15px;width:70px;
}
.kenteken.snor {
    color:#FFF;background-color:#00A1FE
}
.kenteken.brom {
    color:#000;background-color:#F7BA00;
}
.kenteken.motor {
    color:#000;background-color:#F5D470;
}
.kenteken.snor.inactive, .kenteken.brom.inactive, .kenteken.motor.inactive {
    color:#888;border-color:#888;background-color:#ccc;opacity:0.4
}

/* Modal voor winkel voorraad scooters */
.modal-winkelvoorraad { color:green;font-weight:bold;border-bottom:1px solid green }
.modal-winkelvoorraad:hover { color: #999;border-bottom-color:#999 }

.voorraad-tooltip .modal-winkelvoorraad-kleur { color: #fff; border-style: dashed }

#modal-load { display: none }
#modal-overlay{ background:rgba(0,0,0,0.5);bottom:0;height:100%;left:0;position:fixed;right:0;top:0;width:100%;z-index:1298 }
#modal {
    background-color:#fff;
    border-radius:4px;
    box-shadow:0 8px 10px 1px rgba(0,0,0,0.14), 0 3px 14px 2px rgba(0,0,0,0.12), 0 5px 5px -3px rgba(0,0,0,0.3);display:flex;flex-flow:column nowrap;left:0;
    margin:0 auto;
    padding: 20px;
    padding-bottom: 50px;
    max-height:90%;
    min-height:200px;
    max-width:550px;
    overflow-y:auto;
    position:fixed;
    right:0;
    top:5%;
    width:90%;
    z-index:1300
}

#modal .close {
    position:absolute;
    right:12px;
    top:10px;
    font-style: normal;
    font-weight: bolder;
    font-size: 40px;
    color: #777;
    transform: rotate(-45deg);
    cursor:pointer;
}
#modal .close:hover  { color: #999 }
#modal .close:before { font-family: "bootstrap-icons";transform: rotate(-45deg);content: "\f4fe" }
#modal h2            { margin-top: 0 }

#modal div.winkel-block {
    display:flex;flex-flow:row wrap;
    margin-top:15px;margin-bottom:15px;padding:0 15px;border-radius:4px;border:1px solid #888;background-color:#eaeaea
}
#modal .winkel-adres   { flex:1 0 50%;min-width:225px;padding:15px 0 }
#modal .winkel-contact { flex:1 0 50%;min-width:225px;padding:15px 0;text-align:center }

#modal .bel-winkel {
    border:1px solid #FF6600;
    border-radius:2px; line-height: 20px; display: inline-block;
    padding: 4px 10px; margin-top: 6px;
    color: #FF6600;
}
#modal .bel-winkel:hover {
    background-color:#FF6600;
    color:#fff;
}
/* end winkel modal */

#info{grid-area:info;padding-left:20px;padding-right:12px;width:100%}
#info{-ms-grid-row:2;-ms-grid-row-span:1;-ms-grid-column:1;-ms-grid-column-span:1}
#info h3{font-size:16px;font-weight:600;line-height:24px;margin:16px 0 0 0}
#info p{font-size:16px;font-weight:100;line-height:24px;margin:0;padding:0}
#info table{ width: 100%; margin-bottom: 20px; }
#info td{font-size:16px;font-weight:400;line-height:24px;padding:0 12px 12px 0;}
#info th{font-size:16px;font-weight:100;line-height:24px;padding:0 12px 12px 0;text-align:left;width:40%}

#reviews-stars-empty{color:#f0f4f7;position:relative}
#reviews-stars-full{color:#FF6600;left:0;overflow:hidden;position:absolute;top:0;width:89%}
#reviews-stars-empty::before,#reviews-stars-full::before{content:"\f586\f586\f586\f586\f586";font-size:24px;font-family:"bootstrap-icons";font-weight:400;letter-spacing:2px}
#reviews-summary{border-bottom:1px solid #bcd;display:flex;margin-top:12px;padding-bottom:12px}
#reviews-summary-rating{font-size:20px;font-weight:400;line-height:28px;margin:0 8px}
#reviews-summary-count{font-size:16px;font-weight:100;line-height:30px}

main section#reviews {
    grid-area: reviews;
}

#section-reviews .review{ border-top:1px dashed #ccc;padding:16px 0 }
#section-reviews .review-stars-empty{color:#f0f4f7;position:relative}
#section-reviews .review-stars-full{color:#FF6600;left:0;overflow:hidden;position:absolute;top:0;width:89%}
#section-reviews .review-stars-empty::before,.review-stars-full::before{content:"\f586\f586\f586\f586\f586";font-size:20px;font-family:"bootstrap-icons";font-weight:100}

#section-reviews .review h3{font-size:18px;font-weight:600;line-height:30px;margin:12px 0 16px 0;padding:0}
#section-reviews .review p{font-size:16px;font-weight:100;line-height:24px;margin:16px 0;padding:0}
#section-reviews .review.review-hidden { display:none }
#section-reviews #reviews-meer {
    color:green;
    font-weight: bold;
    border-bottom:1px solid green;
    cursor: pointer;
}
#section-reviews #reviews-meer:hover {
    color: #999;
    border-bottom-color: #999;
}

#recommend{grid-area:recommend;padding-left:12px;padding-right:12px;width:100%}
#recommend{-ms-grid-row:3;-ms-grid-row-span:1;-ms-grid-column:1;-ms-grid-column-span:2}
#recommend h3{font-size:16px;font-weight:600;line-height:24px;margin:16px 0 0 0}
#recommend-scroll{position:relative}
#recommend-scroll ul{overflow:-moz-scrollbars-none;overflow-x:scroll;overflow-y:hidden;position:relative;-webkit-overflow-scrolling:touch;-ms-overflow-style:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
#recommend-scroll ul{
    list-style:none;margin:2px 0 16px 0;padding:0;white-space:nowrap;
    /*width:100%*/
}
#recommend-scroll ul::-webkit-scrollbar{height:0;background:transparent}
#recommend-scroll li{display:inline-block;height:100%;padding:0}
#recommend-scroll a{background-color:#fff;border-bottom:1px solid rgb(187,204,221);box-shadow:0 2px 4px 0 rgba(17,34,68,0.2);color:#124;display:inline-block;margin:12px 0;overflow:hidden;position:relative;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s;transition-property:box-shadow;width:100%}
#recommend-scroll a:hover{box-shadow:0 8px 16px rgba(85,102,119,0.2), 0 2px 4px rgba(85,102,119,0.2)}
#recommend-scroll a figure{align-items:center;display:flex;height:0;margin:0;padding-bottom:calc(100% + 1px);position:relative;text-align:center;transform:translateY(50%)}
#recommend-scroll a figure img{width:100%}
#recommend-scroll a .kleuren{height:42px;margin-bottom:14px;padding-left:7px;position:relative;width:600px}
#recommend-scroll a .kleuren img{border:1px solid #bcd;border-radius:2px;height:42px;width:42px;margin-right:2px}
#recommend-scroll a .kleuren img:hover{border-color:#567}
#recommend-scroll a .description{align-items:flex-end;display:flex;margin:8px}
#recommend-scroll a .description .txt{flex:1 1 auto;overflow:hidden}
#recommend-scroll a .description .txt h2{font-size:14px;font-weight:100;line-height:18px;margin:0;padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#recommend-scroll a .description .txt h3{font-size:14px;font-weight:700;line-height:18px;margin:0;padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#recommend-scroll a .description .price{font-size:14px;font-weight:700;line-height:18px;position:relative; white-space: nowrap; }
#recommend-scroll a .description .price-original{font-weight:100}
#recommend-scroll a .description .price-original:before{top:.5em;border-bottom:2px solid #FF6600;color:red;content:"";height:1px;left:0;position:absolute;width:100%}
#recommend-scroll .discount-amount{background-color:#f0f4f7;border-radius:3px 0 0 3px;top:12px;color:#fff;font-size:14px;font-weight:400;line-height:15px;padding:4px 8px 5px 8px;position:absolute;right:0}
#recommend-scroll .discount-label{background-color:#f0f4f7;border-radius:0 3px 3px 0;top:12px;color:#fff;font-size:14px;font-weight:400;line-height:15px;padding:4px 8px 5px 8px;position:absolute;left:0}
#recommend-shadow-left,#recommend-shadow-right{position:absolute;top:0;width:50px;height:100%;opacity:.6}
#recommend-shadow-left{left:0;-webkit-box-shadow:inset 8px 0 10px -6px rgba(17,34,68,0.6);box-shadow:inset 8px 0 10px -6px rgba(17,34,68,0.6)}
#recommend-shadow-right{right:0;-webkit-box-shadow:inset -8px 0 10px -6px rgba(17,34,68,0.6);box-shadow:inset -8px 0 10px -6px rgba(17,34,68,0.6)}

.recent-kleur-blok {
    background-color: white;
    height: 16px;
    width: 100%;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
}

#info li a { text-decoration: underline !important; }
hr { border: none; border-top: 1px solid #bcd}
#images-main .motor-type-icon {position:absolute;top:0;right:0;padding:8px;width:35px;height:35px}
#images-main .black-friday,
#images-main .cyber-weekend {
    position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background:linear-gradient(90deg, #000000 93%, white 7%);color:#fff;font-size:18px;
}
#images-main.product .black-friday,
#images-main.product .cyber-weekend {
    background: #000000;
}

#images-main .sinterklaas {
    position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background:linear-gradient(90deg, #CB2426 93%, white 7%);color:#fff;font-size:18px;
}
#images-main.product .sinterklaas {
    background: #CB2426;
}

#images-main .kerst {
    position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background:linear-gradient(90deg, #78100D 93%, white 7%);color:#fff;font-size:18px;
}
#images-main.product .kerst {
    background: #78100D;
}

#images-main .herfstuitverkoop {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:rgba(255,22,22,.8);color:#fff;font-size:18px}
#images-main .opruiming {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#FF1616;color:#fff;font-size:18px}
#images-main .back2school {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:rgba(255,22,22,.8);color:#fff;font-size:18px}
#images-main .valexim {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:rgba(32, 183, 104,.8);color:#fff;font-size:18px}
#images-main .zomerdeals {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#ff1616;color:#fff;font-size:18px}
#images-main .electrifyingweeks {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#680b73;color:#fff;font-size:18px}
#images-main .black-friday {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#000000;color:#fff;font-size:18px}
#images-main .pakjesdeal {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#dd1919;color:#fff;font-size:18px}
#images-main .kerstdeals {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#dd1919;color:#fff;font-size:18px}
#images-main .eindejaarsdeals {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#dd1919;color:#fff;font-size:18px}
#images-main .wintersolden {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#dd1919;color:#fff;font-size:18px}
#images-main .duurzaamheidsdeals {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#dd1919;color:#fff;font-size:18px}
#images-main .supersales {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#dd1919;color:#fff;font-size:18px}
#images-main .voorjaarsdeals {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#dd1919;color:#fff;font-size:18px}
#images-main .oranjedeals {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#ff6600;color:#fff;font-size:18px}

#images-main .winterdeals {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#3bac36;color:#fff;font-size:18px;text-align:center;font-weight:bold}
#images-main .solden {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#3bac36;color:#fff;font-size:18px;text-align:center;font-weight:bold}


#images-main .bigsale {
    position: absolute;
    top: 0;
    left: 0;
    padding: 4px 8px;
    width: 100%;
    height: 35px;
    line-height: 27px;
    background-color: #c6cccf;
    color: black;
    font-weight: bold;
    font-size: 18px;
    text-align: center;
}









#images-main span.product-label { position: absolute;top: 0;right: 0;padding: 8px; }
#images-main span.product-label span {
    text-align: center; display: inline-block; padding: 2px 10px; line-height: 32px; font-size: 18px; border-radius: 6px; background-color: rgba(249, 170, 51, 0.7);
    user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; -moz-user-select: none; -ms-user-select: none;
}


@media screen and (max-width: 767px){
    #buy-usp{margin:16px -12px}
    #images-main button{display:none}
    #images-thumbs{display:flex;overflow-x:auto;    height:174px;}
    /*#images-thumbs img{height:100%;width:20vw;}*/
    #info-nav{display:none}
    #nav{display:none}
    #recommend-scroll ul{margin-left:-12px;margin-right:-12px}
}

.fullscreen { width: 100%; }

@media screen and (min-width: 768px) {
    #buy-usp{margin:16px -24px}
    #images-thumbs{display:flex;overflow-x:auto;    height:174px;}
    /*
    #images{padding-left:12px;padding-right:12px}
    #images-inner{padding-bottom:80%}
    #images-main{bottom:0;position:absolute;right:0;top:0;width:80%}
    #images-main img{border:1px solid #f0f4f7}
    */

    .main-slider-img .fullscreen { width: 100%; }

    #images-main button{
        background-color:rgba(255,255,255,0.6);
        border:0;border-radius:3px;
        box-shadow:0 2px 4px 0 rgba(17,34,68,0.2);color:#124;font-family:"bootstrap-icons";
        font-size:24px;font-weight:400;height:40px;line-height:24px;padding:8px;
        position:absolute;top:calc(50% - 25px);transition:box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
        width:40px
    }
    #images-main button:hover{box-shadow:0 2px 4px 0 rgba(17,34,68,0.2), 0 8px 16px 0 rgba(17,34,68,0.2);color:#556}

    #images-nav-right{right:12px}
    #images-nav-right::before{content:"\f138"}
    #images-nav-left{left:12px}
    #images-nav-left::before{content:"\f12f"}

    /*
    #images-thumbs{bottom:0;left:0;padding-right:24px;position:absolute;top:0;width:20%; overflow-y: auto;}
    #images-thumbs img{width:100%}
     */

    #info h3{margin:24px 0 16px 0;font-size:20px;font-weight:700;line-height:30px;text-align:left}
    #info-nav{background-color:#fff;border-bottom:1px solid #bcd;border-top:1px solid #bcd;margin-top:24px;position:-webkit-sticky;position:sticky;top:-1px;z-index:1}
    #info-nav a{color:#567;display:inline-block;font-size:18px;font-weight:400;line-height:27px;padding:12px}
    #info-nav a:hover{box-shadow:inset 0 -3px #567}

    #nav{display:flex;flex-flow:row wrap}
    #nav-back{
        background-color:#fff;
        border-radius:16px;box-shadow:0 2px 4px 0 rgba(17,34,68,0.1);color:#124;display:flex;font-size:16px;font-weight:400;line-height:24px;justify-content:center;margin:10px 12px 16px 12px;text-align:center;
        /*width: calc(20% - 29px);*/
        padding: 0 12px;
    }
    #nav-back:hover{box-shadow:0 2px 4px 0 rgba(17,34,68,0.1), 0 4px 8px 0 rgba(17,34,68,0.1)}
    #nav-back::before{content:"\E904";font-family:LaSourisIcons;margin-right:8px}
    #nav-breadcrumbs{color:#567;font-size:14px;font-weight:700;line-height:44px;list-style:none;margin:0 0 0 12px;padding:0;width:calc(80% - 24px)}
    #nav-breadcrumbs li{display:inline-block}
    #nav-breadcrumbs a{color:#567;font-weight:100}
    #nav-breadcrumbs a::after{
        font-family: "bootstrap-icons";
        content:"\f135";
        margin:0 1px 0 4px;
        position:relative;
        top:3px;
        line-height: 17px;
    }
    #recommend h3{margin:24px 0 16px 0;font-size:20px;font-weight:700;line-height:30px;text-align:left}
    #recommend-scroll li{margin:0 0 0 8px;padding:0;vertical-align:top;width:20%}
    #recommend-shadow-left,#recommend-scroll-shadow-right{display:block}
}

@media screen and (min-width: 1024px){
    main{
        grid-template-columns: calc(100% - 496px) 496px;
        grid-template-rows: auto auto auto;
        grid-template-areas: 'nav nav' 'images buy' 'info reviews' 'recommend recommend'
    }
    main{-ms-grid-columns: 1fr 496px;-ms-grid-rows:auto auto auto}
    #buy-header{grid-template-columns:1fr;grid-template-areas:'title' 'reviews' 'price' 'price-in3'}
    #buy-price, #buy-price-in3 {display:inline}
    #buy-usp{border:0;margin:19px 0}
}

@media screen and (min-width: 1200px){
    main{margin:0 auto;width:1200px}
}

table.scooter-modellen { width:100%;padding:3px;line-height:30px }
table.scooter-modellen tr.kleur-row { border-bottom:1px solid #ccc }
table.scooter-modellen td.kleur-radio { width:15px;cursor:pointer }
table.scooter-modellen td.kleur-col { width:30px;padding-left:5px;text-align:center;cursor:pointer }
table.scooter-modellen td.kleur-col span { display:inline-block;vertical-align:middle;border:1px solid #ccc;border-radius:3px;width:20px;height:20px }
table.scooter-modellen td.kleur-naam { font-size: 14px; padding-left: 5px; cursor:pointer; }

.voorraad-tooltip {
    position: relative;
    display: inline-block;
    cursor: pointer;
}
.voorraad-tooltip .tekst {
    visibility: hidden;
    width: 260px;
    background-color: rgba(0, 0, 0, 0.8);
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 10px;
    position: absolute;
    z-index: 1;
    bottom: 100%;
    left: 50%;
    margin-left: -130px;
    white-space: nowrap;
}
.voorraad-tooltip .tekst.green {
    background-color: rgba(45, 132, 24, 0.9);
    border: 1px solid #fff;
}
.voorraad-tooltip .tekst.orange {
    background-color: rgba(243, 114, 32, 0.9);
    border: 1px solid #fff;
}

.voorraad-tooltip:hover .tekst {
    visibility: visible;
}

.voorraad-tooltip span.tekst button {
    background-color: transparent;
    border: 1px solid #fff;
    color: #fff;
    padding: 6px;
    border-radius: 3px;
    width: 100%
}
.voorraad-tooltip span.tekst button:hover {
    background-color: #fff;
    color: green;
}

.voorraad-tooltip a {
    color: #fff;
    padding: 2px 6px;
    border:1px solid #fff;
    border-radius: 2px
}
.voorraad-tooltip a:hover {
    background-color: #fff;
    color:#000
}

.winkel-contact .meer-openingstijden {
    color: #999;
    border-bottom: 1px solid #999;
    cursor: pointer;
}

.winkel-contact dt {
    flex: 1 0 85px;
    text-align:left;
}
.winkel-contact dd {
    flex: 1 0 100px;
    text-align:right;
}


#buy-addtocart-scooter-bottom a {
    align-items: flex-start;
    background-color: green;
    border: 1px solid green;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    margin: 0;
    min-width: 160px;
    padding: 8px 34px 8px 32px;
    position: relative;
    text-align: center;
    transition: box-shadow .3s;
    user-select: none;
    width: 100%;
    margin-left: 5%;
    margin-top: 7%;
    margin-bottom: 4%;
}

@media screen and (max-width: 450px){
    #buy-addtocart-scooter-bottom a {
        margin-left: 0;
        font-size: 17px;
    }
}


@media screen and (max-width: 330px){
    #buy-addtocart-scooter-bottom a {
        font-size: 12px;
    }
}


@media screen and (min-width: 451px){

    #buy-addtocart-scooter-bottom a {
        margin-left: 0;
    }

}

@media (min-width:500px) and (max-width:600px) {
    #buy-addtocart-scooter-bottom a {
        width: 94%;
        margin-left: 4%;
        margin-top: 7%;
    }
}

@media (min-width:900px) and (max-width:1000px) {
    #buy-addtocart-scooter-bottom a {
        width: 100%;
        margin-top: 7%;
    }
}

@media (min-width:700px) and (max-width:800px) {
    #buy-addtocart-scooter-bottom a {
        margin-left: 3%;
        margin-top: 7%;
        width: 90%;
    }
}

@media (min-width:800px) and (max-width:850px) {
    #buy-addtocart-scooter-bottom a {
        width: 90%;
        margin-left: 4%;
        margin-top: 7%;
    }
}

/********************************************
   WEBSITE TABS
 *******************************************/

.site-tab {
    overflow: hidden;
    width: 100%;
    margin-bottom: -1px;
}

.site-tab button {

    background-color: #ddd;
    border: 1px solid #ccc;
    border-bottom: none;
    cursor: pointer;
    font-size: 18px;
    transition: 0.3s;
    color: black !important;
    border-radius: 2px;
    padding: 3px 27px;
    width: 49.1%;
}

.site-tab button:hover {
    background-color: white;
    border-color: #888;
}

.site-tab button.active {
    background-color: inherit;
}

.site-tab .tab-content {
    border: 1px solid #ccc;
    border-radius: 0 0 10px 10px;
    overflow: hidden;
    height: 1000px;
    overflow-y: scroll;
    background-color: white;
}


/************************************
   VOORRAAD WINKELS
 *************************************/
.voorraad-winkels{
    margin-top: 10px;
    font-size: 14px;
    width: 100%;
    line-height: 38px;
}

[data-tab-content="onlinevoorraad"]{
    margin-top:1%;
}

.voorraad-winkels tbody tr{
    border-top: 1px solid grey;
}

.voorraad-winkels .voorraad-label {
    padding: 3px 9px;
    font-size: 13px;
    color: #008500;
    border-radius: 3px;
    border: 1px solid #008500;
}
.voorraad-winkels .store-row{
    color: black;
    text-decoration: underline;
    float: left;
    margin-left: 3%;
}

@media only screen and (max-width: 490px) {
    table.fietsen-modellen {
        width: 100%;
        padding: 3px;
        line-height: 33px;
        font-size: 10px;
    }

    .site-tab button{
        font-size: 13px !important;
    }
    .voorraad-winkels .voorraad-label {
        padding: 3px 5px;
        font-size: 13px;
    }
}
.tweedekans {
    color: #ff6600;
    text-decoration: underline;
}
