/**
 * Adjust inherited grid & layout settings
 */

#webshop-product-search label,
#webshop-product-search-sidebar label,
.webshop-back-link {
    position: absolute;
    top: -999em;
    left: -999em;
}

.pbuic-ferr-score-number {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0, 0, 0, 0);
    overflow: hidden;
}

/**
 * Defaults & layout of re-usable classes throughout the webshop
 */

/** Remove the default layout of list elements */
.product-list,
.product-list ul,
.related-product-list,
.per-page,
.webshop-categories,
.webshop-category-tree ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

/** Layout of webshop items (eg. categories, products) */
.webshop-categories {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.webshop-categories li,
.product-list li,
.wpdt-summary,
.related-product-list li {
    overflow: hidden;
    border: 1px solid #dcddde;
}

.webshop-categories li:hover,
.product-list li:hover,
.related-product-list li:hover {
    border-color: #bbb;
    border-color: rgba(0,0,0,0.3);
    box-shadow: 0 0 2px 0 rgba(0,0,0,0.2);
}

.product-list li li {
    border: 0;
    background: none;
    box-shadow: none;
}

/** Link element of products is layed out to make the whole item clickable */
.link-to-product,
.link-to-category {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    text-indent: -999em;
    background-image: url("iehack:///"); /** Hack to make this also work in IE */
}

/**
 * Buttons
 */

.shoppingCartAction {
    display: none;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 90px;
    padding: .7em;
}

.webshop-active .shoppingCartAction,
.webshop-active .webshop-searchresults .shoppingCartAction {
    display: block;
}

.shoppingCartActionEmpty,
.webshop-active .shoppingCartActionEmpty,
.webshop-searchresults .shoppingCartActionEmpty {
    display: none;
}

.add-to-shopping-cart {
    display: block;
    width: 100%;
    color: inherit;
}

.product-list li:hover .shoppingCartAction {
    color: #fff;
    background-color: #ae1421;
}

.product-list li:hover .shoppingCartAction:hover {
    background-color: #8c131f;
}

.product-list li:hover .product-add-success,
.product-list li:hover .product-add-success:hover {
    background-color: #0d7211;
}

.product-list li:hover .add-to-shopping-cart-link:before {
    color: #fff;
}

.add-to-shopping-cart input {
    position: relative;
    float: left;
    width: 24px;
    height: 24px;
    padding: 2px;
    box-sizing: content-box;
    font: normal 16px/14px Verdana, Geneva, Helvetica, sans-serif;
    text-align: center;
    z-index: 10;
}

.add-to-shopping-cart a {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: block;
    padding-left: 3rem;
    color: inherit;
    font-size: 0;
    text-decoration: none;
}

.add-to-shopping-cart img {
    display: none;
    position: relative;
    top: 2px;
    right: 2px;
}

/** Add to shoppingcart on detailpage */

.webshop-productdetails .add-to-shopping-cart {
    display: none;
    position: relative;
    width: 300px;
    padding: .8em 1em;
    background-color: #ae1421;
}

.webshop-active.webshop-productdetails .add-to-shopping-cart {
    display: inline-block;
}

.webshop-productdetails .add-to-shopping-cart:hover {
    background-color: #8c131f;
}

.webshop-productdetails .add-to-shopping-cart a {
    padding-left: 4em;
    text-indent: 0;
    font-size: 1rem;
    line-height: 3.3;
    color: #fff;
}

.webshop-productdetails .add-to-shopping-cart a:before {
    position: relative;
    top: 4px;
    margin-right: .5em;
    color: #fff;
}

.webshop-productdetails .product-add-success {
    background-color: #0d7211;
}

/** Product favorites (mark & unmark product from favorites) */

a.product-add-to-favorites,
a.product-remove-from-favorites {
    display: block;
    margin-bottom: 1em;
}

.product-list .product-remove-from-favorites,
.product-list .product-add-to-favorites {
    position: absolute;
    bottom: 5.3em;
    left: .6em;
    z-index: 99;
    font-size: 0.8em;
    text-decoration: none;
}

.product-list .product-remove-from-favorites:hover,
.product-list .product-add-to-favorites:hover {
    text-decoration: underline;
}

.webshop-productoverview .product-list .product-add-to-favorites,
.webshop-productoverview .product-list .product-remove-from-favorites {
    display: none;
}

.article_1 .webshop-breadcrumbs {
    display: none;
}

.webshop-breadcrumbs {
    margin-bottom: 2em;
}

.webshop-breadcrumbs a {
    color: #afb1b4;
    text-decoration: none;
}

.webshop-breadcrumbs a:hover {
    text-decoration: underline;
}

.webshop-breadcrumbs dt {
    display: none;
}

.webshop-breadcrumbs dd {
    display: inline-block;
    vertical-align: top;
}

.webshop-breadcrumbs dd a {
    margin-right: 1em;
    padding-right: 1em;
    border-right: 1px solid currentColor;
}

.webshop-breadcrumbs dd.first a {
    padding-left: 0;
}

.webshop-breadcrumbs dd.last a {
    border: 0;
}

@media screen and (min-width: 600px) {
    .webshop-breadcrumbs {
        padding-right: 18em;
    }
}

/**
 * 	.webshop-categories
 */

.categoryListItem {
    position: relative;
}

.category-description p:last-of-type,
.category-description ul:last-of-type,
.category-description ol:last-of-type {
    margin: 0 0 .3em;
}

.webshop-categories li {
    position: relative;
    width: 100%;
    margin-bottom: 1em; /* Firefox don't support vertical % margin in combination with flexbox */
    text-align: center;
}

@media screen and (min-width: 400px) {
    .webshop-categories li {
        display: inline-block;
        vertical-align: top;
        margin-right: 1.5%;
        width: 49.2%;
        -ms-flex: 0 1 49.2%;
        flex: 0 1 49.2%;
    }

    .webshop-categories li:nth-child(2n) {
        margin-right: 0;
    }
}

@media screen and (min-width: 600px) {
    .webshop-categories li {
        width: 32.3%;
        -ms-flex: 0 1 32.3%;
        flex: 0 1 32.3%;
    }

    .webshop-categories li:nth-child(2n) {
        margin-right: 1.5%;
    }

    .webshop-categories li:nth-child(3n) {
        margin-right: 0;
    }
}

@media screen and (min-width: 1200px) {
    .webshop-categories li {
        width: 23.8%;
        -ms-flex: 0 1 23.8%;
        flex: 0 1 23.8%;
    }

    .webshop-categories li:nth-child(3n) {
        margin-right: 1.5%;
    }

    .webshop-categories li:nth-child(4n) {
        margin-right: 0;
    }
}

.webshop-categories a {
    text-decoration: none;
}

.webshop-categories li .category-image {
    padding-top: 1em;
}

.webshop-categories li .category-image a {
    display: block;
}

.webshop-categories li .fake-image {
    display: block;
    padding-top: 1em;
}

/** Don't display the fake image when there is a category-image */
.webshop-categories li .category-image + .fake-image {
    display: none;
}

.webshop-categories .category-title {
    display: block;
    padding: 8px;
    box-sizing: border-box;
    font-weight: bold;
    color: #58585a;
}

.webshop-categories .category-link-text {
    display: block;
    padding: .5em;
    text-align: right;
    text-transform: uppercase;
}

.webshop-categories .wc-introduction h3 {
    margin: 0;
    padding: .3em;
    color: #fff;
}

.category-introduction p {
    margin-bottom: 0;
}

/**
 * 	.webshop-products
 */

@media screen and (min-width: 768px) {
    .productSortingIsActive .ProductSorting {
        float: right;
    }

    .productSortingIsActive .webshop-products {
        clear: both;
    }
}

/** Category introduction */
.webshop-category-introduction {
    overflow: hidden;
}

.productSortingIsActive .category-description {
    margin-bottom: 1em;
}

.webshop-category-introduction img {
    display: none;
}

@media screen and (min-width: 768px) {
    .productSortingIsActive .webshop-category-introduction {
        float: left;
        width: calc(100% - 250px - 1em);
        margin-right: 1em;
    }
}


/**
 * 	Product detail page
 */

.product-info {
    position: relative;
    margin-top: 1.5em;
    margin-bottom: 2em;
    padding: 2em 1.5em 1.5em;
    border: 1px solid #dcddde;
    background-color: #fff;
}

/** Offer info */
.product-info-offer {
    display: none;
}

.show-product-info-offer1 .product-info-offer {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    background-color: #ae1421;
    color: #fff;
    font-size: .9em;
    padding: .2em 2em;
}

/** Exclusive logo */
.product-info-exclusive {
    display: none;
}

.show-product-info-exclusive1 .product-info-exclusive {
    display: block;
    position: absolute;
    width: 60px;
    height: 120px;
    top: 0;
    right: 1em;
    padding-top: 50px;
    font-size: 9px;
    text-align: center;
    text-transform: uppercase;
    color: #fff;
    background: url('../img/exclusief-bij-topslijter-large.png') no-repeat;
    z-index: 1;
}

/** Jaarwijn */
.product-info .product-jaarwijn-logo,
/** Van de maand - generic */
.product-info .product-bier-vd-maand-logo,
.product-info .product-wijn-vd-maand-logo,
.product-info .product-malt-vd-maand-logo,
.product-info .product-rum-vd-maand-logo {
    display: none;
}

.show-product-info-jaarwijn1 .product-jaarwijn-logo,
.show-product-info-bier-vd-maand1 .product-bier-vd-maand-logo,
.show-product-info-wijn-vd-maand1 .product-wijn-vd-maand-logo,
.show-product-info-malt-vd-maand1 .product-malt-vd-maand-logo,
.show-product-info-rum-vd-maand1 .product-rum-vd-maand-logo {
    display: inline-block;
    vertical-align: top;
    margin-right: .5em;
    margin-bottom: .5em;
    width: 98px;
    height: 49px;
    background: left / contain no-repeat;
}

.show-product-info-bier-vd-maand1 .product-bier-vd-maand-logo,
.show-product-info-wijn-vd-maand1 .product-wijn-vd-maand-logo,
.show-product-info-malt-vd-maand1 .product-malt-vd-maand-logo,
.show-product-info-rum-vd-maand1 .product-rum-vd-maand-logo {
    width: 92px;
}

.show-product-info-jaarwijn1 .product-jaarwijn-logo {
    width: 98px;
    /** The URL below links to a document in the Library of Uw TopSlijter.
        This image needs to change every year, on the first of january.
        By putting the image in Library, the client can change the image by himself without our help (right click, "Upload new version").
     */
    background-image: url('/l/library/download/urn:uuid:5c4ceeec-a131-42aa-9d17-e7e3f8840336/niet+verwijderen+-+jaarwijn+logo.png');
}

/** Bier van de maand */
.show-product-info-bier-vd-maand1 .product-bier-vd-maand-logo {
    background-image: url('../img/bier-vd-maand.png');
}

/** Wijn van de maand */
.show-product-info-wijn-vd-maand1 .product-wijn-vd-maand-logo {
    background-image: url('../img/wijn-vd-maand.png');
}

/** Malt van de maand */
.show-product-info-malt-vd-maand1 .product-malt-vd-maand-logo {
    background-image: url('../img/malt-vd-maand.png');
}

/** Rum van de maand */
.show-product-info-rum-vd-maand1 .product-rum-vd-maand-logo {
    background-image: url('../img/rum-vd-maand.png');
}

.product-info .product-title {
    margin-right: 2em;
    font-size: 2em;
    font-weight: bold;
}

.product-info .product-image {
    max-width: 220px;
}

.product-info .product-introduction {
    margin-bottom: 1.5em;
}

/** Already needs to be in html output of the 100 webshops, but for now it's not possible to make an order: */
.product-info .ws-unorderable,
.product-info .add-to-shopping-cart {
    /*display: none;*/
}

/** Styling stock status */

.ws-unorderable {
    font-weight: 700;
    color: #ae1421;
}

@media screen and (min-width: 650px) {
    .ws-unorderable {
        position: relative;
        top: -2.5em;
        max-width: calc(30% - 1em);
    }
}

/**
 * Product price
 */

.product-info .product-bulk {
    background-color: #f6f6f6;
    border: 1px solid #dcddde;
}

.product-info .product-price-wrapper {
    position: relative;
    padding: 1em 0;
}

.product-info .product-bulk {
    display: none;
}

.product-info [class*='show-product-bulk'] {
    display: block;
    padding: .5em;
    background-color: #f6f6f6;
    border: 1px solid #dcddde;
    box-sizing: border-box;
}

.product-info .product-bulk-info {
    font-size: 1.1em;
    font-weight: bold;
}

.product-info .product-bulk-price {
    color: #ae1421;
    font-weight: bold;
    font-size: 2em;
    line-height: 1.3;
}

.product-info .product-price {
    margin-top: .2em;
    margin-bottom: .5em;
    color: #ae1421;
    font-weight: bold;
    font-size: 2em;
    box-sizing: border-box;
}

.product-info .product-price .regular,
.product-info .product-price .action {
    display: block;
    line-height: 1.3;
}

.product-info .product-price .regular {
    font-size: .5em;
    text-decoration: line-through;
    color: #939598;
    font-weight: normal;
}

.product-info .product-price .product-price-packing-entity {
    color: #58585a;
    font-size: .45em;
}

@media screen and (min-width: 650px) {
    .product-info .product-bulk {
        width: 48%;
        float: left;
    }

    .product-info .product-price {
        margin: 0;
        width: 48%;
        float: right;
        text-align: right;
    }
}

@media screen and (min-width: 1000px) {
    .product-info .product-price {
        font-size: 2.3em;
    }

    .product-info .product-bulk-price {
        font-size: 2.3em;
    }
}

.product-info .product-info-details {
    margin-top: 1em;
    padding-top: 1.5em;
    border-top: 1px dashed currentColor;
}

.product-info .product-info-details-title {
    margin-bottom: 1em;
    padding: .5em 0 0 1em;
    font-weight: bold;
    text-transform: uppercase;
    background: url(../../../img/icon-sprite.png) -9px -257px no-repeat;
    background-size: 30px;
}

.product-info .product-info-details dt {
    font-weight: bold;
}

.product-info .product-info-details dd {
    margin-bottom: .5em;
}

@media screen and (min-width: 380px) {
    .product-info .product-info-details dt,
    .product-info .product-info-details dd {
        display: inline-block;
        vertical-align: top;
        margin-bottom: 1em;
    }

    .product-info .product-info-details dt {
        width: 155px;
        padding-right: 5px;
    }

    .product-info .product-info-details dd {
        width: calc(100% - 155px);
    }
}

@media screen and (min-width: 450px) {
    .product-info .product-image {
        position: absolute;
        right: 1em;
        max-width: 40%;
        border-left: 1em solid #fff;
    }

    .product-info .product-logos-wrapper,
    .product-info .product-introduction,
    .product-info .product-description-html,
    .product-info .product-price-wrapper {
        max-width: calc(58% - 1em);
    }
}

/**
 * .webshop-product-search
 */

#webshop-product-search input {
    width: calc(100% - 3em);
}

