/* ------------------------------------------------------ */
/* ############### 1. GOOGLE FONTS IMPORT ############### */
/* ------------------------------------------------------ */
@import url("https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700");
@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,700");
@import url("https://fonts.googleapis.com/css?family=Fira+Sans:100,200,300,400,500,600,700");
@import url("https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700");
@import url("https://fonts.googleapis.com/css?family=Hind:300,400,500,600,700");
@import url("https://fonts.googleapis.com/css?family=Lato:300,400,700,900");
@import url("https://fonts.googleapis.com/css?family=Libre+Barcode+39+Extended+Text");
/* ----------------------------------------------------------- */
/* ############### 5. CORE STYLES ############### */
/* ----------------------------------------------------------- */
.br-header {
  height: 60px;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1030;
  background-color: #fff;
  box-shadow: 0 1px 4px 0px rgba(0, 0, 0, 0.16);
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: all 0.2s ease-in-out;
}
.br-header::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: -4px;
  width: 3px;
  background-color: #fff;
  z-index: 1040;
}
@media (min-width: 992px) {
  .br-header {
    left: 230px;
  }
}

.br-header-left {
  display: flex;
}
.br-header-left .form-control, .br-header-left .dataTables_filter input, .dataTables_filter .br-header-left input {
  border: 0;
  border-radius: 0;
  padding: 0 20px;
}
.br-header-left .input-group-btn {
  border-right: 1px solid rgba(0, 0, 0, 0.15);
}
.br-header-left .input-group-btn .btn, .br-header-left .input-group-btn .sp-container button, .sp-container .br-header-left .input-group-btn button {
  background-color: #fff;
  border-radius: 0;
  border: 0;
  color: #868e96;
  padding-left: 20px;
  padding-right: 20px;
}
.br-header-left .input-group-btn .btn:focus, .br-header-left .input-group-btn .sp-container button:focus, .sp-container .br-header-left .input-group-btn button:focus, .br-header-left .input-group-btn .btn:active, .br-header-left .input-group-btn .sp-container button:active, .sp-container .br-header-left .input-group-btn button:active {
  color: #343a40;
  box-shadow: none;
}

.br-header-right {
  display: flex;
  align-items: center;
}
.br-header-right a {
  color: #868e96;
}
.br-header-right a:hover, .br-header-right a:focus {
  color: #343a40;
}
.br-header-right .dropdown:last-child .dropdown-menu {
  padding: 0 10px 10px;
}
@media (max-width: 479px) {
  .br-header-right .dropdown:first-child .dropdown-menu {
    transform: translateX(145px) !important;
  }
  .br-header-right .dropdown:nth-child(2) .dropdown-menu {
    transform: translateX(113px) !important;
  }
  .br-header-right .dropdown:last-child .dropdown-menu {
    transform: translateX(49px) !important;
  }
}

.dropdown-menu-header {
  position: relative;
  border-top: 0;
  margin-top: 1px;
  padding: 10px 20px 20px;
  box-shadow: 0 1px 4px 0px rgba(0, 0, 0, 0.16);
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  left: auto !important;
  right: -1px !important;
  top: 55px !important;
  transform: none !important;
  will-change: unset !important;
}
.dropdown-menu-header::before {
  content: '';
  position: absolute;
  top: -4px;
  left: -2px;
  right: 0;
  height: 4px;
  background-color: #fff;
  z-index: 1040;
}

.media-list-link {
  display: block;
  transition: all 0.2s ease-in-out;
}
.media-list-link.read {
  background-color: #f8f9fa;
}
.media-list-link:hover, .media-list-link:focus {
  background-color: #e9ecef;
}
.media-list-link .media-body {
  margin-left: 15px;
}
.media-list-link + .media-list-link {
  margin-top: 1px;
}

.br-sideleft {
  position: fixed;
  top: 60px;
  left: -230px;
  bottom: 0;
  z-index: 100;
  width: 230px;
  background-color: #1D2939;
  padding-left: 10px;
  padding-right: 10px;
  transition: all 0.2s ease-in-out;
}
@media (min-width: 992px) {
  .br-sideleft {
    left: 0;
  }
}
.br-sideleft .ps__scrollbar-y-rail {
  visibility: hidden;
}

.br-logo {
  position: fixed;
  top: 0;
  left: -230px;
  width: 230px;
  height: 60px;
  background-color: #fff;
  border-right: 1px solid rgba(0, 0, 0, 0.15);
  font-size: 24px;
  font-weight: 700;
  padding: 0 5px;
  display: flex;
  align-items: center;
  z-index: 1030;
  transition: all 0.2s ease-in-out;
}
@media (min-width: 992px) {
  .br-logo {
    left: 0;
  }
}
.br-logo > a {
  color: #212529;
  letter-spacing: -0.5px;
}
.br-logo > a i {
  font-style: normal;
  font-weight: 500;
  color: #17a2b8;
}
.br-logo > a span {
  font-weight: 300;
  color: #00b297;
  display: inline-block;
  transition: all 0.2s ease-in-out;
}
.br-logo > a span:first-child {
  padding-right: 2px;
}
.br-logo > a span:last-child {
  padding-left: 2px;
}
.br-logo > a:hover, .br-logo > a:focus {
  text-decoration: none;
}
.br-logo > a:hover span:first-child, .br-logo > a:focus span:first-child {
  transform: translateX(-5px);
}
.br-logo > a:hover span:last-child, .br-logo > a:focus span:last-child {
  transform: translateX(5px);
}

.br-sideleft-menu {
  transition: all 0.2s ease-in-out;
}

.sidebar-label {
  display: block;
  text-transform: uppercase;
  font-size: 10px;
  font-family: "Roboto", "Helvetica Neue", Arial, sans-serif;
  color: #fff;
  letter-spacing: 1px;
  opacity: .3;
  white-space: nowrap;
}

.br-menu-link {
  color: #adb5bd;
  display: block;
  font-size: 14px;
  border-radius: 2px;
  transition: all 0.2s ease-in-out;
}
.br-menu-link:hover, .br-menu-link:focus {
  color: #fff;
  background-color: #18222f;
}
.br-menu-link:focus, .br-menu-link:active {
  outline: none;
}
.br-menu-link.show-sub {
  background-color: #141d28;
  color: #fff;
}
.br-menu-link.active {
  background-color: #00b297;
  color: #fff;
}

.br-menu-item {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0 15px;
  height: 40px;
  letter-spacing: 0.2px;
  font-size: .85rem;
}

.menu-item-icon {
  width: 18px;
  transition: all 0.2s ease-in-out;
}

.menu-item-label {
  white-space: nowrap;
  margin-left: 10px;
  margin-right: auto;
}

.menu-item-label,
.menu-item-arrow {
  transition: all 0.2s ease-in-out;
}

.br-menu-sub {
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 27px;
  background-color: #1a2432;
  display: none;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}
