﻿.product_list .breadcrumbs {
    margin-bottom: 30px;
}

.product_list {
    padding: 0px 0px;
}

#product_list .container {
    width: 90%;
}

#product_list_wrapper {
    display: flex;
    gap: 10px;
}

#product_list_left {
    width: 25%;
}

#product_list_right {
    width: 75%;
}

#resultTable {
    display: table;
    width: 100%;
    color: var(--word);
    font-size: 14px;
}

    #resultTable .thead {
        display: table-header-group;
        white-space: nowrap;
        background-color: var(--BG2);
        height: 52px;
    }

    #resultTable .tbody {
        display: table-row-group;
    }

    #resultTable .tr {
        display: table-row;
    }

    #resultTable .tbody .tr:nth-of-type(odd) {
        background-color: #fff;
    }

    #resultTable .tbody .tr:nth-of-type(even) {
        background-color: #faf9f9;
    }

    #resultTable .tbody .tr:hover {
        /*        filter: brightness(0.97);
*/
    }

    #resultTable .th {
        display: table-cell;
        vertical-align: middle;
        padding-left: 20px;
        font-weight: 600;
        white-space: nowrap;
        /*        min-width: 90px;*/
        max-width: 160px;
    }

    #resultTable .td {
        display: table-cell;
        vertical-align: middle;
        /*        border-bottom: 1px solid var(--BG2);
*/
        padding-left: 20px;
    }

        #resultTable .td .td_container {
            display: flex;
            flex-direction: column;
            min-height: 32px;
            justify-content: center;
            padding: 5px;
        }

    #resultTable .text-right {
        text-align: right;
    }

    #resultTable .sort.text-right {
        padding-right: 20px;
    }

    #resultTable .td .sub_cell {
        display: flex;
        gap: 5px;
        font-size: 12px;
        color: #9b9b9b;
        margin: 2px 0px;
    }

    #resultTable .price_container {
        display: grid;
        grid-template-columns: min-content min-content;
        float: right;
    }

    #resultTable .price_box {
        font-size: 12px;
        display: contents;
    }

        #resultTable .price_box .price_box_min {
            margin-right: 10px;
            min-width: 65px;
            padding: 2px 0px;
        }

        #resultTable .price_box .price_box_price {
            min-width: 65px;
            padding: 2px 0px;
        }

.sortBtn {
    position: relative;
    display: unset !important;
}

    .sortBtn:before {
        content: "▲";
        position: absolute;
        left: 0px;
        top: -4px;
        margin-left: 3px;
        font-size: 12px;
        color: lightgray;
    }

    .sortBtn:after {
        content: "▼";
        position: absolute;
        left: 0px;
        bottom: -4px;
        margin-left: 3px;
        font-size: 12px;
        color: lightgray;
    }


.th.sort:hover {
    color: black;
    cursor: pointer;
}

.th.asc,
.th.asc .sortBtn:before {
    color: var(--main);
}

.th.desc,
.th.desc .sortBtn:after {
    color: var(--main);
}

    .th.asc:hover .sortBtn::before,
    .th.desc:hover .sortBtn::after,
    .th:not(.asc):not(.desc):hover .sortBtn::before,
    .th:not(.asc):not(.desc):hover .sortBtn::after {
        color: black;
    }

    .th.asc:hover .sortBtn::after,
    .th.desc:hover .sortBtn::before {
        color: lightgray;
    }

#resultTable .td .td_container .row_title {
    display: none;
    background-color: var(--BG2);
    color: black;
    text-align: left !important;
    min-width: 130px;
    padding-left: 5px;
}

.sort_dropdown {
    display: none;
    align-items: center;
    color: var(--word);
    font-weight: normal;
    font-size: 14px;
    position: relative;
    user-select: none;
    cursor: pointer;
    margin: 10px 10px 10px 0px;
}

    .sort_dropdown::before {
        content: '|';
        margin: 0px 5px;
        color: lightgray;
    }

.sort_symbol {
    display: flex;
    transform: scaleY(-1);
}

    .sort_symbol.desc {
        transform: scaleY(1);
    }

.sort_selected {
    margin-left: 5px;
    min-width: 120px;
}

.sort_select {
    position: absolute;
    background-color: white;
    color: var(--word) !important;
    display: none;
    flex-direction: column;
    gap: 5px;
    left: 15px;
    top: 20px;
    box-shadow: #0000002e 2px 2px 10px 0px;
    font-weight: 600;
    width: 100%;
    z-index: 99;
}

.sort_dropdown:hover,
.sort_dropdown:hover .sort_symbol svg {
    color: lightgray;
    fill: lightgray;
}

    .sort_dropdown:hover .sort_select {
        display: flex;
    }

.sort_select.hide {
    display: none;
}

.sort_select .select_option {
    padding: 10px 0px 10px 10px;
    display: flex;
    align-items: center;
    gap: 10px;
    /*    padding: 10px;
*/
}

    .sort_select .select_option:hover .radio_btn:not(.checked) {
        background-color: #ddd;
    }

    .sort_select .select_option > * {
        cursor: pointer;
    }

.radio_btn {
    height: 15px;
    width: 15px;
    background-color: #fff;
    border-radius: 50%;
    border: 1px solid #ddd;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .radio_btn:hover {
        background-color: #ddd;
    }

    .radio_btn.checked {
        background-color: #ffcfbb;
        border: 1px solid #ffcfbb;
    }

        .radio_btn.checked::after {
            content: '';
            display: block;
            width: 7px;
            height: 7px;
            border-radius: 50%;
            background: #e86731;
        }

.filter .filter_header {
    background-color: #cacaca;
    border: 0px solid #cacaca;
    padding: 10px;
    margin-left: 0px;
    position: relative;
}

.left .title {
    displayxxx: inline-block;
    font-weight: 700;
}