#webshop-product-search button {
    padding: .44em;
    margin-left: -.4em;
}

#webshop-product-search button:hover {
    background-color: #ae1421;
}

#webshop-product-search button:after {
    content: '\e806';
    font-family: "font-icons";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    margin-left: .2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #fff;
}

.webshop-product-search h3 {
    margin-bottom: 1em;
}

@media screen and (min-width: 600px) {
    .webshop-product-search form {
        position: absolute;
        right: 0;
        top: -.6em;
    }

    #webshop-product-search input {
        width: 15em;
    }

    #webshop-product-search fieldset {
        margin-bottom: 0;
    }
}

#webshop-product-search button .inner-button {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0, 0, 0, 0);
    overflow: hidden;
}

/**
 * Searchbox in sidebar
 */

#webshop-product-search-sidebar button {
    padding: 4px;
}

#webshop-product-search-sidebar .inner-button {
    display: block;
    width: 18px;
    height: 15px;
    text-indent: -999em;
    background: transparent url(../img/webshop-sprite.png) no-repeat 100% 0;
}


/**
 * Webshop (products) navigation
 */

.webshop-products-nav,
.per-page {
    text-align: center;
}

.webshop-products-nav.top {
    display: none;
}

.pages {
    display: none;
}

.webshop-products-nav ol {
    margin: 1em 0;
    padding: 0;
    border: 0;
    font: 12px/17px Arial, Helvetica, sans-serif;
    background-image: none;
    list-style: none;
}

