body			{ background-color:#000; color:#FFF; font-family:Arial, Helvetica, sans-serif; line-height:15px; text-decoration:none; height:100%; font-size:62.5%; }



a:link {text-decoration: none; color:#424040;}

a:visited {text-decoration: none; color:#424040;}

a:active {text-decoration: underline; color:#424040;}

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



h1				{ font-family:Arial, Helvetica, sans-serif; font-size:1.1em; color:#424040; line-height:20px; text-indent:-8px; }

h2				{ font-family:Arial, Helvetica, sans-serif; font-weight:normal; font-size:0.8em; color:#fff; letter-spacing: 0.4px;}

h3				{ font-family:Arial, Helvetica, sans-serif; font-size:3.0em; font-weight:bold; color:#fff; letter-spacing: 0.4px;}



p				{ font-family:Arial, Helvetica, sans-serif; font-size:1.2em; letter-spacing: 0.4px; }



/* MAIN CONTAINER */

#main-container	{ width:100%; min-height:200px; margin:0 auto; clear:both; background:url(../images/big-bg.jpg) fixed center top;}



/* LOGO */

#logo-holder	{ width:940px; height:134px; display:block; margin:0 auto; }

#logo-bg		{ width:940px; height:80px; background-image:url(../images/menu-shadow.png); margin:0 auto; }



/* MENU */

#menu			{ width:940px; height:134px; background-image:url(../images/menu-bg.png); margin:0 auto; }

#opening		{ width:219px; height:16px; background-image:url(../images/opening.png); float:left; margin:7px 0 0 20px;}

#menu-separator	{ width:136px; height:31px; background-image:url(../images/separator.png); float:right; margin-right:80px;}



/* sprite navigasi menu */

#nav-menu		{ position:relative; float:right; margin-right:45px; margin-top:9px;}

#nav-menu li	{ margin:0; padding:0; list-style:none; position:absolute; top:0; }

#nav-menu li, #nav-menu a { height:31px; display:block; }



#home{ left:0;width:46px; }

#home{ background:url(../images/menu.png) 0 32px; }

#home a:hover{ background: url(../images/menu.png) -1px 2px; }



#about{ left:46px;width:58px; }

#about{ background:url(../images/menu.png) 218px 32px; }

#about a:hover{ background: url(../images/menu.png) -43px 2px; }



#portfolio{ left:104px;width:72px; }

#portfolio{ background:url(../images/menu.png) 160px 32px; }

#portfolio a:hover{ background: url(../images/menu.png) -101px 2px; }



#contact{ left:180px;width:60px; }

#contact{ background:url(../images/menu.png) 83px 32px; }

#contact a:hover{ background: url(../images/menu.png) -178px 2px; }





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



/* BANNER */

#banner-holder	{ width:100%; height:230px; display:block; margin:0 auto; clear:both;}

#banner			{ width:920px; height:210px; border: solid #000 10px; margin:0 auto; position:relative; background:#000; }

#tag-banner		{ width:187px; height:63px; background:url(../images/tag-banner.png) 0 -5px no-repeat; position:absolute; top:0; left:700px; z-index:9999; }

#button-left	{ width:58px; height:58px; background:url(../images/button-left.png) no-repeat; float:left; margin-top:76px; }

#button-right	{ width:58px; height:58px; background:url(../images/button-right.png) no-repeat; clear:both; float:right; margin-top:-58px; }



/* CONTENT */

#content-holder	{ width:940px; display:block; margin:0 auto; clear:both; }



#core-services	{ width:662px; height:69px; background:url(../images/core-services.png) 0 37px no-repeat; border-bottom:#FFF solid 1px; clear:both; }



#content-left	{ width:684px; min-height:150px; float:left; }

#services-holder{ width:684px; min-height:350px; clear:both; margin-top:20px; margin-left:-9px;}

#services-1		{ width:228px; min-height:350px; float:left; }

#services-2		{ width:225px; min-height:350px; float:left; margin-left:1px; }

#services-3		{ width:229px; min-height:350px; float:left; margin-left:1px;}

.row-1			{ width:224px; min-height:130px; background:url(../images/black-box.png) no-repeat; margin:0 auto; padding:4px 0 0 9px }

.box-content	{ width:203px; height:100px; clear:both;}

.row-2			{ width:209px; height:175px; margin:0 auto; line-height:18px;}

.row-3			{ width:209px; min-height:50px; background:url(../images/orange-bar.png) no-repeat; margin-left:8px; margin-top:20px; padding-top:8px; text-indent:15px; }

.row2-1			{ width:224px; min-height:130px; background:url(../images/black-box.png) no-repeat; margin:0 auto; padding:4px 0 0 9px }

.row2-2			{ width:209px; min-height:135px; margin:0 auto; line-height:18px; }

.row2-3			{ width:209px; min-height:50px; background:url(../images/orange-bar.png) no-repeat; margin-left:8px; margin-top:20px; padding-top:8px; text-indent:15px; }

span.black		{ color:#424040; font-size:1.2em; letter-spacing: 0.4px; }

span.white		{ color:#ffffff; font-size:1.2em; letter-spacing: 0.4px; }

span.orange		{ color:#f6b961; font-size:1.2em; letter-spacing: 0.4px; }



#content-right	{ width:256px; min-height:200px;  float:right; }

#twitter		{ width:256px; height:179px; background:url(../images/twitter.png) 32px 68px no-repeat; clear:both;}

#twitter-text	{ float:left;height:80px;margin-left:40px;margin-top:75px;width:210px;}

.latest-tweet   { width:80%; float:right; height:75px; font-size:1.1em; margin-top:0px; overflow:hidden; }

.tweet-profile   { width:20%; float:left; height:50px; width:40px; display:block; padding:3px 0 0 0; background:url(../images/twitter_32.png) -3px 10px no-repeat; }

.tweet-profile a { font-size:1.1em; color:#424040; text-decoration:none; }

.tweet-profile a:hover { font-size:1.1em; color:#fff; text-decoration:none; }



ul#twitter_update_list li a { /* timestamp link */text-decoration: underline;color:#424040;}

ul#twitter_update_list li a:hover { /* timestamp link */ color:#fff;}

p#preloader { float:right; margin: -25px 0 8px 0; padding:0 0 0 3em;  width:65%; background: transparent url("../images/ajax-loader.gif") 1em center no-repeat; }



#about-a3ru		{ width:256px; height:48px; background:url(../images/about-a3ru.png) 0 15px no-repeat; border-bottom:#FFF solid 1px; clear:both; }

#about-a3ru-text{ width:256px; min-height:100px; margin-top:15px; line-height:18px;}

#about-a3ru-link{ width:256px; height:64px;  padding-top:10px; }





/* ---------------------------------------------------------------------------------- End HOME -- */



/* ------------------------------------- PORTFOLIO -------------------------------------------------- */



#tag-portfolio		{ width:187px; height:109px; background:url(../images/tag-portfolio.png)  no-repeat; margin-top:4px; clear:both; float:right; }

#tag-about		{ width:187px; height:109px; background:url(../images/tag-about.png)  no-repeat; margin-top:4px; clear:both; float:right; }

#tag-pl		{ width:187px; height:109px; background:url(../images/tag-pl.png)  no-repeat; margin-top:4px; clear:both; float:right; }



#portfolio-holder	{ width:940px; display:block; margin:0 auto; clear:both; }

.portfolio		{ width:940px; height:240px; margin:20px 0 20px 0; }



.col-port-1		{ width:289px; height:240px; background:url(../images/square-box.png) 15px 23px no-repeat; clear:both; float:left; }

.row-port-1		{ width:126px; height:97px; background:url(../images/label.png) no-repeat; margin-top:-213px; position:absolute;}

.row-port-2		{ width:257px; height:197px; background-color:#CCC; margin-left:21px; margin-top:29px; }

.text-port-1	{ width:126px; height:97px; text-align:center; padding-top:20px; font-size:1.2em; font-weight:bold; letter-spacing:0.2em; }



.col-port-2		{ width:651px; height:240px; float:right;}

.row-port-3		{ width:651px; height:35px;  padding:0 0 0 15px; }

.row-port-4		{ width:636px; height:131px; padding-top:0px; margin-bottom:8px; padding:0 0 0 15px; line-height:18px;}

.row-port-5		{ width:503px; height:30px; background:url(../images/black-bar.png) no-repeat; margin:0 0 0 15px; }

.row-port-6		{ width:110px; height:32px; background:url(../images/orange-box.png) no-repeat; clear:both; float:right; text-decoration:none;}

.text-port-2	{ width:490px; height:30px; padding-top:6px; padding-left:15px; font-size:1.1em; font-style:italic; letter-spacing:0.1em; }

.text-port-3	{ width:110px; height:30px; color:#424040; padding-top:6px; padding-left:12px; font-weight:bold; font-size:1.1em; letter-spacing:0.1em; text-decoration:none; }



/* ------------------------------------- End PORTFOLIO -------------------------------------------------- */





/* ------------------------------------- CONTACT -------------------------------------------------- */

#tag-contact		{ width:187px; height:109px; background:url(../images/tag-contact.png)  no-repeat; margin-top:4px; clear:both; float:right; }



.col-board { width:820px; height:460px; display:block; background:url(../images/board.jpg) no-repeat; margin-top:10px; padding:50px 0 0 120px; float:left;   }

#engpon		{ width:820px; height:150px; font-size:1.2em; margin-left:10px;}

.col-form { width:660px; height:460px; display:block; background:url(../images/input-form.png) no-repeat; float:left;  }



ul li input.inputName        { border:none; background:transparent; width:270px; height:27px; color:#fff; margin:59px 0 0 20px; float:left; padding:0 0 0 10px; font-style:italic; }

ul li input.inputEmail       { border:none; background:transparent; width:270px; height:27px; color:#fff; margin:59px 0 0 65px; float:left; padding:0 0 0 10px; font-style:italic;}

ul li textarea.inputMessage  {  border:none; background:transparent; width:605px; height:168px; color:#fff; margin:75px 0 0 20px; float:left; padding:10px 0 0 10px; font-style:italic; }

ul li a.btnSend              {  background:url(../images/btnSend.png) no-repeat;  width:88px; height:37px; display:block; margin:10px; }

ul li.clear                   { clear:both; height:5px; }



/* ------------------------------------- End CONTACT -------------------------------------------------- */





/* ------------------------------------- ABOUT -------------------------------------------------- */



.what{ margin-bottom:500px; float:left; }

.how{ margin-bottom:500px; float:left;  }

.col-boardHeading {  width:933px; height:30px; margin-left:3px; border-bottom:1px solid #fff; display:block; clear:both; margin-bottom:10px; }

.col-content      {  width:875px; height:440px;  clear:both;  margin:-22px 0 0 -88px;}

.col-1{ width:291px; height:440px; float:right }





/* ------------------------------------- End ABOUT -------------------------------------------------- */



/* FOOTER */

#footer-holder	{ width:100%; height:265px;  clear:both; }

#footer			{ width:940px; height:39px; margin:0 auto; background:url(../images/lamp.png) no-repeat;  padding-top:198px; position:relative;}



#footer-text { width:670px; height:40px; background:url(../images/tagline.png) no-repeat; float:left; margin-top:-90px;}

#footer-info	{ width:574px; height:31px; background-image:url(../images/footext.png); clear:both; }

/* ------------------------------------- SEND-EMAIL.PHP -------------------------------------------------- */

#main-confirmation	{ width:400px; height:320px; margin:0 auto; background-color:#F0A73F; padding-left:20px; padding-top:20px; margin-top:150px;}

.heading-1 		{ width:940px; min-height:50px; margin:0 auto; font-size:2.2em; font-weight:bold;}
.heading-2 		{ width:940px; min-height:100px; margin:0 auto; font-size:1.4em; font-weight:bold; line-height:20px; }

li 		{ list-style:disc; }
fieldset ul li	{ list-style:none;}

/* ------------------------------------- End SEND-EMAIL.PHP -------------------------------------------------- */

/* TEMP */
#demotip {
	display:none;
	background:transparent url(../js/jquery.tooltip/black_arrow.png) 0 10px no-repeat;
	font-size:1.5em; line-height:1.5em;; font-weight:bold; letter-spacing:0.2em;
	height:70px; margin-top:-8px; margin-left:0px; text-align:center;
	width:160px;
	padding-top:30px; padding-bottom:25px; padding-left:25px; padding-right:25px; 
	color:#FFF;	
}
 
#demo img { /* style the trigger elements */
	border:0;
	cursor:pointer;
	margin:0 8px;
}