/* START GLOBAL */
* {
	margin:0;
	padding:0;
}

img {
	display: block;
	border:0;
}

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:70%;
	background-image:url(img/bg.gif);
	background-repeat:repeat;
	color:#666;
}

.clear {
	width:100%;
	font-size: 1px;
	line-height: 1px;
	height:10px;
	clear:both;
}

div>.clear {
	height:15px;
}


a {
	color: #069;
}

a:HOVER {
	color:#06f;
}

#wrap {
	margin:0 auto;
	width:760px;
	background: #fff url(img/bg.gif) no-repeat  100% 0;
	border:1px solid #F0E7E7;
	border-width:0 1px;
}
#standard ul {list-style-type:square;}
/* END GLOBAL */


/* START CSS TOP MENU */
#topmenu { background-image: url(img/topmenuBG.gif); height:33px; padding:0 0 0 10px; margin-top: 0px;}
#topmenu ul { float:left;  list-style-type:none; }
#topmenu ul li { float:left; margin:0 6px 0 0; }
#topmenu ul li a { display:block; text-indent: -9000px; width:57px; height:33px; text-decoration:none; }

#topmenu #mi1 a { background: url(img/Mhome.gif) no-repeat; width:55px; }
#topmenu #mi2 a { background: url(img/Mabout.gif) no-repeat; width:107px; }
#topmenu #mi3 a { background: url(img/Mservices.gif) no-repeat; width:75px; }
#topmenu #mi4 a { background: url(img/Mproduk.gif) no-repeat; width:70px; }
#topmenu #mi5 a { background: url(img/Mportfolio.gif) no-repeat; width:86px; }
#topmenu #mi6 a { background: url(img/Mcase.gif) no-repeat; width:92px; }
#topmenu #mi7 a { background: url(img/Mklien.gif) no-repeat; width:55px; }
#topmenu #mi8 a { background: url(img/Mpartner.gif) no-repeat; width:74px; }
#topmenu #mi9 a { background: url(img/Mcontact.gif) no-repeat; width:67px; }


#topmenu #mi1 a:HOVER, #topmenu #mi2 a:HOVER, #topmenu #mi3 a:HOVER, #topmenu #mi4 a:HOVER, #topmenu #mi5 a:HOVER, #topmenu #mi6 a:HOVER, #topmenu #mi7 a:HOVER, #topmenu #mi8 a:HOVER, #topmenu #mi9 a:HOVER { background-position:0 -33px; }
#topmenu #mi1 a.on, #topmenu #mi2 a.on, #topmenu #mi3 a.on, #topmenu #mi4 a.on, #topmenu #mi5 a.on, #topmenu #mi6 a.on, #topmenu #mi7 a.on, #topmenu #mi8 a.on, #topmenu #mi9 a.on { background-position:0 -33px;   }

#version3 { float:right; }
/* END CSS TOP MENU */


/* START CSS HEADER */
#homehdr { height:228px; 	background: url(img/img_home.png); }
#abouthdr { height:152px; 	background: url(img/top_about.jpg) repeat-x; }
#kompetensihdr { height:152px; 	background: url(img/img_kompetensi.png) repeat-x; }
#produkhdr { height:152px; 	background: url(img/img_produk.png) repeat-x; }
#portfoliohdr { height:152px; 	background: url(img/img_portfolio.png) repeat-x; }
#casehdr { height:152px; 	background: url(img/img_portfolio.png) repeat-x; }
#klienhdr { height:152px; 	background: url(img/img_klien.png) repeat-x; }
#partnerhdr { height:152px; 	background: url(img/img_partner.png) repeat-x; }
#kontakhdr { height:152px; 	background: url(img/img_kontak.png) repeat-x; }


/* ====================================================================== >>>> Header */


/* ====================================================================== <<<< center Frame */
#content { padding:10px;  }
#contentLeft { float:left; width:460px; }
#contentLeft p { padding:0 20px 10px 30px; line-height:1.4em; }

