/* General Styles for new LabLogic site - February/March 2007 - CP 
==============================================================================*/

/* defaults, globals, and miscellaneous
==============================================================================*/

*, span { /* removes defaults from all elements */
	margin: 0;
	padding: 0;
	}
body {
	margin: 0 auto;
	font-family: verdana, san-serif;
	font-size: 12px;
	text-align: center;
	color: #000000;
	height: 100%;
	background: #ffffff url(../images/style/back_02.gif) top repeat-x;
}
img {
	border: 0; /* removes border in case images get have anchor around them */
	padding: 0;
	margin: 0;
	}
	
hr {
	display: none;
	}

#renderprint {
	width: 600px;
	}
a {
	text-decoration: none;
	color: #1e508d;
	}
a:hover {
	text-decoration: none;
	color: #6d8db5;
	}
.clear {
	clear: both;
	}
p { 
	font-size: 100%;
	text-align: left;
	padding: 12px 0 0 0;
	margin: 0;
	font-family: verdana;
	}
ul { 
	margin: 0; 
	padding: 0; 
	list-style: none;
	}
li  { 
	font-size: 100%; 
	background: none; 
	margin: 0; 
	padding: 9px 0 0 0; 
	}
	li p {
		padding: 0;
		margin: 0;
		}
h2, .Heading {
	color: #ffffff;
	height: 30px;
	width: 378px;
	line-height: 30px;
	font-size: 140%;
	padding: 4px 0 0 0;
	margin: 0;
	background: url('../images/style/header_big.gif') bottom center no-repeat;
	text-indent: 8px;
	font-weight: 100;
	}
	
h2.tile01, h2.cfr, h2.tile03, h2.tile04, h2.tile05, h2.tile06, h2.tile07, h2.tile08, h2.tile09, 
h2.laura, h2.debra, h2.cfc, h2.stacy, h2.trace, h2.sara, h2.seescan, h2.jane {
	color: #ffffff;
	height: 103px;
	width: 378px;
	font-size: 140%;
	padding: 6px 0 0 0;
	margin: 0;
	text-indent: 8px;
	font-weight: 100;
	}
	
	.tile01 {background: url('../images/style/tile_01.gif') center no-repeat;}
	.tile03 {background: url('../images/style/tile_03.gif') center no-repeat;}
	.tile04 {background: url('../images/style/tile_04.gif') center no-repeat;}
	.tile05 {background: url('../images/style/tile_05.gif') center no-repeat;}
	.tile06 {background: url('../images/style/tile_06.gif') center no-repeat;}
	.tile07 {background: url('../images/style/tile_07.gif') center no-repeat;}
	.tile08 {background: url('../images/style/tile_08.gif') center no-repeat;}
	.tile09 {background: url('../images/style/tile_09.gif') center no-repeat;}
	
	.laura {background: url('../images/style/tile_laura.gif') center no-repeat;}
	.debra {background: url('../images/style/tile_debra.gif') center no-repeat;}
	.cfr {background: url('../images/style/tile_cfr.gif') center no-repeat;}
	.stacy {background: url('../images/style/tile_stacy.gif') center no-repeat;}
	.trace {background: url('../images/style/tile_trace.gif') center no-repeat;}
	.sara {background: url('../images/style/tile_sara.gif') center no-repeat;}
	.seescan {background: url('../images/style/tile_seescan.gif') center no-repeat;}
	.jane {background: url('../images/style/tile_jane.gif') center no-repeat;}
	
h2.tile_full01, h2.tile_full02, h2.tile_full03, h2.tile_full04, h2.tile_full05, 
h2.tile_full06, h2.tile_full07, h2.tile_full08 {
	color: #ffffff;
	height: 50px;
	width: 756px;
	font-size: 140%;
	padding: 6px 0 0 0;
	margin: 0 auto;
	text-indent: 8px;
	font-weight: 100;
	}
	
	.tile_full01 {background: url('../images/style/tile_full_01.gif') center no-repeat;}
	.tile_full02 {background: url('../images/style/tile_full_02.gif') center no-repeat;}
	.tile_full03 {background: url('../images/style/tile_full_03.gif') center no-repeat;}
	.tile_full04 {background: url('../images/style/tile_full_04.gif') center no-repeat;}
	.tile_full05 {background: url('../images/style/tile_full_05.gif') center no-repeat;}
	.tile_full06 {background: url('../images/style/tile_full_06.gif') center no-repeat;}
	.tile_full07 {background: url('../images/style/tile_full_07.gif') center no-repeat;}
	.tile_full08 {background: url('../images/style/tile_full_08.gif') center no-repeat;}

	
