/* ----- CNC CSS FRAMEWORK v1.0 ----------------------------------------------------- */
/* ----- Created by Creative Nature Communications YYYY/MM/DD ----------------------- */
/* ----- Website Name Goes Here ----------------------------------------------------- */
/* ----- Credits: *****  ------------------------------------------------------------ */


/* TABLE OF CONTENTS

00 - Global Includes
01 - Typography 
02 - Main Structure - The core Structure
03 - Content Styles 	

*/


/* 00 - Global Includes  */
/* --------------------------------------------------------------------------------------------------------------------------- */

@import url(cssreset.css);
@import url(navigation.css);
@import url(modules/modules.css);


/* 01 - Typography  */
/* --------------------------------------------------------------------------------------------------------------------------- */

body {
	font-size:0.75em;	
}

p {
	line-height:2em;
	color:#666666;
}

h1 {}
#mainContent h2 {
	color:#666666;
	font-weight:normal;
	font-size:1.7em;

}
h3 { 
	
}
#mainContent h4 {
	color:#666666;
	font-size:21px;
	font-weight:300;
	line-height:1.6em;
	margin:0 0 1em;
}
#mainContent h5 { 
	line-height:2em;
	font-size:.9em;
	color:#666666;
	font-weight:bold;
}
h6 {}

ul{}
ol{}
#mainContent li{ list-style:url(../../Ngarda/Images/bullet.gif)}

a{ color:#8E0E24; text-decoration:none; font-weight:bold;}
a:hover{}


/* 02 - Main Structure */
/* --------------------------------------------------------------------------------------------------------------------------- */

/* Main Structure */

#headBar {
	border-bottom:7px solid #000;
}

#mainBackground {
	background:url(../../Ngarda/Images/midSection.png) repeat-y top center;	
}
#mainTop {
	background:url(../../Ngarda/Images/midSectionTop.png) top center no-repeat;
}
#mainFinish {
	background:url(../../Ngarda/Images/midSectionFinish.png) bottom center no-repeat;
}

#mainWrapper {
	width:960px;
	margin:0 auto;
}



/* Header Area */
#header {
}

#mainLogo {
	float:left;
	padding:65px 0 55px 27px;
	width:323px;
}

#mainLogo h1{
	width:283px;
	height:123px;
	text-indent:-999em;
	margin:0;
	padding:0;
	background:url(../Images/mainLogo.gif);
}
#pageImage {
	width:600px;
	padding:42px 0 0 9px;
	margin-bottom:-182px;
	float:left;
}


/* Content Area */
#midWrapper {
	clear:both;
	min-height:480px;
	padding-top:10px;
}

#navCol {
	float:left;
	width:219px;
}
#mainNav {
	position:relative;
	
}

#mainContent {
	float:left;
	width:460px;
	position:relative;
	padding:50px 30px 50px 30px;
}


#contentCol{
	float:left;
	width:730px;
}

#mainContentArea {
}


/* Footer Area */
#footer {
	margin-top:10px;
	padding-bottom:60px;

}

#legal {
}

#credits {
}

/* 03 - Content Styles */
/* --------------------------------------------------------------------------------------------------------------------------- */


h3#welcome  {
	background:url(../../Ngarda/Images/welcome.png);
	width:459px;
	height:157px;
	text-indent:-999em;
	overflow:hidden;
}
	


#news h3{
	font-size:1.5em;
	font-weight:bold;
	letter-spacing:-2px;
	margin:0 0 5px 0;
}

#news {
	float:left;
	width:190px;
	margin:50px 0 0 0;
	position:relative;
}


#news ul{
	background:#e3e3e3;
	padding:0;
	margin:0;
}

#news li {
	border-bottom: 3px solid #FFFFFF;
	margin:0;
	padding:0;
}

#news li a{
	display:block;
	line-height:17px;
	color:#000;
	text-decoration:none;
	padding:7px;
	font-weight:bold;
}

#news li.alternate {
	background:#f3f3f3;
}

#advertOne {
	margin-top:10px;
}
.work, .video {
	display:block;
	width:189px;
	height:58px;
	text-indent:-999em;
	margin:5px 0 0 0;
	background:url(../../Ngarda/Images/advertSprite.png);
	overflow:hidden;
}

