/* styles for re-engineer with PURE 0.6.2 horizontal-to-vertical flip

	because there is one side menu sheet for most cases and a separate style sheet for
	IE version 8 and earlier, we put all over-rides here
*/
	
/*===== pure menu over-rides =====*/

	#menu {
		background-color: HSLa( 250, 100%, 25%, 0.1 );
		text-align: center;
		line-height: 120%;
	}
/*   #menu .pure-menu-selected {
        background: #800000;
	}
        #menu .pure-menu-selected a { 
            color: #fff;
        }
        #menu .mCM_active.pure-menu-link,
        #menu .mCM_active.pure-menu-link:hover { 
				background: #800000;
           color: #ccc;
        }
		  #menu .mCM_active {
			  padding: 0;
			  text-align: left;
		  }
*/
/*	#menu .pure-menu ul {
		background-color: #ffffff;
	}
*/
/*	#menu a {
		color: #444;
		padding: .25em .6em .4em .6em;
		text-align: left;
	}
*/
/*
	#menu a.custom-brand:hover,
	#menu a.custom-toggle:hover { background-color: transparent; }
	#menu .pure-menu-item { padding-left: 0; padding-right: 0; }
*/

/*===== (other) miniCM styles and templates =====*/

.figure_center,
.mCM_frame,
.mCM_caption {
	display: block;
	margin: 1em auto;
	font-size: 85%;
	line-height: 135%;
	text-align: center;
	max-width: 100%;
	font-style: italic;
}
.mCM_caption .nocaption {
	display: none;
}
.mCM_navigate {
	display: block;
	padding: 0 0 .5em 0;
	text-align: center;
}

.figure_left,
.figure_right {
	display: block;
	font-size: 85%;
	line-height: 135%;
	text-align: center;
	float: left;
	max-width: 100%;
	box-sizing: border-box;
	font-style: italic;
}
.figure_left {
	margin: 1em 1.5em 1em 0;
	float: right;
}
.figure_right {
	margin: 1em 0 1em 1.5em;
	float: right;
}
.figure_center {
	margin: 1em auto !important;
	text-align: center;
}

.stack_right {
	clear: right;
}
.stack_left {
	clear: left;
}
.stack {
	clear: both;
}

img.figure {
	padding: 0;
	margin: 0 0 4px 0;
	border: 1px #606060 solid;
	display: block;
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
}
.noborder img.figure{
	border: none;
}

.mCM_thumbnails_caption a:hover,
a .dim:hover { 
	opacity: 0.7;
	filter: alpha(opacity=70); /* For IE8 and earlier */
}

.mCM_WIK_link {
	color: navy;
	text-decoration: none;
	border: 1px navy dotted;
	padding: 0 .125em;
}
.content a:hover {
	background-color: #FFFFCC;
}
.content a.mCM_WIK_link:hover {
	background-color: #F0F0F0;
}

.mCM_WIK_fn TD,
.mCM_WIK_fn TD p,
.mCM_WIK_fn TD ol,
.mCM_WIK_fn TD ul  {
	font-size: 8.5pt;
	vertical-align: top;
}
a.mCM_WIK_fn {
	text-decoration:none;
}
hr.mCM_WIK_fnsep {
	width: 33%;
}

/*===== SITE SPECIFIC content and pure content over-ride styles =====*/

body {
	background-image:url('../graphics/stripe-back.png');
	background-repeat: repeat;
}
body, html, blockquote, p, td, ul, ol, .content {
	font-family:Verdana, Arial, serif; font-size: 14pt; line-height: 155%;
}
ul {
	list-style-type:square;
}
sub,
sup,
a.mCM_WIK_fn,
td.mCM_WIK_fnnum a {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup,
a.mCM_WIK_fn  {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}

#botswoop {
	height: 20px;
	background-color: #d2d2d2;
	border-bottom-left-radius: 20px;
	-webkit-border-bottom-left-radius: 20px;
	-moz-border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
	-webkit-border-bottom-right-radius: 20px;
	-moz-border-bottom-right-radius: 20px;	
}

.centered {
	margin: .5em auto;
	max-width: 50em; /* tune to about 800 wide based on font size */
	box-sizing: border-box;
}
.open .centered {
	margin-top: 0;
}
	.content {
		box-sizing: border-box;
		padding: .25em 1em;
		background-color: #ffffff;
		color: #000000;
		border: 1pt #c0c0c0 solid;
	}

		.content b {
			color: #800000;
		}
		.content blockquote {
			border-bottom: 1px solid #c0c0c0;
			border-right: 1px solid #c0c0c0;
			border-top: 1px solid #c0c0c0;
			margin: 1em;
			padding: .8em .8em .8em 0;
		}
	div.sitetrailer {
		font-size: 9pt;
		color: #606060;
		padding: .5em 1em;
		line-height: 130%;
	}