.br-menu-sub .nav-link {
  font-size: 13px;
  color: #adb5bd;
  padding-top: 7px;
  padding-bottom: 7px;
  white-space: nowrap;
  position: relative;
  transition: all 0.2s ease-in-out;
}
.br-menu-sub .nav-link::before {
  content: '';
  position: absolute;
  top: 50%;
  left: -5px;
  margin-top: -.5px;
  width: 5px;
  height: 1px;
  background-color: #fff;
  opacity: .5;
  transition: all 0.2s ease-in-out;
}
.br-menu-sub .nav-link:hover, .br-menu-sub .nav-link:focus {
  color: #17A2B8;
}
.br-menu-sub .nav-link:hover::before, .br-menu-sub .nav-link:focus::before {
  width: 20px;
  left: -15px;
  opacity: 1;
  background-color: #17A2B8;
}
.br-menu-sub .nav-link.active {
  color: #17a2b8;
}
.br-menu-sub .nav-link.active::before {
  width: 20px;
  left: -15px;
  opacity: 1;
  background-color: #17A2B8;
}

@media (min-width: 992px) {
  .collapsed-menu .br-logo {
    left: -230px;
  }
  .collapsed-menu .br-header {
    left: 0;
  }
  .collapsed-menu .br-sideleft {
    width: 60px;
  }
  .collapsed-menu .br-mainpanel {
    margin-left: 60px;
  }
  .collapsed-menu .menu-item-icon {
    transform: translateX(-4px);
  }
  .collapsed-menu .br-sideleft .sidebar-label {
    visibility: hidden;
  }
  .collapsed-menu .info-list {
    display: none;
  }
  .collapsed-menu .br-contentpanel {
    margin-left: 290px;
  }
}

@media (min-width: 992px) {
  .expand-menu .br-sideleft .sidebar-label {
    visibility: visible;
  }
  .expand-menu .br-sideleft {
    width: 230px;
  }
  .expand-menu .info-list {
    display: block;
  }
}

.br-sideright {
  position: fixed;
  top: 0;
  right: -280px;
  bottom: 0;
  z-index: 2000;
  width: 280px;
  background-color: #1D2939;
  transition: all 0.2s ease-in-out;
}
.br-sideright .tab-pane .ps__scrollbar-y-rail {
  visibility: hidden;
}

@media (max-width: 991px) {
  .show-left .br-header,
  .show-left .br-mainpanel {
    transform: translateX(230px);
  }
  .show-left .br-logo,
  .show-left .br-sideleft {
    left: 0;
    z-index: 2000;
  }
  .show-left .menu-item-label {
    display: block !important;
    opacity: 1 !important;
  }
  .show-left .br-contentpanel {
    transform: translateX(230px);
  }
}

.show-right .br-logo,
.show-right .br-sideleft,
.show-right .br-header,
.show-right .br-mainpanel,
.show-right .br-subleft,
.show-right .br-contentpanel {
  transform: translateX(-280px);
}
.show-right .br-sideright {
  right: 0;
}

.show-left,
.show-right {
  overflow: hidden;
}
.show-left::before,
.show-right::before {
  content: '';
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2000;
  background-color: rgba(29, 41, 57, 0.25);
}

@media (min-width: 992px) {
  .show-left::before {
    display: none;
  }
}

.show-left.show-right::before {
  display: block;
}

.sidebar-tabs {
  height: 60px;
  background-color: #18222f;
  border-bottom: 0;
}
.sidebar-tabs .nav-item {
  margin-bottom: 0;
  width: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.sidebar-tabs .nav-link {
  color: #868e96;
  border: 0;
  padding: 13px 24px;
  border-radius: 0;
}
.sidebar-tabs .nav-link.active {
  background-color: #1D2939;
  color: #00b297;
}

.contact-list-link {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.6);
  display: block;
  border-radius: 2px;
  transition: all 0.2s ease-in-out;
}
.contact-list-link.new {
  background-color: #1a2534;
}
.contact-list-link .d-flex {
  align-items: center;
  justify-content: flex-start;
  padding: 10px 15px;
}
.contact-list-link .contact-person {
  margin-left: 10px;
  margin-right: auto;
}
.contact-list-link:hover, .contact-list-link:focus {
  color: #fff;
  background-color: #18222f;
}
.contact-list-link + .contact-list-link {
  margin-top: 1px;
}

.contact-status-indicator {
  width: 10px;
  height: 10px;
  position: absolute;
  bottom: 0;
  right: 0;
  border: 2px solid #1D2939;
  border-radius: 50px;
}

.media-file-list {
  padding: 0 25px 20px;
  margin-top: 20px;
}
.media-file-list .media-body {
  color: rgba(255, 255, 255, 0.8);
  margin-left: 10px;
  margin-right: auto;
}

