@font-face {font-family: Poppins; src: url(https://www.alternate.nl/download/b2c_nl/pic/fonts/Poppins-Regular.ttf); }
    
    #PortalPagina { width: 100%; position: relative; z-index: 0; background: #191919; font-family: Poppins;}
    #PortalPagina img { width: 100%; }
    #PortalPagina p { font-size: 16px; line-height: 24px; }
    
    /* Content */
    .OmslagFoto { background: #1f1f1f; border-bottom: 5px solid #ff740a; }
    .OmslagFoto img { width: 23% !important; padding: 30px; }
    
    #Aanbod .carousel-indicators { bottom: -47px; }
    #Aanbod .carousel-indicators [data-bs-target] { background-color: #ff7a00; }
    
    #Inleiding { padding: 60px; }
    #Inleiding h1 { padding: 20px 0 50px; color: white; text-transform: uppercase; font-size: 40px; text-align: center; }
    #Inleiding .row { text-align: center; justify-content: center; }
    #Inleiding .row ul { border: 2px solid #414141; border-top: none; border-bottom: none; }
    #Inleiding .row ul:first-child { border-left: none; }
    #Inleiding .row ul:last-child { border-right: none; }
    #Inleiding .row li { list-style: none; }
    #Inleiding h3, #Inleiding p { color: white; }
    #Inleiding h3 { font-size: 25px; padding-bottom: 20px; color: #ff7a00; }
    #Inleiding .row li a:hover p { color: #ff7a00; }
    
    .s2r h2 { padding: 20px 0 50px; color: white; text-transform: uppercase; font-size: 40px; text-align: center; }
    #Top10 .products { gap: 30px; padding-bottom: 100px; margin: 0 auto; justify-content: center;
        div { width: 21%; }
        div div { width: 100%; }
        .badge { background: #a00e15; }
        .product { background: white; padding: 10px; border-radius: 10px; }
        img { padding: 20px; }
        .productTitle { color: black; font-size: 15px; text-align: center; height: 57px; }
        .prijzen { text-align: -webkit-right; }
        .actieprijs { background: #ff7a00; width: fit-content; padding: 5px 15px; color: white; font-size: 20px !important; }
        .msrp { margin: 3px 0; text-decoration: line-through; color: black; height: 23px; }
    }

    @media screen and (max-width: 667px) { /* Mobile */
        #PortalPagina h1 { font-size: 25px; }
        #PortalPagina p { font-size: 14px; line-height: 23px; margin: 4px;}
        .OmslagFoto img { width: 83% !important; }
        #Inleiding { padding: 10px; }
        #Inleiding h1 { font-size: 30px; }
        #Inleiding .row { padding: 0 20px; }
        #Inleiding .row ul { border: none; border-top: 2px solid #414141; padding: 30px 10px; }
        #Top10 .products div { width: 95%; }
    }

    @media screen and (min-width: 768px) and (max-width: 1032px) { /* Tablet */
        #PortalPagina img { width: 100%; }
        header.OmslagFoto img { width: 300px !important; }
        #Inleiding h1 { font-size: 30px; }
        #Inleiding .row ul, #Inleiding .row ul:first-child, #Inleiding .row ul:last-child { border: 2px solid #414141; border-top: none; border-bottom: none; }
        #Top10 .products { gap: 10px; }
        #Top10 .products div { width: 30%; padding: 0; } 
    }

    /*Stomme code*/

    .s2r .s2rHighlights {
    padding: 1rem;
}

.s2r .s2rHighlights .listing-mosaic.grid-container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-area: listing-product-container;
    grid-gap: 1rem;
}

.s2r .s2rHighlights .prodcontainer {
    margin: 5px 0;
    min-height: 250px;
    position: relative;
}

.s2r .s2rHighlights .prodcontainer a {
    display: block;
    background-color: white;
    box-shadow: 0px 0px 28px -4px rgba(0,0,0,0.15);
    border-radius: 10px;
    padding: 10px;
    opacity: 1;
    transition: opacity 0.1s ease-in-out;
}

.s2r .s2rHighlights .prodcontainer a:hover {
    opacity: 0.8;
    transition: opacity 0.1s ease-in-out;
}

.s2r .s2rHighlights .prodcontainer h3 {
    font-size: 1rem;
    word-wrap: break-word;
    color: #ff7a00;
    -webkit-line-clamp: 3;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 4.7em;
    text-wrap: balance;
}

.s2r .s2rHighlights .prodcontainer .prijs {
    background-color: #ff7a00;
    padding: 10px 20px;
    border-radius: 10px;
    font-size: 1.2rem!important;
    width: 100%;
    color: white;
}

.s2r .s2rHighlights .prodcontainer .prodimg {
    width: 100%;
    padding: 0 10%;
}

.s2r .s2rCategories .s2rCats {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    background-color: white;
}

.s2r .s2rCategories .s2rCats > div {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 195px;
    opacity: 1;
    transition: opacity 0.1s ease-in-out;
}

.s2r .s2rCategories .s2rCats > div:hover {
    opacity: 0.8;
    transition: opacity 0.1s ease-in-out;
}

.s2r .s2rCategories .s2rCats > div:has(a.active) {
    opacity: 0.8;
}

.s2r .s2rCategories .s2rCats a {
    position: relative;
    display: block;
    height: 100%;
}

.s2r .s2rCatTitle {
    position: absolute;
    color: white;
    background-color: #ff7a00;
    padding: 5px 15px;
    border-radius: 20px;
    bottom: 10px;
    right: 10px;
}

.s2r .s2rCategories .s2rCat0 {
    grid-area: 1 / 1 / 2 / 2;
    background-image: url(/download/b2c_be_nl/pic/s2r/Sets.jpg);
}

.s2r .s2rCategories .s2rCat1 {
    grid-area: 1 / 2 / 2 / 3;
    background-image: url(/download/b2c_be_nl/pic/s2r/Racestoelen.jpg);
}

.s2r .s2rCategories .s2rCat2 {
    grid-area: 1 / 3 / 2 / 4;
    background-image: url(/download/b2c_be_nl/pic/s2r/Stuurwielen.jpg);
}

.s2r .s2rCategories .s2rCat3 {
    grid-area: 1 / 4 / 2 / 5;
    background-image: url(/download/b2c_be_nl/pic/s2r/Stuurbasissen.jpg);
}

.s2r .s2rCategories .s2rCat4 {
    grid-area: 1 / 5 / 2 / 6;
    background-image: url(/download/b2c_be_nl/pic/s2r/Pedalen.jpg);
}

.s2r .s2rCategories .s2rCat5 {
    grid-area: 2 / 1 / 3 / 2;
    background-image: url(/download/b2c_be_nl/pic/s2r/Handremmen_shifters.jpg);
}

.s2r .s2rCategories .s2rCat6 {
    grid-area: 2 / 2 / 3 / 3;
    background-image: url(/download/b2c_be_nl/pic/s2r/Pc_laptop.jpg?v=1);
}

.s2r .s2rCategories .s2rCat7 {
    grid-area: 2 / 3 / 3 / 4;
    background-image: url(/download/b2c_be_nl/pic/s2r/Monitoren.jpg);
}

.s2r .s2rCategories .s2rCat8 {
    grid-area: 2 / 4 / 3 / 5;
    background-image: url(/download/b2c_be_nl/pic/s2r/Streaming.jpg?v=1);
}

.s2r .s2rCategories .s2rCat9 {
    grid-area: 2 / 5 / 3 / 6;
    background-image: url(/download/b2c_be_nl/pic/s2r/Accessoires.jpg?v=1);
}

.s2r .s2rCategories .s2rContent .right a {
    color: black;
}

.s2r .s2rCategories .s2rContent img {
    pointer-events: none;
}

.s2r .s2rCategories .s2rContent h5 {
    font-size: 1rem;
    word-wrap: break-word;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 2.5em;
    text-wrap: balance;
}

.s2r .s2rCategories .s2rContent .left {
    text-shadow: 0 0 20px black;
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.s2r .s2rCategories .s2rContent .prijs {
    background-color: #ff7a00;
    padding: 10px 20px;
    border-radius: 10px;
    font-size: 1.2rem!important;
    width: 30%;
    color: white;
}

.s2r .s2rCatLink {
    color: white;
    background-color: #ff7a00;
    display: inline-block;
    padding: 5px 15px;
    border-radius: 20px;
    width: fit-content;
    opacity: 1;
    transition: opacity 0.1s ease-in-out;
}

.s2r .s2rCatLink:hover {
    opacity: 0.8;
    transition: opacity 0.1s ease-in-out;
}

.s2r .s2rCategories .s2rContent .right {
    background-color: white;
}

.s2r .s2rCategories .s2rContent .right a {
    color: black;
    opacity: 1;
    transition: opacity 0.1s ease-in-out;
}

.s2r .s2rCategories .s2rContent .right a:hover {
    opacity: 0.8;
    transition: opacity 0.1s ease-in-out;
}

.s2r .s2rCategories .s2rContent #s2rTabContent0 .left {
    background-image: url(/download/b2c_be_nl/pic/s2r/Sets_big.jpg?v=1);
}

.s2r .s2rCategories .s2rContent #s2rTabContent1 .left {
    background-image: url(/download/b2c_be_nl/pic/s2r/Racestoelen_big.jpg);
}

.s2r .s2rCategories .s2rContent #s2rTabContent2 .left {
    background-image: url(/download/b2c_be_nl/pic/s2r/Stuurwielen_big.jpg);
}

.s2r .s2rCategories .s2rContent #s2rTabContent3 .left {
    background-image: url(/download/b2c_be_nl/pic/s2r/Stuurbasissen_big.jpg);
}

