:root {
  --primary-color: #0088c2;
  --secondary-color: #3c3c3b;
  --background-color: #f9f3f0;
  --menu-color: #343639;

  --btn-primary: #00acec;
  --btn-primary-hover: #008abd;

  --btn-warning: #fc6d38;
  --btn-warning-hover: #ca582d;

  --btn-danger: #ec3200;
  --btn-danger-hover: #bd2800;

  --btn-success: #49bf67;
  --btn-success-hover: #3b9953;

  --btn-info: #9564e2;
  --btn-info-hover: #7850b5;
}

.box .box-content {
  background: #ffffff;
}

body, #content,
.contrast-dark-orange header .navbar .navbar-inner,
#panel-top .select2-container--default .select2-selection--single,
#panel-top .select-nav-top .select2 {
  background-color: var(--background-color);
}

.bg-orange,
.btn-group.open .btn-warning.dropdown-toggle {
  background-color: var(--primary-color) !important;
}

.btn.bg-orange:hover {
  background-color: #006d9c !important;
}

.color-orange,
#main-nav .navigation>.nav>li.active>a>i,
#main-nav .navigation>.nav>li.active>a>span,
#main-nav li.sub-menu.active a span,
#main-nav .navigation>.nav>li .nav>li.active>a [class^="icon-"],
#main-nav .navigation>.nav>li .nav>li.active>a [class*=" icon-"],
#main-nav .navigation>.nav>li .nav>li.active>a [class^="fas"],
#main-nav .navigation>.nav>li .nav>li.active>a [class^="fab"],
#main-nav .navigation .nav li:hover>a span,
#main-nav .navigation .nav li:focus a span,
#main-nav .navigation .nav li.active a span,
#panel-top .select-nav-top .select2-selection span,
#panel-top .select-nav-top .select2,
.page-header h1,
#menu .accordion .accordion-heading a.accordion-toggle:not(.collapsed) i,
#menu .accordion .accordion-heading a.accordion-toggle:hover i,
#menu .accordion .accordion-heading a.accordion-toggle:hover span,
#menu-down a.active span, #menu-down a.active i, #menu-down a:hover,
#main-nav .navigation>.nav>li:hover>a [class^="icon-"],
#main-nav .navigation>.nav>li:hover>a [class*=" icon-"],
#main-nav .navigation>.nav>li:focus>a [class^="icon-"],
#main-nav .navigation>.nav>li:focus>a [class*=" icon-"],
#main-nav .navigation>.nav>li.active>a [class^="icon-"],
#main-nav .navigation>.nav>li.active>a [class*=" icon-"],
#main-nav .navigation .nav li:hover>a [class^="icon-"] {
  color: var(--primary-color) !important;
}

#main-nav::-webkit-scrollbar-thumb,
.wifire-nav::-webkit-scrollbar-thumb,
#menu::-webkit-scrollbar-thumb {
  background-color: var(--primary-color);
  border: 2px solid var(--primary-color);
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: var(--primary-color);
  color: white;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: var(--primary-color) transparent transparent transparent;
}

.contrast-dark-orange .daterangepicker .ranges li.active, .contrast-dark-orange .daterangepicker .ranges li:hover {
  background: var(--primary-color);
}