.sidebar-datepicker {
  padding-left: 25px;
  padding-right: 25px;
  position: relative;
}
.sidebar-datepicker .ui-datepicker-inline {
  position: relative;
  font-size: 13px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background-color: transparent;
  border-radius: 0;
}
.sidebar-datepicker .ui-datepicker-inline .ui-datepicker-title {
  color: #fff;
  font-size: 11px;
  font-weight: 400;
}
.sidebar-datepicker .ui-datepicker-header {
  text-align: center;
  padding-bottom: 10px;
  color: #fff;
}
.sidebar-datepicker .ui-datepicker-header .ui-datepicker-next:hover::before, .sidebar-datepicker .ui-datepicker-header .ui-datepicker-next:focus::before,
.sidebar-datepicker .ui-datepicker-header .ui-datepicker-prev:hover::before,
.sidebar-datepicker .ui-datepicker-header .ui-datepicker-prev:focus::before {
  color: #fff;
}
.sidebar-datepicker .ui-datepicker-calendar {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
.sidebar-datepicker .ui-datepicker-calendar thead th {
  text-transform: uppercase;
  color: #17a2b8;
  font-weight: normal;
  font-size: 10px;
  text-align: center;
  padding-bottom: 5px;
  padding-left: 0;
  padding-right: 0;
}
.sidebar-datepicker .ui-datepicker-calendar td {
  border: 0;
  background-color: transparent;
}
.sidebar-datepicker .ui-datepicker-calendar td a {
  background-color: transparent;
}
.sidebar-datepicker .ui-datepicker-calendar .ui-state-default {
  display: block;
  text-align: center;
  padding: 2px;
  color: rgba(255, 255, 255, 0.6);
  font-size: 12px;
  border: 1px solid transparent;
}
.sidebar-datepicker .ui-datepicker-calendar .ui-state-default:hover, .sidebar-datepicker .ui-datepicker-calendar .ui-state-default:focus {
  background-color: #1a2432;
  color: #fff;
}
.sidebar-datepicker .ui-datepicker-calendar .ui-datepicker-today .ui-state-default {
  background-color: transparent;
  color: #00b297;
  border-color: #00b297;
}

.sidebar-event-list .list-group-item {
  background-color: transparent;
  border-color: rgba(255, 255, 255, 0.1);
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.sidebar-event-list .list-group-item:first-child {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.sidebar-event-list .list-group-item:last-child {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.br-mainpanel {
  margin-left: 0;
  margin-top: 60px;
  transition: all 0.2s ease-in-out;
}
@media (min-width: 992px) {
  .br-mainpanel {
    margin-left: 230px;
  }
}

.br-pageheader {
  display: flex;
  align-items: center;
  background-color: #dee2e6;
  padding-left: 20px;
  padding-right: 20px;
}
.br-pageheader .breadcrumb {
  background-color: transparent;
}
.br-pageheader .breadcrumb-item:not(.active) {
  color: #868e96;
}
.br-pageheader .breadcrumb-item:not(.active):hover, .br-pageheader .breadcrumb-item:not(.active):focus {
  color: #495057;
}
.br-pageheader .breadcrumb-item.active {
  color: #495057;
}

.br-pagebody {
  margin-top: 30px;
}
@media (min-width: 576px) {
  .br-pagebody {
    padding: 0 30px;
  }
}

.br-section-wrapper {
  background-color: #fff;
  padding: 30px 20px;
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.21);
}
@media (min-width: 576px) {
  .br-section-wrapper {
    padding: 30px;
    border-radius: 3px;
  }
}
@media (min-width: 992px) {
  .br-section-wrapper {
    padding: 60px;
  }
}

.br-footer {
  font-size: 12px;
  padding: 20px;
}
.br-footer a {
  color: #868e96;
}
.br-footer a:hover, .br-footer a:focus {
  color: #343a40;
}
.br-footer .footer-right {
  margin-top: 20px;
}
@media (min-width: 480px) {
  .br-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .br-footer .footer-right {
    margin-top: 0;
  }
}
@media (min-width: 576px) {
  .br-footer {
    padding: 30px;
  }
}

.br-contentpanel {
  margin-top: 60px;
  transition: all 0.2s ease-in-out;
}
@media (min-width: 992px) {
  .br-contentpanel {
    margin-left: 230px;
  }
}

.tooltip-static-demo .tooltip {
  z-index: 1;
  opacity: 1;
  position: relative;
  display: inline-block;
  margin: 0 10px;
}
.tooltip-static-demo .bs-tooltip-top .arrow, .tooltip-static-demo .tooltip.bs-tooltip-auto[x-placement^="top"] .arrow,
.tooltip-static-demo .bs-tooltip-bottom .arrow,
.tooltip-static-demo .tooltip.bs-tooltip-auto[x-placement^="bottom"] .arrow {
  left: 50%;
  margin-left: -2px;
}
.tooltip-static-demo .bs-tooltip-left, .tooltip-static-demo .tooltip.bs-tooltip-auto[x-placement^="left"],
.tooltip-static-demo .bs-tooltip-right,
.tooltip-static-demo .tooltip.bs-tooltip-auto[x-placement^="right"] {
  margin-top: 5px;
}
.tooltip-static-demo .bs-tooltip-left .arrow, .tooltip-static-demo .tooltip.bs-tooltip-auto[x-placement^="left"] .arrow,
.tooltip-static-demo .bs-tooltip-right .arrow,
.tooltip-static-demo .tooltip.bs-tooltip-auto[x-placement^="right"] .arrow {
  top: 50%;
  margin-top: -3px;
}

.popover-static-demo .popover {
  z-index: 1;
  opacity: 1;
  position: relative;
  display: inline-block;
  margin: 0 10px;
}
.popover-static-demo .bs-popover-top .arrow, .popover-static-demo .popover.bs-popover-auto[x-placement^="top"] .arrow,
.popover-static-demo .bs-popover-bottom .arrow,
.popover-static-demo .popover.bs-popover-auto[x-placement^="bottom"] .arrow {
  left: 50%;
  margin-left: -5px;
}
.popover-static-demo .bs-popover-left, .popover-static-demo .popover.bs-popover-auto[x-placement^="left"],
.popover-static-demo .bs-popover-right,
.popover-static-demo .popover.bs-popover-auto[x-placement^="right"] {
  margin-top: 5px;
}
.popover-static-demo .bs-popover-left .arrow, .popover-static-demo .popover.bs-popover-auto[x-placement^="left"] .arrow,
.popover-static-demo .bs-popover-right .arrow,
.popover-static-demo .popover.bs-popover-auto[x-placement^="right"] .arrow {
  top: 50%;
  margin-top: -5px;
}

/* ##### EMAIL PAGE ##### */
.email {
  /*
  &.expand-menu {
    .br-subleft { left: 30px; }
    .br-mailbox-list { left: 250px; }
    .br-header-left .input-group { width: 190px; }
    .br-mailbox-body { margin-left: 570px; }
  }*/
}
.email.collapsed-menu .br-subleft {
  left: 60px;
}
.email.collapsed-menu .br-mailbox-list {
  left: 290px;
}
.email.collapsed-menu .br-mailbox-body {
  margin-left: 600px;
}
.email.show-right .br-subleft {
  left: -170px;
}
.email.show-right .br-mailbox-list {
  left: 50px;
}
.email.show-right .br-mailbox-body {
  margin-left: 370px;
  margin-right: 260px;
}
@media (max-width: 1199px) {
  .email .br-mailbox-list, .email.collapsed-menu .br-mailbox-list {
    width: auto;
    right: 0;
  }
  .email .br-mailbox-body, .email.collapsed-menu .br-mailbox-body {
    margin-left: 0;
    display: none;
  }
}
@media (max-width: 991px) {
  .email .br-subleft, .email.collapsed-menu .br-subleft {
    left: 0;
  }
  .email .br-mailbox-list, .email.collapsed-menu .br-mailbox-list {
    left: 230px;
  }
  .email.show-left .br-sideleft {
    left: 0;
  }
  .email.show-left .br-subleft {
    left: 230px;
  }
  .email.show-left .br-mailbox-list {
    transform: translateX(230px);
  }
  .email.show-right .br-subleft {
    left: -230px;
  }
  .email.show-right .br-mailbox-list {
    transform: translateX(-260px);
  }
}
@media (max-width: 575px) {
  .email .br-subleft, .email.collapsed-menu .br-subleft {
    left: -230px;
  }
  .email .br-mailbox-list, .email.collapsed-menu .br-mailbox-list {
    left: 0;
  }
  .email.show-mb-left .br-subleft, .email.collapsed-menu.show-mb-left .br-subleft {
    left: 0;
  }
  .email.show-mb-left .br-mailbox-list, .email.collapsed-menu.show-mb-left .br-mailbox-list {
    transform: translateX(230px);
  }
  .email.show-mb-left.show-left .br-subleft, .email.collapsed-menu.show-mb-left.show-left .br-subleft {
    left: 230px;
  }
  .email.show-mb-left.show-left .br-mailbox-list, .email.collapsed-menu.show-mb-left.show-left .br-mailbox-list {
    transform: translateX(460px);
  }
  .email.show-mb-left.show-right .br-subleft, .email.collapsed-menu.show-mb-left.show-right .br-subleft {
    transform: translateX(-280px);
  }
  .email.show-mb-left.show-right .br-mailbox-list, .email.collapsed-menu.show-mb-left.show-right .br-mailbox-list {
    transform: translateX(-280px);
  }
}

.br-subleft {
  position: fixed;
  left: 0;
  top: 60px;
  bottom: 0;
  width: 230px;
  padding: 10px;
  z-index: 10;
  background-color: #26354a;
  transition: all 0.2s ease-in-out;
}
.br-subleft .btn-compose {
  text-transform: uppercase;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  font-size: 11px;
  font-family: "Roboto", "Helvetica Neue", Arial, sans-serif;
  letter-spacing: 1px;
}
.br-subleft .btn-compose i {
  font-size: 18px;
  line-height: 0;
  margin-right: 7px;
  margin-top: -2px;
}

.br-nav-mailbox {
  margin-top: 10px;
}
.br-nav-mailbox .nav-link {
  color: rgba(255, 255, 255, 0.75);
  display: flex;
  align-items: center;
  height: 38px;
  padding: 0 10px;
  border-radius: 2px;
}
.br-nav-mailbox .nav-link i {
  line-height: 0;
  width: 20px;
  font-size: 24px;
  margin-right: 10px;
  text-align: center;
}
.br-nav-mailbox .nav-link i.ion-ios-folder-outline {
  font-size: 18px;
}
.br-nav-mailbox .nav-link i.ion-ios-pricetag-outline {
  font-size: 18px;
}
.br-nav-mailbox .nav-link:hover, .br-nav-mailbox .nav-link:focus {
  background-color: #223043;
  color: #17A2B8;
}
.br-nav-mailbox .nav-link.active {
  background-color: #223043;
  color: #17A2B8;
}
.br-nav-mailbox .nav-link + .nav-link {
  margin-top: 1px;
}

.show-mailbox-left {
  border-right: 1px solid #dee2e6;
  color: #868e96;
  height: 100%;
  width: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: -15px;
  font-size: 14px;
}
.show-mailbox-left:hover, .show-mailbox-left:focus {
  color: #343a40;
}

.br-mailbox-list {
  position: fixed;
  top: 60px;
  bottom: 0;
  left: 230px;
  width: 320px;
  overflow-y: auto;
  background-color: #fff;
  z-index: 100;
  border-right: 1px solid #ced4da;
  transition: all 0.2s ease-in-out;
}

.br-mailbox-list-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 60px;
  border-bottom: 1px solid #e9ecef;
  padding: 0 15px;
}
.br-mailbox-list-header .btn-group .btn, .br-mailbox-list-header .btn-group .sp-container button, .sp-container .br-mailbox-list-header .btn-group button {
  padding: 8px 10px;
  border: 0;
}

.br-mailbox-list-item {
  position: relative;
  padding: 10px 15px;
  background-color: #f8f9fa;
  transition: all 0.2s ease-in-out;
}
.br-mailbox-list-item::before {
  content: '';
  position: absolute;
  top: 50%;
  bottom: 50%;
  left: 0;
  width: 2px;
  background-color: #adb5bd;
  opacity: 0;
  transition: all 0.2s ease-in-out;
}
.br-mailbox-list-item:hover, .br-mailbox-list-item:focus {
  background-color: #f2f4f6;
  cursor: pointer;
}
.br-mailbox-list-item:hover::before, .br-mailbox-list-item:focus::before {
  top: -1px;
  bottom: -1px;
  opacity: 1;
}
.br-mailbox-list-item.unread, .br-mailbox-list-item.unread:hover, .br-mailbox-list-item.unread:focus {
  background-color: #fff;
}
.br-mailbox-list-item.active, .br-mailbox-list-item.active:hover, .br-mailbox-list-item.active:focus {
  background-color: #fff;
}
.br-mailbox-list-item.active::before, .br-mailbox-list-item.active:hover::before, .br-mailbox-list-item.active:focus::before {
  background-color: #17A2B8;
  top: -1px;
  bottom: -1px;
  opacity: 1;
}
.br-mailbox-list-item + .br-mailbox-list-item {
  border-top: 1px solid #dee2e6;
}

.br-mailbox-body {
  margin-top: 60px;
  margin-left: 550px;
  transition: all 0.2s ease-in-out;
}

.br-msg-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 30px;
}
.br-msg-header .nav-link {
  font-size: 24px;
  color: #868e96;
}

.br-msg-body {
  background-color: #fff;
  padding: 40px;
  margin-left: 30px;
  margin-right: 30px;
  margin-bottom: 30px;
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.21);
  border-radius: 3px;
}
.br-msg-body p:last-child {
  margin-bottom: 0;
}