.s2r .s2rCategories .s2rContent #s2rTabContent4 .left {
    background-image: url(/download/b2c_be_nl/pic/s2r/Pedalen_big.jpg);
}

.s2r .s2rCategories .s2rContent #s2rTabContent5 .left {
    background-image: url(/download/b2c_be_nl/pic/s2r/Handremmen_shifters_big.jpg);
}

.s2r .s2rCategories .s2rContent #s2rTabContent6 .left {
    background-image: url(/download/b2c_be_nl/pic/s2r/Pc_laptop_big.jpg?v=1);
}

.s2r .s2rCategories .s2rContent #s2rTabContent7 .left {
    background-image: url(/download/b2c_be_nl/pic/s2r/Monitoren_big.jpg);
}

.s2r .s2rCategories .s2rContent #s2rTabContent8 .left {
    background-image: url(/download/b2c_be_nl/pic/s2r/Streaming_big.jpg?v=1);
}

.s2r .s2rCategories .s2rContent #s2rTabContent9 .left {
    background-image: url(/download/b2c_be_nl/pic/s2r/Accessoires_big.jpg?v=1);
}

.s2r .s2rIntro2 p {
    padding: 5% 20% 0% 20%;
}

.s2r .s2rEvent {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
}

.s2r .s2rEvent a {
    color: white;
    opacity: 1;
    transition: opacity 0.1s ease-in-out;
}

