/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

body {
  background-image: url("dithera.png"), linear-gradient(to left, rgb(10 10 10), rgb(25 25 25));
  color: orange;
  font-family: Monospace;
}
.topbar{
  width: fit-content;
  background-image: url("dithera.png"), linear-gradient(to bottom, rgb(50 10 0), maroon);
  border: 2px dashed orange;
  border-radius: 10px;
  padding: 0px 15px 15px 15px;
  margin: 25px;
  
}
nav{
  background-image: url("scanline.png"), linear-gradient(to bottom, darkslategrey, black);
  border-top: 1px solid red;
  border-bottom: 1px solid red;
  
}
footer{
  border-top: 1px solid red;
}

.directory ul {
  list-style-type: none;
}
.direntry {
  display: inline-block;
  background-image: url("dithera.png"), linear-gradient(to bottom, rgb(50 0 0), rgb(10 0 0));
  border: 1px solid maroon ;
  border-radius: 5px;
  color: white;
  padding: 10px;
}
p{
 text-indent: 5ch; 
}
article{
  background: rgb(10 10 10);
  border: 2px solid maroon;
  border-radius: 5px;
  padding: 15px 15px 15px 15px;
  margin: 15px;
}
article h1{
  background-image: url("scanline.png"), linear-gradient(to bottom, rgb(50 10 10), black);
  border: 1px dashed orange;
  border-radius: 5px;
  padding: 15px 0px 15px 15px;
  margin: 0px 5px 5px 5px;
}
.proprietor{
 float:  right;
 width: 250px;
 background-image: url("dithera.png"), linear-gradient(to bottom, crimson, maroon);
 border: 2px dashed orange;
 border-radius: 15px;
 text-align: center;
 
}
.scaletofit{
  width: 225px;
  align-self: center;
}
a{
}
a:link {
  color: yellow;
  background: rgb(15 15 15);
  
}
a:visited {
  color: goldenrod;
  background: rgb(20 20 20);
  
}
a:focus {
  border: 1px dotted goldenrod;
}
a:hover {
  border: 1px solid goldenrod;
  background: rgb(50 50 0);
  padding: 2px;
  
}
a:active {
  border: 1px dotted yellow;
  background: goldenrod;
  color: black;
}
.centered {
  text-align: center;
}
.scanlinetest{
  background-image: url("scanline.png"), linear-gradient(to bottom, darkslategrey, black);
}
.imagebreakout{
  background-image: url("scanline.png"), linear-gradient(to bottom, darkslategrey, black);
  width: fit-content;
  height: fit-content;
  border: 1px solid red;
  border-radius: 10px;
  padding: 5px;
  margin: 5px;
}
.imagehighlight{
  width: fit-content;
  height: fit-content;
  display: inline-block;
  background: black;
  border: 1px solid orange;
  border-radius: 5px;
  padding: 5px;
  margin: 5px;
}
figcaption{
  text-align: center;
}
blockquote{
  Background: Black;
  Border: 2px solid darkslategrey;
  color: goldenrod;
  padding: 5px;
}