*
{
	box-sizing: border-box;
}



body
{
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	margin: 0px;
	padding: 0px;
	font-family: "Source Sans Pro", sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.6;
	color: #000000;
	background-color: #ffffff;
}

div
{
	margin: 0px;
	padding: 0px;
}

a
{
	text-decoration: none;
}

img
{
	text-align: center;
	color: #aeaeae;
}

p
{
	margin-top: 20px;
	margin-bottom: 20px;
	margin-left: 0px;
	margin-right: 0px;
	padding: 0px;
}

ul
{
	margin-top: 0px;
	margin-bottom: 0px;
}

h1
{
	margin-top: 15px;
	margin-bottom: 20px;
	margin-left: 0px;
	margin-right: 0px;
	padding: 0px;
	text-align: center;
	font-size: 32px;
	font-weight: 400;
	color: #4a47ed;
}

hr
{
	margin-top: 30px;
	margin-bottom: 30px;
	margin-left: 0px;
	margin-right: 0px;
	padding: 0px;
	height: 1px;
	border: none;
	background-color: #4a47ed;
}



header
{
	display: block;
	width: 100%;
	margin: 0px;
	padding-top: 15px;
	padding-bottom: 30px;
	padding-left: 15px;
	padding-right: 15px;
}

#logo-image
{
	display: block;
	width: 240px;
	height: 240px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
}



nav
{
	display: block;
	width: 100%;
	margin: 0px;
	padding: 0px;
	background-color: #4a47ed;
}

#nav-list
{
	display: grid;
	grid-auto-flow: column;
	grid-gap: 0px;
	width: 480px;
	list-style-type: none;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
}

.nav-item
{
	display: block;
	margin: 0px;
	padding: 0px;
	min-width: 120px;
	border-right-style: solid;
	border-width: 1px;
	border-color: #4037dc;
}

.nav-item:first-child
{
	border-left-style: solid;
}

.nav-link:link, .nav-link:visited
{
	display: block;
	width: 100%;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 15px;
	padding-right: 15px;
	text-align: center;
	text-decoration: none;
	font-size: 20px;
	font-weight: 400;
	color: #ffffff;
}

.nav-link:hover, .nav-link:active
{
	background-color: #5356f3;
}

@media screen and (max-width: 515px)
{
	#nav-list
	{
		grid-auto-flow: row;
		width: 100%;
	}
	
	.nav-link:link, .nav-link:visited
	{
		text-align: center;
	}
	
	.nav-item
	{
		width: 100%;
		border-right-style: none;
		border-top-style: solid;
	}
	
	.nav-item:first-child
	{
		border-left-style: none;
		border-top-style: none;
	}
}



#main-content
{
	margin: 0px;
	padding-top: 30px;
	padding-bottom: 45px;
	padding-left: 15px;
	padding-right: 15px;
	background-color: #ffffff;
}

.responsive-width-block
{
	display: block;
	width: 100%;
	height: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
}

.footnote
{
	margin-top: 30px;
}



.inline-link, .inline-link:visited
{
	text-decoration: none;
	cursor: pointer;
	color: #4a47ed;
}

.inline-link:hover, .inline-link:active
{
	color: #5356f3;
}



.block-link, .block-link:visited
{
	display: block;
	margin-top: 15px;
	margin-bottom: 15px;
	margin-left: 0px;
	margin-right: 0px;
	padding: 0px;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	color: #4a47ed;
}

.block-link:hover, .block-link:active
{
	color: #5356f3;
}



.button-list
{
	list-style-type: none;
	display: block;
	width: 240px;
	margin-top: 7px;
	margin-bottom: 7px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
}

.button-item
{
	display: block;
	margin: 0px;
	padding: 0px;
	border-top-style: solid;
	border-width: 1px;
	border-color: #4037dc;
}

.button-item:first-child
{
	border-top-style: none;
}

.button-center
{
	display: block;
	width: 240px;
	margin-top: 7px;
	margin-bottom: 7px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
}

.button-left
{
	display: block;
	width: 150px;
	margin-top: 7px;
	margin-bottom: 7px;
	margin-left: 0px;
	margin-right: 0px;
	padding: 0px;
}

