/* Site Layout Styles
 * Updated:  30 Apr 2008 @ 4.00pm
 * Author: Matthew Holmes <www.ivt.com.au>
 ---------------------------------------------*/

/* -- reset css [http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/] */
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, 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-size: inherit; 
	font-family: inherit; 
	vertical-align: baseline;
	list-style: none;
	}
	
	
	body {
		background: url(../webimage/bg-body.gif) top repeat-x;
		color: #666666;
		font: normal 62.5%/1.6 Tahoma, Arial, Helvetica, sans-serif;
		}
		
		
		/* -- links */
		a {
			color: #dc2a19;
			}
		a:hover {
			text-decoration: none;
			}
		a:focus {
			outline: none;
			}
		a img {
			border: 0;
			}

		
		/* -- structure
		---------------------------------------------*/
		#container {
			width: 1000px;
			margin: 0 auto;
			filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop src='/sb/styles/home/webimage/bg-container.png');
			}
		#container[id] {
			background: url(../webimage/bg-container.png) top no-repeat;
			}
			
			#wrapper {
				width: 943px;
				padding: 0 1px 6px 7px;
				margin: 0 auto;
				background: #fff;
				}
			
			/* using clearfix solution to reduce any html markup just apply class="clearfix" to any div you want. */
 			.clearfix:after {
 				display: block;
 				clear: both;
 				height: 0;
 				content: ".";
 				visibility: hidden;
 				}
 			* html .clearfix { /* ie hack it needs to use height: 1%, does not support the :after pseudoclass */
 				height: 1%;
 				}
 			*+ html .clearfix {
 				height: 1%;
 				}
			
			
			/* -- header [logo, navigation, search] */
			#header {
				position: relative;
				width: 950px;
				height: 107px;
				margin: 0 auto;
				}
				
				/* logo */
				#header h1 {
					padding: 21px 0 0 28px;
					}
					
				
				/* login details */
				div#login {
					position: absolute;
					top: 32px;
					right: 320px;
					}
				
				/* main navigation */
				ul#nav {
					position: absolute;
					bottom: 0;
					right: 6px;
					width: 555px;
					height: 42px;
				/*	background: url(../webimage/btn-nav2.gif) no-repeat;
				*/	}
				#nav li {
					float: left;
					margin: 0;
					padding: 0;
					height: 42px;	
					}
				#nav li a {
					float: left;
					display: block;
					height: 42px;
					text-indent: -999em;
					background: url(../webimage/btn-nav2.gif) no-repeat;
					}
					
				ul#nav ul { display: none; }

					/* default navigation */
					#nav li a.products { width: 86px; background-position: 0 0; }
					#nav li a.industry { width: 84px; background-position: -86px 0; }
					#nav li a.techpapers { width: 106px; background-position: -170px 0; }
					#nav li a.application { width: 101px; background-position: -275px 0; }
					#nav li a.rental { width: 71px; background-position: -376px 0; }
					#nav li a.calibration { width: 98px; background-position: -447px 0; }
					#nav li a.catalogues { width: 99px; background-position: -545px 0; }
					#nav li a.contactus { width: 95px; background-position: -644px 0; }
					
					/* hover navigation */
					#nav li a.products:hover { width: 86px; background-position: 0 -42px; }
					#nav li a.industry:hover { width: 84px; background-position: -86px -42px; }
					#nav li a.techpapers:hover { width: 106px; background-position: -170px -42px; }
					#nav li a.application:hover { width: 101px; background-position: -275px -42px; }
					#nav li a.rental:hover { width: 71px; background-position: -376px -42px; }
					#nav li a.calibration:hover { width: 98px; background-position: -447px -42px; }
					#nav li a.catalogues:hover { width: 99px; background-position: -545px -42px; }
					#nav li a.contactus:hover { width: 95px; background-position: -644px -42px; }

					
					
					
					
					
				/* search */
				form#search {
					position: absolute;
					top: 28px;
					right: 53px;
					width: 242px;
					}
				form#search input {
					width: 180px;
					padding: 2px;
					margin-right: 3px;
					border: 1px solid #ddd;
					}
				form#search button {
					width: 52px;
					height: 22px;
					border: 0;
					background: url(../webimage/btn-search.gif) no-repeat;
					text-indent: -999em;
					cursor: pointer;
					}
					
					
			/* -- banner */
			ul#banner {
				margin: 0 0 7px 0;				
				}
			ul#banner li {
				float: left;
				margin: 6px 5.5px 0 0;
				}	
				
			ul#banner li a.bannerLink { 
				width: 183px;
				height: 124px;
				overflow: hidden;
				display: block;
				text-indent: -999em;
				cursor: pointer;
				}
				
			ul#banner li a.bannerLink:hover {
				background-position: 0 -124px;
				}
				
				
				
			/* -- product [abc menu system] 
			#products {
				height: 40px;
				background: url(../webimage/bg-product-abc.gif) no-repeat;
				}
			#products ul {
				padding-left: 32px;
				}
			#products ul li {
				float: left;
				background: url(../webimage/bg-abc-divider.gif) right no-repeat;
				}
			#products ul li.start {
				display: block;
				padding: 8px 10px;
				font-size: 1.6em;
				}
			#products ul li.end {
				background: none;
				}
			#products ul li a {
				display: block;
				padding: 8px 10px;
				font-size: 1.6em;
				text-decoration: none;
				}
			#products ul li a:hover {
				text-decoration: underline;
				}*/
				
				
			/* -- main body [welcome, latest product, latest news, feature products] */
			#main_body {
				min-height: 300px;
				height: auto !important;
		  		height: 300px;
				margin: 6px 0 20px;
				background: url(../webimage/bg-main-body.gif) repeat-y;
				font-size: 1.1em;
				border-top: 2px solid #e1e1e1;
				}
				
				/* set column widths */
				div.col {
					float: left;
					width: 272px;
					padding: 0 20px;
					}
					
				/* welcome, latest product, latest news, feature products styles */
				div#welcome, div#latest_product, div#latest_news, div#feature_products {
					position: relative;
					padding: 15px 0;
					border-bottom: 1px solid #ccc;
					}
				div#welcome, div#latest_news, div#feature_products {
					border: 0;
					}
				div#welcome h2, div#latest_product h2, div#latest_news h2, div#feature_products h2 {
					margin: 0 0 10px;
					}
				div#feature_products h2 {
					margin: 0;
					}
				div#latest_news ul li {
					float: left;
					display: block;
					margin: 0;
					padding: 0 0 8px 22px;
					background: url(../webimage/icon-arrow.gif) 3px 6px no-repeat;
					}
				div#feature_products ul li {
					padding: 10px 0;
					border-bottom: 1px solid #ccc;
					}
				div#latest_product ul, div#latest_product ul li {
					margin: 0;
					padding: 0;
					}
				div#latest_product ul li h3, div#feature_products ul li h3 {
					font-size: 1.1em;
					}
					
				/* common elements */
				div#welcome p {
					margin: 0 0 8px;
					}
				p.blurb {
					font-size: 1.2em;
					font-style: italic;
					font-weight: bold;
					}
				p.more {
					margin: 0;
					padding: 10px 0 0;
					text-align: right;
					}
				a.rss {
					position: absolute;
					top: 17px;
					left: 102px;
					}
					
					
			/* -- contact details */
			#contact_details {
				padding: 20px 40px;
				border-top: 2px solid #ddd;
				font-size: 1.1em;
				}
				
				#contact_details ul {
					text-align: center;
					}
				#contact_details li {
					float: left;
					width: 33%;
					}
				#contact_details li.phone {
					font-size: 1.5em;
					font-weight: bold;
					}
					
					
			/* -- footer [developed by, copyright] */
			#footer {
				padding: 20px 0;
				background: #eee url(../webimage/bg-footer.gif) top no-repeat;
				font-size: 1.1em;
				}
			#footer a {
				color: #666666;
				}
				
				/* developed by */
				p#developed {
					float: right;
					padding: 0 20px;
					}
					
				/* copyright */
				p#copyright {
					float: left;
					padding: 0 20px;
					}
