main{background-color:#f8f8f8;display:flex;flex-flow:row nowrap;padding:0;width:100%}

section{flex:1 1 auto;padding:0 12px}
section h1{color:#232f34;font-family:"Gordita Bold",arial,geneva,sans-serif;font-size:32px;font-weight:700;line-height:48px;margin:0;padding:0;width:100%}
section p{color:#232f34;font-family:"Inter",arial,geneva,sans-serif;font-size:14px;font-weight:100;line-height:21px;margin:0;padding:0}
section button{align-items:flex-start;background-color:#fff;border:1px solid #232f34;border-radius:2px;color:#232f34;cursor:pointer;display:none;font-size:16px;font-weight:400;line-height:24px;outline:none;padding:8px 24px;text-align:center;transition:border-radius .3s,box-shadow .3s;user-select:none;width:100%}

section button:hover{border-color:#567;border-radius:4px;color:#556}
section button span{display:inline-block;font-family:LaSourisIcons;margin-right:8px}
section button span:before{content:"\E928";position:relative;top:2px}

#txt{margin:32px 0}
#txt h2{color:#232f34;font-family:"Gordita Bold",arial,geneva,sans-serif;font-size:16px;font-weight:normal;line-height:24px;margin:16px 0 0 0;padding:0;width:100%}
#txt p{color:#232f34;font-family:"Inter",arial,geneva,sans-serif;font-size:14px;font-weight:100;line-height:21px;margin:0;padding:0}

#breadcrumbs{color:#567;font-size:14px;font-weight:700;line-height:52px;list-style:none;margin:0 0 0 12px;padding:0}
#breadcrumbs li{display:inline-block}
#breadcrumbs a{color:#567;font-weight:100}
#breadcrumbs a::after{content:" - "}

#filters{flex:0 0 auto;width:290px;padding:0 12px}
#filters-btn{background-color:#fff;border-top:1px solid #bcd;bottom:0;box-shadow:0 0 6px 0 rgba(17,34,68,0.6);margin-left:-16px;padding:20px 16px;position:-webkit-sticky;position:sticky;right:0;visibility:hidden;width:calc(100% + 32px)}
#filters button{align-items:flex-start;background-color:#f9aa33;border:1px solid #f9aa33;border-radius:2px;box-shadow:0 1px 2px 0 rgba(17,34,68,0.4);color:#fff;cursor:pointer;display:inline-block;font-size:20px;font-weight:400;line-height:30px;margin:0;min-width:160px;padding:8px 24px 8px 32px;position:relative;text-align:center;transition:border-radius .3s,box-shadow .3s;user-select:none;width:100%}
#filters button:hover{background-color:#f9aa33;border-color:#f9aa33;border-radius:4px;box-shadow:0 2px 4px 0 rgba(17,34,68,0.4)}
#filters button span{margin-right:12px}
#filters button i:before{content:"\E90B";font-style:normal;font-family:LaSourisIcons}
#filters h3{border-top:1px solid #bcd;color:#232f34;font-size:16px;font-weight:400;line-height:24px;margin:24px 0 0 0;padding:16px 0}
#filters h3:first-of-type{margin-top:0}
#filters h4{color:#232f34;font-size:16px;font-family:"Gordita Bold",arial,geneva,sans-serif;font-weight:normal;margin:24px 0 6px 0;padding:0}
#filters a{color:#232f34;cursor:pointer;display:flex;font-size:16px;font-weight:400;justify-content:space-between;line-height:24px;margin-bottom:8px;min-height:24px;padding-left:12px;position:relative;text-align:left;width:100%}
#filters label{color:#232f34;cursor:pointer;display:block;font-size:13px;font-weight:400;justify-content:space-between;line-height:24px;margin-bottom:4px;min-height:24px;padding-left:2px;position:relative;text-align:left;width:100%}

#productlist{display:-ms-grid;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));grid-gap:4px;margin-top:16px;-ms-grid-columns:1fr 1fr}
#productlist a{ display: flex; flex-direction: column; background-color:#fff;border-bottom:1px solid rgb(187,204,221);color:#232f34;font-family:"Inter",arial,geneva,sans-serif;max-width:373px;overflow:hidden;position:relative;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s;transition-property:box-shadow}
#productlist a:nth-child(3n+1){-ms-grid-column:1}
#productlist a:nth-child(3n+2){-ms-grid-column:2}
#productlist a:nth-child(3n+3){-ms-grid-column:3}
#productlist a:hover{box-shadow:0 8px 16px rgba(85,102,119,.2),0 2px 4px rgba(85,102,119,.2)}
#productlist a:hover{border-bottom-color:#f9aa33}
/*#productlist a figure{align-items:center;display:flex;height:0;margin:0;padding-bottom:calc(100% + 1px);position:relative;text-align:center;transform:translateY(50%)}*/

#productlist a figure{
    align-items:center;
    display:flex;
    margin:0;
    position:relative;
    text-align:center;
    max-height: 250px;
    min-height: 250px;
}

#productlist.product a figure {
    max-height: 220px;
    min-height: 220px;
}

/*#productlist a figure img{width:100%}*/

#productlist a figure img{
    width: auto;
    max-width: 100%;
    max-height: 250px;
    margin: 0 auto;
}

#productlist a .kleuren{margin-bottom:14px;padding-left:7px;position:relative;/*width:600pxheight:42px;*/}
#productlist a .kleuren div{display: inline-block; background-repeat: no-repeat; background-color: white; background-position:center; background-size: contain; border:1px solid #bcd;border-radius:2px;height:24px;width:24px;margin-right:2px}
#productlist a .kleuren div:hover{border-color:#567}
#productlist a .description{margin:8px; flex-grow: 1}
#productlist a .description .txt{overflow:hidden}
#productlist a .description .txt h2{font-size:14px;font-weight:100;line-height:18px;margin:0;padding:0;}
#productlist a .description .txt h3{font-size:14px;font-weight:700;line-height:22px;margin:0;padding:0;}
#productlist a .description .price{font-size:14px;font-weight:700;line-height:18px;position:relative;white-space:nowrap; }
#productlist a .description .price-original{font-weight:100;line-height:22px; display: inline;}
#productlist a .description .price-original:before{top:.7em;border-bottom:1px solid #f9aa33;color:#f9aa33;content:"";height:1px;left:0;position:absolute;width:100%}
#productlist a .description .price-or {font-weight:normal;text-align:right}

#productlist a .description .price .add_to_cart {background-color:#f9aa33;border:1px solid #f9aa33;border-radius:2px; line-height: 20px; display: inline-block; padding: 6px; box-shadow: 0 1px 2px 0 rgba(17,34,68,0.4);}
#productlist a .description .price .add_to_cart:hover {box-shadow:0 2px 4px 0 rgba(17,34,68,0.4)}
#productlist a .description .price .add_to_cart::after { content: "\E90B";display: block;font-family: LaSourisIcons; font-size: 18px;}
#productlist a .description .price .amount { font-size: 20px; line-height: 32px; display: block !important;; }
#productlist.scooter a .description .price .amount { display: inline-block !important;; }

#productlist.scooters .tweedehands { flex-shrink: 1; padding: 5px 0; text-align:center; font-size: 13px; text-decoration: underline; color: #ff6600 }

#productlist a .description .price .prices { display: flex !important; justify-content: space-between; }
#productlist a .description .price .single_price { display: flex !important; justify-content: end; font-weight: bold; }
#productlist a .description .price .sale { color: #9ab; text-decoration: line-through }
#productlist a .description .price .now { color: #FF6600}

#productlist a .description { display:flex;margin:8px}
#productlist a .description .txt{flex:1 1 auto;overflow:hidden; align-self: flex-start}
#productlist 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}
#productlist a .description .txt .merk{font-size:14px;font-weight:700;line-height:22px;margin:0;padding:0;}
#productlist a .description .txt .model{font-size:14px;font-weight:100;line-height:18px;margin:0;padding:0;}
#productlist a .description .txt h3{font-size:14px;font-weight:700;line-height:22px;margin:0;padding:0;text-overflow:ellipsis}
#productlist a .description .price{font-size:18px;font-weight:bold;line-height:18px;position:relative;white-space:nowrap; padding-bottom: 8px; text-align:right;}
#productlist a .description .price-original{font-size: 14px; font-weight:100;line-height:22px; position: relative}
#productlist a .description .price-original:before{top:.7em;border-bottom:2px solid #f9aa33;color:#f9aa33;content:"";height:1px;left:0;position:absolute;width:100%;transform:rotate(-15deg)}
#productlist a .description .price-or {font-weight:normal;text-align:right;padding-right: 7px;}
#productlist a .description .price.price-right {text-align:right}

#productlist.products a .description { display: flex; margin-bottom: 8px; flex-direction: column }
#productlist.products a .description .txt { flex: 1 1 auto; align-self: flex-start }
#productlist.products a .description .txt .merk { font-weight: normal; }
#productlist.products a .description .price div { flex-shrink: 1; margin-top: 8px;}
#productlist.products a .description .price .amount {  font-size: 14px; line-height: 18px; }
#productlist.products a .description .txt h3 { line-height: 18px; font-weight: normal; }

#productlist .voorraad{color:#232f34;font-size:14px;font-weight:400;line-height:21px;margin:8px}
#productlist .discount-amount,#productlist .discount-label{background-color:#f9aa33;bottom:142px;color:#fff;font-size:14px;font-weight:400;line-height:15px;padding:4px 8px 5px 8px;position:absolute}
#productlist .discount-amount{border-radius:3px 0 0 3px;right:0}
#productlist .discount-label{border-radius:0 3px 3px 0;left:0}
#productlist .motor-type-icon {position:absolute;top:0;right:0;padding:8px;width:35px;height:35px}

 .filter {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:4px 8px 8px 0px;text-align:center; padding: 0 12px; display: inline-block; cursor: pointer}
 .filter:hover{box-shadow:0 2px 4px 0 rgba(17,34,68,0.1), 0 4px 8px 0 rgba(17,34,68,0.1)}
 .filter::before{content:"\E905";font-family:LaSourisIcons;margin-right:8px}

#productlist.scooter a{align-items:center;display:flex}
#productlist.scooter a figure{align-items:center;flex:0 0 80px;height:60px;margin:0;padding:0;transform:none;width:80px}
#productlist.scooter.product a figure{height:auto;width:auto}
#productlist.scooter.product a figure img {max-height: 220px; min-height: 220px;}
#productlist.scooter .txt{ flex:1 1 auto; text-align: center; }
#productlist.scooter .txt h3{font-weight:700;margin:4px;padding:0;font-size:14px}
#productlist.scooter .txt h6{font-weight:100;margin:4px;padding:0;font-size:12px}
#productlist.scooter .txt .merk{font-weight:700;margin:4px;padding:0;font-size:14px}
#productlist.scooter .txt .model{font-weight:100;margin:4px;padding:0;font-size:12px}

#productlist .black-friday,
#productlist .cyber-weekend  {
    text-align: left; position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background:linear-gradient(90deg, #000000 88%, white 12%);;color:white;font-size:18px
}
#productlist.products .black-friday,
#productlist.products .cyber-weekend {
    background: #000000
}
#productlist .backtoschool {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#ff1616;color:#fff;font-size:16px;font-weight:bold;}
#productlist .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}
#productlist .bigsale  {text-align:center;font-weight:bold;position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#00B900;color:white;font-size:13px}
#productlist .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}
#productlist .zomersolden  {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#dd1919;;color:#fff;font-size:18px}
#productlist .vakantieknallers  {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#ff6600;;color:#fff;font-size:18px}
#productlist .halloween  {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#ff6600;;color:#fff;font-size:18px}
#productlist .blackfriday  {position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#000;;color:#fff;font-size:18px;text-align:center;font-weight:bold}
#productlist .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}
#productlist .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}
#productlist .vakantiedeals  {text-align:center;font-weight:bold;position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background-color:#00B900;color:white;font-size:13px}



#productlist .sinterklaas {
    text-align: left; position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background:linear-gradient(90deg, #CB2426 88%, white 12%);color:#fff;font-size:18px
}
#productlist.products .sinterklaas {
    background: #CB2426;
}

