@import url('https://fonts.cdnfonts.com/css/nexa');

@font-face {
	font-family: 'opencart';
	src: url('fonts/opencart.eot?h4wsna');
	src: url('fonts/opencart.eot?h4wsna#iefix') format('embedded-opentype'),
			 url('fonts/opencart.ttf?h4wsna') format('truetype'),
			 url('fonts/opencart.woff?h4wsna') format('woff'),
			 url('fonts/opencart.svg?h4wsna#opencart') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* Colours */
:root {
	--primary-color: #5CE3F2;
  --secondary-color: #1E1F21;
	--tertiary-color: #EAEAEA;
  --quaternary-color: #0F1A3D;
	--white: #FFFFFF;
  --black: #000000;
	--danger: #c72e1d;
	--success: #008b8b;
	--warning: #F1A638;
	--info: #d6f7fb;
}

/* Globals */
html,
body {
	height: 100%;
	margin: 0;
	padding: 0;
	font-family: 'Nexa', sans-serif !important;
	color: var(--secondary-color) !important;
	text-rendering: optimizeLegibility;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Nexa', sans-serif !important;
  margin-top: 0;
  text-shadow: none !important;
  color: var(--secondary-color) !important;
}

h1 {
  font-size: 39px;
}

h2 {
  font-size: 30px !important;;
}

h3 {
  font-size: 28px !important;;
}

h4 {
  font-size: 26px !important;;
}

h5 {
  font-size: 24px !important;;
}

h6 {
  font-size: 22px !important;;
}

h1 svg,
h1 i,
h2 svg,
h1 i,
h3 svg,
h3 i,
h4 svg,
h4 i,
h5 svg,
h5 i,
h6 svg,
h6 i {
  width: 18px !important;
  font-size: 18px !important;
}
.svg-inline--fa {
  vertical-align: middle;
}

p {
	margin-top: 0;
}

a {
  color: var(--primary-color);
}

a:hover,
a:focus {
	text-decoration: none;
  color: var(--quaternary-color);
}

.text-primary {
	color: var(--quaternary-color);
}

.alert-danger {
	background-color: var(--danger);
	border-color: var(--danger);
	box-shadow: none;
	border-radius: 0;
  color: var(--white);
}
.alert-danger .alert-link {
	color: var(--white);
	font-weight: 600;
}
.alert-dismissible {
  padding-right: 0;
}
.alert-dismissible .close,
.alert-dismissable .close {
  text-shadow: none;
  opacity: 1;
  top: 0;
  right: 10px;
}

.custom-file-category {
	border-radius: 0;
	border-color: var(--tertiary-color);
	height: 36px;
	box-shadow: none;
}

/* Page header */
.page-header {
	vertical-align: middle;
	margin: 20px 0 15px 0;
	padding: 0;
	border-bottom: 1px solid var(--white);
}
.page-header h1 {
	font-weight: 300;
	font-size: 30px;
	color: #4c4d5a;
	display: inline-block;
	margin-bottom: 15px;
	text-shadow: 0 1px var(--white);
}
.breadcrumb {
	display: inline-block;
	background-color: transparent;
	margin: 10px 0 20px 0;
	padding: 0 10px;
	border-radius: 0;
}
.breadcrumb li a {
	color: var(--black);
	font-size: 14px;
	padding: 0;
	margin: 0;
}
.breadcrumb li a:hover {
	text-decoration: none;
}
.breadcrumb li + li:before {
	content: "\f105";
	font-family: 'FontAwesome';
	color: var(--secondary-color);
	padding: 0 5px;
	font-size: 10px;
}
.breadcrumb > li {
	text-shadow: none;
}
.breadcrumb > li:last-child a {
  color: var(--quaternary-color);
  font-weight: 600;
}

/* Container */
#container {
	min-height: 100%;
	width: 100%;
	position: relative;
	background-color: var(--tertiary-color);
	overflow: visible;
}
.container-fluid {
	padding: 20px;
}

/* Header */
#header {
	min-height: 0;
	background-color: var(--white);
	border-bottom: none;
	margin: 0;
	padding: 0;
	box-shadow: none;
}
#header .container-fluid {
	padding: 0;
}
#header .navbar-header {
  padding: 10px 0;
	transition: 0.3s all;
	width: 266px;
	display: none;
	background-color: var(--secondary-color);
}
#header .navbar-brand {
	margin-left: 8px;
}
#header .navbar-brand img {
  width: 100px;
  margin-left: 0px;
  margin-top: -15px;
}
#header .navbar-nav > li {
	display: inline-block;
}
#header .navbar-right {
  padding: 2px 0 0;
	margin: 0;
	float: right;
  font-size: 14px;
}
#header .navbar-right > li {
  border: none;
}
#header .navbar-right img {
  display: none;
}
#header .navbar-left {
  display: inline-block;
  padding: 0;
  margin-left: 10px;
}
#header .navbar-left li {
  width: 110px !important;
  padding: 0 !important;
}
#header .navbar-left b {
  display: none;
}
#header .navbar-left form {
  display: flex;
  align-items: center;
	flex-direction: row;
  gap: 10px;
}
#header .navbar-left form select {
  border-radius: 0;
  border: 1px solid var(--secondary-color);
  font-size: 14px;
  height: auto;
  cursor: pointer;
}
#header #user-profile {
	max-width: 30px;
	margin-right: 15px;
}
#header .nav > li > a {
	padding: 0 21px;
	line-height: 45px;
	cursor: pointer;
	color: var(--secondary-color);
	border-left: 1px solid var(--secondary-color);
}
#header .nav > li:first-of-type a {
  border: none;
}
#header .nav > li.dropdown > a {
	display: flex;
	align-items: center;
	padding-left: 10px;
	padding-right: 10px;
}
@media (min-width: 500px){
  #header .navbar-left b {
    font-weight: 100;
    font-size: 14px;
    display: inline-block;
  }
  #header .navbar-left li {
    width: 220px !important;
    padding: 0 !important;
  }
}
@media (min-width: 768px){
	#header .navbar-header {
		display: inline-block;
	}
	#header #user-profile {
		max-width: none;
	}
	#header .nav > li > a {
		line-height: 60px;
	}
}
@media (min-width: 769px){
  #header .navbar-left {
    padding: 20px 0 0;
    margin-left: 25px;
  }
  #header .navbar-right {
    padding: 10px 0 0;
  }
}
@media (min-width: 800px){
  #header .navbar-right img {
    display: inline;
  }
}

