@import url(//fonts.googleapis.com/css?family=Poppins:300,400,500,600,700);
/*Copy customer*/
form#savecopy select.form-control {
  margin: 5px 0;
}

#customerCopyCustomerSaveResultsContainer {
  height: 200px;
  overflow-y: scroll;
}

/*Shipping Profile*/
#ShipMethodProfile .newRow {
  margin-top: 50px;
}

/*End Shipping Profile*/
/*Shipto*/
.editShiptoProfile .select2-container .select2-selection--multiple .select2-selection__choice {
  max-width: 100%;
  box-sizing: border-box;
  white-space: normal;
  word-wrap: break-word;
}

/*end Shipto*/
.table .row div:nth-child(1), .table .th div:nth-child(1), .table .tr div:nth-child(1) {
  /*First column should always be edit / delete so a static 55px should be good*/
  /*width: 55px;*/
}

.table .tr:nth-child(2n+1), .table .row:nth-child(2n+1) {
  background-color: #E4E4E4;
}

.table .tr, .table .row, .table .th, .table .header {
  border-bottom: 1px solid #888;
  align-items: center;
  min-height: 40px;
}

.table .trRed {
  border-bottom: 1px solid #888;
  align-items: center;
  min-height: 40px;
  background-color: #FF0000;
}

.table .th {
  background-color: #CCC;
  font-weight: bold;
  padding-top: 5px;
}

.table .th .td {
  align-self: flex-end;
  margin-bottom: 5px;
}

.table .td {
  align-self: center;
}

.table .row {
  display: flex;
  border-bottom: 1px solid #888;
}

.table .header.row {
  font-weight: bold;
  padding: 10px 0;
  background-color: #ccc;
}

.table .srch {
  background-color: #8BB3D6;
}

.srch.color {
  padding: 3px 0;
}

.srchrow {
  background-color: #337ab7;
}

.td.center {
  text-align: center;
}

.td input {
  width: 99%;
}

.td a {
  margin: 3px;
}

.td a:hover {
  cursor: pointer;
}

.td:nth-child(1) a:nth-child(1) {
  /*intended to add 5px to the front of edit/delete elements when they are in the first column*/
  margin-left: 5px;
}

.td a:nth-child(2) {
  padding: 0 2px;
}

.td a.btn-link {
  margin: 0;
  text-decoration: underline;
  font-size: large;
}

.td a.btn-link:hover {
  text-decoration: none;
}

.td input.dispOrder {
  max-width: 100px;
}

.td.addEdit {
  display: flex;
  flex-direction: column;
  text-align: center;
}

input[type=checkbox], input[type=radio] {
  height: auto;
  width: auto;
  -ms-flex-item-align: start;
  align-self: flex-start;
}

th.img {
  margin-top: -3px;
}

th.img:hover {
  cursor: pointer;
}

.grid {
  display: -ms-grid;
  display: grid;
  padding: 5px;
}

.tr.grid {
  align-items: center;
}

.tr.error {
  background-color: red !important;
}

.tr.blue {
  background-color: blue !important;
}

.tr.green {
  background-color: green !important;
}

.tr.teal {
  background-color: teal !important;
}

.tr.magenta {
  background-color: magenta !important;
}

.tr.purple {
  background-color: purple !important;
}

.tr.yellow {
  background-color: yellow !important;
}

.tr.lightgrey {
  background-color: lightgrey !important;
  padding-left: 10px;
}

.trgrid .btn {
  margin: 0;
}

.table .row, .table .header {
  grid-gap: 5px;
}

.th .vert {
  display: flex;
  align-items: center;
  transform: rotate(270deg);
  white-space: nowrap;
  text-shadow: 0 0 20px #DDD;
}

.th .vert {
  padding-left: 10px;
}

.tr .vert {
  display: flex;
  justify-content: center;
}

.editColumns .glyphicon:hover {
  box-shadow: none;
  color: white;
  background-color: initial;
}

.cutout .th .td {
  align-self: flex-end;
}

.createGrid .grid, .createGrid_4 .grid {
  grid-row-gap: 10px;
  grid-column-gap: 20px;
  margin: 10px;
}

.createGrid .grid {
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: repeat(2, 1fr);
}

.createGrid_4 .grid {
  -ms-grid-columns: 1fr 1fr 1fr 1fr;
  grid-template-columns: repeat(4, 1fr);
}

.grid-col-2-sml .grid, .grid-col-2-sml.grid {
  grid-template-columns: minmax(auto, 150px) minmax(auto, 200px);
}
.grid-col-2-sml .grid.th, .grid-col-2-sml.grid.th {
  font-weight: bold;
}
.grid-col-2-sml .grid.tr, .grid-col-2-sml.grid.tr {
  margin-bottom: 1em;
}

/*#region IE compatibility*/
@supports (-ms-ime-align: auto) {
  .table .th {
    padding-top: 12px;
  }
  .th .vert {
    padding-left: 15px;
  }
  .table .th {
    min-height: 40px; /*--     IE     -- */
    height: auto !important; /*-- min-height -- */
    height: 40px; /*--    hack    -- */
  }
  .table .tr.grid div, .srch.grid div {
    min-height: 40px;
    height: auto !important;
    height: 40px;
    display: flex;
    align-items: center;
  }
  /*IE solution for Grid-Gap*/
  .createGrid .tr.grid div:not(:first-child), .createGrid_4 .tr.grid div:not(:first-child) {
    margin-left: 20px;
  }
  #connectionlist.table .grid div:not(:first-child) {
    margin-left: 5px;
  }
  /*#region grid column declarations*/
  .grid :nth-of-type(1) {
    -ms-grid-column: 1;
  }
  .grid :nth-of-type(2) {
    -ms-grid-column: 2;
  }
  .grid :nth-of-type(3) {
    -ms-grid-column: 3;
  }
  .grid :nth-of-type(4) {
    -ms-grid-column: 4;
  }
  .grid :nth-of-type(5) {
    -ms-grid-column: 5;
  }
  .grid :nth-of-type(6) {
    -ms-grid-column: 6;
  }
  .grid :nth-of-type(7) {
    -ms-grid-column: 7;
  }
  .grid :nth-of-type(8) {
    -ms-grid-column: 8;
  }
  .grid :nth-of-type(9) {
    -ms-grid-column: 9;
  }
  .grid :nth-of-type(10) {
    -ms-grid-column: 10;
  }
  .grid :nth-of-type(11) {
    -ms-grid-column: 11;
  }
  .grid :nth-of-type(12) {
    -ms-grid-column: 12;
  }
  .grid :nth-of-type(13) {
    -ms-grid-column: 13;
  }
  .grid :nth-of-type(14) {
    -ms-grid-column: 14;
  }
  .grid :nth-of-type(15) {
    -ms-grid-column: 15;
  }
  .grid :nth-of-type(16) {
    -ms-grid-column: 16;
  }
  .grid :nth-of-type(17) {
    -ms-grid-column: 17;
  }
  .grid :nth-of-type(18) {
    -ms-grid-column: 18;
  }
  .grid :nth-of-type(19) {
    -ms-grid-column: 19;
  }
  .grid :nth-of-type(20) {
    -ms-grid-column: 13;
  }
  .grid :nth-of-type(21) {
    -ms-grid-column: 13;
  }
  .grid :nth-of-type(22) {
    -ms-grid-column: 13;
  }
  .grid :nth-of-type(23) {
    -ms-grid-column: 13;
  }
  .grid :nth-of-type(24) {
    -ms-grid-column: 13;
  }
  .grid :nth-of-type(25) {
    -ms-grid-column: 13;
  }
  .grid :nth-of-type(26) {
    -ms-grid-column: 14;
  }
  .grid :nth-of-type(27) {
    -ms-grid-column: 14;
  }
  .grid :nth-of-type(28) {
    -ms-grid-column: 14;
  }
  .grid :nth-of-type(29) {
    -ms-grid-column: 14;
  }
  .grid :nth-of-type(30) {
    -ms-grid-column: 14;
  }
  /*#endregion*/
}
/*#endregion*/
#DesignTabs li a[aria-expanded=true]::before, #EditTabs li a[aria-expanded=true]::before {
  content: "";
}
#DesignTabs li a[aria-expanded=false]::before, #EditTabs li a[aria-expanded=false]::before {
  content: "";
}

#StoreSettings .panel-heading {
  padding: 0;
}
#StoreSettings a.accordion-toggle {
  display: block;
  padding: 10px 15px;
}
#StoreSettings #maincontentPanel {
  counter-reset: step-count;
}
#StoreSettings #rotator-panels .counter {
  counter-increment: step-count;
}
#StoreSettings #rotator-panels .counter::after {
  content: counter(step-count);
}
#StoreSettings #rotator-panels .image-group-container {
  /*        border: solid 1px #eee;
  padding: 1em;
  margin-bottom: 1em;*/
}
#StoreSettings #rotator-panels .image-group-container .title {
  font-size: large;
}
#StoreSettings #rotator-panels .btn-row {
  text-align: right;
}
.tab-content .tab-pane > div {
  display: flex;
  flex-direction: column;
  margin-bottom: 1em;
}

#CSSDesignerForm .tab-content {
  padding-top: 1em;
}
#CSSDesignerForm #colors {
  width: 70%;
  margin: 0 auto;
}
#CSSDesignerForm .panel-heading a {
  display: block;
  position: relative;
  font-weight: bold;
  text-decoration: none;
}
#CSSDesignerForm .panel-heading a:hover {
  text-decoration: underline;
}
#CSSDesignerForm .bad-color {
  color: #a94442;
}

#layout.active, #storeEdit.active, #StoreSettings {
  display: grid;
  grid-template-columns: 40% 60%;
  grid-gap: 1em;
}
#layout.active #store-accordion, #storeEdit.active #store-accordion, #StoreSettings #store-accordion {
  grid-column: 1;
}
#layout.active .color-preview, #storeEdit.active .color-preview, #StoreSettings .color-preview {
  width: 34px;
}

.sections {
  display: flex;
  flex-wrap: wrap;
  border: 1px solid;
  padding: 1em;
  margin: 0.5em 0;
}

div > .sections:first-child {
  margin-top: 0;
}

#preview {
  height: 810px;
  border: solid 1px black;
  position: sticky;
  top: 1em;
}
#preview #body-content {
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  height: 800px;
}
#preview #body-content .desImg {
  border: solid 1px;
  height: 90px;
  width: 90px;
  padding: 5px;
  text-align: center;
  background-color: white;
  color: black;
}
#preview #body-content .desImg:after {
  content: "Image Place Holder";
}
#preview #body-content #desHeader {
  padding: 3em 1em;
}
#preview #body-content #desHeader #HeaderGraphic {
  border: 1px solid;
  padding: 0;
  margin: 0 auto;
  text-align: center;
  padding: 3em;
  width: 100%;
  order: 1;
}
#preview #body-content #desNavbar {
  padding: 1em;
}
#preview #body-content #desNavbar .desLink {
  display: inline;
  padding: 1em;
  /*pointer-events:none;*/
}
#preview #body-content #desContent {
  display: flex;
  flex: 1 0 auto;
}
#preview #body-content #desContent #layoutgrid {
  display: grid;
  width: 100%;
}
#preview #body-content #desContent #layoutgrid #desSidebar {
  padding: 1em;
}
#preview #body-content #desContent #layoutgrid #desContentArea {
  padding: 1em 0 0 1em;
  display: flex;
  flex-direction: column;
}
#preview #body-content #desContent #layoutgrid #desContentArea .desSpecials {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding-top: 10px;
}
#preview #body-content #desContent #layoutgrid #desContentArea .desSpecials .special {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#preview #body-content #desContent #layoutgrid #desContentArea .desSpecials .special .SpecialName {
  text-align: center;
}
#preview #body-content #desContent #layoutgrid #desContentArea .desCatalogs {
  padding-top: 10px;
}
#preview #body-content #desContent #layoutgrid #desContentArea .desCatalogs .desCatalog {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#preview #body-content #desContent #layoutgrid #desContentArea .desCatalogs.catalogList {
  display: flex;
  flex-direction: column;
}
#preview #body-content #desContent #layoutgrid #desContentArea .desCatalogs.catalogList .desCatalog {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-gap: 1em;
  border-bottom: 1px solid;
  padding: 1em 0;
  align-items: flex-start;
}
#preview #body-content #desContent #layoutgrid #desContentArea .desCatalogs.catalogGrid {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
}
#preview #body-content #desContent #layoutgrid #desContentArea .desCatalogs.catalogGrid .catName {
  text-align: center;
}
#preview #body-content #desContent #layoutgrid #desContentArea .desCatalogs.catalogGrid .desCatalog {
  width: 33%;
}
#preview #body-content #desFooter {
  padding: 1em;
}

#Edit.active {
  display: flex;
  justify-content: center;
}
#Edit .jodit_source {
  height: 70vh;
}
#Edit #editContent {
  display: flex;
  flex-direction: column;
  align-content: center;
}

#EditorForm .tab-pane {
  height: 70vh;
}
#EditorForm .editor-btn, #EditorForm .saveMessage {
  position: relative;
}
#EditorForm.tab-content > .active {
  display: flex;
  justify-content: center;
  width: 100%;
}
#EditorForm .tab-pane > div {
  display: flex;
}

@media only screen and (max-width: 770px) {
  #Edit.active {
    display: block;
  }
  #Edit #editContent {
    padding: 1em 0;
  }
}
/*#region  DISCOUNT ADMIN */
#discountlist .grid {
  -ms-grid-columns: 90px 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-columns: 90px repeat(9, 1fr);
}

