/* MINIMAL */

.cse .gsc-control-cse, .gsc-control-cse { padding: 2px 0 0 0 !important; }
.gsc-search-box button { margin-top: 6px; }

html{
	-ms-text-size-adjust:100%;
	-webkit-text-size-adjust:100%;
	font-family: Verdana, Calibri, Arial, Helvetica, sans-serif;
	font-size: 16px;
	box-sizing: border-box;
}
body {
	background-color: #111111;
	margin: 0;
	padding: 0;
	background: #897d71;
	background-image: url( '../graphics/crest.gif' );
	background-attachment: fixed;	 /*distracting if it scrolls */
}
DIV.envelope {
	margin-left: auto;
	margin-right: auto;
	max-width: 800px;
	border: none;
}
DIV.content  {
	overflow: auto;
	background-color: #ffffff;
	padding: 0 15px 15px 15px; /* MOBILE padding, see 48em below */
	border: none;
    font-family: "Merriweather",Georgia,Times,"Times New Roman",serif;
	 font-weight: 300;
    line-height: 1.6;
    color: #1f2124;
    -webkit-font-smoothing: antialiased;
}

#layout {
}
#topmenu {
	/* background-color: orange; */
	background-color: #f29f00 /* #f1ab51 */ /* #db932a */ !important;
	border: none; 
}
#topmenu .pure-menu-has-children ul {
	background-color: #eeeeee;
}
#topmenu .pure-menu-has-children ul  .pure-menu-link.mCM_active {
	background-color: #888;
	color: #ccc;
}
#topmenu .pure-menu-has-children ul a.pure-menu-link:hover {
	background: #000000;
	color: #ffffff;
}

.top0 {
	padding-left: 50px;
}
@media (min-width: 48em) {
	.top0 {
		padding-left: 0;
	}
	DIV.content { padding-left: 30px; padding-right: 30px; }
}

#topmenu a.pure-menu-link {
	color: #ffffff;
}
#menu .mCM_active.pure-menu-link {
	background: #fff;
}
#menu a.pure-menu-link {
	background: #bbb;
}
#menu a { /* line up side menu with top (both in PURE) */
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}
#topmenu a.pure-menu-link:hover {
	color: #333;
}
#topmenu .pure-menu-has-children UL a.pure-menu-link { color: #333; }
#topmenu .pure-menu-has-children wbr { display: none; }

#topmenu > UL > LI { float: left !important; }

.pure-menu-horizontal .pure-menu-has-children>.pure-menu-link:after,
.pure-menu-has-children>.pure-menu-link:after {
    content: "▼"; font-size: 80%; 
}

#menu {
	background-color: #d3d8dc;
	border: none;
	color: #616569;
}
#menu wbr {
	display: none;
}

.sidebar {
	padding: 0;
	box-sizing: border-box;
	text-align: center;
	font-size: 90%;
}
#menu a {
	color: #ffffff;
}

#menu .pure-menu ul, #menu .pure-menu .menu-item-divided {
	border: none;
}

#main {

}
#banner {
	height: 140px;
}

#topmenu .mCM_active:hover { background: transparent; } 
#menu .mCM_active:hover { background: #ffffff; } 

/* applying to existing styles */

/* #header-wrap, */ #topmenu {
    position: fixed;
	 box-sizing: border-box;
    top:0;
    height: auto;
    width: 100%;
	 background: #ffffff;
    z-index: 0;
	 text-align: left;
	 padding: 0;
	 
}
/* #container, */ #banner {
	/* just has to be close not to be too jumpy, for wide screen */
	 margin-top: 36 px;
	 
}


/*
 * FIGURE TEMPLATE SUPPORT, go back to DIVs, span is too problematic (e.g., text-align center active but contents
 * not centered)
 */

div.mCM_frame,
div.mCM_caption {
	display: block;
	margin: 1em auto;
	font-size: 90%;
	line-height: 135%;
	text-align: center;
	max-width: 100%;
	page-break-inside: avoid;
	clear: both;
}
div.mCM_caption .nocaption { display: none; } /* when needed in image navigation only */
.mCM_navigate { display: block; padding: 0 0 .5em 0; text-align: center; }
.noborder img.figure{ border: none; }

