/* groen: #4a7f87 */

html {
	overflow-y: scroll;
    width:100%;
    height:100%;
}

body {
	font-size:11px;
	font-family: Arial;
    width:100%;
    height:100%;
    background:#151412 url("../images/bg-top.gif") no-repeat top center;
}

ul {
	 list-style-image: none;
	 list-style-type: none; 
}

a, a:visited, a:hover {
	color:#4a7f87;
	text-decoration:none;
}

p {
	padding-bottom:15px;
	line-height:15px;
}

.bold, strong {
	font-weight:bold;
}

.italic {
	font-style:italic;
}

.clearer {
	clear:both;
}

.clearer_left {
	clear:left;
}

.sup{
   position:relative;
   top:-3px;
}

/* ----------------------------------------------------------------------  styles ----*/

h1 {
	font-size:27px;
	text-transform:uppercase;
	font-weight:bold;
}

h1.divider-bottom {
	margin-bottom:10px;
}

h1.header-main {
	margin-top:27px;
}

h1.news_header,
h1.careers_header{
    float:left;
    width:461px;
    height:42px;
    text-indent:-3000px;
    background:url(../images/news_header.jpg) no-repeat;
}

h1.careers_header{
    margin:0px 0px 0px 12px;
    background:url(../images/careers_header.jpg)
}

h2 {
	font-size:16px;
	text-transform:uppercase;
	font-weight:bold;
}

h2.green {
	color:#4a7f87;
    margin:0px 0px 0px -1px;
}

.superscript{
    float:left;
    width:100%;
    clear:both;
    overflow:hidden;
}
.superscript h2{
    float:left;
}
.superscript h2.green.super{
    position:relative;
    top:-5px;
    left:-5px;
}

h2.black-23 {
	font-size:23px;
}

h2.grey-15 {
	font-size:15px;
    text-transform:none;
    margin:0px;
}

ul.error a, a.arrow {
	color:#4a7f87;
	padding:0 0 0 10px;
	background:url('../images/link-arrow.gif') no-repeat 0px 3px;
}

a.arrow:hover {
	color: black;
}

a.arrow-white,
a.arrow-white:hover,
a.arrow-white:visited {
	color:#FFFFFF;
	padding:0 0 0 10px;
	background:url('../images/link-arrow-white.gif') no-repeat 0px 3px;
}

a.rss span {
	background:url('../images/icon-rss.gif') no-repeat top right;
	padding:2px 20px 2px 0;
	height:15px;
}

a.pdf {
	height:19px;
}

a.pdf span {
	background:url('../images/icon-pdf.gif') no-repeat top right;
	padding:2px 20px 2px 0;
}

table.locations{
    width:100%;
}

table.locations tr.header th{
    border:0px;
}

table.locations tr.header th h2{
    clear:both;
    width:80%;
}

table.locations tr td,
table.locations tr th{
    padding:12px 0px 12px 0px;
    vertical-align:top;
    text-align:left;
    border-top:1px solid #e3e3e3;
}

table.locations tr th{
    padding:12px 0px 0px 0px;
}

table.locations tr th h2{
    margin:15px 0px -5px 0px;
}

table.locations tr td a{
    color:inherit;
}
table.locations tr.last td{
    border-bottom:1px solid #e3e3e3;
}
table.locations tr.header td{
    padding:24px 0px 0px 0px;
}
table.locations tr td.office{
    width:220px;
}
table.locations tr td.address{
    width:220px;
}
table.locations tr td.contact{
    width:200px;
}
table.locations tr td.extra{
    width:270px;
}

ul.line{
    margin:-15px 0px 15px 0px;
    line-height:15px;
}

ul.line li{
    background:url(../images/list_style_line.gif) 2px 8px no-repeat;
    padding:0px 0px 0px 28px;
}

ul.resources{
    margin:0px 0px 30px 0px;
}