/* Button menu */
#button-menu {
	line-height: 30px;
	font-size: 24px;
	float: left;
	padding: 10px 16px;
	line-height: 25px;
	cursor: pointer;
	color: var(--secondary-color);
	border-left: none;
}
@media (min-width: 768px){
	#button-menu {
		display: none;
	}
}

/* Column left */
#column-left {
	width: 266px;
	height: 100%;
	overflow: auto;
	background-color: var(--secondary-color);
	position: absolute;
	top: 0;
	left: -266px;
	padding-top: 100px;
	z-index: 10;
}
#column-left::-webkit-scrollbar {
	width: 10px;
}
#column-left::-webkit-scrollbar-thumb {
	border-radius: 0;
	background-color: rgba(128, 139, 156, 0.2);
}
#content {
	padding-bottom: 40px;
}
#column-left,
#content, #footer {
	transition: all 0.3s;
}
#column-left + #content,
#column-left + #content + #footer {
	position: relative;
	left: 0;
}
#column-left.active {
	left: 0;
}
#column-left.active + #content,
#column-left.active + #content + #footer {
	left: 266px;
}
@media (min-width: 768px){
	#column-left {
		left: 0;
	}
	#column-left + #content,
	#column-left + #content + #footer {
		left: 0;
		margin-left: 266px;
	}
	#column-left.active + #content,
	#column-left.active + #content + #footer {
		left: 0;
		margin-left: 266px;
	}
}

/* Navigation */
#navigation {
	display: none;
}

/* Menu */
#menu, #menu ul, #menu li {
	padding: 0;
	margin: 0;
	list-style: none;
}
#menu {
	margin-bottom: 25px;
}
#menu li a {
  font-size: 15px;
	font-weight: 400;
	text-decoration: none;
	display: block;
	padding: 10px;
	cursor: pointer;
	border: none;
}
#menu li a.parent:after {
  content: "\f107";
	font-family: 'FontAwesome';
	float: right;
	margin-right: 8px;
}
#menu li.active > a.parent:after {
  content: "\f106";
}
#menu li a.collapsed:after {
	content: "\f105";
}
#menu > li {
	position: relative;
	border: none;
  margin-bottom: 10px;
}
#menu > li > a {
	color: var(--white);
	padding: 10px 20px;
  font-weight: 600;
}
#menu > li > a:hover {
	background-color: var(--secondary-color);
}
#menu > li > a > i {
	font-size: 14px;
	width: 18px;
	margin-right: 5px;
}
#menu > li.active > a {
	position: relative;
	color: var(--white);
	background-color: var(--secondary-color);
}
#menu > li.active > a::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 20px;
  width: calc(100% - 40px);
  height: 1px;
  background-color: var(--primary-color);
}
#menu > li > ul {
  margin-top: 10px;
	background-color: var(--secondary-color);
}
#menu li li a {
	color: var(--white);
}
#menu li li a:before {
	content: "\f101";
	font-size: 13px;
	font-family: 'FontAwesome';
	margin-left: 10px;
	margin-right: 10px;
	transition: margin ease 0.5s;
}
#menu li li a:hover:before {
	margin-right: 20px;
}
#menu li li a:hover {
	color: var(--white);
	background-color: var(--secondary-color);
}
#menu li li.active > a {
	color: var(--primary-color);
	background-color: var(--secondary-color);
  font-weight: 600;
}
#menu li ul a {
	padding-left: 30px;
}
#menu li li ul a {
	padding-left: 40px;
}
#menu li li li ul a {
	padding-left: 60px;
}
#menu li li li li ul a {
	padding-left: 80px;
}
#menu .separator {
	display: flex;
	align-items: center;
	text-align: center;
	font-size: 12px;
	color: var(--tertiary-color);
	padding: 10px 20px;
}
#menu .separator::before,
#menu .separator::after {
	content: '';
	flex: 1;
	border-bottom: 1px solid var(--tertiary-color);
}
#menu .separator:not(:empty)::before {
	margin-right: 0.25em;
}
#menu .separator:not(:empty)::after {
	margin-left: 0.25em;
}

/* Footer */
#footer {
	height: 100px;
	text-align: center;
}
#footer a {
	background-color: var(--quaternary-color);
  padding: 5px;
  font-weight: 600;
}
#footer a:hover {
	color: var(--white);
}

/* Navs / Tabs */
.nav-tabs > li > a {
	color: var(--black);
	border-radius: 0;
}
.nav > li > a:hover,
.nav > li > a:focus,
.nav > li > a:focus-visible,
.nav > li > a:active,
.nav-tabs > li > a:hover {
	border-color: var(--tertiary-color);
}
.nav-tabs {
	margin-bottom: 25px;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
	font-weight: bold;
	color: var(--secondary-color);
}

