/*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[6].rules[1].use[0]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].rules[1].use[1]!./src/styles.scss?ngGlobalStyle ***!
  \***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
/***TO BE REFACTORED**/
/* You can add global styles to this file, and also import other style files */
/*************************************** GLOBAL STYLES*****************************/
/*************************************** GLOBAL STYLES*****************************/
/*************************************** GLOBAL STYLES*****************************/
* {
  box-sizing: border-box;
}

html {
  height: 100%;
}

body {
  min-height: 100%;
  grid-template-rows: 1fr auto;
}

.pageTitle {
  margin-bottom: 65px;
}

.view-container {
  /*margin-top: -1.5% !important; */
  padding: 0 60px;
  margin-bottom: 150px;
}

.breadcrumbCommonCls {
  font-size: 12px !important;
}

.dialogSection .k-dialog {
  width: 41%;
}

.passwordChange .k-dialog {
  width: 40%;
}

.dialogBtnSize {
  width: 100px;
}

.dialog-btn-section .btn-align-center {
  text-align: center;
}

.date-range-filter {
  margin-left: -5px;
}

.textArea-height {
  height: 150px;
}

.sign-in-container {
  right: 0px !important;
  width: 20% !important;
}

.footer {
  grid-row-start: 2;
  grid-row-end: 3;
  bottom: 0;
  width: 100%;
}

.btnGreenBorderCls {
  border-color: green !important;
}

.requiredField {
  color: red;
}

.k-grid-footer {
  height: 106px !important;
}

ul.ol {
  padding: 0 !important;
}

.float-left {
  float: left;
}

.float-right {
  float: left;
}

::placeholder {
  color: #666677 !important;
  opacity: 1; /* Firefox */
}

/*GLOBAL MAIN MENU*/
.login-menu {
  position: absolute;
  top: 0;
  left: 0px;
  z-index: 999;
  background: #fff;
  padding: 10px 15px 10px 25px;
  border-right: 1px;
  justify-content: space-between;
  align-items: center;
  height: 50px;
  width: 365px;
  overflow: hidden;
  white-space: nowrap;
}

.login-menu .k-icon.k-i-user {
  font-size: 20px !important;
  margin-right: 10px;
}

*:focus {
  outline: 0;
}

.user-icon {
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 24px;
  width: 24px;
  border-radius: 50%;
}

span.user {
  text-align: left !important;
  position: absolute;
  left: 50px;
}

span .p-button-icon-left.p-clickable.k-icon.k-i-rows {
  font-size: 24px !important;
}

.mainMenu {
  margin: 0px 10px 0 32px;
}

.p-slidemenu-backward {
  top: 0px;
  height: 3rem;
  padding: 10px 15px 10px 25px !important;
}

.mainMenu .p-button {
  width: 3em !important;
  height: 3em !important;
  background: #666677 !important;
  border: none !important;
}

button .pi-bars {
  font-size: 26px !important;
}

body .p-slidemenu .p-menuitem.p-menuitem-active > .p-menuitem-link .p-menuitem-icon,
body .p-slidemenu .p-menuitem.p-menuitem-active > .p-menuitem-link .p-submenu-icon {
  color: #f13c30 !important;
}

body #menuBtn.p-button:enabled:hover {
  background: #ee3322 !important;
}

body #menuBtn.p-button.p-button-icon-only {
  width: 3em !important;
  height: 3em !important;
  border-radius: 5px !important;
  -moz-border-radius: 5px !important;
  -webkit-border-radius: 5px !important;
}

.p-slidemenu-wrapper,
.p-slidemenu-content {
  min-height: 125vh;
}

.p-slidemenu.p-slidemenu-dynamic {
  left: 0 !important;
  width: 350px;
  height: 100vh;
  top: 48px !important;
  background: #666677;
  z-index: 5 !important;
  border: none;
}

body .p-menu .p-menuitem-link,
body .p-menubar .p-menuitem-link,
body .p-tieredmenu .p-menuitem-link,
body .p-contextmenu .p-menuitem-link,
body .p-megamenu .p-menuitem-link,
body .p-slidemenu .p-menuitem-link {
  background: #666677 !important;
  padding: 15px !important;
  text-transform: uppercase;
}

body .p-menu:hover .p-menuitem-link:hover,
body .p-menubar:hover .p-menuitem-link:hover,
body .p-tieredmenu:hover .p-menuitem-link:hover,
body .p-contextmenu:hover .p-menuitem-link:hover,
body .p-megamenu:hover .p-menuitem-link:hover,
body .p-slidemenu:hover .p-menuitem-link:hover {
  background: #7a7a8c !important;
}

body .p-menu .p-menuitem-link .p-menuitem-text,
body .p-menubar .p-menuitem-link .p-menuitem-text,
body .p-tieredmenu .p-menuitem-link .p-menuitem-text,
body .p-contextmenu .p-menuitem-link .p-menuitem-text,
body .p-megamenu .p-menuitem-link .p-menuitem-text,
body .p-slidemenu .p-menuitem-link .p-menuitem-text {
  color: #fff !important;
}

.p-slidemenu .p-slidemenu-rootlist {
  width: 100% !important;
}

.p-slidemenu .p-menuitem-active > .p-submenu > .p-submenu-list {
  width: 100% !important;
}

body .p-menu .p-menuitem-link .p-menuitem-icon,
body .p-menubar .p-menuitem-link .p-menuitem-icon,
body .p-tieredmenu .p-menuitem-link .p-menuitem-icon,
body .p-contextmenu .p-menuitem-link .p-menuitem-icon,
body .p-megamenu .p-menuitem-link .p-menuitem-icon,
body .p-slidemenu .p-menuitem-link .p-menuitem-icon {
  color: #fff !important;
  float: right;
}

.p-slidemenu .p-menuitem-link .p-submenu-icon {
  color: #fff;
}

body .p-corner-all {
  border-radius: 0 !important;
}

.p-slidemenu .p-submenu-list {
  top: -20px !important;
}

/**END GLOBAL MAIN MENU*/
.breadcrumb-container .k-icon.k-i-home {
  color: #666677;
}

.breadcrumb-container {
  padding-left: 0;
  padding-right: 0;
}

.breadcrumb {
  padding: 0 !important;
  margin-left: 13px;
}

.breadcrumb a.k-icon.k-i-home {
  color: #666677 !important;
}

ul.account-list-items {
  cursor: pointer;
}

ul.account-list-items span.k-icon.k-i-user {
  color: #212121;
}

/*GLOBAL DROPDOWNS*/
.k-list .k-item.k-state-selected,
.k-list-optionlabel.k-state-selected,
.k-list-container .k-button:active,
.k-list-container .k-button.k-state-active,
.k-columnmenu-item.k-state-selected,
.k-column-menu .k-menu:not(.k-context-menu) .k-item.k-state-selected,
.k-spreadsheet-popup .k-button:active,
.k-spreadsheet-popup .k-button.k-state-active,
.k-spreadsheet-popup .k-button.k-state-selected,
.k-menu-group .k-item.k-state-selected,
.k-menu.k-context-menu .k-item.k-state-selected {
  background: #666677;
}

/*GLOBAL PANELBARS*/
.k-treeview {
  padding: 15px;
}

.k-panelbar > .k-item > .k-link,
.k-panelbar > .k-item > .k-link {
  padding: 12px;
  text-transform: uppercase;
}

.k-panelbar > .k-item > .k-link,
.k-panelbar {
  background: #f6f6f6;
  font-size: 14px;
  color: #000;
  cursor: pointer;
}

.k-panelbar > .k-item > .k-link:hover,
.k-panelbar > .k-item > .k-link.k-state-hover {
  padding: 12px;
  color: #000;
}

.k-panelbar > .k-item > .k-link.k-state-selected:hover,
.k-panelbar > .k-item > .k-link.k-state-selected.k-state-hover {
  color: #fff;
}

.k-panelbar .k-state-focused.k-state-selected {
  background: #f13c30 !important;
  color: #fff !important;
}

.k-panelbar {
  background: #fff;
}

.k-panelbar > .k-item > .k-link.k-state-selected {
  background: #f6f6f6;
  color: #000;
}

.panelBarItems li {
  list-style-type: none;
}

.panelBarItems a {
  color: #000;
}

span.panelPdfIcons {
  color: #f13c30;
  margin-right: 10px;
  font-size: 24px;
}

.panelSubtitle {
  padding: 15px;
  display: block;
}

/*GLOBAL DIALOG*/
.k-dialog-titlebar {
  border-color: inherit;
  color: #fff;
  background-color: #ee3322;
}

.k-window-content,
.k-prompt-container {
  background: #fff !important;
}

/*END GLOBAL DIALOG*/
/*GLOBAL PROFILE*/
.profile-menu-header .k-icon.k-i-user {
  color: #666677;
  font-size: 24px;
  margin-right: 15px;
  margin-top: -7px !important;
}