.search_bar .title {
    margin-bottom: 10px;
}

.filter .filter_header .expand_btn {
    display: none;
}

    .filter .filter_header .expand_btn .expanded {
        cursor: pointer;
        position: absolute;
        top: 10px;
        right: 12px;
    }

    .filter .filter_header .expand_btn .expand {
        cursor: pointer;
        float: right;
        position: absolute;
        top: 10px;
        right: 12px;
        display: block;
    }

.filter.active .filter_header .expand_btn .expand {
    display: none;
}

.filter .filter_list {
    background-color: #fff;
    padding: 0px;
    /*-webkit-box-shadow: 0px -5px 10px -4px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px -5px 10px -4px rgba(0,0,0,0.2);
	box-shadow: 0px -5px 10px -4px rgba(0,0,0,0.2);*/
    max-height: 300px;
    box-sizing: border-box;
    transition: all 0.8s ease;
    overflow-y: auto;
    position: relative;
    scrollbar-width: thin;
    scrollbar-color: #d5d5d5 #f3f3f3;
    border: 1px solid #e7e7e7;
}

    .filter .filter_list::-webkit-scrollbar {
        width: 8px;
    }


    .filter .filter_list::-webkit-scrollbar-track {
        background: #f3f3f3;
    }

    .filter .filter_list::-webkit-scrollbar-thumb {
        background: #d5d5d5;
    }

    .filter .filter_list > div {
        padding: 20px 15px;
    }

    .filter .filter_list.no_scroll {
        max-height: unset;
        overflow-y: unset;
    }

.filter_list .item {
    margin-bottom: 10px;
    display: inline-flex;
    width: 100%; /*90%*/
}

.apply_btn {
    border: lightgray 1px solid;
    padding: 5px !important;
    width: 60px;
    height: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 10px 10px 10px auto;
    cursor: pointer;
}

    .apply_btn:hover {
        background-color: lightgray;
    }

    .apply_btn:active {
        transform: scale(0.95); /* Adds a slight "pressed" effect */
    }

.filter_list .item .parent {
    margin-left: 10px;
}

    .filter_list .item .parent:before {
        content: "\25CF";
        display: inline-block;
        color: #e86731;
        text-align: center;
        position: absolute;
        left: 10px;
    }

.filter_list .item .child {
    display: none;
}

.filter_list .search {
    position: relative;
    margin-bottom: 20px;
    margin-top: 0;
}

    .filter_list .search input {
        border-left: 1px solid #e9e2e2;
        position: relative;
        width: 100%;
        box-sizing: border-box;
        margin-left: 0px;
        margin: 0;
    }

        .filter_list .search input:focus {
            outline: none;
        }

    .filter_list .search button {
        height: 36px;
        width: auto;
        position: absolute;
        right: 10px;
        top: 0px;
        border: 0px solid #e9e2e2;
        border-left: 0px;
        vertical-align: top;
        background: transparent;
    }

.show_more {
    display: inline-block;
    cursor: pointer;
}

    .show_more span {
        text-decoration: underline;
        font-size: 14px;
        color: #0f5380;
    }


.filter .filter_list .hidden_list {
    display: none;
}


.filter.active .filter_list.active {
    max-height: none;
}


.filter .filter_list.active .hidden_list {
    display: block;
}


.search_bar {
    background-color: #fff;
    padding: 25px 0px 0px 0px;
}


.result_sum {
    /*    color: #0050b3;
*/ font-weight: 700;
    margin-top: 0px;
    margin-bottom: 15px;
    text-align: left;
}


.result_list .result_sum {
    float: right;
    margin-right: 20px;
    margin-bottom: 10px;
}


.search_bar .search {
    position: relative;
    margin-bottom: 20px;
    margin-top: 0;
    width: 100%;
}

    .search_bar .search input {
        border-left: 1px solid #e9e2e2;
        position: relative;
        width: 100%;
        box-sizing: border-box;
        margin-left: 0px;
        margin: 0;
        height: 36px;
    }

        .search_bar .search input:focus {
            outline: none;
        }

.main_searchbox .search_bar .search {
    width: 50%;
}

.main_searchbox .result_sum {
    text-align: center;
}

.search_bar .search button {
    /*    height: 36px;
    width: auto;
    position: absolute;
    right: 10px;
    top: 0px;
    border: 0px solid #e9e2e2;
    border-left: 0px;
    vertical-align: top;
    background: transparent;
*/
    height: 36px;
    width: 78px;
    position: absolute;
    right: 0px;
    top: 0px;
    border: 1px solid #e9e2e2;
    border-left: 0px;
    vertical-align: top;
    cursor: pointer;
}
/*    .search_bar .search button:hover {
        background-color: var(--BG2);
    }
*/

.search_bar .tag {
    background-color: #b8a79b;
    display: inline-block;
    padding: 0px 10px;
    border-radius: 12px;
    margin-right: 10px;
    margin-bottom: 10px;
    position: relative;
    box-sizing: border-box;
    min-height: 35px;
}


    .search_bar .tag:after {
        content: '';
        clear: both;
        display: table;
    }

    .search_bar .tag.del {
        display: none;
    }

    .search_bar .tag span {
        display: inline-block;
        color: #fff;
        padding: 5px 30px 5px 5px;
        word-break: break-all;
    }

    .search_bar .tag .del_btn {
        display: inline-block;
        margin-left: 30px;
        cursor: pointer;
        vertical-align: middle;
        position: absolute;
        right: 8px;
        float: right;
        top: 7px;
        text-align: left;
    }

