body {
  background-color: hsl(0, 0%, 96%) !important;
}
main {
  margin-top: 58px;
}
@media (min-width: 1200px) {
  main {
    padding-top: 3rem !important;
  }
}

.font-weight-normal {
  font-weight: 500 !important;
}

a {
  color: #3b71ca !important;
}
a:hover {
  color: #2f5aa2 !important;
}

.card {
  box-shadow: 0 2px 15px -3px rgba(0, 0, 0, 0.07),
    0 10px 20px -2px rgba(0, 0, 0, 0.04) !important;
  border-radius: 0.5rem !important;
}
.card-header:first-child {
  border-radius: 0.5rem !important;
}
.card-footer:last-child {
  border-radius: 0.5rem !important;
}

.card .card-title {
  font-size: 1.05rem;
}

.users-listing-small h5 {
  font-size: 1.15rem;
}

.card .card-header h5 {
  font-size: 1.15rem;
}

.card-intro {
  background: #fff !important;
  margin-top: 53px !important;
  box-shadow: none !important;
}

.card-intro .rgba-black-light {
  background: rgba(0, 0, 0, 0) !important;
}

.card-intro h1 {
  font-size: 1.4rem !important;
  font-weight: 600 !important;
  margin-top: 1rem !important;
  margin-bottom: 1rem !important;
  color: #4f4f4f !important;
}

.navbar {
  height: 53px !important;
  box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.07), 0 2px 2px 0 rgba(0, 0, 0, 0.04) !important;
}

.navbar-light .navbar-nav .nav-link {
  color: rgba(0, 0, 0, 0.55) !important;
  font-weight: 400;
}

#navbarNotificationCounter {
  position: absolute;
  font-size: 0.6rem;
  margin-top: -0.2rem;
  margin-left: -0.5rem;
}

.hidden-arrow:after {
  display: none;
}

.badge {
  box-shadow: none !important;
}

.card-header {
  background-color: #fff !important;
}

.select-wrapper.is-valid .select-dropdown {
  border-bottom-color: #28a745;
}
.select-wrapper.is-invalid .select-dropdown {
  border-bottom-color: #dc3545;
}

.is-hidden {
  display: none !important;
}

.perf-preloader {
  position: absolute;
  width: 100%;
  height: 100%;
  top: -20px;
  z-index: 100;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(237, 237, 238, 0.5);
}

.answer-card img {
  max-width: 100%;
  height: auto;
}

.top-creators-card {
  white-space: initial;
  max-width: 85%;
}

.chips .input {
  width: 360px !important;
  margin: 0 !important;
}

/* MDB5 style emulation */
.text-primary {
  color: #3b71ca !important;
}
.btn {
  border-radius: 0.25rem !important;
}

.btn-rounded {
  border-radius: 10rem !important;
}