span.logged-in-as,
.usernameDisplay {
  display: inline-block;
  font-size: 20px;
}

.profile-menu-list-items .k-icon {
  margin-top: -7px;
  margin-right: 7px;
  font-size: 18px;
}

ul.profile-menu-list-items a {
  color: #fff;
  font-size: 18px;
}

ul.profile-menu-list-items a:hover {
  text-decoration: none;
  color: #e0e0e0;
  font-size: 18px;
}

/*END GLOBAL PROFILE*/
/*GLOBAL PANELBARS*/
.manageCompany.k-panelbar > .k-item > .k-link {
  padding: 15px;
  background: #4d4d5e;
  font-size: 16px;
  font-weight: normal;
  color: #fff;
  cursor: pointer;
  text-transform: initial !important;
}

.manageCompany.k-panelbar > .k-item > .k-link:hover {
  background: #7a7a8c !important;
}

.manageCompany.k-panelbar > .k-item > .k-link.k-state-selected:hover {
  background: #4d4d5e !important;
}

.manageCompany.k-panelbar > .k-item > .k-link.k-state-selected {
  background: #4d4d5e !important;
  font-size: 16px !important;
  color: #fff !important;
  cursor: pointer !important;
}

.manageCompany.k-panelbar {
  border: none;
}

.manageCompany.k-panelbar > .manageCompany.k-item > .manageCompany.k-link,
.manageCompany.k-panelbar > .manageCompany.k-item > .manageCompany.k-link {
  padding: 15px;
  text-transform: uppercase;
}

.manageCompany.k-panelbar > .k-item > .k-link .k-icon {
  color: #fff;
  margin-right: 10px;
}

/*END GLOBAL PANEL BARS*/
/*#region GLOBAL BUTTONS*/
.k-button.k-primary {
  color: #666677 !important;
  border: none;
  padding: 7px 15px;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
}

.k-button.k-primary:hover {
  background: #666677 !important;
  color: #fff !important;
  border: none;
}

button.sign-in-button.k-button.k-primary {
  background: #ee3322 !important;
  color: white !important;
  font-weight: bold;
}

button.sign-in-button.k-button.k-primary:hover {
  background: #fa4636 !important;
  color: white;
  font-weight: bold;
}

button.k-button {
  background: #f4f4f4 !important;
  color: #666677 !important;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  padding: 6px 15px;
}

button.k-button:hover {
  background: #666677 !important;
  color: #fff !important;
}

button.download-button {
  border: 1px solid #666677;
}

button.download-button:hover {
  background: #666677;
  color: #fff;
}

button.register-button {
  color: #fff !important;
  background: #ee3322 !important;
}

button.register-button:hover {
  background: #666677;
  color: #fff;
}

button.submit-button {
  color: #fff !important;
  background: #ee3322 !important;
}

button.submit-button:hover {
  background: #666677;
  color: #fff;
}

button.clear-button {
  border: 1px solid #666677;
}

button.clear-button:hover {
  background: #666677;
  color: #fff;
}

button.cancel-button {
  border: 1px solid #666677;
}

button.cancel-button:hover {
  background: #666677;
  color: #fff;
}

.k-upload-button {
  border: 1px solid #666677 !important;
}

.k-upload-button:hover {
  background: #666677 !important;
  color: #fff;
}

button.add-new-quote-button {
  color: #666677 !important;
  border: 1px solid #666677 !important;
}

button.add-new-quote-button:hover {
  background: #666677 !important;
  color: #fff !important;
  border: 1px solid #666677 !important;
}

button.request-a-quote-button {
  background: #ee3322 !important;
  color: #fff !important;
  border: 1px solid #ee3322 !important;
}

button.request-a-quote-button:hover {
  background: #fa4636 !important;
  color: #fff !important;
  border: 1px solid #fa4636 !important;
}

button.pdf-button {
  color: #ee3322 !important;
  background: #fff !important;
  border: 1px solid #ee3322 !important;
}

button.pdf-button:hover {
  background: #ee3322 !important;
  color: #fff !important;
  border: 1px solid #ee3322 !important;
}

button.excel-button {
  color: #008000 !important;
  background: #fff !important;
  border: 1px solid #008000 !important;
}

button.excel-button:hover {
  background: #008000 !important;
  color: #fff !important;
  border: 1px solid #008000 !important;
}

button.sign-in-button.k-button.k-primary:hover {
  background: #fa4636 !important;
}

button.continue-button.k-button.k-primary {
  background: #f4f4f4 !important;
  color: #fff !important;
  border: 1px solid #f4f4f4 !important;
  color: #666677 !important;
}

button.continue-button.k-button.k-primary:hover {
  color: #f4f4f4 !important;
  border: 1px solid #666677 !important;
  background: #666677 !important;
}

button.place-order-button {
  background: #ee3322;
  color: #fff;
}

button.place-order-button:hover {
  background: #fa4636 !important;
  color: #fff;
}

.blackbox .k-button[disabled],
.k-button[disabled]:focus,
.k-button.k-state-focused[disabled],
[disabled] .k-button,
[disabled] .k-button:focus,
[disabled] .k-button.k-state-focused,
.k-button.k-state-disabled,
.k-button.k-state-disabled:focus,
.k-button.k-state-disabled.k-state-focused,
.k-chip.k-chip-disabled {
  background: #f6f6f6 !important;
}

.k-button[disabled],
.k-button[disabled]:focus,
.k-button.k-state-focused[disabled],
[disabled] .k-button,
[disabled] .k-button:focus,
[disabled] .k-button.k-state-focused,
.k-button.k-state-disabled,
.k-button.k-state-disabled:focus,
.k-button.k-state-disabled.k-state-focused,
.k-chip.k-chip-disabled {
  background: #ee3322 !important;
  color: #fff !important;
}

button.default-button,
button.man-button,
button.map-button,
button.add-button,
button.update-button,
button.search-button,
button.save-button,
button.update-button,
button.print-button,
button.hold-button,
button.cancel-button,
button.release-button {
  border: 1px solid #377dbb;
  background: #377dbb;
  color: #fff;
}

button.default-button:hover,
button.man-button:hover,
button.map-button:hover,
button.add-button:hover,
button.update-button:hover,
button.search-button:hover,
button.save-button:hover,
button.release-button:hover {
  background-image: none !important;
  border: 1px solid #6ca6d9 !important;
  background: #6ca6d9 !important;
  color: #fff;
}

/*#endregion GLOBAL BUTTONS*/
/*GLOBAL KENDO THEME SWITCHES*/
.k-switch-on .k-switch-container {
  color: #fff;
  background-color: #37b400;
}

.k-switch-on:hover .k-switch-container, .k-switch-on.k-state-hover .k-switch-container {
  color: #fff;
  background-color: #37b400 !important;
}

/*END GLOBAL KENDO THEME SWITCHES*/
/*GLOBAL KENDO PANEL BARS*/
.k-panelbar > .k-item > .k-link.k-state-selected {
  color: #fff;
  font-size: 20px;
  background-color: #ee3322;
}

/*END GLOBAL KENDO PANEL BARS*/
/*GLOBAL KENDO THEME PAGINATION*/
.k-pager-numbers .k-state-selected {
  background: #aeb5ba;
  color: #fff;
  cursor: pointer;
}

.k-pager-numbers .k-link:hover,
.k-pager-numbers .k-link.k-state-hover {
  color: #fff;
  background-color: #666677;
}

/*END GLOBAL KENDO THEME PAGINATION*/
/*GLOBAL KENDO GRIDS*/
.row .export-buttons {
  display: block;
}

.row {
  margin-right: 0px !important;
}

.k-grid {
  background: #f6f6f6;
}

.k-grid-header .k-header > .k-link {
  font-weight: bold !important;
}

.k-grid-header .k-header {
  font-weight: bold !important;
}

.k-dropdown.k-dropdown-operator .k-dropdown-wrap .k-select,
.k-dropdown-operator.k-dropdowntree .k-dropdown-wrap .k-select {
  width: calc(8px + 1.4285714286em) !important;
  height: calc(0px + 1.4285714286em) !important;
}

.export-buttons button.k-button {
  width: 100%;
  margin-bottom: 10px;
}

.k-grid-header .k-i-sort-asc-sm,
.k-grid-header .k-i-sort-desc-sm,
.k-grid-header .k-sort-order {
  color: #ee3322;
}

/*END GLOBAL KENDO GRIDS*/
/*#region GLOBAL KENDO TABS*/
/*Not using below css for tabs*/
/*.k-tabstrip-items {
  border-color: rgba(0, 0, 0, 0.08);
  color: #656565;
  background: #1b364e;
}

.k-tabstrip-items .k-item {
  color: #fff;
}

.k-tabstrip-items .k-item:hover,
.k-tabstrip-items .k-item.k-state-hover {
  color: #bedbf4 !important;
}

.k-tabstrip-items .k-item.k-state-active,
.k-tabstrip-items .k-item.k-state-selected {
  border-color: rgba(0, 0, 0, 0.08);
  color: #1b364e !important;
  background-color: #fff;
  font-weight: bold;
}*/
/*#endregion GLOBAL KENDO TABS*/
/*GLOBAL KENDO CHECKBOXES*/
.k-checkbox:checked {
  border-color: #ee3322;
  color: #fff;
  background-color: #ee3322;
}

