/* @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap'); */
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
/* font-family: "Poppins", sans-serif; */


@font-face {
    font-family: 'VAGRoundedBlackSSiBold';
    src: url('fonts/ufonts.com_vag_rounded_black_ssi_bold.eot');
    src: url('fonts/ufonts.com_vag_rounded_black_ssi_bold.eot') format('embedded-opentype'), url('fonts/ufonts.com_vag-rounded-black-ssi-bold.ttf') format('truetype');
}

@font-face {
    font-family: 'VAGRoundedLightSSiLight';
    src: url('fonts/ufonts.com_vag_rounded_light_ssi_light.eot');
    src: url('fonts/ufonts.com_vag_rounded_light_ssi_light.eot') format('embedded-opentype'), url('fonts/ufonts.com_vag-rounded-light-ssi-light.ttf') format('truetype');
}

@font-face {
    font-family: 'VAGRoundedLightSSiThin';
    src: url('fonts/ufonts.com_vag_rounded_light_ssi_thin.eot');
    src: url('fonts/ufonts.com_vag_rounded_light_ssi_thin.eot') format('embedded-opentype'), url('fonts/ufonts.com_vag-rounded-light-ssi-thin.ttf') format('truetype');
}

@font-face {
    font-family: 'icomoon';
    src: url('fonts/icomoon.eot?bq5833');
    src: url('fonts/icomoon.eot?bq5833#iefix') format('embedded-opentype'), url('fonts/icomoon.ttf?bq5833') format('truetype'), url('fonts/icomoon.woff?bq5833') format('woff'), url('fonts/icomoon.svg?bq5833#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

@font-face {
    font-family: 'icomoon1';
    src: url('fonts/icomoon1.eot?bq5833');
    src: url('fonts/icomoon1.eot?bq5833#iefix') format('embedded-opentype'), url('fonts/icomoon1.ttf?bq5833') format('truetype'), url('fonts/icomoon1.woff?bq5833') format('woff'), url('fonts/icomoon1.svg?bq5833#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

[class^="icon1-"], [class*=" icon1-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon1' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

@font-face {
    font-family: 'icomoon2';
    src: url('fonts/icomoon2.eot?bq5833');
    src: url('fonts/icomoon2.eot?bq5833#iefix') format('embedded-opentype'), url('fonts/icomoon2.ttf?bq5833') format('truetype'), url('fonts/icomoon2.woff?bq5833') format('woff'), url('fonts/icomoon2.svg?bq5833#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

[class^="icon2-"], [class*=" icon2-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon2' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px #8981A7;
    border-radius: 0px;
    background-color: #8981A7;
}

::-webkit-scrollbar-thumb {
    border-radius: 0px;
    -webkit-box-shadow: inset 0 0 6px #522e91;
    background-color: #522e91;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #222;
    opacity: 1;
}

::-moz-placeholder { /* Firefox 19+ */
    color: #222;
    opacity: 1;
}

:-ms-input-placeholder { /* IE 10+ */
    color: #222;
    opacity: 1;
}

:-moz-placeholder { /* Firefox 18- */
    color: #222;
    opacity: 1;
}

b, strong {
    font-weight: 500;
}

label {
    font-weight: 500;
}

.icon-user:before {
    content: "\e90a";
}

.icon-livechat:before {
    content: "\e904";
}

span.icon-livechat {
    position: relative;
}

span.icon-livechat1 {
    margin-right: 0px !important;
    position: absolute;
    top: 2px;
    left: 11px;
}

.icon-livechat1:before {
    content: "\e905";
    font-size: 14px;
    color: #522e91;
}

.icon-search:before {
    content: "\e906";
}

/*.icon-basket:before {
  content: "\e900";
}*/
.icon-basket:before {
    content: "\e916";
}

.icon-stock:before {
    content: "\e908";
}

.icon-calender:before {
    content: "\e901";
}

.icon-supplier:before {
    content: "\e909";
}

.icon-image:before {
    content: "\e903";
}

.icon-shotgun:before {
    content: "\e907";
}

.icon-ideas:before {
    content: "\e902";
}

.icon-unlock:before {
    content: "\e90b";
}

.icon-dot:before {
    content: "\e90c";
}

.icon-down-arrow:before {
    content: "\e90d";
}

.icon-up-arrow:before {
    content: "\e90e";
}

.icon-close:before {
    content: "\e90f";
}

.icon-info:before {
    content: "\e910";
    font-size: 24px;
}

.icon-plus:before {
    content: "\e911";
    font-size: 24px;
}

.icon-search-minus:before {
    content: "\e912";
    font-size: 28px;
}

.icon-search-plus:before {
    content: "\e913";
    font-size: 28px;
}

.icon-supplierrange:before {
    content: "\e914";
}

.icon-suppliertigger:before {
    content: "\e915";
}

.icon-DH:before {
    content: "\e900";
    color: #fff;
}

.icon2-alternate_source_icon:before {
    content: "\e950";
    font-size: 24px;
}

.icon2-print_icon:before {
    content: "\e951";
    font-size: 24px;
}

.icon2-product_trigger_icon:before {
    content: "\e952";
    font-size: 24px;
}

.icon2-stock_icon:before {
    content: "\e953";
}

.icon2-supplier_full_range_icon:before {
    content: "\e954";
    font-size: 24px;
}

html, body {
    width: 100%;
    height: 100%;
}

body {
    font-family: 'Poppins', sans-serif; /*overflow: hidden;*/
}

#pages_wrapper {
    position: relative;
    width: 100%;
    height: 100%; /*overflow: hidden;*/
}

#pages {
    position: relative;
    width: 100%;
    height: 100%;
}

/*
#pages:before, #pages:after {
    content: " ";
    display: table;
}
#pages_wrapper .page {
    height: 100%;
    width: 100%;
    overflow: hidden;
}
#site {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
}
html.cssscrollbar body, html.cssscrollbar .scrollable {
    scrollbar-3dlight-color: #555;
    scrollbar-arrow-color: #666666;
    scrollbar-base-color: #555;
    scrollbar-darkshadow-color: #999;
    scrollbar-face-color: #555;
    scrollbar-highlight-color: #555;
    scrollbar-shadow-color: #555;
    scrollbar-track-color: #999;
}
body.showMainMenu, body.showCart { overflow-y: hidden; }

body.showMainMenu #site .page_struct_horiz {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
body.loaded #site.page .page_struct_horiz {
    -moz-transition: -moz-transform 0.5s ease-in-out, margin 0.5s ease-in-out;
    -o-transition: -o-transform 0.5s ease-in-out, margin 0.5s ease-in-out;
    -webkit-transition: -webkit-transform 0.5s ease-in-out, margin 0.5s ease-in-out;
    transition: transform 0.5s ease-in-out, margin 0.5s ease-in-out;
}
html.csstransforms3d body.showMainMenu #site .page_struct_horiz {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

body.showCart #site .page_struct_horiz {
    -webkit-transform: translate3d(-50em, 0, 0);
    -moz-transform: translate3d(-50em, 0, 0);
    -ms-transform: translate3d(-50em, 0, 0);
    transform: translate3d(-50em, 0, 0);
}

#site.page .overlay_wrapper {
    height: 100%;
    /*position: relative;*
}

body.showMainMenu .overlay, body.showCart .overlay, body.showMegamenu .overlay{
    -moz-transition: background-color 0.8s ease-in-out 0, opacity 0.8s ease-in-out 0, left 0;
    -o-transition: background-color 0.8s ease-in-out 0, opacity 0.8s ease-in-out 0, left 0;
    -webkit-transition: background-color 0.8s ease-in-out 0, opacity 0.8s ease-in-out 0, left 0;
    transition: background-color 0.8s ease-in-out 0, opacity 0.8s ease-in-out 0, left 0;
}
body.showMainMenu #site.page .overlay_wrapper, body.showCart #site.page .overlay_wrapper, body.showMegamenu #site.page .overlay_wrapper {
	overflow: hidden;
}
body.showMainMenu .overlay, body.showCart .overlay, body.showMegamenu .overlay {
	display: block;  background: rgba(13, 0, 56, 0.45);  left: 0; top: 0px;
}
*/

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    display: none;
}

body.showMainMenu .overlay, body.showCart .overlay, body.showMegamenu .overlay, body.showHeadersearch .overlay, body.showEcosearch .overlay {
    display: block;
    -moz-transition: background-color 0.8s ease-in-out 0, opacity 0.8s ease-in-out 0, left 0;
    -o-transition: background-color 0.8s ease-in-out 0, opacity 0.8s ease-in-out 0, left 0;
    -webkit-transition: background-color 0.8s ease-in-out 0, opacity 0.8s ease-in-out 0, left 0;
    transition: background-color 0.8s ease-in-out 0, opacity 0.8s ease-in-out 0, left 0;
}

/*.overlay[data-action="close_any_megamenu_or_sidemenu"] {
    -moz-transition: background-color 0.8s ease-in-out, opacity 0 ease-in-out 0.8s, left 0 linear 0.8s;
    -o-transition: background-color 0.8s ease-in-out, opacity 0 ease-in-out 0.8s, left 0 linear 0.8s;
    -webkit-transition: background-color 0.8s ease-in-out, opacity 0 ease-in-out 0.8s, left 0 linear 0.8s;
    transition: background-color 0.8s ease-in-out, opacity 0 ease-in-out 0.8s, left 0 linear 0.8s;
}
.overlay[data-action="close_any_megamenu_or_sidemenu"] {
    background-color: transparent;
}
.overlay[data-action="close_any_megamenu_or_sidemenu"] {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}*/


body.js [data-action] {
    cursor: pointer;
}

#site.page .page_struct_horiz:before, #site.page .page_struct_horiz:after {
    content: " ";
    display: table;
}

#site.page .page_struct_horiz {
    position: relative;
    overflow: hidden;
    height: 100%;
    width: 200%;
    /*background-color: $sidemenus_bgcolor;*/
    -webkit-transform: translate3d(-20em, 0, 0);
    -moz-transform: translate3d(-20em, 0, 0);
    -ms-transform: translate3d(-20em, 0, 0);
    transform: translate3d(-20em, 0, 0);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
}

.page_struct_vert {
    width: 50%;
    float: left;
    height: 100%;
    position: relative;
}

#site .page_struct_vert {
    background: #ffffff;
}

.scrollable {
    position: relative;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    -moz-overflow-scrolling: touch;
    -ms-overflow-scrolling: touch;
    overflow-scrolling: touch;
    *zoom: 1;
    overflow-x: hidden;
    height: 100%;
    /* default 100%; the correct height should be calculated in runtime by layoutHelper function */
    /* 	body.contentOverlay &,
      body.showMegamenu &,
      body.showMainMenu &,
      body.showCart & {
          overflow: hidden;
          -webkit-transform: translate3d(0,0,0);
      } */
}

.scrollable {
    scrollbar-base-color: #C0C0C0;
    scrollbar-base-color: #C0C0C0;
    scrollbar-3dlight-color: #C0C0C0;
    scrollbar-highlight-color: #522e91;
    scrollbar-track-color: #8981A7;
    scrollbar-arrow-color: black;
    scrollbar-shadow-color: #522e91;
    scrollbar-face-color: #522e91;
    scrollbar-dark-shadow-color: #8981A7;
}

.modal-open .scrollable {
    overflow: hidden;
}

.sidemenu {
    display: block;
    float: left;
    width: 20em;
    height: 100%;
    padding: 0 25px;
}
/*#cartLayerContainer.sidemenu { min-height: 100%; overflow-y: scroll; }*/

#mainmenu {
    background: #522e91;
}
/*#cartLayerContainer { background: #522e91; }*/

#mainmenu {
    visibility: hidden;
}

body.domReady #mainmenu {
    visibility: visible;
}

#site_header:before, #site_header:after {
    content: " ";
    display: table;
}

#site_header:before {
    content: " ";
    display: table;
    width: 100%;
    height: 5px;
    transform: scaleY(-1);
    background: linear-gradient(90deg, #B4005E 0%, #f37421 100%);
}

.modal-message .btn-validation {
    color: #fff;
}


/*.container { width: 940px; padding: 0; }*/

/*----- GENERAL CSS -----*/
.bgOrnge {
    background-color: #f37421;
}

    .bgOrnge a {
        color: #fff;
    }

    .bgOrnge span {
        color: #fff;
    }

.bgLgray {
    background-color: #ccc;
}

.bgSLgray {
    background-color: #eee;
}

.bgSMLgray {
    background-color: #d7d7d7;
}

.bgLightgray {
    background-color: #898989;
}

.bgDarkpurple {
    background-color: #522e91;
}

.bgSMgray {
    background-color: #e5e5e5;
}

.bgSSLgray {
    background-color: #f8f8f8;
}

.bgDgary {
    background-color: #444444;
}

.bgNavi {
    background-color: #522e91;
}

.bgLPurple {
    background-color: #522f91;
}

.bgBlack {
    background-color: #000000;
}

.bgNaviR {
    background-color: #e20000;
}

.bgNaviK {
    background-color: #faa200;
}

.bgNaviT {
    background-color: #f3731f
}

.bgNaviB {
    background-color: #004aac;
}

.bgNaviP {
    background-color: #522e91;
}

.bgNavitop {
    background-color: #523398;
}

.bgGreen {
    background-color: #2D772E;
}

.bgLGreen {
    background-color: #87c552;
}

.bggrdntLGray {
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 0%, #eeeeee 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ffffff 0%,#eeeeee 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ffffff 0%,#eeeeee 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 ); /* IE6-9 */
}

.left {
    float: left;
}

.right {
    float: right;
}

.readMore {
    color: #007bc3;
}

.marginTop20 {
    margin-top: 20px;
}

.halfCol {
    widtH: 50%;
    padding: 0px 15px;
    float: left;
}

/*---- LOGIN AND REGISTER PANE CSS ------*/
/*.loginPane h1, .registerPane  h1 { color: #fff; font-family: "VAGRoundedBlackSSiBold",Arial,sans-serif; font-size: 32px;  border-radius: 30px; padding: 10px 10px 10px 60px; margin-bottom: 20px; position: relative; background: rgba(13, 0, 56, 1);
background: -moz-linear-gradient(left, rgba(13, 0, 56, 0.47) 0%, rgba(13,0,56,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(198,193,217,1)), color-stop(100%, rgba(13,0,56,1)));
background: -webkit-linear-gradient(left, rgba(13, 0, 56, 0.47) 0%, rgba(13,0,56,1) 100%);
background: -o-linear-gradient(left, rgba(13, 0, 56, 0.47) 0%, rgba(13,0,56,1) 100%);
background: -ms-linear-gradient(left, rgba(13, 0, 56, 0.47) 0%, rgba(13,0,56,1) 100%);
background: linear-gradient(to right, rgba(13, 0, 56, 0.47) 0%, rgba(13,0,56,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c6c1d9', endColorstr='#522e91', GradientType=1 ); }*/
.loginPane h1, .registerPane h1 {
    color: #fff;
    font-size: 30px;
    font-weight: 400;
    border-radius: 30px;
    padding: 10px 10px 10px 60px;
    margin-bottom: 20px;
    position: relative;
    background-color: #522e91;
}

    .loginPane h1 span, .registerPane h1 span {
        width: 45px;
        height: 45px;
        background-color: #f37421;
        position: absolute;
        top: 5px;
        left: 5px;
        border-radius: 50%;
    }

    .loginPane h1 span {
        background-image: url('../images/login.png');
        background-image: url('../images/login.svg');
        background-repeat: no-repeat;
        background-size: 30px;
        background-position: center;
    }

    .registerPane h1 span {
        background-image: url('../images/registered-sign.png');
        background-image: url('../images/registered-sign.svg');
        background-repeat: no-repeat;
        background-size: 30px;
        background-position: center;
    }

.loginPane p, .registerPane p {
    color: #777676;
    font-size: 16px;
}

.loginPane input[type="text"], .loginPane input[type="tel"], .loginPane input[type="email"], .loginPane input[type="password"], .loginPane select {
    padding: 8px 8px 8px 8px;
    color: #676565;
    -moz-transition: color 150ms ease-out, background-color 100ms ease-in, border-color 150ms ease-out;
    -o-transition: color 150ms ease-out, background-color 100ms ease-in, border-color 150ms ease-out;
    -webkit-transition: color 150ms ease-out, background-color 100ms ease-in, border-color 150ms ease-out;
    transition: color 150ms ease-out, background-color 100ms ease-in, border-color 150ms ease-out;
    -moz-appearance: none;
    -webkit-appearance: none;
    border-radius: 0;
    text-indent: 0;
    position: relative;
    background-color: #E4E4E4;
    font-family: "HelveticaNeueW02-75Bold", Helvetica, Arial, sans-serif;
    font-size: 19px;
    height: 54px;
    width: 100%;
    border: 1px solid #c9c9c9;
    box-sizing: border-box;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    margin-bottom: 3px;
}

.fieldRow {
    position: relative;
}
/*label.fl-label, span.error, label.error, small.help-block { position: absolute; z-index: 99; display: block; }*/
label.fl-label {
    color: #827E7E;
    font-size: 14px;
    font-weight: normal;
    top: 15px;
    left: 15px;
    max-width: 95%;
    margin-bottom: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    -webkit-pointer-events: none;
    -khtml-pointer-events: none;
    -moz-pointer-events: none;
    pointer-events: none;
}

/*label.fl-typing, label.fl-filled, span.error, label.error, small.help-block { font-size: 12px; top: 8px; left: 10px; visibility: visible; width: 100%;
    -moz-transition: top 100ms ease-in-out, color 300ms ease-in-out, font-size 150ms ease-in-out;
    -o-transition: top 100ms ease-in-out, color 300ms ease-in-out, font-size 150ms ease-in-out;
    -webkit-transition: top 100ms ease-in-out, color 300ms ease-in-out, font-size 150ms ease-in-out;
    transition: top 100ms ease-in-out, color 300ms ease-in-out, font-size 150ms ease-in-out;
}
label.fl-label.fl-typing, label.fl-label.fl-typing.fl-filled { color: #522e91; letter-spacing: 1px; }*/
.loginPane input[type="text"].error, .loginPane input[type="tel"].error, .loginPane input[type="email"].error, .loginPane input[type="password"].error, .loginPane select.error {
    border-color: #ff2c14;
    background-color: #fff;
    color: #000;
}

/*.innerField.has-error label.fl-label { display: none; }*/
.loginPane .innerField.has-error input {
    background-color: #fff;
}

.help-block {
    margin-top: 0px;
}

.checkbox span {
    font-size: 16px;
    font-weight: 500;
    color: #7d7d7d;
}

.forgotPass {
    margin: 10px 0px 20px;
    color: #797676;
    text-decoration: underline;
}

    .forgotPass span {
        cursor: pointer;
        color: #797676;
    }

        .forgotPass span:hover {
            color: #353535;
        }

.registerPane ul {
    margin: 30px 0px 124px;
}

.loginPane .btn, .registerPane .btn {
    width: 100%;
    height: 50px;
    color: #fff;
    font-size: 18px;
    line-height: 36px;
}


.buttons-preview .btn {
    width: auto;
    height: 30px;
    font-size: 14px;
    line-height: 21px;
    padding: 4px 12px;
}

.fade.in {
    opacity: 1;
    background-color: rgba(13, 0, 56, 0.45);
}

.tab-pane.fade.in {
    background-color: transparent;
}

.modal-dialog {
    width: 400px;
}

.modal-title {
    font-size: 21px;
    text-align: center;
    padding: 15px;
    color: #522e91;
}

.modal-message.modal-success .modal-header {
    color: #522e91;
    border-bottom: 3px solid #fea482;
    text-align: center;
}

.modal-message.modal-info .modal-header {
    color: #522e91;
    border-bottom: 3px solid #fea482;
    text-align: center;
}

.modal-message.modal-danger .modal-header {
    color: #522e91;
    border-bottom: 3px solid #fea482;
    text-align: center;
}

.modal-message.modal-warning .modal-header {
    color: #522e91;
    border-bottom: 3px solid #fea482;
    text-align: center;
}

.modal-message .modal-header .fa {
    font-size: 30px;
    margin: 0 auto;
}

.custom.modal-details .modal-dialog {
    width: 60%;
}

.custom .modal-content {
    background-color: #ffffff;
    border-radius: 0;
}

.custom .modal-header {
    background-color: #ffffff;
    padding: 19px 25px;
    border: 1px solid #ffffff;
}

.custom.modal-details .modal-body {
    padding: 30px 20px 10px;
}

.custom .modal-body .tableHead {
    background-color: #f37421;
    color: #fff;
    margin: 0;
    padding: 12px;
    font-size: 18px;
    cursor: pointer;
}

.custom.modal-details .modal-body table tbody tr td:first-child {
    font-weight: 500;
}

.custom.modal-details .modal-body table tbody tr td {
    padding: 10px 15px;
    color: #666;
}

.custom .modal-body table thead tr th {
    background-color: #522e91;
    color: #fff;
    font-size: 14px;
}

.custom .modal-body .box-info {
    background-color: #f9f9f9;
    padding: 15px;
    margin-bottom: 20px;
}

.custom .modal-body .main-images + .box-info {
    text-align: center;
    border: 1px solid #E9E9E9;
}

    .custom .modal-body .main-images + .box-info img {
        width: auto;
        height: auto;
        max-width: 100%;
        max-height: 100%;
    }

.custom.modal-details .modal-body .main-images + .box-info {
    position: relative;
    overflow: hidden;
}

.custom .modal-body .table-striped > tbody > tr:nth-of-type(even) {
    background-color: #f0f0f0;
}

.custom .modal-body .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #d8d6d7;
}

.threedwindow .modal-body {
    background-color: #fff;
}

    .threedwindow .modal-body #IFrameBody iframe {
        height: 500px;
    }

.modal-opened .modal {
    overflow-x: hidden;
    overflow-y: auto;
}

.lists-details {
    margin-bottom: 0px !important;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.pageloader, .ajaxloader {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: #ffffffba;
    top: 0;
    left: 0;
    z-index: 1200;
}

    .pageloader img, .ajaxloader img {
        position: fixed;
        top: 50%;
        left: 50%;
        width: 75px;
        transform: translate(-50%, -50%);
        text-align: center;
        z-index: 1210;
    }


/***************
  SC5 MODAL
***************/
#SupModal1 .modal-dialog {
    width: 60%;
}

#SupModal1 .modal-content {
    background-color: #fff;
    border-radius: 0;
}

#SupModal1 .modal-header {
    background-color: #fff;
    padding: 19px 25px;
}

#SupModal1 .modal-body {
    padding: 30px 20px 10px;
}

    #SupModal1 .modal-body .tableHead {
        background-color: #fff;
        color: #0d0138;
        margin: 0;
        padding: 12px 0;
        font-size: 18px;
        cursor: pointer;
    }

    #SupModal1 .modal-body table tbody tr:nth-child(even) {
        background: #d8d7d7
    }

    #SupModal1 .modal-body table tbody tr:nth-child(odd) {
        background: #f0f0f0
    }

    #SupModal1 .modal-body table tbody tr td:first-child {
        font-weight: 500;
        color: #f37421;
    }

    #SupModal1 .modal-body table tbody tr td {
        padding: 10px 15px;
        color: #666;
    }

    #SupModal1 .modal-body table thead tr th {
        background-color: #fff;
        color: #0d0138;
        font-size: 14px;
    }

    #SupModal1 .modal-body .box-info {
        background-color: #fff;
        padding: 15px;
        margin-bottom: 20px;
        border: 1px solid #ddd;
    }

.custom .modal-body .bx-wrapper .bx-next {
    right: 10px;
    background: url(../images/next-arrow.png) no-repeat 0 0;
}

.custom .modal-body .bx-wrapper .bx-prev {
    left: 10px;
    background: url(../images/prev-arrow.png) no-repeat 0 0;
}

.custom .modal-body .bx-wrapper .bx-controls-direction a {
    width: 38px;
    height: 38px;
}

.custom .closeBtn {
    position: absolute;
    top: 5px;
    right: 10px;
}

.closeBtn {
    width: 30px;
    height: 30px;
    background-image: url('../images/close-gray.png');
    background-image: url('../images/close-gray.svg');
    background-repeat: no-repeat;
    background-size: 20px;
    background-position: center;
    background-color: transparent;
}

.customBtns .btn {
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    text-align: left;
    width: 195px;
    margin-right: 20px;
    border-radius: 0;
    min-height: 45px;
    padding: 10px 10px 10px 45px;
    background-repeat: no-repeat;
    background-size: 26px;
    background-position: center left 8px;
}

    .customBtns .btn.save {
        width: 130px !important;
        background-image: url('../images/download.png');
        background-image: url('../images/download.svg');
    }

.table-striped > tbody > tr:nth-of-type(even) {
    background-color: #f1f0f3;
}

.table > tbody > tr > td .form-control {
    border-radius: 0;
}

.textOrnge {
    color: #f37421;
}

.printdoc .modal {
    position: absolute;
    overflow: auto;
}

.ui-autocomplete-loading {
    background: white url('../images/ui-anim_basic_16x16.gif') right center no-repeat;
}

#GlobalSearch {
    width: 25em;
}


.page_structure {
    padding-top: 82px;
}

/*---- TOP HEADER CSS ----*/
#site_header.navbar-default {
    position: fixed;
    top: 0;
    width: 100%;
    min-height: 75px;
    background-color: #FFFFFF;
    box-shadow: 0 2px 26px 0 rgba(0,0,0,0.2);
    margin: 0;
    z-index: 1020;
    border-radius: 0;
}

    #site_header.navbar-default .container {
        padding-top: 0;
        padding-bottom: 0;
    }

    #site_header.navbar-default .header-divs {
        padding: 0;
    }

    #site_header.navbar-default .menu {
        display: inline-block;
        height: 75px;
        position: relative;
        padding: 15px;
        margin-left: -15px;
        cursor: pointer;
    }

        #site_header.navbar-default .menu:hover {
            background-color: #f1f1f1
        }

        #site_header.navbar-default .menu i {
            font-size: 25px;
            color: #000000;
            line-height: 42px;
        }

        #site_header.navbar-default .menu.active:after {
            content: '';
            display: block;
            position: absolute;
            bottom: 0;
            width: 0;
            height: 0;
            left: 50%;
            margin-left: -10px;
            border-style: solid;
            border-width: 0 10px 10px 10px;
            border-color: transparent transparent #e7e7e7 transparent;
        }

    #site_header.navbar-default .navbar-nav > li > a {
        color: #fff;
        font-size: 16px;
        height: 60px;
        padding: 10px 20px;
    }

        #site_header.navbar-default .navbar-nav > li > a.navbar-brand {
            font-size: 28px;
            line-height: 40px;
        }

            #site_header.navbar-default .navbar-nav > li > a.navbar-brand span {
                letter-spacing: 1.5px;
            }

    #site_header.navbar-default .navbar-brand {
        display: inline-block;
        height: 75px;
        padding: 25px 15px;
        font-family: 'VAGRoundedLightSSiLight', sans-serif;
        font-size: 24px;
        line-height: 42px;
        color: #522e91;
        text-align: center;
        float: none;
        margin: 0;
    }

        #site_header.navbar-default .navbar-brand span {
            font-family: 'VAGRoundedBlackSSiBold', sans-serif;
        }

        #site_header.navbar-default .navbar-brand img {
            max-height: 25px;
        }

    #site_header.navbar-default .navbar-nav.navbar-right {
        width: 100%;
        float: none;
        display: flex;
        justify-items: center;
        justify-content: flex-end;
        margin: 0;
    }

        #site_header.navbar-default .navbar-nav.navbar-right > li:hover {
            background-color: #f1f1f1
        }

        #site_header.navbar-default .navbar-nav.navbar-right > li > span {
            display: inline-block;
            height: 75px;
            font-size: 18px;
            font-weight: 400;
            padding: 15px 10px;
            cursor: pointer;
        }

            #site_header.navbar-default .navbar-nav.navbar-right > li > span i {
                font-size: 18px;
                color: #000000;
                line-height: 42px;
            }

        #site_header.navbar-default .navbar-nav.navbar-right > li.logOut > span i {
            margin-left: 5px;
        }

.headerSearchList, .loginRegister {
    position: relative;
}

    .headerSearchList.active:after, .loginRegister.active:after, .basketList.active:after {
        content: '';
        display: block;
        position: absolute;
        bottom: 0;
        width: 0;
        height: 0;
        left: 50%;
        margin-left: -10px;
        border-style: solid;
        border-width: 0 10px 10px 10px;
        border-color: transparent transparent #e7e7e7 transparent;
    }

.mainnav {
    position: absolute;
    left: 0;
    top: 81px;
    width: 100%;
    background-color: #ffffff;
    padding: 0;
    max-height: 0;
    overflow: hidden;
    box-shadow: 0 15px 15px 0 rgb(0 0 0 / 10%);
    z-index: 1010;
    -webkit-transition: .4s cubic-bezier(.2,.4,.2,1);
    -moz-transition: .4s cubic-bezier(.2,.4,.2,1);
    -ms-transition: .4s cubic-bezier(.2,.4,.2,1);
    -o-transition: .4s cubic-bezier(.2,.4,.2,1);
    transition: .4s cubic-bezier(.2,.4,.2,1);
}

.showMainMenu .mainnav {
    padding: 0 0 150px;
    max-height: 100vh;
    overflow-y: auto;
}

.mainnav ul.navigate {
    padding: 0;
    margin: 0;
    list-style: none;
    width: 100%;
}

    .mainnav ul.navigate.level1 {
        display: block;
    }

        .mainnav ul.navigate.level1 > li {
            margin-bottom: 25px;
        }

            .mainnav ul.navigate.level1 > li label {
                color: #522e91;
                font-size: 16px;
                font-weight: 600;
                letter-spacing: 0;
                line-height: 24px;
                margin-bottom: 10px;
            }

    .mainnav ul.navigate.level2 li {
        width: 100%;
        display: block;
    }

        .mainnav ul.navigate.level2 li a {
            display: block;
            color: #522e91;
            font-size: 14px;
            font-weight: 400;
            letter-spacing: 0;
            line-height: 24px;
            padding: 4px 0;
            border-bottom: 1px solid #522e911f;
        }

.header-search {
    position: absolute;
    left: 0;
    top: 81px;
    width: 100%;
    background-color: #fff;
    max-height: 0;
    overflow: hidden;
    overflow-y: auto;
    box-shadow: 0 15px 15px 0 rgb(0 0 0 / 10%);
    z-index: 1010;
    -webkit-transition: .4s cubic-bezier(.2,.4,.2,1);
    -moz-transition: .4s cubic-bezier(.2,.4,.2,1);
    -ms-transition: .4s cubic-bezier(.2,.4,.2,1);
    -o-transition: .4s cubic-bezier(.2,.4,.2,1);
    transition: .4s cubic-bezier(.2,.4,.2,1);
}

.showHeadersearch .header-search.trendingSearches {
    max-height: 92vh;
    padding: 0 0 120px;
}

.showEcosearch .header-search.ecoSearches {
    max-height: 92vh;
    padding: 0 0 60px;
}

.header-search .container {
    min-height: 565px;
}

.header-search.ecoSearches .container {
    min-height: auto;
}

.header-search .search-form {
    position: relative;
    padding-top: 50px;
    margin-bottom: 30px;
}

    .header-search .search-form span.close-button {
        position: absolute;
        top: 0;
        right: 0;
        font-size: 25px;
        cursor: pointer;
    }

    .header-search .search-form .form-row {
        display: flex;
        background-color: #EEEEEE;
        border-radius: 6px;
    }

        .header-search .search-form .form-row .form-input {
            width: 95%;
            border: 0;
            padding: 8px 15px;
            font-family: 'Poppins', sans-serif;
            font-size: 16px;
            line-height: 22px;
            font-weight: 400;
            background-color: transparent;
            color: #522e91;
        }

            .header-search .search-form .form-row .form-input:focus {
                box-shadow: 0 2px 16px 0 rgb(0 0 0 / 20%);
                outline: 0;
            }

        .header-search .search-form .form-row .dib {
            display: inline-block;
            vertical-align: middle;
            border-radius: 6px;
        }

.header-search .topsearch-button {
    width: 40px;
    height: 40px;
    padding: 8px;
    border: 0;
    margin: 0;
    cursor: pointer;
    text-align: center;
}

    .header-search .topsearch-button i {
        font-size: 18px;
        color: #bdbdbd;
        line-height: 22px;
    }

.header-search .search-list {
    margin-bottom: 30px;
}

    .header-search .search-list ul {
        padding: 0;
        margin-bottom: 30px;
    }

        .header-search .search-list ul li {
            width: auto;
            margin-right: 15px;
            margin-bottom: 10px;
            display: inline-block;
            vertical-align: middle;
            font-size: 18px;
            line-height: 22px;
        }

            .header-search .search-list ul li:first-child {
                width: auto;
            }

            .header-search .search-list ul li label {
                color: #522e91;
                font-size: 18px;
                font-weight: 500;
                letter-spacing: 0;
                line-height: 24px;
                margin: 0;
            }

            .header-search .search-list ul li a {
                text-transform: capitalize;
                color: #522e91;
                font-size: 16px;
                font-weight: 400;
                letter-spacing: 0;
                line-height: 22px;
                cursor: pointer;
            }

                .header-search .search-list ul li a i {
                    font-size: 12px;
                    color: #bdbdbd;
                    margin-right: 5px;
                }

.category-products-list {
    border-top: 1px solid #522e91;
    padding-top: 20px;
}

    .category-products-list > div {
        margin-bottom: 40px;
    }

    .category-products-list h3 {
        font-family: 'Poppins', sans-serif;
        margin: 0 0 20px;
        font-weight: 400;
        color: #522e91;
        font-size: 24px;
        letter-spacing: 0;
        line-height: 24px;
    }

    .category-products-list ul {
        padding: 0;
        list-style: none;
        display: flex;
        flex-wrap: wrap;
        width: auto;
        margin-left: -5px;
        margin-right: -5px;
    }

        .category-products-list ul li {
            width: 50%;
            padding: 5px;
        }

            .category-products-list ul li .product-details {
                display: block;
            }

            .category-products-list ul li .image-block {
                width: 100%;
                height: auto;
                min-height: 120px;
                position: relative;
                border-radius: 5px;
                background-color: transparent;
                overflow: hidden;
                padding: 10px;
                margin: 0 0 12px;
            }

                .category-products-list ul li .image-block img {
                    max-width: 100%;
                    max-height: 100%;
                }

                .category-products-list ul li .image-block .imagerap {
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 100%;
                    height: 100%;
                    z-index: 0;
                    background-color: transparent;
                    background: transparent;
                    background: -moz-linear-gradient(top, rgba(43,43,43,.10) 100%, rgba(43,43,43,.10) 100%);
                    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(43,43,43,.10) 100%)), color-stop(100%, rgba(43,43,43,.10)));
                    background: -webkit-linear-gradient(top, rgba(43,43,43,.10) 100%) 0%, rgba(43,43,43,.10) 100%);
                    background: -o-linear-gradient(top, rgba(43,43,43,.10) 100%) 0%, rgba(43,43,43,.10) 100%);
                    background: -ms-linear-gradient(to bottom, rgba(43,43,43,.10) 0%, rgba(43,43,43,.10) 100%);
                    background: linear-gradient(to bottom, rgba(43,43,43,.10) 0%, rgba(43,43,43,.10) 100%);
                    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#2b2b2b', GradientType=0 );
                }

            .category-products-list li .info-block h5, .category-products-list ul li .info-block label {
                width: 100%;
                margin: 0 0 12px;
                font-size: 12px;
                line-height: 19px;
                font-weight: 600;
                color: #522e91;
                letter-spacing: 0;
                display: block;
                cursor: pointer;
            }

    .category-products-list li .info-block p {
        font-size: 12px;
        line-height: 16px;
        font-weight: 400;
        color: #522e91;
    }

        .category-products-list li .info-block p:last-child {
            margin-bottom: 0;
        }

        .category-products-list li .info-block p span.price {
            display: block;
        }

.header-search .btn {
    color: #522e91;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 22px;
    text-align: center;
    padding: 8px 25px;
    min-width: 130px;
    border: 1px solid #522e91;
    border-radius: 6px;
}

