body { 
	background: #FFFFFF;
	color: #666666;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9pt;
	line-height: 1.5em;
	font-stretch: wider;
	margin-top: 100px;
	}

/* ----------container to center the layout-------------- */	
#container {
	width:909px;
	height: 500px;
	margin:0 auto;
	background: #FFFFFF;
	padding: 0;
	}

/* ----------top header-------------- */
#topheader {
	width:909px;
	height:33px;
	background: #FFFFFF;
	margin:0 auto;	
	padding: 3px 0 3px 0;
	}
/* ----------div for logo-------------- */
#logo {
	float: left;
	/*background: #ffffff url(http://www.tangerinepictures.com.my/images/logo-tangerine.gif) no-repeat;*/
}

#logo img {padding:0;} 

/* Menu */

#menu {
	float: right;
	width: 700px;
	height: 33px;
	background: #FFFFFF;
}

#menu ul {
	list-style: none;
	line-height: normal;
	float: right;
}

#menu li {
	display: inline;
	text-align: center;
	float: left;
}

#menu a {
	display: block;
	height: 20px;
	padding: 5px 20px 0 20px;
	text-align: center;
	text-transform: uppercase;
	font-size: 11px;
	font-weight: bold;
	color: #FF6600;
}

#menu a:hover, #menu .active a {
	color: #FFFFFF;
	background-color: #FF6600;
}

/* ----------top bar-------------- */
#topbar {/*where the logo sits*/
	width:909px;
	height:1px;
	background-color: #FF6600;
	margin:3px 0 2px 0;
	}

/* ----------bottom bar-------------- */
#bottombar {/*where the logo sits*/
	width:909px;
	height:1px;
	background-color: #FF6600;
	margin:0px 0 5px 0;
	}


/* ----------main content-------------- */
#content {
	padding: 0 0 0 0;
	/*border: 1px solid #CCC;*/
	height: 322px;
	width: 909px;
	}
	
#content-main {
	padding: 0;
	background: url(../images/bgp-main.gif) no-repeat;
	height: 322px;
	width: 909px;
	}
	
#content-about {
	padding: 0;
	background: url(../images/bgp-about.gif) no-repeat;
	height: 322px;
	width: 909px;
	}

#content-people {
	padding: 0;
	background: url(../images/bg-who.gif) no-repeat;
	height: 322px;
	width: 909px;
	}
	
#content-works {
	padding: 0;
	background: url(../images/bgp-portfolio.gif) no-repeat;
	height: 322px;
	width: 909px;
	}
	
#content-work {
	padding: 0px;
	padding-top: 20px;
	height: 322px;
	background-color:#FFFFFF; 
	width: 909px;
	}

#content-services {
	padding: 0;
	background: url(../images/bgp-services.gif) no-repeat;
	height: 322px;
	width: 909px;
	}

#content-pledge {
	padding: 0;
	background: url(../images/bgp-solutions.gif) no-repeat;
	height: 322px;
	width: 909px;
	}

#content-contact {
	padding: 0;
	background: url(../images/bg-contact.gif) no-repeat;
	height: 322px;
	width: 909px;
	}
	
/* --- portfolio ---*/

div.mainfolio
{
  margin: 2px;
  border: 4px solid #eeeeee;
  height: auto;
  width: auto;
  float: left;
  text-align: center;
}	
div.mainfolio img
{
  display: inline;
  margin: 3px;
  border: 4px solid #eeeeee;
}
div.mainfolio a:hover img {border: 4px solid #cccccc;}
div.desc
{
  text-align: center;
  font-weight: normal;
  width: 280px;
  margin: 5px;
}

div.mainfolio
{
  margin: 2px;
  border: 4px solid #eeeeee;
  height: auto;
  width: auto;
  float: left;
  text-align: center;
}

/* =ThumbNav
----------------------------------------------- */

.thumbnav a, .thumbnav strong {
  float:left;
  }
.thumbnav img {
  display:block;
  border:5px solid #eee;
  }
.thumbnav strong img {
  border-color:#eee;
  }
.thumbnav a:hover img {
  border-color:#ccc;
  }


/* ---------- div footer -------------- */
#footer {
	width:909px;
	height:23px;
	background: #FFFFFF;
	margin:0 auto;	
	padding: 0;
	}
	
#footer-left {
	float: left;
	width:300px;	
	font-size: 7.5pt;
	color: #ccc;	
	padding-left: 20px;
	}
	
#footer-right {
	float: right;
	width:500px;	
	font-size: 7.5pt;
	background: #FFFFFF;
	color: #003333;
	padding-right: 10px;
	}

/* general link */	
a:link, a:visited	{ 
	font-family: Arial, Helvetica, Tahoma, verdana, sans-serif;
	font-size: 9pt; 
	color: #666666; 
	text-decoration:none;
	}
	
a:active, a:hover	{ 
	color: #333; 
	text-decoration:none;
	}


.a_footer:link { 
	color:#666; 
	font-size: 7.5pt; 
	text-decoration:none;
}

.a_footer:visited { 
	color:#666; 
	font-size: 7.5pt; 
	text-decoration:none;
}

.a_footer:hover { 
	color:#333; 
	font-size: 7.5pt;
	text-decoration:underline;
}

.a_showcase:link { 
	color:#666; 
	font-size: 7.5pt; 
	text-decoration:none;
}

.a_showcase:visited { 
	color:#666; 
	font-size: 7.5pt; 
	text-decoration:none;
}

.a_showcase:hover { 
	color:#333; 
	font-size: 7.5pt;
	text-decoration:underline;
}

.a_folio:link img{ 
	border:5px solid #eee;
}

.a_folio:visited img{ 
	border:5px solid #eee;
}

.a_folio:hover img{ 
	border:5px solid #ccc;
}



	
#borderbot {/*where the logo sits*/
	width:1000px;
	height:18px;
	background: url(../imago/botborder.gif);
	margin:0 auto;
	}

#pagebordertop {/*where the logo sits*/
	width:1000px;
	height:19px;
	background: url(../imago/pagetborder.gif);
	margin:0 auto;
	margin-top: 100px;
	}
	
#pageborderbot {/*where the logo sits*/
	width:1000px;
	height:18px;
	background: url(../imago/pagebborder.gif);
	margin:0 auto;
	}
	
/* =ThumbNav
----------------------------------------------- */
.thumbnav {
  margin-right:-1em;
  }
.thumbnav ul {
  float:left;
  width:100%;
  padding:.1em 0 .9em;
  }
.thumbnav li {
  display:inline;
  margin:0;
  }
.thumbnav a, .thumbnav strong {
  float:left;
  width: 80px; /* 40/13 */
  margin-right:.769em; /* 10/13 */
  margin-bottom:.769em; /* 10/13 */
  }
.thumbnav img {
  display:block;
  border:5px solid #ccc;
  }
.thumbnav strong img {
  border-color:#fff;
  }
.thumbnav a:hover img {
  border-color:#e9e9e9;
  }
#error .thumbnav {
  padding-left:16em; /* 160/10 */
  }
