*:root {
	--main-font-size: 3vmin; /* was 1 em */
	--main-body-width:100%;
}
@media screen  and (min-width : 1501px)  {
		*:root {--main-font-size: 2.7vmin; /* was 1.5 em */
			--main-body-width: 75%;
	}
}
*#container {
	width: var(--main-body-width);
	background-color: white;
	font-family: arial, sans-serif;
	font-size: var(--main-font-size);
	margin-left: auto;
	margin-right: auto;
	text-align:left;
}
body {
	background-color: white;
	font-family: arial, sans-serif;
	line-height:1.2;
	text-align: center;
	margin:0 auto;
	max-width:100%;
}
H1,H2 {
	text-align:center;
	font-family: sans-serif;
	color:red;
	margin-top: 0;
}
h1 {font-size: 48pt;}
h2 {font-size: 36pt;}
hr {
	height: 0px;
	border: none;
	border-top: 1px solid black;
	margin-right: auto;
	margin-left: auto;
	display: block;
	width: 20%;
	overflow: auto;
	clear:both;
}
p.caption, p.caption-justified {
	text-indent: 0px;
	text-align: center;
	margin: 0 4% .75em 4%; /* top right bottom left */
	margin: 0 calc(.5em + 4%) .75em calc(.5em + 4%); /* top right bottom left */
	padding-left:1em;
	padding-right:1em;
	font-family: sans-serif;
	font-weight: normal;
}
p.caption-justified {
	text-indent: 3em;
	text-align: left;
}
p.photo {
	text-indent: 0px;
	text-align: center;
	margin: 0px;
}
*.cent {text-indent:0px;text-align:center;}
img {max-width: 98%;}
img.w1200 {width: 1200px;}
img.w800 {width: 800px;}
img.w750 {width: 750px;}
img.w700 {width: 700px;}

a {font-weight: bold;}
.small {font-size:smaller;}
.nw {white-space: nowrap;}
.red {color: red;}

p.w1200, p.w800, p.w750, p.w700 {
	margin-left:auto;
	margin-right:auto;
	margin-top:inherit;
	margin-bottom:inherit;
	text-align: justify;
	overflow: visible;
	-ms-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
}
/* ADD WIDTHS AS REQUIRED */
p.w1200 {max-width: 1200px;}
p.w800 {max-width: 800px;}
p.w750 {max-width: 750px;}
p.w700 {max-width: 700px;}