/*END GLOBAL KENDO CHECKBOXES*/
.k-numerictextbox {
  max-height: 37px;
}

/*GLOBAL OVERLAYS*/
#backgroundOverlay {
  opacity: 0.6 !important;
  background: #4d4d6b;
}

#backgroundOverlayLanguage {
  background-color: #000;
  position: fixed;
  z-index: 3;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: block;
  opacity: 0;
}

#backgroundOverlaySignIn {
  background-color: #000;
  position: fixed;
  z-index: 3;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: block;
  opacity: 0;
}

#backgroundOverlayProfile {
  background: #4d4d6b;
  position: fixed;
  z-index: 3;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: block;
  opacity: 0.6;
}

/*END GLOBAL OVERLAYS*/
/*GLOBAL ACCOUNT MENU*/
#profile-menu .k-animation-container-shown,
#profile-menu.k-animation-container > .k-popup {
  margin-top: 10px;
  background: #666677 !important;
  width: 400px;
  min-height: 200vh;
}

.profile-menu-header {
  background: #fff;
  padding: 15px;
  font-size: 20px;
}

#profile-menu ul {
  margin: 0;
  padding: 0;
}

#profile-menu li {
  color: #f9f9f9;
  list-style: none;
  font-size: 16px;
  padding: 15px;
}

li.manageCompany {
  color: #f9f9f9;
  list-style: none;
  font-size: 16px;
  padding: 0px !important;
}

.manageCompanyLinks {
  background: #4d4d5e;
}

.listItem {
  display: block;
  vertical-align: top;
  color: #fff;
  font-size: 16px;
  padding: 15px 15px 15px 45px;
}

.listItem:hover {
  background: #7a7a8c;
}

.p-button-icon-only .p-button-icon-left {
  font-size: 25px;
}

/*END GLOBAL ACCOUNT MENU*/
/*GRID BUTTONS*/
.row.export-buttons {
  display: block !important;
}

.export-buttons button.k-button {
  width: 10%;
  margin-bottom: 10px;
  float: left;
  margin-left: 15px;
}

button.clear-button {
  float: left !important;
  margin-left: 10px;
}

button.excel-button {
  float: right !important;
  margin-left: 10px;
  margin-right: 22px !important;
}

button.pdf-button {
  float: right !important;
}

/*END GRID BUTTONS*/
/*GLOBAL FORM INPUT*/
/*.k-form input:not(.k-checkbox):not(.k-radio), .k-form .k-widget:not(.k-calendar):not(.k-switch) {
    display: block;
    height: 40px;
  }

  .k-dropdown .k-dropdown-wrap, .k-dropdowntree .k-dropdown-wrap {
    padding: 5px 0;
  }*/
/*END GLOBAL FORM INPUT*/
/*#region Copied from CONNECT CODE. Eventually I believe this needs to be refactored to create consistent responsive ui*/
/*#region GLOBAL GRIDS*/
/*Not using below css for tabs*/
/*.k-tabstrip-items {
  border-color: rgba(0, 0, 0, 0.08);
  color: #656565;
  background: #1b364e;
}

.k-tabstrip-items .k-item {
  color: #fff;
}

.k-tabstrip-items .k-item:hover,
.k-tabstrip-items .k-item.k-state-hover {
  color: #bedbf4 !important;
}

.k-tabstrip-items .k-item.k-state-active,
.k-tabstrip-items .k-item.k-state-selected {
  border-color: rgba(0, 0, 0, 0.08);
  color: #1b364e !important;
  background-color: #fff;
  font-weight: bold;
}*/
.k-textbox-container,
.k-floating-label-container {
  padding-top: 0 !important;
}

.k-floating-label-container {
  display: inline-block !important;
  width: 30% !important;
}

.k-grid-header .k-grid-filter.k-state-active,
.k-grid-header .k-header-column-menu.k-state-active,
.k-grid-header .k-hierarchy-cell .k-icon.k-state-active {
  background: #1b364e;
  color: #fff;
}

.accent.k-dropdown .k-dropdown-wrap .k-input {
  background: #1b364e;
  color: #fff;
}

.current-location.accent.k-dropdown .k-dropdown-wrap .k-select,
.k-dropdowntree .k-dropdown-wrap .k-select {
  background: #1b364e;
  color: #fff;
}

.k-list > .k-state-focused.k-state-selected,
.k-listview > .k-state-focused.k-state-selected,
.k-state-focused.k-state-selected,
td.k-state-focused.k-state-selected {
  background: #1b364e !important;
  color: #fff;
}

/*#endregion END GLOBAL GRIDS*/
/*#region GLOBAL FORMS*/
.k-checkbox,
.k-textbox,
.k-multiselect,
.k-textarea {
  border: 1px solid #c1c1c1;
  width: 100%;
}

.k-checkbox:checked {
  background: #377dbb !important;
  border: #1b364e !important;
}

.k-checkbox:checked:focus {
  border-color: #ff6358;
  box-shadow: none !important;
}

.k-grid-header .k-i-sort-asc-sm,
.k-grid-header .k-i-sort-desc-sm,
.k-grid-header .k-sort-order {
  color: #fff;
  background: #377dbb;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  padding: 2.5px;
}

/*#endregion END GLOBAL FORMS*/
/*#region GLOBAL KENDO PANEL*/
.k-panelbar > .k-item > .k-link {
  background: #c6c6c6 !important;
  color: #1b364e !important;
}

.k-panelbar > .k-item > .k-link:hover,
.k-panelbar > .k-item > .k-link.k-state-hover {
  color: #1b364e;
  background-color: #ebebeb !important;
  cursor: pointer;
}

span.k-link.k-header {
  padding-left: 40px !important;
  font-size: 14px !important;
  text-transform: uppercase !important;
  font-weight: normal !important;
}

.k-panelbar > .k-item > .k-link {
  padding-left: 40px !important;
  font-size: 14px !important;
  text-transform: uppercase !important;
  font-weight: normal !important;
}

.k-panelbar > .k-item > .k-link.k-state-selected {
  color: #fff !important;
  background-color: #2d506f !important;
}

.k-tabstrip > .k-content {
  padding: 20px;
}

.k-panelbar > .k-item > .k-link.k-state-selected:hover,
.k-panelbar > .k-item > .k-link.k-state-selected.k-state-hover {
  background: #377dbb;
}

/*#endregion END GLOBAL KENDO PANEL*/
.k-floating-label-container > .k-label,
.k-floating-label-container.k-state-focused > .k-label {
  transform: translate(-8px, -6px) translate(-1px, -1.0714285714em) translate(-12.5%, -9.375%) scale(0.75);
}