.header-search .custom-search .product-list ul {
    margin-bottom: 50px;
}

    .header-search .custom-search .product-list ul li .product-details {
        position: relative;
        overflow: hidden;
    }

        .header-search .custom-search .product-list ul li .product-details .image-block {
            margin: 0;
            min-height: 150px;
        }

        .header-search .custom-search .product-list ul li .product-details .info-block {
            width: 100%;
            height: 0;
            padding: 10px;
            text-align: center;
            position: absolute;
            left: 0;
            bottom: 0;
            background-color: #ffffffd4;
            opacity: 0;
            border-radius: 5px;
            background: linear-gradient(0deg, #001CFF 0%, #000952 100%);
            transition: all .75s ease;
        }

            .header-search .custom-search .product-list ul li .product-details .info-block label {
                color: #FFFFFF;
                margin: 0 0 5px;
            }

            .header-search .custom-search .product-list ul li .product-details .info-block p {
                color: #FFFFFF;
            }

        .header-search .custom-search .product-list ul li .product-details:hover .info-block {
            height: 100%;
            opacity: 1;
        }

.header-search .custom-search .viewall-button {
    text-align: center;
}

.header-search .trendingsearches-nodata h3 {
    color: #522e91;
    font-size: 36px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 42px;
    text-align: center;
}

.searchloader {
    text-align: center;
}

    .searchloader img {
        width: 50px;
    }

.megamenu {
    position: absolute;
    left: 0;
    top: 81px;
    width: 100%;
    background-color: #ffffff;
    padding: 0;
    max-height: 0;
    overflow: hidden;
    box-shadow: 0 15px 15px 0 rgb(0 0 0 / 10%);
    z-index: 1010;
    -webkit-transition: .4s cubic-bezier(.2,.4,.2,1);
    -moz-transition: .4s cubic-bezier(.2,.4,.2,1);
    -ms-transition: .4s cubic-bezier(.2,.4,.2,1);
    -o-transition: .4s cubic-bezier(.2,.4,.2,1);
    transition: .4s cubic-bezier(.2,.4,.2,1);
}

.showMegamenu .megamenu {
    padding: 20px 0 180px;
    max-height: 100vh;
    overflow-y: auto;
}

.megamenu .headerMenuContainer {
    position: relative;
}

.basketLists > span {
    position: relative;
}

.basketLists .basketCount {
    position: absolute;
    top: 10px;
    right: -5px;
    width: 25px;
    height: 25px;
    padding: 5px 4px;
    text-align: center;
    background-color: #000000;
    border-radius: 50%;
    font-size: 12px;
    line-height: 14px;
    color: #fff;
}

.basket-panel {
    position: fixed;
    top: 0;
    right: 0;
    width: 450px;
    max-width: 100%;
    height: 100vh;
    overflow-y: auto;
    padding: 25px;
    background-color: #fff;
    box-shadow: 0 0 25px 0 rgb(0 0 0 / 20%);
    z-index: 1200;
    transform: translate3d(800px,0,0);
    transition: transform .3s;
}

.showCart .basket-panel {
    transform: translate3d(0,0,0);
}

.basket-panel .cartclose span {
    font-size: 24px;
    color: #522e91;
    padding: 5px;
    cursor: pointer;
}

.basket-panel h3 {
    font-size: 24px;
    color: #522e91;
    margin: 0 0 10px;
}

    .basket-panel h3 span {
        font-size: 16px;
        float: right;
        line-height: 36px;
    }

ul.cartlist {
    list-style: none;
    width: 100%;
    max-height: 315px;
    overflow-y: auto;
    padding: 0 1px 0 0;
    margin: 0 0 20px;
    border-top: 1px solid #3F2B5F;
}

    ul.cartlist li {
        border-bottom: 1px solid #3F2B5F;
        width: 100%;
        padding: 15px 0;
        display: flex;
        justify-content: space-between;
    }

        ul.cartlist li .cartprdctinfo {
            display: flex;
            justify-content: flex-start;
            padding-right: 10px;
        }

        ul.cartlist li .cartprdctImg {
            position: relative;
            min-width: 60px;
            width: 60px;
            height: 60px;
            padding: 8px;
            margin-right: 15px;
            background-color: #fff;
            text-align: center;
        }

            ul.cartlist li .cartprdctImg img {
                width: auto;
                height: auto;
                max-width: 100%;
                font-size: 6px;
            }

        ul.cartlist li .cartprdctContent h4 {
            margin: 0 0 5px;
        }

            ul.cartlist li .cartprdctContent h4 ~ img {
                width: 40px;
            }

        ul.cartlist li h4 {
            color: #522e91;
            font-size: 15px;
            margin: 0;
        }

        ul.cartlist li span.rmvfrmcart {
            width: 25px;
            height: 25px;
            background-image: url('../images/close.png');
            background-image: url('../images/close.svg');
            background-repeat: no-repeat;
            background-size: 12px;
            background-position: center;
            cursor: pointer;
        }

        ul.cartlist li a {
            width: 25px;
            height: 25px;
            background-image: url('../images/close.png');
            background-image: url('../images/close.svg');
            background-repeat: no-repeat;
            background-size: 12px;
            background-position: center;
            cursor: pointer;
        }

            ul.cartlist li a.removebutton {
                min-width: 25px;
            }

.navbar-collapse {
    padding: 0 0;
}

    .navbar-collapse .navbar-right {
        margin-right: 0;
    }

.nav > li > a:focus, .nav > li > a:hover {
    text-decoration: none;
    background-color: transparent;
}

.mobileView {
    display: none;
}

    .mobileView li a {
        color: #fff;
        font-size: 16px;
        min-width: 100px;
        padding: 10px 20px 10px 45px;
    }

    .mobileView li.logIn span {
        color: #fff;
        font-size: 16px;
        min-width: 100px;
        padding: 10px 20px 10px 45px;
    }

.logIn {
    cursor: pointer;
}
    /*.mobileView  li.logIn, .mobileView  li.liveChat { height: 45px;}*/
    .logIn .icon-user {
        position: absolute;
        left: 20px;
        top: 17px;
    }

.liveChat .icon-livechat {
    position: absolute;
    left: 70px;
    top: 8px;
}

.livechatBtn {
    position: fixed;
    top: 35%;
    right: -50px;
    z-index: 10;
    margin-top: -70px;
    background-color: #522e91;
    width: 140px;
    height: 42px;
    padding: 8px 10px 10px 50px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    transform: rotate(-90deg);
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}
    /*.livechatBtn:hover { width: 125px; height: 40px; }*/
    .livechatBtn a, .livechatBtn a:hover {
        color: #fff;
        font-size: 18px;
        font-weight: 300;
        text-decoration: none;
    }

        .livechatBtn a:hover {
        }

        .livechatBtn a > span {
            position: absolute;
            left: 8px;
            top: 6px;
        }

    .livechatBtn .icon-livechat:before {
        font-size: 30px;
    }

    .livechatBtn .icon-livechat {
        position: absolute;
        left: 8px;
        top: 6px;
        transform: rotate(90deg);
    }

    .livechatBtn span.icon-livechat1 {
        margin-right: 0px !important;
        position: absolute;
        top: 3px;
        left: 13px;
    }

        .livechatBtn span.icon-livechat1:before {
            font-size: 16px;
        }

#goToTop {
    display: none;
    position: fixed;
    right: 22px;
    bottom: 50px;
    z-index: 1030;
    width: 45px;
    height: 45px;
    overflow: hidden;
    background: #522e91 url('../images/goTop.png') no-repeat center 48%;
    cursor: pointer;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

.liveChat .icon-livechat:before {
    font-size: 26px;
}

#site_header.navbar-default .navbar-nav > li.icon-user a {
    padding-left: 35px;
}

.topIcon span {
    position: absolute;
    left: 0;
    top: 12px;
    width: 30px;
    height: 30px;
    background-image: url('../images/user.png');
    background-repeat: no-repeat;
    background-position: center left;
    background-size: 28px;
}

.icon-user span {
    position: absolute;
    left: 0;
    top: 12px;
    width: 30px;
    height: 30px;
    background-image: url('../images/user.png');
    background-repeat: no-repeat;
    background-position: center left;
    background-size: 28px;
}

.menuclose {
    color: #ccc;
    font-size: 24px;
    padding: 12px 12px;
    height: 60px;
    cursor: pointer;
}

    .menuclose:hover {
        color: #fff;
    }

.menuList {
    padding: 10px 10px;
    color: #fff;
    cursor: pointer;
    font-family: "Arial",sans-serif;
    font-weight: 500;
    width: 70px;
    height: 60px;
    text-align: center;
    line-height: 40px;
}

    .menuList.active {
        color: transparent;
        background-image: url('../images/close.png');
        background-image: url('../images/close.svg');
        background-repeat: no-repeat;
        background-size: 30px;
        background-position: center;
    }

.pageBanner .container {
    position: relative;
}

.pageBanner .bannerLogo {
    text-align: center;
    margin-bottom: 20px;
}

    .pageBanner .bannerLogo span {
        display: inline-block;
        width: 80px;
        height: 132px;
        background-image: url('../images/SC_22yr_logo.png'); /*background-image: url('../images/logo.svg');*/
        background-repeat: no-repeat;
        background-size: 100%;
        background-position: center;
    }

.homeBanner {
    background-color: #f37421;
    background-image: url('../images/mobile-home-banner.png');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: top center;
    min-height: 400px;
}

    .homeBanner .search-panel {
    }

        .homeBanner .search-panel h1 {
            color: #fff;
            font-size: 30px;
            font-weight: 400;
            letter-spacing: 0;
            line-height: 36px;
            text-align: center;
            margin: 0 0 25px;
        }

        .homeBanner .search-panel ul.searchList {
            padding: 0;
            width: 100%;
        }

            .homeBanner .search-panel ul.searchList li {
                list-style: none;
            }

                .homeBanner .search-panel ul.searchList li label {
                    display: block;
                    position: relative;
                    color: #ffffff;
                    font-size: 16px;
                    font-weight: 500;
                    letter-spacing: 0;
                    line-height: 22px;
                    text-align: center;
                    padding: 5px 20px;
                    margin: 0;
                    cursor: pointer;
                }

        .homeBanner .search-panel .searchoptions .inputpanel {
            max-height: 0;
            overflow: hidden;
            -webkit-transition: .4s cubic-bezier(.2,.4,.2,1);
            -moz-transition: .4s cubic-bezier(.2,.4,.2,1);
            -ms-transition: .4s cubic-bezier(.2,.4,.2,1);
            -o-transition: .4s cubic-bezier(.2,.4,.2,1);
            transition: .4s cubic-bezier(.2,.4,.2,1);
        }

            .homeBanner .search-panel .searchoptions .inputpanel.show {
                display: none;
                max-height: unset;
            }

.serachbyInput .form-control, .serachbyInput .btn {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 22px;
    padding: 8px 10px;
    border: 0;
    border-radius: 6px;
    height: 40px;
    margin: 0;
    box-shadow: none;
}

.serachbyInput .form-control {
    width: 100%;
    color: #522e91;
}

    .serachbyInput .form-control:focus {
        box-shadow: 0 2px 16px 0 rgb(0 0 0 / 20%);
    }

.serachbyInput .btn {
    color: #ffffff;
    background: linear-gradient(0deg, #000D75 0%, #001CFF 100%);
}

    .serachbyInput .btn:hover {
        opacity: 0.8;
    }

    .serachbyInput .btn:focus {
        outline: 0;
    }

.selectpicker {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    padding-right: 28px !important;
    background-image: url('../images/down-arrow-navi.png');
    background-image: url('../images/down-arrow-navi.svg');
    background-repeat: no-repeat;
    background-size: 12px;
    background-position: center right 10px;
}

.serachbyInput.bySupplier .form-inline {
    justify-content: flex-start;
    flex-wrap: nowrap;
}

    .serachbyInput.bySupplier .form-inline .form-group {
        width: 100%;
        margin: 0;
    }

.homepage-strapline { /* background-color: #f37421; */
    background-color: #f37421;
    border-top: 2px solid #ffffff;
    text-align: center;
    padding: 5px;
}

.content .homepage-strapline h3 {
    color: #ffffff;
    font-weight: 400;
}

/*.selectpicker { width: 100%; height: 38px; padding: 6px 12px; color: #555; font-family: "Arial", sans-serif; font-size: 16px; border: 0; }*/

/*---- Breadcrums CSS -----*/
.page_breadcrumb {
    background-color: #C3C3C3;
    z-index: 99;
    position: absolute;
    width: 100%;
    top: 60px;
}

.breadcrumb {
    background-color: transparent;
    margin-bottom: 0;
}

    .breadcrumb > li, .breadcrumb > li a {
        font-family: "Open-sans", sans-serif;
        color: #777;
    }

        .breadcrumb > li.active {
            font-weight: 500;
            color: #522e91;
        }

        .breadcrumb > li + li:before {
            color: #777;
        }

.homebtn {
    position: absolute;
    top: 75px;
    left: 0px;
    z-index: 1;
}

    .homebtn a {
        color: #fff;
        padding: 10px 16px;
        text-transform: uppercase;
        width: 69px;
    }

/*---- Banner CSS ----*/
.pageBanner.withBgImage {
    padding: 0px 0px 14px;
    background-image: url('../images/page-banner.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.pageBanner.withColor {
    padding: 90px 0px 80px;
    background-image: url('../images/home-banner.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top -30px;
    min-height: 390px;
}

    .pageBanner.withColor .container {
        padding-top: 70px;
    }

    .pageBanner.withColor .pageBanner_text h1 {
        color: #fff;
        margin-top: 60px;
    }

/*.pageBanner { margin: 0 0 30px; }*/
.pageBanner .row {
    margin: 0;
}

.page_heading {
    padding: 30px 0 20px;
    border-bottom: 1px solid #522e91;
}

    .page_heading > div {
        padding: 0;
    }

    .page_heading h5 {
        margin: 0 0 10px;
    }

        .page_heading h5 a {
            color: #522e91;
            font-size: 16px;
            font-weight: 400;
            letter-spacing: 0;
            line-height: 22px;
        }

    .page_heading h2 {
        color: #522e91;
        font-size: 24px;
        letter-spacing: 0;
        line-height: 42px;
        margin: 0;
    }

        .page_heading h2 strong {
            font-weight: 600;
        }

        .page_heading h2 .searchResult {
            float: none;
            display: block;
            font-size: 16px;
            font-weight: 400;
            letter-spacing: 0;
            line-height: 22px;
            margin: 0;
        }

            .page_heading h2 .searchResult data {
                font-weight: 600;
            }

.banner_Logo {
    position: relative;
    text-align: right;
}

    .banner_Logo a {
        display: inline-block;
        width: 65px;
        height: 90px;
        background-image: url('../images/SC_22yr_logo.png'); /*background-image: url('../images/logo.svg');*/
        background-repeat: no-repeat;
        background-size: 82%;
        background-position: center;
    }

.listViewbtnSC5.active {
    background-image: url('../images/swtchview-2.png');
    background-repeat: no-repeat;
    background-size: 69px;
    background-position: -40px center;
    cursor: auto;
}

.gridViewbtnSC5.active {
    background-image: url('../images/swtchview-1.png');
    background-repeat: no-repeat;
    background-size: 69px;
    background-position: -40px center;
    right: 0px;
    cursor: auto;
}

.listViewbtnSC5 {
    background-image: url('../images/swtchview-2.png');
    background-repeat: no-repeat;
    background-size: 69px;
    background-position: 0px center;
    cursor: pointer;
}

.gridViewbtnSC5 {
    background-image: url('../images/swtchview-1.png');
    background-repeat: no-repeat;
    background-size: 69px;
    background-position: 0px center;
    right: 0px;
    cursor: pointer;
}

.listSwitchview {
    padding: 0;
    margin: 0;
    list-style: none;
}

    .listSwitchview li {
        display: inline-block;
        vertical-align: middle;
        position: relative;
    }

        .listSwitchview li .listviewbtn {
            display: block;
            padding: 5px;
            cursor: pointer;
            width: 32px;
            height: 32px;
        }

        .listSwitchview li:last-child .listviewbtn {
            padding-right: 0;
        }

        .listSwitchview li .listviewbtn i {
            font-size: 24px;
            color: #522e91;
            line-height: 24px;
        }

        .listSwitchview li .listviewbtn.active i {
            color: #f37421;
        }

        .listSwitchview li .cusTooltip {
            display: block;
            opacity: 0;
            position: absolute;
            bottom: 100%;
            left: 50%;
            z-index: 10;
            background-color: #522e91;
            padding: 0.5em;
            color: #ffffff;
            font-size: 12px;
            border-radius: 4px;
            white-space: nowrap;
            -webkit-transform-origin: top;
            transform-origin: top;
            -webkit-transform: translate(-50%, 25%);
            transform: translate(-50%, 25%);
            transition: all 0.18s ease-out 0.18s;
        }

        .listSwitchview li:hover .cusTooltip {
            opacity: 1;
            -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
        }

        .listSwitchview li .cusTooltip:after {
            content: '';
            width: 0;
            height: 0;
            position: absolute;
            bottom: -6px;
            left: 50%;
            margin-left: -6px;
            border-style: solid;
            border-width: 6px 6px 0 6px;
            border-color: #522e91 transparent transparent transparent;
        }

.cusTooltip {
    display: none;
    background-color: #522e91;
    padding: 0.5em 1em;
    position: absolute;
    bottom: 100%;
    left: 50%;
    white-space: nowrap;
    z-index: 10;
    color: #ffffff;
    font-size: 12px;
    border-radius: 4px;
    -webkit-transform-origin: top;
    transform-origin: top;
    -webkit-transform: translate(-50%, -30%);
    transform: translate(-50%, -30%);
    transition: all 0.18s ease-out 0.18s;
}

    .cusTooltip:after {
        content: '';
        width: 0;
        height: 0;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-top: 6px solid #522e91;
        position: absolute;
        bottom: -6px;
        left: 50%;
        margin-left: -6px;
    }

.filterbyText {
    color: #522e91;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 36px;
}

    .filterbyText i {
        margin-right: 5px;
    }

.filter-list-items-block {
    position: relative;
}

    .filter-list-items-block span.rightArrow {
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 50px;
        height: 30px;
        background: linear-gradient(90deg, rgba(255,255,255,0) 0%, #FFFFFF 100%);
        text-align: right;
        padding: 5px;
    }

        .filter-list-items-block span.rightArrow i {
            font-size: 18px;
            line-height: 20px;
        }
/*.filter-list { display: flex; justify-content: space-between; margin-top: 15px; }*/
.filter-list > div {
    margin-top: 15px;
}

ul.filter-list-items {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    min-height: 38px;
    overflow: hidden;
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

    ul.filter-list-items::-webkit-scrollbar {
        display: none;
    }

    ul.filter-list-items li {
        margin-right: 8px;
    }

        ul.filter-list-items li:last-child {
            margin-right: 0;
        }

        ul.filter-list-items li span {
            color: #522e91;
            font-size: 15px;
            font-weight: 400;
            letter-spacing: 0;
            line-height: 30px;
            padding: 5px 11px;
            border-radius: 6px;
            background-color: #EEEEEE;
            cursor: pointer;
            white-space: nowrap;
        }

            ul.filter-list-items li span:hover {
                background-color: #522e91;
                color: #ffffff;
            }

        ul.filter-list-items li.active span {
            position: relative;
            background-color: #522e91;
            color: #ffffff;
        }

            ul.filter-list-items li.active span:after {
                content: '';
                width: 0;
                height: 0;
                position: absolute;
                bottom: -6px;
                left: 50%;
                margin-left: -6px;
                border-style: solid;
                border-width: 6px 6px 0 6px;
                border-color: #522e91 transparent transparent transparent;
            }

        ul.filter-list-items li.filter-label label {
            position: relative;
        }

            ul.filter-list-items li.filter-label label input {
                position: absolute;
                top: 0;
                left: 0;
                opacity: 0;
                z-index: 0;
            }

            ul.filter-list-items li.filter-label label [type="checkbox"]:checked + span {
                background-color: #522e91 !important;
                color: #ffffff;
            }

    ul.filter-list-items.colored-filter-list {
        justify-content: flex-start;
        align-items: center;
        overflow: visible;
    }

        ul.filter-list-items.colored-filter-list li {
            padding: 10px 0;
        }

            ul.filter-list-items.colored-filter-list li label {
                position: relative;
                margin: 0;
            }

                ul.filter-list-items.colored-filter-list li label .cusTooltip {
                    display: none;
                    background-color: #522e91;
                    padding: 0.5em 1em;
                    position: absolute;
                    bottom: 25%;
                    left: 50%;
                    white-space: nowrap;
                    z-index: 10;
                    color: #ffffff;
                    font-size: 14px;
                    line-height: 21px;
                    text-align: center;
                    border-radius: 4px;
                    -webkit-transform-origin: top;
                    transform-origin: top;
                    -webkit-transform: translate(-50%, -30%);
                    transform: translate(-50%, -30%);
                    transition: all 0.18s ease-out 0.18s;
                }

                ul.filter-list-items.colored-filter-list li label:hover .cusTooltip {
                    display: block;
                }

            ul.filter-list-items.colored-filter-list li span.filterlisttabs {
                background-color: transparent;
                padding: 0;
                font-weight: 500;
                font-size: 16px;
                color: #522e91;
                line-height: 1.42857143;
                display: inline-block;
                vertical-align: middle;
            }

                ul.filter-list-items.colored-filter-list li span.filterlisttabs:hover {
                    opacity: 0.8;
                }

            ul.filter-list-items.colored-filter-list li span.dhpricing {
                color: #f37421;
                font-size: 20px;
                margin: 0 3px;
                background-color: transparent;
                padding: 0;
                font-weight: 500;
                line-height: 1.42857143;
                display: inline-block;
                vertical-align: middle;
            }

                ul.filter-list-items.colored-filter-list li span.dhpricing i.dh-dhpricing {
                    display: block;
                    width: 20px;
                    height: 20px;
                    background-image: url('../images/DHIcon-orange.png');
                    background-image: url('../images/DHIcon-orange.svg');
                    background-repeat: no-repeat;
                    background-size: 22px;
                    background-position: center;
                }

            ul.filter-list-items.colored-filter-list li.filter-label label [type="checkbox"]:checked + span {
                background-color: transparent !important;
                color: #f37421;
            }

.clear-filter-block ul.filter-list-items li span i {
    margin-left: 5px;
}

.filters-panel {
    height: 0;
    overflow: hidden;
}

    .filters-panel.show {
        height: auto;
        padding: 0 0 30px;
        box-shadow: 0 15px 15px 0 rgb(0 0 0 / 10%);
        -webkit-transition: .4s cubic-bezier(.2,.4,.2,1);
        -moz-transition: .4s cubic-bezier(.2,.4,.2,1);
        -ms-transition: .4s cubic-bezier(.2,.4,.2,1);
        -o-transition: .4s cubic-bezier(.2,.4,.2,1);
        transition: .4s cubic-bezier(.2,.4,.2,1);
    }

.filter-lists ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
}

    .filter-lists ul li {
        padding: 0;
        margin: 0 0 10px;
        list-style: none;
        width: 100%;
    }

        .filter-lists ul li .checkbox {
            margin: 0;
        }

            .filter-lists ul li .checkbox label {
                position: relative;
                color: #522e91;
                font-size: 16px;
                font-weight: 400;
                letter-spacing: 0;
                line-height: 20px;
                padding: 0;
            }

                .filter-lists ul li .checkbox label input[type=checkbox] {
                    top: 5px;
                    left: 5px;
                    margin: 0;
                    opacity: 0;
                }

                .filter-lists ul li .checkbox label .cr {
                    background-color: #C1C1C1;
                    border: 1px solid #c5c5c5;
                    border-radius: 4px;
                    padding: 5px;
                    margin: 0 10px 0 0;
                    transition: all .5s;
                }

                    .filter-lists ul li .checkbox label .cr > .cr-icon {
                        display: block;
                        width: 8px;
                        height: 8px;
                        background-color: #ffffff;
                        border-radius: 4px;
                        margin: 0;
                        transition: all .5s;
                        opacity: 0;
                    }

                .filter-lists ul li .checkbox label input[type="checkbox"]:checked + .cr {
                    background-color: #522e91 !important;
                }

                    .filter-lists ul li .checkbox label input[type="checkbox"]:checked + .cr > .cr-icon {
                        opacity: 1;
                    }

                    .filter-lists ul li .checkbox label input[type="checkbox"]:checked + .cr + data {
                        display: inline-block;
                        font-weight: 600;
                    }

                .filter-lists ul li .checkbox label .bg-colorimage {
                    border: 0;
                    background-image: url('../images/multi-color-image.jpg');
                    background-repeat: no-repeat;
                    background-size: 100%;
                    background-position: center;
                }

.closeFilter-panel .closeFilter {
    color: #522e91;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 22px;
    text-align: center;
}

    .closeFilter-panel .closeFilter:hover {
        background-color: #522e91;
        color: #ffffff;
    }

.closeFilter-top {
    padding: 0 0 20px;
}

    .closeFilter-top .closeFilter i {
        font-size: 24px;
    }

.closeFilter-bottom {
    padding: 20px 0 0;
}

    .closeFilter-bottom .closeFilter {
        min-width: 110px;
        border: 1px solid #522e91;
    }

ul.leftmenu {
    padding: 0;
    margin: 0;
}

    ul.leftmenu li {
        list-style: none;
    }

        ul.leftmenu li a {
            color: #fff;
            padding: 10px 12px;
            width: 100%;
            float: left;
            cursor: pointer;
        }

            ul.leftmenu li a:hover, ul.leftmenu li a:focus {
                background-color: #f37421;
                text-decoration: none;
            }

.cartCheckout {
    width: 100%;
    margin-bottom: 20px;
}

.pushProductToPO {
    width: 100%;
    margin-bottom: 20px;
}

    .pushProductToPO .btn {
        width: 100%;
        border-radius: 0;
        color: #fff;
        font-size: 16px;
    }

.cartCheckout .btn {
    width: 100%;
    border-radius: 0;
    color: #fff;
    font-size: 16px;
}

ul.searchList.listView li {
    float: left;
    width: 100%;
}

.searchList.listView {
    display: none;
    margin-bottom: 40px;
}

.searchList.gridView li {
    width: 156px;
    float: left;
}

    .searchList.gridView li h3 {
        font-size: 17px;
    }

.searchList.gridView .searchbyBox {
    padding: 10px;
    float: none;
    clear: both;
}

.searchList.gridView .serachbyIcon {
    position: relative;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    padding: 24px 22px;
    cursor: pointer;
    margin: 0 auto;
}

.searchList.gridView .bgNavi {
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}

.date [class^="icon-"], .date [class*=" icon-"] {
    font-size: 22px;
    color: #fff;
}

.active .arrow-down {
    width: 0;
    height: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-top: 12px solid #fff;
    position: absolute;
    bottom: -32px;
    left: 40px;
}

.gridView .active .arrow-down {
    bottom: -192px;
}

#cboxOverlay {
    background: #333333;
    opacity: 0.83;
    height: 100%;
    width: 100%;
}

#cboxOverlay {
    position: fixed;
    opacity: 0;
    cursor: auto;
    visibility: hidden;
    top: 0;
    transition: 2s;
}

    #cboxOverlay.openlay {
        position: fixed;
        opacity: 0.85;
        cursor: pointer;
        visibility: visible;
        display: block;
        -webkit-transition: 0.5s;
        -moz-transition: 0.5s;
        -o-transition: 0.5s;
        transition: 0.5s;
    }

#colorbox {
    padding: 0 0 40px 0;
    background: #fff;
    visibility: visible;
    z-index: 99999;
    padding: 20px;
    border-radius: 20px;
}

#colorbox {
    visibility: hidden;
    top: 390px;
    left: 32%;
    position: absolute;
    width: 40%;
    height: 350px;
    opacity: 0;
    cursor: auto;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
}

    #colorbox.openbox {
        visibility: visible;
        top: 10%;
        left: 32%;
        position: absolute;
        width: 40%;
        height: 350px;
        opacity: 1;
        cursor: auto;
        -webkit-transition: 0.4s;
        -moz-transition: 0.4s;
        -o-transition: 0.4s;
        transition: 0.4s;
    }

.forgetPassword input[type="email"] {
    border-radius: 0;
    text-indent: 0;
    position: relative;
    background-color: #c9c9c9;
    font-size: 19px;
    height: 54px;
    width: 100%;
    border: 1px solid #c9c9c9;
    box-sizing: border-box;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    margin-bottom: 20px;
}

.forgetPassword .btn {
    width: 185px;
    height: 50px;
    color: #fff;
    font-size: 18px;
    line-height: 36px;
}

.forgetPassword p {
    margin-bottom: 20px;
}

#cboxWrapper {
    position: relative;
}

.closebtn {
    position: absolute;
    top: -35px;
    right: 0px;
    cursor: pointer;
    z-index: 100000;
    content: '';
    background-image: url('../images/close-gray.png');
    background-image: url('../images/close-gray.svg');
    background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;
    width: 25px;
    height: 25px;
}
/*.closeLogin { top: 10px; right: 10px; }*/


/*.content { padding: 0px 0px 40px 0px; }*/
.content h1, .content h2, .content h3, .content h4, .content h5, .content h6 {
    color: #522e91;
    font-weight: 400;
    margin-top: 0;
}

/*---- Partners CSS ---*/
.partners-flash {
    padding: 50px 0px;
}

    .partners-flash ul {
        margin: 0;
        padding: 0;
        list-style: none;
        margin-left: -10px;
        margin-right: -10px;
    }

        .partners-flash ul li {
            width: 100%;
            padding: 10px;
        }

.homepage-categories {
    background: linear-gradient(180deg, #E4E4E4 0%, #FFFFFF 100%);
}

    .homepage-categories .category-products-list {
        border-top: 0;
        padding-top: 40px;
    }

        .homepage-categories .category-products-list h3 {
            text-align: center;
            font-weight: 500;
        }

        .homepage-categories .category-products-list ul li .image-block {
            padding: 0;
        }

        .homepage-categories .category-products-list ul li .info-block {
            text-align: center;
        }

/*---- Home page bottom banners CSS ---*/
.homepage-bottom-banners {
    display: none;
    padding: 40px 0 10px; /*background: linear-gradient(180deg, #E4E4E4 0%, #FFFFFF 100%);*/
}

#home .homepage-bottom-banners {
    display: block;
}

