$dark: #1f262b;
$dark-opacity1: #1f262be8;
$dark-opacity2: #1f262b80;

$dark-body-bg: $dark-opacity1;

@import "bootstrap/scss/bootstrap";
@import "bootstrap-darkmode/scss/darktheme";
@import "fonts.css";




html, body {
  background-color: $dark-body-bg;
  line-break: loose;
  word-break: break-word;
}

img {
  max-width: 100% !important;
  border-radius: .25rem;
  margin: 0.125rem;
}

table {
  @extend .table;
}

.search-box{
  input {
    background-color: unset !important;
    color: $light !important;
  }
}

h1, h2, h3, h4, h5 {
  margin-top: 1em;
}

:not(pre) > code {
  background-color: #aaa2;
  border-radius: .4rem;
  padding: .2rem .4rem;
}
[data-theme="dark"] .card {
  background-color: $dark-opacity2 !important;
}

.bg-dark {
  background-color: $dark !important;
}
.bg-dark-opacity1 {
  background-color: $dark-opacity1 !important;
}
.bg-dark-opacity2 {
  background-color: $dark-opacity2 !important;
}

.fade-enter-active, .fade-leave-active {
  transition-property: opacity;
  transition-duration: .25s;
}

.fade-enter-active {
  transition-delay: .25s;
}

.fade-enter, .fade-leave-active {
  opacity: 0
}
