/* 
CSS style sheet for gracey.com - only IE and Firefox browsers tested in depth. 
Opera and Chrome quick check only 

2011-05 major tidy remove unused terns
2011-0615 another tidy

*/

@media screen {
body {
margin: 10px; 
border: 4px solid silver; 
padding: 30px 70px 10px 70px; 
width: 864px; 
font-family: arial, sans-serif; 
font-size: 14px; color: #666666; 
line-height: 130%;}} /* for fixed size change font-size: from 100%; to 16px; Dec 06 was arial 15px, tried verdana 13px, went back to arial */

@media print {
body {font-family: arial, helvetica, sans-serif; font-size: small}} /* for fixed size change font-size: from 100%; to 16px; */

b {font-weight: normal;}

strong {font-weight: bold; font-style: normal}

i {font-style: normal;}

.tophd { background-color: white; margin: 0px; padding: 0px; height: 106px; background-image: url(images/hdbg.jpg); background-repeat: repeat-x; }

.tophd1 { background-color: #d5dcef; margin: 0px; padding: 0px; height: 90px; border: 1px solid silver; }

.tophd2 { background-color: #e0e0e0; margin: 0px; padding: 0px; height: 90px; } /* light gray */

.table-01 {width:100%; background: white; border-color:black; color:black; border-style:solid; border-width:1px 0px 1px 0px; line-height:140%; margin-bottom:5px; margin-top:5px;}
/* table-01 headings with borders + margins before and after table */

.table-02 {width:100%; background:transparent; color:black;}

.table-03a {width:100%; border-color:#bfbfbf; color:black; border-style:solid; border-width:1px 0px 0px 0px; line-height:140%; margin-bottom:5px; margin-top:5px; background-image: url(images/tabbg.jpg); background-repeat: repeat-x; }

/* table-03 = table-01 modified background and main colour + bleed */
.table-03 {width:100%; background:#d5dcef; border-color:#bfbfbf; color:#444444; font-weight:lighter; border-style:solid; border-width:1px 0px 0px 0px; line-height:140%; margin-bottom:5px; margin-top:5px;}
/* table-03 = table-03 before bleed background:#d5dcef color:black*/

.table-03b {background:#d5dcef; border-color:#bfbfbf; color:#444444; font-weight:lighter; border-style:solid; border-width:1px 0px 0px 0px; line-height:140%; margin-bottom:5px; margin-top:5px;}
/* table-03b = table-03 but not 100% width */

.table-04 {border-color:silver; border-style:solid; border-width:1px;}

/* 2011-0715 H1 was line-height: 180%; font-size: 160%; */
h1 {line-height: 120%; font-weight: lighter; font-size: 140%; background:transparent; color: black; }
h2 {line-height: 120%; font-weight: lighter; font-size: 100%;}
h3 {line-height: 120%; font-weight: lighter; font-size: 120%; color: black}
h6 {font-size: 90%; text-align:right;  }

/* <hr> - most css validators flag error when you use color and background-color but HR is a special case
IE treats HR as an inline element, but Firefox treats it like a block element, so you need both to be sure - 
ignore css warning in this instance */
hr {color:silver;}
hr.clear {height: 1px; border: 0; color: #ffffff; background-color: #ffffff; width: 100%;} 
hr.blue {height: 1px; border: 0; color: blue; background-color:blue; width: 100%;} 
hr.red {height: 1px; border: 0; color: red; background-color: red; width: 100%;} 
hr.test {height: 1px; border: 0; color: #bfbfbf; background-color: #bfbfbf; width: 100%;} 

br.one {height: 1px; width: 100%;}
br.ten {height: 10px; width: 100%;}
br.h015 {height: 15px; width: 100%;}

.space-005 { line-height: 5px;}
.space-012 { line-height: 12px;}

.fixed {font-family: courier; font-size: 15px; white-space: pre;}

.highlight-box-blue {background:#d5dcef; border: 2px solid #bfbfbf; padding:5px;}

.dashed {border-bottom: dashed 1px #666666;}
/*example <div class="hr dashed"></div> */

/* <span style="margin-left: 20px">Top of the range - </span> */

.aqua {background:transparent; color:aqua;}
.black {background:transparent; color:black;}
.blue {background:transparent; color: blue;}
.fuchsia {background:transparent; color:fuchsia;}
.green {background:transparent; color:green;} 
.gray {background:transparent; color:gray;}
.gray-l {background:transparent; color:#e0e0e0;}
.lime {background:transparent; color:lime;}
.maroon {background:transparent; color:#b22222;} 
.navy {background:transparent; color:navy;}
.purple {background:transparent; color:purple;}
.red {background:transparent; color:#cc3300;}
.silver {background:transparent; color:silver;}
.teal {background:transparent; color:teal;}
.ga-colour {background:transparent; color:#d5dcef;}
.ga-blue {background:transparent; color:#6666dd;}

/* style="border:0px" also gets rid of image borders in html strict  */
.borderhidden {border-style: hidden;}

.float-left {float:left}
.float-right {float:right;}

.new {font-size:85%; background:transparent; color:red; text-transform: uppercase;}

.margin-40 {margin-left:40px; margin-right:40px;}

/* example to change default colour: <span class="body120" style="color:black;"> */ 
.body140 {line-height: 120%; font-weight: lighter; font-size: 140%; background:transparent;}
.body130 {line-height: 120%; font-weight: lighter; font-size: 130%; background:transparent;}
.body120 {line-height: 120%; font-weight: lighter; font-size: 120%; background:transparent;}
.body100 {line-height: 120%; font-weight: lighter; font-size: 100%;}
.body085 {line-height: 120%; font-weight: lighter; font-size: 85%;}
.small {line-height: 120%; font-weight: lighter; font-size: 75%;}

.body085-r {line-height: 120%; font-weight: lighter; font-size: 85%; text-align:right; border:2px;}
.body100-r {line-height: 120%; font-weight: lighter; font-size: 100%; text-align:right; border:2px;}

.body150a {line-height: 150%; font-weight: lighter; font-size: 100%;}
.body200a {line-height: 200%; font-weight: lighter; font-size: 100%;}

.blue140 {line-height:120%; font-weight:lighter; font-size:140%; background:transparent; color:blue;}

.glossary {font-size: 115%; font-weight:normal; background:white; color: #800000;}

/* used in standards lists */
.courier {font-family: courier; font-size: 16px;}

div.standard {
font-family: verdana, arial, helvetica, sans-serif; 
white-space: pre;
font-size: 90%;
line-height: 140%;
background: #FFFFFF;
color: #666666;}

/* link colors and effects color was blue, then #3333cc; */
a:link    {color:#6666dd;  background:white; text-decoration:none}
a:active  {color:#6666dd;  background:white;}
a:visited {color:#6666dd;  background:white; text-decoration:none}
a:hover   {color:#6666dd;  background:white; text-decoration: underline}

a.ga-link-01 {color:#6666dd; padding:2px; background:#eaeef7; text-decoration:none; border-color:#bfbfbf; border-style:solid; border-width:1px;}
a.ga-link-01:hover { background:#d5dcef; text-decoration:none;}

a.ga-link-01a {color:#6666dd; padding:2px; vertical-align:-5px; background:#eaeef7; text-decoration:none; border-color:#bfbfbf; border-style:solid; border-width:1px;}
a.ga-link-01a:hover { background:#d5dcef; text-decoration:none;}

a.glossary {color:#cd3333; font-size:110%; background:white; text-decoration:none}
a.glossary-link {color:green; font-size:100%; background:white; text-decoration:none}
a.glossary-link:hover {color:green; font-size:100%; background:white; text-decoration:underline}


/* background colour #d5dcef; font colour blue; border 1px solid gray; */
dt.txt1 {font-size:140%; background:white; color:#666666}
dt.txt2 {font-size:100%; background:white; color:#666666; padding:3px 0px;}
dt.tab {display:block; float:left; margin-top: 3px; margin-right:2px; font-size:100%; text-align:center; white-space:nowrap; background-image: url(images/tabbg.jpg); background-repeat: repeat-x;}
dt.tab a {display:block; text-decoration:none; color:blue; background:#d5dcef; border:1px solid gray; padding:3px; background-image: url(images/tabbg.jpg); background-repeat: repeat-x;}
dt.tab a:hover {background:white; color:blue;}

/* table cells style */
.td0 { border: 0px;}
.td1 { border: 1px solid silver;}
.td2 { border-bottom: 1px solid silver; }
.td3 { border-bottom: 1px solid silver; text-align:right;}
.td4 { border: 1px solid silver;}
.td5 { border: 1px solid silver; text-align:right;}
.td6 { border: 1px solid silver; text-align:center;}

/* list style */
ul {list-style-image: url(images/ga-square-silver.gif)}
ol {list-style-type: square;} 
.list-c {list-style-type: circle;}
.list-d {list-style-type: disc;}
.list-s {list-style-type: square;}
.list-blue {list-style-image: url(images/ga-dot-blue-01.gif)}


/* navlist start : new 2011-06 original background #DDE border:#778 font 14px Arial */
#navlist {padding:3px 0; margin-left:0; border-bottom:1px solid #bfbfbf; font:normal 12px Arial, sans-serif;}
#navlist li {list-style:none; margin:0; display:inline;}
#navlist li a { padding:3px 0.5em; margin-left:1px; border:1px solid #bfbfbf; border-bottom:none; background:#d5dcef; text-decoration: none;}
#navlist li a:link {color:#448;}
#navlist li a:visited { color:#667;}
#navlist li a:hover {color:#000; background:#AAE; border-color:#227;}
#navlist li a#current {background:white; border-bottom:1px solid white;}
/* navlist end*/


/* 
everything below here to be deleted after 2011-0630
2011-0615 not used - delete? 
dt.tab1 {display:block; float:left; margin-top: 3px; margin-right:2px; font-size:100%; text-align:center; white-space:nowrap; background-color:silver;}
dt.tab1 a {display:block; text-decoration:none; color:blue; background:#d5dcef; border:1px solid gray; padding:3px;}
dt.tab1 a:hover {background:white; color:blue;}

dt.tab2 {display:block; float:left; margin-top: 3px; margin-right:2px; font-size:100%; text-align:center; white-space:nowrap; background-color:#d5dcef;}
dt.tab2 a {display:block; text-decoration:none; color:#666666; background:#d5dcef; border:1px solid gray; padding:3px;}
dt.tab2 a:hover {background:white; color:blue;}
dt.tab2 a.here {background:white; color:#666666;} /* 2011-0517 added here tab */

/* navigation bar 2011-0426 style : 2011-0615 replaced, remove? 
.navbar {font-size: 85%; line-height: 100%; color:  green;  background-color: #d5dcef;}
.navbar a:link {color: blue; background-color: #d5dcef;}
.navbar a:visited {color: blue; background-color: #d5dcef;}
.navbar a:hover {color: blue; background-color: #d5dcef;}
.navbar a:active {color: blue; background-color: #d5dcef;}
*/

/*globalnav* 2011-0509 css tuturial : 2011-0615 not used, remove? 
#globalnav {position:relative; left:-1em; float:left; width:100%; padding:0 0 1.75em 1em; margin:0; list-style:none; line-height:1em; }
#globalnav LI {float:left; margin:0; padding:0; }
#globalnav A {display:block; 	color:#444; text-decoration:none; font-weight:normal; background:#ddd; margin:0; padding:0.25em 1em; border-left:1px solid #fff; border-top:1px solid #fff; border-right:1px solid #aaa; }

#globalnav A:hover,
#globalnav A:active,
#globalnav A.here:link,
#globalnav A.here:visited {background:white;}

#globalnav A.here:link,
#globalnav A.here:visited {position:relative; z-index:102;}
*/

/* navigation bar 2011-0506 style 
.navbar-2 {font-size: 100%; line-height: 300%; color:  navy;  background-color: #d5dcef;}
.navbar-2 a:link {color: black; background-color: #d5dcef;}
.navbar-2 a:visited {color: black; background-color: #d5dcef;}
.navbar-2 a:hover {color: black; background-color: #d5dcef;}
.navbar-2 a:active {color: black; background-color: #d5dcef;}
*/

	
/* begin css tabs tried 2011-06 replaced by navlist - delete?*/
ul#tabnav { /* general settings */
text-align: left; /* set to left, right or center */
margin: 1em 0 1em 0; /* set margins as desired */
font: normal 12px arial, sans-serif; /* set font as desired */
border-bottom: 1px solid silver; /* set border COLOR as desired #6c6*/
list-style-type: none;
padding: 3px 10px 3px 10px; /* THIRD number must change with respect to padding-top (X) below */
}

ul#tabnav li { /* do not change */
display: inline;
}

body#tab1 li.tab1, body#tab2 li.tab2, body#tab3 li.tab3, body#tab4 li.tab4 { /* settings for selected tab */
border-bottom: 1px solid #fff; /* set border color to page background color #fff */
background-color: #fff; /* set background color to match above border color #fff */
}

body#tab1 li.tab1 a, body#tab2 li.tab2 a, body#tab3 li.tab3 a, body#tab4 li.tab4 a { /* settings for selected tab link */
background-color: #d5dcef; /* set selected tab background color as desired #fff or #d5dcef */
color: #000; /* set selected tab link color as desired */
position: relative;
top: 1px;
padding-top: 4px; /* must change with respect to padding (X) above and below */
}

ul#tabnav li a { /* settings for all tab links */
padding: 3px 4px; /* set padding (tab size) as desired; FIRST number must change with respect to padding-top (X) above */
border: 1px solid silver; /* set border COLOR as desired; usually matches border color specified in #tabnav  #6c6 green */
background-color: #e6e6e6; /* set unselected tab background color as desired #cfc*/
color: #666; /* set unselected tab link color as desired */
margin-right: 0px; /* set additional spacing between tabs as desired */
text-decoration: none;
border-bottom: none;
}

ul#tabnav a:hover { /* settings for hover effect */
background: #fff; /* set desired hover color */
}

/* end css tabs */