div.nomargin div.figure.center,
div.nomargin div.figure.left,
div.nomargin div.figure.right {
	/* a bit of a minsnomer, no bottom margin in case we want to append to legend
	   without that appear in lightbox image text */
	margin-bottom: 0;
}
div.centered,
div.centered div.figure.center,
div.centered div.figure.left,
div.centered div.figure.right {
	float: none;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

/*	standard widths...
	$thumb["THUMB"] = 100;
	$thumb["SMALL"] = 150;
	$thumb["MEDIUM"] = 250;
	$thumb["LARGE"] = 350;
	$thumb["XL"] = 500;
	$thumb["XXL"] = 600;

medium and up can take up most of horizontal space on vertical mobile device, center if
less than 250 px left for text/other
*/
div.figure {
	margin: 12px auto;
	font-size: 14px;
	line-height: 20px;
	text-align: center;
}
img.figure {
	padding: 0;
	margin: 0 auto 4px auto;
	border: 1px #a0a0a0 solid;
	display: block;
	max-width: 100%;
}

div.THUMB { width: 100px; }
div.SMALL { width: 150px; }
div.MEDIUM { width: 250px; }
div.XL, div.XXL, div.FULL {
	margin-left: auto;
	margin-right: auto;
}

@media (min-width: 550px) { 
	div.LARGE { width: 350px; }
	div.XL { width: 500px; }
	div.XXL { width: 600px; }
	div.FULL { width: 100%; }
	div.figure.left {
		margin: 8px 12px 8px 0;
		max-width: 100%;
		float: left;
		clear: left;
	}
	div.figure.right {
		margin: 8px 0 8px 12px;
		max-width: 100%;
		float: right;
		clear: right;
	}
}
div.figure.left.always {
	margin: 8px 12px 8px 0;
	max-width: 100%;
	float: left;
	clear: left;
}
div.figure.right.always {
	margin: 8px 0 8px 12px;
	max-width: 100%;
	float: right;
	clear: right;
}
/*
 * THUMBNAIL GALLERY SUPPORT
 */
gallerytitle { /* technically we should not be defining elements, but... */
	display: block;
	font-weight: bold;
}
.mCM_thumbnails_container {
	width: 100%;
	text-align: center;
	padding-bottom: .8em;
} 
.mCM_thumbnails_head {
	font-size: 80%;
	color: #606060;
	padding: .5em 10% 1em 10%;
	line-height: 130%;
	font-style: italic;
}
.mCM_thumbnails_caption {
	font-family: Verdana, Calibri, Arial, Helvetica, sans-serif;
}
.mCM_thumbnails_caption {
	font-size: 90%;
	display: inline-block; vertical-align: top;
	margin: .5em;
	line-height: 130%;
	vertical-align: top;
	color: #666666;
}
.mCM_thumbnails_caption IMG {
	border: .125em #606060 solid;
	box-shadow: 8px 4px 8px #bbbbbb;
	/* NOTE, function currently adds 30 to width since we need to force a specific width on per-thumb basis */
	margin: 0 auto .5em auto;
}
.mCM_thumbnails_caption p {
	margin: 0 !important;
	padding-top: 0.5em;
}

.mCM_caption .hidep { display: none; }

.mCM_thumbnails .mCM_1up {
	width: 100%; border: 1px solid #d0d0d0;;
	box-sizing: border-box;
	background-color: #f0f0f0;
	text-align: left;
	display: block;
	margin-bottom: .5em; margin-right: 1em;
	clear: both;
	padding: 0.5em;
}
.mCM_thumbnails .mCM_1up_pic {
	display: block; float: left;
	/*width: 13%;*/
}	
.mCM_thumbnails .mCM_1up_pic IMG {
	border: .125em #606060 solid;
	box-shadow: 7px 3px 7px #bbbbbb;
	margin: 0 1em .5em 0;
	max-width: 100%;
}
.mCM_thumbnails .mCM_1up_desc {
	display: inline;
}
@media ( min-width: 500px ) {
	.mCM_thumbnails .mCM_1up_desc {
		display: table-cell;
		width: 85%;
		padding-left: 2em;
	}
}
.mCM_thumbnails_pages {
	text-align: center; /* we generate mCM_btn for the links */
}

.mCM_thumbnails a, #lightbox a {
	text-decoration: none;
	border: none;
}
a .dim :hover, a.dim:hover, a.dim:hover img, a:hover img.dim { 
	opacity: 0.60;
	filter: alpha(opacity=60); /* For IE8 and earlier */
}

