/* fonts */
/* source-sans-3-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 300;
  src: url('/fonts/source-sans-3-v15-latin-300.eot'); /* IE9 Compat Modes */
  src: url('/fonts/source-sans-3-v15-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/source-sans-3-v15-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/source-sans-3-v15-latin-300.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/source-sans-3-v15-latin-300.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/source-sans-3-v15-latin-300.svg#SourceSans3') format('svg'); /* Legacy iOS */
}
/* source-sans-3-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/source-sans-3-v15-latin-regular.eot'); /* IE9 Compat Modes */
  src: url('/fonts/source-sans-3-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/source-sans-3-v15-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/source-sans-3-v15-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/source-sans-3-v15-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/source-sans-3-v15-latin-regular.svg#SourceSans3') format('svg'); /* Legacy iOS */
}
/* source-sans-3-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 500;
  src: url('/fonts/source-sans-3-v15-latin-500.eot'); /* IE9 Compat Modes */
  src: url('/fonts/source-sans-3-v15-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/source-sans-3-v15-latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/source-sans-3-v15-latin-500.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/source-sans-3-v15-latin-500.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/source-sans-3-v15-latin-500.svg#SourceSans3') format('svg'); /* Legacy iOS */
}
/* source-sans-3-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 600;
  src: url('/fonts/source-sans-3-v15-latin-600.eot'); /* IE9 Compat Modes */
  src: url('/fonts/source-sans-3-v15-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/source-sans-3-v15-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/source-sans-3-v15-latin-600.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/source-sans-3-v15-latin-600.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/source-sans-3-v15-latin-600.svg#SourceSans3') format('svg'); /* Legacy iOS */
}
/* source-sans-3-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/source-sans-3-v15-latin-700.eot'); /* IE9 Compat Modes */
  src: url('/fonts/source-sans-3-v15-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/source-sans-3-v15-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/source-sans-3-v15-latin-700.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/source-sans-3-v15-latin-700.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/source-sans-3-v15-latin-700.svg#SourceSans3') format('svg'); /* Legacy iOS */
}
/* source-sans-3-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 800;
  src: url('/fonts/source-sans-3-v15-latin-800.eot'); /* IE9 Compat Modes */
  src: url('/fonts/source-sans-3-v15-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/source-sans-3-v15-latin-800.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/source-sans-3-v15-latin-800.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/source-sans-3-v15-latin-800.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/source-sans-3-v15-latin-800.svg#SourceSans3') format('svg'); /* Legacy iOS */
}
/* source-sans-3-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 900;
  src: url('/fonts/source-sans-3-v15-latin-900.eot'); /* IE9 Compat Modes */
  src: url('/fonts/source-sans-3-v15-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/source-sans-3-v15-latin-900.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/source-sans-3-v15-latin-900.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/source-sans-3-v15-latin-900.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/source-sans-3-v15-latin-900.svg#SourceSans3') format('svg'); /* Legacy iOS */
}

