/**
 * Client: SNF(UL) Limited
 * Author: Lee Turver (Microworld Yorkshire Ltd)
 * 
 */

body { 
	background: url('images/body_bg.gif') top left repeat-x;
	margin: 0;
	padding: 0;
	font-family: Arial, Tahoma, Verdana, Sans-seif;
	font-size: 0.8em;
	color: #666666;
	text-align: center;
}

/**
 * General Styles
 */
 h1 { color: #02297f; font-weight: normal; }
	h1 span { color: #e98917; }
 h2 { color: #02297f; font-weight: normal; }
 h2.dotted { color: #02297f; font-weight: normal; padding-bottom: 5px; background: url('images/dot.gif') bottom repeat-x; }
 h2.packagingHeading { color: #bc1915; font-weight: normal; padding-bottom: 5px; background: url('images/dot.gif') bottom repeat-x; }
 h3 { color: #e98917; font-weight: normal; font-size: 1.5em; }
 h3 span { color: #02297f; }
	h3 a { color: #e98917; text-decoration: none; }
 img { border: 0; }
 p { line-height: 1.5em; }
 .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
a.orange { font-weight: bold; color: #e98917; }
a.grey { font-weight: bold; color: #666; text-decoration: none; }
.border { border: 1px solid #ccc; }
img.gImg { border: 3px solid #ccc; }

 /**
  * Default Form Style
  */
form input.inputText { border: 2px solid #b7b4b5; padding: 4px; font-size: 0.85em; color: #666666; width: 210px; margin-bottom: 7px; }
form input.inputSubmit { background: #0d338a; color: #ffffff; font-size: 0.85em; border: 0; width: 85px; height: 25px; float: right; clear: both; }
form select.inputSelect { border: 2px solid #b7b4b5; padding: 4px; font-size: 0.85em; color: #666666; width: 220px; margin-bottom: 7px; }
 
 /**
  * Page Styles
  */
div#container { 
	width: 930px; 
	margin: 0 auto;
	text-align: left;
}

div#header {
	width: 100%;
	height: 125px;
}
	/* Sub Styles */
	div#header div#logo {
		width: 310px;
		height: 125px;
		background: url('images/snf_logo.png') top left no-repeat;
		float: left;
	}
	div#header div#logo h1 { margin: 0; padding: 0; }
	div#header div#logo h1 a {
		width: 310px;
		height: 125px;
		display: block;
		text-indent: -100000px;
		overflow: hidden;
	}
	
	div#header div#navigation_container {
		width: 610px;
		float: right;
	}
	
	div#header div#contact_info {
		width: 610px;
		height:40px;
		float: right;
		margin-top: 28px;
	}
		div#header div#contact_info p {
			text-align: right;
			color: #02297f;
			font-size: 0.9em;
		}
	
	div#navigation {
		padding-top: 60px;
		float: right;
	}
	
	div#navigation ul {
		list-style-type: none;
		margin: 0;
		padding: 0;
	}
	
	div#navigation ul li{
		list-style-type: none;
		margin: 0;
		padding: 0;
	}
	
	div#navigation ul li.headLink {
		float: left;
		position: relative;
		padding-bottom: 10px;
	}
	div#navigation li.headLink ul {
			width: 230px; 
			margin: 0; 
			padding: 0; 
			position: absolute; 
			top: 100%; 
			left: 0; 
			padding-bottom: 9px;
			background: url('images/dropdown_pane.png') 0 100% no-repeat;
			z-index: 100;
	}
	div#navigation div.bTop { width: 220px; margin: 0 auto; border-top: 1px solid #c5c5c5; height: 10px; }
	div#navigation li.headLink ul li:hover{
		background-color: #3a2d85;
		border: solid 1px #ddd;
	}
	div#navigation li.headLink ul li{
		padding: 3px 0 3px 10px;
	}
	div#navigation li.headLink ul li a {
		color: #666;
		font-size: 8pt;
	}
	div#navigation li.headLink ul li a:hover, div#navigation li.headLink ul li:hover a {
		font-weight: bold;
		color: #fff;
	}
	div#navigation li.headLink ul { display: none; }
	div#navigation li.headLink:hover ul { display: block; }
	
	div#navigation ul li.headLink a.link:hover {
		color: #3a2d85;
	}
	div#navigation ul li.headLink a.link {
		padding: 3px 25px 0px 25px;	
		font-size: 13.5pt;
		text-transform: lowercase;
	}
	div#navigation ul li.headLink a {
		display: block;
		text-decoration: none;
		height: 19px;
		margin-top: 4px;
		color: #333333;
	}
	div#navigation ul li.headLink a.noright {
		padding: 3px 0 0 25px;
	}
	
