body {
	font-family: Verdana, Arial, sans-serif;
	text-align: center;
	font-size: 10pt;
	margin: 0px;
	color: #000000;
}

div.content {
	position: relative;
	box-sizing: border-box;
	text-align: left;
	max-width: 75rem;
	margin: 0px auto;
	padding: 1rem 1rem 0px 1rem;
}

div.wide {
	max-width: 100%;
	padding: 0px 1em;
}

/* header */

header {
	padding-bottom: 1em;
	border-bottom: 5px solid #636563;
	margin-bottom: 1em;
}

	header::after {
		content: "";
		clear: both;
		display: table;
	}

	header h1 {
		position: absolute;
		top: 1rem;
		right: 1rem;
		font-size: 14pt;
		font-weight: normal;
		padding: 0px;
		margin: 0px;
		color: #007749;
	}

	header h2 {
		font-size: 12pt;
		font-weight: normal;
		margin: 0px;
	}

	header .logo {
		max-width: 100%;
		vertical-align: middle;
		margin: 1em 1em 1em 0px;
		width: 240px;
	}

.fr {
	float: right;
}


nav.menu {
	display: inline-block;
	float: right;
	width: auto;
	margin-top: 2rem;
	background-color: transparent;
	color: #000000;
	line-height: 1px;
	clear: both;
	text-transform: uppercase;
}

nav.menu div.menuicon {
	text-align: right;
	max-width: 80em;
	margin: 0px auto;
	font-size: 130%;
	cursor: pointer;
}

nav.menu div.menuicon a {
	display: inline-block;
	padding: 0.5em 0px 0.5em 1em;
	line-height: normal;
	font-weight: bold;
}

nav.menu a:focus {
	outline: none;
	text-decoration: underline;
}

nav.menu ul {
	display: none;
	list-style: none;
	padding: 0px;
	margin: 0px;
	line-height: normal;
	z-index: 100;
}

nav.menu li {
	display: block;
	position: relative;
	margin: 0px;
	padding: 0px;
}

nav.menu li a {
	display: block;
	padding: 1em;
	cursor: pointer;
	text-decoration: none;
	color: #000000;
	font-weight: normal;
}

nav.menu li.submenu ul {
	display: none;
	padding: 0px;
	margin: 0px 0px 0px 1em;
}

nav.menu img {
	vertical-align: middle;
	height: 1.2em;
}

nav.menu li > a.hover, nav.menu li.hover > a, nav.menu li.menuopen > a, nav.menu li > a:focus {
	color: #48a23f;
	text-shadow: 0.5px 0px 0px #48a23f, -0.5px 0px 0px #48a23f;
}

@media all and (max-width: 599px) {
	header h1 {
		position: static;
	}
}

@media all and (max-width: 749px) {
	nav.menu {
		width: 100%;
		margin: -1.5rem 0px 0px 0px;
	}

	nav.menu li.submenu > a:after {
		content: " >";
	}

	nav.menu li.menuopen {
		padding-bottom: 0.5em;
	}
}

