body{
  margin:0 auto;
 /* width:80%;*/
 background: radial-gradient(circle, rgb(239, 250, 235), rgb(20, 16, 41));
 
}
:root {
  --main-bg-color: #d7d5ee;
  --main-text-color: #ededf8;
  --second-text-color: #f8f9fc;
  --second-bg-color: #113468;
}

.primary-text {
  color: var(--main-text-color);
}

.second-text {
  color: var(--second-text-color);
}

.primary-bg {
  background-color: var(--main-bg-color);
}

.secondary-bg {
  background-color: var(--second-bg-color);
}

.rounded-full {
  border-radius: 100%;
}

#wrapper {
  overflow-x: auto;
  background-image: linear-gradient(
    to right,
    #a09ea1,
    #c3c7c5,
    #d4d6d5,
    #e5e7e7,
    #a09ea1
  );}

#wrapper.toggled #sidebar-wrapper {
  margin-left: 0;
}

#menu-toggle {
  cursor: pointer;
}

.list-group-item {
  border: none;
  padding: 20px 30px;
}

.list-group-item.active {
  background-color: transparent;
  color: var(--main-text-color);
  font-weight: bold;
  border: none;
}

@media (min-width: 768px) {
  #sidebar-wrapper {
    margin-left: 0;
  }

  #page-content-wrapper {
    min-width: 0;
    width: 100%;
    font-size: .7rem;
    font-weight: 500;
  }

  #wrapper.toggled #sidebar-wrapper {
    margin-left: -15rem;
  }
}