/* 
STYLE.CSS
AUTHOR - metal@flat.com
DATE   - August, 2009
NOTES  - This layout and stylesheet uses an em based configuration with a ratio of 1.0em => 10px
*/
/************************************************************************************************************/
/************************************************************************************************************/
/************************************************************************************************************/
/* ------------------------------------------------------------------------------------------------------- */
/* BODY ATTRIBUTES - this will zero things out and prep the font size for 'em' based relations */
/* ------------------------------------------------------------------------------------------------------- */

*::-moz-selection {
	background-color: #ccc;
	color: #333;
}

*::selection {
	background-color: #ccc;
	color: #333;
}

* {
	outline: none;
}

html {
	font-size: 100%; /* failsafe for IE6 */
	overflow-y: scroll;
}

body {
	font-family: verdana, san-serif;
	font-size: 62.5%; /* this will render a default 16pt font as 10px ( 10px/16 * 100% = 62.5), thus 1em == 10px */
	margin: 0;
	padding: 0;
}

html>body {
	font-size: 10px; /* ignored by IE6, recognized by Firefox, Safari, IE7, Opera */
}

/* this will zero out unwanted or expected borders and margins....unless specified later */
body,img,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,p,blockquote,table,tr,th,td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: none;
}

html, body {
	height: 100%;
}

/************************************************************************************************************/
/************************************************************************************************************/
/************************************************************************************************************/
/* ------------------------------------------------------------------------------------------------------- */
/* COMMON ELEMENTS */
/* ------------------------------------------------------------------------------------------------------- */
html, body {
	font-family: Arial, Verdana, Helvetica, san-serif;
	color: #444444;
}

a, a:link, a:visited {
	color: inherit;
	text-decoration: none;
	margin: -0.1em -0.1em;
	padding: 0.1em 0.1em;
	color: #444444;
	background-color: transparent;
}

a:hover, a.on {	
	color: inherit;
	text-decoration: none;
	margin: -0.1em -0.1em;
	padding: 0.1em 0.1em;
	color: #444444;
	background-color: #d3d3b4;
}

a.nohover, a.nohover:link, a.nohover:hover, a.nohover:visited, a img, a:hover img {
	background: transparent !important;
}

p {
	font-size: 1.1em;
	line-height: 1.3em;
	margin-top: 0em;
	margin-bottom: 0em;
}

small {
	color: inherit;
	font-size: 1.0em;
	text-transform: uppercase;
}

h1, b.h1, a.h1 {
	font-size: 1.8em;
	font-weight: normal;
	font-family: Arial, Helvetica;
	color: inherit;
	margin: 0em !important;
	line-height: none !important;
}

h2, b.h2, a.h2 {
	font-size: 1.3em;
	font-weight: normal;
	font-family: Arial, Helvetica;
	color: inherit;
	margin: 0em !important;
	line-height: none !important;
}

h3, b.h3, a.h3 {
	font-weight: bold;
	font-family: inherit;
	color: inherit;
	margin: 0em !important;
	line-height: none !important;
}

legend, label {
	display: none;
}

img { -ms-interpolation-mode: bicubic; }



/************************************************************************************************************/
/************************************************************************************************************/
/************************************************************************************************************/
/* ------------------------------------------------------------------------------------------------------- */
/* CONTENT AND LAYOUTS */
/* ------------------------------------------------------------------------------------------------------- */
.horizontal_rule {
	clear:both;
	height: 0.1em;
	margin: 1.0em 0em;
	border-top: 0.1em solid #888888;
	overflow: hidden;
}

.horizontal_rule img {
	height: 0.1em;
}


/* ------------------------------------------------------------------------------------------------------- */
/* BODY FOG & LOAD LAYER - used for dynamic content, on top most layers */
/* ------------------------------------------------------------------------------------------------------- */
#body_fog { /* hack for IE6 needed - background transparency */
	position: fixed;
	top: 0px; left: 0px;
	z-index: 100;
	height: 100%;
	width: 100%;
	background: url('../img/bkgd-body_fog.png') repeat;
}

#load_layer {
	position: absolute;
	top: 0px; left: 0px;
	z-index: 200;
	height: 100%;
	width: 100%;
	background: url('../img/bkgd-load_layer.png') repeat;
}
	
	#load_layer_content {
		margin: 5.6em auto;
		text-align: center;
	}
	
	#load_layer_data {
		text-align: center !important;
	}

/* ------------------------------------------------------------------------------------------------------- */
/* BODY CONTAIER - main wrapper */
/* ------------------------------------------------------------------------------------------------------- */
body {
	/*background: #ffffff url('../img/bkgd-body_left.gif') no-repeat top left;*/
	background: #ffffff url('../../images/design/bg.jpg') top left;
}

