@import url("tpl/font-awesome.min.css");
@import url('//fonts.googleapis.com/css?family=Open+Sans:400,600');
@import url('//fonts.googleapis.com/css?family=Roboto:400');


/*If ui-effects-wrapper wrapper is 'visible' on the page, there must be a style
that is *overridding* (!important) the hard-coded style-rules on the
DIV which locks the header of the page. So adding this in CSS so that it does not affect this wrapper.
For More Info : https://groups.google.com/forum/embed/#!topic/jquery-ui-layout/qbY4o6gu4Hs */

body .ui-effects-wrapper {
    background: transparent !important;
    border: 0 !important;
    position: absolute !important;
}

.starcolor {
    color: gold;
}
html {overflow-y: scroll;}

.overlay-parent {position: relative;}

.divider:before {content:'|'; color:#ccc; display:inline-block; text-align:center; width:9px;}

/* This style is used to remove content before the divider used to show country list while entering phone number */
.intl-tel-input .country-list .divider:before {
    content:none;
}

.clear {clear:both;}

.tilesBackground .breadcrumb {background-color: transparent; padding-right: 15px;}
.navbar-dropdown{margin-top:18px;}
#primary-nav ul.navbar-right ul.dropdown-menu a {
    padding: 1px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
}
#primary-nav ul.navbar-right ul.dropdown-menu a:hover {
    color: #262626;
    text-decoration: none;
    background-color: #f5f5f5;
}
#back-arrow {position: fixed; left: 2%; top: 50%;}
#back-arrow:focus {outline: none;}
.dropdown-menu.left {left: inherit; right: 0;}

.dialog-ajax-loader {margin-left: 47.8%;}
.ajax-loader{background: url(../img/ajax-loader.gif) no-repeat center; background-color: rgba(255, 255, 255, 0.75); display: inline-block; height:18px; width: 18px; z-index: 20;}
.brand-logo .ajax-loader { background-color: transparent; }
.ajax-loader-medium{background: url(../img/ajax-loader-medium.gif) no-repeat center; position: absolute; height: 100%; width: 100%; background-color: rgba(255, 255, 255, 0.75); top: 0; bottom: 0; right: 0; left: 0; z-index: 20;}
.ajax-loader-div{background: url(../img/ajax-loader-medium.gif) no-repeat center; position: absolute; background-color: rgba(255, 255, 255, 0.75); top:0; bottom: 0; right: 0; left: 0; z-index: 2;}
.ajax-loader-area{height:500px;}
/* Styling for scroll pagination */
.loading {text-align: center; margin: 0px 35%; display: none;}
.top-link, a.top-link:hover, .top-link-search, a.top-link-search:hover { position: fixed; right: 20px; bottom: 100px;}
.top-link, .top-link-search { color:white; border-radius: 5px 5px 5px 5px; background:gray; padding:5px 10px;}

#back-arrow {
    position: fixed;
    left: 2%;
    top: 50%;
}

#back-arrow:focus {
    outline: none;
}

