:root {
  --header-bg:black;
  --nav-bg:#E05050;
  --article-bg:black;
  --article-text-color:#FFD8D8;
  --border-color:red;
  --border-radius:25px;
}

body {
 font-family: 'Comic Neue', monospace;
 font-size: 16px
}

html, body {
  padding:0;
  margin:0;
  background-color:var(--header-bg);
  color:#F9F5F5;
}

header nav {
  max-width:100%;
}
aside {
  max-width:150px;
  margin-left: 20px;
}
.flex {
  display:flex;
  max-width: 900px;
}

header {
  max-height:200px;
  height:200px;
  background-color:var(--header-bg);
  background-image:url('https://arven.neocities.org/pic/redweb.gif');
  background-size:200px;
  background-position:fixed;
  border-bottom:1px solid red;
  font-size:20px;
  text-align:center;
  weight:bold;
}
main {
  width:100%;
  margin-left:20px;
  margin-right:20px;
}

header {
  margin-bottom:10px;
}
section {
  margin-bottom:10px;
}
article { 
  border:1px solid red;
  margin-bottom:15px;
  background-color:var(--article-bg);
  padding:10px;
  border-radius:10px
}
.subtitle {
  border-radius:var(--border-radius);
  padding-left: 2px;
  background-color:var(--nav-bg);
  text-align: center;
  border:1px solid var(--border-color); 
}
.links { 
  list-style-type:none;
  padding-left:0; 
  text-decoration:none;
}
.links li {
  background-color:var(--nav-bg);
  border:1px solid var(--border-color); 
  margin-bottom:3px;
}
.links li a {
  text-decoration:none;
  color:inherit;
}
.subtitle {
  color:var(--article-text-color);
  font-weight:bold;
  letter-spacing:3px; /* this spaces out the letters like in the original layout */
}
article .subtitle { /* this selects all .subtitle divs inside of the article div */
  text-transform:uppercase;
  font-size:18px;
  color:var(--article-text-color);
}
.right-sidebar img {
  max-width:100px;
  padding:10px;
}