/* MODIFIED - metal@flat.com : 09-04-2009 */
#body_container {
	position: relative;
	z-index: 100;
	height: auto;
	width: 100%;
	margin: 0em 0em;
	/*background-image: url('../img/bkgd-body_content_2.png');*/
	background-image: url('../img/bkgd-body_content_3.png');
	background-position: center bottom; /* this is disregarded due to the repeat, though it should be visible 247 from the top */
	background-repeat: no-repeat;
}

/* ADDED - metal@flat.com : 09-04-2009 */
#body_container_bkgd_footer {
	width: auto;
	width: 98.5em;
	margin: 0em auto;
	padding: 0em 0em;
	background-color: transparent;
	/* background-image: url('../img/bkgd-body_content_3.png'); */
	background-position: center bottom; /* this is disregarded due to the repeat, though it should be visible 247 from the top */
	background-repeat: no-repeat;
}

/* MODIFIED - metal@flat.com : 09-04-2009 */
#body_container_inner {
	width: 90.5em;
	margin: 0em auto;
	padding: 0em 4.0em 2.0em 4.0em;
	background-image: url('../img/bkgd-body_content_1.png');
	background-position: center top;
	background-repeat: no-repeat;
}

#body_background {
	position: absolute;
	top: 0px; right: 0px;
	z-index: 0;
	height: 100%;
	width: 100%;
	/*background: transparent url('../img/bkgd-body_right.gif') no-repeat top right;*/
	background: transparent;
}

/* ------------------------------------------------------------------------------------------------------- */
#body_header {
	height: auto;
	width: 90.5em;
	margin: 2.5em auto 0em auto;
	padding: 2.5em 0em 0em 0em;
	background-color: transparent;
}

#body_navigation {
	height: auto;
	width: 90.5em;
	margin: 2.0em auto;
	padding: 0em 0em;
	background-color: transparent;
}

#body_content {
	/*height: auto;*/
	min-height: 50.0em;
	width: 90.5em;
	margin: 0em auto;
	padding: 0em 0em;
	background-color: transparent;
}

/* MODIFIED - metal@flat.com : 09-04-2009 */
#body_content_meta {
	position: relative;
	z-index: 2;
	height: auto;
	width: 90.5em;
	margin: 2.5em auto 0em auto;
	padding: 0em 0em;
	background: transparent;
}

/* MODIFIED - metal@flat.com : 09-04-2009 */
#body_footer {
	position: relative;
	z-index: 2;
	height: auto;
	width: 98.5em;
	margin: 2.0em auto;
	padding: 0em 0em;
	overflow: hidden;
	padding-bottom: 2.0em;
	background-color: transparent;
	text-align: right;
	color: #999999;
}
	
/* ------------------------------------------------------------------------------------------------------- */
/* CONTENT COLUMN - content area definitions
/* ------------------------------------------------------------------------------------------------------- */
#body_content_right {
	width: 90.5em;
	margin: 0em auto;
	padding: 0em 0em;
	float: left;
}

#body_content_right div.content {
	width: 45.2em;
	padding: 0em 0.8em;
	float: left;
}


/* ------------------------------------------------------------------------------------------------------- */
/* NAVIGATION ITEMS
/* ------------------------------------------------------------------------------------------------------- */
ul#navigation_items {
	line-height: 15px;
}

ul#navigation_items a {
/*	background-color: transparent; */
	text-decoration: none;
}

ul#navigation_items, ul#navigation_items li, ul#navigation_items ul {
	margin: 0em;
	padding: 0em;
	list-style-type: none !important;
}

ul#navigation_items li {
	float: left;
}

ul#navigation_items li a {
	margin: 0 !important;
	padding: 0 !important;
	border: none;
	background-color: transparent;
}

ul#navigation_items li a:hover, ul#navigation_items li a:active {
	border: none;
	background-color: transparent;
}

ul#navigation_items li div.trigger_div {
	position: relative; /* for IE */
	height: 2.7em !important;
	overflow: hidden;
	display: block;
	float: left;
}

ul#navigation_items li div.trigger_div a img {
	
}

ul#navigation_items li div.trigger_div a:hover img {
	position: relative;
	top: -2.7em;
	left: 0em;
}

ul#navigation_items li div.trigger_div a.on img {
	position: relative;
	top: -5.4em;
	left: 0em;
}


/* LOGIN BUTTON */
div.login {
	position: relative; /* for IE */
	height: 1.8em !important;
	overflow: hidden;
	display: block;
	float: left;
	margin-top: 2.0em; margin-bottom: 0.8em;
}

div.login a:hover img {
	position: relative;
	top: -1.8em;
	left: 0em;
}

div.login a.on img {
	position: relative;
	top: -1.8em;
	left: 0em;
}

input.input_search {
	border: none;
	background: #fff;
	font-size: 1.1em;
	padding: 0.2em 0.3em;
	width: 17.0em;
	height: 1.2em;
}

input.input_contact {
	font-size: 10px;
	border: none;
	background: #fff;
	font-size: 1.1em;
	padding: 0.2em 0.3em;
	width: 40.0em;
	height: 1.2em;
}