/** WITH SUB LEFT MENU **/
.with-subleft .br-subleft {
  left: -230px;
}
@media (min-width: 992px) {
  .with-subleft .br-subleft {
    left: 0;
  }
}
@media (min-width: 992px) {
  .with-subleft.collapsed-menu .br-subleft {
    left: 60px;
  }
}
@media (max-width: 991px) {
  .with-subleft.show-subleft {
    overflow: hidden;
  }
  .with-subleft.show-subleft .br-subleft {
    left: 0;
  }
  .with-subleft.show-subleft .br-contentpanel {
    transform: translateX(230px);
  }
  .with-subleft.show-subleft.show-left .br-subleft {
    left: 230px;
  }
  .with-subleft.show-subleft.show-left .br-contentpanel {
    transform: translateX(460px);
  }
  .with-subleft.show-subleft.show-right .br-subleft {
    transform: translateX(-280px);
  }
  .with-subleft.show-subleft.show-right .br-contentpanel {
    transform: translateX(-280px);
  }
}

/** SITEMAP **/
.br-sitemap-section a {
  color: #343a40;
}
.br-sitemap-section a:hover, .br-sitemap-section a:focus {
  color: #17A2B8;
}
.br-sitemap-section h6 {
  font-size: 16px;
  margin-top: 20px;
}
.br-sitemap-section h6:first-child {
  margin-top: 0;
}
.br-sitemap-section ol {
  padding-left: 0;
  list-style: none;
}
.br-sitemap-section ol > li {
  margin-top: 20px;
}
.br-sitemap-section ol > li a {
  color: #17A2B8;
  font-weight: 500;
}
.br-sitemap-section ol > li a:hover, .br-sitemap-section ol > li a:focus {
  color: #148ea1;
}
.br-sitemap-section ol > li:first-child {
  margin-top: 0;
}
.br-sitemap-section ul {
  list-style: none;
  margin-top: 5px;
  padding-left: 20px;
}
.br-sitemap-section ul li {
  position: relative;
}
.br-sitemap-section ul li::before {
  content: '';
  position: absolute;
  height: 1px;
  width: 8px;
  top: 50%;
  left: -18px;
  background-color: #17A2B8;
}