.result_list {
    margin-top: 0px;
}

    .result_list .result_item {
        border-bottom: 1px solid #ddd;
        padding-bottom: 5px;
        padding-top: 20px;
    }

    .result_list .img_container {
        /*        text-align: center;
*/ width: 100%;
    }

        .result_list .img_container > div {
            width: 100%;
            height: 150px;
            background-repeat: no-repeat;
            background-position: 50%;
            background-size: contain;
            text-align: center;
        }


    .result_list .data_sheet {
        text-align: left;
        margin-top: 10px;
    }


        .result_list .data_sheet img {
            vertical-align: middle;
            margin-right: 10px;
            width: 15px;
        }

        .result_list .data_sheet a {
            color: #0050b3;
            vertical-align: middle;
            font-size: 14px;
        }


    .result_list .content {
        word-break: break-all;
        display: inline-block;
        padding-left: 15px;
    }


    .result_list .partno .content {
        font-weight: 700;
        font-size: 16px;
        color: #173061;
    }

    .result_list .content span {
        vertical-align: top;
        font-weight: 500;
    }

    .result_list .content div {
        display: inline;
    }

    .result_list .supplier .content {
        font-size: 16px;
        color: #173061;
    }

    .result_list .product_info .viewproduct {
        margin-top: 30px;
        margin-bottom: 10px;
    }

        .result_list .product_info .viewproduct a {
            color: #e86731;
            font-weight: 700;
            vertical-align: middle;
        }

        .result_list .product_info .viewproduct img {
            vertical-align: middle;
            margin-right: 10px;
        }

    .result_list .product_info {
        padding-left: 15px;
        background-color: #f3f3f3;
        padding: 10px;
        margin-bottom: 10px;
    }

    .result_list .other_details {
        background-color: #fff;
        padding: 10px;
    }

        .result_list .other_details .col-xs-12 {
            padding: 5px;
        }

        .result_list .other_details .label {
            display: inline-block;
            width: 60%;
        }

    .result_list .label {
        display: inline-block;
        width: 20%;
    }

    .result_list .other_details .left > div {
        margin-bottom: 10px;
    }

        .result_list .other_details .left > div.ships {
            margin-bottom: 0px;
        }

    .result_list .ships span {
        font-weight: 700;
        font-size: 14px;
        position: static;
    }

    .result_list .other_details .field .content div {
        color: #333;
        display: inline-block;
        font-size: 14px;
    }

    .result_list span {
        display: inline-block;
    }

    .result_list .css_table .css_td {
        border: 0px;
        font-size: 15px;
        position: relative;
    }

    .result_list .css_table .css_tr .css_td {
        padding: 2px 0px;
        color: #333;
    }

    .result_list .price_break .css_table .css_tr .css_td:last-child {
        font-weight: 500;
    }

    .result_list .css_table .css_tr .css_td:last-child {
        font-weight: 700;
    }

    .result_list .css_table.info .css_tr .css_td:first-child {
        width: 5%;
        vertical-align: top;
    }

    .result_list .price_break a {
        font-weightxxx: 14px;
        font-size: 14px;
    }

    .result_list .css_table .css_tr .css_td.price_label {
        font-weight: 500;
        white-space: nowrap;
        color: #525252;
        font-size: 16px;
    }

    .result_list .price_break .css_table {
        margin-left: auto;
        width: 55%;
    }

    .result_list .price_break .css_tr .css_td:first-child {
        width: 100%; /* 0% */
        text-align: right;
        padding-right: 20px;
    }

    .result_list .price_break .css_tr .css_td:last-child {
        width: 100%;
    }

    .result_list .price_break.rfq {
        padding-top: 28px;
        font-weight: 700;
        text-align: center;
    }

    .result_list .min_multi {
        color: #888;
        font-size: 15px;
        display: inline-block;
        float: right;
        margin-top: 18px;
    }

    .result_list .product_infoxxx {
        margin-bottom: 10px;
    }

    .result_list .product_info span {
        font-size: 16px;
        font-weight: 500;
        color: #525252;
    }

    .result_list .info .css_td {
        vertical-align: top;
    }

    .result_list .info .label {
        font-weight: 500;
        color: #525252;
        white-space: nowrap;
        font-size: 16px;
        margin-right: 5px;
    }

    .result_list .add_container {
        /*min-width: 114px;*/ /* 127px */
    }

    .result_list .add_cart,
    .result_list .rfq_btn {
        height: 28px;
        width: 26px;
        background-image: url(../img/cart/Misc_BasketItemStatus-B.png);
        cursor: pointer;
        background-repeat: no-repeat;
        margin-top: 5px;
        margin-left: 5px;
    }

    .result_list .add_container:hover .add_cart,
    .result_list .add_container:hover .rfq_btn {
        background-position: left bottom;
    }

    .result_list .add_cart.added {
        background-image: url(../img/cart/icon-ShoppingCart2.png);
    }

    .result_list .add_cart .buy_button_innerText {
        display: none;
    }

    .result_list .rfq_btn {
        background-image: url(../img/cart/icon-RFQ-A.png);
    }

        .result_list .rfq_btn.added {
            background-image: url(../img/cart/icon-RFQ-A-added.png);
        }


.list_item {
    position: relative;
    padding-left: 25px;
    cursor: pointer;
    margin-bottom: 2px;
}


.result_list .price_break .css_tr .css_td .min_multi div {
    display: inline;
    white-space: nowrap;
    margin-left: 15px;
}

    .result_list .price_break .css_tr .css_td .min_multi div::after {
        content: "+";
        visibility: hidden;
    }

.absolute {
    position: absolute;
}

.price_label .css_td {
    position: relative;
}

.price_label {
    height: 25px;
}

    .price_label .absolute {
        top: 0;
        left: 0px;
    }

.min_multi.absolute {
    right: 20px;
}

.list_item input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.list_item .label {
    display: inline-block;
    vertical-align: top;
    word-break: break-word;
    font-size: 14px;
}

.list_item .checkmark {
    position: absolute;
    left: 0;
    top: 2px;
    height: 15px;
    width: 15px;
    background-color: #fff;
    border-radius: 50%;
    border: 1px solid #ddd;
}

