body {
  font-family: 'Poppins', sans-serif;
  background: linear-gradient(135deg, #0a0a0a 40%, #1a001a);
  color: #e000e0;
  margin: 0;
  padding: 2em;
  line-height: 1.6;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  color: white;
  text-shadow: 0 0 10px rgba(224, 0, 224, 0.5);
  letter-spacing: 1px;
}
a {
  color: #4fb3ff;
  text-decoration: none;
  transition: color 0.3s, text-shadow 0.3s;
}
a:hover {
  color: #6cf0ff;
  text-shadow: 0 0 8px rgba(4, 151, 255, 0.778);
}
* {
  transition: all 0.2s ease-in-out;
}
dd {
  margin-left: 2em;
  border-left: 2px solid rgba(224, 0, 224, 0.669);
  padding-left: 1em;
}
dt {
  color: rgb(0, 255, 128);
  text-shadow: 0 0 8px rgba(0, 255, 128, 0.5);
}

/* The sidebar menu */
.sidenav {
  height: 100%; /* Full-height: remove this if you want "auto" height */
  width: 10%; /* Set the width of the sidebar */
  position: fixed; /* Fixed Sidebar (stay in place on scroll) */
  z-index: 1; /* Stay on top */
  top: 0; /* Stay at the top */
  left: 0;
  background-color: #111; /* Black */
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 20px;
}

/* The navigation menu links */
.sidenav a {
  padding: 6px 8px 6px 16px;
  font-size: 20px;
  display: block;
}

/* When you mouse over the navigation links, change their color */

/* Style page content */
.main {
  width: 75%;
  margin-left: 160px; /* Same as the width of the sidebar */
  padding: 0px 10px;
}


/* On smaller screens, where height is less than 450px, change the style of the sidebar (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}

.back {
  display: inline-block;          /* IMPORTANT for transform on links */
  font-size: 20px;
  outline: medium solid purple;
  padding-left: 3px;
  padding-right: 3px;
  transition: transform 0.2s ease;
  color: rgb(194, 0, 194);
  margin-left: 1%;
}

.back:hover {
  transform: scale(1.1);          /* 10% bigger */
  color: rgb(255, 0, 255);
  text-shadow: 0 0 8px rgba(224, 0, 224, 0.5);
}