/* version 7:56 AM 2/4/2026 */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,200..700;1,200..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,200..700;1,200..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Aboreto&display=swap');

/* RESET */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, 
audio, canvas, video {display: inline-block; *display: inline; *zoom: 1;}
audio:not([controls]) {display: none;}
button, input {line-height: normal; *overflow: visible;}
button, input, select, textarea {font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle;}
button, input[type="button"], input[type="reset"], input[type="submit"] {cursor: pointer; -webkit-appearance: button;}
button::-moz-focus-inner, input::-moz-focus-inner {border: 0; padding: 0;}
form{margin:0}
fieldset{border:0; margin:0; padding:0}
:hover, :focus, :active {outline: none;}
html {font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}
img {border: 0;-ms-interpolation-mode: bicubic;vertical-align: middle;}
input[type="checkbox"], input[type="radio"]{box-sizing:border-box}
input[type="search"]{-webkit-appearance:textfield; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; box-sizing:content-box}
input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}
label{cursor:pointer}
pre, code, kbd, samp{font-family:monospace,monospace; _font-family:'courier new',monospace; font-size:1em}
section {display: block;}
table, tbody, tfoot, thead, tr, th, td {margin: 0; font-size: 100%;}
table {border-collapse: collapse; border-spacing: 0;}
td {vertical-align: top;}
table button, table input {*overflow: auto;}
textarea {overflow: auto; vertical-align: top; resize: vertical;}
/* end RESET */

a {
	color: #395789;
	font-weight: normal;
	cursor: pointer; 
	text-decoration: none;
	transition:color 0.2s ease;
	-moz-transition: color 0.2s ease;
	-webkit-transition: color 0.2s ease;
	-o-transition: color 0.2s ease;}

a:hover {
	color: #1E3163;
	text-decoration: none;
	background: none;}

a:active, a:focus {
	position: relative;
	/-- top: 1px; --?}

a:visited {
	color: #567DAC;
	opacity: 0.9;}

a.link, ul.link a {
	font-style: italic;}

abbr[title] {
	border-bottom: 1px dotted;}

.allcaps {
	text-decoration: underline;
	text-transform: uppercase;}

aside {
	padding-bottom: 2em;}

