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


/* LAYOUT & TYPOGRAPHY */

body	
	{
		background-color:				rgb(246,246,246);								/*off-white #f6f6f6*/
		font-family:					Poppins, Arial, Helvetica, sans-serif;
		color:							rgb(68,68,68);									/*dark grey #444*/
	}

aside, .Books section > div, .ShortStories section > div, .TrueCrime section > div
	{
		background-color:				rgb(221,221,221);								/*light grey #ddd*/
	}

h1, h3.ToggleReveal, blockquote
	{
		color:							rgb(109,154,171);								/*steel-blue #6d9aab*/
	}

a, h3.ToggleReveal
	{
		border-bottom:				2px solid rgb(109,154,171);					/*steel-blue #6d9aab*/
	}

.News aside li a
	{
		font-family:					"Open Sans", Arial, Helvetica, sans-serif;
	}


/* ANIMATION & EFFECTS */

@media (max-width: 799px)
	{
		.ToggleReveal
			{
				border-bottom:		2px solid rgb(109,154,171);					/*steel-blue #6d9aab*/
				color:					rgb(109,154,171);								/*steel-blue #6d9aab*/
			}
	}


/* NAVIGATION */

.Language
	{
		background-color:				rgba(0,0,0,0);									/*transparent*/
	}

small
	{
		color:							rgb(221,221,221);								/*light grey #ddd*/
	}

@media (min-width: 720px)
	{
		#Banner, .DropMenu a, footer, #Contact							/*NEW*/
			{
				background-color:		rgb(68,68,68);									/*dark grey #444*/
			}
	}

@media (max-width: 719px)
	{
		#Banner.On, #Banner a.Logo, footer, #Contact					/*NEW*/
			{
				background-color:		rgb(68,68,68);									/*dark grey #444*/
			}
		#Banner nav > a, #Banner nav > div
			{
				border:					1px solid rgb(221,221,221);					/*light grey #ddd*/
			}
	}


/* LINKS */

#Banner nav a:link, #Banner nav a:visited,
.Language a:link, .Language a:visited,
#Contact a:link, #Contact a:visited, .Close											/*NEW*/
	{
		color:							rgb(221,221,221);								/*light grey #ddd*/
	}

#Banner nav a:hover, #Banner nav a:active, #Banner nav a.Selected,
.Language a:hover, .Language a:active,
#Contact a:hover, #Contact a:active, .Close:hover									/*NEW*/
	{
		color:							rgb(109,154,171);								/*steel-blue #6d9aab*/
	}

footer button,																		/*NEW*/
/*.Contact:link, .Contact:visited, .Contact:hover, .Contact:active,*/
.Facebook:link, .Facebook:visited, .Facebook:hover, .Facebook:active,
.Instagram:link, .Instagram:visited, .Instagram:hover, .Instagram:active,
.Youtube:link, .Youtube:visited, .Youtube:hover, .Youtube:active
	{
		background-color:				rgb(221,221,221);								/*light grey #ddd*/
	}

footer button:hover,																/*NEW*/
/*.Contact:hover, .Contact:active,*/ .Facebook:hover, .Facebook:active,
.Instagram:hover, .Instagram:active, .Youtube:hover, .Youtube:active
	{
		background-color:				rgb(109,154,171);								/*steel-blue #6d9aab*/
	}

a:link
	{
		color:							rgb(109,154,171);								/*steel-blue #6d9aab*/
	}

a:visited, a:hover, a:active
	{
		color:							rgb(69,105,119);								/*dark steel-blue #456977*/
	}