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

Welcome to the CSS for Relic, coded by Kevin Cannon.
The CSS is pretty straight forward. There are a few
small hacks however, with one line controlling firefox
and the other IE. These are clearly labled. If you need
any help with the template, email me at kmcannon@telus.net

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

body  {
	margin:0;
	padding:0;
	font-family:arial, verdana, helvetica, georgia, sans-serif, times;
	font-size:12px;
	color:#001029;
}



a {
	color:#3c5ea8;
	text-decoration:none;
}

a:hover {
	color:#40A7D6;
	text-decoration:underline;
}

a.highlighted {
  color: white;
  background-color: #3c5ea8;
  font-weight:bold;
  border-bottom-color: #3c5ea8;
  border-right-color: #3c5ea8;
  border-left-color: #3c5ea8;
}



img.left {
	float:left;
	padding:3px;
	margin-right:6px;
}


img.right {
	float:right;
	padding:3px;
	margin-right:6px;
}


img:hover {
	background:#EbF1F5;
}

.narrowfigure {
width:80;
float:left;
padding:3px;
text-align:center;
margin-right:6px;
font-size:10px;
}


.narrowfigure img { 	width:100%; }

.narrowfigure p { /* the default "legend" style, as opposed to "caption" */
font-family: verdana, arial, sans-serif;
font-size: 10px;
text-align:center;
padding-left: 1%;
padding-right: 1%;
line-height: 1.1;
margin: 0.25em auto 0 auto;
}


#wrapper {
	height:100%;
	margin:auto;
	width:90%;
}

.timeline-default {
    font-family: Trebuchet MS, Helvetica, Arial, sans serif;
    font-size: 8pt;
    border: 1px solid #aaa;
}

.timeline-band {
   position:   absolute;
   background: #eee;
    z-index:    10;
}

.timeline-band-inner {
     position: relative;
    width: 100%;
    height: 100%;
}

.timeline-band-input {
    position:   absolute;
    width:      1em;
    height:     1em;
    overflow:   hidden;
    z-index:    0;
}
.timeline-band-input input{
    width:      0;
}

.timeline-band-layer {
    position:   absolute;
    width:      100%;
    height:     100%;
}

.timeline-band-layer-inner {
 
    position:   relative;
    width:      100%;
    height:     100%;
}


/********************* Search form  ******************/
.text {
	height:18px;
	width:110px;
}

.go {
	height:21px;
	background:#627fbb;
	color:#fff;
	font-family:helvetica;
	font-weight:bold;
}

/***************** TEXT IN THE HEADER **************************/

#top h1 {
	font-family:georgia, helvetica, times, sans-serif;
	font-weight:normal;
	font-size:36px;
	text-transform:lowercase;
	margin-top:40px;
	margin-left:600px;
	color:#FFFFFF;
	}

/*************************** HEADER PROPERTIES ************************/

#top {
	margin:auto;
	}
	

/*************************** SUBHEADER PROPERTIES ************************/

.subHeader {
  margin: 0;
 /* float:right; */
}


.subHeader .navigation {
  list-style-type: none;
  list-style-position: outside;
   font-size:12px;
  margin: 0;
  padding: 0;
}

.subHeader .navigation li {
  line-height: 1.0em;
  margin: 0;
  padding: 0;
  display: inline;
}

.subHeader a {
  color: rgb(175,175,175);
  background-color: transparent;
  text-decoration: none;
  font-weight: bold;
}

.subHeader a:hover {
  color: steelblue;
  background-color: transparent;
  text-decoration: none;
}

.subHeader .navigation .tab {
  color: rgb(121,121,121);
  background-color: rgb(248,248,248);
  text-decoration: none;
  font-weight: bold;
  margin: 0;
  padding: 0.2ex 0.2em 0.2ex 0.2em;
  border-bottom: 1px solid rgb(231,231,231);
  border-left: 1px solid rgb(97,97,97);
  border-right: 1px solid rgb(231,231,231);
}

.subHeader .navigation a.tab:hover {
  color: steelblue;
  background-color: rgb(248,248,248);
  text-decoration: none;
  padding-bottom: 0.3ex;
  border-bottom: 1px solid rgb(97,97,97);
  border-right: 1px solid rgb(231,231,231);
  border-left: 1px solid rgb(97,97,97);
  position: relative;
  left: 1px;
  bottom: 1px;
}

.subHeader .navigation .highlighted {
  color: white;
  background-color: steelblue;
  border-bottom-color: steelblue;
  border-right-color: steelblue;
  border-left-color: steelblue;
}



/************************ LEFT SIDE COLUMN *****************/

#left {
	float:left;
	font-size:11px;
	left:0px;
	padding:3px;
	padding-top:5px;
	width:22%;
	}
	
#left h1, #right h1 {
	font-size:15px;
	padding-top:5px;
	font-family:helvetica, arial, georgia, times, sans-serif;
	border-bottom:1px dotted #c4c4c4;
}

#left h2, #right h2 {
	font-size:12px;
	padding-top:2px;
	margin-bottom: 3px;
	font-family:helvetica, arial, georgia, times, sans-serif;
}

#left p {
	font-size:10px;
	padding-bottom:5px;
	margin-top:-3px !important; /*****  FIREFOX  *****/
	margin-top:-14px;             /***** INTERNET EXLORER *****/
	color:#404040;
}	

#left a .highlighted {
  color: white;
  background-color: steelblue;
  border-bottom-color: steelblue;
  border-right-color: steelblue;
  border-left-color: steelblue;
}



/************************** MAIN CONTENT IN MIDDLE ******************/

#middle {
	float:left;
	width:74%;
	line-height:1.01em;
	line-height:15px;
	padding-left:1.5%;
	padding-right:1.0%;
	padding-top:10px;
}
	
#middle p, p {
	font-size:12px;
	color:#001029;
}

#middle .indented {
   padding-left: 3.0%;
   padding-right: 4.0%;
}


#middle h1 {
	font-family:helvetica, arial, georgia, times, sans-serif;
	font-size:22px;
	font-weight:normal;
	text-align:center;
	padding-bottom:10px;
}

#middle h2 {
	font-family:"Century Gothic", verdana, arial, times, sans-serif;
	font-size:18px;
	font-weight:normal;
	border-bottom:1px solid #c4c4c4;
	padding-bottom:3px;
}

#middle li  {
	font-family:helvetica,verdana, arial, georgia, sans-serif, times;
	font-weight:normal;
	font-size:11px;
	color:#001029;
}



/***************************  RIGHT COLUMN  *********************/

#right {
	float:left;
	padding-top:120px;
	padding-left:0px;
	font-size:10px;
	width:0%;
	line-height:1.4em;
}

#right a {
	line-height:1.0em;
}

#right br {
	line-height:0.7em;
}


#right p {
	font-size:10px;
	padding-bottom:40px;
	margin-top:-3px !important; /*****  FIREFOX  *****/
	margin-top:-14px;             /***** INTERNET EXLORER *****/
	margin-right:8px;
	color:#404040;
}	



/********************* THIS IS IMPORTANT. DONT ERASE OR MESS WITH IT ***********************/
.clear {
	clear:both;
	line-height:0;
	margin:0;
	padding:0;
	}
/*************************** OK *********/


/********************************************    FOOTER  *****************/

#footer {
	border-top:1px solid #c4c4c4;
	text-align:center;
	width:90%;
	margin:auto;
}

.footer {
	margin-top:-2px;
}