.homepage-bottom-banners .banner-item {
    position: relative;
    border-radius: 6px;
    margin-bottom: 30px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center right;
}

    .homepage-bottom-banners .banner-item h4 {
        color: #FFFFFF;
        font-size: 23px;
        font-weight: 400;
        letter-spacing: 0;
        line-height: 30px;
        margin: 0 0 5px;
    }

    .homepage-bottom-banners .banner-item p {
        color: #FFFFFF;
        font-size: 14px;
        font-weight: 400;
        letter-spacing: 0;
        line-height: 20px;
        min-height: 40px;
    }

    .homepage-bottom-banners .banner-item .btn {
        position: absolute;
        left: 20px;
        bottom: 20px;
        color: #FFFFFF;
        font-size: 14px;
        font-weight: 400;
        letter-spacing: 0;
        line-height: 22px;
        text-align: center;
        padding: 4px 15px;
    }

    .homepage-bottom-banners .banner-item > div {
        padding: 20px 20px 60px;
        border-radius: 6px;
    }

    .homepage-bottom-banners .banner-item.bg1 {
        background-image: url('../images/home-footer-banner-1.jpg');
    }

    .homepage-bottom-banners .banner-item.bg2 {
        background-image: url('../images/home-footer-banner-2.jpg');
    }

    .homepage-bottom-banners .banner-item.bg3 {
        background-image: url('../images/home-footer-banner-3.jpg');
    }

    .homepage-bottom-banners .banner-item.bg4 {
        background-image: url('../images/home-footer-banner-4.jpg');
    }

    .homepage-bottom-banners .banner-item.bg1 .bg-overlay {
        background: linear-gradient(270deg, rgba(0,10,0,30%) 0%, #B5015C 100%);
    }

    .homepage-bottom-banners .banner-item.bg2 .bg-overlay {
        background: linear-gradient(270deg, rgba(0,0,0,30%) 0%, #31A400 100%);
    }

    .homepage-bottom-banners .banner-item.bg3 .bg-overlay {
        background: linear-gradient(0deg, rgba(0,14,58,10%) 0%, #522e91 100%);
    }

    .homepage-bottom-banners .banner-item.bg4 .bg-overlay {
        background: linear-gradient(270deg, rgba(0,10,0,30%) 0%, #B5015C 100%);
    }


/*.bg1 { background: linear-gradient(270deg, rgba(181,1,92,0) 0%, #B5015C 100%); }
.bg2 { background: linear-gradient(270deg, rgba(28,94,0,0) 0%, #31A400 100%); }
.bg3 { background: linear-gradient(0deg, rgba(0,14,58,0) 0%, #522e91 100%); }*/

ul.inline-lists {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

    ul.inline-lists li {
        margin-right: 15px;
    }

.aisearch-button .btn {
    width: 165px;
    padding: 0;
    margin: 20px 0;
}
.aisearch-button .btn img {
    width: 100%;
}
.dh-product-counter-panel {
    /* background-color: #f37421;
    border: 2px solid #ffffff;
    border-radius: 10px;
    overflow: hidden;
    width: 165px;
    padding: 4px;
    margin: auto; */
    margin-top: 20px;
}

.dh-product-counter {
    background-color: #f37421;
    border: 2px solid #ffffff;
    border-radius: 10px;
    overflow: hidden;
    width: 165px;
    padding: 4px;
    margin: auto;
    font-size: 18px;
    color: #ffffff;
    font-weight: 500;
    line-height: 19px;
    text-align: center;
    cursor: pointer;
}

    .dh-product-counter img {
        width: 150px;
        display: block;
        margin: -4px auto -5px;
    }

.dh-product-counter-table {
    width: 100%;
    background-color: #522e91;
    border: 1px solid #522e91;
    margin-bottom: 20px;
    table-layout: fixed;
}

    .dh-product-counter-table tr td {
        border: 2px solid #522e91;
        border-collapse: collapse;
        font-size: 12px;
        color: #fff;
        white-space: nowrap;
        text-align: center;
        padding: 0 4px;
    }

        .dh-product-counter-table tr td.dh-count {
            background-color: #ffffff;
            font-size: 14px;
            color: #333;
            font-weight: 600;
        }

.modal-dh-product-counter .modal-lg {
    width: 650px;
}

.modal-dh-product-counter .dh-product-counter-table {
    margin: 0;
}

    .modal-dh-product-counter .dh-product-counter-table tr td {
        font-size: 14px;
    }

        .modal-dh-product-counter .dh-product-counter-table tr td.dh-count {
            font-size: 22px;
        }

.modal-dh-product-counter .btn.width-arrow {
    position: relative;
    margin-left: -30px !important;
}

    .modal-dh-product-counter .btn.width-arrow:after {
        content: '';
        display: block;
        width: 50px;
        height: 40px;
        position: absolute;
        top: 0;
        bottom: 0;
        right: -50px;
        background-image: url('../images/right-arrow-purple.png');
        background-repeat: no-repeat;
        background-size: 40px;
        background-position: center right 3px;
    }


/*---- Panels CSS ----*/
#panels {
    padding: 60px 0px;
}

.panelBoxes ul {
    padding: 0;
}

    .panelBoxes ul li {
        list-style: none;
        padding: 0;
        background-color: #fff;
        width: 32%;
        float: left;
        margin: 0 2%;
        font-family: 'Open-sans', sans-serif;
        min-height: 395px;
    }

        .panelBoxes ul li:nth-child(1n) {
            margin-left: 0;
        }

        .panelBoxes ul li:nth-child(3n) {
            margin-right: 0;
        }

        .panelBoxes ul li h5 {
            font-family: 'Open-sans', sans-serif;
            font-weight: 600;
            font-size: 16px;
            line-height: 22px;
            margin-bottom: 5px;
            padding: 0 22px;
            margin-top: 20px;
        }

        .panelBoxes ul li p {
            font-family: 'Open-sans', sans-serif;
            padding: 0 22px;
            font-size: 13px;
        }

.panelBoxes.homepage ul li {
    min-height: 220px;
}

/*---- footer CSS ------*/
.footer { /*padding: 0 0 40px;*/
    background-image: url('../images/mobile-bgfooter.png');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: bottom center;
    min-height: 600px;
}

.footer-upper {
    margin: 0;
    border-top: 1px solid #C5C5C5;
    padding-top: 30px;
}

.footer-head-text {
    margin-bottom: 30px;
}

    .footer-head-text h4 {
        color: #522e91;
        font-size: 24px;
        font-weight: 400;
        letter-spacing: 0;
        line-height: 42px;
        text-align: center;
    }

        .footer-head-text h4 span {
            display: block;
            font-size: 36px;
        }

.footer-middle {
    margin-bottom: 175px;
}

.footerLinks {
    display: flex;
    flex-wrap: wrap;
    position: relative;
}

.footerLinks_box {
    width: 50%;
    max-width: 200px;
    padding-right: 30px;
}

    .footerLinks_box h5 {
        color: #522e91;
        font-size: 14px;
        font-weight: 600;
        letter-spacing: 0;
        line-height: 24px;
        margin: 0 0 10px;
    }

    .footerLinks_box ul {
        padding: 0;
        margin: 0 0 20px;
        list-style: none;
    }

        .footerLinks_box ul li {
            padding: 2px 0;
            width: 100%;
        }

            .footerLinks_box ul li a {
                display: block;
                color: #522e91;
                font-size: 12px;
                letter-spacing: 0;
                line-height: 18px;
            }

.footSocial li {
    padding: 3px 0;
    margin-bottom: 2px;
}

    .footSocial li a {
        padding-left: 25px;
        position: relative;
    }

        .footSocial li a span {
            width: 20px;
            height: 20px;
            position: absolute;
            left: 0;
            top: -2px;
            background-repeat: no-repeat;
            background-size: 20px;
        }

            .footSocial li a span.facebook {
                background-image: url('../images/social.png');
                background-image: url('../images/social.svg');
                background-position: center -1px;
            }

            .footSocial li a span.twitter {
                background-image: url('../images/social.png');
                background-image: url('../images/social.svg');
                background-position: center center;
            }

            .footSocial li a span.linkedin {
                background-image: url('../images/social.png');
                background-image: url('../images/social.svg');
                background-position: center -45px;
            }

.footTopLogo {
    display: block;
    margin-bottom: 30px;
}

    .footTopLogo a {
        display: inline-block;
        background-image: url('../images/SC_22yr_logo.png'); /*background-image: url('../images/logo.svg');*/
        background-repeat: no-repeat;
        background-size: 100px;
        background-position: center center;
        width: 100px;
        height: 162px;
    }

.footLogo {
    display: none;
    position: absolute;
    right: 0;
    background-image: url('../images/SC_22yr_logo.png'); /*background-image: url('../images/logo.svg');*/
    background-repeat: no-repeat;
    background-size: 100px;
    background-position: center center;
    width: 100px;
    height: 162px;
}

    .footLogo a {
        display: block;
    }

.footer-bottom p {
    color: #522e91;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 18px;
}

.footer-bottom .footer-logos {
    text-align: right;
}

    .footer-bottom .footer-logos img {
        display: inline-block;
        vertical-align: middle;
        margin: 0 0 10px;
    }

/*---- Date picker ----*/
.datepicker table tr th.prev, .datepicker table tr th.next {
    background-color: #522e91;
    color: #fff;
    font-size: 28px;
    line-height: 12px;
    padding: 9px;
    vertical-align: middle;
}

.datepicker thead tr:first-child th:hover, .datepicker tfoot tr th:hover {
    background: #522e91 !important;
}

.datepicker table tr th.prev:hover, .datepicker table tr th.next:hover {
    background: #522e91;
    opacity: 1;
}

.datepicker table tr td.active:hover, .datepicker table tr td.active:hover:hover, .datepicker table tr td.active.disabled:hover, .datepicker table tr td.active.disabled:hover:hover, .datepicker table tr td.active:focus, .datepicker table tr td.active:hover:focus, .datepicker table tr td.active.disabled:focus, .datepicker table tr td.active.disabled:hover:focus, .datepicker table tr td.active:active, .datepicker table tr td.active:hover:active, .datepicker table tr td.active.disabled:active, .datepicker table tr td.active.disabled:hover:active, .datepicker table tr td.active.active, .datepicker table tr td.active:hover.active, .datepicker table tr td.active.disabled.active, .datepicker table tr td.active.disabled:hover.active, .open .dropdown-toggle.datepicker table tr td.active, .open .dropdown-toggle.datepicker table tr td.active:hover, .open .dropdown-toggle.datepicker table tr td.active.disabled, .open .dropdown-toggle.datepicker table tr td.active.disabled:hover {
    background: rgba(254, 71, 1, 1) !important;
}

.datepicker table tr td span.active:hover, .datepicker table tr td span.active:hover:hover, .datepicker table tr td span.active.disabled:hover, .datepicker table tr td span.active.disabled:hover:hover, .datepicker table tr td span.active:focus, .datepicker table tr td span.active:hover:focus, .datepicker table tr td span.active.disabled:focus, .datepicker table tr td span.active.disabled:hover:focus, .datepicker table tr td span.active:active, .datepicker table tr td span.active:hover:active, .datepicker table tr td span.active.disabled:active, .datepicker table tr td span.active.disabled:hover:active, .datepicker table tr td span.active.active, .datepicker table tr td span.active:hover.active, .datepicker table tr td span.active.disabled.active, .datepicker table tr td span.active.disabled:hover.active, .open .dropdown-toggle.datepicker table tr td span.active, .open .dropdown-toggle.datepicker table tr td span.active:hover, .open .dropdown-toggle.datepicker table tr td span.active.disabled, .open .dropdown-toggle.datepicker table tr td span.active.disabled:hover {
    background-color: rgba(254, 71, 1, 1) !important;
}

/*------ details page CSS ------*/
.detailspage {
}

.product-image {
    position: relative;
    overflow: hidden;
    border-radius: 6px;
    margin-bottom: 30px;
    border: 1px solid #e1e1e1;
}

    .product-image img {
        width: 100%;
        max-width: 100%;
    }

.imagetag {
    position: absolute;
}

.detailspage .product-image .imagerap {
    position: inherit;
}

.product-info {
}

    .product-info h1 {
        color: #522e91;
        font-size: 24px;
        font-weight: 500;
        letter-spacing: 0;
        line-height: 30px;
        margin: 0 0 10px;
    }

    .product-info h3 {
        color: #522e91;
        font-size: 18px;
        font-weight: 500;
        letter-spacing: 0;
        line-height: 22px;
        margin-top: 15px;
    }

    .product-info p {
        color: #522e91;
        font-size: 16px;
        font-weight: 400;
        letter-spacing: 0;
        line-height: 22px;
        margin: 0 0 15px;
    }

    .full-description {
        margin: 0 0 15px;
    }
    .product-info p.longdescription {
         display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        position: relative;
        margin: 0;
    }
    .product-info .toggle-readmore {
        font-size: 16px;
        font-weight: normal;
        line-height: 1.5;
        letter-spacing: normal;
        color: #f37421;
        text-transform: uppercase;
        white-space: nowrap;
        cursor: pointer;
    }
    .product-info p.longdescription.expanded {
        display: block;
    }

    .product-info ul {
        padding: 0;
        margin: 0;
        list-style: none; /* margin: 15px 0; */
        margin: 5px 0;
    }

        .product-info ul li {
            color: #522e91;
            font-size: 14px;
            font-weight: 400;
            letter-spacing: 0;
            line-height: 20px;
            margin-bottom: 5px;
        }

            .product-info ul li strong {
                font-weight: 600;
            }

        .product-info ul.inline-lists {
            display: flex;
            flex-wrap: wrap;
            justify-content: flex-start;
            align-items: center;
        }

            .product-info ul.inline-lists li {
                margin: 0 15px 0 0;
            }
            .product-info ul.inline-lists li.item-type a {
                display: inline;
                padding: 0;
                border: 0;
                border-radius: 0;
                font-weight: 600;
            }
                .product-info ul.inline-lists li .currentstock-label {
                    position: relative;
                    display: inline-block;
                    vertical-align: middle;
                    width: 40px;
                    height: 40px;
                    padding: 0;
                    margin: 0 5px 0 0;
                    background-color: #DFDFDF;
                    border: 0;
                    border-radius: 6px;
                    background-image: url('../images/icon_stock.png');
                    background-image: url('../images/icon_stock.svg');
                    background-repeat: no-repeat;
                    background-size: 40px;
                    background-position: center;
                }

                    .product-info ul.inline-lists li .currentstock-label:hover .cusTooltip {
                        display: block;
                    }

                .product-info ul.inline-lists li .lastupdated-label {
                    position: relative;
                    display: inline-block;
                    vertical-align: middle;
                    width: 40px;
                    height: 40px;
                    padding: 0;
                    margin: 5px;
                    background-color: #DFDFDF;
                    border: 0;
                    border-radius: 6px;
                    background-image: url('../images/icon_weekly.png');
                    background-image: url('../images/icon_weekly.svg');
                    background-repeat: no-repeat;
                    background-size: 40px;
                    background-position: center;
                }

                    .product-info ul.inline-lists li .lastupdated-label:hover .cusTooltip {
                        display: block;
                    }

            .product-info ul.inline-lists.data-ratings {
                margin: 0 0 10px;
            }

ul.item-types li a {
    display: block;
    color: #522e91;
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 22px;
    padding: 0 8px;
    border: 1px solid #522e91;
    border-radius: 4px;
}

    ul.item-types li a:hover {
        background-color: #522e91;
        color: #ffffff;
        text-decoration: none;
    }

.product-info .real-time-price button {
    width: auto;
    height: auto;
    white-space: normal;
    padding: 10px 15px;
    font-size: 13px;
    font-weight: 300;
    line-height: 19px;
    color: #ffffff;
    margin-right: 5px;
    margin-bottom: 10px;
}

.product-info .eco-credentials ul.inline-lists {
    align-items: flex-start;
}

.product-info .icons-lists .buttons .btn {
    color: #ffffff;
    padding: 9px 12px;
    margin: 5px;
    font-weight: 300;
}

    .product-info .icons-lists .buttons .btn:hover {
        opacity: 0.7;
    }

    .product-info .icons-lists .buttons .btn:focus {
        outline: 0;
    }

.product-info .supplier-info, .product-info .eco-credentials, .product-info .eco-accreditation {
    border-top: 1px solid #C5C5C5;
    margin-bottom: 20px;
}

.eco-credentials {    
    /* border-bottom: 1px solid #522e91;
    padding-bottom: 15px; */
    margin-top: 15px;
    margin-bottom: 0;
}

.eco-credentials ul.inline-lists li, .eco-accreditation ul.inline-lists li {
    margin: 0 12px 15px 0;
}

    .eco-accreditation ul.inline-lists li:last-child {
        margin-right: 0;
    }

.eco-credentials ul li {
    text-align: center;
}

    .eco-credentials ul li span {
        display: block;
        width: 80px;
        height: 80px;
        background-color: #DFDFDF;
        border-radius: 6px;
        overflow: hidden;
    }

        .eco-credentials ul li span svg {
            width: 80px;
            height: 80px;
        }

        .eco-credentials ul li span image {
            width: 80px;
            height: 80px;
            display: block;
            max-width: 100%;
            max-height: 100%;
        }

    .eco-credentials ul li label {
        margin: 5px 0;
        width: 80px;
        font-size: 12px;
    }

.eco-accreditation ul li {
    text-align: center;
}

    .eco-accreditation ul li span {
        display: block;
        width: 100px;
        height: 100px;
        border-radius: 6px;
        overflow: hidden;
    }

        .eco-accreditation ul li span svg {
            width: 100px;
            height: 100px;
        }

        .eco-accreditation ul li span img {
            width: 100px;
            height: 100px;
            display: block;
            max-width: 100%;
            max-height: 100%;
        }

    .eco-accreditation ul li label {
        margin: 5px 0;
        width: 110px;
        font-size: 12px;
    }

/* .product-info .icons-lists { margin-bottom: 20px; } */
.product-info .icons-lists > div {
    margin: 10px 0;
}

.product-info .icons-list ul li {
    width: 40px;
    height: 40px;
    background-color: #DFDFDF;
    border: 0;
}

    .product-info .icons-list ul li i {
        font-size: 24px;
        line-height: 28px;
    }

.related-products {
    padding: 30px 0;
    border-top: 1px solid #C5C5C5;
    border-bottom: 0px solid #C5C5C5;
    margin: 30px 0;
}

    .related-products h3 {
        color: #522e91;
        font-size: 24px;
        font-weight: 500;
        letter-spacing: 0;
        line-height: 42px;
        margin-top: 0;
    }

    .related-products ul.listingPanel {
        margin-top: 0;
        margin-bottom: 0;
    }

.quickquote-panel, .smaplerequest-panel, .quickfeedback-panel {
    position: fixed;
    top: 0;
    right: 0;
    width: 450px;
    max-width: 100%;
    height: 100vh;
    overflow-y: auto;
    padding: 25px;
    background-color: #fff;
    box-shadow: 0 0 25px 0 rgb(0 0 0 / 20%);
    z-index: 1200;
    transform: translate3d(800px,0,0);
    transition: transform .3s;
}

.showQuickquote .quickquote-panel, .showSamplerequest .smaplerequest-panel, .showQuickfeedback .quickfeedback-panel {
    transform: translate3d(0,0,0);
}

.quickquote-panel .quickquoteclose span, .smaplerequest-panel .smaplerequestclose span, .quickfeedback-panel .quickfeedbackclose span {
    font-size: 24px;
    color: #522e91;
    padding: 5px;
    cursor: pointer;
}

.quickquote-panel h3, .smaplerequest-panel h3, .quickfeedback-panel h3 {
    font-size: 24px;
    color: #522e91;
    font-weight: 400;
    margin: 0 0 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #3F2B5F;
}

.quickquote-panel .form-control, .smaplerequest-panel .form-control, .quickfeedback-panel .form-control {
    height: 40px;
}

.quickquote-panel textarea.form-control, .smaplerequest-panel textarea.form-control, .quickfeedback-panel textarea.form-control {
    height: auto;
}

.quickquote-panel .btn, .smaplerequest-panel .btn, .quickfeedback-panel .btn {
    width: 100%;
    border-radius: 0;
    font-size: 18px;
    color: #ffffff;
    padding: 9px 12px;
}

    .quickquote-panel .btn:hover, .smaplerequest-panel .btn:hover, .quickfeedback-panel .btn:hover {
        opacity: 0.7;
    }

.detailspage .accordion h2 {
    width: 100%;
    float: left;
    background-color: #f37421;
    padding: 10px 20px;
    font-size: 18px;
    font-weight: 400;
    color: #ffffff;
    margin-bottom: 20px;
    cursor: pointer;
    padding-right: 30px;
    background-image: url('../images/plus.png');
    background-image: url('../images/plus.svg');
    background-repeat: no-repeat;
    background-size: 15px;
    background-position: center right 10px;
}

    .detailspage .accordion h2.active {
        background-image: url('../images/minus.png');
        background-image: url('../images/minus.svg');
    }

.detailspage .accordion .toggleContainer {
    border: 0;
    background-color: #ffffff;
    margin-bottom: 20px;
    padding: 0;
}

    .detailspage .accordion .toggleContainer .modal-body {
        padding: 0;
    }

.detailspage .accordion h2.bgLPurple {
    background-color: #522f91;
}


ul.supplier-info-list {
    list-style: none;
    padding: 0;
}

    ul.supplier-info-list li {
        padding: 10px;
        color: #522e91;
        font-weight: 500;
    }

        ul.supplier-info-list li strong {
            margin-left: 10px;
        }

.disclaimer {
    position: relative;
    color: #522e91;
    font-weight: 600;
    text-decoration: underline;
}

    .disclaimer:hover .cusTooltip {
        display: block;
        left: auto;
        right: 0;
        text-align: center;
        -webkit-transform: translate(0%, -20%);
        transform: translate(0%, -20%);
    }

    .disclaimer .cusTooltip:after {
        left: auto;
        right: 8px;
    }
.product-price-calculator .form-group {
    margin-bottom: 6px;
}
.product-price-calculator .form-group label {
    color: #522e91;
    line-height: 1.2;
}
.product-price-calculator .form-group .form-control {
    border-color: #522e91;
    color: #522e91;
}
.product-price-calculator .form-group .form-control::placeholder {
    color: #522e91;
}

.product-price-calculator .qty-inputs {
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
    justify-content: space-between;
}

.product-info .inline-buttons {
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
}

.product-info .button-lists > div {
    margin: 0;
}
.product-info .button-lists {
    text-align: left;
}
.product-info .button-lists .buttons .btn {
    color: #ffffff;
    padding: 9px 12px;
    margin: 5px;
    font-weight: 300;
}
.product-info .button-lists .buttons .btn:first-child {
    margin-left: 0;
}
.product-info .button-lists .buttons .btn:last-child {
    margin-right: 0;
}
.product-info .button-lists .buttons .btn:focus {
    outline: 0;
}
.product-info .button-lists .buttons .addtobasket {
    background-color: #001cff;
}
.product-info .button-lists .buttons .addtobasket:disabled {
    background-color: #001cff33;
}
.product-info .button-lists .buttons .addtopoquoteassitant {
    background-color: #0d0039;
}
.product-info .button-lists .buttons .addtopoquoteassitant:disabled {
    background-color: #0d003933;
}

/*-------- Listing Page CSS -----*/
/*#listing #site.page .overlay_wrapper { top: -10px; }*/
#leftSidebar {
    width: 250px;
    position: absolute;
    left: 0;
    z-index: 9;
}

.leftSidebar {
    margin-left: -217px;
    opacity: 1;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}

    .leftSidebar.opened {
        margin-left: 0px;
        opacity: 1;
        -webkit-transition: 0.5s;
        -moz-transition: 0.5s;
        -o-transition: 0.5s;
        transition: 0.5s;
    }

.switchLeftbar {
    position: relative;
}

    .switchLeftbar .switchbtn {
        position: absolute;
        width: 32px;
        height: 32px;
        top: 0;
        right: 0;
        padding: 6px;
        cursor: pointer;
        z-index: 100;
    }

        .switchLeftbar .switchbtn .fa:before {
            font-size: 20px;
        }

.leftSidebar.opened .switchLeftbar .switchbtn .fa:before {
    content: "\f010";
    font-size: 20px;
}

.switchLeftbar .switchbtn .icon-search-plus:before {
    font-size: 20px;
}

.leftSidebar.opened .switchLeftbar .switchbtn .icon-search-plus:before {
    font-size: 20px;
    content: "\e912";
}


.leftSidebar.opened .rotate {
    opacity: 0;
    display: none;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}

.rotate {
    text-transform: uppercase;
    color: #522e91;
    font-size: 15px;
    position: absolute;
    top: 96px;
    right: -64px;
    background-color: #ccc;
    padding: 6px 15px;
    letter-spacing: 1px;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
    -ms-transform: rotate(-90deg); /* IE 9 */
    -webkit-transform: rotate(-90deg); /* Chrome, Safari */
    -0-transform: rotate(-90deg); /* Opera */
    transform: rotate(-90deg);
}

.leftSidebar_panel {
    width: 100%;
    float: left;
    background: #eeeeee;
    opacity: 0;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}

.leftSidebar.opened .leftSidebar_panel {
    opacity: 1;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}

.leftSidebar .boxes {
    background-color: #eee;
    width: 100%;
    float: left;
    padding: 0px 15px;
}

hr.withBorderd {
    border-bottom: 0px dotted #522e91;
    width: 89%;
    margin: 10px auto 0px;
    float: left;
}

.leftSidebar .yourSelection.boxes {
    background-color: #dedede;
}

.leftSidebar h3 {
    border-bottom: 1px dotted #522e91;
    text-transform: uppercase;
    color: #522e91;
    font-size: 18px;
    margin: 10px 0px 10px;
    padding: 0px 0px 5px;
    letter-spacing: 1px;
}

.leftSidebar .selectpicker {
    width: 100%;
    height: 30px;
    padding: 2px 4px;
    color: #555;
    font-family: "Arial", sans-serif;
    font-size: 12px;
    border: 0;
}

.leftSidebar .selectbox {
    padding: 10px 0px;
}

.leftSidebar_panel .boxes ul {
    max-height: 115px;
    overflow-y: auto;
}

.customBtn {
    position: relative;
    background-color: transparent;
    border: 0;
    padding: 0px 2px 11px;
    font-size: 13px;
    color: #522e91;
    width: 100%;
    text-align: left;
    text-transform: uppercase;
    border-bottom: 1px dotted #522e91;
    border-radius: 0;
}

    .customBtn:focus, .customBtn:hover {
        outline: 0;
        color: #522e91;
    }

    .customBtn:active:focus, .customBtn:focus, .customBtn:hover {
        outline: 0;
        color: #522e91;
        box-shadow: none;
    }

.leftSidebar_panel::-webkit-scrollbar {
    width: 6px;
}

.leftSidebar_panel::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 3px #8981A7;
    border-radius: 0px;
    background-color: #8981A7;
}

.leftSidebar_panel::-webkit-scrollbar-thumb {
    border-radius: 3px;
    -webkit-box-shadow: inset 0 0 3px #522e91;
    background-color: rgba(13, 0, 56, 0.6);
}


.customBtn:after {
    content: '';
    position: absolute;
    right: 2px;
    width: 18px;
    height: 18px;
    background-image: url('../images/down-arrow-navi.png');
    background-image: url('../images/down-arrow-navi.svg');
    background-repeat: no-repeat;
    background-size: 16px;
    background-position: center;
    -webkit-transition: 1.2s;
    -moz-transition: 1.2s;
    -o-transition: 1.2s;
    transition: 1.2s;
    transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
}

.customBtn.collapsed:after {
    -webkit-transition: 1.2s;
    -moz-transition: 1.2s;
    -o-transition: 1.2s;
    transition: 1.2s;
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
}

.checkboxStylebig {
    position: relative;
}

    .checkboxStylebig input {
        margin-right: 10px;
    }

    .checkboxStylebig label span {
        cursor: pointer;
        position: absolute;
        width: 18px;
        height: 18px;
        left: 0px;
        top: 4px;
        background-color: #522e91;
    }

        .checkboxStylebig label span.active {
            background-color: #522e91;
            background-image: url('../images/close.png');
            background-image: url('../images/close.svg');
            background-repeat: no-repeat;
            background-size: 14px;
            background-position: center;
        }

ul.colorsCheck li {
    width: 32px !important;
    height: 30px;
    float: left;
}

ul.colorsCheck .checkboxStyle {
    position: relative;
}

    ul.colorsCheck .checkboxStyle input {
        margin-right: 6px;
    }

    ul.colorsCheck .checkboxStyle label span {
        cursor: pointer;
        position: absolute;
        width: 26px;
        height: 26px;
        left: 0px;
        top: 4px;
        border: 1px solid #bbbbbb;
    }

        ul.colorsCheck .checkboxStyle label span.active {
            background-image: url('../images/close.png');
            background-image: url('../images/close.svg');
            background-repeat: no-repeat;
            background-size: 12px;
            background-position: center;
        }

.bgsblack {
    background-color: #000 !important;
}

.bgswhite {
    background-color: #fff !important;
}

.bgsLgray {
    background-color: #d9d9d9 !important;
}

.bgsDgreen {
    background-color: #008000 !important;
}

.bgsLgreen {
    background-color: #80d200 !important;
}

.bgsblue {
    background-color: #008aff !important;
}

.bgsDblue {
    background-color: #0000aa !important;
}

.bgspurple {
    background-color: #800080 !important;
}

.bgspink {
    background-color: #ffc0cb !important;
}

.bgsred {
    background-color: #ff0000 !important;
}

.bgsLbrown {
    background-color: #ffa500 !important;
}

.bgsyellow {
    background-color: #ffff00 !important;
}

.boxes .checkbox {
    margin: 0;
}

    .boxes .checkbox label {
        padding: 0;
    }

        .boxes .checkbox label:after {
            content: '';
            display: table;
            clear: both;
        }

    .boxes .checkbox .cr {
        position: relative;
        display: inline-block;
        width: 16px;
        height: 16px;
        float: left;
        margin: 0 .3em 0 0;
        background-color: #bbb;
    }

        .boxes .checkbox .cr .cr-icon {
            position: absolute;
            font-size: .8em;
            line-height: 0;
            top: 50%;
            left: 20%;
        }

    .boxes .checkbox label input[type="checkbox"] {
        display: none;
    }

        .boxes .checkbox label input[type="checkbox"] + .cr > .cr-icon {
            opacity: 0;
            transition: all .5s;
            background-image: url('../images/close.png');
            background-image: url('../images/close.svg');
            background-repeat: no-repeat;
            background-size: 12px;
            background-position: center;
            background-color: #342870;
            position: absolute;
            width: 16px;
            height: 16px;
            left: 0;
            top: 0;
        }

        .boxes .checkbox label input[type="checkbox"]:checked + .cr > .cr-icon {
            opacity: 1;
            transition: all .5s;
        }

        .boxes .checkbox label input[type="checkbox"]:checked + .cr.bgswhite > .cr-icon, .boxes .checkbox label input[type="checkbox"]:checked + .cr.bgsyellow > .cr-icon {
            background-image: url('../images/close-gray.png');
            background-image: url('../images/close-gray.svg');
        }

        .boxes .checkbox label input[type="checkbox"]:disabled + .cr {
            opacity: .5;
        }

.boxes .colorsCheck .checkbox .cr {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    float: left;
    margin-right: .5em;
    border: 1px solid #bbb;
}

.boxes .colorsCheck .checkbox label input[type="checkbox"]:checked + .cr > .cr-icon {
    background-color: transparent;
    position: absolute;
    width: 20px;
    height: 20px;
    top: -1px;
    left: -1px;
}
/*#itemtype ul { height: 112px; overflow: hidden;
	-webkit-transition: 1.2s;
    -moz-transition: 1.2s;
    -o-transition: 1.2s;
    transition: 1.2s;  }
#itemtype ul.open{ height: auto; overflow: visible; 
	-webkit-transition: 1.2s;
    -moz-transition: 1.2s;
    -o-transition: 1.2s;
    transition: 1.2s;  }


#supplierregion ul { height: 200px;  overflow:hidden; overflow-y:scroll;
	-webkit-transition: 1.2s;
    -moz-transition: 1.2s;
    -o-transition: 1.2s;
    transition: 1.2s;  }

#materials ul { height: 200px;  overflow:hidden; overflow-y:scroll;
	-webkit-transition: 1.2s;
    -moz-transition: 1.2s;
    -o-transition: 1.2s;
    transition: 1.2s;  }

#suppliertype ul { height: 200px;  overflow:hidden; overflow-y:scroll;
	-webkit-transition: 1.2s;
    -moz-transition: 1.2s;
    -o-transition: 1.2s;
    transition: 1.2s;  }


#price ul { height: 200px;  overflow:hidden; overflow-y:scroll;
	-webkit-transition: 1.2s;
    -moz-transition: 1.2s;
    -o-transition: 1.2s;
    transition: 1.2s;  }

#colors ul { height: 165px; overflow:hidden; overflow-y:scroll;
	-webkit-transition: 1.2s;
    -moz-transition: 1.2s;
    -o-transition: 1.2s;
    transition: 1.2s;  }
#colors ul.open{ height: auto; overflow: visible; 
	-webkit-transition: 1.2s;
    -moz-transition: 1.2s;
    -o-transition: 1.2s;
    transition: 1.2s;  }*/

#pageListing {
    padding: 0px 0px 40px;
}

.listHeading {
    margin-top: 20px;
    margin-bottom: 20px;
    border-bottom: 2px solid #ccc;
}

    .listHeading.btm {
        float: left;
        margin-top: 20px;
        margin-bottom: 20px;
        border-bottom: 0px solid #ccc;
        border-top: 2px solid #ccc;
    }

.listHead {
    width: auto;
    float: left;
    color: #342870;
}

.searchResult {
    width: auto;
    float: right;
    color: #342870;
    font-size: 16px;
    margin-top: 12px;
    font-family: "Open-sans", sans-serif;
}

.listHeading.btm .searchResult, .listHeading.btm .goback {
    margin-top: 2px;
}

.productTiles, .productList {
    display: none;
}

    .productTiles.show, .productList.show {
        display: block;
    }

.ajaxloader-beforeproductsload {
    position: relative;
}

    .ajaxloader-beforeproductsload .ajaxloaderdiv {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        z-index: 1;
        padding: 90px 20px;
        background: linear-gradient(180deg, rgb(255 255 255 / 85%) 60%, rgb(255 255 255 / 30%) 100%);
    }

        .ajaxloader-beforeproductsload .ajaxloaderdiv img {
            width: 40px;
        }

.listingPanel {
    padding: 0;
    margin: 20px 0px;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

    .listingPanel li {
        list-style: none;
    }

    .listingPanel .listingPanel_img {
        border-radius: 6px;
        overflow: hidden;
    }

.listingPanel_img {
    position: relative;
    overflow: hidden;
}

    .listingPanel_img img {
        width: auto;
        height: auto;
        max-width: 100%;
        max-height: 100%;
        padding: 10px;
    }

    .listingPanel_img .imagerap, .product-image .imagerap, .cartprdctImg .imagerap, .listImage .imagerap {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 0;
        border-radius: 6px;
        background-color: transparent;
        background: transparent;
        background: -moz-linear-gradient(top, rgba(43,43,43,.10) 100%, rgba(43,43,43,.10) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(43,43,43,.10) 100%)), color-stop(100%, rgba(43,43,43,.10)));
        background: -webkit-linear-gradient(top, rgba(43,43,43,.10) 100%) 0%, rgba(43,43,43,.10) 100%);
        background: -o-linear-gradient(top, rgba(43,43,43,.10) 100%) 0%, rgba(43,43,43,.10) 100%);
        background: -ms-linear-gradient(to bottom, rgba(43,43,43,.10) 0%, rgba(43,43,43,.10) 100%);
        background: linear-gradient(to bottom, rgba(43,43,43,.10) 0%, rgba(43,43,43,.10) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#2b2b2b', GradientType=0 );
    }

.listingPanel_text h4 {
    color: #522e91;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 22px;
    text-transform: capitalize;
    margin: 0 0 10px; /*white-space: nowrap; overflow: hidden; text-overflow: ellipsis; height: 25px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;*/
}

.productTiles .listingPanel_text h4 {
    min-height: 90px;
}

.listingPanel_text p {
    color: #522e91;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 22px;
}

.listingPanel_text .priceRange {
    margin: 0;
}

    .listingPanel_text .priceRange > span {
        display: inline-block;
        font-weight: 500;
    }

.listingPanel_text .icons-list ul li.addtobasketbutton {
    width: auto;
}

    .listingPanel_text .icons-list ul li.addtobasketbutton a {
        display: block;
        font-size: 16px;
        color: #ffffff;
        line-height: 19px;
        text-decoration: none;
    }

        .listingPanel_text .icons-list ul li.addtobasketbutton a i {
            font-size: 16px;
        }

.gridView .listingPanel {
    display: flex;
    flex-wrap: wrap;
    width: auto;
    margin-left: -15px;
    margin-right: -15px;
}

    .gridView .listingPanel > li {
        width: 50%;
        padding: 8px;
    }

    .gridView .listingPanel .listingPanel_img {
        min-height: 170px;
        height: 170px;
        margin: 0 0 10px;
        text-align: center;
    }

.listView .listingPanel {
    margin-top: 35px;
}

    .listView .listingPanel > li {
        list-style: none;
        width: 49%;
        min-height: 245px;
        padding: 0;
        margin: 0 0 2% 2%; /*border-bottom: 1px solid #E8E5E5;*/
        position: relative;
    }

        .listView .listingPanel > li:nth-child(2n+1) {
            margin-left: 0;
        }

.loadmoreProducts {
}

    .loadmoreProducts .loadmore {
        position: relative;
        min-width: 135px;
        padding: 10px 15px;
        color: #522e91;
        font-size: 16px;
        font-weight: 600;
        letter-spacing: 0;
        line-height: 22px;
        text-align: center;
        border: 1px solid #522e91;
        border-radius: 6px;
    }

        .loadmoreProducts .loadmore:hover {
            background-color: #522e91;
            color: #ffffff;
        }

        .loadmoreProducts .loadmore .productsloader {
            position: absolute;
            top: 0px;
            left: 0px;
            right: 0;
            width: 100%;
            height: 100%;
            background-color: #ffffffe3;
            border-radius: 6px;
        }

.lessproductinfoView {
    width: 100%;
    float: left;
    display: block;
}

    .lessproductinfoView .listingPanel_img {
        width: 35%;
        float: left;
    }

        .lessproductinfoView .listingPanel_img .productImg {
            min-height: 195px;
        }
        /*.lessproductinfoView .listingPanel_img .findMore  span { bottom: 100px; left: 20px; }*/
        .lessproductinfoView .listingPanel_img:hover .findMore {
            opacity: 1;
            -webkit-transition: 0.2s;
            -moz-transition: 0.2s;
            -o-transition: 0.2s;
            transition: 0.2s;
        }

    .lessproductinfoView .listingPanel_text {
        width: 65%;
        float: left;
        padding: 0px 0 0px 20px;
        text-align: left;
    }

        .lessproductinfoView .listingPanel_text h4 {
            min-height: 44px;
        }

        .lessproductinfoView .listingPanel_text .readMore {
            color: #f37421;
            cursor: pointer;
        }

        .lessproductinfoView .listingPanel_text .info_circles {
            margin: 10px 0px;
            width: 100%;
            float: left;
        }

            .lessproductinfoView .listingPanel_text .info_circles .smallrund {
                margin: 0px 8px;
                padding: 5px;
            }

            .lessproductinfoView .listingPanel_text .info_circles a .smallrund {
                margin: 0px 8px;
                padding: 5px;
            }

            .lessproductinfoView .listingPanel_text .info_circles .smallrund:first-child {
                margin: 0px 8px 0px 0px;
            }

            .lessproductinfoView .listingPanel_text .info_circles a .smallrund:first-child {
                margin: 0px 8px;
            }

            .lessproductinfoView .listingPanel_text .info_circles .smallrund span {
                color: #fff;
                font-size: 12px;
                font-family: "Open-sans", sans-serif;
                font-weight: 400;
            }

            .lessproductinfoView .listingPanel_text .info_circles [class^="icon-"], .lessproductinfoView .listingPanel_text .info_circles [class*=" icon-"] {
                font-size: 20px !important;
            }

                .lessproductinfoView.listingPanel_text .info_circles .smallrund [class^="icon-"]:before, .lessproductinfoView .listingPanel_text .info_circles [class*=" icon-"]:before {
                    top: 1.4px;
                    left: 0.4px;
                    position: relative;
                }

            .lessproductinfoView .listingPanel_text .info_circles .smallrund.btnRequiredDHSubscription, .info_circles .smallrund.boxbtn.btnRequiredDHSubscription {
                padding: 2px 2px;
            }

            .lessproductinfoView .listingPanel_text .info_circles .smallrund.dhiconspace, .info_circles .smallrund.dhiconspace {
                padding: 3px;
            }

            .lessproductinfoView .listingPanel_text .info_circles .smallrund span.icon-DH, .info_circles .smallrund.boxbtn span.icon-DH {
                font-size: 25px !important;
                font-weight: normal;
            }

    .lessproductinfoView .closeModal {
        width: 40px;
        height: 40px;
    }

    .lessproductinfoView .listingPanel_text .info_circles .smallrund .cusTooltip {
        top: auto;
        white-space: normal;
        width: 120px;
    }

#productListContainer .listingPanel_text h4 {
    height: auto;
    max-width: 100%;
    margin-top: 0;
}

.icons-list ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    margin-left: -5px;
    margin-right: -5px;
}

    .icons-list ul li {
        width: 31px;
        height: 31px;
        padding: 0;
        margin: 5px;
        border: 1px solid #522e91;
        border-radius: 6px;
    }

        .icons-list ul li > a, .icons-list ul li > span {
            display: block;
            width: 100%;
            height: 100%;
            position: relative;
            padding: 5px;
            text-align: center;
            cursor: pointer;
            border-radius: 6px;
        }

        .icons-list ul li i {
            font-size: 18px;
            color: #522e91;
        }

        .icons-list ul li .supplierInfo i {
            display: block;
            width: 19px;
            text-align: center;
            font-family: 'Merriweather', serif;
            font-weight: 700;
            font-style: italic;
            font-size: 18px;
            line-height: 20px;
            color: #522e91;
        }

        .icons-list ul li > a.addtobasket, .icons-list ul li > span.addtobasket, .icons-list ul li > a.addedtobasket, .icons-list ul li > span.addedtobasket, .icons-list ul li > a.addtocart, .icons-list ul li > span.addtocart, .icons-list ul li > a.addedtocart, .icons-list ul li > span.addedtocart {
            background-color: #001CFF;
        }

            .icons-list ul li > a.addtobasket i, .icons-list ul li > span.addtobasket i, .icons-list ul li > a.addedtobasket i, .icons-list ul li > span.addedtobasket i, .icons-list ul li > a.addtocart i, .icons-list ul li > span.addtocart i, .icons-list ul li > a.addedtocart i, .icons-list ul li > span.addedtocart i {
                color: #ffffff;
            }

        .icons-list ul li > a.productTrigger, .icons-list ul li > span.productTrigger {
            background-color: #522e91;
        }

        .icons-list ul li > a.productTriged, .icons-list ul li > span.productTriged {
            background-color: #c5c5c5;
            border: 1px solid #c5c5c5 !important;
        }

        .icons-list ul li > a.productTrigger i, .icons-list ul li > span.productTrigger i {
            color: #ffffff;
        }

        .icons-list ul li > a.dhpricing, .icons-list ul li > span.dhpricing {
            background-color: #ccc;
            border: 1px solid #ccc !important;
        }

            .icons-list ul li > a.dhpricing.active, .icons-list ul li > span.dhpricing.active {
                background-color: #f37421;
                border: 1px solid #f37421 !important;
            }

            .icons-list ul li > a.dhpricing i.dh-dhpricing, .icons-list ul li > span.dhpricing i.dh-dhpricing {
                display: block;
                width: 20px;
                height: 20px;
                background-image: url('../images/DHIcon-blue.png');
                background-image: url('../images/DHIcon-blue.svg');
                background-repeat: no-repeat;
                background-size: 22px;
                background-position: center;
            }

            .icons-list ul li > a.dhpricing.active i.dh-dhpricing, .icons-list ul li > span.dhpricing.active i.dh-dhpricing {
                background-image: url('../images/DHIcon-white.png');
                background-image: url('../images/DHIcon-white.svg');
                background-repeat: no-repeat;
                background-size: 22px;
                background-position: center;
            }

        .icons-list ul li > a:hover .cusTooltip, .icons-list ul li > span:hover .cusTooltip {
            display: block;
        }