.carousel-item {
    height: 150px;
}
tr.collapse.in {display: table-row;}
.selectable .ui-selecting { background: #93EC9A; }
.selectable .ui-selected { background: #83DD8B; color: white; }
.selectable .selectable-item.ui-selectee:hover {background: #E4E9E8;}
.selectable .selectable-item.ui-selecting:hover {background: #93EC9A;}
.selectable .selectable-item.ui-selected:hover {background: #78CA7F;}
.selectable .created {background: #16C01C;}
.link{color:blue !important;}

/*sale discontinuation icons*/
.sale-discontinuation {counter-reset: step; height: 30px; display: inline-block;}
ul.sale-discontinuation li {display:inline-block;width:45px;padding-right: 10px;padding-top: 5px;}
ul.progressbar-content > li {padding-right:0px; top:2px;}
.sale-discontinuation li input {display:none;}
.sale-discontinuation .progressbar-content li button {background:none; border: none;}
.sale-discontinuation .progressbar-content .discontinue {margin-left:-10px; padding:0px; }
.progressbar-content {padding:0; padding-left:5px}
.sale-menu-padding  {padding-right:3px !important}

#product-detail-btn{padding:5px 15px 5px 5px;}
ul#product-detail-btn li {padding-left:10px;}

#sale-discontinuation-btn {margin-right: -12px; padding-top: 1px; padding-left: 5px;}
#sale-status-btn {padding-right: 0px; width:20px}
#sale-discontinuation-date-btn {margin-left:-18px;}
.sale-dis-margin {margin-left:-12px;}

.progressbarv2 {margin-top: 10px;-webkit-padding-start: 0px;counter-reset: step;min-height: 70px; display: inline-block;}
.progressbar-header {margin-top: 10px;margin-left: -80px;counter-reset: step;display: inline-block;}
.progressbar-header li {list-style-type: none;width: 170px;float: left;height: 5px;text-align: center;}
.progressbarv2 li {list-style-type: none;width: 170px;float: left;height: 25px;text-align: center; left-padding:5px;}
.progressbarv2 .progressbar-content li .ui-datepicker-trigger {background:none; border: none;margin-left:-156px;}
.progressbarv2 .progressbar-content li button {background:none; border: none;margin-left:-156px;}
.progressbarv2 .progressbar-content .created {background: url("../img/dots-sprite.png") no-repeat scroll rgba(0, 0, 0, 0);background-position: 2px -215px;margin-left: 73px;}
.progressbarv2 .progressbar-content .created.active {background: url("../img/dots-sprite.png") no-repeat scroll rgba(0, 0, 0, 0);background-position: 2px -239px;margin-left: 73px;}
.progressbarv2 .progressbar-content .introduced {background: url("../img/dots-sprite.png") no-repeat scroll rgba(0, 0, 0, 0);background-position: 2px -18px;margin-left: 73px;}
.progressbarv2 .progressbar-content .introduced.active {background: url("../img/dots-sprite.png") no-repeat scroll rgba(0, 0, 0, 0);background-position: 2px -41px;margin-left: 73px;}
.progressbarv2 .progressbar-content .discontinued {background: url("../img/dots-sprite.png") no-repeat scroll rgba(0, 0, 0, 0);background-position: 2px -150px;margin-left: 73px;}
.progressbarv2 .progressbar-content .discontinued.active {background: url("../img/dots-sprite.png") no-repeat scroll rgba(0, 0, 0, 0);background-position: 2px -172px;margin-left: 73px;}
.progressbarv2 .progressbar-content .deactive {background: url("../img/dots-sprite2.png") no-repeat scroll rgba(0, 0, 0, 0);background-position: 1px -194px;margin-left: 73px;}
.progressbarv2 > li:after{
    content: ''; border-top: 1px dotted; width: 157px; height: 1px; position: relative; left: -538px; margin: -10px 0px 0px 635px; display: inline-block; float:left; color: #bbb;
}
.progressbarv2 > li:last-child:after { content: none;}
.progressbarv2 .progressbar-content .timeline-tooltip {width:20px;}
.progressbarv2 .progressbar-content .timeline-tooltip.active {width:25px;}
/*This style is used to hide the small button displayed along with datepicker.*/
.datepicker-content button.ui-datepicker-trigger {visibility: hidden;}
.datepicker-content label {margin-bottom: 0px;}

/*Styling for date picker for bootstrap 3.0 to display it above navbar */
.ui-datepicker {
  z-index: 10001 !important;
}
.view-calendar button {
    background: url(jquery/images/cal.gif) no-repeat !important;
    display: inline-block;
    border: none;
    vertical-align: center;
    margin-top: 3px;
    height: 20px;
    width: 20px;
}
.ui-dialog .ui-dialog-content {
    max-height: 500px;
}

.menu-link:focus {
    outline: none;
}

.menu-link:hover {
    color: #428bca;
}

.tilesBackground {
    position: absolute;
    width: 100%;
    z-index: 1001;
    background-color: #dddddd;
}

/* Small menus styling */
.menus-small {
    width: 100%;
    position: absolute;
    z-index: 1001;
    background-color: #dddddd;
}

.menus-small .section .menu-nav {
    margin: 0;
}

.menus-small .section .menu-nav li {
    padding-top: 0;
    padding-bottom: 0;
    margin: 0;
}

.menus-small .section .menu-nav li:first-child {
    background-color: transparent;
    padding-top: 10px;
    padding-bottom: 10px;
}

.menus-small a.parent-menu-link {
    display: block;
    padding-bottom: 10px;
    border-bottom: 1px solid #dddddd;
    padding-top: 10px;
    font-size: 16px;
}

.menus-small .section .sub-menus li:first-child {
    padding: 0;
}

.menus-small .expand-icon {
    margin-right: 5px;
}

.menus-small .compress-icon {
    margin-right: 5px;
}

/* Small menus styling */
#menu-search {
    position: absolute;
    top: 10px;
    z-index: 1;
}

ul.menu-nav {
    padding-left: 0;
}

.metro .tile {
    margin-left: 10px;
    margin-bottom: 10px;
    margin-right: 0px;
    margin-top: 0px;
    padding: 0 5px;
    width: 13%;
    height: 140px;
    word-break: inherit;
    transition: all 0.1s ease;
}

.metro .tile:hover {
    outline: inherit;
    border: 2px solid #dddddd;
}

.metro .tile .text4 {
    font-size: 16px;
    line-height: 1.5;
    text-align: center;
    margin-top: 35px;
    max-height: inherit;
}

.menu-items .csr, .menu-items .cs-vw {
    background-color: #483D8B;
}

.menu-items .buynowcms, .menu-items .buynowcms-vw {
    background-color: #C71585;
}

.menu-items .dealer, .menu-items .dealer-vw {
    background-color: #DC143C;
}

.menu-items .dataimport, .menu-items .dataimport-vw {
    background-color: #008641;
}

.menu-items .admin, .menu-items .admin-vw {
    background-color: #D2691E;
}

.menu-items .procurement, .menu-items .procurement-vw {
    background-color: #8A2BE2;
}

.menu-items .warehouse, .menu-items .warehouse-vw {
    background-color: #B8860B;
}

.menu-items .merchandising, .menu-items .merchandising-vw {
    background-color: #8D6E63;
}

.menu-items .pim, .menu-items .pim-vw {
    background-color: #008000;
}

.menu-items .arAp, .menu-items .arAp-vw {
    background-color: #2F4F4F;
}

.menu-items .financialReports, .menu-items .financialReports-vw {
    background-color: #37917D;
}

.menu-items .ebay, .menu-items .ebay-vw {
    background-color: #A87133;
}

.menu-items .reports, .menu-items .reports-vw {
    background-color: #8B008B;
}

.menu-items .manufacturing, .menu-items .manufacturing-vw {
    background-color: #085ebb;
}

.menu-items .rtma_vw, .menu-items .rtma_vw {
    background-color: #4E8975;
}

.menu-items .rtma, .menu-items .rtma {
    background-color: #ADA96E;
}

.menu-items .magento, .menu-items .magento {
    background-color: #2d444f;
}

.favorites {
    padding-bottom: 0;
    margin-right: 10px;
}

.section .menu-nav .csr, .section .menu-nav .cs-vw {
    background-color: #483D8B;
}

.section .menu-nav .buynowcms, .section .menu-nav .buynowcms-vw {
    background-color: #C71585;
}

.section .menu-nav .dealer, .section .menu-nav .dealer-vw {
    background-color: #DC143C;
}

.section .menu-nav .dataimport, .section .menu-nav .dataimport-vw {
    background-color: #008641;
}

.section .menu-nav .admin, .section .menu-nav .admin-vw {
    background-color: #D2691E;
}

.section .menu-nav .procurement, .section .menu-nav .procurement-vw {
    background-color: #8A2BE2;
}

.section .menu-nav .warehouse, .section .menu-nav .warehouse-vw {
    background-color: #B8860B;
}

.section .menu-nav .merchandising, .section .menu-nav .merchandising-vw {
    background-color: #8D6E63;
}

.section .menu-nav .pim, .section .menu-nav .pim-vw {
    background-color: #008000;
}

.section .menu-nav .arAp, .section .menu-nav .arAp-vw {
    background-color: #2F4F4F;
}

.section .menu-nav .financialReports, .section .menu-nav .financialReports-vw {
    background-color: #37917D;
}

.section .menu-nav .ebay, .section .menu-nav .ebay-vw {
    background-color: #A87133;
}

.section .menu-nav .reports, .section .menu-nav .reports-vw {
    background-color: #8B008B;
}

.section .menu-nav .manufacturing, .section .menu-nav .manufacturing-vw {
    background-color: #085ebb;
}

.section .menu-nav .rtma_vw, .section .menu-nav .rtma_vw {
    background-color: #4E8975;
}

.section .menu-nav .rtma, .section .menu-nav .rtma {
    background-color: #ADA96E;
}

.section .menu-nav .magento, .section .menu-nav .magento {
    background-color: #2d444f;
}

.break {
    word-break: break-all;
}

.section {
    position: relative; /*width: 810px !important;*/
    width: auto;
    height: auto;
}

.section .menu-nav li {
    background-color: #2C83EF;
}

.section .menu-nav li {
    width: 100%;
    list-style-type: none;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    color: white;
    margin-bottom: 20px;
}

.section .menu-nav li a {
    color: white;
    text-decoration: none;
    font-weight: bold;
}


.action-radio .radio {
    margin-top: 0;
    margin-bottom: 0;
}

.action-radio .radio .dynamic-ajax-loader {
    right: 5px;
    top: 2px;
}

/* Countered jQuery styling for select boxes and buttons present in the dialogs */
.ui-dialog-content select, .ui-dialog-content button {
    font-size: 14px;
}

/* Styling for scroll pagination */
.loading {
    text-align: center;
    margin: 0px 35%;
    display: none;
}

.top-link, a.top-link:hover {
    position: fixed;
    right: 20px;
    bottom: 100px;
}

.top-link {
    color: white;
    border-radius: 5px 5px 5px 5px;
    background: gray;
    padding: 5px 10px;
}

/* Fix Stylings which are overriding by jquery.elrte-1.3.css*/
.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-only {
    padding: 5px 14px 6px;
    font-size: 13px;
}

.ui-dialog .ui-dialog-titlebar {
    padding: 5px 15px;
}

.ui-dialog .ui-dialog-title {
    margin: 0;
}

.ui-dialog .ui-dialog-title, .ui-dialog .ui-dialog-content {
    font-size: 13px;
}

.ui-dialog .ui-dialog-buttonpane button {
    margin: .5em .4em .5em 0;
}

.ui-widget {
    font-size: 13px;
}

/* Added styling for required field asterisk */
.asterisk {
    color: #FF0000;
}

/* Styling for unsaved class */
.unsaved:before {
    content: "*";
}

.title-secondary { font-size: 15px; }
/* Styling to fix the tiny transparent text box, which appears next to the date fields, added margin instead */
.view-calendar [type=text].hasDatepicker {
    display: none;
}

.view-calendar button {
    margin-left: 3px;
}

/* Styling to show icons of font-awesome-3.0.2.min.css in large size*/
.fa-8x.fa-border {
    border-width: 8px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

.fa-plus {
    margin-top: 3px;
    margin-bottom: 2px;
}

#map {
    border: 1px solid #979797;
    height: 450px;
}

/*For separating h5 element, class name need to be changed after discussion.*/
h5.divider-x2 {
    border-top: 1px solid lightgray;
    text-align: center;
    margin-top: 25px;
}

h5.divider-x2 span {
    background: none repeat scroll 0 0 #FCFCFC;
    padding: 0 10px;
    position: relative;
    top: -10px;
}

.thfloat-table {
    background: #f9f9f9;
    border: 0px;
}

/*For inserting horizontal divider line for block level elements.*/
.divider-x {
    border-bottom: 1px solid lightgrey;
}

/*Styling for flot charts.*/
.content {
    width: 100%;
    margin: 12px 0 0 2px;;
    position: relative;
}

.graph-main-container {
    border: 1px solid #ddd;
    background-color: #FFFFFF;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
    -o-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
    -ms-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
}

.graph-container {
    width: 100%;
    height: 450px;
    padding: 17px 27px 22px;
    margin: 2px 0 0 0;
}

.graph-container.graph-container-xs {
    height: 150px;
}

.graph-container.graph-container-sm {
    height: 300px;
}

.graph-container.graph-container-lg {
    height: 600px;
}

.graph-placeholder {
    width: 100%;
    height: 100%;
    font-size: 14px;
    line-height: 1.2em;
}

.iconlist {
    padding-left: 0;
}

.iconlist li {
    display: inline;
    margin-right: 5px;
}

.iconlist li a, .iconlist li button {
    padding: 0;
}

.position-rel {
    position: relative;
}

/* Styling for legend used in pie chart */
.legend-holder {
    width: 100%;
    padding: 17px 27px 22px;
}

.legendColorBox > div {
    width: 14px;
}

.relative {
    position: relative;
}

.caption-link {
    margin-top: 2px;
}

.caption-link:focus {
    outline: none;
}

.fa-bg, .fa-bg:hover {
    background: rgba(249, 249, 249, 0.75);
    border-radius: 3px;
}

.fa-bg.abs-top.abs-left {
    border-radius: 0 0 3px 0;
}

.fa-bg.abs-top.abs-right {
    border-radius: 0 0 0 3px;
}

.fa-bg.abs-bottom.abs-left {
    border-radius: 0 3px 0 0;
}

.fa-bg.abs-bottom.abs-right {
    border-radius: 3px 0 0 0;
}

.select-variant {
    position: relative;
    left: 160px;
}

.preview-variant {
    padding-left: 0px;
}

.variant-section {
    height: 300px;
    overflow-y: auto;
}

.product-features {
    max-height: 150px;
    overflow-y: auto;
}

/*Styling for displaying chosen box similar to form-control box and to adjust its height and hover properties*/
.chzn-choices {
    border: 1px solid #CCCCCC !important;
    border-radius: 4px 4px 4px 4px;
}

.chzn-choices .search-choice {
    margin-top: 5px !important;
}

.chzn-container-active .chzn-choices {
    border-color: #66AFE9 !important;
    box-shadow: 0 0 8px rgba(102, 175, 233, 0.6) !important;
    outline: 0 none !important;
}

.chzn-container input {
    height: 30px !important;
}

.chzn-container-multi .chzn-choices .search-field input {
    font-family: 'Open Sans', Calibri, Candara, Arial, sans-serif !important;
}

/*To display overlay over navbar*/
.ui-widget-overlay {
    z-index: 1001;
}

/*Style to add bottom margin*/
.form-margin {
    margin-bottom: 5px;
}

/*Style for proper alignment in Date Picker*/
.view-calendar input.form-control {
    width: 80%;
    display: inline-block;
}

/* This style is for fixing the issue in which select all checkbox functionality is not working (in navigation bar) in popup*/

.microbox {
    border: 1px solid white;
    width: 30px;
    height: 20px;
    outline: solid 1px #ccc;
    margin-right: 10px;
    display: inline-block;
}

.microbox-list li {
    margin-top: 10px;
    vertical-align: top;
}

.microbox-list li:first-child {
    margin-top: 0px;
}

/* This style is enabling the popover on disabled buttons */
.disabled[tooltip] {
    pointer-events: auto !important;
}

/* This style is for allowing the autocompleter results above the Bootstrap3.0 modal */
.modal ~ .ui-autocomplete {
    z-index: 1060 !important;
    word-wrap: break-word;
    overflow-y: auto;
    max-height: 334px;
}
.ui-autocomplete {
    z-index: 2;
}
.input-group .form-control { z-index: 1;}
/* (Begin) Related to credit card type validation.*/
ul.card_logos {
    display: inline-block;
    margin: 0;
    padding: 0;
}

.input-group .error {
    display:table-row;
    text-wrap:nowrap;
}

.is_visa li, .is_mastercard li, .is_amex li, .is_discover li, .is_diners li, .is_jcb li, .is_nothing li {
    opacity: .2;
}

.is_visa li.fa-cc-visa, .is_mastercard li.fa-cc-mastercard, .is_amex li.fa-cc-amex, .is_discover li.fa-cc-discover, .is_diners li.fa-cc-diners-club, .is_jcb li.fa-cc-jcb {
    opacity: 1;
}
.cc-number {
  vertical-align: middle;
}
.cc-name {
  margin-left: -50px;
  margin-top: 2px;
  float: left;
}

/*(End) Related to credit card type validation.*/

.selectable-checkbox {
    border-color: #0088CC;
    box-shadow: 3px 3px 10px #888888;
}

.ui-menu-item {
    word-break: break-word;
}

select.chzn-done:disabled + .chzn-container-multi .chzn-choices {
    background-color: #EEEEEE;
    background-image: none;
}

select.chzn-done:disabled + .chzn-disabled {
    opacity: 1 !important;
}

.chzn-container {
    font-size: 14px !important;
}

.chzn-container-single .chzn-default {
    color: #555 !important;
    background-image: inherit !important;
}

.chzn-container-single .chzn-single {
    color: #555 !important;
    background-image: inherit !important;
    font-weight: bold;
}

.chzn-single {
    height: 33px !important;
    border-radius: 5px 0px 0px 5px !important;
}

.chzn-single > div, .chzn-single > span {
    margin-top: 2px;
}

/* Styling for favourite stars on Ezerp menus */
.rgb-fav, .rgb-fav:hover {
    border: none;
    background: none;
    border-radius: 0px 12px 0px 3px !important;
}

/* Styling to show loader while search is performed by Autocompleter*/
.ui-autocomplete-loading {
    background: url(/images/ajax-loader.gif) no-repeat right center;
}

.tab-content > .tab-pane,
.pill-content > .pill-pane {
    display: none;
}

.tab-content > .active,
.pill-content > .active {
    display: block;
}

.logo-container {
    padding-left: 0;
}

.logo-img {
    width: 80px;
}

.logo-container a {
    text-decoration: none;
}

.logo-float i {
    vertical-align: middle;
}

.logo-float {
    padding: 25px 0 0 0;
}

/*Style for tab action icon for left tabs*/
.nav-tabs li .tab-action {
    z-index: 1;
    position: relative;
}

.tab-action {
    float: right;
    margin-top: 12px;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: 0.5;
}

ul.ul-style {
    list-style: disc outside none;
    padding-left: 18px;
}

.tab-overflow {
    max-width: 300px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

/*Style to display ajax loader for drop-down correctly*/
select.js-action-dropdown ~ i.ajax-loader.abs {
    left: 45%;
    top: 17px;
}

.favicon-icon {
    width: 16px;
}

/*Style for cart summary on small devices*/
.cart-summary-static {
    position: relative;
    top: -10px;
}

/*Base Style for Sticky*/
.initialized.sticky-container {
    position: relative
}

.initialized .sticky-parent {
    bottom: 0;
    position: absolute;
    top: 0
}

.initialized .sticky {
    position: fixed;
}

.initialized .sticky.bottom {
    position: absolute;
    bottom: 0
}

.sticky-clone {
    display: none
}

.initialized .sticky-clone {
    display: block
}

/*Style for Create order sticky*/
.initialized .sticky-parent .main-section {
    z-index: 1;
    background-color: white;
}

.initialized .sticky-clone {
    z-index: -1;
}

.order-view-title {
    display: inline-block;
}

.fa-comment > .comment-count {
    position:absolute;
    left: 6px;
    color: #fff;
    font-weight: bold;
    font-size: 11px;
}

.custom-disabled {
    cursor: not-allowed;
}
.pushdown {
    float: left
}

.pushdown-hidden {
    display: none
}

.pushdown-body {
    padding: 0;
    margin: 0;
    clear: both;
    display: block;
    overflow: hidden;
    width: 100%;
}

.facet-list {
    padding-top: 0;
    padding-bottom: 0;
}

.facet-header {
    padding-top: 0;
    padding-bottom: 0;
    background-color: #FAFAFA;
}

.facet-list .checkbox {
    margin-top: 6px;
    margin-bottom: 6px;
}

.facet-list .radio {
    margin-top: 6px;
    margin-bottom: 6px;
}

/* Style for lazy-load */
.lazy-loading {
    background: url('../img/lazy-loading.gif') no-repeat center center;
    height: 40px;
}

/* style for recently updated row. */
.recently-updated {
    border-left: 3px solid #428bca !important;
}

.metro .tile.tile-unstyled {
    cursor: auto;
    width: 148px;
}

.metro .tile.tile-unstyled:hover {
    color: #fff;
}

.chosen-dropdown-icon {
    right: 25px;
    top: 50%;
    margin-top: -10px;
}

/* Style for Blog content*/
.blog-main {
    font-size: 15px;
    line-height: 1.5;
}

.blog-post-title {
    margin-bottom: 5px;
    border-bottom: 1px solid #999;
}

.blog-post-meta {
    margin-bottom: 20px;
    color: #999;
}

/*Firefox specific style*/
@-moz-document url-prefix() {
    .panel-buttons ul li .btn, .panel-pagination ul li .btn-link {
        padding: 6px 12px 7px;
    }
    #menu-search {
        position: relative;
        margin-bottom: -30px;
        top: 10px;
    }
    /*This is a hack. Need to be fixed.*/
}

.overflow-x {
    overflow-x: scroll;
}

.caroufredsel_wrapper {
    margin-left: auto !important;
    margin-right: auto !important;
}

.NA:before {
  content: 'N/A';
 }

/*Style for White space optimization and panels*/
.button-bar{position:relative;right:0;float:right;margin-right:95px;margin-top:35px;}
.button-bar > form{display:inline-block;}
.button-bar .dropdown-menu {right: 0; left: inherit; margin: 0; border-radius: 0;}
.button-bar-dropdown {
    float: left;
    top: 14px;
    position: fixed;
    left: 525px;
}
[data-toggle-display]{cursor:pointer;}

/* Table header row UI will look similar to the panel header*/
.header-row{padding:10px; background-color:#fafafa!important; height: 32px;}
.header-row-title{margin:6px; display:inline-block; font-weight: normal; font-size: 15px;}
.header-row-buttons{float:right;}



.ellipsis-bordered > span {background:#EEE;display: inline-block;line-height: 0;padding: 0 8px 0;color:#aaa;}

/*Adding style from bootstrap 3.0 which is removed in 3.1.1 */
.form-control-static {margin-top: 7px;}

.header-col{position: inherit;}
@media (min-width:768px) and (max-width:991px) {
    .pull-right-sm{float:right;padding-right:10px;}
    .button-bar-container{position:absolute;left:0;top:5px; width: 738px; height:0;z-index: 1020;}
    .button-bar{margin-right: 170px;}
    .divider-vertical {border-right: 0;}
}
@media (min-width:992px) and (max-width:1199px){
    .pull-right-md {float:right;padding-right:20px;}
    .button-bar-container{position:absolute;left:0;top:5px; width: 994px; height:0;z-index: 1020;}
    .button-bar{margin-right: 178px;}

}
@media (min-width:1200px) {
    .pull-right-lg {float:right;}
    .button-bar-container{position:absolute;top:5px; width: 1170px; height:0; z-index: 1020;}
    .button-bar{margin-right:120px;}
}
.add-warning {
    margin: 10px 8px 5px 0px;
}

#website-images .img {
    max-height: 110px;
}

/* jQuery.Rating Plugin CSS - http://www.fyneworks.com/jquery/star-rating/ */
div.rating-cancel, div.star-rating {
    background: none repeat scroll 0% 0% transparent;
    cursor: pointer;
    display: block;
    float: left;
    height: 15px;
    overflow: hidden;
    text-indent: -999em;
    width: 17px;
    padding-right: 5px;
}

div.star-rating, div.star-rating a {
    background: url("../../resources/uploads/images/details-rating.png") no-repeat scroll 0px 0px transparent;
}

div.rating-cancel a, div.star-rating a {
    display: block;
    width: 16px;
    height: 100%;
    background-position: -15px 0px;
    border: 0
}

div.star-rating-on a {
    background-position: 0px 0px ! important;
}

div.star-rating-hover a {
    background-position: 0px 0;
}

/* Read Only CSS */
div.star-rating-readonly a {
    cursor: default !important
}

/* Partial Star CSS */
div.star-rating {
    background: none repeat scroll 0% 0% transparent ! important;
    overflow: hidden !important
}

/* END jQuery.Rating Plugin CSS */

/* Enterprise search CSS */

.enterprise-search {
    width: 350px;
    padding-right: 10px;
}

.enterprise-search .pim-facet {
    color: #c0392b;
}

.enterprise-search .csr-facet {
    color: #603cba;
}

.enterprise-search .admin-facet {
    color: #283481;
}

.enterprise-search .app-facet {
    color: #428bca;
}

.enterprise-search.search-elts, .enterprise-search.search-elts-flipped {
    margin-top: -4px;
}
.enterprise-search .search-icon {
    pointer-events: none;
}

.enterprise-search a .fa {
    padding-left: 10px;
    padding-right: 10px;
}

.enterprise-search .dropdown {
    margin-left: -210px;
    margin-top: 2px;
}

.enterprise-search .dropdown .dropdown-menu {
    width: 670px;
    margin-left: 250px;
}

.enterprise-search .doFocus {
    background-color: #f0f0f4;
}

.enterprise-search .app-results {
    padding-top: 5px;
    padding-bottom: 5px;
    border-left: 1px solid #428bca !important;
    padding-left: 5px;
}
.editable-field:hover .edit-icon {
    visibility: visible;
}

.editable-field:hover .editable-content {
    background: none repeat scroll 0 0 #FFFFFF;
    color: #000000;
    outline: 1px solid #AAAAAA;
    cursor: text;
}

.editable-input .editable-content {
    background: none repeat scroll 0 0 #FFFFFF;
    outline: 1px solid #AAAAAA;
    cursor: text;
}

.editable-content {
    padding-right: 6px;
    padding-top: 3px;
    padding-bottom: 3px;
    word-break: break-all;
    max-width: 200px;
}

.editable-input .save-icon {
    visibility: visible;
}

.edit-icon {
    visibility: hidden;
    cursor: pointer;
    white-space: nowrap;
    position: absolute;
    outline: 1px solid #AAAAAA;
    background-color: #006DCC;
    background-image: linear-gradient(to bottom, #0088CC, #0044CC);
    background-repeat: repeat-x;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    color: #FFFFFF;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    padding: 4px 4px 4px 2px;
    margin-left: -3px;
}

.page-title {
    font-size: large !Important;
    font-family: inherit;
    font-weight: bold;
}
.cm-s-default .cm-ftltag {
    color: darkblue;
}

.cm-s-default .cm-ftlmacro {
    color: darkblue;
}

.cm-s-default .cm-ftlcomment {
    color: #A60808;
}

.cm-s-default .cm-ftlword {
    color: #FF33CC;
}

.dataTables_filter {
    margin-top: 5px;
    margin-left: 5px;
}

.dataTables_wrapper table {
    margin: 0;
}

.order-item-xs {
    margin-top: 5px;
}

/* Styling for having a bordered grid system with scrollabe list. */

.borderedGrid [class*='col-'] {
    border: 1px solid #DDDDDD !important;
    padding: 5px;
}

.borderedGrid [class*='col-'] ul {
    height: 150px;
    overflow-y: auto;
}

/* lookup input CSS */

.input-group input.form-control.lookup {
    margin-right: 5px;
}

/* Styling for dialog images, where scroll pagination is activated (to disable equal height). */
.dialog-img {
    min-height: 110px;
}

.dialog-img-thumbnail {
    display: block;
    padding: 4px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    word-wrap: break-word;
    margin-bottom: 25px;
}

.dialog-img-thumbnail .description {
    margin-top: 5px;
}

.asset-icon-center {
    padding-top: 10%;
    padding-left: 30%;
}

.dialog-img input[type=checkbox] {
    display: none;
}

.dialog-img input[type=checkbox]:checked + .dialog-img-thumbnail {
    background-color: #dff;
    border: 1px solid #428bca;
    display: block;
}

.dialog-img .dialog-img-thumbnail .checkbox {
    padding: 0;
}

.dialog-panel-header-checkbox {
    margin-top: 5px;
}

img.small-image,.img-container.small-image {
    max-width: 125px;
    max-height: 125px;
}

img.extra-small-image,.img-container.extra-small-image {
    max-width: 52px;
    max-height: 52px;
}

img.thumbnail-image, .img-container.thumbnail-image {
    width: 32px;
    height: 32px;
    max-width: 32px;
}

img.medium-image, .img-container.medium-image {
    max-width: 400px;
    max-height: 400px;
}
.chzn-container {
    font-size: 14px !important;
}

.chzn-single {
    border-radius: 0 !important;
}

.chzn-container-single .chzn-default {
    color: #555 !important;
    background-image: inherit !important;
}

.chzn-container-single .chzn-single {
    color: #555 !important;
    background-image: inherit !important;
}

.parent-link {
    display: block;
    color: #333
}

.parent-link:focus {
    color: #333;
}

.parent-link:hover {
    color: #333;
}

.child {
    padding-left: 20px;
    padding-bottom: 5px;
    border-left: 1px dotted #ccc;
    position: relative;
}

.child:before {
    content: '----';
    position: absolute;
    left: 0;
    color: #ccc;
}

#editor-col {
    padding-left: 0;
}

.no-padding-cell {
    padding: 0 !important;
}

.no-padding-cell-half {
    padding-left: 8px !important;
    padding-top: 5px !important;
}

.no-padding-cell * {
    border: 0 !important;
}

/*styles for bar of searched tags*/
.strike-on-hover:hover {
    text-decoration: line-through;
    cursor: pointer;
}

.underline-on-hover:hover {
    text-decoration: underline;
    color: #337ab7;
}

.group-member {
    padding-left: 0;
}

.group-member:last-child {
    border-bottom: 0;
}

.group-member:first-child {
    border-top: 0;
}

/* Style for Google address autocompleter
   In case of modal, suggested addresses were not visible because z-index of modal in bootstrap is 1050
*/
.pac-container {
    z-index: 1060;
}

.panel-ribbon {
    -webkit-box-shadow: 0px 14px 10px -2px rgba(50, 50, 50, 0.5) !important;
    -moz-box-shadow: 0px 14px 10px -2px rgba(50, 50, 50, 0.5) !important;
    box-shadow: 0px 14px 10px -2px rgba(50, 50, 50, 0.5) !important;
    border-top: 0;
    margin-bottom: 0;
}

.panel_disabled {
    top: 0;
    left: 0;
    width: 100%;
    background: #f2f2f2;
    border: 0.5px solid grey;
    z-index: 10;
    height: 100%;
    opacity: .6;
}

.ribbon {
    padding: 10px 10px 0;
    position: relative;
    color: #444;
    background: #fff;
    border: 1px solid #d2d2d2;
    border-radius: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.ribbonHeader {
    left: -10px;
    margin-right: -19px;
    color: #cfcfcf;
    position: relative;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.ribbonHeader:before {
    content: ' ';
    width: 0;
    height: 0;
    bottom: -11px;
    position: absolute;
    border-top: 11px solid #428bca;
    border-left: 11px solid transparent;
}

.ribbonHeader:after {
    content: ' ';
    width: 0;
    height: 0;
    bottom: -11px;
    position: absolute;
    border-top: 11px solid #428bca;
    border-right: 11px solid transparent;
}

.ribbonHeader:before {
    left: -2px;
}

.ribbonHeader:after {
    right: -2px;
}

/* Style for Group Overview Page*/

.thumbnail-color {
    color: #888888;
}

.no-ol > ol {
    display: none;
}

.no-ol > .carousel-control {
    background-image: none;
}

.no-ol > .carousel-control {
    width: 1%;
}

.product-supplier{
    display:block;
    max-height:300px;
    overflow-y: scroll
}

input[type=number].no-spinner::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

li .DM {
    background: url("../img/discontinuedsign.png") no-repeat right bottom;
}

#productVariations .DM {
    background: url("../img/discontinued.png") no-repeat right top;
}

#product-details .DM {
    background: url("../img/discontinued.png") no-repeat right top;
}

#product-life-cycle {
    margin-top: 20px;
}

/* Style for View Event*/

.circle:before {
    content: "";
    display: block;
    padding-top: 100%;
}

.pr-open {
    border: 1px solid #777;
}

.circle {
    margin-left: auto;
    margin-right: auto;
    border-radius: 50% !important;
    width: 60%;
    position: relative;
}

.circle-inner {
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    text-align: center;
}

.score-text {
    margin: auto;
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    height: 1em;
    line-height: 1em;
    font-size: 1em;
}

.pr-progress {
    border: 1px solid #7DC67D;
}

.pr-hold {
    border: 1px solid #F0AD4E;
}

.pr-close {
    border: 1px solid #7CCDE5;
}

/* Styling for account settings icon on partydetails personalinformation panel */
.enableicon {
    margin-right: 6px;
    color: white;
    width: 18px;
}

.enableicon:hover {
    color: white;
}

.checkboxcss input[type="checkbox"]:checked + span {
    color: #3276b1;
}

.checkboxcss input[type="checkbox"] {
    visibility: hidden;
    width: 0px;
}

.radioboxcss input[type="radio"]:checked + span {
   color: #3276b1;
}

/*End of Style for horizontal accordian*/
.email-note-height {
    height: 150px !important;
}

@media screen and (min-width : 992px)
{
.channel-timeline {margin-top: 10px;margin-left: -145px;counter-reset: step;min-height: 70px; display: inline-block;}
.channel-timeline li input {display:none;}
.channel-timeline li {list-style-type: none;width: 425px;float: left;height: 25px;text-align: center; left-padding:5px;}
.channel-timeline .channel-content li .ui-datepicker-trigger {background:none; border: none;margin-left:-156px;}
.channel-timeline .channel-content li button {background:none; border: none;margin-left:-156px;}
.channel-timeline .channel-content .created {background: url("../img/dots-sprite.png") no-repeat scroll rgba(0, 0, 0, 0);background-position: 2px -215px;margin-left: 185px;}
.channel-timeline .channel-content .created.active {background: url("../img/dots-sprite.png") no-repeat scroll rgba(0, 0, 0, 0);background-position: 2px -239px;margin-left: 185px;}
.channel-timeline > li:after{
    content: ''; border-top: 1px dotted; width: 410px; height: 1px; position: relative; left: -390px; margin: -10px 0px 0px 635px; display: inline-block; float:left; color: #bbb;
}
.channel-timeline > li:last-child:after { content: none;}
}

@media screen and (min-width : 768px) and (max-width : 991px)
{
.channel-timeline {margin-top: 10px;margin-left: -210px;counter-reset: step;min-height: 70px; display: inline-block;}
.channel-timeline li input {display:none;}
.channel-timeline li {list-style-type: none;width: 365px;float: left;height: 25px;text-align: center; left-padding:5px;}
.channel-timeline .channel-content li .ui-datepicker-trigger {background:none; border: none;margin-left:-156px;}
.channel-timeline .channel-content li button {background:none; border: none;margin-left:-156px;}
.channel-timeline .channel-content .created {background: url("../img/dots-sprite.png") no-repeat scroll rgba(0, 0, 0, 0);background-position: 2px -215px;margin-left: 170px;}
.channel-timeline .channel-content .created.active {background: url("../img/dots-sprite.png") no-repeat scroll rgba(0, 0, 0, 0);background-position: 2px -239px;margin-left: 170px;}
.channel-timeline > li:after{
    content: ''; border-top: 1px dotted; width: 350px; height: 1px; position: relative; left: -404px; margin: -10px 0px 0px 635px; display: inline-block; float:left; color: #bbb;
}
.channel-timeline > li:last-child:after { content: none;}
}

/*Panel default*/

.with-nav-tabs.panel .nav-tabs {
  margin: 0;
}
.with-nav-tabs.panel .nav-tabs > li > a,
.with-nav-tabs.panel .nav-tabs > li > a:hover,
.with-nav-tabs.panel .nav-tabs > li > a:focus {
  color: #777;
}
.with-nav-tabs.panel .nav-tabs > .open > a,
.with-nav-tabs.panel .nav-tabs > .open > a:hover,
.with-nav-tabs.panel .nav-tabs > .open > a:focus,
.with-nav-tabs.panel .nav-tabs > li > a:focus {
    border-bottom: 2px solid #DD4B39;
}
.with-nav-tabs.panel .nav-tabs > li > a:hover {
    border-bottom: 4px solid #fbcdcf;
    background-color: white;
    color: black;
}
.with-nav-tabs.panel .nav-tabs > li.active > a,
.with-nav-tabs.panel .nav-tabs > li.active > a:hover,
.with-nav-tabs.panel .nav-tabs > li.active > a:focus {
  color: #555;
  background-color: #fff;
  border-color: #ddd;
  border-bottom-color: transparent;
}
.search-form .input-group {
  width: 53%;
  margin-bottom: 5px;
  margin-top: 5px;
  margin-left: 25%;
}
.search-form .form-control:focus {
  -webkit-box-shadow: none!important;
  box-shadow: none!important;
}
.commerce-search-btn-group {margin-bottom: 5px; margin-top: 5px;}
.commerce-search-btn-group .btn-default {
  background-color: #eee;
}
.commerce-search-btn-group .dropdown-menu {right: 0; left: auto; background-color: #eee;}

* {border-radius: 0!important;}

.input-group .form-control:last-child, .input-group-addon:last-child, .input-group-btn:first-child>.btn-group:not(:first-child)>.btn, .input-group-btn:first-child>.btn:not(:first-child), .input-group-btn:last-child>.btn, .input-group-btn:last-child>.btn-group>.btn, .input-group-btn:last-child>.dropdown-toggle {
border-top-left-radius: 0!important;
border-bottom-left-radius: 0!important;}

.btn-grp-wrapper {text-align: center;}

.search-overlay {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(200,200,200,0.9);
  z-index:3;
  overflow: auto;
}

/* Overlay closing cross */
.search-overlay .search-overlay-close {
  width: 25px;
  height: 25px;
  margin-top: 10px;
  overflow: hidden;
  border: none;
  background: url(../img/cross.png) no-repeat center center;
  text-indent: 200%;
  color: transparent;
  outline: none;
  z-index: 100;
}

.search-overlay-slidedown {
  visibility: hidden;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transition: -webkit-transform 0.4s ease-in-out, visibility 0s 0.4s;
  transition: transform 0.4s ease-in-out, visibility 0s 0.4s;
}

.search-overlay-slidedown.open {
  visibility: visible;
  -webkit-transform: translateY(0%);
  transform: translateY(0%);
  -webkit-transition: -webkit-transform 0.4s ease-in-out;
  transition: transform 0.4s ease-in-out;
}

/* Styling for horizontal scroll on revenue and expense analytics screen */
.horizontal-overflow-scroll {
    overflow-x:auto;
}
.vertical-overflow-scroll {
    max-height: 400px;
    overflow-y: scroll;
    width: 1152px;
}
.routing-product-margin {
    margin: 2px 0px 8px 19px;
}
.btn-circle.btn-lg {
    border-radius: 25px !important;
}

.progress-bar-height {
    height: 15px;
}

.ellipsis {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.progress-bar-popover-width {width: 415px;}
.progress-bar-popover-half-width {width: 208px;}
.calendar{
    margin-top: -15px;
}

.intl-tel-input {display:block !important;}

.worklog-panel {
    max-height: 200px;
    overflow-y: auto;
}
.child-content {
    background-color: rgba(218, 244, 245, 0.36) !important;
}

/* Used for proper positioning of date and time picker and hiding input field */
.date-time-picker-content input {
    visibility: hidden;
    top:-25px;
    width: 0;
    padding: 0;
    height: 0;
    border: 0;
}

/*Used for proper positioning of date and time picker anchor */
ul.list-unstyled > li a.date-time-picker-content input {
    margin-left: -3px;
}

/* This class is for label like panel */
.panel-body-label {
    padding-left: 4px;
}

.date-panel {
    padding: 3px;
}

.box-shadow {
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.26);
}

.ul-box-shadow {box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.26);}

.facet-item-list-block {
    max-height: 150px;
    overflow: auto;
}

.rotate-text {
    transform: rotate(270deg);
    margin-top: 30px;
}

.typeahead-input + ul, ul.productList {
    width: 100%;
}
ul.productList { max-height:100px; overflow-y: auto;}
.typeahead-input + ul {
   max-height: 435px;
   overflow-y: auto;
}
a.list-group-item:hover, a.list-group-item:focus {
    text-decoration: none;
    background-color: #337ab7;
    color:#fff;
}

[ng\:cloak], [ng-cloak], .ng-cloak {
    display: none;
}

.dateTimePicker {
    background-color: white !important;
    cursor: default !important
}

.dropdown-search {
    width: 250px;
}
.no-pointer-event {
    pointer-events: none;
}
.brand-logo {
    max-height: 200px;
    margin: 50px auto 20px auto;
    max-width: 500px;
    width: 250px;
    height: 50px;
    object-fit:contain;
}
.powered-by-logo img,.side-menu.toggled:hover .powered-by-logo img {
    width: 155px;
    height: 60px;
    display: inline-block;
    object-fit:contain;
}
.container .row .powered-by-logo img {
    width: 301px;
    height: 120px;
}
.side-menu .footer .powered-by-logo,.side-menu.toggled:hover .powered-by-logo { margin-left: 40px; text-align: unset;}
.powered-by-logo {text-align: center;}
.side-menu.toggled .powered-by-logo {margin-left:0;}
.powered-by-logo h4 {
    color: #fff;
    text-align: center;
    font-size: small;
}
 /*
.sidebar-nav .powered-by-logo {
    width:125px;
}*/

.tile-title-large {
    color: #942E88;
    font-size: 30px;
}

.highlight-section-body {
    padding-top: 0;
    padding-left: 15px;
    padding-bottom:0;
}

/*for fixed position window*/
.window-fixed {
    position: fixed;
}

/*style  to remove increment decrement arrows from number field*/
.no-spin input[type=number]::-webkit-inner-spin-button,
.no-spin input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    margin: 0 !important;
}

/* styling for advanced search option of autocompleter. */
.search-position {
  position: inherit !important;
}

.search .fa-caret-down {
  color: grey;
  position: absolute;
  left: 180px;
}

.search .fa-caret-down:hover {
  color: black;
  position: absolute;
  left: 180px;
}

.selectable-thumbnail input[type="radio"] {
    display:none;
}
.selectable-thumbnail input[type="radio"]:checked + label.thumbnail {
    background-color:#DFF;
    border-color:#428bca;
}

.label-meta {
    color: #0094cc;
    font-size: 13px;
    font-style: oblique;
    padding: 2px 0px 1px 0px;
}

.hidden-input input[type="checkbox"] {
    display:none;
}

/* style icon */
.inner-addon {
    position: relative;
}

.inner-addon .fa {
    position: absolute;
    padding: 10px;
}

/* add padding  */
.left-addon input  { padding-left:  30px;}


/* To override the display property of bootstrap-tagsinput class of bootstrap-tagsinput v0.8.0 plugin*/
.bootstrap-tagsinput {
    display: block;
  }

.inline .control-label {
    padding-top: 7px;
    margin-bottom: 15px;
}

.show-secondary-filters.affix { margin-top: 18px; position:fixed; }

/* style to remove extra margin from ul in action columns */
.action-column > ul.list-inline {
    margin: 0 !important;
}

td small {
    display: block;
}

/* Style for reducing padding for btn-toolbar inside drop-down menu. */
.dropdown-menu .btn-toolbar {
    margin-bottom : 10px!important;
    margin-top : 5px!important;
    display : flex;
}

.btn-toolbar > .btn {
    margin-left: 5px !important;
}
.btn-toolbar > .checkbox, .btn-toolbar > .radio {
    margin-left: 10px !important;
    display: inline-block;
}

.btn-toolbar > .select-picker {
    margin-left: 5px;
}

/*Style for increasing the clickable area of close button used on Modals.*/
button.close {
    -webkit-appearance:none;
    padding:4px 8px!important;
}

.equal-height-flex [class*="col-"] > ul.list-unstyled > li {
    margin-bottom: 2px;
}
.dl-horizontal ul.list-unstyled > li {
    margin-bottom: 3px;
}

/* To override the color of anchor text in dropdown menu.*/
.btn-group > ul.dropdown-menu .checkbox > label > a {
    color: #333 !important;
}

/*To remove the box-shadow from anchor dropdown.*/
.btn-group.open a.dropdown-toggle {
    box-shadow: none!important;
}

.modal-scroll {
	max-height:75vh;
	overflow-y: scroll;
}

ul.list-group > li.list-group-item  > div.checkbox > label {
    display: block;
}
/*To render icons to the right, we do not require "padding-right".*/
.actions ul.list-inline > li {
  padding-right: 0;
}
.table tr td .actions {
  float: right;
}
/* Temporary Fix */
td > span[class*='read-more'] {
  word-break: break-all;
}

.bootstrap-switch {
    word-break:normal!important;
}
.panel .col-lg-3.col-md-6 .col-xs-3 {
    padding: 0;
}
dd.currency-amount .actions , dd.currency-precise .actions {
      height: auto!important;
      margin-right: -20px!important;
}
.panel .col-lg-3.col-md-6 h3 .actions {
    height: auto!important;
    margin-right: -5px!important;
}
dd.currency-amount , dd.currency-precise{
    margin-right : 15px!important;
}

.media , .media-body {
    overflow :initial!important;
}
/* Created the rule to avoid the extra space between facility address */
.address-list-group .row {
    display: flex;
    flex-wrap: wrap;
}


/* Change mouse pointer on hover */
.c3-event-rect:hover {
    cursor:pointer;
}
@media (min-width: 768px) {
    .panel table > tbody > tr > td > dl > dt {
        width: 120px;
    }
    .panel table > tbody > tr > td > dl > dd {
        margin-left: 130px;
        min-width: 40px;
    }
    table > tbody > tr > td.currency-amount > dl > dt, table > tbody > tr > td.currency-precise > dl > dt {
        width:140px;
    }
}
.graph-facets ul.list-inline>li {
    padding-bottom: 2px;
    padding-top: 1px;
    padding-right: 0;
}

li small {
    display: block;
}

li > .label.label-white-info {
    display:inline-block!important;
    padding:5px 16px 5px 5px;
    text-align:left;
    vertical-align:top!important;
}
li > .label.label-white-info.strike-on-hover > i {
    float:right;
    margin-right:-16px;
}
table tbody tr td li > .label.label-white-info {
    padding: 2px 5px 2px 5px;
    font-size: 80%;
    max-width: 110px;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #808080;
    border: 1px solid #808080;
    cursor: pointer;
    font-weight: normal;
}
li .media-right .badge {
    border-radius: 0px!important;
    padding: 6px 10px 6px 10px;
    font-size: 14px;
}
.panel-title .fa-caret-down {
    transform: rotate(0deg);
    transition: all 0.3s ease-in-out;
}
.panel-title.collapsed .fa-caret-down {
    transform: rotate(-90deg);
    transition: all 0.3s ease-in-out;
}
.panel .panel-heading .panel-title:hover{
  cursor : pointer;
}
ul.list-unstyled > li .media > .media-left {
padding-right:4px!important;
}
dl dd .media > .media-left {
    padding-right:4px!important;
}
/*Add this rule to set the position of button to the right in .well and set margin for anchor tag*/
.well > button {
    float:right;
}
.well > a, .well > span > a {
    margin-bottom:10px;
}
/*Add This Rule to give some kind of indication on input field*/
input.form-control:focus {
    border : 0.12em solid #4bafffd6 !important;
    -webkit-box-shadow : none!important;
    box-shadow : none!important;
    -webkit-transition: border-color ease-in-out .3s;
    transition: border-color ease-in-out .3s;
}
@media (max-width : 1176px) {
    table > tbody > tr > td > ul > li > a.btn.btn-link {
        padding: 8px 8px 8px 0px;
    }
}

.panel .panel-body .row.equal-height-flex .media .media-body dl dt{
    width:auto;
}
.panel-body > .row.equal-height-flex {
    margin-bottom: 20px;
}

.panel .panel-body .row.equal-height-flex .media .media-body dl dd{
    margin-left:55px;
}
/*For adjusting the width of tooltip containing media objects.*/
.popover .popover-content .media-body { width : 200px!important; }
.table .media .media-body { width : auto; }
.nav-tabs > li {
    background: #f1f1f1;
    border-bottom: 2px solid #7b8598;
    border-top: 2px solid transparent;
    margin:0 1px 0 1px;
    border-radius: 15px 15px 0 0px!important;
}
.nav-tabs>li.active {
    border: 2px solid #7b8598;
    border-bottom: 2px transparent solid;
    background: #fff;
    border-top: 2px solid #7b8598;
    margin:0 -1px 0 -1px;
}

.nav-tabs > li > label , .nav-tabs > li.active > label  {
    padding: 10px;
}
.nav-tabs {
    border-bottom: none;
}
.modal-body .nav-tabs {
    margin-bottom: 10px;
}
.nav-tabs li label input[type="checkbox"] {
    display: none;
}
.nav-tabs li label {
    cursor: pointer;
}

.nav-tabs>li.active>a {
    color: #40557b!important;
    background-color: transparent!important;
}


.nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
    background-color: transparent!important;
}

.nav-tabs>li>a{
    color: #343434!important;
    background-color: transparent!important;
    border: none!important;
    outline: none!important;
}
.nav-tabs>li.active:hover{
    background: #ffffff!important;
}

.nav-tabs>li>a:hover {
color:#40557b!important;
}

.nav-tabs>li{
    background:#f0f0f0;
}
.nav-tabs>li:hover{
    text-decoration-style: solid;
    background:#f5f5f5;
}
dl dd > a.relative.date-time-picker-content.link-hover input.dateAndTimePicker.clickTrigger {
    margin-left: -3px;
}

/*To add vertical scroll */
.scrollable-filters {
    height: 300px;
    overflow-y: auto;
}
ul.dropdown-menu li .radio {
    margin: 0 auto;
}

/*Styling for Panel Manager Plugin.*/

.panelManager .btn-toolbar {
    padding: 10px;
    margin: 0;
}

.panelManager .btn-toolbar button {
    float:none;
    width:100%;
    margin-bottom:10px;
}

.panelManager .btn-toolbar button .badge {
    color: #191919;
    background-color: #dedede;
    padding: 2px 4px;
    font-weight: unset;
}

.togglePanel-container {
    margin-top:10px;
}

.togglePanel {
    padding:6px 5px;
    margin-bottom: 7px;
    vertical-align:middle;
    display : block;
    font-size: small;
    width: 100%;
    border:none;
}

.togglePanel:hover {
    cursor: pointer;
    background:#f1f1f1;
    color:#000000;
    transform: scale(1.05);
    transition: 0.2s all;
}

.panelManager {
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    background: #404040;
    padding: 10px;
    border: 2px solid #555;
    border-right: none;
    min-width: 200px;
    min-height: 100px;
    color: #fff;
    display: none;
}

.hide-panelManager {
    z-index:10;
    width:20px;
    height:70px;
    border: 2px solid #555;
    border-right: none;
    padding: 0px;
    background:#404040;
    color:#fff;
}

.hide-panelManager:hover, .hide-panelManager:focus{
    outline:none;
    background:#000000;
    color:#fff;
}
.table>tbody>tr>td .chosen-container.chosen-container-multi ul.chosen-choices input[type=text] {
  width:auto!important;
}

ul.gallery {
    max-width: 220px;
    white-space: nowrap;
    overflow-x : auto;
}

.chosen-container.chosen-container-multi{
    display : block;
    width : auto !important;
}
.createOrderApp #cart-shipping-phone,
.createQuoteApp #cart-shipping-phone {
    margin-bottom: 10px;
}
.createOrderApp .panel table {
    margin-top: 10px;
}
.media-left > a {
    position: relative;
    z-index: 1;
}
#select-customer .dropdown-menu li a strong,
#select-customer .dropdown-menu li a span {
    white-space: normal;
    word-wrap: break-word;
}
.btn-toolbar .form-control {
    width : auto;
    display: inline-block;
}
.btn-toolbar .form-control:first-child {
    width : 100% !important;
}
.btn-toolbar .btn-group ul.dropdown-menu > li > button {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
    text-decoration: none;
    vertical-align: initial;
    border-color: transparent;
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    width: 100%;
    text-align: left;
}
.btn-toolbar .btn-group ul.dropdown-menu > li > button:hover, .btn-toolbar .btn-group ul.dropdown-menu > li > button:focus {
    background-color: #f5f5f5;
    color: #000;
}
.action-buttons .form-group form {display : inline-block;}
.button-bar-container > .button-bar #shopping-cart a {
    margin-top: -185px;
}
.table tbody tr td a + .dropdown,.table tbody tr td span + .dropdown {
    display : inline-block;
    vertical-align: top;
}

