body { margin: 0;
 padding: 0; 
 text-align: center; 
 background: url('fog.jpg')
 }


/* Globals */
* {
	margin: 0;
	padding: 0;
	border: 0;
	text-align: left;
	font-family: Verdana, Arial, sans-serif;
	font-size: 17px;
	line-height: 18px;
	color: #999;
	font-weight: normal;
	letter-spacing: -1px;
}



/* Layout */



#navarea {
	width: 86%;
	height: 52px;
	background: transparent;
	padding-left:144px;

}
 /* This div allows an area for the main navigation tabs */

#hdr {  /* header/banner area */
	width: 99%;
	height: 60px;
	background: url('00zasflash.gif') no-repeat 52px top;
	margin-bottom: -14px;
}
 #lftcol {  /* left column showing the extra info on the left side of the main column */
	float: left;
	width: 158px;
	background: url('00zas00.png') no-repeat bottom left;
	height: 460px;
}

#maincol {  /* main column where the main text etc is located */
	float: left;
	width: 63%;
	background: transparent url('trans7.gif');
	height: 460px;
	overflow: auto;
}


 #rtcol {  /* right column showing the extra info on the left side of the main column */
	float: left;
	width: 9%;
	height:200px;
	margin-left: 4%;
	overflow: visible;
}


#bttmbar {  /* bottom bar houses the copyright information and the bottom navigation */
	margin-bottom: 20px;
	float: left;
	width: 76%;
	height: 30px;
    background: transparent;
	overflow: visible
}

#bttmbar span#copyright {   /*styles for the copyright text */
	margin-left: 10px;
	float: left;
	line-height: 30px;
	text-align: right;
	font-size: 11px; 
	color: #18ADF7;
}

/* Text styles */

/* Below is the style for the main site title */


#sitetitle { /* Styles for the main site title */
	position: relative;
	top: 1px;  /* shifts text into exact position */
	left: 177px;  /* shifts text into exact position */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 40px;
	line-height: 38px;
	font-weight: 600;  /* 100 is the thinnest font weight */
	color: #18ADF7; /* nice light orange "autumn" type colour */
	letter-spacing: 7px /* spaces out the letters a bit */;
	font-style: oblique;
	}
	
#subtitle {  /* Styles for the sites subtitle */
	position: absolute;
	top: 69px;  /* shifts text into exact position */
	left: 376px;  /* shifts text into exact position */
	font-size: 14px; 
	font-weight: bold;
	line-height: 16px;
	color: #18ADF7;
	letter-spacing: 3px /* spaces out the letters a bit */
	}
	
#subtitle a {   /* Styles for any links in the sub title */
	font-size: 12px; 
	font-weight: normal;
	line-height: 18px;
	color: #6488F7;
	letter-spacing: 3px; /* spaces out the letters a bit */
	text-decoration: none;
	border-bottom: 1px dashed #496FE4;
}
	
#subtitle a:hover {   /* Styles for any links in the sub title, hover state */
	color: #0033CC; 
	text-decoration: none;
	border-bottom: 1px dashed #FFF000;
	}

#maincol p {
	color: #C5CEE7;
	margin: 8px 40px 4px 145px;
	letter-spacing: 1px;
	font-size: 16px;
}  /* paragraph text in the main column */
#maincol p a {  float: right;}  /* link in paragraph text in the main column */

#maincol h1,h2 {    /* Styles for the main column headers */
	font-family: Verdana, Arial, sans-serif;
	font-size: 19px;
	font-weight: 600;
	line-height: 21px;
	color: #D5F4FF;
	letter-spacing: 2px;
	font-style: normal;
	text-align: left;
	margin: 10px 2px 12px 36px;
	 } 
	 
#maincol h3 {
	font-family: Verdana, Arial, sans-serif;
	font-size: 16px;
	font-weight: 600;
	line-height: 21px;
	color: #D5F4FF;
	letter-spacing: 2px;
	font-style: oblique;
	text-align: left;
	margin: 10px 2px 12px 36px;
	 } 	 
	 
#maincol h4 {
	font-family: Verdana, Arial, sans-serif;
	font-size: 15px;
	font-weight: 600;
	line-height: 21px;
	color: #D5F4FF;
	letter-spacing: 2px;
	font-style: oblique;
	text-align: left;
	margin: 10px 2px 12px 36px;
	 } 	 
	  /* headings in the main column */

#maincol .date {    /* These are the styles for the blog dates */
	margin-left: 35px;
	font-size: 11px;
	color: #8CDFFF;
	letter-spacing: 1px;
	font-weight: 500;
}

#maincol .descr {    /* These are the styles for descriptions */
	margin-left: 25px;
	font-size: 15px;
	color: #DEEBFE;
	letter-spacing: 1px;
	font-weight: bold;
}

#maincol .note {    /* These are the styles for notes */
	margin-left: 140px;
	font-size: 13px;
	color: #FF0033;
	font-weight: 500;
	margin-top: -26px;
}

