* {
  font-size:12pt;
  font-family:monospace;
  font-weight:normal;
  text-align: center;
}
body, html {
  height: 100%;
  margin:0;
  padding:0;

}

body{
    background: #556;
    display:flex;
    flex-direction:column;
}

header {
  color:#eee;
    background:#000;

}
h1 {
    margin: 0;
  font-size:smaller;
}
h1, h2 {
  text-align: center;
}

main {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}

article {
  background:#eee;
  box-shadow: #000 .5em  .5em ;
  margin:1em;
}

p {
  margin:2em;
}
a {
  display: inline-block;
  padding:.5em 2em;
  border-radius: 10px;
  background:#5e5;
  color:white;
  text-decoration: none;
  font-weight: bold;
 
}
a:hover{
    background:#4d4;

}

ul {
  list-style:none;
  padding: 0;
}
li{
  margin:2em;
}