@charset "UTF-8";
/* CSS Document */


/* starStyles.css
------------------------------------------------------------------------------

Author:  			Peter Richman
E-mail:				peter@plugandplaydesign.co.uk
Company: 			Plug and Play Design
Date:				16/10/2008

Version:			1.0
Designed for:		FireFox 3 mac

CSS file:			Design One 

------------------------------------------------------------------------------*/



/* =USUAL SUSPECTS
------------------------------------------------------------------------------*/



body{
font-family:		Verdana, Arial, Helvetica, sans-serif;
font-size:			62.5%;
margin-top:			0px;
}

img{
border:				none;
}

h1, h2, h3, h4, h5, h6{
font-family:		Trebuchet, Verdana, Arial, Helvetica, sans-serif;
}

p{
line-height:		16px;
text-align:			justify;
}

p strong{
color:				#000;
}


a{
text-decoration:	underline;
color:				#CF0000;
outline:			none;
}

a:active
{
  outline: none;
}

q{
font-style:			italic;
color:				#000;
}

.clear{
clear:				both;
}

strong{
color:				#000;
}



/* HACK for FIREFOX!! - to always display right hand scroll bars in short pages
this prevents the page bouncing left when changing pages 

html { 
overflow: -moz-scrollbars-vertical; 
height: 100%; 
}

Hack over*/


p a{
text-decoration:	none;

}



p a:hover{
text-decoration:	none;
}

q{
font-family:		Georgia, "Times New Roman", Times, serif;
color:				#572600;
margin:				0px 15px;
font-size:			1.2em;
line-height:		1.6em;
}

a:hover{
text-decoration:	underline;	
color:				#666666;
}



/* REMOVES HORIZONTAL SCROLL BARS */
html{
overflow-x:			hidden;
}

.logo{
margin:				0px;
padding:            0px;
}

.logo a{
background:			url(../images/logo.gif) top left no-repeat;
width:				150px;
height:				122px;
text-indent:        -3000px;
margin:				20px 0px 0px 52px;
display:			block;
}

.floatRight{
float:				right;
margin:				0px 15px 0px 0px;
}


/* =FIXED HEADER AND FOOTER
------------------------------------------------------------------------------*/

body{margin:0}/* for ie mac*/
/* commented backslash hack v2 \*/ 
html, body{height:100%;padding:0} 
* html, * html body{
	overflow:hidden;
	padding:50px 0;
	margin:-50px 0;
	padd\ing:0;
	ma\rgin:0;
}
* html .outer { 
	overflow:auto;
	height:99.9%;
	voice-family: "\"}\""; voice-family:inherit; 
}
* html .contain-all{
	position:absolute;
	overflow-y:scroll;
	width:100%;
	height:100%;
	z-index:1;
}
/* end hack */ 

.home .top{
	position:absolute;/* ie6 will treat this as fixed because of a bug where overflow:auto is set on a parent */
	top:0px;
	left:0px;
	height:234px;
	width:100%;
	margin:0;
	padding:0;
	z-index:999;
	overflow:hidden;
}

.otherPage .top{
	position:absolute;/* ie6 will treat this as fixed because of a bug where overflow:auto is set on a parent */
	top:0px;
	left:0px;
	height:210px;
	width:100%;
	margin:0;
	padding:0;
	z-index:999;
	overflow:hidden;
}

.home .topbar-inner{
	height:234px;
	background:#ffffff;
}

.otherPage .topbar-inner{
	height:210px;
	background:#ffffff;
}

.footer-inner {
	height:22px;
	background:#336699;
	width:		100%;
}
/* mac hide - reduce page to allow the scrollbar to remain visible \*/
* html .topbar-inner,* html .footer-inner {margin-right:17px;}
/* end hide*/

.footer{
	position:absolute;
	bottom:0;
	width:100%;
	height:22px;
	z-index:999;
}
.home .spacerHeader {height:234px}/* same height as header to preserve space*/
.otherPage .spacerHeader {height:234px}/* same height as header to preserve space*/
.spacerFooter {height:22px}/* same height as header to preserve space*/
p{margin-top:0}

html>.home .top, html>.otherPage .top, html>body .footer{position:fixed}/* for moz/opera and others*/


/* =CONTENT
------------------------------------------------------------------------------*/

.logo{   /* ALL PAGES BAR HOME PAGE */
position:			absolute;
top:				20px;
left:				374px;
z-index:			1;

}



/* =TOP
------------------------------------------------------------------------------*/