#maincol .notes {    /* These are the styles for notes */
	margin-left: 120px;
	font-size: 16px;
	color: #00CCFF;
	margin-top: 16px;
	font-weight: bold;
}
#maincol .notes li {    /* These are the styles for notes */
	margin-left: 30px;
	font-size: 15px;
	color: #00CCCC;
	margin-top: 16px;
	font-weight: bold;
}

#maincol a:link, #maincol a:visited {   /* These are the styles for the Main column links */
	padding-left: 11px;
	color: #00FFCC;
	text-decoration: none;
	text-align: left;
	font-weight: bold;
}

#maincol a:hover, #maincol a:active {   /* These are the styles for the Main column links */
	padding-left: 14px;
	color: #00FF66;
	text-decoration: blink;
	text-align: left;
	font-style: oblique;
}

#lftcol a:link, #lftcol a:visited {   /* These are the styles for the left column links */
	padding-left: 7px;
	color: #00FFCC;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
}
	
#lftcol a:hover, #lftcol a:active {    /* These are the styles for the left column links */
	padding-left: 4px;
	color: #00FF66;
	text-decoration: blink;
	text-align: center;
	font-size: 17px;
	font-weight: bold;
	padding-top: 3px;
	padding-bottom: 4px;
	margin-bottom: 4px;
	margin-top: 4px;
	line-height: 18px;
	letter-spacing: -1px;
}

#lftcol a.aqui {
	padding-left: 4px;
	color: #00FF66;
	text-align: left;
}


/* Menu tool tips. */
/*  hides the menu tool tips. */
#lftcol  a span { display : none }

/* position, size, color, etc of menu tool tips. */
#lftcol a:hover span {
	width : 134px;
	padding : 5px;
	margin : 8px;
	border : solid #00FF66 2px;
	display : block;
	color : #E4E4E4;
	background-color : #666666;
	font : 11px Verdana, Arial, sans-serif;
	text-align : left;
	position : absolute;
	left : -2px;
	top: 256px;
}

	
	
.leftcolbox p,h1,h2,h3 {   /* Titles, text in the left column */
	font-family: Verdana, Arial, sans-serif;
	margin: 3px 0px 5px 0px;
	font-weight: bold;
	color: #A6D2FF;
	letter-spacing: 0;
	font-size: 17px;
	line-height: 20px;
	font-style: oblique;
	text-align: center;
}





/* Main Nav, Right Nav */


#rtnav {
	float: left;
	margin-top: 22px;
	white-space: nowrap;
	background-image: url(trans7.gif);
}



#nav  /* Main nav, Right Nav */
{
	float: right;
	margin-top: 22px;
	white-space: nowrap;
	background-image: url(trans7.gif);
}

#nav li, #rtnav li  /* Main nav, Right Nav list items */
{
	font-size: 14px;
	float: left;
	list-style: none;
	line-height: 26px; /* height of the tab */
	text-align: center;
}

#nav a, #rtnav a  {   /* Main nav, Right Nav styles for all links */
	font-size: 14px;
	padding-left: 4px;
	display: block; /* the  float: right; property under #nav li causes the menu to float to  inline position */
	margin-right: 4px;
	margin-top:5px;
	width: 132px;
	height: 30px;
	line-height: 26px; /* height of menu tab */
	text-decoration: none;
	letter-spacing: 1px;
	 }

#nav a:link, #nav a:visited, #rtnav a:link, #rtnav a:visited  /* Main nav, Right Nav link and visited states */
{
	color: #CCCCCC; 
	border-color: #5F5564;
	background-color: transparent; 
}

#nav a:hover, #nav a:active, #rtnav a:hover, #rtnav a:active /* Main nav, Right Nav hover and active states */
{
	color: #F2F2F2;
	background-color:transparent;
	font-size:15px;
	font-style: oblique;
	font-weight: bold;
	letter-spacing: 1px;
}

#nav a.here, #rtnav a.here  /* Main nav, Right Nav here state */
{
	color: #00CCCC;
	font-size: 15px;
	border-bottom-color: #00FFFF;
	background-color: transparent;
	font-style:oblique;
	font-weight:bold;
	height: 26px;
	letter-spacing: 1px;
}

/* Menu tool tips. */
/*  hides the menu tool tips. */
#nav  a span { display : none }

/* position, size, color, etc of menu tool tips. */
#nav a:hover span {
	width : 680px;
	padding : 2px;
	margin : 4px;
	border : solid #00CCFF 1px;
	display : block;
	color : #E4E4E4;
	background-color : #7A7A7A;
	font : 10px Verdana, Arial, sans-serif;
	text-align : left;
	text-indent: 13px;
	position : absolute;
	right : 4.6%;
	top: 0px;
	white-space:normal;
}


/* Other styles */

div.rule {  /* replaces hr for text divisions */
	margin: 20px 20px 20px 30px;
	width: 70%;
	height: 6px;
	background: url('transrule1.gif');
	border: 0;
}

div.leftcolbox {  /* boxes in the left column */
	padding: 6px 4px 4px 4px;
	margin: 250px 5px 0px 0px;
	width: 160px;
	background: transparent url('trans7.gif');
	overflow: hidden;
	height: 200px;
	}
	
