body {
  background: #eaf4f7;
}

.custom-card {
  box-shadow: 0 10px 30px 0 rgba(24, 28, 33, 0.05);
}

.main-header-center {
  .form-control {
    border: 1px solid #eceef5;

    &:focus {
      background: transparent;
    }
  }

  .select2-container--default .select2-selection--single {
    border-right: 0;
  }
}
Sign Out
.bg-primary {
  background-color: #02213b !important;

  &::hover, &::focus {
    background-color: #02213b !important;
  }
}

.bg-primary-transparent {
  background-color: rgba(29, 142, 235, 0.1);
}

.select2-container--classic {
  .select2-selection--single:focus, &.select2-container--open .select2-selection--single, .select2-selection--multiple:focus {
    border: 1px solid #02213b;
  }

  &.select2-container--open {
    .select2-selection--multiple {
      border: 1px solid #02213b;
    }

    .select2-dropdown {
      border-color: #02213b;
    }
  }
}

.main-header-center .search-btn {
  background-color: #02213b;
}

.text-primary {
  color: #02213b !important;

  &:hover, :focus {
    color: #02213b !important;
  }
}

.border-primary {
  border-color: #02213b !important;
}

.bd-primary {
  border-color: #02213b;
}

.card-item .card-item-icon.card-icon {
  background: rgba(76, 136, 178, 0.1);
  fill: #02213b;
}

.card-dashboard-calendar .ui-datepicker {
  .ui-datepicker-month {
    color: #02213b;
  }

  .ui-datepicker-calendar .ui-datepicker-today a {
    background-color: #02213b;
    border: 1px solid #02213b;
  }
}

#back-to-top {
  background: #02213b;
}

.ckbox span:after {
  background-color: #02213b;
}

.btn-primary {
  color: #fff !important;
  background-color: #02213b !important;
  border-color: #02213b !important;

  &:hover {
    color: #fff;
    background-color: #2499D7;
    border-color: #2499D7;
  }

  &:focus, &.focus {
    background-color: #2499D7;
    border-color: #2499D7;
    box-shadow: 0 0 0 1px rgba(89, 151, 202, 0.2);
  }

  &.disabled, &:disabled {
    color: #fff;
    background-color: #02213b;
    border-color: #02213b;
  }

  &:not(:disabled):not(.disabled) {
    &:active, &.active {
      color: #fff;
      background-color: #5492c5;
      border-color: #5492c5;
    }
  }
}

.show > .btn-primary.dropdown-toggle {
  color: #fff;
  background-color: #5492c5;
  border-color: #5492c5;
}

.btn-primary:not(:disabled):not(.disabled) {
  &:active:focus, &.active:focus {
    box-shadow: 0 0 0 1px rgba(89, 151, 202, 0.2);
  }
}

.show > .btn-primary.dropdown-toggle:focus {
  box-shadow: 0 0 0 1px rgba(89, 151, 202, 0.2);
}

.btn-main-primary {
  color: #fff !important;
  background-color: #02213b !important;
  border-color: #02213b !important;

  &:hover {
    color: #fff;
    background-color: #2499D7;
    border-color: #2499D7;
  }

  &:focus, &.focus {
    box-shadow: 0 0 0 1px rgba(63, 124, 173, 0.3);
  }

  &.disabled, &:disabled {
    color: #fff;
    background-color: #02213b;
    border-color: #02213b;
  }

  &:not(:disabled):not(.disabled) {
    &:active, &.active {
      color: #fff;
      background-color: #5492c5;
      border-color: #5492c5;
    }
  }
}

.show > .btn-main-primary.dropdown-toggle {
  color: #fff;
  background-color: #5492c5;
  border-color: #5492c5;
}

.btn-main-primary:not(:disabled):not(.disabled) {
  &:active:focus, &.active:focus {
    box-shadow: 0 0 0 1px rgba(63, 124, 173, 0.3);
  }
}

.show > .btn-main-primary.dropdown-toggle:focus {
  box-shadow: 0 0 0 1px rgba(63, 124, 173, 0.3);
}

.btn-outline-primary {
  color: #02213b !important;
  border-color: #02213b !important;

  &:hover {
    color: #fff !important;
    background-color: #02213b !important;
    border-color: #02213b !important;
  }

  &:focus, &.focus {
    box-shadow: 0 0 0 1px rgba(89, 151, 202, 0.2);
  }

  &.disabled, &:disabled {
    color: #02213b;
    background-color: transparent;
  }

  &:not(:disabled):not(.disabled) {
    &:active, &.active {
      color: #fff !important;
      background-color: #02213b;
      border-color: #02213b;
    }
  }
}