/* we like...
bold link color #ec6803
border light rgb(219, 222, 224) grayish underneath 1px, go color on mouseover 
*/

/* specify variants in case we differentiate in the future */
a.mCM_WIK_link, a.mCM_EXT_link, a.mCM_SITE_link, a {
	color: #e08900 /* #f1ab51 */ /* #db932a */;
	border-bottom: 1px rgb(219, 222, 224) solid;
	text-decoration: none;
}
#menu a, #topmenu a , .menu-link, .mCM_FB_id { border: none; } /* undo what we just set */
#topmenu { z-index: 100; }
a.mCM_WIK_link, a.mCM_EXT_link {
	font-weight: bold;
}
a.mCM_WIK_link:focus, a.mCM_EXT_link:focus, a.mCM_SITE_link:focus, a.mCM_fn_link:focus {
	outline: 1px solid #ffffff; /* leave in plain sight for machine assisted reading */
	font-weight: bold;
}
a.mCM_WIK_link:hover, a.mCM_EXT_link:hover, a.mCM_SITE_link:hover, a:hover {
	color: #be6700; /* darken */
	border-bottom-color: #ffa500 /* #f1ab51 */ /* #db932a */;
}
.mCM_embed_link { /* INSIDE ext link */
	text-transform: uppercase;
	font-size: 15px;
}

/* lump all "smaller than usual" here */

.notes,
table.mCM_WIK_fn {
	font-size: 15px;
}
.lastupdated {
	font-size: 13px;
	font-style: italic;
	color: #666;
}

/* headings */

/* only one h1 per page, no top margin, under search box */
h1 { margin-top: 0 !important; }
h1, h2, h3, h4, h5, h6 {
	/* font-family: Verdana, Calibri, Arial, Helvetica, sans-serif; */ font-weight: normal;
}
.content h1 { color: #45505b; font-size: 24px; margin: 10px 0 12px 0;
	text-shadow: 3px 3px 6px rgba(0,0,0,0.3); }
.content h2 { color: #45505b; font-size: 21px; 
	text-shadow: 3px 3px 6px rgba(0,0,0,0.3); } /* head still around in old mailers */
.content h3 { color: #45505b; font-size: 18px; 
	text-shadow: 3px 3px 6px rgba(0,0,0,0.3); }
.content  h1 .sub, .content  h1.subtitle, h2.subtitle  { display: block; font-weight: normal; font-style: italic; font-size: 19px; border-top: #45505b 2px solid; margin-top: 5px; padding-top: 3px;
text-shadow: none; }

blockquote {
	background-color: #f0f0f0;
	padding: 2px 16px 4px 16px;
	margin: 8px 0;
} 
/*
 * FACEBOOK
 */
a.fblink { /* on home page */
	font-size: 14px;
	text-decoration: none;
	display: block;
	text-align: center;
	padding: 6px;
	line-height: 135%;
	color: #303030;
	margin: 9px 5px 0 5px;
}
a.fblink:hover {
	background: gold;
	padding: 5px;
	border: 1px #606060 dotted;
}
span.mCM_FB_name { display:block; font-weight: bold; margin-bottom: .2em; text-align: center; padding-right: .5em; /*center*/}
span.mCM_FB_start_time,
span.mCM_FB_end_time  { display:block; text-align: center; font-style: italic; }
span.mCM_FB_place  {
	display:block;
	text-align: left;
	font-style: italic;
	border-top: 1pt dotted #808080;
	padding-top: .2em;
	margin-top: .4em; } /* place fields container */
