/* Jan */
:root {
    --font-color-dark: #42515C;
    --color-accent: #F67D00;
    --std-size: 18px;
}


/* ---- login-area */
/* .login-area .company_logo p {
    width: 80px;
} */
.login-area .company_logo img {
    width: unset;
    height: unset !important;
    width: 100% !important;
}
.login-area .login-right {
    background-image: unset;
    background-color: #F9F9F9;
    background-image: url("/userdata/images/bg.png")!important;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
}
.company_logo {
    width: 380px;
}
.login-area .login__container {
    height: 100vh;
    max-width: 1920px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--font-color-dark);
}
.login-area .login-row {
    display: flex;
    justify-content: space-around;
    align-items: center;
    box-shadow: 0px 3px 6px #0000000D;
    border: 2px solid #F2F0F4;
    border-radius: 8px;
    /* padding: 48px 48px 48px 90px; */
    background-color: #fff;
    width: 100%;
    height: 100%;
}
.login-area h1 {
    font-size: calc(24px + 12 * (100vw - 320px) / 1600);
    font-weight: 600;
    color: var(--font-color-dark);
}
div#logo-area {
    width: 300px;
    height: 300px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
@media (max-width: 992px) {
    .login-area h1 {
        font-size: calc(24px + 12 * (100vw - 320px) / 1600) !important;
    }
}
@media (max-width: 768px) {
    .login-area h1 {
        font-size: calc(24px + 12 * (100vw - 320px) / 1600) !important;
    }
}
.login-right {
    width: 40%;
    height: 100%;
    border-color: #B2B9BF;
}
div#login-area {
    width: 60%;
    display: flex;
    justify-content: center;
}
div#login_1 {
    width: 380px;
}
.login-area .login__form {
    width: 360px;
}
.login-area .login__input-name {
    margin-bottom: 12px;
    border: none;
    border-radius: 8px;
    margin-top: 8px;
    background: #EFF1F1;
}
.login-area .login__input-pass {
    margin-bottom: 12px;
    border: none;
    border-radius: 8px;
    margin-top: 8px;
    background: #EFF1F1;
}
.login-area .login__button {
    margin-top: 24px;
    background: var(--font-color-dark) 0% 0% no-repeat padding-box;
    border-radius: 8px;
    color: #fff;
    /* width: unset; */
    min-width: 120px;
    padding: 12px 18px;
    font-size: var(--std-size);
    float: right;
}
.wrapper-login {
    margin-top: 20px;
}
@media (max-width: 1100px) {
    .login-right {
        width: 100%;
    }
    div#login-area {
        min-width: 500px;
    }
}
@media (max-width: 950px) {
    /* .login-area div#logo-area {
        display: none;
    } */
    .login-area .login-row {
        flex-direction: column;
        justify-content: start;
    }
    .company_logo, .login-logo, .login-logo .textcontent, p, .login-logo img {
        height: 100%;
    }
    div#login-area {
        margin-top: 30px;
    }
    .login-area .company_logo img {
        height: 80% !important;
        object-fit: contain;
        margin-top: 20px;
    }
    .login-area .login-right {
        height: 25%;
    }
    div#logo-area {
        width: 180px;
        height: 180px;
    }
}
@media (max-width: 730px) {
    .login-area .login-row{
        /* width: 80%; */
        padding: 30px 30px 30px 30px;
    }
}
@media (max-width: 520px) {
    div#login_1 {
        width: 90%;
    }
    div#login-area {
        min-width: 250px;
        width: 90%;
    }
}
@media (max-width: 475px) {
    div#login_1 {
        width: 100%;
    }
    div#login-area {
        min-width: 250px;
        width: 100%;
    }
}
@media (min-width: 1921px) {
    .login__container {
        margin-left: auto;
        margin-right: auto;
    }
}
/* div#logo-area {
    height: 100%;
    width: 300px;
} */
/* ---- login-area End*/
/* Jan End*/

/* Jan */
/* ---- Bestellcenter*/
.header-wrapper {
    background-color: #fff;
    position: fixed;
    height: 100%;
    width: 128px;
}