.table tbody tr td ul li .label.label-white-info {
    max-width: 160px;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    vertical-align : bottom;
}
.table tbody tr td ul.list-unstyled li > a {
    max-width : 90%;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    vertical-align : bottom;
}
.table tbody tr td a {
  white-space: nowrap;
}
#product-assets .panel .table tbody tr td a {
white-space: normal;
}
.table tbody tr td > .btn-group > a {
    max-width : 100%;
}
.table tbody tr td a .fa,.table tbody tr td a.link-hover {max-width : 100%;}
.panel-title > p {display:inline-block;}
table tbody tr td.currency-amount{
    white-space: nowrap;
} 

.table tbody tr td .dropdown-menu a{
    display : block !important;
}
.table tbody tr td a + small{
    overflow : hidden;
    text-overflow : ellipsis;
    white-space : nowrap;
}
.panel .panel-body .btn-toolbar .js-scan-select .input-group-btn button {
    margin-right:5px;
}
/*To hide tooltip-content initially*/
[tooltip] + span,[tooltip] + div, [tooltip] + table, [tooltip] + img, [tooltip] + dl {
    display: none;
}
[tooltip] + [tooltip] {
    display: block;
}
.fa-clipboard {
    cursor : pointer;
}


@media (min-width:1024px) {
    .list-group {
        cursor: pointer;
    }
    .list-group > .actions {
        position: absolute;
        right: 30px;
        display: none;
    }
    .btn-toolbar > .actions {
        float: right;
    }
}
ul.dropdown-menu > li > .checkbox > label {
    padding: 3px 5px;
}
ul.dropdown-menu > li > .checkbox {
    margin-top: 0px;
    margin-bottom: 0px;
}
ul.dropdown-menu > li:hover {
    background-color: #f5f5f5;
    color: #000;
}

