body {
  background-color: #333;
  color: pink;
}

h1 {
  position: relative;
  text-align: center;
  margin: 50px auto;
}

h1::before {
  content: "";
  display: block;
  height: 20px;
  width: 200px;
  position: absolute;
  top: 30%;
  left: 0;
  transform: traslateY(-50%);
}

li::after {
  content: "*";
}

::before {
  background: brown;
}

::after {
  color: yellowgreen;
  font-size: large;
}

li:nth-child(odd) {
  background-color: blue;
}

li:first-child {
  color: yellow;
}

li:last-child {
  color: aqua;
  font-weight: 900;
}

.button:hover {
  background-color: red;
  transform: translateX(100px) scale(2) rotate(45deg);
  transition-duration: 500ms;
}

#divNOT {
  display: block;
  width: 400px;
  height: 100px;
}

#divNOT:not(:hover) {
  background-color: brown;
}

:focus {
  background-color: yellow;
}