:root {
	--MWS_LOGO_BLUE: #1a4ea8;
	--MWS_DARK_BLUE: navy;
	--MWS_PALE_BLUE: aliceblue;
}

body {
	font-family: arial, sans-serif;
	background-color: var(--MWS_PALE_BLUE, aliceblue );
	font-size: 1.1em;
}
.banner_gen {
	background-color: var(--MWS_LOGO_BLUE, #1a4ea8 );
	color: white;
}

header, main, footer {
	max-width: 40em;
	margin-left: auto;
	margin-right: auto;
}
header {
	text-align: center;
	padding: 1.2em 0.6em;
}
header h1, header p {
	margin: 0em;
	font-family: "Figtree", helvetica, arial, sans-serif;
}
header h1 {
	font-weight: 400;
	font-style: normal;
	font-optical-sizing: auto;

	font-size: 2.2em;
}
header p {
	font-weight: 300;
	font-style: normal;
	font-optical-sizing: auto;
	position: relative;
	top: -0.3em;
}
main {
	background-color: white;
	padding: 0em 0.6em 0.9em 0.6em;
}
main>p:first-child, main>h2:first-child {
	margin-top: 0em;
	padding-top: 1em;
}
footer {
	text-align: center;
	padding: 0.1em 0.6em;
}
footer p {
	font-size: 0.8em;
	margin: 0em;
	padding: 0em;
}


h2 {
	font-size: 1.2em;
}
li {
	margin-bottom: 0.4em;
}
.mwsEm {
	font-family: "Figtree", helvetica, arial, sans-serif;
	font-weight: 300;
	font-style: normal;
	font-optical-sizing: auto;
}

.page_title h2 {
	margin: 0em;
	padding: 0.6em 0em 0.1em 0em;
	color: var(--MWS_LOGO_BLUE, #1a4ea8 );
}
.page_title hr {
	border-color: var(--MWS_LOGO_BLUE, #1a4ea8 );
}

.sig {
	margin-top: 1.5em;
}
.sig p {
	margin: 0.4em 0em;
}
.prof {
	font-weight: 400;
	font-style: normal;
	font-optical-sizing: auto;
}
.prof7 {
	font-family: "Calligraffitti", cursive;
	font-size: 1.3em;
}
.warn {
	font-variant: small-caps;
	color: crimson;
}
.error_messages {
	color: darkred;
}
.funded {
	white-space: nowrap;
}

button {
	color: var(--MWS_LOGO_BLUE, #1a4ea8 );
	border-radius: 0.3em;
	border: solid 1px var(--MWS_LOGO_BLUE, #1a4ea8 );
}
button:hover {
	color: var(--MWS_DARK_BLUE, navy );
	border-color: var(--MWS_DARK_BLUE, navy );
}
.linfo {
	/* cursor: pointer; */
	width: 6.5em;
}
.pinfo {
	border-radius: 0.3em;
	color:  var(--MWS_DARK_BLUE, navy );
}

.highlight {
	background-color: yellow;
}

/* ============================================================ */
@media only screen and (max-width: 36em) {
        header h1 {
		font-size: 2.0em;
        }
}
@media only screen and (max-width: 33em) {
	body {
		font-size: 1.0em;
	}
	header {
                padding-top: 1.0em;
                padding-bottom: 1.0em;
        }
        header h1 {
		font-size: 1.8em;
        }
}
@media only screen and (max-width: 27em) {
	header {
		padding-top: 0.8em;
		padding-bottom: 0.8em;
	}
        header h1 {
                font-size: 1.5em;
        }
	header p {
		font-size: 0.9em;
	}
	.funded {
		white-space: normal;
	}
	.cruk {
		white-space: nowrap;
	}	
}
@media only screen and (max-width: 23em) {
        header {
                padding-top: 0.7em;
                padding-bottom: 0.7em;
        }
        header h1 {
                font-size: 1.4em;
        }
}
/* ============================================================ */

