.icon {
	display: inline-block;
	background: url(images/material-design-icons/sprites.png) no-repeat;
	background-size: 500px 500px;
	width: 24px;
	height: 24px;
	text-indent: -9999px;
	overflow: hidden;
	vertical-align: middle;
	text-align: left;
	transition: transform ease 0.2s;
}

.icon-large {
	transform: scale(2);
	transform-origin: 0 bottom 0;
	margin-right: 24px;
	margin-top: 24px;
}

.icon-small {
	transform: scale(0.5);
	transform-origin: 0 bottom 0;
	margin-right: -24px;
	margin-top: -24px;
}

.icon-white {
	filter: invert(100%);
}

.icon-gray {
	opacity: 0.4;
}

.icon-spin {
	animation: spin 2s ease infinite;
}

/* For more colors: https://stackoverflow.com/questions/42966641/how-to-transform-black-into-any-given-color-using-only-css-filters */
.icon-red {
	filter: invert(31%) sepia(62%) saturate(5834%) hue-rotate(359deg) brightness(91%) contrast(115%);
}

.icon-green {
	filter: invert(45%) sepia(81%) saturate(2176%) hue-rotate(87deg) brightness(104%) contrast(114%);
}

.icon-blue {
	filter: invert(9%) sepia(99%) saturate(7304%) hue-rotate(249deg) brightness(94%) contrast(145%);
}

.icon-user {
	background-position: -0px -0px;
}

.icon-menu {
	background-position: -75px -200px;
}

.icon-search, .icon-filter {
	background-position: -200px -250px;
}

.icon-cancel {
	background-position: -200px -100px;
}

.icon-backorder {
	background-position: -100px -75px;
}

.icon-hold {
	background-position: -25px -300px;
}

.icon-complete {
	background-position: -50px -125px;
}

.icon-new {
	background-position: -300px -0px;
}

.icon-picked {
	background-position: -300px -275px;
}

.icon-cart {
	background-position: -400px -125px;
}

.icon-fave {
	background-position: -249px 0px;
}

.icon-info {
	background-position: -175px -225px;
}

.icon-email {
	background-position: -226px -150px;
}

.icon-quicklook {
	background-position: -400px -275px;
}

.icon-help, .icon-question {
	background-position: -400px -25px;
}

.icon-trash {
	background-position: -150px -125px;
}

.icon-plus {
	background-position: -50px -25px;
}

.icon-minus, .icon-notavailable {
	background-position: -200px -150px;
}

.icon-nonstock {
	background-position: -125px -75px;
}

.icon-stock {
	background-position: -75px -400px;
}

.icon-dropship {
	background-position: -275px -75px;
}

.icon-edit, .icon-pencil {
	background-position: -125px -125px;
}

.icon-chevron-up {
	background-position: -325px -150px;
}

.icon-collapsed, .icon-parent, .icon-chevron-right {
	background-position: -325px -150px;
	transform: rotate(90deg);
}

.icon-expanded, .icon-chevron-down {
	background-position: -325px -150px;
	transform: rotate(180deg);
}

.icon-chevron-left {
	background-position: -325px -150px;
	transform: rotate(270deg);
}

.icon-print {
	background-position: -300px -225px;
}

.icon-check {
	background-position: -50px -125px;
}

.icon-document {
	background-position: -150px -150px;
}

.icon-zoom, .icon-zoom-in {
	background-position: -350px -375px;
}

.icon-zoom-out {
	background-position: -325px -400px;
}

.icon-attach {
	background-position: -125px 0px;
}

.icon-star {
	background-position: -125px -400px
}

.icon-star-empty {
	background-position: -225px -300px;
}

.icon-star-half {
	background-position: -200px -325px;
}

.icon-pause {
	background-position: -100px -250px;
}

.icon-hot {
	background-position: -375px -350px;
}

.icon-settings {
	background-position: -175px -200px;
}

.icon-lock {
	background-position: -275px -175px;
}

.icon-download {
	background-position: -275px -25px;
}

.icon-save {
	background-position: -75px -375px;
}

.icon-back {
	background-position: -150px -275px;
}

.icon-previous, .icon-left {
	background-position: -25px -100px;
}

.icon-next, .icon-right {
	background-position: -50px -75px;
}

.icon-waiting {
	background-position: -125px -50px;
	animation: spin 2s ease infinite;
}

.icon-waiting.icon-large {
	zoom: 2;
	transform: inherit;
	transform-origin: center;
}

.error {
	color: #f00;
	font-style: italic;
}

.errorInput, .errorInput:focus {
	background: #ff9f9f;
	color: #fff;
}

input[type=checkbox].errorInput, input[type=radio].errorInput {
	outline: solid 1px #ff9f9f;
}

input.errorInput:-webkit-autofill {
	-webkit-box-shadow: 0 0 0 1000px #ff9f9f inset;
	-webkit-text-fill-color: white;
}