.pagenav {
	text-align: center;
	margin-bottom: .5em;
}
	.pagenav .mCM_items nobr a,
	.pagenav .mCM_items nobr .mCM_active { 
		padding: .2em .5em .4em .5em;
		background-color: #ffffff;
		color: #555;
		text-decoration: none;
	}
	.pagenav .mCM_items nobr .mCM_active {
		background-color: #800000;
		color: #d2d2d2;
	}
	.pagenav .mCM_items nobr a:hover {
		background-color: #555;
		color: #d2d2d2;
	}


/*
 * gallery processing
 */
.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 {
}

.mCM_thumbnails_caption {
	font-size: 85%;
	display: inline-block;
	vertical-align: top;
	padding: .5em 1em;
	line-height: 130%;
	vertical-align: top;
	color: #808080;
}
.mCM_thumbnails_caption a:hover {
	background-color: #f0f0f0;
}

.mCM_thumbnails_caption IMG {
	border: .125em #606060 solid;
	box-shadow: 7px 3px 7px #bbbbbb;
	margin-bottom: .5em;
	background-color: transparent;
}
.mCM_thumbnails_caption p {
	margin: 0 !important;
	padding-top: 1em;
}

.mCM_caption .hidep { display: none; }

.mCM_thumbnails .mCM_1up {
	width: 100%; border: 1pt dotted #e0e0e0;
	box-sizing: border-box;
	background-color: #f8f8f8;
	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 0 .5em 0;
	max-width: 100%;
}
.mCM_thumbnails .mCM_1up_desc {
	display: table-cell;
	width: 85%;
	padding-left: 2em;
}

.lastupdated {
	color: #808080;
	font-style: italic;
	font-size: 90%;
}
blockquote, h1, h2 {
	overflow: hidden;
} 

.medal {
	position: absolute; left: 5%; top: 50px; z-index: -1; width: 168px; height: 100%;
   background-image: url(../graphics/com1929bannerv2-70pct-nostripes.gif); background-repeat: no-repeat;
   opacity: 0.3; filter: alpha(opacity=30);
}
.medal:hover { opacity: 1.0; filter: alpha(opacity=100); }

DIV.twoup { line-height: 150%; box-sizing: border-box; width: 100%; }
DIV.threeup { 	box-sizing: border-box;float: left; width: 100%; }
DIV.rightifroom { display: none; }
DIV.rightpad, DIV.verso { padding-right: 0; }
DIV.leftpad, DIV.recto  { padding-left: 0;  }

/* KRISSY */

@font-face {
    font-family: KrissyFont;
    src: url(krissy.ttf);
}
h1 { font-family:KrissyFont; font-size: 28pt; color: #a86daf; line-height: 28pt; }

div.custom-wrapper { box-sizing:border-box; height: auto; }
div.custom-wrapper img { display: block; }
#menu li.pure-menu-item { padding: 0 !important; margin: 0 !important; box-sizing:border-box; float:left;}
#menu li.pure-menu-item a.pure-menu-link,
#menu li.pure-menu-item .mCM_active { padding: 0 6pt 3pt 6pt; margin: 0 2pt;
  border: 1.5pt solid transparent;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
}
#menu ul { margin: auto; color: #ffffff; font-size: 20pt; font-family:KrissyFont;}
#menu ul a,
#menu ul .mCM_active { color: #ffffff; text-shadow:
    2px 2px 0 #a86daf /*#ec008c*/,
    /* Simulated effect for Firefox and Opera
       and nice enhancement for WebKit */
   -1px -1px 0 #ec008c,  
    1px -1px 0 #ec008c,
   -1px  1px 0 #ec008c,
    1px  1px 0 #ec008c;
}

#menu li.pure-menu-item a.pure-menu-link:hover { border-color: #ec008c;
  background-color: #662d91; }
#menu li.pure-menu-item .mCM_active {  background-color: #ec008c; border-color: #ffffff;}
.homebutton { float:left; padding: 10px 0 0 10px; }
.homebutton a:hover { 	opacity: 0.5;
	filter: alpha(opacity=50); /* For IE8 and earlier */
}
.nopad figure_center,
.nopad figure_left,
.nopad figure_right {
	padding: 0;
}
.mCM_el1 > .mCM_active { display: none; }
div.content { border: 2pt solid #a86daf;	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	margin-bottom: .5em; 
}

@media (min-width: 60em) {
	DIV.rightpad, DIV.verso { padding-right: .5em; }
	DIV.leftpad, DIV.recto  { padding-left: .5em;  }
	DIV.twoup { width: 50%; float: left; }
	DIV.threeup { width: 33%;}
	DIV.rightifroom { /* right if room */
		display: block;
		float: right;
		width: 33%;
		margin-left: 1.5em;
	}
	.content { padding: .5em 2em; }
}

/* twitter cleanup */
.timeline-Header-title { display: none; }