.icons-list.multiple {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

.icons-list ul.rounded {
    margin-right: 5px;
}

    .icons-list ul.rounded:last-child {
        margin-right: 0;
    }

    .icons-list ul.rounded li {
        border-radius: 50%;
    }

        .icons-list ul.rounded li > span {
            border-radius: 50%;
            color: #fff;
            font-size: 16px;
            font-weight: 500;
            letter-spacing: 0;
            line-height: 20px;
            text-align: center;
            padding: 10px 5px;
        }

.icons-list .rounded-list > span {
    width: 40px;
    height: 40px;
    display: inline-block;
    position: relative;
    margin: 5px;
    border-radius: 50%;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 20px;
    text-align: center;
    padding: 10px 5px;
}

.icons-list ul.ribben-products li {
    background-color: #f37421;
}

    .icons-list ul.ribben-products li span.pdctText {
        display: block;
        color: #FFFFFF;
        font-size: 6px;
        font-weight: 500;
        letter-spacing: 0;
        line-height: 8px;
        text-align: center;
        text-transform: uppercase;
        padding: 3px 0px;
    }

.listingPanel_text .icons-list ul li {
    border: 0;
}

    .listingPanel_text .icons-list ul li a, .listingPanel_text .icons-list ul li span {
        border: 1px solid #522e91;
    }

.icons-list ul li > a.addtobasket, .icons-list ul li > span.addtobasket, .icons-list ul li > a.addedtobasket, .icons-list ul li > span.addedtobasket, .icons-list ul li > a.addtocart, .icons-list ul li > span.addtocart, .icons-list ul li > a.addedtocart, .icons-list ul li > span.addedtocart {
    background-color: #001CFF;
    border: 1px solid #001CFF;
}


.modal-body .info_circles {
    margin: 10px 0px 30px;
    width: 100%;
    float: left;
}

    .modal-body .info_circles .smallrund {
        margin: 0px 8px;
        padding: 14px 10px;
        width: 52px;
        height: 52px;
    }

        .modal-body .info_circles .smallrund:first-child {
            margin: 0px 8px 0px 0px;
        }

        .modal-body .info_circles .smallrund span {
            color: #fff;
            font-size: 18px;
            font-family: "Open-sans", sans-serif;
            font-weight: 400;
        }

            .modal-body .info_circles .smallrund span.cusTooltip {
                font-size: 12px;
            }

    .modal-body .info_circles [class^="icon-"], .lessproductinfoView .listingPanel_text .info_circles [class*=" icon-"] {
        font-size: 24px !important;
    }

        .modal-body .info_circles .smallrund [class^="icon-"]:before, .lessproductinfoView .listingPanel_text .info_circles [class*=" icon-"]:before {
            top: -3px;
            left: 0px;
            position: relative;
            font-size: 30px;
        }

    .modal-body .info_circles .smallrund span.icon-dh {
        font-family: "Open-sans", sans-serif !important;
    }

.moreproductinfoView {
    width: 100%;
    float: left;
    padding: 15px;
    background-color: #fff;
    display: none;
    position: relative;
}

    .moreproductinfoView .listingPanel_img {
        width: 350px;
        float: left;
    }

        .moreproductinfoView .listingPanel_img img {
            border: 1px solid #ccc;
        }

        .moreproductinfoView .listingPanel_img .findMore span {
            bottom: 100px;
            left: 20px;
        }

        .moreproductinfoView .listingPanel_img:hover .findMore {
            opacity: 1;
            -webkit-transition: 0.2s;
            -moz-transition: 0.2s;
            -o-transition: 0.2s;
            transition: 0.2s;
        }

        .moreproductinfoView .listingPanel_img .info_circles {
            margin: 10px 0px;
            width: 100%;
            float: left;
        }

            .moreproductinfoView .listingPanel_img .info_circles .smallrund {
                margin: 0px 8px;
                padding: 5px;
            }

                .moreproductinfoView .listingPanel_img .info_circles .smallrund:first-child {
                    margin: 0px 8px 0px 0px;
                }

                .moreproductinfoView .listingPanel_img .info_circles .smallrund span {
                    color: #fff;
                    font-size: 12px;
                    font-family: "Open-sans", sans-serif;
                    font-weight: 400;
                }

            .moreproductinfoView .listingPanel_img .info_circles [class^="icon-"], .moreproductinfoView .listingPanel_text .info_circles [class*=" icon-"] {
                font-size: 20px !important;
            }

                .moreproductinfoView.listingPanel_img .info_circles .smallrund [class^="icon-"]:before, .moreproductinfoView .listingPanel_text .info_circles [class*=" icon-"]:before {
                    top: 1.4px;
                    left: 0.4px;
                    position: relative;
                }

.moreproductinfoPartialView {
    width: 100%;
    float: left;
    padding: 15px;
    background-color: #fff;
}

    .moreproductinfoPartialView .listingPanel_img {
        width: 350px;
        float: left;
    }

        .moreproductinfoPartialView .listingPanel_img img {
            border: 1px solid #ccc;
        }

        .moreproductinfoPartialView .listingPanel_img .findMore span {
            bottom: 100px;
            left: 20px;
        }

        .moreproductinfoPartialView .listingPanel_img:hover .findMore {
            opacity: 1;
            -webkit-transition: 0.2s;
            -moz-transition: 0.2s;
            -o-transition: 0.2s;
            transition: 0.2s;
        }

        .moreproductinfoPartialView .listingPanel_img .info_circles {
            margin: 10px 0px;
            width: 100%;
            float: left;
        }

            .moreproductinfoPartialView .listingPanel_img .info_circles .smallrund {
                margin: 0px 6px;
                padding: 5px;
            }

                .moreproductinfoPartialView .listingPanel_img .info_circles .smallrund:first-child {
                    margin: 0px 6px 0px 0px;
                }

                .moreproductinfoPartialView .listingPanel_img .info_circles .smallrund span {
                    color: #fff;
                    font-size: 12px;
                    font-family: "Open-sans", sans-serif;
                    font-weight: 400;
                }

            .moreproductinfoPartialView .listingPanel_img .info_circles [class^="icon-"], .moreproductinfoPartialView .listingPanel_text .info_circles [class*=" icon-"] {
                font-size: 20px !important;
            }

                .moreproductinfoPartialView.listingPanel_img .info_circles .smallrund [class^="icon-"]:before, .moreproductinfoPartialView .listingPanel_text .info_circles [class*=" icon-"]:before {
                    top: 1.4px;
                    left: 0.4px;
                    position: relative;
                }

    .moreproductinfoPartialView .listingPanel_text {
        width: 558px;
        float: left;
        padding: 0px 30px 0px 20px;
        text-align: left;
    }

        .moreproductinfoPartialView .listingPanel_text h4 {
            min-height: auto;
        }

    .moreproductinfoPartialView .closeModal {
        width: 40px;
        height: 40px;
    }

    .moreproductinfoPartialView .listingPanel_text table {
        background-color: #f2f2f2;
        text-align: center;
        width: 250px;
    }

    .moreproductinfoPartialView .listingPanel_text .table > thead > tr > th {
        text-align: center;
    }

    .moreproductinfoPartialView .listingPanel_text .table > thead > tr > th, .moreproductinfoView .listingPanel_text .table > tbody > tr > td {
        padding: 4px;
    }

        .moreproductinfoPartialView .listingPanel_text .table > thead > tr > th:first-child, .moreproductinfoView .listingPanel_text .table > tbody > tr > td:first-child {
            border-right: 1px solid #ccc;
        }

    .moreproductinfoPartialView .listingPanel_text .table-striped > tbody > tr:nth-of-type(odd) {
        background-color: #DCDBDB;
    }

.supplierinfoPartialView {
    width: 100%;
    float: left;
    padding: 15px;
    background-color: #fff;
}

    .supplierinfoPartialView .listingPanel_img {
        width: 350px;
        float: left;
    }

        .supplierinfoPartialView .listingPanel_img img {
            border: 1px solid #ccc;
        }

        .supplierinfoPartialView .listingPanel_img .findMore span {
            bottom: 100px;
            left: 20px;
        }

        .supplierinfoPartialView .listingPanel_img:hover .findMore {
            opacity: 1;
            -webkit-transition: 0.2s;
            -moz-transition: 0.2s;
            -o-transition: 0.2s;
            transition: 0.2s;
        }

        .supplierinfoPartialView .listingPanel_img .info_circles {
            margin: 10px 0px;
            width: 100%;
            float: left;
        }

            .supplierinfoPartialView .listingPanel_img .info_circles .smallrund {
                margin: 0px 8px;
                padding: 5px;
            }

                .supplierinfoPartialView .listingPanel_img .info_circles .smallrund:first-child {
                    margin: 0px 8px 0px 0px;
                }

                .supplierinfoPartialView .listingPanel_img .info_circles .smallrund span {
                    color: #fff;
                    font-size: 12px;
                    font-family: "Open-sans", sans-serif;
                    font-weight: 400;
                }

            .supplierinfoPartialView .listingPanel_img .info_circles [class^="icon-"], .moreproductinfoPartialView .listingPanel_text .info_circles [class*=" icon-"] {
                font-size: 20px !important;
            }

                .supplierinfoPartialView.listingPanel_img .info_circles .smallrund [class^="icon-"]:before, .moreproductinfoPartialView .listingPanel_text .info_circles [class*=" icon-"]:before {
                    top: 1.4px;
                    left: 0.4px;
                    position: relative;
                }

supplierinfoPartialView
.supplierinfoPartialView .listingPanel_text {
    width: 558px;
    float: left;
    padding: 0px 30px 0px 20px;
    text-align: left;
}

.supplierinfoPartialView .listingPanel_text h4 {
    min-height: auto;
}

.supplierinfoPartialView .closeModal {
    width: 40px;
    height: 40px;
}

.supplierinfoPartialView .listingPanel_text table {
    background-color: #f2f2f2;
    text-align: center;
    width: 250px;
}

.supplierinfoPartialView .listingPanel_text .table > thead > tr > th {
    text-align: center;
}

.supplierinfoPartialView .listingPanel_text .table > thead > tr > th, .moreproductinfoView .listingPanel_text .table > tbody > tr > td {
    padding: 4px;
}

    .supplierinfoPartialView .listingPanel_text .table > thead > tr > th:first-child, .moreproductinfoView .listingPanel_text .table > tbody > tr > td:first-child {
        border-right: 1px solid #ccc;
    }

.supplierinfoPartialView .listingPanel_text .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #DCDBDB;
}


.moreproductinfoView .listingPanel_text {
    width: 558px;
    float: left;
    padding: 0px 30px 0px 20px;
    text-align: left;
}

    .moreproductinfoView .listingPanel_text h4 {
        min-height: auto;
    }

.moreproductinfoView .closeModal {
    width: 40px;
    height: 40px;
}

.moreproductinfoView .listingPanel_text table {
    background-color: #f2f2f2;
    text-align: center;
    width: 250px;
}

.moreproductinfoView .listingPanel_text .table > thead > tr > th {
    text-align: center;
}

.moreproductinfoView .listingPanel_text .table > thead > tr > th, .moreproductinfoView .listingPanel_text .table > tbody > tr > td {
    padding: 4px;
}

    .moreproductinfoView .listingPanel_text .table > thead > tr > th:first-child, .moreproductinfoView .listingPanel_text .table > tbody > tr > td:first-child {
        border-right: 1px solid #ccc;
    }

.moreproductinfoView .listingPanel_text .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #DCDBDB;
}

.listingPanel_text .info_circles .smallrund span.icon-dh {
    font-size: 12px !important;
    font-family: "Open-sans", sans-serif !important;
}

.moreproductinfoView .productImg.open {
    top: 12.7%;
}

.viewModal {
    width: 40px;
    height: 40px;
    position: absolute;
    top: -1px;
    right: -1px;
    cursor: pointer;
    z-index: 99;
    padding: 6px;
    font-size: 28px;
    color: #fff;
    font-weight: 800;
    font-family: "Open-sans", sans-serif;
    line-height: 26px;
    letter-spacing: 2px;
    border-width: 0px 0px 1px 1px;
    border-style: solid;
    border-color: #fff;
}

.viewpopModal {
    width: 40px;
    height: 36px;
    position: absolute;
    top: auto;
    bottom: 0px;
    right: 0px;
    cursor: pointer;
    z-index: 99;
    padding: 6px;
    font-size: 18px;
    color: #fff;
    font-weight: 500;
    font-family: "Open-sans", sans-serif;
    line-height: 19px;
    letter-spacing: 2px;
    border-width: 0px 0px 1px 1px;
    border-style: solid;
    border-color: #fff;
}

.icon-datarating {
}

.viewModal.open {
    padding: 6px 8px;
    font-size: 21px;
}

    .viewModal.open.icon-dot:before {
        content: "\e90f";
    }



.findMore {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(12, 0, 56, 0.72);
    cursor: pointer;
    text-align: center;
    -webkit-transition: 0.2s;
    -moz-transition: 0.2s;
    -o-transition: 0.2s;
    transition: 0.2s;
}

    .findMore span {
        background-color: #522e91;
        color: #fff;
        padding: 10px 5px;
        font-size: 16px;
        position: absolute;
        top: 0;
        bottom: 0;
        width: 85%;
        height: 45px;
        left: 0;
        right: 0;
        margin: auto;
    }

.listingPanel_img:hover > .findMore {
    opacity: 1;
    -webkit-transition: 0.2s;
    -moz-transition: 0.2s;
    -o-transition: 0.2s;
    transition: 0.2s;
}

.newTag, .featureTag, .speacialTag {
    position: absolute;
    top: -10px;
    right: -50px;
    width: 150px;
    height: 65px;
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    line-height: 22px;
    padding-top: 35px;
    text-align: center;
    text-transform: uppercase;
    background: linear-gradient(90deg, #f37421 0%, #B4005E 100%);
    -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari */
    -0-transform: rotate(45deg); /* Opera */
    transform: rotate(45deg);
}

.trendingTag {
    position: absolute;
    top: -10px;
    right: -50px;
    width: 150px;
    height: 65px;
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    line-height: 22px;
    padding-top: 35px;
    text-align: center;
    text-transform: uppercase;
    background: linear-gradient(90deg, blue 0%, purple 100%);
    -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari */
    -0-transform: rotate(45deg); /* Opera */
    transform: rotate(45deg);
}

.detailspage .product-image .newTag, .detailspage .product-image .featureTag, .detailspage .product-image .speacialTag, .detailspage .product-image .trendingTag {
    top: -65px;
    right: -90px;
    width: 200px;
    height: 150px;
    font-size: 16px;
    padding-top: 115px;
}

.ecoTag {
    display: none;
    background-color: #ffffff;
    position: absolute;
    bottom: 2px;
    right: -10px;
    width: 70px;
    height: 22px;
    color: #fff;
    font-family: "Open-sans", sans-serif;
    font-size: 14px;
    font-weight: 500;
    padding: 0 8px 0 0;
    text-align: center;
    text-transform: uppercase;
    border-radius: 20px;
}

    .ecoTag img {
        padding: 0 !important;
    }

.product-image .britishmadeTag {
    top: -1px;
    left: -1px;
    width: 128px;
    height: 131px;
}

.product-image .britishmadeTagBottom {
    top: 4px;
    left: 2px;
    width: 52px;
    height: 48px;
}

.ecoTag.modal-info {
    background-color: #e6e6e6;
    position: absolute;
    bottom: 10px;
    right: -15px;
    width: 85px;
    height: auto;
    color: #fff;
    font-family: "Open-sans", sans-serif;
    font-size: 14px;
    font-weight: 500;
    padding: 5px 10px 5px 0;
    text-align: center;
    text-transform: uppercase;
    border-radius: 20px;
}

    .ecoTag.modal-info img {
        width: 46px !important;
    }

.info_circles .smallrund {
    position: relative;
    width: 30px;
    height: 30px;
    float: left;
    text-align: center;
    padding: 4px;
    border: 1px solid #522e91;
    border-radius: 6px;
    margin: 0 10px 0 0;
}

    .info_circles .smallrund [class^="icon-"], .info_circles .smallrund [class*=" icon-"] {
        font-size: 19px;
        color: #522e91;
    }

    .info_circles .smallrund span {
        font-weight: 600;
    }

    /*.info_circles .smallrund.boxbtn  { border-radius: 0; cursor: pointer; }
.info_circles .smallrund.productTriged { background-color: #522e91;}*/

    .info_circles .smallrund [class^="icon-"]:before, .info_circles [class*=" icon-"]:before {
        top: 1.4px;
        left: 0.4px;
        position: relative;
    }

    .info_circles .smallrund .icon-plus:before {
        top: -1px;
        left: -1px;
    }

    .info_circles .smallrund .icon-info:before {
        top: -1px;
        left: 0px;
    }

    .info_circles .smallrund .fa {
        margin: 4px;
    }

        .info_circles .smallrund .fa:before {
            font-size: 18px;
        }

.pagePagination {
    width: auto;
    float: left;
}

    .pagePagination .countprdcts {
        float: left;
        font-family: "Open-sans", sans-serif;
        color: #342870;
        padding: 7px 10px 0px 0px;
        border-right: 1px solid #ccc;
        margin-right: 20px;
    }

        .pagePagination .countprdcts span {
            float: none;
            font-weight: 500;
            padding: 0;
        }

    .pagePagination .pagination > li > a, .pagePagination .pagination > li > span {
        border: 0;
    }

    .pagePagination .pagination > li.disabled > a {
        display: none;
    }

    .pagePagination .pagination > li > a, .pagePagination .pagination > li > span {
        color: #342870;
        font-size: 16px;
        padding: 2px 8px;
    }

    .pagePagination .pagination > .active > a, .pagePagination .pagination > .active > a:focus, .pagePagination .pagination > .active > a:hover, .pagePagination .pagination > .active > span, .pagePagination .pagination > .active > span:focus, .pagePagination .pagination > .active > span:hover {
        color: #fff;
        background-color: #f37421;
    }

.listSwitchiew.btm {
    float: right;
    width: 200px;
    margin: 15px 0px;
}

/*.boldText span{ font-family: "VAGRoundedBlackSSiBold", Arial, sans-serif; }*/

.productModview {
    border: 1px solid #E8E5E5;
    padding: 15px;
    background-color: #fff;
    border-radius: 0;
}

    .productModview .listingPanel_img {
        width: 350px;
        float: left;
    }

        .productModview .listingPanel_img img {
            border: 1px solid #ccc;
        }

.productImg {
    position: relative;
}

.listingPanel_img.open {
    overflow: visible;
}

    .listingPanel_img.open .newTag {
        opacity: 0;
    }

    .listingPanel_img.open .productImg {
        position: absolute;
        width: 500px;
        height: 436px;
        top: -16px;
        left: auto;
        text-align: center;
        background-color: #fff;
        border: 1px solid #ccc;
        margin-left: -16px;
        z-index: 1;
    }

        .listingPanel_img.open .productImg img {
            width: auto;
            height: auto;
            border: 0;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            margin: auto;
        }

.productImg span.imageZoom {
    position: absolute;
    left: 10px;
    bottom: 10px;
    cursor: pointer;
    display: none;
}

    .productImg span.imageZoom .icon-search-plus:before {
        font-size: 32px;
        color: #522e91;
        display: none;
    }

.listingPanel_img.open .productImg span.imageZoom .icon-search-plus:before {
    content: "\e912";
    font-size: 32px;
    color: #522e91;
}

.productModview .info_circles {
    margin: 15px 0px;
}

    .productModview .info_circles .smallrund {
        position: relative;
        margin: 0px 8px;
        width: 28px;
        height: 28px;
        padding: 3px;
        cursor: pointer;
    }

        .productModview .info_circles .smallrund span {
            color: #fff;
            font-size: 12px;
            font-family: "Open-sans", sans-serif;
            font-weight: 400;
        }

    .productModview .info_circles [class^="icon-"], .productModview .info_circles [class*=" icon-"] {
        font-size: 18px !important;
    }

        .productModview .info_circles [class^="icon-"]:before, .productModview .info_circles [class*=" icon-"]:before {
            position: relative;
            top: 1.4px;
            left: 0.5px;
        }

    .productModview .info_circles .smallrund .icon-info:before {
        top: -1px;
        left: 0px;
    }

.productModview .listingPanel_text {
    width: 558px;
    float: left;
    padding: 0px 0px 0px 30px;
    text-align: left;
}

    .productModview .listingPanel_text h4 {
        font-weight: 500;
        min-height: auto;
        margin: 0 0 5px;
    }

    .productModview .listingPanel_text p {
        font-size: 15px;
    }

    .productModview .listingPanel_text table {
        background-color: #f2f2f2;
        text-align: center;
        width: 250px;
    }

    .productModview .listingPanel_text .table > thead > tr > th {
        text-align: center;
    }

    .productModview .listingPanel_text .table > thead > tr > th, .productModview .listingPanel_text .table > tbody > tr > td {
        padding: 4px;
    }

        .productModview .listingPanel_text .table > thead > tr > th:first-child, .productModview .listingPanel_text .table > tbody > tr > td:first-child {
            border-right: 1px solid #ccc;
        }

    .productModview .listingPanel_text .table-striped > tbody > tr:nth-of-type(odd) {
        background-color: #DCDBDB;
    }

.orngeCheck .fa-check:before {
    font-size: 21px;
    color: #f37421;
}

.addtoBasketbtns .btn {
    font-family: "Open-sans", sans-serif;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
    border-radius: 0px;
    width: 48%;
    line-height: 21px;
    min-height: 40px;
    margin-bottom: 3px;
}

    .addtoBasketbtns .btn.addTobasket {
        margin-right: 3%;
    }

    .addtoBasketbtns .btn .icon-plus:before {
        position: relative;
        top: 1px;
        font-size: 17px;
    }

.footable.breakpoint > tbody > tr > td > span.footable-toggle:before {
    content: '';
}

.smallrund .cusTooltip {
    font-size: 12px;
    position: absolute;
    width: auto;
}

.smallrund:hover .cusTooltip {
    display: block; /*cursor: pointer; bottom: 41px; left: -43px;*/
}

.spacewidth {
    padding: 0px 10px;
}

#supplierinfoContainer .modal-body .info_circles .smallrund {
    margin: 0px 8px 10px;
}

#supplierinfoContainer .modal-body .info_circles .right .smallrund {
    float: right;
    width: 45px;
    height: 45px;
    padding: 10px 6px;
    margin: 0 4px 10px;
}

    #supplierinfoContainer .modal-body .info_circles .right .smallrund.bgwhite {
        background-color: #fff;
    }

    #supplierinfoContainer .modal-body .info_circles .right .smallrund:first-child {
        margin: 0 0px 10px 4px;
    }

#supplierinfoContainer .modal-body .info_circles .smallrund:first-child {
    margin: 0px 8px 10px;
}

#supplierinfoContainer .modal-body .smallrund:hover .cusTooltip {
    bottom: 60px;
    top: auto;
    left: -32px;
    width: 130px;
    white-space: normal;
}

.modal-product .modal-dialog {
    width: auto;
    margin-top: 10%;
}

.modal-supplier .modal-dialog {
    width: auto;
    margin-top: 10%;
}

.closeModal {
    width: 40px;
    height: 40px;
    position: absolute;
    top: -1px;
    right: -1px;
    cursor: pointer;
    padding: 8px;
    z-index: 99;
    border-width: 0px 0px 1px 1px;
    border-style: solid;
    border-color: #fff;
}

    .closeModal.icon-close:before {
        color: #fff;
        font-size: 24px;
    }

.listingPanel_img .listingPanel_text {
    width: 350px;
    padding: 0px 0px 0px 10px;
}

.listingPanel_text .listingPanel_img {
    width: 200px;
}

.listingPanel_text .productText {
    width: 100%;
    float: left;
    margin-top: 10px;
}

.listingPanel_text a {
    color: #f37421;
}

.listingPanel_img .listingPanel_text .info_circles {
    width: 100%;
}

.listingPanel_img .listingPanel_text hr {
    width: 100%;
    float: left;
}

.listingPanel_img .listingPanel_text .btn {
    width: 230px;
    margin-top: 15px;
    font-family: "Open-sans", sans-serif;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
    border-radius: 0px;
    line-height: 25px;
    min-height: 40px;
}

.customIcons {
}

    .customIcons .cicon {
        width: 28px;
        height: 28px;
        position: absolute;
        top: 0px;
        left: 0px;
        background-repeat: no-repeat;
        background-size: 30px;
        background-position: center;
    }

.iconMembership {
    background-image: url('../images/purple_club.jpg');
}

.iconBpma {
    background-image: url('../images/bpma.jpg');
}

.productModview .info_circles .smallrund .cusTooltip {
    position: absolute;
}

.productModview .info_circles .smallrund:hover .cusTooltip {
    top: -45px;
    left: -45px;
}

.productRelated {
    width: 310px;
    float: right;
}

.pdctrldIcon {
    position: relative;
    margin: 0px 8px;
    width: 40px;
    height: 40px;
    padding: 3px;
    cursor: pointer;
    float: left;
}

.pdctIcon {
    position: absolute;
    width: 45px;
    height: 45px;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    background-repeat: no-repeat;
    background-size: 52px;
    background-position: center;
}

.spclOffer {
    background-image: url('../images/special_offer.png');
}

.newProduct {
    background-image: url('../images/new-product.png');
}

.ftrdProduct {
    background-image: url('../images/featured_product.png');
}

.TdSample {
    background-image: url('../images/3d_sample.png');
}

.Fsc {
    background-image: url('../images/fsc.png');
}

.britishMade {
    background-image: url('../images/british_made.png');
    background-size: 48px;
    background-position: left -5px center;
    width: 40px;
    height: 40px;
}

.printdoc, .printdoc #pages_wrapper, .printdoc .modal {
    overflow: auto;
}

    .printdoc

    .printbtn {
        margin-top: -55px;
        display: none;
    }

    .printdoc .printbtn {
        display: block;
    }

.printbtn .btn {
    width: 115px !important;
    float: right;
    margin: 0px 14px 14px 0px;
    background-image: url('../images/print.png');
    background-image: url('../images/print.svg');
}

    .printbtn .btn:hover, .printbtn .btn:focus {
        color: #fff;
    }


.pdctIcon:hover + .cusTooltip {
    display: block;
}

.basketBtn .basketAdd {
    display: block;
}

.basketBtn .basketAdded {
    display: none;
}

.basketBtn.basketAddbtn .basketAdd {
    display: none;
}

.basketBtn.basketAddbtn .basketAdded {
    display: block;
}

.iconSmile {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 32px;
    height: 32px;
    background-image: url('../images/smily.png');
    background-repeat: no-repeat;
    background-size: 32px;
    background-position: center;
}

.fancy3d .smallrund



.zoom {
    display: inline-block;
    position: relative;
}

/* magnifying glass icon */
.zoom:after {
    content: '';
    display: block;
    width: 33px;
    height: 33px;
    position: absolute;
    top: 0;
    right: 0;
    background: url(icon.png);
}

.zoom img {
    display: block;
}

    .zoom img::selection {
        background-color: transparent;
    }

#ex2 img:hover {
    cursor: url(grab.cur), default;
}

#ex2 img:active {
    cursor: url(grabbed.cur), default;
}


/*-- Content page CSS ----*/

#mainContent {
    padding-top: 20px;
}

    #mainContent p.teltext {
        color: #f37421;
        margin-bottom: 0;
    }

.bgImage {
    padding: 40px 0px 60px;
    background-image: url('../images/bgfooter.png');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: bottom -140px center;
    min-height: 600px;
}

.pageLinkstop {
    margin-top: 40px;
}

.pageLinks {
    padding: 0;
    margin: 0;
    list-style: none;
}

    .pageLinks li {
        display: inline-block;
        width: 16.6%;
        float: left;
        border-bottom: 1px solid #ccc;
        padding-bottom: 29px;
        text-align: center;
    }

        .pageLinks li a {
            font-size: 16px;
            color: #522e91;
            padding-bottom: 30px;
            border-bottom: 2px solid transparent;
            margin-bottom: 0px;
            line-height: 18px;
        }
            /*.pageLinks li:first-child  { text-align: left; }
.pageLinks li:last-child  { text-align: right; }*/
            .pageLinks li a.active, .pageLinks li a:hover, .pageLinks li a:focus {
                font-size: 16px;
                color: #f37421;
                text-decoration: none;
                border-bottom: 2px solid #f37421;
            }

    .pageLinks.tabview li {
        width: auto;
        padding: 0px;
    }

        .pageLinks.tabview li a {
            padding: 9px 18px;
            display: block;
            border-width: 1px 1px 1px 1px;
            border-style: solid;
            border-color: #ccc;
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
        }

            .pageLinks.tabview li a.active, .pageLinks.tabview li a:hover, .pageLinks.tabview li a:focus {
                background-color: #f37421;
                color: #fff;
            }

.bgSLgraygrdnt {
    background: rgba(238,238,238,1);
    background: -moz-linear-gradient(top, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(238,238,238,1)), color-stop(100%, rgba(255,255,255,1)));
    background: -webkit-linear-gradient(top, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 100%);
    background: -o-linear-gradient(top, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 100%);
    background: -ms-linear-gradient(top, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 100%);
    background: linear-gradient(to bottom, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff', GradientType=0 );
}

.bgSLgraygrdnt1 {
    background: rgba(255,255,255,1);
    background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(238,238,238,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(100%, rgba(238,238,238,1)));
    background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(238,238,238,1) 100%);
    background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(238,238,238,1) 100%);
    background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(238,238,238,1) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(238,238,238,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0 );
}

.contentlogoImage {
    min-height: 400px;
    padding-top: 40px;
}

