/*basic tag style*/
body {
  font-family: 'Times New Roman';
}
p {
	text-align: justify;
	text-indent: 15px;
	line-height: 25px;
}
h2 {
	color: maroon;
}
header {
	padding: 2px;
	color: gold;
	background-color: maroon;
	clear: left;
	text-align: center;
	text-shadow: 1px 1px 2px white, 0 0 25px white, 0 0 5px white;
}
hr.divider { 
	text-align:center; 
	vertical-align:top; 
	padding:0px; 
	border-color:orange;
	border-width: 3px;
}
td {
	padding-left: 20px;
}
td.align {
	text-align: right;
}
/*column and row that layout the page*/
div.container {
/*	width: 90%;*/
	border: 2px solid maroon;
/*	margin-left: 5%;*/
}
nav {
	float: left;
	max-width: 160px;
	margin: 0;
	padding: 2px;
	line-height: 50px;
	font-size: 20px;
	text-align: left;
}
article {
	margin-left: 120px;
	border-left: 2px solid maroon;
	padding: 1em;
	overflow: hidden;
}
/*photo and box*/
img.indeximg {
	height: 250px;
	width: 300px;
}
img.banner {
	height: 250px;
	width: 100%;
}
div.shadow {
	width: 300px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.9),0 6px 20px 0 rgba(0, 0, 0, 0.9);
	text-align: left;
}
div.textbox {
	padding: 1px;
}
/*menu*/
a.home {
	border-radius: 5px;
  border: 1px solid;
  padding: 10px;
  padding-right: 71px; 
  width: 200px;
  height: 10px;
}
a.back {
	border-radius: 5px;
  border: 1px solid;
  padding: 10px;
  padding-right: 74px; 
  width: 200px;
  height: 10px;
}
a.toplist {
	border-radius: 5px;
  border: 1px solid;
  padding: 10px;
  padding-right: 46px; 
  width: 200px;
  height: 10px;
}
a {
	color: maroon;
	text-decoration: none;
}
a:hover {
  border: 1px solid gold;
  box-shadow: 0 0 5px 0 gold;
}
/*navigation pane*/
#navbar {
  overflow: hidden;
  background-color: maroon;
  font-size: 20px;
}
#navbar2 {
  padding-left: 166px;
}
#navbar a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}
#navbar a.quiz {
  float: right;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}
#navbar a:hover {
  background-color: gold;
  color: maroon;
}
.sticky {
  position: fixed;
  top: 0;
  width: 98.5%;
}
.sticky + .content {
  padding-top: 60px;
}
/*footer*/
footer {
	padding: 10px;
	color: gold;
	background-color: maroon;
	clear: left;
	text-align: center;
}
.link {
	color: white;
}
a.link:hover {
	color: gold;
	border: none;
	box-shadow: none;
}
/*quiz form design*/
div.sheet {
  border-radius: 5px;
  background-color: lightgray;
  padding: 20px;
}
input[type=button] {
  width: 45%;
  background-color: maroon;
  color: white;
  padding: 14px 20px;
  margin: 8px 0;
  margin-left: 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}
input[type=submit] {
  width: 45%;
  background-color: maroon;
  color: white;
  padding: 14px 20px;
  margin: 8px 0;
  margin-left: 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}
input[type=button]:hover {
  background-color: gold;
}
input[type=submit]:hover {
  background-color: gold;
}
input:hover {
	border: 1px solid skyblue;
  box-shadow: 0 0 5px 0 skyblue;
}
select:hover {
	border: 1px solid skyblue;
  box-shadow: 0 0 5px 0 skyblue;
}