#discountConns {
  display: flex;
}

#discountConns > div {
  flex-grow: 1;
  text-align: center;
}

#currDiscConns > div {
  display: grid;
  -ms-grid-columns: 1fr 1fr 1fr 70px;
  grid-template-columns: 1fr 1fr 1fr 70px;
}

#mdlConnections h5 {
  background-color: #8BB3D6;
  padding: 10px;
  margin-bottom: 0px;
}

/*#endregion Discount Admin*/
/*#region ALLOCATIONS ADMIN*/
#alloclist .grid {
  -ms-grid-columns: 90px 1fr 90px 90px 90px 90px 90px 90px 90px 90px 90px;
  grid-template-columns: 90px 1fr repeat(9, 90px);
}
#alloclist .grid.Points, #alloclist .grid.srch.Points {
  grid-template-columns: 90px 1fr repeat(7, 130px);
}

#assloclist > div div:nth-child(n+3) {
  text-align: center;
}

#autoreset {
  background-color: #EEE;
  overflow: hidden;
  border: 1px solid #44a;
  border-width: 0px 1px;
}

#autoreset div {
  padding-left: 10px;
  height: 30px;
}

#autoreset input {
  width: 43px;
}

.chkSearch {
  margin: auto 0px;
}

#allocSetupList .cutout {
  margin-top: -20px;
  clip-path: polygon(0% 100%, 0 55%, 80% 55%, 81% 54%, 83% 51%, 84% 48%, 85% 44%, 91% 9%, 92% 6%, 93% 4%, 94% 2%, 95% 1%, 97% 0, 100% 0, 100% 100%);
}

#allocSetupList .th {
  height: 100px;
}

#allocSetupList div {
  -ms-grid-columns: 55px 1fr 1fr 1fr 90px 80px 35px 35px 35px 35px 35px;
  grid-template-columns: 55px repeat(3, 1fr) 90px 80px repeat(5, 35px);
}

#allocSetupList > div:nth-child(n+2) > div:nth-child(6) {
  text-align: center;
}

.tdhdr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  margin-bottom: 10px !important;
  flex-direction: column-reverse;
}

#allocStatus {
  float: left;
  font-weight: bold;
}

#allocConnList div {
  -ms-grid-columns: 55px 1fr 1fr 1fr;
  grid-template-columns: 55px repeat(3, 1fr);
}

/*#endregion Allocations Admin*/
/*Allocation User Amounts*/
form#AllocationUsageReportParameterForm .react-bootstrap-daterangepicker-container {
  padding-top: 15px;
}

/*end Allocation User Amounts*/
/*Discounts/Gift Codes*/
#react-discountList #discountConns .form-group.col-xs-4 {
  padding-left: 2px;
  padding-right: 2px;
}
#react-discountList #discountConns .select2-selection__choice {
  white-space: pre-line;
}

/*End Discounts/Gift Codes*/
@supports (-ms-ime-align: auto) {
  #allocSetupList .cutout {
    margin-top: 0;
  }
}
/*#region TemplateIntegration */
.wideFloatRight {
  float: right;
}

#ASI {
  border: 1px solid #000;
  padding: 0px 10px 0px 10px;
  background-color: #EEE;
  margin-bottom: 10px;
  display: none;
}

#ASI h2 {
  margin-top: 0px;
  text-align: center;
}

.printViewConn {
  text-align: center;
}

#ConnectionGrid {
  display: grid;
  grid-template-columns: 1fr 200px 1fr;
  flex-direction: column;
}

.copyitems div:nth-child(-n+3) {
  display: flex;
  justify-content: space-between;
}

#connectBtns {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}

#connectBtns button {
  align-self: center;
}

#fromConnect {
  width: 300px;
}

#loadTemplates {
  width: 170px;
  display: none;
}

#btnPreview {
  display: none;
}

#availSetups {
  max-height: 500px;
  overflow: scroll;
}

#itemsToCopy {
  max-height: 500px;
  overflow: scroll;
}

@media only screen and (max-width: 480px) {
  .wideFloatRight {
    float: none;
    margin-bottom: 20px;
  }
}
/*#endregion TemplateIntegration*/
#items {
  position: relative;
}

#ItemSetup {
  display: flex;
  flex-direction: column;
}
#ItemSetup #item-select .radio-group {
  display: grid;
  grid-template-columns: auto auto auto auto 1fr;
  grid-gap: 1.5em;
}
#ItemSetup #item-container {
  border: 1px solid #ddd;
  display: grid;
  grid-template-columns: 20% 1fr;
}
#ItemSetup #item-container #item-menu {
  /*            li:last-child {
      border-bottom: 1px solid #ddd;
  }*/
}
#ItemSetup #item-container #item-menu ul.nav {
  border-bottom: 1px solid #ddd;
}
#ItemSetup #item-container #item-menu ul li {
  border: 1px solid #ddd;
  border-bottom: none;
  cursor: pointer;
}
#ItemSetup #item-container #item-menu ul li.active {
  background-color: rgb(139, 179, 214);
}
#ItemSetup #item-container #item-menu ul li.active div {
  color: #000;
}
#ItemSetup #item-container #item-menu ul li div {
  padding: 10px 15px;
  color: #337ab7;
}
#ItemSetup #item-container #item-menu ul li div:hover {
  background-color: #eee;
  color: #23527c;
}
#ItemSetup #item-container #item-menu ul li .menu-item-required {
  background-color: #FFC0CB;
  color: black;
  font-style: italic;
  font-weight: 525;
}
#ItemSetup #item-container #item-menu ul .menu-item-disabled, #ItemSetup #item-container #item-menu ul .menu-item-disabled div, #ItemSetup #item-container #item-menu ul .menu-item-disabled:hover, #ItemSetup #item-container #item-menu ul .menu-item-disabled div:hover {
  cursor: help;
  background-color: #eee;
  color: #8f8f8f;
}
#ItemSetup #item-container #item-menu, #ItemSetup #item-container .section {
  margin: 1em;
}
#ItemSetup #item-container .section {
  display: none;
}
#ItemSetup #item-container .section.active {
  display: inherit;
  max-width: 100%;
}
#ItemSetup #item-container .nav-tabs .error a {
  background-color: #FFC0CB;
  color: black;
  font-style: italic;
  font-weight: 525;
  border-radius: 5px 5px 0 0;
}
#ItemSetup #item-container .tab-pane.active {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 1.5em;
  border: solid 1px #ddd;
  border-top: none;
  padding: 1em;
  min-height: 350px;
}
#ItemSetup #item-container .tab-pane.active#item-description {
  min-height: 550px;
}
#ItemSetup #item-container .tab-pane.active#item-description .jodit-workplace {
  min-height: 440px !important;
}
#ItemSetup #item-container .tab-pane.active.single {
  grid-template-columns: 1fr;
}
#ItemSetup #item-container .tab-pane.active .edit-item.wearable-table {
  overflow-x: scroll;
}
#ItemSetup #item-container .tab-pane.active .edit-item-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 2em;
}
#ItemSetup #item-container #template-panels .grid {
  grid-template-columns: 1fr 1fr;
  grid-gap: 1.5em;
}
#ItemSetup #item-container #template-panels .title {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 50%;
  align-items: center;
}
#ItemSetup #item-container #template-panels .btn-row {
  text-align: right;
}
#ItemSetup #item-container select[multiple], #ItemSetup #item-container select[size] {
  min-height: 175px;
}

#ItemSetup .required, .modal-body .required {
  border: 3px solid #a94442;
}
#ItemSetup .required:after, .modal-body .required:after {
  content: "";
}

#contentAddItem .modal-body {
  display: grid;
}

#itemSetupComponentListScrollContainer {
  max-height: calc(100vh - 225px);
  overflow-y: auto;
}

form#kitproducts .doubleSelectbox-grid .col-md-5 {
  padding: 0;
}

#component-list .grid {
  grid-template-columns: 50px 1fr 1fr 1fr;
  grid-gap: 1em;
}

/*Order History*/
#searchPIMItemModal .modal-body {
  max-height: 700px;
  overflow: scroll;
}

#pimProductTable .grid {
  -ms-grid-columns: 5px 65px 1fr 1fr 2fr 100px 2fr;
  grid-template-columns: 75px 65px 1fr 1fr 2fr 100px 2fr;
  justify-items: center;
}

#pimProductTable .grid a, .btnSort, .page-link {
  background-color: unset;
  cursor: pointer;
}

#pimProductTable .grid .td:first-child {
  text-align: center;
}

/*Order History*/
#pimProductMainTable {
  /*    max-height:500px;
      overflow:scroll;*/
}
#pimProductMainTable .grid {
  -ms-grid-columns: 1fr 200px 1fr 2fr;
  grid-template-columns: 1fr 200px 1fr 2fr;
  justify-items: center;
}
#pimProductMainTable .grid a, #pimProductMainTable .grid .btnSort, #pimProductMainTable .grid .page-link {
  background-color: unset;
  cursor: pointer;
}
#pimProductMainTable .grid .td:first-child {
  text-align: center;
}

#pimimage #newattribute {
  max-height: 600px;
  overflow: scroll;
}

.imgpimwidth {
  max-width: 400px;
  max-height: 400px;
}

.checkmark {
  color: red;
}

.left {
  text-align: left;
}

#CategoryListTable .grid {
  -ms-grid-column: 35px 35px 1fr 1fr;
  grid-template-columns: 35px 35px 1fr 1fr;
  grid-gap: 5px;
}

#CategoryListTable .srch.grid {
  -ms-grid-column: 35px 35px 1fr 2fr;
  grid-template-columns: 35px 35px 1fr 2fr;
}

#itemSetupPriceBreakUsrMsg {
  padding: 8px 25px;
}

#WearablesListTable {
  max-height: 460px;
}
/*Images Tab*/
#item-images .table {
  max-height: 460px;
  overflow-y: scroll;
}
#item-images .table .tr {
  min-height: max-content;
}
#item-images #ItemColorImageTable .grid {
  -ms-grid-column: 55px 1fr 1fr 1fr;
  grid-template-columns: 55px 1fr 1fr 1fr;
  grid-gap: 10px;
}

#WearablesListTable .grid {
  -ms-grid-column: 20px 150px 150px 150px 150px 150px 150px 150px 150px;
  grid-template-columns: 20px repeat(8, 150px);
  grid-gap: 5px;
  min-width: max-content;
  max-width: 1272px;
}

#WearablesListTable .grid.alias {
  -ms-grid-column: 20px 150px 150px 150px 150px 150px 150px 150px 150px 150px;
  grid-template-columns: 20px repeat(9, 150px);
  grid-gap: 5px;
  min-width: max-content;
  max-width: 1431px;
}

#WearablesListTable .td.price {
  display: flex;
  align-items: center;
  padding-right: 15px;
}

.panel-section#PricingAll {
  padding-top: 1em;
}

.iqpbdTable .grid {
  grid-template-columns: 50px 1fr 1fr 1fr 1fr;
  grid-gap: 1em;
}

#PointsTable {
  margin-top: 20px;
  max-height: 460px;
  overflow-y: scroll;
}
#PointsTable .grid {
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 1.5em;
}

#item-points .text-points {
  width: 100px;
}

#loading-div {
  background-color: rgba(1, 1, 1, 0.5);
  height: 100%;
  width: 100%;
  position: absolute;
  z-index: 1000;
}

#loading-div-container {
  position: absolute;
  left: 50%;
  top: 35%;
}

#pim-loading-div-container {
  display: block;
  position: absolute;
  left: 50%;
  top: 15em;
  z-index: 1000;
}

#pim-loading-div-container::before {
  background-color: rgba(0, 0, 0, 0.5);
  height: 7em;
  width: 7em;
  content: "";
  display: block;
  position: absolute;
  top: -3.1em;
  left: -3.1em;
  border-radius: 50px;
}

.loader {
  font-size: 15px;
  width: 0.8em;
  height: 0.8em;
  border-radius: 50%;
  position: relative;
  text-indent: -9999em;
  animation: mulShdSpin 1.1s infinite ease;
  transform: translateZ(0);
}

#loader-text {
  color: white;
  position: relative;
  top: -1.5em;
  left: -1.6em;
  font-size: 0.9em;
  font-weight: bold;
}

.image-preview-grid {
  display: grid;
  grid-template-columns: auto auto;
  align-items: center;
}
.image-preview-grid #image-preview-setup {
  display: flex;
  justify-content: center;
}
.image-preview-grid #image-preview-setup img {
  max-height: 175px;
}

#images-preview {
  justify-content: center;
  justify-self: center;
}
#images-preview img {
  object-fit: none;
}

img#imgPreview {
  max-width: 250px;
  object-fit: cover;
}

@keyframes mulShdSpin {
  0%, 100% {
    box-shadow: 0em -2.6em 0em 0em #ffffff, 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.5), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7);
  }
  12.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.7), 1.8em -1.8em 0 0em #ffffff, 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5);
  }
  25% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.5), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7), 2.5em 0em 0 0em #ffffff, 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
  }
  37.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5), 2.5em 0em 0 0em rgba(255, 255, 255, 0.7), 1.75em 1.75em 0 0em #ffffff, 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
  }
  50% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.5), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.7), 0em 2.5em 0 0em #ffffff, -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
  }
  62.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.5), 0em 2.5em 0 0em rgba(255, 255, 255, 0.7), -1.8em 1.8em 0 0em #ffffff, -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
  }
  75% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.5), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.7), -2.6em 0em 0 0em #ffffff, -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
  }
  87.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.5), -2.6em 0em 0 0em rgba(255, 255, 255, 0.7), -1.8em -1.8em 0 0em #ffffff;
  }
}
#itemSetupComponentListScrollContainer {
  max-height: calc(100vh - 225px);
  overflow-y: auto;
}