div#header {
    background-color: #fff;
    position: fixed;
    height: 100%;
    width: 128px;
}
div#header .container {
    padding: 0px;
    display: flex;
    flex-direction: column;
    justify-content: unset;
}
div#header div#header_1 {
    height: unset;
}
div#header {
    box-shadow: var(--shadow)
}
/* 
div#products-section .row {
    width: 1792px;
    margin-right: auto;
    position: absolute;
    right: 0;
    display: flex;
    justify-content: end;
}
div#products-section .filter .row {
    width: 100%;
    margin-right: auto;
    position: absolute;
    right: 0;
    display: flex;
    justify-content: end;
}
div#products-section .col-md-3 {
    width: 392px;
    background-color: #F9F9F9;
} */
.col-lg-3 {
    flex: 0 0 33% !important;
    flex: 0 0 33% !important;
}
@media (min-width: 992px) {
    .col-lg-3 {
        flex: 0 0 33% !important;
        max-width: 33% !important;
    }
}

.main__wrapper {
    float: right;
    width: calc(100% - 128px);
    background-color: #f9f9f9;
}

div#footer {
    display: none;
}
.filter-wrapper {
    position: absolute;
    top: 0;
}
.filter__block {
    width: 25%;
    float: left;
    position: sticky;
    top: 60px;
}

.produkt-list__block {
    width: 75%;
    float: left;
    background-color: #fff;
    padding: 35px;
}

.card-product {
    box-shadow: 0px 3px 6px #0000000D;
    border-radius: 15px!important;
    border: none!important;
}
.card-product__img {
    padding: 12px;
}

.cart__wrapper {
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 99;
}