.home .title{
height:				160px;
width:				210px;
background:			#336699;
}
.home .title2{
height:				160px;
width:				210px;
background:			#336699;
background-image: url('../images/petronas3.jpg');
background-position: top left;
background-repeat:no-repeat;
}

.otherPage .title{
height:				120px;
width:				210px;
background:			#336699;
}

.home .title p, .home .title2 p{
background:			#336699;
padding:            0px;
color:				#FFF;
font-weight:		bold;
font-size:			13px;
padding-bottom:     11px;
padding-left:       10px;
letter-spacing:		1px;
position:			relative;
top:				143px;
}

.otherPage .title p{
background:			#336699;
padding:            0px;
color:				#FFF;
font-weight:		bold;
font-size:			13px;
padding-bottom:     11px;
padding-left:       10px;
letter-spacing:		1px;
position:			relative;
top:				94px;
}

.home .top, .otherPage .top, .contain-all{
margin-left:      20px;
}


.home .topbar-inner .mainMenu .Page0 a{
background-color:	#CACACA;
color:				#666;
padding-bottom:     0px;
}

.home .topbar-inner .mainMenu .Page0 a:hover{
color:				#CF0000;
}

.home .rightBars{
height:			212px;
width:			100%;
float:			right;
position:		absolute;
left:			750px;
}

.otherPage .rightBars{
height:			120px;
width:			100%;
float:			right;
position:		absolute;
left:			750px;
}

.home .rightBars .blue{
background:			#336699;
height:				170px;
width:				100%;
display:			block;
}

.home .rightBars .blue2{
background-image: url('../images/petronas.jpg');
background-position: top left;
background-repeat:no-repeat;
height:				170px;
width:				100%;
display:			block;
}

.otherPage .rightBars .blue{
background:			#336699;
height:				120px;
width:				100%;
display:			block;
}

.rightBars .grey{
background:			#CACACA;
height:				24px;
margin:				19px 0px 0px 0px;
width:				100%;
display:			block;
}

.rightBars .lightGrey{
background:			#EBEBEB;
height:				24px;
margin:				0px 0px 0px 0px;
width:				100%;
display:			block;
}

.rightBars .lightLightGrey{
background:			#F4F4F4;
height:				24px;
margin:				0px 0px 0px 0px;
width:				100%;
display:			block;
}

/* =FLASH BANNER
------------------------------------------------------------------------------*/

.flashBanner{
position:			absolute;
top:				0px;
left:				230px;
}


/* =MAIN MENU
------------------------------------------------------------------------------*/

.home div.mainMenu{
float:				left;
height:				24px;
background:			#CACACA;
margin:				28px 0px 0px 0px;
padding:            0px;
width:				730px;
}

div.mainMenu ul{
margin:				0px;
padding:            0px;
}

.otherPage div.mainMenu{
float:				left;
height:				24px;
background:			#CACACA;
margin:				18px 0px 0px 0px;
padding:            0px;
width:				730px;
}
ul.mainMenu
{
list-style:			none;
margin: 0;
}
.mainMenu li{
float:				left;
font-weight:		bold;
color:				#666;
text-decoration:	none;

}

.mainMenu li a{
float:				left;
font-weight:		bold;
color:				#666;
text-decoration:	none;
padding:            5px 11px 7px 11px;
display:			block;
font-family:		Verdana, Arial, Helvetica, sans-serif;
font-size:			10px;
}

.mainMenu .searchItem a{
padding:            5px 0px 7px 12px;
}

.mainMenu li a:hover{
float:				left;
font-weight:		bold;
color:				#CF0000;
text-decoration:	none;
}


.mainMenu .selected a, .mainMenu .selectSec0 a{
background:			#EBEBEB;
color:				#CF0000;
}

.searchItem input{
position:			relative;
top:				1px;
left:				1px;
}

.searchItem .submitButton{
top:				5px;
}

.searchBox{
border:				1px solid #000;
font-family:		Verdana, Arial, Helvetica, sans-serif;
font-size:			10px;

}

.submitButton{
position:			relative;
top:				4px;
}

/* =SUB MENU
------------------------------------------------------------------------------*/


.home .subMenu{
list-style:			none;
float:				left;
height:				24px;
background:			#EBEBEB;
margin:				0px;
padding:            0px;
position:			absolute;
top:				212px;
left:				0px;
width:				730px;
}

.otherPage .subMenu{
list-style:			none;
float:				left;
height:				24px;
background:			#EBEBEB;
margin:				0px;
padding:            0px;
position:			absolute;
top:				162px;
left:				0px;
width:				730px;
}

