body {
	background:url(../images/layout/bgBlueGradientLarge.png) bottom repeat-x;
	font-family:calibri, arial, sans-serif;
	margin:0;
	padding:35px 0;
	position:relative;
	left:0;
	top:0;
}
#brand, #titleArea, #page, ul#languageSelect li a {
	background:#FFF;
}

/* Headings, text and Typography */
#brand h1 {
	font-size:2.8em;
	font-style:italic;
	margin:0;
	padding:3px 10px 10px 10px;
	position:relative;
}
#brand h2 {
	bottom:2px;
	color:#666;
	font-weight:normal;
	margin:0;
	position:absolute;
	right:5px;
}
h1, h2, h3, h4, b {color:#036;}
h1 span, h2 span, h3 span, h4 span {color:#666;}
h1 em, h2 em, h3 em, h4 em {color:#11689C;}
#carousel, #carousel h1, #carousel h2, #carousel h3, #carousel h4 {
	color:#FFF;
}
#titleArea h1 {
	background:#036;
	color:#FFF;
	opacity:0.85;
	padding:10px;
	position:absolute;
	text-align:left;
	width:350px;
}
#titleArea h1.br {
	bottom:26px;
	right:0;
}
#titleArea h1.bl {
	bottom:26px;
	left:0;
	text-align:right;
}
#titleArea h1.tr {
	right:0;
	top:26px;
}
#titleArea h1.tl {
	left:0;
	text-align:right;
	top:26px;
}
#titleArea img {display:block;}
#boilerplate h4 {margin:0;}
#main .col1 h1 {font-size:1.5em;}
a {
	color:#0066CC;
}
a img { border:none; }

/* Page Sections */
#pageWrapper {
	margin:0 auto;
	width:952px;
	position:relative;
	left:0;
	top:0;
}
#page, #carousel, #brand, #navMenu, #titleArea {
	border:#666 1px solid;
	overflow:hidden;
}
#page {
	border-bottom:none;
	border-top:none;
} 
#brand {
	border-bottom:none;
	border-top:none;
	overflow:visible;
	position:relative;
	right:0;
	top:0;
	width:950px;
}
#carousel, #titleArea {
	height:252px;
	position:relative;
	left:0;
	top:0;
}
#titleArea {height:250px;}
#boilerplate {
	font-size:0.8em;
	margin:25px;
	text-align:center;
}

/* main navigation */
#navMenu {
	border-top:#CCC 1px solid;
	border-bottom:none;
	height:35px;
	left:0;
	/* elements with borders set to 100% width will mis-align with other 
	 * borders so an absolute pixel value must be used */
	margin:0 auto;
	overflow:visible;
	position:relative;
	top:0;
	width:950px; 
	z-index:30; /* place navMenu above global key logo, carousel, and "read more" elements */
}
#navMenu>div, #navMenu>a {
	position:absolute;
	top:0;
}
#navHome, #navTrans, #navInterp, #navContact {
/* start hidden to permit left settings to be calculated before revealing under code control */
	visibility:hidden;
}
#navMenu>div, #navMenu a {
	color:#666;
	display:block;
	padding:8px 10px;
	text-decoration:none;
}
/* top-level anchor nav-links overflow hidden for "taller" langagues */
#navMenu>a {height:19px;}
/* top-level div and anchor nav-links and all submenu anchors use same bgColor */ 
#navMenu>div:hover, #navMenu a:hover {background:#036;}
/* real links (anchors) use white as color */
#navMenu a:hover {color:#FFF;}
/* pseudo-links (direct child divs of top-level menu container that activate submenues) use 
 * gray as color in order visually to distinguish them from real links (anchors) */
#navMenu>div:hover {color:#CCC;}
div.navSubmenu {
	background-color:#FFF;
	border:#CCC 1px solid;
	display:none;
	left:0;
	position:absolute;
	top:35px;
	white-space:nowrap;
	z-index:2;
}
/* begin css tabs */
ul#languageSelect { 						/* general settings */
	border-bottom: 1px solid #666; 	/* set border COLOR as desired */
	font: 11px arial, sans-serif; 	/* set font as desired */
	list-style-type: none;
	margin:0; 								/* set margins as desired */
	padding: 3px 10px 3px 10px; 		/* THIRD number must change with respect to padding-top (X) below */
	text-align: left; 					/* set to left, right or center */
	direction:ltr;
	position:relative;
}
/* !!!!! DO NOT CHANGE OR OVERRIDE NEXT ITEM !!!!! */
ul#languageSelect li {display: inline; position:relative;}