.work {background-position:0 0;}
.work:hover {background-position:-189px 0;}

.video {background-position:0 -58px;}
.video:hover {background-position:-189px -58px;}

#legal {
	float:left;
	width:760px;
	margin: 5px 0;
}

#legal a{
	font-size:.8em;
	line-height:2.35em;
	color:#b2b2b2;
	display:block;
	float:left;
	padding:0 10px;
	margin:0 5px 0 0;
	background:#EDEDED;
	text-decoration:none;
	-moz-border-radius: 10px; 
	-webkit-border-radius: 10px;
	border-radius: 10px;
}
#legal a:hover{
	background:#E4E4E4;
}

#credits {
	float:left;
	margin:0 0 5px 60px;
}

#credits a{
	display:block;
	background:url(../../Ngarda/Images/cncLogo.gif) top left;
	width:95px;
	height:36px;
	text-indent:-99em;
	overflow:hidden;
	text-decoration:none;
	border:none;
}

#textTools {
	float:right;
	width:78px;
	padding:15px 10px 0 0;
}
#news #textTools {
	padding:22px 0 0 0;
}
#textTools ul, #textTools li {
	margin:0;
	padding:0;
	list-style:none;
}
#textTools li {
	margin:0 3px 0 0;
	float:left;
	border:none;
}
#news #textTools li a {
	padding:0;
	line-height:normal;
}
#textTools li a{
	background:url(../../Ngarda/Images/toolsSprite.png);
	display:block;
	overflow:hidden;
	height:22px;
	width:23px;
	text-indent:-999em;
}
#textTools li.smaller a{
	background-position:0 0;
}
#textTools li.smaller a:hover{
	background-position:0 -22px;
}
#textTools li.larger a{
	background-position:-26px 0;
}
#textTools li.larger a:hover{
	background-position:-26px -22px;
}
#textTools li.print a{
	background-position:-53px 0;
}
#textTools li.print a:hover{
	background-position:-53px -22px;
}	

/* -------------------------------------------------------- */




a.word {
background:transparent url(../Images/icon_word.gif) no-repeat scroll left top;
color:#1780BE;
display:block;
font-weight:bold;
min-height:16px;
padding:0 0 0 20px;
}
a.pdf {
background:transparent url(../Images/icon_pdf.gif) no-repeat scroll left top;
color:#1780BE;
display:block;
font-weight:bold;
min-height:16px;
padding:0 0 0 20px;
}

#document_details {
border:1px solid #BBEBFE;
width:753px;
}
.docOptionLinks {
padding:20px 0;
}
.docOptionLinks a {
background-color:#5B97A9;
color:#FFFFFF;
font-size:1.1em;
font-weight:bold;
margin:0 5px;
padding:3px 10px;
text-decoration:none;
}
.docOptionLinks a:hover {
background-color:#4E7282;
}
.change_log {
float:right;
margin-left:20px;
text-align:left;
width:250px;
}
.log1, .log2 {
padding:5px;
}
.log2 {
background-color:#ECF9FF;
}
#docDetails div.row {
background:transparent none repeat scroll 0 0;
}
#docDetails {
	background-color:#F7F7F7;
	border:1px solid #E6E6E6;
	margin-bottom:20px;
	padding:5px 5px 0;
}
div.row {
padding:5px 0 0 5px;
}
.row input {
margin:5px;
}
div.row .label {
float:left;
}
div.row .label2 {
float:left;
width:300px;
}
div.row .formw {
	margin-left:183px;
	padding-bottom:10px;
}
div.row .docTitle {
	height:70px;
	margin-left:60px;
}
div.row .docIcon {
float:left;
width:55px;
}
div.row select.w164 {
width:164px;
}
div.row input.grey {
background-color:#E5E4E5;
border:1px solid #879BB6;
}
.expanded_content {
background-color:#E5E4E5;
color:#000000;
}
.rb {
background-color:#E5E4E5;
border-right:1px solid #D6D6D6;
}
.rbb {
background-color:#E5E4E5;
border-bottom:1px solid #D6D6D6;
border-right:1px solid #D6D6D6;
}
.bb {
background-color:#E5E4E5;
border-bottom:1px solid #D6D6D6;
}
.greytext {
color:#666666;
}
div.rowright {
padding:0 20px 0 0;
text-align:right;
}
input.align {
margin-bottom:-4px;
}
.alert {
color:#FF0000;
}
.right {
float:right;
}
.blue_button {
background:transparent url(../Images/btn.gif) no-repeat scroll right top;
color:#FFFFFF;
font-size:12px;
font-weight:bold;
height:16px;
margin-bottom:-3px;
min-width:10px;
padding:3px 25px 3px 10px;
text-align:left;
}
input.button1 {
	background:transparent url(../Images/btn.gif) no-repeat scroll right top;
	border:medium none;
	color:#FFFFFF;
	font-size:12px;
	font-weight:bold;
	margin:0;
	text-align:center;
	height:21px;
	line-height:21px;
	padding:0 10px 0 0;
	text-align:right;
}
.filter {
background:#EDEDED none repeat scroll 0 0;
margin:10px 0 0;
padding:10px;
}
.filter a {
background:#FFFFFF none repeat scroll 0 0;
color:#424242;
display:block;
font-weight:bold;
line-height:20px;
margin-bottom:3px;
padding:0 10px;
text-decoration:none;
}
.filter a:hover {
background:#83C8D8 none repeat scroll 0 0;
color:#FFFFFF;
}
.sp-autoFilter {
display:block;
height:20px;
}
div.row {
background:#F8F8F8 none repeat scroll 0 0;
margin:0 0 5px;
padding:10px;
}
.row:hover {
background:#EBEBEB none repeat scroll 0 0;
}
div.selections {
border:3px solid #EBEBEB;
margin:10px 0 5px;
padding:10px;
}