form#kitproducts .doubleSelectbox-grid .col-md-5 {
  padding: 0;
}

#CategoryListTable .grid {
  -ms-grid-column: 35px 35px 1fr 1fr;
  grid-template-columns: 35px 35px 1fr 1fr;
  grid-gap: 5px;
}

#CategoryListTable .srch.grid {
  -ms-grid-column: 35px 35px 1fr 2fr;
  grid-template-columns: 35px 35px 1fr 2fr;
}

#itemSetupPriceBreakUsrMsg {
  padding: 8px 25px;
}

#WearablesListTableJIT {
  max-height: 460px;
  overflow-y: scroll;
}

#WearablesListTableJIT .grid {
  -ms-grid-column: 55px 3fr 3fr 1fr 1fr 2fr 2fr 2fr;
  grid-template-columns: 55px 3fr 3fr 1fr 1fr 2fr 2fr 2fr;
  grid-gap: 5px;
}

#WearablesListTableJIT .td.price {
  display: flex;
  align-items: center;
  padding-right: 15px;
}

#ItemColorImageList .grid {
  -ms-grid-column: 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 10px;
}
.modal-content .form-group {
  /*margin: 0;*/
}

.modal-header {
  background-color: #8BB3D6;
}

#sidebar > ul > li > ul > li > ul > li > a { /*indent submenu items like logos*/
  padding-left: 45px !important;
}

.glyphicon.glyphicon-rotate-90 {
  transform: rotate(90deg);
}
/* LOGGING ADMIN */
#loglist .grid {
  -ms-grid-columns: 100px 200px 1fr 150px 130px;
  grid-template-columns: 100px 200px 1fr 150px 130px;
}

#loglist > div div {
  word-break: break-word;
}

#logeventlist .grid {
  -ms-grid-columns: 100px 120px 1fr 150px 150px 150px 130px;
  grid-template-columns: 100px 120px 1fr 150px 150px 150px 130px;
}

#mdlShowLogEvent label {
  margin: 10px 0px 0px 0px;
}

#xmllist .grid {
  -ms-grid-columns: 100px 200px 200px 1fr 60px 150px 120px 80px 140px;
  grid-template-columns: 100px 200px 200px 1fr 60px 150px 120px 80px 140px;
}

#Historylist .grid {
  -ms-grid-columns: 100px 1fr 1fr 200px 170px;
  grid-template-columns: 100px 1fr 1fr 200px 170px;
}

/*.historyRow {
    display: grid;
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
}*/
.historyRow > div {
  display: grid;
  -ms-grid-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  word-wrap: break-word;
  white-space: normal;
}

#mdlShowXML label {
  margin: 10px 0px 0px 0px;
}

.xmlHead {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  margin-bottom: 25px;
}

.urlPopover {
  position: absolute;
  border: 1px solid #444;
  padding: 10px;
  background-color: #FFF;
  display: none;
  white-space: nowrap;
  border-radius: 5px;
  box-shadow: 3px 4px 5px #888;
}

#xmlDisplay {
  max-height: 500px;
}

#react-historylist #historyListOptions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 1em;
}
#react-historylist #historyListOptions .history-listOptions-dateRange {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 1em;
  align-items: flex-end;
}
#react-historylist #historyListOptions .history-listOptions-dateRange button {
  margin: 0;
}
#react-historylist #historyListOptions .history-listOptions-export {
  gap: 1em;
  align-items: flex-end;
  justify-content: flex-end;
  flex: 1 1 auto;
}
#react-historylist #historyListOptions .history-listOptions-export button {
  margin: 0;
  align-self: flex-end;
}
#react-historylist #DynamicList.Item .grid {
  grid-template-columns: 4em 1fr 1fr 1fr 1fr 14em;
}
#react-historylist #DynamicList.Users .grid {
  grid-template-columns: 4em 1fr 1fr 1fr 1fr 14em;
}
#react-historylist #DynamicList.VendorSetup .grid {
  grid-template-columns: 4em 1fr 1fr 1fr 1fr 14em;
}
#react-historylist #DynamicList.Default .grid {
  grid-template-columns: 4em 1fr;
}
#react-historylist .srch.grid > div {
  display: flex;
  align-items: center;
}
#react-historylist #pageContainer .pageCount {
  display: flex;
  align-items: center;
  gap: 1em;
  align-items: center;
  padding-left: 1em;
}
#react-historylist div#objValue > div,
#react-historylist div#objValue > label {
  border-bottom: 1px solid black;
  min-height: 2em;
  padding-top: 5px;
}
#react-historylist div#objValue > div.highlight,
#react-historylist div#objValue > label.highlight {
  background-color: #CCC;
}
#react-historylist .modal-dialog.modal-lg {
  width: auto;
  max-width: 80vw;
}
#LogoList.cutout {
  clip-path: polygon(0% 100%, 0 50%, 50% 50%, 51% 49%, 53% 46%, 54% 43%, 55% 39%, 61% 9%, 62% 6%, 63% 4%, 64% 2%, 65% 1%, 69% 0, 100% 0, 100% 100%);
}

#LogoList .cutout {
  margin-top: -120px;
  clip-path: polygon(0% 100%, 0 75%, 50% 75%, 51% 74%, 53% 71%, 54% 68%, 55% 64%, 61% 9%, 62% 6%, 63% 4%, 64% 2%, 65% 1%, 67% 0, 100% 0, 100% 100%);
  height: 190px;
}

#LogoList .th .vert {
  padding-left: 25px;
}

#LogoList .grid {
  -ms-grid-columns: 50px 2fr 3fr 3fr 3fr 62px 62px 62px 62px 62px 62px 62px 62px;
  grid-template-columns: 50px 2fr repeat(3, 3fr) repeat(9, 62px);
  grid-gap: 5px;
}

.logosgrid {
  display: grid;
  grid-template-columns: 55px 1fr 1fr 1fr repeat(10, 40px);
  grid-auto-rows: minmax(50px, auto);
  vertical-align: bottom;
  position: relative;
}

.logosgrid.th {
  height: 200px;
}

#newLogoGrid .grid {
  -ms-grid-columns: 1fr 1fr 1fr;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 5px;
}

#newLogoGrid > div {
  margin: 0px 15px;
}

.padLabel {
  margin: 5px 0px;
}

#newLogoGrid div:nth-child(4) {
  margin: 0px 0px;
}

#newLogoGrid div:nth-child(n+5) {
  margin-top: 35px;
}

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

#logoDesign .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr;
  grid-template-columns: 55px repeat(3, 1fr);
}

#logoPosition .grid {
  -ms-grid-columns: 55px 1fr 1fr;
  grid-template-columns: 55px repeat(2, 1fr);
}

#logoColorWay .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr 1fr;
  grid-template-columns: 55px repeat(4, 1fr);
}

#logoTextPosition .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-columns: 55px repeat(6, 1fr);
}

#logoTextColor .grid {
  -ms-grid-columns: 55px 1fr 1fr;
  grid-template-columns: 55px 1fr 1fr;
}

#logoDropDown .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr;
  grid-template-columns: 55px repeat(3, 1fr);
}

#LogoDropDownItemsTable .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr 1fr;
  grid-template-columns: 55px repeat(4, 1fr);
}

#LogoList .tr div:nth-child(1) input[type=checkbox] {
  margin-left: 5px;
}

/*IE Compatibility*/
@supports (-ms-ime-align: auto) {
  #LogoList .cutout {
    margin-top: 0;
  }
  #newLogoGrid .grid div:not(:first-child) {
    margin-left: 5px;
  }
}
#usrInfo {
  position: absolute;
  top: 10px;
}

/*SideBar Nav*/
#sidebar > ul > li > ul > li > ul > li > a { /*indent submenu items like logos*/
  padding-left: 45px !important;
}

.modal-content .form-group {
  /*margin: 0;*/
}

.select2-selection--multiple .select2-search__field {
  width: 100% !important;
}

.modal-header {
  background-color: #8BB3D6;
}

.modal .form-group.row {
  flex-direction: row;
}

.noshow {
  display: none;
}

span[aria-labelledby*=__SizeCode-container] {
  /*width: 60%;*/
}

span[aria-labelledby*=__ColorCode-container] {
  /*width: 60%;*/
}

.vertmiddle {
  margin-bottom: 0px !important;
  align-self: center;
}

.icon-flip {
  -moz-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  -webkit-transform: scaleX(-1);
  -ms-transform: scaleX(-1);
  transform: scaleX(-1);
  margin-right: 5px;
  border: 1px solid #FFF;
}

.icon-dragable {
  display: inline-block;
  width: 1.5em;
  height: 2em;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%23000' d='M2 11h16v2H2zm0-4h16v2H2zm11 8H7l3 3zM7 5h6l-3-3z'/%3E%3C/svg%3E");
  background-color: lightgrey;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  position: absolute;
  right: 1em;
  top: 0.5em;
}
.icon-dragable.dots {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M18 14a1 1 0 1 0 0 2a1 1 0 0 0 0-2m-6 0a1 1 0 1 0 0 2a1 1 0 0 0 0-2m-6 0a1 1 0 1 0 0 2a1 1 0 0 0 0-2m12-6a1 1 0 1 0 0 2a1 1 0 0 0 0-2m-6 0a1 1 0 1 0 0 2a1 1 0 0 0 0-2M6 8a1 1 0 1 0 0 2a1 1 0 0 0 0-2'/%3E%3C/svg%3E");
}
.icon-dragable:hover {
  /*background-color:darkgrey;*/
  cursor: grab;
}

.drag:hover {
  cursor: -moz-grabbing;
  background-color: darkgrey;
}

.form-control {
  padding: 2px 6px;
}

.form-group .note {
  font-size: small;
  margin-left: 10px;
}

.noteItalic {
  font-size: small;
  font-style: italic;
}

.asb-readonly, .asb-select-readonly, .asb-checkbox-readonly {
  cursor: not-allowed;
  background-color: #eee !important;
}

.asb-checkbox-readonly {
  opacity: 0.5;
}

.asb-select-readonly {
  pointer-events: none;
}
.asb-select-readonly span * {
  pointer-events: none;
  background-color: #eee !important;
}

.icon-flip:hover {
  border: 1px solid #888;
}

.tip {
  display: none;
  position: absolute;
  margin-left: 10px;
  background-color: #9bcaff;
  border: 1px solid #000;
  box-shadow: 2px 2px 8px #888;
  padding: 10px;
}

#pageContainer {
  display: inline-grid;
  grid-template-columns: 1fr 1fr;
}

/*#pageContainer div:first-of-type {
    margin: 25px;
}*/
.pagination > li > a {
  border-color: #AAD;
}

.control-label {
  margin-bottom: 0;
}

.required:after {
  content: "*";
  color: red;
}

.input-group.required {
  border: solid #a94442;
  border-radius: 5px;
}
.input-group.required:after {
  content: "";
}

.label-no-button {
  margin-top: 12px;
}

.page-content, .form-group {
  display: flex;
  flex-direction: column;
}
.page-content.check-row, .form-group.check-row {
  display: grid;
  grid-template-columns: 175px 100px auto;
  align-items: center;
}

.SelectDelete {
  padding: 5px;
}

/*#region Buttons*/
button, .btn {
  align-self: flex-start;
  margin: 3px 0;
}

.btn label {
  margin: 0;
}

.btn-outline-primary {
  color: #337ab7;
  background-color: transparent;
  background-image: none;
  border-color: #337ab7;
}

.btn-outline-primary:hover {
  color: #FFF;
  background-color: #337ab7;
}

.btn-tooltip {
  border-radius: 20px;
  color: white;
  background-color: #008cba;
  font-size: 0.8em;
  height: 15px;
  width: 15px;
  padding: 0;
  cursor: help;
  margin: 0 5px;
  border: none;
  align-self: center;
}

.btn-tooltip:after {
  content: "?";
}

.logoOwnerModal {
  position: absolute;
  z-index: 1;
  width: 100%;
}

.logoOwnerModalBody {
  padding-top: 60px;
}

form#itemspecs .modal-header {
  position: absolute;
  z-index: 1;
  width: 100%;
}

form#itemspecs .modal-body {
  padding-top: 80px;
}

.listbox.btn-group {
  /*group of buttons can be seen between two listboxes*/
  display: flex;
  align-items: center;
  justify-content: center;
}
.listbox .lst-btn {
  width: 3em;
  margin: 0.3em;
  align-self: end;
}

.btns {
  /*buttons in btn-group*/
  display: flex;
  flex-direction: column;
}

.btn-toggle {
  background-color: darkgray;
  color: black;
  opacity: 0.5;
}

.btn-toggle:hover {
  opacity: 0.8;
  /*background-color: #4D9EFF;*/
  color: black;
}

.btn-toggle.active {
  background-color: #1a66FF;
  color: white;
  opacity: 1;
}

.btn-toggle.active:hover {
  /*background-color: darkgray;
          color: black;*/
  opacity: 0.8;
}

/*#endregion Buttons*/
.Row {
  width: 100%;
}