aside p {
	line-height: 1.5em;
	font-family: "Noto Sans", Tahoma, Verdana, sans-serif;
	font-weight: 400;
	font-size: 1.0em;
	color: #6C6D6E;}

.attribution, attribution {
	font-family: "Noto Sans";
	font-size: 0.85em;
	color: #919295;}

.attribution .name {
	color: #373737;}

.attribution .date {
	color: #6C6D6E;}

.attribution .readtime {
	color: #C0C0C2;}

b, strong {
	font-weight: 600;
	color: #565656;}

.background2 {
	background-color: rgba(218, 218, 219, 0.2);
	padding: 0 1em 0 1em;
	margin: 0 0 -1em -1em;}

body {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;}

body.narrow {
	width: 90%;
	margin-left: 5%;}

body.narrow2 {
	width: 80%;
	margin-left: 10%;}


/* BLOCKQUOTES and Quotes */
blockquote {
	margin: 1em 1em 1em 0;
	padding: 1em;
	border-left: 1px solid #C0C0C2;
	font-family: "Noto Sans", Tahoma, Verdana, sans-serif;
	font-weight: 400;
	font-style: italic;
	color: #919295;}

blockquote p {
	font-size: 1.0em;
	line-height: 2em;
	margin-bottom: 0;}

blockquote.scripture {
	background-color: none;
	position: relative;
	width: 80%;
	margin: 1em auto;
	border-left: none; /* or 1px solid #C0C0C2 */
	font-style: initial;
	color: #919295;}

blockquote.scripture::before {
	position: absolute;
	top: -0.34em;
	left: -0.34em;
	font-family: "Courier New";
	font-size: 6em;
	background: none;
	content: '"'; /* Left '“', straight '"', right '”' or reversed '‟' */
	color: rgb(86, 125, 172, 25%);} /* alternate content "\201C" */

blockquote .verse {
	font-family: "Noto Sans", Tahoma, Verdana, sans-serif;
	font-weight: 500;
	font-style: regular;
	color: #395789;}

q {
	quotes: none;}

q:before, q:after {
	content: "";
	content: none;}

.scripture {
	color: #919295;}

.verse {
	background: none;
	font-family: "Noto Sans", Tahoma, Verdana, sans-serif;
	font-weight: 400;
	font-style: normal;
	color: #395789; /* white-space: nowrap; */}
/* end BLOCKQUOTES and Quotes */


.box {
	border-radius: 0.375em;
	border: solid 1px rgba(192, 192, 194, 0.75);
	margin-left: 3em;
	padding: 0.25em;}

.box > :last-child, .box > :last-child > :last-child, .box > :last-child > :last-child > :last-child {
	margin-bottom: 0;}

.box.alt {
	display: inline-box;
	border: solid 1px rgba(192, 192, 194, 0.75);
	border-radius: 0;
	padding: 0.5em;
	margin-left: 3em;
	margin-right: -3em;}


/* BUTTONS */
button, .button, input[type="submit"] {
	color: #395789;
	font-family: "Noto Sans", Tahoma, Verdana, sans-serif;
	font-size: 1em;
	font-weight: normal;
	margin-bottom: 1.5em;
	margin-left: 0;
	padding: 0.6em 1.2em;
	text-shadow: none;
	text-decoration: none;
	border: solid 1px #567DAC;
	background: #FFFFFF;
	cursor: pointer;

	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	-ms-border-radius: 2px;
	-o-border-radius: 2px;
	-khtml-border-radius: 2px;
	border-radius: 4px 0;

	-webkit-transition: 0.1s linear all;
	-moz-transition: 0.1s linear all;
	-ms-transition: 0.1s linear all;
	-o-transition: 0.1s linear all;
	transition: 0.1s linear all;}

button:hover, .button:hover, input[type="submit"]:hover {
	color: #373737;
	text-decoration: none;
	border-color: #C0C0C2;
	background: 0 100%;}
	
button:focus, .button:focus, input[type="submit"]:focus {
	color: #373737;
	border-color: #C0C0C2;}
	
button:active, .button:active, input[type="submit"]:active {
	color: #373737;
	background: #EFEFEF;
	border-color: #565656;
	position: relative;}

button.symbol img {
	width: 1.4em;
	height: auto;
	border-radius: 0 0;
	margin: -0.4em 0 -0.4em 1em;}

button2, .button2 {
	font-family: "Noto Sans", Tahoma, Verdana, sans-serif;
	background: #395789;
	margin-bottom: 1.5em;}

.button2 a {
	color: #FFFFFF;}

.button2:hover {
	background: rgba(57, 87, 137, 0.85);}
/* end BUTTONS */


/* COLORS Morning rain palette #21 by www.macaronsandmimosas.com */
.color1 {
	background: #F0E5D7} /* canvas */

.color2 {
	background: #C7CBBD;} /* tan */

.color3 {
	background: #C5D7D1;} /* greenish */

.color4 {
	background: #FAEDCD;} /* yellow */

.color5 {
	background: #F1B3A1;} /* salmon */

.color6 {
	background: #9FAEA9;} /* dark green */

.color7 {
	background: #B4C9DD;} /* blueish */

.color8 {
	background: #395789;} /* med blue */

.color9 {
	background: #1E3163;} /* dark blue */
/* end COLORS */


/* DATACLASS inserts different content defined by .data-class in the html doc, data-class="@" or 𝅘𝅥𝅮 𝅘𝅥𝅯 𝅘𝅥𝅰 𝄞 or "whatever" */
.data-class {
	display: block;
	font-size: 1em;
	font-style: none;
	padding: 0;
	margin: 0;}

blockquote.anyquote { /* or? blockquote.anyquote */
	background-color: none;
	position: relative;
	width: 80%;
	margin: 1em auto;
	border-left: none; /* or 1px solid #C0C0C2 */
	font-style: initial;
	color: #919295;}

blockquote.anyquote::before { /* or? blockquote.anyquote::before */
	position: absolute;
	top: -.34em;
	left: -.34em;
	font-family: "Courier New";
	font-size: 6em;
	color: rgb(86, 125, 172, 25%);
	content: attr(data-class);} /* value in html doc instead of css content  here */
/* end DATACLASS */


code, kbd, pre, samp, mono {
	font-family: "Courier New", monospace;
	font-size: 1em;}

code {
	background: rgba(239, 239, 239, 0.25);
	border-radius: none;
	border: solid 1px rgba(192, 192, 194, 0.75);
	margin: 0 0.25em;
	padding: 0.25em 0.65em;}

pre {
	-webkit-overflow-scrolling: touch;
	margin: 0 0 2em 0;
	overflow: visible;}

	pre code {
		display: block;
		line-height: 1.6;
		padding: 1em 1.5em;
		overflow-x: scroll;}

dfn {
	font-style: italic;}

dd {
	margin: 0 0 0 40px;}
	
dt {
	font-weight: 600;}

em, i {
	font-style: italic;}

em.spoken_by_Jesus {
	color: rgba(137, 66, 56, 0.95);}


/* FORMS */
form {
	margin-top: 1em;}

form li
	{margin-bottom: 1.5em;}

label {
	display: block;
	margin-bottom: 0.5em;
	font-weight: 600;}

input, select, textarea {
	border: 1px solid rgba(192, 192, 194, 0.75);
	color: #565656;
	font-size: 1em;
	padding: 1em;
	width: 60%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	*behavior: url(/js/boxsizing.htc);}

textarea {
	padding: 1em;
	min-height: 10em;
	height: auto;
	width: 100%;}

input, textarea {
	-moz-transition: border .25s;
	-webkit-transition: border .25s;
	-o-transition: border .25s;
	transition: border .25s;}

input: hover, textarea: hover, input: focus, textarea: focus, input: active, textarea: active {
	border: 1px solid rgba(192, 192, 194, 0.75);}

input[type="text"], textarea {
	cursor: text;}

input[type="radio"], input[type="checkbox"] {
	display: inline;
	width: auto;
	height: auto;
	margin-right: 1em;}

input[type="checkbox"] + label, input[type="radio"] + label {
	display: inline;}

input[type="file"] {
	border: none;}

input[type="date"] {
	width: auto;}

select {
	height: auto;}

/* Placeholders */
::-webkit-input-placeholder {
	color: #C0C0C2;}

:-moz-placeholder {
	color: #C0C0C2;}

:-ms-input-placeholder {
	color: #C0C0C2;}

/* validate.js */
label.error {
	color: #567DAC;
	margin: 0.5em 0 0 0.5em;
	font-weight: normal;
	font-style: italic;}

.warning { 
	display: block; 
	background: rgba(239, 239, 239, 0.25);
	border: 1px solid rgba(192, 192, 194, 0.75);
	border-left: none;
	border-right: none; 
	text-align: center; 
	padding: 20px;
	margin: 20px 0px;}

/* end FORMS */


/* HEADINGS */
h1, h2, h3, h4, h5, h6 {
	margin: 0 0 1em;
	font-family: "Noto Serif", Times New Roman, Times, serif;
	font-weight: 300;
	color: #1E3163;}

h1 {
	font-size: 4.1em;
	font-weight: 300;
	letter-spacing: 0em;
	text-transform: none;
	line-height: 0.9;
	margin: 0 0 0.5em;}

h2 {
	font-size: 2.5em;
	letter-spacing: 0em;
	line-height: 1.6;
	margin: 0.4em 0 0.3em;}

h3 {
	font-size: 1.75em;
	margin: 1em 0 0.5em 0;}

h4 {
	font-size: 1.5em;
	margin: 1em 0 0.5em 0;}

h5 {
	font-size: 1.17em;
	text-transform: uppercase;
	margin: 0;}

h6 {
	font-size: 1.1em;
	margin-bottom: 2px;}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
	font-weight: 300;
	color:#1E3163;
	text-decoration: none;}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {
	color: #395789;
	text-decoration: none;
	background: 0 100%;}

h2 .subtitle, h3 .subtitle, h4 .subtitle {
	display: block;
	margin-bottom: 1em;
	font-size: 0.7em;
	font-style: italic;
	color: #1E3163;}

h2 .subtitle2, h3 .subtitle2, h4 .subtitle2 {
	display: block;
	margin-bottom: 1em;
	font-size: 0.7em;
	color: #1E3163;}

h6.subheading {
	text-decoration: underline;}


/* article > h3 {
	display: block;
	border-top: 1px solid rgba(192, 192, 194, 0.4);
	padding-top: 1em;
	margin-top: 2em;
	margin-left: auto;} */

section article {
	display: block;
	border-top: 1px solid rgba(192, 192, 194, 0.4);
	padding-top: 1em;
	margin-top: 2em;
	margin-left: auto;}
/* end HEADINGS */


.hidden {
	display: none !important;
	visibility: hidden;}

hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid rgba(192, 192, 194, 0.4);
	margin: 1em 0;
	padding: 0;}

hr.divider {
	margin: 3em 15%}

hr.dividersmall {
	border-top: 1px solid rgba(192, 192, 194, 0.2);
	margin: 1em 30%}

html, button, input, select, textarea {
	font-family: "Noto Sans", Tahoma, Verdana, sans-serif;
	font-weight: 400;
	color: #565656;} /* lighter #6C6D6E */


/* IMAGES */
figure {
	max-height: 100%;
	overflow: hidden;
        margin: 0 0 2em 0;}

figure.media {
	margin-top: 2.5em;}

figcaption.attribution {
	float: right;
	color: #919295;
	font-size: 0.85em;
	padding-right: 0.5em;
	padding-bottom: 2em;}

img {
	max-width: 100%;
	border-radius: 0.67em 0;
	height: auto;
	width: auto;}

li.ZelleQR img {
	width: 50%;
	height: auto;}

a img {
	-webkit-transition: opacity 1s ease;
	-moz-transition: opacity 1s ease;
	-o-transition: opacity 1s ease;
	-ms-transition: opacity 1s ease;
	transition: opacity 1s ease;}

a img:hover {
	*zoom: 1;
	opacity: 0.7;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 70);
	filter: alpha(opacity = 70);}

img.logosize {
	display: block;
	height: 1.5em;
	width: auto;
	border-radius: 0;}

.logo {
	margin-bottom: 1em;} /* was 3em when using menu in header*/

.logo img {
	border-radius: 0;}

.logo:hover {
	background: none;}

svg:not(:root) {
	overflow: hidden;}

p.symbol {
	font-family: "Noto Sans";
	background: #EFEFEF;
	text-align: center;}

p.symbol img {
	width: 1.4em;
	height: auto;
	border-radius: 0 0;
	margin: -0.4em 0 -0.4em 1em;}
/* end IMAGES */


.indent, .indent p, .indent li {
	line-height: 1.6;
	margin-left: 0.5em;}

.indent1 p, .indent1 li {
	line-height: 1.6;
	margin: 0 1.5em 1.0em 1.5em;}

.indent1 p:last-of-type {
	margin-bottom: 1em;}

.indent2 li {
	line-height: 1.0;
	margin-left: 2em;}

p.indentL1 {
	margin-left: 0em;}

p.indentL2 {
	margin-left: 2em;}

ul.indentL3 {
	margin-bottom: 1em;
	margin-left: 4em;}

ul.indentL4 {
	margin-bottom: 1em;
	margin-left: 6em;}



.lightfont {
	color: rgba(145, 146, 149, .7);}

/* LISTS */
ul, ol {
	font-family: "Noto Sans", Tahoma, Verdana, sans-serif;
	list-style-type: none;
	list-style-image: none;
	margin: 0;
	padding: 0;}

ul.bullet > li:before {
	content: "+ ";
	color: #565656;}

ul.contact {
	margin-bottom: 2em;}

ul.dashed, ul.bullet {
	list-style-type: none;}

ul.dashed li, ul.bullet li {
	line-height: 1.6;}

ul.dashed > li:before {
	content: "- ";
	color: #565656;}

ul.hang li, ol.hang li { /* effective hanging indent */
	padding-left: 1em;
	text-indent: -1em;}

ul.list1 li {
	font-family: "Noto Sans", Tahoma, Verdana, sans-serif;
	line-height: 1.6;
	padding-bottom: 0.75em;}

	li strong {
		font-family: "Noto Sans", Tahoma, Verdana, sans-serif;}

ol.num  {
	list-style-type: num;
	margin-left: 2em;
	margin-bottom: 1.5em;}

ol.num li {
	line-height: 1.6;}
/* end LISTS */

p {
	margin: 0 0 1em;}

p.center {
	margin: 1em auto 2em;
	width: 70%;
	text-align: center;}

p:last-child {
	margin-bottom: 0;}

p.round {
	text-align: center;}

p.round img {
	overflow: hidden;
	width: auto;
	max-height: 25em;
	border-radius: 50%;}

p.dropcap:first-letter {
	text-transform: uppercase;
	font-family: "Noto Serif", Times New Roman, Times, serif;
	font-weight: 400;
	font-size: 225%;
	color: rgba(57, 87, 137, 1);
	float: left;
	padding: 0.15em 0.05em 0 0;}

.question {
	font-weight: 600;
	color: #565656;}

.answer {
	color: #6C6D6E;}

	ul.answer {
		margin-top: -1em;}

/* PROGRESS BAR w/ 2 items (pa, pb) on the same line */
ul.progress {
	list-style-type: none;
	width: 100%;
	margin: 0 auto 2em;
	padding: 0;
	overflow: hidden;
	background-color: #919295;}

ul.progress li {
	float: left; 
	display: inline-block;
	color: #FFFFFF;
	text-align: center;
	margin: 0;}

li.pa {
	background-color: #567DAC;}

li.pb {
	background-color: #395789;}
/* end PROGRESS BAR */


/* NAV */
nav2 {
	display: block;
	color: #919295;
	padding-bottom: 2em;}

nav2 ul {
	font-size: 0.85em;
	clear: right;
	text-align: right;
	float: right;
	overflow: hidden;
	margin-top: 1em;}

nav2 ul.symbol {
	font-size: 1em;
	line-height: 1em;}

nav2 ul.symbol img {
	border-radius: 0 0;
	width: 1.35em;
	height: auto;}

nav2 ul.fleft li {
	text-align: left;
	float: left;
	padding-right: 1em;
	margin-right: 1em;
	border-right: 1px solid #C0C0C2;}

nav2 ul.fright {
	margin-right: 0;}

nav2 ul.fright li {
	display: inline-block;
	text-align: right;
	padding-right: 1em;
	margin-right: 1em;
	border-right: 1px solid #C0C0C2;}

nav2 ul li:last-child {
	padding-right: 0;
	margin-right: 0;
	border-right: none;}
/* end NAV */


.sans-serif {
	color: #565656;
	font-family: "Noto Sans", sans-serif;}

.serif {
	color: #565656;
	font-family: "Noto Serif", serif;}

::-moz-selection {
	background: #567DAC;
	color: #FFFFFF;
	text-shadow: none;}

::selection {
	background: #395789;
	color: #FFFFFF;
	text-shadow: none;}	

small, .small {
	font-size: 85%;
	color: #919295;}

.someletters {
	color: #919295;}

sub, sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;}

sup {
	top: -0.5em;}

sub {
	bottom: -0.25em;}


/* TABLES */
.table-wrapper {
  -webkit-overflow-scrolling: touch;
  overflow-x: auto;}

table {
  margin: 0 0 2em 0;
  width: 100%;}
  table tbody tr {
    border: solid 1px rgba(192, 192, 194, 0.75);
    border-left: 0;
    border-right: 0;}
    table tbody tr:nth-child(2n + 1) {
      background-color: rgba(239, 239, 239, 0.25);}
  table td {
    padding: 0.75em 0.75em;}
  table th {
    color: #3d4449;
    font-size: 0.9em;
    font-weight: 600;
    padding: 0 0.75em 0.75em 0.75em;
    text-align: left;}
  table thead {
    border-bottom: solid 2px rgba(192, 192, 194, 0.75);}
  table tfoot {
    border-top: solid 2px rgba(192, 192, 194, 0.75);}
  table.alt {
    border-collapse: separate;}
    table.alt tbody tr td {
      border: solid 1px rgba(192, 192, 194, 0.75);
      border-left-width: 0;
      border-top-width: 0;}
      table.alt tbody tr td:first-child {
        border-left-width: 1px;}
    table.alt tbody tr:first-child td {
      border-top-width: 1px;}
    table.alt thead {
      border-bottom: 0;}
    table.alt tfoot {
      border-top: 0;}

td.que {
	font-family: "Noto Sans";}

/* end TABLES */


/* TIMELINE, credit: codepen.io */
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	outline: none;}

h3.time, h4.time {
	text-align: center;
	font-weight: 300;}

h3.time span, h4.time span {
	font-weight: 500;}

.container2 {
	width: 90%;
	padding: 0 0;
	margin: 0 auto;
	position: relative;
	overflow: hidden;}

.container2:before {
	content: '';
	position: absolute;
	top: 1em;
	left: 50%;
	margin-left: -1px;
	width: 2px;
	height: 100%;
	background: #C0C0C2;
	z-index: -3;}

.timeline-block {
	width: -webkit-calc(50% + 8px);
	width: -moz-calc(50% + 8px);
	width: calc(50% + 8px);
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: flex;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	-moz-box-pack: justify;
	justify-content: space-between;
	clear: both;
	margin-bottom: 2em;}

.timeline-block-right {
	float: right;}

.timeline-block-left {
	float: left;
	direction: rtl;}

.timeline-block-left p.ltr {
	text-align: right;
	direction: ltr;}

.free:before {
	display: block;
	position: absolute;
	color: #919295;
	z-index: -3;}

	.timeline-block-right .free:before {
		content: 'free time ▷';
		margin-left: -12em;}

	.timeline-block-left .free:before {
		content: 'free time ◁';
		margin-right: -12em;}

.marker {
	width: 1.15em; 
	height: 1.15em;
	border-radius: 50%;
	border: 2px solid #C0C0C2;
	background: #F1B3A1;
	margin-top: 1em;
	z-index: 2;}

	.up {
		margin-top: 0.4em;}

.marker2 {
	width: 2em;
	height: 2em;
	border-radius: 50%;
	border: 2px solid #C0C0C2;
	background: #ffffff;
	padding: 0;
	margin-right: -0.4em;
	margin-top: 0.4em;
	z-index: 2;}

	.timeline-block-right .marker2 {
		margin-left: -0.4em;}

.markermeal:before {
	position: absolute;
	color: #919295;
	z-index: 3;}

	.timeline-block-right .markermeal:before {
		content: '◁';
		margin-left: -1.25em;}

	.timeline-block-left .markermeal:before {
		content: '▷';
		margin-right: -1.25em;}

.marker.green, .marker2.green {
	background: #C5D7D1;}

.marker.blue, .marker2.blue {
	background: #B4C9DD;}

.marker.white, .marker2.white {
	background: #ffffff;}

.timeline-block-left .marker2 {
	margin-right: -0.4em;}

.timeline-content {
	width: 90%;
	padding: 0 1.5em;}

.timeline-content h3 {
	margin-top: 0.1em;
	margin-bottom: 0em;}

.timeline-content h4 {
	margin-top: 0.2em;
	margin-bottom: 0em;}

.timeline-content .subheading {
	font-family: "Noto Sans";
	font-weight: 600;
	color: #565656;
	margin-top: 0.5em;
	margin-bottom: 0em;}

.timeline-content .date {
	font-family: "Noto Sans";
	font-weight: 500;
	color: #565656; /* #894238 */
	margin-top: 0em;
	margin-bottom: 0em;}

.timeline-content p {
	font-family: "Noto Sans";
	color: #919295;}

@media screen and (max-width: 780px) {
	.container2 {
		overflow: visible;}
	.container2:before {
		left: 8px;
		width: 2px;}
	.timeline-block {
		width: 100%;
		margin-bottom: 2em;}
	.timeline-block-right {
		float: none;}
	.timeline-block-left {
		float: none;
		direction: ltr;}
	.timeline-block-left p.ltr {
		text-align: left;
		direction: ltr;}
	.timeline-block-left .marker2 {
		margin-left: -0.4em;}
	.timeline-block-left .markermeal:before {
		content: '◁';
		margin-left: -1.25em;}
	.timeline-block-right .free:before {
		content: '◁';
		margin-left: -1.25em;}
	.timeline-block-left .free:before {
		content: '◁';
		margin-left: -1.25em;}}
/* end TIMELINE */


/* XCOL text distributed over multiple columns */
.xcol {
	width: 100%;
	display: inline-block;
	columns: auto 3; /* width and col count */
	column-gap: 2em;
	margin-left: 3em;}

.xcol article {
	column-fill: auto; /* auto or balance */
	column-gap: 3em;
	column-rule: none;  /* line: width style color  */}

.xcol h2, .xcol h3, .xcol h4 {
	column-span: all; /* all or none */}

ul.xcol {
	width: 100%;
	display: inline-block;
	margin: 0em;
	-webkit-column-break-inside: avoid;
	page-break-inside: avoid;
	break-inside: avoid-column;
	break-inside: avoid;
	columns: auto 2;
	column-fill: balance;}

ul.xcol li {
	display: block;
	break-inside: avoid-column;}

@media screen and (max-width: 48em) {
	.xcol {
		columns: auto 2;}
	ul.xcol {
		columns: auto 1;}
	ul.xcol li {display: block;}}

@media only screen and (max-width: 30em) {
	.xcol {
		columns: auto 1;}}
/* end XCOL */


/* GRID https://github.com/mattberridge/Proportional-Grids/ */
body {
	width:100%;
	background: none;}

.container {
	width: 90%;
	margin: 5em auto;
	max-width: 1100px;
	min-width: 300px;}

.containerpost {
	width: 80%;
	margin: 5em auto;
	max-width: 1100px;
	min-width: 300px;}

.grid {
	float: left;
	padding-left: 3em; /* this is your gutter between columns */
	width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;}

.grid-wrap {
	margin-left: -3em; /* the same as your gutter */
	overflow: hidden;}

.grid-wrap:before, .grid-wrap:after {
	content: "";
	display: table;}

.grid-wrap:after {
	clear: both;}
  
.half-gutter {margin-left: -1.5em;}
.half-gutter .grid-col {padding-left: 1.5em;}

.col-full {width: 100%;}
.col-one-half {width: 50%;}
.col-one-third {width: 33.333%;}
.col-two-thirds {width: 66.666%;}
.col-one-quarter {width: 25%;}
.col-three-quarters {width: 75%;}
.col-three-quarters .col-one-half {margin: 0 0 0 0;}
.col-one-fifth {width: 20%;}
.col-two-fifths {width: 40%;}
.col-three-fifths {width: 60%;}
.col-four-fifths {width: 80%;}
.col-one-sixth {width: 16.666%;}
.col-five-sixths {width: 83.333%;}

@media screen and (max-width: 48em) {
	article.mq1-col-one-half {
	float: left;
	margin-left: -3em;
	width: auto;}}

@media screen and (max-width: 48em) {
	article.mq2-col-full {
	float: left;
	margin-left: 0em;
	width: auto;}}

@media screen and (max-width: 48em) {
	.space {
	padding-top: 1em;}}

.alignleft {
	float: left;
	clear: left;
	margin: 0.38em 1.62em 0.38em 0;}

.alignright {
	float: right;
	clear: right;
	margin: 0.38em 0 0.38em 1.62em;}

.aligncenter {
	margin: 0 auto 1.62em;
	display: block;}

.fright, .fleft {display:block; overflow:hidden}
.fleft {float:left}
.fright {float:right}

.mleft {margin-left: 3em;}
.mright {margin-right: 3em;}
.mtop {margin-top: 3em;}
.mbottom {margin-bottom: 3em;}
.halfmleft {margin-left: 1.5em;}
.halfmright {margin-right: 1.5em;}
.halfmtop {margin-top: 1.5em;}
.halfmbottom {margin-bottom: 1.5em;}

.landingcenter, .believe {
	.left {
		text-align left;}
	.right {
		text-align: right;}
	.center {
		text-align: center;}}
/* end GRID */


/* HEADER */
header#navtop {
	margin-bottom: 1em;
	clear: both;
	overflow: hidden;}

header#navtop h1 {
	font-family: "Noto Serif", Times New Roman, Times, serif;
	font-size: 1.5em;
	color: #395789;}

header#navtop img {
	width: 40%;
	height: auto;}

header#navtop p:first-of-type {
	font-family: "Noto Sans";}

header nav ul {
	float: left;}

header nav ul li {
	display: block;
	float: left;
	overflow: hidden;
	padding: 0 0.45em;
	border-left: 1px solid #C0C0C2;
	line-height: 1.67em;}

header nav ul li:first-of-type {
	border-left: none;
	padding-left: 0;}

nav a, menu a {
	text-decoration: none;
	color: #395789;}

.navactive {
	color: #919295;}


/* end HEADER */


/* PAGES */
/* MAIN page */
.main > section {
	margin-bottom: 4em;}

.main header {
	color: #565656;
	margin-bottom: 2em;}

.main header hr {
	border-top-color: rgba(192, 192, 194, 0.4);}

.main header figure {
	margin-top: 4em;}

#main .desc {
	margin: 0 15%;
	text-align: center;}

#main header #navtop {
	display: block;}

#main #navtop img {
	width: 1.5em;
	padding: 0;
	margin-right: 0.5em;
	border-radius: 0 0;}

#main #navtop h1 {
	clear: right;
	font-family: "Noto Sans", sans-serif;
	font-weight: 400;
	font-size: 1.1em;}

#main #navtop h1 .websitetitle {
	font-family: "Aboreto", sans-serif;
	font-size: 1.25em;
	letter-spacing: .05em;}


/* ABOUT page */
article.bios, div.two-col {
	border-top: none;
	background-color: none;}

div.two-col article {
	border-top: none;}

section.board {
	border-top: 1px solid rgba(192, 192, 194, 0.4);
	margin-top: 2em;
	background-color: none;}

div.bio {
	margin-bottom: 2em;
	background-color: none;}

.bio h5, .bio h6 {
	font-weight: 400;}

.bio .title {
	font-family: "Noto Sans";
	margin-bottom: 1em;}

.bio figure {
	margin: 1em 0em;
	overflow: hidden;}

.bio hr {
	margin-top: 3em;}

/* MINISTRY page */
div.mindate {
	background-color: rgba(218, 218, 219, 0.2);
	padding: 1em;
	margin-left: 3em;
	margin-right: -3em;
	margin-bottom: 1em;}

div.mindate + div {
	padding-right: 1em;
	margin-left: 1em;
	margin-right: -2em;}
/* end PAGES */


/* FOOTER */
footer {
	display: block;
	color: #919295;
	border-top: 1px solid rgba(192, 192, 194, 0.4);
	padding-top: 2em;
	padding-bottom: 10em;
	margin-top: 1em;}

footer#about p {
	font-family: "Noto Sans";
	font-size: 0.85em;
	margin-top: 1.5em;}

footer#about p.right {
	float: right;
	text-align: right;}

footer#about h6 {
	font-size: 1em;
	font-weight: 400;
	text-decoration: underline;
	margin-top: 1.5em;}

footer#about h6:first-of-type {
	padding-top: 0em;
	margin-top: 0em;}

footer#about h6.right {
	float: right;
	text-align: right;}

footer nav {
	display: block;}

footer nav.left {
	display: inline-block;}

footer nav ul {
	float: right;
	clear: right;
	text-align: right;
	overflow: hidden;
	margin-top: 0em;}

footer nav.left ul {
	text-align: left;
	overflow: hidden;
	margin-top: 1.5em;
	padding-bottom: 1.5em;}

footer ul {
	font-size: 0.85em;}

	ul.contact, ul.social {
		font-size: 1em;
		line-height: 1.6em;}

	ul.contact li, ul.social li {
		display: inline-block;
		padding-right: 1em;
		margin-right: 1em;
		border-right: 1px solid #C0C0C2;}

	ul.contact li:last-child, ul.social li:last-child {
		padding-right: 0;
		margin-right: 0;
		border-right: none;}

	ul.contact img, ul.social img {
		border-radius: 0 0;
		width: 1.25em;
		height: auto;}
/* end FOOTER */


/* MEDIA QUERIES */
/* -- Media query 1 (mq1) -- */
@media only screen and (max-width: 60em) { /* 13 / 780 */
	.mq1-col-full {width: 100%;}
	.mq1-col-one-half {width: 50%;}
	.mq1-col-one-third {width: 33.333%;}
	.mq1-col-two-thirds {width: 66.666%;}
	.mq1-col-one-quarter {width: 25%;}
	.mq1-col-three-quarters {width: 75%;}
	/**/
	h1 {
		font-size: 3.1em;}
	div.bio:nth-child(odd) {
		clear: both;}}

/* -- Media query 2 (mq2) -- */
@media only screen and (max-width: 48em) { /* 13 / 624 */
	.mq2-col-full {width: 100%;}
	.mq2-col-one-half {width: 50%;}
	.mq2-col-one-third {width: 33.333%;}
	.mq2-col-two-thirds {width: 66.666%;}
	.mq2-col-one-quarter {width: 25%;}
	.mq2-col-three-quarters {width: 75%;}
	/**/
	.main header img {
		overflow: hidden;
		max-width: 133%;
		margin: 0 -15%;}
	header nav {
		width: 100%;}
	header nav ul {
		padding: 0 0.65em;
		border-left: 1px solid #C0C0C2;
		line-height: 1.67em;}
	header nav ul:first-of-type {
		border-left: none;
		padding-left: 0;}
	.hide {
		display: none;}
	li.ZelleQR img {
		width: 35%;
		height: auto;}
	.sans-serif {
		padding-top: 1em;}
	.mq2-col-full .bio {
		float: left;
		margin: 0 2em 1em 0;
		width: 33%;
		height: auto;}
	.bio img {
		width: 50%;
		height:auto;}}

/* -- Media query 3 (mq3) -- */
@media only screen and (max-width: 30em) { /* 13 / 390 */
	.mq3-col-full {width: 100%;}
	.mq3-col-one-half {width: 50%;}
	.mq3-col-one-third {width: 33.333%;}
	.mq3-col-two-thirds {width: 66.666%;}
	.mq3-col-one-quarter {width: 25%;}
	.mq3-col-three-quarters {width: 75%;} 
	.mq3-none {display: none;}
	/**/
	header nav ul {
		padding: 0 0.5em;}
	.sans-serif {
		padding-top: 1em;}}
/* end MEDIA QUERIES */

/* END OF CSS */