/*   CSS for SCAC webpages. Adapted from AAA WA website pages, commenced 25 July 2013   */
/*   By T Fuller 08 9447 4545             */
/*   This is the SCREEN style sheet       */
/*   Print style sheet is separate        */
/*   Still has some unused definitions    */
/*   IE6 needs font sizes in % not ems otherwise changing text sizes goes bad. See ie6.css. Unused styles not yet included in that */

/*   Last update on ###### 3 July 2015 ##########  */

body {
margin-left: 1px;
margin-right: 1px;
margin-top: 1px;
padding: 0;
height: 100%;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
text-align: center; /* IE quirky center */
background: #E0E0E0 url(Images/PageBackground.jpg) no-repeat; 
border-top: 3px solid #58ACFA; 
background-attachment:fixed;
-webkit-text-size-adjust: 100%;  /* for iPhone see http://stackoverflow.com/questions/2545542/font-size-render-in-iphone */
}

html {
margin-left: 1px;
margin-right: 1px;
margin-top: 1px;
padding: 0;
/* height: 100%; */ 
/* Left column was too long in Firefox, etc. Fixed by removing height: 100%; */
font-size: 1em;
text-align: center; /* IE quirky center */
}

div.wrapper, div.wrapper2 {  /* around entire page contents, or around footer. Define separately if necessary */
position: relative;
width: 99%;
min-width: 850px; /* to allow room for images and long words */
min-height: 10%; /* IE has height hacked in in conditional below */
margin: 3px auto 0px auto ; /* compliant center  */
max-width: 1200px; /* added this to limit page width */
text-align: left; /* reset text alignment */
overflow: hidden; /* fixed Opera display of left column, was too long */
}

/* ####### Header Items ######## */

div.header {
position: relative;
width: 97.5%;
min-width: 850px; /* to match wrapper div */
max-width: 1200px; /* added this to limit page width */
margin: 0 auto; /* important leave this */
background: #EFFFFF ; 
margin-top: 50px;
margin-left: 20px;
padding-bottom: 2px;
height: 130px; 
border-top-left-radius:1em;
border-top-right-radius:1em;
border-bottom: 3px solid #B7AE9E; 
box-shadow: 4px -1px 3px #666;   /* horizontal vertical blur spread colour */
}

div.HeaderSearch {
height: 30px;
text-align: right;
}

div.HeaderText {  /* Specify the height for the text contents, to move the Seach div down  */
height: 75px;
text-shadow: 2px 2px 2px #AAA
}

/* ######   Side by side Header ##################### */

div.sideBySideHeaderOuter {  /*  Outside container used for logo and header text, inside the header div  */
min-width: 850px; /* to match wrapper div */
max-width: 1200px;
padding: 5px 0px 0px 0px; /* Top Right Bottom Left */
}

div.sideBySideHeaderLeft {  /*  Left hand side container used for logo, inside the header div  */
float: left;
width: 10%;
padding: 0px 0px 0px 5px; /* Top Right Bottom Left */
}

.sideBySideHeaderLeft img {  /*  Image in left hand side container used for logo, inside the header div  */
border: 0;  /* IE8 adds a visible border here, so need to specify no border  */
margin-top: -50px;
margin-left: 5px;
z-index: 500;
}

div.sideBySideHeaderCenter {  /*  Center container used for header text, inside the header div  */
float: left;
width: 72%;
margin-top: 12px;
}

div.sideBySideHeaderRight {  /*  Right hand side container used for a single image, no more than 138 wide x 112 high */
float: right;
width: 17%;
text-align: center;
margin-top: -2px;
}

div.sideBySideHeaderRight img { 
border-top-left-radius:1.2em;
border-top-right-radius:1.2em;
border-bottom-right-radius:1.2em;
border-bottom-left-radius:1.2em;
border-left: 1px solid #A4A4A4;
border-top: 1px solid #A4A4A4;
border-right: 1px solid #666;
border-bottom: 1px solid #666;
margin:  4% 0;
-moz-box-shadow: 3px 3px 3px #666;
-webkit-box-shadow: 3px 3px 3px #666;
box-shadow: 2px 2px 4px #333;
}