h3, .SubHeading {
	font-size: 130%;
	padding: 12px 0 2px 0;
	margin: 0;
	font-weight: 100;
	border-bottom: 1px solid #c6d0dd; 
	}
	
.quote {
	text-align: center;
	font-size: 130%;
	padding: 12px 0 2px 0;
	margin: 0;
	font-weight: bold;
	}
	
	.quote img {
		border: 1px solid #d8d8d8;
		}
	
.listingbreak {
	text-indent: -5000px;
	height: 1px;
	padding: 12px 0 2px 0;
	margin: 0 5px;
	border-bottom: 1px solid #c6d0dd; 
	}

.clear {clear: both;}

#maincontent img.icon, img.icon {
	padding: 0 5px 0 0;
	margin: 0;
	border: none;
	float: left;
	}
	
a.button {
	display: block;
	overflow: hidden;
	width: 117px;
	height: 26px;
	margin: 0;
	padding: 0;
	line-height: 26px;
	font-size: 92%;
	text-indent: 8px;
	text-align: left;
	background: url('../images/style/button_02.gif') no-repeat;
	color: #ffffff;
	clear: both;
	}

	a.button:hover {
		background-position: -117px 0;
		color: #ffffff;
		}

a.cart {
	display: block;
	overflow: hidden;
	width: 117px;
	height: 46px;
	margin: 0;
	padding: 0;
	text-indent: -5000px;
	background: url('../images/style/shopping_cart.gif') left top no-repeat;
	}

	a.cart:hover {
		background-position: -117px 0;
		color: #ffffff;
		}
		
.cons_search {
	float: right;
	width: 500px;
	text-align: right;
	margin-top: 17px;
	}

/* Header of page
==============================================================================*/

#wrap {
	width: 966px;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	}
#header {
	margin: 0 auto;
	position: relative;
	width: 966px;
	height: 140px;
	background: url('../images/style/layout_01.gif') center no-repeat;
	}
	
	#header h1 {
		position: absolute;
		height: 75px;
		width: 200px;
		text-indent: -5000px;
		left: 79px;
		top: 50px;
		background: url('../images/logos/logo.jpg') right bottom no-repeat;
		}

	#header h1 a {
		display: block;
		overflow: hidden;
		height: 75px;
		width: 200px;
		background: url('../images/logos/logo.jpg') right bottom no-repeat;
		}



/* System Navigation
==============================================================================*/

#system {
	position: absolute;
	right: 17px; 
	padding: 0;
	margin: 0;
	width: 350px;
	height: 50px;
	font-size: 92%;
	color: #205190;
	font-family: verdana, san-serif;
	}

	#system p {
		text-align: right;
		line-height: 20px;
		color: #205190;
		}
		
	#system a {
		padding: 0 10px;
		}



/* Search Function
==============================================================================*/

#search {
	position: absolute;
	margin: 0;
	padding: 0;
	top: 3px;
	left: 393px;
	width: 200px;
	height: 41px;
	background: url('../images/nav/search_01.gif') center left no-repeat;
	}	
	
#search form {
	}
		
#search input {
	background: none;
	border: 0px solid blue;
	height: 20px;
	width: 135px;
	color: #000000;
	font-size: 80%;
	}
		
#search label {
	display: none;
	}
	
#search .inputbutton {
	float: left;
	padding: 9px 0 0 36px;
	margin: 0;
	}

#search .gobutton {
	float: right;
	padding: 0;
	}

#search .gobutton input {
	display: block;
	overflow: hidden;
	background: url('../images/nav/search_03.gif');
	height: 41px;
	width: 26px;
	text-indent: -5000px;
	line-height: 500px;
	}

/* Main Navigation
==============================================================================*/

#nav, #nav2, #nav3, #nav4 {
	position: absolute;
	top: 57px;
	margin: 0;
	padding: 0;
	width: 135px;
	height: 83px;
	background: url('../images/style/nav_back.gif') center left no-repeat;
	font-family: verdana, san-serif;
	font-size: 92%;
	text-align: center;
	text-indent: 8px;
	}
	
#nav {
	left: 395px;
	}
	
#nav2 {
	left: 540px;
	}
	
#nav3 {
	left: 685px;
	}
	