.button-link, .button-link:visited
{
	display: block;
	width: 100%;
	margin: 0px;
	padding-top: 7px;
	padding-bottom: 7px;
	padding-left: 0px;
	padding-right: 0px;
	background-color: #4a47ed;
	border: none;
	text-decoration: none;
	text-align: center;
	font-size: 18px;
	font-weight: 400;
	color: #ffffff;
	cursor: pointer;
}

.button-link:hover, .button-link:active
{
	background-color: #5356f3;
}



.book-splash-link
{
	display: block;
	width: 100%;
	max-width: 720px;
	aspect-ratio: 4/3;
	margin-top: 0px;
	margin-bottom: 15px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
}

.book-splash-image
{
	display: block;
	width: 100%;
	margin: 0px;
	padding: 0px;
}



#book-grid
{
	display: grid;
	justify-content: center;
	grid-template-columns: repeat(auto-fit, 270px);
	grid-row-gap: 40px;
	grid-column-gap: 30px;
	margin: 0px;
	padding: 15px;
}

.book-grid-item
{
	margin: 0px;
	padding: 0px;
	width: 270px;
	height: auto;
	text-align: center;
}

.book-thumbnail-container
{
	display: block;
	margin: 0px;
	padding: 0px;
}

.book-thumbnail-link
{
	display: block;
	width: 240px;
	height: 360px;
	margin-top: 0px;
	margin-bottom: 15px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
}

.book-thumbnail-image
{
	display: block;
	width: 240px;
	height: 360px;
	margin: 0px;
	padding: 0px;
}

.book-thumbnail-placeholder
{
	display: block;
	width: 240px;
	height: 360px;
	margin-top: 0px;
	margin-bottom: 15px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
}

.coming-soon
{
	margin: 0px;
	padding-top: 7px;
	padding-bottom: 0px;
	padding-left: 0px;
	padding-right: 0px;
}



.book-cover-image
{
	display: block;
	width: 100%;
	max-width: 480px;
	aspect-ratio: 2/3;
	margin-top: 30px;
	margin-bottom: 30px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
}



.author-photo
{
	display: block;
	width: 100%;
	max-width: 320px;
	aspect-ratio: 2/1;
	margin-top: 0px;
	margin-bottom: 30px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
}



.form-field
{
	display: block;
	margin-top: 15px;
	margin-bottom: 15px;
	margin-left: 0px;
	margin-right: 0px;
	padding: 0px;
}

.form-label
{
	display: block;
	margin-top: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
	margin-right: 0px;
	padding: 0px;
}

.form-input
{
	display: block;
	width: 100%;
	margin: 0px;
	padding: 10px;
	border-style: solid;
	border-width: 1px;
	border-color: #d3d3d3;
	background-color: #f9f9f9;
	font-family: "Source Sans Pro", sans-serif;
	font-size: 18px;
	color: #191919;
}

.form-input:focus
{
	outline-style: solid;
	outline-width: 1px;
	outline-offset: 0px;
	outline-color: #77ccff;
	border-color: #3377ff;
}

.form-input:invalid
{
	outline-style: solid;
	outline-width: 1px;
	outline-offset: 0px;
	outline-color: #ff7777;
	border-color: #ff3333;
}

.form-error
{
	display: block;
	margin-top: 4px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
	padding: 0px;
	color: #ff5533;
}

#recaptcha-field
{
	margin-top: 23px;
	margin-bottom: 23px;
	margin-left: 0px;
	margin-right: 0px;
	padding: 0px;
}

#message-area
{
	resize: vertical;
}



footer
{
	display: flex;
	flex-direction: row;
	justify-content: center;
	width: 100%;
	margin-top: auto;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
	padding-top: 24px;
	padding-bottom: 24px;
	padding-left: 15px;
	padding-right: 15px;
	background-color: #4a47ed;
	font-weight: 300;
	color: #ffffff;
}

#footer-verse-first-line
{
	text-indent: -60px;
	margin: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 60px;
	padding-right: 0px;
	font-style: italic;
}

#footer-verse-second-line
{
	text-indent: -60px;
	margin: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 90px;
	padding-right: 0px;
	font-style: italic;
}

#footer-verse-citation
{
	text-align: right;
	margin: 0px;
	padding: 0px;
}