.flex {
  display: flex;
}

.flex.center {
  justify-content: center;
}

.flex.content_between {
  justify-content: space-between;
}

.flex .react-bootstrap-daterangepicker-container {
  align-self: center;
}

/*#region double select box*/
.doubleSelectbox-grid {
  -ms-grid-columns: 4fr 1fr 4fr;
  grid-template-columns: 4fr 1fr 4fr;
}

.doubleSelectbox-grid-extraColumn {
  -ms-grid-columns: 4fr 1fr 4fr 1fr;
  grid-template-columns: 4fr 1fr 4fr 1fr;
}

.doubleSelectbox-grid-extraColumn select {
  width: 100%;
}

.doubleSelectbox select {
  float: left;
}

.doubleSelectbox .select {
  display: flex;
  flex-direction: column;
  float: left;
}

.doubleSelectbox .listbox {
  float: left;
  padding-left: 10px;
  padding-right: 10px;
}

.modal .doubleSelectbox {
  height: 100%;
}

.modal .listbox {
  margin: 0;
}

.modal .doubleSelectbox.center {
  display: flex;
  flex-flow: column;
  align-items: center;
}

.listWidth {
  max-width: 350px;
}
.listWidth option {
  white-space: pre-wrap;
}

/*#endregion double select box*/
#colorSizeTable .grid {
  -ms-grid-columns: 55px 1fr 4fr;
  grid-template-columns: 55px 1fr 4fr;
  grid-gap: 5px;
}

#colorSizeTable .srch.grid {
  -ms-grid-columns: 55px 1fr 4fr 2fr;
  grid-template-columns: 55px 1fr 4fr 2fr;
}

@supports (-ms-ime-align: auto) {
  #colorSizeTable .grid div:not(:first-child) {
    margin-left: 5px;
  }
}
#loginPage {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}

#loginPage h2 {
  border-bottom: 1px solid #888;
}

/*#region Logos*/
/*#endregion */
.pwdsection {
  background-color: #ddd;
  padding: 10px;
  margin-bottom: 10px;
  border: 1px solid #AAA;
  border-radius: 5px;
}

.pwdbtns {
  display: flex;
  justify-content: space-between;
}

/*#region Approval Users Tables */
#ApprovalUserProfileListTable .grid {
  -ms-grid-columns: 55px 1fr;
  grid-template-columns: 55px 1fr;
}

#ApprovalUserProfileListTable .srch.grid {
  -ms-grid-columns: 55px 1fr 2fr;
  grid-template-columns: 55px 1fr 2fr;
}

#ApprovalUserListTable .grid {
  -ms-grid-columns: 55px 2fr 2fr 40px 40px 40px 40px 40px 40px 40px;
  grid-template-columns: 55px repeat(2, 2fr) repeat(7, 40px);
}

#ApprovalUserListTable .th {
  height: 230px;
}

#ApprovalUserListTable .th div {
  top: 80px;
}

#ApprovalUserListTable .cutout {
  clip-path: polygon(0% 100%, 0 80%, 70% 80%, 71% 79%, 73% 76%, 74% 73%, 75% 68%, 79% 11%, 80% 6%, 81% 4%, 83% 2%, 85% 1%, 89% 0, 100% 0, 100% 100%);
  margin-top: -130px;
}

#ApprovalUserListTable > .cutout .td {
  margin-top: auto;
}

/*#endregion */
/*#region Allocation User Amount*/
#sampleTable {
  justify-content: center;
  border: solid 1px #000000;
  width: 300px;
}

#sampleTable .sampletr {
  width: 300px;
}

#sampleTable .sampletr .sampletd {
  justify-content: center;
  border: solid 1px #000000;
  width: 100px;
}

/*#endregion*/
/*#region SSO*/
#domainList > div:nth-child(2n+1) {
  background-color: #CCC;
}

#domainList div {
  padding: 5px 10px;
}

#domainList .disabled {
  color: red;
}

.editDomain {
  margin: 0px 20px;
  text-align: right;
  display: none;
}

.editDomain input {
  margin-right: 20px;
}

.SSOmodal label {
  width: 150px;
}

.vwCatalogs {
  display: none;
  background-color: #DDD;
  border-radius: 10px;
}

.vwCatalogs h4 {
  margin: 0px;
  border-bottom: 1px solid #000;
  padding: 0px 10px;
}

#SSOcatalogList > div {
  display: flex;
}

#SSOcatalogList .txt {
  padding: 0px 20px 0px 5px;
}

#SSOcatalogList .edit {
  display: none;
}

#SSOcatalogList .edit label {
  margin: 0px 5px;
  width: 110px;
}

#SSOcatalogList button {
  width: 100px;
  margin-left: 125px;
}

#SSOcatalogList form {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

#SSOcatalogList .rowa {
  background-color: #CCC;
}

#SSOcatalogList .rowc {
  background-color: #CCF;
  border-top: 1px solid #888;
}

#SSOcatalogList .rowc td {
  padding: 8px;
}

#SSOcatalogList th {
  padding: 0px 10px;
}

/*#endregion*/
/*#region Search Orders*/
#orderListGrid .grid {
  -ms-grid-columns: 9% 12% 12% 16% 12% 12% 9% 12%;
  grid-template-columns: 1fr 1fr 1.5fr 3fr 1fr 1fr 1fr 1fr;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap;
  word-break: break-all;
}

/*#endregion*/
/*#region Mailing List Search*/
#mailListGrid .grid {
  -ms-grid-columns: 30% 30% 30%;
  grid-template-columns: repeat(3, 30%);
}

/*#endregion*/
/*#region Stop Gap test*/
#stopGapList .grid {
  -ms-grid-columns: 55px 100px 100px 400px 200px 200px;
  grid-template-columns: 55px 100px 100px 400px 200px 200px;
}

#stopGapShoppingCartList .grid {
  -ms-grid-columns: 40px 70px 200px 450px 50px 80px 80px 80px;
  grid-template-columns: 40px 70px 200px 450px 50px 80px 80px 80px;
  grid-gap: 5px;
}

.stopGapModal {
  width: 1100px;
}

/*#endregion*/
#essendantLogShoppingCartList .grid {
  -ms-grid-columns: 125px 200px 50px 80px 80px 80px 150px 80px;
  grid-template-columns: 125px 200px 50px 80px 80px 80px 150px 80px;
  grid-gap: 5px;
}

/*#region Native Template*/
#entryFieldsTable .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr 1fr 40px 40px 40px 40px 40px;
  grid-template-columns: 55px repeat(4, 1fr) repeat(5, 40px);
}

#ComboOptions .grid {
  -ms-grid-columns: 50px 1fr 1fr 1fr;
  grid-template-columns: 50px 1fr 1fr 1fr;
  grid-gap: 5px;
}
#ComboOptions #ComboOptionList {
  max-height: 550px;
  overflow-y: auto;
}

/*#endregion*/
/*#region Shipping Tables */
#shippingProfTable .cutout {
  margin-top: -100px;
  clip-path: polygon(0% 100%, 0 75%, 48% 75%, 59% 74%, 61% 71%, 62% 68%, 63% 64%, 69% 9%, 70% 6%, 71% 4%, 72% 2%, 73% 1%, 75% 0, 100% 0, 100% 100%);
}

#shippingProfTable .grid {
  -ms-grid-columns: 55px 1fr 1fr 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px;
  grid-template-columns: 55px repeat(2, 1fr) repeat(11, 40px);
}

#shippingProfTable .th {
  height: 215px;
}

.cutout .th .td {
  align-self: flex-end;
}

#shippingProfTable .th div {
  top: 75px;
}

#shipChargesGrid .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr 1fr 1fr 40px;
  grid-template-columns: 55px repeat(5, 1fr) 40px;
}

#shipMethodGrid .grid {
  -ms-grid-columns: 55px 1fr 1fr;
  grid-template-columns: 55px repeat(2, 1fr);
}

#shipPricing .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr 1fr;
  grid-template-columns: 55px repeat(4, 1fr);
  grid-gap: 5px;
}

#ShipMethodProfile {
  display: flex;
  flex-flow: row nowrap;
  /*overflow-x:scroll;*/
}

.ShipMethodRow input {
  width: 100px;
}

.ShipMethodRow .th {
  text-align: center;
}

.ShipMethod .tr {
  display: flex;
  justify-content: center;
}

.ShipMethodRow {
  display: flex;
  flex-flow: row nowrap;
  /*justify-content:space-around;*/
  width: 100%;
  overflow-x: scroll;
}

.ShipMethod {
  width: 100%;
  /*max-width:100px;*/
}

.ShipMethod .th .form-control {
  font-weight: normal;
  font-size: smaller;
}

#ShipMethodProfile .th, #ShipMethodProfile .tr {
  min-height: 50px;
  padding-left: 5px;
  padding-right: 5px;
}

#ShipHighLow, #FixedPercent, #FixedPrice {
  width: 300px;
}

#ShipHighLow .th {
  display: flex;
  justify-content: center;
}

#ShipHighLow .td.percent {
  margin: 0 auto;
}

#ShipHighLow .grid {
  -ms-grid-columns: 25px 100px 100px 50px;
  grid-template-columns: 25px 100px 100px 50px;
}

.btn-list .btn + .btn {
  margin-left: 10px;
}

/*#region IE compatibility*/
@supports (-ms-ime-align: auto) {
  #shippingProfTable .cutout {
    margin-top: 50px;
  }
  #shippingProfTable .th {
    height: 0;
  }
}
/*#endregion*/
/*#endregion*/
/*#region handling tables*/
#handlingProfileGrid .grid {
  -ms-grid-columns: 55px 1fr 1fr 40px 40px 40px;
  grid-template-columns: 55px repeat(2, 1fr) repeat(3, 40px);
}

#handlingConnectionGrid .grid {
  -ms-grid-columns: 55px 1fr 2fr 2fr;
  grid-template-columns: 55px 1fr repeat(3, 2fr);
}

#HandValues .grid {
  -ms-grid-columns: 25px auto auto auto;
  grid-template-columns: 25px repeat(3, auto);
  grid-gap: 5px;
}

#HandValues .tr.form-group {
  display: flex;
}

.handPrice, .basePricePercent {
  margin-right: -15px;
  margin-left: -15px;
}

/*#endregion */
/*#region StoreSetup */
#StoreCatalog .grid {
  -ms-grid-columns: 55px 1fr 1fr 2fr;
  grid-template-columns: 55px 1fr 1fr 2fr;
}

#extraLinks .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr;
  grid-template-columns: 55px repeat(3, 1fr);
}

#contactFields .grid {
  -ms-grid-columns: 55px 1fr 1fr;
  grid-template-columns: 55px 1fr 1fr;
}

/*#endregion */
/*#region ItemSetup Tables */
#PriceOverride .grid {
  -ms-grid-columns: 55px 1fr 1fr 2fr;
  grid-template-columns: 55px repeat(4, 1fr);
}

#MinMaxTable .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr;
  grid-template-columns: 55px repeat(3, 1fr);
}

#PriceDisc .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr 1fr 1fr;
  grid-template-columns: 55px repeat(5, 1fr);
}

#ItemProfile .grid {
  -ms-grid-columns: 55px 1fr 3fr 1fr 1fr 1fr;
  grid-template-columns: 55px 1fr 3fr 1fr 1fr 1fr;
}

#ItemSpecs .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr 2fr 1fr;
  grid-template-columns: 55px 1fr 1fr 2fr 1fr;
}

#CatalogDisc .grid {
  -ms-grid-columns: 70px 1fr 1fr 1fr 1fr;
  grid-template-columns: 70px repeat(4, 1fr);
}

#CategoryList .grid {
  -ms-grid-columns: 85px 1fr 2fr;
  grid-template-columns: 85px 1fr 2fr;
}

#crcpoGrid .grid {
  -ms-grid-columns: 65px 1fr 1fr 1fr 1fr;
  grid-template-columns: 65px 1fr 1fr 1fr 1fr;
}

#ExtraImage .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr 100px;
  grid-template-columns: 55px repeat(3, 1fr) 100px;
}

#PriceBreak .grid {
  -ms-grid-columns: 2fr 2fr 2fr 2fr 1fr 2fr;
  grid-template-columns: repeat(4, 2fr) 1fr 2fr;
  grid-gap: 5px;
}

#PriceBreak .td input {
  /*width:100%;*/
}

#PriceBreak .td input + input {
  margin-left: 10px;
}

#PriceBreak.table {
  margin-bottom: 0;
}

#PriceBreak .th, #PriceBreak .tr {
  padding: 0 5px;
}

#oneFlow .grid {
  -ms-grid-columns: 90px 0.25fr 1fr 2fr 0.25fr;
  grid-template-columns: 90px 0.25fr 1fr 2fr 0.25fr;
}

/*#endregion */
/*#region Items*/
#itemCatalogProfileList .grid {
  -ms-grid-columns: 78px 1fr 1fr 1fr 1fr;
  grid-template-columns: 78px repeat(4, 1fr);
}

#itemCatalogProfileList .srch.grid {
  -ms-grid-columns: 55px 1fr 2fr;
  grid-template-columns: 55px 1fr 2fr;
}

#itemCatalogProfileItemsList .grid {
  -ms-grid-columns: 2fr 3fr 1fr 2fr 65px;
  grid-template-columns: 2fr 3fr 1fr 2fr 65px;
}
#itemCatalogProfileItemsList .grid .td {
  padding: 0 2px;
}