.btn-lg {
  padding: 0.75rem 1.6875rem 0.6875rem;
  font-size: 0.875rem;
  line-height: 1.6;
}
.btn-primary {
  background-color: #3b71ca !important;
  color: #fff !important;
  box-shadow: 0 4px 9px -4px #3b71ca !important;
}
.btn-primary.focus,
.btn-primary:focus,
.btn-primary:hover {
  background-color: #3265b9 !important;
  color: #fff !important;
}
.btn-primary.active,
.btn-primary.active:focus,
.btn-primary.focus,
.btn-primary:active,
.btn-primary:active:focus,
.btn-primary:focus,
.btn-primary:hover {
  box-shadow: 0 8px 9px -4px rgba(59, 113, 202, 0.3),
    0 4px 18px 0 rgba(59, 113, 202, 0.2) !important;
}
.btn-check:active + .btn-primary,
.btn-check:checked + .btn-primary,
.btn-primary.active,
.btn-primary:active,
.show > .btn-primary.dropdown-toggle {
  background-color: #2d5aa5 !important;
  color: #fff !important;
}
.btn-check:active + .btn-primary:focus,
.btn-check:checked + .btn-primary:focus,
.btn-primary.active:focus,
.btn-primary:active:focus,
.show > .btn-primary.dropdown-toggle:focus {
  box-shadow: 0 8px 9px -4px rgba(59, 113, 202, 0.3),
    0 4px 18px 0 rgba(59, 113, 202, 0.2) !important;
}
.btn-primary.disabled,
.btn-primary:disabled {
  background-color: #3b71ca !important;
  color: #fff !important;
  box-shadow: 0 4px 9px -4px #3b71ca !important;
}
.btn-check:active + .btn-primary,
.btn-check:checked + .btn-primary,
.btn-primary.active,
.btn-primary:active,
.show > .btn-primary.dropdown-toggle {
  background: #2d5aa5 !important;
}
.btn-check:focus + .btn-primary,
.btn-primary:focus {
  box-shadow: 0 8px 9px -4px rgba(59, 113, 202, 0.3),
    0 4px 18px 0 rgba(59, 113, 202, 0.2) !important;
}
.btn-secondary {
  background-color: #e3ebf7 !important;
  color: #285192 !important;
  box-shadow: none !important;
}
.btn-secondary.focus,
.btn-secondary:focus,
.btn-secondary:hover {
  background-color: #cfddf1 !important;
  color: #285192 !important;
}
.btn-secondary.active,
.btn-secondary.active:focus,
.btn-secondary.focus,
.btn-secondary:active,
.btn-secondary:active:focus,
.btn-secondary:focus,
.btn-secondary:hover {
  box-shadow: 0 8px 9px -4px rgba(227, 235, 247, 0.3),
    0 4px 18px 0 rgba(227, 235, 247, 0.2) !important;
}
.btn-check:active + .btn-secondary,
.btn-check:checked + .btn-secondary,
.btn-secondary.active,
.btn-secondary:active,
.show > .btn-secondary.dropdown-toggle {
  background-color: #bbcfec !important;
  color: #285192 !important;
}
.btn-check:active + .btn-secondary:focus,
.btn-check:checked + .btn-secondary:focus,
.btn-secondary.active:focus,
.btn-secondary:active:focus,
.show > .btn-secondary.dropdown-toggle:focus {
  box-shadow: 0 8px 9px -4px rgba(227, 235, 247, 0.3),
    0 4px 18px 0 rgba(227, 235, 247, 0.2) !important;
}
.btn-secondary.disabled,
.btn-secondary:disabled {
  background-color: #e3ebf7 !important;
  color: #285192 !important;
  box-shadow: 0 4px 9px -4px #e3ebf7 !important;
}

.btn-check:focus + .btn-secondary,
.btn-secondary:focus {
  box-shadow: 0 8px 9px -4px rgba(227, 235, 247, 0.3),
    0 4px 18px 0 rgba(227, 235, 247, 0.2) !important;
}
.btn-secondary:not([disabled]):not(.disabled):active,
.btn-secondary:not([disabled]):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
  background-color: #d5dde8 !important;
}

.btn-success {
  background-color: #14a44d !important;
  color: #fff !important;
  box-shadow: 0 4px 9px -4px #14a44d !important;
}
.btn-success.focus,
.btn-success:focus,
.btn-success:hover {
  background-color: #118d42 !important;
  color: #fff !important;
}
.btn-success.active,
.btn-success.active:focus,
.btn-success.focus,
.btn-success:active,
.btn-success:active:focus,
.btn-success:focus,
.btn-success:hover {
  box-shadow: 0 8px 9px -4px rgba(20, 164, 77, 0.3),
    0 4px 18px 0 rgba(20, 164, 77, 0.2) !important;
}
.btn-check:active + .btn-success,
.btn-check:checked + .btn-success,
.btn-success.active,
.btn-success:active,
.show > .btn-success.dropdown-toggle {
  background-color: #0e7738 !important;
  color: #fff !important;
}
.btn-check:active + .btn-success:focus,
.btn-check:checked + .btn-success:focus,
.btn-success.active:focus,
.btn-success:active:focus,
.show > .btn-success.dropdown-toggle:focus {
  box-shadow: 0 8px 9px -4px rgba(20, 164, 77, 0.3),
    0 4px 18px 0 rgba(20, 164, 77, 0.2) !important;
}
.btn-success.disabled,
.btn-success:disabled {
  background-color: #14a44d !important;
  color: #fff !important;
  box-shadow: 0 4px 9px -4px #14a44d !important;
}
.btn-check:focus + .btn-success,
.btn-success:focus {
  box-shadow: 0 8px 9px -4px rgba(20, 164, 77, 0.3),
    0 4px 18px 0 rgba(20, 164, 77, 0.2) !important;
}
.btn-danger {
  background-color: #dc4c64 !important;
  color: #fff !important;
  box-shadow: 0 4px 9px -4px #dc4c64 !important;
}
.btn-danger.focus,
.btn-danger:focus,
.btn-danger:hover {
  background-color: #d83752 !important;
  color: #fff !important;
}
.btn-danger.active,
.btn-danger.active:focus,
.btn-danger.focus,
.btn-danger:active,
.btn-danger:active:focus,
.btn-danger:focus,
.btn-danger:hover {
  box-shadow: 0 8px 9px -4px rgba(220, 76, 100, 0.3),
    0 4px 18px 0 rgba(220, 76, 100, 0.2) !important;
}
.btn-check:active + .btn-danger,
.btn-check:checked + .btn-danger,
.btn-danger.active,
.btn-danger:active,
.show > .btn-danger.dropdown-toggle {
  background-color: #cd2844 !important;
  color: #fff !important;
}
.btn-check:active + .btn-danger:focus,
.btn-check:checked + .btn-danger:focus,
.btn-danger.active:focus,
.btn-danger:active:focus,
.show > .btn-danger.dropdown-toggle:focus {
  box-shadow: 0 8px 9px -4px rgba(220, 76, 100, 0.3),
    0 4px 18px 0 rgba(220, 76, 100, 0.2) !important;
}
.btn-danger.disabled,
.btn-danger:disabled {
  background-color: #dc4c64 !important;
  color: #fff !important;
  box-shadow: 0 4px 9px -4px #dc4c64 !important;
}
.btn-check:focus + .btn-danger,
.btn-danger:focus {
  box-shadow: 0 8px 9px -4px rgba(220, 76, 100, 0.3),
    0 4px 18px 0 rgba(220, 76, 100, 0.2) !important;
}

