/*
Created on 11/04/2008
by Danny Hayfield
for West Midlands Media Ltd
*/
body {
	background-color: #2B388F;
	padding: 0;
	margin: 14px auto;
}
#container {
	width: 772px;
	padding: 0;
	margin: 0 auto;
	display: block;
	clear: both;
}
#wrap {
	background-image: url(../images/content-bg.jpg);
	background-position: 0% 0%;
	background-repeat: repeat-y;
	width: 772px;
	padding: 0;
	margin: 0 auto;
	display: block;
	clear: both;
}
#top {
	width: 772px;
	height: 352px;
	padding: 0;
	margin: 0 auto;
	display: block;
	clear: both;
}
#top #top-logo {
	background-image: url(../images/logo.png);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	width: 124px;
	height: 167px;
	padding: 0;
	margin: -8px 0 0 11px;
	display: block;
	position: absolute;
	z-index: 25;
}
* html #top #top-logo {
	behavior: expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
	this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",
	this.src = "../images/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
	this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')",
	this.runtimeStyle.backgroundImage = "none")),this.pngSet=true));
}
#top #top-banner {
	background-image: url(../images/top-banner.jpg);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	width: 772px;
	height: 126px;
	padding: 0;
	margin: 0 auto;
	display: block;
	clear: both;
	position: relative;
}
#top #top-banner #language-select {
	background-image: url(../images/language-select.png);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	width: 131px;
	height: 19px;
	padding: 0;
	margin: 0;
	display: block;
	position: absolute;
	top: 23px;
	right: 28px;
	z-index: 99;
	font-size: 0;
	line-height: 0;
}
#top #top-banner #language-select a.fr, #top #top-banner #language-select a.fr:hover  {
	width: 22px;
	height: 22px;
	padding: 0;
	margin: 0px 0 0 0px;
	display: block;
	position: absolute;
}
#top #top-banner #language-select a.es, #top #top-banner #language-select a.es:hover  {
	width: 22px;
	height: 22px;
	padding: 0;
	margin: 0px 0 0 28px;
	display: block;
	position: absolute;
}
#top #top-banner #language-select a.it, #top #top-banner #language-select a.it:hover  {
	width: 22px;
	height: 22px;
	padding: 0;
	margin: 0px 0 0 55px;
	display: block;
	position: absolute;
}
#top #top-banner #language-select a.en, #top #top-banner #language-select a.en:hover  {
	width: 22px;
	height: 22px;
	padding: 0;
	margin: 0px 0 0 82px;
	display: block;
	position: absolute;
}
#top #top-banner #language-select a.de, #top #top-banner #language-select a.de:hover  {
	width: 22px;
	height: 22px;
	padding: 0;
	margin: 0px 0 0 110px;
	display: block;
	position: absolute;
}
#top #top-header {
	width: 742px;
	height: 224px;
	padding: 0;
	margin: 0 0 0 15px;
	display: block;
	clear: both;
}
#content {
	width: 742px;
	padding: 0;
	margin: 0 0 0 15px;
	display: block;
	clear: both;
}
#content #leftcolumn {
	width: 193px;
	padding: 0 0 12px 0;
	margin: 0;
	display: block;
	float: left;
}
#content #leftcolumn #navigation {
	width: 193px;
	padding: 0;
	margin: 0;
	display: block;
	clear: both;
}
#content #leftcolumn #navigation ul {
	width: 193px;
	padding: 0;
	margin: 0;
	display: block;
	clear: both;
}
#content #leftcolumn #navigation ul li {
	width: 193px;
	min-height: 34px;
	height: auto !important;
	height: 34px;
	padding: 0;
	margin: 0;
	display: block;
	clear: both;
	border-bottom: 1px #C0C0C0 dashed;
}
#content #leftcolumn #navigation ul li a {
	background-image: url(../images/nav-arrow-off.jpg);
	background-position: 7px 9px;
	background-repeat: no-repeat;
	width: 165px;
	min-height: 25px;
	height: auto !important;
	height: 25px;
	padding: 11px 0 0 28px;
	margin: 0;
	display: block;
	clear: both;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	color: #4D4D4D;
	text-decoration: none;
}
#content #leftcolumn #navigation ul li a:hover {
	background-image: url(../images/nav-arrow.jpg);
	color: #444F9B;
}
#content #leftcolumn #enquire {
	background-image: url(../images/enquire.jpg);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	width: 157px;
	height: 27px;
	padding: 10px 0 0 35px;
	margin: 0 auto;
	margin-top: 16px;
	display: block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #fff;
	text-decoration: none;
}
#content #leftcolumn #enquire a, #content #leftcolumn #enquire a:hover {
	color: #fff;
	text-decoration: none;
}
#content #leftcolumn #createaccount {
	background-image: url(../images/createaccount.jpg);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	width: 157px;
	height: 27px;
	padding: 10px 0 0 35px;
	margin: 0 auto;
	margin-top: 8px;
	display: block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #fff;
	text-decoration: none;
}
#content #leftcolumn #createaccount a, #content #leftcolumn #createaccount a:hover {
	color: #fff;
	text-decoration: none;
}
#content #leftcolumn #enquire a, #content #leftcolumn #enquire a:hover, #content #leftcolumn #createaccount a, #content #leftcolumn #createaccount a:hover {
	width: 192px;
	height: 37px;
	display: block;
	padding: 0;
	margin: 0 auto;
	text-decoration: none;
}
#content #leftcolumn #company-login {
	width: 192px;
	padding: 0;
	margin: 0 auto;
	margin-top: 8px;
	display: block;
}
#content #leftcolumn #company-login #login-top {
	background-image: url(../images/login-top.jpg);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	width: 158px;
	height: 27px;
	padding: 10px 0 0 34px;
	margin: 0;
	display: block;
	clear: both;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #fff;
	text-decoration: none;
	cursor: default;
}
#content #leftcolumn #company-login #secure-top {
	background-image: url(../images/secure-top.jpg);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	width: 158px;
	height: 27px;
	padding: 10px 0 0 34px;
	margin: 0;
	display: block;
	clear: both;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #fff;
	text-decoration: none;
	cursor: default;
}
#content #leftcolumn #company-login #login-content {
	background-image: url(../images/login-content.jpg);
	background-position: 50% 50%;
	background-repeat: repeat-y;
	width: 180px;
	padding: 6px;
	margin: 0;
	display: block;
	clear: both;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	color: #4D4D4D;
	text-decoration: none;
	position: relative;
}
#content #leftcolumn #company-login #login-content div.percent100 {
	background: #E6E6E6;
	width: 110px;
	height: 50px;
	margin: 0;
	display: block;
	position: absolute;
	top: 20px;
	right: 14px;
	z-index: 100;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	color: #fff;
	text-decoration: none;
	text-align: left;
	text-shadow: 1px 1px 0 #000;
}
#content #leftcolumn #company-login #login-bottom {
	background-image: url(../images/login-bottom.jpg);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	width: 192px;
	height: 18px;
	padding: 0;
	margin: 0;
	font-size: 0;
	line-height: 0;
	display: block;
	clear: both;
}
form#company-login-form {
	width: 166px;
	padding: 0;
	margin: 0 auto;
	display: block;
	clear: both;
}
form#company-login-form input {
	width: 154px;
	padding: 2px 4px 2px 4px;
	margin: 0 auto;
	margin-bottom: 8px;
	display: block;
	clear: both;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	color: #4D4D4D;
	text-decoration: none;
	letter-spacing: 1px;
	background-color: #ffffff;
	border-top: 2px #B3B3B3 solid;
	border-left: 2px #B3B3B3 solid;
	border-right: 1px #F2F2F2 solid;
	border-bottom: 1px #F2F2F2 solid;
}
form#company-login-form input.submit {
	width: 50px;
	height: 20px;
	border-top: 1px #F9F9F9 solid;
	border-left: 1px #F9F9F9 solid;
	border-right: 1px #8C8C8C solid;
	border-bottom: 1px #8C8C8C solid;
	margin: 0;
	display: block;
	float: right;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: normal;
	color: #4D4D4D;
	text-decoration: none;
	text-align: center;
	text-transform: lowercase;
	letter-spacing: normal;
}
/*#content #leftcolumn #language-select {
	background-image: url(../images/language-select.jpg);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	width: 170px;
	height: 70px;
	padding: 0;
	margin: 0 auto;
	margin-top: 10px;
	display: block;
}*/
#content #leftcolumn #language-select a.fr, #content #leftcolumn #language-select a.fr:hover  {
	width: 22px;
	height: 22px;
	padding: 0;
	margin: 17px 0 0 18px;
	display: block;
	position: absolute;
}
#content #leftcolumn #language-select a.es, #content #leftcolumn #language-select a.es:hover  {
	width: 22px;
	height: 22px;
	padding: 0;
	margin: 17px 0 0 46px;
	display: block;
	position: absolute;
}
#content #leftcolumn #language-select a.it, #content #leftcolumn #language-select a.it:hover  {
	width: 22px;
	height: 22px;
	padding: 0;
	margin: 17px 0 0 73px;
	display: block;
	position: absolute;
}
#content #leftcolumn #language-select a.en, #content #leftcolumn #language-select a.en:hover  {
	width: 22px;
	height: 22px;
	padding: 0;
	margin: 17px 0 0 100px;
	display: block;
	position: absolute;
}
#content #leftcolumn #language-select a.de, #content #leftcolumn #language-select a.de:hover  {
	width: 22px;
	height: 22px;
	padding: 0;
	margin: 17px 0 0 128px;
	display: block;
	position: absolute;
}