#itemCatalogProfileItemsList input[type=checkbox] {
  margin-left: auto;
  margin-right: auto;
}

#itemCatalogProfileItems {
  max-height: calc(100vh - 225px);
  overflow-y: auto;
}

#itemSpecsList .grid {
  -ms-grid-columns: 55px 1fr 2fr;
  grid-template-columns: 55px 1fr 2fr;
}

#itemSpecsList .srch.grid {
  -ms-grid-columns: 55px 1.5fr 2.5fr;
  grid-template-columns: 55px 1.5fr 2.5fr;
}

/*#endregion*/
/*#region Loading*/
.loadn {
  grid-column: 7/10;
  padding-top: 8px;
  padding-left: 10px;
}

.loadBox, .loadBoxBootstrap {
  padding: 20px;
  background-color: #FFF;
  border: 1px solid #000;
  height: 240px;
  margin-top: 80px;
  -ms-flex-item-align: start;
  align-self: flex-start;
  border-radius: 7px;
  -webkit-box-shadow: 5px 5px 9px #444;
  box-shadow: 5px 5px 9px #444;
}

.loadBox img, .loadBoxBootstrap img {
  width: 200px;
  height: 200px;
}

.loadBack, .loadBackBootstrap {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  z-index: 100;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
}

.loadBackBootstrap {
  margin-left: -15px;
}

.loadBoxBootstrap {
  margin-left: -15px;
}

.smallLoading {
  width: 30px;
  height: 30px;
  position: absolute;
  padding: 0px;
  margin: 0px 6px;
  top: -14px;
}

.smallLoadingContainer {
  position: absolute;
}

/*#endregion Loading*/
/*#region Saving*/
#saving-div {
  background-color: rgba(255, 255, 255, 0.7);
  height: 100%;
  width: 100%;
  position: absolute;
  z-index: 1000;
}

#saving-div-container {
  position: fixed;
  left: 50%;
  top: 37%;
}

.circle-loader {
  margin-bottom: 3.5em;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-left-color: #5cb85c;
  animation: loader-spin 1.2s infinite linear;
  position: relative;
  display: inline-block;
  vertical-align: top;
  border-radius: 50%;
  width: 7em;
  height: 7em;
}

.load-complete {
  -webkit-animation: none;
  animation: none;
  border-color: #5cb85c;
  transition: border 500ms ease-out;
}

.checkmark {
  display: none;
}
.checkmark.draw:after {
  animation-duration: 800ms;
  animation-timing-function: ease;
  animation-name: checkmark;
  transform: scaleX(-1) rotate(135deg);
}
.checkmark:after {
  opacity: 1;
  height: 3.5em;
  width: 1.75em;
  transform-origin: left top;
  border-right: 3px solid #5cb85c;
  border-top: 3px solid #5cb85c;
  content: "";
  left: 1.75em;
  top: 3.5em;
  position: absolute;
}

@keyframes loader-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes checkmark {
  0% {
    height: 0;
    width: 0;
    opacity: 1;
  }
  20% {
    height: 0;
    width: 1.75em;
    opacity: 1;
  }
  40% {
    height: 3.5em;
    width: 1.75em;
    opacity: 1;
  }
  100% {
    height: 3.5em;
    width: 1.75em;
    opacity: 1;
  }
}
/*#endregion*/
/*#region Sold-to/Ship-to */
#ShiptoListTable .grid, #SoldtoListTable .grid {
  -ms-grid-columns: 55px 1fr;
  grid-template-columns: 55px 1fr;
}

/*#endregion */
/*#region Image Manager*/
#file-explorer {
  padding: 0;
  border: solid 1px;
  min-height: 500px;
  width: 60%;
}
#file-explorer.grid {
  grid-template-columns: 250px 1fr;
}
#file-explorer.grid.tr {
  min-height: 30px;
  padding: 0.6em 1em;
}
#file-explorer.grid #folder-list {
  border-right: solid 1px;
  font-size: 1em;
}
#file-explorer.grid #folder-list h4 {
  padding-left: 1em;
}
#file-explorer.grid #folder-list ul {
  list-style: none;
}
#file-explorer.grid #folder-list ul .ImageFolder {
  cursor: pointer;
}
#file-explorer.grid #folder-list ul .ImageFolder.active {
  font-weight: bold;
}
#file-explorer.grid #folder-list ul .ImageFolder:hover {
  text-decoration: underline;
}
#file-explorer.grid #file-list {
  margin-bottom: 0;
  max-height: 500px;
  overflow-y: scroll;
}
#file-explorer.grid #file-list .sticky-header {
  position: sticky;
  top: 0;
}
#file-explorer.grid #file-list .grid {
  grid-template-columns: 1fr 100px 100px;
  padding-left: 1em;
}
#file-explorer.grid #file-list .grid.srch {
  grid-template-columns: 275px;
}
#file-explorer.grid #file-list .grid span {
  cursor: pointer;
}
#file-explorer.grid #file-list .grid span:hover {
  text-decoration: underline;
}

@media screen and (max-width: 1500px) {
  #file-explorer {
    width: 100%;
  }
}
/*#endregion*/
#SpecialsListTable .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr 1fr 1fr;
  grid-template-columns: 55px repeat(5, 1fr);
}

#SpecialGroupsListTable .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-columns: 55px repeat(6, 1fr);
}

h2 {
  /*padding-left: 15px;*/
}

.rst {
  padding: 10px 5px;
}

.rst .btn-sm {
  padding: 5px 3px;
}

.rst.color {
  padding: 0px 3px;
}

.td2 {
  width: 90px;
}

.sixty {
  width: 60px;
}

.glyphicon:hover {
  box-shadow: 0 0 9px yellow;
  border-radius: 3px;
  padding: 0;
  background-color: yellow;
  cursor: pointer;
}

.grey {
  opacity: 0.5;
}

/*#region REVISION ADMIN */
#batchCont {
  display: flex;
}

#batches {
  width: 50%;
  padding: 10px;
}

.bgrid {
  display: grid;
  grid-template-columns: 0.5fr 3fr 1fr 2fr 1fr;
  grid-gap: 5px;
  grid-auto-rows: minmax(25px, auto);
  border-bottom: 1px solid #888;
}

.bgrid div:first-child {
  padding: 3px 0 0 3px;
}

.bgrid:hover {
  cursor: pointer;
  background-color: paleturquoise;
}

#batchdetails {
  width: 50%;
  padding: 10px;
}

#batchdetails h2 {
  margin: 0;
  text-align: center;
  border-bottom: 1px solid #aaa;
}

#batchdetails h4 {
  background-color: #FF9;
  padding: 3px;
}

.chg {
  border: none;
}

.chg:hover {
  background-color: greenyellow;
  cursor: pointer;
}

.chgDet {
  display: none;
  grid-template-columns: 1fr 1fr;
  position: absolute;
  border: 1px solid red;
  padding: 10px;
  margin-top: -20px;
  margin-left: 50px;
  background-color: #FFF;
}

.changes {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}

.bChg {
  background-color: yellow;
}

#mvrev .active {
  background-color: #4c4;
  color: #000;
}

#mvrev h3 {
  margin: 0px;
  border-bottom: 1px solid #888;
}

#mvrev .btn {
  border: 1px solid #2e60d7;
  box-shadow: 0px 0px 4px #2e60d7 inset;
}

.saving {
  position: absolute;
  width: 100%;
  height: 100%;
  text-align: center;
  vertical-align: middle;
  background: rgba(0, 0, 0, 0.3);
  box-shadow: 0px 0px 20px #FFF inset;
  z-index: 10;
}

.options {
  margin-top: 10px;
  background-color: #EEE;
}

@media only screen and (max-width: 480px) {
  #batchCont {
    display: block;
  }
  #batches {
    width: 100%;
  }
  #batchdetails {
    width: 100%;
  }
}
/*#endregion Revision admin*/
.chbxToggles {
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 20px;
}
.chbxToggles .btn {
  margin: 0px !important;
}
.chbxToggles .active, .chbxToggles .btn-group .active {
  background-color: lightgreen;
}
.chbxToggles .focus, .chbxToggles .btn-group .focus {
  background-color: lawngreen !important;
}
.chbxToggles .disabled {
  pointer-events: none;
}

.wideToggles {
  -ms-grid-columns: 1fr 2fr;
  grid-template-columns: 1fr 2fr;
}
.wideToggles .btn-group {
  justify-content: flex-start;
}

.narrowToggles {
  -ms-grid-columns: 1fr 4fr;
  grid-template-columns: 1fr 4fr;
}
.narrowToggles .btn-group {
  justify-content: flex-start;
}

.enableswitch button:nth-child(2).active {
  background-color: red !important;
}

#gangdt {
  display: flex;
  justify-content: space-around;
}

#gangdt span {
  margin-top: 6px;
}

#altship {
  padding-top: 20px;
}

.firstSpan {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1/3;
  text-align: center;
}

/*.createGrid .grid {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    grid-row-gap: 10px;
    grid-column-gap: 20px;
    margin: 10px;
}*/
.createGrid .fullspan {
  grid-column: 1/3;
}

.createLeft {
  border-right: 1px solid #000;
}

.selection {
  width: 100%;
  text-align: left;
}

#emailApprovalList > div {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 4fr 2fr;
  grid-template-columns: 1fr 4fr 2fr;
}

/*#endregion Email Profile*/
/*#region   CRCPO Admin  */
#CRCPOFields {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 3px 1fr 3px 50px 3px 1fr 3px 60px 3px 60px 3px 60px 3px 60px 3px 70px 3px 70px;
  grid-template-columns: repeat(2, 1fr) 50px 1fr repeat(4, 60px) repeat(2, 70px);
  grid-gap: 3px;
  display: none;
}

#CRCPOFields div {
  font-weight: bold;
}

#CRCPOFields input[type=checkbox] {
  margin: auto;
}

/*#endregion CRCPO admin*/
#ddlList > div {
  display: grid;
  -ms-grid-columns: 50px 1fr 1fr 80px 80px;
  grid-template-columns: 50px 1fr 1fr 80px 80px;
  grid-gap: 3px;
  margin: 5px;
  -webkit-transition: opacity 2s ease-out 2s;
  -o-transition: opacity 2s ease-out 2s;
  transition: opacity 2s ease-out 2s;
}

#ddlList > div input {
  -webkit-transition: opacity 2s linear;
  -o-transition: opacity 2s linear;
  transition: opacity 2s linear;
}

/*#region Email Template */
#emailTempTable .grid {
  -ms-grid-columns: 55px 1fr 120px 1fr 2fr 1fr 1fr;
  grid-template-columns: 55px 1fr 120px 1fr 2fr 1fr 1fr;
  grid-gap: 3px;
}

@supports (-ms-ime-align: auto) {
  #emailTempTable .grid div:not(:first-child) {
    margin-left: 3px;
  }
}
#buttonTray button {
  margin: 3px 5px;
}

/*#endregion Email Template*/
/* PRIVILEGE ADMIN */
#container > div {
  margin: 0 20px;
}

.hdr {
  background-color: #DDD;
  padding: 8px;
}

.btn-dark {
  background-color: #444;
  color: #DDD;
}

#privdiv .btn-dark {
  margin: 3px 0;
  border-radius: 5px;
}

#privdiv #profiles {
  max-height: 410px;
  overflow-y: scroll;
}

#container .active {
  /*background-color: darkorange !important;
  color: #333;*/
}

#container .focus {
  /*color: #FFF !important;*/
}

#profiles {
  display: grid;
}

#errDiv {
  float: right;
  color: red;
  font-weight: bold;
  padding-right: 5px;
  text-align: right;
}

#errDivLeft {
  color: red;
  font-weight: bold;
  padding-right: 5px;
  text-align: right;
}

#pswdError {
  border-radius: 5px;
  padding: 5px;
  margin-bottom: 10px;
}

@supports (-ms-ime-align: auto) {
  #profiles {
    display: flex;
    flex-direction: column;
  }
}
/* EMAIL PROFILE ADMIN */
/*#region USER PROILE ADMIN */
#usrHdrImg2 {
  position: absolute;
  right: 0px;
  top: -80px;
  z-index: -5;
  width: 700px;
  height: 180px;
}

/*#endregion User Profile Admin*/
.MassReady {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-around;
}

.MassSave {
  float: left;
  margin-left: 20px;
  color: green;
  font-weight: bold;
}

.column {
  float: left;
  width: 33.33%;
}

.column3 {
  float: left;
  width: 33.33%;
  height: 50px;
  padding-left: 45px;
}

/* Clear floats after the columns */
.row3:after {
  content: "";
  display: table;
  clear: both;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

.middle {
  width: 50%;
}

#vwPwd {
  margin-left: 60px;
}

#divPwd {
  display: none;
  margin: 15px 0;
}

#divShowPwd {
  display: none;
  margin: 15px 0;
}

#btnSavePwd {
  margin-left: 20px;
}

#spanPwd {
  font-weight: bold;
  margin-left: 20px;
}

.printView {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 25% 10px 25% 10px 25%;
  grid-template-columns: repeat(3, 25%);
  grid-gap: 10px;
  grid-auto-rows: minmax(50px, auto);
}

.printView2 {
  overflow: hidden;
}

.printView2 .fld {
  margin-bottom: 15px;
}

.conf {
  float: right;
}

#h4SR {
  float: right;
  margin-right: 20px;
}

.modaltitle-right {
  float: right;
  margin-right: 20px;
}

.modaltitle-title {
  float: left;
}

