/* =========================================== */
/* !ROOT */

:root {
/* WHITES */
	--SPsmoke: rgba(245,245,245,1.0); /* Whitesmoke */ 
	--SPice: rgba(248,248,255,1.0); /* GhostWhite */ 

/* GREYS */
	/* Backgrounds */
	--SPgrey: rgba(220,220,220,0.9); /* Gainsboro at 0.9 */ 
	--SPsilver: rgba(220,220,220,0.5); /* Gainsboro at 0.5 */
	--SPmica: rgba(105,105,105,0.1); /* DimGray at 0.1 */ 
	--SPslate: rgba(112,128,144,0.8); /* SlateGray at 0.8 */ /* meter: 113,128,143 */
	/* Foregrounds */
	--SPlead: rgba(128,128,128,1.0); /* Gray */ 
	--SPcarbon: rgba(105,105,105,1.0); /* DimGray */ 
	--SPblack: rgba(0,0,0,1.0); /* Black */

/* BLUES */
	/* Backgrounds */
	--SPblue: rgba(89,150,191,0.1); 
	/* Foregrounds */
	--SPsteel: rgba(70,130,180,1.0); /* SteelBlue */ /* meter: 73,131,178 */

/* REDS */
	--SPred: rgba(176,36,40,1); /* FireBrick */

/* GOLDS */
	--SPgold: rgba(217,164,50,1); /* DarkGoldenrod */

/* KHAKIS */
	--SPmanilla: rgba(191,182,138,0.3); 
	--SPbeige: rgba(191,182,138,0.2); 
	--SPkhaki: rgba(203,197,154,0.5); 
	--SPflax: rgba(203,197,154,0.15); 

/* SHADOWS */
	--SPdslight: drop-shadow(1px 1px 5px LightGray);
	--SPdsmedium: drop-shadow(1px 1px 3px DarkGray);
	--SPdsdark: drop-shadow(1px 1px 5px Gray);
	--SPdsshort: drop-shadow(1px 1px 3px Gray);
	}


/* =========================================== */
/* !BODY */

body {
	background-color: var(--SPsmoke);
	font-size: 16px;
	}


/* =========================================== */
/* !FONT-FACES */

/* headers */
@font-face {
	font-family: "MyHeaderFont"; 
	src: url('../fonts/Dosis-Medium.otf') format('truetype'); 
	}

/* captions */
@font-face {
	font-family: "MyLightFont"; 
/* 	src: url('../fonts/Dosis-Light.otf') format('truetype');  */
	src: url('../fonts/Dosis-Regular.otf') format('truetype'); 
	}



/* body sans */
@font-face {
	font-family: "MyBodyFont"; 
	src: url('../fonts/Dosis-Regular.otf') format('truetype'); 
	}

@font-face {
	font-family: "MyBodyFont"; /* bold */
	src: url('../fonts/Dosis-Medium.otf') format('truetype'); 
	font-weight: bold;
	}

@font-face {
	font-family: "MyBodyFont"; /* italic */
/* 	src: url('../fonts/Dosis-Light.otf') format('truetype');  */
	font-style: italic;
	}
/* shunts the <em> format towards the Light variant */


/* body serif */
@font-face {
	font-family: "MySerifFont"; 
	src: url('../fonts/Dosis-Regular.otf') format('truetype'); 
	}

@font-face {
	font-family: "MySerifFont"; /* bold */
	src: url('../fonts/Dosis-Medium.otf') format('truetype'); 
	font-weight: bold;
	}

@font-face {
	font-family: "MySerifFont"; /* italic */
/* 	src: url('../fonts/Dosis-Light.otf') format('truetype');  */
	font-style: italic;
	}
/* shunts the <em> format towards the Light variant */


/* mono */
@font-face {
	font-family: "MyMonoFont"; 
	src: url('../fonts/Dosis-Regular.otf') format('truetype'); 
	}



/* =========================================== */
/* !HOLY GRAIL GRID */

.hgg-parent {
/* 	background: Gray; */
	display: grid;
	margin: 0em 6em 1em 6em;
	padding: 1em 0em 0em 0em;
/* 	grid-template-columns: auto 1fr auto; */
	grid-template-columns: auto 1fr minmax(min-content, max-content);
	grid-template-rows: auto;
	}


/* Head/ Foot */
.hgg-head {
/* 	background: Cornsilk; */
	grid-column: 1 / 4;
	margin: 1em 2.5em 0em 2.5em;
	padding: 0em 0em 0em 0em;
	}

.hgg-foot {
/* 	background: Cornsilk; */
	grid-column: 1 / 4;
	display: block;
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	text-align: right;
	color: DimGray;
	font-size: 0.85rem;
	line-height: 1.5;
	margin: 0em 2.5em 2em 3em;
	padding: 0em 0.75em 0em 0em;
	}


/* emulates hgg-foot, but brings the text to the left */ 
.testimonial-signature {
	font-family: 'MyLightFont', Fallback, sans-serif;
	text-align: right;
	color: DimGray;
	font-size: 0.85rem;
	line-height: 1.5;
	margin: 1em 0em 1em 0em;
	padding: 0em 0em 0em 0em;
	}



/* HGG 1-COL */
.hgg-block {
/* 	background: Khaki; */
	grid-column: 1 / 4;
	margin: 0em 2em 1em 2em;
	padding: 0em 3em 0em 3em;
	font-family: 'MySerifFont', Fallback, serif;
	color: DimGray;
	font-size: 1.05rem;
	line-height: 1.5;
	font-stretch: normal;
	font-style: normal;
	font-variant: normal;
	letter-spacing: 0;
	text-align: justify;
	}



/* HGG 3-COL */
/* image-text spacing set by the margins of 'filter-drop-shadow-medium' */

.hgg-left {
/* 	background: DarkKhaki; */
	grid-column: 1 / 2;
	width: 140px;
	text-align: center;
	margin: 0em 0em 0em 3.5em;
	padding: 0em 0em 0em 0em;
	}

.hgg-center {
/* 	background: Khaki; */
	grid-column: 2 / 3;
	margin: 0em 1em 1em 1em;
	padding: 0em 2em 0em 1em;
	font-family: 'MyBodyFont', Fallback, sans-serif;
	color: DimGray;
	font-size: 1.05rem;
	line-height: 1.5;
	font-stretch: normal;
	font-style: normal;
	font-variant: normal;
	letter-spacing: 0;
	text-align: left;
	}

.hgg-right {
/* 	background: Goldenrod; */
	grid-column: 3 / 4;
	text-align: right;
	margin: 0em 2.5em 0em 0em;
	padding: 0em 1em 0em 0em;
	}

/* stack the buttons (e.g. index of juxtapositions, comprehensive provisions) */
.hgg-right p {
	margin: 0em 0 0em 0;
	padding: 0;
	}



/* HGG backgrounds */
/* thick border */
.bg-hgg-ghost {
	z-index: 10;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	border: 5px solid var(--SPice);
	-webkit-box-shadow:0 1px 10px LightGray;
	-moz-box-shadow:0 1px 10px LightGray;
	box-shadow:0 1px 10px LightGray;
	}

/* like ghost but slim border */
.bg-hgg-fringe {
	z-index: 10;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	border: 2px solid var(--SPice);
	-webkit-box-shadow:0 1px 10px LightGray;
	-moz-box-shadow:0 1px 10px LightGray;
	box-shadow:0 1px 10px LightGray;
	}

