body,html {height:100%;}
body.home {
	padding:0;
	margin:0;
	background: #EAEAEA url('../img/body_bg.png') repeat-x 0px 35px;
}
body.other {
	padding:0;
	margin:0;
	background: #EAEAEA url('../img/other_body_bg.jpg') repeat-x 0px 35px;;
}
a img {border:0px;}
a {
	color:black;
}
a:visited {
	color:black;
}
#wrap {
	width:1004px;
	background-color:white;
	height:auto !important;
	height:100%;
	min-height:100%;
	margin:0 auto -148px auto;	
	overflow:hidden;
}

#wrap #head {
	background: url('../img/wrap_head.jpg') no-repeat;
	width: 1004px;
	height:108px;
	margin:0;	
}

#wrap #head .logo {
	float:left;
	margin:50px 0 0 40px;
}

#wrap #head .search-and-submit {
	float:right;
	width:498px;
	height:58px;
	margin:0 25px 0 0;
}

#wrap #head .search-and-submit form input {
	float:left;
	margin:20px 0 0 20px;
	height:17px;
	width:190px;
	border: 1px solid #aaa;
}


#wrap #head .search-and-submit form button {
	float:left;
	padding:0;
	background-color:transparent;
	border:0;
	margin:20px 0 0 10px;
	cursor:pointer;
}

*:first-child+html #wrap #head .search-and-submit form button {margin-left:0px; }

#wrap #head .search-and-submit .submit_your_plans {
	float:right;
	margin:23px 18px 0 0;
}

#wrap #head .time {
	clear:right;
	float:right;
	text-align:right;
	font-size:30px;
	font-family: Century Gothic, arial;
	width:161px;
	height:34px;
	margin: 9px 25px 0 0;
}


#wrap #navi {
	background: url('../img/navi_bg.png') no-repeat;
	width: 1004px;
	height: 36px;	
	margin:0;
}




#wrap #body {
	background: url('../img/content_bg.gif') no-repeat 0px 0px;
	width: 1004px;
	margin:0;
	padding:0;
	border-top: 1px solid white;
}

#wrap #flash {
	width: 1004px;
	padding-bottom:9px;
}

/* god knows why, but FF added a 2 pixie padding to that 9px above, reset it to 7px. Shall we asume IE does this aswell? only testing will tell. */
#wrap #flash, x:-moz-any-link {padding-bottom:7px;}

*:first-child+html #wrap #flash {
	width: 1004px;
	padding-bottom:9px;
}

/* coloured bars for bottom of flash */
#wrap #flash.yellow {
	background: url('../img/flash_bottom_yellow.gif') no-repeat 0px 100%;
}
#wrap #flash.red {
	background: url('../img/flash_bottom_red.gif') no-repeat 0px 100%;
}
#wrap #flash.blue {
	background: url('../img/flash_bottom_blue.gif') no-repeat  0px 100%;;
}
#wrap #flash.grey {
	background: url('../img/flash_bottom_grey.gif') no-repeat  0px 100%;;
}
#wrap #flash.purple {
	background: url('../img/flash_bottom_purple.gif') no-repeat  0px 100%;;
}
#wrap #flash.orange {
	background: url('../img/flash_bottom_orange.gif') no-repeat  0px 100%;;
}
#wrap #flash.green {
	background: url('../img/flash_bottom_green.gif') no-repeat  0px 100%;;
}

/* Use this push element (lol) to allow the footer to stick to the bollow of the browser */
#wrap .push-footer-navi {
	height: 148px;
}

#footer-navi {
	background-color:white;
	margin:0 auto;
	width: 1004px;
	height: 148px;
	padding:0;
	clear: both;
}

#footer-navi ul {
	height: 148px;
	width:940px;
	background: url('../img/footer_bg.png') repeat-x;
	margin: 0 0 0 22px;
	list-style:none;
	padding:0 0 0 20px;
}

#footer-navi ul li {
	padding-top:10px;
	float:left;
	height:22px;
	overflow:hidden;
}

#wrap #navi li {
	padding-top:5px;
	float:left;
	height:22px;
	overflow:hidden;
}

#footer-navi ul li a,#wrap #navi li a {
	height:22px;
	display:block;
	text-indent:-10000px;
	background: url('../img/navi_btns.png') no-repeat;	
}

/* Footer navi, this should be used by the top navi as they're the same */
#footer-navi ul li a.home,#wrap #navi li a.home {background-position:0px 0px;width:49px;}
#wrap #navi li a.home {margin-left:4px;}
#footer-navi ul li a.modular_solution,#wrap #navi li a.modular_solution {background-position:-49px 0px;width:128px;}
#footer-navi ul li a.key_projects,#wrap #navi li a.key_projects {background-position:-177px 0px;width:98px;}
#footer-navi ul li a.press_room,#wrap #navi li a.press_room {background-position:-275px 0px;width:95px;}
#footer-navi ul li a.who_are_elements,#wrap #navi li a.who_are_elements {background-position:-370px 0px;width:139px;}
#footer-navi ul li a.embracing_the_environment,#wrap #navi li a.embracing_the_environment {background-position:-509px 0px;width:197px;}
#footer-navi ul li a.the_pickstock_group,#wrap #navi li a.the_pickstock_group {background-position:-706px 0px;width:151px;}
#footer-navi ul li a.contact,#wrap #navi li a.contact {background-position:-857px 0px;width:60px;}
/* AND the hovers... */
#footer-navi ul li a.home:hover,#wrap #navi li a.home:hover {background-position:0px -22px;width:49px;}
#footer-navi ul li a.modular_solution:hover,#wrap #navi li a.modular_solution:hover {background-position:-49px -22px;width:128px;}
#footer-navi ul li a.key_projects:hover,#wrap #navi li a.key_projects:hover {background-position:-177px -22px;width:98px;}
#footer-navi ul li a.press_room:hover,#wrap #navi li a.press_room:hover {background-position:-275px -22px;width:95px;}
#footer-navi ul li a.who_are_elements:hover,#wrap #navi li a.who_are_elements:hover {background-position:-370px -22px;width:139px;}
#footer-navi ul li a.embracing_the_environment:hover,#wrap #navi li a.embracing_the_environment:hover {background-position:-509px -22px;width:197px;}
#footer-navi ul li a.the_pickstock_group:hover,#wrap #navi li a.the_pickstock_group:hover {background-position:-706px -22px;width:151px;}
#footer-navi ul li a.contact:hover,#wrap #navi li a.contact:hover {background-position:-857px -22px;width:60px;}

h1,h2,h3,h4,h5 {
	padding:0;
	margin:0;
}

h2 {
	font-weight:bold;
	font-family: Century Gothic, arial;
	font-size:13px;
	color:#333;
}



/* other random classes */
.paddingleft10 {
	padding-left:10px;
}
.paddingleft20 {
	padding-left:20px;
}
.paddingright20 {
	padding-right:20px;
}
.border1grey {
	border: 1px solid #aaa;
}
.padding10 {
	padding:10px;
}
.padding5 {
	padding:5px;
}
.bold {
	font-weight:bold;
}
.century13 {
	font-family: Century Gothic, arial;
	font-size:13px;
}
.c333 {
	color:#333;
}
.margintop10 {
	margin-top:10px;
}
.margintop20 {
	margin-top:20px;
}