/* Buttons */
.btn {
  font-size: 14px;
  font-weight: 600;
  border-radius: 0;
}
.btn:active,
.btn.active {
	box-shadow: none;
}
.btn.active {
  box-shadow: none;
}
.btn-group {
	white-space: nowrap;
}
.btn-group > .btn {
	margin: 0 0 10px 10px !important;
}
.btn-group > .btn:first-child {
	margin: 0 0 10px !important;
}
.btn-primary {
  background-color: var(--primary-color);
  border: 1px solid var(--primary-color);
  color: var(--quaternary-color);
}
.btn-primary:hover,
.btn-primary.hover,
.btn-primary:focus-visible,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:active,
.btn-primary.active,
.btn-primary:active:hover,
.btn-primary.active:hover,
.btn-primary:focus:hover,
.btn-primary.focus:hover,
.btn-primary:active:focus,
.btn-primary.active:focus,
.btn-primary:active.focus,
.btn-primary.active.focus,
.open > .btn-primary.dropdown-toggle,
.open > .btn-primary.dropdown-toggle:hover,
.open > .btn-primary.dropdown-toggle:focus,
.open > .btn-primary.dropdown-toggle.focus {
  background-color: var(--white);
  border: 1px solid var(--primary-color);
  color: var(--quaternary-color);
	box-shadow: none;
}
.btn-default,
.btn-secondary {
  border-color: var(--tertiary-color);
	background-color: var(--tertiary-color);
	color: var(--quaternary-color);
}
.page-header .btn-default {
  border-color: var(--white);
	background-color: var(--white);
}
.btn-default:hover,
.btn-default.hover,
.btn-default:focus-visible,
.btn-default:focus,
.btn-default.focus,
.btn-default:active,
.btn-default.active,
.btn-default:active:hover,
.btn-default.active:hover,
.btn-default:focus:hover,
.btn-default.focus:hover,
.btn-secondary:hover,
.btn-secondary:active,
.btn-secondary:focus {
  background-color: var(--quaternary-color);
  border-color: var(--quaternary-color);
	color: var(--white);
}
.btn-link {
  color: var(--quaternary-color);
}
.btn-link:hover,
.btn-link:focus,
.btn-link:focus-visible,
.btn-link:active {
  color: var(--black);
}
.btn-info {
  background-color: var(--quaternary-color);
  border: 1px solid var(--quaternary-color);
}
.btn-info:hover,
.btn-info.hover,
.btn-info:focus-visible,
.btn-info:focus,
.btn-info.focus,
.btn-info:active,
.btn-info.active,
.btn-info:active:hover,
.btn-info.active:hover,
.btn-info:focus:hover,
.btn-info.focus:hover {
  background-color: var(--primary-color);
  border: 1px solid var(--primary-color);
}
.btn-danger,
.btn-danger.disabled:hover,
.btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger:hover,
.btn-danger.disabled:focus,
.btn-danger[disabled]:focus,
fieldset[disabled] .btn-danger:focus,
.btn-danger.disabled.focus,
.btn-danger[disabled].focus,
fieldset[disabled] .btn-danger.focus {
	background-color: var(--danger);
	border-color: var(--danger);
	color: var(--white);
}
.btn-danger:hover,
.btn-danger.hover,
.btn-danger:focus-visible,
.btn-danger:focus,
.btn-danger.focus,
.btn-danger:active,
.btn-danger.active,
.btn-danger:active:hover,
.btn-danger.active:hover,
.btn-danger:focus:hover,
.btn-danger.focus:hover {
	background-color: var(--white);
	border-color: var(--danger);
	color: var(--danger);
}
.btn-warning {
  background-color: var(--warning);
  border: 1px solid var(--warning);
  color: var(--white);
}
.btn-warning:hover,
.btn-warning:active,
.btn-warning:focus-visible,
.btn-warning:focus {
	background-color: var(--white);
  border: 1px solid var(--warning);
  color: var(--warning);
}
.btn-light[aria-controls="collapseLogin"],
.help-block a {
  color: var(--quaternary-color);
}
.btn-light[aria-controls="collapseLogin"]:hover,
.btn-light[aria-controls="collapseLogin"]:focus,
.btn-light[aria-controls="collapseLogin"]:focus-visible,
.btn-light[aria-controls="collapseLogin"]:active,
.help-block a:hover,
.help-block a:focus,
.help-block a:focus-visible,
.help-block a:active {
  color: var(--black);
}

.has-error .help-block {
	color: var(--danger);
}
.custom-file.has-error > .custom-file-label {
	border-color: var(--danger) !important;
	box-shadow: none !important;
}

/* Form */
.form-control {
  border-radius: 0;
  border: 1px solid var(--tertiary-color);
  box-shadow: none;
  color: var(--secondary-color);
}
.form-control:hover {
	border: 1px solid var(--tertiary-color);
	box-shadow: none;
	cursor: pointer;
}
div.required .control-label:not(span):before,
td.required:before {
	content: '* ';
	color: var(--danger);
	font-weight: bold;
}
label {
  font-weight: 400;
  font-size: 14px;
}
.table thead td span[data-toggle="tooltip"]:after,
label.control-label span:after {
	font-family: 'FontAwesome';
	color: var(--primary-color);
	content: "\f059";
	margin-left: 4px;
}
fieldset legend {
	padding-bottom: 5px;
}
input[type="radio"],
input[type="checkbox"] {
	margin: 2px 0 0;
  cursor: pointer;
}
input,
textarea,
form input,
form textarea {
	border: 1px solid var(--tertiary-color) !important;
	border-radius: 0 !important;
	padding: 10px;
}
.radio,
.checkbox {
	min-height: 18px;
}
input[type="radio"],
.radio input[type="radio"],
.radio-inline input[type="radio"],
input[type="checkbox"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
	position: relative;
	width: 13px;
	height: 13px;
	appearance: none;
	background-color: var(--white);
	border: 1px solid var(--tertiary-color);
	border-radius: 0;
}
input[type="radio"]:focus,
.radio input[type="radio"]:focus,
.radio-inline input[type="radio"]:focus,
input[type="checkbox"]:focus,
.checkbox input[type="checkbox"]:focus,
.checkbox-inline input[type="checkbox"]:focus {
	border-color: var(--primary-color);
	outline: 0;
}
input[type="radio"]:active,
.radio input[type="radio"]:active,
.radio-inline input[type="radio"]:active,
input[type="checkbox"]:active,
.checkbox input[type="checkbox"]:active,
.checkbox-inline input[type="checkbox"]:active {
	background-color: var(--tertiary-color);
	border-color: var(--tertiary-color);
}
input[type="radio"]:checked,
.radio input[type="radio"]:checked,
.radio-inline input[type="radio"]:checked,
input[type="checkbox"]:checked,
.checkbox input[type="checkbox"]:checked,
.checkbox-inline input[type="checkbox"]:checked {
	background-color: var(--white);
}
input[type="radio"],
.radio input[type="radio"],
.radio-inline input[type="radio"] {
	width: 15px;
	height: 15px;
	border-radius: 0;
}
input[type="radio"]:checked::after,
.radio input[type="radio"]:checked::after,
.radio-inline input[type="radio"]:checked::after {
	position: relative;
	top: 3px;
	left: 3px;
	display: block;
	width: 7px;
	height: 7px;
	content: '';
	background-color: var(--secondary-color);
	border-radius: 0;
}
input[type="checkbox"]:hover,
.checkbox input[type="checkbox"]:hover,
.checkbox-inline input[type="checkbox"]:hover {
	border-color: var(--tertiary-color);
	box-shadow: none;
}
input[type="checkbox"]:checked,
.checkbox input[type="checkbox"]:checked,
.checkbox-inline input[type="checkbox"]:checked {
  background-color: var(--primary-color);
}
input[type="checkbox"]:checked::after,
.checkbox input[type="checkbox"]:checked::after,
.checkbox-inline input[type="checkbox"]:checked::after {
	position: absolute;
	top: -6px;
	left: -5px;
	display: block;
	content: url('../image/checkmark.png');
}
.form-group {
	padding: 15px 0;
	margin-bottom: 0;
}
.form-group + .form-group {
	border-top: 1px solid var(--tertiary-color);
}
.input-group-addon {
  border-radius: 0;
  background-color: var(--tertiary-color);
  border: 1px solid var(--tertiary-color);
}

