* {
	box-sizing: border-box;
}
/* Colors  */

:root {
  	--red: #9a0000;
	/*--red: #AA0000; cmyk(0%, 100%, 100%, 33.3%)*/
	--yellow: #ffcc00; /*cmyk(0%, 13%, 100%, 0%)*/
	/*--yellow: #FFD700;/*panatone "Yellow 012 C" rgb(255,215,0), hsl(50.4,100%,50%), cmyk(0,16,100,0) */
	--blue: #006699; /*rgb(0,102,153), hsl(200,100%,30%), cmyk(100,33,0,40) */
	/*--blue: #00629B; panatone "3015 C", rgb(0,98,155), hsl(202.1,100%,30.4%), cmyk(100,37,0,39)*/
	--bluegreen: #006969; /*rgb(0,105,105), hsl(180,100%,20.6%), cmyk(100,0,0,59) */
	--darkbrown: #332c21; /*cmyk(0%, 13%, 35%, 80%)*/
	--brown: #4f4433; /*cmyk(0%, 14%, 35%, 69%) */
	--black: #000000;
	--warmblack: #191918;/*panatone "Black 6 C" rgb(25,25,24), hsl(60,2%,9.6%), cmyk(0,0,4,90)*/
	/*--warmblack: #1A1A19; rgb(26,26,25),hsl(60,2%,10%),cmyk(0,0,4,90) */
	--gray: #484848; /*cmyk(0%, 0%, 0%, 71.5%)*/
	--lightgray: #888888;
	--warmgray: #4b4b44; /*cmyk(0%, 0%, 9%, 72%)*/
	--warmlightgray: #656560;
	--white: #ffffff;
	--warmwhite: #fcfbe3; /* rgb(252,251,227),hsl(57.6,80.6%,93.9%),cmyk(0,0,10,1)*/
	--warmwhite: #fefef5;
	/*--warmlightwhite: #fcfbe3;  rgb(252,252,227),hsl(60,81%,94%),cmyk(0,0,10,1)*/
	--warmlightwhite:#fdfdf3; /* panatone sort of "P 1-9 C"rgb(253,253,243),hsl(60,71.4%,97.3%),cmyk(0,0,4,1) ::: actually cmyk(0,0,3.4,0.6)*/
	--warmwhiteveil: rgba(253,253,243,0.8);
	--veilwarmwhite: rgba(252, 251, 227, 0.8);
	--veilwarmblack: rgba(25, 25, 24, 0.4);
	--richblack: #010203;
	--richgray1: #2a2a2b;
	--richgray2: #4f4f50;
	--richgray3: #777878;
	--richgray4: #a2a3a3;
	--richgray5: #d0d0d0;

	--monospace_code: Courier, 'Andale Mono', AndaleMono, Monaco, monospace;
	--monospace: 'Lucida Console', 'Andale Mono', AndaleMono, Monaco, Courier, monospace;
	--monospace_zeroslash: Monaco, 'Andale Mono', AndaleMono, Courier, monospace;
	--monospace_zerodot: 'Andale Mono', AndaleMono, Monaco, Courier, monospace;
	--typewriter: 'American Typewriter', Didot, 'Times New Roman', serif;
	--sans: Helvetica, Verdana, Arial, Tahoma, 'Trebuchet MS', sans-serif;
	--serif: Georgia, Didot, 'Times New Roman', Times, serif;
	--cursive: 'Bradley Hand', 'Comic Sans MS', cursive, sans-serif;
	--dragons: Luminari, 'Bradley Hand', cursive, sans-serif;
	--oldbook: 'Palatino Linotype', 'Book Antiqua', Palatino, 'American Typewriter', 'Times New Roman', serif;
	--maxcontentwidth: 800px;
}

