ol {
 list-style-type: none;
 margin-bottom: 10px;
 padding-left: 0px;
 cursor: pointer;
 font-size: 14px;
}

.cat-top{
	display: flex;
	background: #f9f9f9;
	border-bottom: 1px solid #ccc;
	padding: 0.5rem;
}

.cat-top-click {
	width: 100%;
}

.cat-top .btn-danger {
	margin-left: 4px;
}

.categories .list table.table td, .categories .list table.table th {
	vertical-align: middle;
}

.row-clicker {
	display: flex;
	align-items: center;
}

.row-clicker-click {
	width: 100%;
}

.row-clicker-click > img {
	max-width: 50px;
    max-height: 50px;
    object-fit: contain;
}

ol li {
	margin-bottom: 10px;
	/*margin-left: 20px;*/
	cursor: pointer;
   }

.categories .list .brands {
	padding-right: 0.5rem;
	margin-bottom: 0.5rem;
}

.categories .list .brands hr {
	margin-top: 1rem;
}

.categories .list .delete-brand {
	margin-left: 4px;
}
/*
.prod-lvl{
	/*margin-left: 20px !important;
}
*/

.list{
	margin: 5px 0px;
	display: none;
}

.errorTxt{
	color: red;
	font-style: italic;
	font-size: 12px;
	font-weight: bold;
	display: none;
}

.checkBoxWrapper{
	width: 300px;
	float: left;
}

#shopSelection{
	width: 100%;
}

#marketingButtonWrapper{
	float: right;
}

#select-all{
	float: left;
	padding-right: 20px;

}

.refresh{
	float: right;
	cursor: pointer;
}

.reload{
	float: left;
	margin-right: 5px;
}

.select-regions, .select-shops, .send-sms{
	float: right;
	padding-top: 5px;
	padding-right: 20px;
	cursor: pointer;
}

#totalsWrapper{
	font-size: 11px;
	font-weight: bold;
}

#orderButtons, #offer-detail-buttons{
	float: right;
}

#datePickerSelect{
	width: 300px;
}

#statementButton{
  cursor: pointer;
}

input.product-price{
	width: 50px;
}

@media print {
    .non-printable, .fancybox-outer { display: none; }
    .printable, #printDiv {
        display: block;
        font-size: 26pt;
    }
  }

  .autocomplete {
	/*the container must be positioned relative:*/
	position: relative;
	display: inline-block;
  }

  .autocomplete-items {
	position: absolute;
	border: 1px solid #d4d4d4;
	border-bottom: none;
	border-top: none;
	z-index: 99;
	/*position the autocomplete items to be the same width as the container:*/
	top: 100%;
	left: 0;
	right: 0;
  }
  .autocomplete-items div {
	padding: 10px;
	cursor: pointer;
	background-color: #fff;
	border-bottom: 1px solid #d4d4d4;
  }
  .autocomplete-items div:hover {
	/*when hovering an item:*/
	background-color: #e9e9e9;
  }
  .autocomplete-active {
	/*when navigating through the items using the arrow keys:*/
	background-color: DodgerBlue !important;
	color: #ffffff;
  }

  .ui-autocomplete-loading {
    background: white url('../img/loader.gif') right center no-repeat;
  }

  .region-select-box{
	  background-color: rgba(243, 242, 242, 0.933);
	  padding: 2px 5px;
	  margin-right: 3px;
	  margin-bottom: 3px;
	  border: solid 1px rgba(146, 146, 146, 0.933);
	  cursor: pointer;
  }
  .region-select-box:hover{
	background-color: rgba(255, 255, 255, 0.974);
  }

  .region-remove{
	  float: right;
	  padding: 0px 0px 0px 3px;
  }

  #orders-pending{
	  position: relative;
  }

  #orders.table-striped>tbody>tr.row-inactive {
    background-color: #ffd0d0 !important;
  }

  #total-pending{
	  position: absolute;
	  top: 0px;
	  font-size: 11px;
	  font-weight: bold;
	  color: #fff;
  }

  /* image picker */
  td.product-image {
	text-align: center;
  }
  #image-browse-modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0,0,0,0.5);
	z-index: 999;
  }
  .image-browse-modal-inner {
	width: 800px;
    height: 600px;
    position: absolute;
    left: 50%;
    top: 50%;
    background-color: transparent;
    margin-top: -300px;
    margin-left: -300px;
    overflow: visible;
  }
  .image-browse-modal-inner-images {
    max-height: 100%;
    overflow-x: hidden;
    overflow-y: scroll;
  }
  .image-browse-modal-inner-images > button {
	display: flex;
	width: 100%;
	text-align: left;
	border: 0;
	border-bottom: 1px solid white;
	padding: 1rem;
	align-items: center;
	background-color: rgb(239,239,239);
  }
  .image-browse-modal-inner-images > button:hover {
	background-color: rgb(214 214 214);
	cursor: pointer;
  }
  .image-browse-modal-inner-images > button > p {
	margin: 0;
	pointer-events: none;
  }
  .image-browse-modal-inner-images > button > img {
	max-width: 100px;
	max-height: 100px;
	object-fit: contain;
	margin-left: auto;
  }
  .image-browse-modal-inner-images-border {
	width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 5px;
    background-color: white;
	display: flex;
    flex-direction: column;
  }
  #hide-image-browse-modal  {
	margin-top: 1rem;
  }

  body.materialdesign.blockscroll {
	overflow: hidden;
  }

  .image-browse-modal-inner-search {
	padding: 1rem;
  }

  .image-browse-modal-inner-search > input {
	height: 26px;
  }

  .image-browse-modal-inner-search > button {
	height: 26px;
  }

  .image-browse-modal-inner-images > button.imgdir {
	padding: 0.5rem 1rem;
  }

  .imgdir p {
	pointer-events: none;
    text-transform: capitalize;
  }

  .imgdir p .big-icon {
    color: dimgrey;
    margin-right: 0.5rem;
  }

  .btn-preview-send.btn-preview-send {
	pointer-events: auto !important;
	opacity: 1 !important;
  }

  .preview-send-modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0,0,0,0.5);
	z-index: 999;
	display: none;
  }

  .preview-send-modal-outer {
	width: 60%;
    position: absolute;
    left: 50%;
    margin-left: -25%;
    top: 10%;
    height: 85%;
  }

  .preview-send-modal-outer > iframe {
	border: 0;
    outline: 0;
	width: 100%;
	height: 95%;
  }

  body.materialdesign table.dataTable thead th, body.materialdesign table.dataTable thead td, body.materialdesign table.dataTable.no-footer {
	border-bottom: 1px solid #ddd;
  }

  body.materialdesign .table {
	margin-bottom: 0;
  }

  body.materialdesign .table, body.materialdesign .form-group-inner {
	margin-bottom: 0;
  }

  .marginfix-15 {
	margin-top: 15px;
  }

  .loadingGifWrapper > *:last-child {
	margin-bottom: 0;
  }