div#banner {
	width: 930px;
	height: 274px;
	position: relative;
	overflow: hidden;
}
	/* Sub Styles */
	#bannerContent {
		width: 930px;
		position: absolute;
		top: 0;
		margin-left: 0;
		list-style-type: none;
		margin: 0;
		padding: 0;
	}
	.bannerImage {
		float: left;
		position: relative;
		display: none;
	}

	.bannerImage span {
		position: absolute;
		font-size: 2.1em;
		font-family: Arial, Helvetica, Arial, Tahoma, Sans-Sarif;
		padding: 20px 20px 20px 0;
		text-align: right;
		width: 930px;
		background-color: #02297f;
		filter: alpha(opacity=80); /* here you can set the opacity of box with text */
		-moz-opacity: 0.8; /* here you can set the opacity of box with text */
		-khtml-opacity: 0.8; /* here you can set the opacity of box with text */
		opacity: 0.8; /* here you can set the opacity of box with text */
		color: #fff;
		display: none; /* important */
		bottom: 0;
		right: 0;
	}
	div#banner .clear {
		clear: both;
	} 

div#content_container {
	width: 100%;
	padding-top: 10px;
}
	/* Sub Styles */
	div#content_container div#left_col {
		width: 245px;
		border-top: 8px solid #02297f;
		float: left;
		padding-top: 15px;
	}
	div#content_container div#right_col {
		width: 665px;
		border-top: 8px solid #bababa;
		float: left;
		margin-left: 10px;
		padding-left: 10px;
	}
	div#content_container div#right_col ul li {
		padding-top: 5px;
		padding-bottom: 5px;
	}
	div#content_container div#right_col div.split-left {
		width: 320px; float: left; padding-right: 10px;
	}
	div#content_container div#right_col div.split-right {
		width: 320px; float: left;
	}
	div#content_container div#right_col div.split-left-small {
		width: 220px; float: left; padding-right: 10px;
	}
	div#content_container div#right_col div.split-right-big {
		width: 420px; float: left;
	}
		
ul#sub_nav {
	margin: 0;
	padding: 0 14px 0 10px;
	width: 220px;
	list-style-type: none;
	border-right: 1px solid #bababa;
}
	/* Sub Styles */
	ul#sub_nav li.headlink {
		background: url('images/dot.gif') bottom repeat-x;
		position: relative;
		cursor: pointer;
	}
	
	ul#sub_nav li.headlink a {
		display: block;
		padding: 8px 0 8px 12px;
		text-decoration: none;
		color: #666666;
		width: 200px;
	}
	ul#sub_nav li.headlink a.hasSub {
		background: url('images/nav_arrow.png') top right no-repeat;	
	}
	
	ul#sub_nav li.headlink ul {
		background: #e6e7e7;
		position: absolute;
		width: 170px;
		left: 180px;
		top: 0;
		z-index: 100;
		padding-left: 0px;
		display: none;
	}
	
	ul#sub_nav li.headlink ul li {
		list-style-type: none;
		margin-left: 0;
		padding-left: 0;
		background: url('images/dot.gif') bottom repeat-x;		
	}
	
	ul#sub_nav li.headlink ul li:hover {
		background: #ccc url('images/dot.gif') bottom repeat-x;
	}
	ul#sub_nav li.headlink ul li a:hover {
		font-weight: bold;
	}

	ul#sub_nav li.headlink ul li a {
		margin-left: 0;
		padding-left: 10px;
	}
	
	
div#callback {
	padding-top: 20px;
}
	/* Sub Styles */
	div#callback div#callback_content {
		background: #e1e1e1;
		padding: 5px 10px 15px 10px;
	}
	div#callback div#callback_content p {
		font-size: 0.85em;
	}
	
div#footer {
	width: 100%;
	float: left;
}
	/* Sub Styles */
	div#footer div#keywords {
		padding-top: 20px;
	}
	div#footer div#keywords p {
		text-align: center;
		font-size: 0.85em;
		color: #999999;
	}
	
	div#footer div#copyright {
		border-top: 3px solid #02297f;
	}
	div#footer div#copyright p {
		font-size: 0.9em;
		text-align: right;
	}

