/* LAYOUT STYLES */

* {
  box-sizing: border-box;
}

[class*="col-"] {
  float: left;
  width: 100%;
  min-height: 255px;
/*   padding 1em; /*15px*/
}

[class*="tab-"] {width: 90%}

/* For mobile phones 
[class*="col-"] {
/*   width: 100%;
} */

@media only screen and (min-width: 650px) {
/* For tablets: */
  .col-s-1 {width: 100%;}
  .col-s-2 {width: 100%;}
  .col-s-3 {width: 40%;}
  .tab-650 {width: 90%;}
}

@media only screen and (min-width: 1000px) {
/* For desktop: */
  .col-1 {width: 22%;}
  .col-2 {width: 51%;} 
  .col-3 {width: 27%;}
  .tab-1000 {width: 100%; max-width: 800px;}
}

@media only screen and (min-width: 1200px) {
/* For wide desktop: */
  .col-w-1 {width: 18%;}
  .col-w-2 {width: 58%;}
  .col-w-3 {width: 24%;}
  .tab-1200 {width: 100%; max-width: 800px;}
}

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

#header {
  font-family: Arial Rounded MT Bold, Arial, Helvetica;
  margin:1.5em 1.2em 0em 1.2em;
  padding:1em 1.5em;
  border:none;
  background: rgb(000,000,128); /*H1BackColour*/
  color: rgb(255,128,051); /*H1ForeColour*/
}		

#header h1 { 
  margin:0; 
  padding:0;
  font-size:1.5em; /*  18pt; */
  white-space: nowrap;
  overflow: hidden;
}

#subHeader {
  margin-left:1.2em;
  margin-bottom:0.05em;
  margin-right:1.2em;
  font-size:1em;
  color: rgb(000,000,000); /*H2ForeColour*/
  background: rgb(255,255,255); /*H2BackColour*/
}

#subHeader h2 { 
  margin-top:0; 
  margin-bottom: 0.4em;
  padding-left:1em;
  padding-bottom:0.5em;
  padding-top:0.5em;
  border-width: 0.1em; /*  2px;*/
  border-style: solid;
  border-color: rgb(000,000,128); /*H1BackColour*/
  white-space: nowrap;
  overflow: hidden;
}

#instructions {
  margin-left: 15em; 
  margin-right:1em;
  padding: 0.5em;
  padding-left: 0em;
  height: 4em; /* 75px; */
}

#footer {
  position: relative;
  top: 1em;
  bottom: 0;
  padding: 0.25em;
  background: rgb(000,000,128); /*H1BackColour*/
  color: rgb(255,128,051); /*H1ForeColour*/
  clear: both; 
  margin-left: 1.2em;
  margin-right: 1.2em;
}

table {
	margin:20px;
}

tr {
	border-bottom:solid 0.1em;
}

.TableImageCell {
	margin-left:0; 
	padding-top:1em;
	padding-bottom:1em;
}

.ti {
	margin-bottom:1em;
}

.p-spacer {
	margin:0;
	padding:0;
}

.LeftArrow {
  position: relative;
  top: 2em; 
  clear: both; 
  margin-left: 2em;
}

.LAText {
  position: relative;
  top: 0em; 
  left: 2em;
  clear: both; 
  margin-left: 2em;
}

.RightArrow {
  position: relative;
  float: right;
  top:-3.2em;
  margin-right: 3em;
  clear: both; 
}

.RAText {
  position: relative;
  float: right;
  top:-1.2em;
  margin-right: 5em;
  clear: both; 
}

.gallery {
  position: relative;
  padding-bottom: 0.4em;
  padding-top: 0.25em;
  margin: 0.33em;
  margin-left: 1.2em;
  margin-top: 0.75em;
  border: 0.1em Solid RGB(150,150,150);
  float: left;
  width: 12em; /* 180px; */
  height: 10.5em; /* 165px; */
}

.gallery img {
  width: auto; 
  height: auto; 
  display: block;
  margin: 0 auto;
}

.caption {
  position: absolute; 
  padding: 0.45em; 
  text-align: left; 
  font-size: 0.85em; 
  bottom: 0;
}

.clearing {
  height: 0;
  clear: both;
}