.contrast-dark-orange .dropdown-menu>.active>a, .contrast-dark-orange .dropdown-menu>.active>a:hover, .contrast-dark-orange .dropdown-menu>.active>a:focus, .contrast-dark-orange .dropdown-menu>li:not(.disabled)>a:hover, .contrast-dark-orange .dropdown-menu>li:not(.disabled)>a:focus, .contrast-dark-orange .dropdown-submenu:hover>a, .contrast-dark-orange .dropdown-submenu:focus>a {
  background-color: var(--primary-color) !important;
  color: #fff}

.contrast-dark-orange h1 [class^="icon-"], .contrast-dark-orange h1 [class*="fa-"] {
  color: var(--primary-color);
}

.dark-orange-background {
  background-color: var(--primary-color) !important;
}

.btn-group.open .btn-warning.dropdown-toggle:hover {
  background-color: var(--primary-color);
}

.nav-tabs li.active a {
  color: var(--secondary-color) !important;
}

.btn-config:hover div {
  color: var(--primary-color);
  border-color: var(--primary-color);
}

.highlight-log {
  color: var(--primary-color);
}

.contrast-dark-orange .accordion.accordion-contrast .accordion-heading .accordion-toggle {
  color: white;
  background-color: var(--primary-color);
}

.contrast-dark-orange .accordion.accordion-contrast .accordion-group {
  border-color: var(--primary-color);
  border-bottom-color: var(--primary-color);
}

input:focus, select:focus, textarea:focus {
  border-color: var(--primary-color) !important;
}

.nav-tabs-simple>.active>a, .nav-tabs-simple>.active>a:hover, .nav-tabs-simple>.active>a:focus {
  border-color: transparent !important;
  border-bottom-color: var(--primary-color) !important;
}

.btn-choose-file:hover div, .btn-choose-file div.hover {
  color: var(--primary-color);
  border-color: var(--primary-color);
}

.contrast-dark-orange #main-nav .navigation>.nav>li .nav>li>a:hover [class^="icon-"], .contrast-dark-orange #main-nav .navigation>.nav>li .nav>li>a:hover [class*=" icon-"], .contrast-dark-orange #main-nav .navigation>.nav>li .nav>li>a:focus [class^="icon-"], .contrast-dark-orange #main-nav .navigation>.nav>li .nav>li>a:focus [class*=" icon-"], .contrast-dark-orange #main-nav .navigation>.nav>li .nav>li>a:hover [class^="fas"], .contrast-dark-orange #main-nav .navigation>.nav>li .nav>li>a:focus [class^="fas"], .contrast-dark-orange #main-nav .navigation>.nav>li .nav>li>a:hover [class^="fab"], .contrast-dark-orange #main-nav .navigation>.nav>li .nav>li>a:focus [class^="fab"] {
  color: var(--primary-color);
}

.contrast-dark-orange .daterangepicker td.active, .contrast-dark-orange .daterangepicker td.active:hover {
  background: var(--primary-color);
}

.box .box-header.dark-orange-background .actions .btn-link:hover {
  color: var(--primary-color) !important;
  background-color: white;
}

.contrast-dark-orange .datepicker td span.active:hover, .contrast-dark-orange .datepicker td span.active:hover:hover, .contrast-dark-orange .datepicker td span.active.disabled:hover, .contrast-dark-orange .datepicker td span.active.disabled:hover:hover, .contrast-dark-orange .datepicker td span.active:active, .contrast-dark-orange .datepicker td span.active:hover:active, .contrast-dark-orange .datepicker td span.active.disabled:active, .contrast-dark-orange .datepicker td span.active.disabled:hover:active, .contrast-dark-orange .datepicker td span.active.active, .contrast-dark-orange .datepicker td span.active:hover.active, .contrast-dark-orange .datepicker td span.active.disabled.active, .contrast-dark-orange .datepicker td span.active.disabled:hover.active, .contrast-dark-orange .datepicker td span.active.disabled, .contrast-dark-orange .datepicker td span.active:hover.disabled, .contrast-dark-orange .datepicker td span.active.disabled.disabled, .contrast-dark-orange .datepicker td span.active.disabled:hover.disabled, .contrast-dark-orange .datepicker td span.active[disabled], .contrast-dark-orange .datepicker td span.active:hover[disabled], .contrast-dark-orange .datepicker td span.active.disabled[disabled], .contrast-dark-orange .datepicker td span.active.disabled:hover[disabled], .contrast-dark-orange .datepicker td.active:hover, .contrast-dark-orange .datepicker td.active:hover:hover, .contrast-dark-orange .datepicker td.active.disabled:hover, .contrast-dark-orange .datepicker td.active.disabled:hover:hover, .contrast-dark-orange .datepicker td.active:active, .contrast-dark-orange .datepicker td.active:hover:active, .contrast-dark-orange .datepicker td.active.disabled:active, .contrast-dark-orange .datepicker td.active.disabled:hover:active, .contrast-dark-orange .datepicker td.active.active, .contrast-dark-orange .datepicker td.active:hover.active, .contrast-dark-orange .datepicker td.active.disabled.active, .contrast-dark-orange .datepicker td.active.disabled:hover.active, .contrast-dark-orange .datepicker td.active.disabled, .contrast-dark-orange .datepicker td.active:hover.disabled, .contrast-dark-orange .datepicker td.active.disabled.disabled, .contrast-dark-orange .datepicker td.active.disabled:hover.disabled, .contrast-dark-orange .datepicker td.active[disabled], .contrast-dark-orange .datepicker td.active:hover[disabled], .contrast-dark-orange .datepicker td.active.disabled[disabled], .contrast-dark-orange .datepicker td.active.disabled:hover[disabled] {
  background: var(--primary-color);
}

