﻿#body-container {
    background-color: rgb(240, 240,240);
}
#products-container {
    width: 95%;
    margin: auto;
    padding: 5px;
    text-align: center;
}

#ProductList {
   
}
.product-div {
    padding: 1px 3px 1px 3px;
    margin: auto;
}

.product-cart {
    /*border: 1px solid rgb(30, 159,230, 0.6);*/
    margin: 3px 3px 20px 3px;
    padding-top: 3px;
    border-radius: 6px;
    box-shadow: 0px 0px 14px 3px rgb(110, 110,110);
    background-color: rgb(255, 255,255);
}

    .product-cart:hover {
        /*border: 1px solid rgb(30, 159,230);*/
        box-shadow: 0px 0px 18px 4px rgb(30, 159,230);
    }

.product-image {
    width: 100%;
    height: 340px;
    border-bottom:0.5px solid #eee; 
}

    .product-image img {
        max-width: 100%;
        max-height: 339px;
    }

.product-name {
    width: 100%;
    height: 70px;
    font-size: 16px;
    font-weight: 700;
    padding: 5px 5px 0 5px;
}

.product-price {
    width: 100%;
    height: 39px;
    font-size: 26px;
    font-weight: 800;
    padding: 3px 3px 0 3px;
    border-bottom: 0.5px solid #eee;
}



.product-link {
    width: 100%;
    font-size: 16px;
    font-weight: 700;
    padding: 5px 5px 10px 5px;
}
.product-link .product-detail-button {
    width: 40%;
    padding: 5px 2px 5px 2px;
    color: rgb(255, 255,255);
    background-color: rgb(30, 159,230);
    font-size: 12px;
    font-weight: 700;
    padding-top: 10px;
    padding-bottom: 10px;
    border: 3px solid #1DB1E6;
    border-radius: 3px;
}

        .product-link .product-detail-button:hover {
            background-color: #1DB1E6;
            border: 3px solid rgb(30, 159,230);
        }

.dis-ribbon {
    position: absolute;
    top: 1%;
    z-index: 1;
    overflow: hidden;
    width: 60%;
    height: 60%;
    text-align: left;
}

span.stock-out {
    font-size: 14px;
    font-weight: bold;
    color: #FFF;
    text-transform: uppercase;
    text-align: center;
    line-height: 30px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    width: 150%;
    display: block;
    background-color: rgba(255, 0, 0, 1);
    /*background: linear-gradient(#9BC90D 0%, #79A70A 100%);*/
    /*box-shadow: 10px -5px 0 3px rgba(0, 0, 0, 1);*/
    position: absolute;
    left: -30%;
    top: 20%;
}

#Filter {
    padding-top: 3px;
}

#Filter.product-filter {
    padding: 3px;
    border-bottom:1px solid #ddd;
    background-color:#fff;
}

    #Filter div {
        padding-left: 0 ;
        padding-right: 0 ;
    }

    #Filter .FilterLabel {
        line-height:2.5em;
        text-align:right;
    }

.FilterDiv {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#Mobile-Filter{
    display:none;
}

#mobil-product-filter {
    position: fixed;
    width: 100%;
    margin: 0;
    z-index: 1001;
    overflow-y: auto;
    top: 3.5em;
    bottom: 0;
    display: none; /* block */
    background-color: #fff;
    padding-top: 5px;
}
.mobil-product-filter-header {
    text-align:center;
}
#mobil-product-filter div {
    margin-bottom: 3px;
    padding-left: 2px;
    padding-right: 2px;
}
#Filter .category-button {
    margin-top: 0rem !important;
    text-align: left;
    border-radius: 0;
    border-bottom: 1px solid #e7e7e7;
}

#Filter div.htmlCategoryTree_level_0 {
    background-color: #eee;
    padding: 3px 3px 3px 23px;
    width: 100%;
}

#Filter div.htmlCategoryTree_level_1 {
    background-color: #ddd;
    padding: 3px 3px 3px 23px;
    width: 100%;
}

#Filter div.htmlCategoryTree_level_2 {
    background-color: #ccc;
    padding: 3px 3px 3px 23px;
    width: 100%;
}

#Filter i.fa-chevron-circle-down {
    color: #FFC107;
}

#Filter i.fa-chevron-circle-right {
    margin-left: .2em !important;
}

#Filter button.category-button.btn-active {
    background-color: #FFC107;
    color: #000;
    font-weight: 700;
    border: none;
    box-shadow: none;
}
    #Filter button.category-button.btn-active i.fa-chevron-circle-down {
        color: #000;
    }
#Filter button.category-button.btn-passive {
    background-color: #fff;
    color: #909090;
    font-weight: 500;
}
#Filter button.category-button.btn-all-categories {
    background-color: #fff;
    color: #909090;
    font-weight: 600;
}
#Filter button.category-level--1  {
}
#Filter button.category-cancel{
    width: 10%;
    color:#DC3545;
}
#Filter button.category-level--1 i.fa-chevron-circle-down {
    color: #000;
}
#Filter button.category-level-0 {
}
#Filter button.category-level-1 {
}
#Filter button.category-level-2 {
}