#productlist .kerst {
    text-align: left; position:absolute;top:0;left:0;padding:4px 8px;width:100%;height:35px;line-height:27px;background:linear-gradient(90deg, #78100D 88%, white 12%);color:#fff;font-size:18px
}
#productlist.products .kerst {
    background: #78100D;
}



@media screen and (max-width: 500px){

    #productlist .bigsale,
    #productlist .wintersolden,
    #productlist .zomersolden,
    #productlist .backtoschool,
    #productlist .halloween,
    #productlist .zomerdeals {
        font-size: 15px;
    }
}

#productlist a .product-label { position: absolute;top: 0;right: 0;padding: 8px; }
#productlist a span.product-label span { text-align: center; display: inline-block; padding: 2px 10px; line-height: 24px; font-size: 14px; border-radius: 6px; background-color: rgba(249, 170, 51, 0.7);transition: 0.3s; }

#productlist.products a:hover span.product-label span { background-color: #232f34;color: #F9AA33;box-shadow:0 8px 16px rgba(85,102,119,.2),0 2px 4px rgba(85,102,119,.2) }



div.exception-banner,
div.page-banner {
    max-width: 100%;
    height: auto;
    cursor: pointer;
}

div.paasactie-banner {
    max-width: 100%;
    height: auto;
    cursor: pointer;
}