.table .btn-group ul.dropdown-menu > li:hover {
    background-color: transparent;
}

.btn-group .checkbox input[type=checkbox], .btn-group .radio input[type=radio] {
    margin-left: 0;
    position:relative;
}
.btn-group .checkbox label, .btn-group .radio label { padding-left : 0;}
#advance-search-section:hover .list-group:hover

.slick-next {
    right : -20px !important;
}
.bootstrap-select>.dropdown-toggle {
    height: 34px
}
.list-group  .list-group-item > label {
    display: block;
}
#advance-search-section .list-group  .list-group-item > label,.facets .list-group  .list-group-item > label {
    background-color: #f7f7f7;
}
.bootstrap-select .dropdown-menu li.selected + .optgroup-1 > a {
    padding-left: 20px;
}

#advance-search-section .list-group .list-group-item,.facets .list-group .list-group-item {
    display: inline-block;
    margin-bottom: 0px;
    margin-right: 0px;
    border: 0;
    padding: 0px 0px;
    background: #f7f7f7;
    float: left;
    margin: 0px 5px 0 0;
    min-height: 1px;
}
#advance-search-section .list-group .slick-slide .list-group-item,.facets .list-group .slick-slide .list-group-item {
  margin-right : auto;
}

#advance-search-section .list-group-item > label + button {
    margin-top : 0;
}
#show-category-filters label {
    overflow : visible !important;
    max-width : 100% !important;
}
#advance-search-section .list-group-item #saved-filter-section,.facets .list-group-item #saved-filter-section  {
    display : inline-block;
}

