.justify-center {
  justify-content: center;
}

.justify-start {
  justify-content: flex-start;
}

.justify-end {
  justify-content: flex-end;
}

.justify-md-end {
  justify-content: flex-end;
}

@media (max-width: 768px) {
  .justify-md-end {
    justify-content: flex-start;
  }
}

.justify-space-between {
  justify-content: space-between;
}

.align-center {
  align-items: center;
}

.align-start {
  align-items: flex-start;
}

.align-end {
  align-items: flex-end;
}

.display-flex {
  display: flex;
}

.dropdown-active {
  color: #4048ef;
  padding-right: 24px !important;
  background-image: url('../CheckSenior.svg');
  background-repeat: no-repeat;
  background-position: right;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
}

.dropdown-item {
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  margin: 16px 2px;
  color: #3a424a;
}

.dropdown-item:hover {
  cursor: pointer;
  color: #4048ef;
}

/* CSSTransition classes  */
.menu-primary-enter {
  position: absolute;
  transform: translateX(-110%);
}
.menu-primary-enter-active {
  transform: translateX(0%);
  transition: all var(--speed) ease;
}
.menu-primary-exit {
  position: absolute;
}
.menu-primary-exit-active {
  transform: translateX(-110%);
  transition: all var(--speed) ease;
}

.menu-secondary-enter {
  transform: translateX(110%);
}
.menu-secondary-enter-active {
  transform: translateX(0%);
  transition: all var(--speed) ease;
}

.menu-secondary-exit-active {
  transform: translateX(110%);
  transition: all var(--speed) ease;
}

::-webkit-scrollbar {
  width: 4px;
}

::-webkit-scrollbar-track {
  background: #fff;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 100px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}

.bg-brand {
  background-color: #4048ef;
}

.bg-dark-brand {
  background-color: #113260;
}

.bg-alert {
  background-color: #fc4848;
}

.bg-secundary-alert {
  background-color: #ff800c;
}

.bg-dark-gray {
  background-color: #50596f;
}

.bg-medium-gray {
  background-color: #9fb3c9;
}

.bg-gray {
  background-color: #d1d5db;
}

.bg-light-gray {
  background-color: #f1f1f1;
}

.bg-white {
  background-color: #ffffff;
}

.gradient {
  background-image: linear-gradient(to right, #4048ef, #202478);
}

.cursor-pointer {
  cursor: pointer;
}

button {
  border-radius: 4px;
  font-family: 'Open Sans';
}

.button-full {
  width: 100%;
}

.toast-font {
  font-family: 'Open Sans';
  font-weight: 700;
  color: #3a424a;
}

.toast-progress-success {
  background-color: #4048ef;
  color: #4048ef;
}

@media (min-width: 800px) {
  .wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  aside {
    align-self: flex-start;
  }
}