.list_item:hover input ~ .checkmark {
    background-color: #ddd;
}

.list_item input:checked ~ .checkmark {
    background-color: #ffcfbb;
    border: 1px solid #ffcfbb;
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

.list_item input:checked ~ .checkmark:after {
    display: block;
}

.list_item .checkmark:after {
    top: 4px;
    left: 4px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #e86731;
}

#addCartModal .modal-content {
    width: 80%;
    border-radius: 10px;
    margin: 10% auto;
}

#addCartModal .qty_container {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 120px;
    margin-bottom: 120px;
    text-align: center;
}

    #addCartModal .qty_container .add_cart label {
        font-weight: 700;
        color: #173061;
        margin-right: 5px;
    }

    #addCartModal .qty_container .add_cart input {
        height: 34px;
        border: 1px solid #e9e2e2;
        width: 58%;
    }

    #addCartModal .qty_container .add_cart button {
        height: 36px;
        margin-left: -1px;
        border: 0px solid #e9e2e2;
        border-left: 0px;
        vertical-align: top;
        cursor: pointer;
        background-color: #e86731;
        color: #fff;
        font-weight: 700;
        padding: 0px 25px;
    }

    #addCartModal .qty_container .product_info {
        text-align: left;
        margin-bottom: 50px;
        width: 90%;
        margin-left: auto;
        margin-right: auto;
        background-color: #fff;
    }

#addCartModal .price_sum {
    color: #173061;
    margin-top: 30px;
}

    #addCartModal .price_sum.total_quantity span {
        color: #173061;
    }

    #addCartModal .price_sum #spnSumLabel {
        font-size: 24px;
        font-weight: 700;
        color: #173061;
        margin-left: 0px;
    }

    #addCartModal .price_sum span {
        color: #ce2424;
        font-size: 24px;
        margin-left: 10px;
    }

#addCartModal .unavailible .price_sum {
    display: inline-block;
    margin-right: 30px;
    vertical-align: top;
}

#addCartModal .price_sum .average_amt {
    margin-top: 0px;
}

    #addCartModal .price_sum .average_amt span {
        color: #173061;
        font-size: 18px;
        margin-left: 10px;
    }

#addCartModal .unavailible {
    padding: 30px 20px 30px 20px;
    display: none;
}

    #addCartModal .unavailible.active {
        display: block;
    }

    #addCartModal .unavailible .title {
        color: #173061;
        font-size: 30px;
        font-weight: 700;
        margin-bottom: 20px;
    }

    #addCartModal .unavailible .selected {
        margin-bottom: 40px;
    }

        #addCartModal .unavailible .selected h4 {
            font-weight: 700;
            margin-bottom: 10px;
        }

    #addCartModal .unavailible .valid_options h4 {
        margin-bottom: 10px;
        font-weight: 700;
    }

    #addCartModal .unavailible .valid_options p {
        width: 100%;
        font-size: 14px;
        position: absolute;
        top: 115px;
    }

    #addCartModal .unavailible .valid_options {
        position: relative;
    }

        #addCartModal .unavailible .valid_options .css_table .css_th {
            background: #e86731;
            font-size: 14px;
        }

            #addCartModal .unavailible .valid_options .css_table .css_th .css_td {
                height: 37px;
            }

    #addCartModal .unavailible .css_table .css_td {
        vertical-align: middle;
        vertical-align: top;
    }

    #addCartModal .unavailible .valid_options .css_table .css_tr.sub_span {
        height: 30px;
    }

    #addCartModal .unavailible .valid_options .css_table .css_tr.main_span .css_td {
        border-bottom: 1px solid #333;
    }

    #addCartModal .unavailible .valid_options .css_table .css_tr.sub_choice .css_td {
        background: #fffbe9;
    }

    #addCartModal .unavailible .valid_options .css_table .css_tr.sub_choice.disabled .css_td {
        background: #f2f2f2;
        color: #ddd;
    }

    #addCartModal .unavailible .valid_options .css_table .css_th.hide {
        opacity: 0;
    }

    #addCartModal .unavailible .valid_options .css_table.sub_choice .css_th .css_td {
        padding: 2px 10px;
    }

    #addCartModal .unavailible .valid_options .css_table .css_td {
        border: 0px;
    }

    #addCartModal .unavailible .css_table .css_td.quantity input {
        text-align: right;
        display: block;
        padding-right: 5px;
        width: 60%;
    }

    #addCartModal .unavailible .css_table .css_td.error input {
        border: 1px solid red;
    }

    #addCartModal .unavailible .css_table .css_td.error {
        color: red;
    }

    #addCartModal .unavailible .btn_container {
        text-align: center;
        margin-top: 50px;
    }

#addCartModal .add_finish {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 120px;
    margin-bottom: 120px;
    text-align: center;
    display: none;
}

    #addCartModal .add_finish.active {
        display: block;
    }

    #addCartModal .add_finish span {
        font-size: 18px;
        display: block;
    }

    #addCartModal .add_finish .check_cart {
        margin-left: -1px;
        border: 0px solid #e9e2e2;
        border-left: 0px;
        vertical-align: top;
        cursor: pointer;
        background-color: #e86731;
        color: #fff;
        font-weight: 700;
        padding: 10px 25px;
        margin-top: 20px;
        display: inline-block;
    }

#addCartModal .unavailible .btn_container .addCart {
    background-color: #e86731;
    color: #fff;
    font-weight: 700;
    padding: 0px 25px;
    height: 36px;
    cursor: pointer;
}

#addCartModal .unavailible .btn_container .back {
    background-color: #cacaca;
    color: #fff;
    font-weight: 700;
    padding: 0px 25px;
    height: 36px;
    cursor: pointer;
}

#addCartModal hr {
    display: none;
}

.total_qty {
    color: #ce2424;
    font-size: 24px;
    margin-top: 10px;
}