dl.job-details.first{
    margin:6px 0px 0px 0px;
}
dl.job-details{
    margin:12px 0px 0px 0px;
}
dl.job-details.apply{
    margin:2px 0px 0px 0px;
}
dl.job-details.apply dt{
    margin:0px 0px 12px 0px;
}
dl.job-details dd{
    font-size:13px;
    font-weight:bold;
}

ol{
    list-style-type:decimal;
    padding:0px 0px 0px 20px;
    margin:0px 0px 24px 0px;
}

/* ----------------------------------------------------------------------  site layout ----*/

/* site visuals */

#swirl {
	width:126px;
	height:39px;
	background:url("../images/bg-swirl.gif") no-repeat top left;
	position:absolute;
	right:0;
	top:286px;
	z-index:-1;

}

#swirl-shade {
	width:7px;
	height:149px;
	background:url("../images/bg-swirl-shade.png") no-repeat top left;
	position:absolute;
	right:-7px;
	top:286px;
	border:0px solid red;
}

#site-logo {
	margin-left:35px;
	border:0;
	outline:none;
}

/* footer */

#footer {
	background-color:#151412;
	padding:13px;
	height:35px;
}

#footer a {
	color:#fff;
}

#footer li.active {
	border:0px;
}

#footer ul li {
	float:left;
	margin-right:20px;
	border-bottom:1px solid #4a7f87;
	text-transform: lowercase;
}

#footer span {
	float:right;
	width:369px;
	height:25px;
	background:url("../images/liner-fuelling.gif") no-repeat top left;
	text-indent:-1000em;
}

/* content blocks */

#site-holder {
	margin:0 auto;
	width:960px;
	background-color:#fff;
	position:relative;
	padding-top:20px;
}

#site-content {
	padding:13px 13px 20px 13px;
	overflow:hidden;
	padding-bottom:70px;
	background:url("../images/bg-content.jpg") no-repeat bottom left;
	min-height:400px;
}

.content-divider {
	margin-right:12px;
}

.content-1 {
	padding:0 0 0 44px;
	width:700px;
	float:left;
}

.content-1 p.intro {
	width:545px;
	text-align:left;
	font-size:12px;
	line-height:17px;
}

.content-1 p {
	width:475px;
	text-align:justify;
}

.content-2 {
	padding-top:20px;
	width:461px;
	float:left;
}

.content-2-small {
	padding-top:20px;
	width:370px;
	float:left;
}

.content-2-small p.intro,
.content-2-small p {
	width:100%;
}

.content-2-sidebar {
	padding-top:20px;
	width:330px;
	float:left;
}

.greenbox {
	padding:18px 28px 18px 18px;
	width:226px;
	background-color:#4a7f87;
	color:#FFF;
	float:right;
	margin-top:20px;
	position:relative;
}


.blackbox {
	padding:18px 28px 18px 18px;
	width:239px;
	background-color:#151412;
	color:#FFF;
	float:right;
	margin-top:20px;
	margin-right:-13px;
	position:relative;
}

.blackbox a.mail{
    color:#fff;
}


.greenbox p,
.blackbox p {
	width:100%;
	padding-bottom:0;
}

.blackbox a.button {
	margin-top:15px;
	background:url("../images/bg-green.gif") no-repeat top left;
	padding:4px 8px;
	color:#FFF;
	font-weight:bold;
	text-transform:uppercase;
	float:left;
}

div.visual-intro {
	height:272px;
	width:254px;
	background-color:#4a7f87;
	color:#FFF;
	float:left;
	margin-right:11px;
	margin-bottom:10px;
	padding:25px 30px 20px 20px;
}

div.visual-intro.dark{
    background-color:#151412;
}

div.visual-intro.half{
    width:412px;
    height:272px;
    padding:25px 30px 6px 20px;
    margin:0px 11px 0px 0px;
}

div.visual-intro.half h1{
    margin:0px 0px 5px 0px;
}

div.visual-intro.half p,
div.visual-intro p{
    font-size:11px;
}

div.visual-intro {
	font-size:12px;
}