.btn-link {
  box-shadow: none !important;
  text-decoration: none !important;
  color: #3b71ca !important;
  font-weight: 500 !important;
}
.btn-link.focus,
.btn-link:focus,
.btn-link:hover {
  text-decoration: none !important;
}
.btn-link.active,
.btn-link.active:focus,
.btn-link.focus,
.btn-link:active,
.btn-link:active:focus,
.btn-link:focus,
.btn-link:hover {
  box-shadow: none !important;
  background-color: #f5f5f5 !important;
  color: #2f5aa2 !important;
}
.btn-link.disabled,
.btn-link:disabled,
fieldset:disabled .btn-link {
  box-shadow: none !important;
  color: #3b71ca !important;
}

.badge-primary {
  background-color: #dfe7f6 !important;
  color: #2c58a0 !important;
}
.badge-primary i {
  color: #376fc8 !important;
}
.badge-secondary {
  background-color: #ebedef !important;
  color: #40464f !important;
}
.badge-secondary i {
  color: #565e6c !important;
}
.badge-success {
  background-color: #d6f0e0 !important;
  color: #0d6832 !important;
}
.badge-success i {
  color: #139647 !important;
}
.badge-danger {
  background-color: #f9e1e5 !important;
  color: #af233a !important;
}
.badge-danger i {
  color: #d62e4a !important;
}
.badge-warning {
  background-color: #fbf0da !important;
  color: #73510d !important;
}
.badge-warning i {
  color: #a17112 !important;
}
.badge-info {
  background-color: #def1f7 !important;
  color: #1c657d !important;
}
.badge-info i {
  color: #2686a6 !important;
}
.badge-light {
  background-color: #f5f5f5 !important;
  color: #4f4f4f !important;
}
.badge-light i {
  color: #8c8c8c !important;
}
.badge-dark {
  background-color: #332e2e !important;
  color: #f5f5f5 !important;
}
.badge-dark i {
  color: #e8e8e8 !important;
}
.badge-pro {
  background-color: hsl(247, 55.7%, 93%) !important;
  color: hsl(247, 55.7%, 38%) !important;
}
.badge-pro i {
  color: hsl(247, 55.7%, 38%) !important;
}

.pagination .page-item.active .page-link {
  background-color: #e3ebf7 !important;
  color: #285192 !important;
  box-shadow: 0 4px 9px -4px #e3ebf7 !important;
}
.table-striped tbody tr:nth-of-type(odd) {
  background-color: #fafafa !important;
}
table.table-hover tbody tr:hover {
  background-color: #f3f3f3 !important;
}
hr {
  height: 2px !important;
  background-color: #f5f5f5 !important;
  opacity: 1 !important;
  border-top: none !important;
}
.pills-info .nav-link {
  border: none!important;
  box-shadow: none!important;
  border-radius: none!important;
  color: #285192!important;
  font-weight: 400!important;
  background-color: #f7f7f7!important;
}
.pills-info .nav-link.active {
  border: none!important;
  box-shadow: none!important;
  border-radius: none!important;
  color: #285192!important;
  font-weight: 400!important;
  background-color: #e3ebf7 !important
}
#main-navbar[data-loaded="dpl"] .badge {
  margin-left: -.55rem!important;
}

.badge.blue.darken-4:hover {
  color: #fff !important;
}