#content #rightcolumn {
	width: 549px;
	padding: 0;
	margin: 0;
	display: block;
	float: left;
}
#content #rightcolumn #main {
	width: 513px; /* 549px without padding */
	padding: 8px 18px 8px 18px;
	margin: 0;
	display: block;
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: normal;
	color: #666666;
	text-decoration: none;
}
#content #rightcolumn #main #picture {
	background-image: url(../images/panels-header.jpg);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	width: 277px;
	height: 124px;
	padding: 15px 18px 0 228px;
	margin: 0 auto;
	margin-left: -6px;
	display: block;
	clear: both;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #656565;
	text-decoration: none;
	text-transform: uppercase;
	text-align: justify;
}
#content #rightcolumn #main p {
	padding: 0 14px 0 0;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: normal;
	color: #666666;
	text-decoration: none;
}
#content #rightcolumn #main #panels-block {
	background-image: url(../images/panels-block.jpg);
	background-position: top left;
	background-repeat: no-repeat;
	width: 512px;
	height: 266px;
	padding: 0;
	margin: 24px 0 0 0;
	display: block;
	clear: both;
}
#content #rightcolumn #main #panels-block .panel {
	width: 121px;
	height: 260px;
	padding: 0;
	display: block;
	position: absolute;
}
a.panel, a.panel:hover {
	width: 121px;
	height: 260px;
	padding: 0;
	display: block;
	text-decoration: none;
}
#content #rightcolumn #main #panels-block .steel {
	background-image: url(../images/panels-block-1.jpg);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	margin: 3px 0 0 8px;
}
#content #rightcolumn #main #panels-block .alumin {
	background-image: url(../images/panels-block-2.jpg);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	margin: 3px 0 0 134px;
}
#content #rightcolumn #main #panels-block .special {
	background-image: url(../images/panels-block-3.jpg);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	margin: 3px 0 0 258px;
}
#content #rightcolumn #main #panels-block .surface {
	background-image: url(../images/panels-block-4.jpg);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	margin: 3px 0 0 382px;
}
#content #rightcolumn #main #panels-block .text {
	width: 82px;
	height: 40px;
	padding: 0;
	margin: 192px 0 0 29px;
	display: block;
	position: absolute;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #999999;
	text-decoration: none;
	cursor: pointer;
	letter-spacing: -1px;
}