.sidebar 	span.mCM_FB_place  { border-top: 1pt dotted #d0d0d0; }
span.mCM_FB_place_name,
span.mCM_FB_place_location_street,
span.mCM_FB_place_location_city,
span.mCM_FB_place_location_state,
span.mCM_FB_place_location_zip,
span.mCM_FB_place_location_country { }
span.mCM_FB_place_location_latitude,
span.mCM_FB_place_location_longitude,
span.mCM_FB_place_id { display: none; }
/* span.mCM_FB_link */
span.mCM_FB_picture img {
	border: 1pt solid #606060;
	display: block;
	max-height: 120px;
	max-width: 120px;
}
span.mCM_FB_picture.mCM_FB_LEFT img {
	display: block;
	float: left;
	margin: .4em .8em .5em 0;
}
span.mCM_FB_picture.mCM_FB_RIGHT {
	display: block;
	float: left;
	margin: .4em 0 .8em .8em;
}
span.mCM_FB_picture.mCM_FB_CENTER,
span.mCM_FB_picture.mCM_FB_DEFAULT {
	display: block;
	float: left; 
	margin: .4em auto .8em auto;
} 
/* span.mCM_FB_picture a */
span.mCM_FB_description  {
	display:block;
	text-align: left;
	font-style: italic; /* so not the same as message if both present */
}
span.mCM_FB_message  {
	display:block;
	text-align: left;
}
/* span.mCM_FB_updated_time */
/* span.mCM_FB_created_time */
span.mCM_FB_date {
	display: block;
	color: #505050;
	font-size: 80%;
	padding: .25em 0;
	text-align: center;
	}
a.mCM_FB_id { /* function populates FB icon and adds "dim" class */
	display: block;
	float: right;
	text-decoration: none;
}
span.mCM_FB_unhandled { display:block; text-align: center; font-style: italic; color: blue; }
span.mCM_FB_debug {
	display:block;
	text-align: left;
	color: black;
	background-color: orange; 
	margin: .25em 0;
	padding: 1em; .5em;
}
/* span.mCM_FB_debug { display: none; } */

/* youtube */

.video-container {
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
	margin: 1em 0;
	height:0;
	overflow:hidden;
}
.video-container iframe, .video-container object, .video-container embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
/*
 * BTN BUTTON STYLE FOR NAVIGATION
 */

.mCM_btn, .mCM_btn a, .transbar a.goog-te-gadget-link, button, #topBtn {
	font-family: Verdana, Calibri, Arial, Helvetica, sans-serif;
	font-size: 16px;
	display: inline-block;
  font-weight: normal !important; /* for google xlate */ 
  background: #eeeeee;
  background-image: -webkit-linear-gradient(top, #fefefe, #ededed);
  background-image: -moz-linear-gradient(top, #fefefe, #ededed);
  background-image: -ms-linear-gradient(top, #fefefe, #ededed);
  background-image: -o-linear-gradient(top, #fefefe, #ededed);
  background-image: linear-gradient(to bottom, #fefefe, #ededed);
  -webkit-border-radius: 3;
  -moz-border-radius: 3;
  border-radius: 3px;
  color: #333;
  border: solid #a0a0a0 1px;
  text-decoration: none;
  /* OURS... */
  /* display: inline-block; */
  padding: 0 7px;
  margin: 0 5px 8px 0;
  white-space: nowrap;
}
button.mCM_btn { padding: .15em .6em .2em .6em; } /* our button border is 1, pre-def button's may be 2px */

.mCM_items .menu, .mCM_items .long { display: none; }
.mCM_next { text-decoration: none !important; }
.mCM_next:after { content:"►"; }
a .mCM_next :hover { background-color: orange; color: black; text-decoration: none !important; }

.mCM_btn .sidemenu { display: inline-block; }

.mCM_btn.mCM_active {
  background: #4e6172;
  background-image: -webkit-linear-gradient(top, #606080, #4e6172);
  background-image: -moz-linear-gradient(top, #606080, #4e6172);
  background-image: -ms-linear-gradient(top, #606080, #4e6172);
  background-image: -o-linear-gradient(top, #606080, #4e6172);
  background-image: linear-gradient(to bottom, #606080, #4e6172);
  color: #ffffff !important;
  border-color: #303030;
}

a.mCM_btn:hover, /* .mCM_btn:hover,*/ .transbar a.goog-te-gadget-link:hover, #topBtn:hover {
  border-color: #000000;
  color: #000000;
  background: #e5ce7d;
  background-image: -webkit-linear-gradient(top, #fff7ac, #e5ce7d);
  background-image: -moz-linear-gradient(top, #fff7ac, #e5ce7d);
  background-image: -ms-linear-gradient(top, #ffe79c, #e5ce7d);
  background-image: -o-linear-gradient(top, #ffe79c, #e5ce7d);
  background-image: linear-gradient(to bottom, #ffe79c, #e5ce7d);
}
.mCM_btn .mCM_next { /* if we find ourselves inside a button, behave like (lighter) text */
	background: none;
	color: #808080;
	font-size: 80%;
	padding-right: 2px;
}
a.mCM_btn:hover .mCM_next {
	background: none;
	color: #000000;
}

#topBtn {
    display: none; /* Hidden by default */
    position: fixed; /* Fixed/sticky position */
    bottom: 50px; /* Place the button at the bottom of the page */
    right: 10px; /* Place the button 30px from the right */
    z-index: 99; /* Make sure it does not overlap */
    cursor: pointer; /* Add a mouse pointer on hover */
    font-size: 18px; /* Increase font size */
}

.constrain {
	width: 800px;
}
.content { margin-bottom: 0; }
.sitetrailer {
	max-width: 100%;
	background: rgba( 0,0,0,0.6);
	color: #aaa;
	margin: 0;
	font-size: 14px;
	padding: 5px 12px;
	overflow: auto;
}
.sitetrailer p {
	margin: 2px 0;
}
.pagenav {
	clear: both;
	border-top: 1px #aaa solid;
	margin: 10px 0 0 0;
	padding: 6px 0 15px 0;
	font-family: Verdana, Calibri, Arial, Helvetica, sans-serif;
	text-align: center;
}
.pagenav ul {
	list-style-type: square;
	padding-left: 20px;
	margin: 0;
}
.pagenav li {
	margin-top: 0;
	margin-bottom: 0;
}
.pagenav a .mCM_next {
	background: rgb(219, 222, 224);
	padding: 0 6px;
	margin-right: 6px;
	color: #666;
	font-size: 15px;
}
.pure-menu-item {
	border: none;
}

.interior {
	padding: 6px 12px 2px 12px;
	background-color: #f0f0f0;
	border: 1px solid #d0d0d0;
}
.interior {
	margin: 4px;
}
.interior *:first-child {
	padding-top: 0;
	margin-top: 0;
}
.interior.white {
	background-color: #ffffff;
}

@media ( max-width: 550px ) {
	/* responsive 2-col table */
	TABLE.stackem TD.mCM_qt_col1 { box-sizing: border-box; display: block; float: left; width: 100%; }
	TABLE.stackem TD.mCM_qt_col2 { box-sizing: border-box; display: block; float: right; width: 100%; padding-left: 2em; }
	TABLE.stackem TD.mCM_qt_head1 { box-sizing: border-box; display: block; float: left; width: 100%; }
	TABLE.stackem TD.mCM_qt_head2 { box-sizing: border-box; display: block; float: right; width: 100%; padding-left: 2em; border-left: none !important;}
}
TABLE.poetry TD {
	background: transparent !important;
	font-style: normal !important;
	text-indent: -12px;
	padding-left: 12px;
}
TD.half { height: 12px !important; line-height: 12px !important; }
TD.twoem { padding-left: 24px !important; }
TABLE.mCM_qt_CINITIS.stackem TABLE.poetry  TD.twoem { padding-left: 36px !important; }
TD.center { text-align: center !important; }
TD.minimize { width: 1% !important; } /* as a table cell, will get expanded to minimum needed */
TD.plain { border: none !important; }
TD.left { text-align: left !important; }
TD.right { text-align: right !important; }
TABLE.poetry { margin-bottom: 1em !important; }

.mb0 { margin-bottom: 0; }
.mt0 { margin-top: 0; }

/* shrink addthis buttons */
.at-style-responsive .at-share-btn {
	padding: 0px !important;
}
.lb-caption {
	padding-bottom: 4px;
}
.gsc-search-button-v2 {
  background: #555 !important;
}
.content p, .content ul, .content ol, .content blockquote, .content h2, .content h3, .content h4, .content h5, .content h6  { margin-top: .3em; margin-bottom: .3em; }
.content p { text-indent: 1.5em; }
.content p:first-of-type, .content h2 > p { text-indent: 0; }
.content h2:first-of-type p:first-of-type:first-letter { font-size: 30px !important; display: block; float: left; margin: -6px 4px 0 0; }
.content ul { list-style-type: square; padding-left: 20px; }
.content ul li { margin-left: 0; }
p.i0, .i0 { text-indent: 0 }
em { font-weight: bold; font-style: normal; border-bottom: 2px solid; color: #000000; }


