﻿body 
{
    /*background:url("/images/main_back.gif") repeat-y fixed center top #E9E8E4;*/
    background-color: #E9E8E4;
    color:#2B4F00;
    font-family:Times New Roman;
    padding:0;
    margin:0;
    font-size:14px;
}

img
{
    border: 0;
}

a
{
    color:#FFF;
    text-decoration:none;
}

a:visited
{
    color:#FFF;
}

#page
{
    background:url("/images/background2.jpg") no-repeat  center top;
    margin: 0 auto 0 auto;
    width:960px;
}


#content
{
    background-color:#FFF;
    line-height: 1.5em;
    padding: 50px 70px;
    margin:0;
    font-size: 1.2em;
    position:relative;
}

#content h1
{
    font-size:1.5em;
    margin:0;
    color:#426417;
}


#content p
{
    text-align:justify;
}

#content .first
{
    margin-top:0;
    padding-top:0;
}


#content a
{
    color:#3A6B02;
}


#content strong
{
   color:#577F27;
}

#header
{
    position:relative;
    height:160px;
}

.companyname
{
    margin:0;
    position:absolute;
    width: 815px;
    left:115px;
    top:57px;  
    font-size:32px;
    line-height:40px;
    z-index:1;
    color:#FFF;
        border-bottom: 1px solid #FFF;
}

.business
{
    display:block;
    color:#FFF;
    position:absolute;
    left:115px;
    top:102px;  
    font-size:12px;
    text-transform:uppercase;
    letter-spacing: 2px;
    font-weight:bold;
}

#logo
{
    position:absolute;
    top:30px;    
    left:0px;
    z-index:10;
}



#lang
{
    position:absolute;
    top:31px;
    right:0;
}

#lang .innerBox
{
    width:96px;
    height:24px;


}

#lang a
{
    display:block;
    z-index:5;
    height:24px;
    float:left;
    background:transparent url(/images/lang.png) no-repeat scroll 0 0;
    opacity:0.9;
}


#lang a:hover
{
    opacity:1;
}

#lang #en
{
    width:62px;
}

#lang a#en:hover
{
    background-position: 0 -24px;
}

#lang a#en.active
{
    background-position: 0 -48px;
}


#lang #cn
{
    width:34px;
    background-position:-62px  0;
}


#lang a#cn:hover
{
    background-position: -62px -24px;
}

#lang a#cn.active
{
    background-position: -62px -48px;
}



#bar
{
    display:block;
    background-color:#375811;
    position:absolute;
    top:97px;
    right:0;    
    width:420px;
    height:6px;
    overflow:hidden;
    z-index:1;
}

#menu
{
    position:relative;
    color:#426417;
    top:75px;
    right:12px;
    text-align:right;
    z-index:5;
}

.cn #menu
{
    top:71px;
}

#menu a
{


    display:inline-block;
    font-size:16px;
    line-height:17px;
    height:18px;
    color:#FFF;
    padding: 0 15px 4px 15px;
    border-bottom: 6px solid #375811;
    margin-left:-8px;
    text-transform:uppercase;

    overflow:hidden;
}

.cn #menu a
{

    font-family:"宋体";
    font-size:18px;
    line-height:20px;
    height:22px;
 }

#menu a:hover
{
    border-bottom-color:#90AE6E;
}

#menu a.active
{
    border-bottom-color:#C2F92C !important;
    color:#C2F92C !important;
}


#footerBar
{

    position:fixed;
    width:900px;
    left: 50%;
    margin: 0 0 0 -450px;
    bottom: 0;
    z-index:30;
    clear:both;

}

#footerMask
{

    z-index:10;
    height:25px;
    background:transparent url(/images/gradient-mask-white.png) repeat scroll 0 0;
}

#footer
{

    height:34px;
    background-color:#446A17;
    opacity:0.8;
    color:#FFF;
    font-weight:bold;
    font-size:12px;
    line-height:20px;
    vertical-align:middle;
    overflow:hidden;
}

#footerpedding
{

    background-color:#FFF;
    z-index:-1;
    width:960px;
    height:2000px;
    position:fixed;
    left:50%;
    bottom:0;
    margin: 0 0 0 -480px;
}

#copy
{
    float:left;
    margin: 10px 20px 0 20px;
}

#contactUS
{
    padding: 10px 20px;
    float:right;
    color:#FFF;	
	text-decoration: none; 
	cursor:pointer;
	width:62px;
	text-align:right;

}

#contact 
{
	display:none;
	z-index:35;
	width:900px;
    height:240px;
    overflow:hidden;
    margin-left:-400px;
}

