img, div, li, a { 
   behavior: url(/iepngfix.htc) 
}
img{
  border:0;
}

body {
  
   background:#daeaff url(../images/bg-blue.jpg) top center no-repeat;
   
     
   font-family:verdana, arial, sans-serif;
   font-size:10pt;
}

.wrapper{
width : 1000px ;
text-align : left ;
margin-left : auto ;
margin-right : auto ;
position : relative ;
}

/* awal css header */

div.header #logo{
  position:absolute;
  left:92px; 
  top:13px;
}

div.header #smile-sedih{
  position:absolute;
  background:url(../images/smile-sedih-kecil.png) top center no-repeat;
  left:0px; 
  top:8px;
  width:128px;
  height:103px;
}

div.header #smile-stress{
  position:absolute;
  background:url(../images/smile-stress-kecil.png) top center no-repeat;
  left:350px; 
  top:8px;
  width:128px;
  height:103px;
}


div.header #login-pane{
  position:absolute;
  float:right;
  width:550px;
  top:9px;
  right:0px;
  font-family:arial, verdana;
  font-size:9pt;
  font-weight:bolder;
  letter-spacing:1px;
  
  
}

div.header .menu{
	height: 30px;
	position: absolute;
	top: 85px;
	left: 408px;
	width: 580px;
	text-align:right;
}

div.header .menu img{
	opacity:0.7;
}


div.header .menu img:hover{
	opacity: 1.0;
}

div.header .menu img{
  margin-left:10px;
}

#heading{
   position:absolute;
   top:108px;
   left:10px;
   width:665px;
   height:45px;
   background:url(../images/heading-kecil.png) top center no-repeat;
   z-index:2;
}

#smile-happy{
   position:absolute;
   top:130px;
   left:900px;
   width:128px;
   height:100px;
   background:url(../images/smile-happy.png) top center no-repeat;
   z-index:3;
}

/* akhir css header */

div.information-pane{
   position:absolute;
   left:14px;
   top:1250px;
   height:200px;
   width:191px;
   float:left;
   z-index:1;
   background:#b4d5ff;
}


div.information-pane img{
   width:100%;
}

div.information-pane .information-box-header-kiri{
   position:absolute;
   left:0px;
   top:0px;
   width:14px;
   height:14px;
   background:#daeaff;
   z-index:2;
   border:10px solid;
}

div.information-pane .information-box-header-kanan{
   position:absolute;
   right:0px;
   top:0px;
   width:14px;
   height:14px;
   background:#e3efff;
   z-index:2;
}

div.information-pane #kontak-kami h3{
   color:#304d73;
   text-align:center;
}


div.information-pane #kontak-kami #informasi-umum-label{
   margin-left:10px;
   margin-right:10px;
   font-size:0.75em;
   font-weight:600;
   float:left;
   color:#304d73;
   
}

div.information-pane #kontak-kami #informasi-umum-isi{
   font-size:0.75em;
   font-weight:600;
   color:#304d73;
   
}

/* awal main content */
div.main-content{
   position:absolute;
   width:980px;
   height:830px;
   left:20px;
   top:115px;
   
}

div.main-content .content-information{
   position:absolute;
   top:0px;
   left:0px;
   width:99%;
   height:455px;
   background:#fff;
}

div.main-content .content-information #content-information-left{
   padding-top:25px;
   padding-left:20px;
   width:50%;
   height:70%;
}

div.main-content .content-information #content-information-left #content-information-left-gambar{
   position:absolute;
   padding-top:40px;
   padding-left:100px;
}

#slideshow {
   padding-top:25px;
   padding-left:20px;
   position:absolute;
   padding-top:40px;
   padding-left:100px;
   width:50%;
   
}

#slideshow div {
    position:absolute;
    top:60px;
    left:30px;
    z-index:8;
    opacity:0.0;
    width:380px;
    height: 300px;
    background-color: #FFF;
}

#slideshow div.active {
    position:absolute;
    top:60px;
    left:30px;
    z-index:10;
    opacity:1.0;
    width:380px;
    height: 300px;
    background-color: #FFF;
}

#slideshow div.last-active {
    z-index:9;
}

#slideshow DIV IMG {
    margin-left:60px;
    margin-bottom: 10px;
}

#slideshow .heading{
  font-size:13pt;
  font-weight:bold;
  font-family:verdana, arial, tahoma;
  color:#535455
}

#slideshow .narasi{
  font-size:10pt;
  font-family:verdana
  color:#3c3c3c
}


#slideshow-pengumuman div {
   z-index:99;
   position:absolute;
   bottom:0px;
   left:10px;
   color:#f58025;
   font-size:18pt;
   font-weight:bold;
   font-family:arial;
   background-color: #FFF;
   width:850px;
   height:37px;
   background:url(../images/bar-bawah.png) top center repeat-x;  
   padding-top:10px;
}

#slideshow-pengumuman div.active {
    position:absolute;
    bottom:0px;
    left:10px;
    z-index:10;
    opacity:1.0;
}

#slideshow-pengumuman div.last-active {
    z-index:9;
}

div.main-content .content-information #content-information-right{
   position:absolute;
   left: 480px;
   top : 0px;
   width:50%;
   height:90%;
}

div.main-content .content-information .bar-bawah{
   position:absolute;
   left:0px;
   bottom:0px;
   width:100%;
   height:47px;
  background:url(../images/bar-bawah.png) top center repeat-x;
}

div.main-content .content-information .separator{
   position:absolute;
   left:460px;
   top:70px;
   width:6px;
   height:280px;
  background:url(../images/separator.png) top center no-repeat;
}


