/* Reset default browser CSS.
   http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video
{
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section
{
	display: block;
}

body
{
	line-height: 1;
}

ol,
ul
{
	list-style: none;
}

blockquote,
q
{
	quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after
{
	content: '';
	content: none;
}

h1,
h2,
h3,
h4,
h5,
h6
{
	clear: both;
	font-weight: normal;
}

del
{
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table
{
	border-collapse: collapse;
	border-spacing: 0;
}

a img
{
	border: none;
}

/* end of style reset */


/* BIT-PLAYER.ORG STYLES */

/* fonts and colors for use sitewide */

:root
{
	--sans-fonts: Arial, Helvetica, sans-serif;
	--avec-fonts: source_serif_pro, serif;
	--mono-fonts: Menlo, "Courier 10 Pitch", Courier, "Courier New", monospace;
	--background-beige: #f6f3ef;
	--banner-gray: #8890a5;
	--blockquote-gray: #f3f3f3;
	--dla-purple: #362652;
	--link-color: #1268be;
	--active-color: #d81f23;
	--visited-color: #9378c0;
}

a:link
{
	color: var(--link-color);
}

a:visited
{
	color: var(--visited-color);
}

a:active,
a:hover
{
	color: var(--active-color);
}


body
{
	overflow-x: hidden;
}

article
{
	overflow-wrap: break-word;
}

div#wrapper
{
	background-color: #fff;
	margin: 0 auto;
}

div#top-matter
{
	position: relative;
	margin-top: 2rem;
	margin-bottom: 1rem;
}

p#byline
{
	font-family: var(--sans-fonts);
	font-size: 1rem;
	margin: 4px 0;
	text-indent: 0;
}

p#pubdate
{
	font-family: var(--sans-fonts);
	font-size: 0.8rem;
	margin: 4px 0;
	text-indent: 0;
}

p#tags-list
{
	font-family: var(--sans-fonts);
	font-size: 1.0rem;
	margin: 8px 0;
	text-indent: 0;
}

div#bottom-matter
{
	margin-bottom: 1em;
}

details#publication-history
{
	display: block;
	font-family: var(--sans-fonts);
	font-size: 1.0rem;
	text-indent: 0;
	margin-top: 6px;
}

details#publication-history p
{
	font-family: var(--sans-fonts);
	font-size: 1.0rem;
	line-height: 23px;
	text-indent: 2.0rem;
}



h1,
h2,
h3,
h4,
h5
{
	color: #000;
	font-family: var(--sans-fonts);
	font-weight: bold;
	line-height: 1.5em;
	margin: 0 0 20px 0;
}

h1
{
	font-size: 1.8em;
	margin-bottom: 0;
}

h2
{
	font-size: 1.5em;
	text-align: center;
	margin-bottom: 10px;
}

h2.beige-bar
{
	text-align: left;
	background-color: var(--background-beige);
}

h3
{
	font-size: 1.5em;
	margin-top: 20px;
	margin-bottom: 0;
}

span.running-subhead 
{
	font-family: var(--sans-fonts);
	font-size: inherit;
	font-weight: bold;
}