/* CONTACTS MANAGER */
.table-contact tbody tr td:nth-child(4), .table-contact tbody tr td:nth-child(5),
.table-contact tbody tr th:nth-child(4),
.table-contact tbody tr th:nth-child(5) {
  font-family: "Lato", "Helvetica Neue", Arial, sans-serif;
  font-size: 13px;
}
.table-contact tbody tr td:nth-child(4),
.table-contact tbody tr th:nth-child(4) {
  color: #495057;
}

/* #################### DASHBOARD SKINS #################### */
.br-simple-white {
  background-color: #f8f9fa;
}
.br-simple-white .br-sideleft {
  background-color: #fff;
  border-right: 1px solid #ced4da;
}
.br-simple-white .br-logo {
  box-shadow: 0 1px 4px 0px rgba(0, 0, 0, 0.16);
}
.br-simple-white .sidebar-label {
  color: #adb5bd;
  opacity: 1;
}
.br-simple-white .br-menu-link {
  color: #868e96;
}
.br-simple-white .br-menu-link:hover, .br-simple-white .br-menu-link:focus {
  color: #17A2B8;
  background-color: #f8f9fa;
}
.br-simple-white .br-menu-link.active {
  color: #fff;
}
.br-simple-white .br-menu-link:focus, .br-simple-white .br-menu-link:active {
  outline: none;
}
.br-simple-white .br-menu-link.show-sub {
  background-color: #f8f9fa;
  color: #17A2B8;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.br-simple-white .br-menu-link.show-sub.active {
  color: #fff;
}
.br-simple-white .br-menu-sub {
  background-color: #f8f9fa;
}
.br-simple-white .br-menu-sub .nav-link {
  color: #868e96;
}
.br-simple-white .br-menu-sub .nav-link::before {
  background-color: #adb5bd;
  opacity: 1;
}
.br-simple-white .br-menu-sub .nav-link:hover, .br-simple-white .br-menu-sub .nav-link:focus {
  color: #17A2B8;
}
.br-simple-white .br-menu-sub .nav-link:hover::before, .br-simple-white .br-menu-sub .nav-link:focus::before {
  width: 20px;
  left: -15px;
  opacity: 1;
  background-color: #17A2B8;
}
.br-simple-white .br-menu-sub .nav-link.active {
  color: #17a2b8;
}
.br-simple-white .br-menu-sub .nav-link.active::before {
  width: 20px;
  left: -15px;
  opacity: 1;
  background-color: #17A2B8;
}
.br-simple-white .br-pageheader {
  background-color: #f8f9fa;
  border-bottom: 1px solid #e9ecef;
}
.br-simple-white .br-sideright {
  background-color: #fff;
}
.br-simple-white .br-sideright .more {
  color: #ced4da;
  opacity: 1;
}
.br-simple-white .br-sideright .more:hover, .br-simple-white .br-sideright .more:focus {
  color: #17A2B8;
}
.br-simple-white .br-sideright .switch-button-background {
  background-color: #adb5bd;
}
.br-simple-white .br-sideright .switch-button-background.checked {
  background-color: #00b297;
}
.br-simple-white .sidebar-tabs {
  background-color: #e9ecef;
}
.br-simple-white .sidebar-tabs .nav-link {
  color: #868e96;
  border: 0;
  padding: 13px 24px;
  border-radius: 0;
}
.br-simple-white .sidebar-tabs .nav-link.active {
  background-color: #fff;
  color: #00b297;
}
.br-simple-white .sidebar-tabs .nav-item:first-child .nav-link {
  border-left: 0;
}
.br-simple-white .contact-list-link {
  color: #495057;
}
.br-simple-white .contact-list-link.new {
  background-color: #f8f9fa;
}
.br-simple-white .contact-list-link:hover, .br-simple-white .contact-list-link:focus {
  color: #343a40;
  background-color: #e9ecef;
}
.br-simple-white .sidebar-datepicker .ui-datepicker-inline {
  border: 1px solid #dee2e6;
}
.br-simple-white .sidebar-datepicker .ui-datepicker-inline .ui-datepicker-title {
  color: #17A2B8;
}
.br-simple-white .sidebar-datepicker .ui-datepicker-header {
  color: #868e96;
}
.br-simple-white .sidebar-datepicker .ui-datepicker-header .ui-datepicker-next:hover::before, .br-simple-white .sidebar-datepicker .ui-datepicker-header .ui-datepicker-next:focus::before,
.br-simple-white .sidebar-datepicker .ui-datepicker-header .ui-datepicker-prev:hover::before,
.br-simple-white .sidebar-datepicker .ui-datepicker-header .ui-datepicker-prev:focus::before {
  color: #17A2B8;
}
.br-simple-white .sidebar-datepicker .ui-datepicker-calendar thead th {
  color: #343a40;
}
.br-simple-white .sidebar-datepicker .ui-datepicker-calendar .ui-state-default {
  color: #868e96;
}
.br-simple-white .sidebar-datepicker .ui-datepicker-calendar .ui-state-default:hover, .br-simple-white .sidebar-datepicker .ui-datepicker-calendar .ui-state-default:focus {
  background-color: #e9ecef;
  color: #17A2B8;
}
.br-simple-white .sidebar-datepicker .ui-datepicker-calendar .ui-datepicker-today .ui-state-default {
  color: #17A2B8;
  border-color: #17A2B8;
}
.br-simple-white .sidebar-event-list .list-group-item {
  border-color: #dee2e6;
}
.br-simple-white .br-subleft {
  background-color: #f8f9fa;
  border-right: 1px solid #dee2e6;
}
.br-simple-white .br-nav-mailbox .nav-link {
  color: #868e96;
}
.br-simple-white .br-nav-mailbox .nav-link:hover, .br-simple-white .br-nav-mailbox .nav-link:focus {
  background-color: #e9ecef;
  color: #17A2B8;
}
.br-simple-white .br-nav-mailbox .nav-link.active {
  background-color: #e9ecef;
  color: #17A2B8;
}

/* ############### PROFILE PAGE ############### */
.br-profile-page .card-header {
  background-color: #17A2B8;
  border-bottom: 0;
  border-radius: 0;
}
.br-profile-page .card-header a {
  color: rgba(255, 255, 255, 0.8);
}
.br-profile-page .card-body {
  background-color: #2e415b;
}
.br-profile-page .br-profile-body {
  max-width: 1150px;
  margin-left: auto;
  margin-right: auto;
  padding: 15px;
}
@media (min-width: 480px) {
  .br-profile-page .br-profile-body {
    padding: 30px;
  }
}
.br-profile-page .profile-skills {
  display: flex;
  flex-wrap: wrap;
}
.br-profile-page .profile-skills li {
  display: block;
  margin-right: 5px;
  margin-bottom: 5px;
}
.br-profile-page .profile-skills span {
  background-color: #e9ecef;
  padding: 5px 10px;
  display: inline-block;
  border-radius: 2px;
}
.br-profile-page .media-list .media + .media {
  border-top: 1px solid #e9ecef;
}
.br-profile-page .media-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 16px;
}
.br-profile-page .media-footer a {
  color: #adb5bd;
}

