@font-face {
  font-family: "openDyslexic";
  src: url("/fnts/openDyslexic/openDyslexic.regular.otf") format("opentype"); 
}

@font-face {
  font-family: "dropkicker";
  src: url("/fnts/dropkicker.regular.ttf") format("truetype"); 
}

body {
  background-image: url('/trees.png');
  background-color: rgb(23, 42, 15);
}

#container {
  width: 80%;
  height: 100%;
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  box-sizing: border-box;
  border: 3px solid black; 
  color: white;
  font-family: "dropkicker"; 
}

#header {
  width: 100%;
  height: 100px;
  padding-left: 20px;
  border-bottom: 2px solid black;
  background-color: black;
  box-sizing: border-box; 
}

#nav {
  box-sizing: border-box;
  width: 100%;
  height: 40px;
  background-color: rgb(80,80,80);
  color: white;
  vertical-align: central;
  padding: 10px; 
}

#sidebar {
  width: 15%;
  height: auto;
  padding: 10px;
  box-sizing: border-box;
  background-color: lightGray;
  color: black;
  border-top: 2px solid black; 
}

#main {
  box-sizing: border-box;
  width: 85%;
  height: 100%;
  height: 700px;
  background-color: dimGray;
  border-left: 2px solid black;
  border-top: 2px solid black; 
  overflow: hidden;
}

#article {
    padding-left: 20px; padding-right: 20px;
    color: white;
    font-family: "dropkicker"; 
}

#updatesBox {
  box-sizing: border-box;
  width: auto;
  margin: 3%;
  border: 2px solid black;
  height: 150px;
  overflow-y: auto;
  background-color: rgb(90,90,90);
  padding: 10px; 
}

#footer {
  position: sticky;
  bottom: 0;
  width: 100%;
  height: 100px;
  text-align: center;
  padding-top: 40px;
  box-sizing: border-box;
  background-color: black;
  color: white;
  border-top: 10px; 
}
  
.quoteBox {
  width: 80%;
  margin: 0%;
  box-sizing: border-box;
  padding: 20px;
  background-color: rgb(89, 89, 89);
  font-size: 12pt; 
}

p {text-indent: 30px;}
a:link, a:visited { color: gainsboro; text-decoration: underline; }
a:hover, a:active { color: lightGray; text-decoration: underline wavy; }
#sidebar a { color: fireBrick; text-decoration: underline; }
#sidebar a:hover { color: crimson; text-decoration: underline wavy; }


/* updated 11/21/2024 23:45 UTC */