@charset "UTF-8";
body {
	color: #666;
	background-position: center top;
	background-repeat: no-repeat;
	margin-top: 28px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	line-height: 21px;
}
body p {
	margin-top: 0px;
	margin-bottom: 11px;
}		
body ul {
	margin-top: 6px;
	margin-bottom: 10px;
}
body li {
	list-style-position: outside;
	list-style-image: url(../_assets/branding/bullet-square-gold.png);
	margin-bottom: 6px;
}
body a:link, body a:visited{
	color: #BA1C21;
	text-decoration: none;
}
body a:hover {
	color: #BA1C21;
	text-decoration: underline;
}
h1 {
	font-size: 22px;
	color: #a9252f;
	margin-top: 0px;
	margin-bottom: 9px;
	line-height: 22px;
}
h2 {
	font-size: 16px;
	margin-top: 0px;
	color: #15638f;
	margin-bottom: 2px;
}
h3 {
	font-size: 14px;
	margin-top: -7px;
	margin-right: 0px;
	margin-bottom: 3px;
	margin-left: 1px;
	color: #018a4e;
}
h4 {
	margin-top: -10px;
	margin-right: 0px;
	margin-bottom: 18px;
	margin-left: 1px;
	font-weight: normal;
}
.captions {
	/* 'OVERFLOW: HIDDEN' is essential to maintain heights (Must not have a minimum height) */
/* 'RELATIVE' ensures captions comes to the front and above any drop shadows */
	font-style: italic;
	font-size: 13px;
	line-height: normal;
	position: relative;
	color: #FFFFFF;
	overflow: hidden;
	padding-top: 4px;
	z-index: 100;
}
.captions p       {
	margin-top: 0px;
	margin-bottom: 3px;
}
.caption01  {
	padding-right: 35%;
}
.caption01R {
	text-align: right;
	padding-left: 40%;
}
.caption02 {
	color: #cc1316;
}
.caption02R {
	text-align: right;
	padding-left: 70px;
}
#WRAPPER {
	margin-right: auto;
	margin-left: auto;
	max-width: 1214px;
	padding-right: 10px;
	padding-left: 10px;
}
#WRAPPER-inner {
/* Note the Background size here. That will make it flexi on smaller screens eg a 9.7inch ipad */
/* Make Size of BG 80% of viewpoint. eg If viewpoint is 1200 and size wanted is 80% then make it 960px wide */
	background-image: url(../_assets/backgrounds/bg-panel01.png);
	background-size: 80%;
	background-repeat: no-repeat;
	background-position: left top;
}
******************* RESPONSIVE CSS {
}
@media (max-width:700px) {
body {
	margin: 10px;
}
body p, h4{
	margin-bottom: 7px;
}
h1  {
	display: none;
}
h4 {
	margin-top: -2px;
	margin-bottom: 15px;
	color: #BB1D21;
}
.captions {	/* 'OVERFLOW: HIDDEN' is essential to maintain heights (Must not have a minimum height) */
	display: none;
}
.captions p{
	margin-bottom: 0px;
}
.caption01    {
	padding-right: 0px;
}
.caption01R, .caption02R{
	text-align: left;
	padding-left: 0px;
}
#WRAPPER {
	padding-right: 0px;
	padding-left: 0px;
}
#WRAPPER-inner {
	display: flex; /* FLEXFLEXFLEXFLEX */
	flex-direction: column; /* FLEXFLEXFLEXFLEX */	
	background-image: none;
}