@media screen and (max-width: 450px) {

    div.page-banner {
        content:url("https://cdn.lasourisscooters.nl/la-souris/images/banners/valentijn_mobiel_banner.webp");
    }
}
@media screen and (min-width: 451px)
{
    div.page-banner {
        content:url("https://cdn.lasourisscooters.nl/la-souris/images/banners/valentijn_website_banner.webp");
    }
}



div.bigsale-banner {
    background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/gom");
    width: 100%;
    height: 200px;
    background-size: contain;
    background-repeat: no-repeat;
    color: #fff;
}
div.zomerdeals-banner {
    background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/zomerdeals-pagina-banner-xl.webp");
    /*background-color: #20B768;*/
    width: 100%;
    height: 150px;
    background-size: contain;
    /*background-position: center center;*/
    background-repeat: no-repeat;
    color: #fff;
}

div.backtoschool-banner {
    background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/BacktoSchool_HP_XL.webp");
    /*background-color: #20B768;*/
    width: 100%;
    height: 150px;
    background-size: contain;
    /*background-position: center center;*/
    background-repeat: no-repeat;
    color: #fff;
}

div.halloween-banner {
    background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/Halloween_LP_XL.webp");
    /*background-color: #20B768;*/
    width: 100%;
    height: 150px;
    background-size: contain;
    /*background-position: center center;*/
    background-repeat: no-repeat;
    color: #fff;
}

