/**********************************************************************************************

	Title: Website
	Author: XHTMLized
	Date: October 2007 

***********************************************************************************************

	1.  GENERAL
			1.1 Headings and paragraphs
			1.2 Forms
			1.3 Links
			1.4 Miscellaneous
		
	2. GENERAL ELEMEMENTS
	
	3. LAYOUT
			3.1 Accessibility menu
			3.2 Header
			3.3 Content
			3.4 Secondary content
			3.5 Sidebar
			3.6 Footer
		
	4. LAYOUT ELEMENTS

***********************************************************************************************/


/* 1. GENERAL
-----------------------------------------------------------------------------------------------
===============================================================================================*/	

/* Global reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd,q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }

body {
	line-height: 1;
}	
	
ol, ul {
	list-style: none; 
}
	
table {
	border-collapse: separate; 
	border-spacing: 0;  /* tables still need 'cellspacing="0"' in the markup */
}

caption, th, td {
	text-align: left; 
	font-weight: normal;
}

html{
	background: url(../images/body_bg.gif) repeat-y center;
}

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 62.5%; /* 1em = 10px \ 1.1em = 11px \ 1.2em = 12px */
	text-align: center;
	padding: 10px 0 0;
}
	body#homepage{
		background: url(../images/header_homepage_bg.png) no-repeat center top;	
	}
	body#innerpage{
		background: url(../images/header_innerpage_bg.png) no-repeat center top;	
	}

/* 1.1	Headings and paragraphs
-----------------------------------------------------------------------------------------------*/	

h1 {}

h2 {}

h3 {}

h4 {}

p  {}


/* 1.2	Forms
-----------------------------------------------------------------------------------------------*/	

input, textarea, select {
	font: 1.2em Verdana, Arial, Helvetica, sans-serif;
}


/* 1.3	Links
-----------------------------------------------------------------------------------------------*/	

a{
	color: #2B741D;
	text-decoration: underline;
}

a:visited {}

a:hover {
	color: #ff0000;
	text-decoration: none;
}

a:active {}


/* 1.4	Miscellaneous
-----------------------------------------------------------------------------------------------*/	

hr { 
	display: none; }
		
strong {
	font-weight: bold; }
		
em {
	font-style: italic; }
	
abbr, acronym {
	border-bottom: 1px dotted #999; 
	cursor: help;
}


/* 2. GENERAL ELEMENTS
-----------------------------------------------------------------------------------------------
===============================================================================================*/	

.hide {
	position: absolute;
	left: -9999px;
}

.clear {
	clear: both;
	font-size: 0;
	height: 0;
	line-height: 0;
	overflow: hidden;
}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {
	display: inline-block; }
	
/* Hides from IE-mac \*/ 
* html .clearfix {
	height: 1%; }

.clearfix {
	display: block; }
/* End hide from IE-mac */

img.border{
	border: 2px solid #ccc;
}
img.left{
	float: left;
	margin: 0 15px 10px 0;
}
img.right{
	float: right;
	margin: 0 0 10px 15px
}


/* 3. LAYOUT
-----------------------------------------------------------------------------------------------
===============================================================================================*/	

.container {
	width: 768px;
	position: relative;
	margin: 0 auto;
	text-align: left;
}

#header {
	position: relative;
	width: 768px;
	overflow: hidden;
	padding: 134px 0 0;
}
	#homepage #header {
		margin: 0 0 30px;
	}

/* Default - Two columns layout */

#content {
	float: left;
	width: 698px;
	padding: 0 35px 40px;
	line-height: 1.8em;
}
	#innerpage #content {
		padding: 0 35px 80px;
		background: url(../images/rounded_footer.gif) no-repeat center bottom;
	}

#footer {
	clear: both;
	text-align: center;
	border-top: 30px solid #000;
	padding: 15px 0 40px;
	font-size: 12px;
}
	


/* 3.1	Accessibility menu
-----------------------------------------------------------------------------------------------*/	

#accessibility-menu {
	position: absolute;
	left: -1000em;
	text-align: left;
}


/* 3.2	Header
-----------------------------------------------------------------------------------------------*/	

#header .logo{
	position: absolute;
	top: 15px;
	left: 41px;
}

/* Logo -> Image replacement. */
#header h1, #header h1 a, #header h1 a span {
	display: block;
	width: 173px;
	height: 116px;
	overflow: hidden;
}

#header h1 {
	position: absolute;
	top: 15px;
	left: 40px;
}

#header h1 a { /* style the text covered by image */ }

#header h1 a span {	
	position: absolute; 
	top: 0;
	left: 0;
	z-index: 10;
	background: url(../images/logo_rticryogenics.gif) no-repeat;
}

ul#menu{
	position: absolute;
	top: 86px;
	left: 306px;
}
	ul#menu li{
		float: left;
		padding-right: 25px;
	}
		ul#menu li a{
			display: block;
			height: 28px;
			position: relative;
			overflow: hidden;
		}
			ul#menu li a span{
				position: absolute;
				left: 0;
				top: 0;
				width: 100%;
				height: 100%;
				cursor: pointer;
			}
			ul#menu li a#m-home{
				width: 48px;
			}
				a#m-home span{
					background: url(../images/menu_home.gif) no-repeat top;
				}
			ul#menu li a#m-about-rti{
				width: 70px;
			}
				a#m-about-rti span{
					background: url(../images/menu_aboutrti.gif) no-repeat top;
				}
			ul#menu li a#m-the-system{
				width: 83px;
			}
				a#m-the-system span{
					background: url(../images/menu_thesystem.gif) no-repeat top;
				}
			ul#menu li a#m-find-out-more{
				width: 103px;
			}
				a#m-find-out-more span{
					background: url(../images/menu_findoutmore.gif) no-repeat top;
				}
			ul#menu li a:hover{
				background: none;
			}
				ul#menu li a:hover span{
					background-position: 0 -28px;
				}
			ul#menu li.active a span, ul#menu li.active a:hover span{
				background-position: 0 -56px;
			}
			