.headpanel {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
  z-index: 100;
  height: 70px;
  transition: all 0.2s ease-in-out;
}
.headpanel.scroll {
  box-shadow: 0 1px 4px 0px rgba(0, 0, 0, 0.16);
}
.headpanel .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 576px) {
  .headpanel .container {
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media (max-width: 991px) {
  .headpanel .container {
    max-width: none;
  }
}
@media (min-width: 992px) {
  .headpanel .container {
    padding-left: 15px;
    padding-right: 15px;
  }
}
.headpanel .container .nav {
  background-color: #fff;
  position: absolute;
  top: 70px;
  left: 0;
  width: 100%;
  flex-direction: column;
  padding: 20px 15px;
  border-top: 1px solid #e9ecef;
}
.headpanel .container .nav::after, .headpanel .container .nav::before {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 5px;
  background-color: #fff;
}
.headpanel .container .nav::before {
  z-index: 200;
}
.headpanel .container .nav::after {
  z-index: 100;
  bottom: -4px;
  box-shadow: 0 1px 4px 0px rgba(0, 0, 0, 0.16);
}
@media (min-width: 992px) {
  .headpanel .container .nav {
    flex-direction: row;
    position: relative;
    top: 0;
    left: auto;
    width: auto;
    padding: 0;
    border-top: 0;
  }
  .headpanel .container .nav::before, .headpanel .container .nav::after {
    display: none;
  }
}
.headpanel .logo {
  font-size: 24px;
  font-weight: bold;
  color: #343a40;
  position: relative;
  top: -2px;
}
.headpanel .logo span {
  color: #17A2B8;
  font-weight: normal;
}
.headpanel .nav-link {
  color: #495057;
}
.headpanel .nav-link:hover, .headpanel .nav-link:focus {
  color: #17A2B8;
}
.headpanel .nav-link.active, .headpanel .nav-link.active:hover, .headpanel .nav-link.active:focus {
  color: #17A2B8;
}

.br-home-header {
  display: flex;
  align-items: center;
  background-color: #fff;
}
.br-home-header .container {
  padding-top: 100px;
  padding-bottom: 30px;
}
@media (min-width: 992px) {
  .br-home-header {
    height: 100vh;
  }
  .br-home-header .container {
    padding-top: 0;
    padding-bottom: 0;
  }
}

.section2 {
  background-color: #26354a;
}

.btn-outline-white {
  border: 2px solid rgba(255, 255, 255, 0.7);
  color: #fff;
  padding-left: 25px;
  padding-right: 25px;
}
.btn-outline-white:hover, .btn-outline-white:focus {
  border-color: #fff;
  color: #fff;
}

.br-demo figure {
  position: relative;
  background-color: #fff;
  border-radius: 3px;
  padding: 15px;
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.21);
}
.br-demo figure:hover figcaption, .br-demo figure:focus figcaption {
  opacity: 1;
}
.br-demo figcaption {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 3px;
  transition: all 0.2s ease-in-out;
  opacity: 0;
  z-index: 10;
}
.br-demo figcaption .btn, .br-demo figcaption .sp-container button, .sp-container .br-demo figcaption button {
  text-transform: uppercase;
  font-size: 11px;
  font-weight: 500;
  font-family: "Montserrat", "Fira Sans", "Helvetica Neue", Arial, sans-serif;
  padding: 12px 25px;
  letter-spacing: 0.5px;
  border: 0;
}

.br-foot {
  background-color: #1D2939;
  font-size: 13px;
}
.br-foot .container {
  padding: 30px 15px;
}
@media (min-width: 768px) {
  .br-foot .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 0;
    padding-right: 0;
  }
}
.br-foot .social {
  display: block;
  margin-top: 10px;
}
@media (min-width: 768px) {
  .br-foot .social {
    display: inline-block;
    margin-left: 15px;
    margin-top: 0;
  }
}
.br-foot .social a {
  color: rgba(255, 255, 255, 0.5);
}
.br-foot .social a:hover, .br-foot .social a:focus {
  color: #fff;
}
.br-foot .social a + a {
  margin-left: 2px;
}

.br-holder {
  position: absolute;
  margin-top: -70px;
  height: 70px;
  visibility: hidden;
}

