/*
	Framework
	The following code provides the approved format of the
	companies websites.
	
	The first instance lays out the core structure, followed
	by layers of additional css to provide content and furniture
	styling
*/


/* The Site Structure */

@media screen, projection {

	.BeNiceToMacIE5 {
		font-family						: "\"}\"";
		font-family						: inherit;
	}
	html, body, .container {
		width							: 100%;
		height							: 100%;
		min-height						: 100%;
	}
	html>body, html>body .container {
		height							: auto;
	}

	div.container {
		position						: absolute;
		top								: 0;
		height							: 100%;
		left							: 0;
	}

	.footer {
		clear							: both;
		bottom							: 0;
		left							: 0;
		width							: 100%;
		height							: 100px;
		background						: #ccc;
		overflow						: hidden;
		
		
		background                      : rgb(204,204,204,1); /* Old browsers */
        background                      : -moz-linear-gradient(top, rgba(160,159,159,1) 0%, rgba(204,204,204,1) 9%); /* FF3.6+ */
        background                      : -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(160,159,159,1)), color-stop(9%,rgba(204,204,204,1))); /* Chrome,Safari4+ */
        background                      : -webkit-linear-gradient(top, rgba(160,159,159,1) 0%,rgba(204,204,204,1) 9%); /* Chrome10+,Safari5.1+ */
        background                      : -o-linear-gradient(top, rgba(160,159,159,1) 0%,rgba(204,204,204,1) 9%); /* Opera11.10+ */
        background                      : -ms-linear-gradient(top, rgba(160,159,159,1) 0%,rgba(204,204,204,1) 9%); /* IE10+ */
        
        background                      : linear-gradient(top, rgba(160,159,159,1) 0%,rgba(204,204,204,1) 9%); /* W3C */
        
        -pie-background					: linear-gradient(top, rgba(160,159,159,1) 0%,rgba(204,204,204,1) 9%); /* ie */
        
	    -pie-poll						: true;
	
	    /*behavior						: url(../scripts/css3pie/PIE.htc);  for ie compatability */
	}

	.sitepage {
		margin-bottom					: 175px;
		padding							: 0;
	}
	/* \*/
	* html .footer {
		position						: absolute;
	}
	* html .sitepage {
	}
	/* \*/
	head:first-child+body div.footer {
		position						: absolute;
		z-index							: 0;
	}
	head:first-child+body div.sitepage {
		margin-bottom					: 175px;
	}

}

@media all and (min-width:0px) {
	head~body {height                   : 100%;}
}

/* The Site Elements */

.clearFix 
{
    clear                               : both;
    height                              : 0;
}

body  {
	font-family							: Tahoma, Geneva, sans-serif;
	font-size                           : 0.75em;                       /* 16px(base)/12(desired) = 0.75em*/
	color								: #191919;
	color								: #707373;
	border-top                          : #00aaee solid 0px;
	position                            : relative;                     /* Resets the origin point to BODY not HTML */
}

html {overflow-y                        : scroll;}                      /* Cleaver fix to permanently turn on scrollbar */

a {text-decoration						: none;}

h1, h2, h3, h4, h5, h6  {
	font-weight							: normal;
	color								: #333;                         /* H Tags are darker */
	margin								: 24px 0 10px 0;
	padding								: 0 0 0.2em 0;
	border-bottom						: #00aaee solid 1px;
	line-height                         : 1.2em;
	clear                               : both;
}

h1 
{
    font-size							: 1.8em;
    margin-top                          : 10px;
}

h2 {font-size							: 1.6em;}

h3 {font-size							: 1.5em;}

h4 {font-size							: 1.4em;}

h5 {font-size							: 1.2em;}

h6 {font-size							: 1.1em;}

ul {list-style-type                     : square;}

blockquote, .keymessage {
	border								: #eee solid 1px;
	border-color						: #09b5f7;
	border-top-width					: 4px;
	
	width								: 300px;
	padding								: 0.5em 1.8em 0.6em 1.8em;      /* Creating negative offset to account for P Tag having a bottom margin */
	background							: #fbfbfb;
	background							: #f6fdff;                      /* NSG SHADE */
	float								: left;
	margin								: 0 1.6em 1em 0;
}

blockquote table, .keymessage table, blockquote td, .keymessage td, blockquote tr, .keymessage tr {border:none;margin:0;}

blockquote tr:hover, .keymessage tr:hover {background:none;}

blockquote img, .keymessage img {float  : right;}                       /* THIS IS A QUICK FIX remove keymessage when appropriate */

.greenmessage, .greenmessage h2 {border-bottom:0;}                      /* THIS IS A QUICK FIX */

table {
	margin								: 2em auto;
	border								: #eee solid 1px;
}