#contentRight { float:right; width:230px; }
#contentRight ul { margin:0 0 0 5px; list-style:none; }
#contentRight ul li { background:  url(img/newDesServ.gif) no-repeat; padding:5px 2px 11px 35px; }
#contentRight ul li.port { background:  url(img/bulletnews.gif) no-repeat; }
#contentRight ul li a { color: #60646A; text-decoration:none; }
#contentRight ul li a:HOVER { color: #333; }
/* ====================================================================== >>>> center Frame */


/* ====================================================================== <<<< middle */
#middle { padding:15px; margin-left: 30px;}
h1 { font-size:2em; margin: 0 0 10px 0; color:#31347A;  }
h2 { font-size:1.8em; margin: 0 0 10px 20px; color:#31347A; font-weight:normal;}
h3 { font-size:1.1em;  color:#31347A; }
h4 { font-size:1.1em; color:#666699; }



/* layanan */
.layananThumb { margin-left:10px; margin-right: 10px; float:left;}

.layananThumbPic { display:block; margin:0 15px 0 0; }
.layananThumbPic img { border:2px solid #FFF; }


.layananText { float:left; width:500px; }

.layananThumbEnd { background: url(img/greyshadow.gif) repeat-x; padding:5px 0; width:202px; }
/* layanan */

/* produk */
.productThumb { margin-left:10px; margin-right: 10px; float:left;}

.productThumbPic { display:block; margin:0 15px 0 0; }
.productThumbPic img { border:2px solid #FFF; }


.productText { float:left; width:500px; text-align:justify }
.productText1 { float:left; width:650px; text-align:justify}

.productThumbEnd { background: url(img/greyshadow.gif) repeat-x; padding:5px 0; width:202px; }
/* produk */

/* klien */
.clientThumb { text-align:center; margin-left:10px; float:left;}

.clientThumbPic { display:block; margin:0 15px 0 0; }
.clientThumbPic img { border:2px solid #FFF; }
.clientText { margin-left:100px; float:left; width:400px; }
.clientThumbEnd { background: url(img/greyshadow.gif) repeat-x; padding:5px 0; width:202px; }
/* klien */


/* portfolio */
.portfolioThumb { margin-left:10px; margin-right:10px;  float:left;}

.portfolioThumbPic { display:block; margin:0 15px 0 0; }
.portfolioThumbPic img { border:2px solid #FFF; }


.portfolioText { float:left; width:500px; }

.portfolioThumbEnd { background: url(img/greyshadow.gif) repeat-x; padding:5px 0; width:202px; }
/* portfolio */

#infowrap { position: relative; height:202px; background: url(img/moreImages.gif) no-repeat 100% 100%; }
.info_more { position: absolute; visibility: hidden; }


#middle p { padding:0 0 15px 0; line-height:1.6em; }
#middle p.portintro { padding:0 0 10px 0; }

#middle #intro { background:#F9F6F6; border:1px solid #DCDEDF; padding:5px 10px;  font-size:1.1em; width:420px; margin:0 0 10px 0; }
#middle #intro em { background:#F9F6F6; color:#333; font-weight: bold; }

#middle acronym, #middle abbr { border-bottom:1px dotted #666699; }
#middle em, #content em { font-style: normal; background-color:#FFFF99; color:#333; }

#middle ul { margin:0 0 10px 18px; }
#middle ul li ul { margin:6px 0 14px 18px; }
#middle ul li { margin:0 0 6px 0;  }

#middle ol { margin:0 0 10px 25px; }
#middle ol li { margin:0 0 4px 0; }

#middle dl { margin:0 0 25px 0; }
#middle dt { font-weight: bold; font-size:1.2em; }
#middle dd { margin:0 0 10px 0; }

#middle blockquote { margin:0 0 10px 0; padding:10px 20px; border-left:2px solid #DEDEDE; }

#middle .ext { background: url(img/ext.gif) no-repeat  0 2px; padding:0 0 0 16px;  }
#middle .ext:HOVER { background-image: url(img/extR.gif) ; }


/* contact form */
#contactform fieldset {
	margin:0;
	border:0;
	padding:10px;
	background: url(img/contactBg.gif) no-repeat;
}

#contactform legend {
	padding:0 2px;
	color:#666;
	display:none;
}

#contactform table {
	width:440px;
	margin:0 0 10px 0;
}

#contactform table img {
	background:#A9ABAE;
}

#contactform table caption {
	text-align: left;
	color:#666;
	padding:2px 0;
}

#contactform td {
	vertical-align:top;
	padding:4px 6px;
} 

#contactform td.lbl {
	width:115px;
	padding:6px 6px 4px 6px;
	font-size:1.1em;
}

#contactform td.inp {
	width:320px;
}