.cntntlogo {
    width: 110px;
    height: 110px;
    margin: 0 auto;
    background-image: url('../images/dynamic.png');
    background-image: url('../images/dynamic.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.brandsAndsrvc {
    padding: 30px 0px;
}

.fullWidth {
    width: 100%;
    float: left;
}

.brandBox {
    width: auto;
    float: left;
    padding: 0px 12px;
}

.brandlogo {
    width: 75px;
    height: 75px;
    margin: 10px 4px;
    float: left;
}

.brandTitle {
    display: block;
    width: 100%;
    font-size: 16px;
    color: #522e91;
    text-align: center;
    text-transform: uppercase;
    margin: 10px;
}

.sourcing1 {
    background-image: url('../images/sourcing-1.png');
    background-image: url('../images/sourcing-1.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.sourcing2 {
    background-image: url('../images/sourcing-2.png');
    background-image: url('../images/sourcing-2.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.sourcing3 {
    background-image: url('../images/sourcing-3.png');
    background-image: url('../images/sourcing-3.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.website1 {
    background-image: url('../images/website-1.png');
    background-image: url('../images/website-1.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.website2 {
    background-image: url('../images/website-2.png');
    background-image: url('../images/website-2.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.mobile1 {
    background-image: url('../images/mobile-1.png');
    background-image: url('../images/mobile-1.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.mobile2 {
    background-image: url('../images/mobile-2.png');
    background-image: url('../images/mobile-2.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.lead1 {
    background-image: url('../images/lead-1.png');
    background-image: url('../images/lead-1.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.lead2 {
    background-image: url('../images/lead-2.png');
    background-image: url('../images/lead-2.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.lead3 {
    background-image: url('../images/lead-3.png');
    background-image: url('../images/lead-3.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.trade1 {
    background-image: url('../images/trade-1.png');
    background-image: url('../images/trade-1.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.trade2 {
    background-image: url('../images/trade-2.png');
    background-image: url('../images/trade-2.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.trade3 {
    background-image: url('../images/trade-3.png');
    background-image: url('../images/trade-3.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.software1 {
    background-image: url('../images/software-1.png');
    background-image: url('../images/software-1.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.software2 {
    background-image: url('../images/software-2.png');
    background-image: url('../images/software-2.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.information1 {
    background-image: url('../images/information-1.png');
    background-image: url('../images/information-1.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.information2 {
    background-image: url('../images/information-2.png');
    background-image: url('../images/information-2.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.benefits1 {
    background-image: url('../images/benefits-1.png');
    background-image: url('../images/benefits-1.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.benefits2 {
    background-image: url('../images/benefits-2.png');
    background-image: url('../images/benefits-2.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}


.our-brands-bg {
    background-image: url('../images/brand-bg.png');
    background-position: bottom 5px center;
}

.our-brands-block-title h3 {
    background-color: #522e91;
    padding: 20px;
    margin: 0;
    text-align: center;
    font-size: 34px;
    font-weight: 400;
    color: #ffffff;
    text-transform: uppercase;
}

.our-brands-block-title table {
    width: 100%;
}

    .our-brands-block-title table tr td {
        border: 1px solid #333333;
        text-align: center;
    }

        .our-brands-block-title table tr td img {
            display: inline;
            width: 250px;
            max-width: 100%;
            margin: 5px 10px;
        }

        .our-brands-block-title table tr td h4 {
            font-weight: 600;
            margin: 5px 0 0;
        }

.our-brands-blocks h3 {
    margin: 0 0 15px;
}

    .our-brands-blocks h3 a {
        display: block;
        color: #f37421;
        font-weight: 400;
        border-bottom: 1px solid #f37421;
        padding: 10px 0 15px;
    }

        .our-brands-blocks h3 a:hover, .our-brands-blocks h2 a:focus {
            text-decoration: none;
        }

.our-brands-blocks p {
    font-size: 15px;
    font-weight: 400;
}

.our-brands-blocks .block {
    margin: 0 0 20px;
}

.our-brands-blocks .statsToggle {
    margin: 0 0 20px;
}

.our-brands-blocks .toggleContainer img {
    max-width: 100%;
}

.our-brands-blocks ul.list-with-icon {
    padding: 0;
}

    .our-brands-blocks ul.list-with-icon li {
        list-style: none;
        padding-left: 30px;
        background-image: url('../images/list-right-arrow.png');
        background-repeat: no-repeat;
        background-size: 24px;
        background-position: left center;
    }

.accordionSection {
    padding: 30px 0px;
}

    .accordionSection .panel {
        width: 100%;
        float: left;
    }

    .accordionSection .panel-collapse {
        width: 100%;
        float: left;
    }

    .accordionSection h3 {
        width: 100%;
        float: left;
        height: 100px;
        position: relative;
        background-size: 100px;
        background-position: center left;
    }

        .accordionSection h3 span {
            position: absolute;
            bottom: 0px;
            left: 120px;
        }

    .accordionSection a {
        font-size: 16px;
        color: #f37421;
        text-decoration: none;
    }

        .accordionSection a:hover, .accordionSection a:focus {
            font-size: 16px;
            color: #f37421;
            text-decoration: none;
        }

    .accordionSection hr {
        border-top: 1px solid #DEDEDE;
        margin: 30px 0px;
    }

    .accordionSection .btn {
        width: 250px;
        border-radius: 0;
        color: #fff !important;
    }

        .accordionSection .btn:focus {
            outline: 0;
            box-shadow: none;
        }

    .accordionSection .row {
        margin: 0px 0px 10px 0px;
    }

    .accordionSection .btn.btn-accordion {
        position: relative;
        width: 100% !important;
        float: left;
        color: #522e91 !important;
        font-size: 20px !important;
        background-color: #ccc;
        border-color: #ccc;
        padding: 10px 40px 10px 15px;
        position: relative;
        margin-bottom: 10px;
        text-align: left;
    }

        .accordionSection .btn.btn-accordion.collapsed span {
            position: absolute;
            top: 14px;
            right: 15px;
            width: 20px;
            height: 20px;
            background-color: #f37421;
            background-image: url('../images/plus.png');
            background-image: url('../images/plus.svg');
            background-repeat: no-repeat;
            background-size: 18px;
            background-position: center;
        }

        .accordionSection .btn.btn-accordion span {
            position: absolute;
            top: 14px;
            right: 15px;
            width: 20px;
            height: 20px;
            background-color: #f37421;
            background-image: url('../images/minus.png');
            background-image: url('../images/minus.svg');
            background-repeat: no-repeat;
            background-size: 18px;
            background-position: center;
        }

    .accordionSection .collapse, .accordionSection .collapse.in {
        width: 100%;
        float: left;
    }

.collapsing {
    -webkit-transition-timing-function: ease;
    -o-transition-timing-function: ease;
    transition-timing-function: ease;
    -webkit-transition-duration: .35s;
    -o-transition-duration: .35s;
    transition-duration: .35s;
    -webkit-transition-property: height,visibility;
    -o-transition-property: height,visibility;
    transition-property: height,visibility
}

/*-- Register Form page CSS ----*/
.cmpnyMngr h1, .cmpnyMngr h2, .cmpnyMngr h3, .cmpnyMngr h4, .cmpnyMngr h5, .cmpnyMngr h6 {
    color: #522e91 !important;
    margin-top: 10px;
}

.cmpnyMngr hr {
    border-top: 1px solid #ccc;
}

.cmpnyMngr label {
    color: #522e91;
    font-weight: 400;
    display: block;
    font-size: 16px;
}

.cmpnyMngr input {
    display: block;
    width: 100%;
    border: 0;
    height: 45px;
    padding: 10px;
    margin-top: 5px;
    font-size: 16px;
}

.cmpnyMngr .btn {
    border-radius: 0;
    color: #fff;
    font-size: 18px;
}

.passwordChange {
    padding: 20px;
    margin: 40px 0px 20px;
}

.cmpnyMngr .btn.pswrdchange {
    margin-top: 25px;
}

.cmpnyMngr input:focus, .cmpnyMngr select:focus, .cmpnyMngr textarea:focus {
    outline: 0;
}


.supplierLists {
    padding: 20px;
}

    .supplierLists [class^="col-"] {
    }

.supplierList {
    padding: 0px 10px 0px 15px;
}
/*.supplierSelection { padding: 0px 10px 0px 10px; }*/
.supplierSelected {
    padding: 0px 15px 0px 0px;
}

    .supplierSelected .row {
        margin: 0px;
    }

.cmpnyMngr select {
    width: 100%;
    border: 0;
    min-height: 552px;
    padding: 6px;
    margin-top: 5px;
    font-size: 14px;
}

.cmpnyMngr .supplierSelected select {
    min-height: 162px;
}

.selectBtns {
    margin-top: 27px;
    width: 60px;
    float: left;
    padding-right: 10px;
}

    .selectBtns .btn {
        width: 100%;
        height: 76px;
        margin-bottom: 8px;
        background-color: #d3d3d3;
        color: #522e91;
        position: relative;
    }

        .selectBtns .btn:hover, .selectBtns .btn:focus {
            box-shadow: none;
            background-color: #f37421;
            color: #ffffff;
        }

        .selectBtns .btn span.rightArrow {
            background-image: url('../images/right-arrow-navi.png');
            background-image: url('../images/right-arrow-navi.svg');
            background-repeat: no-repeat;
            background-size: 18px;
            background-position: center;
            position: absolute;
            width: 20px;
            height: 20px;
            left: 0;
            right: 0;
            top: 0;
            bottom: 0;
            margin: auto;
        }

        .selectBtns .btn:hover span.rightArrow, .selectBtns .btn:focus span.rightArrow {
            background-image: url('../images/right-arrow.png');
            background-image: url('../images/right-arrow.svg');
        }

        .selectBtns .btn span.leftArrow {
            background-image: url('../images/left-arrow-navi.png');
            background-image: url('../images/left-arrow-navi.svg');
            background-repeat: no-repeat;
            background-size: 18px;
            background-position: center;
            position: absolute;
            width: 20px;
            height: 20px;
            left: 0;
            right: 0;
            top: 0;
            bottom: 0;
            margin: auto;
        }

        .selectBtns .btn:hover span.leftArrow, .selectBtns .btn:focus span.leftArrow {
            background-image: url('../images/left-arrow.png');
            background-image: url('../images/left-arrow.svg');
        }

.supplierslctdLists {
    width: 87%;
    float: right;
}

.checkFor label {
    margin-top: 32px;
    float: right;
}

.checkFor input {
    width: auto;
    height: auto;
    float: left;
    margin: 5px 10px;
    display: none;
}

.cr {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    float: left;
    margin: 3px 8px;
    background-color: #bbb;
}

.addUsers {
    padding: 20px;
    margin: 20px 0px;
}

    .addUsers select {
        min-height: 45px;
    }

.cmpnyMngr .addUsers .btn {
    margin-top: 25px;
}

.removeUsers {
    padding: 20px;
    margin: 20px 0px 40px;
}

    .removeUsers select {
        min-height: 45px;
    }

.cmpnyMngr .removeUsers .btn {
    margin-top: 25px;
}

.checkFor input[type="checkbox"]:checked + .cr > .cr-icon {
    transform: scale(1) rotateZ(0deg);
    opacity: 1;
    transition: all .3s ease-in;
    background-image: url('../images/checked.png');
    background-image: url('../images/checked.svg');
    background-repeat: no-repeat;
    background-size: 14px;
    background-position: center;
    background-color: #f37421;
    position: absolute;
    width: 20px;
    height: 20px;
    left: 0;
    top: 0;
}

.checkFor input[type="checkbox"] + .cr > .cr-icon {
    transform: scale(1) rotateZ(-10deg);
    opacity: 0;
    transition: all .3s ease-in;
}

.checkFor .cr .cr-icon {
    position: absolute;
    font-size: .8em;
    line-height: 0;
    top: 50%;
    left: 20%;
}


.cmpnyMngr::-webkit-scrollbar {
    width: 12px;
}

.cmpnyMngr::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px #8981A7;
    border-radius: 0px;
    background-color: #8981A7;
}

.cmpnyMngr::-webkit-scrollbar-thumb {
    border-radius: 0px;
    -webkit-box-shadow: inset 0 0 6px #522e91;
    background-color: #522e91;
}

table thead tr th {
    font-size: 18px;
    color: #f37421;
    font-weight: normal;
    padding-bottom: 10px;
}

table tbody tr td {
    font-size: 14px;
    color: #522e91;
    font-weight: normal;
    padding: 5px;
}

table tbody tr.bggray {
    background-color: #e2e2e2;
}

table tbody tr td.checkFor label {
    margin: 0;
    float: left;
}

.footable-row-detail {
    border-bottom: 1px solid #ccc;
}

    .footable-row-detail td {
        padding: 0px 10px 10px;
    }

.footable-first-column {
    font-weight: 600;
}




.footable.breakpoint > tbody > tr > td > span.footable-toggle:before {
    content: '';
}

.footable-toggle {
    width: 12px;
    height: 13px;
    margin: 0px 5px -1px 0px;
    background-color: #f37421;
    background-image: url('../images/plus.png');
    background-image: url('../images/plus.png');
    background-repeat: no-repeat;
    background-size: 12px;
    background-position: center;
}

.footable.breakpoint > tbody > tr.footable-detail-show > td > span.footable-toggle:before {
    content: '';
}

.footable-detail-show .footable-toggle {
    background-image: url('../images/minus.png');
    background-image: url('../images/minus.png');
}

/*-- Customer Area Form page CSS ----*/
.customerArea {
    padding-bottom: 30px;
}

.customerAreahead {
    padding: 20px 0px 40px;
}

.companyInfo {
    margin: 0px 0px 20px;
}
/*.companyInfo [class^="col-"], .companyInfo [class*=" col-"] { padding: 0px 20px 0px 0px; }
.companyInfo [class^="col-"]:last-child, .companyInfo [class*=" col-"]:last-child { padding: 0px 0px 0px 0px; }*/
.borderBox {
    position: relative;
    border: 1px solid #e0e0e0;
    background-color: #fff;
    padding: 10px 20px;
    width: 300px;
    margin-right: 20px;
    min-height: 345px;
    float: left;
}

    .borderBox.twoWidth {
        width: 620px;
    }

    .borderBox:last-child {
        margin-right: 0px;
    }

    .borderBox.withImage {
        padding: 0;
    }

        .borderBox.withImage img {
            width: 100%;
        }

        .borderBox.withImage.bgOrnge {
            background-color: #f37421 !important;
        }

    .borderBox a {
        float: none;
    }

        .borderBox a:hover {
            text-decoration: none;
        }

.companyInfo h3 {
    color: #522e91 !important;
    margin-top: 15px;
}

.companyInfo hr {
    margin: 15px 0px 10px 0px;
}

.companyInfo ul {
    padding: 0px;
    margin: 0px 0px 15px 0px;
    list-style: none;
}

    .companyInfo ul li {
        padding: 0px;
        color: #522e91;
    }

        .companyInfo ul li span {
            float: right;
        }

        .companyInfo ul li a {
            color: #522e91;
        }

            .companyInfo ul li a:hover {
                color: #f37421;
            }

.companyInfo .borderBox ul li a.right {
    float: right;
}

.companyInfo .borderBox p {
    font-size: 14px !important;
}

.companyInfo ul li select {
    border: 0;
    background-color: transparent;
}

    .companyInfo ul li select:focus {
        outline: 0;
    }

.companyInfo .borderBox ul li .styledSelect {
    float: right;
    background-image: url('../images/down-arrow-navi.png');
    background-image: url('../images/down-arrow-navi.svg');
    background-repeat: no-repeat;
    background-size: 10px;
    background-position: center right 2px;
}

.companyInfo .borderBox ul li select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    text-indent: 1px;
    text-overflow: '';
    padding: 0px 20px 0px 0px;
}

.sectionPadding {
    padding: 20px 0px 30px;
}


ul.stripped li {
    padding: 5px;
}

    ul.stripped li:nth-child(even) {
        background-color: #f2f2f2;
    }

.companyInfo .btn {
    position: absolute;
    left: 20px;
    bottom: 25px;
    width: 258px;
    color: #fff;
    border-radius: 0;
    font-size: 18px;
}

    .companyInfo .btn.two {
        bottom: 75px;
    }

    .companyInfo .btn:hover {
        color: #fff !important;
    }

.companyInfo .twoButtons table .btn {
    position: static;
    margin: 0 0 10px;
}

.companyInfo .product-search .input {
    width: calc(100% - 75px);
}

    .companyInfo .product-search .input input {
        width: 100%;
    }

.companyInfo .product-search .btn {
    position: relative;
    width: auto;
    left: auto;
    bottom: auto;
    font-size: 14px;
    border-radius: 4px;
}

    .companyInfo .product-search .btn:focus {
        outline: none;
        border: 0;
    }

.marketAnalysis {
    padding-top: 20px;
}

.marketPlaceinfo [class^="col-"]:first-child {
    padding: 0px 20px 0px 0px;
}

.marketPlaceinfo [class^="col-"]:last-child {
    padding: 0px 0px 0px 20px;
}

.marketPlaceinfo h3 {
    color: #f37421 !important;
}

.marketPlaceinfo a {
    display: block;
    color: #f37421;
}

.marketPlacebox {
    padding: 0px 5px;
}

.companyInfo .borderBox1 ul li a.right {
    float: right;
}

.companyInfo .borderBox1 p {
    font-size: 14px !important;
}

.borderBox1 {
    position: relative;
    border: 0;
    padding: 10px 10px;
    width: 232px;
    margin-right: 0px;
    min-height: 320px;
    float: left;
}

    .borderBox1:last-child {
        margin-right: 0px;
    }

.marketPlacebox h4 {
    min-height: 40px;
}

.marketPlacebox hr {
    border-top: 1px solid #ccc;
}

.first .borderBox1 {
    min-height: 275px;
}

.second .borderBox1 {
    min-height: 360px;
}

.marketAnalysis .companyInfo .btn {
    width: 212px;
    left: 10px;
}

/*-- Register Form page CSS ----*/

.contactDetails {
    padding: 20px 0px 50px;
}

    .contactDetails a {
        color: #f37421;
    }

        .contactDetails a:hover, .contactDetails a:focus {
            color: #f37421;
        }

    .contactDetails ul {
        padding: 0px;
        list-style: none;
        color: #522e91;
    }

        .contactDetails ul li {
            font-size: 16px;
        }

            .contactDetails ul li span {
                color: #f37421;
            }

            .contactDetails ul li a {
                color: #522e91;
            }

                .contactDetails ul li a:hover, .contactDetails ul li a:focus {
                    color: #f37421;
                }

.canHelp a {
    color: #f37421;
}

.contactDetails .btn {
    width: 250px;
    border-radius: 0;
    color: #fff !important;
}

#map {
    height: 395px;
}

.dynamicImage {
    position: relative;
    padding-left: 120px;
}

.dynamic {
    position: absolute;
    width: 100px;
    height: 100px;
    top: -6px;
    left: 0;
    background-image: url('../images/dynamic.png');
    background-image: url('../images/dynamic.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}



/*-- Registerf Form page CSS ----*/

.registerForm input[type="text"], .registerForm input[type="tel"], .registerForm input[type="email"], .registerForm input[type="password"], .registerForm select {
    padding: 17px 8px 0 8px;
    color: #522e91;
    -moz-transition: color 150ms ease-out, background-color 100ms ease-in, border-color 150ms ease-out;
    -o-transition: color 150ms ease-out, background-color 100ms ease-in, border-color 150ms ease-out;
    -webkit-transition: color 150ms ease-out, background-color 100ms ease-in, border-color 150ms ease-out;
    transition: color 150ms ease-out, background-color 100ms ease-in, border-color 150ms ease-out;
    -moz-appearance: none;
    -webkit-appearance: none;
    border-radius: 0;
    text-indent: 0;
    position: relative;
    background-color: #f9f9f9;
    font-family: "HelveticaNeueW02-75Bold", Helvetica, Arial, sans-serif;
    font-size: 18px;
    height: 45px;
    width: 100%;
    border: 1px solid #c9c9c9;
    box-sizing: border-box;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    margin-bottom: 20px;
}

.registerForm select {
    margin-bottom: 0px;
    background-image: url('../images/downarrow.png');
    background-repeat: no-repeat;
    background-size: 15px;
    background-position: center right 10px;
}

.registerForm label.fl-label {
    color: #6F6F6F;
    font-size: 15px;
    top: 12px;
}

.registerForm label.fl-typing, .registerForm label.fl-filled {
    top: 5px;
    font-size: 11px;
    color: #522e91;
}

.registerForm span.error, .registerForm label.error, .registerForm small.help-block {
    top: 5px;
    font-size: 11px;
}

.registerForm .btn.submit {
    width: 200px;
    height: 50px;
    color: #fff;
    font-size: 18px;
    line-height: 36px;
    margin-top: 30px;
}


/*---- My Basket Page ----*/
.no-basket-list {
    margin: 20px 0 0;
    min-height: 100px;
}

.mybasketListshead {
    margin-top: 20px;
}

.backBtn {
    color: #fff;
    font-weight: 500;
    width: 90px;
    min-height: 45px;
    float: left;
    padding: 11px 10px 11px 35px;
    background-image: url('../images/left-arrow.png');
    background-image: url('../images/left-arrow.svg');
    background-repeat: no-repeat;
    background-size: 15px;
    background-position: center left 12px;
    font-size: 16px;
}

    .backBtn:hover, .backBtn:focus {
        color: #fff;
        text-decoration: none;
    }

.mybasketListshead .selectRemove label {
    color: #f37421;
    font-size: 18px;
}

.mybasketListshead .selectRemove .checkFor {
    left: 0px;
}

    .mybasketListshead .selectRemove .checkFor .cr {
        margin: 5px 8px;
    }

.mybasketListshead .selectRemove .remove {
    right: 20px;
    bottom: 10px;
}

.mybasketListshead, .mybasketListsfoot {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    background-color: #f5f5f5;
}

    .mybasketListshead .selectAlladdWidth, .mybasketListsfoot .selectAlladdWidth {
        width: auto;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
    }

        .mybasketListshead .selectAlladdWidth .checkFor, .mybasketListsfoot .selectAlladdWidth .checkFor {
            position: relative;
            right: auto;
            bottom: auto;
            margin-right: 10px;
        }

        .mybasketListshead .selectAlladdWidth .selectRemove, .mybasketListsfoot .selectAlladdWidth .selectRemove {
            width: auto;
        }

.mybasketListsfoot {
    margin: 20px 0;
}

    .mybasketListshead .selectRemove, .mybasketListsfoot .selectRemove {
        min-height: 45px;
    }

.mySupplierbasketLists {
    background-color: #ffffff;
    width: 100%;
    float: left;
}

    .mySupplierbasketLists ul.tradesupplerLists {
        margin-bottom: 20px;
    }

        .mySupplierbasketLists ul.tradesupplerLists > li {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
        }

            .mySupplierbasketLists ul.tradesupplerLists > li h5 {
                width: 100%;
            }

            .mySupplierbasketLists ul.tradesupplerLists > li .contacInfo {
                width: 350px;
            }

            .mySupplierbasketLists ul.tradesupplerLists > li .productRange {
                width: 630px;
                padding: 0 20px;
                display: flex;
            }

            .mySupplierbasketLists ul.tradesupplerLists > li .addtoShotgun {
                width: 160px;
            }

            .mySupplierbasketLists ul.tradesupplerLists > li .contacInfo > ul li span {
                width: 120px;
            }

.getsupplier.icons-list ul li {
    background-color: #DFDFDF;
    border: 0;
}

.mySupplierbasketLists ul.tradesupplerLists > li .productRange .prdctinfo {
    display: flex;
    flex-direction: column;
}

    .mySupplierbasketLists ul.tradesupplerLists > li .productRange .prdctinfo .productDetails {
        flex: 1 1 auto;
    }

.mySupplierbasketLists ul.tradesupplerLists > li .productRange .addbasket {
    background-color: #001CFF;
    padding: 6px;
    display: inline-block;
    width: 150px;
    height: auto;
    border-radius: 6px;
    margin: 0 0 5px;
    text-align: center;
}

    .mySupplierbasketLists ul.tradesupplerLists > li .productRange .addbasket i {
        font-size: 18px;
        margin-right: 5px;
    }

.mybasketListsbtns {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin: 20px 0 0;
}

    .mybasketListsbtns .btn {
        color: #fff;
        font-size: 18px;
        font-weight: 500;
        text-align: left; /*width: 217px;*/
        margin-right: 20px;
        border-radius: 0;
        min-height: 45px;
        padding: 10px 15px 10px 50px;
        background-repeat: no-repeat;
        background-size: 35px;
        background-position: center left 10px;
    }

        .mybasketListsbtns .btn:last-child {
            margin-right: 0px;
        }

        .mybasketListsbtns .btn:focus {
            outline: 0;
        }

.createIdeas {
    background-image: url('../images/idealist.png');
    background-image: url('../images/idealist.svg');
}

.createQuotation {
    background-image: url('../images/quptation.png');
    background-image: url('../images/quptation.svg');
}

.createEshot {
    background-image: url('../images/eshot.png');
    background-image: url('../images/eshot.svg');
}

.getPrices {
    background-image: url('../images/price.png');
    background-image: url('../images/price.svg');
}

.pobasket {
    background-image: url('../images/basket.png');
    background-image: url('../images/basket.svg');
    background-size: 30px !important;
    background-position: center left 15px !important;
}

.newSearch {
    color: #fff;
    font-weight: 500;
    width: 160px;
    min-height: 45px;
    float: right;
    padding: 11px 10px 11px 50px;
    background-image: url('../images/search.png');
    background-image: url('../images/search.svg');
    background-repeat: no-repeat;
    background-size: 20px;
    background-position: center left 15px;
    font-size: 16px;
}

    .newSearch:hover, .newSearch:focus {
        color: #fff;
        text-decoration: none;
    }

.hasTooltip {
    position: relative;
}

.mybasketLists {
    padding: 0;
    margin: 0;
    list-style: none;
    width: 100%;
    float: left;
}

    .mybasketLists > li {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        padding: 15px 10px;
        margin: 0;
        border-bottom: 1px solid #e1e1e1;
    }
        /*.mybasketLists > li:last-child { border-bottom: 0px solid #e1e1e1; }*/
        .mybasketLists > li .listImage {
            width: 100px;
            height: 100px;
            text-align: center;
        }

        .mybasketLists > li .listContent {
            width: 770px;
            padding: 0 20px;
        }

            .mybasketLists > li .listContent ul {
                margin: 10px 0;
            }

        .mybasketLists > li .productTable {
            width: 100%;
            margin: 10px 0 0;
        }

.listImage {
    width: 150px;
    float: left;
    position: relative;
}

    .listImage img {
        width: 65px;
        margin: 15%;
    }

.listContent {
    width: 430px;
    float: left;
}

    .listContent h4 {
        color: #522e91 !important;
    }

    .listContent p {
        color: #666666 !important;
        font-size: 14px !important;
        margin-bottom: 5px;
        font-family: "Arial", sans-serif;
    }

    .listContent .calculator-icon {
        cursor: pointer;
    }

        .listContent .calculator-icon img {
            width: 40px;
        }

.selectRemove {
    width: 250px;
    float: right;
    position: relative;
    min-height: 115px;
}

    .selectRemove .checkFor {
        position: absolute;
        left: 10px;
        bottom: 10px;
    }

        .selectRemove .checkFor .cr {
            background-color: #fff;
            border-radius: 5px;
            border: 1px solid #ccc;
            width: 16px;
            height: 16px;
        }

        .selectRemove .checkFor input[type="checkbox"]:checked + .cr > .cr-icon {
            border-radius: 5px;
            border: 1px solid #f37421;
            width: 16px;
            height: 16px;
            background-size: 10px;
            top: -1px;
            left: -1px;
        }

        .selectRemove .checkFor label {
            margin: 0;
        }

    .selectRemove .remove {
        position: absolute;
        right: 0px;
        bottom: 7px;
    }

    .selectRemove label {
        color: #666;
        margin-bottom: 0;
        cursor: pointer;
    }

.removeallSupplier {
    width: 100px;
    height: 45px;
    display: block;
    padding: 12px;
    color: #fff;
    text-align: center;
    font-weight: 500;
    margin: 0 auto;
}

    .removeallSupplier:hover {
        color: #fff;
        text-decoration: none;
    }

.rmvfrmbasket {
    float: right;
    width: 25px;
    height: 25px;
    background-image: url('../images/close.png');
    background-image: url('../images/close.svg');
    background-repeat: no-repeat;
    background-size: 12px;
    background-position: center;
    cursor: pointer;
    margin-left: 10px;
    border-radius: 6px;
}

.bold {
    font-weight: 500;
}

.textOrnge {
    color: #f37421;
}

.textNavi {
    color: #522e91;
}

.listContent .smallrund {
    position: relative;
    width: 22px;
    height: 22px;
    float: left;
    margin: 0px 10px 0px 0px;
    color: #fff;
    border-radius: 50%;
    text-align: center;
    padding: 0px;
}

    .listContent .smallrund .icon-info:before {
        font-size: 20px;
    }


/*-- Trade Service Suppliers Page ----*/
.tradeSuppliers .nav-tabs.nav-justified > li > a {
    border-bottom: 0px;
}

.tradeSuppliers .nav-tabs.nav-justified > .active > a, .tradeSuppliers .nav-tabs.nav-justified > .active > a:focus, .tradeSuppliers .nav-tabs.nav-justified > .active > a:hover {
    border: 0px solid #ddd;
}

.tradeSuppliers .nav-tabs.nav-justified > a, .tradeSuppliers .nav-tabs.nav-justified > a:focus, .tradeSuppliers .nav-tabs.nav-justified > a:hover {
    border: 0px solid #ddd;
}

.tradeSuppliers .nav-tabs > li > a {
    color: #f37421;
    font-size: 16px;
    border: 0;
    display: inline-block;
    background-color: #f5f5f5;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

    .tradeSuppliers .nav-tabs > li > a:focus {
        color: #f37421;
        font-size: 16px;
        border: 0;
    }

    .tradeSuppliers .nav-tabs > li > a:hover, .tradeSuppliers .nav-tabs > li > a:focus {
        color: #f37421;
        font-size: 16px;
        text-decoration: underline;
        cursor: pointer;
    }

.tradeSuppliers .nav-tabs > li.active > a {
    font-size: 20px;
    color: #522e91;
    font-weight: 400;
    background-color: #e5e5e5;
}

    .tradeSuppliers .nav-tabs > li.active > a:hover, .tradeSuppliers .nav-tabs > li.active > a:focus {
        color: #522e91;
        font-size: 20px;
        text-decoration: none;
        cursor: text;
        border: 0;
    }

.tradeSuppliers .nav-tabs > li:first-child {
    text-align: left;
}

.tradeSuppliers .nav-tabs > li:last-child {
    text-align: right;
}

.tradeSuppliers .mybasketListshead {
    margin-top: 0;
}

.selectAlladd {
    width: 130px;
    float: right;
    position: relative;
    min-height: 45px;
}

    .selectAlladd .checkFor {
        position: absolute;
        right: 10px;
        bottom: 10px;
    }

    .selectAlladd.Foot .checkFor {
        right: 0px;
    }

    .selectAlladd .checkFor .cr {
        background-color: #fff;
        border-radius: 5px;
        border: 1px solid #ccc;
        width: 16px;
        height: 16px;
        margin: 5px 8px;
    }

    .selectAlladd .checkFor input[type="checkbox"]:checked + .cr > .cr-icon {
        border-radius: 5px;
        border: 1px solid #f37421;
        width: 16px;
        height: 16px;
        background-size: 10px;
        top: -1px;
        left: -1px;
    }

    .selectAlladd .checkFor label {
        color: #f37421;
        font-size: 18px;
        margin: 0;
        font-weight: normal;
    }

    .selectAlladd label {
        color: #666;
        margin-bottom: 0;
        cursor: pointer;
    }

.tradesupplerLists {
    margin: 0px;
    padding: 0;
    width: 100%;
    float: left;
    list-style: none;
}

    .tradesupplerLists > li {
        margin: 0px;
        padding: 10px 0px 15px;
        width: 100%;
        float: left;
        border-bottom: 1px solid #ccc;
    }

        .tradesupplerLists > li h5 {
            color: #522e91 !important;
            font-size: 16px;
        }

.contacInfo {
    width: 320px;
    float: left;
}

    .contacInfo > ul {
        margin: 0px;
        padding: 0;
        width: 100%;
        list-style: none;
    }

        .contacInfo > ul li {
            margin: 0px;
            padding: 0;
            width: 100%;
            display: block;
            border-bottom: 0px solid #ccc;
        }

            .contacInfo > ul li span {
                color: #f37421;
                width: 65px;
                display: inline-block;
            }

            .contacInfo > ul li a, .contacInfo ul li a:hover, .contacInfo ul li a:focus {
                color: #522e91;
            }

    .contacInfo .info_circles {
        width: 100%;
        float: left;
        margin: 10px 0px;
    }

        .contacInfo .info_circles .smallrund, .browse-list .info_circles .smallrund { /*width: 26px; height: 26px; margin: 0px 10px 0px 0px; padding: 3px;*/
            border: 0px solid #522e91;
            border-radius: 50%;
        }

            .contacInfo .info_circles .smallrund span, .browse-list .info_circles .smallrund span {
                color: #fff;
                font-size: 12px;
            }

.productRange {
    width: 620px;
    float: left;
    min-height: 150px;
}

    .productRange h4 {
        margin: 0px 0 5px;
        font-size: 16px;
    }

    .productRange p {
        font-size: 14px !important;
        color: #666 !important;
    }

        .productRange p a, .productRange p a:hover {
            color: #f37421;
        }

.customBtns .btn {
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    text-align: left;
    width: 220px;
    margin-right: 20px;
    border-radius: 0;
    min-height: 45px;
    padding: 10px 10px 10px 45px;
    background-repeat: no-repeat;
    background-size: 26px;
    background-position: center left 8px;
}

.supplierFull {
    background-image: url('../images/supplierrange.png');
    background-image: url('../images/supplierrange.svg');
}

.supplierTrigger {
    background-image: url('../images/suppliertigger.png');
    background-image: url('../images/suppliertigger.svg');
}

.addtoShotgun {
    width: 200px;
    float: left;
    min-height: 150px;
    position: relative;
}

    .addtoShotgun .checkFor {
        position: absolute;
        right: 0;
        top: 0;
    }

        .addtoShotgun .checkFor .cr {
            background-color: #fff;
            border-radius: 5px;
            border: 1px solid #ccc;
            width: 20px;
            height: 20px;
            margin: 1px 8px;
        }

        .addtoShotgun .checkFor label {
            color: #f37421;
            margin: 0;
            font-size: 16px;
            font-weight: normal;
            cursor: pointer;
        }

        .addtoShotgun .checkFor input[type="checkbox"]:checked + .cr > .cr-icon {
            left: -1px;
            top: -1px;
            border-radius: 5px;
        }

    .addtoShotgun .remove {
        position: absolute;
        right: 0;
        top: 30px;
    }

        .addtoShotgun .remove label {
            color: #666666;
            cursor: pointer;
        }

.sendShotgun {
    color: #fff;
    font-weight: 500;
    width: 175px;
    min-height: 45px;
    float: right;
    padding: 11px 10px 11px 50px;
    background-image: url('../images/shotgun.png');
    background-image: url('../images/shotgun.svg');
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: center left 10px;
    font-size: 16px;
}

    .sendShotgun:hover, .sendShotgun:focus {
        color: #fff;
        text-decoration: none;
    }

/*-- Send Shotgun Page ----*/

.sendShotgunform {
    background-color: #e5e5e5;
    width: 100%;
    float: left;
    padding: 20px 0px 40px;
}

    .sendShotgunform .fieldRow {
        width: 66%;
        float: none;
        margin: 10px auto;
    }

    .sendShotgunform label {
        width: 100%;
        float: left;
        font-size: 20px;
        color: #522e91;
        margin-bottom: 0px;
    }

        .sendShotgunform label span {
            color: #f37421;
            font-size: 14px;
            font-family: "Arial", sans-serif;
            font-weight: normal;
        }

    .sendShotgunform input {
        display: block;
        width: 100%;
        min-height: 35px;
        border: 0;
        padding: 10px 15px;
        padding-right: 15px !important;
        color: #666;
        font-size: 14px;
    }

    .sendShotgunform textarea {
        display: block;
        width: 100%;
        min-height: 120px;
        border: 0;
        margin-top: 5px;
        padding: 10px 15px;
        color: #666;
        font-size: 14px;
    }

        .sendShotgunform input:focus, .sendShotgunform textarea:focus {
            outline: 0;
        }

    .sendShotgunform input[type="file"] {
        padding: 0;
    }

    .sendShotgunform input[type="submit"] {
        width: 165px;
        float: left;
        color: #fff;
        font-size: 16px;
        padding: 10px 15px 10px 50px;
    }

    .sendShotgunform label.fl-typing, .sendShotgunform label.fl-filled, .sendShotgunform span.error, .sendShotgunform label.error, .sendShotgunform small.help-block {
        top: auto;
        left: auto;
        position: relative;
        margin-top: 5px;
        color: #F64603;
    }


/*-- Quotation Creator Page ----*/

.quotationCreathead {
    margin-bottom: 15px;
}

.preview {
    float: right;
    position: relative;
}

    .preview .btn {
        width: 150px !important;
        padding: 10px 15px 10px 70px !important;
        color: #fff;
        border-radius: 0;
        float: right;
        margin-right: 0;
    }

.previewbtn {
    background-image: url('../images/preview.png');
    background-image: url('../images/preview.svg');
    background-size: 30px !important;
    background-position: center left 15px !important;
}

.quotationform {
    background-color: #e5e5e5;
    width: 100%;
    float: left;
    padding: 0px 0px 40px;
}

    .quotationform h3 {
        margin-top: 20px;
    }

    .quotationform .fieldRow {
        width: 70%;
        float: none;
        margin: 10px auto;
    }

    .quotationform label {
        width: 100%;
        float: left;
        font-size: 20px;
        color: #522e91;
        margin-bottom: 0px;
    }

        .quotationform label span {
            color: #f37421;
            font-size: 14px;
            font-family: "Arial", sans-serif;
            font-weight: normal;
        }

    .quotationform input {
        display: block;
        width: 100%;
        min-height: 35px;
        border: 0;
        padding: 10px 15px;
        padding-right: 15px !important;
        color: #666;
        font-size: 14px;
        border-radius: 0;
    }

    .quotationform textarea {
        display: block;
        width: 100%;
        min-height: 120px;
        border: 0;
        margin-top: 5px;
        padding: 10px 15px;
        color: #666;
        font-size: 14px;
        border-radius: 0;
    }

        .quotationform input:focus, .quotationform textarea:focus {
            outline: 0;
        }

    .quotationform input[type="file"] {
        padding: 0;
    }

    .quotationform input[type="submit"] {
        width: 165px;
        float: left;
        color: #fff;
        font-size: 16px;
        padding: 10px 15px 10px 50px;
    }

    .quotationform label.fl-typing, .quotationform label.fl-filled, .quotationform span.error, .quotationform label.error, .quotationform small.help-block {
        top: auto;
        left: auto;
        position: relative;
        margin-top: 5px;
        color: #F64603;
    }

.mypobasket .quotationform label span {
    cursor: pointer;
}

.quotationproduct {
    background-color: #e5e5e5;
    width: 100%;
    float: left;
    padding: 30px 30px;
    margin: 20px 0px 0px;
}

.qtnprdctImg {
    width: 105px;
    min-height: 105px;
    float: left;
    background-color: #fff;
    position: relative;
}
    /*.qtnprdctImg img { width: 40px; position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: auto; }*/
    .qtnprdctImg img {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        margin: auto;
    }

.qtnprdctdtls {
    width: 750px;
    float: left;
    padding-left: 20px;
}

    .qtnprdctdtls .fieldRow {
        width: 100%;
        float: left;
    }

    .qtnprdctdtls h4 {
        color: #522e91 !important;
        font-size: 16px;
    }

    .qtnprdctdtls label {
        width: 100%;
        display: block;
        color: #522e91;
        font-size: 15px;
    }

    .qtnprdctdtls textarea {
        display: block;
        width: 100%;
        min-height: 80px;
        border: 0;
        margin-top: 5px;
        padding: 10px 15px;
        color: #666;
        font-size: 14px;
        border-radius: 0;
    }

    .qtnprdctdtls input {
        display: block;
        width: 100%;
        min-height: 35px;
        border: 0;
        margin-top: 5px;
        padding: 10px 15px !important;
        color: #666;
        font-size: 14px;
        border-radius: 0;
    }

.costdtls {
}

    .costdtls .form-group {
        float: left;
        padding: 0px 10px;
    }

        .costdtls .form-group:first-child {
            padding: 0px 10px 0px 0px;
        }

        .costdtls .form-group:last-child {
            padding: 0px 0px 0px 10px;
        }

.qty {
    width: 80px;
}

.cost {
    width: 110px;
}

.selling {
    width: 145px;
}

.carriagecst {
    width: 145px;
}

.carriageslng {
    width: 150px;
}

.branddtls {
    width: 480px;
}

.prdctclr {
    width: 150px;
}

.origcost {
    width: 190px;
}

.origqty {
    width: 155px;
}

.origcostotle {
    width: 135px;
}

.origsellng {
    width: 150px;
}

.qtnprdctdtls .carriagetba label {
    width: 100%;
    float: left;
    margin: 10px 0px 20px;
    color: #666;
}

.qtnprdctdtls .carriagetba input[type="checkbox"] {
    display: none;
}

.qtnprdctdtls .carriagetba .cr {
    margin: 0px 10px 0px 0px;
    background-color: #fff;
    border: 1px solid #ccc;
}

.customBtns .remove {
    width: 120px !important;
    background-image: url('../images/close.png');
    background-image: url('../images/close.svg');
}

.replaceImage {
    margin-top: 15px;
}

    .replaceImage label {
        font-size: 20px;
        float: left;
    }

        .replaceImage label span {
            color: #f37421;
            font-size: 14px;
            font-family: "Arial", sans-serif;
            font-weight: normal;
        }

    .replaceImage input {
        padding: 0;
        width: auto;
        float: left;
    }

.upload {
    width: 130px !important;
    background-image: url('../images/upload.png');
    background-image: url('../images/upload.svg');
}

.bold {
    font-size: 16px;
}

.paddingTopbtm {
    padding: 15px 0px;
}

.paddingTop30 {
    padding-top: 30px;
}

.qtnprdctdtls hr {
    border-top: 1px solid #Ccc;
    width: 100%;
    float: left;
}

.qtnprdctdtls a {
    color: #666;
}

.selectCurrency {
    background-color: #e5e5e5;
    width: 100%;
    float: left;
    padding: 30px 20px;
    margin: 20px 0px 0px;
}

.CrncyImage {
    margin-left: 0px;
    background-color: transparent;
}

.selectCurrency .qtnprdctImg {
    width: 125px;
    min-height: 125px;
}

.selectCurrency .qtnprdctdtls {
    padding-left: 10px;
}

.dynamicOffice {
    width: 105px;
    height: 105px;
    background-image: url('../images/dynamic_office.png');
    background-image: url('../images/dynamic_office.svg');
    background-repeat: no-repeat;
    background-size: 105px;
    background-position: center;
}

.CrncyImage h5 {
    color: #522E91 !important;
}

.selectCurrency h3 {
    color: #522e91 !important;
    margin: 0;
}

.selectCurrency a {
    color: #f37421;
}

.selectCurrency select {
    margin: 15px 0px;
    width: 200px;
    border: 0;
    padding: 8px;
}

.download {
    width: 130px !important;
    margin-top: 20px;
    background-image: url('../images/download.png');
    background-image: url('../images/download.svg');
}

/*-- Quotation Doc Preview Page ----*/

.quotationdochead {
    margin-bottom: 15px;
}

    .quotationdochead .customBtns .btn {
        width: 110px;
        margin: 0px 1px 0px 0px;
        float: right;
        background-size: 20px;
        background-position: center left 12px;
    }

.send {
    background-image: url('../images/send.png');
    background-image: url('../images/send.svg');
}

.print {
    background-image: url('../images/print.png');
    background-image: url('../images/print.svg');
}

.amend {
    background-image: url('../images/left-arrow.png');
    background-image: url('../images/left-arrow.svg');
}

.colour {
    background-image: url('../images/color.png');
    background-image: url('../images/color.svg');
}

.quotationdochead .customBtns .btn.colour {
    background-size: 26px;
}

.quotationdochead .customBtns .btn.amend {
    background-size: 16px;
}

.quotation h3 {
    margin-bottom: 0px;
}

.quotationinfo {
    width: 750px;
    float: left;
    margin-top: -55px;
}

    .quotationinfo a {
        color: #666;
    }

    .quotationinfo span {
        margin-right: 10px;
    }

    .quotationinfo .full {
        width: 100%;
        float: left;
        padding: 10px 0px;
    }

    .quotationinfo .half {
        width: 320px;
        float: left;
        padding: 10px 0px;
    }

.spaceTopbtm {
    padding: 20px 15px;
}

.quotationdoc .qtnprdctdtls .costdtls .qty {
    width: 120px;
}

.quotationdoc .qtnprdctdtls .costdtls .cost {
    width: 170px;
}

.quotationdoc .qtnprdctdtls .costdtls .subtotal {
    width: 170px;
}

.quotationdoc .qtnprdctdtls .costdtls .carriagecst {
    width: 140px;
}

.originhead {
    margin-top: 30px;
}

.noteText {
    width: 100%;
    float: left;
}

    .noteText ul {
        padding: 0px 0px 0px 15px;
        margin: 10px 0px 0px;
    }

        .noteText ul li {
            font-weight: 500;
        }

.qtnprdctdtls .input-group.date {
    width: 240px;
}

.qtnprdctdtls .date input {
    margin-top: 0px;
    min-height: 37px;
}

.selectCurrency .qtnprdctdtls.customBtns .btn {
    margin: 15px 0px;
    width: 110px;
}

.quotationdocfoot {
    width: 100%;
    float: left;
    background-color: #f5f5f5;
    margin-top: 15px;
}

    .quotationdocfoot .customBtns .btn {
        width: 110px;
        margin: 0px 1px 0px 0px;
        padding: 10px 15px 10px 45px;
        float: right;
        background-size: 20px;
        background-position: center left 12px;
    }

        .quotationdocfoot .customBtns .btn.amend {
            background-size: 16px;
        }

.backBtn.top {
    width: 140px;
    background-image: url('../images/up-arrow.png');
    background-image: url('../images/up-arrow.svg');
}

.supplierDirectory .searchbyBox {
    padding: 10px 10px 10px 85px;
    position: relative;
    float: left;
    min-height: 60px;
}

.supplierDirectory .serachbyIcon {
    position: absolute;
    left: 0;
    top: 0;
    width: 75px;
    height: 100%;
    padding: 12px 8px;
    color: #fff;
    font-size: 27px;
    line-height: 45px;
    text-align: center;
}

.supplierDirectory .searchbyBox .icon-supplier {
    font-size: 34px;
    top: 0px;
    vertical-align: top;
}

.supplierDirectory .searchbyBox .btnSearch {
    width: 40px;
    height: 40px;
    margin-left: 10px;
}

    .supplierDirectory .searchbyBox .btnSearch i {
        font-size: 18px;
        color: #ffffff;
        line-height: 22px;
    }

.supplierDirectory .tradesupplerLists {
    margin-top: 20px;
    margin-bottom: 20px;
}

    .supplierDirectory .tradesupplerLists > li {
        padding: 20px 0px;
    }

    .supplierDirectory .tradesupplerLists .contacInfo > ul li span {
        width: 90px;
    }

.tradesupplierImages {
    margin-bottom: 20px;
}

.supplierDirectory .tradesupplerLists .icons-list {
    margin: 10px 0;
}

    .supplierDirectory .tradesupplerLists .icons-list ul.rounded li {
        border: 0;
    }

        .supplierDirectory .tradesupplerLists .icons-list ul.rounded li > span {
            font-size: 14px;
            padding: 5px;
        }

.supplierDirectory .tradesupplerLists .productRange h3 {
    margin: 0 0 12px;
}

.supplierDirectory .tradesupplerLists .inline-divs, .supplierDirectory .tradesupplerLists .productRange .inline-divs {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.contacInfo1 .info_circles {
    width: 100%;
    float: left;
    margin: 10px 0px;
}

    .contacInfo1 .info_circles .smallrund {
        width: 26px;
        height: 26px;
        margin: 0px 10px 0px 0px;
        padding: 3px;
    }

        .contacInfo1 .info_circles .smallrund span {
            color: #fff;
            font-size: 12px;
        }

.supplierDetails {
    background-image: url('../images/details.png');
}

/*.tradesupplierImage { position: relative; width: 220px; height: 150px; }
.tradesupplierImage img { position: absolute; width: auto; top: 0; bottom: 0; left: 0; right: 0; margin: auto; }*/

.contacInfo1 h3 {
    font-size: 20px;
    color: #522e91 !important;
    margin: 0px 0px 20px;
}

.supplierSearches ul li:last-child {
    border-bottom: 0px solid #ccc;
}

.quotationCreathead.ideaList .preview .btn {
    margin: 0px 1px 0px 0px;
    background-position: center left 15px;
    padding: 10px 15px 10px 55px !important;
}

.quotationCreatfoot.ideaList .preview .btn {
    margin: 0px 1px 0px 0px;
    background-position: center left 15px;
    padding: 10px 15px 10px 55px !important;
}

.quotationCreathead.getPricesbaskt .preview .btn {
    width: auto !important;
    margin: 0px 1px 0px 0px;
    background-position: center left 15px;
    padding: 10px 15px 10px 48px !important;
    background-size: 20px;
}

.requsetPrices {
    background-image: url('../images/send.png');
    background-image: url('../images/send.svg');
}

.ideaList .preview .btn {
    width: auto !important;
}

    .ideaList .preview .btn.newSearch {
        padding: 10px 15px 10px 54px !important;
    }

.getPricesbaskt.qtnprdctdtls input, .getPricesbaskt.qtnprdctdtls textarea {
    margin: 0px 0px 5px;
}

.colFour textarea {
    height: 103px;
}

.colSix textarea {
    height: 170px;
}

.getpricebasket {
    margin: 20px 0px;
}

.qtnprdctdtls .carriagetba.getpricebasket label {
    margin: 10px 0px 0px;
    font-size: 15px;
    color: #333;
    font-weight: normal;
}

.colFour {
    width: 225px;
}

.colSix {
    width: 325px;
}

.quotationdocfoot.getPricesbaskt .preview .btn {
    width: auto !important;
    margin: 0px 1px 0px 0px;
    background-position: center left 15px;
    padding: 10px 15px 10px 48px !important;
}

.idealistProducts {
    margin-top: 30px;
}

    .idealistProducts ul {
        padding: 0;
        margin: 0;
        list-style: none;
        border-top: 1px solid #e5e5e5;
    }

        .idealistProducts ul li {
            border-bottom: 1px solid #e5e5e5;
            width: 100%;
            float: left;
            padding: 30px 30px;
            margin: 0px 0px 0px;
        }

.readmorecontent {
    height: 80px;
    overflow: hidden;
    opacity: 1;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}

    .readmorecontent.open {
        height: 100%;
        opacity: 1;
        -webkit-transition: 0.5s;
        -moz-transition: 0.5s;
        -o-transition: 0.5s;
        transition: 0.5s;
    }

.readmorefade {
    text-align: right;
    margin-top: 10px;
}

    .readmorefade a {
        color: #f37421;
    }


/*--Serach Auto Complete CSS--*/
.ui-autocomplete {
    width: 352px !important;
}

    .ui-autocomplete li {
        width: 100%;
        float: left;
        padding: 5px;
        border-bottom: 1px solid #522e91;
    }

    .ui-autocomplete .ui-state-active, .ui-autocomplete .ui-widget-content .ui-state-active, .ui-autocomplete .ui-widget-header .ui-state-active, .ui-autocomplete a.ui-button:active, .ui-autocomplete .ui-button:active, .ui-autocomplete .ui-button.ui-state-active:hover {
        border: 1px solid #ffffff;
        background: transparent;
        font-weight: normal;
        color: #522e91;
    }

    .ui-autocomplete li a {
        float: left;
        padding: 0;
    }

    .ui-autocomplete li .thumb {
        width: 100px;
        float: left;
    }

    .ui-autocomplete li .desc {
        width: 210px;
        float: right;
    }

    .ui-autocomplete li .ui-state-active h1 {
        color: #f37421;
    }

    .ui-autocomplete li .desc h1 {
        font-size: 14px;
        margin-top: 3px;
    }

    .ui-autocomplete li .desc p {
        font-size: 14px;
    }

.ui-dialog {
    top: 15% !important;
    left: 20% !important;
}

.ui-widget-overlay {
    background: #0C0C0C;
    opacity: .7;
}

.container .dataTables_wrapper .dataTables_length {
    float: right;
}

    .container .dataTables_wrapper .dataTables_length label {
        color: #522e91;
        font-weight: 400;
    }

.container .dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 0em 0.5em;
}

.container .dataTables_wrapper .dataTables_paginate {
    padding-top: .5em;
}

.ui-dialog .ui-dialog-content {
    overflow: hidden !important;
}


/*---- General Css ----*/
.getsupplier {
    float: left;
    width: 100%;
}

    .getsupplier label {
        float: none;
        margin: 10px 0px 10px;
        color: #f37421;
        cursor: pointer;
    }

        .getsupplier label .cr {
            width: 18px;
            height: 18px;
            margin: 2px 8px;
            float: right;
            background-color: #fff;
            border: 1px solid #bbb;
            border-radius: 3px;
        }

            .getsupplier label .cr > .cr-icon {
            }

    .getsupplier.checkFor input[type="checkbox"]:checked + .cr > .cr-icon {
        background-color: #522e91;
        width: 16px;
        height: 16px;
        border: 0;
        border-radius: 3px;
        background-size: 12px;
    }

.sbasketcount {
    padding: 10px 0px;
    color: #522e91;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
}

    .sbasketcount a {
        display: flex;
        width: auto;
        font-weight: 500;
        font-size: 16px;
        color: #522e91;
    }

        .sbasketcount a:hover {
            text-decoration: none;
            opacity: 0.8;
        }

    .sbasketcount span.icon-supplierrange {
        color: #f37421;
        font-size: 20px;
        margin: 0px 8px;
    }

.getsupplier.info_circles .smallrund {
    width: 36px;
    height: 36px;
    padding: 6px;
}

    .getsupplier.info_circles .smallrund span:before {
        font-size: 21px;
        color: #fff;
    }

.contacInfo .getsupplier.info_circles .smallrund:hover .cusTooltip {
    bottom: 45px;
    left: -40px;
}

.tradesupplerLists .prdctimg {
    width: 100px;
    height: 100px;
    padding: 10px;
    float: left;
    position: relative;
    margin-right: 20px;
}

    .tradesupplerLists .prdctimg img {
        max-width: 100%;
    }

    .tradesupplerLists .prdctimg .imagerap {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 0;
        border-radius: 6px;
        background-color: transparent;
        background: transparent;
        background: -moz-linear-gradient(top, rgba(43,43,43,.10) 100%, rgba(43,43,43,.10) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(43,43,43,.10) 100%)), color-stop(100%, rgba(43,43,43,.10)));
        background: -webkit-linear-gradient(top, rgba(43,43,43,.10) 100%) 0%, rgba(43,43,43,.10) 100%);
        background: -o-linear-gradient(top, rgba(43,43,43,.10) 100%) 0%, rgba(43,43,43,.10) 100%);
        background: -ms-linear-gradient(to bottom, rgba(43,43,43,.10) 0%, rgba(43,43,43,.10) 100%);
        background: linear-gradient(to bottom, rgba(43,43,43,.10) 0%, rgba(43,43,43,.10) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#2b2b2b', GradientType=0 );
    }

.tradesupplerLists .prdctinfo {
    width: 80%;
    float: left;
    position: relative;
    min-height: 210px;
}

    .tradesupplerLists .prdctinfo h5 {
        margin-top: 0px;
    }

    .tradesupplerLists .prdctinfo p {
        margin-bottom: 0;
    }

    .tradesupplerLists .prdctinfo .info_circles {
        margin-top: 30px;
        position: absolute;
        bottom: 0;
        left: 0;
    }

        .tradesupplerLists .prdctinfo .info_circles .smallrund {
            margin: 0 10px 0 0;
        }

            .tradesupplerLists .prdctinfo .info_circles .smallrund:hover .cusTooltip {
                bottom: 45px;
                left: -40px;
            }

    .tradesupplerLists .prdctinfo .addbasket {
        position: relative;
        width: 140px;
        height: 32px;
        padding: 2px 4px;
        color: #fff;
        margin-top: 70px;
        line-height: 26px;
    }

        .tradesupplerLists .prdctinfo .addbasket span {
            display: inline-block;
            float: left;
            margin-right: 4px;
        }

        .tradesupplerLists .prdctinfo .addbasket.basketAdd {
            cursor: pointer;
        }

        .tradesupplerLists .prdctinfo .addbasket.basketAdded {
            padding-left: 32px;
        }

            .tradesupplerLists .prdctinfo .addbasket.basketAdded span.iconSmile {
                left: 0;
                right: auto;
                background-size: 26px;
            }

/*.contacInfo .info_circles .smallrund:hover .cusTooltip { bottom: 35px; left: -45px; }*/

.icon-pound {
    position: relative;
    width: 18px;
    height: 18px;
    display: inline-block !important;
    border: 0;
    border-radius: 50%;
    padding: 0px;
    color: #fff;
    font-size: 12px;
    line-height: 17px;
    font-weight: 500;
    text-align: center;
    margin: 0 !important;
    top: -2px;
    cursor: default;
}

    .icon-pound i {
        font-size: 10px;
        line-height: 14px;
    }

    .icon-pound .cusTooltip {
        font-family: 'Poppins', sans-serif;
        display: none;
        width: 140px;
        height: 0;
        opacity: 0;
        padding: 0;
        position: absolute;
        font-size: 12px;
        font-weight: normal;
        letter-spacing: 0;
        line-height: 16px;
        top: auto;
        bottom: 26px;
        left: 50%;
        margin-left: -70px;
        white-space: normal;
        -webkit-transform-origin: top;
        transform-origin: top;
        -webkit-transform: translate(0%, 25%);
        transform: translate(0%, 25%);
    }

    .icon-pound:hover > .cusTooltip {
        display: block;
        opacity: 1;
        padding: 0.5em 1em;
        height: auto;
        -webkit-transform: translate(0%, 0);
        transform: translate(0%, 0);
        transition: all 0.18s ease-out 0.18s;
    }


.quotationproduct .qtnprdctdtls .innerField .info_circles {
    display: inline-block;
}

    .quotationproduct .qtnprdctdtls .innerField .info_circles:hover {
        text-decoration: none;
    }

    .quotationproduct .qtnprdctdtls .innerField .info_circles .smallrund.boxbtn {
        margin: 4px 4px -6px;
        width: 28px;
        height: 24px;
        padding: 3px 0px;
        display: block;
    }

    .quotationproduct .qtnprdctdtls .innerField .info_circles .smallrund .icon-plus:before {
        top: -3px;
    }

    .quotationproduct .qtnprdctdtls .innerField .info_circles .smallrund.basketAdded {
        margin: 4px 4px -6px;
    }

        .quotationproduct .qtnprdctdtls .innerField .info_circles .smallrund.basketAdded .iconSmile {
            background-size: 24px;
            width: 28px;
            height: 24px;
        }

    .quotationproduct .qtnprdctdtls .innerField .info_circles .smallrund:hover .cusTooltip {
        bottom: 32px;
    }

.getsupplier .cusTooltip {
    widtH: 150px;
}

.footer_middle {
    width: 100%;
    float: left;
    margin-bottom: 40px;
}

.ftmiddle_box {
    position: relative;
    width: 48.5%;
    padding: 15px;
    min-height: 125px;
    padding-right: 18%;
}

    .ftmiddle_box.orgneColor {
        background-image: url('../images/btm-bg1.png');
        background-repeat: no-repeat;
        background-size: auto;
        background-position: center right 10px;
    }

    .ftmiddle_box.purpleColor {
        background-image: url('../images/btm-bg2.png');
        background-repeat: no-repeat;
        background-size: auto;
        background-position: bottom 0px right 0px;
    }

    .ftmiddle_box.orgneColor h4, .ftmiddle_box.orgneColor p {
        color: #f37421;
    }

    .ftmiddle_box.purpleColor h4, .ftmiddle_box.purpleColor p {
        color: #522e91;
    }

    .ftmiddle_box h4 {
        margin: 0 0 5px;
        line-height: 24px;
    }

    .ftmiddle_box a.btn {
        position: absolute;
        left: 15px;
        bottom: 15px;
        color: #fff;
        font-weight: 500;
        border-radius: 0;
    }

/*.supplierSearches ul.tradesupplerLists li .contacInfo, .supplierSearches ul.tradesupplerLists li .contacInfo .tradesupplierImage { width: 210px; }
.supplierSearches ul.tradesupplerLists li .contacInfo .tradesupplierImage { height: 100px; }
.supplierSearches ul.tradesupplerLists li .productRange { width: 730px; min-height: 100px; }*/
.supplierSearches ul.tradesupplerLists li .productRange .customBtns {
    width: 440px;
    float: left;
}

.supplierSearches ul.tradesupplerLists li .productRange .info_circles {
    width: 290px;
}

    .supplierSearches ul.tradesupplerLists li .productRange .info_circles .smallrund {
        float: right;
    }

        .supplierSearches ul.tradesupplerLists li .productRange .info_circles .smallrund:first-child {
            margin-right: 0px;
        }

        .supplierSearches ul.tradesupplerLists li .productRange .info_circles .smallrund span.cusTooltip {
            white-space: normal;
            top: auto;
        }

.supplierSearchBtn {
    margin-top: -10px;
}

.cusTooltip a {
    color: #fff !important;
}

#SupplierModal .productModview {
    border: none !important;
}

.iso_image {
    width: 30px !important;
    border: none !important;
    margin: 0px 8px !important;
    float: left;
}

.image_span {
    padding-top: 0px !important;
}

.disableSupplierTrigger {
    background-color: #8b8b8b;
}

.errors span {
    display: block;
    list-style: disc;
    color: #FF0000;
    float: left;
    clear: both;
}

.supplier_iso_image {
    width: 26px !important;
    border: none !important;
    float: left;
}


.selectLetter {
    margin-bottom: 20px;
}

    .selectLetter span {
        position: relative;
        font-size: 32px;
        color: #f37421;
        padding: 0px 2px;
    }

        .selectLetter span:after {
            content: '';
            display: none;
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 3px;
            background-color: #f37421;
        }

        .selectLetter span.active:after, .selectLetter span:hover:after {
            display: block;
        }

        .selectLetter span a {
            color: #f37421;
        }

            .selectLetter span a:hover {
                text-decoration: none;
            }

/*.tradesupplierImage {position: relative;width: 220px; height: 150px;}*/

.contacInfo1 .info_circles .smallrund {
    width: 26px;
    height: 26px;
    margin: 0px 10px 0px 0px;
    padding: 3px;
}
/*.tradesupplierImage img {
    position: absolute;
    width: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}*/
.contacInfo1 h3 {
    font-size: 20px;
    color: #522e91 !important;
    margin: 0px 0px 20px;
}

.contacInfo1 .info_circles .smallrund span {
    color: #fff;
    font-size: 12px;
}

.contacInfo1 .info_circles {
    width: 100%;
    float: left;
    margin: 10px 0px;
}

#SupplierDetailsModal {
    overflow: visible;
}

.enhanced {
    width: 30px !important;
    height: 30px !important;
}

.disableButton {
    color: black !important;
    background-color: #eee;
}

.costDetails {
    padding-left: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
}

.quotationPreviewDetails {
    background-color: #fff;
    margin-right: 5px;
}

.dynamic-office-lite .box {
    position: relative;
    border: 1px solid #e0e0e0;
    background-color: #fff;
    padding: 10px 20px;
    min-height: 345px;
    margin-bottom: 30px;
}

.documentManagerLogo {
    padding-top: 100px !important;
}

.ideaListInfoHeader {
    float: left;
    padding-left: 20px;
    min-height: 250px;
}

    .ideaListInfoHeader .date input {
        min-height: 37px;
    }

.follow-up-box {
    border: 1px solid #e0e0e0;
    background-color: #fff;
    padding: 10px 20px;
    margin-bottom: 15px;
}

    .follow-up-box div {
        font-size: 14px;
        padding: 5px;
    }

.ideaListInfo h3 {
    color: #522e91 !important;
    margin-top: 15px;
}

.ideaListInfo .btn {
    width: 258px;
    color: #fff;
    border-radius: 0;
    font-size: 18px;
}

.ideaListInfo .clearBoth {
    clear: both;
}

#markup {
    overflow: auto;
    overflow-y: scroll;
    max-height: 450px;
}

    #markup table {
        width: 60%
    }

    #markup .col1 {
        width: 45px;
    }

    #markup .col2 {
        width: 45px;
    }

    #markup .col3 {
        width: 80px;
    }

    #markup .select {
        width: 70px;
    }

    #markup .col {
        width: 150px;
    }

    #markup .btnCloseMarkUp {
        padding: 0px;
        text-align: center;
    }

.carriageadvice {
    padding-right: 0px;
    margin-bottom: 20px;
}

.previewOrigination {
    margin-bottom: 0px !important;
}

.borderBox.oneColumn {
    width: 100%;
}

.divGrid .row {
    margin: 0px 0px 15px 0px;
    padding: 5px;
}

.divGrid .oddRow {
    background-color: #f2f2f2
}

.supplierArea .borderBox1 {
    min-height: 250px;
}

#discontinueProductDT .scref {
    width: 80px !important;
}

.hide {
    display: none;
}

#discontinueProductDT .checkFor label {
    margin-top: 0px;
    float: right;
}

.btnRequestGetPrices {
    padding: 10px 15px 10px 10px !important;
}

.sampleorder {
    width: 150px;
}

.sampleRequestedBy {
    width: 180px;
}

.chkRequestCatalogue, .chkCopyAll, .chkRequestPriceList {
    display: none !important;
}

.requestPriceList {
    width: 180px;
}

.btn-danger {
    color: #fff;
    background-color: #522e91 !important;
    border-color: #d43f3a;
}

.btn-success {
    color: #fff;
    background-color: #522e91 !important;
    border-color: #4cae4c;
}

.btn-warning {
    color: #fff;
    background-color: #522e91 !important;
    border-color: #4cae4c;
}

/*SupplierinfoModal*/
#SupplierinfoModal {
    background-color: #cccccc;
    border-radius: 0;
    padding: 0;
    display: none;
}

    #SupplierinfoModal .productModview {
        border: none;
        padding: 20px;
    }

    #SupplierinfoModal .form-group {
        padding: 20px;
    }

    #SupplierinfoModal .supplier-cntnts h5.tableHead {
        background-color: #f37421;
        color: #fff;
        margin: 0;
        padding: 15px;
        font-size: 18px;
        cursor: pointer;
    }

    #SupplierinfoModal .supplier-cntnts .box-info {
        background-color: #f9f9f9;
        padding: 15px;
        margin-bottom: 20px;
    }

        #SupplierinfoModal .supplier-cntnts .box-info input {
            width: 100%;
            min-height: 35px;
            padding: 6px;
        }
    /*#SupplierinfoModal .supplier-cntnts .box-info input:hover { background: rgba(236, 230, 230, 0.8); }*/
    #SupplierinfoModal .supplier-cntnts .table-striped > tbody > tr:nth-of-type(odd) {
        clear: both;
        max-width: none !important;
    }

    #SupplierinfoModal .supplier-cntnts .table-striped > tbody > tr:nth-of-type(even) {
        background-color: #f1f0f3;
    }

    #SupplierinfoModal .supplier-cntnts .productinfotable table thead tr th {
        background-color: #522e91;
        color: #fff;
        font-size: 14px;
    }

    #SupplierinfoModal .supplier-cntnts .custom .modal-body .bestprice {
        background-color: #b9ddf5;
    }