/* Table */
.table thead td {
	font-weight: bold;
}
.table thead > tr > td,
.table tbody > tr > td {
	vertical-align: middle;
}
.table thead > tr > td {
  background-color: var(--quaternary-color);
  font-weight: 600;
  color: var(--white);
}
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
	border-color: var(--tertiary-color);
}
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > th {
	color: var(--white);
	background-color: var(--quaternary-color);
}
.table thead > tr > td > a:hover {
  color: var(--white);
}
.table a.asc:after {
	content: " \f106";
	font-family: 'FontAwesome';
}
.table a.desc:after {
	content: " \f107";
	font-family: 'FontAwesome';
}
.table-hover > tbody > tr:hover,
.table-hover > tbody > tr:focus-visible {
  background-color: var(--white);
}

/* Datepicker */
.react-datepicker {
	width: 267px;
}
.react-datepicker-popper {
	z-index: 10;
}
.react-datepicker__header {
  background-color: var(--tertiary-color) !important;
}
.react-datepicker__day--keyboard-selected,
.react-datepicker__month-text--keyboard-selected,
.react-datepicker__quarter-text--keyboard-selected {
  background-color: var(--primary-color) !important;
  color: var(--quaternary-color) !important;
  font-weight: 600;
  border-radius: 0 !important;
}
.react-datepicker__day:hover,
.react-datepicker__month-text:hover,
.react-datepicker__quarter-text:hover {
  background-color: var(--tertiary-color) !important;
  border-radius: 0 !important;
}
.react-datepicker__month {
	margin: 0.4rem !important;
}
.react-datepicker__time-container {
	width: auto !important;
}
.bootstrap-datetimepicker-widget td.active,
.bootstrap-datetimepicker-widget td.active:hover {
	text-shadow: none;
	border-radius: 0;
	background-color: var(--primary-color);
	color: var(--quaternary-color);
}
.bootstrap-datetimepicker-widget td,
.bootstrap-datetimepicker-widget th {
	border-radius: 0;
}
.bootstrap-datetimepicker-widget td.day:hover,
.bootstrap-datetimepicker-widget td.hour:hover,
.bootstrap-datetimepicker-widget td.minute:hover,
.bootstrap-datetimepicker-widget td.second:hover {
	background-color: var(--tertiary-color);
}

/* Pagination */
.pagination {
	margin: 0;
}
.pagination > .active > span,
.pagination > .active > span:hover,
.pagination > .active > span:focus-visible {
  background-color: var(--primary-color);
  color: var(--quaternary-color);
  border-color: var(--primary-color);
}
.pagination > li > a {
  color: var(--quaternary-color);
	border-radius: 0;
}
.pagination > li > a:hover,
.pagination > li > a:focus-visible {
  background-color: var(--quaternary-color);
  color: var(--white);
}
.pagination > li:first-child > a,
.pagination > li:last-child > a {
  border-radius: 0;
}
.pagination > li:last-child > a,
.pagination > li:last-child > span {
	border-bottom-right-radius: 0;
	border-top-right-radius: 0;
}
.pagination > li:first-child > a,
.pagination > li:first-child > span {
	border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}

/* Panels */
.panel {
	border-radius: 0;
  box-shadow: none;
  margin-bottom: 20px;
}
.panel .panel-heading {
	position: relative;
}
.panel-heading h3 i {
	margin-right: 5px;
}
.panel-heading h3 {
	font-weight: 500;
	display: inline-block;
}
.panel-primary {
	border: 1px solid var(--primary-color);
	border-top: 2px solid var(--primary-color);
}
.panel-primary .panel-heading {
	color: var(--primary-color);
	border-color: var(--primary-color);
	background-color: var(--white);
}
.panel-default {
	border: 1px solid var(--tertiary-color);
}
.panel-default .panel-heading {
	color: var(--secondary-color);
	border: none;
	background-color: transparent;
	text-shadow: none;
}

/* Thumbnails */
.img-thumbnail i {
	color: var(--white);
	background-color: var(--tertiary-color);
	text-align: center;
	vertical-align: middle;
	width: 100px;
	height: 100px;
	padding-top: 20px;
	vertical-align: middle;
	display: inline-block;
}
.img-thumbnail.list i {
	width: 40px;
	height: 40px;
	padding-top: 10px;
}

/* Dropdown menu */
.dropdown-menu {
	border-radius: 0;
	box-shadow: none;
	border: 1px solid var(--tertiary-color);
	background-color: var(--white);
}
.dropdown-menu > li > a {
  font-size: 14px;
  color: var(--secondary-color);
}