#advance-search-section .list-group .list-group-item:first-child,.facets .list-group .list-group-item:first-child  {
    border-top-right-radius: 0px;
    border-bottom-left-radius: 4px;
}
#advance-search-section .list-group .list-group-item:last-child,.facets .list-group .list-group-item:last-child {
    border-top-right-radius: 4px;
    border-bottom-left-radius: 0px;
    margin-top: 16px;
}
#advance-search-section .list-group .slick-slide .list-group-item,.facets .list-group .slick-slide .list-group-item {
  margin-right : auto;
}

.graph-view-container > .actions {
    position: absolute;
    right: 15px;
    cursor:pointer;
    z-index: 1000;
}
#advance-search-section .list-group .list-group-item > .checkbox {
    padding: 6px 12px;
    margin-bottom: 0;
    border: 1px solid #ccc;
    color: #333;
    background-color: #fff;
    border-radius: 2px !important;
    margin-top: 0;
}
.btn-toolbar .checkbox {
    padding: 6px 12px;
    margin-bottom: 0;
    border: 1px solid #ccc;
    color: #333;
    background-color: #fff;
    border-radius: 2px !important;
    margin-top: 0;
}
#advance-search-section form {
    margin-bottom: 0!important;
}
.list-group .list-group-item  button .fa-caret-down{padding: 3px;}
.list-group .slick-slide {height : auto;}
.list-group .list-group-item .btn-group button:nth-of-type(2) + .dropdown-menu {
    left: auto;
    right: 0px;
}
#advance-search-section .list-group,.facets .list-group { margin : 0 25px 0 25px; height: 50px;}
#advance-search-section .list-group .list-group-item > label,.facets .list-group .list-group-item > label{
    margin-bottom:0;
    max-width : 95%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-right: -10px;
    font-size: 85%;
    color: #777;
}
#advance-search-section .list-group .list-group-item .checkbox:focus,#advance-search-section .list-group-item.slick-slide{
    outline: none !important;
}

