/* =====================================================================	
	 	global.css
========================================================================		
   	Author:
   	Date:
------------------------------------------------------------------------
	Comments
	
	Namein Convetions: all selectors are to use camelCase naming
	E.g. rightPanel, mainContent, pageWrapper etc...
	
	By defining the font-size as 100% on the body, we can then use EMs 
	to define font-size/heights/widths on elements. This is because the 
	default font-size in all browsers is 16px.
	
	(desired font-size / 16 = value in EMs)
	
	0.625em		=	10px
	0.6875em	=	11px
	0.75em 		=	12px
	0.875em		=	14px
	1em 		= 	16px
	
------------------------------------------------------------------------
   
   	 	
========================================================================*/

/* =General
	styles that will always apply to elements
	throughout the website.
	E.g. ul, li, a, p, blockquote etc...
----------------------------------------------------------------------*/

html, body { background: #fff; }

body
{
	font-family: Verdana, Arial, sans-serif;
	font-size: 100%;
	line-height: 1.4;
	color: #333;
}
#main, #sec, #footer
{
	font-size: 0.80em;
}

p
{
	margin: 0;
	padding: 0.5em 0 1em 0;
}

.intro
{
	font-size: 1em;
	line-height:1.3;
	margin-bottom:0.75em;
}

.bordered {
	border-top:1px solid #E0E0E0;
	border-bottom:1px solid #E0E0E0;
	padding:20px;
	margin:10px 0;
}

a, a:link, a:visited, #secondaryNav a:hover, .arrow_opt2 { color: #FF4100; }
a.reverseColour { color: #333; }
a, a:visited { text-decoration: underline; }
a:hover { text-decoration: none; }
a:active { color: #333; }

#contentMain a 
{
    color:#333;    
}



.arrow, .arrow:hover, #site_map .top_link, #site_map .top_link:hover
{
	padding: 0 0 0.1em 24px;
	background: url(/img/bg/orange_ar.gif) center left no-repeat;
	font-family: Verdana, Arial, sans;
 	font-weight: bold;
}

.arrow_opt2, .arrow_opt2:hover { background: url(/img/bg/orange_ar_w.gif) center left no-repeat; }
.arrow_opt3, .arrow_opt3:hover { background: url(/img/bg/orange_ar_light.gif) center left no-repeat; }

h2.arrow, .promo p.action .arrow_opt3, .promo p.action .arrow_opt3:hover, .arrow, .arrow:hover, #site_map .top_link, #site_map .top_link:hover {
    background-position: 0 0.25em;
}


.uppercase { text-transform: uppercase; }
.fade { color: #777; }
.borderImage { border: 4px solid #fff; }
.body .borderImage { margin:0 13px 13px 0;}

h1
{
	font-size: 2em;
 	font-family: Verdana, Arial, Helvetica , sans-serif;
	text-transform: uppercase;
	font-weight: bold;
	padding: 0;
	margin:-0.15em 0 0.5em 0;
	color: #212121;
	line-height:1.2;
}

h2 { font-size: 1.25em; margin: 0em 0 0.25em 0; }
h3 {font-size:1em;}
h3 .date {font-weight:normal;}
h4, h5, h6
{
	font-size: 0.75em;
	/* 0.75 x 16 = 12(px) */
	font-weight: bold;
	padding: 0;
	color: #000;
}

#sec h3 a { color: #333; }

/* =Lists Styles */
ol, ul, dl
{
	padding: 0 0 0.8em 0;
	list-style-type: none;
}

.spacial li { margin-bottom: 15px; }
.vlist { margin-top: 20px; }
.vlist h2 { margin-bottom: 0.5em; }

.btn {
    overflow:visible;
    padding:1px 3px;
}

.img {
    margin:0.5em 0;
}

.hide{
    display:none;
}

.show {
    display:block;
}

#content a[href$='.pdf'] {
    background: url(/img/bg/pdficon_small.gif) right center no-repeat;
    padding: 2px 20px 2px 0;
    display: inline-block;
}

body #content a.noIcon {
    background:none;
    padding:0;
    display:inline;
}
.thumb img {
	margin: 0 10px 10px 0;
	display: block;
}
.advertisingBox {
	width: 300px;
	margin: 0 0 1em 0;
	padding: 0;
}

.popupImage {
    text-decoration:none !important;
    font-size:90%;
}

.caption {
    padding-top:0px;
    font-style:italic;
    margin-bottom:10px;
}