#claimarea {
  padding: 10px;
  border-radius: 10px;
  background-color: #f2c6c6;
  display: none;
}

#claimarea h4 {
  border-bottom: 1px solid #888;
}

#claimarea .btn {
  box-shadow: 2px 2px 2px #aaa;
}

#claimarea .btn:hover {
  padding: 6px 12px;
}

#claimarea div {
  margin: 3px 0;
}

.modal-header {
  background-color: #8BB3D6;
}

/*  SECTIONS  */
.section {
  clear: both;
  padding: 0;
  margin: 0;
}

/*  COLUMN SETUP  */
.col {
  display: block;
  float: left;
  margin: 1% 0 1% 1.6%;
}

.col:first-child {
  margin-left: 0;
}

/*  GROUPING  */
.group:before,
.group:after {
  content: "";
  display: table;
}

.group:after {
  clear: both;
}

.group {
  zoom: 1; /* For IE 6/7 */
}

/*  GRID OF TWO  */
.span_2_of_2 {
  width: 100%;
}

.btn-group-row {
  display: flex;
  flex-direction: column;
}

.span_1_of_2 {
  width: 49.2%;
}

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
  .col {
    margin: 1% 0 1% 0;
  }
}
@media only screen and (max-width: 480px) {
  .span_2_of_2, .span_1_of_2 {
    width: 100%;
  }
}
/*#region Select2*/
.select2-container {
  display: flex !important;
}

.select2-container--default .select2-selection--single {
  font-size: 14px;
  position: relative;
  text-align: left;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  font-size: 14px;
  text-align: left;
}

.select2-results__option {
  text-align: left;
  font-size: 14px;
}

.select2scroll {
  max-height: 210px;
  overflow: auto;
}

.ralign {
  text-align: right;
}

span.select2-container--default span.select2-selection--single span.select2-selection__rendered {
  line-height: unset;
}

span.select2-container span.select2-selection--single {
  height: unset;
  min-height: 28px;
}

span.select2-container--default span.select2-selection--single {
  padding: 6px 12px;
}

@media screen and (min-width: 0\0 ) and (min-resolution: 72dpi) {
  span.select2-container span.select2-selection--single {
    min-height: 34px;
    height: auto !important;
    height: 34px;
  }
  span.select2-container--default span.select2-selection--single {
    padding: 4px;
  }
}
/*#endregion Select2*/
.textsizes {
  height: 28px;
  font-size: 14px;
}

.rowsplit {
  float: left;
  width: 50%;
}

.topcontainer {
  width: 100%;
  text-align: center;
}

.listbox {
  height: 130px;
  margin-top: 15px;
  text-align: center;
}

.listbox select {
  height: 100%;
}

.modaliframe {
  position: relative;
  height: 75vh;
  width: 100%;
  overflow: hidden;
  border-style: none;
  padding: 0px;
}

/* MEDIA QUERIES */
@media screen and (max-width: 1400px) {
  /*.usrListgrid {
      -ms-grid-columns: 55px 1fr 2fr 2fr 1fr 90px;
      grid-template-columns: 55px 1fr 2fr 2fr 1fr 90px;
  }

  .usrListgrid div:nth-child(n+7):nth-child(-n+11) {
      display: none;
  }

  .usrListgrid div {
      word-wrap: break-word;
  }

  .trgrid {
      -ms-grid-columns: 55px 1fr 2fr 2fr 1fr 85px;
      grid-template-columns: 55px 1fr 2fr 2fr 1fr 85px;
  }

  .trgrid div:nth-child(n+7) {
      display: none;
  }*/
}
@media screen and (max-width: 400px) {
  .table tbody tr td:nth-child(3) {
    display: none;
  }
  .table thead tr th:nth-child(3) {
    display: none;
  }
}
@media (max-width: 600px) {
  .column {
    width: 100%;
  }
}
/*#region accordion*/
.panel-heading {
  position: relative;
  cursor: pointer;
}

.panel-heading:hover {
  opacity: 0.8;
}
.panel-heading:hover .icon-dragable {
  background-color: darkgrey;
}

.panel-heading[data-toggle=collapse]:after {
  font-family: "Glyphicons Halflings";
  content: "\e072"; /* "play" icon */
  position: absolute;
  color: #b0c5d8;
  font-size: 18px;
  line-height: 22px;
  right: 20px;
  top: calc(50% - 10px);
  /* rotate "play" icon from > (right arrow) to down arrow */
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

.panel-heading[data-toggle=collapse].collapsed:after {
  /* rotate "play" icon from > (right arrow) to ^ (up arrow) */
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

/*#endregion accordion*/
@supports (-ms-ime-align: auto) {
  /*#usrPList .cutout {
      margin-top: 0px;
  }

  #usrList .cutout {
      margin-top: 0px;
  }*/
}
/*#region ace editor*/
.ace-editor {
  position: relative;
  height: 90%;
}

/*#endregion ace editor*/
.bogoCheckbox {
  margin: 10px 0px;
  float: right;
}

.acctUnits ul {
  list-style-type: none;
}

.acctUnits .grid {
  display: flex;
  margin: 10px 0px;
}

#unitMsg {
  float: right;
  color: red;
  font-weight: bold;
  padding-right: 5px;
  text-align: right;
}

.unitTxtBox {
  padding: 0px 10px 0px 0px;
  margin: 0px 5px 0px 0px;
}

#orderofUnit {
  text-align: center;
  padding: 0px;
}

.unitName {
  margin: auto auto auto 15px;
}

.unitHeaders {
  margin: 0px 15px;
  font-weight: bold;
}

#stopGapShoppingCartListAdmin .grid {
  -ms-grid-columns: 100px 400px 100px 100px 100px 100px;
  grid-template-columns: 100px 400px 100px 100px 100px 100px;
  grid-gap: 5px;
}

#stopGapShoppingCartListAdminTotal .grid {
  -ms-grid-columns: 150px 150px 150px 150px 150px;
  grid-template-columns: 150px 150px 150px 150px 150px;
  grid-gap: 5px;
}

#SearchProfilesGrid {
  display: inline-grid;
  float: none;
}

.resulthd, .resulttd {
  width: 100%;
}

#SearchProfilesGrid > .tr {
  display: inline-flex;
  width: 100%;
}

.resulthd {
  font-weight: bold;
}

.ui-datepicker {
  width: 300px;
  height: 300px;
  margin: 5px auto 0;
  font: 12pt Arial, sans-serif;
  display: none;
  /*-webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .5);
  -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .5);*/
}

.ui-datepicker table {
  width: 100%;
  background-color: #eee;
  border: solid 1px #aaa;
}

.ui-datepicker-header {
  background: #3399ff;
  color: #ffffff;
  border-width: 1px 0 0 0;
  border-style: solid;
  border-color: #111;
}

.ui-datepicker-title {
  text-align: center;
  font-size: 18px;
  padding: 0.5em;
}

.ui-datepicker-prev {
  float: left;
  cursor: pointer;
  background-position: center -30px;
}

.ui-datepicker-next {
  float: right;
  cursor: pointer;
  background-position: center 0px;
}

.ui-datepicker thead {
  background-color: #f7f7f7;
}

.ui-datepicker th {
  background-color: #808080;
  text-transform: uppercase;
  font-size: 8pt;
  color: #eee;
}

.ui-datepicker tbody td {
  padding: 0;
  border-right: 1px solid #aaa;
}

.ui-datepicker tbody td:last-child {
  border-right: 0px;
}

.ui-datepicker tbody tr:last-child {
  border-bottom: 0px;
}

.ui-datepicker a {
  text-decoration: none;
  color: #fff;
}

.ui-datepicker-prev.ui-corner-all, .ui-datepicker-next.ui-corner-all {
  margin: 0.8em 0.5em 0 0.5em;
  font-size: 14px;
}

.ui-datepicker td span, .ui-datepicker td a {
  display: inline-block;
  text-align: center;
  width: 30px;
  height: 30px;
  line-height: 30px;
  color: #ffffff;
}

.ui-datepicker-calendar .ui-state-default {
  background: linear-gradient(#999999, #737373);
  color: #ffffff;
  height: 40px;
  width: 100%;
}

.ui-datepicker-calendar .ui-state-hover {
  background: #33adff;
  color: #FFFFFF;
}

.ui-datepicker-calendar .ui-state-active {
  background: #33adff;
  -webkit-box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
  box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
  color: #e0e0e0;
  text-shadow: 0px 1px 0px #4d7a85;
  border: 1px solid #55838f;
  position: relative;
  margin: -1px;
}

.ui-datepicker-unselectable .ui-state-default {
  background: #D6E4BE;
  color: #000;
}

.itemdescname {
  overflow: hidden;
  max-height: 25px;
}
/*
    DEMO STYLE
*/
body {
  font-family: "Poppins", sans-serif;
  background: #fafafa;
}

p {
  font-family: "Poppins", sans-serif;
  font-size: 1.1em;
  font-weight: 300;
  line-height: 1.7em;
  color: #999;
}

a, a:hover, a:focus {
  text-decoration: none;
  transition: all 0.3s;
}

.navbar {
  background: #fff;
  border: none;
  border-radius: 0;
  margin-bottom: 40px;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
}

.navbar-btn {
  box-shadow: none;
  outline: none !important;
  border: none;
}

.versionHd {
  background-color: lightgreen;
  padding: 5px 20px;
}

.versionHd span {
  padding-left: 10px;
}

.versionActive {
  background-color: red;
}

.versionActive a {
  color: #FFF !important;
}

.topPad20 {
  margin-top: 20px;
}

.line {
  width: 100%;
  height: 1px;
  border-bottom: 1px dashed #ddd;
  margin: 40px 0;
}

.lineborderfile {
  border-bottom: 1px solid #ddd;
  width: 100%;
}

i, span {
  display: inline-block;
}

.bg-ltgray {
  background-color: #e4e4e4;
}

.bg-yellow {
  background-color: #337ab7;
}

.modalscroll {
  overflow-y: auto;
}

/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */
.wrapper {
  display: flex;
  align-items: stretch;
}

#sidebar {
  min-width: 250px;
  max-width: 250px;
  background: #3f3f3f;
  color: #3f3f3f;
  transition: all 0.3s;
}

#sidebar.active {
  min-width: 80px;
  max-width: 80px;
  text-align: center;
}

#sidebar.active .sidebar-header h3, #sidebar.active .CTAs {
  display: none;
}

#sidebar.active .sidebar-header strong {
  display: block;
}

#sidebar ul li a {
  text-align: left;
  color: white;
}

#sidebar.active ul li a {
  padding: 20px 10px;
  text-align: center;
  font-size: 0.85em;
}

#sidebar.active ul li a i {
  margin-right: 0;
  display: block;
  font-size: 1.8em;
  margin-bottom: 5px;
}

#sidebar.active ul ul a {
  padding: 10px !important;
}

#sidebar.active a[aria-expanded=false]::before, #sidebar.active a[aria-expanded=true]::before {
  top: auto;
  bottom: 5px;
  right: 50%;
  -webkit-transform: translateX(50%);
  -ms-transform: translateX(50%);
  transform: translateX(50%);
}

#sidebar .sidebar-header {
  padding: 20px;
  background: #3f3f3f;
  color: white;
}

#sidebar .sidebar-header strong {
  display: none;
  font-size: 1.8em;
}

#sidebar ul.components {
  padding: 20px 0;
  border-bottom: 1px solid #3f3f3f;
}

#sidebar ul li a {
  padding: 10px;
  font-size: 1.1em;
  display: block;
}

#sidebar ul li a:hover {
  color: #1677aa;
  background: #fff;
}

#sidebar ul li a i {
  margin-right: 10px;
}

#sidebar ul li.active > a, #sidebar a[aria-expanded=true] {
  color: #fff;
  background: #3f3f3f;
}

.column1 {
  float: left;
  width: 25%;
}

.columnhalf {
  float: left;
  width: 50%;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

.buttonaction {
  border-radius: 12px;
  background-color: #008cba;
  color: #FFFFFF;
}

nav a[data-toggle=collapse] {
  position: relative;
}
nav a[aria-expanded=false]::before, nav a[aria-expanded=true]::before {
  content: "\e259";
  display: block;
  position: absolute;
  right: 20px;
  font-family: "Glyphicons Halflings";
  font-size: 0.6em;
}
nav a[aria-expanded=true]::before {
  content: "\e260";
}

ul ul a {
  font-size: 0.9em !important;
  padding-left: 30px !important;
  background: #5d5d5d;
}

ul.CTAs {
  padding: 20px;
}

ul.CTAs a {
  text-align: center;
  font-size: 0.9em !important;
  display: block;
  border-radius: 5px;
  margin-bottom: 5px;
}

a.download {
  background: #fff;
  color: #7386D5;
}

a.article, a.article:hover {
  background: #6d7fcc !important;
  color: #fff !important;
}

/* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */
#content {
  padding: 20px;
  min-height: 100vh;
  transition: all 0.3s;
  width: 100%;
  max-width: calc(100% - 250px);
}

a.my-class {
  color: #008cba;
  text-decoration: underline;
}

a.my-class:active {
  color: #008cba;
  text-decoration: underline;
}

a.my-class:link {
  color: #008cba;
  text-decoration: underline;
}

a.my-class:visited {
  color: #008cba;
  text-decoration: underline;
}

a.my-class:hover {
  color: #000000;
  text-decoration: underline;
}