.show > .btn-outline-primary.dropdown-toggle {
  color: #fff !important;
  background-color: #02213b;
  border-color: #02213b;
}

.btn-outline-primary:not(:disabled):not(.disabled) {
  &:active:focus, &.active:focus {
    box-shadow: 0 0 0 1px rgba(89, 151, 202, 0.2);
  }
}

.show > .btn-outline-primary.dropdown-toggle:focus {
  box-shadow: 0 0 0 1px rgba(89, 151, 202, 0.2);
}

.btn-light {
  color: #2c3033;
  background-color: #f0f8ff;
  border-color: #f0f8ff;

  &:hover {
    color: #2c3033;
    background-color: #dbe3ea;
    border-color: #dbe3ea;
  }

  &:focus, &.focus {
    box-shadow: 0 0 0 1px rgb(225, 234, 241);
  }

  &.disabled, &:disabled {
    color: #2c3033;
    background-color: #dbe3ea;
    border-color: #dbe3ea;
  }

  &:not(:disabled):not(.disabled) {
    &:active, &.active {
      color: #2c3033;
      background-color: #dbe3ea;
      border-color: #dbe3ea;
    }
  }
}

.show > .btn-light.dropdown-toggle {
  color: #2c3033;
  background-color: #dbe3ea;
  border-color: #dbe3ea;
}

.btn-light:not(:disabled):not(.disabled) {
  &:active:focus, &.active:focus {
    box-shadow: 0 0 0 1px rgb(225, 234, 241);
  }
}

.show > .btn-light.dropdown-toggle:focus {
  box-shadow: 0 0 0 1px rgb(225, 234, 241);
}

.bg-primary {
  color: #fff !important;
  background-color: #02213b;
}

a.bg-primary {
  &:hover {
    color: #fff !important;
    background-color: #02213b;
  }

  &:focus {
    color: #fff !important;
    background-color: #02213b;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(96, 181, 251, 0.5);
  }

  &.focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(96, 181, 251, 0.5);
  }
}

.bg-light {
  color: #55606b;
  background-color: #f0f8ff;
}

a.bg-light {
  &:hover {
    color: #8fb1c0;
    background-color: #d5dde4;
  }

  &:focus {
    color: #8fb1c0;
    background-color: #d5dde4;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(244, 246, 248, 0.5);
  }

  &.focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(244, 246, 248, 0.5);
  }
}

.main-nav-column .nav-link.active {
  color: #02213b;

  &:hover, &:focus {
    color: #02213b;
  }
}

a {
  color: #02213b;

  &:hover {
    color: #02213b ;
  }
}

.main-nav-line-chat .nav-link.active, .main-msg-send {
  color: #02213b;
}

.main-calendar {
  .fc-view.fc-agenda-view .fc-day-header.fc-today > a {
    color: #02213b;
  }

  td.fc-today .fc-day-number {
    background-color: #02213b;

    &:hover, &:focus {
      background-color: #02213b;
    }
  }
}

.main-avatar {
  background-color: #02213b;
}

.page-item.active .page-link {
  background-color: #02213b;
  border-color: #02213b;
  z-index:0;
}

table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > {
  td:first-child:before, th:first-child:before {
    background-color: #02213b;
  }
}

pre {
  background-color: #ecebfb;
}

.flat a {
  &:hover, &.active, &:hover:after, &.active:after {
    background: #02213b;
    color: #fff;
  }
}

.nav-pills .nav-link.active {
  background-color: #02213b !important;
}

.main-nav .nav-link.active {
  color: #02213b;
}

.accordion .card-header a {
  color: #02213b;
  background-color: #e1e1f9;
}

.accordion-color .card-header a.collapsed {
  background-color: #02213b;
}

.timeline-wrapper-primary {
  .timeline-panel:before, .timeline-badge {
    background: #02213b;
  }
}

.br-theme-bars-1to10 .br-widget a {
  &.br-active, &.br-selected {
    background-color: #02213b;
  }

  background-color: #f0f2f8;
}

.br-theme-bars-movie .br-widget a {
  &.br-active, &.br-selected {
    background-color: #02213b;
  }
}

.br-theme-bars-square .br-widget a {
  &.br-active, &.br-selected {
    border: 2px solid #f0f2f8;
    color: #02213b;
  }
}

.br-theme-bars-pill .br-widget a {
  &.br-active, &.br-selected {
    background-color: #02213b;
    color: white;
  }
}

.br-theme-bars-horizontal .br-widget a {
  &.br-active, &.br-selected {
    background-color: #02213b;
  }
}

.main-content-body-profile .main-nav-line .nav-link.active {
  color: #02213b;
}