.filter__block {
    top: 0;
}
.filter-wrapper {
    display: flex;
    align-items: center;
    flex-direction: column;
}
.filter {
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 100%;
}
.filter form {
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 100%;
}
.sidebar-categories {
    color: var(--font-color-dark);
}
.sidebar-categories .card-header {
    box-shadow: 0px 3px 6px #0000000D;
    border-radius: 15px!important;
    border: none!important;
    background: #fff;
    height: 66px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.sidebar-categories .card-header .card-link {
    color: var(--font-color-dark)!important;
    font-size: var(--std-size);
}
.sidebar-categories .card {
    box-shadow: 0px 3px 6px #0000000D;
    border-radius: 15px!important;
    border: none!important;
    margin-top: 32px;

}
.input-group .form-control {
    box-shadow: 0px 3px 6px #0000000D;
    border-radius: 15px!important;
    border: none!important;
    height: 66px;
    padding-left: 56px;
    color: var(--font-color-dark);
    background-image: url(/userdata/images/search.png);
    background-repeat: no-repeat;
    background-position: 20px 50%;
    font-size: var(--std-size);
}
.input-group .form-control::placeholder {
    color: var(--font-color-dark);
}
.filter-list {
    color: var(--font-color-dark);
}
.border-gray {
    border: none;
}
.card-body ul {
    padding-left: 0px;
}
.pixel-radio {
    border-radius: 6px;
}
.pixel-radio:checked {
    border: 8px solid var(--color-accent);
}
a.btn-danger {
    background-color: var(--color-accent)!important;
    border-color: var(--color-accent)!important;
    padding: 12px 18px;
    margin-top: 24px;
    font-size: var(--std-size)!important;
    border-radius: 8px!important;
    transition-duration: 200ms!important;
}
a.btn-danger:hover {
    background-color: var(--color-accent)!important;
    border-color: var(--color-accent)!important;
    transform: scale(1.05);
    transition-duration: 200ms!important;
}
.wrapper-btn-danger {
    width: 100%;
    display: flex;
    justify-content: end;
    padding-right: 15px;
}
.child-filters {
    margin-left: 0px!important;
    padding-left: 26px;
}

/* ---- products-block */
.product-price {
    display: flex;
    justify-content: space-between;
}

.delete_item {
    color: #d32a2a;
    text-decoration: underline;
    font-size: 14px;
    margin-top: 6px;
    cursor: pointer;
}


/* .product-price .name {
    display: flex;
    flex-direction: column;
    justify-content: end;
} */
.warenkorb .auswahl .number-mid input {
    width: 100px!important;
    text-align: left!important;
}
.auswahl .number-mid .form-control {
    background-color: transparent;
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
}
.quant .form-group-loop .add-cart {
    /* width: 150px; */
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px;
    border-radius: 8px;
}
p.type-name.card-product__title {
    display: none;
}
.add-cart .btn {
    width: 36px;
}
.btn-square .btn_minus {
    background-color: #fff;
    border: none;
    color: var(--font-color-dark);
    border-radius: 12px;
}
.btn-square .btn_plus {
    background-color: #fff;
    border: none;
    color: var(--font-color-dark);
    border-radius: 12px;
}
.product-price .name {
    font-size: 24px;
    color: var(--font-color-dark) ;
}
.card-body .produc-no {
    font-size: var(--std-size);
    color: #B2B9BF!important;
}
.card-body .card-product__title a{
    font-size: 24px;
    font-weight: 600;
    color: #42515C;
}
img.card-img {
    transition-duration: 200ms;
}
.card-product:hover img.card-img {
    transform: scale(1.1);
    transition-duration: 200ms;
}
.card-product:hover .card-product__imgOverlay {
    opacity: 0;
}
.card-product__imgOverlay {
    height: 100%;
}
.card-product__imgOverlay a{
    height: 100%;
    width: 100%;
    opacity: 0;
    position: absolute;
}
.card-body .product-price {
    align-items: center;
    height: 50px;
}
.page-link.paging {
    background-color: #fff !important ;
    /* border: none; */
}
.btn-info:focus {
    background-color: var(--color-accent)!important ;
    border-color: none;
}
.btn-info:not(:disabled):not(.disabled):active {
    background-color: var(--color-accent)!important ;
}
.btn-info:hover {
    background-color: var(--color-accent)!important ;
    border-color: none;
}
/* ---- products-block Ende*/

/* Warenkorb fixed*/
.cart__wrapper {
    width: 96px;
    height: 96px;
    background-color: var(--color-accent);
    background-image: url(/userdata/images/shopping-basket.svg);
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 50%;
    transition-duration: 200ms;
}
.cart__wrapper:hover {
    background-color: var(--color-accent);
    transform: scale(1.05);
    transition-duration: 200ms;
}
.cart__wrapper a.cart_button{
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    /* opacity: 0; */
}

.badge.badge-pill.badge-primary.btnCount {
    position: absolute;
    right: 0;
    height: 36px;
    min-width: 36px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.products-listing {
    display: flex;
    justify-content: flex-start;
    width: 100%;
    flex-wrap: wrap;
    gap: 20px;

}
.single-list {
    width: 32%;
}
.pagination {
    margin-top: 30px;
} 
.button-filter {
    background-image: url(/userdata/images/filter.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 70%;
    background-color: var(--color-accent);
    border-radius: 8px;
    width: 40px;
    height: 40px;
    margin-bottom: 20px;
}
.button-filter-m {
    background-image: url(/userdata/images/filter.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 70%;
    background-color: var(--color-accent);
    border-radius: 8px;
    width: 40px;
    height: 40px;
    margin-bottom: 20px;
    margin-top: 30px;
}
/* @media (max-width: 1580px) {
    .produkt-list-filter-o .single-list {
        width: 32%;
    }
} */
@media (max-width: 1580px) {
    .single-list {
        width: 48%;
    }
    .produkt-list-filter-o .single-list {
        width: 32%;
    }
}
.produkt-list-filter-o .single-list
/* .mobile__button {
    width: 100%;
    display: flex;
    justify-content: center;
} */
/* ---- Filter */
/* @media (min-width: 1201px) { */
    .mobile__button {
        display: block;
    }
/* } */
/* @media (max-width: 1200px) { */
    .filter__block {
        width: 25%;            
    } 
    .data-filter  {
        display: block;
    } 
    .produkt-list__block {
        width: 75%;
    }
    .filter-open {
        width: 0%; 
    }
    .produkt-list-filter-o {
        width: 100%;
    }
    .filter-open .data-filter{
        display: none;
    }
    .produkt-list-filter-o .single-list {
        width: 23%;
    }
@media (max-width: 1580px) {
    .single-list {
        width: 48%;
    }
    .produkt-list-filter-o .single-list {
        width: 32%;
    }
}
@media (max-width: 1197px) {
    .produkt-list__block {
        width: 65%;
    }
    .produkt-list-filter-o {
        width: 100%;
    }
    .filter__block {
        width: 35%;            
    }
    .single-list {
        width: 100%;
    }
    .produkt-list-filter-o .single-list {
        width: 31%;
    }
}
/* } */
@media (max-width: 1115px) {
    .filter-open {
        width: 35%; 
    }
    .produkt-list-filter-o {
        width: 100%;
    }
    .produkt-list-filter-o .single-list{
        width: 48%;
    }
}
@media (max-width: 992px) {
   .filter__block {
        top: 60px;
   }
}
@media (max-width: 850px) {
    .filter-open {
        width: 50%; 
    }
    .produkt-list-filter-o {
        width: 100%;
    }
}
@media (max-width: 750px) {
    .single-list {
        width: 100%;
    }
}
@media (min-width: 700px) {
    .button-filter-m {
        display: none;
    }
}
@media (max-width: 700px) {
    .button-filter {
        display: none;
    }
    .button-filter-m {
        display: block;
    }
    .produkt-list__block .data-filter {
        display: none;
        margin-bottom: 30px;
    }
    .produkt-list__block .data-filter.filter-open-m {
        display: block;
    }
    .produkt-list-filter-o {
        width: 100%;
    }
    .produkt-list__block {
        width: 100%;
    }
}
/* ---- Filter Ende */
/* Warenkorb fixed Ende*/
/* ---- Bestellcenter End*/



/* ---- account-details */
body.account {
    color: var(--font-color-dark);
}
div#account-section {
    height: 100%;
    /* float: left; */
}
div#profile {
    padding: 0;
}
.account-details {
    padding-top: 36px;
    width: 90%;
    margin-left: auto;
    background-color: #fff;
    height: 100%;
}
h2 {
    color: var(--font-color-dark);
}
h3 {
    color: var(--font-color-dark);
}
.nav-pills .nav-link{
    padding: 12px 18px;
    background-color: #EFF1F1;
    color: var(--font-color-dark);
    font-size: 18px;
    border-radius: 8px!important;
    margin-right: 18px;
}
.nav-pills .nav-link.active{
    background-color: var(--color-accent)!important;
}
.form-group label {
    font-size: 17px;
    color: var(--font-color-dark);
}
.form-group input{
    background-color: #fff!important;
    border: 2px solid #ECECEC;
    height: 48px;
    border-radius: 8px;
}
.form-group textarea{
    background-color: #fff!important;
    border: 2px solid #ECECEC;
    height: 100px;
    border-radius: 8px;
}
.profile form {
    margin-bottom: 100px!important;
}
@media (max-width: 1150px) {
    .account-details {
        width: 85%;
    }
}
@media (max-width: 992px) {
    body.account {
        background-color: #fff !important;
    }
    .account-details {
        width: 100%;
        padding-top: 100px;
        padding-bottom: 100px;
    }
}
div#profile {
    padding-bottom: 1rem!important;
}
.order-history table {
    border: 2px solid #ECECEC;
}
table.dataTable thead th, table.dataTable thead td {
    border: 2px solid #ECECEC!important;
    border-bottom: 2px solid #ECECEC!important;
}
table.dataTable.no-footer {
    border-bottom: 2px solid #ECECEC!important;
}
table.dataTable thead th, table.dataTable tfoot th {
    font-size: 16px;
    color: var(--font-color-dark);
}
.table.dataTable.table td {
    color: var(--font-color-dark);
}
.account .paginate_button {
    margin: 0px 12px;
    border: none!important;
}
.ui.menu {
    border: none!important;
    box-shadow: none!important;
}
.ui.menu .item:before {
    display: none;
}
.ui.pagination.menu .item {
    color: var(--font-color-dark);
    border-radius: 8px;
    
}
.ui.pagination.menu .item.previous {
    background: #EFF1F1;
}
.ui.pagination.menu .item.next {
    background: #EFF1F1;
}
.ui.ui.menu .item.disabled {
    background-color: #EFF1F1!important;
}
.ui.pagination.menu .item.disabled {
    background: #EFF1F1;
}
.ui.pagination.menu .item:hover {
    background-color: var(--color-accent);
}
.ui.pagination.menu .item.active {
    pointer-events: none;
}
.ui.pagination.menu .item.active:hover {
    color: var(--font-color-dark)!important;
}
.ui.pagination.menu .item:last-child {
    border-radius: 8px!important;
}
.ui.pagination.menu .item:first-child {
    border-radius: 8px!important;
}
/* ---- account-details Ende */
.bestellcenter .owl-prev, 
.bestellcenter .owl-next {
    display: none;
}

.bestellcenter .products-listing .card-product__img.img-bg br {
    display: none;
}
.bestellcenter .products-listing .card-product__img.img-bg .card-img {
    padding: 10px;
}
.product_description {
    margin-top: 20px;
    padding-top: 20px;
    color: #42515C;
}
/* .add_to_basket {
    border-top: 2px solid var(--bg);
} */
.filter .card-body {
    overflow-y: scroll;
    max-height: calc(100vh - 300px);
}
.filter .card-body::-webkit-scrollbar {
    width: 10px;
    background-color: #ffffff;
    border-radius: 0px 0px 15px 0px;
}
.filter .card-body::-webkit-scrollbar-thumb {
    background-color: #7B868D;
    width: 3px;
    border-radius: 10px;
}

.filter-list.accordion-filter {
    position: relative;
}
.filter-list.accordion-filter .accordion-button{
    position: absolute;
    background: url(/userdata/images/arrow-ac.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    height: 20px;
    width: 20px;
    right: 0px;
    top: 5px;
    cursor: pointer;
    transition-duration: 200ms;
}
.active-list .filter-list.accordion-filter .accordion-button{
    transform: rotate(-180deg);
    transition-duration: 200ms;
}
.child-filters.border-gray {
    height: 0px;
    overflow: hidden;
    transition-duration: 200ms;
}
.active-list .child-filters.border-gray {
    height: auto;
    transition-duration: 200ms;
}


li.page-item {
    background-color: #fff;
    /* border: 1px solid var(--button-grey); */
    border-radius: none;
    
}
li.page-item a{
    background-color: var(--color-accent) !important;
    color: #42515C !important;
}
li.page-item.active a{
    background-color: var(--color-accent) !important;
    color: #fff !important;
}
li.page-item.disabled a{
    background-color: var(--color-accent) !important;
    color: #fff !important;
    border-color: #FFAA00 !important;
}
#products-section .page-item.active .page-link {
    border-color: #FFAA00 !important;
}
/* Jan End */

body.warenkorb .cart-text-bottom-right .cart-text-content:nth-of-type(2) {

    display: none !important;

}

.product-price.d-flex.justify-content-between {
    padding-block-start: 1rem;
}

.to_product a {
    color: var(--color-accent);
    text-decoration: underline;
    font-size: 14px;
}

select,
input,
input.form-control.productQuantity.quantity10-00001 {
    padding: 10px;
    border: 1px solid #d0d0d0;
    border-radius: 8px;
    width: 100%;
}
input.form-control.productQuantity.quantity10-00001 {
    height: unset;
    padding: 12px 18px;
}
.add_to_basket button {
    background-color: var(--color-accent)!important;
    border-color: var(--color-accent)!important;
    padding: 12px 18px;
    /* margin-top: 24px; */
    font-size: var(--std-size)!important;
    border-radius: 8px!important;
    transition-duration: 200ms!important;
}

a:hover {
    color: var(--color-accent)!important;
}

.price .type-name {
    margin-left: 5px;
    font-size: 16px;
}

.product_description_footer {
    padding-top: 20px;
    display: flex;
    gap: 20px;
    border-top: 2px solid var(--bg);
}