#nav4 {
	left: 830px;
	}

	#nav li, #nav2 li, #nav3 li, #nav4 li {
		width: 121px;
		height: 26px;
		margin: 0 auto;
		padding: 0;
		background: none;
		text-align: left;
		}
		
	#nav a, #nav2 a, #nav3 a, #nav4 a {
		position: absolute;
		height: 26px;
		width: 121px;
		display: block;
		overflow: hidden;
		color: white;
		line-height: 26px;
		}
		
		#nav a:hover, #nav2 a:hover, #nav3 a:hover, #nav4 a:hover, nav .active {
			background-position: 0 0;
			}
			
			.nav01 {background: url('../images/nav/nav_top.gif') right no-repeat; top: 7px; left: 7px;}
			.nav02 {background: url('../images/nav/nav_bottom.gif') right no-repeat; top: 36px; left: 7px;}


/* Breadcrumb setup
==============================================================================*/	

#breadcrumb {
	text-align: left;
	height: 44px;
	width: 966px;
	margin: 0 auto;
	padding-left: 0;
	text-indent: 13px;
	background: url('../images/style/breadcrumb.gif') center top no-repeat;
	}
	
	#breadcrumb a, #breadcrumb p{
		line-height: 44px;
		padding-top: 0;
		padding-bottom: 0;
		}
		
	#breadcrumb a {
		font-weight: bold;
		}
		
		#breadcrumb a:hover {
			font-weight: bold;
			}



/* Main Content Layout
==============================================================================*/


#main {
	width: 966px;
	clear: both;
	margin: 0 auto;
	text-align: center;
	}
		
#welcome {
	height: 145px;
	width: 772px;
	/*background: white url('../images/style/welcome.jpg') no-repeat;*/
	margin-bottom: 7px;
	color: #ffffff;
	}		
	
#maincontent {
	text-align: left;
	margin: 0 auto;
	width: 772px;
	padding: 0;
	float: left;
	}
	
	#maincontent h3 {
		margin-left: 5px;
		margin-right: 5px;
		}

	#maincontent p, ul {
		padding-left: 5px;
		padding-right: 5px;
		}
		
	#maincontent ul, #rightside ul {
		list-style: none;
		padding-bottom: 12px;
		}
		
	#maincontent li, #rightside li {
		margin: 0;
		background: none;
		border-bottom: 1px solid #c6d0dd;
		}

		#maincontent li a, #rightside li a {
			font-weight: bold;
			}
		
		#maincontent li p, #rightside li p {
			padding-left: 0;
			padding-right: 0;
			}
	
	#maincontent .links {
		text-align: center;
		width: 100%;
		height: auto;
		}
	
	#maincontent .links ul {
		list-style: none;
		margin: 10px auto;
		width: 630px;
		}
		
		#maincontent .links ul li {
			display: block;
			float: left;
			width: 200px;
			height: 100px;
			padding: 0;
			margin: 0 5px;
			line-height: 100px;
			border: none;
			text-align: center;
			}
	
	#maincontent ul.features {
		list-style-image: url('../images/style/bullet_02.gif');
		margin-left: 12px;
		}
		
		#maincontent ul.features li {
			border-bottom: none;
			padding: 0;
			margin: 9px 0 0 0;
			}
		
	#maincontent ul.indentfeatures {
		margin-left: 12px;
		}
		
		#maincontent ul.indentfeatures li {
			border-bottom: none;
			padding: 0;
			margin: 9px 0 0 0;
			}

	#maincontent ul.news {
		margin: 0;
		padding-left: 5px;
		padding-right: 5px;
		}
			
		#maincontent ul.news li {
			border-bottom: 0px solid #c6d0dd;
			}
				
			#maincontent ul.news li a {
				font-weight: normal;
				}
			
	#maincontent form {
		padding: 5px 0 0 5px;
		color: #1e508d;
		}

		#maincontent form input {
			background: #e6d8bb;
			margin: 4px 0 0 10px;
			padding: 0;
			border: 1px gray;
			height: 16px;
			width: 150px;
			color: #000000;
			font-size: 80%;
			line-height: 15px;
			}
			
			#maincontent form input.radio {
				background-color: transparent;
				border: 0px; 
				}
			
		/* Use for form items such as dropdown lists.  The height and line-height have been increased slightly as this sort of control
		   doesn't align properly with text fields. */
		#maincontent form select {
			background: #e6d8bb;
			margin: 4px 0 0 10px;
			padding: 0;
			border: 1px gray;
			height: 19px;
			width: 150px;
			color: #000000;
			font-size: 80%;
			line-height: 18px;
			}
		
		#maincontent form .zoom_match input {
			background: none;
			margin: 0 10px;
			padding: 0;
			border: 0px solid blue;
			height: auto;
			width: auto;
			color: #000000;
			font-size: 100%;
			line-height: 0pt;
			}
			
		#maincontent form td input {
			font-size: 90%;
			width: auto;
			}
			
			#maincontent form input.submit, #maincontent form input.reset, #rightside .longbox form input.submit,
			#maincontent .smallbox form input.submit {
				background: url('../images/style/button_02.gif') left top;
				border: 0px solid #000000;
				height: 26px;
				width: 117px;		
				color: #ffffff;	
				margin: 0 10px 0 0;
				}
				
			#rightside .longbox form input.submit {
				margin: 0;
				}
			
		#maincontent form label {
			clear: both;
			display: block;
			width: 200px;
			font-size: 92%;
			margin: 4px 0 0 0;
			float: left;
			}
			
	#maincontent .productimage img {
		margin: 0 10px 10px 10px;
		float: right;
		background: none;
		}