/*.homeIcons {
  width: 82% !important;
  margin-bottom: 10px !important;
  margin-left: 20px !important;
}*/
/*#endregion GLOBAL FORMS*/
/************************************END GLOBAL STYLES*****************************/
/************************************END GLOBAL STYLES*****************************/
/************************************END GLOBAL STYLES*****************************/
/************************************BOXES ONLY**********************************/
@media only screen and (max-width: 1050px) {
  /*.header-container {
    margin-bottom: 0px !important;
  }*/
  body #menuBtn.p-button.p-button-icon-only {
    background-color: transparent !important;
    color: #212121 !important;
  }
  .shopping-cart .k-i-shopping-cart {
    float: right !important;
    font-size: 26px !important;
  }
  .countOfCartItems {
    left: 30px !important;
    float: right !important;
  }
  .search-icon-container {
    padding: 0px 0px 0px 6px !important;
    width: 30px;
  }
  span.k-icon.k-i-user {
    /* vertical-align: top !important;*/
    font-size: 22px !important;
  }
  .quoteItemsCls .k-grid-footer {
    height: 40px !important;
  }
  .cartMainGridCls .k-grid-footer {
    height: auto !important;
  }
  .orderInquiryDetailsGridCls .k-grid-footer {
    height: 40px !important;
  }
  .checkOutReviewGridCls .k-grid-footer {
    height: auto !important;
  }
  /*.post-indicator-text-sm {
    position: inherit !important;
  }*/
  div.logo img {
    width: 230px;
  }
  .date-range-filter {
    margin-left: 0px;
  }
  /*.date-range-filter .k-input {
    height: calc(1.4285714286em + 10px);
  }*/
  .date-range-filter .k-button {
    width: calc(1.4285714286em + 15px);
    height: calc(1.4285714286em + 15px);
  }
  /*.k-calendar {
    font-size: 5px;
  }*/
  .hideInResponsive {
    display: none !important;
  }
  .homeIconsContainer {
    margin-top: 50px;
  }
  ul.account-list-items {
    /* margin: -9.8em 0 0 17em;
      padding: 0px;*/
    float: right !important;
    padding-left: 0px;
  }
  .greeting {
    padding: 15px 0;
    width: 100% !important;
    float: right !important;
    margin: -12.5em 0 0 0;
    text-align: right !important;
  }
  .k-tabstrip > .k-content {
    padding: 10px;
  }
  .k-grid {
    font-size: 12px;
  }
  .k-grid .k-button {
    font-size: 10px;
  }
  .k-grid-toolbar {
    flex-flow: row !important;
  }
  .kdQuoteGridCls .k-grid-toolbar {
    flex-flow: row wrap !important;
  }
  .pwaAddressGrid .k-grid-toolbar {
    flex-flow: row wrap !important;
  }
  html .k-grid tr:hover {
    background: transparent;
  }
  html .k-grid tr {
    background: transparent;
  }
  html .k-grid tr.k-alt:hover {
    background: #f1f1f1;
  }
  .cartMainGridCls td {
    padding-left: 8px;
    padding-right: 8px;
  }
  .advanceMainGridCls td {
    padding-left: 8px;
    padding-right: 0px;
  }
  html #extendedPrice div.k-expander-header {
    padding-left: 0px;
    box-shadow: none;
    justify-content: left;
  }
  html #extendedPrice div.k-expander-header:hover {
    background-color: transparent;
    border: none;
  }
  html #extendedPrice div.k-state-focused {
    box-shadow: none;
  }
  html #extendedPrice .k-expander.k-state-focus {
    box-shadow: none;
  }
  html #extendedPrice div.k-expander-content {
    padding: 0px;
  }
  .k-popup {
    font-size: 10px;
  }
  .k-grid-filter {
    display: none !important;
  }
  .carousel-control-prev, .carousel-control-next {
    width: 10%;
  }
  .k-filter-row {
    display: none !important;
  }
  .sign-in-container {
    width: 65% !important;
    top: 55px !important;
  }
  .carousel-indicators {
    bottom: -20px !important;
  }
}
@media screen and (-webkit-min-device-pixel-ratio: 0) and (max-device-width: 1024px) {
  select,
  textarea,
  input {
    font-size: 16px !important;
  }
}
@media only screen and (min-width: 576px) and (max-width: 1050px) {
  .box-container.col-sm-4 {
    padding: 0px 5px !important;
  }
  .imagebox .imagebox-desc {
    background-color: rgba(0, 0, 0, 0.6);
    top: 0px;
    color: white;
    font-size: 16px !important;
    left: 0px;
    padding: 10px 15px;
    position: absolute;
    text-align: center;
    width: 100%;
    /*height: -webkit-fill-available !important;*/ /*commented this line of code to show image in ipad view*/
  }
  .row {
    margin-left: 0px !important;
  }
  .passwordChange .k-dialog {
    width: 60% !important;
  }
  .dialogSection .k-dialog {
    width: 61%;
  }
  .k-grid .k-button {
    font-size: 12px !important;
  }
}
@media only screen and (max-width: 370px) {
  .cartMainGridCls .k-button {
    gap: 1px;
    padding: 6px 10px;
  }
  .cartMainGridCls .k-toolbar {
    padding-left: 5px;
    padding-right: 5px;
  }
  div.logo img {
    width: 190px !important;
  }
}
/*********************************END BOXES ONLY**********************************/
/*************************************MOBILE and IPAD/*****************************/
/*************************************MOBILE and IPAD/*****************************/
/*************************************MOBILE and IPAD/*****************************/
@media only screen and (min-width: 320px) and (max-width: 991px) {
  iframe {
    right: 15px !important;
    bottom: 4px !important;
  }
  .homeIcons {
    width: 50% !important;
    margin: 0px 0px 10px 0px !important;
  }
  .arrow {
    opacity: 0;
    position: fixed;
    bottom: 5rem;
    left: 80% !important;
    width: 45px !important;
    height: 42px !important;
  }
  .dialogSection .k-dialog {
    width: 61%;
  }
  /*to show login popup properly in responsive*/
  /* .sign-in-container {
    width: 65% !important;
    top: 100px !important;
  }*/
  .header-container {
    padding: 0 15px 10px;
    display: flex;
  }
  /*.view-container{

    }*/
  .app-search-in-header-container {
    width: 100%;
  }
  .row {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  /*KANWEER THE BUILDER LOADER*/
  #animateKanweer {
    position: relative;
    z-index: 4;
    left: -10px !important;
    top: -156px !important;
    width: 400px !important;
  }
  #logo {
    width: 490px !important;
    position: absolute;
    z-index: 3;
    top: -26px !important;
    right: 347px !important;
  }
  .searchCls > .k-searchbar {
    margin-left: -2px !important;
  }
  /*END MOBILE KANWEER THE BUILDER LOADER*/
  /*LOGO*/
  .logo {
    /*padding-top: 15px;*/
    /*width: 100%; //to align logo on bottom of menu toggle in mobile view*/
  }
  /*END MOBILE LOGO*/
  /*MOBILE MAIN MENU*/
  .mainMenu {
    margin: -1.5em 0 0 0;
  }
  .mainMenu .p-button {
    margin-top: 44px;
    background: #212121 !important;
    width: 3em !important;
    height: 3em !important;
  }
  button .pi-bars {
    font-size: 26px !important;
  }
  body .p-slidemenu .p-menuitem.p-menuitem-active > .p-menuitem-link .p-menuitem-icon,
  body .p-slidemenu .p-menuitem.p-menuitem-active > .p-menuitem-link .p-submenu-icon {
    color: #f13c30 !important;
  }
  .p-button-icon-only .p-button-icon-left {
    font-size: 27px;
  }
  body #menuBtn.p-button {
    background: #666677 !important;
    margin-left: 0px !important;
    border: none !important;
  }
  body #menuBtn.p-button:enabled:hover {
    background: #ee3322 !important;
  }
  body #menuBtn.p-button.p-button-icon-only {
    width: 3em !important;
    height: 3em !important;
    border-radius: 3px !important;
    -moz-border-radius: 3px !important;
    -webkit-border-radius: 3px !important;
  }
  .p-slidemenu-wrapper,
  .p-slidemenu-content {
    min-height: 90vh;
  }
  .p-slidemenu.p-slidemenu-dynamic {
    left: 0 !important;
    /*width: 100%;
    height: 300px;*/
    top: 50px !important;
    background: #666677;
    z-index: 5 !important;
    border: none;
  }
  body .p-menu .p-menuitem-link,
  body .p-menubar .p-menuitem-link,
  body .p-tieredmenu .p-menuitem-link,
  body .p-contextmenu .p-menuitem-link,
  body .p-megamenu .p-menuitem-link,
  body .p-slidemenu .p-menuitem-link {
    background: #666677 !important;
    padding: 15px !important;
    text-transform: uppercase;
  }
  body .p-menu:hover .p-menuitem-link:hover,
  body .p-menubar:hover .p-menuitem-link:hover,
  body .p-tieredmenu:hover .p-menuitem-link:hover,
  body .p-contextmenu:hover .p-menuitem-link:hover,
  body .p-megamenu:hover .p-menuitem-link:hover,
  body .p-slidemenu:hover .p-menuitem-link:hover {
    background: #7a7a8c !important;
  }
  body .p-menu .p-menuitem-link .p-menuitem-text,
  body .p-menubar .p-menuitem-link .p-menuitem-text,
  body .p-tieredmenu .p-menuitem-link .p-menuitem-text,
  body .p-contextmenu .p-menuitem-link .p-menuitem-text,
  body .p-megamenu .p-menuitem-link .p-menuitem-text,
  body .p-slidemenu .p-menuitem-link .p-menuitem-text {
    color: #fff !important;
  }
  .p-slidemenu .p-slidemenu-rootlist {
    width: 100% !important;
  }
  .p-slidemenu .p-menuitem-active > .p-submenu > .p-submenu-list {
    width: 100% !important;
  }
  body .p-menu .p-menuitem-link .p-menuitem-icon,
  body .p-menubar .p-menuitem-link .p-menuitem-icon,
  body .p-tieredmenu .p-menuitem-link .p-menuitem-icon,
  body .p-contextmenu .p-menuitem-link .p-menuitem-icon,
  body .p-megamenu .p-menuitem-link .p-menuitem-icon,
  body .p-slidemenu .p-menuitem-link .p-menuitem-icon {
    color: #fff !important;
    float: right;
  }
  .p-slidemenu .p-menuitem-link .p-submenu-icon {
    color: #fff;
  }
  body .p-corner-all {
    border-radius: 0 !important;
  }
  .p-slidemenu .p-submenu-list {
    top: -20px !important;
  }
  .login-menu {
    position: absolute;
    top: 0;
    left: 0px;
    z-index: 999;
    background: #fff;
    padding: 10px 15px 10px 13px;
    border-right: 1px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 50px;
  }
  .user-icon {
    background-color: #000;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 24px;
    width: 24px;
    border-radius: 50%;
  }
  span.user {
    text-align: left !important;
    position: absolute;
    left: 50px;
  }
  .login-menu {
    overflow: hidden;
    white-space: nowrap;
  }
  .login-menu .k-icon.k-i-user {
    font-size: 20px !important;
    margin-right: 0px;
  }
  /*END MOBILE MAIN MENU*/
  /*MOBILE HEADER*/
  .headerSpacer {
    display: none;
  }
  span.k-icon.k-i-user {
    font-size: 18px;
    color: #fff;
  }
  /*MOBILE HEADER SEARCH*/
  .search-category-container {
    width: 100% !important;
  }
  /* .search-category-container .k-combobox .k-dropdown-wrap .k-clear-value {
      top: 10px;
      right: 35px;
      font-size: 20px;
    }*/
  /*.search-item-container .k-autocomplete .k-clear-value {
      top: 10px;
      right: 5px;
      font-size: 20px;
    }*/
  .search-category-container .k-combobox,
  .search-item-container .k-autocomplete {
    width: 100%;
    padding: 0;
    height: 30px;
    margin: 10px 0;
  }
  .search-item-container,
  .search-item-and-icon-container {
    width: 100%;
  }
  .search-item-container .k-searchbar {
    width: 100% !important;
  }
  .search-icon-container .k-select,
  .k-combobox .k-select {
    background: #f4f4f4;
  }
  /* span.k-icon.k-i-search {
      position: relative;
      left: -4px;
    }*/
  .search-icon-container {
    margin-top: 10px;
    background: #f4f4f4;
    padding: 6px 0px 2px 11px;
    height: 30px;
  }
  .search-advanced-container {
    width: 100%;
    height: 0px;
  }
  body .p-button.p-button-icon-only {
    width: 3.357em !important;
    height: 3.357em !important;
    background: #666677 !important;
  }
  body .p-button:enabled:active {
    background: #666677 !important;
    border: none !important;
    outline: none !important;
  }
  body .p-button {
    border: none !important;
  }
  .account-container {
    width: 100%;
    float: right;
    margin-top: 20px;
  }
  .greeting-container {
    width: 100%;
  }
  .search-advanced-container button.k-button {
    background: #666677 !important;
    color: #fff !important;
    padding: 12px 15px;
    height: 30px;
  }
  /*  .greeting {
    padding: 15px 0;
    width: 100%;
    float: right;
    margin: -12.5em 0 0 0;
    text-align: right;
  }*/
  .signOut {
    width: 19%;
    float: right;
    margin-top: 15px;
    text-align: right;
  }
  .account-list-items-pwa {
    margin-top: -11.5em;
  }
  .account-list-items li {
    list-style: none;
    display: inline;
  }
  .account-list-items .k-icon {
    font-size: 18px;
  }
  .language-content ul {
    padding: 12px !important;
  }
  .language-content li {
    display: block;
    padding: 5px 0;
  }
  .build_and_buy img {
    width: 100%;
  }
  /*MOBILE MANAGE MENU*/
  /*MOBILE ACCOUNT MENU*/
  #profile-menu.k-animation-container-shown,
  #profile-menu.k-animation-container > .k-popup {
    width: 100%;
    background: #666677 !important;
    min-height: 27vh !important;
  }
  .profile-container {
    top: -11px !important;
  }
  .profile-menu-header {
    padding: 10px !important;
  }
  .manage-company-panelbar-wrapper {
    max-width: 100% !important;
  }
  .row .export-buttons {
    display: block;
  }
  .k-grid {
    background: #f6f6f6;
  }
  .export-buttons {
    width: 50%;
  }
  .export-buttons button.k-button {
    width: 100%;
    margin-bottom: 10px;
  }
  button.excel-button {
    float: none !important;
  }
  button.pdf-button {
    float: none !important;
    margin-left: 10px;
  }
  button.add-new-quote-button {
    float: none !important;
    margin-left: 10px;
  }
  .search-box {
    text-align: left;
    display: block;
    font-size: 20px;
  }
  /*END MOBILE MANAGE MENU*/
  .countOfCartItems {
    background: #ee3322;
    color: #fff;
    border-radius: 50%;
    position: relative;
    font-size: 13px;
    width: 20px;
    height: 20px;
    display: inline-block;
    text-align: center;
    left: -15px;
    top: -11px;
  }
  .signIn-content {
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
  }
  .signIn-content .k-button {
    width: auto;
    font-size: 16px;
  }
  .signIn-content .k-form p a {
    color: #fff;
  }
  .sign-in-container {
    top: 150px;
  }
  .signIn-content p,
  .signIn-content a {
    font-size: 16px;
  }
  .signIn-content p:hover,
  .signIn-content a:hover {
    text-decoration: underline;
    cursor: pointer;
  }
  .signin-form {
    width: 250px;
  }
  .k-form .k-form-field > input {
    height: 40px;
    border-radius: 4px;
  }
  #loginSuccess {
    background: #79b379;
    color: #fff;
    font-size: 20px;
    top: -158px;
    left: -20px;
    position: relative;
    padding: 15px;
    border-radius: 10px;
  }
  #loginSuccess p {
    margin: 0;
    padding: 0;
  }
  #logoutSuccess {
    background: #666677;
    color: #fff;
    font-size: 20px;
    top: 37px;
    left: -25px;
    position: relative;
    padding: 15px 15px 15px 20px;
    border-radius: 10px;
  }
  #logoutSuccess p {
    margin: 0;
    padding: 0;
  }
  #loginFail {
    background: #ee3322;
    color: #fff;
    font-size: 20px;
    top: 37px;
    left: -25px;
    position: relative;
    padding: 15px 15px 15px 20px;
    border-radius: 10px;
  }
  #loginFail p {
    margin: 0;
    padding: 0;
  }
  /*MOBILE PAGES*/
  .pageTitle.col {
    margin: 0;
    padding: 0;
  }
  .pageTitle h2 {
    padding: 0;
    margin-bottom: 15px;
  }
  .view-container {
    margin-bottom: 200px;
    padding: 0 15px;
  }
  /*  .homeIconsContainer {
    margin-top: 100px;
  }*/
  .homeIcons img {
    width: 100%;
    margin-bottom: 10px;
  }
  /*END MOBILE PAGES*/
  /***FORMS***/
  .k-textbox-container,
  .k-floating-label-container {
    margin-top: 20px;
  }
  .k-form {
    padding: 15px;
  }
  .k-form-inline {
    padding: 0;
  }
  /*MOBILE KENDO CHECKBOXES*/
  .k-checkbox:checked {
    border-color: #ee3322;
    color: #fff;
    background-color: #ee3322;
  }
  .k-checkbox {
    height: 25px !important;
    width: 25px;
  }
  .k-checkbox-label {
    margin-bottom: 0 !important;
  }
  /*END MOBILE KENDO CHECKBOXES*/
  /*KENDO DROPDOWNS*/
  .k-textbox-container,
  .k-floating-label-container {
    width: 100%;
  }
  /*END KENDO DROPDOWNS*/
  /****END FORMS****/
  /*MOBILE factory-quote-request*/
  .confirmation p {
    margin: 15px 0;
  }
  /*MOBILE PAGE NOT FOUND*/
  .pageNotFoundImage img {
    width: 100%;
  }
  /*END MOBILE PAGE NOT FOUND*/
  /*MOBILE HOW TO ARROW*/
  iframe {
    right: 15px !important;
    bottom: 4px !important;
  }
  .arrow {
    opacity: 0;
    position: fixed;
    bottom: 5rem;
    left: 80% !important;
    width: 45px !important;
    height: 42px !important;
  }
  /*END MOBILE HOW TO ARROW*/
  /*MOBILE BOXES*/
  .box-container {
    margin-bottom: 0px;
  }
  .imagebox .imagebox-desc {
    background-color: rgba(0, 0, 0, 0.6);
    top: 0px;
    color: white;
    font-size: 16px;
    left: 0px;
    padding: 10px 15px;
    position: absolute;
    text-align: center;
    width: 100%;
    height: 54px;
  }
  /*END MOBILE BOXES*/
  .footer {
    grid-row-start: 2;
    grid-row-end: 3;
    position: relative !important;
    bottom: 10px;
    width: 100%;
  }
  /*Responsive for advance search page tiles layout----Start*/
  .mainCartView {
    flex: 0 0 100%;
    max-width: 100%;
  }
  /* .categoryFinishCls {
      flex: 0 0 100%;
      max-width: 100%;
    }*/
  .img-box {
    width: 63% !important;
    padding: 7px !important;
    margin-left: 64px !important;
    height: 135px !important;
  }
}
/*END MOBILE DEVICE SMALL*/
/*************************************MOBILE DEVICE IPAD PRO************************************/
/*************************************MOBILE DEVICE IPAD PRO************************************/
/*************************************MOBILE DEVICE IPAD PRO************************************/
@media only screen and (min-width: 991px) and (max-width: 1366px) {
  .search-category-container {
    margin-right: 35px !important;
    border: 1px solid #e0e0e0 !important;
    height: 30px;
    width: 23%;
  }
  .search-item-and-icon-container {
    width: 30%;
    margin-right: 40px !important;
  }
  .search-advanced-container {
    margin-left: -2em;
  }
  .account-container {
    position: absolute !important;
    right: 24px !important;
  }
  .signOut {
    float: left;
    margin: 0 -1.3em 0 -2.5em;
  }
  /*KANWEER THE BUILDER LOADER*/
  #animateKanweer {
    position: relative;
    z-index: 4;
    left: 62px !important;
    top: -81px !important;
    width: 650px !important;
  }
  /*MOBILE MAIN MENU*/
  /*KANWEER THE BUILDER LOADER*/
  #animateKanweer {
    position: relative;
    z-index: 4;
    left: -10px !important;
    top: -156px !important;
    width: 400px !important;
  }
  /*MOBILE MAIN MENU*/
  button .pi-bars {
    font-size: 26px !important;
  }
  body .p-slidemenu .p-menuitem.p-menuitem-active > .p-menuitem-link .p-menuitem-icon, body .p-slidemenu .p-menuitem.p-menuitem-active > .p-menuitem-link .p-submenu-icon {
    color: #f13c30 !important;
  }
  .p-button-icon-only .p-button-icon-left {
    font-size: 27px;
  }
  body #menuBtn.p-button {
    background: #666677 !important;
    margin-left: 0px !important;
    border: none !important;
  }
  body #menuBtn.p-button:enabled:hover {
    background: #ee3322 !important;
  }
  body #menuBtn.p-button.p-button-icon-only {
    width: 3em !important;
    height: 3em !important;
    border-radius: 3px !important;
    -moz-border-radius: 3px !important;
    -webkit-border-radius: 3px !important;
  }
  .p-slidemenu-wrapper,
  .p-slidemenu-content {
    min-height: 90vh;
  }
  .p-slidemenu.p-slidemenu-dynamic {
    left: 0 !important;
    top: 50px !important;
    background: #666677;
    z-index: 5 !important;
    border: none;
  }
  body .p-menu .p-menuitem-link,
  body .p-menubar .p-menuitem-link,
  body .p-tieredmenu .p-menuitem-link,
  body .p-contextmenu .p-menuitem-link,
  body .p-megamenu .p-menuitem-link,
  body .p-slidemenu .p-menuitem-link {
    background: #666677 !important;
    padding: 15px !important;
    text-transform: uppercase;
  }
  body .p-menu:hover .p-menuitem-link:hover,
  body .p-menubar:hover .p-menuitem-link:hover,
  body .p-tieredmenu:hover .p-menuitem-link:hover,
  body .p-contextmenu:hover .p-menuitem-link:hover,
  body .p-megamenu:hover .p-menuitem-link:hover,
  body .p-slidemenu:hover .p-menuitem-link:hover {
    background: #7a7a8c !important;
  }
  body .p-menu .p-menuitem-link .p-menuitem-text,
  body .p-menubar .p-menuitem-link .p-menuitem-text,
  body .p-tieredmenu .p-menuitem-link .p-menuitem-text,
  body .p-contextmenu .p-menuitem-link .p-menuitem-text,
  body .p-megamenu .p-menuitem-link .p-menuitem-text,
  body .p-slidemenu .p-menuitem-link .p-menuitem-text {
    color: #fff !important;
  }
  .p-slidemenu .p-slidemenu-rootlist {
    width: 100% !important;
  }
  .p-slidemenu .p-menuitem-active > .p-submenu > .p-submenu-list {
    width: 100% !important;
  }
  body .p-menu .p-menuitem-link .p-menuitem-icon,
  body .p-menubar .p-menuitem-link .p-menuitem-icon,
  body .p-tieredmenu .p-menuitem-link .p-menuitem-icon,
  body .p-contextmenu .p-menuitem-link .p-menuitem-icon,
  body .p-megamenu .p-menuitem-link .p-menuitem-icon,
  body .p-slidemenu .p-menuitem-link .p-menuitem-icon {
    color: #fff !important;
    float: right;
  }
  .p-slidemenu .p-menuitem-link .p-submenu-icon {
    color: #fff;
  }
  body .p-corner-all {
    border-radius: 0 !important;
  }
  .p-slidemenu .p-submenu-list {
    top: -20px !important;
  }
  .login-menu {
    position: absolute;
    top: 0;
    left: 0px;
    z-index: 999;
    background: #fff;
    padding: 10px 15px 10px 13px;
    border-right: 1px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 50px;
  }
  .user-icon {
    background-color: #000;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 24px;
    width: 24px;
    border-radius: 50%;
  }
  span.user {
    text-align: left !important;
    position: absolute;
    left: 50px;
  }
  .login-menu {
    width: 22.8rem !important;
    overflow: hidden;
    white-space: nowrap;
  }
  .login-menu .k-icon.k-i-user {
    font-size: 20px !important;
    margin-right: 0px;
  }
  /*END MOBILE MAIN MENU*/
  /*MOBILE HEADER*/
  .headerSpacer {
    display: none;
  }
  span.k-icon.k-i-user {
    font-size: 18px;
    color: #fff;
  }
  body .p-button.p-button-icon-only {
    width: 3.357em !important;
    height: 3.357em !important;
    background: #666677 !important;
  }
  body .p-button:enabled:active {
    background: #666677 !important;
    border: none !important;
    outline: none !important;
  }
  body .p-button {
    border: none !important;
  }
  .language-content ul {
    padding: 12px !important;
  }
  .language-content li {
    display: block;
    padding: 5px 0;
  }
  .build_and_buy img {
    width: 50%;
  }
  .profile-content {
    height: 249px;
  }
  /*.profile-container {
    left: 0 !important;
    top: 0 !important;
    width: 100%;
  }*/
  .profile-container.k-popup ul {
    background: #666677;
    color: #fff;
    padding: 0;
  }
  .profile-container li {
    padding: 15px;
    display: block;
    background: #666677;
    color: #fff;
  }
  .profile-container li:hover {
    background: #7a7a8c;
  }
  .profile-menu-header {
    padding: 15px;
  }
  .profile-menu-list-items {
    padding: 0px;
  }
  li.manageCompany {
    padding: 0 !important;
  }
  .manageCompany.k-panelbar > .k-item > .k-link {
    background: #4d4d5e;
    font-weight: normal;
    color: #fff;
    cursor: pointer;
    text-transform: initial !important;
    padding: 15px;
  }
  .manageCompany.k-panelbar > .k-item > .k-link:hover {
    background: #7a7a8c !important;
  }
  .manageCompany.k-panelbar > .k-item > .k-link.k-state-selected:hover {
    background: #4d4d5e !important;
  }
  .manageCompany.k-panelbar > .k-item > .k-link.k-state-selected {
    background: #4d4d5e !important;
    font-size: 16px !important;
    color: #fff !important;
    cursor: pointer !important;
  }
  .manageCompany.k-panelbar {
    border: none;
  }
  .manageCompany.k-panelbar > .manageCompany.k-item > .manageCompany.k-link,
  .manageCompany.k-panelbar > .manageCompany.k-item > .manageCompany.k-link {
    text-transform: uppercase;
  }
  .manageCompany.k-panelbar > .k-item > .k-link .k-icon {
    color: #fff;
    margin-right: 10px;
  }
  .manageCompanyLinks {
    background: #666677;
  }
  .manageCompanyLinks .link {
    padding: 15px;
    color: #fff;
  }
  .manageCompanyLinks .link:hover {
    background: #7a7a8c !important;
  }
  .countOfCartItems {
    background: #ee3322;
    color: #fff;
    border-radius: 50%;
    position: relative;
    font-size: 13px;
    width: 20px;
    height: 20px;
    display: inline-block;
    text-align: center;
    left: -15px;
    top: -11px;
  }
  .signIn-content {
    /*background: #666677;*/
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
  }
  /*.signIn-content .k-form .k-form-field {
    color: #fff;
  }*/
  .signIn-content .k-button {
    width: auto;
    font-size: 16px;
  }
  .sign-in-container {
    /*width: 34%;*/
    top: 161px !important;
  }
  .signIn-content p,
  .signIn-content a {
    font-size: 16px;
  }
  .signIn-content p:hover,
  .signIn-content a:hover {
    /*color: #fff;*/
    text-decoration: underline;
    cursor: pointer;
  }
  .signin-form {
    width: 650px;
  }
  .k-form .k-form-field > input {
    height: 40px;
    border-radius: 4px;
  }
  #loginSuccess {
    background: #79b379;
    color: #fff;
    font-size: 20px;
    top: -158px;
    left: -20px;
    position: relative;
    padding: 15px;
    border-radius: 10px;
  }
  #loginSuccess p {
    margin: 0;
    padding: 0;
  }
  #logoutSuccess {
    background: #666677;
    color: #fff;
    font-size: 20px;
    top: 37px;
    left: -25px;
    position: relative;
    padding: 15px 15px 15px 20px;
    border-radius: 10px;
  }
  #logoutSuccess p {
    margin: 0;
    padding: 0;
  }
  #loginFail {
    background: #ee3322;
    color: #fff;
    font-size: 20px;
    top: 37px;
    left: -25px;
    position: relative;
    padding: 15px 15px 15px 20px;
    border-radius: 10px;
  }
  #loginFail p {
    margin: 0;
    padding: 0;
  }
  /*MOBILE PAGES*/
  .pageTitle.col {
    margin: 0;
    padding: 0;
  }
  .pageTitle h2 {
    padding: 0;
    margin-bottom: 15px;
  }
  .view-container {
    margin-bottom: 200px;
    padding: 0 15px;
  }
  .homeIconsContainer {
    margin-top: 100px;
  }
  .homeIcons img {
    width: 100%;
    margin-bottom: 10px;
  }
  /*END MOBILE PAGES*/
  /***FORMS***/
  .k-textbox-container,
  .k-floating-label-container {
    margin-top: 20px;
  }
  /*.k-dropdown .k-dropdown-wrap .k-input,    commented this line of code to align the dropdown content in middle 
      .k-dropdowntree .k-dropdown-wrap .k-input {
        height: calc(17px + 1.4285714286em) !important;
      }*/
  .k-form {
    padding: 15px;
  }
  .k-form-inline {
    padding: 0;
  }
  /*MOBILE KENDO CHECKBOXES*/
  .k-checkbox:checked {
    border-color: #ee3322;
    color: #fff;
    background-color: #ee3322;
  }
  .k-checkbox {
    height: 25px !important;
    width: 25px;
  }
  .k-checkbox-label {
    margin-bottom: 0 !important;
  }
  /*END MOBILE KENDO CHECKBOXES*/
  /*KENDO DROPDOWNS*/
  .k-textbox-container,
  .k-floating-label-container {
    width: 100%;
  }
  /*END KENDO DROPDOWNS*/
  /****END FORMS****/
  /*MOBILE factory-quote-request*/
  .confirmation p {
    margin: 15px 0;
  }
  /*MOBILE PAGE NOT FOUND*/
  .pageNotFoundImage img {
    width: 100%;
  }
  /*END MOBILE PAGE NOT FOUND*/
  /*MOBILE HOW TO ARROW*/
  iframe {
    right: 15px !important;
    bottom: 4px !important;
  }
  .arrow {
    opacity: 0;
    position: fixed;
    bottom: 5rem;
    left: 80% !important;
    width: 45px !important;
    height: 42px !important;
  }
  /*END MOBILE HOW TO ARROW*/
  /*GRID BUTTONS*/
  .row.export-buttons {
    display: block !important;
  }
  .export-buttons button.k-button {
    width: 15%;
    margin-bottom: 10px;
    float: left;
  }
  button.clear-button {
    float: left !important;
    margin-left: 10px;
  }
  button.excel-button {
    float: right !important;
    margin-left: 10px;
  }
  button.pdf-button {
    float: right !important;
  }
  /*END GRID BUTTONS*/
  /*GRID*/
  .k-grid {
    background: #f6f6f6;
  }
  /*MOBILE BOXES*/
  .imagebox .imagebox-desc {
    background-color: rgba(0, 0, 0, 0.6);
    top: 0px;
    color: white;
    font-size: 16px;
    left: 0px;
    padding: 10px 15px;
    position: absolute;
    text-align: center;
    width: 100%;
  }
  /*END MOBILE BOXES*/
  .footer {
    grid-row-start: 2;
    grid-row-end: 3;
    position: relative;
    bottom: 10px;
    width: 100%;
  }
}
/*********************************END MOBILE DEVICE IPAD PRO************************************/
/*********************************END MOBILE DEVICE IPAD PRO************************************/
/*********************************END MOBILE DEVICE IPAD PRO************************************/
@media only screen and (min-width: 1366px) and (max-width: 1525px) {
  /*MOBILE LARGE HEADER*/
  /*END MOBILE LARGE SEARCH*/
  ul.account-list-items {
    margin-left: -15px;
    padding: 0;
  }
  .account-container {
    position: absolute !important;
    right: 5% !important;
  }
  .account-list-items li {
    display: inline;
  }
  .greeting-container {
    width: 100%;
  }
  .greeting {
    font-size: 20px;
    float: left;
    margin-right: 20px;
  }
  .signOut {
    float: left;
    margin: 0px;
  }
  .countOfCartItems {
    background: #ee3322;
    color: #fff;
    border-radius: 50%;
    position: relative;
    font-size: 13px;
    width: 20px;
    height: 20px;
    display: inline-block;
    text-align: center;
    left: -10px;
    top: -10px;
  }
  /**END MOBILE LARGE ACCOUNT MENU*/
  /*END MOBILE LARGE HEADER*/
  .export-buttons button.k-button {
    width: 10%;
    margin-bottom: 10px;
    float: left;
  }
  button.clear-button {
    float: left !important;
    margin-left: 10px;
  }
  button.excel-button {
    float: right !important;
    margin-left: 10px;
    margin-right: 22px !important;
  }
  button.pdf-button {
    float: right !important;
  }
  .bodyWrapper {
    margin-bottom: 80px;
  }
  .homeIconsContainer {
    margin: 40px 0 !important;
  }
  .homeIcons {
    padding-left: 0 !important;
  }
  .homeIcons img {
    width: 100% !important;
  }
  .homeIcons img {
    width: 100%;
    margin-bottom: 10px;
  }
  /*GRID*/
  .k-grid {
    background: #f6f6f6;
  }
  .footer {
    grid-row-start: 2 !important;
    grid-row-end: 3 !important;
    position: relative !important;
    bottom: 0 !important;
    width: 100% !important;
    margin-top: 80px;
  }
  .search-category-container {
    margin-right: 35px !important;
    border: 1px solid #e0e0e0 !important;
    height: 31px;
    width: 27%;
  }
  .search-item-and-icon-container {
    width: 35%;
    margin-right: 40px !important;
  }
  .search-advanced-container {
    margin-left: 0px;
  }
  .account-container {
    position: absolute !important;
    right: 60px !important;
  }
  .signOut {
    float: left;
    margin: 0px;
  }
}
@media only screen and (min-width: 991px) and (max-width: 2400px) {
  .header-search-component.row {
    padding-right: 0 !important;
    margin-right: 0 !important;
  }
  .header-container {
    background: #fff;
    border-bottom: 1px;
    box-shadow: 2px 0 14px -4px rgb(219, 219, 219);
    align-items: center;
    margin-bottom: 13px;
    display: flex;
    margin-left: -15px;
  }
  .body {
    font-size: 14px;
  }
  .logo {
    padding-right: 15px;
  }
  .searchCls > .k-searchbar {
    margin-left: -15px !important;
  }
  /*MOBILE LARGE SEARCH*/
  .app-search-in-header-container {
    width: 51%;
  }
  .search-category-container .k-combobox {
    width: 100% !important;
  }
  /* .search-category-container {
    margin-right: 35px !important;
    border: 1px solid#e0e0e0 !important;
    height: 31px;
    width: 27%;
  }*/
  .mainMenu {
    margin: 0px 10px 0 32px;
  }
  .mainMenu .p-button {
    width: 3em !important;
    height: 3em !important;
    background: #666677 !important;
    border: none !important;
  }
  /*.search-item-and-icon-container {
    width: 35%;
    margin-right: 40px !important;
  }*/
  .search-icon-container {
    background: #f6f6f6;
    padding: 2px 5px;
    border-top: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
  }
  .search-advanced-container .k-button {
    margin-top: 0 !important;
    padding: 8px 15px;
    background: #667 !important;
    color: #fff !important;
    border-radius: 31px !important;
    -moz-border-radius: 31px !important;
    -webkit-border-radius: 31px !important;
    border: none;
  }
  /*END MOBILE LARGE SEARCH*/
  /*.account-container {
    position: absolute !important;
    right: 60px !important;
  }*/
  ul.account-list-items {
    margin-left: -18px !important;
    padding: 0;
    margin-top: -13px;
  }
  .account-list-items .k-icon {
    font-size: 25px;
    margin: 0 5px;
  }
  .account-list-items li {
    display: inline;
  }
  .greeting-container {
    width: 100%;
  }
  .greeting {
    font-size: 20px;
    float: left;
    margin-right: 20px;
    width: 165px;
    overflow: hidden;
    white-space: nowrap;
  }
  /*.signOut {
    float: left;
  }*/
  .language-content ul {
    padding: 5px 10px;
  }
  .language-content li {
    display: block;
    padding: 5px 0;
  }
  .countOfCartItems {
    background: #ee3322;
    color: #fff;
    border-radius: 50%;
    position: relative;
    font-size: 13px;
    width: 20px;
    height: 20px;
    display: inline-block;
    text-align: center;
    left: -9px;
    top: -8px;
  }
  .homeIcons {
    margin-top: 100px;
  }
  .homeIcons img {
    width: 100%;
    margin-bottom: 10px;
  }
  footer {
    position: relative !important;
    margin-top: 80px;
  }
  .sign-in-container {
    right: 0px !important;
    top: 55px !important;
  }
  .p-slidemenu-wrapper,
  .p-slidemenu-content {
    min-height: 68vh;
  }
  .p-slidemenu.p-slidemenu-dynamic {
    left: 0 !important;
    /*width: 100%;
    height: 300px;*/
    top: 50px !important;
    background: #666677;
    z-index: 5 !important;
    border: none;
  }
}
@media only screen and (min-width: 1525px) and (max-width: 2400px) {
  .search-category-container {
    margin-right: 35px !important;
    border: 1px solid #e0e0e0 !important;
    height: 31px;
    width: 27%;
  }
  .search-item-and-icon-container {
    width: 35%;
    margin-right: 40px !important;
  }
  .search-advanced-container {
    margin-left: 0px;
  }
  .account-container {
    position: absolute !important;
    right: 60px !important;
  }
  .signOut {
    float: left;
    margin: 0px;
  }
}
@media only screen and (min-width: 2400px) and (max-width: 4000px) {
  .header-search-component.row {
    padding-right: 0 !important;
    margin-right: 0 !important;
  }
  .header-container {
    background: #fff;
    border-bottom: 1px;
    box-shadow: 2px 0 14px -4px rgb(219, 219, 219);
    align-items: center;
    margin-bottom: 40px;
    display: flex;
    margin-left: -15px;
  }
  /*MOBILE LARGE SEARCH*/
  .app-search-in-header-container {
    width: 53%;
  }
  .search-category-container .k-combobox {
    width: 100% !important;
  }
  .search-category-container {
    margin-right: 35px !important;
    border: 1px solid #e0e0e0 !important;
    height: 31px;
    width: 35%;
  }
  .search-item-container {
    border: 1px solid #e0e0e0;
  }
  .search-item-and-icon-container {
    width: 37%;
    margin-right: 40px !important;
  }
  .search-icon-container {
    background: #f6f6f6;
    padding: 2px 5px;
    border-top: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
  }
  .search-advanced-container .k-button {
    margin-top: 0 !important;
    padding: 8px 15px;
    background: #667 !important;
    color: #fff !important;
    border-radius: 31px !important;
    -moz-border-radius: 31px !important;
    -webkit-border-radius: 31px !important;
    border: none;
  }
  /*END MOBILE LARGE SEARCH*/
  .account-container {
    position: absolute !important;
    right: 60px !important;
  }
  ul.account-list-items {
    margin-left: -22px !important;
    padding: 0;
  }
  .account-list-items .k-icon {
    font-size: 20px;
    margin: 0 5px;
  }
  .account-list-items li {
    display: inline;
  }
  .greeting-container {
    width: 100%;
  }
  .greeting {
    font-size: 20px;
    float: left;
    margin-right: 20px;
    width: 165px;
    overflow: hidden;
    white-space: nowrap;
  }
  .signOut {
    float: left;
  }
  .language-content ul {
    padding: 5px 10px;
  }
  .language-content li {
    display: block;
    padding: 5px 0;
  }
  .homeIcons img {
    width: 100%;
    margin-bottom: 10px;
  }
  footer {
    position: relative !important;
    margin-top: 80px;
  }
  .sign-in-container {
    right: 0px !important;
    top: 55px !important;
  }
}
@media screen and (min-width: 941px) {
  .homeIcons {
    flex: 0 0 20% !important;
    max-width: 20% !important;
  }
}
@media screen and (max-width: 1024px) {
  .login-menu {
    width: 352px !important;
  }
  #profile-menu.k-animation-container-shown,
  #profile-menu.k-animation-container > .k-popup {
    width: 87% !important;
    background: #666677 !important;
    min-height: 27vh !important;
  }
  .profile-menu-header {
    width: 115%;
  }
  #profile-menu li {
    width: 115%;
  }
  .footer {
    margin-top: 30px !important;
  }
}
@media screen and (min-width: 961px) and (max-width: 1024px) {
  .greeting {
    padding-bottom: 5px !important;
    margin: 0 !important;
  }
}
@media only screen and (max-width: 540px) {
  .passwordChange .k-dialog {
    width: 100% !important;
  }
  .dialogSection .k-dialog {
    width: 100% !important;
  }
  .addShippingAdrSection .k-dialog {
    width: 95% !important;
    height: 88% !important;
    margin-bottom: 65px;
  }
  .p-slidemenu.p-slidemenu-dynamic {
    width: 64% !important;
  }
  .login-menu {
    width: 64% !important;
  }
  /* .cartMainGridCls .k-grid-footer {
    height: auto !important;
  }
  .checkOutReviewGridCls .k-grid-footer {
    height: auto !important;
  }
  .post-indicator-text-sm {
    position: inherit !important;
  }*/
  .quoteItemsCls .k-button {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}
@media only screen and (max-width: 971px) and (orientation: landscape) {
  .dialogSection .k-dialog {
    height: 100% !important;
  }
  .addShippingAdrSection .k-dialog {
    height: 90% !important;
  }
}
.k-grid-header .k-i-sort-asc-sm,
.k-grid-header .k-i-sort-desc-sm,
.k-grid-header .k-sort-order {
  color: #e32 !important;
  background-color: transparent !important;
}

.k-icon {
  cursor: pointer;
}

/* region Notification styles goes here*/
.k-widget.k-notification.k-notification-success.k-notification {
  max-width: 500px !important;
  /*min-height: 64px;
  padding-top: 19px;*/
  border-radius: 6px;
  color: white;
  /*font-size: 17px;*/
  font-weight: bold;
}

.k-notification-wrap > .k-icon {
  margin-top: 4px !important;
}

/*kendo-notification-container {​​​​
margin: 24% 25px 0 0 !important;
}​​​​*/
.k-notification-group {
  margin: 5% 25px 0 0 !important;
}

.k-grid td.k-state-selected, .k-grid tr.k-state-selected > td {
  background-color: #a7d2d0 !important;
}

/*#endregion*/
/*#region   Add Shipping Style*/
.kdropdownlistAddShipping {
  /*width: 255px!important;*/
}

/*#endregion*/
/*#region Build and buy screen common style css---Start*/
.buildBuyDescription {
  text-align: left;
  height: 115px;
}

.imagebox {
  padding: 0px;
  position: relative;
  text-align: center;
  width: 100%;
}

.imagebox img {
  width: 100% !important;
  max-height: 200px !important;
}

.imagebox .imagebox-desc {
  background-color: #666677;
  top: 0px;
  color: white;
  font-size: 18px;
  left: 0px;
  padding: 10px 15px;
  position: absolute;
  text-align: center;
  width: 100%;
}

.productDescription {
  max-height: 136px;
  overflow-y: auto;
}

.leftCls {
  left: 55rem;
}

.k-grid-toolbar-button-display {
  display: block;
  width: 100%;
}

/*#endregion Build and buy screen common style css---end*/
/*.center {
  margin: auto;
  width: 50%;
  padding: 10px;
}
*/
.required-field {
  color: red;
}

.product-config-container-row {
  display: flex;
  align-items: flex-start;
  flex-direction: row;
}

.product-config-container-col {
  display: inline-flex;
  align-items: flex-start;
  flex-direction: column;
  margin: 5px;
  flex-wrap: wrap;
  width: 225px;
}

span.k-icon.k-i-information.k-i-info.build_and_buy {
  font-size: 25px !important;
  color: green;
}

/*
li.k-item.k-state-default {
  background: #aeb5ba !important;
  color: #fff !important;
}

li.k-item.k-state-default.k-state-active {
  color: #fff !important;
  background-color: #2d506f !important;
}*/
.k-i-loading.build_and_buy {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  font-size: 64px;
  background-color: rgba(255, 255, 255, 0.3);
  color: #ff6757;
}

.myIframe {
  position: relative;
  padding-bottom: 65.25%;
  padding-top: 30px;
  height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch; /*<<--- THIS IS THE KEY*/
  border: solid black 1px;
}

.myIframe iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.p-slidemenu {
  width: 20rem;
}

/*# sourceMappingURL=styles.css.map*/