h3.our-people { padding-bottom: 0; margin-bottom: 0; }
ul.our-people {
	margin: 0;
	padding: 0;
	padding-left: 20px;
}
		ul.our-people li {
			list-style-type: none;
		}
		ul.our-people li a {
			color: #02297f;
			text-decoration: none;
		}
		
.staff-thumb { position: relative; z-index: 0; }
.staff-thumb:hover{ background-color: transparent; z-index: 50; }
.staff-thumb span{ 
	position: absolute;
	background-color: lightyellow;
	padding: 5px;
	left: -1000px;
	border: 1px dashed gray;
	visibility: hidden;
	color: black;
	text-decoration: none;
}
.staff-thumb span img{
	border-width: 0;
	padding: 2px;
}
.staff-thumb:hover span {
	visibility: visible;
	top: 0;
	left: 120px;
}

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

#contactus form{
  margin: 0;
  padding: 0;
  font-size: 100%;
  width: 100%;
}

#contactus input.submit-btn{
	width: 75px;
	height: 24px;
	background: #1C8540 url(images/submit.gif) no-repeat;
	outline: none;
	border: none;
}

#contactus input.submit-btn:hover{
	background: #1C8540 url(images/submit.gif) no-repeat 0 -26px;
}

#contactus form fieldset {
  clear: both;
  width: 400px;
  font-size: 100%;
  border-color: #d2d2d2;
  border-width: 1px;
  border-style: solid none none none;
  padding: 10px;
  margin: 0 0 0 0;
}

#contactus form fieldset legend {
  font-size: 150%;
  font-weight: normal;
  color: #ee9414;
  margin: 0 0 0 0;
  padding: 0 5px;
}

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

#contactus label {
  font-size: 100%;
}

#contactus input, select, textarea {
  font-family: Tahoma, Arial, sans-serif;
  font-size: 100%;
  color: #000000;
}

#contactus textarea {
  overflow: auto;
}

#contactus form div {
  clear: left;
  display: block;
  width: 90%;
  height: expression('1%');
  margin: 5px 0 0 0;
  padding: 1px 3px;
}

#contactus form div fieldset {
  clear: none;
  margin: 0 0 0 20%;
  padding: 0 5px 5px 5px;
  width: 90%;
}

#contactus form div.required label {
	font-weight: bold;
}

#contactus form div label {
  display: block;
  float: left;
  width: 70px;
  padding: 3px 15px;
  margin: 0 0 5px 0;
  text-align: left;
  color: #02297f;
}

#contactus form div label.labelCheckbox, form div label.labelRadio {
  float: none;
  display: block;
  width: 160px;
  height: expression('1%');
  padding: 0;
  margin: 0 0 5px 142px;
  text-align: left;
}

#contactus form div fieldset label.labelCheckbox, form div fieldset label.labelRadio {
  margin: 0 0 5px 0;
  width: 170px;
}

#contactus form div select, form div textarea {
  width: 230px;
  padding: 1px 3px;
  margin: 0 0 0 0;
}

#contactus form div input.inputText, form div input.inputPassword {
  width: 230px;
  padding: 4px 3px;
  margin: 0 0 0 0;
}

#contactus form div select.selectOne, form div select.selectMultiple {
  width: 240px;
  padding: 4px 3px;
}

#contactus form div input.inputCheckbox, form div input.inputRadio, input.inputCheckbox, input.inputRadio {
  display: inline;
  height: auto;
  width: auto;
  background-color: transparent;
  border-width: 0;
  padding: 0;
  margin: 0 0 0 140px;
}

#contactus form div input.inputCheckbox2 {
	display: inline;
	float: left;
	height: auto;
	width: auto;
	border: 0px;
	padding: 0;
	margin: 0 0 0 350px;	
}

#contactus p.news {
	float: left;
	margin: 0 0 0 10px;	
}

#contactus form div.submit div {
  display: inline;
  float: right;
  text-align: left;
  width: auto;
  padding: 0;
  margin: 0;
}

#contactus form div input.inputSubmit, form div input.inputButton, input.inputSubmit, input.inputButton {
  width: auto;
  padding: 0 6px;
  margin: 0;
}

#contactus form div.submit div input.inputSubmit, form div.submit div input.inputButton {
  float: right;
  margin: 0 0 0 5px;
}

#contactus form div small {
  display: block;
  margin: 0 0 5px 115px;
  padding: 1px 3px;
  font-size: 80%;
  height: expression('1%');
}

.packagingTable th { padding: 5px; background: #e5e5e5; border: 0; }
.packagingTable td { padding: 5px; }
.packagingTable th.noBG { background: #fff; }