:root {
    --hex-body: #19376D;
    --hex-sidenav: #0B2447;
    --hex-topnav: #3c59ce;
    --hex-text: #A5D7E8;
    --hex-topnav-dark: #2f4ab4;
    --hex-today-pink: rgb(255, 0, 191);
}

body {
    margin: 0;
    line-height: var(--bs-body-line-height);
    color: white;
    background-color: var(--hex-body);
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
.side-navbar {
  width: 20%;
  height: 100%;
  position: fixed;
  margin-left: -20%;
  background-color:var(--hex-sidenav);
  transition: 0.3s;
  display: flex;
}

.top-navbar{
  height: 56px
}

.side-footer{
  overflow-wrap:break-word;
}

.nav-link {
  color: white;

}

.nav-link:active,
.nav-link:focus,
.nav-link:hover {
  background-color:var(--hex-today-pink);
  color: white
}

.my-container {
  transition: 0.3s;
}

.active-nav {
  margin-left: 0;
}

/* for main section */
.active-cont {
  margin-left: 20%;
  
}

/* #menu-btn {
  background-color: #100901;
  color: #fff;
  margin-left: -35px;
} */

.bg-hex-body {
  --bs-bg-opacity: 1;
  background-color: var(--hex-body) !important;
}

.bg-hex-sidenav {
  background-color: var(--hex-sidenav) !important;
}

.bg-hex-topnav {
  background-color: var(--hex-topnav) !important;
}

.bg-hex-topnav {
  background-color: var(--hex-topnav) !important;
}
  
.bg-hex-text {
  background-color: var(--hex-text) !important;
}
  
.btn-hex{
  background-color:var(--hex-topnav);
  color:white

}

.btn-hex:active,
.btn-hex:focus,
.btn-hex:hover {
  background-color:var(--hex-topnav);
  color: white
}

.custom-form{
  background-color: var(--hex-sidenav);
  color: white;
  border:0;
}

.form-text.text-muted{
color: var(--hex-text) !important;
}