:root {
  --background: rgb(21, 16, 21);
  --code-background: rgb(20, 9, 16);
  --text: #ccadc5;
  --hover: hsl(321, 80%, 26%);
  --link: #c0286f;
}

body{
    display: flex;
    flex-flow: column wrap;
    color: var(--text);
    background: var(--background);
    margin: 1rem auto;
    padding:1rem;
    max-width:55em;
    font:14px monospace;
  }
  
  a {
    color: var(--link);
    text-decoration: none;
  }
  
  a:active,a:hover,a:focus {
    color: var(--hover);
    text-decoration: none;
  }
  
  ul {
    list-style: '• ';
  }

  nav {
    display: flex;
    flex-flow: row wrap; 
  }
  nav a {
    padding-right: 1.5rem;
  }

  footer {
    line-height: 0.7rem;
  }

  .subtitle {
    margin-top: -0.2rem;
  }

  main {
    display: flex;
    flex-flow: column wrap;
  }