#addCartModal .loader_container {
    height: 36px;
    padding: 0px 25px;
    display: inline-block;
    vertical-align: bottom;
}

.loader {
    border: 5px solid #f3f3f3;
    border-radius: 50%;
    border-top: 5px solid #888;
    width: 20px;
    height: 20px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}


.price_break {
    position: relative;
}

.css_table .css_td .vip_price {
    position: relative;
    font-size: 18px;
    color: #e00000;
    font-weight: 700;
}

    .css_table .css_td .vip_price img {
        position: relative;
        border: 0px solid #eee;
        top: 0px;
        right: -2px;
        transform: rotate(-20deg);
        cursor: pointer;
    }


.original_price_box {
    position: absolute;
    top: 30px;
    right: 0px;
    z-index: 50;
    background-color: #fffce0;
    padding: 20px 30px 20px 30px;
    border: 1px solid #ddd;
    display: none;
}

    .original_price_box.active {
        display: block;
    }

    .original_price_box .close {
        top: 0px;
        width: auto;
        font-size: 20px;
    }

        .original_price_box .close img {
            border: 0px;
        }

    .original_price_box h4 {
        font-size: 18px;
        margin-bottom: 10px;
        text-align: center;
    }

.result_list .price_break .original_price_box .css_table {
    margin: 0;
    width: 100%;
}

.result_list .price_break .original_price_box .css_tr .css_td:first-child {
    width: auto;
}

.loader_container {
    height: 36px;
    padding: 0px 25px;
    display: inline-block;
    vertical-align: bottom;
}

.loader {
    border: 5px solid #f3f3f3;
    border-radius: 50%;
    border-top: 5px solid #888;
    width: 20px;
    height: 20px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}

.QuantityInput_CSSPanel {
    max-width: 720px;
}

    .QuantityInput_CSSPanel .result_list {
        widthxxx: 600px;
    }

    .QuantityInput_CSSPanel .product_info {
        padding-left: 15px;
        background-color: #f3f3f3;
        padding: 10px;
        margin-bottom: 10px;
    }

    .QuantityInput_CSSPanel .product_infoxxx {
        margin-bottom: 10px;
    }

    .QuantityInput_CSSPanel .product_info span {
        font-size: 16px;
        font-weight: 500;
        color: #525252;
    }

    .QuantityInput_CSSPanel .info .css_td {
        vertical-align: top;
    }

    .QuantityInput_CSSPanel .info .label {
        font-weight: 500;
        color: #525252;
        white-space: nowrap;
        font-size: 16px;
        margin-right: 5px;
    }

    .QuantityInput_CSSPanel .css_table.hide {
        display: none;
    }

    .QuantityInput_CSSPanel .css_table .css_tr {
        padding: 0px;
        border: none;
    }

        .QuantityInput_CSSPanel .css_table .css_tr.hide {
            display: none;
        }

    .QuantityInput_CSSPanel .css_table .css_td:first-child {
        border: none;
    }

    .QuantityInput_CSSPanel .css_table .css_td {
        padding: 0px;
        border: none;
    }

    .QuantityInput_CSSPanel .label {
        word-breakxxx: break-all;
        white-space: nowrap;
        display: inline-block;
    }

    .QuantityInput_CSSPanel .content {
        word-breakxxx: break-all;
        white-space: nowrap;
        display: inline-block;
        width: 330px;
    }

    .QuantityInput_CSSPanel .partno .label {
        vertical-alignxxx: 6px;
    }

    .QuantityInput_CSSPanel .partno .content span {
        vertical-alignxxx: 10px;
        font-weight: 500;
    }

    .QuantityInput_CSSPanel .partno .content div {
        font-weightxxx: 700;
        font-sizexxx: 22px;
        font-weight: 700;
        font-size: 16px;
        color: #173061;
        vertical-alignxxx: 8px;
    }

    .QuantityInput_CSSPanel .content span {
        vertical-align: top;
        font-weight: 500;
    }

    .QuantityInput_CSSPanel .content div {
        display: inline;
    }

    .QuantityInput_CSSPanel .supplier .content {
        font-sizexxx: 16px;
        font-weight: 700;
        font-size: 16px;
        color: #173061;
    }

    .QuantityInput_CSSPanel .expand2_btn {
        display: none;
    }

        .QuantityInput_CSSPanel .expand2_btn .expanded2 {
            background-colorxxx: #aaaaaa;
            text-decoration: underline;
            color: #0050b3;
            cursor: pointer;
            position: static; /*absolute*/
            top: 230px;
            right: 20px;
        }

        .QuantityInput_CSSPanel .expand2_btn .expand2 {
            background-colorxxx: #aaaaaa;
            text-decoration: underline;
            color: #0050b3;
            cursor: pointer;
            floatxxx: right;
            position: static; /*absolute*/
            top: 230px;
            right: 20px;
            display: block;
        }

    /*.QuantityInput_CSSPanel .expand2_btn .expand2{
                    display:none;
                }*/

    .QuantityInput_CSSPanel .other_details {
        background-color: #fff;
        padding: 10px;
    }

        .QuantityInput_CSSPanel .other_details .col-xs-12 {
            padding: 5px;
        }

        .QuantityInput_CSSPanel .other_details .label {
            display: inline-block;
            width: 60%;
        }

    .QuantityInput_CSSPanel .label {
        display: inline-block;
        width: 20%;
    }

    .QuantityInput_CSSPanel .other_details .left > div {
        margin-bottom: 10px;
    }

        .QuantityInput_CSSPanel .other_details .left > div.ships {
            margin-bottom: 0px;
        }

    .QuantityInput_CSSPanel .ships span {
        font-weight: 700;
        font-size: 14px;
        position: static;
    }

    .QuantityInput_CSSPanel .other_details .field .content div {
        color: #333;
        display: inline-block;
        font-size: 14px;
    }

    .QuantityInput_CSSPanel span {
        display: inline-block;
    }

    .QuantityInput_CSSPanel .css_table .css_td {
        border: 0px;
        font-size: 15px;
        position: relative;
    }

    .QuantityInput_CSSPanel .css_table .css_tr .css_td {
        padding: 2px 0px;
        color: #333;
    }

    .QuantityInput_CSSPanel .price_break .css_table .css_tr .css_td:last-child {
        font-weight: 500;
    }

    .QuantityInput_CSSPanel .css_table .css_tr .css_td:last-child {
        font-weight: 700;
    }

    .QuantityInput_CSSPanel .css_table .css_tr .css_td .min {
        font-weight: 500;
    }

    .QuantityInput_CSSPanel .css_table.info .css_tr .css_td:first-child {
        width: 5%;
        vertical-align: top;
    }

    .QuantityInput_CSSPanel .min_multi div { /* .price_break .css_tr .css_td*/
        display: inline;
        white-space: nowrap;
        margin-left: 15px;
    }

    .QuantityInput_CSSPanel .price_break .css_tr .css_td .min_multi div::after {
        content: "+";
        visibility: hidden;
    }

    /*.QuantityInput_CSSPanel .css_table.info .css_tr .css_td:first-child{
                    width:5%;
                    vertical-align:top;
                }*/

    .QuantityInput_CSSPanel .css_table .css_tr .css_td.price_label {
        font-weight: 500;
        white-space: nowrap;
        color: #525252;
        font-size: 16px;
    }

    .QuantityInput_CSSPanel .price_break .css_table {
        margin-left: auto;
        width: 55%;
    }

    .QuantityInput_CSSPanel .price_break .css_tr .css_td:first-child {
        width: 0%; /*100%*/
        text-align: right;
        padding-right: 20px;
    }

    .QuantityInput_CSSPanel .price_break .css_tr .css_td:last-child {
        widthxxx: 55%; /*100%*/
        width: 100%;
    }

    .QuantityInput_CSSPanel .same_row {
        display: table-row;
    }

    .QuantityInput_CSSPanel .cell_in_row {
        padding: 18px 0px;
        color: #333;
        text-alignxxx: right !important;
        text-align: center !important;
        width: 0% !important;
        padding-right: 20px;
        display: table-cell;
        vertical-align: middle;
        border: 0px;
        font-size: 15px;
        position: relative;
    }

    .QuantityInput_CSSPanel .min_multi {
        color: #888;
        font-size: 15px;
        display: inline-block;
        floatxxx: left; /*right;*/
        margin-topxxx: 22px;
        margin-leftxxx: 170px; /*120px*/ /*220px*/
        padding-right: 20px;
    }

    .QuantityInput_CSSPanel .add_container {
        margin-top: 13px;
        paddingxxx: 4px 60px 4px 0px;
        padding: 4px 0px 4px 0px;
    }

        .QuantityInput_CSSPanel .add_container .addCart {
            display: inline-block;
            vertical-align: top;
            cursor: pointer;
            background-color: #e86731;
            color: #fff;
            font-size: 14px;
            font-weight: 700;
            padding: 9px 25px;
            border: 0px solid #e9e2e2;
            width: 114px;
        }

