/* CSS Document */
body {
	background: #554D49;
	color: #B6B6B6;
	font: 14px/20px Trebuchet MS, Arial, Helvetica, sans-serif;
	padding: 0px;
	margin: 0px;
}

div, p, ul, h2, h3, h4, img {
	padding: 0px;
	margin: 0px;
}

ul {
	list-style-type: none;
}

/*----TOP PANEL----*/
#maintopPan {
	height: 322px;
	background: url(images/topbg.gif) 0 0 repeat-x;
}

#logoPan {
	position: relative;
	width: 778px;
	height: 63px;
	background: url(images/logopanel-bg.gif) 0 0 no-repeat;
	color: #FFFFFF;
	font-size: 36px;
	font-weight: bold;
	font-family: Trebuchet MS;
	line-height: 70%;
	text-align: center;
	text-transform: uppercase;
	padding-top: 20px;
	margin: 0 auto;
}

#logoPan span {
	font-size: 0.3em;
	font-weight: normal;
	letter-spacing: 2px;
}

#headerPan{width:660px; height:189px; position:relative; margin:0 auto; background:url(images/header.jpg) 100% 0 no-repeat; padding:16px 0 0;}

#headerPan ul{width:75px;}

#headerPan ul li{width:75px; height:51px;}
#headerPan ul li.sidenavpadding{padding:18px 0 0;}

#headerPan ul li.home a{width:75px; height:51px; display:block; background:url(images/home-normal.gif) 0 0 no-repeat; text-indent:-20000px;}
#headerPan ul li.home a:hover{background:url(images/home-hover.gif) 0 0 no-repeat;}

#headerPan ul li.aboutus a{width:75px; height:51px; display:block; background:url(images/aboutus-normal.gif) 0 0 no-repeat; text-indent:-20000px;}
#headerPan ul li.aboutus a:hover{background:url(images/aboutus-hover.gif) 0 0 no-repeat;}

#headerPan ul li.contact a{width:75px; height:51px; display:block; background:url(images/contactus-normal.gif) 0 0 no-repeat; text-indent:-20000px;}
#headerPan ul li.contact a:hover{background:url(images/contactus-hover.gif) 0 0 no-repeat;}
/*----TOP PANEL----*/

/*----MENU PANEL----*/
#menuPan {
	position: relative;
	width: 778px;
	height: 34px;
	font-family: Arial, Helvetica, sans-serif;
	margin: 0 auto;
}

#menuPan ul{width:570px; height:34px; position:absolute; top:0px; left:149px;}
#menuPan ul li{float:left; text-align:center; line-height:34px; font-weight:bold;}

#menuPan ul li.client{width:69px; height:34px; background:url(images/client-hover.gif) 0 0 no-repeat #fff; color:#332D2B;}
#menuPan ul li.client a{width:69px; height:34px; display:block; background:url(images/client-normal.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}
#menuPan ul li.client a:hover{background:url(images/client-hover.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}

#menuPan ul li.testimonials{width:119px; height:34px; background:url(images/testimonials-hover.gif) 0 0 no-repeat #fff; color:#332D2B;}
#menuPan ul li.testimonials a{width:119px; height:34px; display:block; background:url(images/testimonials-normal.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}
#menuPan ul li.testimonials a:hover{background:url(images/testimonials-hover.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}

#menuPan ul li.services{width:98px; height:34px; background:url(images/services-hover.gif) 0 0 no-repeat #fff; color:#332D2B;}
#menuPan ul li.services a{width:98px; height:34px; display:block; background:url(images/services-normal.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}
#menuPan ul li.services a:hover{background:url(images/services-hover.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}

#menuPan ul li.projects{width:96px; height:34px; background:url(images/projects-hover.gif) 0 0 no-repeat #fff; color:#332D2B;}
#menuPan ul li.projects a{width:96px; height:34px; display:block; background:url(images/projects-normal.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}
#menuPan ul li.projects a:hover{background:url(images/projects-hover.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}

#menuPan ul li.solutions{width:103px; height:34px; background:url(images/solutions-hover.gif) 0 0 no-repeat #fff; color:#332D2B;}
#menuPan ul li.solutions a{width:103px; height:34px; display:block; background:url(images/solutions-normal.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}
#menuPan ul li.solutions a:hover{background:url(images/solutions-hover.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}