.subMenu li, .subSubMenu li{
float:				left;
}

.subMenu li a, .subSubMenu li a{
color:				#666;
display:			block;
text-decoration:	none;
padding:            6px 8px 6px 8px;
}

.subMenu li a:hover, .subSubMenu li a:hover{
color:				#CF0000;
}

.top .subMenu .selected a, .top .subMenu .selectSec0 a, .top .subSubMenu .selected a{
color:				#CF0000;
background:			#F4F4F4;
}

/* =SUB SUB MENU
------------------------------------------------------------------------------*/


.home .subSubMenu{
list-style:			none;
float:				left;
height:				24px;
background:			#F4F4F4;
margin:				0px;
padding:            0px;
position:			absolute;
top:				236px;
left:				0px;
width:				730px;
}

.otherPage .subSubMenu{
list-style:			none;
float:				left;
height:				24px;
background:			#F4F4F4;
margin:				0px;
padding:            0px;
position:			absolute;
top:				186px;
left:				0px;
width:				730px;
}







/* =CONTENT
------------------------------------------------------------------------------*/
.contain-all{
width:				770px;
}

.leftContent{
width:				210px;
float:				left;
min-height:         200px;
}

.rightContent{
width:				460px;
float:				left;
margin-left:		25px;
padding:            15px;
background-color:	#F2F2F2;
}

body .contain-all .rightContent .rightArea{
float:				right;
width:				146px;
height:				210px;
margin-left:		10px;
}

body .contain-all .rightContent .rightArea img{
float:				left;
}

body .contain-all .rightContent .rightArea p{
text-align:			center;
width:				146px;
float:				left;
}


h2, h2 a, h3, h3 a{
color:				#CF0000;
font-size:			10px;
margin-bottom:		5px;
margin-top:			0;
}

.leftContent h3 a:hover{
color:				#666;
}

.leftContent p{
margin-bottom:		25px;
}

.leftArea{
float:				left;
width:				139px;
margin:				0px 10px 10px 0px;
}

/* =FOOTER
------------------------------------------------------------------------------*/

.footerContent{
width:				700px;
margin-left:		160px;
}

.footerMenu{
float:				left;
list-style:			none;
margin:				2px 0px 0px 0px;
padding:            0px;
}

.footerMenu li{
float:				left;
font-weight:		bold;
color:				#FFF;
}

.footerMenu li a{
color:				#99B3CC;
text-decoration:	none;
padding:            3px 10px 0px 10px;
display:			block;
}

.footerMenu li a:hover{
color:				#FFF;
text-decoration:	none;
}

.footerMenu input{
border:				1px solid #000000;
font-family:		Verdana, Arial, Helvetica, sans-serif;
font-size:			10px;
}

a.paginate
{
	color:				#CF0000;
	margin-right: 5px;
}
a.paginateSelect
{
	font-weight:bold;
	color:				#CF0000;
	margin-right: 5px;
}

/* =HOME
------------------------------------------------------------------------------*/


.homeSection .rightContent {
width:					310px;
float:					right;
margin-left:			0px;
padding-left:           0px;
padding-right:          0px;
}

.homeSection{
margin-top:				10px;
}


.contactForm{
list-style:				none;
padding:                0px;
}

.contactForm label{
width:					70px;
text-align:				right;
display:				block;
float:					left;
}

.contactForm input{
height:					15px;
}

.contactForm input, .contactForm textarea{
float:					left;
margin:					2px 0px 0px 10px;
border:					1px solid #000;
}

.contactForm .textAreaLi{
height:					135px;
}

.contactForm #Dynctl_Cnttnt_ctl00_Submit{
margin-left:			80px;
}


.contactForm .frmBoxSm{
margin-right:			190px;
}

.contactForm li{
display:				block;
width:					450px;
float:					left;
height:					25px;
}

div.thumbRow
{
	float:left;
	width: 460px;
	position:relative;
}
div.thumb
{
	float:left;
	width: 100px;
	position:relative;
	padding: 7px;
}

a.dwnld
{
	float:left;
	display:inline;
	width: 300px;
}
div.location
{
	width:460px;
	float: left;
	position:relative;
	width:460px;
	margin-bottom:20px;
}
div.location img
{
	padding: 0;
	margin: 0;
}
div.locLeft
{
	width:220px;
	float:left;
	position:relative;
}

div.locRight
{
	width:230px;
	float:right;
	position:relative;
}
div.locRight h4
{
	font-size: 1.2em;
	margin-bottom: 7px;
}
div.locRight p
{
	margin-bottom: 5px;
}