.table-striped tbody tr:nth-of-type(2n+1) {
  background-color: #f6f8ff;
}

.custom-switch-input:checked ~ .custom-switch-indicator {
  background: #02213b;
}

.rdiobox input[type='radio']:checked + span:before {
  border-color: transparent;
  background-color: #02213b;
}

.form-control {
  &:disabled, &[readonly] {
    background-color: #f6f6ff;
  }
}

.selectgroup-input:checked + .selectgroup-button {
  border-color: #02213b;
  color: #02213b;
  background: #e5e9f3;
}

.input-group-text {
  background-color: #f6f6ff;
  border: 1px solid #e8e8f7;
}

.ui-datepicker {
  .ui-datepicker-header {
    .ui-datepicker-next::before, .ui-datepicker-prev::before {
      background: rgba(76, 136, 178, 0.1);
      color: #02213b;
    }
  }

  .ui-datepicker-calendar .ui-datepicker-today a {
    background-color: #02213b;
    color: #fff;

    &:hover, &:focus {
      background-color: #02213b;
      color: #fff;
    }
  }
}

.irs-bar {
  background-color: #02213b;
}

.irs-from, .irs-to, .irs-single {
  color: #fff;
  background: #02213b;
}

.irs-line-mid, .irs-line-right {
  background-color: #f0f8ff;
}

.irs-min, .irs-max {
  color: #78769a;
  background: #f2f1ff;
}

.select2-container--default {

  &.select2-container--disabled .select2-selection--single {
    background-color: #f2f1ff;
  }

  .select2-selection--single {
    background-color: #fff;
    border: 1px solid #e8e8f7;
  }
}

.ff_fileupload_wrap .ff_fileupload_dropzone {
  border: 2px dashed #dcd9f5;
  background-color: #f2f1ff;
}

.select2-container--default {
  .select2-results__option--highlighted[aria-selected] {
    background-color: #f8f9ff !important;
    color: #02213b;
  }

  .select2-results__option[aria-selected=true] {
    background-color: #f1f2f9;
  }
}

.wizard > .steps {
  .current a {
    .number, &:hover .number, &:active .number {
      background-color: #02213b;
      color: #fff;
    }
  }

  a {
    .number, &:hover .number, &:active .number {
      color: #8fb1c0;
      background-color: #f0f8ff;
    }
  }
}

.profile-cover__info .nav strong, .profile-tab .main-nav-line .nav-link.active {
  color: #02213b;
}

.pricing-tabs .nav-price li .active {
  background: #ececfc;
  color: #02213b;
}

.table-hover tbody tr:hover {
  background-color: #f8f8ff;
}

.bg-transparent {
  background-color: transparent;
}

.bg-gray-100 {
  background-color: #eaf4fb;
}

.bg-gray-200 {
  background-color: #d0e4ec;
}

.bg-gray-300 {
  background-color: #bacede;
}

.bg-gray-400 {
  background-color: #8fa8b7;
}

.bg-gray-500 {
  background-color: #718596;
}

.bg-gray-600 {
  background-color: #4f6071;
}

.bg-gray-700 {
  background-color: #3c4f5d;
}

.bg-gray-800 {
  background-color: #263444;
}

.bg-gray-900 {
  background-color: #1b2733;
}

.signpages .details:before {
  background: rgba(76, 132, 178, 0.96);
}

.construction:before {
  background: rgba(76, 132, 178, 0.96);
}


.tag-primary, .progress-bar {
  background-color: #02213b;
}

.breadcrumb {
  background-color: #f0f8ff;
}

.bg-primary .main-nav .nav-link.active, .bg-secondary .main-nav .nav-link.active {
  color: #fff;
}

.popover-header {
  background-color: #02213b;
  color: #fff;
}

.lds-heart div {
  &:after, &:before {
    background: #02213b;
  }
}

.lds-ripple div {
  border: 4px solid #02213b;
}

.lds-spinner div:after {
  background: #02213b;
}

.select2-container--default .select2-selection--multiple {
  .select2-selection__choice {
    background-color: #e0e2f7;
    border: 1px solid #e0e2f7;
    color: #1d272f;
  }

  .select2-selection__choice__remove {
    color: #1d272f;
  }
}

.lds-circle > div {
  background: #02213b;
}

.lds-dual-ring:after {
  border: 5px solid #02213b;
  border-color: #02213b transparent #02213b transparent;
}

.lds-facebook div {
  background: #02213b;
}

.main-navbar {
  .nav-item.active .nav-link {
    color: #02213b;

    &.with-sub::after {
      color: #02213b;
    }
  }

  .nav-sub-item.active > .nav-sub-link {
    color: #02213b;

    &:before {
      color: #02213b;
    }
  }

  .nav-sub-link {
    &:hover, &:focus {
      color: #02213b;
    }
  }
}