/* ##########  Search boxes ###########   */

.SearchButton {
padding: 0px 6px 0px 6px; /* Top Right Bottom Left */
color:#f6f6f6;
font-size: 0.8em;
width: 75px;
height:26px;
text-align:center;
background: #B39966;
white-space: nowrap; 
border:1px solid #999;
-moz-box-shadow: 3px 3px 3px #666;
-webkit-box-shadow: 3px 3px 3px #666;
box-shadow: 3px 3px 3px #333;
border-radius: 7px 7px 7px 7px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
-o-border-radius: 6px;
margin-right:4px;
font-style:italic;
font-weight:bold
}

.SearchButton:hover {
background: #CC9933;
-moz-box-shadow: 4px 4px 4px #bbb;
-webkit-box-shadow: 4px 4px 4px #bbb;
box-shadow: 4px 4px 4px #333;
color:white; 
text-decoration:none;
text-shadow: 0em 0em 0.1em #6b6;
}

.SearchButton2 {   /* separate definition needed to allow different layout on Search page compared to in header */
padding: 0px 6px 0px 6px; /* Top Right Bottom Left */
color:#f6f6f6;
font-size: 0.8em;
width: 75px;
height:26px;
display:inline-block;
text-align:center;
background: #B39966;
white-space: nowrap; 
border:1px solid #999;
-moz-box-shadow: 3px 3px 3px #666;
-webkit-box-shadow: 3px 3px 3px #666;
box-shadow: 3px 3px 3px #333;
border-radius: 7px 7px 7px 7px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
-o-border-radius: 6px;
margin-right:4px;
margin-top:10px;
margin-left:60px;
font-style:italic;
font-weight:bold
}

.SearchButton2:hover {
background: #CC9933;
-moz-box-shadow: 4px 4px 4px #bbb;
-webkit-box-shadow: 4px 4px 4px #bbb;
box-shadow: 4px 4px 4px #333;
color:white; 
text-decoration:none;
text-shadow: 0em 0em 0.1em #6b6;
}

.SearchInput {
padding: 0px 6px 0px 6px; 
color:#000; 
font-size: 0.9em; 
height:23px; 
text-align:left;
line-height:22px;
background: #f6f6f6;
white-space: nowrap;
border:1px solid #999;
-moz-box-shadow: 3px 3px 3px #999;
-webkit-box-shadow: 3px 3px 3px #999;
box-shadow: 3px 3px 3px #333;
border-radius: 7px 7px 7px 7px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
margin-right:2px;
}

.SearchForm {
text-align: right;
}

/* ####### Left column items ######## */

div.leftcolumn {
position: absolute;
top: 0;
bottom: 0; /* Opera needs this! Moz would automatically assume this as default */
border-width: 0px; /* widths below */
border-style: solid;
border-color: #777;
border-top-left-radius:1em;
border-top-right-radius:1em;
border-bottom-left-radius:1em;
box-shadow: 4px 4px 3px #999;   /* horizontal vertical blur spread colour */
/* height: 100%; */ /* hacked in for IE via conditional comment */
}

div.leftcolumn {  /*  definition split to allow hack  */
left: 0; 
width: 158px; 
background: #eeeeee; /*  grey */
border-left: 2px solid #A4A4A4;
border-bottom: 2px solid #A4A4A4;
/*  border-left: 0px;  */
margin-top: 140px;   /* Needs to be adjusted for IE6 and 7 */
margin-right: 1px;
margin-bottom: 7px;
}

.leftcolumn ul {
margin-left: 5px;
margin-right: 5px;
padding: 0;
border: 0;
list-style: none;
line-height: 120%;
}

.leftcolumn li {
margin: 0; 
padding: 2px 2px 2px 2px; /* Top Right Bottom Left */
list-style: none;
}

/* ########  Left menu items  ################### */