/* ---------------------------------------------------
    Image Uploader Styles
----------------------------------------------------- */
.image-upload.form-control {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border: 2px dashed #ccc;
  background-color: #f5f5f5;
  margin-top: 0.3em;
  height: auto;
  padding: 1em;
}
.image-upload.form-control.image-drop {
  background-color: #e5e5e5;
}
.image-upload.form-control > div:not(:last-child) {
  margin-bottom: 1em;
}
.image-upload.form-control .glyphicon:hover {
  background-color: unset;
  cursor: default;
  box-shadow: none;
}
.image-upload.form-control .upload-text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.image-upload.form-control .upload-message {
  text-align: center;
  width: 75%;
}
.image-upload.form-control .btn {
  align-self: center;
}

/* ---------------------------------------------------
    ADMIN TABLES STYLE
----------------------------------------------------- */
#colDiv {
  display: none;
  position: absolute;
  left: 585px;
  margin-top: -100px;
  background-color: lightgreen;
  padding: 9px;
  border: 1px solid green;
  box-shadow: -4px 2px 7px #888;
  transition: visibility 0s, opacity 0.5s linear;
}

.smalltextbox {
  width: 150px;
}

.imgRdoBtn {
  display: inline-flex;
  margin: 5px 0px;
}

#itemCalloutImages {
  margin-right: 5px;
}

/* ---------------------------------------------------
    MEDIAQUERIES
----------------------------------------------------- */
@media (max-width: 768px) {
  #content {
    max-width: 100%;
  }
  #sidebar {
    min-width: 80px;
    max-width: 80px;
    text-align: center;
    margin-left: -80px !important;
  }
  a[aria-expanded=false]::before, a[aria-expanded=true]::before {
    top: auto;
    bottom: 5px;
    right: 50%;
    -webkit-transform: translateX(50%);
    -ms-transform: translateX(50%);
    transform: translateX(50%);
  }
  #sidebar.active {
    margin-left: 0 !important;
  }
  #sidebar .sidebar-header h3, #sidebar .CTAs {
    display: none;
  }
  #sidebar .sidebar-header strong {
    display: block;
  }
  #sidebar ul li a {
    padding: 20px 10px;
  }
  #sidebar ul li a span {
    font-size: 0.85em;
  }
  #sidebar ul li a i {
    margin-right: 0;
    display: block;
  }
  #sidebar ul ul a {
    padding: 10px !important;
  }
  #sidebar ul li a i {
    font-size: 1.3em;
  }
  #sidebar {
    margin-left: 0;
  }
  #sidebarCollapse span {
    display: none;
  }
}
@media (max-width: 600px) {
  .column {
    width: 100%;
  }
  #bs-example-navbar-collapse-1 {
    position: absolute;
    top: 0px;
    width: auto;
    right: 0px;
  }
}
#resendInfoContainerMain #resendInfoGetOrderForm {
  margin-left: 1rem;
  margin-right: 1rem;
}
#resendInfoContainerMain #resendInfoGetOrderForm span.well {
  margin-right: 1rem;
  padding-left: 1em;
  padding-right: 1em;
  font-weight: bold;
  font-size: 1.25em;
}
#resendInfoContainerMain #resendInfoContainerOrderInformation {
  /* Inline #4 | http://localhost:64029/ResendInfo */
}
#resendInfoContainerMain #resendInfoContainerOrderInformation li > a {
  margin-left: 1rem;
  margin-right: 1rem;
  border: 1px solid rgba(0, 0, 0, 0.075);
}
#resendInfoContainerMain #resendInfoContainerOrderInformation #resendInfoContainerselectEmails,
#resendInfoContainerMain #resendInfoContainerOrderInformation #resendInfoContainerselectXml,
#resendInfoContainerMain #resendInfoContainerOrderInformation #resendInfoContainerselectTemplateIntegration {
  /*            .input-group {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
  }*/
}
#resendInfoContainerMain #resendInfoContainerOrderInformation #resendInfoContainerselectEmails form,
#resendInfoContainerMain #resendInfoContainerOrderInformation #resendInfoContainerselectXml form,
#resendInfoContainerMain #resendInfoContainerOrderInformation #resendInfoContainerselectTemplateIntegration form {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  row-gap: 3em;
  -webkit-column-gap: 2em;
  -moz-column-gap: 2em;
  column-gap: 2em;
  width: 100%;
}
#resendInfoContainerMain #resendInfoContainerOrderInformation #resendInfoContainerselectEmails > div,
#resendInfoContainerMain #resendInfoContainerOrderInformation #resendInfoContainerselectXml > div,
#resendInfoContainerMain #resendInfoContainerOrderInformation #resendInfoContainerselectTemplateIntegration > div {
  max-width: 100%;
}
#resendInfoContainerMain #resendInfoContainerOrderInformation #resendemail .input-group,
#resendInfoContainerMain #resendInfoContainerOrderInformation #resendxml .input-group,
#resendInfoContainerMain #resendInfoContainerOrderInformation #resendTemplateIntegration .input-group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
#resendInfoContainerMain #resendInfoContainerOrderInformation div.selectEmailTypeCol,
#resendInfoContainerMain #resendInfoContainerOrderInformation div.selectXmlTypeCol,
#resendInfoContainerMain #resendInfoContainerOrderInformation div.selectTemplateIntegrationTypeCol {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 0;
  -ms-flex: 0 1 350px;
  flex: 0 1 350px;
  row-gap: 2em;
}
#resendInfoContainerMain #resendInfoContainerOrderInformation div.selectEmailTypeCol input[type=checkbox],
#resendInfoContainerMain #resendInfoContainerOrderInformation div.selectXmlTypeCol input[type=checkbox],
#resendInfoContainerMain #resendInfoContainerOrderInformation div.selectTemplateIntegrationTypeCol input[type=checkbox] {
  margin-right: 0.75rem;
}
#resendInfoContainerMain #resendInfoContainerOrderInformation div.resendEmailFormBtnContainer,
#resendInfoContainerMain #resendInfoContainerOrderInformation div.resendXmlFormBtnContainer,
#resendInfoContainerMain #resendInfoContainerOrderInformation div.resendTemplateIntegrationFormBtnContainer {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 100%;
  flex: 1 1 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
#resendInfoContainerMain #resendInfoContainerOrderInformation div#resendEmailFormResult,
#resendInfoContainerMain #resendInfoContainerOrderInformation div#resendXmlFormResult,
#resendInfoContainerMain #resendInfoContainerOrderInformation div#resendTemplateIntegrationFormResult {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 100%;
  flex: 1 1 100%;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
#resendInfoContainerMain #resendInfoContainerOrderInformation div.previewEmailTypeCol,
#resendInfoContainerMain #resendInfoContainerOrderInformation div.previewXmlTypeCol,
#resendInfoContainerMain #resendInfoContainerOrderInformation div.previewTemplateIntegrationTypeCol {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
#resendInfoContainerMain #resendInfoContainerOrderInformation div.previewEmailTypeCol legend,
#resendInfoContainerMain #resendInfoContainerOrderInformation div.previewXmlTypeCol legend,
#resendInfoContainerMain #resendInfoContainerOrderInformation div.previewTemplateIntegrationTypeCol legend {
  font-size: 1.15em;
}
#resendInfoContainerMain #resendInfoContainerOrderInformation div.previewEmailTypeCol li,
#resendInfoContainerMain #resendInfoContainerOrderInformation div.previewXmlTypeCol li,
#resendInfoContainerMain #resendInfoContainerOrderInformation div.previewTemplateIntegrationTypeCol li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#resendInfoContainerMain #resendInfoContainerOrderInformation div.previewEmailTypeCol span,
#resendInfoContainerMain #resendInfoContainerOrderInformation div.previewXmlTypeCol span,
#resendInfoContainerMain #resendInfoContainerOrderInformation div.previewTemplateIntegrationTypeCol span {
  width: 150px;
}
#resendInfoContainerMain #resendInfoContainerOrderInformation #resendOmec form {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
#resendInfoContainerMain #resendInfoContainerOrderInformation #resendOmec #resendOmecFormBtnContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.5em;
}
#resendInfoContainerMain .hide-loading {
  display: unset;
}
#resendInfoContainerMain .show-loading {
  display: none;
}
#resendInfoContainerMain.loading .hide-loading {
  display: none;
}
#resendInfoContainerMain.loading .show-loading {
  display: unset;
}

#resendInfoModalEmailMsgInfo,
#resendInfoModalXmllMsgInfo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: baseline;
  -ms-flex-align: baseline;
  align-items: baseline;
}
#resendInfoModalEmailMsgInfo span,
#resendInfoModalXmllMsgInfo span {
  -webkit-box-flex: 0;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
}
#resendInfoModalEmailMsgInfo span.well,
#resendInfoModalXmllMsgInfo span.well {
  margin-right: auto;
  margin-left: 0;
  margin-bottom: 0.5em;
}
#resendInfoModalEmailMsgInfo span.br-container,
#resendInfoModalXmllMsgInfo span.br-container {
  margin-right: 100%;
}
#resendInfoModalEmailMsgInfo .resendMsgInfoLabel,
#resendInfoModalXmllMsgInfo .resendMsgInfoLabel {
  width: 70px;
}

.example {
  display: -ms-grid;
  display: grid;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background: -o-linear-gradient(top, white, black);
  background: -webkit-gradient(linear, left top, left bottom, from(white), to(black));
  background: linear-gradient(to bottom, white, black);
}
/*#region USER ADMIN */
.usrListgrid, #usrListgrid .grid {
  -ms-grid-columns: 55px 1fr 2fr 2fr 1fr 90px 35px 35px 35px;
  grid-template-columns: 55px 1fr 2fr 2fr 1fr 90px repeat(3, 35px);
  grid-auto-rows: minmax(50px, auto);
  grid-gap: 5px;
  vertical-align: bottom;
  position: relative;
}

#usrHdrImg {
  position: absolute;
  right: 0px;
  top: -80px;
  z-index: -5;
}

.usrRow span {
  margin-right: 7px;
}

.usrRow div {
  text-align: right;
}

.usrRow .glyphicon-remove:nth-child(3) {
  border-radius: 5px;
  background: -webkit-radial-gradient(white, #ffc3c3, #e04f4f);
  background: -o-radial-gradient(white, #ffc3c3, #e04f4f);
  background: radial-gradient(white, #ffc3c3, #e04f4f);
  padding: 0 2px;
  margin-left: 6px;
  border: 1px solid red;
}

#usrList .cutout {
  margin-top: -100px;
  clip-path: polygon(0% 100%, 0 75%, 80% 75%, 81% 74%, 83% 71%, 84% 68%, 85% 64%, 91% 9%, 92% 6%, 93% 4%, 94% 2%, 95% 1%, 97% 0, 100% 0, 100% 100%);
}

#usrList .th {
  height: 120px;
}

#usrList .tr {
  -ms-grid-columns: 55px 1fr 2fr 2fr 1fr 85px 35px 35px 35px;
  grid-template-columns: 55px 1fr 2fr 2fr 1fr 85px repeat(3, 35px);
  grid-gap: 5px;
  grid-auto-rows: minmax(25px, auto);
  border-bottom: 1px solid #888;
}

#claimarea {
  padding: 10px;
  border-radius: 10px;
  background-color: #f2c6c6;
  display: none;
}

#claimarea h4 {
  border-bottom: 1px solid #888;
}

#claimarea .btn {
  box-shadow: 2px 2px 2px #aaa;
}

#claimarea .btn:hover {
  padding: 6px 12px;
}

#claimarea div {
  margin: 3px 0;
}

#clmLoading {
  text-align: center;
}

/*#endregion*/
#essendantListgrid .grid {
  -ms-grid-columns: 55px 100px 1fr 1fr 1fr 1fr;
  grid-template-columns: 55px 100px 1fr 1fr 1fr 1fr;
  grid-auto-rows: minmax(50px, auto);
  grid-gap: 5px;
  vertical-align: bottom;
  position: relative;
}

/*#region USER PROILE ADMIN */
#usrPList .grid {
  -ms-grid-columns: 55px 1fr 90px 102px 35px 35px 35px 35px 35px 35px 35px 35px 35px 35px 35px 35px 35px 35px 35px;
  grid-template-columns: 55px 1fr 90px 102px repeat(16, 25px);
  grid-gap: 5px;
  vertical-align: bottom;
  position: relative;
}

/*#usrPList .tr.grid, #usrPList .srch.grid {
    grid-template-columns: 55px 1fr 85px 95px repeat(13,35px);
    grid-gap: 5px;
    grid-auto-rows: minmax(25px, auto);
    border-bottom: 1px solid #888;
}*/
#usrPList .cutout {
  clip-path: polygon(0% 100%, 0 75%, 50% 75%, 51% 74%, 53% 71%, 54% 68%, 55% 64%, 61% 9%, 62% 6%, 63% 4%, 64% 2%, 65% 1%, 67% 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);
  margin-top: -120px;
  height: 160px;
}

/*Mass User Profile Go Live*/
#usrPmultList {
  -ms-grid-columns: 1fr 10px 1fr;
  grid-template-columns: 1fr 10px 1fr;
  max-height: 500px;
  overflow-y: scroll;
}

.usrPmultGrid .grid {
  -ms-grid-columns: 70px 1fr 90px 55px;
  grid-template-columns: 70px 1fr 90px 55px;
  grid-gap: 5px;
  vertical-align: bottom;
  position: relative;
}

.usrPmultGrid .active {
  box-shadow: 0px 0px 12px red inset;
}