div.wintersolden-banner {
    background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/wintersolden-deals-pagina-banner-xl.webp");
    /*background-color: #20B768;*/
    width: 100%;
    height: 150px;
    background-size: contain;
    /*background-position: center center;*/
    background-repeat: no-repeat;
    color: #fff;
}

div.zomersolden-banner {
    background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/zomersolden-deals-pagina-banner-xl.webp");
    /*background-color: #20B768;*/
    width: 100%;
    height: 150px;
    background-size: contain;
    /*background-position: center center;*/
    background-repeat: no-repeat;
    color: #fff;
}

div.blackfriday-banner {
    background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/BlackFriday_LP_XL.webp");
    width: 100%;
    height: 150px;
    background-size: contain;
    background-repeat: no-repeat;
    color: #fff;
}

div.winterdeals-banner {
    background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/winterdeals-deals-pagina-banner-xl.webp");
    width: 100%;
    height: 150px;
    background-size: contain;
    background-repeat: no-repeat;
    color: #fff;
}

div.solden-banner {
    background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/solden-deals-pagina-banner-xl.webp");
    width: 100%;
    height: 150px;
    background-size: contain;
    background-repeat: no-repeat;
    color: #fff;
}

@media screen and (max-width: 480px) {

    div.oranjedeals-banner  {
        margin-bottom: -15%;
        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/oranje-deals-pagina-banner-xs.webp");
    }
    div.bigsale-banner  {
        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/fietsendrager-deals-pagina-banner-xs.webp");
    }
    div.vakantieknallers-banner  {
        margin-bottom: -15%;
        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/vakantieknallers-deals-pagina-banner-xs.webp");
    }
    div.zomerdeals-banner  {
        margin-bottom: -15%;
        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/zomerdeals-pagina-banner-xs.webp");
    }
    div.wintersolden-banner  {
        margin-bottom: -15%;
        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/wintersolden-pagina-banner-xs.webp");
    }
    div.backtoschool-banner  {
        margin-bottom: -15%;
        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/BacktoSchool_LP_XS.webp");
    }
    div.halloween-banner  {
        margin-bottom: -15%;
        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/Halloween_LP_XS.webp");
    }
    div.blackfriday-banner  {
        margin-bottom: -15%;
        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/BlackFriday_LP_XS.webp");
    }
    div.winterdeals-banner  {
        margin-top: 4%;
        margin-bottom: -15%;
        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/winterdeals-deals-pagina-banner-xs.webp");
    }
    div.solden-banner  {
        margin-top: 4%;
        margin-bottom: -15%;
        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/solden-deals-pagina-banner-xs.webp");
    }
}

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

    div.wintersolden-banner {
        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/wintersolden-deals-pagina-banner-xl.webp");
        min-height: 200px;
        margin-bottom: -5%;
    }
    div.zomersolden-banner {
        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/zomersolden-deals-pagina-banner-xl.webp");
        min-height: 200px;
        margin-bottom: -5%;
    }
    div.backtoschool-banner {
        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/BacktoSchool_LP_XL.webp");
        min-height: 200px;
        margin-bottom: -5%;
    }
    div.halloween-banner {
        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/Halloween_LP_XL.webp");
        min-height: 200px;
        margin-bottom: -5%;
    }
    div.blackfriday-banner {
        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/BlackFriday_LP_XL.webp");
        min-height: 200px;
        margin-bottom: -5%;
    }
    div.winterdeals-banner {

        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/winterdeals-deals-pagina-banner-xl.webp");
        min-height: 200px;
        margin-bottom: -5%;
    }
    div.solden-banner {

        background-image: url("https://cdn.lasourisscooters.nl/la-souris/images/banners/solden-deals-pagina-banner-xl.webp");
        min-height: 200px;
        margin-bottom: -5%;
    }
}
div.solden-banner:hover,
div.winterdeals-banner:hover,
div.blackfriday-banner:hover,
div.halloween-banner:hover,
div.backtoschool-banner:hover,
div.wintersolden-banner:hover,
div.zomersolden-banner:hover,
div.zomerdeals-banner:hover,
div.black-friday-banner:hover {
    cursor:pointer;
}