/* Tiles */
.tile {
	margin-bottom: 15px;
	border-radius: 0;
	color: var(--white);
	transition: all 1s;
}
.tile-primary {
	background-color: var(--primary-color);
}
.tile-success {
	background-color: #53b953;
}
.tile-warning {
	background-color: #f3aa41;
}
.tile-danger {
	background-color: var(--danger);
}
.tile:hover {
	opacity: 0.95;
}
.tile a {
	color: var(--quaternary-color);
  font-weight: 600;
}
.tile-heading {
	padding: 10px;
	text-transform: uppercase;
  font-weight: 600;
	color: var(--quaternary-color);
	text-shadow: none;
}
.tile .tile-heading .pull-right {
	transition: all 1s;
	opacity: 0.7;
}
.tile:hover .tile-heading .pull-right {
	opacity: 1;
}
.tile-body {
	padding: 20px 10px;
	color: var(--white);
	line-height: 48px;
	text-shadow: none;
}
.tile .tile-body i {
	font-size: 50px;
	opacity: 0.3;
	transition: all 1s;
}
.tile:hover .tile-body i {
	color: var(--white);
	opacity: 1;
}
.tile .tile-body h2 {
	font-size: 42px;
}
.tile-footer {
	padding: 10px;
}

/* Map */
#vmap svg path {
  fill: var(--primary-color);
}
.jqvmap-zoomin,
.jqvmap-zoomout {
  width: 30px;
  height: 20px;
}

/* Stats */
#stats {
	display: none;
}
.jqvmap-label {
	z-index: 999;
}
.alert {
	overflow: auto;
}

/* Modal */
.modal-body .form-group {
	margin: 0;
}
.modal-body .row {
	margin-left: 0;
  margin-right: 0;
}

.modal-backdrop {
	background-color: rgba(0, 0, 0, 0.7);
}

.note-toolbar.panel-heading i {
	font-size: 14px;
}
#filemanager .fa-folder.fa-5x {
	font-size: 10.5em;
}
#extension-list {
	color: var(--quaternary-color);
}
#extension-list h2 {
	margin-top: 54px;
	margin-bottom: 44px;
}
#extension-list section {
	border: 1px solid var(--tertiary-color);
}
#extension-list section > div {
	position: relative;
}
#extension-list section > div + div {
	border-top: 1px solid var(--tertiary-color);
	padding: 10px;
}
#extension-list section:hover {
	border: 1px solid var(--quaternary-color);
}
#extension-list > .row {
	margin-top: 40px;
}
#extension-list > .row > * {
	margin-bottom: 30px;
}
#extension-list .extension-preview {
	min-height: 150px;
}
#extension-list .extension-preview .extension-description {
	position: absolute;
	background-color: var(--quaternary-color);
	color: var(--white);
	padding: 10px;
	font-size: 14px;
	line-height: 16px;
	opacity: 0;
	height: 100%;
	width: 100%;
}
#extension-list .extension-preview .extension-description:hover {
	opacity: 1;
}
@media screen and (min-width: 992px) and (max-width: 1199px) {
	#extension-list .extension-preview {
		min-height: 123px;
	}
	#extension-list .extension-preview .extension-description {
		font-size: 12.5px;
		padding: 6px;
	}
}
#extension-list .extension-preview img {
	margin: 0 auto;
}
#extension-list .extension-name {
	min-height: 100px;
}
#extension-list .extension-name p {
	color: var(--black);
	margin-bottom: 0;
	font-weight: 600;
}
#extension-list .extension-name p:first-child {
	font-size: 17px;
}
#extension-list .extension-name p span {
	color: #4b525d;
	font-weight: 400;
}
#extension-list .extension-name h4 a, #extension-list .extension-name p a {
	color: var(--black);
}
#extension-list .extension-name + div > .row {
	margin-top: 0;
}
@media screen and (min-width: 992px) and (max-width: 1199px) {
	#extension-list .extension-name + div > .row {
		font-size: 14px;
	}
}
#extension-list i {
	color: var(--primary-color);
}
#extension-list span {
	font-weight: 600;
}

/* Marketplace extension */
#marketplace-extension-info #banner img {
	margin-left: auto;
	margin-right: auto;
}
#marketplace-extension-info .extension-review {
	border-top: 5px solid #1b80c2;
	padding-top: 50px;
	margin-top: 50px;
	margin-bottom: 50px;
}
#marketplace-extension-info .nav-tabs {
	font-size: 14px;
}
#marketplace-extension-info .nav-tabs + .tab-content {
	margin-top: 30px;
	margin-bottom: 30px;
}
#marketplace-extension-info iframe {
	width: 100%;
	height: 500px;
}
@media screen and (max-width: 767px) {
	#marketplace-extension-info iframe {
		height: 350px;
	}
}
#marketplace-extension-info #buy {
	color: #4b525d;
}
#marketplace-extension-info #buy #price {
	color: #000;
	font-size: 20px;
	padding-top: 15px;
	padding-bottom: 5px;
}
#marketplace-extension-info #buy i {
	color: #10b4e9;
}
#marketplace-extension-info #buy hr {
	border-color: #ddd;
	margin: 10px 0;
}
#marketplace-extension-info #sales {
	color: #4b525d;
}
#marketplace-extension-info #sales i {
	color: #7ec239;
	margin-right: 10px;
	font-size: 24px;
}
#marketplace-extension-info #sales strong {
	font-size: 24px;
}
#marketplace-extension-info #comment {
	color: #4b525d;
}
#marketplace-extension-info #comment i {
	margin-right: 10px;
	font-size: 22px;
}
#marketplace-extension-info #comment strong {
	font-size: 22px;
}
#marketplace-extension-info .reply > div {
	margin-top: 15px;
}
#marketplace-extension-info .well .media {
	line-height: 1.2;
}
#marketplace-extension-info .well .media .media-body {
	padding-top: 6px;
}
#marketplace-extension-info .well .media .media-body span {
	font-size: 24px;
	font-weight: 600;
}
#marketplace-extension-info .well .media .media-body small {
	color: #878f9a;
}
@media screen and (max-width: 992px) {
	#marketplace-extension-info .container-fluid {
		padding-bottom: 30px;
	}
}