/* Content boxes for maincontent
==============================================================================*/

.fullbox, .fullboxfullfade {
	width: 764px;
	clear: both;
	margin-bottom: 10px;
	background: white url('../images/style/bigbox_03.gif') top center no-repeat;
	}
	
.fullboxfullfade {
	height: 300px;
	}

.bigbox, .bigboxfullfade {
	width: 378px;
	clear: both;
	margin-bottom: 10px;
	background: white url('../images/style/bigbox_02.gif') top center no-repeat;
	}

.bigboxfullfade {
	height: 300px;
	}
		
.bigboxshort, .bigboxshortfloat, .bigboxshorterfloat, .consumablebox, .consumablecat {
	width: 378px;
	height: 150px;
	margin-bottom: 5px;
	background: white url('../images/style/bigbox_01.gif') top center no-repeat;
	}
	
.bigboxshortfloat, .bigboxshorterfloat, .consumablebox, .consumablecat{
	float: left;
	border-right: 8px solid #ffffff;
	}
	
.bigboxshorterfloat {
	height: 100px;
	}
	
.consumablebox {
	height: 80px;
	}
.consumablecat {
	height: 260px;
	}
	
	.bigboxshortfloat p, .consumablebox p, .consumablecat p{
		padding-top: 5px;
		}
	
.bigboxshort {
	clear: both;
	}
	
.smallbox, .smallboxlong {
	width: 185px;
	margin-bottom: 5px;
	background: white url('../images/style/smallbox_01.gif') top center no-repeat;
	}
	
.smallbox {
	height: 150px;
	}
	
	.smallbox h2, .smallboxlong h2 {
		width: 185px;
		background: url('../images/style/header_small.gif') bottom center no-repeat;
		} 
		
	.smallbox img, .bigboxshort img, .smallboxlong img, .longbox img {
		float: right;
		margin-right: 2px;
		margin-top: 14px;
		margin-bottom: 0;
		}
		
	.longbox img {
		margin-right: 5px;
		margin-bottom: 0;
		}
		
	.smallbox form, .smallboxlong form, .longbox form {
		padding: 5px 0 0 5px;
		color: #1e508d;
		}
		
	.longbox form {
		padding-left: 10px;
		}
		
	form.centre {
		padding-left: 0;
		}

		#maincontent .smallbox form input, #maincontent .smallboxlong form input, #maincontent .longbox form input, #rightside .longbox form input {
			background: #e6d8bb;
			margin: 4px 0 0 0;
			padding: 0;
			border: 0px solid blue;
			height: 16px;
			width: 114px;
			color: #000000;
			font-size: 80%;
			line-height: 15px;
			}
			
		#maincontent .smallbox form label, #maincontent .smallboxlong form label, #maincontent .longbox form label, #rightside .longbox form label {
			font-size: 92%;
			margin: 4px 0 0 0;
			clear: none;
			display: inline;
			width: auto;
			float: none;
			}
			
	#maincontent .smallbox a.button, #maincontent .smallboxlong a.button, #maincontent .longbox a.button, #rightside .longbox a.button {
		clear: both;
		}
		
		
/* Left and Right split columns within maincontent
==============================================================================*/

#contentfull {
	width: 772px;
	border-left: 3px solid #ffffff;
	background: none;
	}

#contentleft, #contentright {
	background: none;
	width: 378px;
	}
	
#contentleft {
	float: left;
	border-left: 3px solid #ffffff;
	}

#contentright {
	float: right;
	border-right: 3px solid #ffffff;
	}

	#right, #left {
		width: 185px;
		background: none;
		}
		
	#left {
		float: left;
		}
		
	#right {
		float: right;
		}

	
/* Rightside Boxes and Styles
==============================================================================*/