.slick-list{margin : 0;}
/*.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
    width: 140px !important;
}*/

.list-group.slider .slick-list:first-child {margin-left: -15px;}
.hint{display: block;background-color: #f7f7f7;}
a.readmore-js-toggle {
    font-size: 85%!important;
    width: auto!important;
    float: right;
}
/*Overrode bootstrap-select default CSS. Check mark should be on left and text on right*/
.bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    left: 15px;
    right: 0px!important;
}
.bootstrap-select.show-tick .dropdown-menu li a span.text {
    margin-left: 20px;
    margin-right: 0px!important;
}
.modal + .dropdown.bootstrap-select { z-index: 1200; }
.dropdown-backdrop { z-index : 0 !important;}

.table>tbody>tr>td[rowspan] {
  white-space : nowrap;
}

.bs-searchbox > input[type="text"] {
    background-image: url('../img/search-icon.png');
    background-size: 38px 27px;
    background-repeat: no-repeat;
    background-position-x: right;
    background-position-y: 4px;
}

table tr td pre {
    padding: 0;
    margin: 0;
    font-size: inherit;
    word-break: break-word;
    white-space: pre-line;
    background-color: transparent;
    border: none;
    color: #000;
    font-family: 'Open Sans',Calibri,Candara,Arial,sans-serif;
}