.contrast-dark-orange .text-contrast, .contrast-dark-orange .contrast {
  color: var(--primary-color) !important;
}

.img-theme {
  filter: grayscale(100%);
}

.text-orange {
  color: var(--primary-color) !important;
}

.area-title {
  color: var(--primary-color);
}

#menu .tooltip-inner {
  background-color: var(--primary-color);
  color: #fff}

#menu .tooltip-arrow {
  border-color: var(--primary-color);
}

.tooltip-orange {
  color: var(--primary-color) !important;
}

.nav-pills-checkbox li.active, .nav-pills-radios li.active, .nav-pills-campaigns li.active a,
.btn-group.open .btn-primary.dropdown-toggle, .btn.btn-primary,
.btn-group.open .btn-primary.dropdown-toggle:focus, .btn-group.open .btn-primary.dropdown-toggle:active, .btn-group.open .btn-primary.dropdown-toggle.active, .btn-group.open .btn-primary.dropdown-toggle.disabled, .btn-group.open .btn-primary.dropdown-toggle[disabled], .btn.btn-primary:focus, .btn.btn-primary:active, .btn.btn-primary.active, .btn.btn-primary.disabled, .btn.btn-primary[disabled],
.btn-group.open .btn-primary.dropdown-toggle.disabled:hover, .btn-group.open .btn-primary.dropdown-toggle[disabled]:hover, .btn.btn-primary.disabled:hover, .btn.btn-primary[disabled]:hover {
  background-color: var(--btn-primary);
  color: #fff}

.btn-group.open .btn-primary.dropdown-toggle:hover, .btn.btn-primary:hover {
  background-color: var(--btn-primary-hover);
  color: #fff}

  .nav-pills-checkbox li.active, .nav-pills-radios li.active, .nav-pills-campaigns li.active a {
    color: #333333;
  }

.btn-group.open .btn-warning.dropdown-toggle, .btn.btn-warning,
.btn-group.open .btn-warning.dropdown-toggle:focus, .btn-group.open .btn-warning.dropdown-toggle:active, .btn-group.open .btn-warning.dropdown-toggle.active, .btn-group.open .btn-warning.dropdown-toggle.disabled, .btn-group.open .btn-warning.dropdown-toggle[disabled], .btn.btn-warning:focus, .btn.btn-warning:active, .btn.btn-warning.active, .btn.btn-warning.disabled, .btn.btn-warning[disabled],
.btn-group.open .btn-warning.dropdown-toggle.disabled:hover, .btn-group.open .btn-warning.dropdown-toggle[disabled]:hover, .btn.btn-warning.disabled:hover, .btn.btn-warning[disabled]:hover {
  background-color: var(--btn-warning);
  color: #fff}

.btn-group.open .btn-warning.dropdown-toggle:hover, .btn.btn-warning:hover {
  background-color: var(--btn-warning-hover);
  color: #fff}

.btn-group.open .btn-danger.dropdown-toggle, .btn.btn-danger,
.btn-group.open .btn-danger.dropdown-toggle:focus, .btn-group.open .btn-danger.dropdown-toggle:active, .btn-group.open .btn-danger.dropdown-toggle.active, .btn-group.open .btn-danger.dropdown-toggle.disabled, .btn-group.open .btn-danger.dropdown-toggle[disabled], .btn.btn-danger:focus, .btn.btn-danger:active, .btn.btn-danger.active, .btn.btn-danger.disabled, .btn.btn-danger[disabled],
.btn-group.open .btn-danger.dropdown-toggle.disabled:hover, .btn-group.open .btn-danger.dropdown-toggle[disabled]:hover, .btn.btn-danger.disabled:hover, .btn.btn-danger[disabled]:hover {
  background-color: var(--btn-danger);
  color: #fff}

.btn-group.open .btn-danger.dropdown-toggle:hover, .btn.btn-danger:hover {
  background-color: var(--btn-danger-hover);
  color: #fff}

.btn-group.open .btn-success.dropdown-toggle, .btn.btn-success,
.btn-group.open .btn-success.dropdown-toggle:focus, .btn-group.open .btn-success.dropdown-toggle:active, .btn-group.open .btn-success.dropdown-toggle.active, .btn-group.open .btn-success.dropdown-toggle.disabled, .btn-group.open .btn-success.dropdown-toggle[disabled], .btn.btn-success:focus, .btn.btn-success:active, .btn.btn-success.active, .btn.btn-success.disabled, .btn.btn-success[disabled],
.btn-group.open .btn-success.dropdown-toggle.disabled:hover, .btn-group.open .btn-success.dropdown-toggle[disabled]:hover, .btn.btn-success.disabled:hover, .btn.btn-success[disabled]:hover {
  background-color: var(--btn-success);
  color: #fff}

.btn-group.open .btn-success.dropdown-toggle:hover, .btn.btn-success:hover {
  background-color: var(--btn-success-hover);
  color: #fff}

.btn-group.open .btn-info.dropdown-toggle, .btn.btn-info,
.btn-group.open .btn-info.dropdown-toggle:focus, .btn-group.open .btn-info.dropdown-toggle:active, .btn-group.open .btn-info.dropdown-toggle.active, .btn-group.open .btn-info.dropdown-toggle.disabled, .btn-group.open .btn-info.dropdown-toggle[disabled], .btn.btn-info:focus, .btn.btn-info:active, .btn.btn-info.active, .btn.btn-info.disabled, .btn.btn-info[disabled],
.btn-group.open .btn-info.dropdown-toggle.disabled:hover, .btn-group.open .btn-info.dropdown-toggle[disabled]:hover, .btn.btn-info.disabled:hover, .btn.btn-info[disabled]:hover {
  background-color: var(--btn-info);
  color: #fff}

.btn-group.open .btn-info.dropdown-toggle:hover, .btn.btn-info:hover {
  background-color: var(--btn-info-hover);
  color: #fff}

.btn-video {
  background-color: #0088c2;
  color: #fff}

.btn-video:hover {
  background-color: #006d9c;
  color: #fff}

.module-resources li:before {
  color: var(--primary-color);
}

.module-available .nav.nav-tabs {
  background-color: var(--primary-color);
  color: #fff;
}

.orange-division {
  border-color: var(--primary-color);
}

.module-available {
  box-shadow: 0 10px 0px -2px var(--primary-color);
}

.order-item.created {
  background-color: #33a0cf;
}

.order-item:hover, .order-item.active {
  background-color: var(--primary-color);
}

.bg-brand-logo {
  display: none;
}

body.fixed-header #main-nav.main-nav-fixed {
  background-color: var(--menu-color);
}

#brand-container {
  background-color: var(--menu-color);
}

body.main-nav-closed #menu .accordion-body {
  background-color: var(--menu-color);
}

@media (max-width: 768px) {
  body:not(.main-nav-opened) #menu .accordion-body {
    background-color: var(--menu-color);
  }
}

#menu .accordion .accordion-heading a, #menu .accordion .accordion-body a, #menu-down a {
  color: #f3f3f3;
}

#main-nav #menu-down hr {
  border-color: #f3f3f3;
}

.modal,
.modal-footer {
  background-color: var(--background-color);
}

.alert-warning-orange {
  background-color: var(--btn-warning);
  color: #fff;
}

.alert-warning-orange h4 {
  color: #fff;
}

#error_layout #top {
  background-color: var(--primary-color);
}

#error_layout .error_code {
  color:  var(--primary-color);
}

#error_layout {
  background-color: var(--background-color);
}

#error_layout #container {
  background-color: #ffffff;
}

.content-heading,
.header-transparent,
.header-transparent:before {
  background: var(--primary-color) !important;
}

.nav-tabs .nav-link.active,
.title-part {
  border-bottom-color: var(--primary-color);
}

#establishment-permissions a {
  color:  var(--primary-color);
}

.establishment-title img {
  border-color: var(--primary-color);
}

input[type=checkbox]:checked+.switch-toggle,
input[type=radio]:checked+.switch-toggle,
input[type=checkbox]:checked+.switch-toggle:before,
input[type=radio]:checked+.switch-toggle:before {
  background-color: var(--primary-color);
}