#rightside {
	width: 191px;
	float: right;
	margin: 0;
	padding: 0;
	text-align: left;
	background: none;
	}
	
	#rightside h2 {
		text-align: center;
		}
	
	/* Fixed dimensions boxes with surrounding border, mainly used on homepage */
	#rightside .smallbox {
		width: 191px;
		height: 151px;
		margin-bottom: 4px;
		background: white url('../images/style/smallbox_02.gif') top center no-repeat;
		}
		
	/* Flexible height boxes, used to display lists etc down right-hand side (i.e. variable content) */
	#rightside .longbox {
		width: 191px;
		margin-bottom: 4px;
		background: white url('../images/style/smallbox_04.gif') top center no-repeat;
		}
		
		#rightside .smallbox h2, #rightside .adbox h2 {
			width: 191px;
			padding-top: 8px;
			background: url('../images/style/header_right.gif') bottom center no-repeat;
			text-align: center;
			text-indent: 0;
			}
			
		#rightside .longbox h2 {
			width: 191px;
			background: url('../images/style/header_small_red.gif') bottom center no-repeat;
			text-align: center;
			text-indent: 0;
			}
			
		/* Makes sure icons and small images are held in the correct place in both types of right-sided
		   boxes, and also in any boxes used within the maincontent of the page */
		#rightside .smallbox .imagebox, #rightside .longbox .imagebox, #maincontent .imagebox, #maincontent .instrumentimage {
			width: 85px;
			height: 85px;
			float: right;
			text-align: right;
			clear: both;
			margin-bottom: 0;
			}
			
			#maincontent .instrumentimage {
				width: 110px;
				height: 110px;
				}
			
			#rightside .smallbox .imagebox a, #rightside .longbox .imagebox a, #maincontent .imagebox a, #maincontent .instrumentimage a{
				display: block;
				overflow: hidden;
				margin-top: 8px;
				margin-right: 8px;
				margin-bottom: 0
				}
				
			#rightside .smallbox .imagebox img, #rightside .longbox .imagebox img, #maincontent .imagebox img, #maincontent .instrumentimage img{
				padding: 0;
				margin: 0;
				border: 1px solid #d8d8d8;
				}
				
		
	
		
	/* Fixed dimensions white box with border for adverts */
	#rightside .adbox {
		width: 191px;
		height: 120px;
		margin-bottom: 4px;
		background: #ffffff url('../images/style/smallbox_03.gif') top center no-repeat;
		}
		
		#rightside .adbox p {
			text-align: center;
			color: #336699;
			padding-top: 0;
			margin-top: 0;
			}
		
	/* General styles for right-sided text */
	#rightside p, ul {
		padding-left: 8px;
		padding-right: 8px;
		font-family: Arial, san-serif;
		}
		

/* Consumables tables
==============================================================================*/

.consumables {
	font-size: 92%;
	clear: both;
	text-align: center;
	margin-top: 20px;
	}
	
	.consumables table {
		margin: 0 auto;
		width: 90%;
		font-family: Arial, san-serif;
		}
		
		.consumables table tr {
			height: 25px;
			color: #1e508d;
			font-weight: normal;
			}
			
		.consumables table tr.head {
			color: #ffffff;
			background: #1e508d;
			font-weight: bold;
			}
			
		.consumables table tr td.message {
			color: red;
			font-weight: bold;
			text-align: left;
			}

/* Laura interface tables
==============================================================================*/

.interfaces {
	font-size: 92%;
	clear: both;
	text-align: center;
	margin-top: 20px;
	}
	
	.interfaces table {
		margin: 0 auto;
		width: 90%;
		font-family: Arial, san-serif;
		}
		
		.interfaces table tr {
			height: 15px;
			color: #1e508d;
			font-weight: normal;
			}
			
		.interfaces table tr.head {
			color: #ffffff;
			background: #1e508d;
			font-weight: bold;
			}
			
		.interfaces table tr td.message {
			color: red;
			font-weight: bold;
			text-align: left;
			}


/* page footer
==============================================================================*/

#footer {
	clear: both;
	height: 70px;
	margin: 10px auto;
	background: url(../images/style/layout_03.gif) top repeat-x;
	color: #ffffff;
	text-align: center;
	font-size: 92%;
	}
	
	#foot_left {
		float: left;
		margin-left: 8px;
		}
		
	#foot_right {
		float: right;
		margin-right: 8px;
		}
		
	#footer p {
		margin-top: 15px;
		}
		
	#footer a {
		color: #ffffff;
		}
		
		#footer a:hover {
			color: #e6d8bb;
			}
			
/* Extreme Tracker
==============================================================================*/

#eXTReMe a {
	font-size: 72%;
	font-weight: normal;
	color: #939393;
	}
	
	#eXTReMe a:hover {
		color: #6d8db5;
		}