:root {
  --bs-primary: #ff5722;
  --bs-secondary: #96004b;
}

@media (min-width: 768px) {
  .main-layout .col-md-6,
  .main-layout .col-xl-4 {
    width: 100% !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

.accordion-button {
  transition: all .4s ease;
}

/* Custom accordion animation speed */
.accordion-collapse {
  transition: all .4s ease;
}

.offcanvas-bottom {
  --bs-offcanvas-height: 40vh;
  height: var(--bs-offcanvas-height) !important;
  border-radius: 20px 20px 0 0;
}

.offcanvas-body {
  margin-bottom: 20px;
}

.btn-outline-primary {
  color: var(--bs-primary);
  border-color: var(--bs-primary);
}

.btn-outline-primary:hover {
  color: #fff;
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}

.btn-outline-secondary {
  color: var(--bs-secondary);
  border-color: var(--bs-secondary);
}

.btn-outline-secondary:hover {
  color: #fff;
  background-color: var(--bs-secondary);
  border-color: var(--bs-secondary);
} 

#explanationOffcanvas, #tooltipOffcanvas{
  border-radius: 20px 20px 0 0;
}

#tooltip-modal-content img{
  display: block;
  margin: 0 auto;
  width: 300px;
}


@media (max-width: 767.98px) {
  #tooltip-content img{
    display: block;
    margin: 0 auto;
    width: 200px;
  }
}