#search-menu {
    width: 60%;
    box-shadow: none;
    -webkit-box-shadow: none;
    position: absolute;
    z-index: 1000;
    float: left;
    min-width: 300px;
    padding: 15px 0 15px 15px;
    margin: 2px 0 0;
    list-style: none;
    font-size: 14px;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
    background-clip: padding-box;
    top: 51px;
}
#search-menu {
    visibility: hidden;
}
#search-menu:before {
    content: "";
    border-bottom: 15px solid #fff;
    border-right: 17px solid transparent;
    border-left: 17px solid transparent;
    position: absolute;
    top: -15px;
    left: 87px;
    z-index: 10;
}
#search-menu:after {
    content: "";
    border-bottom: 17px solid #ccc;
    border-right: 19px solid transparent;
    border-left: 19px solid transparent;
    position: absolute;
    top: -17px;
    left: 85px;
    z-index: 8;
}

#create-menu {
    width: 60%;
    box-shadow: none;
    -webkit-box-shadow: none;
    position: absolute;
    z-index: 1000;
    float: right;
    min-width: 300px;
    padding: 15px 0 15px 15px;
    margin: 2px 0 0;
    list-style: none;
    font-size: 14px;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
    background-clip: padding-box;
    top: 51px;
}
#create-menu {
    visibility: hidden;
}
#create-menu:before {
    content: "";
    border-bottom: 15px solid #fff;
    border-right: 17px solid transparent;
    border-left: 17px solid transparent;
    position: absolute;
    top: -15px;
    z-index: 10;
    right: 24px;
}
#create-menu:after {
    content: "";
    border-bottom: 17px solid #ccc;
    border-right: 19px solid transparent;
    border-left: 19px solid transparent;
    position: absolute;
    top: -17px;
    z-index: 8;
    right: 22px;
}

.gridster ul {
    margin: 0;
}
.gridster li {
    list-style: none;
    float: none !important;
}
.gridster li.gs-w ul {
    padding-left: 0;
}
.gridster li.gs-w > ul > li:first-child {
    color: #428bca;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 2px;
}
.gridster li.gs-w > ul > li:first-child i {
    margin-right: 2px;
}
.gridster li.gs-w ul li {
    text-align: left;
    display: block;
}
.gridster li.gs-w > ul > li a {
    display: block;
    font-weight: normal;
    line-height: 1.428571429;
    color: #999;
    white-space: normal;
    padding: 0;
}
.gridster li.gs-w > ul > li a:hover {
    text-decoration: none;
    color: #444;
    background-color: #f5f5f5;
}
.panel-body .row.equal-height-flex ul:not(.dropdown-menu) > li a {
    max-width : 80%;
    text-overflow: ellipsis;
    overflow: hidden;
    vertical-align: bottom;
    display: inline-block;
    white-space: nowrap;
}
.panel-body .row.equal-height-flex ul > li a i.fa {
    max-width: 100%;
}
.panel-body .row ul > li span.actions a {
    white-space: normal;
    text-overflow: unset ;
}
select.js-ajax-chosen + .chosen-container > ul.chosen-choices > li.search-field > input {
    width:auto!important;
}
/*To align primary action button to the right hand side in the modals*/
.modal .modal-body button.btn-primary{
    float : right !important;
}

.modal .modal-body form + .list-group{
    margin-top: 65px;
    clear:both;
}
#main-page #shopping-cart a.btn-link {
    position: absolute;
    right: 100px;
    z-index: 1000;
}
#shopping-cart a.btn-link .fa-shopping-cart + .badge {
    margin-bottom: 5px;
}
#shopping-cart > a.btn-link {
    top: 10px;
    z-index: 1020;
    position: fixed;
    right: 200px;
}
#advance-search-section .list-group.slider:not(.slick-initialized):before,.facets .list-group.slider:not(.slick-initialized):before {
    content: "\f110";
    font-family: "FontAwesome";
    text-align: center;
    animation: fa-spin 2s infinite linear;
    position: absolute;
    left: 50%;
    line-height: 35px;
    transform-origin: 50%;
    font-size : large;
}
#advance-search-section .list-group.slider:not(.slick-initialized) .list-group-item,.facets .list-group.slider:not(.slick-initialized) .list-group-item {
    visibility: hidden;
}
.dropdown-menu > li form .btn.btn-link {
    padding: 3px 20px;
    color: #333;
}
.no-data-view {
    margin-top: 100px;
    min-height: 220px;
    display: none;
    text-align: center;
}
.no-data-view h4 {
    color: #068B78;
}
.no-data-view i.fa {
    color : #5BE7A9;
}
.scroll-products .panel-body .table tbody tr td a > img + p {
    width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
}
/*To avoid horizontal scroll form the pdf*/
div.pp_pic_holder.pp_default { width: 100% !important; height: 100% !important; position: fixed; }
dl dd .media {
    margin-top: 0px!important;
}

/*Styling for check-mark specific to graph-type-changer dropdown*/
.graph-type-changer.check-mark:before {
    content: "\f00c";
    font-family: FontAwesome;
    position: absolute;
    left: 15px;
    right: 0;
}
.graph-type-changer {
    margin-left: 15px;
}

/*To open chosen container in upward direction if it present at bottom of the screen*/
.ui-selectable .chosen-with-drop .chosen-drop { top: auto; bottom: 100%; border-top: 1px solid #aaa;}

.bootstrap-select .dropdown-menu > li.active > a, .bootstrap-select .dropdown-menu > li.active > a small {
    color: #333;
    background-color: #fff;
}
.bootstrap-select .dropdown-menu > li.active:hover a, .bootstrap-select .dropdown-menu > li.active:hover small {
    color: #262626;
    background-color: #f5f5f5;
}
.bootstrap-select .selectpicker-ajax ~ .dropdown-menu li.active span.check-mark { top: 13px!important; }
.bootstrap-select .selectpicker-ajax ~ .dropdown-menu .dropdown-header.optgroup-1 + li.active span.check-mark { top: 7px!important; }
.bootstrap-select .selectpicker-ajax ~ .dropdown-menu .dropdown-header.optgroup-1 + li.active { padding: 0px; }
.bootstrap-select .selectpicker-ajax ~ .dropdown-menu li.active { padding: 6px 0px 0px 20px; }
.bootstrap-select.show-tick .selectpicker-ajax ~ .dropdown-menu li a span.text { margin-left: 12px!important; }
.bootstrap-select .selectpicker-ajax ~ .dropdown-menu .dropdown-header.optgroup-1 + li.active a span.text { margin-left: 20px!important; }
.bootstrap-select .dropdown-menu li small { padding-left: 0 !important; }
.bootstrap-select .dropdown-toggle .filter-option-inner { color: #333; }
.bootstrap-select .dropdown-menu { padding: 0;}
.popover-title > .close { padding: 0 !important;}
.btn-toolbar .bootstrap-select { float: left !Important;}
.ui-widget-content a, .ui-widget-content a small  b {color: #333;}
.ui-widget-content a small{ color: #777;}
.date-filter {width : 200px;}
.date-filter button:first-child {width : 175px;}
.iti-flag {background-image: url("../js/intlTelInput/img/flags.png");}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .iti-flag {background-image: url("../js/intlTelInput/img/flags@2x.png");}
}
/*Set the max height and width of the logo image for the header section*/
header .brand-logo img {
    max-height: 54px;
    max-width: 110px;
}
select.bs-select-hidden,
.bootstrap-select > select.bs-select-hidden,
select.select-picker,select.select-picker-group{display:none!important}
.bootstrap-select>select {
    display: block!important;
}

#show-existing-products-categories {
  max-height:200px;
  overflow-y:auto;
}
.bootstrap-select .dropdown-menu li a.opt { padding-left: 20px;}
.dropdown-header {
    font-size: 14px;
    color: #070707;
    font-weight: 700;
}
.actions + .readmore-js-section {
    width: 95% !important;
}
.panel [class*="col-lg-3"] dl dt {
  width: 100px;
}
.panel [class*="col-lg-3"] dl dd {
  margin-left: 120px;
}
#progress-bar .popover-content [class*="col-"] ul a { min-width: 175px; }

/*To set ellipsis on company name inside side menu*/
.side-menu #accordion a strong{
    max-width: 175px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block;
}
.side-menu #accordion a strong + i.fa{
    vertical-align: super;
}
.side-menu #companyName a{
    max-width: 212px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block;
}
.side-menu>ul>li:first-child a:focus {
    text-decoration: none;
}
/*End-set ellipsis on company name inside side menu*/
/*To add vertical scroll for demo users list on login screen*/
.col-lg-offset-4 > .list-group{
    max-height: 245px;
    overflow-y: scroll;
}
.side-menu-right-shift #create-promotion #carrier_party_id_chosen {
    padding-right: 35px;
}
.forward, .backward,.forward:hover, .backward:hover  {
      line-height: 0;
      position: absolute;
      top: 54%;
      display: block;
      width: 20px;
      height: 20px;
      padding: 0;
      -webkit-transform: translate(0, -50%);
      -ms-transform: translate(0, -50%);
      transform: translate(0, -50%);
      cursor: pointer;
      border: none;
      outline: none;
      background: transparent;
}
.forward{ right: -40px; }
.backward{ left: -40px; }
.forward[disabled], .backward[disabled] {opacity: 0.25; cursor: pointer;}
/*When in full screen mode it should appear above navigation and side menu*/
.codemirror-fulltoolbar, .CodeMirror-fullscreen, .mce-fullscreen {
    z-index: 1050!important
}

#supplier-product .validate-positiveNumber.maskPrice {width: -webkit-fill-available; width: -moz-available;}
.table tbody tr td.action-tags ul.list-unstyled li > a {max-width: 100% !important;}
.modal-body #search-section .input-group {
    padding-bottom: 24px;
    width: 30%;