/* content visuals */
.visual-wide {
	margin-bottom:15px;
}

img.visual-intro {
	float:left;
	text-transform: lowercase;
	margin-bottom:0px;
    clear:right;
}

/* ----------------------------------------------------------------------  navigation ----*/

#menu {
	padding-top:20px;
	width:100%;
	overflow:hidden;
	background:url("../images/bg-top-shade.gif") no-repeat bottom right;
}


/*

WORK IN PROGRESS : Virgil is making this puppy variable

#navigation-main {
	display:inline-block;
	overflow:hidden;
	background-color:purple;
	padding-left:10px;
}

#navigation-main ul {
	float:left;
	background-color:aqua;
	padding-right:10px;
}


#navigation-main ul  li{
	float:left;
	padding-top:5px;
	background-color:brown;
}

#navigation-main ul li a {
	font-family:HelveticaNeueLightHeavy;
	color:#000;
	text-transform:uppercase;
	padding:2px 10px;
	background-color:gray;
}

*/




ul#navigation-main li {
	padding:0;
	float:left;
}

ul#navigation-main li a {
	display:block;
	height:39px;
	text-decoration:none;
	background:url("../images/navigation-main.gif") no-repeat top left;
	text-indent:-1000em;
	outline:none;
}

ul#navigation-main li a.home { display:none }

ul#navigation-main li a.about			{ width:124px; background-position:0 -39px;}
ul#navigation-main li a.about:hover		{ background-position:0 -78px;}
ul#navigation-main li.active a.about	{ background-position:0 0;}

ul#navigation-main li a.activities			{ width:115px; background-position:-124px -39px;}
ul#navigation-main li a.activities:hover	{ background-position:-124px -78px;}
ul#navigation-main li.active a.activities	{ background-position:-124px 0;}

ul#navigation-main li a.biofuels			{ display:none; width:107px; background-position:-239px -39px;}
ul#navigation-main li a.biofuels:hover		{ width:107px; background-position:-239px -78px;}
ul#navigation-main li.active a.biofuels		{ background-position:-239px 0;}

ul#navigation-main li a.sustainability			{ width:148px; background-position:-346px -39px;}
ul#navigation-main li a.sustainability:hover	{ background-position:-346px -78px;}
ul#navigation-main li.active a.sustainability	{ background-position:-346px 0;}

ul#navigation-main li a.responsibility          { width:148px; background-position:-239px -39px;}
ul#navigation-main li a.responsibility:hover	{ width:148px; background-position:-239px -78px;}
ul#navigation-main li.active a.responsibility	{ width:148px; background-position:-239px 0px;}

ul#navigation-main li a.contact				{ width:143px; background-position:-387px -39px;}
ul#navigation-main li a.contact:hover		{ background-position:-387px -78px;}
ul#navigation-main li.active a.contact		{ background-position:-387px 0;}

#navigation-main-sub {
	display:inline-block;
	float:right;
	padding:20px 0 0 0;
}

#navigation-main-sub ul {
	float:left;
}

#navigation-main-sub ul li {
	border-bottom:1px solid #4a7f87;
	float:left;
	margin-right:15px;
	height:11px;
}

#navigation-main-sub ul li.active {
	border:0px;
}

#navigation-main-sub ul,
#navigation-main-sub ul li a {
	color:#000;
}

#navigation-main-sub span  {
	margin:0 15px 0 5px;
	float:left;
}

#navigation-submenu {
	width:190px;
	float:left;
}

#navigation-submenu ul {
	padding-top:30px;
}

#navigation-submenu li {
	margin-bottom:10px;
}

#navigation-submenu li a {
	background-color:#000;
	color:#fff;
	font-size:11px;
	padding:4px 0px 4px 8px;
	width:170px;
	display:block;
	font-weight:bold;
}

#navigation-submenu li.active {
	padding-left:12px;
}

#navigation-submenu li.active a {
	background-color:#4a7f87;
}
#navigation-small {
	text-transform: lowercase;
}