div.leftmenu {
border-top: 1px solid #606060;
border-left: 2px solid #AFAFAF;
border-right: 2px solid #AFAFAF;
background: #FFFFFF url(Images/MenuGradient.jpg) repeat-x top;
margin: 1px 1px 1px 1px;  /* Top Right Bottom Left */
padding-bottom: 1px;
padding-top: 4px;
border-top-left-radius:1em;
border-top-right-radius:1em;
}

.menuHeader {  /* formats the header within the left menu panel       */
color: #0000bf;
font: bold 120% Arial;
background: url(Images/MenuItemGradient.jpg);
padding: 3px 0px 3px 0px;   /* Top Right Bottom Left */
margin-bottom:3px;
margin-left:3px;
margin-right:3px;
text-align: center;
border-top-left-radius:1em;
border-top-right-radius:1em;
}

.MenuBottomShadow {
background: url(Images/BottomShadow158.jpg);
width: 158px;
height: 7px;
}

/* #########  Format the display of the left menu items  ################## */

.menulinks{
list-style: none;
margin: 0;
margin-bottom:1em;
margin-left: 4px;
padding: 0;
}

.menulinks ul {
margin-left: 5px;
margin-right: 5px;
padding: 0;
border: 0;
list-style: none;
line-height: 120%;
}

.menulinks li{
padding-bottom: 1px;
background: url(Images/MenuItemGradient.jpg) top left repeat-x;
border-bottom: 1px solid #848484;
height: 36px;
}

.menulinks li a{
margin-left: 0px;
padding-left: 4px;
padding-top: 12px;
padding-bottom: 8px;
font-size: 1em;
display: block;
color: #4A5A93;
text-decoration: underline;
font-weight: bold;
min-width: 0;   /* Required for IE7, otherwise "peek-a-boo" bug. */
}

.menulinks a:visited{
color: purple; 
}

.menulinks a:hover {
color: #4A5A93;
background: #D8F9CF;
}

/* ########################### */

#leftcolumn p {background: #b0c4de; height: 50%;}/* height to show inheritance */

/* ###### Main Content Layout ####### */

div.contentwrap {  /*  Padding to set position of main content on the page  */
padding: 0px 1px 1px 158px; /* Top Right Bottom Left */
}

div.content {        /* Contains the main content of each page  */
position: relative;  /* to enable further positioned divs inside content area */
z-index: 600;        /* to make sure if long words overflow they show above the right column */ 
margin: 0px 6px 6px 0px;
border: 2px solid #b3b3b3;
background: #ffffff;
border-bottom-right-radius:1em;
box-shadow: 4px 4px 3px #999;   /* horizontal vertical blur spread colour */
}

/* ###### What's New items, used on home page  ####### */

div.whatsnew { 
position: relative;
top: 0;
right: 0;
float: right;
width: 175px; 
margin: 2px 8px 3px 8px; /* Top Right Bottom Left */
padding-bottom: 0px;
padding-top: 0px;
background: #E0E6F8;
border-top: 3px solid #d3d3d3;
z-index: 50;
box-shadow: 4px 4px 4px #999;
}

.whatsnew ul.heading {
margin: 3px 0 3px 0; /* Top Right Bottom Left */
width: 173px; 
list-style: none;
font-size: 1.2em;
font-style: italic;
color: #00009f;
font-weight: bold;
text-align: center;
padding-bottom: 1px;
padding-top: 1px;
background-color: #EFF2FB;
border-left: 1px solid #cccccc;
border-right: 1px solid #cccccc;
}

.whatsnew ul.list {
margin: 3px 0 3px 0; /* Top Right Bottom Left */
width: 173px; 
list-style: none;
font-size: 0.7em;
color: black;
text-align: left;
padding-bottom: 3px;
padding-top: 5px;
background-color: #EFF2FB;
border-top: 1px solid #b3b3b3;
border-left: 1px solid #b3b3b3;
border-right: 1px solid #b3b3b3;
}

.whatsnew li {
margin: 3px 5px 3px 8px; /* Top Right Bottom Left */
padding: 5px 0 5px 0; /* Top Right Bottom Left */
list-style: none;
}

.whatsnew li.bordered {
margin: 3px 5px 3px 8px; /* Top Right Bottom Left */
padding: 5px 0 8px 0; /* Top Right Bottom Left */
border-bottom: 1px dashed #666666;
list-style: none;
}