#contact .innerBox
{
	background-color:transparent;
	color:#FFF;
    text-align:center;
    font-size:16px;
    width:900px;
    padding:30px;
    margin-top:240px;
    margin-left:350px;
}



#contact a
{
	color:#FFF;	
}

#contactMask
{
    position:fixed;
    width:100%;
    top: 0; 
    left: 0;
    bottom:0;
    display: none; 
    z-index: 25;
    background-color:#000;
    opacity:0;
}


.imgBox
{
 float:right;
 display:block;
 width:400px;
 height:260px;
}

/* JQuery */
#heroBox
{	
    overflow:hidden;
    margin: 0 30px 30px 30px;
 }

#heroFrame
{
    	width:900px;
	height:338px;
	position:relative;
    display:block;
    overflow :hidden;
 }

/* override the root element to enable scrolling */
#heropanes {
	position:relative;
	clear:both;
	width:900px;
	height:338px;
	display:block;
	cursor:pointer;
}

/* override single pane */
#heropanes .item {
	float:left;
	display:block;
	width:900px;
	font-size:14px;
}

/* our additional wrapper element for the items */
#heropanes .items {
	width:20000em;
	position:absolute;
	clear:both;
	margin:0;
	padding:0;
}

#heropanes .img
{
float:left;
}

#heropanes .items .item
{
    position:relative;
    height:338px;
    color:#FFF;
}

#heropanes .items .title
{
    text-align:left;
	background:#000;
	opacity:0.5;

}

#heropanes .items .title, #heropanes .items .titleLink
{
    display:block;
    position:absolute;
	left:0; bottom:0;
	width:100%;
	height:40px;
}

.titleLink
{

    padding-left:40px;
    text-transform:none;
    font-size:18px;
    line-height:40px;
}


#herotabs a 
{
    display:block;
    width:8px;
    height:8px;
    overflow:hidden;
    position:absolute;
    color:Black;
	text-decoration:none;
	border:1px solid  #7F7F7F;
    background:#FFF;
	opacity:0.4;
    z-index:15;
 }



#herotabs a:hover
{
   opacity:0.8;
}


#herotabs a.current
{
    background:#FFCE03;
    color:#FFF;
    opacity:1;
    border:1px solid  #FF9705;
}

#herotabs #t1
{
   	right:8px;
	bottom:8px; 
}

#herotabs #t2
{
   	right:19px;
	bottom:8px; 
}

#herotabs #t3
{
   	right:19px;
	bottom:19px; 
}

#herotabs #t4
{
   	right:8px;
	bottom:19px; 
}


#viewProjects
{
    display:block;
    position:absolute;
	right:0; bottom:0;
	width:200px;
	height:40px;
	padding:0; margin:0;
	background:#000;
	opacity:0.55;

}

#allProjects
{
    position:absolute;
    text-align:center;
	right:0; bottom:10px;
	width:170px;
	text-align:center;
	font-weight:bold;
	color:#FFF;
	text-transform:uppercase;
	font-size:15px;
	margin-right:20px;
	letter-spacing: 3px;

}

.titleLink:hover, #allProjects:hover
{
    color:#C2F92C;
}



/* Our Company */

.teamHeader
{
    margin-top:0;
    color:#1A2F09;
}

#teamSpacer
{
    position:relative;
    overflow:visible;
    float:right;
    width: 550px;
    height:530px;
    border: 1px solid balck;
}

#team
{
    color:#000;
    font-size:13px;
    line-height:19px;
    width:520px;
    height:530px;
    margin-right:-30px;
    position:absolute;
    right:0;
    top:0;
    overflow:hidden;
}

#team h2
{
    font-size:20px;
    line-height:22px;
}

#members
{
    position:relative;
}

#members img {
	margin:0 20px 10px 0;	
	cursor:pointer;	
	width:149px;
}


#members .name
{
    position:absolute;
    top: 0;
    width:110px;
    text-align:right;
    margin-top: 153px; 
    margin-left:10px;
    padding-right:20px;
    height: 30px;
    line-height:2.5em;
    background-color:#FFF;
    opacity:0.7;
    font-weight:bold;
}

#members .caption1
{
      left:0;

}

#members .caption2
{
        left:171px;
}

#members .caption3
{
        left:344px;
}

.description {
	background-color:#edecbc;
	border:1px solid #999;	
	width:450px;
	min-height:140px;
	margin-top:17px;
	-moz-border-radius:4px;
	padding:0 20px 20px 20px;
	z-index:30;
}

.description .arrow {
	width:34px;
	height:34px;
	background:transparent url(/images/yellow.png) repeat scroll 0 -68px;
	margin-top:-28px;
	margin-left:36px;
	font-size:1px;
	position:relative;
}