/* =Fonts
-------------------------------------------------------------- */
@font-face
{
	font-family: 'source_serif_pro';
	src: url('../fonts/sourceserifpro-regular-webfont.woff2') format('woff2'),
		url('../fonts/sourceserifpro-regular-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face
{
	font-family: 'source_serif_pro';
	src: url('../fonts/sourceserifpro-it-webfont.woff2') format('woff2'),
		url('../fonts/sourceserifpro-it-webfont.woff') format('woff');
	font-weight: normal;
	font-style: italic;
}


body
{
	font-family: var(--avec-fonts);
}

main
{
	font-size: 1.1rem;
	line-height: 26px;
	margin-top: 1.5rem;
}

nav,
title,
aside
{
	font-family: var(--sans-fonts);
}

input[type=submit]
{
	font-family: var(--sans-fonts);
}

pre
{
	display: block;
	margin: 18px;
	font-family: var(--mono-fonts);
}

pre>code
{
	display: block;
	color: #222;
	line-height: 1.6em;
	overflow: auto;
	tab-size: 4;
}



code
{
	font-family: var(--mono-fonts);
	font-size: 0.9rem;
}

p code,
li code
{
	font-family: var(--mono-fonts);
	background-color: #f5f2f0;
	/* changed 2019-02-07 to match style of Prism blocks */
	border-radius: 3px;
	white-space: nowrap;
}


/* =Structure
-------------------------------------------------------------- */

/* The main theme structure */
#access .menu-header,
div.menu,
#colophon,
#main
{
	margin-bottom: 0;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	background: #fff;
	max-width: 940px;
	width: 100%;
}

#branding
{
	padding: 0 20px;
}


/* Structure the footer area */
#footer-widget-area
{
	overflow: hidden;
}

#footer-widget-area .widget-area
{
	float: left;
	margin-right: 20px;
	width: 220px;
}

#footer-widget-area #fourth
{
	margin-right: 0;
}

#site-info
{
	float: left;
	font-size: 14px;
	font-weight: bold;
	width: 700px;
}

#site-generator
{
	float: right;
	width: 220px;
}


/* =Global Elements
-------------------------------------------------------------- */

/* Main global 'theme' and typographic styles */
body
{
	background-color: #f6f3ef;
}

body,
input,
textarea
{
	color: #666;
	font-size: 15px;
	line-height: 18px;
}

hr
{
	background-color: #e7e7e7;
	border: 0;
	clear: both;
	height: 2px;
	width: 50%;
	margin-top: 18px;
	margin-bottom: 18px !important;
}

/* Text elements */
p
{
	font-size: 1.1rem;
	text-align: justify;
	text-indent: 0;
}

p.undent
{
	text-indent: 0;
}

p.indent
{
	text-indent: 1em;
}

p+p
{
	text-indent: 1em;
}

ul
{
	list-style: disc;
	margin: 8px 8px 18px 2.5em;
	text-align: justify;
}

ol
{
	list-style: decimal;
	margin: 8px 8px 18px 2.5em;
}

ol ol
{
	list-style: upper-alpha;
}

ol ol ol
{
	list-style: lower-roman;
}

ol ol ol ol
{
	list-style: lower-alpha;
}

ul ul,
ol ol,
ul ol,
ol ul
{
	margin-bottom: 0;
}

li
{
	margin-bottom: 3px;
	font-size: 1.1rem;

}

::marker
{
	color: var(--banner-gray);
}


dl
{
	margin: 0 0 24px 0;
}

dt
{
	font-weight: bold;
}

dd
{
	margin-bottom: 18px;
}

strong
{
	font-weight: bold;
}

em,
i
{
	font-style: italic;
}

big
{
	font-size: 131.25%;
}

ins
{
	background: #ffc;
	text-decoration: none;
}

blockquote
{
	margin-left: 4%;
	margin-right: 4%;
	margin-top: 18px;
	margin-bottom: 18px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	line-height: 1.4em;
	background-color: #f3f3f3;
	border-left: 2px solid var(--banner-gray);
	font-size: 1.1rem;
}



abbr,
acronym
{
	border-bottom: 1px dotted #666;
	cursor: help;
}

sup,
sub
{
	height: 0;
	line-height: 1;
	position: relative;
	vertical-align: baseline;
	font-size: small;
}

sup
{
	bottom: 1ex;
}

sub
{
	top: .5ex;
}

input[type="text"],
textarea
{
	background: #f9f9f9;
	border: 1px solid #ccc;
	box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.1);
	padding: 2px;
}

a
{
	text-decoration: none;
}




/* =Header
-------------------------------------------------------------- */

header
{
	margin: 0;
	width: 100%;
	position: relative;
}

div#flag,
div#flag a,
div#flag a:visited
{
	font-family: var(--sans-fonts);
	font-size: 50px;
	line-height: 20px;
	margin: 0 0 30px 0;
	padding-top: 19px;
	color: var(--banner-gray);
	font-weight: bold;
	text-decoration: none;
}

#site-description
{
	color: var(--banner-gray);
	clear: right;
	font-style: italic;
	font-size: 20px;
	margin: 15px 0 18px 0;
}




p#slogan
{
	color: #ffffff;
	font-style: italic;
	font-size: 22px;
	position: absolute;
	top: 10px;
	left: 10px;
}

.feed-icon
{
	margin-left: 3px;
	padding: 0 0 0 19px;
	background: url("images/feed-icon-14x14.png") no-repeat 0 50%;
}

.pdf-icon
{
	margin-left: 3px;
	padding: 0 0 0 19px;
	background: url("../images/pdficon16-x-16.png") no-repeat 0 50%;

}

/* =Menu
-------------------------------------------------------------- */

#access
{
	background: #000;
	display: block;
	float: left;
	margin: 0 auto;
	width: 940px;
}

#access .menu-header,
div.menu
{
	font-size: 13px;
	margin-left: 12px;
	width: 928px;
}

#access .menu-header ul,
div.menu ul
{
	list-style: none;
	margin: 0;
}

#access .menu-header li,
div.menu li
{
	float: left;
	position: relative;
}

#access a
{
	color: #aaa;
	display: block;
	line-height: 38px;
	padding: 0 10px;
	text-decoration: none;
}

#access ul ul
{
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	display: none;
	position: absolute;
	top: 38px;
	left: 0;
	float: left;
	width: 180px;
	z-index: 99999;
}

#access ul ul li
{
	min-width: 180px;
}

#access ul ul ul
{
	left: 100%;
	top: 0;
}

#access ul ul a
{
	background: #333;
	line-height: 1em;
	padding: 10px;
	width: 160px;
	height: auto;
}

#access li:hover>a,
#access ul ul :hover>a
{
	background: #333;
	color: #fff;
}

#access ul li:hover>ul
{
	display: block;
}

#access ul li.current_page_item>a,
#access ul li.current-menu-ancestor>a,
#access ul li.current-menu-item>a,
#access ul li.current-menu-parent>a
{
	color: #fff;
}

* html #access ul li.current_page_item a,
* html #access ul li.current-menu-ancestor a,
* html #access ul li.current-menu-item a,
* html #access ul li.current-menu-parent a,
* html #access ul li a:hover
{
	color: #fff;
}


/* =Content
-------------------------------------------------------------- */

div#main
{
	width: 100%;
	max-width: 640px;
	margin: 0;
}

#main,
#main p,
#main input,
#main textarea
{
	color: #333;
	line-height: 26px;
}

#main ul
{
	margin-bottom: 8pt;
}

#main ol,
#main dd,
#main hr
{
	margin-bottom: 24px;
}

#main ul ul,
#main ol ol,
#main ul ol,
#main ol ul
{
	margin-bottom: 0;
}

#main pre,
#main kbd,
#main tt,
#main var
{
	font-size: 15px;
	line-height: 21px;
}

#main code
{
	font-size: 14px;
}

#main span.footnote code
{
	font-size: 11px;
}

#main dt,
#main th
{
	color: #000;
}

#main h1,
#main h2,
#main h3,
#main h4,
#main h5,
#main h6
{
	color: #000;
	font-family: var(--sans-fonts);
	font-weight: bold;
	line-height: 1.5em;
	margin: 0 0 20px 0;
}

#main h1
{
	font-size: 21px;
	margin-bottom: 0;
}

#main h2
{
	font-size: 16px;
	text-align: center;
	margin-bottom: 10px;
}

#main h3
{
	font-size: 16px;
	margin-top: 20px;
	margin-bottom: 0;
}

#main table
{
	border: 1px solid #e7e7e7;
	margin: 0 -1px 24px 0;
	text-align: left;
	width: 100%;
}

#main tr th,
#main thead th
{
	color: #fdfdfd;
	background-color: var(--banner-gray);
	font-size: 1.3em;
	font-weight: bold;
	line-height: 18px;
	padding: 9px 24px;
}

#main tr td
{
	border-top: 1px solid #e7e7e7;
	padding: 6px 2px;
}

#main tr.odd td
{
	background: #f2f7fc;
}

#main table.bordered-table td,
th
{
	border: #999 solid 1pt;
}

.hentry
{
	margin: 0 0 48px 0;
}

.home .sticky
{
	background: #f2f7fc;
	border-top: 4px solid #000;
	margin-left: -20px;
	margin-right: -20px;
	padding: 18px 20px;
}

.single .hentry
{
	margin: 0 0 36px 0;
}

.page-title
{
	color: #000;
	font-size: 14px;
	font-weight: bold;
	margin: 0 0 36px 0;
}

.page-title span
{
	color: #333;
	font-size: 16px;
	font-style: italic;
	font-weight: normal;
}

.page-title a:link,
.page-title a:visited
{
	color: #888;
	text-decoration: none;
}

.page-title a:active,
.page-title a:hover
{
	color: #ff4b33;
}


#main .entry-summary p:last-child
{
	margin-bottom: 12px;
}

.entry-content fieldset
{
	border: 1px solid #e7e7e7;
	margin: 0 0 24px 0;
	padding: 24px;
}

.entry-content fieldset legend
{
	background: #fff;
	color: #000;
	font-weight: bold;
	padding: 0 24px;
}

.entry-content input
{
	margin: 0 0 24px 0;
}

.entry-content input.file,
.entry-content input.button
{
	margin-right: 24px;
}

.entry-content label
{
	color: #888;
	font-size: 12px;
}

.entry-content select
{
	margin: 0 0 24px 0;
}

.entry-content sup,
.entry-content sub
{
	font-size: 10px;
}

.entry-content blockquote.left
{
	float: left;
	margin-left: 0;
	margin-right: 24px;
	text-align: right;
	width: 33%;
}

.entry-content blockquote.right
{
	float: right;
	margin-left: 24px;
	margin-right: 0;
	text-align: left;
	width: 33%;
}

.page-link
{
	clear: both;
	color: #000;
	font-weight: bold;
	margin: 0 0 22px 0;
	word-spacing: 0.5em;
}

.page-link a:link,
.page-link a:visited
{
	background: #f1f1f1;
	color: #333;
	font-weight: normal;
	padding: 0.5em 0.75em;
	text-decoration: none;
}

.home .sticky .page-link a
{
	background: #d9e8f7;
}

.page-link a:active,
.page-link a:hover
{
	color: #d81f23;
}

body.page .edit-link
{
	clear: both;
	display: block;
}

#entry-author-info
{
	background: #f2f7fc;
	border-top: 4px solid #000;
	clear: both;
	font-size: 14px;
	line-height: 20px;
	margin: 24px 0;
	overflow: hidden;
	padding: 18px 20px;
}

#entry-author-info #author-avatar
{
	background: #fff;
	border: 1px solid #e7e7e7;
	float: left;
	height: 60px;
	margin: 0 -104px 0 0;
	padding: 11px;
}

#entry-author-info #author-description
{
	float: left;
	margin: 0 0 0 104px;
}

#entry-author-info h2
{
	color: #000;
	font-size: 100%;
	font-weight: bold;
	margin-bottom: 0;
}

.entry-utility
{
	clear: both;
	color: #888;
	font-size: 12px;
	line-height: 30px;
}

.entry-meta a,
.entry-utility a
{
	color: #888;
}

.entry-meta a:hover,
.entry-utility a:hover
{
	color: #d81f23;
}

#main .video-player
{
	padding: 0;
}

/* =Some BPH-added styles
-------------------------------------------------------------- */

p.dialog
{
	text-indent: 1em;
}

p.centered
{
	text-align: center;
}

p.biblio
{
	margin-left: 2em;
	margin-top: 18px;
	margin-bottom: 18px;
	text-indent: -2em !important;
	line-height: 1.1em;
	text-align: justify;
}


div.poetry pre
{
	font-family: var(--avec-fonts);
	margin: 15px 30px;
	font-size: 1.1rem !important;
	line-height: 26px !important;
}

sub,
sup
{
	line-height: 0;
}

aside
{
	position: absolute;
	left: 75%;
	width: 23%;
	max-width: 220px;
	margin-top: 0.4em;
	line-height: 1.4em;
	text-align: left;
	font-style: normal;
	font-size: smaller;
	color: #888;
}

.marginalia
{
	position: absolute;
	left: 675px;
	width: 220px;
	margin-top: 0.4em;
	line-height: 1.4em;
	text-align: left;
}

#main code.graylight
{
	background-color: #fafafa;
	border: 1px solid #dcdcdc;
	border-radius: 2px;
}

.QA-question
{
	padding-top: 10pt;
	text-indent: 0;
	text-align: left;
}

.QA-question::before
{
	font-style: italic;
	font-weight: bold;
	content: "Q: ";
}

.QA-answer
{
	text-indent: 0;
	text-align: left;
}

.QA-answer::before
{
	font-style: italic;
	font-weight: bold;
	content: "A: ";
}




/* =Images
-------------------------------------------------------------- */

img
{
	max-width: 100%;
	/* When images are too wide for containing element, force them to fit. */
	height: auto;
	/* Override height to match resized width for correct aspect ratio. */
}

img.alignleft
{
	display: inline;
	float: left;
	margin-right: 24px;
}

img.alignright
{
	display: inline;
	float: right;
	margin-left: 24px;
}

img.aligncenter,
img.centered
{
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

img.alignleft,
img.alignright,
img.aligncenter,
img.centered
{
	margin-top: 24px;
	margin-bottom: 24px;
}

/* added by BPH 2012-04-28 */

div.figure-with-caption
{
	margin-bottom: 18px;
}

.figure-caption
{
	font-style: normal;
	font-size: 1.0rem;
	line-height: 1.2rem;
	padding: 12px;
	margin-top: -18px;
	color: #888;
	text-indent: 0;
	text-align: left;
}

/* Experiments with expandable images, 2010-12-19, for "Googling the lexicon"  */

img.squeezed
{
	max-width: 640px;
	width: 640px;
	transition-property: width, max-width;
	transition-duration: 1s;
}

img.squeezed:hover
{
	max-width: 900px;
	width: 900px;
}

img.doubler
{
	width: 100%;
	height: 100%;
	transition-property: width, height;
	transition-duration: 1s;
}

img.doubler:hover
{
	width: 200%;
	height: 200%;
}

iframe
{
	width: 100%;
	margin: 0 auto;
}




/* Previous and next links
-------------------------------------------------------------- */

.prevnext
{
	color: #888;
	font-size: 12px;
	line-height: 18px;
	display: block;
	overflow: hidden;
}

.prevnext a:link,
.prevnext a:visited
{
	color: #888;
	text-decoration: none;
}

.prevnext a:active,
.prevnext a:hover
{
	color: var(--active-color);
}

.previous
{
	float: left;
	width: 50%;
}

.next
{
	float: right;
	text-align: right;
	width: 50%;
}


/* =Comments
-------------------------------------------------------------- */
div#comments
{
	width: 94%;
	max-width: 600px;
	padding: 20px;
	background-color: color(srgb 0.901 0.901 0.901);
	margin: 24px 0;
}

div#comments h3
{
	margin-top: 10px;
	margin-bottom: 15px;
}

ul#commentlist
{
	list-style: none;
	line-height: 24px;
	margin: 0 0 24px 0;
	position: relative;
}

li.comment,
li.comment-reply
{
	margin-bottom: 30px;
}

.comment-author-and-date
{
	font-family: var(--sans-fonts);
	font-size: 1.0em;
	margin-bottom: 10px;
	border-bottom: 1px solid var(--dla-purple);
}


li.comment-reply
{
	margin-left: 5%;
}


div.comment-date
{
	font-family: var(--sans-fonts);
	font-weight: normal;
	font-size: 1.0em;
	margin-bottom: 5px;
}

div.comment-body
{
	font-family: var(--avec-fonts);
	font-weight: normal;
	font-size: 1.1em;
}

div.comment-body blockquote
{
	margin-left: 4%;
	margin-right: 4%;
	margin-top: 10px;
	margin-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	background-color: #f3f3f3;
	border-left: 2px solid var(--banner-gray);
}

.comment-body p
{
	text-indent: 0;
}

.comment-body p+p
{
	text-indent: 1em;
}



.commentlist li:last-child
{
	border-bottom: none;
	margin-bottom: 0;
}

#comments .comment-body ul,
#comments .comment-body ol
{
	margin-bottom: 18px;
}

#comments .comment-body p
{
	margin-bottom: 0;
	text-align: justify;
}


#comments .comment-body p:last-child
{
	margin-bottom: 6px;
}

p#no-more-comments
{
	text-indent: 0;
	border: 1px solid var(--dla-purple);
	font-family: var(--sans-fonts);
	font-weight: normal;
	font-size: 1.0em;
	padding: 5px;
}



/* =Footer
-------------------------------------------------------------- */

#footer
{
	margin-bottom: 20px;
}

#colophon
{
	margin-top: -4px;
	overflow: hidden;
	padding: 18px 0;
}




#colophon a
{
	color: var(--banner-gray);
	text-decoration: none;
}

#colophon a:hover,
#colophon a:active
{
	color: #d81f23;
	text-decoration: none;
}

#site-generator
{
	font-style: italic;
	position: relative;
}

#site-generator a
{
	background: url(images/wordpress.png) center left no-repeat;
	color: #666;
	display: inline-block;
	line-height: 16px;
	padding-left: 20px;
	text-decoration: none;
}

#site-generator a:hover
{
	text-decoration: underline;
}


nav
{
	max-width: 900px;
	position: relative;
	display: block;
	background-color: var(--banner-gray);
}

ul#nav-main-menu
{
	position: relative;
	list-style: none;
	background-color: var(--banner-gray);
	color: white;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	padding: 8px 10px;
	font-size: 15px;
	font-weight: bold;
	margin: 0;
	user-select: none;
}

ul.nav-submenu
{
	display: none;
	list-style: none;
	text-align: start;
	font-size: 1.0rem;
	font-weight: bold;
	width: fit-content;
	margin: 0;
	background-color: var(--banner-gray);
	border-top: 1px solid var(--dla-purple);
	border-bottom: 1px solid var(--dla-purple);
	position: absolute;
	top: 36px;
	z-index: 10;
}

ul.nav-submenu li
{
	margin: 20px 5px;
}


li.menu-label a,
li.menu-link a
{
	padding: 0 30px 0 0;
	cursor: pointer;
	color: white;
}

/* li.menu-label a,
li.menu-label a:visited
{
	text-decoration: none;
}

li.menu-link a,
li.menu-link a:visited
{
	text-decoration: none;
} */

li.menu-label:hover,
li.menu-label:active
{
	text-decoration: underline white 3px;
}

/* li.menu-link a:hover,
li.menu-link a:active
{
	text-decoration: underline white 2px;
} */

.menu-is-open
{
	text-decoration: underline white 3px;
}


#sitename,
#sitename a,
#sitename a:visited
{
	font-family: var(--sans-fonts);
	font-size: 50px;
	padding: 20px 0 27px 3px;
	color: var(--banner-gray);
	font-weight: bold;
	text-decoration: none;
}

img#footprint
{
	height: 1.5rem;
	width: auto;
}

span.noteAnchor
{
	color: #2d2fef;
}

details>summary
{
	cursor: pointer;
}

div.read-this
{
	background-color: var(--background-beige);
	padding: 15px;
	max-width: 600px;

}

div.read-this img.alignleft
{
	display: inline;
	float: left;
	margin-right: 15px;
	margin-top: 0;
	margin-bottom: 0;
}


div.title-and-blurb
{
	display: flex;
	flex-direction: column;
}

h3.thumbnail-title
{
	font-size: 1.5em;
	margin-top: 0;
	margin-bottom: 10px;
	line-height: 1.5rem;
}

div.title-and-blurb p
{
	text-align: left;
}




/* MEDIA QUERIES BLOCKS */

/* W  I  D  E  screens */

@media screen and (min-width: 940px)
{
	div#wrapper
	{
		width: 900px;
		padding: 10px 30px;
	}

	div#banner
	{
		position: relative;
		width: 900px;
		height: 200px;
		margin: 0;
		background-color: var(--banner-gray);
		background-image: url("../../includes/images/dla-static-banner-900px.png");
		background-origin: content-box;
		background-position: bottom, left;
		background-repeat: no-repeat;
	}

	img#burger
	{
		display: none;
	}

	img#search-icon
	{
		display: none;
	}

	div#main
	{
		position: relative;
		width: 640px;
	}

	p#slogan
	{
		font-size: 22px;
	}

	/* !important tags to override later mediaquery settings */
	img.wide
	{
		width: 900px !important;
		height: auto !important;
		max-width: 900px !important;
	}

	div.figure-number
	{
		position: absolute;
		left: 670px;
		width: 100px;
		margin-top: 25px;
		display: block;
		text-align: left;
		line-height: 1.3;
		font-family: var(--sans-fonts);
		font-size: 1rem;
		font-weight: bold;
	}

	div.figure-number.wide
	{
		margin-top: -35px;
	}

	span.footnote
	{
		position: absolute;
		left: 670px;
		width: 220px;
		margin-top: -25px;
		text-align: left;
		text-indent: 0;
		line-height: 1.4;
		font-family: var(--sans-fonts);
		font-size: smaller;
		font-weight: normal;
		color: #888;
		display: inline !important;
	}

	span.footnote-anchor
	{
		display: none !important;
	}

	nav
	{
		width: 900px;
		display: block;
	}

	ul#nav-main-menu
	{
		display: flex !important;
	}

	/* !important needed to override narrow-screen setting
		of none or block */

	input#search-input
	{
		display: block;
		position: absolute;
		right: 10px;
		height: 26px;
		max-width: 250px;
		width: 27%;
		top: 286px;
		z-index: 5;
		border: 1px solid #4b307b;
		background-image: url("../images/search-icon.svg");
		background-position: right 3px top 4px;
		background-repeat: no-repeat;
		background-size: 33px;
	}

	div#promos
	{
		width: 900px;
		margin: 0 auto;
	}

	div#rec-container
	{
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-template-rows: 1fr 1fr;
		gap: 10px;
	}

	div.thumbnail-box
	{
		width: 40%;
	}

	div.thumbnail-box img
	{
		width: fit-content;
	}

	footer
	{
		width: 900px;
	}



}

/* End @media screen and (min-width: 940) */



@media screen and (660px < width < 940px)
{
	div#wrapper
	{
		max-width: 900px;
		width: 100%;
		padding: 10px;
	}

	article
	{
		width: 640px;
		padding: 0 10px;
		margin: 0 auto;
		position: relative;
	}

	header
	{
		margin: 0 auto;
		width: 640px;
		position: relative;
	}

	div#banner
	{
		position: relative;
		width: 640px;
		height: 200px;
		margin: 0 auto;
		background-color: var(--banner-gray);
		background-image: url("../../includes/images/dla-static-banner-640px.png");
		background-origin: content-box;
		background-position: bottom, left;
		background-repeat: no-repeat;
	}

	p#slogan
	{
		font-size: 16px;
	}

	img#burger
	{
		display: none;
	}

	img#search-icon
	{
		display: none;
	}

	div.figure-number
	{
		position: relative;
		display: block;
		font-family: var(--sans-fonts);
		font-size: 1rem;
		line-height: 1.3;
		font-weight: bold;
		text-align: left;
		margin: 10px 0;
	}

	div.figure-number.right
	{
		text-align: right;
	}

	nav
	{
		width: 640px;
	}

	ul#nav-main-menu
	{
		width: 600px;
		display: flex !important;
	}

	span.footnote
	{
		color: var(--link-color);
		display: none;
		cursor: pointer;
	}

	span.footnote::before
	{
		content: "["
	}

	span.footnote::after
	{
		content: "]"
	}

	span.footnote-anchor
	{
		color: var(--link-color);
		display: inline;
		cursor: pointer;
	}

	input#search-input
	{
		position: absolute;
		right: 0px;
		height: 25px;
		width: 250px;
		top: 36px;
		border: 1px solid #4b307b;
		background-image: url("../images/search-icon.svg");
		background-position: right 5px top 3px;
		background-repeat: no-repeat;
		background-size: 33px;
	}

	div#promos
	{
		width: 640px;
		margin: 0 auto;
	}

	div#rec-container
	{
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 1fr 1fr 1fr 1fr;
		gap: 10px;
	}

	div.thumbnail-box
	{
		width: 30%;
	}

	div.thumbnail-box img
	{
		width: fit-content;
	}

	footer
	{
		width: 640px;
	}


}



/* =Layout: Small screens
-------------------------------------------------------------- */

@media screen and (max-width: 660px)
{
	div#wrapper
	{
		padding: 10px;
	}

	header
	{
		margin: 0;
		padding: 0;
		position: relative;
		/* height: 136px; */
	}

	article
	{
		width: 94%;
		margin: 0 auto;
	}

	#sitename,
	#sitename a,
	#sitename a:visited
	{
		font-family: var(--sans-fonts);
		font-size: clamp(16px, 12vw, 50px);
		line-height: 21px;
		margin: 0 0 20px 0;
		padding: 12px 0 0 3px;
		color: var(--banner-gray);
		font-weight: bold;
		text-decoration: none;
	}

	div#flag,
    div#flag a,
    div#flag a:visited
    {
        font-family: var(--sans-fonts);
        font-size: 37px;
        line-height: 0px;
        margin: 0 0 30px 0;
        padding-top: 18px;
        color: var(--banner-gray);
        font-weight: bold;
        text-decoration: none;
    }



	div#banner
	{
		position: relative;
		height: 175px;
		background-image: url("../../includes/images/dla-static-banner-640px.png");
		background-origin: border-box;
		background-position: bottom;
		background-repeat: no-repeat;
		padding-top: 2px;
	}

	p#slogan
	{
		display: none;
	}

	img#burger
	{
		position: relative;
		width: 41px;
		height: auto;
		margin-left: 5px;
		top: -55px;
	}

	input#search-input
	{
		position: absolute;
		right: 2vw;
		height: 25px;
		width: 220px;
		top: 105px;
		opacity: 80%;
		border: 1px solid #4b307b;
		background-image: url("../images/search-icon.svg");
		background-position: right 3px top 3px;
		background-repeat: no-repeat;
		background-size: 33px;
		display: block;
	}

	nav
	{
		position: relative;
		display: block;
		background-color: var(--banner-gray);
	}

	nav li
	{
		font-size: 15px;
	}

	ul.nav-submenu
	{
		display: none;
		list-style: none;
		font-size: 15px;
		font-weight: normal;
		width: fit-content;
		margin: 0;
		background-color: var(--banner-gray);
		border-top: 1px solid var(--dla-purple);
		border-bottom: 1px solid var(--dla-purple);
		position: absolute;
		top: 36px;
		left: 0px;
		z-index: 10;
	}



	/* nav
	{
		width: 80vw;
	}

	ul#nav-main-menu
	{
		display: none;
		position: absolute;
		top: -54px;
		z-index: 10;
		width: fit-content;
		padding: 0;
		border: 1px solid var(--dla-purple);
		font-size: 1rem;
	}

	ul.nav-submenu
	{
		display: none;
		list-style: none;
		font-size: 1.0rem;
		font-weight: bold;
		white-space: nowrap;
		width: fit-content;
		margin: 0;
		padding: 0 10px;
		background-color: var(--banner-gray);
		border: 1px solid var(--dla-purple);
		position: absolute;
		left: 143px;
		top: -1px;
		z-index: 10;
	}

	ul.nav-submenu li
	{
		margin: 20px 5px;
	}


	li.menu-label,
	li.menu-link
	{
		margin: 30px 10px;
	}

	li.menu-label a,
	li.menu-link a
	{
		padding: 0;
		cursor: pointer;
		color: white;
	} */


	main
	{
		width: 100%;
	}

	div#whatwhowhen
	{
		margin-top: 0;
	}

	#comments
	{
		/* width: calc(100% - 20px); */
		width: 94%;
		margin: 0 auto;
	}


	img.alignleft,
	img.alignright,
	img.aligncenter
	{
		float: none;
		clear: both;
		display: block;
		margin-left: auto;
		margin-right: auto;
	}

	img.aligncenter
	{
		width: 100%;
	}

	div.figure-number
	{
		position: relative;
		display: block;
		font-family: var(--sans-fonts);
		font-size: 1rem;
		line-height: 1.3;
		font-weight: bold;
		text-align: left;
		margin: 10px 0;
	}

	span.footnote
	{
		color: var(--link-color);
		display: none;
		cursor: pointer;
	}

	span.footnote::before
	{
		content: "["
	}

	span.footnote::after
	{
		content: "]"
	}

	span.footnote-anchor
	{
		color: var(--link-color);
		display: inline;
		cursor: pointer;
	}


	div#promos
	{
		width: 94%;
		margin: 0 auto;
	}

	div#rec-container
	{
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 1fr 1fr 1fr 1fr;
		gap: 10px;
	}

	div.thumbnail-box,
	div.thumbnail-box img
	{
		display: none;
	}

	footer
	{
		width: 100%;
	}

}




/* =Print Style
-------------------------------------------------------------- */

@media print
{
	body
	{
		background: none !important;
	}

	#wrapper
	{
		clear: both !important;
		display: block !important;
		float: none !important;
		position: relative !important;
	}

	#header
	{
		border-bottom: 2pt solid #000;
		padding-bottom: 18pt;
	}

	#site-title,
	#site-description
	{
		float: none;
		line-height: 1.4em;
		margin: 0;
		padding: 0;
	}

	#site-title
	{
		font-size: 13pt;
	}

	.entry-content
	{
		font-size: 14pt;
		line-height: 1.6em;
	}

	.entry-title
	{
		font-size: 21pt;
	}

	#access,
	#branding img,
	#respond,
	.comment-edit-link,
	.edit-link,
	.navigation,
	.page-link,
	.widget-area
	{
		display: none !important;
	}

	#container,
	#header,
	#footer
	{
		margin: 0;
		width: 100%;
	}

	#main,
	.one-column #main
	{
		margin: 24pt 0 0;
		width: 100%;
	}

	.wp-caption p
	{
		font-size: 11pt;
	}

	#site-info,
	#site-generator
	{
		float: none;
		width: auto;
	}

	#colophon
	{
		width: auto;
	}

	#site-generator a
	{
		margin: 0;
		padding: 0;
	}

	#entry-author-info
	{
		border: 1px solid #e7e7e7;
	}

	#main
	{
		display: inline;
	}

	.home .sticky
	{
		border: none;
	}
}

/* =bp-nav-menu
-------------------------------------------------------------- */