@charset "utf-8";
/* CSS Document */
body {
		background-image: url('https://i.imgur.com/ogly7HY.jpg');
		background-repeat: no-repeat;
		background-attachment: fixed;
		background-size: cover;
		margin: 0;
		height: 100%; /*Test for fixing phone background*/
	}
	
	.main {
		max-width: 850px;
		margin: auto;
		margin-top: 45px;
		background-color: ghostwhite;
		padding: 10px;
		height: 100%
	}
	
	.title {
		font-size: xx-large;
		font-weight: bold;
		font-family: Helvetica;
		text-align: center;
		font-style: italic;
	}
	
	.subtitle {
		font-size: large;
		font-weight: bold;
		font-family: Helvetica;
		text-align: center;
		margin-top: 10px;
	}
	
	.text {
		max-width: 800px;
		margin: auto;
		font-family: Arial, sans-serif;
		font-size: 90%;
		background-color: white;
		border-radius: 5px;
		padding: 15px;
		margin-top: 10px;
		line-height: 1.5;
	}
	
	.caption {
		max-width: 550px;
		margin: auto;
		text-align: center;
		font-family: Helvetica;
		font-size: small;
		background-color: white;
		border-radius: 5px;
		padding: 10px 5px;
		margin-top: 10px;
	}
	
	.footer {
		max-width: 800px;
		margin: auto;
		font-family: Arial, sans-serif;
		background-color: white;
		border-radius: 5px;
		padding: 15px;
		margin-top: 10px;
		text-align: center;
	}
	
	a {
		color: #8484BB;
		text-decoration: none;
	}
	
	a:hover {
		color: #c1c1dd;

	}

	.image {
		max-width: 700px;
		margin: auto;
	}
	
	img {
		max-width: 100%;
		margin-top: 10px;
	}
	
	/*Old Menu*/
	
	ul {
		list-style-type: none;
		margin: 0;
		padding: 0;
		overflow: hidden;
		background-color: #333;
		position: fixed;
		top: 0;
		width: 100%;
	}

	.left {
		float: left;
	}
	
	.right {
		float: right;
	}

	.center {
		text-align: center;
	}

	li a {
		display: block;
		color: white;
		text-align: center;
		padding: 14px 16px;
		text-decoration: none;
	}

	li a:hover {
		color: white;
		cursor: default;
	}
	
	li a:hover:not(.active) {
		background-color: #111;
		cursor: pointer;
	}
	
	.active {
		background-color: #686894;
	}

	.above {
		background-color:#B3B3D5;
		color:#fff;
	}
	
	/*New Menu*/
	
	.menu {
		overflow: hidden;
		background-color: #333;
		position: fixed;
		top: 0;
		width: 100%;
		font-family: Helvetica;
	}

	.menu a {
		float: left;
		display: block;
		color: white;
		text-align: center;
		padding: 14px 16px;
		text-decoration: none;
	}

	.menu a:hover {
		background-color: #111;
		color: white;
	}

	.menu a.active {
		background-color: #686894;
	}
	
	.menu .icon {
		display: none;
	}
	
	.menu:not(.responsive) a.right {
		float: right;
	}
	
	.menu a.above {
		background-color:#B3B3D5;
		color:#fff;
	}

	.menu a.above:hover {
		background-color:#fff;
		color:#B3B3D5;
	}
	
	@media screen and (max-width: 1000px) {
		.menu a:not(.active) {display: none;}
		.menu a.icon {
			float: right;
			display: block;
		}
	}

	@media screen and (max-width: 1000px) {
		.menu.responsive .icon {
			position: absolute;
		    right: 0;
			top: 0;
		}
		.menu.responsive a {
		float: none;
		display: block;
		text-align: left;
		}
	}
	
	/*Intro Specific Formatting*/
	
	.page {
		background-image: url('https://i.imgur.com/24x59rj.png');
		margin: auto;
		background-size: 100%;
		max-width: 500px;
		min-height: 720px;
		color: #333333;
		margin-top: 10px;
	}
	
	.pagetext {
		padding: 20px 60px 30px;
	}
	
	.booktitle {
		text-align: center;
		font-size: small;
	}
	
	.chaptertitle {
		text-align: center;
		font-weight: bold;
	}
	
	.pagenumber {
		text-align: right; font-style: italic
	}