.price_sum {
    color: #173061;
    margin-top: 5px;
}

    .price_sum #spnSumLabel {
        font-size: 24px;
        font-weight: 700;
        color: #173061;
        margin-left: 0px;
    }

    .price_sum span {
        color: #ce2424;
        font-size: 24px;
        margin-left: 10px;
    }

    .price_sum .average_amt {
        margin-top: 15px;
    }

        .price_sum .average_amt span {
            color: #173061;
            font-size: 18px;
            margin-left: 10px;
        }


@media (min-width: 768px) and (max-width: 1279px) {
    .QuantityInput_CSSPanel {
        padding: 40px 20px 13px 20px;
    }

        .QuantityInput_CSSPanel .col-sm-12 {
            width: 50%;
        }

    .MobileOnly {
        display: none;
    }

    .SelectedProductMatched_CSSPanel {
        padding: 50px 30px;
    }

    .PriceSum_CSSPanel {
        position: sticky;
        bottom: -13px;
        background-color: #fff4e8;
        padding: 30px 10px 10px;
    }

    .PriceSumButtons_CSSPanel {
        text-align: center;
        padding-top: 25px;
    }
}

@media only screen and (min-width: 991px) {
    .QuantityInput_CSSPanel {
        padding: 40px 20px 13px 20px;
    }

    .MobileOnly {
        display: none;
    }

    .SelectedProductMatched_CSSPanel {
        padding: 50px 50px;
        max-width: 1150px;
    }

    .PriceSum_CSSPanel {
        position: sticky;
        bottom: -13px;
        background-color: #fff4e8;
        padding: 10px 50px;
        box-shadow: #0000004f 0 -2px 6px 0px;
    }

    .PriceSumButtons_CSSPanel {
        text-align: center;
        padding-top: 25px;
    }
}

.filter {
    margin-bottom: 15px;
}

#resultTable .shink_col {
    display: none;
}

#resultTable .td .unshink_data {
    display: inherit;
}