div.rtcolbox {  /* boxes in the right column */
	padding: 11px 4px 11px 4px;
	margin: 4px 1px 6px -10px;
	background: transparent url('ccc.png');
	overflow: visible;
	float: left;
	width: 140px;
	}
	

acronym {  /* hovered over to show  def in title tag */
	color: #F2F9F9;
	border-bottom: 1px dashed #ccc;
	cursor: help;  /* To make cursor appear as a help question mark/arrow  */
	font-style: oblique;
}

/* Bottom Nav */

#bttmnav { float: right; margin-right: 10px }
#bttmnav li {display: inline; font-weight: normal;}
#bttmnav a {  padding-left: 10px; font-size: 9px; line-height: 30px; }
#bttmnav a:link, #bttmnav a:visited {
	color: #18ADF7;
	font-size: 12px;
}
#bttmnav a:hover, #bttmnav a:active {
	text-decoration: none;
	color: #18ADF7;
	font-size: 12px;
}

/* Normal lists */


#maincol ul {   /* styles main area unordered(bulleted) lists */
	margin-top: 8px; /* This margin is the top margin of the WHOLE list, hence why it is specified in ul and not li */
	margin-bottom: 15px; /* This margin is the bottom margin of the WHOLE list, hence why it is specified in ul and not li */
	margin-left: 80px; /* This margin is the bottom margin of the WHOLE list, hence why it is specified in ul and not li */
	list-style: square /* This controls the bullet point style. */;
	margin-right: 30px;
}

#maincol li {  /* List items in the main column */
	color: #C5CEE7;
	margin-left: 10px /* This margin acts as an indent for each list item. */;
	font-size: 16px;
	margin-bottom: 8px;
}

#maincol ol {   /* styles main area ordered(numbered) lists */
  margin-top: 15px; 
  margin-bottom: 15px; 
  font-size: 0.7em;
  line-height: 1.5em;
  list-style-type: decimal;
 }

/* Images */

#maincol img {   /* styles main area images */
	float: left;
	padding: 0px 13px 22px 2px;
	margin: -10px 5px 19px 12px;
 }
 
 #maincol h1 img {   
	float: left;
	padding: 3px 13px 4px 2px;
	margin: 4px 5px 1px 12px;
 }

#rtcol h2 {
	color: #00CCCC;
	letter-spacing: 1px;
	float: right;
	padding: 0 0 8px 18px;
	margin-bottom: -12px;
}
#rtcol p {
	color: #004284;
	margin: 5px;
	letter-spacing: 1px;
	line-height: 16px;
	text-indent: 9px;
	font-size: 14px;
	background-position: left -32px;
/*	overflow: visible; */
}  /* paragraph text in the main column */
#rtcol p a {  float: right}  /* link in paragraph text in the right column */

#rtcol a.here  /* Main nav here state */
{
	color: #00CCCC;
	font-size: 15px;
	background-color: transparent;
	font-weight:bold;
	height: 26px;
	letter-spacing: 1px;
}



/* Menu tool tips. */
/*  hides the menu tool tips. */
#rtcol  a span { display : none }

/* position, size, color, etc of menu tool tips. */
#rtcol a:hover span {
	width : 134px;
	padding : 5px;
	margin : 8px;
	border : solid #00CCFF 1px;
	display : block;
	color : #E4E4E4;
	background-color : #7A7A7A;
	font : 11px Verdana, Arial, sans-serif;
	text-align : left;
	position : relative;
	left : -10px;
	white-space:normal;
	top: 32px;
}


div.svc0{  /* holds small services tables */
	margin: 20px 20px 20px 100px;
	width: 70%;
	height: 200px;
	background: transparent;
	border: 0;
}

div.svc1{  /* holds small services tables */
	margin: 20px 20px 20px 100px;
	width: 70%;
	height: 150px;
	background: transparent;
	border: 0;
}
 
 div.svc2 {  /* holds longer services tables */
	margin: 20px 20px 20px 100px;
	width: 70%;
	height: 570px;
	background: transparent;
	border: 0;
}
 
 div.svc3 {  /* holds services tables */
	margin: 20px 20px 20px 140px;
	width: 70%;
	height: 510px;
	background: transparent;
	border: 0;
}
 
div.svc {  /* holds longest tables */
	margin: 20px 20px 20px 100px;
	width: 70%;
	height: 510px;
	background: transparent;
	border: 0;
}
.svc table{
	float: right;
	width: 400px;
	background-color:#CCCCCC;
	margin-left: 44px;
	text-align: center;
}


.svc td,th {
	vertical-align:middle;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 15px;
	background-color:#FFFFFF;
	color: #666666;
	font-weight: bold;
	padding: 2px;
	text-align: center;
}
.svc caption {
	text-align: center;
	font-weight: bolder;
	font-size: 20px;
	color: #FFFFFF;
	background-color: #33CCFF;
	line-height: 30px;
}