.btn-dark {
    --bs-btn-color: #fff;
    --bs-btn-bg: #202124;
    --bs-btn-border-color: #202124;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #414245;
    --bs-btn-hover-border-color: #36373a;
    --bs-btn-focus-shadow-rgb: 65, 66, 69;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #4d4d50;
    --bs-btn-active-border-color: #36373a;
    --bs-btn-active-shadow: none;
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #202124;
    --bs-btn-disabled-border-color: #202124;
}

.btn-icon {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
}

.btn-icon.btn-xs {
    width: 2rem;
    height: 2rem;
    font-size: 0.8rem;
}

.btn-icon.btn-sm,
.btn-group-sm>.btn-icon.btn {
    width: 2.25rem;
    height: 2.25rem;
    font-size: 0.8rem;
}

.btn-icon.btn-lg,
.btn-group-lg>.btn-icon.btn {
    width: 3rem;
    height: 3rem;
    font-size: 1.4375rem;
}

.btn-icon.btn-xl {
    width: 3.5rem;
    height: 3.5rem;
    font-size: 1.75rem;
}

.rounded-circle {
    border-radius: 50% !important;
}

.card.card-element-hover .hover-element {
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    z-index: 9;
  }
  .card.card-element-hover .card-text, .card.card-element-hover img {
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
  }
  .card.card-element-hover:hover .card-text {
    margin-bottom: 10px;
  }
  .card.card-element-hover:hover .hover-element {
    visibility: visible;
    opacity: 1;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
  }