:root {
--bg-color:#020202;
--pg-color:#2c2c2c;
--accent:#222;
--accent-2:#848484;
}

* {
box-sizing:border-box;
}

html,body {
color:#d8d8d8;
font-family:'Courier Prime', monospace, sans-serif;
font-size:16px;
background-image:url('https://file.garden/ZWzGXx9JoSEF0CWG/privateye/PRIVATEYE%20(3).png');
margin:0;
}

body {
background-color:var(--bg-color);
}

#container {
background-color:var(--pg-color);
width:60%;
height:90vh;
overflow:auto;
border-left:100px solid var(--accent);
border-right:1px solid #000;
border-bottom:1px solid #000;
position:relative;
}

#outer {
margin-left:100px;
}

nav {
background-color:var(--accent);
position:absolute;
top:100px;
left:50px;
border:1px solid var(--accent-2);
width:120px;
z-index:9;
}

article {
line-height:1.7em;
padding:20px;
}

h1,h2 {
font-family:'Special Elite', sans-serif;
}

h1 {
border-bottom:1px solid var(--accent-2);
padding-bottom:8px;
color:rgba(255,255,255,0.3);
text-shadow:rgba(255,255,255,0.5) 0 0 15px rgba(255,255,255,0.5) 0 0 10px;
--darkreader-inline-color:rgba(239,237,234,0.3);
--darkreader-inline-bgcolor:#2c2d2e;
margin-top:10px;
font-size:50px;
margin-bottom:0;
}

h2 {
margin-bottom:0;
}

li:hover {
background-color:#444;
cursor:pointer;
}

nav > ul {
background-color:var(--pg-color);
list-style:none;
margin:4px;
padding:0;
}

nav > ul > li {
border-bottom:1px solid #000;
text-align:center;
}

nav > ul > li:last-child {
border-bottom:none;
text-align:center;
}

nav > ul > li > a {
font-size:20px;
padding-top:5px;
padding-bottom:5px;
display:inline-block;
color:#FFF;
}

li.active {
background-color:#444;
}

.tabcontent {
display:none;
}

a,a:hover,a:visited {
color:#FFF;
}

img {
  width:80%;
}

#imgwrap {
  margin-bottom:0;
}

#imgtitle {
  margin-top:0;
  font-style: italic;
}

@media only screen and max-width 850px{
nav {
left:0;
}

#container {
width:100%;
margin-left:0;
}

#outer {
margin-left:0;
}
}