.whatsnew li.bordered a {
color: #00009f;
text-decoration: underline;
}

.whatsnew li a:visited{
color: purple; 
}

/* ###### "News" items, used on many page ####### */

div.News { 
position: relative;
top: 0;
right: 0;
float: right;
width: 175px; 
margin: 2px 7px 3px 6px; /* Top Right Bottom Left */
padding-bottom: 0px;
padding-top: 0px;
background: #E0E6F8;
border-top: 3px solid #d3d3d3;
z-index: 50;
box-shadow: 4px 4px 4px #999;
}

.News ul.list {
margin: 3px 0 3px 0; /* Top Right Bottom Left */
width: 173px; 
list-style: none;
font-size: 0.7em;
color: black;
text-align: left;
padding-bottom: 3px;
padding-top: 5px;
background-color: #EFF2FB;
border-top: 1px solid #b3b3b3;
border-left: 1px solid #b3b3b3;
border-right: 1px solid #b3b3b3;
}

.News ul.heading {
margin: 3px 0 3px 0; /* Top Right Bottom Left */
width: 173px; 
list-style: none;
font-size: 1.2em;
font-style: italic;
color: #00009f;
font-weight: bold;
text-align: center;
padding-bottom: 1px;
padding-top: 1px;
background-color: #EFF2FB;
border-left: 1px solid #cccccc;
border-right: 1px solid #cccccc;
}

.News li {
margin: 3px 3px 3px 8px; /* Top Right Bottom Left */
padding: 2px 0 2px 0; /* Top Right Bottom Left */
list-style: none;
}

.News li.underline {
margin: 3px 3px 3px 8px; /* Top Right Bottom Left */
padding: 2px 0 6px 0; /* Top Right Bottom Left */
list-style: none;
border-bottom: 1px dashed #666666;
}

.News li a {
color: #00009f;
text-decoration: underline;
}

.News li a:visited{
color: purple; 
}

/* ###### Floats ####### */

div.FloatPanelLeft { 
float: left;
position: relative;
margin: 0px 10px 3px 15px; /* Top Right Bottom Left */
padding-bottom: 5px;
padding-right: 5px;
}

div.FloatPanelLeft img { 
border-right: 3px solid #cfcfcf; 
border-bottom: 3px solid #afafaf; 
background-color: #efefef;
}

div.FloatPanelLeft p { 
font-size: 1em;
color: #000;
text-align: left;
margin: 0px 3px 3px 3px; /* Top Right Bottom Left */
}

/* ###### Float Images ####### */

div.FloatImageLeft { /* These don't float in printed version */
float: left;
position: relative;
margin: 10px 10px 3px 15px; /* Top Right Bottom Left */
padding-bottom: 5px;
padding-right: 5px;
}

div.FloatImageLeft img { /* These don't float in printed version */
border-right: 3px solid #cfcfcf; 
border-bottom: 3px solid #afafaf; 
background-color: #efefef;
}

div.FloatImageLeft p { /* These don't float in printed version */
font-size: 0.75em;
font-style: italic;
color: #00009f;
text-align: left;
margin: 0px 3px 3px 3px; /* Top Right Bottom Left */
}

div.FloatImageLeftSimple { /* These are allowed to float in printed version */
float: left;
position: relative;
margin: 10px 10px 3px 15px; /* Top Right Bottom Left */
padding-bottom: 5px;
padding-right: 5px;
}

div.FloatImageLeftSimple img { 
border-right: 3px solid #cfcfcf; 
border-bottom: 3px solid #afafaf; 
background-color: #efefef;
}

div.FloatImageLeftSimple p { 
font-size: 0.75em;
font-style: italic;
color: #00009f;
text-align: left;
margin: 0px 3px 3px 3px; /* Top Right Bottom Left */
}
div.ClearLeft {   /*  ######### Clear floats left  ############ */
clear: left;
}

div.ClearRight {   /*  ######### Clear floats right  ############ */
clear: right;
}