#menuPan ul li.markets{width:85px; height:34px; background:url(images/market-hover.gif) 0 0 no-repeat #fff; color:#332D2B;}
#menuPan ul li.markets a{width:85px; height:34px; display:block; background:url(images/market-normal.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}
#menuPan ul li.markets a:hover{background:url(images/market-hover.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}
/*----/MENU PANEL----*/

/*----BODY TOP PANEL----*/
#mainbodytop {
	background: url(images/bodytopbg.gif) 0 0 repeat-x #3B3532;
	color: #B6B6B6;
	margin: 0 auto;
	border: 0px solid #FFFFFF;
}

#bodytop {
	position: relative;
	width: 588px;
/*	height: 224px;*/
	font-family: Trebuchet MS;



	margin: 0 auto;
	padding: 22px 0px 10px 100px;
	border: 0px solid #FFFFFF;
}

#bodytop h2 {
	width: 588px;
	height: 60px;
	background: url(images/image1.gif) 250px 25px no-repeat #3C3633;
	font-family: Arial, Helvetica, sans-serif;
	color: #D5D5D5;
	font-size: 30px;
	line-height: 60px;
	font-weight: normal;
}

#bodytop p span.yellow {
	background: #3C3633;
	color: #FFD900;
}
/*---- BODY TOP PANEL ----*/

/*----BODY PANEL----*/
#mainbody {
	background: url(images/bodybg.gif) 0 0 repeat-x #554D49;
	color: #B6B6B6;
	margin: 0 auto;
	padding: 40px 0px 0px 0px;
	border: 0px dotted #FFFFFF;
}

#mainbody a {
	color: #B6B6B6;
	background: #554D49;
	text-decoration: underline;
}

#mainbody a:hover {
	color: #FFD900;
	text-decoration: none;
}

#mainbody p {
	margin: 0px 0px 0px 170px;
}

/*---- FOOTER PANEL ----*/
#footermainPan {
	clear: both;
	height: 170px;
	background: url(images/footerbg.gif) 0 0 repeat-x #24201E;
	color: #fff;
	font: 13px/20px "Trebuchet MS",Arial, Helvetica, sans-serif;
	padding: 70px 0px 0px 0px;
	border: 0px solid #FFFFFF;
	text-align: center;
}

#footerPan {
	position: relative;
	width: 650px;
	height: 160px;
	text-align: left;
	margin: 0 auto;
	border: 0px dotted #FFFFFF;
}

#footerPan ul {
	position: relative;
	width: 650px;
	height: 20px;
	text-transform: uppercase;
	text-align: center;
	margin: 0 auto;
}

#footerPan li {
	float: left;
}

#footerPan ul li a {
	padding: 0 10px 0;
	color: #fff;
	background: #24201E;
	text-decoration: none;
	font-size: 12px;
}

#footerPan ul li a:hover {
	text-decoration: underline;
}

#footerPan p.copyright {
	clear: both;
	position: relative;
	width: 650px;
	margin: 0 auto;
	padding: 10px 0px 0px 0px;
	font-size: 0.8em;
	color: #B6B6B6;
	line-height: 110%;
}

#footerPan a {
	color: #B6B6B6;
/*	color: #FFFFFF;*/
	text-decoration: none;
}

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

#footerPanhtml {
	position: absolute;
	top: 148px;
	left: 240px;
	width: 63px;
	height: 23px;
	display: block;
	border: 0px solid #FFFFFF;
}

#footerPanhtml a {
	width: 63px;
	height: 23px;
	display: block;
	background: url(images/html-normal.gif) 5px 0 no-repeat #FFD900;
	color: #685900;
	font-size: 13px;
	line-height: 23px;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
	padding:0 0 0 10px;
}

#footerPanhtml a:hover {
	background: url(images/html-hover.gif) 5px 0px no-repeat #FFD900;
	color: #24201E;
}

#footerPancss {
	position: absolute;
	top: 148px;
	left: 315px;
	width: 45px;
	height: 23px;
	display: block;
}

#footerPancss a {
	width: 45px;
	height: 23px;
	display: block;
	background: url(images/css-normal.gif) 0px 0 no-repeat #009FC2;
	color: #fff;
	font-size: 13px;
	line-height: 24px;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
	padding:0 0 0 10px;
}