#footer {
	background-image: url(../images/footer.jpg);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	width: 772px;
	height: 80px;
	padding: 0;
	margin: 0 auto;
	display: block;
	clear: both;
}
#footer #links {
	width: 411px;
	height: 36px;
	padding: 0;
	margin: 11px 0 0 340px;
	display: block;
	position: absolute;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #ffffff;
	text-decoration: none;
	word-spacing: 4px;
}
#footer #links a, #footer #links a:hover {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #ffffff;
	text-decoration: none;
	word-spacing: normal;
}

/* product listing table styles */
.prod_title {
	background-image: url(../images/prod_title.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	min-height: 39px;
	height: auto !important;
	height: 39px;
	padding: 0;
	margin: 0 0 5px 0;
	vertical-align: middle;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: bold;
	color: #fff;
	line-height: 10px;
	vertical-align: middle;
}
.prod_title_left {
	background-image: url(../images/prod_title.jpg);
	background-position: top left;
	background-repeat: no-repeat;
	height: 39px;
	width: 10px;
	padding: 0;
	margin: 0;
	vertical-align: middle;
}
.prod_title_right {
	background-image: url(../images/prod_title.jpg);
	background-position: top right;
	background-repeat: no-repeat;
	height: 39px;
	width: 10px;
	padding: 0;
	margin: 0;
	vertical-align: middle;
}
.prod_row_grey {
	background-image: url(../images/prod_row.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	height: 25px;
	width: 498px;
	padding: 0;
	margin: 0;
	vertical-align: middle;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
}
.prod_row_grey_left {
	background-image: url(../images/prod_row.jpg);
	background-position: top left;
	background-repeat: no-repeat;
	height: 25px;
	width: 22px;
	padding: 0;
	margin: 0;
	vertical-align: middle;
}
.prod_row_grey_right {
	background-image: url(../images/prod_row.jpg);
	background-position: top right;
	background-repeat: no-repeat;
	height: 25px;
	width: 12px;
	padding: 0;
	margin: 0;
	vertical-align: middle;
}
.prod_row_white {
	background-color: #ffffff;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	height: 25px;
	width: 498px;
	padding: 0;
	margin: 0;
	vertical-align: middle;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
}
.prod_row_white input,  .prod_row_grey input {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	padding: 1px;
	margin: 0;
	width: 20px;
}
.special_hidden {
	background-color: #FFFFFF;
	width: 460px;
	height: 19px;
	padding: 3px;
	margin: 0 auto;
	display: block;
	clear: both;
	border: 0;
	font-size: 16px;
	color: #2B388F;
	overflow: hidden;
}
.special_normal {
	background-color: #ffffff;
	width: 460px;
	height: 70px;
	padding: 3px;
	margin: 0 auto;
	display: block;
	clear: both;
	border: 0;
	font-size: 12px;
	overflow: hidden;
}
.special_success {
	background-color: #FFFFFF;
	border: 1px #2B388F solid;
	width: 470px;
	padding: 10px;
	margin: 0 0 20px 0;
	display: block;
	clear: both;
	font-size: 10px;
	color: #000000;
}

/* various elements and styles */
h1 {
	font-family: "Georgia", Arial, Helvetica, san-serif;
	font-size: 22px;
	font-weight: bolder;
	color: #2B388F;
	text-decoration: none;
	width: 500px;
	padding: 20px 0 12px 0;
	margin: 0 auto;
	clear: both;
	text-align: center;
	text-transform: uppercase;
}
h3 {
	font-family: "Georgia", Arial, Helvetica, san-serif;
	font-size: 17px;
	font-weight: bolder;
	color: #2B388F;
	text-decoration: none;
	width: 500px;
	padding: 10px 0 5px 0;
	margin: 0 auto;
	clear: both;
	text-align: center;
	text-transform: uppercase;
}
p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: normal;
	color: #666666;
	text-decoration: none;
}
.clear {
	width: 0;
	height: 0;
	padding: 0;
	margin: 0;
	font-size: 0;
	line-height: 0;
	clear: both;
}
div.error {
	background-color: #FFFFFF;
	width: 470px;
	padding: 10px;
	margin: 0 0 10px 0;
	display: block;
	clear: both;
	font-size: 16px;
	color: #003399;
}
div.success {
	background-color: #FFF9D7;
	border: 1px #E2C822 solid;
	width: 470px;
	padding: 10px;
	margin: 0 0 20px 0;
	display: block;
	clear: both;
	font-size: 10px;
	color: #000000;
}
div#updating {
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: normal;
	color: #000000;
}
span.req {
	font-weight: bold;
	color: #f00;
}