.s2r .s2rEvent a:hover {
    opacity: 0.8;
    transition: opacity 0.1s ease-in-out;
}

.s2r .s2rEvent img {
    width: 100%;
}

@media (min-width: 1100px) and (max-width: 1300px) {
    .s2r .s2rCatTitle {
        font-size: 13px;
    }
}

@media (min-width: 992px) and (max-width: 1100px) {
    .s2r .s2rNav a {
        font-size: 0.8rem;
    }
    .s2r .s2rHighlights .prodcontainer .prijs {
        font-size: 0.8rem!important;
    }
    .s2r .s2rCatTitle {
        font-size: 12px;
    }
    .s2r .s2rCategories .s2rContent .prijs {
        width: 50%;
    }
}

@media (max-width: 992px) {
    .s2r .s2rNav {
        display: none;
    }
    .s2r .s2rHighlights .listing-mosaic.grid-container {
        grid-template-columns: 1fr 1fr 1fr;
    }
    .s2r .s2rCatTitle {
        font-size: 15px;
    }
    .s2r .s2rCategories .s2rCats {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(5, 1fr);
    }
    .s2r .s2rCategories .s2rCat0 { grid-area: 1 / 1 / 2 / 2; }
    .s2r .s2rCategories .s2rCat1 { grid-area: 1 / 2 / 2 / 3; }
    .s2r .s2rCategories .s2rCat2 { grid-area: 2 / 1 / 3 / 2; }
    .s2r .s2rCategories .s2rCat3 { grid-area: 2 / 2 / 3 / 3; }
    .s2r .s2rCategories .s2rCat4 { grid-area: 3 / 1 / 4 / 2; }
    .s2r .s2rCategories .s2rCat5 { grid-area: 3 / 2 / 4 / 3; }
    .s2r .s2rCategories .s2rCat6 { grid-area: 4 / 1 / 5 / 2; }
    .s2r .s2rCategories .s2rCat7 { grid-area: 4 / 2 / 5 / 3; }
    .s2r .s2rCategories .s2rCat8 { grid-area: 5 / 1 / 6 / 2; }
    .s2r .s2rCategories .s2rCat9 { grid-area: 5 / 2 / 6 / 3; }
    .s2r .s2rCategories .s2rCats > div {
        height: 150px;
        border: 1px solid black;
    }
    .s2r .s2rIntro2 p {
        padding: 5%;
    }
    .s2r .s2rCategories .s2rContent .prijs {
        width: 50%;
    }
}

@media (max-width: 767px) {
    .s2r .s2rCategories .s2rContent .left {
        padding-bottom: 5%
    }
    .s2r .s2rCategories .s2rCats > div {
        height: 125px;
    }
}

@media (max-width: 600px) {
    .s2r .s2rNav a:not(:last-child) {
        border-right: none;
    }
    .s2r .s2rIntro {
        padding: 0;
    }
    .s2r .s2rNav {
        display: none;
    }
    .s2r .s2rHighlights .listing-mosaic.grid-container {
        grid-template-columns: 1fr 1fr;
    }
    .s2r .s2rCatTitle {
        font-size: 12px;
    }
    .s2r h1 {
        font-size: 3rem;
    }
    .s2r h2 {
        font-size: 2rem;
    }
    .s2r h3 {
        font-size: 1.8rem;
    }
    .s2r h4 {
        font-size: 1.5rem;
    }
    .s2r .s2rIntro p {
        padding: 5%;
    }
    .s2r .s2rCategories .s2rCats > div {
        height: 100px;
    }
}
@media (max-width: 425px) {
    .s2r .s2rCatTitle {
        font-size: 10px;
    }
}

@media (max-width: 400px) {
    .s2r .s2rHighlights .listing-mosaic.grid-container {
        grid-template-columns: 1fr;
    }
    .s2r .s2rHighlights .prodcontainer .prijs {
        font-size: 1.2rem!important;
    }
}