.bg-hgg-grey {
	background: var(--SPgrey);
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

.bg-hgg-slate {
	background: var(--SPslate);
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

.bg-hgg-silver {
	background: var(--SPsilver);
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}


.bg-hgg-manilla {
	background: var(--SPmanilla);
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

.bg-hgg-beige {
/* 	margin-bottom: 2em; */
	background: var(--SPbeige);
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

.bg-hgg-flax {
	background: var(--SPflax);
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

.bg-hgg-blue {
	background: var(--SPblue);
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}




/* =========================================== */
/* !CONTAINER BLOCKS */


/* --- COMMON ELEMENTS OF BLOCKS --- */

/* (almost) like bookmark but left-flush */
.lettrine {
	display: inline-block;
	float: left;
	vertical-align: bottom;
	margin: 0em 0em 0em 0em;
	padding: 0em 1.5em 0em 0em;
	}


/* same as rightmark (or old bookmark); right-margin lettrine (right-flush) */
.decal {
	display: inline-block;
	float: right;
	text-align: right;
	vertical-align: bottom;
	margin: 0.2em 0em 0em 0em;
	padding: 0em 0em 0.5em 2em;
	}


/* the old 'lcol' and variants; similar to 'lettrine' (smaller images) */
/* use with 'shift-1', 'shift-2', etc.  */
.leftmark {
	display: inline-block;
	float: left;
	width: 120px;
	text-align: center;
	margin: 0em auto 0em auto;
	padding: 0.2em 2em 0.5em 0em;
	vertical-align: bottom;
	}

/* the old 'bookmark' */
/* use with 'shift-1' or 'shift-2'  */
.rightmark {
	display: inline-block;
	float: right;
	text-align: right;
	vertical-align: bottom;
	margin: 0.2em 0em 0em 0em;
	padding: 0em 0em 0.5em 2em;
	}

/* for use within a description list */
.rightmark-dd {
	display: inline-block;
	float: right;
	text-align: right;
	vertical-align: bottom;
	margin: 0.2em 5em 0em 0em;
	padding: 0em 0em 0.5em 2em;
	}


/* for use within a table (soon to be substituted by the '-dd' version) */
.rightmark-table {
	display: inline-block;
	float: right;
	text-align: right;
	vertical-align: bottom;
	margin: 1em 4em 0em 0em;
	padding: 0em 0em 0.5em 2em;
	}

/* for use within a 'formatted-c' <td> (mainly in the store) */
/* also for 'formatted-m' <td> (and some plain 'formatted' -- e.g. book series and journal homes) */
.rightmark-c {
	display: inline-block;
	float: right;
	text-align: right;
	vertical-align: bottom;
	margin: 1em 2.5em 0em 0em;
	padding: 0em 0em 0.5em 2em;
	}



/* minor shift (e.g. for decal) */
.shift-0 {
	margin-top: -0.25em;
	}

/* effect similar to bookmark-fp */
.shift-1 {
	margin-top: -0.5em;
	}

/* effect similar to bookmark-fp-super */
.shift-2 {
	margin-top: -1.4em;
	}



/* similar to h5 */
/* use with summary panels, tile displays, etc. */
.spaced-header {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	color: DimGray;
	font-weight: normal;
	text-align: center;
	font-size: 0.9rem;
	letter-spacing: 0.4em;
	margin: 1em 0em 0em 0em;
	padding: 0em 0em 0px 0em;
	font-feature-settings: "liga" 0;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}



/* --- HEADER BLOCK --- */
/* Site Nav; Page ID; Page Nav */


/* ...SITE NAVIGATION */
.navtable { 
	display: block;
	margin: 0em auto 0em auto;
	width: 92%;
	list-style-type: none;
	margin: 12px auto 10px auto;
	padding: 0px 0px 0px 0px;
	-webkit-border-radius: 0.5em; 
	-moz-border-radius: 0.5em;
	border-radius: 0.5em;
	}

.navtable div.left {
	display: inline-block;
	float: left;
	width: 235px;
	padding: 0px 0px 5px 15px;
	text-align: center;
	}

.navtable div.right {
	display: inline-block;
	padding: 0px 0px 5px 35px;
	width: auto;
	text-align: left;
	}

.navtable div.far {
	display: inline-block;
	float: right;
	width: 125px;
	white-space: nowrap; /* keeps the 'i' inline */
	padding: 5px 30px 5px 0px;
	}



/* ...PAGE ID */
.dtable-i {
	display: block;
	position: relative;
	width: 92%;
	margin: 0em auto 0em auto;
	padding: 0px 0em 0em 0em;
	background: var(--SPflax);
	border-spacing: 0px 10px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	}

.dtable-i div.left {
	display: inline-block;
	padding: 10px 0px 10px 0px;
	width: 235px;
	text-align: center;
	vertical-align: middle;
	}

.dtable-i div.right {
	display: inline-block;
	padding: 0px 0px 0px 0px;
	text-align: left;
	vertical-align: middle;
	}

.dtable-i div.badger {
	position: absolute;
	top: 50%;
	right: 0px;
	transform: translate(-50%, -50%);
	}

.badger-dam {
	width: 80px;
	text-align: center;
	}



/* ...PAGE NAVIGATION */
.btable {
	display: block;
	margin: 0em auto 0em auto;
	padding: 0.1em 0px 0.1em 0px;
	width: 92%;
	-webkit-border-radius: 0.5em; 
	-moz-border-radius: 0.5em;
	border-radius: 0.5em;
	-webkit-box-shadow: 1px 1px 10px LightGray;
	-moz-box-shadow: 1px 1px 10px LightGray;
	box-shadow: 1px 1px 10px LightGray;
	}

.btable div.left {
	display: inline-block;
	width: 235px;
	padding: 0px 0px 0px 0px;
	text-align: center;
	}

.btable div.right {
	display: inline-block;
	padding: 0px 0px 0px 42px;
	text-align: left;
	}



/* --- TOP PAGE ILLUSTRATIONS --- */

/* wrapper div */
.centerpiece {
	text-align: center;
	margin: 35px auto 60px auto;
	padding: 40px 0px 20px 0px;
	}

.slices {
	text-align: center;
	margin: 0px auto 0px auto;
	}

.slices div {
	padding: 0px 0px 0px 0px;
	}




/* --- FOOTER BLOCK --- */

/* same as 'table.dtable-f' (now obsolete) */
.footer {
	font-size: 1rem;
	line-height: 1.5;
	margin: 2em auto 2em auto;
	padding: 0.5em 2em 1em 2em;
	}

.footer div {
	margin: 0px auto 0px auto;
	padding: 20px 0px 0px 0px;
	text-align: center;	
	}

/* use for the logo in the impressum/ footer */
.centermark {
	text-align: center;
	margin: 0em auto 0em auto;
	padding: 0em 0em 0em 0em;
	}



/* --- FRAMED BLOCK --- */

/* the old 'dtable-s' */
/* use with <p class="tablelist-preface"> (similar to "tablelist-preface-sans", exclusive for cooperation frameworks @Studio) */
/* for 'researchpanel-opening' and 'researchpanel-about' text boxes */
.framed-block {
	display: block;
	width: 100%;
	margin: 0em 0em 0em 1em;
	padding: 0em 0em 0em 0em; 
	}



/* --- OPEN BLOCK --- */

/* for footer navigation */
.open-block {
	display: block;
	margin: 1em 0em 1em 2.2em;
	padding: 0em 0em 0em 0em; 
	}



/* --- TILE BLOCK --- */

/* the old 'stable-i' */
/* use with unmarked <div> (below), inside a 'researchpanel-m' div */
.tile-block {
	text-align: center;
	margin: 0em auto 0em auto;
	padding: 1.5em 0em 0em 0em;
	}

/* among tiles */
.tile-block div {
	display: inline-block;
	text-align: center;
	vertical-align: baseline;
	margin: 0em 0em 0em 0em;
	padding: 0px 12px 0px 12px;
	}

/* similar to caption */
.tile-block p {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	font-size: 0.85rem;
	color: DimGray;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}




/* --- COLUMN BLOCK --- */

/* e.g. box sets (home page) */
.column-block {
	display: block;
	width: 740px;
	margin: 1.5em auto 1.5em auto;
	padding: 0em 2em 0em 2em;
	}

/* column set */
.columns-x { 
	width: 640px; 
	margin: 0em 2em 0em 2em;
	}

/* each column */
.columns-x div { 
	width: 320px; 
	float: left;
	line-height: 1.5;
	}

/* clears 'floats' to avoid container collapse (e.g. 'column-block') */
.clear-x {
	clear: both;
	}




/* =========================================== */
/* !HEADERS */

h1 {
	font-family: "MyHeaderFont", Fallback, sans-serif;
	font-size: 1.1rem;
	color: DimGray;
	margin: 0.2em 0em 0.2em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

h2 {
	font-family: 'MyHeaderFont', Fallback, sans-serif;
	color: DimGray;
	font-size: 1.2rem;
	margin: 3em 3em 1em 2.5em;
	padding: 0.4em 4em 0.4em 0.9em;
	text-shadow: 1px 1px 5px Gainsboro;
	display: inline-block;
	background: var(--SPflax);
	background: -webkit-linear-gradient(left, rgba(203,197,154,0.15), Whitesmoke);
	background: -moz-linear-gradient(left, rgba(203,197,154,0.15), Whitesmoke);
	-webkit-border-radius: 0.5em; 
	-moz-border-radius: 0.5em;
	border-radius: 0.5em;
	}

/* dummy header for the target symbol */
h2.target {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.5rem;
	color: DimGray;
	font-weight: normal;
	margin: 0em 0em 0em 3.5em;
	padding: 1.5em 0em 0.5em 0em;
	display: block;
	background: none;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* dummy header to precede the Preface */
h2.dummy {
	margin: 3em 3em 1em 2.5em;
	padding: 0.5em 4em 0.5em 0.9em;
	display: inline-block;
	background: Whitesmoke;
	background: -webkit-linear-gradient(left, Whitesmoke, Whitesmoke);
	background: -moz-linear-gradient(left, Whitesmoke, Whitesmoke);
	}

/* special for the frontpage */
h2.frontpage {
	color: DarkGoldenrod;
	font-size: 1.4rem;
	text-shadow: 1px 1px 10px LightGray;
	margin: 2em 3em 0.2em 1.8em;
	padding: 0.5em 4em 0.5em 0.9em;
	display: inline-block;
	background: Whitesmoke;
	}


h3 {
	font-family: 'MyHeaderFont', Fallback, sans-serif;
	text-align: left;
	color: DimGray;
	font-size: 1.15rem;
	margin: 0.5em 0em 1em 4.5em;
	padding: 1em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


h4 {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	text-align: left;
	color: DimGray;
	font-weight: bold;
	font-size: 1.1rem;
	margin: 0em 0em 1em 6.5em;
	padding: 1em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

h4.quality-standard {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	text-align: left;
	color: DimGray;
	font-weight: bold;
	font-size: 1.1rem;
	margin: 0.5em 0em 0.5em 10.3rem; 
	padding: 3em 0em 0.5em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* like quality-standard but a bit less flush left */
h4.example-standard {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	text-align: left;
	color: DimGray;
	font-weight: bold;
	font-size: 1.1rem;
	margin: 0.5em 0em 0.5em 9.1em;
	padding: 3em 0em 0.5em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* for CA quotes and illustration thumbnail, & contrast box; similar to "panel-note" */
h4.quote-right {
	text-align: right;
	color: DimGray;
	font-size: 0.9rem;
	margin: 0em 9.8rem -11em 0em;
	padding: 0em 0em 0em 0em;
	}


/* header for the (activity, thematic, and sections) perspective figures */
h4.perspective {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	text-align: center;
	color: DimGray;
	font-weight: normal;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 1em 0em;
	padding: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* header for Notes */
h4.page-note {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	text-align: left;
	color: DimGray;
	font-weight: bold;
	font-size: 1.1rem;
	line-height: 1.5;
	margin: 0em 0em 1em 6.5em;
	padding: 1em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* e.g. types of images (L->R) */
h4.panel-note {
	text-align: right;
	color: DimGray;
	font-weight: normal;
	font-size: 0.9rem;
	line-height: 1.5;
	margin: 0em 9em -3.2em 0em;
	padding: 0em 0em 0em 0em;
	}

/* image v-adjustment (e.g. mentoring > preparation > sound exchange plate) */
h4.panel-note-raise {
	margin-bottom: -2.8em;
	}

h4.panel-note-drop {
	margin-bottom: -5.5em;
	}

h4.panel-note-drop2 {
	margin-bottom: -6.5em;
	}

/* e.g. special for righ-side display of viewpoints (e.g. being, conduct) */
h4.panel-note-viewpoints {
	text-align: right;
	color: DimGray;
	font-weight: normal;
	font-size: 0.9rem;
	line-height: 1.5;
	margin: 2.5em 10.5em -3em 0em;
	padding: 0em 0em 0em 0em;
	}

/* recommendations */
h4.quote-right-viewpoints {
	text-align: right;
	color: DimGray;
	font-weight: normal;
	font-size: 0.9rem;
	line-height: 1.5;
	margin: 8em 11em -10.8em 0em;
	padding: 0em 0em 0em 0em;
	}


/* e.g. special for Project groups, with a panel above (Office page only) */
h4.panel-note-proj {
	text-align: right;
	color: DimGray;
	font-weight: normal;
	font-size: 0.9rem;
	line-height: 1.5;
	margin: 0em 9em -0.5em 0em;
	padding: 0em 0em 0em 0em;
	}

/* use with register tag (project lists) */
h4.panel-note-reg {
	text-align: right;
	color: DimGray;
	font-weight: normal;
	font-size: 0.9rem;
	line-height: 1.5;
	margin: 0em 9em -3.4em 0em;
	padding: 0em 0em 0em 0em;
	}


/* for pinterest and youtube logos */
h4.right {
	text-align: right;
	color: DimGray;
	font-weight: normal;
	font-size: 1.1rem;
	line-height: 1.5;
	margin: 0em 9em -3.5em 0em;
	padding: 1em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* for linkedin logo (at stimulus) */
h4.linkedin-r {
	text-align: right;
	margin: 2.5em 8em -2.3em 0em;
	padding: 0em 0em 0em 0em;
	}


/* stimulus at various instances */
/* stimulus on the right (before h4) */
/* see 'rr-header' */
h4.right-raised-h4 {
	text-align: right;
	color: DimGray;
	font-weight: normal;
	font-size: 1.1rem;
	line-height: 1.5;
	margin: 0em 8em -2.8em 0em;
	padding: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* stimulus on the right (before h3) */
/* see 'rr-header' */
h4.right-raised-h3 {
	text-align: right;
	color: DimGray;
	font-weight: normal;
	font-size: 1.1rem;
	line-height: 1.5;
	margin: 0em 8em -3.2em 0em;
	padding: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* stimulus on the right (by Prospects) */
/* see 'rr-header' */
h4.right-raised-pro {
	text-align: right;
	color: DimGray;
	font-weight: normal;
	font-size: 1.1rem;
	line-height: 1.5;
	margin: 0em 8em -7.2em 0em; 
	padding: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* shifts the stimulus 'right-raised' tag flush with the h3/h4 header */
/* Blog tag remains as the standard 8em */
h4.rr-header {
	margin-right: 9em;
	}



h5 {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	color: DimGray;
	font-weight: normal;
	font-size: 0.9rem;
	text-align: center;
	letter-spacing: 0.4em;
	margin: 0em 0em 0em 0em;
	padding: 0em 0em 0px 0em;
	font-feature-settings: "liga" 0;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

/* special to antecede A,B,F,P,W,S */
h5.mediaheader {
	margin: 1.5em 0em 0em 0em;
	}

h5.impressum {
	margin: 0.3em 0em -0.5em -0.2em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* table headers: (almost) the same formatting as H5 */
th {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	color: DimGray;
	font-weight: normal;
	font-size: 0.9rem;
	line-height: 1.5;
	text-align: center;
	letter-spacing: 0.4em;
	margin: 0em 0em 0em 0em;
	padding: 0em 0em 0px 0em;
	font-feature-settings: "liga" 0;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

/* special for 'authtable' */
th.authors {
	margin: 0em 0em 0em 0em;
	padding: 0em 0em 0.6em 0em;
	line-height: 1.5;
	font-feature-settings: "liga" 0;
	}


/* =========================================== */
/* !GENERAL HYPERLINK EFFECTS */

a {
	color: SteelBlue;
	text-decoration: none;
	text-shadow: 1px 1px 5px Gainsboro;
	}

a.bright {
	text-shadow: none;
	}

a.nav {
	color: DimGray;
	text-decoration: none;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* contrastbox */
a.contrast {
	color: LemonChiffon;
	text-decoration: none;
	text-shadow: 1px 1px 5px DimGray;
	}

/* group-caption highlight of 'quality' items (e.t. standards, position) */
.inline-highlight-quality {
	color: var(--SPslate);
	text-shadow: none;
	}



/* =========================================== */
/* !ARTWORK HOVER EFFECTS */

.popart a img {
	display: none;
/* 	position: absolute; */
/* 	margin: -10em 0em 0em 4em; */
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	}

.popart a:hover img {
	display: inherit;
	}


/* =========================================== */
/* FOOTER NAV LISTS, inside dtable-f */

/* inline, for images (e.g. social media) */
ul.footnav-inline {
	display: inline;
	position: relative;
	list-style: none;
	text-align: center;
	margin: 1em 0em 1em 0em;
	padding: 0em 0em 0em 0em;
	}

ul.footnav-inline li {
	display: inline;
	margin: 0em 0em 0em 0em;
	padding: 0em 0.5em 0em 0.5em;
	}


/* stack, for text */
ul.footnav-stack {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	color: Black;
	font-size: 1rem;
	line-height: 1.5;
	position: relative;
	list-style: none;
	display: inline;
	text-align: center;
	margin: 1em 0em 1em 0em;
	padding: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

ul.footnav-stack li {
	margin: 0em 0em 0.2em 0em;
	padding: 0em 0em 0em 0em;
	}



/* =========================================== */
/* !SPECIAL SYMBOLS */

.bigarrow {
	color: Gray;
	font-size: 2em;
	padding: 0em 0em;
	vertical-align: middle;
	text-align: center;
	text-shadow: 1px 1px 5px Gainsboro;
	}




/* =========================================== */
/* !PARAGRAPH TEXT */

/* the basic paragraph */
p {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	color: Black;
	font-size: 1.05rem;
	line-height: 1.5;
	font-stretch: normal;
	font-style: normal;
	font-variant: normal;
	letter-spacing: 0;
	}

/* the right column of dtable-i */
p.header {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	color: DimGray;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0.2em 0em 0.2em 52px;
	padding: 0em 0px 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


.navitem {
	color: DimGray;
	font-size: 1.2rem;
	line-height: 1.5;
	margin: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* the only relative size (in 'em') */
.greektext {
	font-family: serif;
	font-size: 1em;
	text-transform: lowercase;
	}




/* ------------------- */
/* DISPLAY ITEMS */

/* "i" (tips) by the search field (page top) */
.display-tips {
	color: DarkGoldenrod;
	font-size: 1.1rem;
	line-height: 1.5;
	vertical-align: middle;
	margin: 0em 0em 0em 0em;
	padding: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* loupe symbol at local search tips (inside the popup) */
.displayitem-tip {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.8rem;
	line-height: 1.5;
	vertical-align: middle;
	color: DimGray;
	margin: 0em 0.2em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* triple integral symbol (at registers) */
.display-integral {
	font-family: 'MySerifFont', Fallback, serif;
	color: DimGray;
	font-size: 1.2rem;
	}


/* workshop and book testimonials (announcement) */
.displayitem-mono {
	font-family: 'MyMonoFont', Fallback, monospace;
	color: DimGray;
	text-transform: uppercase;
	font-size: 1.2rem;
	margin: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* index title for contrast boxes */
.displayitem-contrast {
	font-family: 'MyHeaderFont', Fallback, sans-serif;
	color: WhiteSmoke;
	text-transform: uppercase;
	font-size: 1.2rem;
	line-height: 1.5;
	margin: 0em 0em 0em 1.8em;
	text-shadow: 1px 1px 5px Gray;
	}


/* for cooperation frameworks (alternatives) */
.displayitem-highlight {
	font-family: 'MyHeaderFont', Fallback, sans-serif;
/* 	color: GhostWhite; */
	color: var(--SPlead);
	font-size: 1.25rem;
	line-height: 1.5;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* brief words (e.g. MOBI, EPUB) */
.displayfiletype {
	font-family: 'MyMonoFont', Fallback, monospace;
	color: DimGray;
	font-size: 1.1rem;
	line-height: 1.5;
	margin: 0em 0em 0em 0em;
	padding: 0pt 5pt;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* special for authors */
.displayauthor {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	color: DimGray;
/* 	text-transform: uppercase; */
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* special for the editorial references */
.displayeditor {
	font-family: 'MyBodyFont', Fallback, sans-serif;
/* 	color: SteelBlue; */
	color: DimGray;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* special for registers, archives, catalogues */
.displayregister {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	color: DimGray;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* normal font size (e.g. box sets) */
.display-normal {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	color: DimGray;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* special for syndicates */
.displaysyndic {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	color: DimGray;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* special for routine tables (& beige nav slabs) */
.displayroutine {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	color: DimGray;
	text-align: center;
	font-size: 1.25rem;
	line-height: 1.5;
	font-weight: bold;
	margin: 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* single letters (e.g. a,b,f,w,s) for reference */
.displayitemlarge {
	font-family: 'MyHeaderFont', Fallback, sans-serif;
	color: DimGray;
	font-size: 5em;
	line-height: 0.92em;
	margin: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* single letters in deployment routines */
.displayitemroutine {
	font-family: 'MyHeaderFont', Fallback, sans-serif;
	color: DimGray;
	font-size: 3em;
	line-height: 1.5;
	margin: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


.displayitemmedium {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 2.2em;
	line-height: 1.5;
	color: DimGray;
	font-weight: bold;
	margin: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* inline software filetypes */
.displayitemsmall {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
	font-weight: bold;
	margin: 0em 0.2em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* the original, in A-FOLIOS */
.displayitemsmall-popart {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
	font-weight: bold;
/* 	background: rgba(203,197,154,0.5); */
	background: var(--SPkhaki);
	margin: 0em 0.2em 0em 0em;
	padding: 0.2px 0.2em 0.1em 0.2em;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	text-shadow: 1px 1px 5px Gainsboro;
	}



/* fixed width (small) *** cornsilk, caption-size, un-bold, lowercase (facets) */
.displayitemsmall-popart-facet {
	display: inline-block;
	width: 72px;
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 0.85rem;
	line-height: 1.5;
	text-align: center;
	display: block;
	color: DimGray;
	background: Cornsilk;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	margin: 2px;
	padding: 4px;
	-webkit-filter: var(--SPdsmedium);
	-moz-filter: var(--SPdsmedium);
	-ms-filter: var(--SPdsmedium);
	-o-filter: var(--SPdsmedium);
	filter: var(--SPdsmedium);
	}



/* fixed width *** contrast box */
.displayitemsmall-popart-contrast-box {
	display: inline-block;
	width: 110px;
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 0.9rem;
	text-transform: uppercase;
	text-align: center;
	text-shadow: 1px 1px 5px DimGray;
	color: WhiteSmoke;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	background: var(--SPslate); 
	border: 1px solid WhiteSmoke;
	margin: 2px;
	padding: 4px 4px 4px 4px;
	-webkit-filter: var(--SPdsmedium);
	-moz-filter: var(--SPdsmedium);
	-ms-filter: var(--SPdsmedium);
	-o-filter: var(--SPdsmedium);
	filter: var(--SPdsmedium);
	}


/* fixed width *** firebrick (quality) */
.displayitemsmall-popart-quality {
	display: inline-block;
	width: 110px;
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 0.85rem;
	text-transform: uppercase;
	font-weight: normal;
	text-align: center;
	text-shadow: 1px 1px 5px DimGray;
	color: LemonChiffon;
	background: var(--SPred); 
	border-radius: 5px;
	-webkit-border-radius: 5px;
	margin: 2px 2px 4px 4px;
	padding: 4px 4px 4px 4px;
	-webkit-filter: var(--SPdsmedium);
	-moz-filter: var(--SPdsmedium);
	-ms-filter: var(--SPdsmedium);
	-o-filter: var(--SPdsmedium);
	filter: var(--SPdsmedium);
	}


/* fixed width *** gray (standard) */
.displayitemsmall-popart-standard {
	display: inline-block;
	width: 170px;
	font-family: 'MySerifFont', Fallback, serif;
	font-size: 0.85rem;
	letter-spacing: 0.4em;
	text-transform: uppercase;
	text-align: center;
	color: DimGray;
	background: var(--SPsilver); 
	border-radius: 5px;
	-webkit-border-radius: 5px;
	margin: 2px 2px 4px 4px;
	padding: 4px 0px 4px 0px;
	}


/* fixed width *** flax (recommendations) */
.displayitemsmall-popart-recommendations {
	display: inline-block;
	width: 275px;
	font-family: 'MySerifFont', Fallback, serif;
	font-size: 0.85rem;
	letter-spacing: 0.4em;
	text-transform: uppercase;
	text-align: center;
	color: DimGray;
	background: var(--SPflax); 
	border-radius: 5px;
	-webkit-border-radius: 5px;
	margin: 2px 2px 4px 4px;
	padding: 4px 0px 4px 0px;
	}


/* fixed width *** silver (simulated illustration) */
.displayitemsmall-popart-simulated {
	display: inline-block;
	width: 320px;
	font-family: 'MySerifFont', Fallback, serif;
	font-size: 0.85rem;
	letter-spacing: 0.4em;
	text-transform: uppercase;
	text-align: center;
	color: DimGray;
	background: var(--SPsilver); 
	border-radius: 5px;
	-webkit-border-radius: 5px;
	margin: 2px 2px 4px 4px;
	padding: 4px 0px 4px 0px;
	}


/* special project index */
.displayitemsmall-popart-projindex {
	display: inline-block;
	width: 220px;
	font-family: 'MySerifFont', Fallback, serif;
	font-size: 0.85rem;
	letter-spacing: 0.4em;
	text-transform: uppercase;
	text-align: center;
	color: DimGray;
	background: var(--SPsilver); 
	border-radius: 5px;
	-webkit-border-radius: 5px;
	margin: 2px 2px 4px 4px;
	padding: 2px 0px 2px 0px;
/*
	margin: 2px 2px 4px 4px;
	padding: 4px 0px 4px 0px;
*/
	}


/* fixed width *** flax (position) */
.displayitemsmall-popart-position {
	display: inline-block;
	width: 160px;
	font-family: 'MySerifFont', Fallback, serif;
	font-size: 0.85rem;
	letter-spacing: 0.4em;
	text-transform: uppercase;
	text-align: center;
	color: DimGray;
	background: var(--SPflax); 
/* 	border: 1px solid var(--SPgrey); */
	border-radius: 5px;
	-webkit-border-radius: 5px;
	margin: 2px 2px 4px 4px;
	padding: 4px 0px 4px 0px;
	}


/* fixed width *** flax (guidelines) */
.displayitemsmall-popart-guidelines {
	display: inline-block;
	width: 190px;
	font-family: 'MySerifFont', Fallback, serif;
	font-size: 0.85rem;
	letter-spacing: 0.4em;
	text-transform: uppercase;
	text-align: center;
	color: DimGray;
	background: var(--SPflax); 
/* 	border: 1px solid var(--SPgrey); */
	border-radius: 5px;
	-webkit-border-radius: 5px;
	margin: 2px 2px 4px 4px;
	padding: 4px 0px 4px 0px;
	}


/* fixed width *** flax (register) */
.displayitemsmall-popart-register {
	display: inline-block;
	width: 160px;
	font-family: 'MySerifFont', Fallback, serif;
	font-size: 0.85rem;
	letter-spacing: 0.4em;
	text-transform: uppercase;
	text-align: center;
	color: DimGray;
	background: var(--SPflax); 
	border-radius: 5px;
	-webkit-border-radius: 5px;
	margin: 2px 2px 4px 4px;
	padding: 2px 0px 2px 0px;
	}


/* fixed width *** flax (archive) */
.displayitemsmall-popart-archive {
	display: inline-block;
	width: 150px;
	font-family: 'MySerifFont', Fallback, serif;
	font-size: 0.85rem;
	letter-spacing: 0.4em;
	text-transform: uppercase;
	text-align: center;
	color: DimGray;
	background: var(--SPflax); 
	border-radius: 5px;
	-webkit-border-radius: 5px;
	margin: 2px 2px 4px 4px;
	padding: 2px 0px 2px 0px;
	}


/* fixed width *** flax (catalogue) */
.displayitemsmall-popart-catalogue {
	display: inline-block;
	width: 200px;
	font-family: 'MySerifFont', Fallback, serif;
	font-size: 0.85rem;
	letter-spacing: 0.4em;
	text-transform: uppercase;
	text-align: center;
	color: DimGray;
	background: var(--SPflax); 
	border-radius: 5px;
	-webkit-border-radius: 5px;
	margin: 2px 2px 4px 4px;
	padding: 2px 0px 2px 0px;
	}


/* fixed width *** blue (prospects) */
.displayitemsmall-popart-prospects {
	display: inline-block;
	width: 180px;
	font-family: 'MySerifFont', Fallback, serif;
	font-size: 0.85rem;
	letter-spacing: 0.4em;
	text-transform: uppercase;
	text-align: center;
	color: DimGray;
	background: var(--SPflax); 
	border-radius: 5px;
	-webkit-border-radius: 5px;
	margin: 2px 2px 0px 6px;
	padding: 4px 0px 4px 0px;
	}



/* fixed width *** cornsilk (SIG) */
.displayitemsmall-popart-sig {
	display: inline-block;
	width: 110px;
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 0.9rem;
/* 	font-weight: bold; */
	text-transform: uppercase;
	text-align: center;
	color: DimGray;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	background: Cornsilk;
	margin: 2px;
	padding: 4px 4px 4px 4px;
	-webkit-filter: var(--SPdsmedium);
	-moz-filter: var(--SPdsmedium);
	-ms-filter: var(--SPdsmedium);
	-o-filter: var(--SPdsmedium);
	filter: var(--SPdsmedium);
	}


/* fixed width *** khaki (competence levels) */
.displayitemsmall-popart-comp {
	display: inline-block;
	width: 110px;
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 0.9rem;
	font-weight: normal;
	text-transform: uppercase;
	text-align: center;
	color: DimGray;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	background: Khaki;
	margin: 2px 2px 1em 2px;
	padding: 4px 4px 4px 4px;
	-webkit-filter: var(--SPdsmedium);
	-moz-filter: var(--SPdsmedium);
	-ms-filter: var(--SPdsmedium);
	-o-filter: var(--SPdsmedium);
	filter: var(--SPdsmedium);
	}


/* fixed width *** beige (home) */
.displayitemsmall-popart-home {
	display: inline-block;
	width: 110px;
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 0.9rem;
/* 	font-weight: bold; */
	text-transform: uppercase;
	text-align: center;
	color: DimGray;
	background: Beige;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	margin: 2px 2px 1em 2px;
	padding: 4px 4px 4px 4px;
	-webkit-filter: var(--SPdsmedium);
	-moz-filter: var(--SPdsmedium);
	-ms-filter: var(--SPdsmedium);
	-o-filter: var(--SPdsmedium);
	filter: var(--SPdsmedium);
	}



/* Innovation parts 1 and 2 */
.displayentity {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
/* 	font-style: italic; */
	margin: 0em 0.2em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}



/* quotes --- similar to newsfeed (shorter line hight) and to tablelist-preface */
.quotefeed {
	font-family: 'MySerifFont', Fallback, serif;
	color: DimGray;
	font-size: 1.05rem;
	line-height: 1.2;
	margin: 0em 0em 0em 0em;
	padding: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* blog entries --- similar to quotefeed (longer line height) */
.newsfeed {
	font-family: 'MySerifFont', Fallback, serif;
	color: DimGray;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 0em 0em;
	padding: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}



/* references within the blog */
.newsref {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	margin: 0em 0em 0em 0.4em;
	padding: 0em 0em 0em 0em;
	}


.grayed {
	color: Gray;
	font-weight: bold;
	margin: 0px 0.3em 0px 0px;
	}

.dimgrayed {
	color: DimGray;
	}

.lightgrayed {
	color: LightGray;
	}




/* badges on left margin (e.g. folios, software) */

/* large: 55 (e.g. ebooks, artwork) */
.sidenote-xlarge {
	margin: -1.5em 0em 0em -8.2em;
	position: absolute;
	}

/* large: 50 (e.g. latex) */
.sidenote-large {
	margin: -1.5em 0em 0em -8em;
	position: absolute;
	}

/* upmid-sized: 42 (e.g. html) */
.sidenote-upmid {
	margin: -1.5em 0em 0em -7.5em;
	position: absolute;
	}

/* mid-sized: 35 (e.g. executive management, visual diagramming) */
.sidenote-mid {
	margin: -1.5em 0em 0em -7.1em;
	position: absolute;
	}

/* lowmid-sized: 26 (e.g. md) */
.sidenote-lowmid {
	margin: -1.5em 0em 0em -6.6em;
	position: absolute;
	}

/* small: 25 (e.g. governance.png) */
.sidenote-small {
	margin: -1.3em 0em 0em -6.3em;
	position: absolute;
	}






/* bibliography notes (School -- Reading) */
.annotation {
	color: DarkGoldenrod;
	padding-right: 0.5rem;
	margin-left: 1.5rem;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* knowledgebase term */
.wasabilike-kbterm {
/* 	font-family: 'MyMonoFont', Fallback, monospace; */
	color: DarkGoldenrod;
	font-weight: bold;
	margin-left: 1rem;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* text highlight */
.wasabilike {
/* 	font-style: italic; */
	color: DarkGoldenrod;
	padding-right: 0.2rem;
	}


/* alt text highlight */
.wasabilike-alt {
	font-weight: bold;
	color: Black;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* alt text highlight gray */
.wasabilike-gray {
	font-weight: bold;
	color: DimGray;
/* 	text-shadow: 1px 1px 5px LightGray; */
	}

/* alt text highlight gray */
.wasabilike-gold {
/* 	font-weight: bold; */
	margin-left: -1rem;
	color: DarkGoldenrod;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* (e.g. function groups in CV) */
.wasabilike-list-category {
	font-family: 'MyMonoFont', Fallback, monospace;
	color: DimGray;
	margin: 0em 0em 0em -2em;
	padding: 0em 0em 0em 0em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* text highlight (legislation) */
.wasabirm {
	color: DarkGoldenrod;
	text-shadow: 1px 1px 5px Gainsboro;
	}

.wasabirm-dark {
	font-weight: bold;
	color: DarkGoldenrod;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* journal list for trustee editorial service */
.journalist {
	color: Black;
	padding-right: 0.5em;
	margin-left: -0.5em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* example header in journals (similar to 'wasabi') */
.kiwi {
	color: DimGray;
	margin: 0em 0em 0em 0em;
	padding-right: 0.3em;
	text-shadow: 1px 1px 5px Gainsboro;
	}

/* like kiwi (in Gold), but right-shifted (used in SPDP and joint courses) */
.kiwi-vitamin {
	color: DarkGoldenrod;
	margin: 0em 0em 0em 0em;
	padding-right: 0.3em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* list entries (gold/ black) */
.entry-black {
	display: inline-block;
	color: Black;
	margin: 0em 0em 0em -2em;
	padding: 0em 0.3em 0em 0em;
	}

.entry-gold {
	display: inline-block;
	color: DarkGoldenrod;
	font-weight: bold;
	margin: 0em 0em 0em -2em;
	padding: 0em 0.3em 0em 0em;
	}



/* for contrastbox -- substituting the 'wasabi' equivalent */
.gold-contrast {
	color: WhiteSmoke;
	padding-right: 0.2rem;
	text-shadow: 1px 1px 5px DimGray;
	}


.gold-contrast-highlight {
	color: Khaki;
	padding-right: 0.2rem;
	text-shadow: 1px 1px 5px DimGray;
	}




/* use to add asterisk to the left */
.gold-ast {
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	font-weight: 400;
	color: Black;
	margin: 0em 0em 0em -2.62em;
	padding: 0em 0.3em 0em 0em;
	}

/* used in Imprint, SF2 presentation block, SPDP, Undertakings, etc */
.golden-flush {
	display: block;
	text-indent: 0em;
	padding: 0em -6em 0em 0em;
	margin: 0em 0.5em 0em -1.5em;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* used in tips and testimonials */
.flushright {
	margin: 0em 0em 0em 0em;
	padding: 0em 0em 1em 0em;
	float: right;
	text-align: right;
	}



/* used in the 'filetype' table and the 'foretaste' table */
.flushright-ftt {
	margin: 0em 0em 0em 0em;
	padding: 0em 0em 0em 0em;
	float: right;
	text-align: right;
	}

/* used in the filetype table */
.flushleft-ftt {
	margin: 0em 0em 0em 0em;
	padding: 0em 0em 0em 0em;
	float: left;
	text-align: left;
	}



.flushright-stack-c {
	margin: 0em 1em 0.6em 0em;
	padding: 0em 0em 0em 0em;
	float: right;
	text-align: right;
	}

.edition {
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	font-family: 'MyMonoFont', Fallback, monospace;
	color: Black;
	margin: 0em 0.2em 0em -2em;
	padding: 0em 0.3em 0em 0em;
	}


.publisher {
	color: Gray;
	margin: 0em 0em 0em 0em;
	float: right;
	text-align: right;
	}


/* span for the knowledgebase dtable-s */
.publication {
	color: DimGray;
	}


.journal {
	color: Black;
	margin: 0em 0em 0em 0em;
	padding-right: 0.5em;
	}

.blackitem {
	color: DimGray;
	margin: 0em 0em 0em 0em;
	padding-right: 0.1em;
	text-shadow: 1px 1px 5px Gainsboro;
	}



.journalext {
	color: DimGray;
	margin: 0em 0em 0em 0em;
	}


/* inline highlighter for journal names -- small caps for XV Games */
.journalsc {
	font-variant: small-caps;
	color: Black;
	margin: 0em 0em 0em 0em;
	padding-right: 0.5em;
	}


/* inline highlighter for journal author-year */
.authyear {
	color: Black;
	padding-left: 0.3em;
	padding-right: 0.5em;
	}

/* special for workshops */
.sessiontitle {
	color: Black;
	padding-left: 0em;
	padding-right: 0em;
	}

/* special for workshops */
.sessionplace {
	color: DimGray;
	padding-left: 0.3em;
	padding-right: 0em;
	}


.ISBN {
	color: Black;
	font-family: 'MyMonoFont', Fallback, monospace;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* inline highlighter for article issue date */
.issuedate {
	font-family: 'MyMonoFont', Fallback, monospace;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 0.5em 0.5em;
	color: DimGray;
	float: right;
	text-align: right;
	text-shadow: 1px 1px 5px Gainsboro;
	}
	

/* inline highlighter for project dates (trustee) */
.projectdate {
	display: block;
	font-family: 'MyMonoFont', Fallback, monospace;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0.1em 0.5em 0.5em 1em;
	color: DimGray;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* inline highlighter for audience */
.audience {
	font-family: 'MyMonoFont', Fallback, monospace;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DarkGoldenrod;
	margin: 0.3em 2.2em 0em 0em;
	float: right;
	text-align: right;
	text-shadow: 1px 1px 5px Gainsboro;
	}


/* inline highlighter for conference sponsor */
.sponsor {
	float: right;
	vertical-align: bottom;
	margin: 0em 0em 0em 0em;
	padding: 0em 0em 0em 2em;
	}

/* same as sponsor, but for the Outreach Seminar list (Lab) */
.mission {
	float: right;
	vertical-align: middle;
	margin: -0.2em 0em 0em 0em;
	padding: 0em 0em 0em 2em;
	}

/* same as mission (Outreach Seminars), but on the left-hand side */
.flag {
	float: left;
	vertical-align: middle;
	margin: 0em 0em 0em 0em;
	padding: 0em 1em 0em 0em;
	}


/* used in frameboxes; similar to quotefeed (shorter line height) (sans-serif and different margin and padding) */
p.tablelist-preface {
	display: block;
	font-family: 'MySerifFont', Fallback, serif;
	color: DimGray;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0.5em 2em 0.5em 2em;
	padding: 0em 3em 0em 1em;
	text-align: justify;
	}

/* sans-serif */
p.tablelist-preface-sans {
	margin: 0em 2em 0em 2em;
	padding: 0em 3em 0em 1em;
	text-align: justify;
	}



/* the old AquaFina script font */
.scriptic {
	font-family: 'MySerifFont', Fallback, serif;
	color: Gray;
	font-size: 1.2rem;
	line-height: 1.8;
	margin: 0em 0em 0em 0em;
	padding: 0em 0em 0em 0em;
	}


/* testimonials and simulated quote */
.serific {
	font-family: 'MySerifFont', Fallback, serif;
	color: DimGray;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 0em 0em;
	padding: 0em 0em 0em 0em;
/* 	text-align: justify; */
	}


/* e.g. imprint text */
.serific-normalsize {
	display: block;
	font-family: 'MySerifFont', Fallback, serif;
	color: DimGray;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 1.5em 0em;
	padding: 0em 0em 0em 0em;
	text-align: justify;
	}

/* e.g. imprint title */
.serific-title {
	font-family: 'MySerifFont', Fallback, serif;
	font-feature-settings: "liga" 0;
	margin: 0em auto 0em auto;
	padding: 0em 3em 1.2em 3em;
	color: DimGray;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 0.4em;
	font-size: 1.1rem;
	line-height: 1.5;
	text-align: center;
	text-shadow: 1px 1px 5px Gainsboro;
	}

.spaceout {
	font-family: 'MySerifFont', Fallback, serif;
	font-feature-settings: "liga" 0;
	color: DimGray;
	text-transform: uppercase;
	letter-spacing: 0.3em;
	font-size: 0.85rem;
	line-height: 1.5;
	text-align: center;
	padding: 0.1em 1em 0.1em 1em;
	background: var(--SPbeige);
	border-radius: 6px;
	-webkit-border-radius: 6px;
	}

.spaceout-std {
	background: var(--SPmica);
	}



/* for teaching classes */
p.inner-style {
	margin: 0em 1em 0em 1em;
	padding: 0em auto 0em auto;
	text-align: left;
	color: DimGray;
	}



/* =========================================== */
/* !NODE-CAPTION */

.caption {
	font-family: 'MyLightFont', Fallback, sans-serif;
	margin: -1em 0em 0em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-weight: normal;
	font-size: 0.85rem;
	color: DimGray;
	}

/* for the 'sections' on the home page */
.upper-caption {
	font-family: 'MyLightFont', Fallback, sans-serif;
	font-variant: small-caps;
	font-size: 0.85rem;
	font-weight: normal;
/* 	font-style: oblique; */
	text-align: center; 
	letter-spacing: 0.5em;
	font-feature-settings: "liga" 0;
	color: DimGray;
	margin: 0em 0em -0.5em 0em;
	padding: 0px 0px 0em 0px;
	}

.photo-credits {
	font-family: 'MyLightFont', Fallback, sans-serif;
	margin: 0.5em 0em 0em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-weight: normal;
	font-size: 0.85rem;
	color: DimGray;
	}




/* =========================================== */
/* !BLOCK-CAPTION */

.caption-group {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: 0em 0.2em 0em 0em;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

/* for use with diagrams (below) */
/* margin 6em after */
.block-caption-b4panel {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: 1em 0em 6em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

/* margin 5em after */
.block-caption-b4section {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: 1em 0em 5em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

/* margin 5em after -- contrastbox version */
.block-caption-b4section-contrast {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: 1em 0em 5em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

/* margin 4em after */
.block-caption-about {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: 1em 0em 4em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

/* 0em after */
.block-caption-opening {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: 1em 0em 1em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}


/* also for link panels */
.block-caption-tips {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: -1em 0em 6em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

.block-caption-events {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: -1em 0em 4em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

.block-caption-people {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: -1em 0em 5em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

.block-caption-compendia {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: -1em 0em 5em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

.block-caption-case-studies {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: -1em 0em 3em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

.block-caption-counter-examples {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: -1.2em 0em 3em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

.block-caption-deployment-suites {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: 0em 0em 4em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

.block-caption-deployment-routines {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: 0em 0em 6em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

.block-caption-reference-styles {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: -1em 0em 5em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

/* for conventional researchpanels */
.block-caption-tips-conventional {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: -1em 0em 4em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

.block-caption-prospects {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: -1em 0em 3em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

.block-caption-highlights {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: -1em 0em 4em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
	text-shadow: 1px 1px 5px Gainsboro;
	}

.block-caption-recommendations {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: -1.5em 0em 2.5em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}

/* Studio:Alternatives -- right-hand image caption */
.caption-like {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	margin: -1em 0em 0em 0em;
	padding: 0px 0px 0em 0px;
	text-align: center;
	font-size: 0.85rem;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px Gainsboro; */
	}



/* =========================================== */
/* !TABLES */

/* the common layout table */
table.dtable {
	width:80%;
	text-align: left;
	margin: 0em 2em 0em 6em;
	padding: 0em 0em 1em 0em;
	border-spacing: 0px 0px;
	}




/* special version (-s) of the common layout table; use in panels */
table.dtable-s {
	width:100%;
	text-align: left;
	margin: 0em 2em 0em 1em;
	padding: 0em 0em 0em 0em;
	border-spacing: 0px 0px;
	}


/* the 'standard' (centered) left column of tables */
table td.lcol {
	text-align: center;
	width: 140px;
	margin: auto auto auto auto;
	padding: 5px 15px 0px 0px;
	vertical-align: text-top;	
	}

/* narrow version of lcol */
table td.lcol-n {
	text-align: center;
	width: 90px;
	margin: auto auto auto auto;
	padding: 5px 0px 0px 0px;
	}

/* 'v-center' variation left column of tables */
table td.lcol-vc {
	text-align: center;
	width: 120px;
	margin: auto auto auto auto;
	padding: 5px 0px 0px 20px;
	}

/* 'top' (slightly lowered) variation left column of tables */
table td.lcol-top {
	text-align: center;
	width: 120px;
	margin: auto auto auto auto;
	padding: 20px 0px 0px 20px;
	vertical-align: text-top;
	}

/* left- (and mid-) aligned left column of tables */
table td.lcol-l {
	text-align: left;
	width: 120px;
	margin: auto auto auto auto;
	padding: 0.5em 0em 0em 1.6em;
	}



/* navigation table */
/*
table.ntable { 
	margin: 2em auto 2em auto;
	padding: 0px 10px 0px 10px;
	text-align: center;
	}

table.ntable td {
	padding: 0px 10px 0px 10px;
	}

table.ntable td.topnav {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-weight: 800;
	margin: 0px 0em 0em 0em;
	padding: 0px 10px 0px 10px;
	color: DimGray;
	font-size: 1.05rem;
	text-shadow: 1px 1px 5px DarkGray;
	}

table.ntable td.lownav {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-weight: 300;
	margin: 0px 0px 0px 0px;
	padding: 0px 5px 5px 5px;
	text-align: center;
	font-style: italic;
	font-size: 0.6em;
	color: DimGray;
	text-shadow: 1px 1px 5px DarkGray;
	}
*/




/* 	the 'multimedia' hosting table --- hosting CSS buttons */
table.mtable {
	margin: 0.5em auto 0em auto;
	padding: 0px 0px 0px 0px;
	text-align: center;
	}

table.mtable td {
	padding: 1em 0px 1em 0px;
	}



/* 	mtable narrow */
table.mtablenarrow { 
	text-align: center;
	margin: 0em auto 0em auto;
	padding: 10px 30px 10px 30px;
	}

table.mtablenarrow td {
	padding: 10px 4px 10px 4px;
	}



/* footer table for social media */
table.socialtable {
	margin: 6em auto 0px auto;
	padding: 0px 0px 0px 0px;
	text-align: center;
	}

table.socialtable td {
	padding: 0px 0px 0px 0px;
	vertical-align: bottom;
	}



/* display (e.g. journals) */
table.stable { 
	margin: 0em auto 0em auto;
	padding: 0.5em 0em 0.5em 0em;
	text-align: center;
	}

table.stable td {
	padding: 10px 12px 10px 12px;
	}



/* stable-wide (e.g. ebooks, software) */
table.stable-w { 
	margin: 0em auto 0em auto;
	padding: 0.5em 0em 0.5em 0em;
	text-align: center;
	}

table.stable-w td {
	padding: 10px 30px 10px 30px;
	}


/* stable-intermediate (e.g. workshops) */
table.stable-i { 
	margin: 0em auto 0em auto;
	padding: 0.5em 0em 0.5em 0em;
	text-align: center;
	}

table.stable-i td {
	padding: 10px 20px 10px 20px;
	}


/* stable-narrow (e.g. pro utility procedures) */
table.stable-n { 
	margin: 0em auto 0em auto;
	padding: 0.5em 0em 0.5em 0em;
	text-align: center;
	}

table.stable-n td {
	padding: 10px 6px 10px 6px;
	}



/* stable-flat (e.g. seminar events) --- button entries */
table.stable-f { 
	margin: 0em auto 0em auto;
	padding: 0.5em 0em 0.5em 0em;
	text-align: center;
	}

table.stable-f td {
	padding: 10px 0px 10px 0px;
	}



/* stable-collections (e.g. collections) */
table.stable-c { 
	margin: 0em auto 0em auto;
	padding: 0.5em 0em 0.5em 0em;
	text-align: center;
	}

table.stable-c td {
/* 	padding: 10px 10px 10px 10px; */
	padding: 10px 8px 10px 8px;
	}


/* stable-collections-xtension */
table.stable-cx { 
	margin: -1em auto 0em auto;
	padding: 0.5em 0em 0.5em 0em;
	text-align: center;
	}

table.stable-cx td {
	padding: 10px 8px 10px 8px;
	}


/* e.g. for the pyramid at 'Foretaste' (Home) */
table.plainjane { 
	margin: 0em auto 0em auto;
	padding: 1em 0px 1em 0px;
	text-align: center;
	}

table.plainjane td {
	padding: 0px 6px 0px 6px;
	}



/* author display */
table.authtable { 
	margin: 0em auto 0em auto;
	padding: 1em 0px 1em 0px;
	text-align: left;
	}

table.authtable td {
	padding: 2px 12px 2px 12px;
	}


/* 	table for the popup windows */
table.ptable {
	font-family: 'MyMonoFont', Fallback, monospace;
	text-align: center;
	color: SteelBlue;
	margin: 0em auto 2em auto;
	padding: 0.5em 1em 0.5em 1em;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	background: var(--SPflax);
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

table.ptable td {
	padding: 6px 6px 6px 6px;
	text-align: center;
	}



/* classic (book register) color --- my ebooks */
td.formatted-c {
	background: rgba(191,182,138,0.3);
	padding: 12px 12px 12px 12px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

/* volume divisions (m-color) */
td.formatted-m {
	background: var(--SPflax);
	padding: 12px 12px 12px 12px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	border: 5px solid GhostWhite;
/* 	border: 1px solid rgba(191,182,138,0.2); */
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}


/* testimonials */
td.formatted-testimonial {
	background: var(--SPflax);
	padding: 1em;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	border: 1px solid rgba(203,197,154,0.3);
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

/* manifestos */
td.formatted-tips {
	background: var(--SPflax);
	padding: 1em;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	border: 1px solid rgba(203,197,154,0.3);
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}


/* =========================================== */
/* !CONTAINER PANELS */

/* the classic gray -- global interest */
.researchpanel {
	background: var(--SPgrey);
	margin: 1em 6em 2em 6em;
	padding: 1.5em 0em 1.5em 0em;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}



/* clear panel for 'book-extras' (e.g. B1-B3 & thesis) */
.researchpanel-book-extras {
	margin: -2.5em 6em 0.8em 6em;
	padding: 1em 0em 1em 0em;
	list-style-type: none;
	}

/* clear panel for 'plain-extras' (e.g. lists below panels) */
.researchpanel-plain-extras {
	margin: -1.2em 6em 0.8em 6em;
	padding: 1em 0em 1em 0em;
	list-style-type: none;
	}


/* special blue (same as articles-s) -- special interest */
.researchpanel-s {
	background: var(--SPblue);
	margin: 1em 6em 2em 6em;
	padding: 1.2em 0em 1.2em 0em;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}


/* silver with narrow border (trustee only) */
.researchpanel-t {
	background: var(--SPsilver);
	margin: 1em 6em 2em 6em;
	padding: 1.2em 0em 1.2em 0em;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
/* 	narrow border */
	border: 2px solid var(--SPice);
	}


/* classic beige (same as labarticles) -- special interest */
.researchpanel-c {
	background: var(--SPmanilla);
	margin: 1em 6em 2em 6em;
	padding: 1.2em 0em 1.2em 0em;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}


/* flax -- for footer (no box-shadow) */
.researchpanel-f {
	background: var(--SPflax);
	margin: 3em 6em 3em 6em;
	padding: 0em 0em 0em 0em;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	}

/* meta -- for publication meta-information */
.researchpanel-m {
	background: var(--SPflax);
	margin: 1em 6em 2em 6em;
	padding: 1.2em 0em 1.2em 0em;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

.bg-silver {
	background: var(--SPsilver);
	}

.bg-flax {
	background: var(--SPflax);
	}


/* same as researchpanel-s but with less space below, to fit the block-caption */
.researchpanel-opening {
	background: var(--SPsilver);
	margin: 3em 6em 0em 6em;
	padding: 2em 0em 1.5em 0em;
	list-style-type: none;
	border: 5px solid GhostWhite;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}


/* like figframe but with a light beige background */
.researchpanel-about {
	background: var(--SPbeige);
	margin: 1em 6em 1em 6em;
	padding: 2em 0em 2em 0em;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	border: 5px solid GhostWhite;
	-webkit-box-shadow:0 1px 10px LightGray;
	-moz-box-shadow:0 1px 10px LightGray;
	box-shadow:0 1px 10px LightGray;
	}


/* inset shadow */
/* used for SPDP and joint courses */
.researchpanel-courses {
	margin: 0em 0em 1em -3em;
	padding: 1.2em 2em 1.2em 2em;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	border: 1px solid WhiteSmoke;
	-webkit-box-shadow: inset 0 1px 10px LightGray;
	-moz-box-shadow: inset 0 1px 10px LightGray;
	box-shadow: inset 0 1px 10px LightGray;
	}



/* inset shadow */
/* used for classes (e.g. Zoom option) */
.researchpanel-classes {
	margin: 1em 0em 1em 0em;
	padding: 1.2em 1em 1.2em 1em;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	border: 1px solid WhiteSmoke;
	-webkit-box-shadow: inset 0 1px 10px LightGray;
	-moz-box-shadow: inset 0 1px 10px LightGray;
	box-shadow: inset 0 1px 10px LightGray;
	}



/* like figframe but with a background */
.researchpanel-deployment {
	background: var(--SPsilver);
	margin: 1em 6em 1em 6em;
	padding: 1em 0em 1em 0em;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	border: 5px solid GhostWhite;
	-webkit-box-shadow:0 1px 5px LightGray;
	-moz-box-shadow:0 1px 5px LightGray;
	box-shadow:0 1px 5px LightGray;
	}



/* clear */
/* figframe -- for transparent figs */
.researchpanel-figframe {
	margin: 0em 6em 0em 6em;
	padding: 2em 0em 1.5em 0em;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	border: 5px solid GhostWhite;
	-webkit-box-shadow:0 1px 10px LightGray;
	-moz-box-shadow:0 1px 10px LightGray;
	box-shadow:0 1px 10px LightGray;
	}


/* frame for page notes: advice, warning, etc. */
.researchpanel-noteframe {
	background: var(--SPbeige); 
	border: 5px solid GhostWhite;
	margin: 0em 6em 0em 6em;
	padding: 2em 0em 2em 0em;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}


/* frame for contrast boxes: antipodes, opposes, resolves etc. */
.researchpanel-contrastbox {
	background: var(--SPslate); 
	border: 5px solid GhostWhite;
	margin: 0em 6em 0em 6em;
	padding: 2em 0em 2em 0em;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}



/* frame for quality standards: editorial, teaching, XXX etc. */
.researchpanel-quality {
	background: var(--SPgrey);
	border: 5px solid GhostWhite;
	margin: 0em 6em 0em 6em;
	padding: 2em 0em 2em 0em;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}


/* inset shadow */
/* sigframe -- for SIG */
.researchpanel-sigframe {
	margin: 0em 6em 4em 6em;
	padding: 2em 0em 2em 0em;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: inset 0 1px 10px LightGray;
	-moz-box-shadow: inset 0 1px 10px LightGray;
	box-shadow: inset 0 1px 10px LightGray;
	}


/* inset shadow */
/* workshop or club sessions (editions) */
.researchpanel-sessionframe {
	margin: 0em 6em 3em 6em;
	padding: 2.4em 0em 1em 0em;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: inset 0 1px 10px LightGray;
	-moz-box-shadow: inset 0 1px 10px LightGray;
	box-shadow: inset 0 1px 10px LightGray;
	}


/* sigframe -- for plain lists ("m"-background) with badges */
.researchpanel-listframe {
	background: var(--SPflax);
	border: 5px solid GhostWhite;
	margin: 0em 6em 2em 6em;
	padding: 2.4em 0em 1em 0em;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}


.researchpanel-creative-commons {
	text-align: center;
	margin: -1em auto 0em auto;
	font-size: 0.85rem;
	}



/* =========================================== */
/* !LISTS */

ul {
/* 	general u-list, including 'nav' */
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-weight: 300;
	font-size: 1.05rem;
	line-height: 1.5;
	color: Gray;
	margin: 1em 6em 4em 6em;
	padding: 1em 2em 1em 0em;
	}


/* unordered list in a plain style */
ul.plain {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	color: Black;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 0em 4em;
	padding: 0.2em 2em 0.2em 0em;
	}

ul.plain li {
	padding: 0em 0em 0em 0em;
	margin: 0em 0em 0em 1em;
	}


/* similar to the plain list, but in serif */
ul.plain-quote {
	font-family: 'MySerifFont', Fallback, serif;
	color: DimGray;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: -0.5em 0em 0em 4em;
	padding: 0em 2em 0.4em 0em;
	}

ul.plain-quote li {
	margin: 0.2em 0em 0.2em 1em;
	padding: 0em 0em 0em 0em;
	}


/* special list for the HGG boxes */
ul.hgg-plain-quote {
	font-family: 'MySerifFont', Fallback, serif;
	color: DimGray;
	font-size: 1.05rem;
	line-height: 1.5em;
	margin: 0.5em 0em 0em 0.5em;
	padding: 0em 2em 0em 0em;
	}

ul.hgg-plain-quote li {
	margin: 0.2em 0em 0.2em 1em;
	padding: 0em 0em 0em 0em;
	}


/* unordered list for quotes */
ul.quote {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	color: DimGray;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 0em 4em;
	padding: 0.2em 2em 0.2em 0em;
	}

/* similar to 'ul.prospects li' */
ul.quote li {
	padding: 0em 0em 0.7em 0em; /* line sep */
	margin: 0em 0em 0em 1em;
	}


/* special for prospects */
ul.prospects {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	color: Black;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 0em 4em;
	padding: 0.2em 2em 0.2em 0em;
	}

/* similar to 'ul.quote li' */
ul.prospects li {
	padding: 0.2em 0em 0.2em 0em;
	margin: 0em 0em 0em 1em;
	}



/* contrastbox */
ul.plain-contrast {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	color: WhiteSmoke;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0.2em 0em 0em 3.7em;
	padding: 0.2em 2em 0.2em 0em;
	}

ul.plain-contrast li {
	padding: 0em 0em 0em 0em;
	margin: 0em 0em 0em 1em;
	}





ul.frontpage {
/* 	front page u-list, center, no bullets */
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: Gray;
	list-style-type: none;
	margin: 0px auto 0px auto;
	padding: 1em 2em 1em 0em;
	}


/* compilation lists -- global interest */
ul.articles {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
/* 	background: Gainsboro; */
	background: var(--SPgrey);
	margin: 1em 6em 2em 6em;
	padding: 1.5em 2em 2em 0em;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

ul.articles li {
	padding: 0.5em 0em 0.5em 0em;
	margin: 0em 1em 0em 3em;
	}

ul.articles li.separator {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
	text-shadow: 1px 1px 5px DarkGray;
	padding: 0.5em 0em 0.5em 0em;
	margin: 1em 3em -0em 6em;
	text-indent: -4em;
	}


/* 'ul-articles' condensed */
ul.articles-cond {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
/* 	background: Gainsboro; */
	background: var(--SPgrey);
	margin: 1em 6em 2em 6em;
	padding: 1.5em 2em 2em 0em;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

ul.articles-cond li {
	padding: 0em 0em 0em 0em;
	margin: 0em 1em 0em 3em;
	}



/* special trustee blue (same blue as 'researchpanel-s') */
ul.articles-s {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
/* 	background: rgba(89,150,191,0.2); */
	background: var(--SPblue);
	margin: 1em 6em 2em 6em;
	padding: 1.5em 2em 2em 0em;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

ul.articles-s li {
	padding: 0.5em 0em 0.5em 0em;
	margin: 0em 1em 0em 3em;
	}

ul.articles-s li.separator {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
	text-shadow: 1px 1px 5px DarkGray;
	padding: 0.5em 0em 0.5em 0em;
	margin: 1em 3em -0em 6em;
	text-indent: -4em;
	}


/* special "m" background */
ul.articles-m {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
	background: var(--SPflax); 
	margin: 1em 6em 2em 6em;
	padding: 1.5em 2em 2em 0em;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

ul.articles-m li {
	padding: 0.5em 0em 0.5em 0em;
	margin: 0em 1em 0em 3em;
	}

ul.articles-m li.separator {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
	text-shadow: 1px 1px 5px DarkGray;
	padding: 0.5em 0em 0.5em 0em;
	margin: 1em 3em -0em 6em;
	text-indent: -4em;
	}



/* special "c" background */
ul.articles-c {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
	background: rgba(191,182,138,0.3); /* "c" */
	margin: 1em 6em 2em 6em;
	padding: 1.5em 2em 2em 0em;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

ul.articles-c li {
	padding: 0.5em 0em 0.5em 0em;
	margin: 0em 1em 0em 3em;
	}

ul.articles-c li.separator {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
	text-shadow: 1px 1px 5px DarkGray;
	padding: 0.5em 0em 0.5em 0em;
	margin: 1em 3em -0em 6em;
	text-indent: -4em;
	}



/* register lists -- same beige as researchpanel-c */
ul.labarticles {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
/* 	background: rgba(191,182,138,0.3); */
	background: var(--SPmanilla);
	margin: 1em 6em 2em 6em;
	padding: 1.5em 2em 2em 0em;
	list-style-type: none;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

ul.labarticles li {
	padding: 0.5em 0em 0.5em 0em;
	margin: 0em 1em 0em 3em;
	}

ul.labarticles li.separator {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
	text-shadow: 1px 1px 5px DarkGray;
	padding: 0.5em 0em 0.5em 0em;
	margin: 1em 3em -0em 6em;
	text-indent: -4em;
	}


/* ordered lists */
ol.articles {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
	background: var(--SPgrey);
	margin: 1em 6em 2em 6em;
	padding: 1.5em 2em 2em 0em;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

ol.articles li {
	padding: 0.5em 0em 0.5em 0em;
	margin: 0em 1em 0em 4em;
	}

.date-separator {
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	font-family: 'MyMonoFont', Fallback, monospace;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DarkGoldenrod;
/* 	text-shadow: 1px 1px 5px DarkGray; */
	margin: 0em 0em 0em 4em;
	padding: 0em 0em 0em 0em;
/* 	text-indent: -2em; */
	}


/* same as ol-articles but in classic beige */
ol.articles-c {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
/* 	background: rgba(191,182,138,0.3); */
	background: var(--SPmanilla);
	margin: 1em 6em 2em 6em;
	padding: 1.5em 2em 2em 0em;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
	}

ol.articles-c li {
	padding: 0.5em 0em 0.5em 0em;
	margin: 0em 1em 0em 4em;
	}

ol.articles-c li.separator {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
	text-shadow: 1px 1px 5px DarkGray;
	padding: 0.5em 0em 0.5em 0em;
	margin: 1em 3em -0em 6em;
	text-indent: -4em;
	}


/* same as ol-articles but in silver -- previously blue (for trustee's page) */
ol.articles-t {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
/* 	background: rgba(89,150,191,0.2); */
	background: var(--SPsilver);
	margin: 1em 6em 2em 6em;
	padding: 1.5em 2em 2em 0em;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
/* 	narrow border */
	border: 2px solid var(--SPice);
	}

ol.articles-t li {
	width: 85%;
	margin: 0em 1em 0em 4em;
	padding: 0.5em 0em 0.5em 0em;
	}


/* same as articles-t (for trustee's page) but spaced out vertically */
ol.articles-tsv {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
/* 	background: rgba(89,150,191,0.2); */
	background: var(--SPsilver);
	margin: 1em 6em 2em 6em;
	padding: 1em 2em 3em 0em; /* +2em below to allow for figures on the side */
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 1px 1px 5px LightGray;
	-moz-box-shadow: 1px 1px 5px LightGray;
	box-shadow: 1px 1px 5px LightGray;
/* 	narrow border */
	border: 2px solid var(--SPice);
	}

ol.articles-tsv li {
	margin: 1em 1em 0em 4em;
	padding: 0.5em 0em 0.5em 0em;
	}


/* ordered list in a plain style */
ol.plain {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 0em 4em;
	padding: 0.2em 2em 0.2em 0em;
	}

ol.plain li {
	padding: 0.1em 0em 0.1em 0em;
	margin: 0em 0em 0em 1em;
	}


/* ordered list in lower-roman */
ol.roman {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	list-style-type: lower-roman;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 0em 2em;
	padding: 0.2em 2em 0.2em 0em;
	}

ol.roman li {
	padding: 0.2em 0em 0.2em 0em;
	margin: 0em 0em 0em 1em;
	}


/* ordered list in lower-alpha, small indent */
ol.alpha {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	list-style-type: lower-alpha;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 0em 1em;
	padding: 0.1em 2em 0.1em 0em;
	}

ol.alpha li {
	margin: 0em 0em 0em 1em;
	padding: 0.1em 0em 0.1em 0em;
	}


ol.projectlist {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
	margin: 0em 0em 0em -1em;
	padding: 0em 0em 0em 0em;
	}

ol.projectlist li {
	padding: 0.1em 0em 0.1em 0em;
	margin: 0em 0em 0em 0em;
	}




/* description lists */
dl {
	display: block;
	width: 60%;
	font-family: 'MyBodyFont', Fallback, sans-serif;
	color: Black;
	font-size: 1.05rem;
	line-height: 1.5;
	font-stretch: normal;
	font-style: normal;
	font-variant: normal;
	letter-spacing: 0;
	margin: 1em 0em 1em 6em;
	padding: 0em 0em 0em 0em;
	}

/* special case, for HGG lists: push left and up; full width */
.hgg-reset {
	width: 100%;
	margin-left: 3.5em;
	margin-top: 0em;
	margin-bottom: 0.5em;
	}

/* special case, extending to 'full width' */
dl.full {
	width: 80%;
	}

/* special case for presentation blocks at <h2> (e.g. workshops, clubs) */
dl.pres {
	width: 100%;
	margin: 1em -1em 1em 1.5em;
	padding: 0em 0em 0em 0em;
	}

/* special case for 'plain-extras' and 'example' panels */
dl.plain-x {
	width: 100%;
	margin: 1em 0em 1em 4em;
	padding: 0em 0em 0em 0em;
	}

/* special case for page header, compensated for <dl> and <dd> */
dl.header {
	width: 100%;
	margin: 1em 0em 1em 8.5em;	
}


dt {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	font-size: 1.05rem;
	line-height: 1.5;
	color: DimGray;
	font-weight: bold;
/* 	text-transform: uppercase; */
	margin: 0px 0px 0px -3em;
	padding: 0em 0em 0em 0em;
	}

dt.sc {
/* list headers in small caps */
	font-variant: small-caps;
	}

dt.bt {
/* leave some space below (used after buttons -- e.g. Lab>Outreach) */
	margin: 0em 0em 0.5em -4.5em;
	}

dt.workshop {
/* special for workshop reading lists: more indented than normal */
	color: DarkGoldenrod;
	margin: -1.5em 0em 0.3em -3em;
	}

dt.faq {
/* special for faq lists: more indented than normal; more spaced than workshop */
	color: DarkGoldenrod;
	margin: -1em 0em 0.3em -3em;
	}

dd {
/* gray list elements (definition descriptions) */
	display: inline-block;
	color: DimGray;
	margin: 0em 0em 0.5em 0em;
	padding: 0em 2em 0em 0em;
	}

.hgg-dd {
	text-align: left;
	margin-top: 0.1em;
	}



/* =========================================== */
/* general settings -- e.g. spacing, shadows */

pre {
	display: inline
	}

.left {
	text-align: left;
	}

.top {
	vertical-align: top;
	}

.bottom {
	vertical-align: bottom;
	}

.middle {
	vertical-align: middle;
	}

.middle-logo {
	vertical-align: middle;
	margin: 0em 0em 0em -1.5em;
	}

.centering {
	text-align: center;
	margin: 1em auto 0px auto;
	}

/* use with 'hgg-block' */
.fig-centering {
	text-align: center;
	margin: 1em auto 2em auto;
	}



/* hspace adaptors for right-side boxes (e.g. bookmarks) */
.bookmark-adaptor {
	display: inline-block;
	width: 110px;
	text-align: center;
	padding: 0em auto 0em auto;
	margin: 0em auto 0em auto;
	}


/* hspace adaptors for normal/ small decals (e.g. publisher logos) */
.decal-adaptor {
	display: inline-block;
	width: 80px;
	text-align: center;
	padding: 0em auto 0em auto;
	margin: 0em auto 0em auto;
	}

/* hspace adaptors for large decals (e.g. euro next to quality disk) */
.large-decal-adaptor {
	display: inline-block;
	width: 90px;
	text-align: center;
	padding: 0em auto 0em auto;
	margin: 0em auto 0em auto;
	}


/* hspace adaptors for left-side (120px) boxes */
.leftmark-adaptor {
	display: inline-block;
	width: 120px;
	text-align: center;
	padding: 0em auto 0em auto;
	margin: 0em auto 0em auto;
	}


/* vspace adaptor (e.g. editorial references) */
/* artificial flush-left, compensating for the drop shadow effect */
.vspace-adaptor-medium {
	display: inline-block;
	height: 70px;
	vertical-align: middle;
	margin: 0em 0em 0em -0.3em;
	padding: 0em 0em 0em 0em;
	}

/* to accompany 'boxh' in slightly sectioned lists (e.g. trustee speciality) */
.line-compression {
	margin: -0.5em 0em -0.5em 0em;
	padding: 0em 0em 0em 0em;
	}


/* for youtube embedding */
.round-embed{
	border:0px solid LightGray;
	-webkit-border-radius: 8px !important;
	-ms-border-radius: 8px !important;
	-o-border-radius: 8px !important;
	border-radius: 8px !important;
	}

.hspace {
	margin: 0px 0.5em 0px 0px;
	}


/* a 'highligher' effect */
.highlightyellow {
/* 	background-color: PaleGoldenrod; */
	text-shadow: 2px 2px 16px Yellow,
				-2px -2px 16px Yellow;
	}


/* same color as "annotation" and "golden" but without any other formatting */
.highlightgold {
	color: DarkGoldenrod;
	}

/* same "highlightgold" but more intense and with a right margin */
.highlightgoldbold {
	color: DarkGoldenrod;
	font-weight: bold;
	margin: 0px 0.3em 0px 0px;
	}

/* same "highlightgoldbold" but without the extra space after */
.highlightgoldbold-zero {
	color: DarkGoldenrod;
	font-weight: bold;
	margin: 0px 0em 0px 0px;
	}

.highlightgraybold {
	color: DimGray;
	font-weight: bold;
	margin: 0px 0.3em 0px 0px;
	}

.highlightblack {
	color: Black;
	}


.highlightblack-bold {
	color: Black;
	font-weight: bold;
	}

.strongtype {
	font-weight: bold;
	}


/* for activism flags (slightly reduced) */
.teletype {
	font-family: 'MyMonoFont', Fallback, monospace;
	font-size: 1.05rem;
	}



/* =========================================== */
/* !MARKS */

/* index of juxtapositions */
.printmark-ext {
	float: right;
	margin: -1em -1em 0em 0em;
	padding: 0em 0em 0em 2em;
	}


/* book image (studio: academic R&D) */
.bookmark {
	float: right;
	vertical-align: bottom;
	margin: 0em 0em 0em 0em;
	padding: 0em 0em 0em 2em;
	}


/* special for the 'reinforcement' block (lab) */
.bookmark-reinf {
	float: right;
	vertical-align: bottom;
	margin: 0em 2.5em 0em 0em;
	padding: 0em 0em 0em 2em;
	}


/* personal note at Trustee, etc. */
.bookmark-cv {
	float: right;
	vertical-align: bottom;
	margin: -1em -1em 0em 0em;
	padding: 0em 0em 0em 0em;
	}

/* front-page version, a bit lifted */
.bookmark-fp {
	float: right;
	text-align: center;
	vertical-align: bottom;
	margin: -0.5em 0em 0em 0em;
	padding: 0em 0em 0em 2em;
	}

/* adapted for letters in superscript mode */
.bookmark-fp-super {
	display: inline-block;
	float: right;
	vertical-align: bottom;
	margin: -1.4em 0em 0em 0em;
	padding: 0em 0em 0em 2em;
	}



/* =========================================== */
/* !FOOTERS*/

.figure-copyright {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	text-align: right;
	color: DimGray;
	font-size: 0.85rem;
	line-height: 1.5;
	margin: 2em 2.5em 0em 0em;
	padding: 0em 0em 0em 0em;
	}

/* mainly for outreach mission panels */
.mission-reference {
	display: block;
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	float: right;
	text-align: right;
	color: DimGray;
	font-size: 0.85rem;
	line-height: 1.5;
	margin: -0.5em 1em 0em 0em;
	padding: 0em 0em 0em 0em;
	}

/* for panels (e.g. base skills, professional activities) */
.display-reference {
	font-family: 'MyLightFont', Fallback, sans-serif;
/* 	font-family: 'MyBodyFont', Fallback, sans-serif; */
	text-align: right;
	color: DimGray;
	font-size: 0.85rem;
	line-height: 1.5;
	margin: 0em 3.5em 1em 0em;
	padding: 0em 0em 0em 0em;
	}



/* =========================================== */
/* !SPACERS*/

.negativhorizontal {
	margin-left: -1em;
	}

.example-prepend {
	margin: 0em 0em -2em 0em;
	}

.negativespacer {
	margin: 0px 0px -1em 0px;
	}

.negativebigspacer {
	margin: 0px 0px -3em 0px;
	}

.negativehugespacer {
	margin: 0px 0px -5em 0px;
	}

.negative-right {
	margin: 0em -1em 0em 0em;
	}

.zerospacer {
	margin: 0px 0px 0px 0px;
	}

.listelementverticalbuffer {
	margin: 3px 0px 3px 0px;	
	}

.listcategoryseparator {
	margin: 12px 0px 2px 0px;
	}

.halfspacer {
	margin: 5px 0px 0px 0px;
	}

.vspacer {
	margin: 10px 0px 0px 0px;
	}

.midspacer {
	margin: 20px 0px 0px 0px;
	}

.bigspacer {
	margin: 40px 0px 0px 0px;
	}

.hugespacer {
	margin: 60px 0px 0px 0px;
	}

.onefivehugespacer {
	margin: 80px 0px 0px 0px;
	}

.bishugespacer {
	margin: 100px 0px 0px 0px;
	}

.bisplushugespacer {
	margin: 140px 0px 0px 0px;
	}

.trihugespacer {
	margin: 220px 0px 0px 0px;
	}

.quadhugespacer {
	margin: 250px 0px 0px 0px;
	}

.quinthugespacer {
	margin: 280px 0px 0px 0px;
	}


.vfloat {
	z-index: 10;
	position: absolute;
	}



/* =========================================== */
/* !SEARCH WINDOW */

.textinput {
	border: 1px solid DarkGray;
	background: GhostWhite;
	font-size: 1rem;
	font-family: 'MyMonoFont', Fallback, monospace;
	color: DimGray;
	padding: 3px 0em 0px 0em;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: inset 1px 1px 10px Gainsboro;
	-moz-box-shadow: inset 1px 1px 10px Gainsboro;
	box-shadow: inset 1px 1px 10px Gainsboro;
	}



/* =========================================== */
/* site navigation */
.navbutton {
	font-family: 'MyHeaderFont', Fallback, sans-serif;
	display: inline-block;
	outline: none;
	cursor: pointer;
	text-align: center;
	color: SteelBlue;
	text-decoration: none;
	font-size: 1.2rem;
	line-height: 1.5;
	margin: 0em 0em 0em 0em;
	padding: 0em 6px 0em 6px;
	text-shadow: 1px 1px 5px Gainsboro;
	}

.navbutton:hover {
	text-decoration: none;
	}

.navbutton:active {
	position: relative;
	}



/* navigation underline */
.navunder {
	display: inline-block;
	border-bottom: solid 3px;
	color: Goldenrod;
	margin: 0em 0em 0em 0em;
	padding: 5px 0em 0em 0em;
	}




/* page navigation */
.button {
	font-family: 'MyHeaderFont', Fallback, sans-serif;
	display: inline-block;
	outline: none;
	cursor: pointer;
	text-align: center;
	color: DimGray;
	text-decoration: none;
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0em 0em 0em 0em;
	padding: 0em 6px 0em 6px;
	text-shadow: 1px 1px 5px Gainsboro;
	}

.button:hover {
	text-decoration: none;
	}

.button:active {
	position: relative;
	}





/* section navigation */
.symbolbutton {
	font-family: 'MyHeaderFont', Fallback, sans-serif;
	font-size: 1rem;
	color: DimGray;
	display: inline-block;
	outline: none;
	cursor: pointer;
	text-align: center;
	vertical-align: top;
	text-decoration: none;
	margin: 0em 0em 0em 2em;
	padding: 0.5em 0.5em 0.5em 0.5em;
	text-shadow: 1px 1px 5px Gainsboro;
	-webkit-border-radius: 0.5em; 
	-moz-border-radius: 0.5em;
	border-radius: 0.5em;
	-webkit-box-shadow: 1px 1px 5px 0px Gray;
	-moz-box-shadow: 1px 1px 5px 0px Gray;
	box-shadow: 1px 1px 5px 0px Gray;
	}

.symbolbutton:hover {
	text-decoration: none;
	}

.symbolbutton:active {
	position: relative;
	top: 1px;
	}




/* ebooks: file symbol button */
.filesymbolbutton {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	color: DimGray;
	width: 100px;
	font-size: 1rem;
	font-weight: bold;
	text-shadow: 1px 1px 5px Gainsboro;
	display: inline-block;
	outline: none;
	cursor: pointer;
	text-align: center;
	vertical-align: top;
	text-decoration: none;
	margin: 0.5em 0em 0em 0em;
	padding: 0.5em 0em 0.5em 0em;
	-webkit-border-radius: 0.5em; 
	-moz-border-radius: 0.5em;
	border-radius: 0.5em;
	-webkit-box-shadow: 1px 1px 5px 0px DarkGray;
	-moz-box-shadow: 1px 1px 5px 0px DarkGray;
	box-shadow: 1px 1px 5px 0px DarkGray;
	}

.filesymbolbutton:hover {
	text-decoration: none;
	}

.filesymbolbutton:active {
	position: relative;
	top: 1px;
	}



/* close button (pop-ups) */
.cbutton {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	background-color: DimGray; 
	border: solid DimGray 6px; 
	color: GhostWhite; 
	font-size: 1.05rem;
	-webkit-border-radius: 0.5em; 
	-moz-border-radius: 0.5em;
	border-radius: 0.5em;
	-webkit-box-shadow: 1px 1px 5px 0px Gray;
	-moz-box-shadow: 1px 1px 5px 0px Gray;
	box-shadow: 1px 1px 5px 0px Gray;
	}




/* =========================================== */
/* myunibar -- classic beige in various alphas */
.myunibar {
	background: rgba(191,182,138,0.6);
	background: -webkit-linear-gradient(rgba(191,182,138,0.5), rgba(191,182,138,0.7));
	background: -moz-linear-gradient(top, rgba(191,182,138,0.5), rgba(191,182,138,0.7));
	}

.myunibar:hover {
	background: rgba(191,182,138,0.6);
	background: -webkit-linear-gradient(rgba(191,182,138,0.5), rgba(191,182,138,0.7));
	background: -moz-linear-gradient(top, rgba(191,182,138,0.5), rgba(191,182,138,0.7));
	}
	
.myunibar:active {
	background: rgba(191,182,138,0.6);
	background: -webkit-linear-gradient(rgba(191,182,138,0.5), rgba(191,182,138,0.7));
	background: -moz-linear-gradient(top, rgba(191,182,138,0.5), rgba(191,182,138,0.7));
	}


/* =========================================== */
/* mysymbol */
.mysymbol {
	color: DimGray;
	background: Whitesmoke;
	background: -webkit-linear-gradient(Whitesmoke, Gainsboro);
	background: -moz-linear-gradient(top, Whitesmoke, Gainsboro);
	}

.mysymbol:hover {
	background: Whitesmoke;
	background: -webkit-linear-gradient(Gainsboro, Whitesmoke);
	background: -moz-linear-gradient(top, Gainsboro, Whitesmoke);
	}
	
.mysymbol:active {
	background: Whitesmoke;
	background: -webkit-linear-gradient(Gainsboro, Whitesmoke);
	background: -moz-linear-gradient(top, Gainsboro, Whitesmoke);
	}




/* =========================================== */
/* Sidebar (up/down arrows) */

/*
.displayitem-sidebar {
	font-family: 'MyBodyFont', Fallback, sans-serif;
	color: DimGray;
	font-size: 1.1rem;
	font-weight: bold;
	text-shadow: 1px 1px 5px Gainsboro;
	}
*/


table.sidebar { 
	position: fixed;
	z-index: 10;
	top: 50%;
	right: -85px;
	list-style-type: none;
	margin: 8px auto 10px auto;
	padding: 0px 0px 0px 0px;
	-webkit-border-radius: 0.5em; 
	-moz-border-radius: 0.5em;
	border-radius: 0.5em;
	-webkit-transform: rotate(-90deg);
	-moz-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	background: rgba(191,182,138,0.5);
	-webkit-box-shadow: 0px 0px 10px LightGray;
	-moz-box-shadow: 0px 0px 10px LightGray;
	box-shadow: 0px 0px 10px LightGray;
	}

table.sidebar td {
	padding: 0.2px 10px 0.2px 10px;
	text-align: center;
	}



/* =========================================== */
/* !SHADOWS */

.filter-drop-shadow-medium {
	/* spaces out the right-side buttons */
	/* also levels the images with the paragraph text */
	margin: 0.2em 0.2em 0.2em 0.2em;
	vertical-align: middle;
	filter: var(--SPdsmedium);
	}

/* margins equivalent to 'medium' */
.filter-drop-shadow-light {
	margin: 0.2em 0.2em 0.2em 0.2em;
	vertical-align: middle;
	filter: var(--SPdslight);
	}

/* image leveller -- e.g. at projects */
.flush-low {
	vertical-align: bottom;
	}



/* margins equivalent to 'medium' */
.book-shadow {
	margin: 0.2em 0.2em 0.2em 0.2em;
	filter: var(--SPdsdark);
	}

.margin-reset {
	margin: 0;
	}



.page-shadow {
	filter: var(--SPdsdark);
	}

.photo-frame {
	margin-bottom: 1em;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	border: 3px solid GhostWhite;
	filter: var(--SPdsdark);
	}

.artwork-frame {
	-webkit-border-radius: 8px;
	border-radius: 8px;
	border: 1px solid Gray;
	}


/* generally lifted (v. map-drop compensation below) */
.map-frame {
	-webkit-border-radius: 4px;
	border-radius: 4px;
	border: 6px solid GhostWhite;
	background-color: WhiteSmoke;
	padding: 7px;
	margin-bottom: 1.5em;
	filter: var(--SPdsshort);
	}

/* vertical compensation (maps) */
.map-drop {
	margin-bottom: -0.3em;
	}



/* =========================================== */
/* !FILTER EFFECTS */

/* for the stats graph on home page */
.sepia-stats {
	filter: grayscale(1) sepia(1) hue-rotate(20deg) opacity(0.8);
	} 

/*
	[HSB: Hue-rotate, Saturate, Brightness] = equivalent to the HSL model;
	Base (Sepia HSL): 38, 17.4, 51.6;
	Target (SteelBlue HSL): 207, 41.8, 49,2;
	Target - Base (filter HSB): 169, 124.4, 97.6;
*/


/* for the trustee UW photo */
.sepia-light {
	filter: saturate(0.8) sepia(0.2) hue-rotate(-10deg) brightness(1.2);
	}

/* for artwork popups */
.sepia-popart {
	filter: grayscale(1) sepia(0.1) hue-rotate(20deg) brightness(0.95) drop-shadow(0px 5px 5px DarkGray);
	/* 	brightness(1) contrast(1) */
	}

.org-filter {
	filter: invert(0);
	}


/* mid-gray effect -- with margins */
.black-logo-filter {
	margin: 0.2em 0.2em 0.2em 0.2em;
	filter: invert(0.5) drop-shadow(1px 1px 3px LightGray);
	}


.backdrop-filter-super-broad {
	filter: invert(0);
	}

/* index page illustration */
.backdrop-filter-stats {
	filter: invert(0);
	}

.backdrop-filter-logo {
	filter: invert(0);
	}



/* =========================================== */
/* MISC */

/* big arrows */
.flip {
	display: inline-block;
	-webkit-transform: scale(-1, 1);
	-moz-transform: scale(-1, 1);
	-ms-transform: scale(-1, 1);
	-o-transform: scale(-1, 1);
	transform: scale(-1, 1);
	}



/* =========================================== */