@media only screen and (max-width: 1400px) {
    #product_list_wrapper {
        flex-direction: column;
    }

    #product_list_left,
    #product_list_right,
    #product_list .container {
        width: 100%;
    }

    .left,
    .filter_container {
        display: flex;
        gap: 20px;
        align-items: center;
    }

    .filter_container {
        margin-top: 5px;
        width: 50%;
    }

    .search_bar {
        padding: 0px;
        min-width: 400px;
        width: 50%;
    }

        .search_bar .search {
            margin: unset;
        }

    .filter {
        display: flex;
        width: 100%;
        margin-bottom: unset !important;
        position: relative;
        min-width: 240px;
        height: 36px;
    }

    .filter_list .item {
        margin-bottom: 10px;
    }

    .filter .filter_header {
        background-color: var(--main);
        color: var(--word3);
        display: flex;
        align-items: center;
        padding: 8px;
        font-size: 15px;
        width: 100%;
    }

    .filter .filter_list {
        position: absolute;
        max-height: 500px;
        transition: all 0.6s ease;
        transform: translateY(-40px);
        opacity: 0;
        z-index: -99;
        width: 100%;
    }

        .filter .filter_list > div {
            padding: 20px 10px;
        }

    .list_item {
        padding-left: 35px;
    }

    .filter.active .filter_list {
        transform: translateY(36px);
        opacity: 1;
        z-index: 99;
    }

    .filter .filter_header .expand_btn {
        display: inline-block;
    }

    .filter .filter_list > div {
        padding: 20px;
    }

    .result_sum {
        display: flex;
        align-items: center;
        white-space: nowrap;
    }

    #resultTable .shink_col {
        display: none;
    }

    #resultTable .td .unshink_data {
        display: inherit;
    }
    /*    End of max-screen*/
}

