/*-----------------------------------------------------------------------------------------------------------------------------------------------------------
CSS for 	European Steel Sheets - Main Stylesheet
Author:		Alison Lee (alisonlee@silktide.com) / Silktide Ltd
Created:	04/08/2008
	
-------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* Global Styles
-------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* commented backslash hack \*/ html, body { height: 100%; } /* end hack */

body					{ background-color: #fff; font: 80% "trebuchet ms", verdana, arial, helvetica, sans-serif; text-align: center; color: #041952; padding: 0; margin: 0;}

h1						{ font: bold 1.6em "trebuchet ms", arial, verdana, helvetica, sans-serif; color: #c01229; border-bottom: 1px solid #F9BBC3; margin: 15px 0; }
h2						{ font: bold 1.2em "trebuchet ms", arial, verdana, helvetica, sans-serif; color: #c01229; margin: 10px 0; }
h3						{ font: bold 1.1em "trebuchet ms", arial, verdana, helvetica, sans-serif; color: #c01229; margin: 10px 0; }

p, li					{ font-size: 1.0em; line-height: 1.5em; margin: 10px 0 15px; }
.largetext				{ font-size: 1.2em; }
.smalltext				{ font-size: 0.8em; }

a:link,					
a:visited				{ color: #c01229; text-decoration: none; }
a:hover,					
a:active				{ color: #041952; }

hr						{ height: 1px; background-color: #e8e8e8; color: #e8e8e8; border: 0; margin: 15px 0; }
form, table				{ background: transparent; font-size: 1.0em;  }

.tablestyle							{ border-collapse: collapse; }
.tablestyle td, .tablestyle th		{ vertical-align: top; padding: 5px 5px 5px 0; }
.tableborder td, .tableborder th	{ vertical-align: top; padding: 5px; border: 1px solid #e8e8e8; }
.data th, .data td					{ text-align: center; padding: 5px;}

.clear					{ height: 0; clear: both; font-size: 0.1em; line-height: 0.1em; padding: 0; margin: 0; }
.right					{ float: right; }
.left					{ float: left; }

.widthwrapper			{ width: 100%; }
.padding				{ padding: 20px; }

img						{ border: 0; }
.imgright				{ float: right; margin: 0 0 10px 20px; }
.imgleft				{ float: left; margin: 0 20px 10px 0; }
.centerimg				{ text-align: center; }
.centerimg img			{ margin: auto; }

#accessibility			{ display: none; }


/* Layout Styles
-------------------------------------------------------------------------------------------------------------------------------------------------------------- */

#container 	  			{ width: 100%; min-height: 100%; height: auto; margin: 0 auto -50px; } /* margin-bottom to match #clearfooter */
* html #container 		{ height: 100%; }

.wrapper				{ width: 960px; text-align: left; margin: 0 auto; }

#header					{  }

#mainnav				{ height: 45px; background: #021b53 url("templatefiles/mainnav-bg.jpg") repeat-x 0 0; border-bottom: 1px solid #fff; }

#banner					{ background: #021b53 url("templatefiles/banner-bg.jpg") repeat-x 0 0; }

#contentwrapper			{ min-height: 200px; background: #fff url("templatefiles/grey-fade-bg.jpg") repeat-x top left; }

#subcontent				{ width: 270px; float: right; /*background-color: #ebecee;*/  background: #CFD3D6 url("templatefiles/grey-fade-bg.jpg") repeat-x bottom left; padding: 5px; }

#content				{ min-height: 200px; background-color: #fff; padding: 20px 15px; }

#clearfooter			{ clear: both; height: 50px;} /* height to match height + padding + margin etc in #footer */
#footer					{ width: 100%; height: 50px; clear: both; margin-top: 0; }


/* Header Styles
-------------------------------------------------------------------------------------------------------------------------------------------------------------- */

#header .wrapper		{ height: 75px; position: relative; }
#esslogo			{ position: absolute; top: 10px; left: 15px; border: 1px solid #fff; }
#strapline			{ position: absolute; top: 20px; left: 125px; font-weight: bold; font-size: 1.8em; text-transform: uppercase; color: #040f25; }

p#headcontact			{ position: absolute; top: 10px; right: 15px; font-size: 1.3em; line-height: 1.0em; text-align: right; margin: 0; }
p#headcontact .largetext{ line-height: 1.2em;  }
p#headcontact .smalltext{ font-size: 0.7em; }


/* Navigation Styles
-------------------------------------------------------------------------------------------------------------------------------------------------------------- */

#mainnav ul				{ padding: 0; margin: 10px 0 0 125px; }
#mainnav ul li			{ display: inline; list-style-type: none; color: #fff; }
#mainnav ul li a,
#mainnav ul li a:visited{ color: #fff; padding: 0 7px; }
#mainnav ul li a:hover,
#mainnav ul li a:active	{ text-decoration: underline; }

.subnav					{ overflow: hidden; padding: 0; margin: 0; }
.subnav li				{ background: transparent url("templatefiles/dd-bg.png") no-repeat 5px 12px; list-style-type: none; padding: 5px 20px; margin: 0; }
.subnav li a,
.subnav li a:visited	{ color: #041952; }
.subnav li a:hover,
.subnav li a:active		{ color: #c01229; }


/* Banner Styles
-------------------------------------------------------------------------------------------------------------------------------------------------------------- */
#banner .wrapper		{ background: #fff url("templatefiles/grey-fade-bg.jpg") repeat-x top left; }
#home #banner .wrapper	{ min-height: 265px; }

#banner img				{ display: block; }

#banner .padding		{ width: 240px; float: right; }

#banner dl				{ overflow: hidden; padding: 0; margin: 0; }
#banner dt				{ padding: 10px 0; }
#banner dd				{ background: transparent url("templatefiles/dd-bg.png") no-repeat 5px 12px; padding: 5px 20px; margin: 0; }


/* News Styles
-------------------------------------------------------------------------------------------------------------------------------------------------------------- */

#news h2				{ border-bottom: 1px solid #F9BBC3; }
#news img				{ float: left; margin-right: 20px; }
#news p					{ font-size: 0.9em; margin-top: 0; }
#news p a				{ font-weight: bold; }
#news p.readmore		{ background: transparent url("templatefiles/dd-bg.png") no-repeat 5px right; text-align: right; padding-right: 15px; margin: -10px 20px 0 0; }
#news p.readmore a,
#news p.readmore a:visited	{ font-weight: normal; color: #000; }
#news p.readmore a:hover,
#news p.readmore a:active	{ color: #c01229; }

/* Traceability Styles
-------------------------------------------------------------------------------------------------------------------------------------------------------------- */

table#traceability			{ border-collapse: collapse; margin-left: 25px; }
table#traceability td		{ vertical-align: middle; font-size: 1.2em; text-align: left; padding: 5px 10px; }
table#traceability td.arrow	{ width: 40px; height: 70px; background: transparent url("templatefiles/largearrow.jpg") no-repeat center center; font-weight: bold; text-align: center; color: #fff; padding: 0; }


/* Subcontent Styles
-------------------------------------------------------------------------------------------------------------------------------------------------------------- */

#subcontent p						{ font-size: 0.9em; }
#subcontent p.readmore				{ background: transparent url("templatefiles/dd-bg.png") no-repeat 5px right; text-align: right; padding-right: 15px; margin: -10px 20px 0 0; }
#subcontent p.readmore a,
#subcontent p.readmore a:visited	{ font-weight: normal; }


/* Footer Styles
-------------------------------------------------------------------------------------------------------------------------------------------------------------- */

#footer .wrapper		{ height: 50px; background: #fff url("templatefiles/grey-fade-bg.jpg") repeat-x 0 -100px; }
#footer p				{ font-size: 0.85em; color: #777; padding: 10px 10px 0; margin: 0; }
#footer .right			{ padding-top: 5px; }