div.ClearBoth {   /*  ######### Clear both floats  ############ */
width: 100%;
height: 1px;
margin: 0 0 -1px;
clear: both;
}

/* #########################################  */


div.FloatImageLeftInHeader { 
float: left;
position: relative;
margin: 0px; 
padding-top: 0px;
padding-bottom: 0px;
background-color: #effbfb;
}

div.FloatImageLeftInTable { 
float: left;
position: relative;
margin: 0px 10px 0px 5px; /* Top Right Bottom Left */
padding-top: 5px;
padding-bottom: 0px;
background-color: #effbfb;
 }

div.FloatImageRight { 
float: right;
position: relative;
margin: 0px 10px 3px 15px; /* Top Right Bottom Left */
padding-bottom: 5px;
padding-right: 5px;
background-color: #efefef;
border-right: 3px solid #cfcfcf; 
border-bottom: 3px solid #afafaf; 
}

/* ########### iFrames  ################# */

div.Frame { /*  Used to put a margin around Google Map in an iFrame  */
margin: 20px;
}

div.Frame iframe {
box-shadow: 8px 6px 4px #aaa;   /* horizontal vertical blur spread colour */
}



/* ########################################### */

.NoBullets ul {
font-size: 1em;
list-style: none;
}

.NoBullets li {
list-style: none;
font-size: 1em;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 10px;
padding-right: 3px;
text-align: left;
}

.NoBullets li.coloured {
list-style: none;
font-size: 1em;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 10px;
padding-right: 3px;
text-align: left;
background-color:#f8f8f8;
border-top: 4px double #b0b0b0;
border-bottom: 4px double #b0b0b0;
width: 550px;
}

/* ###### General formatting - some not required ###### */

#header p {text-align: right;}
h4 {margin: 0; padding: 10px; position: relative; z-index: 5;}
h4 {padding-bottom: 0; padding-right: 15px;}
ul, ol {font-size: 0.8em; margin: 0 20px 0 30px; padding: 0; }
ul ul, ol ol, ol ul, ul ol {font-size: 1em;}  /* for nested lists */
li {font-size: inherit;}

.coloured {
background-color:#f8f8f8;
border-top: 4px double #b0b0b0;
border-bottom: 4px double #b0b0b0;
}

/* ###### Link formatting ###### */

a:link {
color: #00009f;  /* shade of blue */
text-decoration: underline;
} 
a:visited {color: purple; }
a:active {color: red; }

/*###### Specific formatting ####### */

h1 {
 font-size: 1.4em;
 font-style: italic;
 color: black;
 text-align: Left;
 padding-left: 50px;
 padding-right: 5px;
 padding-bottom: 5px;
 padding-top: 0px;
 margin-top: 5px;
 margin-bottom: 12px;
 margin-right: 0%;
 margin-left: 5px;
 line-height: 100%;
 }

h2 {
 font-size: 1.3em;
 font-style: italic;
 color: black;
 text-align: Left;
 padding-left: 50px;
 padding-right: 10px;
 padding-bottom: 5px;
 padding-top: 15px;
 margin-top: 5px;
 margin-bottom: 10px;
 margin-right: 0%;
 margin-left: 5px;
 }

h3 {
  font-size: 1.2em;
  font-weight: bold;
  color: black;
  text-align: Left;
  margin-top: 10px;
  margin-left: 10px;
  }

p { /*  ####### the default paragraph style #### */
 font-size: 0.8em;
 color: black;
 padding-top: 3px;
 padding-bottom: 3px;
 padding-left: 5px;
 padding-right: 3px;
 text-align: left;
 vertical-align: top;
 margin-right: 10px;
 margin-left: 10px;
 line-height: 130%;
 }

/*   ############################ */

.TopLink { /*  separate so printing can be suppressed   */
 font-size: 0.8em;
 color: black;
 padding-top: 5px;
 padding-bottom: 5px;
 padding-left: 5px;
 padding-right: 3px;
 text-align: left;
 vertical-align: top;
 margin-right: 5px;
 margin-left: 10px;
 line-height: 140%;
}

.TopLink a:visited {
color: #00009f; /*  keep the normal colour  */
}

