/* 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." */


.book {
  flex: 1 1 25%;
  box-sizing: border-box;
  padding: 10px;
}

.row {
  flex: 1;
  display: flex;
  flex-direction: row; 
  gap: 15px;

body {
  background-image: url('../images/bit-art-background.jpg');
  color: #114C22;
  font-family: "Lucinda Console", "Courier New", monospace;
  text-align: center;
  line-height: 1.75em;
  letter-spacing: .1rem;
  padding: 0;
  margin: 0;
  background-attachment: fixed;
}

p {
  color: #0E1819
}

.header {
  border: 3px double #0D2B44;
  background-image: url("images/bugs2.jpg") ;
  background-size: 10%;
  background-repeat: repeat;
  text-align: center;
  margin-top: 15px;
  top: 0;
  height: auto;
  color: #114C22;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
  font-family: "Lucinda Console", "Courier New", monospace;
  letter-spacing: .2rem;
  font-size: 1.35em;
  }
  
.box {
  border: 3px double #0E1819;
  background: #FAEFD8;
  padding: 0;
  margin-top: 10px;
  }
  
.box2 {
  border: 3px double #0E1819;
  background: #FAEFD8;
  padding: 0;
  margin-top: 10px;
  }
  
.box h1, .box h2, .box2 h1, .box2 h2, .box3 h1, .box3 h2 {
  background: #508F74;
  color: #0E1819;
  margin: 0;
  padding: 0.35em 0.25em 0.3em 0.25em;
  text-align: center;
  border-bottom: 3px double #F7921E;
  font-family: "Lucinda Console", "Courier New", monospace;
  font-size: 1.3em;
  }
  
.box h3, .box h4, .box2 h3, .box2 h4, .box3 h3, .box3 h4 {
	background: #508F74;
  color: #0E1819;
  margin: 0;
  padding: 0.35em 0.25em 0.3em 0.25em;
  text-align: center;
  border-bottom: 3px double #F7921E;
  font-family: "Lucinda Console", "Courier New", monospace;
  font-size: 1.1em;
  }
  
a:link {
	color: #0E1819;
	text-decoration: none;
	}

a:hover {
	color: #701E9D;
	text-decoration: underline;
	}

hr {
  width: 85%;
  border-bottom: 3px double #0E1819;
  border-top: none;
  }
	
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #F7921E;
}

::-webkit-scrollbar-button {
  background: #84F731;

::-webkit-scrollbar-button:hover {
  background: #F7921E;
}