@media (min-width: 992px) {
  .main-navbar {
    .nav-sub-link {
      &:hover, &:focus {
        color: #02213b;
      }
    }

    &.hor-menu .nav-sub-item.active a {
      color: #02213b;
    }

    .nav-sub-item.active > .nav-sub-link {
      color: #02213b;

      &:before {
        color: #02213b;
      }
    }
  }
}

@media (max-width: 991px) {
  .main-navbar {
    &.hor-menu .nav-sub-item.active a {
      color: #ffffff;
    }

    .nav-sub-item.active > .nav-sub-link {
      color: #ffffff;

      &:before {
        color: #ffffff;
      }
    }
  }
}

.main-form-search {
  .btn, .sp-container button {
    background-color: #02213b;
  }
}

.nav-tabs .nav-link {
  &:hover, &:focus {
    background-color: #02213b !important;
    color: #ffffff !important;
  }
}

.lds-heart div {
  background: #02213b;
}

.accordion .card-header a.collapsed {
  &:hover, &:focus {
    background-color: #02213b;
    color: #fff;
  }
}

.main-sidebar-body li.active {
  .sidemenu-label, i {
    color: #02213b;
  }
}

.light-horizontal .main-navbar {
  &.hor-menu .nav-item {
    &.active .nav-link, &:hover .nav-link {
      color: #02213b;
    }
  }

  .nav-link, .nav-item:hover .nav-link.with-sub::after {
    color: #7b8da2;
  }
}

.first-sidemenu {
  background: #02213b;
}

.resp-tabs-list li {
  &.resp-tab-item.active::after, &.resp-tab-active::after, &.resp-tab-item.active::before, &.resp-tab-active::before {
    border-right: 20px solid #02213b;
  }
}

.second-sidemenu {
  .slide-item.active, .menu .slide-item.active:before, .slide-item:hover, .menu .slide-item:hover:before {
    color: #02213b;
  }
}

.main-sidebar-body {
  .nav-sub-link {
    &:hover, &:focus {
      color: #fff;
    }
  }

  .nav-sub .nav-sub-item.active .nav-sub-link:before {
    color: #fff;
    opacity: 0.9;
  }

  li.active .sidemenu-icon {
    background: #02213b;
  }
}

.project .deadline {
  background: #eaf4f7;
}

.project-status.primary:before {
  border-left: 3px solid #02213b;
}

.bg-primary-light {
  background-color: rgba(89, 142, 202, 0.16);
  color: #5997c9;
}

.bg-warning-light {
  background-color: #fdf5e2;
  color: #ebb322;
}

.bg-danger-light {
  background-color: #ffe7e8;
  color: #f16d75;
}

.peity {
  &:before {
    content: '5%';
    position: absolute;
  }

  position: relative;
}

.list-card {
  background: #f6f9fb;
}

.forth.circle .chart-circle-value.circle-style {
  border: 2px dotted #a5d0f4;
  background: #fcfcff;
}

.color-leftmenu {
  .main-sidebar-sticky {
    background: #02213b;
  }

  .main-sidebar-body {
    .sub-txt {
      color: #96c7ef;
    }

    .nav-label {
      color: rgba(209, 213, 230, 0.4);
    }
  }
}

.dark-theme.light-leftmenu .second-sidemenu {
  .slide-item.active, .menu .slide-item.active:before {
    color: #02213b;
  }
}

.resp-tabs-list li {
  &.resp-tab-item.active .side-menu__icon, &.resp-tab-active .side-menu__icon {
    background: #02213b;
  }
}

.crypto-btc-usd .nav-link.active {
  background-color: #02213b !important;
  color: #fff;
}

.irs-slider:before {
  background-color: #02213b !important;
}

.custom-control-input:checked ~ .custom-control-label::before {
  color: #fff;
  border-color: #02213b;
  background-color: #02213b;
}

.sweet-alert button {
  background-color: #02213b !important;
}

.alert-message {
  border: 1px solid rgb(75, 133, 175) !important;
  border-radius: 3px !important;
  background: #5185b9 !important;
  padding: 1rem !important;
}

.alert-icons {
  height: 70px;
  width: 70px;
  fill: #fff;
}

.popover-primary {
  background-color: #02213b;
  border-color: #02213b;
}

.popover-secondary {
  background-color: #f1388b;
  border-color: #f1388b;
}

.bs-popover-top > .arrow::after, .bs-popover-auto[data-popper-placement^="top"] > .arrow::after {
  bottom: 1px;
  border-width: 0.5rem 0.5rem 0;
  border-top-color: #ffffff;
}