#slideshow {
  font-size: 10pt; 
  font-family: Arial; 
  cursor: hand; 
  color: rgb(000,000,000); /*BodyForeColour*/
  width: 403; 
  height: 25;
}

#ADSS-Logo {
	float: right; 
	margin: 1em;
	margin-top: 0em;
	padding: 1em;
	border-width:  0.75em;
	border-style: solid;
	border-Color: RGB(000, 000, 128); /*H1BackColour*/
}

/* TEXT STYLES */
body {
  margin:0;
  padding:0;
  background-color: rgb(224,224,224); /*BodyBackColour*/
  font-family: Arial, Helvetica;
  color: rgb(000,000,000); /*BodyForeColour*/
}

a {
  text-decoration:none; color:rgb(000,000,000);
}

p
{
   margin-left: 2em;
   margin-top: 0.95em;
   padding-top: 0.95em;
}

h1, h2, h3, h4, h5, h6
{
   font-family: Arial Rounded MT Bold, Arial, Helvetica;
}

.standard {
   color: rgb(000,000,000); /* BodyForeColour*/
   margin-top: 0;
   margin-bottom: 0.3em;
   font-size: 0.8em;
}

.arrow {
   color: rgb(000,000,000); /* PrevNextForeColour*/
   margin-top: 0;
   margin-bottom: 0em; 
   font-size: 1em;
}

.last {
   color: rgb(255,128,051); /*H1ForeColour*/
   margin-top: 0;
   margin-bottom: 0;
   margin-left: 0.3em;
   font-size: 0.8em;
   padding: 0;
}

.maintext {
   margin-right: 2em;	
/*   margin-top: 0em; */
}

ol {
	margin-left: 2em;
}

/* --- menu styles ---
note:
   not all browsers render styles the same way so try out your style sheet
   on different browsers before publishing;
*/
/*****************/
/* level 0 inner */

.m0l0iout {
   font-family: Calibri, Verdana, Tahoma, Geneva, Arial, Helvetica, sans-serif;
   font-size: 22px;
   text-decoration: none;
   padding: 6px;
   padding-top: 2px;
   color: rgb(000,000,000); /*Menu1ForeColour*/
}

.m0l0iover {
   font: bold 22px Calibri, Verdana, Tahoma, Geneva, Arial, Helvetica, sans-serif;
   text-decoration: none;
   padding: 4px;
   padding-top: 2px;
   color: rgb(000,000,000);
}

/*****************/
/* level 0 outer */

.m0l0oout {
   text-decoration : none;
   border : 1px solid #000000;
   background: rgb(255,128,051);    /*Menu1BackColour*/
}

.m0l0oover {
   text-decoration : none;
   border : 1px solid #000000;
   background: rgb(255,128,051);    /*** main menu background colour ***/
}

/*****************/
/*****************/

/* level 1 inner */
.m0l1iout {
   font: 18px Calibri, Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
   text-decoration: none;
   padding: 4px;
   color: rgb(000,000,000);   /*Menu2ForeColour*/
}

.m0l1iover {
   /******* level 1 menu text colour with mouse over *******/
   font: bold 18px Calibri, Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
   text-decoration : none;
   padding: 4px;
   color:  rgb(000,000,000);   /*** 1st sub menu text colour ***/
}

/*****************/

/* level 1 outer */

.m0l1oout {
   text-decoration : none;
   border : 1px solid #000000;
   background: rgb(255,192,128);    /*Menu2BackColour*/
}

.m0l1oover {
   text-decoration : none;
   border : 1px solid #000000;
   background: rgb(255,192,128);    /*** main menu background colour ***/
}

/*****************/
/*****************/

/* level 2 inner */

.m0l2iover {
   font: bold 18px Calibri, Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
   text-decoration : none;
   padding: 4px;
   color: rgb(000,000,000);   /* Menu3ForeColour */
}

/* level 2 outer */

.m0l2oout {
   text-decoration : none;
   border : 1px solid #000000;
   background: rgb(255,230,204);   /* Menu3BackColour */
}

.m0l2oover {
   text-decoration : none;
   border : 1px solid #000000;
   background: rgb(255,230,204);   /* Menu3BackColour */
}

/*****************/