/*   ############################ */

.IndentedGeneralContent { /* not used yet  */
 font-size: 0.8em;
 color: black;
 padding-top: 10px;
 padding-bottom: 10px;
 padding-left: 25px;
 padding-right: 3px;
 text-align: left;
 vertical-align: top;
 margin-right: 5px;
 margin-left: 10px;
 line-height: 140%;
 }

.SpacedGeneralContent {  /* not used yet  */
 font-size: 0.8em;
 color: black;
 padding-top: 10px;
 padding-bottom: 10px;
 padding-left: 5px;
 padding-right: 3px;
 text-align: left;
 margin-right: 5px;
 margin-left: 10px;
 line-height: 180%;
 }

.CenteredGeneralContent {  /* not used yet  */
 font-size: 0.8em;
 color: black;
 padding-top: 10px;
 padding-bottom: 10px;
 padding-left: 5px;
 padding-right: 3px;
 text-align: center;
 margin-right: 5px;
 margin-left: 10px;
 line-height: 140%;
 }

.SmallGeneralContent {  /* not used yet  */
  font-size: 70%;
  color: black;
  padding-left: 0.2cm;
  padding-right:0.1cm;
  text-align: left;
  margin-right: 1%;
  margin-left: 0%;
  line-height: 120%
  }

/* ########################### */

Table.QuickLinks {    /*   Fixed pixel width table specifically for listing links within a page   */
 width:625px;
 text-align:left;
 vertical-align:top;
 margin-left:20px;
 margin-top:4px;
 font-size: 1em;
 color: black;
 border-collapse:collapse;
}

Table.QuickLinks tr.ColouredRow {
 font-size: 1em;
 vertical-align:top;
 margin-left:5px;
 background-color:#f8f8f8;
 border-top: 5px double #b0b0b0;
 border-bottom: 5px double #b0b0b0;
 padding: 5px 4px 5px 12px; /* Top Right Bottom Left */
}

Table.QuickLinks td {
 font-size: 0.8em;
 vertical-align:top;
 margin-left:5px;
 line-height: 150%;
 padding: 5px 4px 10px 12px; /* Top Right Bottom Left */
}

/* ########################### */

Table.Standard {      /*  Defined to sort out font size inheritance  */
 width:95%;
 text-align:left;
 vertical-align:top;
 margin-left:10px;
 margin-top:4px;
 font-size: 1em;
 color: black;
 border-collapse:collapse;
}

Table.Standard tr.ColouredRow {
 font-size: 1em;
 vertical-align:top;
 margin-left:5px;
 background-color:#f8f8f8;
 border-top: 4px double #b0b0b0;
 border-bottom: 4px double #b0b0b0;
 padding: 5px 4px 8px 12px; /* Top Right Bottom Left */
}

Table.Standard td {
 font-size: 0.8em;
 vertical-align:top;
 margin-left:5px;
 line-height: 140%;
 padding: 5px 4px 8px 12px; /* Top Right Bottom Left */
}

Table.Standard h2 {
 font-size: 1.3em;
 font-style: italic;
 color: black;
 text-align: Center;
 padding-left: 10px;
 padding-right: 50px;
 padding-bottom: 5px;
 padding-top: 5px;
 margin-top: 5px;
 margin-bottom: 10px;
 margin-right: 0%;
 margin-left: 5px;
 }

Table.Standard td.Heading {
 font-size: 1.1em;
 background-color: #ededed;
 border-bottom: 3px solid #d0d1c2;
 padding: 5px 4px 5px 10px;
}

/* ########################### */

Table.StandardFixed {    /*   Fixed pixel width table to help formatting   */
 width:625px;
 text-align:left;
 vertical-align:top;
 margin-left:10px;
 margin-top:4px;
 font-size: 1em;
 color: black;
 border-collapse:collapse;
}

Table.StandardFixed tr.ColouredRow {
 font-size: 1em;
 vertical-align:top;
 margin-left:5px;
 background-color:#f8f8f8;
 border-top: 4px double #b0b0b0;
 border-bottom: 4px double #b0b0b0;
 padding: 5px 4px 8px 12px; /* Top Right Bottom Left */
}

