/* Import the Google Fonts font used for this site. */
@import url('https://fonts.googleapis.com/css2?family=Arimo:ital,wght@0,400..700;1,400..700&family=Bitter:ital,wght@0,100..900;1,100..900&display=swap');

/* Commands in this section affect all elements on the page. */
* {
	font-family: "Arimo", sans-serif;
}

body {
	font-size: 18px;
	/* Force the inherited margin to overwrite.	*/
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
}

h1, h2, h3, h4, h5, h6 { /* Section headers. */
	color: #333;
	font-family: "Bitter", sans-serif;
}

.no-overlap {
	height:auto;
	overflow:auto;
}

.image-column {
  float: left;
  width: 32.1%;
  padding: 5px;
}

.image-row::after {
  content: "";
  clear: both;
  display: table;
}

.gray-indent { /* This is for italiziced, lighter date entries.. */
	color: #858585;
	font-style: italic;
	text-indent: 1em;
}

.gray-indent-small { /* This is for italiziced, lighter date entries.. */
	color: #858585;
	font-size: 12px;
	font-style: italic;
	text-indent: 1em;
}

.quote-bubble {
	color: #0020b2;
	font-style: italic;
	padding: 10px;
	border-radius: 20px;
	background-color: #dee2f2;
	/*background-color: #ECECEC;*/
}

.image-center { /* Images that need to be centered. */
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.section-content { /* Pretty much everything under the navbar. */
	padding-left: calc((100% - 900px)/2 + 1rem);
	padding-right: calc((100% - 900px)/2 + 1rem);
}

.section-content-para { /* This is for indented paragraphs. */
	line-height: 1.3;
	text-indent: 2em; /* or 15px, or 5%, 2rem or 3vw */
}

/* This is for the nav-bar background. */
ul {
	/* Make the header stay with scroll. */
	position: sticky;
	top: 0;
	z-index: 999;
	
	padding-left: calc((100% - 900px)/2 + 1rem);
	margin-top: 0px;
	list-style-type: none;
	overflow: hidden;
	background-color: #333;
}

/* This is for the bottom footer bar. */
footer {
	background-color: #333;
	color: white;
	display: flex;
	font-weight: 500;
	font-size: 16px;
	justify-content: center;
	text-align: center;
	margin-bottom: -8px; /* There's some margin being inherited wrongly here. This fixes it. */
}

/* This is for the navbar text. */
.navbar a {
	color: white;
	display: inline; /* "inline" removes line breaks after each list item. */
	float: left;
	font-family: "Bitter", sans-serif;
	font-weight: 500;
	font-size: 16px;
	padding: 14px 16px;
	text-decoration: none;
	text-align: center;
}

/* This is for hovered-over navbar text. */
.navbar a:hover{
	background-color: #111;
}