body {
   margin: 0; 
   padding: 0; 
   color: #c0c0c0; 
   background: #6699cc; 
   font-size: 100%;  
   font-family: Arial, Helvetica, sans-serif;
}
/* A little support for some of the legacy browsers*/
header, nav, article, footer {
	display: block;
}
a { 
   color: #ffff99; 
   text-decoration: underline; 
}
a:visited {
   color: #ffff99; 
   text-decoration: underline; 
}
#wrap {
   width: 74%; 
   margin: 0 auto; 
   background: #003366; 
}
#wrap-blog {
   width: 65%; 
   margin: 0 auto; 
   background: #003366; 
}
header { 
   padding: 0.45% 2.5%; 
   background: #000044; 
   margin: 0.1%; 
   overflow: hidden;
}
img {
	border: 1px solid #222;
	border-radius: 10px;
}
.logostyler {
	display: block;
	margin-left: auto;
	margin-right: auto;
	border: none;
	border-radius: none;
	clear: both;
	width: 120px;
	max-width: 95%;
}
hr {
	border: 1px solid #c0c0c0;
}
hr.topindex {
	width: 35%;
	margin-bottom: 1em;
}
.floatLeft {
   float: left; 
   margin: 0.8%; 
   max-width: 60%;
}
.floatRight {
   float: right;
   margin: 0.8%;
   max-width: 60%;
}
.floatRightFull {
   float: right;
   margin: 0.8%;
   max-width: 98%;
}
.imgLimit {
	display: block;
	margin-left: auto;
	margin-right: auto;
	max-width: 98%;
}
.floatRight-borderless {
	border: 0px;
	border-radius: 10px;
	float: right;
	margin: 0.8%;
	max-width: 30%;
}
h1 {
   text-align: center;
   margin: 0;
   color: #c0c0c0; 
   font-size: 1.75em;
   font-family: nunito, Arial, Helvetica, sans-serif;
}
h1.title {
	text-align: center;
	font-size: 1.5em;
}
p.title {
	text-align: right;
	font-size: 1.1em;
	font-family: nunito, Arial, Helvetica, sans-serif;
}
h2.articles {
	text-align: center;
	font-size: 1.5em;
}
p.header { 
   text-align: right; 
   color: #c0c0c0; 
   font-family: Arial, Helvetica, sans-serif;
   font-size: 1.1em;
}
p.center {
   text-align: center;
   color: #c0c0c0;
}
p.adtext {
	text-align: center;
	font-size: 80%;
	margin: 0px;
	padding: 0px;
}
nav {
   text-align: center;
   font-family: nunito, Arial, Helvetica, sans-serif;
   background: #003366; 
   padding: 0.4% 0.8%; 
   margin: 0.15%; 
}
nav ul {
   margin: 0%; 
   padding: 0%; 
   list-style: none; 
   background: #003366; 
}
nav li { 
   display: inline; 
   margin: 0; 
   padding: 2%; 
}
h2 { 
   margin: 0 0 0.5em; 
   color: #c0c0c0; 
   font-size: 1.5em;
   font-family: nunito, Arial, Helvetica, sans-serif;
}
h2.sitRight {
	text-align: right;
}
h2 a, h2 a:visited {
	color: #c0c0c0; 
	text-decoration: none; 
}
h2 a:hover {
	color: #c0c0c0; 
	text-decoration: underline; 
}
h3 {
   margin: 0 0 0.9em; 
   color: #c0c0c0; 
   font-size: 1.2em;
   font-family: nunito, Arial, Helvetica, sans-serif;
}
h3.ind { 
   margin: 0 0 0.5em; 
   color: #c0c0c0; 
   font-size: 1.4em;
   font-family: nunito, Arial, Helvetica, sans-serif;
}
h3.ind a, h3.ind a:visited {
	color: #c0c0c0; 
	text-decoration: none; 
}
h3.ind a:hover {
	color: #c0c0c0; 
	text-decoration: underline; 
}
.boldtext {
	font-weight: bold;
	font-family: nunito, Arial, Helvetica, sans-serif;
}
em.bold {
   font-weight: bold;
   font-style: normal;
}
article {
   margin-left: auto;
   margin-right: auto;
   width: 90%;
   padding: 0.8%;
   word-wrap: break-word;
}
#column {
	display: block;
	float: left;
	width: 46%;
	padding: 2%;
}
#section {
	display: block;
	margin: 2px;
}
#colorbox {
	background-color: #000044;
	border-radius: 10px;
	padding-top: 0.2em;
	padding-right: 1em;
	padding-bottom: 0.2em;
	padding-left: 1em;
	margin-bottom: 1em;
}
details {
   display: block;
   margin-left: auto;
   margin-right: auto;
   width: 90%;
   padding: 0.8%;
   background: #000044;
   text-align: center;
}
footer { 
   clear: both; 
   display: block;
   margin-left: auto;
   margin-right: auto;
   width: 90%;
   padding: 0.4% 0.8%; 
   background: #003366;  
   text-align: center; 
}
footer p {
   margin:0; 
}
* html #footer {
   height: 0.075%; 
}
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/nunito.woff2) format('woff2'), url(../fonts/nunito.woff) format('woff');
}


/*This section is purely used for the tables needed in the private details area. Added 15th March 2021 */
	table {
	  table-layout: fixed;
	  width: 100%;
	  font-size: 80%;
}
    table, th {
      border: 2px solid #ffff99;
}
	th {
	  background-color: #ffff99;
	  color: #000000;
}
	td {
	  border-style: solid;
	  border-bottom: 1px solid #000044;
	  border-top: 1px solid #ffffff;
	  border-left: 1px solid #ffffff;
	  border-right: 1px solid #000044;
	  text-align: center;
}

/* This bit takes the two columns in the index page and stacks them for mobile devices with smaller screens. */
@media only screen and (max-width: 800px) {
 #column {
   float: none;
   width: 100%;
   padding: 0%;
 }
 #wrap, #wrap-blog {
   width: 95%; 
   margin: 0 auto; 
   background: #003366; 
}
}