#contactform input {
	font-size:0.9em;
}

#contactform input.fill, #contactform textarea.fill { border:0; font: 1.1em "Trebuchet MS", Arial, sans-serif; padding:0 3px;width:300px; background:#fff; color:#666; } 	

#contactform select.fill { padding:0; border:0; font: 1.1em "Trebuchet MS", Arial, sans-serif; width:308px; background:#fff; color:#666; }

#contactform input.fill:focus {
	border:1px solid #31347A;
	font-weight: bold;
}

#contactform #conformsub {
	margin:0 0 10px 120px;
}

/* contact form */
#middle .button { background: #000 url(img/buttonBg.gif) repeat-x; color:#fff; border:0; padding:4px 5px 3px;  font-size: 0.78em; }
#middle .buttonsForce input { background: #000 url(img/buttonBg.gif) repeat-x; color:#fff; border:0; padding:3px 2px 2px; margin:0 1px 2px 0; /*font-size: 0.78em;*/ }

#middle .button:focus { color:#DCDEDF; border:0; padding:5px 5px 2px;  }


#middle .npad { padding:0; }
#middle .padb10 { padding:0 0 10px 0; }
#middle .nmar { padding:0; }
/* ====================================================================== >>>> middle */


/* ====================================================================== <<<< footer */
#footer {
	background: url(img/bgfooter.gif) repeat-x;
	margin:40px 0 0 0;
	height:80px;
}
#fLeft {	float:left; width: 450px; font-size:0.9em; padding:6px 10px; }
#fLeft p { padding:0 0 5px 10px; }
#fLeft strong { font-size:1.1em;  }
#fRight { float:right; width: 200px; font-size:0.9em; text-align:right; padding:10px;}
#footer a {	color:#60646A; }
#footer a:hover {	color:#000; text-decoration:none; }
/* ====================================================================== >>>> footer */

/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}


/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h1 { visibility: hidden; font-size: 18px; width:500px;}

.sIFR-hasFlash h1.norm {  }
.sIFR-hasFlash h1.subtitle { visibility: hidden; font-size: 34px; }
.sIFR-hasFlash h1.port { visibility: hidden; font-size: 34px; }
.sIFR-hasFlash h2 { visibility: hidden; letter-spacing: -9px; font-size: 12px; font-weight: bold; margin:0 0 5px 0; }


.sIFR-hasFlash h2.homeAbout { visibility: hidden;  margin-left:20px;}

.sIFR-hasFlash h2.homeNew { visibility: hidden; letter-spacing: -9px; font-size: 18px; margin:0 0 10px 4px;}

.sIFR-hasFlash h3 { visibility: hidden; letter-spacing: -6px; font-size: 14px; margin:0 0 5px 0; }


/* blog */
.ifl { float:left; margin:0 10px 10px 0; }
.meta { padding:5px 10px; background:#FFFF99; margin:10px 0; }
.post {	margin:0 0 40px 0; }

#search { margin:0 0 20px 0; }
#search label {	display:none; }
.hide {	display:none; }
.thumbnail
{
float: left;
width: 60px;
margin: 0 15px 15px 0;
padding: 5px;
}
.clearboth { clear: both; }