/*
MAIN PAGE CLASSES
*/

body  {
  background-color: black;
  color: white;
  font-family: "Comic Sans MS";
}  

footer  {
  background-color: darkgray;
  color: black;
  font-style: italic;
  font-size: 75%;
  text-align: center;
  margin: 10%;
}

hr.cyan  {
  background-color: cyan;
  height: 3px;
  margin-bottom: 30px;
}

a.nav:link  {
  background-color: cyan;
  color: black;
  font-family: "Courier";
  font-weight: bold;
  text-decoration: none;
  padding: 5px;
  margin: 0px 5px;
}

a.nav:hover  {
  background-color: lightgray;
  color: magenta;
  font-family: "Courier";
  font-weight: bold;
  text-decoration: none;
  padding: 5px;
  margin: 0px 5px;
}

.box_ksd  {
  background-color: gray;
  color: cyan;
  border: 8px groove teal;
  margin: 2;
  padding: 5px;
}

.box_menu  {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-around;
  margin: auto;
  border-color: magenta;
  border-style: solid;
  border-width: 0px 5px 0px 5px;
  padding: 1px;
  width: 50%;
}

.box_mutation  {
	background-color: gray;
	color: black;
	border-color: lime;
	border-style: dashed;
	border-width: 0px 5px 0px 5px;
}
	
.box_construction  {
  background-color: yellow;
  color: black;
  border: 4px inset gray;
  margin: 5% 10% 5% 10%;
  padding: 10px;
}

.tbl_columns  {

}

p.title  {
  font-family: "Courier";
  font-size: 300%;
  text-align: center;
  font-weight: bold;
  text-shadow: 2px 2px magenta;
}

p.heading  {
  font-family: "Courier";
  font-size: 150%;
  text-align: center;
  font-weight: bold;
  text-shadow: 2px 2px gray;
}

p.secret  {
  font-family: "Courier";
  color: black;
  font-size: 30%;
}

#tbl_columns  {
	background-color: none;
	border: none;
	justify-content: center;
	width: 85%;
	margin: auto;
}	
	
#tbl_columns th  {
	background-color: lightgray;
	color: magenta;
	font-weight: bold;
	padding: 20px;
}

#tbl_columns td  {
	padding-bottom: 20px;
	padding-left: 10px;
	padding-right: 10px;
}