/* Other */
.list-check {
	list-style: none;
}
.list-check li::before {
	font-family: 'FontAwesome';
	content: '\f00c';
	margin-left: -30px;
	width: 30px;
	display: inline-block;
	color: #7ebd38;
}
.list-check.list-color-blue li::before {
	color: var(--primary-color);
}

.well.filter {
	background-color: var(--white);
}

[class^="opencart-icon-"],
[class*=" opencart-icon-"] {
	font-family: 'opencart' !important;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.opencart-icon-comment:before {
	content: "\e91b";
}
.opencart-icon-cart-mini:before {
	content: "\e91c";
}
.report_btn {
	margin-top: 8px;
}

.custom-file-category {
	border-radius: 0 !important;
	box-shadow: none !important;
	border: 1px solid var(--tertiary-color) !important;
	cursor: pointer;
}
.css-bg1rzq-control,
.css-15aozd-control {
	border-radius: 0 !important;
	border-color: var(--tertiary-color) !important;
}
.rdw-dropdown-selectedtext {
	color: var(--black);
}

/* SCSS overrides */
div[class*="styles_editorOver__"] {
	background-color: var(--tertiary-color);
}
div[class*="CampaignBuilderHeader_header__"] {
	flex-direction: column;
  align-items: flex-start;
}
div[class*="CampaignBuilderHeader_header__"] div {
	text-align: left;
}
div[class*="CampaignBuilderHeader_header__"] div button {
	margin-bottom: 10px;
}
@media screen and (min-width: 992px) {
	div[class*="CampaignBuilderHeader_header__"] {
		flex-direction: row;
	}
	div[class*="CampaignBuilderHeader_header__"] div {
		text-align: right;
	}
}

div[class*="Dropdown_dropdownAction"] {
	color: var(--quaternary-color);
}

div[class*="NotificationItem_expires__"],
div[class*="NotificationItem_invalid__"],
button[class*="ActionButton_btnDanger__"] {
	box-shadow: none;
	border-radius: 0;
	font-weight: 600;
}

button[class*="ActionButton_btnDanger__"] {
	color: var(--white);
	background-color: var(--danger);
	border-color: var(--danger);
}

button[class*="ActionButton_btnDanger__"]:hover,
button[class*="ActionButton_btnDanger__"]:focus-visible,
button[class*="ActionButton_btnDanger__"]:focus,
button[class*="ActionButton_btnDanger__"]:active {
	background-color: var(--white);
	border-color: var(--danger);
	color: var(--danger);
}

div[class*="NotificationItem_expires__"],
div[class*="NotificationItem_invalid__"] {
	color: var(--black);
	border-color: var(--white);
	background-color: var(--white);
}

div[class*="NotificationItem_expires__"] svg {
	color: var(--warning);
}
div[class*="NotificationItem_invalid__"] svg {
	color: var(--danger);
}
button[class*="NotificationItem_closeNotification__"] svg {
	color: var(--black);
}
div[class*="NotificationItem_starts__"],
button[class*="ActionButton_btnPrimary__"] {
	color: var(--black);
	background-color: var(--info);
	border-color: var(--primary-color);
	box-shadow: none;
	border-radius: 0;
	font-weight: 600;
}
div[class*="NotificationItem_starts__"] svg {
	color: var(--black);
}
button[class*="ActionButton_btnPrimary__"],
button[class*="FilterForm_btnPrimary__"],
button[class*="buttons_btnPrimary__"],
button[class*="CampaignForm_btnPrimary__"],
a[class*="buttons_btnPrimary__"],
a[class*="buttons_btnPrimarySmall__"],
a[class*="CampaignForm_btnPrimary__"],
a[class*="CollectionBuilderList_btnPrimary__"],
div[class*="buttons_btnPrimarySmall__"] {
	color: var(--quaternary-color);
	background-color: var(--primary-color);
	border-color: var(--primary-color);
	box-shadow: none;
	border-radius: 0;
	font-weight: 600;
}
button[class*="ActionButton_btnPrimary__"]:hover,
button[class*="FilterForm_btnPrimary__"]:hover,
button[class*="buttons_btnPrimary__"]:hover,
button[class*="CampaignForm_btnPrimary__"]:hover,
a[class*="buttons_btnPrimary__"]:hover,
a[class*="buttons_btnPrimarySmall__"]:hover,
a[class*="CampaignForm_btnPrimary__"]:hover,
a[class*="CollectionBuilderList_btnPrimary__"]:hover,
div[class*="buttons_btnPrimarySmall__"]:hover {
	background-color: var(--white);
	border-color: var(--primary-color);
}
div[class*="CampaignForm_header__"] a {
	color: var(--quaternary-color);
}
svg[class*="Item_attention__"] {
	color: var(--danger);
}
button[class*="FilterForm_btnDefault__"],
button[class*="Item_gridBtnDefault__"]{
	border-radius: 0;
	font-weight: 600;
  border-color: var(--tertiary-color);
	background-color: var(--tertiary-color);
	color: var(--quaternary-color);
}
button[class*="FilterForm_btnDefault__"]:hover,
button[class*="FilterForm_btnDefault__"]:focus-visible,
button[class*="FilterForm_btnDefault__"]:focus,
button[class*="FilterForm_btnDefault__"]:active,
button[class*="Item_gridBtnDefault__"]:hover,
button[class*="Item_gridBtnDefault__"]:focus-visible,
button[class*="Item_gridBtnDefault__"]:focus,
button[class*="Item_gridBtnDefault__"]:active{
  background-color: var(--quaternary-color);
  border-color: var(--quaternary-color);
	color: var(--white);
}
div[class*="layout_sectionHeader__"] {
	background-color: var(--white);
}
div[class*="FiltersContainer_sectionHeader__"] button[class*="FiltersContainer_toggleBtn__"] {
	background-color: transparent;
	color: var(--quaternary-color);
}
table[class*="ListContainer_campaignsTableListing__"] thead {
	color: var(--quaternary-color);
}
table[class*="ListContainer_campaignsTableListing__"] tbody tr:hover {
	background-color: var(--tertiary-color);
 	color: var(--black);
}
div[class*="Item_menuOperations__"] {
	gap: 10px;
}
section[class*="layout_sectionWrapper__"],
div[class*="layout_sectionWrapper__"] {
	box-shadow: none;
	border-radius: 0;
	border-color: var(--white);
}
div[class*="layout_sectionHeader__"] + div[class*="layout_content__"] {
	border-top-color: var(--tertiary-color);
}
ul[class*="Paginations_pagination__"] {
	border-radius: 0;
}
ul[class*="Paginations_pagination__"] li {
	border-color: var(--tertiary-color);
	border-radius: 0;
}
ul[class*="Paginations_pagination__"] li:hover {
	background-color: var(--tertiary-color);
	border-top-color: var(--tertiary-color);
	border-bottom-color: var(--tertiary-color);
}
ul[class*="Paginations_pagination__"] li:hover a {
	color: var(--quaternary-color);
}
ul[class*="Paginations_pagination__"] li:first-child,
ul[class*="Paginations_pagination__"] li:last-child {
	border-radius: 0;
}
ul[class*="Paginations_pagination__"] li a {
	color: var(--quaternary-color);
}
ul[class*="Paginations_pagination__"] li[class*="Paginations_active__"] {
	background-color: var(--primary-color);
	border-top-color: var(--primary-color);
	border-bottom-color: var(--primary-color);
}
ul[class*="Paginations_pagination__"] li[class*="Paginations_active__"] a {
	color: var(--quaternary-color);
}
div[class*="ViewLimitButton_viewLimitButtons__"] {
	border-radius: 0;
}
div[class*="ViewLimitButton_viewLimitButtons__"] button[class*="ViewLimitButton_active__"] {
	border-top-color: var(--primary-color);
	border-bottom-color: var(--primary-color);
	background-color: var(--primary-color);
	color: var(--quaternary-color);
}
div[class*="ViewLimitButton_viewLimitButtons__"] button:hover {
	background-color: var(--tertiary-color);
	border-top-color: var(--tertiary-color);
	border-bottom-color: var(--tertiary-color);
	color: var(--quaternary-color);
}
div[class*="ListingPage_content___"] {
	overflow-x: scroll;
}
form[class*="FilterForm_filterForm__"] {
	justify-content: space-between;
	flex-direction: column;
}
form[class*="FilterForm_filterForm__"] div[class*="FilterForm_fieldWrapper__"] {
	width: calc(100% - 3rem);
}
@media screen and (min-width: 1280px) {
	form[class*="FilterForm_filterForm__"] {
		flex-direction: row;
	}
	form[class*="FilterForm_filterForm__"] div[class*="FilterForm_fieldWrapper__"] {
		width: calc(25% - 3rem);
	}
}
a[class*="Dropdown_dropdownAction__"] {
	color: var(--quaternary-color);
}
form span[class*="form_errorMsg__"] {
	color: var(--danger);
	text-align: left;
}
form[class*="CampaignForm_createForm__"] div[class*="CampaignForm_formField__"] {
	gap: 10px;
}
form[class*="CampaignForm_createForm__"] div[class*="CampaignForm_formField__"] label {
	text-align: left;
	flex: 1 0 calc(15% - 10px);
}
form div[class*="form_dateInput__"]:first-of-type {
	margin-right: 10px;
}
div[class*="Rule_content__"] {
	flex-direction: column;
	gap: 10px;
}
div[class*="Rule_ruleGroup__"] {
	width: 100%;
}
div[class*="RuleRow_innerContent__"] {
	flex-direction: column;
}
@media screen and (min-width: 992px) {
	div[class*="RuleRow_innerContent__"] {
		flex-direction: row;
	}
}
@media screen and (min-width: 1400px) {
	div[class*="Rule_content__"] {
		flex-direction: row;
	}
	div[class*="Rule_ruleGroup__"] {
		width: 49%;
	}
}
button[class*="Rule_moveDown__"],
button[class*="Rule_moveUp__"] {
	color: var(--black);
	border: 1px solid var(--black);
}
button[class*="OperatorRuleButton_operand__"] {
	color: var(--black);
}
div[class*="ImportNavBar_importnav__"] a[class*="ImportNavBar_active__"] button {
  background-color: var(--primary-color) !important;
  border: 1px solid var(--primary-color) !important;
  color: var(--quaternary-color) !important;
}
div[class*="ImportNavBar_importnav__"] a[class*="ImportNavBar_active__"] button:hover,
div[class*="ImportNavBar_importnav__"] a[class*="ImportNavBar_active__"] button:focus-visible,
div[class*="ImportNavBar_importnav__"] a[class*="ImportNavBar_active__"] button:focus,
div[class*="ImportNavBar_importnav__"] a[class*="ImportNavBar_active__"] button:active {
  background-color: var(--white) !important;
  border: 1px solid var(--primary-color) !important;
  color: var(--quaternary-color) !important;
	box-shadow: none !important;
}
button[class*="ButtonSecondary_button__"] {
  border: 1px solid var(--white);
	background-color: var(--white);
	color: var(--quaternary-color);
}
button[class*="ButtonSecondary_button__"]:hover,
button[class*="ButtonSecondary_button__"]:focus-visible,
button[class*="ButtonSecondary_button__"]:focus,
button[class*="ButtonSecondary_button__"]:active {
  background-color: var(--quaternary-color);
	border: 1px solid var(--quaternary-color);
	color: var(--white);
}
button[class*="ButtonSecondary_buttonDisabled__"] {
	background-color: var(--tertiary-color);
	cursor: not-allowed;
}
button[class*="ButtonSecondary_buttonDisabled__"]:hover,
button[class*="ButtonSecondary_buttonDisabled__"]:focus-visible,
button[class*="ButtonSecondary_buttonDisabled__"]:focus,
button[class*="ButtonSecondary_buttonDisabled__"]:active {
	background-color: var(--quaternary-color);
	color: var(--white);
}
span[class*="Cell_errorNotice__"] {
	color: var(--danger);
}
span[class*="Cell_activeNotice__"] {
	color: var(--success);
}
.ReactModal__Overlay {
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 1000;
}
.ReactModal__Content {
	position: unset !important;
	width: 100%;
	height: 100%;
	max-width: 800px;
}
div[class*="HomePage_headerWrap__"] {
	padding: 2rem 0;
}
button[class*="ButtonPrimary_button__"],
button[class*="Table_cellButton__"] {
	border-radius: 0;
	background-color: var(--primary-color);
  border: 1px solid var(--primary-color);
  color: var(--quaternary-color);
	margin-right: 10px;
}
button[class*="ButtonPrimary_button__"]:last-of-type {
	margin-right: 0;
}
button[class*="ButtonPrimary_button__"]:hover,
button[class*="ButtonPrimary_button__"]:focus-visible,
button[class*="ButtonPrimary_button__"]:focus,
button[class*="ButtonPrimary_button__"]:active,
button[class*="Table_cellButton__"]:hover,
button[class*="Table_cellButton__"]:focus-visible,
button[class*="Table_cellButton__"]:focus,
button[class*="Table_cellButton__"]:active {
  background-color: var(--white);
  border: 1px solid var(--primary-color);
  color: var(--quaternary-color);
	box-shadow: none;
}
button[class*="VehiclesImportFormContainer_offersImportButton__"] {
	border-radius: 0;
	background-color: var(--success);
	border: 1px solid var(--success);
	color: var(--white);
}
button[class*="VehiclesImportFormContainer_offersImportButton__"]:hover {
	opacity: 1;
	background-color: var(--white);
	border: 1px solid var(--success);
	color: var(--success);
}
button[class*="VehiclesImportFormContainer_fullImportButton__"] {
	background-color: var(--danger);
	border-color: var(--danger);
	color: var(--white);
}
button[class*="VehiclesImportFormContainer_fullImportButton__"]:hover,
button[class*="VehiclesImportFormContainer_fullImportButton__"]:focus-visible,
button[class*="VehiclesImportFormContainer_fullImportButton__"]:focus,
button[class*="VehiclesImportFormContainer_fullImportButton__"]:active {
	background-color: var(--white);
	border-color: var(--danger);
	color: var(--danger);
}
div[class*="VehiclesImportFormContainer_contentSection__"],
div[class*="UploadLeadTimeFormContainer_contentSection"] {
	box-shadow: none;
}
div[class*="VehiclesImportFormContainer_header__"],
div[class*="UploadLeadTimeFormContainer_header__"] {
	background-color: var(--white);
	border: none;
}
div[class*="VehiclesImportFormContainer_sectionContentWrap__"],
div[class*="UploadLeadTimeFormContainer_sectionContentWrap__"] {
	border: none;
}
table[class*="Table_table__"] th {
	background-color: var(--quaternary-color);
	font-weight: 600;
	color: var(--white);
}
a[class*="PaginationNumbers_pageLink__"],
li[class*="_tables_paginationNumber__"] a {
	color: var(--quaternary-color);
}
li[class*="_tables_paginationNumber__"] {
	border: 1px solid var(--tertiary-color) !important;
}
div[class*="_tables_paginationNumber__"] {
	color: var(--quaternary-color);
	border-right: 0.1rem solid var(--tertiary-color);
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
li[class*="_tables_paginationNumberActive__"] a,
li[class*="PaginationNumbers_pageNumberActive__"] a[class*="PaginationNumbers_pageLink__"],
div[class*="_tables_paginationNumberActive__"],
li[class*="PaginationNumbers_pageNumberActive__"] a[class*="PaginationNumbers_pageLink__"] a,
li[class*="_tables_paginationNumber__"]:hover,
li[class*="_tables_paginationNumber__"]:active,
li[class*="_tables_paginationNumber__"]:focus,
div[class*="_tables_paginationNumber__"]:hover,
div[class*="_tables_paginationNumber__"]:active,
div[class*="_tables_paginationNumber__"]:focus,
li[class*="_tables_paginationNumber__"]:hover a {
	background-color: var(--primary-color);
	color: var(--quaternary-color);
}
li[class*="_tables_paginationNumberFirst__"],
div[class*="_tables_paginationNumberFirst__"] {
	border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
div[class*="VehiclesDataPageContainer_indexInfoBar__"] {
	flex-wrap: wrap;
}
div[class*="VehiclesImportFormContainer_rightSpacing__"] button {
	width: 100%;
	margin-bottom: 10px;
}
div[class*="VehiclesImportFormContainer_rightSpacing__"] button:last-of-type {
	margin-bottom: 0;
}
div[class*="VehiclesImportFormContainer_rightSpacing__"] {
	flex-wrap: wrap;
	width: 100%;
	margin-right: 0;
}
@media screen and (min-width: 1200px) {
	div[class*="VehiclesImportFormContainer_rightSpacing__"] button {
		width: calc(33.333% - 2rem);
	}
}
div[class*="_forms_error__"],
td[class*="TableCell_negative__"] {
	color: var(--danger);
}
ul[class*="Breadcrumbs_breadcrumbsContainer__"] li {
	color: var(--quaternary-color);
	font-weight: 600;
}
ul[class*="Breadcrumbs_breadcrumbsContainer__"] li a {
	color: var(--black);
	font-weight: 300;
}
div[class*="Table_sortable__"],
div[class*="Table_arrowIcon__"],
div[class*="ContentSection_arrowIcon__"] {
	color: var(--primary-color);
}
div[class*="ContentSection_contentSection__"] {
	box-shadow: none;
}
div[class*="ContentSection_header__"] {
	background-color: var(--white);
}
div[class*="ContentSection_rightTitleWrap__"] {
	gap: 10px;
}
div[class*="ContentSection_rightTitleWrap__"] label:first-of-type {
	margin-right: 0;
}
div[class*="DndFileUpload_container__"] {
	border-radius: 0;
	background-color: var(--tertiary-color);
}
table[class*="ListContainer_campaignsTableListing__"] th {
	background-color: var(--quaternary-color);
	color: var(--white);
}
