table {
	width: 100%;
}

table th {
	font-size: .85em;
	border: 1px solid #FCF9FC;
	font-weight: normal;
}

table th.office {
	font-size: .85em;
	border: 1px solid #FCF9FC;
	font-weight: bold;
	padding: 10px;
}

table td {
	font-size: .85em;
	border: 1px solid #ffffff;
	font-weight: bold;
}

table td.column {
	text-align: center;
	padding: 10px;
}

table td.datacolumn {
	text-align: left;
	padding: 10px;
}

table td.office {
	width: 20%;
	font-weight: bold;
}

table td.colcolorgrp1, table th.colcolorgrp1 {
	background-color: #4e72a7;
	font-family: Arial;
	color: white;
	font-size: 12px;
}

table td.colcolorgrp2, table th.colcolorgrp2 {
	background-color: #3498DB;
	font-family: Ebrima;
	color: white;
	font-size: 14px;
}

table td.colcolorgrp3, table th.colcolorgrp3 {
	background-color: #ffffff;
	font-family: Arial;
	color: #006400;
	font-size: 12px;
}

table td.colcolorgrp4, table th.colcolorgrp4 {
	background-color: #64a2d8;
	font-family: Arial;
	color: black;
	font-size: 12px;
}

table td.colcolorgrp5, table th.colcolorgrp5 {
	background-color: #70cc62;
	font-family: Arial;
	color: black;
	font-size: 12px;
}

table td.colcolorgrp6, table th.colcolorgrp6 {
	font-family: Arial;
	color: green;
	font-size: 12px;
}

table td.colcolorgrp7, table th.colcolorgrp7 {
	font-family: Arial;
	color: #a2537a;
	font-size: 12px;
}

.table {
	margin: auto;
	width: 50% !important;
}

.company {
	align-items: right;
}

.datapoint {
	font-family: Calibri;
	color: #1C2833;
	font-size: 12px;
}

.imgbrd {
	border: 1px solid #AEB6BF;
}

.bton {
	width: 400px;
}

.billinfoheading1 {
	font-family: Arial;
	color: #167fbb;
	font-weight: bold;
	font-size: 14px;
}

.billinfoheading2 {
	font-family: Arial;
	color: #08b9dc;
	font-weight: bold;
	font-size: 14px;
}

.heading {
	font-family: Arial;
	color: #227718;
	font-size: 20px;
	font-weight: bold;
}

.heading2 {
	font-family: Arial;
	color: #227718;
	font-size: 18px;
	font-weight: bold;
}

.blinking {
	font-family: Arial;
	color: green;
	font-size: 20px;
	animation: blinker 1s linear infinite;
}

hr {
	display: block;
	height: 2px;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	margin-left: auto;
	margin-right: auto;
	border-style: inset;
	border-width: 1px;
	background-color: #effd;
}

.vl {
	border-style: inset;
	border-width: 1px;
	background-color: #effd;
}

@
keyframes blinker { 50% {
	opacity: 0;
}

}
@media screen and (max-width: 600px) {
	table {
		border: 0;
	}
	table caption {
		font-size: 1.3em;
	}
	table thead {
		border: none;
		clip: rect(0, 0, 0, 0);
		height: 1px;
		margin: -1px;
		overflow: hidden;
		padding: 0;
		position: absolute;
		width: 1px;
	}
	table tr {
		border-bottom: 3px solid #ddd;
		display: block;
		margin-bottom: .625em;
	}
	table td {
		border-bottom: 1px solid #ddd;
		display: block;
		font-size: .8em;
		font-weight: bold;
		text-align: right;
		width: 95%;
		padding: 5px;
	}
	table td.office {
		font-weight: bold;
		width: 100%;
	}
	table td.column {
		text-align: right;
		width: 100%;
	}
	table td.datacolumn {
		text-align: right;
		width: 100%;
		padding: 10px;
	}
	table td::before {
		/*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
		content: attr(data-label);
		float: left;
		font-weight: bold;
		text-transform: uppercase;
	}
	table td:last-child {
		border-bottom: 0;
	}
	.bton {
		width: 200px;
	}
	.billinfoheading1 {
		font-family: Arial;
		color: #167fbb;
		font-size: 10px;
		display: inline-block;
		word-break: break-word;
	}
	.billinfoheading2 {
		font-family: Arial;
		color: #08b9dc;
		font-size: 10px;
		display: inline-block;
		word-break: break-word;
	}
	.heading {
		font-family: Arial;
		color: #227718;
		font-size: 12px;
		font-weight: bold;
	}
	.heading2 {
		font-family: Arial;
		color: #227718;
		font-size: 12px;
		font-weight: normal;
	}
	.blinking {
		font-family: Arial;
		color: green;
		font-size: 12px;
		animation: blinker 1s linear infinite;
	}
	.datapoint {
		font-family: Calibri;
		color: #1C2833;
		font-size: 12px;
	}
	.company {
		text-align: center;
	}
}