/* settings for selected tab */
body#en-gb li.en-gb, 
body#de li.de, 
body#pl li.pl, 
body#es li.es, 
body#ru li.ru, 
body#ar li.ar {
	background-color: #fff; 			/* set background color to match above border color */
	border-bottom: 1px solid #fff; 	/* set border color to page background color */
}
/* settings for selected tab link */
body#en-gb li.en-gb a, 
body#de li.de a, 
body#pl li.pl a, 
body#es li.es a, 
body#ru li.ru a, 
body#ar li.ar a {
	background-color: #fff; /* set selected tab background color as desired */
	color: #000; 				/* set selected tab link color as desired */
	font-size:13px;
	font-weight:bold;
	padding-top: 4px; 		/* must change with respect to padding (X) above and below */
	position: relative;
	top: 1px;
}
/* settings for all tab links */
ul#languageSelect li a {
	background-color: #FFF; /* set unselected tab background color as desired */
	border: 1px solid #666; /* set border COLOR as desired; usually matches border color specified in #tabnav */
	border-bottom: none;
	color: #666; 				/* set unselected tab link color as desired */
	margin-right: 2px; 		/* set additional spacing between tabs as desired */
	padding: 3px 4px; 		/* set padding (tab size) as desired; FIRST number must change with respect to padding-top (X) above */
	text-decoration: none;
}
/* settings for hover effect - set desired hover color */
ul#languageSelect a:hover {background: #fff;}
/* custom settings */

/* end css tabs */

/* start of content layout - may implement multiple "columns" without tables */

/* start of content layout - may implement multiple "columns" without tables */
#main {
	overflow:hidden;
	width:100%;
}

div.threeColumns, 
div.threeColumnsDivided, 
div.twoColumns, 
div.twoColumnsDivided, 
div.twoColumns1_2, 
div.twoColumns1_2Divided, 
div.oneColumn {
	border-bottom:1px solid #666;
	clear:left;
	margin:0 auto;
	overflow:hidden;
	width:100%; 	/* setting width triggers has-layout in IE6  */
}
div.threeColumns div.col, 
div.threeColumnsDivided div.col, 
div.twoColumns div.col, 
div.twoColumnsDivided div.col, 
div.twoColumns1_2 div.col, 
div.twoColumns1_2Divided div.col1, 
div.twoColumns1_2Divided div.col2,
div.oneColumn div.col {
	float:left;
}
/* margin and padding can be tweaked irrespective of column width */
div.threeColumns div.col div.content, 
div.threeColumnsDivided div.col div.content, 
div.twoColumns div.col div.content, 
div.twoColumnsDivided div.col div.content, 
div.twoColumns1_2 div.col div.content, 
div.twoColumns1_2Divided div.col1 div.content, 
div.twoColumns1_2Divided div.col2 div.content, 
div.oneColumn div.col div.content {margin:35px 32px 35px 32px;}
/* optional background images - can be used to "draw" column divides  */
div.threeColumnsDivided {background:url(../images/layout/threeColumnBackground.png) center repeat-y;}
div.twoColumnsDivided {background:url(../images/layout/twoColumnBackground.png) center repeat-y;}
div.twoColumns1_2Divided {background:url(../images/layout/twoColumn1_2Background.png) center repeat-y;}
/* basic multi-columns share the space equally */
div.threeColumns div.col, 
div.threeColumnsDivided div.col  {width:33.3%;}
div.twoColumns div.col, 
div.twoColumnsDivided div.col {width:50%;}
/* asymmetric milti-columns require more specific column classes, e.g., col1, col2 */
div.twoColumns1_2 div.col1, 
div.twoColumns1_2Divided div.col1  {width:33.3%;}
div.twoColumns1_2 div.col2, 
div.twoColumns1_2Divided div.col2 {width:66.6%;}
/* single column fills space */
div.oneColumn div.col {width:100%;}
/* end of content layout */

#boilerplate {
	clear:left;
	direction:ltr;
}

/* Settings for content itself */
a img {border:0;}
img.framed { border:#000 1px solid }
#brand div.logo {
	background:url(../images/branding/keyFaded.png) center right no-repeat;
	height:6.5em;
	position:absolute;
	right:15px;
	top:0;
	width:420px;
}
.ltr {
	direction:ltr;
}

/* Forms */

form.contact, form.contactQuote {
	overflow:hidden;
	width:545px;
}
form.contact label, form.contact input, form.contact div.csvError, form.contact textarea, form.contact select,
form.contactQuote label, form.contactQuote input, form.contactQuote div.csvError, form.contactQuote textarea, form.contactQuote select {
	float:left;
	margin-bottom:8px;
}
form.contact label, form.contactQuote label {
	clear:left;
	width:120px;
}
form.contact input, form.contact textarea, form.contactQuote input {
	width:250px;
}
form.contactQuote textarea {
	width:400px;
}

form.contact input[type="submit"], form.contactQuote input[type="submit"] {
	clear:left;
	margin-left:100px;
	width:auto;
}
.notification {
	background-color:#FFC;
	border:thin solid #FC6;
	display:block;
	margin-bottom:12px;
	padding:10px;
}
form.contact div.csvError, form.contactQuote div.csvError {
	color:#C00;
	font-size:11px;
	margin-left:8px;
	width:200px;
	display:none; /* hidden until called by CSV */
}
form.contact div.csvError img, form.contactQuote div.csvError img {
	vertical-align:middle;
}

/* contactQuote only */

form.contactQuote label {
	float:none;
	display:block;
	clear:left;
	width:auto;
}

/* spam fighting for e-mail addresses */
span.botKill {
/*	color:#FFF;*/
	color: #D3DAE4;
	display:block;
	float:left;
	letter-spacing:-1em;
	width:0;
}
#page span.botKill {
	color: #FFF;
}
#boilerplate a, a.spamProof {
	color:#036;
	text-decoration:none;
}

.readMorePu a {
	color:#FFF;
	font-size:15px;
}