/* 	1.MAIN.CSS
	Styles for on-screen media are delared here.
	Imports reset stylesheet and contains commonly used helper styles
   
   --------------------------------------------------------------------------------------------------------------------------
   FILE INFO
   Last updated:	2011/09/09
   Created by:		Jaz Denness
   ----------------------------------------------------------------------------------------------------------------------- 
*/
	@import "2.reset.css";
	@import "3.styles.css";
		
/* =Colour Glossary
-----------------------------------------------------------------------------*/
/*
PANEL BLUE
- Content area background
- Customise tray background		 #383939 

BACKGROUND BLUE
- Page background				#505155

MID BLUE
- Secondary nav bg
- Customise panel headers		#62A3D7

SKY BLUE
- Top nav indicator
- 4px bars						#62A3D7

GOLD
- Highlight colour
- Error messaging				#ffa800

DARK GOLD
- Error messaging
- Contrast colour				#bf7e00

Body copy either #FFF or #000

*/
	
/* =Helper styles
--------------------------------------------------------------------- */

/* cc (clear container) or clearfix */ 
.cc, .clearfix { zoom: 1; } .cc:after, .clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}

/* http://www.quirksmode.org/css/clearing.html */
.clear-simple{
	overflow: hidden;
	width: 100%;
}

/* Hidden text or use to position tracking tags offscreen */
.hidden{
	position:absolute;
	left:-10000px;
	top:auto;
	width:1px; /* If width:0; height:0; most screen readers will ignore this content */
	height:1px;
	overflow:hidden;
}
.hidden-indent{
	text-indent: -1000px; /* viable option if the element does not contain navigable elements.*/
}
.vis-hidden{
	visibility: hidden;
}

/* Image replacement using the Gilder/Levin method for images with solid backgrounds 
// Text remains in place on screen, so can be seen with CSS on but images off */
.replace {
	position: relative; 
	overflow: hidden;
}
.replace em,
.replace a{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
}

/*  Image replacement using the Phark method for images with transparent backgrounds 
// Text indented off screen, cannot be seen with CSS on but images off  - still read by screen readers */
.phark-replace { 
	overflow: hidden; /* prevents dotted lines extending offscreen in FF */
	background-repeat: no-repeat;
	text-indent: -9000px;
}
	
.phark-replace a { 
	display: block; 
	width: 100%; 
	height: 100%;
}

/* =Skip navigation
--------------------------------------------------------------------- */
#skipnav {
	position: absolute;
	top: -9000px;
	left: 0;
}
#skipnav li {
	width: 300px;
}
#skipnav a {
	position: absolute;
	top: 0;
	padding: 10px;
}
#skipnav a:active, 
#skipnav a:focus {
	top: 9000px;
}