.center {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

input.icon, button.icon {
	border: none;
}

/* Sliding Panel CSS Start */
#slidePanel {
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	visibility: hidden;
	-webkit-transition: visibility 0s 0.6s;
	-moz-transition: visibility 0s 0.6s;
	transition: visibility 0s 0.6s;
	background: rgba(0, 0, 0, 0.1);
}

#slidePanel::after {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: transparent;
	cursor: pointer;
	-webkit-transition: background 0.3s 0.3s;
	-moz-transition: background 0.3s 0.3s;
	transition: background 0.3s 0.3s;
}

#slidePanel.is-visible {
	visibility: visible;
	-webkit-transition: visibility 0s 0s;
	-moz-transition: visibility 0s 0s;
	transition: visibility 0s 0s;
}

#slidePanel.is-visible::after {
	background: rgba(0, 0, 0, 0.6);
	-webkit-transition: background 0.3s 0s;
	-moz-transition: background 0.3s 0s;
	transition: background 0.3s 0s;
}

#slidePanel-header {
	position: fixed;
	height: 36px;
	line-height: 36px;
	background: rgba(255, 255, 255, 0.96);
	z-index: 2;
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.08);
	-webkit-transition: top 0.3s 0s;
	-moz-transition: top 0.3s 0s;
	transition: top 0.3s 0s;
	padding: 0 0 0 10px;
}

.from-right #slidePanel-header, .from-left #slidePanel-header {
	top: -36px;
}

.from-right #slidePanel-header {
	right: 0;
}

.from-left #slidePanel-header {
	left: 0;
}

.is-visible #slidePanel-header {
	top: 0;
	-webkit-transition: top 0.3s 0.3s;
	-moz-transition: top 0.3s 0.3s;
	transition: top 0.3s 0.3s;
}

#slidePanel-title {
	margin: 5px 0 0 0;
}

#slidePanel-close {
	position: absolute;
	top: 0;
	right: 0;
	display: inline-block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}

#slidePanel-content {
	margin: 5px 0;
}

#slidePanel-container {
	position: fixed;
	height: 100%;
	overflow-y: auto;
	top: 0;
	padding: 36px 0 0 10px;
	background: #f5f5f5;
	z-index: 1;
	-webkit-transition-property: -webkit-transform;
	-moz-transition-property: -moz-transform;
	transition-property: transform;
	-webkit-transition-duration: 0.3s;
	-moz-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-delay: 0.3s;
	-moz-transition-delay: 0.3s;
	transition-delay: 0.3s;
	box-shadow: -5px 0px 10px rgba(0, 0, 0, 0.25), 5px 0 10px rgba(0, 0, 0, 0.25);
}

.from-right #slidePanel-container {
	right: 0;
	-webkit-transform: translate3d(100%, 0, 0);
	-moz-transform: translate3d(100%, 0, 0);
	-ms-transform: translate3d(100%, 0, 0);
	-o-transform: translate3d(100%, 0, 0);
	transform: translate3d(100%, 0, 0);
}

.from-left #slidePanel-container {
	left: 0;
	-webkit-transform: translate3d(-100%, 0, 0);
	-moz-transform: translate3d(-100%, 0, 0);
	-ms-transform: translate3d(-100%, 0, 0);
	-o-transform: translate3d(-100%, 0, 0);
	transform: translate3d(-100%, 0, 0);
}

.is-visible #slidePanel-container {
	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	-o-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	-webkit-transition-delay: 0s;
	-moz-transition-delay: 0s;
	transition-delay: 0s;
}
/* Sliding Panel CSS End */

.form-group.required label:after {
	content: "*";
	color: red;
	visibility: visible;
}

.nowrap {
	white-space: nowrap;
}

.full-width {
	width: 100%;
}

input.form-control, select.form-control, textarea.form-control {
	border-radius: 10px;
}

input.form-control:focus, select.form-control:focus {
	border-color: var(--accent-color);
}

.no-padding {
	padding:0px;
}

.no-padding-first-column {
	padding:0px 1% 0px 0px;
}

[data-click],[data-toggle],[data-open] {
	cursor: pointer;
}

@keyframes spin {
	100% {
		transform: rotate(360deg);
	}
}

.custom-combobox {
	position: relative;
}

.custom-combobox-toggle {
	position: absolute;
	top: 0;
	bottom: 0;
	margin-left: -1px;
	padding: 0;
	right: -2px
}

.custom-combobox-input {
	margin: 0;
	padding: 5px 10px;
}

.custom-combobox a.custom-combobox-toggle > .ui-button-icon.ui-icon-refresh {
	animation: spin 2s ease infinite;
}

.form-control.chosen-container-multi .chosen-choices {
	border: none;
	background-image: none;
}

.form-control.chosen-container-active .chosen-choices {
	border: none;
	box-shadow: none;
}

.adminPage {
	display: none;
}

.adminPage.defaultPage {
	display: initial;
}

.rlOverlayClose:hover {
	cursor: pointer;
}