@media only screen and (max-width: 1042px) {
    .left {
        flex-wrap: wrap;
        gap: unset;
    }

    .search_bar,
    .filter_container {
        width: 100%;
        padding: unset;
    }

    .sort_dropdown {
        display: flex;
    }

    #resultTable {
        table-layout: fixed;
        /*        color: var(--word4);   */
        color: #505050;
        font-size: 12px;
    }

        #resultTable .tbody .tr:nth-of-type(even) {
            background-color: unset;
        }

        #resultTable .thead {
            display: none;
        }

        #resultTable .td {
            display: flex;
            flex-direction: row;
            align-items: center;
            padding: unset;
            gap: 20px;
        }

            #resultTable .td .unshink_data {
                display: none;
            }

            #resultTable .td .td_container {
                flex-direction: row;
                padding: unset;
                width: 100%;
                justify-content: unset;
            }

                #resultTable .td .td_container > div {
                    display: flex;
                    align-items: center;
                }

                #resultTable .td .td_container .row_title,
                #resultTable .td .td_container .row_content {
                    display: flex;
                    align-items: flex-start !important;
                    padding-top: 10px;
                }

        #resultTable .tr .td:nth-of-type(5) .row_title,
        #resultTable .tr .td:nth-of-type(5) .row_content {
            padding-bottom: 10px;
        }

        #resultTable .td .td_container .row_content {
            padding-left: 10px;
            flex-direction: column;
        }

        #resultTable .rsp_center {
            justify-content: center !important;
            border-bottom: unset;
            background-color: #fff;
        }

        #resultTable .min_multi_container {
            gap: 10px;
        }

        #resultTable .add_container {
            margin-top: 10px;
            margin-bottom: 25px;
        }

        #resultTable .price_container {
            flex-direction: column;
        }

        #resultTable .shink_col {
            display: none;
        }

        #resultTable .td .unshink_data {
            display: inherit;
        }

    .result_list .label {
        width: 30%;
    }

    .result_list .price_break .css_table {
        margin-left: auto;
        width: 100%;
    }

    .result_list .price_break .css_tr .css_td .min_multi div {
        display: inline;
        white-space: nowrap;
        margin-left: 0px;
    }

    .result_list .label {
        width: auto;
    }

    .result_list .price_break .css_table {
        margin-left: 0px;
        width: auto;
    }

    .result_list .css_table .css_tr .css_td:last-child {
        width: 100% !important;
    }

    .result_list .original_price_box .css_table .css_tr .css_td:last-child {
        width: auto !important;
    }

    .result_list .price_break .css_tr .css_td:first-child {
        width: auto;
    }

    .result_list .add_container {
        padding: 5px 10px;
        border: var(--main) 1px solid;
    }

    .result_list .add_cart {
        float: none;
        padding-left: 35px;
        padding-right: 5px;
        display: flex;
        align-items: center;
        color: var(--main);
        font-size: 14px;
        margin: unset;
    }

    .result_list .add_cart {
        background-image: url(../img/cart/icon-BUY2.png);
        background-position: left bottom;
    }

        .result_list .add_cart.rfq_btn {
            background-image: url(../img/cart/icon-RFQ-A2.png);
            background-position: left bottom;
        }

        .result_list .add_cart.added {
            color: var(--word5);
            width: auto;
        }

    .result_list .add_container:has(.add_cart.added) {
        border-color: var(--word5);
    }

    .result_list .add_cart.added {
        background-image: url(../img/cart/icon-ShoppingCartA.png);
    }

    .result_list .add_container:has(.add_cart.added):hover,
    .result_list .add_container:hover .add_cart.added {
        background-color: var(--word5);
    }

    .result_list .add_container:hover .add_cart,
    .result_list .add_container:hover .added {
        background-position: left top;
    }

    .result_list .add_cart .buy_button_innerText {
        display: initial;
        white-space: nowrap;
    }

    .result_list .add_container:hover,
    .result_list .add_container:hover .add_cart,
    .result_list .add_container:hover .rfq_btn {
        background-color: var(--main);
        color: white;
        border-color: var(--main);
    }

    .result_list .price_break .css_tr .css_td .min_multi div {
        display: block;
        white-space: nowrap;
    }

    .result_list .price_break .css_tr .css_td:first-child {
        padding-right: 40px;
    }

    .result_list .min_multi {
        margin-top: 6px;
        right: 0px;
    }

    .absolute {
        position: relative;
    }

    .result_list .css_table .css_tr .css_td {
        display: table-cell;
        vertical-align: middle;
    }

    .result_list .css_table .css_tr {
        display: table-row;
    }

    .result_list .css_table.info .css_tr .css_td:first-child {
        width: 32% !important;
        text-align: left !important;
    }

    .result_list .other_details .css_tr .css_td:first-child {
        text-align: left !important;
    }

    .result_list .label {
        margin-right: 10px;
    }

    .result_list .other_details .label {
        width: auto;
    }

    .result_list .price_break .css_tr .css_td:last-child {
        width: 100% !important;
    }

    .result_list .price_break .original_price_box .css_tr .css_td:last-child {
        width: auto !important;
    }

    .result_list .price_break .css_tr .css_td:first-child {
        text-align: right !important;
        width: 0% !important;
    }

    .result_list .price_break .css_tr .css_td:last-child {
        width: 100%;
        text-align: right;
        padding-right: 20px;
    }

    #addCartModal .unavailible .sum {
        position: sticky;
        bottom: 0px;
        right: 0px;
        text-align: right;
        background-color: #fffbbede;
        padding: 10px;
    }

    #addCartModal .unavailible .price_sum {
        position: sticky;
        bottom: 0px;
        right: 0px;
        margin-right: 0;
        display: block;
        margin-top: 0;
        margin-bottom: 15px;
    }

    #addCartModal .unavailible .btn_container {
        margin-top: 0px;
        text-align: right;
    }

    .QuantityInput_CSSPanel .absolute {
        position: absolute;
    }

    .original_price_box {
        right: auto;
        left: 0px;
    }

    #addCartModal .qty_container {
        width: 100%;
    }

        #addCartModal .qty_container .add_cart input {
            width: 40%;
            margin-bottom: 10px;
        }

    .result_item .product_info {
        margin-bottom: 20px;
    }

    #addCartModal .modal-content {
        width: 80%;
    }

    #addCartModal .qty_container {
        width: 100%;
    }

    #addCartModal hr {
        display: none;
    }

    #addCartModal .unavailible .valid_options p {
        width: 100%;
        font-size: 14px;
        position: absolute;
        top: 265px;
    }

    #addCartModal .unavailible .valid_options .css_table .css_tr.sub_span {
        border-bottom: 0px;
    }

    #addCartModal .unavailible .valid_options .css_table .css_tr.main_span .css_td {
        display: none;
    }

    .css_table .css_tr.sub_choice {
        border-bottom: 0px;
    }

    .result_list .info .css_tr {
        border-bottom: 0px solid #333;
    }

    .result_list .price_break .css_tr {
        border-bottom: 0px solid #333;
    }

    .result_list .price_break .css_td {
        display: inline-block;
        width: 40% !important;
    }

    .result_item .right {
        padding: 0px;
    }

    .result_item .col-xs-8 {
        padding: 0px;
    }

    .result_item .col-xs-12 {
        padding: 0px;
    }

    .result_list .price_break.rfq {
        padding-top: 0px;
    }

    .result_list .min_multi {
        float: none;
        margin-top: 7px;
    }

    .list_item .label {
        margin-bottom: 15px;
    }

    .result_list .price_break .css_td {
        display: inline-block;
        width: 35% !important;
    }

    .QuantityInput_CSSPanel {
        padding: 40px 20px 13px 20px;
    }

        .QuantityInput_CSSPanel .expand2_btn {
            display: inline-block;
            float: right;
        }

            .QuantityInput_CSSPanel .expand2_btn .expand2 {
                display: none; /*inline-block*/
            }

        .QuantityInput_CSSPanel .other_details {
            display: none;
        }

            .QuantityInput_CSSPanel .other_details.active {
                display: block;
            }

        .QuantityInput_CSSPanel .content {
            white-space: normal;
            displayxxx: inline-block;
            width: 100%;
        }

            .QuantityInput_CSSPanel .content span {
                display: none;
            }

        .QuantityInput_CSSPanel .price_break .css_table {
            margin-leftxxx: -40px;
            widthxxx: 85%;
            margin-left: auto;
            width: 100%;
        }

        .QuantityInput_CSSPanel .price_break .css_tr {
            border-bottom: 0px solid #333;
        }

        .QuantityInput_CSSPanel .price_break .css_td {
            display: inline-block;
            width: 40% !important;
        }

        .QuantityInput_CSSPanel .cell_in_row {
            padding-right: 12px;
        }

        .QuantityInput_CSSPanel .min_multi {
            float: none;
            margin-topxxx: 7px;
            margin-left: 0px;
            text-align: right !important;
        }

            .QuantityInput_CSSPanel .min_multi div {
                displayxxx: block;
                white-space: nowrap;
                vertical-align: top;
            }

        .QuantityInput_CSSPanel .add_container .addCart {
            padding: 9px 25px;
            font-size: 14px;
            font-weight: 700;
            width: 114px;
        }

        .QuantityInput_CSSPanel .price_break .css_tr .css_td:first-child {
            text-align: right !important;
        }

    .MobileOnly {
        height: 10px;
    }

    .SelectedProductMatched_CSSPanel {
        padding: 50px 10px;
    }

    .PriceSum_CSSPanel {
        right: 0px;
        text-align: right;
        position: sticky;
        bottom: -13px;
        background-color: #fff4e8;
        padding: 10px;
    }

    .PriceSumButtons_CSSPanel {
        text-align: right;
        padding-top: 25px;
    }
}

@media only screen and (max-width: 545px) {
    .product_list .breadcrumbs {
        margin-bottom: 10px;
    }

    .search_bar {
        min-width: unset;
    }

    .left, .filter_container {
        flex-wrap: wrap;
        width: 100%;
        margin: unset;
        gap: 10px;
    }

    .filter_container {
        gap: 15px;
    }

    .filter {
        width: 100%;
    }

    .pagination {
        display: flex;
        width: 100%;
        justify-content: space-evenly;
    }

        .pagination ul {
            width: 100%;
        }

            .pagination ul > div {
                display: flex;
                justify-content: space-evenly;
            }
}
