:root {
  --primary-color: #3498db;
  --secondary-color: #2ecc71;
  --font-family: "Arial", sans-serif;
  --padding: 10px;
  --hover-opacity: 0.9;
}

body {
  font-family: var(--font-family);
  padding: var(--padding);
  background-color: var(--primary-color);
  color: #ffffff;

  button {
    background-color: var(--secondary-color);
    color: #ffffff;
    padding: var(--padding);
    border: none;
    border-radius: 5px;

    &:hover {
      background-color: var(--secondary-color);
      opacity: var(--hover-opacity);
    }
  }
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.