@import url("/src/css/normalize.css");
@import url("/src/css/images.css");
@import url("/src/css/text.css");

html {
	scroll-padding-top: 2.5rem;
	scroll-padding-bottom: 2.5em;
}

body {
	margin: 1em;
	padding-top: 1em;  /* Allow space for site header */
	padding-bottom: 1em;  /* Allow space for site header */
}

/***************** Site Header and Footer *****************************************
*
* Layout of Site Headline, Site Navigation Site Footer
* includes the drop downs and drop ups
*
******************************************************************************/

body > header,
.site-header {
	position: fixed;
	top: 0;
	left: 1em;
	right: 1em;
	height: 2em;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-left: 1em;
	padding-right: 1em;
	background-image: linear-gradient(saddlebrown, lightblue, white, lightblue, saddlebrown);
}

body > footer,
.site-footer 
{
	position: fixed;
	bottom: 0;
	left: 1em;
	right: 1em;
	height: 2em;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-left: 1em;
	background-image: linear-gradient(saddlebrown, lightblue, white, lightblue, saddlebrown);
}

main {
	box-shadow: -1px -1px 0.5em gray inset, 1px 1px 0.5em grey inset;
	padding: 1em;
}

.html-box {
	font-size: 1em; 
	padding: 0.5em;
	padding-bottom: 0.3em;
	margin-bottom: 1em;
}
div.html-box {
	border: 1px solid black;
}

code.html-box {
	border: 1px solid black;
	background-color: white;
	display: block;
}

iframe {
	width: 100%;
	aspect-ratio: 2 / 1;
}
figcaption::before {
	content: "• ";
	font-weight: bolder;
}	


div.slide {
	border: thin solid gray;
	box-shadow: 
		-1px -1px 1em 1px gainsboro inset, 
		1px 1px 1em 1px gainsboro inset; 
	margin: 1em 0;
	padding: 1em;
	padding-left: 1em;
}

div.slide-header {
	border-bottom: thin solid gray;
}

.term .dt {
	margin: 0;
	margin-bottom: 0.5em;
	font-size: 2em;
	text-align: center;
	font-weight: bold;

}

.term li {
	margin-bottom: 0.5em;
}

table {
	width: 100%;
}

/** Show border in table by default */
table, th, td {
	border:  1px solid black;
	border-collapse: collapse;
	text-align: left;
	padding: 0.5em 0.1em;
}

tr > td:first-child
{
	min-width: 6em;
}
tr.strong {
	font-weight: bolder;
}
td.strong {
	font-weight: bolder;
}

h5 {
	font-size: 0.9rem;
	font-family: monospace;
	font-weight: normal;
	font-style: italic;
}

h6 {
	font-size: 0.9rem;
	font-family: sans-serif;
	font-weight: normal;
	font-style: italic;
}