/* Upload image picker */
#image-upload-modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0,0,0,0.5);
    z-index: 999;
}
.image-upload-modal-inner {
    width: 800px;
    height: 600px;
    position: absolute;
    left: 50%;
    top: 50%;
    background-color: transparent;
    margin-top: -300px;
    margin-left: -300px;
    overflow: visible;
}
.image-upload-modal-inner-border {
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 5px;
    background-color: white;
    display: flex;
    flex-direction: column;
}
.image-upload-modal-inner-content {
    margin: auto;
    width: 50%;
    font-size: medium;
}
#hide-image-upload-modal  {
    margin-top: 1rem;
}

/* sticker picker */
td.promo-sticker {
    text-align: center;
}
#sticker-browse-modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0,0,0,0.5);
    z-index: 999;
}
.sticker-browse-modal-inner {
    width: 800px;
    height: 600px;
    position: absolute;
    left: 50%;
    top: 50%;
    background-color: transparent;
    margin-top: -300px;
    margin-left: -300px;
    overflow: visible;
}
.sticker-browse-modal-inner-images {
    max-height: 100%;
    overflow-x: hidden;
    overflow-y: scroll;
}
.sticker-browse-modal-inner-images > button {
    display: flex;
    width: 100%;
    text-align: left;
    border: 0;
    border-bottom: 1px solid white;
    padding: 1rem;
    align-items: center;
    background-color: rgb(239,239,239);
}
.sticker-browse-modal-inner-images > button:hover {
    background-color: rgb(214 214 214);
    cursor: pointer;
}
.sticker-browse-modal-inner-images > button > p {
    margin: 0;
    pointer-events: none;
}
.sticker-browse-modal-inner-images > button > img {
    max-width: 100px;
    max-height: 100px;
    object-fit: contain;
    margin-left: auto;
}
.sticker-browse-modal-inner-images-border {
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 5px;
    background-color: white;
    display: flex;
    flex-direction: column;
}
#hide-sticker-browse-modal  {
    margin-top: 1rem;
}

body.materialdesign.stickerblockscroll {
    overflow: hidden;
}

.sticker-browse-modal-inner-search {
    padding: 1rem;
}

.sticker-browse-modal-inner-search > input {
    height: 26px;
}

.sticker-browse-modal-inner-search > button {
    height: 26px;
}

.sticker-browse-modal-inner-images > button.imgdir {
    padding: 0.5rem 1rem;
}


/* image picker */
#advert-image-browse-modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0,0,0,0.5);
    z-index: 999;
}
.advert-image-browse-modal-inner {
    width: 800px;
    height: 600px;
    position: absolute;
    left: 50%;
    top: 50%;
    background-color: transparent;
    margin-top: -300px;
    margin-left: -300px;
    overflow: visible;
}
.advert-image-browse-modal-inner-images {
    max-height: 100%;
    overflow-x: hidden;
    overflow-y: scroll;
}
.advert-image-browse-modal-inner-images > button {
    display: flex;
    width: 100%;
    text-align: left;
    border: 0;
    border-bottom: 1px solid white;
    padding: 1rem;
    align-items: center;
    background-color: rgb(239,239,239);
}
.advert-image-browse-modal-inner-images > button:hover {
    background-color: rgb(214 214 214);
    cursor: pointer;
}
.advert-image-browse-modal-inner-images > button > p {
    margin: 0;
    pointer-events: none;
}
.advert-image-browse-modal-inner-images > button > img {
    max-width: 100px;
    max-height: 100px;
    object-fit: contain;
    margin-left: auto;
}
.advert-image-browse-modal-inner-images-border {
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 5px;
    background-color: white;
    display: flex;
    flex-direction: column;
}
#hide-advert-image-browse-modal  {
    margin-top: 1rem;
}

.advert-image-browse-modal-inner-search {
    padding: 1rem;
}

.advert-image-browse-modal-inner-search > input {
    height: 26px;
}

.advert-image-browse-modal-inner-search > button {
    height: 26px;
}

.advert-image-browse-modal-inner-images > button.imgdir {
    padding: 0.5rem 1rem;
}

.advert-detail-td {
    display: none;
    align-items: center;
    min-height: 50px;
}

.advert-detail-header {
    margin-right: 10px;
}

.advert-detail-input {
    min-height: 35px;
    width: 50%;
    padding-left: 5px;
}

.advert-detail-select {
    min-height: 35px;
    padding-left: 5px;
    padding-right: 5px;
}

.advert-detail-number {
    min-height: 35px;
    width: 50px;
    padding-left: 5px;
}