#geoff .arrow {
	margin-left:210px;	
}

#jason .arrow {
	margin-left:385px;	
}


#approachFrame
{
	width:900px;
	height:338px;
	position:relative;
	left:0;
	top:0;
    overflow:hidden;
 }

/* override the root element to enable scrolling */
.approachs {
	position:relative;
}


.approachs .item
{
    color:#000;
    position:absolute;
    left:0;
    top:0;
}

.aContent
{
    position:static;
}

.aContent .item
{
    position:static;
}

.aContent .shortcut
{
    border: 1px  #375811;
    border-style:dashed;
    height:30px;
    line-height:30px;
    padding:0 15px;
    margin: 20px 0 30px 0;
}

#content .shortcut a
{
    color:#375811;
    font-size:11px;
    font-weight:bold;
    text-transform:uppercase;
    letter-spacing:1px;
}

#content .shortcut a:hover
{
    color:#96AF78 !important;
}


.shortcut .space
{
    display:inline-block;
    width:24px;
}

.cn .shortcut
{
    height:40px;
    line-height:40px;
    padding:0 50px;
}

.cn #content .shortcut a
{
    color:#375811;
    font-size:14px;
}


.cn .shortcut .space
{
    display:inline-block;
    width:91px;
}

/* root element for tabs */
.apBar {
    position:absolute;
	width:900px;
	height:25px;
	top:313px;
}

#approachMask
{
    position:absolute;
    width:900px;
    height:25px;
    bottom:25px;
    background:transparent url(/images/gradient-mask-black.png) repeat scroll 0 0;
    overflow:visible;
}


#approachBar
{
	background:#000;
	opacity:0.65;

}

#approachTabs .tab
{
    position:absolute;
    bottom:0;
}

#approachTabs #t1 { left:15px;}
#approachTabs #t2 { left:200px;}
#approachTabs #t3 { right:270px;}
#approachTabs #t4 { right:20px;}

#approachTabs a 
{

    width:204px;
    text-align:center;
	text-decoration:none;
    font-size: 1.7em;
    line-height: 50px;
    font-family:Georgia,"Times New Roman",Times,serif;
    color:#FFF;
}


.cn #approachTabs #t1 { left:45px;}
.cn #approachTabs #t2 { left:250px;}
.cn #approachTabs #t3 { right:250px;}
.cn #approachTabs #t4 { right:45px;}


#approachTabs a.current
{
   line-height: 73px;
   text-transform:uppercase;
   font-weight:bold;
   font-style:oblique;
}

#approachTabs a:hover
{
       line-height: 73px;
}

#navBar
{
    height: 30px;
}

#navBar a
{
   display:inline-block;
   display:none;
   cursor:pointer;
}

#nextApproach
{
    float:right;
}

#top
{
    float:left;
}


#navBar a:hover
{
    color:#96AF78;
}

/* panes */

.projectLink
{
    display:block;
    width:181px;
    height:136px;
    float:left;
    margin-left:18px;
    background-color:#000;
    position:relative;
}

.projectLink:hover .project
{
    opacity:1;
}

img.project
{
    position:absolute;
    left:0;
    right:0;
    width:179px;
	border:1px solid #355511;
	opacity:0.6;
}

#mapBox
{	
 overflow:hidden;

 }
 
#mapFrame
{
	position:relative;
	width:900px;
	height:338px;
    overflow :hidden;
 }

/* override the root element to enable scrolling */
#mappanes {
	position:absolute;
	clear:both;
	width:900px;
	height:338px;
    overflow:hidden;
}

/* override single pane */
#mappanes .item {
	position:absolute;

	display:block;
	width:900px;
		height:338px;
}

#mappanes .img
{
    float:left;
}


/* root element for tabs */
#mapTabs {
	
	/* dimensions */
	    position:absolute;
		left:0;
	top:0;    
	display:block;
	width:100%;
}

/* a- tag inside single tab */
#mapTabs a 
{
    position:absolute;
	text-decoration:none;
	background-repeat:no-repeat;
}

#mapTabs a#China 
{
    left:154px;
    top:7px;
    width:168px;
    height:130px;
    background-image:url("/images/blank.gif");
    background-position: 0 0;
}

#mapTabs a#China:hover
{

    background-position: 0 -10px;
}



#mapTabs a#Pakistan 
{
    left:119px;
    top:76px;
    width:47px;
    height:45px;
    background-image:url("/images/blank.gif");

}

#mapTabs a#Pakistan:hover
{

     background-position: -25px -146px;
}