Table.StandardFixed td {
 font-size: 0.8em;
 vertical-align:top;
 margin-left:5px;
 line-height: 150%;
 padding: 5px 4px 10px 12px; /* Top Right Bottom Left */
}

/* ########################### */

Table.Fees {    /* not used yet  */
 border-collapse: collapse;
 margin-left: 10px;
}

Table.Fees td {  /* not used yet  */
 vertical-align: top;
 font-size: 80%;
 background-color: #effbfb;
 border-collapse: collapse;
 padding: 5px 10px 5px 10px; /* Top Right Bottom Left */
}

/* #########  Footer  ################## */

div.footer {
background: #FFFFFF url(Images/FooterGradient.jpg) repeat-x top;
border-bottom: 2px solid #999;   /* was #58ACFA shade of blue */
border-top: 2px solid #999;
border-left: 2px solid #999;
border-right: 2px solid #999;
position: relative;
padding-left: 170px;
box-shadow: 4px 4px 3px #999;   /* horizontal vertical blur spread colour */
margin-right: 6px;
margin-bottom: 10px;
border-radius:1em;
border-top-right-radius:1em;
}

div.sideBySideFooterOuter {  /*  Outside container used inside footer div  */
padding: 0px 0px 0px 10px; /* Top Right Bottom Left */
}

div.sideBySideFooterLeft {  /*  Left hand side container used if required, inside footer div  */
float: left;
width: 25%;
padding: 0px 0px 10px 0px; /* Top Right Bottom Left */
text-align: center;
font-size: 0.9em;
}

div.sideBySideFooterRight {  /*  Right hand side container used if required, inside footer div  */
float: left;
width: 75%;
margin-top: 2px;
font-size: 0.9em;
}

/* ########  Search  ######### */

div.Search { /* used on main Search page  */
position: relative;
margin: 0px 10px 3px 15px; /* Top Right Bottom Left */
padding-top: 20px;
padding-bottom: 15px;
padding-left: 10px;
background: #FFFFFF url(Images/HeadingGradient.jpg) repeat-y;
width:400px;
border-top-left-radius:0.6em;
border-top-right-radius:0.6em;
border-bottom-left-radius:0.6em;
border-bottom-right-radius:0.6em;
border-bottom: 3px solid #333333;
border-right: 3px solid #333333;
border-top: 1px solid #999999;
border-left: 1px solid #999999;
}

/* #########  General use Side by Side divs ####### */

div.sideBySideOuter {  /*  General outside container used for side by side divs  */
width:70%;
}

div.sideBySideLeft {  /*  Left hand side container, inside the outside container div  */
float: left;
width: 30%;
}

div.sideBySideRight {  /*  Right hand side container, inside the outside container div  */
float: left;
width: 50%;
}

div.sideBySideClear {
clear: left;
}

/* ########   Sub Section Headings     ######### */

div.SubSectionHeading {
background: #FFFFFF url(Images/HeadingGradient.jpg) repeat-y;
border-top-left-radius:0.6em;
border-top-right-radius:0.6em;
border-bottom-left-radius:0.6em;
border-bottom-right-radius:0.6em;
border-bottom: 3px solid #666666;
border-right: 3px solid #666666;
border-top: 1px solid #999999;
border-left: 1px solid #999999;
padding-top: 5px;
padding-bottom: 5px;
padding-right: 10px;
padding-left: 10px;
margin-top: 10px;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 10px;
font-size: 1.1em;
width:350px;
}

.SubSectionHeading a {
display: block;
color: #000;
text-decoration: None;
}

.SubSectionHeading a:visited {
color: #000; 
}

.SubSectionHeading a:hover {
color: #4A5A93;
background: #D8F9CF;
text-decoration: underline;
}


/* ########################### */

/*   CSS for SCAC webpages.     */
/*   By T Fuller 9447 4545 ...      ...*/
/*   This is the SCREEN style sheet    */
/*   Print style sheet is separate     */
/*   Edit Last update date at the top  */