section a.button_scooters_overview {
    color: #009B48;
    border: 1px solid #009B48;
    padding: 8px 12px;
    border-radius: 2px;
    box-shadow: 0 1px 2px 0 rgba(17,34,68,0.4);
    margin-bottom: 15px;
}
section a.button_scooters_overview:hover {
    color: #fff;
    background-color: #009B48;
}

#productlist figure span.special-banner {
    background-color: #FF6600;
    color: #fff;
    font-size: 14px;
    opacity: 0.8;
    padding: 4px 0;
    position: absolute;
    bottom: 0;
    text-align: center;
    width: 100%;
}


@media screen and (max-width:600px) {
    #productlist a .description .price-no-mobile {display:none}
}

@media screen and (min-width:1201px) {
    main{
        /*padding:0 0 0 2%;width:98%*/
        padding: 0 0 0 16px;
        max-width: 1238px;
        margin: 0 auto;
    }
    #productlist{grid-gap:8px;-ms-grid-columns:1fr 1fr 1fr;grid-template-columns:repeat(auto-fit,minmax(275px,1fr))}
}

@media screen and (min-width:1280px){
    #productlist{grid-template-columns:repeat(auto-fit, minmax(275px, 1fr))}
    #productlist.products{grid-template-columns:repeat(auto-fit, minmax(200px, 1fr))}
}

@media screen and (min-width:1670px){
    #productlist{grid-template-columns:repeat(auto-fit,minmax(275px, 1fr))}
    #productlist.products{grid-template-columns:repeat(auto-fit,minmax(200px, 1fr))}
}

@media screen and (max-width:900px){
    section{flex:0 0 100%}
    section button{display:inline-block}
    #filters{background-color:#fff;height:100%;max-width:360px;overflow-y:scroll;position:fixed;right:0;top:0;visibility:hidden;width:calc(100% - 48px);z-index:2}
}

.ribbon {
    position: absolute;
    left: -5px; top: -5px;
    z-index: 1;
    overflow: hidden;
    width: 150px; height: 150px;
    text-align: right;
}
.ribbon span {
    font-size: 18px;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
    font-weight: bold; line-height: 32px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg); /* Needed for Safari */
    width: 150px; display: block;
    background: #FF6600;
    box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
    position: absolute;
    top: 30px; left: -30px;
}
.ribbon.preorder span {
    background-color: purple;
    font-size: 16px;
}