@media all and (min-width: 750px) {
	nav.menu {
		text-align: left;
	}

	nav.menu div.menuicon {
		display: none;
	}

	nav.menu ul.mainmenu {
		display: block;
	}

	nav.menu a.icon {
		color: transparent !important;
		text-shadow: none !important;
	}

	nav.menu li {
		display: inline-block;
		text-align: center;
		white-space: nowrap;
	}

	nav.menu li.submenu a {
		padding: 0.5em 1em;
		text-align: center;
	}

	nav.menu li.submenu li.submenu > a::after {
		content: "▶";
		position: absolute;
		right: 0.5em;
		top: 0.3em;
	}

	nav.menu li.submenu ul {
		display: none;
		padding: 0px;
		margin: 0px 0px 0px 1em;
	}

	nav.menu li.submenu ul li a {
		text-align: left;
		padding: 0.5em 2em 0.5em 1em;
	}


	nav.menu li.submenu ul {
		box-shadow: rgba(0,0,0,0.4) 1px 1px 7px;
	}

	nav.menu > ul > li.submenu:last-child > a {
		padding-right: 0px;
	}

	nav.menu li.submenu a:after {
		position: absolute;
		right: 1em;
	}

	nav.menu li.submenu li {
		display: block;
	}

	nav.menu li.submenu > ul {
		position: absolute;
		top: 100%;
		left: 0px;
		padding: 0px;
		margin: 0px;
		background-color: #ffffff;
	}


	ul.mainmenu > li.submenu:nth-last-of-type(-n+3) > ul {
		left: auto;
		right: 0px;
	}

	ul.mainmenu > li.submenu:last-child > ul {
		right: -1em;
	}

	nav.menu li.submenu li.submenu ul {
		top: 0px;
		left: 100%;
	}

	ul.mainmenu > li.submenu:nth-last-of-type(-n+3) li.submenu ul {
		left: auto;
		right: 100%;
	}

	ul.mainmenu > li.submenu:nth-last-of-type(-n+3) li > a {
		text-align: right;
		padding: 0.5em 1em 0.5em 2em;
	}

	ul.mainmenu > li.submenu:nth-last-of-type(-n+3) li.submenu > a::after {
		content: "◀";
		right: auto;
		left: 0.5em;
	}



		nav.menu a.icon {
			box-sizing: content-box;
			width: 2em;
			padding-left: 0px;
			padding-right: 1.5em;
			color: transparent;
			background-size: contain;
			background-repeat: no-repeat;
			background-position: left;
		}

	nav.menu a.homeicon {
		background-image: url('/Images/home.svg');
		background-size: auto 2em;
	}

	nav.menu a.logouticon {
		background-image: url('/Images/logout.svg');
		background-size: auto 2em;
	}
}

@media all and (min-width: 750px) and (max-width: 1049px) {
	nav.menu {
		float: none;
		display: block;
		width: 100%;
		margin-top: 0.5em;
	}

		nav.menu li.submenu:last-child a {
			padding-right: 1.5em;
		}
}

/* body */

.pcm_body {
	display: inline-block;
	box-sizing: border-box;
	width: 75rem;
	max-width: 100%;
	padding: 1em;
	text-align: left;
}

.pcm_bodywide {
    display: inline-block;
    width: auto;
    text-align: left;
}

h1, h2 {
    margin-top: 0px;
}

h3 {
    margin-bottom: 0px;
}

/* tables */

table {
    border-spacing: 0px;
    border-collapse: collapse;
}

.pcm_table {
	border-spacing: 0px;
	border-collapse: collapse;
	width: 100%;
	margin: 0px auto 2em auto;
	background-color: #ffffff;
	text-align: left;
	box-shadow: 4px 4px 10px 1px rgba(0,0,0,0.2);
}

	.pcm_table th, .pcm_table td {
		padding: 10px 10px;
		margin: 0px;
	}

	.pcm_table thead tr, th.pcm_subsection2 {
		background-color: #3e95d1;
		color: #ffffff;
		text-align: left;
		font-size: 10pt;
	}

	.pcm_table thead a {
		text-decoration: none;
		color: #ffffff;
	}

	.pcm_table tbody {
		font-size: 10pt;
	}

		.pcm_table tbody tr:nth-child(even) {
			background-color: #eeeeee;
		}

.pcm_tnarrow {
	border-spacing: 0px;
	border-collapse: collapse;
	width: auto;
	max-width: 880px;
	min-width: 100px;
	margin: 0px 0px 2em 0px;
}

	.pcm_tnarrow textarea {
		min-width: 380px;
		min-height: 7em;
		margin-left: 0px;
	}

th.pcm_subsection {
	text-align: center;
	color: #0000ff;
	background-color: #e6e6fa;
	padding: 1em;
}

td.pcm_subsection {
	padding: 1em;
	background-color: #d3d3d3;
}

.colsubtotal, .coltotal {
	text-align: right;
	font-weight: bold;
}

.coltotal {
	font-size: 120%;
	color: #0000ff;
}

.pcm_table img {
	vertical-align: middle;
}

.pcm_table input[type=text], .pcm_table input[type=password], .pcm_table input[type=email], .pcm_table textarea {
	width: 100%;
}

.pcm_table .pcm_button {
	padding: 0.2em 1em;
	margin: 1px 0.5em;
}