#SupModal1.custom .modal-body .box-info img {
    width: 335px;
}

.scrollable .bgImage.sc_statics .accordion h2.trigger {
    cursor: pointer;
    position: relative;
    background: rgba(189,189,189,0.2);
    padding: 15px;
    float: left;
    width: 100%;
}

    .scrollable .bgImage.sc_statics .accordion h2.trigger a {
        color: #f37421;
        font-size: 28px;
        text-decoration: none;
    }

    .scrollable .bgImage.sc_statics .accordion h2.trigger:after {
        content: "+";
        position: absolute;
        right: 15px;
    }

    .scrollable .bgImage.sc_statics .accordion h2.trigger.active:after {
        content: "-";
        position: absolute;
        right: 15px;
    }

.scrollable .bgImage.sc_statics .accordion .statsToggle {
    width: 100%;
    float: left;
    padding: 20px 0;
}

    .scrollable .bgImage.sc_statics .accordion .statsToggle .block h3 {
        margin-top: 0;
    }

    .scrollable .bgImage.sc_statics .accordion .statsToggle .block .col-md-11 {
        border-bottom: 1px solid #ccc;
        margin-bottom: 20px;
    }

.listswitchbox ~ .listHeading {
    margin-top: 35px;
}

.searchOpts ~ .listHeading {
    margin-top: 15px;
}

.ps-gold {
    background-color: #DAA520;
}

.ps-silver {
    background-color: #bcc2c4;
}

.ps-blocked {
    background-color: #4d4d4d;
}

#JT {
    margin-top: -20px;
    left: 45px !important;
    top: 25px !important;
}

    #JT #JT_close_left {
        display: none;
    }

    #JT #JT_copy {
        padding: 0;
    }

    #JT table {
        margin-bottom: 0;
    }

        #JT table .tooltip-white-row {
            background-color: #d8d6d7 !important;
        }

        #JT table.table-bordered {
            border: 0px solid #ddd;
        }

            #JT table.table-bordered > tbody > tr > td {
                border: 0px solid #ddd;
                padding: 3px 5px;
            }

            #JT table.table-bordered > tbody > tr:last-child > td {
                font-weight: 600;
            }

/*-- Calculator page--*/
#inner_page .container {
    width: 98% !important;
}

.contentBox {
    margin-top: 40px;
}

.widget {
    padding: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    margin: 0 0 30px 0;
    width: 100%;
    float: left;
    background-color: #ebebeb;
}

.widget-header {
    position: relative;
    min-height: 55px;
    background: #f37421;
    color: #ffffff;
    padding-left: 12px;
    text-align: right;
}

.widget-header, .widget-body, .widget-footer {
    width: 100%;
    float: left;
}

.suppliergroup_data .widget-header .widget-caption {
    padding-right: 70px;
}

.widget-header > .widget-caption {
    line-height: 34px;
    padding: 10px;
    margin: 0;
    float: left;
    text-align: left;
    font-weight: 400 !important;
    font-size: 18px;
    width: 100%;
    padding-right: 70px;
}

.widget-buttons {
    display: inline-block;
    padding: 10px 5px;
    line-height: 34px;
    position: absolute;
    text-align: center;
    height: 55px;
    right: 0;
}

    .widget-buttons > a {
        font-size: 14px;
        margin: 0 1px;
        display: inline-block;
        padding: 0;
        line-height: 24px;
        min-width: 20px;
        text-align: center;
    }

.backbtn {
    font-size: 16px;
    letter-spacing: 1px;
    color: #fff;
    padding: 6px 10px;
    background-color: #522e91;
}

.widget-buttons .btn {
    margin-top: -2px;
}

.widget-body {
    /* background-color: #ebebeb; */
    /* padding: 12px; */
}

.widget-header, .widget-body, .widget-footer {
    width: 100%;
    float: left;
}

table.table {
    clear: both;
    max-width: none !important;
}

.widget-body > table {
    margin-bottom: 0;
}

.widget-footer {
    position: relative;
    min-height: 55px;
    background: #f37421;
    color: #ffffff;
    padding-left: 12px;
    text-align: right;
    margin-top: 20px;
}

.btn.bgOrnge.white {
    color: #ffffff;
}

.toggleContainer {
    border-bottom: 1px solid rgb(238, 238, 238);
    padding: 20px 0;
    margin-bottom: 20px;
    width: 100%;
    float: left;
}

.accordion {
    margin-top: 30px;
}

    .accordion .accordion-blocks:first-child {
        border-top: 1px solid #eeeeee;
    }

    .accordion .accordion-blocks {
        border-bottom: 1px solid #eeeeee;
    }

        .accordion .accordion-blocks h3 {
            margin: 0;
        }

            .accordion .accordion-blocks h3 a {
                color: #f37421;
                display: block;
                padding: 15px;
                text-decoration: none;
                background-color: #fafafa;
                background-image: url('images/downarrow-orange.png');
                background-repeat: no-repeat;
                background-size: 14px;
                background-position: center right 15px;
            }

            .accordion .accordion-blocks h3.active a {
                background-image: url('images/uparrow-orange.png');
            }

            .accordion .accordion-blocks h3 a:hover {
                background-color: #fafafa;
                text-decoration: none;
            }

            .accordion .accordion-blocks h3 a:focus {
                outline: 0;
            }

        .accordion .accordion-blocks .innerField div {
            padding-top: 8px;
            padding-bottom: 8px;
            line-height: 28px;
            margin-bottom: 0;
        }

        .accordion .accordion-blocks .accordion-blocks h3 a {
            background-color: #f4f4f4;
            padding: 10px;
            font-size: 16px;
        }

        .accordion .accordion-blocks .form-group {
            margin-bottom: 0;
            padding: 10px 0;
        }

            .accordion .accordion-blocks .form-group .form-control {
                padding: 6px;
            }

            .accordion .accordion-blocks .form-group input[type="checkbox"], .accordion .accordion-blocks .form-group input[type="radio"] {
                widtH: 20px;
                height: 20px;
            }


    .accordion .accordion-blocks {
        padding: 0 8px 8px;
    }

        .accordion .accordion-blocks.level1 h3 a {
            margin: 0 -8px -8px;
        }

        .accordion .accordion-blocks.level1 {
            background-color: #f2f2f2;
            border: 1px solid #DEDEDE;
        }

            .accordion .accordion-blocks.level1 h3 a {
                background-color: #e7e7e7;
            }

        .accordion .accordion-blocks.level2 {
            background-color: #F8F1F1;
            border: 1px solid #DEDEDE;
        }

            .accordion .accordion-blocks.level2 h3 a {
                background-color: #F0E7E7;
            }

        .accordion .accordion-blocks.level3 {
            background-color: #F1F8F7;
            border: 1px solid #DEDEDE;
        }

            .accordion .accordion-blocks.level3 h3 a {
                background-color: #E0F8F4;
            }

        .accordion .accordion-blocks.level4 {
            background-color: #EFF8FC;
            border: 1px solid #DEDEDE;
        }

            .accordion .accordion-blocks.level4 h3 a {
                background-color: #E0F0F8;
            }

        .accordion .accordion-blocks.level5 {
            background-color: #FCFCEF;
            border: 1px solid #DEDEDE;
        }

            .accordion .accordion-blocks.level5 h3 a {
                background-color: #F0F0D8;
            }

span.level1 {
    color: #e7e7e7;
}

span.level2 {
    color: #F0E7E7;
}

span.level3 {
    color: #E0F8F4;
}

span.level4 {
    color: #E0F0F8;
}

span.level5 {
    color: #F0F0D8;
}



.btn.bgWhite {
    background-color: #fff;
    color: #f37421;
}

.p-0 {
    padding: 0;
}

.m-b-20 {
    margin-bottom: 20px !important;
}

.m-b-40 {
    margin-bottom: 40px !important;
}

.layout1 .tableHead1 {
    background-color: #f37421;
    color: #ffffff !important;
    margin: 0;
    padding: 12px;
    font-size: 18px;
}

.layout1 .tableHead2 {
    background-color: #d8d6d7;
    color: #f37421 !important;
    margin: 0;
    padding: 12px;
    font-size: 18px;
    font-weight: 500;
}

.layout1 .box-info {
    position: relative;
    overflow: hidden;
    text-align: center;
    border: 1px solid #E9E9E9;
    background-color: #f9f9f9;
    padding: 15px;
    margin-bottom: 20px;
}

    .layout1 .box-info img {
        width: auto;
        height: auto;
        max-width: 100%;
        max-height: 100%;
    }

table.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #d8d6d7;
}

table.table-striped > tbody > tr:nth-of-type(even) {
    background-color: #f0f0f0;
}

table.table-design1 tbody tr td:first-child {
    font-weight: 400;
}

table.table-design1 tbody tr td {
    padding: 10px 15px;
    color: #666;
}

ul.list-style1 {
    width: 100%;
    float: left;
    margin: 0;
    padding: 0;
    list-style: none;
}

    ul.list-style1 li {
        width: 100%;
        float: left;
        margin: 0;
        padding: 12px;
        background-color: #f0f0f0;
        border-top: 0px solid #ffffff;
        font-size: 16px;
    }

        ul.list-style1 li:last-child {
            border-bottom: 1px solid #ffffff;
        }

        ul.list-style1 li label {
            margin: 10px 0 10px;
            font-weight: normal;
            font-size: 15px;
            line-height: 21px;
        }

        ul.list-style1 li select {
            padding: 1px 4px;
        }

        ul.list-style1 li .withoptions label {
            font-size: 13px;
            width: 100%;
            float: left;
            height: auto;
            margin-bottom: 0;
        }

        ul.list-style1 li .withoptions select {
            font-size: 13px;
            float: left;
            width: 100%;
            margin: 10px 0 10px;
            border: 1px solid #dadada;
            border-radius: 3px;
        }

        /* ul.list-style1 li input.chooseproduct {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }
    ul.list-style1 li .checkmark {
        position: absolute;
        top: 14px;
        left: 10px;
        height: 14px;
        width: 14px;
        background-color: #ffffff;
        border: 1px solid #dadada;
        border-radius: 2px;
    }
    ul.list-style1 li input.chooseproduct:checked ~ .checkmark {
        background-color: #ffffff;
    }*/

        /* Create the checkmark/indicator (hidden when not checked) */
        ul.list-style1 li .checkmark:after {
            content: "";
            position: absolute;
            display: none;
        }

        /* Show the checkmark when checked */
        ul.list-style1 li input.chooseproduct:checked ~ .checkmark:after {
            display: block;
        }

        /* Style the checkmark/indicator */
        ul.list-style1 li .checkmark:after {
            left: 4px;
            top: 1px;
            width: 4px;
            height: 8px;
            border: solid #888888;
            border-width: 0 2px 2px 0;
            -webkit-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            transform: rotate(45deg);
        }

.btm-style {
    background-color: #d8d6d7;
    color: #f37421;
    margin: 15px 0 0;
    padding: 10px;
}

    .btm-style label {
        margin: 0 10px 0 0;
    }

    .btm-style input {
        box-shadow: none;
        border: 0;
        color: #333333;
        width: 50px;
        padding: 1px 6px;
    }

    .btm-style .btn.custom {
        background-color: #f37421;
        color: #ffffff;
        margin: -10px;
        border-radius: 0;
        float: right;
        height: 42px;
    }

ul.list-style1 .accordion {
    padding: 0;
}

    ul.list-style1 .accordion .accordion-blocks {
        padding: 0;
    }

        ul.list-style1 .accordion .accordion-blocks.level1, ul.list-style1 .accordion .accordion-blocks.level2, ul.list-style1 .accordion .accordion-blocks.level3, ul.list-style1 .accordion .accordion-blocks.level4, ul.list-style1 .accordion .accordion-blocks.level5 {
            background-color: transparent;
            border: 0;
        }

            ul.list-style1 .accordion .accordion-blocks.level1 .fullwidthblock, ul.list-style1 .accordion .accordion-blocks.level2 .fullwidthblock, ul.list-style1 .accordion .accordion-blocks.level3 .fullwidthblock, ul.list-style1 .accordion .accordion-blocks.level4 .fullwidthblock, ul.list-style1 .accordion .accordion-blocks.level5 .fullwidthblock {
                border-bottom: 1px solid #ffffff;
            }

        ul.list-style1 .accordion .accordion-blocks h3 {
            font-size: 16px;
        }

            ul.list-style1 .accordion .accordion-blocks h3 a {
                background-color: transparent;
                padding: 12px 32px 12px 32px;
                margin: 0;
                font-weight: 500;
                color: #333333;
            }

            ul.list-style1 .accordion .accordion-blocks h3.active a {
                color: #f37421;
            }
        /*ul.list-style1 .accordion .accordion-blocks .toggleContainer { padding: 0 !important; display:block !important;}*/
        ul.list-style1 .accordion .accordion-blocks .toggleContainer {
            padding: 0 !important;
        }

        ul.list-style1 .accordion .accordion-blocks.nochild .toggleContainer {
            padding: 8px 12px !important;
        }

        ul.list-style1 .accordion .accordion-blocks .toggleContainer label {
            font-weight: 400;
        }

        ul.list-style1 .accordion .accordion-blocks .toggleContainer .fullwidthblock {
            margin: 0;
            padding: 8px 12px;
            border-bottom: 1px solid #ffffff;
        }

            ul.list-style1 .accordion .accordion-blocks .toggleContainer .fullwidthblock:nth-last-child(2) {
                border-bottom: 0px solid #ffffff;
            }

        ul.list-style1 .accordion .accordion-blocks .row.fullwidthblock {
            margin: 0;
        }

        ul.list-style1 .accordion .accordion-blocks.level2 .row.fullwidthblock, ul.list-style1 .accordion .accordion-blocks.level3 .row.fullwidthblock, ul.list-style1 .accordion .accordion-blocks.level4 .row.fullwidthblock, ul.list-style1 .accordion .accordion-blocks.level5 .row.fullwidthblock {
            margin-left: -12px;
            margin-right: -12px;
            padding-bottom: 0;
            padding-top: 0;
        }

        ul.list-style1 .accordion .accordion-blocks.level2 .toggleContainer .fullwidthblock, ul.list-style1 .accordion .accordion-blocks.level3 .toggleContainer .fullwidthblock, ul.list-style1 .accordion .accordion-blocks.level4 .toggleContainer .row.fullwidthblock, ul.list-style1 .accordion .accordion-blocks.level5 .toggleContainer .row.fullwidthblock {
            border: 0;
        }

    ul.list-style1 .accordion .accordion {
        padding: 0 !important;
    }

        ul.list-style1 .accordion .accordion .innerblock {
            padding: 8px 12px;
        }

        ul.list-style1 .accordion .accordion .accordion-blocks h3 a {
            font-size: 15px;
            font-weight: 500;
            background-color: transparent;
            border: 0;
        }

        ul.list-style1 .accordion .accordion .accordion-blocks .toggleContainer .fullwidthblock {
            border: 0;
        }

    ul.list-style1 .accordion .accordion-blocks.nochild .toggleContainer {
        padding: 0 !important;
    }

        ul.list-style1 .accordion .accordion-blocks.nochild .toggleContainer .fullwidthblock {
            border: 0;
        }