div.escooter-banner {
    background-image: url(https://cdn.lasourisscooters.nl/la-souris/images/banners/home-deal-9-xl.webp);
    /* background-color: #20B768; */
    width: 100%;
    height: 150px;
    background-size: contain;
    /* background-position: center center; */
    background-repeat: no-repeat;
    color: #fff;
    cursor:pointer;
}

div.escooter-solden-banner {
    background-image: url(https://cdn.lasourisscooters.nl/la-souris/images/banners/solden-deals-scooter-xl.webp);
    /* background-color: #20B768; */
    width: 100%;
    height: 150px;
    background-size: contain;
    /* background-position: center center; */
    background-repeat: no-repeat;
    color: #fff;
    cursor:pointer;
}


div.valexim-banner {
    background-image: url("//cdn.lasourisscooters.nl/la-souris/images/banners/valexim-xl.png");
    background-color: #000;
    width: 100%;
    height: 200px;
    background-position: center center;
    background-size: cover;
    color: #fff;
    cursor: pointer
}

@media screen and (max-width:620px) {

    div.escooter-banner {
        background-image: url(https://cdn.lasourisscooters.nl/la-souris/images/banners/home-deal-12-xs.webp);
        height: 100px;
    }

    div.escooter-solden-banner{
        background-image: url(https://cdn.lasourisscooters.nl/la-souris/images/banners/solden-deals-scooter-xs.webp);
        height: 100px;
    }

}

.halloween_fiets {
    width: auto !important;
    max-height: 298px !important;
    margin: 0 auto !important;
}

.halloween_fiets_banner{
    font-size: 20px !important;
    font-weight: bold;
    animation: bounce 1s infinite ease-in-out;
}

@media (max-width: 480px) {
    .halloween_fiets {
        width: auto !important;
        max-height: 356px !important;
        margin: 0 auto !important;
    }
}

@keyframes bounce {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-5px);
    }
}

#productlist a .tweedekans {
    display: inline-flex;
    flex-direction: column;
    background-color: #fff;
    border-bottom: none;
    color: #ff6600;
    font-family: "Inter",arial,geneva,sans-serif;
    max-width: 373px;
    overflow: hidden;
    position: relative;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: .3s;
    transition-property: box-shadow;
    text-decoration: underline;
}

#productlist a .tweedekans:hover{box-shadow:none}
#productlist a .tweedekans:hover{border-bottom-color:yellow;}


/***
    Tweedekans blocken
 */

.in3listicon {
    left: -14px !important;
    width: 45%;
}


.tweedekans-block-scooterkleur{
    font-size: 94%;
    position: absolute;
    margin-top: 110%;
    margin-left: 2.5%;
}

.tweedekans-block-fiets{
    font-size: 92%;
    position: absolute;
    margin-top: 101%;
    margin-left: 2.5%;
    width: 96%;
}


.tweedekans-block-fiets span{
    float: right;
    font-size: 94%;
    margin-right: 4px;
}



.tweedekans-block {
    font-size: 94%;
    position: absolute;
    margin-top: 120%;
    margin-left: 2.5%;
}

.tweedekans-block-color-exception {
    font-size: 94%;
    position: absolute;
    margin-top: 128%;
    margin-left: 2.5%;
}

#productlist a .vehicleblock{
    margin-bottom: 7%;
}

/*.price-block{*/
/*    font-size: 13.90px !important;*/
/*}*/

@media only screen and (max-width: 1025px) and (min-width: 451px)  {
    .tweedekans-block {
        margin-top: 103%;
    }
    .tweedekans-block-color-exception {
        margin-top: 103%;
    }
    .tweedekans-block-scooterkleur{
        margin-top: 103%;
    }

    .tweedekans-block-fiets{
        margin-top: 103%;
    }
}

@media only screen and (max-width: 830px) and (min-width: 451px)  {
    .tweedekans-block-color-exception {
        font-size: 96%;
        position: absolute;
        margin-top: 96%;
        margin-left: 2%;
    }

    .tweedekans-block {
        font-size: 96%;
        position: absolute;
        margin-top: 96%;
        margin-left: 2%;
    }
    .tweedekans-block-scooterkleur{
        font-size: 96%;
        position: absolute;
        margin-top: 96%;
        margin-left: 2%;
    }

    .tweedekans-block-fiets{
        font-size: 96%;
        position: absolute;
        margin-top: 96%;
        margin-left: 2%;
    }
}

@media screen and (max-width:450px){
    .tweedekans-block-color-exception {
        font-size: 100%;
        position: relative;
        margin-top: -4%;
        margin-bottom: 2%;
    }
    .tweedekans-block {
        font-size: 100%;
        position: relative;
        margin-top: 0%;
        margin-bottom: 2%;
    }
    .tweedekans-block-scooterkleur{
        font-size: 100%;
        position: relative;
        margin-top: 0%;
        margin-bottom: 2%;
    }

    .tweedekans-block-fiets{
        font-size: 102%;
        position: relative;
        margin-top: -6%;
        margin-bottom: 3%;
        margin-left: 1.5%;
    }

    #productlist a .vehicleblock{
        margin-bottom: 0%;
    }


    .tweedekans-block-fiets span{
        float: right;
        font-size: 82%;
        margin-right: 0px;
    }

    .in3listicon {
        left: -15px !important;
        width: 49%;
    }


}




