/* Copyright (c) 2025 by Martin Steyn. All rights reserved. */


/* LAYOUT & TYPOGRAPHY */

.Welcome section:first-child, .News section:first-child,
.Bio section:first-child, .Media section:first-child
	{
		flex:						5 1 500px;
	}

.Welcome section:last-child, .News section:last-child,
.Bio section:last-child, .Media section:last-child
	{
		display:					flex;
		flex-flow:					column nowrap;
		flex:						3 1 300px;
	}

aside
	{
		margin-left:				10px;
	}

.Welcome aside:first-child, .News aside:first-child,
.Bio aside:first-child, .Media aside:first-child,
.HeaderImage
	{
		margin-top:				8px;
	}

.Books main, .ShortStories main, .TrueCrime main,
.Crime, .Collections
	{
		flex-direction:				column;
	}

.Crime, .Collections, .Magazines, .TrueCrimeStories
	{
		display:					flex;
		flex-wrap:					wrap;
	}

.Books section > div, .Collections > div
	{
		display:					flex;
		align-items:				flex-start;
	}

.Books section img, .Collections img
	{
		flex:						1 1 300px;
		min-width:					200px;
	}

.Books section > div div, .Collections > div div
	{
		flex:						3 1 900px;
		padding-left:				20px;
	}

.HeaderBooks
	{
		margin:					8px 18px;
	}

.Magazines > div, .TrueCrimeStories div
	{
		display:					block;
		flex:						1 1 340px;
	}

.Books h3, .ShortStories h3, .TrueCrime h2
	{
		margin-top:				-4px;
	}

.Magazines div:last-child, .TrueCrimeStories div:last-child
	{
		opacity:					0;
	}


/* RESPONSIVE STYLES */

@media (min-width: 720px)
	{
		footer div button, footer div a
			{
				margin-top:				-3px;
			}
	}

@media (min-width: 760px)
	{
		.Magazines > div:nth-child(odd), .TrueCrime section > div:nth-child(odd)
			{
				margin-right:				10px;
			}
		.Magazines > div:nth-child(even), .TrueCrime section > div:nth-child(even)
			{
				margin-left:				10px;
			}
	}

@media (min-width: 800px)
	{
		main
			{
				padding-left:				10px;
				padding-right:				10px;
			}
		.Photo
			{
				float:						right;
				max-width:					280px;
				margin:					20px;
				box-shadow:				0 0 3px rgba(0,0,0,0.8);
				padding:					20px 20px 40px 20px;
			}
	}

@media (min-width: 860px)
	{
		.Photo
			{
				max-width:					300px;
			}
	}

@media (min-width: 920px)
	{
		.Photo
			{
				max-width:					320px;
			}
	}

@media (max-width: 799px)
	{
		.News main
			{
				flex-direction:				column-reverse;
			}
		.News section:last-child
			{
				flex-direction:				row;
				flex-basis:					auto;
			}
		.News aside
			{
				margin-top:				8px;
				margin-bottom:			20px;
			}
		.News aside:first-child
			{
				flex:						1 1 340px;
				margin-left:				20px;
				margin-right:				10px;
			}
		.News aside:last-child
			{
				flex:						1 1 260px;
				margin-left:				10px;
			}
	}

@media (max-width: 759px)
	{
		.Magazines .OddStories, .TrueCrimeStories div:last-child
			{
				display:					none;
			}
	}

@media (max-width: 719px)
	{
		.Media main
			{
				flex-direction:				column;
			}
		.Media section:first-child
			{
				margin-bottom:			2px;
			}
		.Media section:last-child
			{
				margin-left:				10px;
			}
	}


/* ANIMATION & EFFECTS */

@media (min-width: 800px)
	{
		h3.ToggleReveal
			{
				display:					inline-block;
				cursor:						pointer;
			}
		.ToggleReveal
			{
				padding:					0;
			}
		div.Hidden
			{
				max-height:				0;
				overflow:					hidden;
				padding-left:				0;
				transition:					max-height 0.8s linear;
			}
		aside .ToggleReveal
			{
				display:					block;
				border-bottom:			none;
				cursor:						auto;
			}
		aside .Hidden
			{
				max-height:				100%;
				margin-top:				0;
			}
	}


/* NAVIGATION */

#Banner nav > a, #Banner nav > div
	{
		font-size:							1.1rem;
	}


/* IE11 STYLES */

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active)
	{
		.Books section div, .ShortStories section div
			{
				display:					block;
			}
		.Books section img, .ShortStories section img
			{
				float:						left;
				width:						220px;
				margin-right:				20px;
			}
		.Books section > div div, .ShortStories section > div div
			{
				padding-left:				240px;
			}
	}