position: static !important;}
.modal-body .table tbody tr td.bulk-action-checkbox + td a + small {
    white-space: normal !important;
}
.modal-body #advance-search-section .list-group {
    margin-left: 0 !important;
}
@-moz-document url-prefix() {
    .modal-body #search-section .input-group {
    width: 100% !important;
    }
}
.modal-body #options-list .panel{
    padding-left: 0 !important;
}
.modal-body #options-list .panel .panel-title {
    padding-left: 16px;
}
.modal-body #options-list .panel .panel-body {
    padding-right: 0px !important;
}
@media (max-width:1280px ) {
  .media-middle.media-left + .media-body{
   display:inline !important;
   margin-top: 8px;
 }
}
/*To align dt of dl list in the left side*/
.panel .col-lg-6 dl.left-align dt {
  width: 100px !important;
  text-align: left;
}
.panel .col-lg-6 dl.left-align dd {
  margin-left: 120px !important;
}
dl.left-align ul:not(.dropdown-menu) > li a {
  max-width: 100% !important;
}
/*End of left-align rules for dl*/
.category-btn {
  width: 220px !important;
  text-align: left;
}
.category-btn .caret {
  float: right;
  margin-top: 4%;
  border-top-color: #777 !important;
}
#cart-gift-message{
  margin-bottom: 16px;
}
.name {border-radius:50% !important;}
.row-pattern small {
    display: block;
}
.row-pattern .bulk-action-checkbox{
    float:left;
    margin-right: 16px;
}
.row-pattern .media {
    margin-top: 0;
}
.row-pattern .media .media-body {
    width: auto;
}
.jumbotron {
    padding-top: 8px;
    padding-bottom: 8px;
}
/* Given CSS rules are used for Categories section on the product details page */
#product-details .panel-body #product-delete ul li form,
#product-details .panel-body #product-merchandising-category ul li form,
#configurable-overview .panel-body #config-product-categories ul li form {
    display: inline;
}
#product-details .panel-body .row.equal-height-flex ul:not(.dropdown-menu) > li a,
#configurable-overview .row.equal-height-flex #config-product-categories ul:not(.dropdown-menu) > li a { max-width: 100%; }

#product-details .panel-body .row.equal-height-flex #product-delete ul li > span,
#product-details .panel-body .row.equal-height-flex #product-merchandising-category ul li > span,
#configurable-overview .panel-body .row.equal-height-flex #config-product-categories ul li > span {
    padding: 5px 12px;
    font-size: 100%;
    color: #555;
    white-space: nowrap;
    border-radius: 20px !important;
}
#product-details .panel-body .row.equal-height-flex ul li > span.primary-category,
#configurable-overview .panel-body .row.equal-height-flex ul li > span.primary-category {
    background: #fbd84a1f;
    cursor: default;
}
#product-details .panel-body .row.equal-height-flex .primary-category .fa-star,
#configurable-overview .panel-body .row.equal-height-flex .primary-category .fa-star {
    padding-left: 8px;
    width: auto;
}
#product-details .panel-body .row.equal-height-flex ul li > span.non-primary-categories,
#configurable-overview .panel-body .row.equal-height-flex ul li > span.non-primary-categories {
     background: #8080802b;
     cursor: default;
}
#product-details .panel-body .row.equal-height-flex span.non-primary-categories a,
#configurable-overview .panel-body .row.equal-height-flex span.non-primary-categories a {
    color: #555;
}
#product-details .panel-body .row.equal-height-flex .non-primary-categories a .fa-times,
#configurable-overview .panel-body .row.equal-height-flex .non-primary-categories a .fa-times {
    background: #808080fa;
    border-radius: 50px!important;
    padding: 1px;
    color: #ffffffcc;
    margin-left: 8px;
}
#product-details .panel-body .row.equal-height-flex h5,
#configurable-overview .panel-body .row.equal-height-flex h5 {
    color: #8080809c;
    font-size: 12px;
}
#product-details .panel-body .row.equal-height-flex #product-delete ul.list-inline li,
#product-details .panel-body .row.equal-height-flex #product-merchandising-category ul.list-inline li,
#configurable-overview .panel-body .row.equal-height-flex #config-product-categories ul.list-inline li {
    margin-bottom: 10px;
}
.row-pattern hr {
    border-bottom: 1px solid #ddd !important;
    margin-left: 28px;
}
.row-pattern .row.static + hr {
    margin-lefT:0 !important;
}
.btn-toolbar .actions button {
    float: unset;
}
.row-pattern small {
    color: #777;
}
.job-card.btn-group ul .actions {
    float: right;
}
.job-card.btn-group ul.dropdown-menu li {
    padding: 0 8px;
}
.job-card.btn-group ul.dropdown-menu {
    right: 0px;
    left: auto;
    width: 300px;
}
.job-card.btn-group ul .btn-group{
    margin-top: 4px;
}
.job-card ul li a {
    border: 1px solid #777;
    border-radius: 28px !important;
    line-height: 28px;
    background-color: #ddd;
    padding: 4px 16px !important;
    font-size: 85%;
    color: #777 !important;
}
.job-card ul li:hover{
    background: none;
}

.job-card .fa-angle-down {
    cursor: pointer;
}

.job-card .refresh-btn {
    float: right;
    padding: 0;
}
small.caution{
    color: #F2994A;
    display: inline-block;
    float: right;
}
.row-pattern .row + .row {
    margin-top: 8px;
}
.row-pattern .btn-toolbar > .bulk-action-checkbox {
    float: left;
    margin-left: 6px !important;
}
.row-pattern .btn-toolbar {
    border-top: none !important;
}
.bootstrap-select .dropdown-menu .inner.open {
    max-height: 300px !important;
}
.tooltip-data li {
    padding: 8px 0;
    border-bottom: 1px solid #ccc !important;
}
.list-group-item > #saved-filter-toolbar {
    margin-top: 16px;
}
#savedQuery {
    width: 100%;
    overflow: scroll;
    white-space: nowrap;
}
.span-btn {
    display: inline-block;
    padding: 6px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857143;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid;
    color: #333 !important;
    background-color: #fff;
    border-color: #ccc;
    border-radius: 2px !important;
}
.span-btn a {
    color: #333 !important;
}
.span-btn .fa {
    font-size: 18px;
}
.span-btn .btn-link {
    float: right !important;
    padding: 0;
    margin-top: -6px !important;
    display: none;
}
.span-btn a small {
  display: block;
  margin-right: 24px;
}
.span-btn:hover .btn-link {
    display: block;
}
.flex-content-between {
   align-items: flex-end;
}
.flex-content-between .fa.fa-sort {
   margin-bottom: 2px;
}
.ajax-loader-container {
    position: relative;
}

/*Css rule for the two line list pattern*/
.list-info {
    display: inline;
    margin-left: 5px;
}
.list-info .actions {
    float:right;
}
.list-info .actions p {
    margin-bottom: 0 !important;
}

header .brand-logo + .list-inline li .fa-clipboard {
    width:20px;
    height:20px;
}
.equal-height-flex ul.list-unstyled > li > i + div.thumbnail {
    display: inline-block;
    vertical-align: middle;
}
.slick-prev {
    left: -20px !important;
}
.slick-next {
    right: -20px !important;
}
th.bulk-action-checkbox, td.bulk-action-checkbox {
    width: 24px;
}
ul>li>span button.btn-link.inline{
    padding : 4px !important;
    margin-bottom: 10px;
}
.btn-toolbar h4 {
    display: inline-block;
    float: left;
    margin-right: 8px;
    margin-top: 8px;
    margin-left: 5px;
}
.bootstrap-select .status {
    padding: 8px;
}

.img-container > img {
    width: inherit;
    height: 100%;
    object-fit: contain;
}

.chip-img .img-container {
    overflow: hidden;
}

.chip-img img {
    object-fit: cover;
}

.thumbnail {
    width: 56px;
    height: 56px;
    margin-bottom: 0 !important;
    border: none;
}
.small {
    width: 125px;
    height: 125px;
}
.xSmall {
    width: 52px;
    height: 52px;
}
.medium {
    width: 200px;
    height: 200px;
}
.large {
    width: 300px;
    height: 300px;
}
.detail {
    width: 500px;
    height: 500px;
}
.img-display {
    display: inline-block;
    vertical-align: middle;
}
.brand-logo-img {
    display: inline-block;
    height: 22px;
    width: 110px;
    vertical-align: middle;
}
.chip-container .order-box {
    display: inline-block;
    margin-right: 12px;
    vertical-align: top;
}
.chip-container span.chip-img {
    display: block;
    position: relative;
    text-align: right;
    margin-bottom: 5px;
    margin-top: 5px;
    padding: 5px 0;
    font-size: 100%;
    color: #555;
    white-space: nowrap;
    border-radius: 20px !important;
    background: #8080802b;
}
.badge-danger a, .badge-info a{
    color: white;
}
li.flex-content-between {
   align-items: flex-start;
}
.chip-container h3 {
    font-weight: 700;
    font-size: 14px;
    margin-top: 0;
    margin-bottom: 5px;
}
.chip-container .order-box span.chip-img p {
    margin-bottom: 0px;
    margin-left: 35px;
    margin-right: 12px;
    display: inline-block;
}
.chip-container .order-box span.chip-img label {
    font-weight: normal !important;
    margin-bottom: 0px;
    margin-left: 15px;
    display: inline-block;
}
.chip-container .order-box span.chip-img .fa-images {
    position: absolute;
    border-radius: 50px!important;
    top: 3px;
    left: 3px;
    width: 24px;
    height: 24px;
    min-height: 24px !important;
}

.modal .well {
    word-break: break-word;
}

.btn-toolbar {
    display: flex;
    align-items: end;
}
.panel .btn-toolbar {
    margin-left: 0px!important;
}
.analytics {
    display: flex;
    flex-direction: column;
}
.analytics .bootstrap-select {
    float: none!important;
    display: block!important;
}

.analytics label {
    font-size: 85%;
}

.key-value-map {
    display: grid;
    grid-template-columns: max-content auto;
    align-content: start;
    column-gap: 20px;
}

.key-value-map > dt {
	text-align: end;
}

#main-content .container-fluid {
    min-height: calc(100vh - 53px);
    /* used 53px because this is the static height value of the header. This is not expected to work on mobile, but that's ok because nobody will use this on mobile */
}

.chip-container span.background-none{
    background: none;
}

.padding-y{
    padding-top: 10px;
    padding-bottom : 10px;
}