td, th {
	padding								: 0.6em 1.2em;
	border-left							: #eee solid 1px;
	text-align							: left;
}

caption {
	/*caption-side						: bottom;*/                     /* Not working in IE */
	text-align							: center;
	margin-top							: 10px;
	padding								: 10px 0;
	font-size							: 0.9em;
	border-top							: #eee solid 1px;
}

th {
	background							: #fbfbfb;
	border-bottom						: #eee solid 3px;
	
	background							: #ffffff;                      /* old browsers */
	background							: -moz-linear-gradient(top, #ffffff 41%, #f3f3f3 74%, #ededed 75%, #ffffff 100%); /* firefox */
	background							: -webkit-gradient(linear, left top, left bottom, color-stop(41%,#ffffff), color-stop(74%,#f3f3f3), color-stop(75%,#ededed), color-stop(100%,#ffffff)); /* webkit */
	background							: -o-linear-gradient(top, #ffffff 41%,#f3f3f3 74%,#ededed 75%,#ffffff 100%); /* opera */

	-pie-background						: linear-gradient(top, #ffffff 41%,#f3f3f3 74%,#ededed 75%,#ffffff 100%); /* ie */
	
	-webkit-box-shadow					: inset 0 0 10px #fff;
    -moz-box-shadow						: inset 0 0 10px #fff;
    box-shadow							: inset 0 0 10px #fff;
	
	-pie-poll							: true;
	
	font-weight                         : bold;
	
	/*behavior							: url(../scripts/css3pie/PIE.htc); /* for ie compatability */

}

thead tr {
	border-bottom						: #dbdbdb solid 1px;
}

tr {border-bottom						: #eee solid 1px;}

tr:hover 
{
    background                          : #fafafa;
    cursor                              : default;
}

dl.dataListTable {
    border-top                          : #ddd dotted 1px;
    padding-top                         : 10px;
}
 
dl.dataListTable dt {
    float                               : left;
    clear                               : left; 
    width                               : 120px;
    font-weight                         : bold;
}
 
dl.dataListTable dd 
{
    padding-left                        : 140px;
    margin-bottom                       : 10px;
    padding-bottom                      : 10px;
    border-bottom                       : #ddd dotted 1px;
}

/* Use this for layouts on items */

.fiftyL
{
    float                               : left;
    width                               : 320px;
    padding                             : 10px 10px 10px 0;
}

.fiftyR
{
    
    padding                             : 10px 0 10px 10px;
    float                               : right;
    width                               : 320px;
    
}
.fiftyHolder:after 
{
    content                             : ".";
    display                             : block;
    height                              : 0;
    clear                               : both;
    visibility                          : hidden;
    margin-bottom                       : 20px;
 }

.third 
{
    float                               : left;
    width                               : 33%
}

/* This hides the borders on none tabulars */
.cleanTable,
.cleanTable td,
.cleanTable tr,
.cleanTable tr:hover 
{
    border                              : none !important;
    background                          : none;
}

h1 {margin-top                          : 0;}

.pageHolder ul, .pageHolder ol {margin	: 0 0 15px 24px;}

body, .pageHolder li, .pageHolder p {
	line-height							: 1.6em;
	letter-spacing						: 0.002em;
}

.pageHolder p {
	margin								: 0 0 1em 0;
}

.pageHolder a, .widget a {
    color                               : #00aaee;
    color                               : #009AE6;
    border-bottom                       : #ccc dotted 1px;
    padding-bottom                      : 2px;
}

.pageHolder a:hover {color              : red;}

.imageAndText {
    display                             : block;
    position                            : relative;
    padding-left                        : 240px;
    
    
    margin-bottom                       : 20px;
    min-height                          : 120px;
    height                              : auto !important;
    height                              : 120px;
    
}

.imageAndText img {
    position                            : absolute;
    top                                 : 0;
    left                                : 0;
    
}

.imageAndText li {margin-bottom         : 6px;}

.header {
	height								: auto; /* Variable height */
	position							: relative;
	padding								: 50px 0 10px 0;
	margin								: 0 0 10px 0;
}

.logo {
	position							: absolute;
	left								: 30px;
	top									: 0;
	width								: 160px;
	height								: 94px;
	overflow							: hidden;
	background							: url(img/logoBase.png) no-repeat top left;

	behavior							: url(scripts/css3pie/PIE6.htc); /* for ie compatability */
	-pie-png-fix						: true;
}

.logo a {
	display								: block;
	width								: 160px;
	height								: 94px;
}

.logo img {
	margin								: 0 10px;
	border								: none;
}

.toolnav {
	position							: absolute;
	top									: 20px;
	right								: 10px;
	list-style							: none;
}

.toolnav a {color                       : #ccc;}
.toolnav a:hover {color                 : #4a4a4a;}

/*
	MAIN MENU 
	The menu which runs across the top of the website
*/

.mainmenu {
	margin								: 0;
	padding								: 0 0 0 230px;
	list-style							: none;
	font-size							: 1.1em;
	height								: 42px !important;
	overflow							: hidden;
}

.mainmenu li {
	float								: left;
	line-height							: 43px;
	white-space                         : nowrap;
}

.mainmenu li a {
	line-height							: 43px;
	display								: block;
	padding								: 0 8px;
	color								: #5f5f5f;
}

.mainmenu li a:hover {color             : #2b2b2b;}

.mainmenu li.selected a  {
	background							: url(img/headerHover.jpg) repeat-x top left;
	color								: #fff;
}

.noSubNav {
	height								: 12px;
	overflow							: hidden;
	background							: #25a5e2 url(img/subNavBG.jpg) repeat-x bottom left;
	
	margin								: 0 10px 0 10px; /* Creates an indent from the Main Menu */
	
	-webkit-border-radius				: 0 0 5px 5px;
	-moz-border-radius					: 0 0 5px 5px;
	border-radius						: 0 0 5px 5px;
	
	/*behavior							: url(../scripts/css3pie/PIE.htc); /* for ie compatability */
}


/* REUSABLE COMPONENTS */



/* The glass box effect */
.glassbox {
	border								: #dbdbdb solid 1px;

	-webkit-border-radius				: 5px;
	-moz-border-radius					: 5px;
	border-radius						: 5px;

	/* Truer Glass Effect */
	background							: #ffffff; /* old browsers */
	background							: -moz-linear-gradient(top, #ffffff 41%, #f3f3f3 74%, #ededed 75%, #ffffff 100%); /* firefox */
	background							: -webkit-gradient(linear, left top, left bottom, color-stop(41%,#ffffff), color-stop(74%,#f3f3f3), color-stop(75%,#ededed), color-stop(100%,#ffffff)); /* webkit */
	background							: -o-linear-gradient(top, #ffffff 41%,#f3f3f3 74%,#ededed 75%,#ffffff 100%); /* opera */

	-pie-background						: linear-gradient(top, #ffffff 41%,#f3f3f3 74%,#ededed 75%,#ffffff 100%); /* ie */

	-webkit-box-shadow					: inset 0 0 10px #fff;
    -moz-box-shadow						: inset 0 0 10px #fff;
    box-shadow							: inset 0 0 10px #fff;

	-pie-poll							: true;

	/*behavior							: url(../scripts/css3pie/PIE.htc); /* for ie compatability */

	_background							: #fff url(img/navBG.jpg) repeat-x bottom left !important;
	display                             : block; /* catch All */
}

.grid_4 .glassbox.widget, .grid_8 .glassbox, .grid_12 .glassbox, .grid_11 .glassbox { /* Creates a padding: note .widget.glassbox not working in ie6 */
	padding								: 10px;
	/* min-height					    : 218px; */
	margin-bottom						: 20px;
}

.widget.glassbox  a {/*display:block;*/ border:none;}
.widget.glassbox  a:hover 
{
    color                               : #00aaee;
    color                               : red;
}

.widget.glassbox ul {list-style         : none;}

.home .widget.glassbox 
{
    min-height                          : 205px;
    height                              : auto !important;
    height                              : 205px;
}

.homeIR 
{
    min-height                          : 240px;
    height                              : auto !important;
    height                              : 240px;
}

a span {cursor:pointer;}

.widget h1,
.widget h2,
.widget h3,
.widget h4,
.widget h5,
.widget h6 
{border                                 : none;}

.widget h3,.widget h4 {margin           : 0 0 10px 0;}

.sustainabilitybox 
{
    position                            : relative;
    height                              : 120px;
}

.sustainabilitybox img
{
    position                            : absolute;
    bottom                              : -10px;
    right                               : -10px;
    z-index                             : 1;
    
    
    behavior							: url(scripts/css3pie/PIE6.htc); /* for ie compatability */
	-pie-png-fix						: true;
}

.sustainabilitybox a /*:first-child */
{
    position                            : absolute;
    left                                : 0;
    top                                 : 0px;
    width                               : 180px;
    z-index                             : 10;
}

/*
	FOOTER and FOOTER ELEMENTS
*/

.footer {
	color								: #626262;
}

.companyAddress {
	float								: left;
	padding								: 20px;
	width								: 450px;
}

.greyBox
{
    border                              : #f4f4f4 solid 1px;
    background                          : #fbfbfb;
    padding                             : 5px 10px;
    margin                              : 0;
    clear                               : both;
}

.greyBox a {padding-bottom              : 1px;} /* Reduce Underline spacing */