#header .splash{
	float: left;
	padding-left: 122px;
}
#header h2{
	position: absolute;
	color: #fff;
	font-size: 20px;
	line-height: 1.2em;
	font-family: Myriad, Arial, Helvetica, sans-serif;
	overflow: hidden;
}
	#homepage #header h2{
		left: 372px;
		top: 162px;
	}
	#innerpage #header h2{
		left: 309px;
		top: 137px;
	}
	#header h2.home{
		width: 367px;
		height: 42px;
	}
	#header h2.about{
		width: 391px;
		height: 41px;
	}
	#header h2 span{
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		top: 0;
	}
		#header h2.home span{
			background: url(../images/headline_homepage.gif) no-repeat;
		}
		#header h2.about span{
			background: url(../images/headline_about.gif) no-repeat;
		}
		
#header .overview{
	float: right;
	width: 305px;
	padding: 155px 35px 0 0;
	font-size: 12px;
	line-height: 1.3em;
}

#header .submenu{
	float: right;
	width: 232px;
	padding: 54px 87px 0 0;
	position: relative;
}
	#header .submenu .top{
		position: absolute;
		width: 232px;
		height: 15px;
		background: url(../images/submenu_top_bg.gif) no-repeat;
		left: 0;
		top: 54px;
	}
	#header .submenu ul{
		background: url(../images/submenu_bg.gif) no-repeat bottom;
		padding: 20px 0 30px;
		font-size: 12px;
	}
		#header .submenu ul li{
			display: block;
			width: 192px;
			padding: 0 15px 0 25px;
		}
			#header .submenu ul li a{
				display: block;
				color: #000;
				text-decoration: none;
				padding: 5px 0 5px 20px;
				width: 172px;
				line-height: 1.1em;
			}
			#header .submenu ul li a:hover, #header .submenu ul li.active a{
				font-weight: bold;
				color: #2b741d;
				background: url(../images/bullet_green.gif) no-repeat left;
			}



/* 3.3	Content
-----------------------------------------------------------------------------------------------*/	
#content .quicklinks{
	width: 698px;
	overflow: hidden;
	margin: 0 0 20px
}
	#content .quicklinks a{
		float: left;
		display: block;
		width: 178px;
		height: 103px;
		border: 1px solid #ccc;
		background: #fff;
		margin: 0 14px 15px;
		padding: 10px;
		color: #1e2c19;
		text-decoration: none;
		font-size: 18px;
		position: relative;
	}
		#content .quicklinks a span{
			position: absolute;
			left: 0;
			top: 0;
			width: 198px;
			height: 123px;
			cursor: pointer;
		}
			#content .quicklinks a.link-overview span{
				background: url(../images/overview.jpg) no-repeat;
			}
			#content .quicklinks a.link-the-specs span{
				background: url(../images/the_specs.jpg) no-repeat;
			}
			#content .quicklinks a.link-contact-rti span{
				background: url(../images/contact_rti.jpg) no-repeat;
			}
	#content .quicklinks a:hover{
		border-color: #000;
	}


#content h3{
	text-color: #1e2c19;
	font-size: 14px;
	border-bottom: 1px solid #1e2c19;
	padding: 0 0 .5em;
	margin: 2em 0 1em;
	font-weight: normal;
	clear: both;
	font-family: Arial, Helvetica, sans-serif;
}
	#content h3 strong{
		position: relative;
		display: block;
		height: 17px;
		overflow: hidden;
	}
		#content h3#a-brief-background strong{
			width: 147px;
		}
		#content h3#why-rti strong{
			width: 71px;
		}
		#content h3#how-it-works strong{
			width: 99px;
		}
		#content h3#value-added-technology strong{
			width: 194px;
		}
		#content h3#hands-on-training strong{
			width: 137px;
		}
		#content h3#market-analysis strong{
			width: 116px;
		}
		#content h3 strong span{
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
		}
			#content h3#a-brief-background strong span{
				background: url(../images/h3_a_brief_background.gif) no-repeat;
			}
			#content h3#why-rti strong span{
				background: url(../images/h3_why_rti.gif) no-repeat;
			}
			#content h3#how-it-works strong span{
				background: url(../images/h3_how_it_works.gif) no-repeat;
			}
			#content h3#value-added-technology strong span{
				background: url(../images/h3_value_added_technology.gif) no-repeat;
			}
			#content h3#hands-on-training strong span{
				background: url(../images/h3_hands_on_training.gif) no-repeat;
			}
			#content h3#market-analysis strong span{
				background: url(../images/h3_market_analysis.gif) no-repeat;
			}
			#content h3#contact-rti-directly strong span{
				background: url(../images/h3_contact_rti_directly.gif) no-repeat;
			}
			#content h3#find-out-more strong span{
				background: url(../images/h3_find_out_more.gif) no-repeat;
			}

#content p{
	margin: 0 0 1.3em;
	font-size: 1.2em;
}
#content ul{
	margin: 0 0 2em;
	font-size: 1.2em;
}
	#content ul li{
		padding: 0 0 0 15px;
		background: url(../images/bullet_black.gif) no-repeat left .4em;
		display: inline-table;
	}



/* 3.6	Footer
-----------------------------------------------------------------------------------------------*/	
#footer p{
	margin: 0 0 .5em;
}


/* 4. LAYOUT ELEMENTS
-----------------------------------------------------------------------------------------------
===============================================================================================*/