.webshop-products-nav li,
.per-page li {
    display: inline;
    width: auto;
    margin: 0 5px 0 0;
    padding: 0;
    border: 0;
    background-image: none;
}

.webshop-products-nav a,
.per-page a {
    display: inline-block;
    min-width: 20px;
    padding: 2px 3px;
    margin: 0;
    text-align: center;
    border: 1px solid #eee;
    border-color: rgba(0,0,0,0.1);
    color: #333;
    text-decoration: none;
    border-radius: 2px;
    background-color: #eee;
    border-color: #dfdfdf;
}

/** Hover state */
.webshop-products-nav a:hover,
.per-page a:hover {
    color: #000;
    border-color: rgba(0,0,0,0.3);
    box-shadow: 0 0 2px 0 rgba(0,0,0,0.2);
}

/** Active state */
.webshop-products-nav .current a,
.per-page .current,
.webshop-products-nav .current a:hover,
.per-page .current:hover {
    border-color: #eee;
    font-weight: bold;
    color: #000;
    background: #fff;
    cursor: default;
    box-shadow: none;
}

/**
 * 	Webshop menu (.webshop-category-tree)
 */

.webshop-category-tree ul {
    margin-left: 1.3em;
    list-style: disc;
    line-height: 2.1;
    text-transform: uppercase;
}

