/*@import url('https://fonts.googleapis.com/css?family=Yellowtail');*/
@charset "utf-8";
/* CSS Document */
		h1 { display:inline;}
		#smallMenu {text-align:center; max-width:98%; margin:auto;}
		body { /*max-width: 1100px;*/ }
	body {
	font-size: 17px; /*100%;*/
	font-family: Calibri, Verdana, Tahoma, Arial, Geneva, Helvetica, sans-serif;
	/*font-family: 'Yellowtail', cursive;*/
	/*background-color: #FFFFCC;*/
	width:100%;
    max-width: 880px;
    margin-left: auto;
    margin-right: auto;
	background-color: #306FB5; 
	color: #000;
	  line-height: 1.4em;
	  display:block; /* DO NOT CHANGE!!!! */
	}
	.nameLink { font-weight:bold;  font-size:15px; }

	.peopleBody {max-width:800px; margin-left:auto; margin-right:auto;  padding: 4px; border-radius: 8px; border:  3px groove;}
	.peopleMain {max-width:550px; margin-left:auto; margin-right:auto;   /*display: inline-block;border: red 1px dotted;*/}
	.peopleMainLarge {max-width:800px; margin-left:auto; margin-right:auto; /*border: red 1px dotted;display: inline-block;*/}
	
div.peopleMainLarge table { margin-left:auto; margin-right:auto; max-width:550px;}	
div.peopleMainLarge hr { margin-left:auto; margin-right:auto; max-width:550px;}	
	.peopleMain p, .peopleMainLarge p, .peopleMain ul, .peopleMainLarge ul, .peopleMainLarge h2 h3 {max-width:550px; color:black; margin-left:auto; margin-right:auto;}
	
		.peopleMain img {max-width:800px; height:auto; display:block; margin-left:auto; margin-right:auto;}

	
	.peopleMainLarge img {max-width:100%; height:auto; display:block; margin-left:auto; margin-right:auto;}
	@media screen and (max-width: 550px) {
			.peopleMain img {max-width:100%; height:auto;}
		}
	.TopMargin2 {margin-top:2px;}
	
	input.gsc-search-button.gsc-search-button-v2 {height: auto; width:auto; }
	a { text-decoration:none; font-weight:bold;
	}
	A:link { text-decoration: none;
		color: #800000;
	}
	A:visited { text-decoration: none;
		color: #800080; }
	
	A:active {text-decoration: none;
		color: #000080;}
	
	A.subHeadLink {
		font-family: Georgia, "'times new roman'", Times, serif;
		font-weight:normal;
		text-decoration:underline;
		}
		
	#archiveImages {display:table-cell;height:61px; padding-left:8px;}	
		
	h2 { line-height: normal; -webkit-margin-before: 0.25em; }
	
	.bodyText { font-size: 16px; font-weight:normal; }
	.bodySmall { font-size: 14px; font-weight:normal; }
	
	.captionCtr {font-size: 16px; font-weight:normal; padding:0; margin-top:4px; margin-bottom:20px; text-align:center; }
	.captionSmall {font-size: 14px; font-weight:normal; padding:0; margin-top:2px; margin-bottom:14px; text-align:center;}
	.clear-line {clear:both; margin:0; line-height:2px; }
	.flex-container {
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  padding-top:12px;
	}
	
	.flex-item-left {
	  width:183px; height:325px;
	}
	
	.flex-item-right {
	  width:200px; height:325px; padding-left:10px;
	}
		
	.limitWidth { max-width:500px; margin-left: auto; margin-right: auto;  }
	
	.subHead {
		font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
		font-size:0.9rem;
		/*font-weight:bold;*/
	}
	.subHeadBox { border: #EEE 3px groove; padding: 4px; border-radius: 8px; }
	.imgLeft {
		clear: right;
		float: left;
		padding-bottom: 1em;
		padding-right: 1em; }
		
	.img2div {text-align:center;}
	.img2ctr {display: inline-block !important; margin-left: auto; margin-right: auto; height: auto;}
	.img-ctr { display: block;  margin-left: auto;  margin-right: auto;  /*width: 50%;*/}

	.img-left {float:left; margin-right:8px !important;}
	
		/* Style the modals and their contents */
		.modal {
		  display: none; /* Hidden by default */
		  position: fixed; /* Stay in place */
		  z-index: 1; /* Sit on top */
		  left: 0;
		  top: 0;
		  width: 100%; /* Full width */
		  height: 100%; /* Full height */
		  overflow: auto; /* Enable scroll if needed */
		  background-color: rgba(0, 0, 0, 0.4); /* Black w/ opacity */
		}
		
		.modal-content {
		  background-color: #fff;
		  margin: 15% auto; /* 15% from the top and centered */
		  padding: 20px;
		  border: 1px solid #888;
		  width: 80%; /* Could be more or less, depending on your needs */
		}
		
		/* The Close Button */
		.close {
		  color: #aaa;
		  float: right;
		  font-size: 40px;
		  font-weight: bold;
		}
		
		.close:hover,
		.close:focus {
		  color: black;
		  text-decoration: none;
		  cursor: pointer;
		}
	
	
	
	.text-right {
    text-align: left;
    
    /*clear: left;
    float: right;
    margin-bottom: 1em;
    margin-right: 1em;font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;*/}
	
	#bottomContainer {
	clear:both;
	max-width: 800px;
	width: 100vw;
	text-align:left;
	border-left: black 1px solid;
	border-right: black 1px solid;
	border-bottom:black 1px solid;
	padding: 16px;
	font-size:13px;
	}
	#top { border: black 1px solid; display:flex; max-width:800px;}
	
	.extraContainer {
		clear:both;
		max-width: 920px;
		padding:0 150px;
		width: 100vw; 
		border-left: black 1px solid; 
		border-right: black 1px solid; border-bottom:black 1px solid;
	}
	#mainContainer {display: flex; background-color: #99d1f2; max-width:800px;/* equal height of the children */}
	#leftContainer {
	  flex: 1; /* additionally, equal width */
	  padding: 1em;
		border-left: black 1px solid;
		border-bottom:black 1px solid; 
	}

	#rightContainer{
	  flex: 1; /* additionally, equal width */
	  padding: 1em;
		border-left: black 1px solid;
		border-right: black 1px solid; 
		border-bottom:black 1px solid;
		}
	
	.padRight { margin-right: 8px; }
	p.serif, div.serif {font-family: Georgia, "'times new roman'", Times, serif; padding-left:40px; display: block;}
	span.serif {font-family: Georgia, "'times new roman'", Times, serif; padding-left:40px; display: inline-block;}
	
	.menuBtn {
	  /*background-color: #4CAF50;
	  border: none;
	  color: white;
	  padding: 15px 25px;*/
	  padding:0 4px; margin:0; border:none;
	  text-align: center;
	  font-size: 12px;
	  cursor: pointer;
	  height: 32px;
	  border-radius: 12px;
	}
	
	.menuBtn:hover {
	  background-color: green;
	}

	
	
	#main { display:block; clear:both; }
	.headerAll .menuContainer { width: 100%; }
	#headerTop { display: flex; flex-wrap: wrap; }  
	.header_logo { width: 100%; margin: 10px auto;}
	.header_text { width: 660px; padding: 10px 0;}
	.header1 { font-size: 1.8em; color: #039; }
	#searchScript { text-align:center; width:300px; }

	@media screen and (max-width: 400px) {	
	  .limitWidth { max-width:100vw; }
	}
	
	#flexContainer {display:flex; flex-flow: column wrap; justify-content: space-around; align-content:flex-start; flex-shrink:0; flex-grow:1; height:230px;}
			
		
	#archival {max-width:618px; height:auto; margin-left:0px;}
	#searches {min-width:300px; max-width:438px; height:auto; min-height:126px; text-align:center; margin-left:60px;}
	
	
	/* SMALL SCREENS */
	@media screen and (max-width: 799px) {
		body {width: 98%; font-size:18px;}
		#flexContainer { height:2px;}
	  .headerAll .menuContainer { width: 100%; }
	
	.header_logo { display:none;}
	.header_text { width: 100%; padding: 2px; }
	#leftContainer, #rightContainer { width: 100%; border-right: black 1px solid; }
	.row, #mainContainer {display: block;}
	.largeOnly { display:none;}
	.searchCell { text-align:center; }
	#searchScript { width: 98%; margin:auto; }
	} /*END @media screen and (max-width: 768px)*/
	
	/*from style.css*/
	*, *:before, *:after {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box; }

/*css-tricks.com/rem-global-em-local */
	@media screen and (min-width: 900px) {
		font-size: 18px;
	  }
    
	  @media screen and (min-width: 1200px) {
		font-size: 20px;
		  }
		h2 { 
		  font-size: 2em;
			}
		
		pre {
		  font-size: 0.8em;
		}
	
		.module {
		  font-size: 1.1rem;
		}
		
		.another-module {
		  font-size: 1.3rem;
		}
/* END css-tricks.com/rem-global-em-local */