.withOutAccord .toggleContainer {
    display: block !important;
}

ul.list-style1 .hascheckbox .checkboxCustom {
    float: left;
    width: 32px;
    max-width: 45px;
    padding: 10px 12px;
}

    ul.list-style1 .hascheckbox .checkboxCustom.hasnospace {
        padding: 0 10px;
        margin-right: 0;
    }

        ul.list-style1 .hascheckbox .checkboxCustom.hasnospace input {
            width: 14px;
            box-shadow: none;
            border: 0;
        }

            ul.list-style1 .hascheckbox .checkboxCustom.hasnospace input:focus {
                outline: 0;
            }

ul.list-style1 .hascheckbox h3 {
    float: left;
    width: 100%;
}

ul.list-style1 .hascheckbox {
    padding: 0;
}

ul.list-style1 .noaccordion h3 {
    font-size: 16px;
    margin: 0;
    padding: 13px 12px;
    color: #333333 !important;
}

ul.list-style1 .accordion .accordion-blocks.hascheckbox h3 a {
    background-position: center right 20px;
}

.accordion .level1 .toggleContainer {
    background-color: #ffece5;
}

.accordion .level2 .toggleContainer {
    background-color: #e6e5eb;
}

.accordion .level3 .toggleContainer {
    background-color: #E0F8F4;
}

.accordion .level4 .toggleContainer {
    background-color: #E0F0F8;
}

.accordion .level5 .toggleContainer {
    background-color: #F0F0D8;
}

table.table-style1 thead {
    background-color: #d8d6d7;
}

table.table-style1 tbody tr {
    background-color: transparent;
}

    table.table-style1 tbody tr.level1 {
        background-color: #ffece5;
    }

    table.table-style1 tbody tr.level2 {
        background-color: #e6e5eb;
    }

    table.table-style1 tbody tr.level3 {
        background-color: #E0F8F4;
    }

    table.table-style1 tbody tr.level4 {
        background-color: #E0F0F8;
    }

    table.table-style1 tbody tr.level5 {
        background-color: #F0F0D8;
    }

    table.table-style1 tbody tr.level1 {
        background-color: #ffece5;
    }

    table.table-style1 tbody tr.level2 {
        background-color: #e6e5eb;
    }

    table.table-style1 tbody tr.level3 {
        background-color: #E0F8F4;
    }

    table.table-style1 tbody tr.level4 {
        background-color: #E0F0F8;
    }

    table.table-style1 tbody tr.level5 {
        background-color: #F0F0D8;
    }

    table.table-style1 tbody tr.level1 td:first-child {
        padding-left: 2%;
        background-image: url('images/rightarrow-orange.png');
        background-repeat: no-repeat;
        background-size: 10px;
        background-position: center left 2%;
    }

    table.table-style1 tbody tr.level2 td:first-child {
        padding-left: 3.5%;
        background-image: url('images/rightarrow-navy.png');
        background-repeat: no-repeat;
        background-size: 10px;
        background-position: center left 7%;
    }

    table.table-style1 tbody tr.level3 td:first-child {
        padding-left: 5%;
        background-image: url('images/rightarrow-navy.png');
        background-repeat: no-repeat;
        background-size: 10px;
        background-position: center left 13%;
    }

    table.table-style1 tbody tr.level4 td:first-child {
        padding-left: 6.5%;
        background-image: url('images/rightarrow-navy.png');
        background-repeat: no-repeat;
        background-size: 10px;
        background-position: center left 19%;
    }

    table.table-style1 tbody tr.level5 td:first-child {
        padding-left: 8%;
        background-image: url('images/rightarrow-navy.png');
        background-repeat: no-repeat;
        background-size: 10px;
        background-position: center left 25%;
    }

.widget-footer.design1 {
    background-color: #d8d6d7;
    text-align: left;
    padding: 0;
    min-height: 0;
}

    .widget-footer.design1 a {
        float: left;
        color: #f37421;
        padding: 6px 12px 6px 30px;
        background-image: url('images/leftarrow-orange.png');
        background-repeat: no-repeat;
        background-size: 10px;
        background-position: center left 10px;
    }

    .widget-footer.design1 input {
        float: right;
        background-color: #f37421;
        border-radius: 0;
        color: #ffffff;
    }

.custom-table .table-striped thead tr th {
    background-color: #522e91;
    color: #ffffff;
    font-size: 15px;
}

.custom-table .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #ffffff;
    clear: both;
    max-width: none !important;
}

.custom-table .table-striped > tbody > tr:nth-of-type(even) {
    background-color: #f9f9f9;
}

.custom-table .header-sticky {
    position: relative;
}

    .custom-table .header-sticky thead tr th {
        position: sticky;
        top: 82px;
        z-index: 1;
        text-align: center;
        vertical-align: middle;
    }

        .custom-table .header-sticky thead tr th:first-child {
            text-align: left;
        }

        .custom-table .header-sticky thead tr th:before {
            content: '';
            display: block;
            width: 3px;
            height: 100%;
            background-color: #0c0337;
            position: absolute;
            top: 0;
            left: -1px;
        }

    .custom-table .header-sticky tbody tr td {
        text-align: center;
    }

        .custom-table .header-sticky tbody tr td:first-child {
            text-align: left;
        }

.mypobasket ul li .listImage {
    position: relative;
    padding: 8px;
    border-radius: 6px;
    overflow: hidden;
}

    .mypobasket ul li .listImage img {
        margin: 0;
        width: 80px;
        height: 80px;
        max-width: 100%;
    }

    .mypobasket ul li .listImage:before {
        content: '';
        width: 100%;
        height: 100%;
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        background: linear-gradient(to bottom, rgba(43,43,43,.10) 0%, rgba(43,43,43,.10) 100%);
    }

.product-price-calculator {
    border-top: 1px solid #522e91;
    border-bottom: 1px solid #522e91;
    padding-bottom: 15px;
    margin-top: 15px;
    margin-bottom: 15px;
}
.product-price-calculator::after {
  content: "";
  display: block;
  clear: both;
}
.product-price-calculator .priceset-radio-buttons label {
    font-weight: 400;
    margin: 0 15px 5px 0;
    display: inline-block;
    vertical-align: middle;
}

    .product-price-calculator .priceset-radio-buttons label input {
        display: inline-block;
        vertical-align: top;
    }

.product-price-calculator .buttons .btn {
    margin: 5px 0;
    font-weight: 600;
}
.product-price-calculator .buttons .btn:focus {
    outline: 0;
}

.product-price-calculator .buttons .pushtoquote {
    background-color: #ddd;
    margin-left: 5px;
    font-weight: 600;
}

    .product-price-calculator .buttons .pushtoquote[disabled] {
        opacity: 0.6;
    }

.product-price-calculator .buttons .pushtoquoteold {
    background-color: #001CFF;
    color: #ffffff;
    margin-left: 5px;
    font-weight: 600;
}

.product-price-calculator .buttons .pushtoquoteassistant {
    position: relative;
    margin-left: 5px;
}

    .product-price-calculator .buttons .pushtoquoteassistant .cusTooltip {
        width: 220px;
        white-space: normal;
        bottom: 50%;
    }

    .product-price-calculator .buttons .pushtoquoteassistant:hover .cusTooltip {
        display: block;
    }

.product-price-calculator .buttons .addtopoquoteassitant {
    background-color: #ddd;
    margin-left: 5px;
    font-weight: 600;
}

    .product-price-calculator .buttons .addtopoquoteassitant[disabled] {
        opacity: 0.6;
    }

    .product-price-calculator .buttons .addtopoquoteassitant .cusTooltip {
        width: 220px;
        white-space: normal;
        bottom: 50%;
    }

    .product-price-calculator .buttons .addtopoquoteassitant:hover .cusTooltip {
        display: block;
    }


/*Ai Searc Page*/
.ai-search {
    font-size: 16px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: normal;
    color: #575a5b;
}

    .ai-search a:hover {
        text-decoration: none;
        opacity: 0.7;
    }

.left-block {
    margin: 0 0 35px 0;
    padding: 12px 32px 0 25px;
    background-color: #f5f5f5;
}

    .left-block .block {
        padding: 25px 0;
        border-bottom: solid 2px #522e91;
    }

        .left-block .block:last-child {
            border: 0;
        }

.newsearch-button {
    font-size: 16px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: normal;
    color: #522e91;
    border: 0;
    background: none;
    padding-left: 30px;
    background-image: url("../images/new-search-icon.png");
    background-image: url("../images/new-search-icon.svg");
    background-repeat: no-repeat;
    background-size: auto;
    background-position: left center;
    transition: all .25s ease;
}

    .newsearch-button:hover {
        padding-left: 35px;
    }

.block-heading h4 {
    font-size: 16px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: normal;
    color: #522e91;
}
.block-heading h4.with-search-icon {
    padding-left: 30px;
    padding-right: 30px;
    background-image: url("../images/search-icon.png"), url("../images/arrow-curved-icon.png");
    background-image: url("../images/search-icon.svg"), url("../images/arrow-curved-icon.svg");
    background-repeat: no-repeat no-repeat;
    background-size: auto auto;
    background-position: left center, right center;
}

.block ul {
    list-style: none;
    padding-left: 0;
    margin: 0 0 30px;
}
.block #conversationList {
    height: 0;
    overflow: hidden;
    transition: all .25s ease;
}
.block #conversationList.show {
    height: auto;
}
    .block ul li {
        font-size: 13px;
        font-weight: 500;
        line-height: 1.5;
        letter-spacing: normal;
        color: #575a5b;
        padding: 10px 0;
        border-bottom: 1px solid #ccc;
        display: flex;
        flex-wrap: nowrap;
        justify-content: space-between;
        gap: 5px;
    }

        .block ul li span {
            display: block;
            flex: 1;
            cursor: pointer;
        }

.button-list {
    width: 58px;
}

.block ul li button {
    width: 22px;
    height: 22px;
    background-color: transparent;
    border: 1px solid #575a5b;
    border-radius: 5px;
    padding: 2px;
    background-repeat: no-repeat;
    background-size: auto;
    background-position: center;
    font-size: 0;
    margin: 0 3px;
}

    .block ul li button.archive-item {
        background-image: url("../images/icons-archive.png");
        background-size: 18px;
    }

    .block ul li button.delete-item {
        background-image: url("../images/icon-delete.png");
        background-image: url("../images/icon-delete.svg");
        background-size: 13px;
    }

.block ul li.conversation-loading {
    font-size: 0;
    width: 100%;
    height: 50px;
    background-image: url("../images/ajax-loader.gif");
    background-repeat: no-repeat;
    background-size: 40px;
    background-position: center;
    border: 0;
}

.spinner.small {
    width: 14px;
    height: 14px;
    border: 2px solid #ccc;
    border-top-color: #666;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

.main-wrapper {
    position: relative;
}

.gray-block {
    padding: 18px 41px 12px 24px;
    border-radius: 8px;
    background-color: #f5f5f5;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: normal;
    color: #522e91;
    margin: 30px 0;
}

.chat-messages {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: normal;
    color: #522e91;
    margin: 20px 0;
}

    .chat-messages .spinner {
        width: 25px;
        height: 25px;
        padding-left: 30px;
        background-image: url("../images/ajax-loader.gif");
        background-repeat: no-repeat;
        background-size: 20px;
        background-position: left center;
    }

    .chat-messages .user,
    .chat-messages .assistant {
        display: flex;
        margin: 0 0 10px;
    }

    .chat-messages .user {
        justify-content: end;
    }    

    .chat-messages .assistant {
        justify-content: start;
    }
    .chat-messages .user .summary,
    .chat-messages .assistant .summary {
        padding: 2px 10px;
        border-radius: 5px;
    }
    .chat-messages .user .summary {
        background-color: #ffe5d5;
    }
    .chat-messages .assistant .summary {
        background-color: #e3dae7;
    }

    .chat-messages .summary .pdf-summary,
    .chat-messages .summary .pdf-summary,
    .chat-messages .image-preview {
        padding: 2px 10px;
    }

    .chat-messages .user .summary .pdf-summary,
    .chat-messages .image-preview {
        background-color: #f5f5f5;
        border: 1px solid #f5f5f5;
        border-radius: 5px;
    }

.ai-search-results {
    margin-bottom: 46px;
}

    .ai-search-results h3 {
        font-size: 36px;
        font-weight: 500;
        line-height: normal;
        letter-spacing: normal;
        color: #575a5b;
    }

.ai-search-title {
    margin: 20px 0;
    border-bottom: solid 2px #575a5b;
}

    .ai-search-title h4 {
        font-size: 30px;
        font-weight: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #575a5b;
    }

.ai-search-results-block {
    font-size: 16px;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #522e91;
}

    .ai-search-results-block h5 {
        font-size: 21px;
    }

    .ai-search-results-block .title-block {
        display: flex;
        flex-wrap: nowrap;
    }

    .ai-search-results-block .group-title {
        flex: 1;
    }

    .ai-search-results-block .group-link {
        width: 150px;
    }

    .ai-search-results-block button.view-all-results,
    .ai-search-results-block a.view-all-results {
        font-size: 16px;
        font-weight: 500;
        line-height: normal;
        letter-spacing: normal;
        text-align: center;
        color: #522e91;
        padding: 5px 15px;
        border-radius: 4px;
        border: solid 1px #522e91;
        background: none;
    }
.ai-search-results-block .group-block {
    padding-bottom: 20px;
    margin-bottom: 30px;
    border-bottom: solid 1px #522e91;
}
.aisearch-results-products {
    padding: 0 0 10px;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    width: auto;
    margin-left: -5px;
    margin-right: -5px;
    margin-bottom: 10px;
    /*border-bottom: solid 1px #522e91;*/
}

    .aisearch-results-products li {
        width: 100%;
        max-width: 33.3333%;
        padding: 10px;
        font-size: 16px;
        font-weight: normal;
        line-height: 1.5;
        letter-spacing: normal;
        color: #575a5b;
    }

        .aisearch-results-products li .image-block {
            width: 100%;
            height: auto;
            min-height: 120px;
            position: relative;
            border-radius: 5px;
            background-color: transparent;
            overflow: hidden;
            padding: 10px;
            margin: 0 0 12px;
        }

            .aisearch-results-products li .image-block img {
                max-width: 100%;
                max-height: 100%;
            }

        .aisearch-results-products li h4,
        .aisearch-results-products li h4 a {
            font-size: 12px;
            line-height: 19px;
            font-weight: 600;
            color: #522e91;
            letter-spacing: 0;
        }

        .aisearch-results-products li .sku,
        .aisearch-results-products li .priceRange,
        .aisearch-results-products li .supplier {
            font-size: 12px;
            line-height: 16px;
            font-weight: 400;
            color: #522e91;
            margin: 0 0 5px;
        }

            .aisearch-results-products li .sku span,
            .aisearch-results-products li .priceRange span,
            .aisearch-results-products li .supplier span {
                display: block;
                font-weight: 400;
            }
.ai-load-controls button {
    font-size: 16px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #522e91;
    padding: 5px 15px;
    border-radius: 4px;
    border: solid 1px #522e91;
    background-color: #e0d8ed;
}

.sticky-wrapper {
    position: sticky;
    bottom: 0;
    background-color: #fff;
}

.aisearch-box {
    border: 1px solid #622786;
    border-radius: 8px;
    padding: 10px 15px;
    margin-bottom: 30px;
}

    .aisearch-box .input-area {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 15px;
    }

    .aisearch-box .ask-input {
        flex: 1;
        border: none;
        outline: none;
        font-size: 16px;
        font-weight: 500;
        line-height: normal;
        letter-spacing: normal;
        color: #522e91;
        background-color: #f4f4f4;
        border-radius: 5px;
        padding: 5px 10px;
    }

        .aisearch-box .ask-input::placeholder {
            color: #522e91;
        }



    .aisearch-box .attach-btn {
        border: 1.4px solid #622786;
        padding: 6px 12px;
        border-radius: 8px;
        cursor: pointer;
        display: inline-block;
        position: relative;
        overflow: hidden;
        font-size: 14px;
        font-weight: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #522e91;
        padding-left: 30px;
        background-image: url("../images/icon-paper-clip.png");
        background-image: url("../images/icon-paper-clip.svg");
        background-repeat: no-repeat;
        background-size: auto;
        background-position: left 10px center;
    }

        .aisearch-box .attach-btn button {
            background: none;
            border: 0;
        }

    .aisearch-box .file-input {
        position: absolute;
        inset: 35px 0 0 0;
        opacity: 0;
        cursor: pointer;
    }

    .aisearch-box .search-icon {
        font-size: 0;
        cursor: pointer;
        padding: 15px;
        border: 0;
        background: none;
        background-image: url("../images/search-icon.png");
        background-image: url("../images/search-icon.svg");
        background-repeat: no-repeat;
        background-size: auto;
        background-position: left 10px center;
    }

    .aisearch-box .chat-actions button {
        width: 148px;
        border-radius: 8px;
        border: solid 1px #622786;
        background-color: #622786;
        padding: 5px 45px 5px 15px;
        font-size: 16px;
        font-weight: 400;
        line-height: normal;
        letter-spacing: normal;
        color: #fff;
        text-align: left;
        margin-bottom: 5px;
    }

.export-btn {
    background-image: url("../images/icon-export-pdf.png");
    background-repeat: no-repeat;
    background-size: 25px;
    background-position: right 10px center;
}

.new-search-btn {
    background-image: url("../images/icon-new-search.png");
    background-image: url("../images/icon-new-search.svg");
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: right 10px center;
}


@media screen and (min-width: 768px) {
    .aisearch-box-with-button {
        display: flex;
        gap: 20px;
        align-items: flex-start;
    }

    .aisearch-box {
        flex: 1;
    }   

    .aisearch-box .buttons-group {
        display: flex;
        flex-wrap: nowrap;
        justify-content: space-between;
    }

    .text-sm-right {
        text-align: right;
    }
}

@media screen and (min-width: 992px) {
    .block-heading h4.with-search-icon {
        padding-left: 30px;
        padding-right: 30px;
        background-image: url("../images/search-icon.png");
        background-image: url("../images/search-icon.svg");
        background-repeat: no-repeat;
        background-size: auto;
        background-position: left center;
    }
    .block #conversationList {
        height: auto;
    }
}

@media screen and (min-width: 1025px) {
    .aisearch-results-products li {
        max-width: 20%;
    }
}




/*--------------------------
 IE 10 and 11 Design CSS 
 -------------------------*/

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    body {
        font-family: "Arial Narrow", Arial, sans-serif;
        font-size: 13px !important;
    }

    h1, h2, h3, h4, h5, h6 {
        font-family: "Arial Narrow", Arial, sans-serif !important;
        font-weight: 600;
    }

    .listingPanel_text .priceRange span {
        font-family: "Arial Narrow", Arial, sans-serif !important;
        font-weight: 600;
    }

    .getsupplier label {
        line-height: 21px;
    }

    .sbasketcount span.getsupplierbasket {
        font-family: "Arial Narrow", Arial, sans-serif !important;
        font-weight: 600;
    }

    .lessproductinfoView .listingPanel_text .info_circles .right .smallrund {
        padding: 7px;
    }

    .modal-details.custom .modal-body table tbody tr td:first-child {
        font-family: "Arial Narrow", Arial, sans-serif !important;
        font-weight: 600;
    }

    .contacInfo .info_circles .smallrund {
        padding: 4px 6px;
    }

    ul.leftmenu li a {
        font-size: 14px;
        letter-spacing: 0.3px;
    }

    .bold {
        font-family: "Arial Narrow", Arial, sans-serif !important;
        font-weight: 600;
    }
}

/*-------------------------
 Responsive Design CSS 
 ------------------------*/

@media screen and (min-width: 480px) {
    #site_header.navbar-default .navbar-brand {
        padding: 20px 15px;
    }

        #site_header.navbar-default .navbar-brand img {
            max-height: 35px;
        }
}

/*-- Min width --*/
@media screen and (min-width: 580px) {
    .filter-lists ul li {
        width: 50%;
    }

    .gridView .listingPanel > li {
        width: 33.3333%;
    }
}

@media screen and (min-width: 768px) {
    /*.mypobasket ul li .listImage { width: 25%; }*/
    .mypobasket ul li .listContent {
        width: 75%;
    }

    .padng0 {
        padding: 0;
    }
    .p-sm-0 {
        padding: 0;
    }
    .p-sm-r-0 {
       padding-right: 0; 
    }
    .p-sm-l-0 {
       padding-left: 0; 
    }

    #site_header.navbar-default .navbar-nav.navbar-right > li > span {
        padding: 15px;
    }

    .megamenu.login .loginPane, .megamenu.login .registerPane {
        display: inline-block;
        vertical-align: top;
        text-align: left;
        position: relative;
        width: 49.5%;
        min-height: 435px;
        padding: 1em;
        margin: 0;
    }

    .megamenu.login .loginPane {
        padding-left: 0;
    }

    .megamenu.login .registerPane {
        padding-right: 0;
    }

    .homeBanner {
        background-color: #f37421;
        background-image: url('../images/home-banner.png');
    }

        .homeBanner .search-panel {
            padding: 0 2em;
        }

    .serachbyInput .form-inline {
        width: 100%;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
    }

        .serachbyInput .form-inline .form-group {
            margin: 0 1% 20px;
        }

        .serachbyInput .form-inline.flex-wrap {
            justify-content: left;
        }

            .serachbyInput .form-inline.flex-wrap .form-group {
                width: 31.3333%;
                text-align: left;
            }

    .serachbyInput.byKeyword .form-inline, .serachbyInput.byEco .form-inline, .serachbyInput.byShotgun .form-inline {
        flex-wrap: nowrap;
    }

    .serachbyInput.byKeyword .form-group:first-child, .serachbyInput.byEco .form-group:first-child, .serachbyInput.byShotgun .form-group:first-child {
        width: 100%;
    }

    .partners-flash ul {
        display: flex;
        flex-wrap: wrap;
    }

        .partners-flash ul li {
            width: 50%;
        }

    .footer {
        background-image: url('../images/bgfooter.png');
        background-size: 200%;
    }

    .footer-middle {
        margin-bottom: 200px;
    }

    .footerLinks {
        padding-right: 0;
        flex-wrap: nowrap;
    }

    .footLogo {
        display: none;
    }

    .getSupplierText {
        text-align: right;
    }

    .sbasketcount a {
        justify-content: end;
    }

    .gridView .listingPanel > li {
        width: 25%;
        padding: 15px;
    }

    .customerArea .companyInfo {
        display: flex;
    }

        .customerArea .companyInfo .borderBox {
            width: 33.3333%;
        }

    ul.filter-list-items.colored-filter-list {
        justify-content: flex-end;
    }
}

@media screen and (min-width: 890px) {
    .footer {
        background-size: 100%;
    }
}

@media screen and (min-width: 993px) {

    .text-md-right {
        text-align: right;
    }

    .livechatBtn {
        top: 50%;
    }

    .showMainMenu .mainnav {
        padding: 50px 0;
    }

    .showMegamenu .megamenu {
        padding: 50px 0;
    }
    /*.showHeadersearch .header-search { padding: 0; }*/
    .logIn.mobile {
        display: none;
    }

    #site_header.navbar-default .menu i {
        font-size: 30px;
    }

    #site_header.navbar-default .navbar-brand {
        font-size: 30px;
    }

    #site_header.navbar-default .navbar-nav.navbar-right > li:last-child {
        margin-right: -15px;
    }

    .mainnav ul.navigate.level1 {
        display: flex;
        flex-wrap: wrap;
    }

        .mainnav ul.navigate.level1 > li {
            padding: 0 35px 0 0;
            margin: 0;
            min-width: 20%;
            max-width: 25%;
        }

    .megamenu .container {
        padding: 0 10em;
    }

    .closebtn {
        top: -5px;
    }

    .header-search .search-list ul li:first-child {
        display: block;
    }

    .category-products-list ul li {
        width: 16.6666%;
    }

        .category-products-list ul li .image-block {
            min-height: 140px;
        }

    .pageBanner .bannerLogo {
        position: absolute;
        top: 50px;
        right: -25px;
        width: 165px;
        height: 140px;
        text-align: right;
    }

        .pageBanner .bannerLogo span { /* display: block; width: 100px; height: 162px; */
            width: 90px;
            height: 148px;
        }

    .homeBanner .search-panel { /*padding: 8rem 5em;*/
        padding: 8rem 10em;
        text-align: center;
    }

        .homeBanner .search-panel h1 {
            font-size: 36px;
            line-height: 42px;
        }

        .homeBanner .search-panel ul.searchList {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            margin-bottom: 40px;
        }

    .selected-searchList {
        display: none;
    }

    .homeBanner .search-panel ul.searchList li.active label {
        color: #522e91;
        border-radius: 6px;
        background-color: #FFFFFF;
    }

        .homeBanner .search-panel ul.searchList li.active label:after {
            content: '';
            display: block;
            position: absolute;
            left: 50%;
            right: auto;
            bottom: -8px;
            width: 0;
            height: 0;
            margin-left: -8px;
            border-style: solid;
            border-width: 8px 8px 0 8px;
            border-color: #ffffff transparent transparent transparent;
        }

    .homeBanner .search-panel ul.searchList li:not(:first-child) label:before {
        content: '';
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 1px;
        height: 90%;
        background-color: #ffffff;
    }

    .homeBanner .search-panel ul.searchList li.active label:before, .homeBanner .search-panel ul.searchList li.active + li label:before {
        display: none;
    }

    .serachbyInput.byKeyword .form-inline, .serachbyInput.byEco .form-inline, .serachbyInput.byShotgun .form-inline {
        flex-wrap: wrap;
    }

    .serachbyInput.byKeyword .form-group:first-child, .serachbyInput.byEco .form-group:first-child, .serachbyInput.byShotgun .form-group:first-child {
        width: auto;
    }

    .serachbyInput.byKeyword .form-control, .serachbyInput.byEco .form-control, .serachbyInput.byShotgun .form-control {
        width: 400px;
        max-width: 100%;
    }

    .homepage-bottom-banners .banner-item .bg-overlay {
        padding-right: 12%; /*padding-right: 45%;*/
    }

    .footTopLogo {
        display: none;
    }

    .footer-head-text {
        margin-bottom: 60px;
    }

    .footer-middle {
        margin-bottom: 200px;
    }

    .footerLinks {
        padding-right: 150px;
    }

    .footLogo {
        display: block;
    }

    .page_heading h2 {
        font-size: 24px;
        font-weight: 400;
        letter-spacing: 0;
        line-height: 42px;
        padding-right: 150px;
    }

        .page_heading h2 .searchResult {
            display: inline-block;
        }

    .banner_Logo a {
        position: absolute;
        top: 0;
        right: 0;
        z-index: 1;
    }

    .filter-lists ul li {
        width: 33.3333%;
    }

    .gridView .listingPanel > li {
        width: 20%;
    }

    /* .product-info .real-time-price button {
        width: 131px;
        height: 85px;
        margin-bottom: 0;
    } */


    #statusoverviewtable .btn.sort-btn-coloured {
        width: 100px;
        color: #FFFFFF;
        font-size: 14px;
        font-weight: 400;
        letter-spacing: 0;
        line-height: 22px;
        text-align: center;
        padding: 4px 8px;
        background-color: #f37421;
        border: 1px solid transparent;
        border-radius: 4px;
    }
}

@media screen and (min-width: 1201px) {
    .header-search .container {
        padding: 3em 10em;
    }

    .homeBanner .search-panel { /*padding: 8rem 10em;*/
        padding: 8rem 12em;
    }

    .footer-middle {
        margin-bottom: 200px;
    }

    .closeFilter-top {
        display: none;
    }

    .filter-list {
        display: flex;
        justify-content: space-between;
    }

    .filter-list-items-block span.rightArrow {
        display: none;
    }

    .filter-lists ul li {
        width: 25%;
    }

    .filters-panel.show {
        padding: 30px 0;
    }

    .gridView .listingPanel > li {
        width: 16.6666%;
    }

    .icons-list.multiple {
        justify-content: flex-end;
    }

    .product-info .icons-lists {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .pageBanner .bannerLogo {
        right: 0;
    }

     .product-info .real-time-price button {
        width: 131px;
        height: 85px;
        margin-bottom: 0;
    }

    .text-lg-right {
        text-align: right;
    }
}

/*-- Max width --*/
@media (max-width: 1200px) {
    .container {
        width: 940px;
    }

    .bottomFoot {
        margin-bottom: 25px;
    }

    .bgImage {
        background-position: bottom -120px center;
    }

    .custom.modal-details .modal-dialog {
        width: 730px;
    }

    .nav.navbar-nav.navbar-left {
        width: 100%;
        border-bottom: 1px solid #3E2B65;
    }

    .nav.navbar-nav.navbar-right li.basketList {
        position: absolute;
        right: 0;
        top: 0;
    }
}

@media (max-width: 1024px) {
    .cusTooltip {
        display: none !important;
    }

    #colorbox, #colorbox.openbox {
        left: 25%;
    }

    .bgImage {
        background-position: bottom -100px center;
    }

    .contentlogoImage {
        min-height: 320px;
    }
}

@media (max-width: 992px) {
    .container {
        width: 880px;
    }

        .container .col-md-12 {
            width: 100%;
            float: left;
        }

    .navbar-right .logIn, .navbar-right .logOut {
        display: none;
    }

    .logIn.desktop {
        display: none;
    }

    .menu.hafDisplay, .headerSearchList.hafDisplay .basketList.hafDisplay {
        opacity: 0.4;
    }

    .navbar-nav-mobile.mobileView {
        display: block;
        width: 100%;
        border-width: 0 0px 1px;
        border-style: solid;
        border-color: #3E2B65;
        padding: 10px 0px;
        margin-bottom: 15px;
    }
        /*.navbar-nav.mobileView li { flex: 1 1 50%; }*/
        .navbar-nav-mobile.mobileView li > span, .navbar-nav-mobile.mobileView li > a {
            display: block;
            font-size: 16px;
            color: #522e91;
            line-height: 16px;
            font-weight: 400;
            padding: 10px 10px 10px 0;
        }

            .navbar-nav-mobile.mobileView li > span i, .navbar-nav-mobile.mobileView li > a i {
                margin-left: 10px;
            }

    .logIn .icon-user {
        left: 10px;
    }
    /*.liveChat .icon-livechat { left: -38px; }*/
    .keysearch {
        width: 235px;
    }

    .liveChat .icon-livechat {
        left: 80px;
    }

    span.icon-livechat1:before {
        color: #ffffff;
    }

    .homeBanner .container {
        padding: 100px 15px 15px;
    }

    .homeBanner h1 {
        font-size: 34px;
    }

    .home-search-panel {
        position: relative;
        margin-bottom: 10px;
    }

        .home-search-panel .searchList {
            position: absolute;
            top: 42px;
            left: 0;
            width: 100%;
            z-index: 10;
            background-color: #ffffff;
            border-radius: 6px;
            margin: 0;
            max-height: 0;
            overflow: hidden;
            box-shadow: 0 15px 15px 0 rgb(0 0 0 / 10%);
            z-index: 1010;
            -webkit-transition: .4s cubic-bezier(.2,.4,.2,1);
            -moz-transition: .4s cubic-bezier(.2,.4,.2,1);
            -ms-transition: .4s cubic-bezier(.2,.4,.2,1);
            -o-transition: .4s cubic-bezier(.2,.4,.2,1);
            transition: .4s cubic-bezier(.2,.4,.2,1);
        }

            .home-search-panel .searchList.show {
                max-height: 100vh;
                overflow-y: auto;
            }

    .searchList.mobile {
        width: 100%;
        background-color: transparent;
        border: 0;
        color: #fff;
        outline: 0;
    }

    .selected-searchList {
        display: flex;
        justify-content: space-between;
        padding: 10px 0;
        color: #FFFFFF;
        font-size: 18px;
        font-weight: 500;
        letter-spacing: 0;
        line-height: 22px;
    }

    .homeBanner .search-panel ul.searchList li {
        padding: 0;
    }

        .homeBanner .search-panel ul.searchList li label {
            color: #522e91;
            padding: 5px 10px;
            text-align: left;
        }

        .homeBanner .search-panel ul.searchList li.active label {
            background-color: #ebebeb;
        }

    .searchoptions {
        margin-bottom: 20px;
    }

    .panelBoxes ul li img {
        width: 100%;
    }

    .searchbyBox {
        padding: 20px 20px 20px 90px;
    }
    /*.serachbyInput .form-inline .form-group { width: 91%; float: left; }
.serachbyInput.byIdeas .form-inline .form-group { width: 44%; margin-right: 16px; }
.serachbyInput.byStock .form-inline .form-group { width: 44%; margin-right: 16px; }
.serachbyInput.gridviewInput .form-inline .form-group { width: 92%; }
.serachbyInput.gridviewInput.byIdeas .form-inline .form-group { width: 44.5%; }
.serachbyInput.gridviewInput.byStock .form-inline .form-group { width: 44.5%; }
.serachbyInput.bySupplier .form-group.part { width: 28.4%; }*/
    .searchList.gridView li {
        width: 145px;
    }

        .searchList.gridView li h3 {
            min-height: 35px;
        }
    /*.footerLinks_box { width: 23%; float: left; margin-right: 12px; }
.footerLinks_box:nth-child(4n){ border-right: 0px dotted #616161; }
.footerLinks_box.right { width: 110px; }*/

    /*.listingPanel li { width: 32%; }
.listingPanel li:nth-child(3n) { margin-right: 0 !important; }
.listingPanel li:nth-child(4n) { margin-right: 2%; }*/

    .productModview .listingPanel_img {
        width: 35%;
    }

    .productModview .listingPanel_text {
        width: 65%;
    }

    .lessproductinfoView .listingPanel_img {
        width: 35%;
    }

    .lessproductinfoView .listingPanel_text {
        width: 65%;
    }

    .moreproductinfoView .listingPanel_img {
        width: 40%;
    }

    .moreproductinfoView .listingPanel_text {
        width: 60%;
    }

    .moreproductinfoView .listingPanel_img .info_circles .smallrund {
        margin: 0px 2%;
    }

    .brandlogo {
        width: 70px;
        height: 70px;
    }

    .bgImage {
        background-position: bottom -70px center;
    }

    .pageLinks li a, .pageLinks li a.active, .pageLinks li a:hover, .pageLinks li a:focus {
        font-size: 15px !important;
    }

    .borderBox {
        width: 280px;
    }

    .companyInfo .btn {
        width: 237px;
    }

    .borderBox.twoWidth {
        width: 580px;
    }

    .borderBox1 {
        width: 217px;
    }

    .marketAnalysis .companyInfo .btn {
        width: 197px;
    }

    .listContent {
        width: 460px;
    }

    .mybasketListsbtns .btn {
        width: 202px;
    }

    .productRange {
        width: 445px;
    }

    .addtoShotgun {
        width: 155px;
    }

    .panelBoxes.homepage ul li {
        min-height: 280px;
    }

    #serachBy h1 {
        padding-right: 85px;
    }

    .footerLinks_box.social, .footerLinks_box.last {
        width: 48% !important;
        float: left;
        display: block;
    }

    .blowipad {
        width: 100%;
        float: left;
        display: block;
    }

    .supplierSearches ul.tradesupplerLists li .contacInfo {
        width: 20%;
    }

        .supplierSearches ul.tradesupplerLists li .contacInfo .tradesupplierImage {
            width: 100%;
        }

    .supplierSearches ul.tradesupplerLists li .productRange {
        width: 80%;
    }

        .supplierSearches ul.tradesupplerLists li .productRange .customBtns {
            width: 62%;
        }

        .supplierSearches ul.tradesupplerLists li .productRange .info_circles {
            width: 38%;
        }

        .supplierSearches ul.tradesupplerLists li .productRange .customBtns .btn {
            margin-bottom: 6px;
        }

    #statusoverviewtable .btn.sort-btn-coloured {
        display: none;
    }

    .our-brands-block-title table, .our-brands-block-title table tbody, .our-brands-block-title table tbody tr, .our-brands-block-title table tbody tr td {
        display: block;
    }

        .our-brands-block-title table tr td img {
            margin: 0 0 10px;
        }
}