/* filters */
.pcm_filters {
    font-size: 10pt;
    text-align: right;
}

.pcm_filters p {
    margin-top: 0px;
}

div.pcm_filters {
    float: right;
	clear: right;
    margin: 1em 0px 1em 1em;
}

/* edit page */

table.editpage {
    background-color: #cccccc;
}

table.editpage th {
    padding: 0.5em 0.2em;
    font-size: 10pt;
    background-color: #000000;
    color: #ffffff;
    font-weight: bold;
    text-align: left;
}

table.editpage td {
    padding: 0.3em 0.5em;
    font-size: 9pt;
}

table.editpage input, table.editpage select {
    border: 1px solid #666666;
    width: 100%;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

table.editpage input.pcm_button {
    border: none;
    width: auto;
}

table.editpage input[type=radio], table.editpage input[type=checkbox] {
    width: auto;
}

table.editpage .small, .small {
    font-size: 8pt;
}

.PCMvalue {
    font-weight: bold;
}


div.editgrid {
	clear: both;
	display: grid;
	grid-template-columns: 1fr 2fr;
	grid-column-gap: 2em;
	column-gap: 2em;
	grid-row-gap: 2em;
	row-gap: 2em;
}

@media all and (max-width: 50em) {
	div.editgrid {
		grid-template-columns: 1fr;
	}
}


	.halfwidth {
		width: 50%;
		box-sizing: border-box;
		display: inline-block;
		vertical-align: top;
	}

	.thirdwidth {
		width: 33%;
		box-sizing: border-box;
		display: inline-block;
		vertical-align: top;
	}

	dl {
		font-size: 100%;
		list-style-type: none;
		margin: 0px;
		display: inline-block;
		vertical-align: top;
	}

	dt {
		xfont-size: 95%;
		font-size: 110%;
		font-weight: bold;
		margin: 0px;
		xcolor: #707073;
		color: #8b8b8f
	}

	dd {
		font-size: 100%;
		margin: 0.2em 0px 1em 0px;
	}

		dd input[type="text"], dd input[type="password"], dd input[type="email"], dd input[type="file"], dd select {
			margin: 3px 0px;
		}

		dd .btn_shadow {
			margin: 0.3em 0px 0.6em 0px;
		}



	/* buttons */

	.allowforbuttons {
		width: 80%;
		width: calc(100% - 220px - 3em);
	}

	@media all and (max-width: 40em) {
		.allowforbuttons {
			clear: right;
			width: 100%;
		}
	}

	.buttons {
		width: 220px;
		padding-left: 10px;
		float: right;
		z-index: 10;
		position: relative;
	}

		.buttons p {
			margin-top: 0px;
			margin-bottom: 1em;
		}

		.buttons input, .buttons input[type="submit"], .buttons input[type="text"], .buttons .pcm_button {
			width: 100%;
		}

			.buttons input, .buttons input[type="submit"], .buttons input[type="text"], .buttons .pcm_button {
				margin: 0px 0px 5px 0px;
				xmargin: 12px 2px;
			}

	input[type="submit"], input[type="text"], input[type="password"], input[type="email"], .pcm_button, .button_trans, select, textarea {
		display: inline-block;
		line-height: normal !important;
		-ms-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		font-family: roboto, sans-serif;
		font-weight: normal;
		border-width: 1px;
		font-size: 90%;
		letter-spacing: 0.05em;
	}

		select option {
			font-size: 100%;
		}

	input[type="text"], input[type="password"], input[type="email"], select {
		padding: 0.2em 0.4em 0.3em 0.4em;
	}

	input[type=submit], .pcm_button, .button_trans {
		background-color: #113258;
		color: #ffffff;
		border: 1px solid #113258;
		cursor: pointer;
		font-weight: bold;
		white-space: normal;
		text-transform: uppercase;
		text-decoration: none;
		padding: 0.2em 1em 0.3em 1em;
		text-align: center;
	}

	.pcm_button {
		margin-right: 0.5em;
		margin-bottom: 5px;
	}

	input[type=submit].btn_col2, .btn_col2 {
		background-color: #dba628;
		border: 1px solid #dba628;
	}

	input[type=submit].btn_shadow, .btn_shadow {
		border-radius: 0.4em;
		box-shadow: 1px 3px 5px rgba(0,0,0,0.4);
		text-transform: none;
		font-weight: normal;
	}

	input[type=submit]:disabled, .pcm_button:disabled, .button_trans:disabled {
		cursor: default;
		background-color: #96a4b5 !important;
		border: 1px solid #96a4b5 !important;
	}

	/* Messages */
	.pcm_msg {
		display: block;
		padding: 0.5em 1em;
		margin: 1em 0px;
		box-sizing: border-box;
	}

	.msgError {
		padding: 0.5em 1em;
		color: #dd0000;
		border: 1px solid #dd0000;
		background-color: #ffeeee;
	}

	.msgSuccess {
		padding: 0.5em 1em;
		color: #009900;
		border: 1px solid #009900;
		background-color: #eeffee;
	}

	.msgPopup {
		position: fixed;
		top: 30%;
		z-index: 99;
		margin: 0px 190px;
		width: 500px;
		font-size: 120%;
		padding: 2em;
	}

	.msgPopdown {
		opacity: 0;
		width: 0px;
		height: 0px;
		overflow: hidden;
		margin: 0px 490px;
		transition: all 0.5s ease;
	}

	/* Lists */

	ul.PCMlist {
		list-style: none;
		padding-left: 1em;
	}

ul.PCMlist2 {
	list-style: none;
	padding-left: 0px;
}

	ul.PCMlist2 li::before {
		display: inline-block;
		content: "•︎";
		width: 1em;
		color: #000000;
	}


	ul.labelist {
		list-style: none;
		padding-left: 14em;
		position: relative;
	}

		ul.labelist li {
			position: relative;
		}

		ul.labelist label {
			position: absolute;
			left: -14em;
			top: 0.2em;
			padding-right: 0.5em;
			width: 14em;
			text-align: right;
			box-sizing: border-box;
		}

		ul.labelist input[type=text], ul.labelist input[type=password], ul.labelist input[type=email], ul.labelist select {
			width: 20em;
			margin: 0.2em 0px;
			-ms-box-sizing: border-box;
			-moz-box-sizing: border-box;
			-webkit-box-sizing: border-box;
			box-sizing: border-box;
		}

		ul.labelist .haserror input, ul.labelist .haserror select {
			border-color: #dd0000;
			outline: 1px solid #dd0000;
		}

		ul.labelist .haserror > span {
			color: #dd0000;
			font-weight: bold;
		}


	label.req::before {
		content: "* ";
		color: #dd0000;
	}

	/* Modal */

	div.modal {
		display: none;
		position: fixed;
		top: 0px;
		right: 0px;
		bottom: 0px;
		left: 0px;
		z-index: 20;
		background-color: rgba(6, 2, 0, 0.63);
		padding: 0px;
		overflow: auto;
	}

	div.modalcontent {
		text-align: left;
		display: block;
		background-color: #ffffff;
		padding: 2em;
		width: auto;
		max-width: 95%;
		margin: 10% auto;
		box-shadow: 4px 4px 10px 1px rgba(0,0,0,0.6);
	}

		div.modalcontent h3 {
			margin-bottom: 1em;
		}

	/* front page */
	div .frontgrid {
		display: grid;
		grid-template-columns: 3fr 4fr;
		grid-column-gap: 2em;
		column-gap: 2em;
		grid-row-gap: 2em;
		row-gap: 2em;
	}

	div.firstpanel {
		display: flex;
		column-gap: 5%;
		row-gap: 2em;
	}

		div.firstpanel > div {
			max-width: 20em;
		}

	div.secondpanel {
		display: flex;
		justify-content: space-evenly;
		row-gap: 2em;
		text-align: center;
		align-items: flex-start;
		color: #636563;
	}

		div.secondpanel h3 {
			margin: 0px 0px 0.5rem 0px;
			font-size: 17pt;
			font-weight: normal;
			line-height: 100%;
		}

			div.secondpanel h3 span {
				font-size: 28pt;
			}

	h3.YTD_RL1 {
		color: #ef4b71;
		xcolor: #636563;
	}

	h3.YTD_IO {
		color: #f29538;
		xcolor: #ef4b71;
	}

	h3.YTD_IC {
		color: #48a23f;
	}

	div.searchsec {
		position: relative;
		padding-right: 3em;
		margin-bottom: 1em;
	}

	div.datesec {
		position: relative;
		width: 100%;
		padding-left: 4em;
		margin-bottom: 0.5em;
		box-sizing: border-box;
		margin-bottom: 1em;
	}

		div.datesec label {
			position: absolute;
			left: 0px;
			font-weight: bold;
		}

	span.inspcount {
		float: right;
	}

	div.buttonsec input {
		width: 100%;
		background-color: #636563;
		border-color: #636563;
		color: #ffffff;
		border-radius: 0px;
	}

	div.frontpanel p {
		margin: 0px 0px 0.5em 0px;
	}

	div.frontpanel a {
		text-decoration: none;
		color: #0000cc;
	}

	div.frontpanel h3, h4 {
		margin: 0.5em 0px;
	}

	div.frontpanel ul.PCMlist {
		margin: 0px;
	}

	svg path:hover {
		background-color: #ff0000;
		color: #00ff00;
	}

	::-moz-placeholder {
		opacity: 1;
		color: #000000;
	}

	::-webkit-input-placeholder {
		color: #000000;
	}

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

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

	:: placeholder {
		opacity: 1;
		color: #000000;
	}

	.frontpanel input[type=text] {
		margin-top: 0.2em;
		width: 100%;
		box-sizing: border-box;
	}

	input.btn_go {
		position: absolute;
		right: 0px;
		border-radius: 1em;
		height: 2em;
		width: 2em;
		color: #ffffff;
		background-color: #3e95d1;
		padding: 0.2em;
		border: none;
		font-size: 10pt;
		font-weight: bold;
		line-height: 100%;
		margin: 0px;
	}


	div.riskbox {
		xxborder: 1px solid #636563;
		xxbox-shadow: rgba(0, 0, 0, 0.2) 5px 5px 7px;
		box-shadow: rgba(0, 0, 0, 0.3) 3px 3px 10px;
		padding: 1em;
	}

		div.riskbox h2 {
			margin: 0.2rem 1rem;
			color: #636563;
			font-weight: bold;
			font-size: 10pt;
		}

		div.riskbox h3 {
			margin: 0.2rem 1rem;
			color: #3c61b3;
			font-weight: bold;
			font-size: 12pt;
		}

		div.riskbox table {
			width: 100%;
			border-collapse: separate;
			border-spacing: 0.8rem;
		}

			div.riskbox table a {
				color: #000000;
				font-size: 8pt;
				text-decoration: none;
			}

		div.riskbox th {
			padding: 0.2em 1em;
			color: #ffffff;
			text-align: center;
		}

		div.riskbox td {
			padding: 0.3em 1em;
		}

			div.riskbox td:first-child {
				padding-left: 0px;
				padding-right: 0px;
				text-align: right;
			}

		div.riskbox tr th {
			position: relative;
		}

		div .riskbox tr.risk1 th {
			background-color: #ef4b71;
		}

		div.riskbox tr.risk2 th {
			background-color: #f29538;
		}

		div.riskbox tr.risk3 th {
			xbackground-color: #3e95d1;
			background-color: #bab825;
		}

		div.riskbox div.tri {
			position: absolute;
			left: -0.8em;
			top: 0px;
			width: 0px;
			height: 0px;
			border-left: 1.4em solid transparent;
			border-right: 1.4em solid transparent;
		}

			div.riskbox div.tri span {
				position: absolute;
				top: -1.8em;
				left: -0.4em;
			}

		div.riskbox tr.risk1 div.tri {
			border-top: 1.8em solid #ef4b71;
		}

		div.riskbox tr.risk2 div.tri {
			border-top: 1.8em solid #f29538;
		}

		div.riskbox tr.risk3 div.tri {
			border-top: 1.8em solid #bab825;
		}

		div.riskbox td.risk1 a {
			color: #ef4b71;
			font-weight: bold;
		}

		div.riskbox td.risk2 a {
			color: #f29538;
			font-weight: bold;
		}

		div.riskbox td.risk3 a {
			color: #bab825;
			font-weight: bold;
		}

		div.riskbox td.bar {
			background-color: #c9d6ff;
			padding: 0px;
		}

			div.riskbox td.bar > span {
				display: flex;
				width: 100%;
				height: 1.8em;
			}

			div.riskbox td.bar a {
				display: block;
				flex: 1 1 0px;
				color: #000000;
				text-align: center;
				padding: 0.2em 0.3em;
				line-height: 1.6em;
				border-right: 2px solid #3c61b3;
			}

				div.riskbox td.bar a:last-child {
					border-right: none;
				}

				div.riskbox td.bar a:nth-child(1) {
					xbackground-color: #457be0;
				}

				div.riskbox td.bar a:nth-child(2) {
					xbackground-color: #7c92d8;
				}

				div.riskbox td.bar a:nth-child(3) {
					xbackground-color: #3c61b3;
				}

	div.frontmap {
		border-top: 1px solid #000000;
	}


	@media all and (max-width: 1099px) {
		div.firstpanel {
			flex-direction: column;
		}

		div.secondpanel {
			justify-content: space-between;
		}
	}

	@media all and (max-width: 899px) {
		div.frontgrid {
			grid-template-columns: 1fr;
		}

		div.frontmap {
			grid-row-start: 3;
		}

		div.firstpanel {
			flex-direction: row;
		}

		div.secondpanel {
			justify-content: space-evenly;
		}
	}

	@media all and (max-width: 549px) {
		div.firstpanel {
			flex-direction: column;
		}

		div.secondpanel {
			flex-direction: column;
			row-gap: 2em;
		}
	}

	/* Misc */
	.tac {
		text-align: center;
	}

	.tar {
		text-align: right;
	}

	.fr {
		float: right;
	}

	.clearafter:after {
		content: "";
		display: table;
		clear: both;
	}

	.red {
		color: #ff0000;
	}

	.max40 {
		max-width: 40em;
	}

	/* printing */

	@media print {
		xbody {
			transform-origin: left top;
			transform: scale(0.7);
		}

		.pcm_body, .pcm_bodywide {
			display: block;
			margin-left: auto;
			margin-right: auto;
		}

		.pcm_table th, .pcm_table td {
			padding: 2px 10px;
		}
	}


	/* new building details from ARR */

	div.buildgrid {
		display: grid;
		grid-template-columns: 1fr 1fr 15em;
		grid-column-gap: 2em;
		column-gap: 2em;
		grid-row-gap: 2em;
		row-gap: 2em;
	}

		div.buildgrid input[type=submit] {
			background-color: #ffffff;
			color: #000000;
			font-weight: normal;
			border: 1px solid #113258;
			border-radius: 1em;
			padding: 0.3em 0.5em;
			xmargin-top: -0.2em;
		}

			div.buildgrid input[type=submit].btnCyan {
				background-color: #e0ffff;
			}

	div.pageheader {
		width: 100%;
		background-color: #113258;
		font-size: 110%;
		font-weight: bold;
		color: #ffffff;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		margin-bottom: 2em;
		box-shadow: rgba(0, 0, 0, 0.3) 3px 3px 10px;
	}

		div.pageheader span, div.pageheader div {
			display: block;
			padding: 0.5rem 1.5rem;
			margin: 0px;
			flex-grow: 1;
		}

			div.pageheader span.assetid {
				padding-right: 0px;
			}

			div.pageheader span.address {
				flex-grow: 999;
			}

			div.pageheader div.goRef {
				position: relative;
				padding-right: 2.5em;
				margin-right: 1em;
				text-align: right;
			}

				div.pageheader div.goRef input.btn_go {
					top: 0.5em;
				}

				div.pageheader div.goRef input[type=text] {
					width: 5em;
				}

	div.box {
		xxborder: 1px solid #000000;
		box-shadow: rgba(0, 0, 0, 0.3) 3px 3px 10px;
	}

	div.buildgrid div.box:nth-child(2) {
		grid-column-start: 1;
		grid-row-start: 1;
	}

	div.buildgrid div.box:nth-child(3) {
		grid-column-start: 1;
		grid-row: 2 / 4;
	}

	div.buildgrid div.box:nth-child(4) {
		grid-column-start: 2;
		grid-row: 1 / 3;
	}

	div.buildgrid div.box:nth-child(5) {
		grid-column-start: 2;
		grid-row: 3;
	}

	div.boxheader {
		background-color: #3e95d1;
		color: #ffffff;
		padding: 0.5rem 1rem;
		font-weight: bold;
		flex-grow: 0;
	}

	div.boxcontent {
		padding: 1rem;
	}

		div.boxcontent input[type=text] {
			width: 100%;
		}

	div.boxcontentgrid {
		padding: 1rem;
		position: relative;
		display: grid;
		grid-template-columns: minmax(6em, 13em) 1fr;
		grid-column-gap: 0.5em;
		column-gap: 0.5em;
		grid-row-gap: 0.5em;
		row-gap: 0.5em;
	}

		div.boxcontentgrid hr {
			grid-column-start: span 2;
			width: 100%;
		}

		div.boxcontentgrid div.picmap {
			grid-column-start: span 2;
			width: 100%;
			display: flex;
			align-items: stretch;
			height: 12em;
			column-gap: 1em;
		}

	div.picdiv {
		flex: 5 1 min-content;
		max-width: fit-content;
	}

	div.mapdiv {
		flex: 2 1 50px;
	}

	div.boxcontentgrid div.picmap img {
		max-width: 100%;
		max-height: 100%;
		margin: 0px;
	}

	div.boxcontentgrid img, div.boxcontent .pcm_table {
		margin-top: 1em;
	}

	div.picmap iframe {
		width: 100%;
		height: 100%;
	}

	span.nobtn {
		grid-column-start: span 2;
	}

	span.btnspn input {
		width: 100%;
	}

	div.boxcontentgrid span.btnspn, div.boxcontentgrid input {
		align-self: start;
	}

	div.boxbuttons {
		grid-column-start: 3;
		grid-row-start: span 3;
		background-color: #e7ebf8;
		box-shadow: rgba(0, 0, 0, 0.3) 3px 3px 10px;
	}

	div.btnsec1 {
		padding: 1em;
		background-color: #cbd3ef;
		flex-grow: 0;
	}

	div.btnsec2 {
		padding: 1em;
		background-color: #e7ebf8;
		flex-grow: 1;
	}

	div.boxbuttons input {
		width: 100%;
		margin-bottom: 0.7em;
	}

	div.vflex {
		display: flex;
		flex-direction: column;
	}

	div.boxspacer {
		flex-grow: 1;
	}

	div.boxfooter {
		background-color: #e7ebf8;
		padding: 1rem 1rem 0px 1rem;
		flex-grow: 0;
	}

		div.boxfooter input[type=submit] {
			width: 14em;
			max-width: 100%;
			margin-right: 1em;
			margin-bottom: 1rem;
		}

	div.box textarea {
		width: 100%;
		resize: vertical;
	}

	@media all and (max-width: 999px) {
		div.buildgrid {
			grid-template-columns: 1fr 14em;
		}

		div.boxbuttons {
			grid-column-start: 2;
			grid-row: span 2;
		}

		div.buildgrid div.box:nth-child(2) {
			grid-column-start: 1;
			grid-row: 1;
		}

		div.buildgrid div.box:nth-child(3) {
			grid-column-start: 1;
			grid-row: 2;
		}

		div.buildgrid div.box:nth-child(4) {
			grid-column-start: 1;
			grid-row: 3;
		}

		div.buildgrid div.box:nth-child(5) {
			grid-column-start: 1;
			grid-row: 4;
		}
	}

	@media all and (max-width: 699px) {
		div.buildgrid {
			grid-template-columns: 100%;
		}

		div.boxbuttons {
			grid-column-start: auto;
			grid-row-start: auto;
			text-align: justify;
			text-align-last: justify;
		}

			div.boxbuttons input[type=submit] {
				width: 13em;
				max-width: 100%;
				margin-bottom: 0.5em;
				text-align-last: center;
			}

		div.buildgrid div.box:nth-child(2) {
			grid-column-start: auto;
			grid-row-start: auto;
		}

		div.buildgrid div.box:nth-child(3) {
			grid-column-start: auto;
			grid-row-start: auto;
		}

		div.buildgrid div.box:nth-child(4) {
			grid-column-start: auto;
			grid-row: auto;
		}

		div.buildgrid div.box:nth-child(5) {
			grid-column-start: auto;
			grid-row: auto;
		}
	}

	@media all and (max-width: 499px) {
		div.boxcontentgrid div.picmap {
			flex-direction: column;
			height: auto;
			row-gap: 1em;
		}
	}



	/* pie chart */

	div.boxfooter h4 {
		font-weight: normal;
		font-size: 11pt;
		color: #636563;
		text-align: center;
		text-align-last: center;
		margin: -1em 0px 1em 0px;
	}

	ul.chartkey {
		margin-bottom: 2em;
		list-style: none;
		text-align-last: left;
	}

		ul.chartkey li::before {
			content: "◼";
			color: #48a23f;
			display: inline-block;
			width: 1em;
			margin-left: -1em;
			font-size: 120%;
		}

		ul.chartkey li:nth-child(2)::before {
			color: #ff8300;
		}

		ul.chartkey li:nth-child(3)::before {
			color: #e9442d;
		}

	div.chartholder {
		margin-bottom: 1em;
		xcursor: pointer;
	}

	div.chart {
		width: 10em;
		height: 10em;
		overflow: hidden;
		margin: 0px auto 0.5em auto;
		background-color: #d9d9d9;
		border-radius: 5em;
		position: relative;
		z-index: 1;
	}

	div.chartleft, div.chartright {
		position: absolute;
		overflow: hidden;
		height: 10em;
		width: 5em;
	}

	div.chartleft {
		top: 0%;
		right: 50%;
	}

	div.chartright {
		top: 0%;
		left: 50%;
	}

	div.chartslice {
		position: absolute;
		height: 10em;
		width: 10em;
		transform-origin: bottom left;
		box-sizing: border-box;
	}

	div.chartleft div.chartslice {
		right: 0%;
		top: 45%;
		transform-origin: 100% 5%;
		padding-top: 5%;
	}

	div.chartright div.chartslice {
		left: 0%;
		bottom: 45%;
		transform-origin: 0% 95%;
		padding-bottom: 5%;
	}

	div.chartline {
		position: absolute;
		left: calc(5em - 2px);
		top: 0px;
		width: 2px;
		height: 5em;
		background-color: #ffffff;
		z-index: 100;
		transform-origin: bottom center;
	}

	div.donut {
		position: absolute;
		left: 3em;
		top: 3em;
		width: 4em;
		height: 4em;
		background-color: #e7ebf8;
		border-radius: 2em;
		z-index: 101;
	}

	/* Audits */
dl.auditdata {
	margin: 1.5em 0px 3em 0px;
	display: grid;
	grid-template-columns: max-content 1fr;
	grid-column-gap: 1em;
	grid-row-gap: 0.5em;
}

dl.auditdata dt {
	font-size: 100%;
	font-weight: bold;
	margin: 0px;
	padding: 0px;
	color: inherit;
}

dl.auditdata dd {
	margin: 0px;
	padding: 0px;
}


/* fonts */
@font-face {
	font-family: 'roboto';
	src: url('Fonts/Roboto-Light-webfont.woff') format('woff');
	font-weight: 100;
}

	@font-face {
		font-family: 'roboto';
		src: url('Fonts/Roboto-LightItalic-webfont.woff') format('woff');
		font-weight: 100;
		font-style: italic;
	}

	@font-face {
		font-family: 'roboto';
		src: url('Fonts/Roboto-Bold-webfont.woff') format('woff');
		font-weight: bold;
		font-style: normal;
	}

	@font-face {
		font-family: 'roboto';
		src: url('Fonts/Roboto-BoldItalic-webfont.woff') format('woff');
		font-weight: bold;
		font-style: italic;
	}

	@font-face {
		font-family: 'roboto';
		src: url('Fonts/Roboto-Regular-webfont.woff') format('woff');
		font-weight: normal;
		font-style: normal;
	}

	@font-face {
		font-family: 'roboto';
		src: url('Fonts/Roboto-Italic-webfont.woff') format('woff');
		font-weight: normal;
		font-style: italic;
	}