:root {
	/* type scale from https://www.rawkblog.com/2018/05/modular-scale-typography-with-css-variables-and-sass/ */
	--font-size: 100%; 
	--h5: 1.4rem;
	--h4: 1.6rem;
	--h3: 2.0rem;
	--h2: 2.4rem;
	--h1: 3.2rem;
}
/* Web Safe Font Stacks (classes set in CSS) */
.head {font-family: Georgia,'Times New Roman',serif}
.para {font-family: Verdana,Arial,sans-serif}
.mono {font-family:'Courier New',Courier,monospace}
.fant {font-family: Papyrus,Impact,fantasy}
.curs {font-family:'Apple Chancery','Lucida Calligraphy',cursive}
a {
	color: var(--red);
	font-weight: bold;
	/*text-transform: uppercase;*/
}
a:hover {
	text-decoration: underline;
	color: var(--yellow);
	fill: var(--red);
	font-weight: bolder;
}
body header, body footer {
	display: flex;
	align-items: center;
	justify-content: space-around;
	justify-content: left; /*space-around*/
	flex-wrap: wrap;
	gap: 0px;
	width:100%;
	min-width:100%;
	padding: 6px;
	padding-top: 8px;
	background-color: var(--warmblack);
	color: var(--warmlightwhite);
	/*box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0,0,0,0.2);*/
}
/*
.sociallinks {
max-width: 100%;
display: grid;
gap: 2px;
grid-template-columns: 1fr 1fr;
align-items: center;
align-items: right;
justify-items: right;
margin-top:3rem;
}
 */
	body footer svg.socialicon {
		max-width: 40px;
		align-content: center;
		fill: var(--white);
	}
	body footer a:hover svg.socialicon {
		fill: var(--yellow);
	}
	body header > div {
		margin:6px;
		margin-left:9px;
		flex:4;
		/*margin-right: auto;*/
	}
	body  footer > div {
		margin:6px;
		margin-left: 4%;
		margin-right: 4%;
		flex:1;
		/*margin-right: auto;*/
	}
	body  header > .logo {
		margin: 1rem;
		width: 14%;
		padding:4px;
		align-content: center;
		background-color: var(--warmlightwhite);
		max-width:260px;
		min-width:140px;
		flex:1;
	}
	body  header > .logo a, body  footer > .logo a {
		display: inline-block;
		width: 100%;
		max-width:100%;
	}
	body  header > h1, body  footer > div, body  footer a {
		color: var(--warmlightwhite);
	}
	nav {
		display: block;
		margin: 0 auto;
		margin: 0;
		padding: 1em;
		background-color: var(--warmblack);
		color: var(--warmlightwhite);
	}
	.nav-list {
		font-family: "Montserrat", sans-serif;
		font-family: var(--sans);
		font-family: var(--monospace);
		font-size: 1.1rem;
		font-weight: 550;
		margin-top: 0.6rem;
		list-style-type: none;
		padding-top: 0.5rem;
		padding-bottom: 0rem;
		padding-left: 1px;
		padding-right: 1px;
		/*text-transform: uppercase;*/
	}

	footer {
		font-family: "Montserrat", sans-serif;
		font-family: var(--sans);
		font-size: 0.9rem;
		font-weight: 550;
	}
	nav > ul {
		display: flex; 
		justify-content: space-between;
		align-items: left;
		margin: 0;
	}
	/* Responsive layout - makes a one column layout instead of a two-column layout */
	@media (max-width: 940px) {
		nav {
			margin-left: 0;
			padding-left: 0;
		}
		nav > ul {
			flex-direction: column;
			align-items: left;
			text-align: left;
		}
	}
	nav > ul > li {
		/* text-transform: lowercase;*/
		display: inline-block;
		font-weight:bold;
		list-style: none;
		padding: 0 0em;
		margin: 0.3em 1em 0.3em 2em;
		border-bottom: 2px solid var(--warmblack);
	}
	nav > ul > li > a {
		color: var(--warmlightwhite);
		text-decoration: none;
		font-weight:bold;
		line-height: 1.2rem;
	}
	nav > ul > li.active {
		color: var(--white);
		border-bottom: 3px solid var(--yellow);
	}
	body {
		font-family: Georgia, serif;
		font-family: "Domine", serif;
		font-family: var(--sans);
		background-color: var(--warmblack);
		background-color: var(--warmlightwhite);
		margin: 0 auto;
		font-size: 1.1rem;
		line-height: 160%;
	}
	main {
		margin:auto;
		margin: 0 auto;
		padding: 2em;
		width:94%;
		max-width: 800px;
		max-width: var(--maxcontentwidth);
		background-color: var(--warmlightwhite);
		color: var(--black);
	}
	@media (max-width:900px) {
		main {
			margin: 0 auto;
			padding: 1em;
			width:98%;
			background-color: var(--warmlightwhite);
			color: var(--black);
		}
	}
	.textcontent {
		max-width: 60ch;
	}
	picture, img {
		vertical-align:middle;
		width: 100%;
		max-width: 100%;
		margin: auto;
	}
	figcaption {
		margin: auto 2px;
		padding:1em;
		padding-left:0;
		color:var(--gray);
		font-size: 0.8em;
	}
	figure {
		display:block;
		width: 100%;
		max-width: 800px;
		/*margin: 2em auto;*/
		margin: 0;
		margin-bottom: 2em;
		text-align: center;
		text-align: left;
	}
	@media (max-width:800px) {
		figure: {
			margin: 0;
			width: 100%;
			min-width: 100%;
		}
	}
	.flex-container {
		display: flex;
		flex-direction: row;
		flex-wrap: no-wrap;
		align-items: center;
		justify-content: space-between;
	}
	.subtext {
		font-style:italic;
	}
	h1 {
		font-size: 3rem;
		font-size: var(--h1);
		line-height: 145%;
		font-weight: 600;
		font-family: "Montserrat", sans-serif;
		font-family: var(--monospace);
		text-align: left;
		color: #365061;
		color: var(--h1color);
	}

	h2 {
		font-family: "Montserrat", sans-serif;
		font-family: var(--sans);
		font-family: var(--monospace);
		font-size: 2.6rem;
		font-size: var(--h2);
		line-height: 125%;
		font-weight: 550;
		color: #2d4c6b;
		color: #172636;
		color: var(--h2color);
	}

	h3 {
		font-family: "Montserrat", sans-serif;
		font-family: var(--sans);
		font-size: 1.3rem;
		font-size: var(--h3);
		font-weight: 570;
		font-weight: 450;
	}

	li {
		margin-bottom: 1em;
	}
	.address {
		padding:1em;
		border-left: 2px solid var(--yellow);
	}
	.line-above {
		border-top: 1px solid #cbcfd9;
		padding-top: 2rem;
	}
	p {
		max-width: var(--maxcontentwidth);
		margin-bottom: 1.5em;
	}
	strong, em {
		font-weight: bold;
	}
	.small {
		font-size: .8em;
	}
	.large {
		font-size: 1.2em;
	}
	i {
		font-style: italic;
	}
	.left {
		text-align: left;
	}
	.right {
		text-align: right;
	}
	.center {
		text-align: center;
	}
	.indent {
		margin-left: 2rem;
	}
	.letterspacing-extra {
		letter-spacing: 0.2ch;
	}
	blockquote {
		background-color:var(--white);
		margin: 1em 0;
		padding:2em;
	}
	.insertbox {
		background-color:var(--white);
		margin: 1em 0;
		padding:2em;
	}
	@media (max-width:800px) {
		.insertbox {
			margin: 1em 0;
			padding: 1em;
		}
	}
	.ul-list-style-none {
		list-style: none;
	}

	ul li {
		margin-left: 0;
	}

	dl > dt {
		margin: 1em 0 0.5em 0;
	}
	.btn a {
		color: var(--warmlightwhite);
	}
	.btn {
		font-family: "Montserrat", sans-serif;
		font-family: var(--sans);
		font-family: var(--monospace);
		padding: 0.4em;
		margin: 0.4em;
		font-size: 1rem;
		/* text-transform: uppercase; */
		font-weight: 800;
		background-color: var(--warmblack);
		color: var(--warmlightwhite);
		letter-spacing: 2.67px;
		cursor: pointer;
		display: inline-block;
		/* padding: 1rem 3rem; */
		padding: 16px 20px;
		/* margin-top: 1em; */
		/*border: 1px solid var(--blue);*/
		text-decoration: none;
		margin: 1em;
		margin-left: 0em;
	}
	.btn:hover,
	.btn:focus {
		color: var(--white);
		background-color: var(--red);
		text-decoration: none;
	}