.webshop-category-tree a {
    display: block;
    text-decoration: none;
    color: #565656;
}

.webshop-category-tree a:hover {
    text-decoration: underline;
}

.webshop-category-tree > ul > .active > a {
    color: #ae1421;
}

/**
 * Webshop Reviews
 */

.product-info-reviews {
    margin-top: 1em;
    padding-top: 1.5em;
    border-top: 1px dashed currentColor;
}

.ws-rc-header h2 {
    margin-bottom: .2em;
    font-size: 2.2em;
    font-family: 'Architects Daughter', Verdana, Arial, sans-serif;
}

.ws-rc-button {
    display: inline-block;
    margin-bottom: .7em;
}

.ws-review-container a,
.ws-review-container a:hover {
    text-decoration: none;
    color: #222222;
    cursor: default;
}

/**
 * 	Reviews list
 */

.ws-rcrl-item + .ws-rcrl-item {
    margin-top: 1.5em;
    border-top: 1px solid #dcddde;
    padding-top: 1.5em;
}

.ws-rcrli-meta {
    margin: 0 0 1em;
    list-style: none;
}

.ws-rcrli-meta li {
    margin-bottom: .4em;
    padding-right: .3em;
}

.ws-rcrli-meta-date {
    color: #afb1b4;
}

.ws-rcrli-text p {
    margin-bottom: .5em;
}