#mapTabs a#Cambodia 
{
    left:234px;
    top:143px;
    width:15px;
    height:14px;
    background-image:url("/images/blank.gif");
    background-position: 0 0;

}

#mapTabs a#Cambodia:hover
{
        background-position: -80px -146px;
}

#mapTabs a#Malaysia 
{
    left:227px;
    top:163px;
    width:55px;
    height:22px;
    background-image:url("/images/blank.gif");
    background-position: 0 0;
}

#mapTabs a#Malaysia:hover
{

    background-position: -73px -166px;
}

#mapTabs a#Singapore 
{
    left:236px;
    top:179px;
    width:3px;
    height:3px;
    background-image:url("/images/blank.gif");
    background-color:#c4e594;
    background-position: 0 0;
    border: 1px solid #96af8b;
}

#mapTabs a#Singapore:hover
{

    background-image:url("/images/singapore.png") !important;
    background-position: 0 0;    
    left:177px;
    top:145px;
    width:128px;
    height:68px;
    border: 0;
}



#mapTabs a#Australia
{
    left:261px;
    top:212px;
    width:115px;
    height:108px;
    background-image:url("/images/blank.gif");
    background-position: 0 0;
}

#mapTabs a#Australia:hover
{

    background-position: -107px -215px;
}


#mapTabs a:hover
{
    background-image:url("/images/world-map-on.png") !important;
	background-repeat:no-repeat;
}

.item#bgItem
{

    left: auto;
    right: 0;
    width:400px;
    background:#000;
	opacity:0.80;
}

.item#portfolioPanel
{
    margin:20px 20px 30px 30px;
    left: auto;
    right: 0;
    width:350px;
}

.item#portfolioPanel h2
{
    margin:0; padding:0;
    margin-bottom:10px;
}

.item#country
{
    color:#FFF;
    display:none;
    width:500px;
    text-align:center;
    font-size:4em;
    line-height:5.5em;
    letter-spacing:4px;
    font-weight:bold;
    text-transform:uppercase;
    cursor:crosshair;
}


#portfolio
{
    padding: 3px;
    overflow-x:hidden;
    overflow-y:auto;
    height:250px;
}

#portfolio a
{
    font-weight:bold;
}


#portfolio a.link
{
    font-weight:bold;
    color:#C2F92C;
}


#portfolio a span
{
    display:block;
    color:#3A6B12;
    font-size:0.8em;
    margin-bottom:1em;
}

/* Gallery */
#galleryFrame
{
   	width:320px;
	height:240px;
	position:absolute;
	top:50px;
	right:90px;
    border:1px solid #CFCFCF;
    background-color:#DFDFDF;
    padding: 5px;
}


#gallery {
	position:relative;
	clear:both;
	width:320px;
	height:240px;
	    overflow :hidden;
	cursor:pointer;
}

#gallery .item {
		position:absolute;
		top:0; left:0;
}

#galleryItems {
	position:absolute;
	right:-14px;
	top:5px;
}

#galleryItems a 
{
    position:relative;
    display:block;
    margin-bottom: 3px;
    color:#FFF;
	text-decoration:none;
	border:1px solid  #7F7F7F;
	width:7px; height:7px;
    background:#FFF;
    overflow:hidden;
	opacity:0.4;
}



#galleryItems a:hover
{
   opacity:0.9;
}


#galleryItems a.current
{
    background:#FFCE03;
    color:#FFF;
    opacity:1;
    border:1px solid  #FF9705;
}

#viewGallery
{
    display:block;
    position:absolute;
	right:-12px; _right:-18px; 
	bottom:10px;
	background:#FFF;
   	width:7px; height:7px;
    font-size:16px;
	line-height:12px;
	color:#5F5F5F;
    border-top:1px solid  #8F8F8F;
	border-left:1px solid  #8F8F8F;
}

#viewGallery:hover
{
    color:#FF9A06;
}


.yearTitle
{
    text-indent:40px;
    letter-spacing: 10px;
    font-size:40px;
    font-weight:bolder;
}

.yearList {
	padding:15px 0 28px 0;
	background:url(/images/bg_timeline.png) repeat-y 120px
}

.mainlink
{
    margin-top:10px;
}

#mediaList li 
{
    display:block;
    list-style:none;
    padding: 0 10px 30px 0;
    margin: 0 30px 0 0;
}

#mediaList .date 
{
    position:relative;
    float:left;
	width:130px;
	text-align:right;
	background:url(/images/bg_timenode.png) no-repeat right;
}		

.date span
{
    margin-right:20px;
}

#mediaList .listing 
{
    position:relative;
    display:block;	
	margin-left:200px;
}

#mediaList .listing h4
{
    position:static;
    margin:0;
    padding:0;
}