@media (max-width: 890px) {
    .container {
        width: 800px;
    }

    .searchList.gridView li {
        width: 132px;
    }

    .selectBtns {
        width: 56px;
    }

    .borderBox {
        width: 253px;
    }

    .companyInfo h3 {
        font-size: 21px;
    }

    .companyInfo .btn {
        width: 211px;
    }

    .borderBox.twoWidth {
        width: 527px;
    }

    .borderBox1 {
        width: 197px;
    }

    .marketAnalysis .companyInfo .btn {
        width: 177px;
    }

    .listContent {
        width: 410px;
    }

    .mybasketListsbtns .btn {
        width: 189px;
        margin-right: 10px;
    }

    .selectRemove {
        width: 220px;
    }

    .addtoShotgun {
        width: 100%;
        min-height: 35px;
    }

    .qtnprdctdtls {
        padding-left: 0px;
    }

    .selectCurrency .qtnprdctdtls {
        padding-left: 0px;
    }
}

@media (max-width: 860px) {
    #site_header.navbar-default .navbar-nav > li > a.navbar-brand {
        font-size: 21px;
    }

    .keysearch {
        width: 210px;
    }
    /*span.icon-livechat1 { top: 4px; }*/
    .pageLinks.tabview li {
        width: 30%;
    }

    .pageLinks li:last-child {
        text-align: center;
    }

    .ftmiddle_box {
        padding: 15px !important;
    }
}

@media (max-width: 800px) {
    .container {
        width: 100%;
        padding: 15px;
    }

    #gridviewInput .container {
        padding: 5px 15px 40px;
    }

    .searchList.gridView li {
        width: 16%;
    }

    .serachbyInput.gridviewInput .form-inline .form-group {
        width: 92%;
    }

    .serachbyInput.gridviewInput.byIdeas .form-inline .form-group {
        width: 44%;
    }

    .serachbyInput.gridviewInput.byStock .form-inline .form-group {
        width: 44%;
    }

    .serachbyInput.bySupplier .form-group.part {
        width: 28.6%;
    }
    /*.footerLinks_box.right { width: 100%; float: left; min-height: 200px; padding-top: 30px; }
.footerLinks_box { width: 23%; float: left; margin-right: 12px; }*/
    #megamenu_wrapper .megamenu.login .headerMenuContainer {
        width: 100%;
    }

    #megamenu_wrapper .megamenu.login .loginPane, #megamenu_wrapper .megamenu.login .registerPane {
        width: 285px;
    }

    .page_breadcrumb .container {
        padding: 0px 0px;
    }

    .listswitchbox.container {
        padding: 0px 15px;
    }

    .container.productModview.modal-content {
        width: 98%;
    }

    .productModview .info_circles .smallrund {
        margin-bottom: 15px;
    }

    .contentlogoImage {
        min-height: 260px;
    }

    .contactDetails {
        padding: 0px 0px 20px;
    }

    .pageLinks li a, .pageLinks li a.active, .pageLinks li a:hover, .pageLinks li a:focus {
        font-size: 13px !important;
    }

    .selectBtns {
        width: 52px;
    }

    .borderBox {
        width: 232px;
    }

    .companyInfo .btn {
        width: 190px;
    }

    .borderBox.twoWidth {
        width: 486px;
    }

    .borderBox1 {
        width: 182px;
    }

    .marketAnalysis .companyInfo .btn {
        width: 162px;
    }

    .listContent {
        width: 385px;
    }

    .mybasketListsbtns .btn {
        width: 174px;
        margin-right: 10px;
        background-size: 30px;
        padding: 10px 10px 10px 45px;
        font-size: 16px;
    }

    .selectRemove {
        width: 182px;
    }

    .quotationform .fieldRow {
        width: 96%;
    }

    .qtnprdctdtls {
        width: 100%;
    }

    /*.dynamic-highway-page .custom-table .vscroll-table { overflow-x: auto; }*/
    .dynamic-highway-page .custom-table tr th, .dynamic-highway-page .custom-table tr td {
        padding: 4px;
        font-size: 7px !important;
        line-height: 1;
    }

        .dynamic-highway-page .custom-table tr td img {
            width: 20px;
        }
}

@media (max-width: 768px) {
    #pageBanner .pageBanner {
        min-height: 200px;
    }

    .supplierSearches ul.tradesupplerLists li .productRange .customBtns {
        width: 100%;
    }

    .supplierSearches ul.tradesupplerLists li .productRange .info_circles {
        width: 100%;
    }

    .livechatBtn {
        display: none;
    }
}


@media (max-width: 767px) {
    .homeBanner h1 {
        font-size: 28px;
        margin-top: 130px
    }

    .navbar-nav {
        margin: 0;
    }

    .navbar-collapse.collapse {
        display: block;
        position: relative;
        border: 0;
    }

    .navbar-collapse .navbar-left {
        float: left;
    }

        .navbar-collapse .navbar-left .menuList {
            float: left;
        }

        .navbar-collapse .navbar-left .brand {
            float: right;
            text-align: center;
            font-size: 28px !important;
            position: absolute;
            left: 38%;
        }

    .navbar-collapse .navbar-right {
        float: right;
    }

        .navbar-collapse .navbar-right .homelink, .navbar-collapse .navbar-right .logIn, .navbar-collapse .navbar-right .logOut, .navbar-collapse .navbar-right .liveChat, .navbar-collapse .navbar-right .keysearch {
            display: none;
        }

    .mobileView {
        display: block;
    }

    .logIn .icon-user, .liveChat .icon-livechat {
    }

    .searchList.gridView li {
        width: 33%;
        margin: 0;
    }
    /*.pageLinkstop { display: none; }*/
    .pageLinks.tabview li {
        width: 50%;
        margin-bottom: 5px;
    }

    .selectBtns {
        width: 100%;
        padding-right: 0px;
        margin-top: 10px;
    }

        .selectBtns .btn {
            width: 48%;
            height: 45px;
        }

    .supplierList {
        padding: 0px 15px;
    }

    .supplierSelection {
        padding: 0px 15px;
    }

    .selectBtns .btn:first-child {
        margin-right: 3%;
    }

    .selectBtns .btn span.rightArrow {
        background-image: url('../images/down-arrow-navi.png');
        background-image: url('../images/down-arrow-navi.svg');
    }

    .selectBtns .btn:hover span.rightArrow, .selectBtns .btn:focus span.rightArrow {
        background-image: url('../images/down-arrow.png');
        background-image: url('../images/down-arrow.svg');
    }

    .selectBtns .btn span.leftArrow {
        background-image: url('../images/up-arrow-navi.png');
        background-image: url('../images/up-arrow-navi.svg');
    }

    .selectBtns .btn:hover span.leftArrow, .selectBtns .btn:focus span.leftArrow {
        background-image: url('../images/up-arrow.png');
        background-image: url('../images/up-arrow.svg');
    }

    .supplierslctdLists {
        width: 100%;
        float: left;
    }

    .borderBox {
        width: 100%;
        margin-bottom: 20px;
        min-height: auto;
        padding-bottom: 75px;
    }

        .borderBox.twoButtons {
            padding-bottom: 135px;
        }

    .companyInfo .btn {
        width: 200px;
    }

    .borderBox.twoWidth {
        width: 100%;
    }

    .borderBox1 {
        width: 100%;
        margin-bottom: 0px;
        min-height: auto;
        padding-bottom: 75px;
    }

    .second .borderBox1 {
        min-height: auto;
    }

    .marketAnalysis .companyInfo .btn {
        width: 200px;
    }

    .marketPlaceinfo [class^="col-"] {
        padding: 0px !important;
    }

    .marketPlacebox h4 {
        min-height: auto;
    }


    .contacInfo {
        width: 100%;
    }

    .productRange {
        width: 100%;
    }

    .supplierDirectory .tradesupplerLists .productRange {
        width: 100%;
    }

    .custom.modal-details .modal-dialog {
        width: 95%;
    }

    .nav.navbar-nav.navbar-left {
        border-bottom: 0px solid #3E2B65;
    }

    .footer {
        background-color: #f5f5f5;
        background-position: bottom 100px center;
    }

    .footer-middle {
        margin-bottom: 250px;
    }

    .footer-bottom .footer-logos, .footer-bottom .copyright {
        text-align: center;
    }

    .footerLinks_box ul li a.logIn {
        padding: 0px 20px 0px 0px !important;
    }

    .serachbyInput .form-control, .serachbyInput .btn {
        width: 100%;
    }

    .serachbyInput .btn {
        margin-bottom: 15px;
    }

    .modal-dh-product-counter .modal-lg {
        width: 95%;
    }

    .modal-dh-product-counter .dh-product-counter-table tr td {
        font-size: 9px;
    }

        .modal-dh-product-counter .dh-product-counter-table tr td.dh-count {
            font-size: 14px;
        }
}

@media (max-width: 767px) {
    /*.serachbyInput .form-inline .form-group { width: 90%; }
.serachbyInput.byIdeas .form-inline .form-group { width: 43.7%; }
.serachbyInput.byStock .form-inline .form-group { width: 43.7%; }
.serachbyInput.gridviewInput .form-inline .form-group { width: 90%; }
.serachbyInput.gridviewInput.byIdeas .form-inline .form-group { width: 43.5%; }
.serachbyInput.gridviewInput.byStock .form-inline .form-group { width: 43.5%; }
.serachbyInput.bySupplier .form-group.part { width: 28.1%; }*/
    /*.liveChat .icon-livechat { left: 6px; }*/
    .active .arrow-down {
        display: none;
    }

    .logIn .icon-user {
        top: 8px;
    }

    #colorbox, #colorbox.openbox {
        width: 49%;
    }

    /*#pageBanner .pageBanner { padding: 30px 0px 100px; }*/

    .moreproductinfoView .addtoBasketbtns .btn {
        width: 200px;
        margin-bottom: 10px;
    }

    .pageLinks li {
        width: 33.3%;
        margin-bottom: 20px;
    }
    /*.pageLinks li:nth-child(3n) a { float: right; padding-bottom: 0; border-bottom: 2px solid transparent; margin-bottom: 0px; }
.pageLinks li:nth-child(4) { text-align: left; }*/
    /*.pageLinks li a { padding-bottom: 10px; }*/
    .bgImage {
        padding: 0px;
    }

    .bx-wrapper {
        float: left;
        padding: 0px 10px 0px 20px;
    }

        .bx-wrapper .bx-viewport {
            background-color: transparent;
            border: 0;
            box-shadow: none;
        }

        .bx-wrapper .bx-pager.bx-default-pager a {
            background: #B1B1B1;
        }

            .bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active {
                background: #000;
                width: 12px;
                height: 12px;
                border-radius: 50%;
            }

    .listImage {
        width: 23%;
    }

    .listContent {
        width: 76%;
    }

    .selectRemove {
        width: 200px;
    }

    .mybasketLists .selectRemove {
        min-height: 60px;
    }

    .mybasketListsbtns .btn {
        width: 45%;
        margin: 2%;
    }

    .qtnprdctdtls .has-feedback .form-control {
        padding: 10px;
    }

    .leftFilter {
        position: relative;
        margin-bottom: 40px;
    }

    #leftSidebar {
        width: 100%;
        position: absolute;
        margin-left: 0;
        margin-bottom: 20px;
        padding: 0px 10px;
        top: 0 !important;
    }

    .switchLeftbar {
        background-color: #ccc;
        min-height: 32px;
    }

    .rotate {
        position: relative;
        top: 5px;
        right: 0;
    }

    .leftSidebar.opened .rotate {
        opacity: 1;
    }

    .leftSidebar_panel {
        display: none;
        margin-bottom: 20px;
    }

    .leftSidebar.opened .leftSidebar_panel {
        display: block;
    }

    .pageBanner {
        position: relative;
    }

    .pageBanner_text.left {
        width: 100%;
        padding-right: 130px;
    }

    .banner_Logo.right {
        position: absolute;
        top: 15px;
        right: 20px;
        width: 100px;
    }

        .banner_Logo.right span {
            position: relative;
            display: block;
        }

    .mobileView {
        border-width: 1px 0px;
        border-style: solid;
        border-color: #3E2B65;
        padding: 10px 0px;
    }
    /*.mobileView li { min-height: 45px; }
.mobileView .logIn, .mobileView .liveChat { width: 100%; float: left; }*/

    .ftmiddle_box {
        width: 100%;
        margin-bottom: 15px;
        float: left;
    }
}

@media (max-width: 735px) {
    .qty {
        width: 30%;
    }

    .cost {
        width: 70%;
        padding: 0px 0px 0px 10px !important;
    }

    .selling {
        width: 50%;
        padding: 0px 10px 0px 0px !important;
    }

    .carriagecst {
        width: 50%;
        padding: 0px 0px 0px 10px !important;
    }

    .carriageslng {
        width: 100%;
        padding: 0px !important;
    }

    .branddtls {
        width: 76%;
        padding: 0px 10px 0px 0px !important;
    }

    .prdctclr {
        width: 24%;
        padding: 0px 0px 0px 10px !important;
    }

    .origcost {
        width: 50%;
        padding: 0px 10px 0px 0px !important;
    }

    .origqty {
        width: 50%;
        padding: 0px 0px 0px 10px !important;
    }

    .origcostotle {
        width: 50%;
        padding: 0px 10px 0px 0px !important;
    }

    .origsellng {
        width: 50%;
        padding: 0px 0px 0px 10px !important;
    }

    .quotationdoc .qtnprdctdtls .costdtls .qty, .quotationdoc .qtnprdctdtls .costdtls .subtotal {
        width: 50%;
        padding: 0px 10px 0px 0px !important;
    }

    .quotationdoc .qtnprdctdtls .costdtls .cost, .quotationdoc .qtnprdctdtls .costdtls .carriagecst {
        width: 50%;
        padding: 0px 0px 0px 10px !important;
    }

    .quotationdoc .qtnprdctdtls .costdtls.origination .qty.originhead {
        width: 100%;
    }

    .quotationdoc .qtnprdctdtls .costdtls.origination .cost {
        width: 33%;
        padding: 0px 10px 0px 0px !important;
    }

    .quotationdoc .qtnprdctdtls .costdtls.origination .carriagecst {
        width: 33%;
        padding: 0px 0px 0px 10px !important;
    }

    .quotationdoc .qtnprdctdtls .costdtls.origination .subtotal {
        width: 33%;
        padding: 0px 10px 0px 10px !important;
    }

    .colFour {
        width: 70%;
    }

    .colSix {
        width: 100%;
        padding: 0 !important;
    }
}

@media (max-width: 699px) {
    .container {
        width: 100%;
        padding: 0px 20px;
    }

    #gridviewInput .container {
        padding: 5px 20px 40px;
    }

    #pages_wrapper .page {
        position: relative;
    }

    .logIn .icon-user, .liveChat .icon-livechat {
        top: 10px;
    }

    .page_struct_vert {
        margin-left: 20em;
    }

    #mainmenu {
        display: none;
        position: absolute;
        width: 50%;
        left: 20em;
        top: 60px;
        z-index: 100;
        padding: 0px 0px 20px 10px;
    }
    /*.mobileView  .logIn { width: 58%; float: left; }
.mobileView .liveChat { width: 42%; float: left; }*/
    /* #cartLayerContainer { display: none; position: absolute; width: 50%; left: 20em; top: 60px; z-index: 100; } */
    .cartCheckout .btn {
        white-space: wrap;
    }

    ul.cartlist li p {
        width: 55%;
    }

    .panelBoxes ul li {
        widtH: 100%;
    }
    /*.footerLinks { margin-bottom: 0; }
.footerLinks_box { width: 45%; margin-bottom: 20px; margin-right: 3%; }
.footerLinks_box:nth-child(2n) { border: 0; }*/
    /*.bottomFoot { margin-bottom: -45px; }*/
    .bottomFoot div {
        width: 100%;
        float: left;
    }

        .bottomFoot div img:last-child {
            width: 100px;
        }

    /*.serachbyInput .form-inline .form-group { width: 86%; }
.serachbyInput.byIdeas .form-inline .form-group { width: 41%; }
.serachbyInput.byStock .form-inline .form-group { width: 41%; }
.serachbyInput.gridviewInput .form-inline .form-group { width: 88%; }
.serachbyInput.gridviewInput.byIdeas .form-inline .form-group { width: 42%; }
.serachbyInput.gridviewInput.byStock .form-inline .form-group { width: 42%; }
.serachbyInput.bySupplier .form-group.part { width: 27%; }*/
    .form-control {
        padding: 6px;
    }

    .selectpicker {
        padding: 6px;
    }

    #colorbox {
        display: none;
    }

    /*.listingPanel li { width: 49%; }
.listingPanel li:nth-child(3n) { margin-right: 2% !important; }
.listingPanel li:nth-child(2n) { margin-right: 0 !important; }*/

    .moreproductinfoView .listingPanel_img {
        width: 252px;
    }

    .moreproductinfoView .listingPanel_text {
        width: 100%;
        padding: 0px;
    }

    .panelBoxes.homepage ul li {
        min-height: auto;
    }

    .belowipadprt {
        width: 100%;
        float: left;
        display: block;
    }
}

@media (max-width: 680px) {
    .productModview .listingPanel_img {
        width: 48%;
    }

    .productModview .listingPanel_text {
        width: 100%;
        padding: 0;
    }

    .lessproductinfoView .listingPanel_text {
        padding: 0px 15px;
    }

        .lessproductinfoView .listingPanel_text .info_circles .smallrund {
            margin: 0px 5px !important;
        }

    .spacewidth {
        display: block;
    }

    .contentlogoImage {
        min-height: 200px;
    }

    .contentlogoImage {
        padding-top: 20px;
    }

    .supplierSearches ul.tradesupplerLists li .contacInfo {
        width: 100%;
    }

    .supplierSearches ul.tradesupplerLists li .productRange {
        width: 100%
    }
}

@media (max-width: 579px) {
    #serachBy h1 {
        padding-right: 40px;
        min-height: 80px;
    }

    .listViewbtn, .listViewbtn.active {
        right: 0px;
        top: 40px;
    }

    .gridViewbtn, .gridViewbtn.active {
        right: 0px;
    }

    .searchList.listView li {
        position: relative;
        width: 100%;
        float: left;
        margin-bottom: 20px;
    }

        .searchList.listView li h3 {
            position: absolute;
            top: 0px;
            right: 0px;
            padding-left: 95px;
            z-index: 9;
        }

    .searchbyBox {
        padding: 0px;
    }

    .serachbyIcon {
        position: relative;
    }
    /*.serachbyInput { width: 100%; float:left; padding: 20px; }
.serachbyInput .form-inline .form-group { width: 100%; margin-bottom: 15px; }
.serachbyInput.byIdeas .form-inline .form-group { width: 100%; margin: 0px 0px 15px 0px; }
.serachbyInput.byStock .form-inline .form-group { width: 100%; margin: 0px 0px 15px 0px; }
.serachbyInput.gridviewInput .form-inline .form-group { width: 100%; }
.serachbyInput.gridviewInput.byIdeas .form-inline .form-group { width: 100%; margin: 0px 0px 15px 0px; }
.serachbyInput.gridviewInput.byStock .form-inline .form-group { width: 100%; margin: 0px 0px 15px 0px; }
.serachbyInput.bySupplier .form-group.part { width: 100%; margin: 0px 0px 15px 0px; }
.serachbyInput.bySupplier .form-group.part.middle {  margin: 0px 0px 15px 0px; }
.serachbyInput .btn { width: 100%; }*/

    .navbar-collapse .navbar-left .brand {
        left: 32%;
    }
    /*.parntersImages { width: 400px;  position: relative; }
/*.parntersImages div { 
    -ms-transform: rotate(90deg); /* IE 9 /
    -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera /
    transform: rotate(90deg);
	position: absolute; top: 148px; width: 350px;
	}*
.parntersImages div { width: 100%; }
.parntersImages div:first-child { left: -110px;  }
.parntersImages div:nth-child(2) { left: -20px;  }
.parntersImages div:nth-child(3) { right: -16px;  }
.parntersImages div:last-child { right: -110px;  }*/

    .searchList.gridView .serachbyIcon {
        width: 80px;
        height: 80px;
        padding: 15px 10px;
    }

    .homeBanner h1 {
        margin-top: 140px;
    }

    .listSwitchiew .listViewbtn, .listSwitchiew .listViewbtn.active {
        right: 0px;
        top: 6px;
    }

    .listSwitchiew .gridViewbtn, .listSwitchiew .gridViewbtn.active {
        right: 40px;
    }

    .listingPanel_img.open .productImg {
        width: 400px;
        height: 400px;
    }

    .lessproductinfoView .listingPanel_img {
        width: 48%;
    }

    .lessproductinfoView .listingPanel_text {
        width: 100%;
        padding: 0 10px;
    }

        .lessproductinfoView .listingPanel_text .info_circles .smallrund {
            margin: 0px 8px 10px 0px !important;
        }

    .bgImage {
        background-position: bottom -30px center;
    }

    .checkFor label {
        font-size: 14px;
    }

    .sendShotgunform .fieldRow {
        width: 85%;
    }

    .qtnprdctdtls label {
        font-size: 14px;
    }

    .supplierDirectory .serachbyIcon {
        position: absolute;
    }

    .supplierDirectory .serachbyInput {
        padding: 0px;
    }

        .supplierDirectory .serachbyInput .form-inline .form-group {
            width: 86%;
            margin-bottom: 0px;
        }
}

@media (max-width: 515px) {
    .quotationCreathead.getPricesbaskt .preview, .quotationdocfoot.getPricesbaskt .preview {
        width: 100%;
    }

        .quotationCreathead.getPricesbaskt .preview .btn.requsetPrices, .quotationdocfoot.getPricesbaskt .preview .btn.requsetPrices {
            width: 100% !important;
            float: right;
            margin: 1px 0px 1px 0px;
        }

        .quotationCreathead.getPricesbaskt .preview .btn.clearAll, .quotationCreathead.getPricesbaskt .preview .btn.newSearch, .quotationdocfoot.getPricesbaskt .preview .btn.clearAll, .quotationdocfoot.getPricesbaskt .preview .btn.newSearch {
            width: 50% !important;
            float: left;
            margin: 0;
        }

    .supplierDirectory .searchbyBox .btnSearch {
        width: 45px;
    }

    .supplierDirectory .serachbyInput .form-inline .form-group {
        width: 85%;
    }
}

@media (max-width: 479px) {
    /*.listingPanel li { width: 100%; margin: 0 0 15px 0px !important; }*/
    .info_circles {
        width: auto;
        margin: 0 auto;
    }

    .listingPanel.gridView {
        width: 100%;
        margin: 20px auto 0px;
        float: none;
    }

    .listingPanel_text h4 {
        min-height: auto;
    }

    .listingPanel.gridView .listingPanel_img {
        width: 100%;
        margin: 0px auto;
        padding: 10px;
    }

    .listingPanel.gridView .listingPanel_text {
        width: 100%;
        margin: 0px auto;
    }

        .listingPanel.gridView .listingPanel_text .info_circles {
            width: 150px;
            margin: 0 auto;
            float: none;
        }

            .listingPanel.gridView .listingPanel_text .info_circles .smallrund {
                margin: 0 8px;
            }

    .addtoBasketbtns .btn {
        width: 200px;
        margin-bottom: 10px;
    }

    .productModview .listingPanel_img {
        width: 270px;
    }

    .listingPanel_img.open .productImg {
        width: 320px;
        height: 320px;
    }

    .contentlogoImage {
        min-height: 140px;
    }

    .mybasketLists .listImage {
        width: 100%;
        text-align: center;
    }

    .listImage img {
        width: 40%;
    }

    .mybasketLists .listContent {
        width: 100%;
    }

    .mybasketListshead .selectRemove label {
        font-size: 16px;
    }

    .mybasketListshead .selectRemove .checkFor .cr {
        margin: 3px 8px;
    }

    .selectRemove {
        width: 180px;
    }

    .mybasketListsbtns .btn {
        width: 96%;
    }

    .nav-tabs.nav-justified > li {
        float: left;
    }

    .customBtns .btn {
        width: 96%;
        margin: 2%;
    }

    .branddtls {
        width: 100%;
        padding: 0px !important;
    }

    .prdctclr {
        width: 100%;
        padding: 0px !important;
    }

    .origcost {
        width: 100%;
        padding: 0px !important;
    }

    .origqty {
        width: 100%;
        padding: 0px !important;
    }

    .origcostotle {
        width: 100%;
        padding: 0px !important;
    }

    .origsellng {
        width: 100%;
        padding: 0px !important;
    }

    .customBtns.preview .btn {
        width: auto;
        margin: 0;
    }

    .tradesupplerLists .prdctimg {
        width: 30%;
    }

    .tradesupplerLists .prdctinfo {
        width: 70%;
    }
}

@media (max-width: 414px) {
    .quotationCreathead.ideaList .preview, .quotationCreatfoot.ideaList .preview {
        width: 100%;
    }

        .quotationCreathead.ideaList .preview .btn, .quotationCreatfoot.ideaList .preview .btn {
            width: 49% !important;
            float: left;
        }

    .supplierDirectory .serachbyInput .form-inline .form-group {
        width: 68%;
    }

    .pageLinks.tabview li {
        width: 100%;
    }

    .pageLinks li {
        width: 100%;
        margin-bottom: 5px;
        padding-bottom: 12px;
        text-align: left;
    }

        .pageLinks li a {
            width: 100%;
            padding-bottom: 13px;
        }

    .pageBanner_text h1 {
        font-size: 34px;
    }
    /*.parntersImages div { width: 320px; min-height: 30px; }
.parntersImages div { min-height: 50px; }*/
    .mobileView .logIn, .mobileView .logOut, .mobileView .liveChat {
        width: 100%;
        float: left;
    }

    .modal-dialog {
        width: 94%;
    }

    .homeBanner h1 {
        font-size: 28px;
    }
}

@media (max-width: 413px) {
    .navbar-collapse .navbar-left .brand {
        left: 28%;
    }

        .navbar-collapse .navbar-left .brand a {
            padding: 10px 0 !important;
        }
    /*.footerLinks { margin-bottom: 150px; }
.footerLinks_box { width: 100%; margin-bottom: 0px; margin-right: 0; border: 0; min-height: auto;  }
.footerLinks_box h5 { margin-top: 20px; }
.parntersImages { width: 320px; }
.parntersImages div:first-child { left: -120px;  }
.parntersImages div:nth-child(2) { left: -50px;  }
.parntersImages div:nth-child(3) { right: -20px;  }
.parntersImages div:last-child { right: -90px;  }*/

    .productModview .listingPanel_img {
        width: 230px;
    }

    .pageLinks li a, .pageLinks li a.active, .pageLinks li a:hover, .pageLinks li a:focus {
        font-size: 13px !important;
    }

    .dynamicImage {
        padding-left: 0px;
        padding-top: 95px;
    }

    .selectBtns .btn {
        width: 47%;
    }

    .sendShotgunform .fieldRow {
        width: 95%;
    }

    .quotationdoc .qtnprdctdtls .costdtls .qty, .quotationdoc .qtnprdctdtls .costdtls .subtotal {
        width: 100%;
        padding: 0px !important;
    }

    .quotationdoc .qtnprdctdtls .costdtls .cost, .quotationdoc .qtnprdctdtls .costdtls .carriagecst {
        width: 100%;
        padding: 0px !important;
    }

    .quotationdoc .qtnprdctdtls .costdtls.origination .cost {
        width: 100%;
        padding: 0px !important;
    }

    .quotationdoc .qtnprdctdtls .costdtls.origination .carriagecst {
        width: 100%;
        padding: 0px !important;
    }

    .quotationdoc .qtnprdctdtls .costdtls.origination .subtotal {
        width: 100%;
        padding: 0px !important;
    }

    .quotationdochead .customBtns .btn {
        width: 100%;
        margin: 3px 1px 0px 0px;
    }

    .quotationdocfoot .customBtns .btn {
        width: 100%;
        margin: 3px 1px 0px 0px;
    }
}

@media (max-width: 380px) {
    .listingPanel_img.open .productImg {
        width: 260px;
        height: 260px;
    }

        .listingPanel_img.open .productImg img {
            width: 100%;
        }

    .lessproductinfoView .listingPanel_img {
        width: 100%;
    }

    .listingPanel.listView .viewModal {
        display: none;
    }

        .listingPanel.listView .viewModal.open {
            display: block;
        }

    .lessproductinfoView .listingPanel_text .info_circles .smallrund {
        margin: 0px 4px 10px 0px !important;
    }

    .moreproductinfoView .listingPanel_img.open .productImg {
        width: 280px;
        height: 280px;
    }

    .quotationCreathead.ideaList .preview .btn {
        padding: 10px 15px 10px 40px !important;
        background-size: 20px;
    }

        .quotationCreathead.ideaList .preview .btn.previewbtn {
            background-size: 26px !important;
            background-position: center left 10px !important;
        }

    .quotationCreatfoot.ideaList .preview .btn {
        padding: 10px 15px 10px 40px !important;
        background-size: 20px;
    }

        .quotationCreatfoot.ideaList .preview .btn.previewbtn {
            background-size: 26px !important;
            background-position: center left 10px !important;
        }
}

@media (max-width: 340px) {
    .pageLinks li a, .pageLinks li a.active, .pageLinks li a:hover, .pageLinks li a:focus {
        font-size: 11px !important;
    }
}


.bg-datarate {
    display: inline-block;
    position: relative;
    width: 35px;
    height: 35px;
    background-image: url(../images/data-rating-bg.png);
    background-repeat: no-repeat;
    background-size: 34px;
    background-position: center;
    padding: 9px;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
}

.small-datarate {
    float: left;
    background-size: 30px;
    font-size: 12px;
    height: 40px;
}

.float-left {
    float: left !important
}

.supplier-margin {
    margin: 0 7%
}

.bestprice {
    background-color: #b9ddf5;
}

.products-icon {
    margin: 0 3% !important;
}

.dh-box-info {
    text-align: center;
}

.tooltip-white-row {
    background-color: #f0f0f0 !important;
}

.tooltip-gray-row {
    background-color: #d8d6d7 !important;
}

.tooltip-td-col1 {
    text-align: left;
    font-weight: normal !important;
}

.carriage_cost_qty {
    width: 91px;
}

.carriage_cost_price {
    width: 94px;
}

.carriage_cost_catalog {
    width: 120px;
}

.customerarea-checkbox {
    float: right;
}

.customerarea-checkbox-label {
    font-weight: normal !important;
    margin-bottom: 0px !important;
    margin-top: 0px !important;
}

.customerarea-cr {
    margin-right: 0px !important;
}

.tooltip-td-lastrow-col1 {
    font-weight: 600 !important;
}
/*.smallerrund{margin: 0 3% !important;}*/
.icon-questionmark {
    background-color: #fff !important;
    position: relative;
    width: 18px;
    height: 18px;
    display: inline-block !important;
    border: 0;
    border-radius: 50%;
    padding: 0px;
    color: #000;
    font-size: 12px;
    line-height: 17px;
    font-weight: 500;
    text-align: center;
    margin: 0 !important;
    top: -2px;
}

    .icon-questionmark .cusTooltip {
        background-color: #d8d6d7 !important;
        color: #000;
        width: 200px;
        position: absolute;
        font-size: 12px;
        font-weight: normal;
        letter-spacing: 0.4px;
        line-height: 16px;
        top: auto;
        bottom: 28px;
        left: -92px;
        white-space: normal;
    }

        .icon-questionmark .cusTooltip:after {
            left: 45%;
            border-top: 10px solid #d8d6d7;
        }

    .icon-questionmark:hover > .cusTooltip {
        display: block;
    }

.span.price-tag {
    width: 22px;
    height: 22px;
    background-color: #ffffff;
    display: inline-block;
    border-radius: 50%;
    color: #444;
    padding: 2px;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
}


.icon-lists .info_circles {
    margin-bottom: 25px;
}

    .icon-lists .info_circles, .icon-lists .info_circles .left {
        padding: 0;
    }

        .icon-lists .info_circles .smallrund {
            margin: 0px 8px 8px;
            padding: 16px 10px;
            width: 52px;
            height: 52px;
        }

            .icon-lists .info_circles .smallrund span {
                color: #fff;
                font-size: 18px;
                font-family: "Open-sans", sans-serif;
                font-weight: 400;
            }

.info_circles .smallrund span {
    color: #fff;
    font-size: 18px;
    font-family: "Open-sans", sans-serif;
    font-weight: 400;
}

.icon-lists .info_circles .smallrund span.cusTooltip {
    font-size: 12px;
}

.icon-lists .info_circles .smallrund:hover .cusTooltip {
    bottom: 60px;
    top: auto;
    left: -32px;
    width: 130px;
    white-space: normal;
}



.mypobasket .quotationpricedproduct {
    width: 100%;
    float: left;
    padding: 30px 0;
    background-color: transparent;
    text-align: left;
    position: relative;
    border-bottom: 1px solid #000000;
}

.mypobasket .quotationproduct {
    padding: 30px 0;
    background-color: transparent;
    text-align: left;
    position: relative;
}

    .mypobasket .quotationproduct h3 {
        margin-bottom: 30px;
    }

.mypobasket .ajax-loader {
    position: absolute;
    z-index: 10000;
    width: 100%;
    height: 90%;
    background-color: #00000052;
    text-align: center;
    padding-top: 10%;
}

    .mypobasket .ajax-loader img {
        width: 80px;
    }

.pobasketlists li:first-child {
    border-top: 1px solid #e1e1e1;
}

.pobasketlists li .fieldRow input.text-box {
    width: 100%;
}

.pobasketlists li .selectRemove .remove {
    bottom: 30px;
}

.mypobasket .btn {
    border-radius: 0;
    border: 0;
    font-size: 16px;
    padding: 10px 20px;
}

.pobasketlists li .fieldRow label {
    line-height: 34px;
    margin: 0;
}

.pobasketlists li .listContent .fieldRow input {
    padding: 6px 12px;
}

.p-relative {
    position: relative;
}

.poajaxloader {
    position: absolute;
    right: -30px;
    bottom: 4px;
    width: 30px;
    height: 30px;
}

    .poajaxloader img {
        width: 30px;
        height: 30px;
    }

.db {
    display: block;
}

.br1-orange {
    border: 1px solid #f37421;
}

.top-ad-banner {
    margin: 20px 0;
}

.btn-general {
    color: #ffffff;
    border-radius: 0;
    background-color: #522e91;
}

    .btn-general:hover {
        color: #ffffff;
    }

.detailspage .accordion h2.catalogue_header {
    background-color: #fff;
    color: #522e91;
    padding: 0;
    margin: 20px 0 20px;
    font-size: 20px;
    font-weight: 600;
    cursor: default;
}



@media (min-width: 1296px) {
    .hidefordesktop {
        display: none;
    }

    .top-ad-banner {
        width: 160px;
        position: absolute;
        right: -170px;
        z-index: 9;
    }
}

@media (max-width: 1295px) {
    .hideformobile {
        display: none;
    }
}

/* override styles when printing */
@media print {

    #pages_wrapper {
        overflow: auto;
        height: auto;
    }

    .livechatBtn, aside, header, footer, #partners {
        display: none;
    }

    .pageBanner, .quotationdoc .mybasketListshead, .quotationdoc .quotationdochead, .print-hide {
        display: none;
    }
}
/*img { pointer-events: none; }*/


@media print {
    .view-all-results,
    .button-list,
    .conversation-item,
    .spinner {
        display: none !important;
    }

    .ai-search-results-products {
        page-break-inside: avoid;
    }

    .group {
        page-break-inside: avoid;
        margin-bottom: 20px;
    }

    img {
        max-width: 100%;
        height: auto;
    }
}



#pdfExportArea {
    page-break-inside: avoid;
}

.ai-search-results-block {
    page-break-inside: avoid;
}

.aisearch-results-products li {
    page-break-inside: avoid;
}

/* PDF root */
.pdf-root {
    width: 794px; /* A4 width at 96dpi */
    font-family: Arial, sans-serif;
    background: #fff;
}

/* Each PDF page */
.pdf-page {
    page-break-after: always;
    padding: 40px;
}


.pdf-cover {
    height: 100vh;
    text-align: center;
    padding-top: 120px;
}
.pdf-logo {
    width: 200px;
    margin-bottom: 40px;
}
.page-break {
    page-break-before: always;
}

.pdf-cover .ai-summary {
    font-size: 22px;
    text-align: center;
    margin-top: 20px;
}


/* PDF SAFETY */
.ai-search-results-products li,
.image-block,
.product-name,
.group,
.sub-desc {
    page-break-inside: avoid !important;
    break-inside: avoid !important;
}

img {
    page-break-inside: avoid !important;
    break-inside: avoid !important;
}


/* =========================
   PDF PAGE-BREAK FIX (NO HTML CHANGES)
   ========================= */
@media print {

    /* Treat title + product list as ONE block */
    .title-block,
    .group-title,
    .aisearch-results-products {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
    }

        /* Keep headers with their content */
        .title-block h5,
        .title-block p {
            page-break-after: avoid !important;
            break-after: avoid !important;
        }

        /* Prevent product rows from splitting */
        .aisearch-results-products li {
            page-break-inside: avoid !important;
            break-inside: avoid !important;
        }

        /* Safety: images never split */
        .aisearch-results-products img {
            page-break-inside: avoid !important;
            break-inside: avoid !important;
        }
}