/*** ESSENTIAL NAV STYLES ***/

.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			160px; /* left offset of submenus need to match (see below) */
}

.sf-menu ul li {
	width:			100%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			2.5em; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			140px; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			188px; /* match ul width */
	top:			0;
}

/*** DEMO SKIN ***/
.sf-menu {
	float:			left;
	margin-bottom:	1em;
}
.sf-menu a {

}
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color:			#fff;
}
.sf-menu li {

}
.sf-menu li li {
	background:	#851127;
}
.sf-menu li li li {
	background:	#851127;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	background:		#851127;
	outline:		0;
}

/*** arrows **/
.sf-menu a.sf-with-ul {
	padding-right: 	2.25em;
	min-width:		1px; /* trigger IE7 hasLayout so spans position accurately */
}
.sf-sub-indicator {
	position:		absolute;
	display:		block;
	right:			.75em;
	top:			1.05em; /* IE6 only */
	width:			10px;
	height:			10px;
	text-indent: 	-999em;
	overflow:		hidden;
	background:		url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			.8em;
	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
	background:	url('../images/shadow.png') no-repeat bottom right;
	padding: 0 8px 9px 0;
	-moz-border-radius-bottomleft: 17px;
	-moz-border-radius-topright: 17px;
	-webkit-border-top-right-radius: 17px;
	-webkit-border-bottom-left-radius: 17px;
}
.sf-shadow ul.sf-shadow-off {
	background: transparent;
}




/*** adding sf-vertical in addition to sf-menu creates a vertical menu ***/
.sf-vertical, .sf-vertical li {
	width:	218px;
}
/* this lacks ul at the start of the selector, so the styles from the main CSS file override it where needed */
.sf-vertical li:hover ul,
.sf-vertical li.sfHover ul {
	left:	218px; /* match ul width */
	top:	0;
}

/*** alter arrow directions ***/
.sf-vertical .sf-sub-indicator { background-position: -10px 0; } /* IE6 gets solid image only */
.sf-vertical a > .sf-sub-indicator { background-position: 0 0; } /* use translucent arrow for modern browsers*/

/* hover arrow direction for modern browsers*/
.sf-vertical a:focus > .sf-sub-indicator,
.sf-vertical a:hover > .sf-sub-indicator,
.sf-vertical a:active > .sf-sub-indicator,
.sf-vertical li:hover > a > .sf-sub-indicator,
.sf-vertical li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

#userBox fieldset {
	background:none repeat scroll 0 0 #F2F2F2;
	clear:both;
	margin:-10px 0 0;
	padding:10px;
}

#sb-overlay {
z-index:9999;
}
#sb-wrapper {
z-index:99999;
}