.ws-rcrli-text h3 {
    font-weight: bold;
}

#ws-review-list-more {
    display: block;
    margin-top: 1em;
}

@media screen and (min-width: 450px) {
    .ws-rcrli-meta,
    .ws-rcrli-text {
        display: inline-block;
        vertical-align: top;
    }

    .ws-rcrli-meta {
        margin: 0;
        width: 152px;
    }

    .ws-rcrli-text {
        width: calc(100% - 160px);
    }
}

/**
 * Review form
 */

.ws-review-form {
    margin-top: 2em;
}

.ws-review-form label.field {
    position: static;
    float: none;
    padding: 0;
    text-align: left;
}

.ws-review-form .fieldinput {
    margin-left: 0;
}

.ws-review-f-count {
    display: block;
    width: 95%;
    text-align: right;
    font-size: 1.5em;
}

/**
 * Review score container
 */

.ws-reviews-container .ws-reviews-score,
.ws-reviews-container .ws-reviews-number {
    margin-bottom: 1em;
    display: inline-block;
    vertical-align: middle;
}

.ws-reviews-container .ws-reviews-score {
    width: 90px;
}

.ws-reviews-container .ws-reviews-score label {
    display: none;
}

/** .pbuic-fe-rating style tweaks*/
.webshop-products fieldset,
.webshop-products .fieldinput,
.product-details fieldset,
.product-details .fieldinput {
    margin: 0;
}

.pbuic-fe-rating {
    position: relative;
}

.pbuic-ferr-bar {
    margin-right: 10px;
}

ul.related-product-list li li {
    border: 0;
}

.pbuic-fe-rating ul li.last {
    margin-bottom: 0;
}

/**
 * Stock types
 */

.stockType {
    display: block;
    margin: 1em 0 2em;
    font-size: 1.2em;
    line-height: 1.2em;
}

.stockType:before {
    display: inline-block;
    padding: .2em 0 .2em 2em;
    background-position: 0 50%;
    background-size: contain;
    background-repeat: no-repeat;
}

.stockType--limited {
    color: #ff8900;
}

.stockType--unlimited {
    color: #4fb772;
}

.stockType--empty {
    color: #c30126;
}

.stockType--backorder {
    color: #ff8900;
}

/* Content is in the webshop variant, because it must be translatable #103185 */
.stockType--limited:before {
    background-image: url("../img/stocklimited.svg");
}

.stockType--unlimited:before {
    background-image: url("../img/stockunlimited.svg");
}

.stockType--empty:before {
    background-image: url("../img/roodkruis.png");
}

.stockType--backorder:before {
    background-image: url("../img/stocklimited.svg");
}