#footerPancss a:hover {
	background: url(images/css-hover.gif) 0px 0 no-repeat #009FC2;
	color: #fff;
	text-decoration:none;
}

/*---- FOOTER PANEL ----*/


/********* PUNYA KITA ***/
#blok-teks {
	clear: both;
	width: 650px;
	background: url(images/date.gif) 0 0 no-repeat #554D49;
	margin: 0px 0px 0px 170px;
	padding: 0px 0px 0px 0px;
	border: 1px dotted #554D49;
}

#blok-teks h3 {
	font-size: 14px;
	color: #009FC2;
	text-transform: uppercase;
	margin: 10px 0px 0px 52px;
}

#blok-teks h3 span {
	font-size: 1.3em;
	color: #F4D000;
	font-weight: normal;
	text-transform: lowercase;
}

#blok-teks a {
	color: #CECCCC;
	text-decoration: underline;
}

#blok-teks a:hover {
	color: #FFD900;
	text-decoration: none;
}

#blok-teks p {
	margin: 15px 0px 10px 0px;
}

#blok-teks p a {
	color: #CECCCC;
	text-decoration: underline;
}

#blok-teks p a:hover {
	color: #FFD900;
	text-decoration: none;
}

#blok-teks p span {
	color: #CECCCC;
	text-decoration: underline;
}

#blok-teks p span.kuning {
	color: #FFD900;
}

#blok-teks p.slogan {
	font-size: 2.0em;
	font-weight: normal;
	text-transform: lowercase;
	margin-top: 40px;
	margin-bottom: 30px;
}

#blok-teks p.lengkap {
	display: block;
	width: 100px;
	height: 22px;
	color: #009FC2;
	font-weight: normal;
	text-transform: lowercase;
	text-decoration: none;
	margin-top: 30px;
	padding: 0px 0px 0px 10px;
	background: url(images/arrow-normal.gif) 85px 3px no-repeat #24201E;
}

#blok-teks p.lengkap a {
	display: block;
	width: 100px;
	height: 20px;
	color: #009FC2;
	text-decoration: none;
	padding: 0px 0px 0px 0px;
	background: url(images/arrow-normal.gif) 75px 3px no-repeat #24201E;
}

#blok-teks p.lengkap a:hover {
	color: #009FC2;
	text-decoration: none;
	background: url(images/arrow-hover.gif) 75px 3px no-repeat #24201E;
}

#blok-teks ul {
	margin: 0px 30px 0px 30px;
	position: relative;
	list-type: square;
}

#blok-teks li {
	list-type: square;
	padding: 0 0 0px 0;
}

#blok-teks ul li a {
	text-decoration: underline;
}

#blok-teks ul li a:hover {
	text-decoration: none;
}

#pembatas {
	clear: both;
	width: 650px;
	height: 40px;
	float: left;
	display: block;
	background: url(images/dot-line.gif) 0 20px repeat-x;
	margin: 0px 0px 0px 170px;
}

#judul {
	clear: both;
	width: 650px;
	display:block;
	font-size: 36px;
	font-weight: normal;
	background: #554D49;
	color: #D5D5D5;
	line-height: 110%;
	padding: 10px 0px 40px 0px;
	margin: 0px 0px 0px 170px;
}

#fotoKanan {
	float: right;
	margin: 20px 0px 30px 60px;
}

#fotoKiri {
	float: left;
	margin: 20px 60px 30px 0px;
}

#line-space {
	line-height: 140%;
}

/*** ADSENSE ***/
#ads336 {
	width: 336px;
	height: 280px;
	float: left;
	margin: 5px 60px 30px 0px;
	border: 0px solid #FFFFFF;
}

#ads468 {
	width: 468px;
	height: 60px;
	margin: 10px 0px 10px 0px;
	border: 0px solid #FFFFFF;
}

#ads728 {
	width: 728px;
	height: 90px;
	margin: 10px 0px 20px 0px;
	border: 0px solid #FFFFFF;
}

#ads160 {
	width: 160px;
	height: 600px;
	margin: 20px 0px 30px 25px;
	border: 0px solid #FFFFFF;
}

#firefox {
	width: 125px;
	height: 125px;
	margin-left:25px;
	border: 0px solid #FFFFFF;
}