div.main-content .content-information #content-information-right #langkah{
  position:absolute;
  left:0px;
  top:30px;
  width:398px;
  height:26px;
  background:url(../images/tiga-langkah-mudah.png) top center no-repeat;
}

div.main-content .content-information #content-information-right #langkah2{
   position:absolute;
   left: 0px;
   top : 30px;
   width:100%;
   height:100%;
}

div.main-content .content-information #content-information-right #langkah-1{
  position:absolute;
  top:55px;
  left:20px;
  height:86px;
  width:330px;
  background:#f4f4f4;
  margin-left:25px;
}

div.main-content .content-information #content-information-right #langkah-2{
  position:absolute;
  top:161px;
  left:60px;
  height:86px;
  width:330px;
  background:#f4f4f4;
  margin-right:20px;
  
}

div.main-content .content-information #content-information-right #langkah-3{
  position:absolute;
  top:267px;
  left:50px;
  height:86px;
  width:330px;
  background:#f4f4f4;
  margin-leftt:20px;

}

div.main-content .content-information #content-information-right #keterangan-langkah-1{
  position:absolute;
  top:65px;
  left:120px;
  
  font-family:verdana;
  font-size:9pt;
  font-weight:bold;
}

div.main-content .content-information #content-information-right #keterangan-langkah-2{
  position:absolute;
  top:171px;
  left:120px;
  
  font-family:verdana;
  font-size:9pt;
  font-weight:bold;
}

div.main-content .content-information #content-information-right #keterangan-langkah-3{
  position:absolute;
  top:277px;
  left:120px;
  
  font-family:verdana;
  font-size:9pt;
  font-weight:bold;
}



div.main-content .content-information #content-information-right #langkah2 #img-form{
  position:absolute;
  top:40px;
  left:10px;
  background:url(../images/form.png) top center no-repeat;
  width:110px;
  height:108px;
  z-index:2
  
}

div.main-content .content-information #content-information-right #langkah2 #button-1{
  position:absolute;
  top:55px;
  right:30px;
  background:#fff;
  background:url(../images/button-1.png) top center no-repeat;
  width:82px;
  height:90px;  
  z-index:2
}

div.main-content .content-information #content-information-right #langkah2 #button-2{
  position:absolute;
  top:161px;
  left:10px;
  background:#fff;
  background:url(../images/button-2.png) top center no-repeat;
  width:96px;
  height:90px;  
  z-index:2
}

div.main-content .content-information #content-information-right #langkah2 #img-sepeda{
  position:absolute;
  top:161px;
  right:30px;
  background:url(../images/sepeda-motor.png) top center no-repeat;
  width:101px;
  height:92px;
  z-index:2
  
}

div.main-content .content-information #content-information-right #langkah2 #button-3{
  position:absolute;
  top:267px;
  right:30px;
  background:#fff;
  background:url(../images/button-3.png) top center no-repeat;
  width:96px;
  height:90px;  
  z-index:2
}

div.main-content .content-information #content-information-right #langkah2 #img-rumah{
  position:absolute;
  top:267px;
  left:10px;
  background:url(../images/rumah.png) top center no-repeat;
  width:101px;
  height:92px;
  z-index:2
  
}



/* akhir content informasi*/

div.main-content .content-pesanan{
   position:absolute;
   top:475px;
   left:0px;
   width:99%;
   height:530px;
   background:#fff;
}

div.main-content #input-pesanan{
   position:absolute;
   top:15px;
   left:20px;
   border-right:2px solid #e7e0f0;
   border-left:2px solid #e7e0f0;
   border-bottom:2px solid #e7e0f0;
   width:500px;
   background:url(../images/header-pesanan.jpg) top center no-repeat;
   padding-top:60px;
}

div.main-content .label{
  font-size:0.8em;
  font-weight:bold;
  color:#69615a;
  text-align:right;
}

#input-pesanan input, textarea{
   background:#ebf3fc;
   border:1px solid;
}

.errormsg{
   font-family:verdana arial;
   font-size:8pt;
   color:red;
}

div.main-content .content-pesanan #inputan-header #inputan-kiri{
   position:absolute;
   top:38px;
   left:30px;
   width:300px;   
}

#detailPesanan{
   height:150px;
   width:380px;
}


#informasi-pesanan{
   position:absolute;
   left:550px;
   top:20px;
   width:400px;
}

#informasi-pesanan .heading{
   font-size:18px;
   font-family:verdana;
   font-weight:bold;
   font-color:#333333;
   text-align:center;
}

#informasi-pesanan ol{
   margin-top:5px;
   font-family:verdana;
   font-color:#333333;
}

#informasi-pesanan li{
   font-family:verdana;
   font-color:#333333;   
   text-align:justify;    
}

#syarat-ketentuan{
}

#kontak-kami{
  font-family:verdana, arial;
  font-size:11pt;
} 

#kontak-kami th{
  font-family:verdana, arial;
  font-weight:bold;
  font-size:18pt;
  text-align:left;
} 

#kontak-kami .label{
  text-align:left;
} 

.table-tarif{
  font-family:verdana;
  font-size:8pt;
  margin-bottom:3px;
}

.table-tarif td {
}

.table-keterangan-tarif{
  font-family:verdana;
  font-size:7pt;
}

.table-keterangan-tarif ul{
  margin-left:2px;
  padding-left:13px;
}

/*awal class footer*/

.footer{
   position:absolute;
   top:1200px;
   left:0px;
   width:100%;
   text-align:center;
}