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

**************************************************************



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:verdana, arial, times, georgia, sans-serif;

}



a {

	color:#0033FF;

	text-decoration:none;

}



a:hover {

	color:#999966;

	text-decoration:underline;

}



img.left {

	float:left;

	padding:3px;

	margin-right:6px;

	border:1px solid #c4c4c4;

}



img.right {

	float:right;

	padding:1px;

	border:1px solid #c4c4c4;

	margin-left: 5px;

}



#wrapper {

	height:100%;

	margin:auto;

	width:90%;

}





/********************* Search form  ******************/

.text {

	height:14px;

	width:110px;

}



.go {

	height:21px;

	background:#65A8C9;

	color:#fff;

	font-family:helvetica;

	font-weight:bold;

}



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



#top h1 {

	font-family:"Century Gothic", georgia, helvetica, times, sans-serif;

	font-weight:bold;

	font-size:200%;

	text-transform:uppercase;

	margin-top:31px;

	margin-left:240px;

	color: #FFFFFF;

	margin-bottom: 0px;

	}



#top h2 {

	font-family:"Century Gothic", georgia, helvetica, times, sans-serif;

	font-weight:bold;

	font-size:100%;

	text-transform:uppercase;

	margin-top:5px;

	margin-left:240px;

	color: #FFFFFF;

	}



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



#top {

	margin:auto;

	padding:10px;

	height:150px;

	background:url(images/masthead_01.jpg) no-repeat; 

	width:93%;

	}

	



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



#left {

	float:left;

	left:0px;

	padding:10px;

	width:20%;

	}

	

#left h1, #right h1 {
	font-size:large;
	padding-top:5px;
	font-family:helvetica, arial, georgia, times, sans-serif;
	border-bottom:1px dotted #c4c4c4;

}



#left strong {

	font-size:90%;

	font-weight: bold;

	color: #000000;

}



#left p {

	font-size:68%;

	padding-bottom:10px;

	margin-top:-3px !important; /*****  FIREFOX  *****/

	margin-top:-14px;             /***** INTERNET EXLORER *****/

	color:#404040;

}	



#left .qlink {

	font-size: 75%;

	margin-bottom: 2px;

}



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



#middle {

	float:left;

	width:46%;

	line-height:1.01em;

	padding-left:3.5%;

	padding-right:3.5%;

}

	

#middle p, p {
	font-size:70%;
	color:#404040;
	line-height: 1.6em;
	font-family: verdana, arial, times, georgia, sans-serif;

}



#middle h1 {

	font-family:"Century Gothic", verdana, arial, times, sans-serif;

	font-size:160%;

	font-weight:normal;

	border-bottom:1px solid #c4c4c4;

	padding-bottom:3px;

}



#middle h2 {

	font-family:"Century Gothic", verdana, arial, times, sans-serif;

	font-size:130%;

	padding-bottom:2px;

	font-weight: normal;

}



#middle h4 {

	font-family:"Century Gothic", verdana, arial, times, sans-serif;

	font-size:90%;

	font-weight:normal;

}



/***************************  MIDDLE ONE COLUMN *****************/



#middleOne {

	float:left;

	width:70%;

	line-height:1.01em;

	padding-left:3.5%;

	padding-right:3.5%;

}

	

#middleOne p, p {
	font-size:small;
	color:#000;
	line-height: 1.6em;
	text-align: left;

}



#middleOne h1 {

	font-family:"Century Gothic", verdana, arial, times, sans-serif;

	font-size:160%;

	font-weight:normal;

	border-bottom:1px solid #c4c4c4;

	padding-bottom:3px;

}



#middleOne h2 {

	font-family:"Century Gothic", verdana, arial, times, sans-serif;

	font-size:130%;

	padding-bottom:2px;

	font-weight: normal;

}



#middleOne h3 {



	font-family:"Century Gothic", verdana, arial, times, sans-serif;

	font-size:90%;

	font-weight:normal;

	border-bottom:1px solid #c4c4c4;

	padding-bottom:3px;

}



#middleOne h4 {

	font-family:"Century Gothic", verdana, arial, times, sans-serif;

	font-size:90%;

	font-weight:normal;

	margin-top: 3px;

}

#middleOne ul {

	font-size: 70%;

}

#middleOne ol {

	font-size: 70%;

}

#middleOne .floatLeft {

	float:left;

	width: 49%;

}



#middleOne .floatRight {

	float:right;

	width: 49%;

}



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



#right {

	float:left;

	padding-top:10px;

	font-size:78%;

	width:24%;

	line-height:1.6em;

}



#right a {

	line-height:1em;

}



#right br {

	line-height:0.7em;

}





/********************* 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;

	padding-top:5px;

	text-align:center;

	width:90%;

	margin:auto;

}



.footer {

	margin-top:-2px;

}	

.ddmx {

    font: 11px tahoma;

}

.ddmx .item1,

.ddmx .item1:hover,

.ddmx .item1-active,

.ddmx .item1-active:hover {

    padding: 3px 10px 3px 10px;

    border-bottom: 1px solid #cccccc;

    background: #003366;

    font: 12px arial;

    color: #ffffff;

    font-weight: bold;

    text-decoration: none;

    display: block;

    white-space: nowrap;

    position: relative;

}

.ddmx .item2,

.ddmx .item2:hover,

.ddmx .item2-active,

.ddmx .item2-active:hover {

    padding: 3px 8px 4px 8px;

    font: 11px tahoma;

    color: #000000;

    font-weight: bold;

    text-decoration: none;

    display: block;

    white-space: nowrap;

    position: relative;

    z-index: 500;

}

.ddmx .item2 {

    background: #999966;

}

.ddmx .item2:hover,

.ddmx .item2-active,

.ddmx .item2-active:hover {

    background: #ffffff;

}

.ddmx .arrow,

.ddmx .arrow:hover {

    padding: 3px 16px 4px 8px;

}

.ddmx .item2 img,

.ddmx .item2-active img{

    position: absolute;

    top: 4px;

    right: 1px;

    border: 0;

}

.ddmx .section {

    border: 1px solid #b8b4ae;

    position: absolute;

    visibility: hidden;

    z-index: -1;

}



.ddmx .bottom,

.ddmx .bottom:hover {

    border-bottom: 1px solid #000000;

}



* html .ddmx td { position: relative; } /* ie 5.0 fix */



.redText {

	color: #FF0000;

}

.videoLink {

	font-size: 120%;

}

#wrapper #right p strong {
	color: #F00;
}
#wrapper #middleOne div table tr td {
	text-align: center;
	font-size: 18px;
}
.bolds {
	font-weight: bold;
}