.toggleButton {
  margin-bottom: 10px;
  display: flex;
  justify-content: flex-end;
}
#chartArea {
  display: flex;
}
#chartLeft {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex: 1;
}
#chartId {
  display: flex;
  flex-direction: column;
  align-content: flex-end;
  flex: 1;
}
.login-panel{
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.login-pannel-bg{
  height: 100vh;
  background-image: url('/african_retailer.png');
  background-size: cover;
  background-position: center;

}
.register-pannel-bg{
  height: 100vh;
  background-image: url('/african_man_retailer.png');
  background-size: cover;
  background-position: center;

}

.login-pannel2{
  height: 100%;
  width: 40%;
}
.vertical-center {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100%;
    }
.img-fluid {
  height: 10px;
  object-fit: cover;
}
.br-mainpanel {
  margin-left: 0;
  margin-top: 100px;
  margin-bottom: 100px;
  transition: all 0.2s ease-in-out; }

  .custom-height {
    height: 1000px;
    background: yellow;
    /* Adjust the height value as needed */
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .br-mainpanel {
      transition: none; } }
  @media (min-width: 992px) {
    .br-mainpanel {
      margin-left: 330px; } }