/* ===== Scrollbar CSS ===== */
  /* Firefox */
  * {
    scrollbar-width: thin;
    scrollbar-color: #6b4721 #ddd6c3;
  }

  /* Chrome, Edge, and Safari */
  *::-webkit-scrollbar {
    width: 14px;
  }

  *::-webkit-scrollbar-track {
    background: #ddd6c3;
  }

  *::-webkit-scrollbar-thumb {
    background-color: #6b4721;
    border-radius: 7px;
    border: 2px outset #ddd6c3;
  }
  
body {
  font-family: "Tinos";
}

body.no-js main {
  visibility: hidden;
}

#parchment {
  position: absolute;
  display: flex;
  width: 95%;
  transform: translateZ(0);
  margin: 2em 0 0 1.5em;
  box-shadow: 2px 3px 20px black, 0 0 125px #8f5922 inset;
  filter: url(#wavy2);
}
	
	th {
		font-weight: 700;	
		text-align: center;
	}
	
.highlight {
	color: yellow;		
	transition: all 0.2s ease-in-out 0s;
	animation: animation .65s ease-in-out infinite alternate;
}

/* Shared hover glow animation class */
.hover-glow {
	color: yellow;
	transition: all 0.2s ease-in-out 0s;
	animation: animation .65s ease-in-out infinite alternate;
}

/* Animation keyframes used across light and dark modes */
@keyframes animation {
	0% {text-shadow: 
	   0px 0px 4px #000,
	  5px -5px 20px #fe7634,
	 -5px 5px 20px #e93b0d,
	  5px 5px 20px #fe5908, 	 
	 -5px -5px 20px #d12c01;
	}
	100% {text-shadow: 
	   0px 0px 4px #000,
	  8px -8px 20px #f77401,	  
	 -8px 8px 20px #fe7634,
	  8px 8px 20px #fe5908,
	 -8px -8px 20px #e93b0d;
	}
}

@-webkit-keyframes animation {
	0% {text-shadow: 
	   0px 0px 4px #000,
	  5px -5px 20px #fe7634,
	 -5px 5px 20px #e93b0d,
	  5px 5px 20px #fe5908, 	 
	 -5px -5px 20px #d12c01;
	}
	100% {text-shadow: 
	   0px 0px 4px #000,
	  8px -8px 20px #f77401,	  
	 -8px 8px 20px #fe7634,
	  8px 8px 20px #fe5908,
	 -8px -8px 20px #e93b0d;
	}
}	
	
/* shift to mobile device layout */
@media screen and (max-width: 580px) {
	
		#parchment {
			display: none;
		}
		
		#wrapper {
			box-shadow: 2px 3px 20px black, 0 0 60px #8a4d0f inset;
		}
		
		#navup {
			top: 2em;
		}	
			

		#mode img {	
			width: 1.2em;
			filter: drop-shadow(1px 1px 2px white);
		}
		
}

/* font-tag replacements */
.text-blue { color: blue; }
.text-green { color: #008000; }
.text-red { color: #FF0000; }
.text-serif { font-family: "Times New Roman", serif; }