#srchPanel {
  background-color: #ABC;
  padding: 10px;
  border-radius: 5px;
  border: 1px solid #AAF;
}

#srchPanel .title {
  font-weight: bold;
  font-size: 20px;
}

#srchPanel .srchRow {
  display: flex;
}

#srchPanel .srchRow div {
  margin: 0px 10px;
}

#srchPanel .srchRow div:last-child {
  margin: 20px 0px 0px 30px;
}

#tmpUsers .usrRow:nth-child(2n) {
  background-color: #DDD;
}

.usrRow span {
  margin-right: 7px;
}

.usrRow div {
  text-align: right;
}

.usrRow .glyphicon-remove:nth-child(3) {
  border-radius: 5px;
  background: radial-gradient(white, #ffc3c3, #e04f4f);
  padding: 0px 2px;
  margin-left: 6px;
  border: 1px solid red;
}

#react-userproflist #tmpUsers .transferToContainer .select2 .selection {
  width: 100% !important;
}
#react-userproflist #tmpUsers .transferToContainer .row {
  border: none !important;
  background-color: transparent !important;
}
#react-userproflist #tmpUsers .transferToContainer label {
  padding-right: 0;
}
#react-userproflist #tmpUsers .transferToContainer span.select2 {
  height: 34px;
}

/*#endregion*/
/*#region CONNECTION ADMIN */
#connectionlist .grid {
  -ms-grid-columns: 55px 55px 1fr 1fr 1fr 1fr 60px 1fr 1fr 100px;
  grid-template-columns: 55px 55px repeat(7, 1fr) 100px;
}

.OSmodal {
  width: 500px;
}

#deleteOSSetup {
  margin: 15px;
  border: 5px solid red;
  background-color: #FCC;
}

#deleteOSSetup > p {
  color: #000;
}

#deleteOSSetup > h2 {
  margin-top: 0px;
  background-color: #F44;
}

.displayOrder {
  width: 45px;
}

.matchSelect2Margin {
  margin-bottom: 20px;
}

#callbackMsg {
  padding-left: 15px;
  font-weight: bold;
}

/*#endregion connection admin*/
/*ACES USERS*/
#acesUsersIndexErrorMsg {
  margin-left: 10px;
  font-weight: bold;
}

#editUserModal .row.col-sm-4 {
  border: none !important;
}
#editUserModal #userEditCCExpirationDateContainer .form-group {
  margin-left: 10px;
}
#editUserModal #userEditCCExpirationDateContainer label {
  padding-right: 5px;
}
#editUserModal #userEditCCExpirationDateContainer select {
  width: 70px;
}

#editUserProfileModal {
  overflow-y: scroll;
}

/*#accountingUnitModal{
    overflow-y: scroll;
}*/
/* User Customer List*/
#usrCustList {
  display: grid;
  grid-template-columns: 1fr 100px 1fr;
}

#usrCustList h3 {
  text-align: center;
}

#usrCustFilter {
  text-align: center;
  margin-bottom: 10px;
}

.custlist {
  max-height: 400px;
  overflow-y: auto;
}

.custlist div:hover {
  cursor: pointer;
  background-color: #ccc;
}

.custlist div.active {
  background-color: #5c67eb;
}

/*END ACES USERS*/
/*#region EMAIL PROFILE */
#emailProflist > div {
  -ms-grid-columns: 55px 1fr 1fr 1fr 1fr 70px 70px;
  grid-template-columns: 55px repeat(4, 1fr) 70px 70px;
}

#emailProflist > div > div:nth-child(n+6) {
  text-align: center;
}

#EmailLinkList {
  overflow-y: initial;
}
#EmailLinkList > .tr.grid {
  background-color: #CCC;
}
#EmailLinkList > .tr.grid .th:last-child {
  margin-right: -15px;
}
#EmailLinkList > .tr.grid, #EmailLinkList > .grid.srch {
  padding-right: 15px;
}
#EmailLinkList .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr 1fr 100px;
  grid-template-columns: 55px repeat(4, 1fr) 100px;
}
#EmailLinkList #EmailLinkListModalScrollContainer {
  max-height: calc(100vh - 375px);
  overflow-y: auto;
}

/*IE Compatibility*/
@supports (-ms-ime-align: auto) {
  #usrPList .grid div:not(:first-child), invitaionListTable .grid div:not(:first-child) {
    margin-left: 5px;
  }
  #usrPList .grid div:not(:first-child), salesRepLookupList .grid div:not(:first-child) {
    margin-left: 5px;
  }
  #usrList .cutout, #usrPList .cutout {
    margin-top: 0px;
  }
  #usrPList .grid {
    -ms-grid-columns: 55px 1fr 90px 105px 35px 35px 35px 35px 35px 35px 35px 35px 35px 35px 35px 35px 35px 35px 35px;
  }
}
/*#endregion EMAIL PROFILE*/
/*#region User Invitations*/
#invitaionListTable .grid {
  -ms-grid-columns: 55px 1fr 2fr 2fr 1fr 1fr 55px 40px 40px 40px;
  grid-template-columns: 55px 1fr 2fr 2fr 1fr 1fr 55px repeat(3, 40px);
  grid-gap: 5px;
}

#invitaionListTable .td.url {
  word-break: break-word;
}

/*#endregion User Invitations*/
/* Sales Rep */
#salesreplist {
  grid-template-columns: 120px 100px 1fr;
}

#salesreplist .srch {
  padding: 5px;
}

#salesreplist input {
  width: 100%;
}

#salesRepLookupList .grid {
  -ms-grid-columns: 55px 1fr 2fr 2fr 1fr 1fr 55px 40px 40px 40px;
  grid-template-columns: 55px 1fr 2fr 2fr 1fr 1fr 55px repeat(3, 40px);
  grid-gap: 5px;
}

.modalErrMsg {
  padding-left: 1em;
  padding-top: 1em;
}

/* END Sales Rep*/
/*#region Mass Load*/
#usersNotImported .grid {
  padding: 0;
}
#usersNotImported .td {
  text-align: center;
  border: 1px solid;
}

/*#endregion Mass Load*/
/*region UserMassUpdate*/
#UserUpdateList .grid {
  -ms-grid-columns: 55px 15px 25% 25% 25%;
  grid-template-columns: 55px 15px 25% 25% 25%;
  grid-gap: 5px;
}

/*endregion UserMassUpdate*/
/* MEDIA QUERIES */
@media screen and (max-width: 1400px) {
  #usrPList .grid {
    grid-template-columns: 55px 1fr 85px 95px repeat(15, 35px);
  }
  #usrPList .grid div:nth-child(n+15) {
    display: none;
  }
  #usrPList .grid {
    grid-template-columns: 55px 1fr 90px 102px repeat(15, 35px);
  }
  #usrPList .grid div:nth-child(n+15):nth-child(-n+19) {
    display: none;
  }
  #usrListgrid .grid {
    grid-template-columns: 55px 1fr 2fr 2fr 1fr 90px;
  }
  #usrList .grid div:nth-child(n+7):nth-child(-n+11) {
    display: none;
  }
  #usrListgrid div, #usrListgrid {
    word-wrap: break-word;
  }
  #usrList .tr {
    grid-template-columns: 55px 1fr 2fr 2fr 1fr 85px;
  }
  #usrList .tr div:nth-child(n+7) {
    display: none;
  }
}
@media screen and (max-width: 1200px) {
  #usrPList .grid {
    grid-template-columns: 55px 1fr 85px 95px repeat(7, 35px);
  }
  #usrPList .grid div:nth-child(n+12) {
    display: none;
  }
  .usrPListgrid {
    grid-template-columns: 55px 1fr 90px 102px repeat(7, 35px);
  }
  #usrPList .grid div:nth-child(n+12):nth-child(-n+19) {
    display: none;
  }
}
@media screen and (max-width: 900px) {
  #usrPList .grid {
    grid-template-columns: 55px 1fr 85px;
  }
  #usrPList .grid div:nth-child(n+4) {
    display: none;
  }
  .usrPListgrid {
    grid-template-columns: 55px 1fr 90px;
  }
  #usrPList .grid div:nth-child(n+4):nth-child(-n+19) {
    display: none;
  }
}
@media screen and (max-width: 650px) {
  .table tbody tr td:nth-child(2) {
    display: none;
  }
  .table thead tr th:nth-child(2) {
    display: none;
  }
  #usrListgrid .grid {
    grid-template-columns: 55px 1fr 1fr;
  }
  #usrListgrid .grid div:nth-last-child(n+4) {
    display: none;
  }
  #usrList .tr {
    grid-template-columns: 55px 1fr 1fr;
  }
  #usrList .tr div:nth-child(n+4) {
    display: none;
  }
  #pageContainer {
    grid-template-columns: 1fr 50px;
  }
}
@media only screen and (max-width: 480px) {
  #connectionlist > div {
    -ms-grid-columns: 55px 30px 1fr 50px;
    grid-template-columns: 55px 30px 1fr 50px;
  }
  #connectionlist > div div:nth-child(n+4):nth-child(-n+8) {
    display: none;
  }
  .createGrid {
    display: block;
  }
  .createLeft {
    border-bottom: 1px solid #000;
  }
}
/* VENDOR EMAIL SETUP ADMIN */
#vendorEmailSetupListgrid .grid {
  -ms-grid-columns: 55px 1fr 1fr 1fr 1fr 55px 55px;
  grid-template-columns: 55px repeat(4, 1fr) 55px 55px;
  grid-auto-rows: minmax(50px, auto);
  vertical-align: bottom;
  position: relative;
}

#vendorEmailSetupList .cutout {
  margin-top: -120px;
  clip-path: polygon(0% 100%, 0 75%, 50% 75%, 51% 74%, 53% 71%, 54% 68%, 55% 64%, 61% 9%, 62% 6%, 63% 4%, 64% 2%, 65% 1%, 67% 0, 100% 0, 100% 100%);
  height: 160px;
}

.trVendorGrid {
  -ms-grid-columns: 55px 1fr 1fr 1fr 1fr 55px 55px;
  grid-template-columns: 55px repeat(4, 1fr) 55px 55px;
  grid-gap: 5px;
  grid-auto-rows: minmax(25px, auto);
  border-bottom: 1px solid #888;
}

#vendorEmailSetupList .trVendorGrid:nth-child(2n+1) {
  background-color: #E4E4E4;
}

/*#region aTION ADMIN */
#connectionlist .grid {
  -ms-grid-columns: 55px 55px 1fr 1fr 1fr 1fr 1fr 1fr 1fr 100px;
  grid-template-columns: 55px 55px repeat(7, 1fr) 100px;
}

.OSmodal {
  width: 500px;
}

#deleteOSSetup {
  margin: 15px;
  border: 5px solid red;
  background-color: #FCC;
}

#deleteOSSetup > p {
  color: #000;
}

#deleteOSSetup > h2 {
  margin-top: 0px;
  background-color: #F44;
}

.displayOrder {
  width: 45px;
}

/*#endregion connection admin*/
/* MEDIA QUERIES */
@media screen and (max-width: 1400px) {
  /*.trVendorGrid {
      grid-template-columns: 55px 1fr 85px repeat(11,35px);
  }

  .trVendorGrid div:nth-child(n+15) {
      display: none;
  }

  #vendorEmailSetupListgrid {
      grid-template-columns: 55px 1fr 90px repeat(11,40px);
  }

  #vendorEmailSetupListgrid div:nth-child(n+15):nth-child(-n+19) {
      display: none;
  }*/
}
@media screen and (max-width: 1200px) {
  .trVendorGrid {
    grid-template-columns: 55px repeat(2, 1fr) repeat(2, 55px);
  }
  .trVendorGrid div:nth-child(n+3):nth-child(n+3):nth-child(-n+4) {
    display: none;
  }
  #vendorEmailSetupListgrid {
    grid-template-columns: 55px repeat(2, 1fr) repeat(2, 55px);
  }
  #vendorEmailSetupListgrid div:nth-child(n+3):nth-child(-n+4) {
    display: none;
  }
}
@media screen and (max-width: 900px) {
  #vendorEmailSetupList .cutout {
    margin-top: 0;
    clip-path: none;
  }
  .trVendorGrid {
    grid-template-columns: 55px 1fr 85px;
  }
  .trVendorGrid div:nth-child(n+4) {
    display: none;
  }
  #vendorEmailSetupListgrid {
    grid-template-columns: 55px 1fr 90px;
  }
  #vendorEmailSetupListgrid div:nth-child(n+4):nth-child(-n+19) {
    display: none;
  }
}
@media screen and (max-width: 650px) {
  .table tbody tr td:nth-child(2) {
    display: none;
  }
  .table thead tr th:nth-child(2) {
    display: none;
  }
}
@media only screen and (max-width: 480px) {
  /*#connectionlist > div {
      -ms-grid-columns: 55px 30px 1fr 50px;
      grid-template-columns: 55px 30px 1fr 50px;
  }

  #connectionlist > div div:nth-child(n+4):nth-child(-n+8) {
      display: none;
  }

  .createGrid {
      display: block;
  }

  .createLeft {
      border-bottom: 1px solid #000;
  }*/
}
/*IE Compatibility*/
@supports (-ms-ime-align: auto) {
  #vendorEmailSetupList .cutout {
    margin-top: 0px;
  }
  #trVendorGrid .grid div:not(:first-child) {
    margin-left: 5px;
  }
}

/*# sourceMappingURL=main-client.css.map*/