/* palette
pupleish 			5f0f40
maroon-rustish		9a031e
goldish				fb8b24
orange/brownish	e36414
turquoiseish		0f4c5c
*/

@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Arvo:ital,wght@0,400;0,700;1,400;1,700&display=swap');
/* Mistral, local, back to MS-DOS file name days!
  font-family: 'Mistral'; src: url('fonts/MISTRAL.TTF') format('truetype');
  font-weight: normal; font-style: normal;
}
*/

html, body { background: #5f0f40; color: white; font-family: Merriweather; font-weight: 300; }
p,ul,ol,blockquote,table { margin-top: 8px; margin-bottom: 8px; }
#header { padding-top: 20px; padding-bottom: 2px;}
#header h1 { font-family: 'Arvo', Merriweather/*sans-serif*/; margin: 0 0 0 20px; color: #ece39a; font-weight: normal;
text-shadow: 5px 5px 8px rgba( 255,255,255,0.7 ); font-size: 32px; }
.content h1, /* should not have any of these */
.content h2,
.content h3,
.content h4,
.content h5,
.content h6 { font-family: 'Arvo', Merriweather/*sans-serif*/; margin: 12px 0; color: #ece39a; font-weight: normal; }
/* set size as needed */
.content .fv,
.sitetrailer .fv { color: #ece39a; font-style: italic; font-size: 105%; } /* italic is a bit shorter */
.content b { color: #ece39a; }
.content h2 { font-size: 22px; line-height: 120%; }
summary h2 { font-style: normal; }
.content h2.mistral { /* font-family: 'Mistral'; */ font-size: 36px;  margin-bottom: 16px;
text-shadow: 5px 5px 8px rgba( 255,255,255,0.7 ); }

/* links */
.content .mCM_WIK_link { color: gold; text-decoration: none; border-bottom: dotted 2px; }
.content .mCM_WIK_link:hover { border-bottom: solid 2px; }
.content .mCM_WIK_link:after { font-weight: bold; display: inline-block; content: "↗"; padding: 0 0 0 2px;}

.content .mCM_EXT_link { color: wheat; text-decoration: none; border-bottom: dotted 2px; }
.content .mCM_EXT_link:hover { border-bottom: solid 2px; }
.content .mCM_EXT_link:after { font-weight: bold; display: inline-block; content: "↗"; padding: 0 0 0 2px;}

.sitetrailer .mCM_EXT_link { color: #ddccdd; text-decoration: none; border-bottom: none; }
.sitetrailer .mCM_EXT_link:hover { border-bottom: dotted 2px; }
.sitetrailer .mCM_EXT_link:after { font-weight: bold; display: inline-block; content: "↗"; padding: 0 0 0 2px;}

.content .mCM_SITE_link { color: #fff; text-decoration: none; border-bottom: dotted 2px; }
.content .mCM_SITE_link:hover { border-bottom: solid 2px; }


.content .mCM_pagenav .mCM_SITE_link { color: #fff; text-decoration: none; border-bottom: 2px dotted; }
.content .mCM_pagenav .mCM_SITE_link:hover { border-bottom: solid 2px; }
.content .mCM_pagenav .mCM_active_li { background: rgba( 0,0,0,0.3 ); color: #aaa; }
.content .mCM_pagenav .mCM_PRECOMMA { display: block; margin-top: 4px; margin-bottom: 6px; }

/* columns */
.pure-g ul { margin-top: 0; margin-bottom: 0; font-family: Merriweather; }

/* autogenerated <H# in-page TOC/links */

.mCM_TOC { background: rgba( 0,0,0,0.2 ); font-size: 90%; padding: 12px 16px 12px 20px; border-radius: 12px; font-weight: 300; margin-bottom: 12px; display: inline-block; }
.mCM_TOC_H2 { display: block; margin-left: 1em; text-indent: -1em; }
.mCM_TOC_H2 a.mCM_SITE_link { color: #fff; text-decoration: none; border-bottom: none; }
.mCM_TOC_H2 a.mCM_SITE_link:hover { border-bottom: 2px dotted; }

/* blockquote same look */
blockquote { background: rgba( 0,0,0,0.3 ); margin: 12px 0; padding: 12px 16px 12px 20px; border-radius: 12px; }
blockquote *:first-child { margin-top: 0; }
blockquote *:last-child { margin-bottom: 0; }

/* same "px" across the three */
	.content summary { display: list-item; font-size: 18px; color: rgba( 236,227,154, 0.8); margin-left: 18px; text-indent: -18px; padding-top: 8px;}
	.content details p { margin-left: 18px; }
	.content details blockquote { margin-left: 18px; }
	.content summary h2 { display: inline; font-size: 22px; }

/* details and summary */
.content summary h2:hover { color: #fff; border-bottom: 2px dotted; }
.content summary:hover { color: #fff; }

/* should we wish to change, e.g.,...
.content details > summary { list-style-type: none; }
.content details > summary::-webkit-details-marker { display: none; }
.content details > summary::before { content: '+ '; font-size: 36px; font-weight: bold; }
.content details[open] > summary::before { content: '- '; font-size: 36px; font-weight: bold; }
*/

/* miscellany */
.content .c { text-align: center; }
.content .c_em_d { text-align: center; } .content .c_em_d:before { content: "— "; }
.content .in { display: inline; }
table.fullwidth { width: 100%; }
ul { list-style-type: square; }

/* get our menus in order */
#topmenu.our, #menu.our { font-family:Merriweather/*sans-serif*/; font-size: 16px; }
#menu.our ul { border-top: none;  }

#topmenu.our { background: #fff; /* #f8f4d4; */ /* #fb8b24; */  width: 100%; z-index: 100; padding-left: 0;
  position: fixed; /* NB sticky is not reliable on all IOS */
  top: 0; font-style: normal; }
/* #topmenu ul ul { font-style: normal; } leave all italic */
.envelope { padding-top: 36px; } /* most likely to avoid scroll after load */

/* flatten and allow wrapping (un-PURE nowrap) */
#topmenu.our ul ul.mCM_flat
	{ box-sizing: border-box; position: fixed; left: inherit; }
#topmenu.our ul ul.mCM_flat li
	{ display: block; float: left; border: none;}
#topmenu.our .pure-menu-horizontal
	{ white-space: normal; }

#menuLink { z-index: 101; position: fixed; }
@media ( max-width: 768px ) { #topmenu.our { padding-left: 50px; width: calc( 100% - 50px );} }

/* more menu-ing */
#menu.our { overflow-y:hidden; } /* we scroll with main */
#topmenu.our .pure-menu-link, #menu.our .pure-menu-link { min-height: 20px; } /* child down-arrow mucks, make uniform */
#menu.our { background: #0f4c5c; }
#topmenu.our .pure-menu-link { color: #111; }
#topmenu.our .mCM_active { background: #9a031e; }
/* PURE IS INCONSISTENT, mixed 0.6em and 0.5em */
#menu.our a { padding: 0.5em 1em; color: #fff; }
#menu.our a:hover { background: #fff !important; color: #000 !important; }


#topmenu.our .pure-menu-selected > .pure-menu-link, 
#topmenu.our .pure-menu-selected > .pure-menu-link:visited {
    color: #fff; background: #9a031e;
}
/* #topmenu.our ul ul { box-shadow: 0px 5px 8px rgba( 0,0,0,0.5 ); } */
#topmenu.our ul ul { background: transparent; }
#topmenu.our ul ul li { background: #fff; }

div.figure.right.nudge_ld { margin-top: 16px; margin-right: 16px; }
.w100 { width: 100%; }


.sitetrailer { padding: .25em 2em; background: rgba( 0,0,0,0.4 ); color: #ddccdd; line-height: 140%;font-family: Merriweather/*sans-serif*/; font-size: 16px; }
.pure-g * { font-family: Merriweather/*sans-serif*/ !important; font-size: 15px; }

large { font-size: 150%; display: inline; }

.mCM_pagenav:not(.mCM_inline) { margin-top: 20px; border: 1px dotted #9a031e; padding-top: 8px; text-align: center; }
.content .mCM_pagenav.mCM_inline .mCM_SITE_link { color: #ece39a; }
.content { margin-bottom: 20px; } /* PURE 50 is too much */
.pure-menu-horizontal .pure-menu-has-children>.pure-menu-link:after {
    content: "▼"; font-size: 85%;
}
/*.pure-menu-has-children>.pure-menu-link:after {
    padding-left: 0.5em;
    content: "\25B8"; "\25BE";
    font-size: small;
}
*/

/* miniCM buttons support */

.mCM_btn { padding: .15em .6em .2em .6em; display: inline-block; } .mCM_btn, button#expand, button#collapse { padding: .15em .6em .2em .6em; }
not( .showmenu ) .mCM_items .menu, .mCM_items .long { display: none; }
.mCM_next { text-decoration: none !important; }
.mCM_next:after { content:"►"; }

/* palette
pupleish 			5f0f40
maroon-rustish		9a031e
goldish				fb8b24
orange/brownish	e36414
turquoiseish		0f4c5c
*/
/* match up to rest... */

button#expand, button#collapse { border: none; border-radius: 0; 
background: #e36414; color: #fff; }
button#expand:hover, button#collapse:hover { background-color: #9a031e; 
box-shadow: 0px 0px 10px rgba( 255,255,255,0.8 ) } 

/* colors et al*/
.content .mCM_pagenav { border-top: 1px solid #fb8b24; }
.content .mCM_pagenav .mCM_btn { font-family: Merriweather/*sans-serif*/; margin: 3px; font-style: italic; }
.content .mCM_pagenav .mCM_btn.mCM_active { background-color: #9a031e; }
.content .mCM_pagenav a.mCM_btn.mCM_SITE_link { text-decoration: none; background-color: #e36414; border-bottom: none; }
.content .mCM_pagenav a.mCM_btn.mCM_SITE_link:hover { background-color: #9a031e; 
box-shadow: 0px 0px 10px rgba(255,255,255,0.8) }
/* hmm... italic looks nice */
#topmenu.our, #menu.our { font-style: italic; }
DIV.mCM_thumbnails_caption { color: #ccc; }
#topmenu.our :not(span).pure-menu-link:hover {
    background-color: #0f4c5c; color: #fff; /* override PURE */
}
#menu.our .mCM_active .pure-menu-link:hover {
    background-color: #5f0f40; /* override PURE */
}

#menu.our li.mCM_active { background: #5f0f40; color: #fff !important; }
#menu.our .pure-menu-selected .pure-menu-link,
#menu.our .pure-menu-selected .pure-menu-link:visited { color: #fff; }
#menu.our .pure-menu-selected a.pure-menu-link:hover { color: #fff; }
#menu.our .mCM_parked *:hover { color: #000; }
/* cheat to set to what they would be otherwise */
#menu.our .pure-menu-selected:hover { background: transparent; }
#menu.our .mCM_active.pure-menu-selected:hover { color: #000 !important; }

.mCM_pagenav.mCM_inline { border-top: none; }

.sitecredits { background: #0f4c5c; padding: 4px 2em 8px 2em; font-family: sans-serif; font-size: 14px; 
color: #aa9; text-align: right; }
.sitecredits a.dr { text-decoration: none; color: inherit; }
.sitecredits a.dr:hover { border-bottom: 2px dotted; }