/* generic form styles */
/*input, textarea {
	width: 154px;
	padding: 2px 4px 2px 4px;
	margin: 0 auto;
	margin-bottom: 8px;
	display: block;
	clear: both;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	color: #4D4D4D;
	text-decoration: none;
	letter-spacing: 1px;
	background-color: #ffffff;
	border-top: 2px #B3B3B3 solid;
	border-left: 2px #B3B3B3 solid;
	border-right: 1px #F2F2F2 solid;
	border-bottom: 1px #F2F2F2 solid;
}*/
input.submit {
	width: 100px;
	height: 30px;
	border-top: 2px #CCCCCC solid;
	border-left: 2px #CCCCCC solid;
	border-right: 2px #CCCCCC solid;
	border-bottom: 2px #CCCCCC solid;
	margin: 0;
	display: block;
	float: right;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #FFFFFF;
	background: #c00113;
	text-decoration: none;
	text-align: center;
	text-transform: lowercase;
	letter-spacing: normal;
}
input[type="hidden"] {
	width: 0;
	height: 0;
	border: 0;
}
/* older styles */
form {
	padding: 0;
	margin: 0;
}
input, textarea {
	padding: 1px;
	margin: 0 0 2px 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	color: #4D4D4D;
	text-decoration: none;
}
select, option {
	padding: 0;
	margin: 0 0 2px 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	color: #4D4D4D;
	text-decoration: none;
	width: auto;
}
input.button {
	background-color: #ffffff;
	padding: 3px;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	color: #4D4D4D;
	text-decoration: none;
	text-align: center;
	border: 1px #eee solid;
	cursor: pointer;
}

/* web design linkback */
div.webdesign {
	width: 772px;
	height: 16px;
	padding: 0;
	margin: 0 auto;
	margin-top: 8px;
	display: block;
	clear: both;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	color: #000000;
	text-decoration: none;
	text-align: center;
}
div.webdesign a, div.webdesign a:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	color: #000000;
	text-decoration: none;
	text-align: center;
}
