html,
body {
  background: rgb(32, 33, 35);
  color:rgb(220, 220, 220);
  font-size: 18px;
}

h1,
h2, h3 {
  color: rgb(255, 255, 255);
}

h3{ 
 color: rgb(190, 200, 255);
}
h4 {
  color: rgb(190, 200, 255);
}

.help_content table {
  color: rgb(217, 217, 227);
}

.help_content table td {
  color: rgb(217, 217, 227);
}
.alert {
  display: inline-block;
  color:rgb(220, 220, 220);
}

.alert-link a,
.alert a,
a {
  color:  rgb(200, 125, 200);
}

.alert-info {
  background-color: rgb(46, 43, 48);
}

p span.material-icons {
  font-size: 18px;
}

.navbar.navbar-expand-lg {
  display: flex;
}

#sidebarCollapse {
  display: inline-block;
  position: fixed;
  top:2px;
  right: 12px;
  padding: 8px;
  z-index: 999;
  border-radius: 8px;
  background-color: rgba(32, 33, 35, 0.15);
  transition: transform 0.5s ease-in-out;
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-4px);
  }
  60% {
    transform: translateY(-2px);
  }
}

#sidebarCollapse.bounce {
  animation-name: bounce;
  animation-duration: 1.5s;
}

p.lead {
  color: rgb(180, 255, 180);
  margin-bottom: 6px;
}

.badge-info {
  background-color: rgb(200, 125, 200);
}

.menu_logo_image {
  max-width: 100%;
  object-fit: contain;
}

.idocs-navigation {
  box-shadow: 0 0.2rem 0.3rem rgba(0, 0, 0, 0.15), 0 0.6rem 1rem rgba(0, 0, 0, 0.15);
}

.max_token_span {
  position: absolute;
  right: 22px;
  font-size: .9rem;
  top: 16px;
  background-color: rgb(200, 125, 200);
}

.engine_model_content {
  position: relative;
}

.list-group-item {
padding: 0.75rem;
}

section {
  padding-top: 20px;
}

@media (min-width: 992px) {
  .navbar.navbar-expand-lg {
    display: none;
  }
  #sidebarCollapse {
    display: none;
  }
  .idocs-navigation {
    box-shadow: 0 0.2rem 0.3rem rgba(0, 0, 0, 0.15), 0 0.6rem 1rem rgba(0, 0, 0, 0.15);
    box-shadow: 0 0 1rem rgba(220, 220, 220, 0.05);
  }
  
}