/**************************************/
/* Social btn */
.btn-mailru {
  background-color:#005ff9;
  border-color:#005ff9;
	color:#FFF;}
.btn-mailru .icon {color:#ff9e00;}
.btn-mailru:hover, .btn-mailru:focus {
    background-color:#005ff9;
    border-color:#005ff9;
    color:#FFF;}

.btn-yandex {
  background-color:#fac000;
  border-color:#fac000;
	color:#000;}
.btn-yandex .icon {color:#fc3f1d;}
.btn-yandex:hover, .btn-yandex:focus {
    background-color:#ffcc00;
    border-color:#ffcc00;
    color:#000;}

.btn-vkontakte {
  background-color: #4c75a3;
  border-color: #4c75a3;
  color: #fff; }
  .btn-vkontakte:hover, .btn-vkontakte:focus {
    background-color: #436891;
    border-color: #436891;
    color: #fff; }
	
.btn-google {
  background-color: #dd4b39;
  border-color: #dd4b39;
  color: #fff; }
  .btn-google:hover, .btn-google:focus {
    background-color: #bf3e2e;
    border-color: #bf3e2e;
    color: #fff; }

.btn-facebook {
  background-color: #3f7ddf;
  border-color: #3f7ddf;
  color: #fff; }
  .btn-facebook:hover, .btn-facebook:focus {
    background-color: #296edb;
    border-color: #296edb;
    color: #fff; }

.btn-twitter {
  background-color: #1da1f2;
  border-color: #1da1f2;
  color: #fff; }
  .btn-twitter:hover, .btn-twitter:focus {
    background-color: #0d95e8;
    border-color: #0d95e8;
    color: #fff; }

/* HR WITH TEXT */
.hr-text {
  line-height: 1em;
  position: relative;
  outline: 0;
  border: 0;
  color: black;
  text-align: center;
  height: 1em;
  opacity: .5;
}
.hr-text:before {
    content: '';
    background: linear-gradient(to right, transparent, #818078, transparent);
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    height: 1px;
  }
.hr-text:after {
    content: attr(data-content);
    position: relative;
    display: inline-block;
    color: black;

    padding: 0 .5em;
    line-height: 1em;
    color: #818078;
    background-color: #fcfcfa;
  }
}
/* DISABLE AND LOCK ON LOAD NEW CONTENT */
.loadingcontent
{
	opacity: 0.4; pointer-events: none;
}

/* HIDE BETA BLOCKS */
.beta {display:none !important;}
.devel {display:none !important;}body {
	margin: 0;
	background-color: #E9ECEF;
	font-family: "Roboto", "Helvetica Neue", Arial, sans-serif;
	line-height: 1.5;
	font-size: 0.875rem;
	font-weight: normal;
	color: #868ba1;
}

.show-right .profileleft {top:21px;}

a {
	text-decoration:none;
	color: #17a2b8;
}

a:hover, a:focus, a:active {
	text-decoration:none;
	color: #138496;	
}

.gul {
	border-bottom:1px #e9ecef solid;
	padding-bottom:5px;
	margin-bottom:14px;
	color:black;
}

.hidden {display:none}.form-check-label {
	font-size:15px;
}

.input-group .select2-container--default .select2-selection--single {
	border-radius:0px 4px 4px 0px;
}

.select2-container--default .select2-selection--single {
	color: #495057;
	height:38px;
    padding-top: 5px;
    padding-left: 4px;
	border: 1px solid #ced4da;
	font-size: 1rem;
	font-weight: 400;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 26px;
    position: absolute;
    top: 5px;
    right: 3px;
    width: 30px;
}

.btn-with-icon {
  padding: 0;
  display: inline-block;
  border-width: 0;
  display: block
}
.btn-with-icon > div {
  position: relative;
  display: flex;
}
.btn-with-icon > div > span {
  display: flex;
  height: 100%;
  align-items: center;
}
.btn-with-icon > div > span.icon {
  justify-content: center;
  background-color: rgba(0, 0, 0, 0.2);
}

/* AS GENDER IN PROFILE */

.btn-check input {
	display:none;
}
.btn-check label, .btn-check button {
	border:1px rgb(206, 212, 218) solid;
	height: 38px;
}
.btn-check button {
	background-color:rgb(233, 236, 239);
}
.btn-check label {
	padding-left:15px;
	padding-right:15px;
	color:#888;
}
.btn-check input:checked + label {
	background:#00b297;
	color:#FFF;
}

/* ------------------------ */

.optionlabel {color:#999999;}

/* EXPAND AS IN PROFILE POSTCODE */
.expand-select {
	margin-left: 45px !important;
	display:none;
	overflow-y: auto;
    position: absolute;
    background: #FFF;
	margin: 0;
	font-size: 13px;
    max-height: 170px;
	border-bottom:1px #e9ecef solid;
	border-top: 1px #e9ecef solid;
}
.expand-select li {
	border-width: 1px 1px 0px 1px;
	border-style: solid;
	border-color: #e9ecef;
	white-space: nowrap;
}
.expand-select li:first-child {
	border-top:0;
}
.expand-select a {
	display: block;
	padding: 7px 10px;
	transition: all 0.2s ease-in-out;
}
.expand-select a:hover, .expand-select a:focus {
	background-color: #f8f9fa;
}



.ckbox {
  font-weight: normal;
  position: relative;
  display: table;
  line-height: 18px;
  font-size:15px;
}
.ckbox span {
  padding-left: 6px;
}
.ckbox span:empty {
  float: left;
}
.ckbox span:before, .ckbox span:after {
  line-height: 18px;
  position: absolute;
}
.ckbox span:before {
  content: '';
  width: 16px;
  height: 16px;
  background-color: #fff;
  border: 1px solid #adb5bd;
  border-radius: 2px;
  top: 1px;
  left: 0;
}
.ckbox span:after {
  top: 1px;
  left: 0;
  width: 16px;
  height: 16px;
  content: '\f00c';
  font-family: "Font Awesome 5 Pro";
  font-size: 9px;
  text-align: center;
  color: #fff;
  background-color: #0866C6;
  line-height: 17px;
  border-radius: 2px;
  display: none;
}
.ckbox input[type='checkbox'] {
  opacity: 0;
  margin: 0 5px 0 0;
}
.ckbox input[type='checkbox']:checked + span:after {
  display: block;
}
.ckbox input[type='checkbox'][disabled] + span,
.ckbox input[type='checkbox'][disabled] + span:before,
.ckbox input[type='checkbox'][disabled] + span:after {
  opacity: .75;
}

.ckbox-inline {
  display: inline-block;
}

/* Checkbox color variant */
.ckbox-success span::after {
  background-color: #23bf08;
}

.ckbox-warning span::after {
  background-color: #f49917;
}

.ckbox-danger span::after {
  background-color: #DC3545;
}

.ckbox-info span::after {
  background-color: #17A2B8;
}

.ckbox-indigo span::after {
  background-color: #6610f2;
}

.ckbox-purple span::after {
  background-color: #6f42c1;
}

.ckbox-pink span::after {
  background-color: #e83e8c;
}

.ckbox-orange span::after {
  background-color: #f27510;
}

.ckbox-teal span::after {
  background-color: #00b297;
}

.ckbox-dark span::after {
  background-color: #343a40;
}

/* Radio Box */
.rdiobox {
  font-weight: normal;
  position: relative;
  display: block;
  line-height: 18px;
}
.rdiobox span {
  padding-left: 6px;
}
.rdiobox span:before, .rdiobox span:after {
  line-height: 18px;
  position: absolute;
}
.rdiobox span:before {
  content: '';
  width: 16px;
  height: 16px;
  background-color: #fff;
  border: 1px solid #adb5bd;
  border-radius: 50px;
  top: 2px;
  left: 0;
}
.rdiobox span:after {
  content: '';
  width: 6px;
  height: 6px;
  background-color: #fff;
  border-radius: 50px;
  top: 7px;
  left: 5px;
  display: none;
}
.rdiobox input[type='radio'] {
  opacity: 0;
  margin: 0 5px 0 0;
}
.rdiobox input[type='radio']:checked + span:before {
  border-color: transparent;
  background-color: #0866C6;
}
.rdiobox input[type='radio']:checked + span:after {
  display: block;
}
.rdiobox input[type='radio'][disabled] + span,
.rdiobox input[type='radio'][disabled] + span:before,
.rdiobox input[type='radio'][disabled] + span:after {
  opacity: .75;
}

.rdiobox-inline {
  display: inline-block;
}

/* Radiobox Color Variant */
.rdiobox-success input[type='radio']:checked + span:before {
  background-color: #23bf08;
}

.rdiobox-warning input[type='radio']:checked + span:before {
  background-color: #f49917;
}

.rdiobox-danger input[type='radio']:checked + span:before {
  background-color: #DC3545;
}

.rdiobox-info input[type='radio']:checked + span:before {
  background-color: #17A2B8;
}

.rdiobox-indigo input[type='radio']:checked + span:before {
  background-color: #6610f2;
}

.rdiobox-purple input[type='radio']:checked + span:before {
  background-color: #6f42c1;
}

.rdiobox-orange input[type='radio']:checked + span:before {
  background-color: #f27510;
}

.rdiobox-pink input[type='radio']:checked + span:before {
  background-color: #e83e8c;
}

.rdiobox-teal input[type='radio']:checked + span:before {
  background-color: #00b297;
}

.rdiobox-dark input[type='radio']:checked + span:before {
  background-color: #343a40;
}

/* Inside input group */
.input-group-addon .ckbox, .input-group-addon .ckbox input,
.input-group-addon .rdiobox,
.input-group-addon .rdiobox input {
  margin: 0;
}.toggle-btn {
	width: 60px;
	height: 60px;
	text-align: center;
	cursor:pointer;
	color:#868e96;
	font-size:22px;
}
.toggle-btn:hover > i {color:#343a40;}
.toggle-btn > i {padding: 19px 0;}
.toggle-left {border-right: 1px solid rgba(0, 0, 0, 0.15);}
.toggle-right {border-left: 1px solid rgba(0, 0, 0, 0.15);}
.switch-button-label {
  font-size: 11px;
}
.switch-button-label.on {
  color: #00b297;
}

.switch-button-background {
  border: 0;
  position: relative;
  top: 0;
  background-color: #2e415b;
  border-radius: 2px;
  width: 29px !important;
  height: 15px !important;
}
.switch-button-background.checked {
  background-color: #00b297;
}
.switch-button-background.checked .switch-button-button {
  left: 14px !important;
}

.switch-button-button {
  top: auto;
  border: 0;
  border-radius: 2px;
  transition: all 0.2s ease-in-out;
  top: 2px !important;
  left: 2px !important;
}.nav-link-profile {
  position: relative;
  color: #868e96;
  transition: all 0.2s ease-in-out;
}
.nav-link-profile img {
  opacity: .85;
  transition: all 0.2s ease-in-out;
}
.nav-link-profile .square-10 {
  right: 15px;
  bottom: 10px;
  position: absolute;
  border-radius: 100%;
  border: 2px solid #fff;
}
.nav-link-profile:hover, .nav-link-profile:focus {
  color: #495057;
}
.nav-link-profile:hover img, .nav-link-profile:focus img {
  opacity: 1;
}

.logged-name {
  display: inline-block;
  font-size: 13px;
  margin-right: 5px;
}

.user-profile-nav {
  margin: 0;
  font-size: 13px;
}
.user-profile-nav a {
  display: block;
  padding: 7px 10px;
  border-radius: 2px;
  transition: all 0.2s ease-in-out;
}
.user-profile-nav a:hover, .user-profile-nav a:focus {
  background-color: #dee2e6;
}
.user-profile-nav .icon {
  display: inline-block;
  width: 20px;
  line-height: 0;
  text-align: center;
  font-size: 16px;
  position: relative;
  color: #17a2b8;
  top: 2px;
  margin-right: 5px;
  text-align: left;
}
.user-profile-nav .ion-ios-folder,
.user-profile-nav .ion-power {
  font-size: 18px;
}.secondmenu {
	display: flex;
	flex-direction: column;
	padding-left: 0;
	margin-bottom: 0;
}
.secondmenu li {
	width:100%;
	position: relative;
	display: block;
	padding: 0px;
	margin: 0px;
	border-bottom:1px #e9ecef solid;
}
.secondmenu li:focus, .secondmenu li:hover {
	color: #495057;
	text-decoration: none;
	background-color: #f8f9fa;
}

@media (min-width: 768px)
{
	.secondmenu .activesecondmenu {
		color: black;
		background-color: #f3f6f9;
	}
	.secondmenu li:active {
		background-color: #e9ecef;
	}
}
.secondmenu li:first-child {
	border-top:1px #e9ecef solid;
}
.secondmenu a {
	padding: 0.75rem 1.25rem;
	display: block;
	width: 100%;
}
.secondmenu a i {
	position: absolute;
	font-size: 26px;
}
.secondmenu a div {
	margin-left:40px;
}
.secondmenu a div span {
	font-size:14px;
	color: #868ba1;
}
.secondmenu a div .badge{
	font-size:12px;
	color: #FFF;
}
.secondmenu .disabled {
	pointer-events: none;
    opacity: 0.4;
}


/* PROFILE'S TYPE PAGES */

.profileleft {
	position: fixed;
	top: 82px;
	bottom: 0px;
	overflow-y: auto;
	z-index: 90;
	width: 390px;
	margin-bottom:20px;
	padding-left: 20px;
    margin-right: 20px;	
}
.profilecontent {
	z-index:95;
	margin-left:390px;
	padding-top:21px;
	padding-left: 20px;
    padding-right: 20px;
	margin-bottom:20px;
}
.br-footer {display:none;}
#closesub {display:none;}
@media (max-width: 950px) {
	.profilecontent
	{
		display:none;
		margin-left:0px;
		padding:5px;
		margin-bottom: 0px;
	}
	.profileleft {
		width:100%;
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 20px;
		margin: 0px;
		padding-top: 0;
	}
@media (min-width: 768px)
{
	.secondmenu .activesecondmenu {
		color: #0866C6 !important;
		background-color: white !important;;
	}
	.secondmenu li:active {
		background-color: white !important;;
	}
}
	#closesub {
		position: absolute;
		z-index: 80;
		right: 14px;
		padding: 8px;
		display:block;
	}
}.fix185 {position:absolute; right:15px; margin-top:3px;float:right;}.page-item .page-link {
	color:#333333;
	background-color:#e9ecef;
}
.page-item .page-link:hover, .page-item .page-link:focus {
	color:#343a40;
	background-color:#ced4da;
}
.page-item.disabled .page-link {
	background-color:#e9ecef;
	color: #adb5bd;
}
.page-item.active .page-link, .page-item.active .page-link:hover, .page-item.active .page-link:focus
{
	background-color:#00b297;
	pointer-events: none;
	color:#FFF;
	border-color: #dee2e6;
}/* Generated by Glyphter (http://www.glyphter.com) on  Sat Nov 11 2023*/
@font-face {
    font-family: 'zen';
    src: url('zen/zen.eot');
    src: url('zen/zen.eot?#iefix') format('embedded-opentype'),
         url('zen/zen.woff') format('woff'),
         url('zen/zen.ttf') format('truetype'),
         url('zen/zen.svg#Glyphter') format('svg');
    font-weight: normal;
    font-style: normal;
}
.icon-zen:before{
	content:'\0041';
	display: inline-block;
	padding:0px;
	margin:0px;
	font-family: 'zen';
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale
}@media (max-width: 750px) {
    .d-sm-table-cell {
        display: none !important;
		b2ackground-color:red !important;
    }
}

.br-menu-link:hover, .br-menu-link:focus {
	text-decoration:none;
}

.btn-outline-sources {
    color: #17a2b8;
    border-color: #17a2b8;
}

.btn-outline-sources:hover {
	color: #fff;
    background-color: #17a2b8;
    border-color: #17a2b8;
}

.btn-sources {
	color: #fff;
    background-color: #17a2b8;
    border-color: #17a2b8;
}

.btn-sources:hover {
    color: #17a2b8;
	background-color: #FFF;
    border-color: #17a2b8;	
}


.btn-outline-sources2 {
    color: #17a2b8;
    border-color: #17a2b8;
}
.btn-outline-sources2:hover {
    color: #17a2b8;
    border-color: #17a2b8;
}

.btn-sources2 {
	color: #fff;
    background-color: #17a2b8;
    border-color: #17a2b8;
}

.btn-sources2:hover {
	color: #fff;
    background-color: #17a2b8;
    border-color: #17a2b8;
}