/* roboto-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('/fonts/roboto-v30-latin-300.eot'); /* IE9 Compat Modes */
  src: url('/fonts/roboto-v30-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/roboto-v30-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/roboto-v30-latin-300.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/roboto-v30-latin-300.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/roboto-v30-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/roboto-v30-latin-regular.eot'); /* IE9 Compat Modes */
  src: url('/fonts/roboto-v30-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/roboto-v30-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/roboto-v30-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/roboto-v30-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/roboto-v30-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url('/fonts/roboto-v30-latin-500.eot'); /* IE9 Compat Modes */
  src: url('/fonts/roboto-v30-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/roboto-v30-latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/roboto-v30-latin-500.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/roboto-v30-latin-500.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/roboto-v30-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/roboto-v30-latin-700.eot'); /* IE9 Compat Modes */
  src: url('/fonts/roboto-v30-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/roboto-v30-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/roboto-v30-latin-700.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/roboto-v30-latin-700.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/roboto-v30-latin-700.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: url('/fonts/roboto-v30-latin-900.eot'); /* IE9 Compat Modes */
  src: url('/fonts/roboto-v30-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/roboto-v30-latin-900.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/roboto-v30-latin-900.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/roboto-v30-latin-900.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/roboto-v30-latin-900.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* preloader */
.theme-loader .ball-scale .contain .ring:first-child {
    border-left-color: #3DAE2B;
    border-right-color: #3DAE2B;
}
.theme-loader .ball-scale .contain .ring:first-child .frame {
    border-left-color: #277f18;
    border-right-color: #277f18;
}

/* buttons */
.btn {
    text-transform: none;
}

.btn-primary:hover,
.input-group-primary .input-group-addon:hover, 
.sweet-alert button.confirm:hover, 
.wizard>.actions a:hover {
    background-color: #277f18;
    border-color: #277f18;
}

.btn-primary:focus, 
.input-group-primary .input-group-addon:focus, 
.sweet-alert button.confirm:focus, 
.wizard>.actions a:focus {
    background-color: #277f18;
    border-color: #277f18;
}

.btn-primary, 
.input-group-primary .input-group-addon,
.sweet-alert button.confirm, 
.wizard>.actions a {
    background-color: #3DAE2B;
    border-color: #3DAE2B;
}

.btn-tertiary:hover {
    background-color: #3DAE2B;
    border-color: #3DAE2B;
	color: #fff;
}

.btn-tertiary:focus {
    background-color: #3DAE2B;
    border-color: #3DAE2B;
	color: #fff;
}

.btn-tertiary {
    background-color: #277f18;
    border-color: #277f18;
	color: #fff;
}

/* nav bar */
.pcoded .pcoded-navbar[navbar-theme="theme1"] {
    background: var(--wop-white);
}

.pcoded .pcoded-navbar .pcoded-navigatio-lavel {
    font-weight: 500;
	letter-spacing: 0px;
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .main-menu {
    background-color: var(--wop-white);
}

.pcoded .pcoded-header .navbar-logo[logo-theme="theme1"] {
    background-color: var(--wop-black);
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item>li>a {
	color: var(--wop-black);
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item>li.pcoded-trigger>a {
	background: var(--wop-accent-soft);
	color: var(--wop-black);
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li.active:hover > a, 
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li:hover > a {
    background: var(--wop-accent-soft);
	color: var(--wop-black);
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li:hover > a:before {
    border-left-color: var(--wop-accent);
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li.active > a {
    background: var(--wop-accent-soft);
	color: var(--wop-black);
}

.pcoded .pcoded-navbar[active-item-theme="theme1"] .pcoded-item > li.pcoded-trigger > a:before, 
.pcoded .pcoded-navbar[active-item-theme="theme1"] .pcoded-item > li.active > a:before {
    border-left-color: var(--wop-accent) !important;
}

.pcoded .pcoded-navbar[active-item-theme="theme1"] .pcoded-item>li.pcoded-trigger .pcoded-submenu li>a:before, 
.pcoded .pcoded-navbar[active-item-theme="theme1"] .pcoded-item>li.active .pcoded-submenu li>a:before {
    border-left-color: var(--wop-accent) !important;
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item li.pcoded-hasmenu .pcoded-submenu li>a {
    border-bottom-color: var(--wop-line);
	background-color: var(--wop-white);
	color: var(--wop-black);
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item .pcoded-hasmenu .pcoded-submenu li.active>a {
	background-color: var(--wop-accent-soft);
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item .pcoded-hasmenu .pcoded-submenu li:hover>a {
    background-color: var(--wop-accent-soft);
    color: var(--wop-black);
}

.pcoded .pcoded-navbar[active-item-theme="theme1"] .pcoded-item li .pcoded-submenu li.active>a, 
.pcoded .pcoded-navbar[active-item-theme="theme1"] .pcoded-item li .pcoded-submenu li:hover>a {
    color: var(--wop-black) !important;
}

.pcoded[nav-type="st6"] .pcoded-item.pcoded-left-item>li>a>.pcoded-micon i {
	color: var(--wop-black);
}

.pcoded .pcoded-navbar .pcoded-navigatio-lavel[menu-title-theme="theme5"] {
    color: var(--wop-muted) !important;
}

.navbar-logo img {
	height: 30px;
	width: auto;
}

/* general */
body {
    color: #474949;
    font-family: "Roboto", sans-serif;
}

a:focus, 
a:hover {
    color: #277f18;
}

.modal-link {
	cursor: pointer;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'Source Sans 3', sans-serif;
	font-weight: 700;
}

h6 {
	font-size: 16px;
}

.f-small {
	font-size: 0.85em;
	line-height: 0.85em;
}

.f-bold {
	font-weight: bold;
}

.main-body .page-wrapper .page-header-title span {
    text-transform: none;
	font-size: 16px;
	font-weight: 500;
}

a.dropdown-item {
	cursor: pointer;
}

.card-block > .section-pagination:first-child {
	margin: 10px 0 20px 0;
}

.card-block > .section-pagination:last-child {
    margin: 20px 0 0 0;
}

.section-pagination .page-item.active .page-link {
    background-color: #277f18;
    border-color: #277f18;
}

.section-pagination .page-link:hover {
    color: #277f18;
}

.section-pagination .page-item.active .page-link:hover {
	color: #ffffff;
}

.img-preview-grid {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 10px;
}

.img-product-preview-medium {
	width: 100px;
	height: 100px;
	object-fit: cover;
	object-position: center;
}

.img-product-preview {
	width: 50px;
	height: 50px;
	object-fit: cover;
	object-position: center;
}

#debugModal pre {
	margin-bottom: 0;
}

@media only screen and (min-width: 1400px) {
	p {
		font-size: 16px;
	}
}
/* cards */
.card .card-header .card-header-right {
    right: 20px;
}

.card .card-header h3 {
    margin-bottom: 0;
    color: #919aa3;
    font-size: 22px;
    font-weight: 500;
    display: inline-block;
    margin-right: 10px;
    line-height: 30px;
}

.card .card-block h4 {
    font-size: 18px;
    line-height: 26px;
}

/* tables */
.table-wrapper {
	position: relative;
}

.table-wrapper .dropdown {
	position: initial;
}

.table-wrapper .dropdown-menu {
    -webkit-box-shadow: 0 0 5px 1px rgba(0,0,0,0.11);
    box-shadow: 0 0 5px 1px rgba(0,0,0,0.11);
}

.table {
	margin-bottom: 0;
}

.table-with-actions {

}

.table-va th,
.table-va td,
.table-files th,
.table-files td,
.table-with-actions th,
.table-with-actions td {
	vertical-align: middle;
}

td.col-url {
	white-space: normal;
}

/* forms */
.form-label {
	font-weight: 500;
}

form .text-danger {
    font-size: 14px;
	margin: 5px 0 0 0;
}

.input-group-primary .form-control {
    border-color: #ccc;
}

.border-checkbox-section .border-checkbox-group-default .border-checkbox-label:before {
    border: 2px solid #ccc;
}

.border-checkbox-section .border-checkbox-group-default .border-checkbox:checked+.border-checkbox-label:after {
	border-color: #277f18;
}

.border-checkbox-section .border-checkbox-group .border-checkbox-label:after {
	opacity: 0.3;
}

/* select 2 */
.select2-container--default .select2-selection--multiple {
    border-radius: 2px;
}

.select2-container--default.select2-container--focus .select2-selection--multiple {
    border: 1px solid #ccc;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #277f18;
    border: 1px solid #277f18;
	border-radius: 2px;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #277f18;
}

.ajax-check-response {
	font-size: 11px;
	line-height: 16px;
	padding-top: 5px;
}

.acr-success {
}

.acr-error {
	color: #dc3545;
}

/* tabs */
.nav-tabs .nav-item {
	text-align: center;
}

.md3-tabs .nav-item,
.md3-tabs .slide {
    width: calc(100% / 3);
}

.nav-tabs.tab-primary li a.active,
.nav-tabs.tab-primary li a.active:hover,
.nav-tabs.tab-primary li a.active:focus {
    color: #277f18;
}

.nav-tabs.tab-primary .slide {
	background-color: #277f18;
}

/* (ajax) loading spinner */
.ajax-loading-spinner {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.ajax-loading-spinner div {
  position: absolute;
  top: 33px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #277f18;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.ajax-loading-spinner div:nth-child(1) {
  left: 8px;
  animation: ajax-loading-spinner1 0.6s infinite;
}
.ajax-loading-spinner div:nth-child(2) {
  left: 8px;
  animation: ajax-loading-spinner2 0.6s infinite;
}
.ajax-loading-spinner div:nth-child(3) {
  left: 32px;
  animation: ajax-loading-spinner2 0.6s infinite;
}
.ajax-loading-spinner div:nth-child(4) {
  left: 56px;
  animation: ajax-loading-spinner3 0.6s infinite;
}
@keyframes ajax-loading-spinner1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes ajax-loading-spinner3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes ajax-loading-spinner2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(24px, 0);
  }
}

/* notifications */
.alert {
  padding: 15px;
  margin-bottom: 18px;
  border: 1px solid transparent;
  border-radius: 2px;
}

.alert h4 {
  margin-top: 0;
  color: inherit;
}

.alert .alert-link {
  font-weight: bold;
}

.alert > p,
.alert > ul {
  margin-bottom: 0;
}

.alert > p + p {
  margin-top: 5px;
}

.alert-dismissable,
.alert-dismissible {
  padding-right: 35px;
}

.alert-dismissable .close,
.alert-dismissible .close {
  position: relative;
  top: -2px;
  right: -21px;
  color: inherit;
}

/* .alert-success {
  background-color: #4caf50;
  border-color: transparent;
  color: #ffffff;
} */

.alert-success hr {
  border-top-color: rgba(0, 0, 0, 0);
}

.alert-success .alert-link {
  color: #e6e6e6;
}

/* .alert-info {
  background-color: #2196f3;
  border-color: transparent;
  color: #ffffff;
} */

.alert-info hr {
  border-top-color: rgba(0, 0, 0, 0);
}

.alert-info .alert-link {
  color: #e6e6e6;
}

/* .alert-warning {
  background-color: #ffc107;
  border-color: transparent;
  color: #ffffff;
} */

.alert-warning hr {
  border-top-color: rgba(0, 0, 0, 0);
}

.alert-warning .alert-link {
  color: #e6e6e6;
}
/* 
.alert-danger {
  background-color: #f44336;
  border-color: transparent;
  color: #ffffff;
} */

.alert-danger hr {
  border-top-color: rgba(0, 0, 0, 0);
}

.alert-danger .alert-link {
  color: #e6e6e6;
}

@-webkit-keyframes progress-bar-stripes {
  from {
    background-position: 40px 0;
  }

  to {
    background-position: 0 0;
  }
}

@keyframes progress-bar-stripes {
  from {
    background-position: 40px 0;
  }

  to {
    background-position: 0 0;
  }
}

.alert {
  padding-left: 30px;
  font-size: 13px;
}

.alert span {
  cursor: pointer;
}

.alert:not(.alert-dismissible) {
  padding-right: 30px;
}

.alert.alert-dismissable {
  padding-right: 44px;
}

.alert-inverse {
  background-color: #333333;
  border-color: transparent;
  color: #ffffff;
}

.alert-inverse hr {
  border-top-color: rgba(0, 0, 0, 0);
}

.alert-inverse .alert-link {
  color: #e6e6e6;
}

.growl-animated.alert-inverse {
  box-shadow: 0 0 5px rgba(51, 51, 51, 0.5);
}

.growl-animated.alert-info {
  box-shadow: 0 0 5px rgba(33, 150, 243, 0.5);
}

.growl-animated.alert-success {
  box-shadow: 0 0 5px rgba(76, 175, 80, 0.5);
}

.growl-animated.alert-warning {
  box-shadow: 0 0 5px rgba(255, 193, 7, 0.5);
}

.growl-animated.alert-danger {
  box-shadow: 0 0 5px rgba(244, 67, 54, 0.5);
}

.alert-link {
  color: #fff !important;
}

/* modal */
/* General styles for the modal */

/*
Styles for the html/body for special modal where we want 3d effects
Note that we need a container wrapping all content on the page for the
perspective effects (not including the modals and the overlay).
*/
.md-perspective,
.md-perspective body {
	height: 100%;
	overflow: hidden;
}

.md-perspective body  {
	background: #222;
	-webkit-perspective: 600px;
	-moz-perspective: 600px;
	perspective: 600px;
}


.md-modal {
	position: fixed;
	top: 50%;
	left: 50%;
	width: 50%;
	max-width: 630px;
	min-width: 300px;
	height: auto;
	z-index: 2000;
	visibility: hidden;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
}

.md-show {
	visibility: visible;
}

.md-overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	visibility: hidden;
	top: 0;
	left: 0;
	z-index: 1000;
	opacity: 0;
	background: rgba(55, 58, 60, 0.65);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show ~ .md-overlay {
	opacity: 1;
	visibility: visible;
}

/* Content styles */
.md-content {
	color: #666666;
	background: #fff;
	position: relative;
	border-radius: 3px;
	margin: 0 auto;
}

.md-content h3 {
	color: #fff;
	margin: 0;
	padding: 0.4em;
	text-align: center;
	font-weight: 400;
	opacity: 0.8;
	background: #4680ff;
	border-radius: 3px 3px 0 0;
}

.md-content > div {
	padding: 15px 15px 30px 15px;
	margin: 0;
	font-weight: 300;
	font-size: 1.15em;
}

.md-content > div p {
	margin: 0;
	padding: 10px 0;
}

.md-content > div ul {
	margin: 0;
	padding: 0 0 30px 20px;
}

.md-content > div ul li {
	padding: 5px 0;
}

.md-content button {
	display: block;
	margin: 0 auto;
	font-size: 0.8em;
}

/* Individual modal styles with animations/transitions */

/* Effect 1: Fade in and scale up */
.md-effect-1 .md-content {
	-webkit-transform: scale(0.7);
	-moz-transform: scale(0.7);
	-ms-transform: scale(0.7);
	transform: scale(0.7);
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show.md-effect-1 .md-content {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
}

/* Effect 2: Slide from the right */
.md-effect-2 .md-content {
	-webkit-transform: translateX(20%);
	-moz-transform: translateX(20%);
	-ms-transform: translateX(20%);
	transform: translateX(20%);
	opacity: 0;
	-webkit-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
	-moz-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
	transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
}

.md-show.md-effect-2 .md-content {
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
	opacity: 1;
}

/* Effect 3: Slide from the bottom */
.md-effect-3 .md-content {
	-webkit-transform: translateY(20%);
	-moz-transform: translateY(20%);
	-ms-transform: translateY(20%);
	transform: translateY(20%);
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show.md-effect-3 .md-content {
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
}

/* Effect 4: Newspaper */
.md-effect-4 .md-content {
	-webkit-transform: scale(0) rotate(720deg);
	-moz-transform: scale(0) rotate(720deg);
	-ms-transform: scale(0) rotate(720deg);
	transform: scale(0) rotate(720deg);
	opacity: 0;
}

.md-show.md-effect-4 ~ .md-overlay,
.md-effect-4 .md-content {
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}

.md-show.md-effect-4 .md-content {
	-webkit-transform: scale(1) rotate(0deg);
	-moz-transform: scale(1) rotate(0deg);
	-ms-transform: scale(1) rotate(0deg);
	transform: scale(1) rotate(0deg);
	opacity: 1;
}

/* Effect 5: fall */
.md-effect-5.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-5 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translateZ(600px) rotateX(20deg);
	-moz-transform: translateZ(600px) rotateX(20deg);
	-ms-transform: translateZ(600px) rotateX(20deg);
	transform: translateZ(600px) rotateX(20deg);
	opacity: 0;
}

.md-show.md-effect-5 .md-content {
	-webkit-transition: all 0.3s ease-in;
	-moz-transition: all 0.3s ease-in;
	transition: all 0.3s ease-in;
	-webkit-transform: translateZ(0px) rotateX(0deg);
	-moz-transform: translateZ(0px) rotateX(0deg);
	-ms-transform: translateZ(0px) rotateX(0deg);
	transform: translateZ(0px) rotateX(0deg);
	opacity: 1;
}

/* Effect 6: side fall */
.md-effect-6.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-6 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translate(30%) translateZ(600px) rotate(10deg);
	-moz-transform: translate(30%) translateZ(600px) rotate(10deg);
	-ms-transform: translate(30%) translateZ(600px) rotate(10deg);
	transform: translate(30%) translateZ(600px) rotate(10deg);
	opacity: 0;
}

.md-show.md-effect-6 .md-content {
	-webkit-transition: all 0.3s ease-in;
	-moz-transition: all 0.3s ease-in;
	transition: all 0.3s ease-in;
	-webkit-transform: translate(0%) translateZ(0) rotate(0deg);
	-moz-transform: translate(0%) translateZ(0) rotate(0deg);
	-ms-transform: translate(0%) translateZ(0) rotate(0deg);
	transform: translate(0%) translateZ(0) rotate(0deg);
	opacity: 1;
}

/* Effect 7:  slide and stick to top */
.md-effect-7{
	top: 0;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
}

.md-effect-7 .md-content {
	-webkit-transform: translateY(-200%);
	-moz-transform: translateY(-200%);
	-ms-transform: translateY(-200%);
	transform: translateY(-200%);
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
	opacity: 0;
}

.md-show.md-effect-7 .md-content {
	-webkit-transform: translateY(0%);
	-moz-transform: translateY(0%);
	-ms-transform: translateY(0%);
	transform: translateY(0%);
	border-radius: 0 0 3px 3px;
	opacity: 1;
}

/* Effect 8: 3D flip horizontal */
.md-effect-8.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-8 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: rotateY(-70deg);
	-moz-transform: rotateY(-70deg);
	-ms-transform: rotateY(-70deg);
	transform: rotateY(-70deg);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	opacity: 0;
}

.md-show.md-effect-8 .md-content {
	-webkit-transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
	transform: rotateY(0deg);
	opacity: 1;
}

/* Effect 9: 3D flip vertical */
.md-effect-9.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-9 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: rotateX(-70deg);
	-moz-transform: rotateX(-70deg);
	-ms-transform: rotateX(-70deg);
	transform: rotateX(-70deg);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	opacity: 0;
}

.md-show.md-effect-9 .md-content {
	-webkit-transform: rotateX(0deg);
	-moz-transform: rotateX(0deg);
	-ms-transform: rotateX(0deg);
	transform: rotateX(0deg);
	opacity: 1;
}

/* Effect 10: 3D sign */
.md-effect-10.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-10 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: rotateX(-60deg);
	-moz-transform: rotateX(-60deg);
	-ms-transform: rotateX(-60deg);
	transform: rotateX(-60deg);
	-webkit-transform-origin: 50% 0;
	-moz-transform-origin: 50% 0;
	transform-origin: 50% 0;
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show.md-effect-10 .md-content {
	-webkit-transform: rotateX(0deg);
	-moz-transform: rotateX(0deg);
	-ms-transform: rotateX(0deg);
	transform: rotateX(0deg);
	opacity: 1;
}

/* Effect 11: Super scaled */
.md-effect-11 .md-content {
	-webkit-transform: scale(2);
	-moz-transform: scale(2);
	-ms-transform: scale(2);
	transform: scale(2);
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show.md-effect-11 .md-content {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
}

/* Effect 12:  Just me */
.md-effect-12 .md-content {
	-webkit-transform: scale(0.8);
	-moz-transform: scale(0.8);
	-ms-transform: scale(0.8);
	transform: scale(0.8);
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show.md-effect-12 ~ .md-overlay {
	background: #fff;
}

.md-effect-12 .md-content h3,
.md-effect-12 .md-content {
	background: transparent;
}

.md-show.md-effect-12 .md-content {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
}

/* Effect 13: 3D slit */
.md-effect-13.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-13 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translateZ(-3000px) rotateY(90deg);
	-moz-transform: translateZ(-3000px) rotateY(90deg);
	-ms-transform: translateZ(-3000px) rotateY(90deg);
	transform: translateZ(-3000px) rotateY(90deg);
	opacity: 0;
}

.md-show.md-effect-13 .md-content {
	-webkit-animation: slit .7s forwards ease-out;
	-moz-animation: slit .7s forwards ease-out;
	animation: slit .7s forwards ease-out;
}

@-webkit-keyframes slit {
	50% { -webkit-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -webkit-animation-timing-function: ease-out;}
	100% { -webkit-transform: translateZ(0) rotateY(0deg); opacity: 1; }
}

@-moz-keyframes slit {
	50% { -moz-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -moz-animation-timing-function: ease-out;}
	100% { -moz-transform: translateZ(0) rotateY(0deg); opacity: 1; }
}

@keyframes slit {
	50% { transform: translateZ(-250px) rotateY(89deg); opacity: 1; animation-timing-function: ease-in;}
	100% { transform: translateZ(0) rotateY(0deg); opacity: 1; }
}

/* Effect 14:  3D Rotate from bottom */
.md-effect-14.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-14 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translateY(100%) rotateX(90deg);
	-moz-transform: translateY(100%) rotateX(90deg);
	-ms-transform: translateY(100%) rotateX(90deg);
	transform: translateY(100%) rotateX(90deg);
	-webkit-transform-origin: 0 100%;
	-moz-transform-origin: 0 100%;
	transform-origin: 0 100%;
	opacity: 0;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

.md-show.md-effect-14 .md-content {
	-webkit-transform: translateY(0%) rotateX(0deg);
	-moz-transform: translateY(0%) rotateX(0deg);
	-ms-transform: translateY(0%) rotateX(0deg);
	transform: translateY(0%) rotateX(0deg);
	opacity: 1;
}

/* Effect 15:  3D Rotate in from left */
.md-effect-15.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-15 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
	-moz-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
	-ms-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
	transform: translateZ(100px) translateX(-30%) rotateY(90deg);
	-webkit-transform-origin: 0 100%;
	-moz-transform-origin: 0 100%;
	transform-origin: 0 100%;
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show.md-effect-15 .md-content {
	-webkit-transform: translateZ(0px) translateX(0%) rotateY(0deg);
	-moz-transform: translateZ(0px) translateX(0%) rotateY(0deg);
	-ms-transform: translateZ(0px) translateX(0%) rotateY(0deg);
	transform: translateZ(0px) translateX(0%) rotateY(0deg);
	opacity: 1;
}

/* Effect 16:  Blur */
.md-show.md-effect-16 ~ .md-overlay {
	background: rgba(180,46,32,0.5);
}

.md-show.md-effect-16 ~ .container {
	-webkit-filter: blur(3px);
	-moz-filter: blur(3px);
	filter: blur(3px);
}

.md-effect-16 .md-content {
	-webkit-transform: translateY(-5%);
	-moz-transform: translateY(-5%);
	-ms-transform: translateY(-5%);
	transform: translateY(-5%);
	opacity: 0;
}

.md-show.md-effect-16 ~ .container,
.md-effect-16 .md-content {
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show.md-effect-16 .md-content {
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
}

/* Effect 17:  Slide in from bottom with perspective on container */
.md-show.md-effect-17 ~ .container {
	height: 100%;
	overflow: hidden;
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
}

.md-show.md-effect-17 ~ .container,
.md-show.md-effect-17 ~ .md-overlay  {
	-webkit-transform: rotateX(-2deg);
	-moz-transform: rotateX(-2deg);
	-ms-transform: rotateX(-2deg);
	transform: rotateX(-2deg);
	-webkit-transform-origin: 50% 0%;
	-moz-transform-origin: 50% 0%;
	transform-origin: 50% 0%;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.md-effect-17 .md-content {
	opacity: 0;
	-webkit-transform: translateY(200%);
	-moz-transform: translateY(200%);
	-ms-transform: translateY(200%);
	transform: translateY(200%);
}

.md-show.md-effect-17 .md-content {
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
	-webkit-transition: all 0.3s 0.2s;
	-moz-transition: all 0.3s 0.2s;
	transition: all 0.3s 0.2s;
}

/* Effect 18:  Slide from right with perspective on container */
.md-show.md-effect-18 ~ .container {
	height: 100%;
	overflow: hidden;
}

.md-show.md-effect-18 ~ .md-overlay {
	background: rgba(55, 58, 60, 0.5);
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}

.md-show.md-effect-18 ~ .container,
.md-show.md-effect-18 ~ .md-overlay {
	-webkit-transform-style: preserve-3d;
	-webkit-transform-origin: 0% 50%;
	-webkit-animation: rotateRightSideFirst 0.5s forwards ease-in;
	-moz-transform-style: preserve-3d;
	-moz-transform-origin: 0% 50%;
	-moz-animation: rotateRightSideFirst 0.5s forwards ease-in;
	transform-style: preserve-3d;
	transform-origin: 0% 50%;
	animation: rotateRightSideFirst 0.5s forwards ease-in;
}

@-webkit-keyframes rotateRightSideFirst {
	50% { -webkit-transform: translateZ(-50px) rotateY(5deg); -webkit-animation-timing-function: ease-out; }
	100% { -webkit-transform: translateZ(-200px); }
}

@-moz-keyframes rotateRightSideFirst {
	50% { -moz-transform: translateZ(-50px) rotateY(5deg); -moz-animation-timing-function: ease-out; }
	100% { -moz-transform: translateZ(-200px); }
}

@keyframes rotateRightSideFirst {
	50% { transform: translateZ(-50px) rotateY(5deg); animation-timing-function: ease-out; }
	100% { transform: translateZ(-200px); }
}

.md-effect-18 .md-content {
	-webkit-transform: translateX(200%);
	-moz-transform: translateX(200%);
	-ms-transform: translateX(200%);
	transform: translateX(200%);
	opacity: 0;
}

.md-show.md-effect-18 .md-content {
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
	opacity: 1;
	-webkit-transition: all 0.5s 0.1s;
	-moz-transition: all 0.5s 0.1s;
	transition: all 0.5s 0.1s;
}

/* Effect 19:  Slip in from the top with perspective on container */
.md-show.md-effect-19 ~ .container {
	height: 100%;
	overflow: hidden;
}

.md-show.md-effect-19 ~ .md-overlay {
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}

.md-show.md-effect-19 ~ .container,
.md-show.md-effect-19 ~ .md-overlay {
	-webkit-transform-style: preserve-3d;
	-webkit-transform-origin: 50% 100%;
	-webkit-animation: OpenTop 0.5s forwards ease-in;
	-moz-transform-style: preserve-3d;
	-moz-transform-origin: 50% 100%;
	-moz-animation: OpenTop 0.5s forwards ease-in;
	transform-style: preserve-3d;
	transform-origin: 50% 100%;
	animation: OpenTop 0.5s forwards ease-in;
}

@-webkit-keyframes OpenTop {
	50% {
		-webkit-transform: rotateX(10deg);
		-webkit-animation-timing-function: ease-out;
	}
}

@-moz-keyframes OpenTop {
	50% {
		-moz-transform: rotateX(10deg);
		-moz-animation-timing-function: ease-out;
	}
}

@keyframes OpenTop {
	50% {
		transform: rotateX(10deg);
		animation-timing-function: ease-out;
	}
}

.md-effect-19 .md-content {
	-webkit-transform: translateY(-200%);
	-moz-transform: translateY(-200%);
	-ms-transforinput-group-addonm: translateY(-200%);
	transform: translateY(-200%);
	opacity: 0;
}

.md-show.md-effect-19 .md-content {
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
	-webkit-transition: all 0.5s 0.1s;
	-moz-transition: all 0.5s 0.1s;
	transition: all 0.5s 0.1s;
}

@media screen and (max-width: 32em) {
	body { font-size: 75%; }
}

/* Wörnlein portal design. */
@font-face {
    font-display: swap;
    font-family: "Poppins";
    font-style: normal;
    font-weight: 100;
    src: url("../fonts/poppins-v24-latin-100.woff2") format("woff2");
}

@font-face {
    font-display: swap;
    font-family: "Poppins";
    font-style: normal;
    font-weight: 200;
    src: url("../fonts/poppins-v24-latin-200.woff2") format("woff2");
}

@font-face {
    font-display: swap;
    font-family: "Poppins";
    font-style: normal;
    font-weight: 300;
    src: url("../fonts/poppins-v24-latin-300.woff2") format("woff2");
}

@font-face {
    font-display: swap;
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/poppins-v24-latin-regular.woff2") format("woff2");
}

@font-face {
    font-display: swap;
    font-family: "Poppins";
    font-style: normal;
    font-weight: 500;
    src: url("../fonts/poppins-v24-latin-500.woff2") format("woff2");
}

@font-face {
    font-display: swap;
    font-family: "Poppins";
    font-style: normal;
    font-weight: 600;
    src: url("../fonts/poppins-v24-latin-600.woff2") format("woff2");
}

@font-face {
    font-display: swap;
    font-family: "Poppins";
    font-style: normal;
    font-weight: 700;
    src: url("../fonts/poppins-v24-latin-700.woff2") format("woff2");
}

@font-face {
    font-display: swap;
    font-family: "Poppins";
    font-style: normal;
    font-weight: 800;
    src: url("../fonts/poppins-v24-latin-800.woff2") format("woff2");
}

@font-face {
    font-display: swap;
    font-family: "Poppins";
    font-style: normal;
    font-weight: 900;
    src: url("../fonts/poppins-v24-latin-900.woff2") format("woff2");
}

:root {
    --wop-black: #111111;
    --wop-white: #ffffff;
    --wop-canvas: #f6f6f4;
    --wop-line: #dededb;
    --wop-muted: #70706d;
    --wop-accent: #a6a5d3;
    --wop-accent-soft: #eeeef8;
    --wop-success: #8ebf74;
    --wop-warning: #df7e53;
    --wop-font: "Poppins", "Source Sans 3", Arial, sans-serif;
}

html,
body,
button,
input,
select,
textarea,
.tooltip,
.popover {
    font-family: var(--wop-font);
}

body {
    background: var(--wop-canvas);
    color: var(--wop-black);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--wop-black);
    font-family: var(--wop-font);
    letter-spacing: -0.015em;
}

a {
    color: var(--wop-black);
}

a:focus,
a:hover {
    color: #66659b;
}

/* Header and wordmark */
.pcoded .pcoded-header,
.pcoded .pcoded-header .navbar-wrapper,
.pcoded .pcoded-header .navbar-logo,
.pcoded .pcoded-header .navbar-logo[logo-theme="theme1"] {
    background: var(--wop-black);
}

.pcoded .pcoded-header .navbar-container {
    background: var(--wop-white);
}

.pcoded .pcoded-header {
    box-shadow: none;
    border-bottom: 1px solid #2c2c2c;
}

.pcoded .pcoded-header .nav-right > li,
.pcoded .pcoded-header .nav-right > li > a,
.pcoded .pcoded-header .nav-right .user-profile,
.pcoded .pcoded-header .nav-right .user-profile .dropdown-toggle,
.pcoded .pcoded-header .nav-right .user-profile .dropdown-toggle span,
.pcoded .pcoded-header .nav-right .user-profile .dropdown-toggle i {
    color: var(--wop-black) !important;
}

.pcoded .pcoded-header .nav-right > li > a:hover,
.pcoded .pcoded-header .nav-right > li > a:focus,
.pcoded .pcoded-header .nav-right .user-profile .dropdown-toggle:hover,
.pcoded .pcoded-header .nav-right .user-profile .dropdown-toggle:focus {
    color: #66659b !important;
}

.pcoded .pcoded-header .profile-notification > li > a,
.pcoded .pcoded-header .profile-notification > li > a i {
    color: var(--wop-black) !important;
}

.pcoded .pcoded-header .profile-notification > li > a:hover,
.pcoded .pcoded-header .profile-notification > li > a:focus {
    background: var(--wop-accent-soft);
    color: var(--wop-black) !important;
}

.pcoded .pcoded-header .nav-right .user-profile img {
    border: 2px solid var(--wop-accent);
}

.pcoded .pcoded-header .mobile-menu,
.pcoded .pcoded-header .mobile-menu:hover,
.pcoded .pcoded-header .mobile-menu:focus {
    color: var(--wop-white);
}

.wop-brand {
    align-items: center;
    color: var(--wop-white);
    display: inline-flex;
    gap: 10px;
    height: 56px;
    line-height: 1;
    padding-left: 14px;
    white-space: nowrap;
}

.wop-brand:hover,
.wop-brand:focus {
    color: var(--wop-white);
    text-decoration: none;
}

.wop-brand-name,
.wop-login-brand-name {
    font-size: 21px;
    font-weight: 700;
    letter-spacing: -0.045em;
    text-transform: lowercase;
}

.wop-brand-context,
.wop-login-brand-context {
    color: var(--wop-accent);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

/* Sidebar */
.pcoded .pcoded-navbar,
.pcoded .pcoded-navbar[navbar-theme="theme1"],
.pcoded .pcoded-navbar[navbar-theme="theme1"] .main-menu {
    background: var(--wop-white);
}

.pcoded .pcoded-navbar {
    border-right: 1px solid var(--wop-line);
    box-shadow: none;
}

.pcoded .pcoded-navbar .pcoded-navigatio-lavel,
.pcoded .pcoded-navbar .pcoded-navigatio-lavel[menu-title-theme="theme5"] {
    color: var(--wop-muted) !important;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li > a {
    border-left: 3px solid transparent;
    color: var(--wop-black);
    font-weight: 500;
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li > a .pcoded-micon i,
.pcoded[nav-type="st6"] .pcoded-item.pcoded-left-item > li > a > .pcoded-micon i {
    color: var(--wop-black);
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li.active > a,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li.active:hover > a,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li.pcoded-trigger > a,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li:hover > a,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li > a:hover,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li > a:focus,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li > a:active {
    background: var(--wop-accent-soft) !important;
    border-left-color: var(--wop-accent);
    color: var(--wop-black) !important;
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li > a:hover .pcoded-mtext,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li > a:focus .pcoded-mtext,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li > a:active .pcoded-mtext,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li.active > a .pcoded-mtext,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li.pcoded-trigger > a .pcoded-mtext,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li:hover > a .pcoded-mtext,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li:hover > a .pcoded-micon,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li:hover > a .pcoded-micon i,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li.active > a .pcoded-micon,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li.active > a .pcoded-micon i,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li.pcoded-trigger > a .pcoded-micon,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li.pcoded-trigger > a .pcoded-micon i {
    color: var(--wop-black) !important;
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item > li:hover > a::before,
.pcoded .pcoded-navbar[active-item-theme="theme1"] .pcoded-item > li.active > a::before {
    border-left-color: var(--wop-accent) !important;
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item li.pcoded-hasmenu .pcoded-submenu,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item li.pcoded-hasmenu .pcoded-submenu li > a {
    background: var(--wop-white) !important;
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item li.pcoded-hasmenu .pcoded-submenu li > a,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item li.pcoded-hasmenu .pcoded-submenu li > a .pcoded-mtext {
    color: var(--wop-black) !important;
    font-weight: 500;
    opacity: 1 !important;
}

.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item li.pcoded-hasmenu .pcoded-submenu li.active > a,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item li.pcoded-hasmenu .pcoded-submenu li:hover > a,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item li.pcoded-hasmenu .pcoded-submenu li > a:hover,
.pcoded .pcoded-navbar[navbar-theme="theme1"] .pcoded-item li.pcoded-hasmenu .pcoded-submenu li > a:focus {
    background: var(--wop-accent-soft) !important;
    color: var(--wop-black) !important;
}

/* Content hierarchy */
.pcoded-content {
    background: var(--wop-canvas);
}

.main-body .page-wrapper {
    padding: 2rem;
}

.main-body .page-wrapper .page-header {
    margin-bottom: 24px;
}

.main-body .page-wrapper .page-header-title {
    display: block;
}

.main-body .page-wrapper .page-header-title h1,
.main-body .page-wrapper .page-header-title h4 {
    color: var(--wop-black);
    font-size: 28px;
    font-weight: 700;
    line-height: 1.25;
    margin-bottom: 4px;
    text-transform: none;
}

.main-body .page-wrapper .page-header-title span {
    color: var(--wop-muted);
    font-size: 14px;
    font-weight: 400;
    margin-top: 0;
}

.card {
    background: var(--wop-white);
    border: 1px solid var(--wop-line);
    border-radius: 2px;
    box-shadow: none;
}

.card .card-header {
    border-bottom: 1px solid var(--wop-line);
    padding: 20px;
}

.card .card-header + .card-block,
.card .card-header + .card-block-big {
    padding-top: 20px;
}

.card .card-header h3,
.card .card-header h4,
.card .card-header h5 {
    color: var(--wop-black);
    font-weight: 600;
    margin: 0;
}

/* Dashboard cards */
.wop-card-link,
.wop-card-link:hover {
    color: inherit;
    text-decoration: none;
}

.wop-stat-card {
    border-top: 4px solid var(--wop-black);
    min-height: 142px;
    transition: border-color 160ms ease, transform 160ms ease;
}

.wop-stat-card-primary {
    background: var(--wop-accent-soft);
    border-color: var(--wop-accent);
}

.wop-card-link:hover .wop-stat-card,
.wop-card-link:focus .wop-stat-card {
    border-top-color: var(--wop-accent);
    transform: translateY(-2px);
}

.wop-stat-card h4 {
    color: var(--wop-black);
    font-size: 36px !important;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 18px;
}

.wop-stat-card h6 {
    color: var(--wop-black);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0;
    margin-bottom: 0;
}

.wop-stat-card h6 span {
    color: var(--wop-muted);
    display: block;
    font-size: 10px;
    letter-spacing: 0.08em;
    margin-top: 4px;
    text-transform: uppercase;
}

.wop-stat-card i {
    color: var(--wop-black);
    opacity: 0.9;
}

.wop-product-stat-card {
    position: relative;
}

.wop-product-stat-card:hover,
.wop-product-stat-card:focus-within {
    border-color: var(--wop-accent);
    transform: translateY(-2px);
}

.wop-product-stat-card .card-block {
    padding-bottom: 38px;
}

.wop-product-cache-control {
    align-items: center;
    bottom: 10px;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    left: 20px;
    position: absolute;
    right: 12px;
}

.wop-product-cache-status {
    color: var(--wop-muted);
    font-size: 10px;
    line-height: 1.2;
}

.btn.wop-product-cache-refresh {
    color: var(--wop-black);
    font-size: 11px;
    padding: 3px 7px;
    white-space: nowrap;
}

.btn.wop-product-cache-refresh:hover,
.btn.wop-product-cache-refresh:focus {
    background: var(--wop-accent-soft);
    color: var(--wop-black);
}

.wop-cache-refresh-icon.is-loading {
    animation: wop-cache-spin 900ms linear infinite;
}

.wop-cache-progress {
    background: #e9e9e6;
    height: 24px;
}

.wop-cache-progress .progress-bar {
    background: var(--wop-accent);
    color: var(--wop-black);
    font-weight: 600;
    transition: width 180ms ease;
    width: 0;
}

@keyframes wop-cache-spin {
    to {
        transform: rotate(360deg);
    }
}

/* Buttons and controls */
.btn {
    border-radius: 999px;
    font-family: var(--wop-font);
    font-weight: 500;
    padding-left: 18px;
    padding-right: 18px;
    text-transform: none;
}

.btn-primary,
.input-group-primary .input-group-addon,
.sweet-alert button.confirm,
.wizard > .actions a {
    background: var(--wop-black);
    border-color: var(--wop-black);
    color: var(--wop-white);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.input-group-primary .input-group-addon:hover,
.input-group-primary .input-group-addon:focus,
.sweet-alert button.confirm:hover,
.sweet-alert button.confirm:focus,
.wizard > .actions a:hover,
.wizard > .actions a:focus {
    background: var(--wop-accent);
    border-color: var(--wop-accent);
    color: var(--wop-black);
}

.btn-outline-primary {
    border-color: var(--wop-black);
    color: var(--wop-black);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
    background: var(--wop-accent-soft);
    border-color: var(--wop-black);
    color: var(--wop-black);
}

.form-control,
.form-select {
    border: 1px solid #c9c9c5;
    border-radius: 2px;
    color: var(--wop-black);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--wop-black);
    box-shadow: 0 0 0 3px rgba(166, 165, 211, 0.35);
}

.form-check-input:checked {
    background-color: var(--wop-black);
    border-color: var(--wop-black);
}

/* Tables and status */
.table {
    color: var(--wop-black);
}

.table > thead > tr > th,
.table thead th {
    border-bottom: 2px solid var(--wop-black);
    color: var(--wop-black);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.table > tbody > tr > td,
.table tbody td {
    border-top-color: var(--wop-line);
}

.table-hover tbody tr:hover {
    background: var(--wop-accent-soft);
}

.badge {
    border-radius: 999px;
    color: var(--wop-black);
    font-weight: 600;
    padding: 6px 9px;
}

.badge.bg-success,
.alert-success,
.growl-animated.alert-success {
    background: var(--wop-success) !important;
    color: var(--wop-black);
}

.badge.bg-secondary {
    background: #dfdfdc !important;
    color: var(--wop-black);
}

.alert-info {
    background: var(--wop-accent-soft);
    border-color: var(--wop-accent);
    color: var(--wop-black);
}

.alert-danger,
.growl-animated.alert-danger {
    background: #f8e5dd;
    border-color: var(--wop-warning);
    color: #6c2d16;
}

.section-pagination .page-item.active .page-link {
    background: var(--wop-black);
    border-color: var(--wop-black);
}

.section-pagination .page-link:hover {
    color: #66659b;
}

.theme-loader .ball-scale .contain .ring:first-child,
.theme-loader .ball-scale .contain .ring:first-child .frame {
    border-left-color: var(--wop-accent);
    border-right-color: var(--wop-accent);
}

/* Login */
.wop-login-brand {
    color: var(--wop-white);
}

.wop-login-brand-name {
    font-size: 34px;
}

.wop-login-brand-context {
    margin-top: 10px;
}

.login-block .auth-box.card {
    background: var(--wop-white);
    border-top: 5px solid var(--wop-accent);
    box-shadow: none;
}

.login-block .auth-box h3 {
    color: var(--wop-black);
    font-size: 22px;
    font-weight: 600;
}

.form-material .form-bar::before,
.form-material .form-bar::after {
    background: var(--wop-accent);
}

/* Portal-specific components */
.wop-product-thumb {
    height: 48px;
    margin-right: 10px;
    object-fit: contain;
    width: 48px;
}

.wop-readonly-number {
	text-align: left;
	white-space: nowrap;
}

.wop-event-product-quantity {
	min-width: 90px;
}

.wop-event-product-price {
	min-width: 120px;
}

.wop-event-product-tabs .nav-link {
	color: #343434;
}

.wop-event-product-tabs .nav-link.active {
	color: #25243d;
	font-weight: 600;
}

.wop-copy-assortment {
	padding: 20px;
	border: 1px solid #e3e2ee;
	border-radius: 4px;
	background: #f8f8fb;
}

.wop-bulk-product-toolbar {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .75rem;
}

.wop-bulk-stock-control {
	width: auto;
	max-width: 360px;
}

.wop-bulk-stock-control .form-control {
	max-width: 85px;
}

.wop-bulk-product-table-wrap {
	max-height: 680px;
	border: 1px solid #ececec;
}

.wop-bulk-product-table {
	margin-bottom: 0;
}

.wop-bulk-product-table thead th {
	position: sticky;
	top: 0;
	z-index: 2;
	background: #f7f7fb;
}

.wop-bulk-product-table .wop-bulk-check {
	width: 42px;
	text-align: center;
}

.wop-bulk-product-table .wop-bulk-quantity,
.wop-bulk-product-table .wop-bulk-price {
	min-width: 100px;
}

.wop-bulk-product-row.is-changed > td {
	background-color: rgba(166, 165, 211, .16);
}

.wop-bulk-product-row.table-danger > td {
	background-color: #f8d7da;
}

@media (max-width: 991.98px) {
	.wop-bulk-stock-control {
		width: 100%;
		max-width: none;
	}
}

.wop-event-product-actions {
	align-items: center;
	display: flex;
	gap: 8px;
	white-space: nowrap;
}

.wop-event-product-actions form {
	margin: 0;
}

.wop-dashboard-actions .card-block {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
}

.wop-dashboard-action-copy {
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.wop-dashboard-action-copy span {
	color: var(--wop-muted);
	font-size: 12px;
}

.wop-dashboard-actions .btn,
.wop-onsite-url-group .btn {
	white-space: nowrap;
}

.wop-onsite-url-group .btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	line-height: 1;
}

.wop-onsite-url-group .btn i {
	line-height: 1;
}

.wop-onsite-url-group .wop-copy-url {
	padding-right: 14px;
	padding-left: 14px;
}

/* Event product autocomplete */
.ui-helper-hidden-accessible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.ui-autocomplete {
    background: var(--wop-white);
    border: 1px solid #c9c9c5;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.12);
    cursor: default;
    list-style: none;
    margin: 2px 0 0;
    max-height: 320px;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 4px 0;
    position: absolute;
    z-index: 1100;
}

.ui-autocomplete .ui-menu-item {
    color: var(--wop-black);
    cursor: pointer;
    margin: 0;
}

.ui-autocomplete .ui-menu-item-wrapper {
    border: 0;
    padding: 9px 12px;
}

.ui-autocomplete .ui-state-active {
    background: var(--wop-accent-soft);
    color: var(--wop-black);
    margin: 0;
}

@media only screen and (max-width: 991px) {
    .main-body .page-wrapper {
        padding: 1.25rem;
    }

    .wop-brand {
        padding-left: 8px;
    }

    .wop-brand-context {
        display: none;
    }

	.wop-dashboard-actions .card-block {
		align-items: flex-start;
		flex-direction: column;
	}

	.wop-onsite-url-group {
		flex-wrap: wrap;
	}

	.wop-onsite-url-group .form-control {
		flex: 1 0 100%;
		margin-bottom: 8px;
	}
}

@media only screen and (max-width: 575px) {
    .main-body .page-wrapper .page-header-title h1,
    .main-body .page-wrapper .page-header-title h4 {
        font-size: 24px;
    }

    .pcoded .pcoded-header .nav-right .user-profile span {
        display: none;
    }
}