@font-face {
    font-family: "Lato";
    src: url("Lato-Regular.ttf,Lato-BoldItalic.ttf,Lato-Bold.ttf"),
        url("Lato-Regular.ttf,Lato-BoldItalic.ttf,Lato-Bold.ttf");    
}
body
{
    margin: 0;
    padding: 0;
    color: #555;
    font: normal 10pt Lato-Regular,Helvetica,sans-serif;
    background: #fff;
}

.container
{
    width: 100%;
    background-color:white;
}
#header
{
    margin: 0;
    padding: 20px 0 10px;
    width: 100%;
    background: url('../images/bg-kotak.png');
    height: 95px;
}
.ads{display: block;margin: -85px auto;line-height: 90px;width:370px; height:90px; background: #ff9000;float: right; color: #ffffff;font-size: 42px; text-align: center;}

.menu-header{
    background:#292a2e;
    width: 100%; 
    height: 73px;
/*    background: -webkit-linear-gradient(top, #2d2f33 0%,#1e1f22 100%);
    background: -moz-linear-gradient(top, #2d2f33 0%,#1e1f22 100%);
    background: -o-linear-gradient(top, #2d2f33 0%,#1e1f22 100%);
    background: -ms-linear-gradient(top, #2d2f33 0%,#1e1f22 100%);
    background: linear-gradient(top, #2d2f33 0%,#1e1f22 100%);*/
}
/*mainmenu*/
#mainmenu{margin: 0 auto; width:  950px;}
#mainmenu ul li{
    width: 175px;
    height: 73px;
    display:inline-block; 
    margin-top:15px; 
    float: left;
    text-align: center;
    border-right: 1px solid #606168;
    height: 2.5em;
    position: relative;
}
#mainmenu ul li:last-child{border: none;}
#mainmenu ul li a{
    text-decoration: none; 
    color: #ffffff; 
    text-transform: uppercase;
    font:9pt Lato-Regular,Helvetica,sans-serif;
    font-weight: bold;
    line-height: 30px;
        
}
#mainmenu ul li a:hover, #mainmenu ul li.active a
{
	text-decoration:none;
        color: #ff9000;
}
#mainmenu ul li ul{
    display: none;
    margin-top: -65px;
}
#mainmenu ul li:hover ul{
    position: absolute;
    display: block;
    float: left;
    top: 100px;
    z-index: 10;
    padding: 0;
}
#mainmenu ul li:hover ul li{
    float: left;
    width: 175px;
    height: 37px;
    background: #292a2e;
    margin: 0;
}
#mainmenu ul li:hover ul li{
    border: none;
}
#mainmenu ul li:hover ul li:hover,#mainmenu ul li:hover ul li.active{
    background: #000;
}

#mainmenu ul li:hover ul li a{
    width: 159px;
    padding: 12px 0 10px 0px;
    color: #ffffff;
    border:none;
}
#mainmenu ul li:hover ul li a:hover{
    color: #ff9000;
}

#content{width: 950px; margin: 0 auto;}
#footer{
    text-align: center;
    width:100%;
    margin:0 auto;
    padding: 15px 0;
    height: 185px;
    background-image: url('../images/bg-kotak-abu.png');
    clear: both;
    border-top: 7px solid orange;
}
#footer-bottom{
    width:100%;
    height: 88px;
    background-image: url('../images/bg-kotak-item.png');
}
.footer-tengah{width: 420px;color: #fff;
               float: left;
               font-weight: bold;
               font-size: 15px;
               margin: -80px 0 0 250px;
               text-align: left;}
.footer-kanan{
    color: #ffffff;
    text-align: left; 
    float: left;
    margin-top: -85px;

}
.sub-footer{width: 950px;text-align: center;margin: 0 auto;}
.footer-kiri a{ float: left; color: #ffffff; text-decoration: none; font-size: 13px;}
.footer-kiri a:hover{color: #ff9000;}
.footer-kiri li{ width: 80px; list-style-type: none; height: 8px;}
.sub-bottom{width: 950px; margin:0 auto;}
.footer-btm-kiri{margin: 20px; height: 40px; width: 118px; float: left;}
.footer-btm-kanan{float: right; margin: 30px 120px 0 0;}
.news{margin: 10px 50px 0 0;}
.news li{ color: #ff9000; list-style-type: disc;margin-bottom: 5px; width: 541px;}
.news ul{margin: 0 0 6px 0;}
.news a{text-decoration: none;color: #fff;font-size: 13px;}
.news a:hover{text-decoration: underline;}

div.flash-error, div.flash-notice, div.flash-success
{
    padding:.8em;
    margin-bottom:1em;
    border:2px solid #ddd;
}

div.flash-error
{
    background:#FBE3E4;
    color:#8a1f11;
    border-color:#FBC2C4;
}

div.flash-notice
{
    background:#FFF6BF;
    color:#514721;
    border-color:#FFD324;
}

div.flash-success
{
    background:#E6EFC2;
    color:#264409;
    border-color:#C6D880;
}

div.flash-error a
{
    color:#8a1f11;
}

div.flash-notice a
{
    color:#514721;
}

div.flash-success a
{
    color:#264409;
}

div.form .rememberMe label
{
    display: inline;
}

div.view
{
    padding: 10px;
    margin: 10px 0;
    border: 1px solid #C9E0ED;
}

div.breadcrumbs
{
    font-size: 0.9em;
    padding: 5px 20px;
}

div.breadcrumbs span
{
    font-weight: bold;
}

.portlet
{

}

.portlet-decoration
{
    padding: 11px 8px;
    background: transparent;
    text-align: center;
    background-color: #dddddd;
}

.portlet-title
{
    font-size: 12px;
    font-weight: bold;
    padding: 0;
    margin: 0;
    color: #000;
}

.portlet-content
{
    font-size:0.9em;
    margin: 0;
    padding: 5px 10px;
    background:transparent;
}

.portlet-content ul
{
    list-style-image:none;
    list-style-position:outside;
    list-style-type:none;
    margin: 0;
    padding: 0;
}

.portlet-content li
{
    padding: 2px 0 4px 0px;
}

.post
{
    margin: 0 0 20px;
}

.post .title
{
    font-size: 1.5em;
    border-bottom: 1px solid #C9E0ED;
}

.post .title a
{
    color: #555;
    text-decoration: none;
}

.post .author
{
    color: #888;
    margin: 0 0 5px;
}

.post .nav
{
    -moz-border-radius:7px;
    padding: 5px;
    background: #EFFDFF;
}

.comment
{
    -moz-border-radius:7px;
    padding: 10px;
    background: #F5F5F5;
    margin: 5px 0;
}

.comment .content
{
    margin: 10px 0;
}

.comment .author
{
    margin: 5px 0;
    padding: 0 0 3px;
    border-bottom: 1px solid #DDD;
}

.comment .time
{
    color: #888;
    font-size: 0.8em;
}

.comment a.cid
{
    color:#CCC;
    float:right;
    font-size:1.5em;
    font-weight:bold;
    padding:0 5px 5px 5px;
    text-decoration: none;
}

.comment a.cid:hover
{
    color:#555;
}

.comment .pending
{
    color:red;
}

/*Latest News*/
.judul-latestnews{
    font-weight: bold;
    font-size: 14px;
    position: relative;
    margin-bottom: 10px;
    width: 200px;
    height: 40px;
}
.content-latestnews{
    width: 200px;
    height: 100px;
}
.list-latestnews{
    margin: auto;
    width: 25%;
    float: right;
}
.read-more a{
    text-decoration: none;
    color: orange;
    font-weight: bold;
}

.judul{
    text-decoration: none;
    color: orange;
    font-weight: bold;
}

.read-more a:hover{
    color: orange;
}  
/*Latest News End*/

.horz {border-bottom: 3px solid #e3e3e3;  margin: 10px 0 20px 0; font-weight: bold; }
.horz-page{border-bottom: 2px solid #d4d4d4;  margin: 10px 0 50px 0; font-weight: bold; color: #767676; height: 30px;}
.detail-quotes{
    font-size:18px;
    margin-left:120px;
    text-align:center;
    width:590px;
    font: italic 16pt Lato-BoldItalic,Helvetica,sans-serif;
}

.service{
    font-size:16px;
    margin-left:120px;
    text-align:center;
    width:590px;
    font: italic 16pt Lato-BoldItalic,Helvetica,sans-serif;
}

.bqstart {
    color:#e4e4e4;
    float:left;
    font-size:250px;
    height:45px;
    margin-bottom:-20px;
    margin-top:-77px;
}

.bqend {
    color:#e4e4e4;
    float:right;
    font-size:250px;
    height:45px;
    margin-top:-80px;
    margin-right:40px;
}
.project-list .image{margin: auto; width: 29%; float: right; text-align: center; font-size: 15px; padding:0 20px 15px 18px;}
.project-list .image a img{border:1px solid grey; margin-bottom:10px;}

.mosaic-block .details{ margin:15px 20px; }
.mosaic-block .details h4{ font:14px 'Lato-Reguler', Arial, sans-serif; color:#fff; text-shadow:1px 1px 0 rgb(0,0,0); }
.mosaic-block .details p{ font:300 12px 'Lato-Reguler', Tahoma, Verdana, sans-serif; color:#aaa; text-shadow:1px 1px 0 rgb(0,0,0);}
.mosaic-block a{ text-decoration:none; }

.project{float: left; margin: -140px 80px 0 280px;}
.pro-detail{height:350px;}

/*.projects-list{padding-bottom: 50px;}*/
.projects-list .image{margin: 0 5px ; width: 450px; float: left; padding:0 20px 15px 18px;}
.projects-list img{width: 450px; height: 300px;box-shadow: 0px 0px 5px 0.5px #888888;
border: 1px solid #ffffff;}

.clients_footer{height:100px; width: 890px;}
.clients-list a{float:left;}

.about{float: left;margin: -80px 0 90px 310px;}
.about-detail{padding-bottom: 30px;}
.about-detail img{margin: auto; float: left; }


.latestnewspager .yiiPager .previous a:link{
    float:left;
    border: none;
    background:#000 url('../images/arrows_kecil.png') no-repeat ;
    background-position:-25px;
    display:block;
    height:21px;
    text-indent:-9999px;
    width:14px;  
}
.latestnewspager .yiiPager .previous a:hover{
    background:#000 url('../images/arrows_kecil.png') no-repeat ;
    background-position:-75px;
}    
.latestnewspager .yiiPager .next a:link{
    float:left;
    border: none;
    background:url('../images/arrows_kecil.png') no-repeat;
    background-position:0px;
    display:block;
    height:21px;
    text-indent:-9999px;
    width:14px;    
}
.latestnewspager .yiiPager .next a:hover{
    background:url('../images/arrows_kecil.png') no-repeat ;
    background-position:-50px;
}
.latestnewspager{
    float:right;
    margin-top: -45px;
}
.detail-project .yiiPager{
    float:left;
    width: 100%;
    margin: 35px;
}
.detail-project .yiiPager .previous a:link{
    float:left;
    border: none;
    background:url('../images/prev-next-pro.png') no-repeat ;
    background-position: 0 0px;
    display:block;
    height:25px;
    text-indent:-9999px;
    width:78px;

}
.detail-project .yiiPager .previous a:hover{
    background:url('../images/prev-next-pro.png') no-repeat;
    background-position: 0 -29px;
} 
.detail-project .yiiPager .next a:link{
    float:right;
    border: none;
    background: url('../images/prev-next-pro.png') no-repeat ;
    background-position:-90px 0; 
    display:block;
    height:25px;
    text-indent:-9999px;
    width:40px;
    margin-right: 65px;
}
.detail-project .yiiPager .next a:hover{
    background:url('../images/prev-next-pro.png') no-repeat;
    background-position:-90px -29px; 
}
.all-pro{float: right; margin: -75px auto;}

/*Berita*/
#berita {
     float: left;
     width: 100%;
}
.content-berita a{ width: 100%;}
.content-berita{text-align: justify;}
.berita{height: 218px;}
.view-berita{   
    margin:30px 0 50px 0;
    clear: both;
}
.foto-berita{
    float:left;
    width: 120px;
    height: 120px;
}
.daftar-berita{
    width: 950px;
}
.daftar-berita .judul-berita a{ 
    font-size: 18pt;
    padding: 0 0 5px 0;
    text-decoration: none;
    color: #333;
}
.daftar-berita .judul-berita a:hover{ 
    color: #09f;
}
.daftar-berita .waktu-berita{ 
    font-size: 9pt;
    padding: 0;
}
.list-berita .yiiPager{
    padding-bottom:20px;
}
.list-berita .yiiPager .previous a:link{
    border: none;
    background:url('../images/prev-next-pro.png') no-repeat ;
    background-position: 0 0px;
    display:block;
    height:25px;
    text-indent:-9999px;
    width:70px;
}
.list-berita .yiiPager .previous a:hover{
    background:url('../images/prev-next-pro.png') no-repeat;
    background-position: 0 -29px;
} 
.list-berita .yiiPager .next a:link{
    float:right;
    border: none;
    background: url('../images/prev-next-pro.png') no-repeat ;
    background-position:-90px 0; 
    display:block;
    height:27px;
    text-indent:-9999px;
    width:40px;
    margin:-28px 0 30px 0;
}
.list-berita .yiiPager .next a:hover{
    background:url('../images/prev-next-pro.png') no-repeat;
    background-position:-90px -29px; 
}
/*#main-content{background-color: #fff; border-bottom: 7px solid orange;}*/
/*View Berita Detail*/
#content .detail-item {
    width: 930px;
    clear: both;
}
#content .detail-item img{
    float:left;
    margin: 0 15px 15px 0;    
    width: 150px;
    height: 160px;
}
.detail-item .date{
    font-size: 14pt;
    margin-bottom: 15px;
}
.detail-item .content-berita{
    /*margin-left: 180px;*/
    /*height:200px;*/
}
.judul{ margin-top: 30px;}

.kirinav{
    /*float:left;*/
    width:440px;
    margin-bottom:30px;
}
.kirinav a {
    float:left;
    border: none;
    background:url('../images/prev-pro.png') no-repeat ;
    background-position: 0 0px;
    display:block;
    height:25px;
    padding: 6px 0 0 85px;
    text-decoration: none;
    color: #000;
    margin-bottom: 20px;
}
.kirinav a:hover{
    background:url('../images/prev-pro.png') no-repeat;
    background-position: 0 -29px;
    color: orange;
}
.kanannav{
    float:right;
    width:440px;
    margin-bottom:30px;
}
.kanannav a{
    float:right;
    border: none;
    background:url('../images/next-pro.png') no-repeat ;
    background-position: 0 0px;
    display:block;
    height:25px;
    width:55px;
}
.kanannav a b{
    float:right;
    border: none;
    display:block;
    height:25px;
    /*margin:6px 60px;*/
    text-decoration: none;
    color: #000;
    width:290px;
    margin-top: 3px; 
}
.kanannav a b:hover{
    color: orange;
}
.kanannav a:hover{
    background:url('../images/next-pro.png') no-repeat;
    background-position:0 -29px;
}
.beritanav{ margin-top: 30px;}

.form{margin-bottom: 70px;}
.jdl{display: none;}
.judl{font-weight:bold; font-size:20px;color:#9c9b9b;}
.cntent{
    margin: 20px 0 50px;
}
.breadcrs a{color : orange; font-weight: bold; text-decoration: none;}
.breadcrs{margin: 20px auto;}
.pjlasan{display: none;}
.bread{display: none;}
#contact-us{margin-left: 20px;}
.kontak-header{margin-top: 20px; margin-left: 20px;}
.kontak-judul{margin-left: 20px;}
.searchfield{ 
    background-color:#efefef;
    border:1px solid #BCBBBB;
    border-bottom-left-radius:0.4em;
    border-bottom-right-radius:0.4em;
    border-top-left-radius:0.4em;
    border-top-right-radius:0.4em;
    outline:none;
    padding:6px 6px 6px 8px;
    width:160px;
    color: grey;
    margin-top: 10px;}
.batas{ width: 550px; margin: 0 auto;}
.themes{float: left;}
#search-menu{float: left; margin-top: 20px;}
.search-form {display: none;}
.slider{height:322px;}
#callback-output{
    background:url('../images/bg_tag_line.png');
    color: #fff;
    width: 890px;
    position: absolute;
    margin: 269px 30px; 
    z-index:10; 
    font: normal 12pt Lato-Regular,Helvetica,sans-serif;
    height: 53px;
}
#callback-output b{text-align: center;padding: 15px;display: block;}
.ribbon {
    background: url('../images/ribbon.png') no-repeat;
    float: left;    
    width: 160px;
    height: 37px;
    margin: 30px auto;
}
.ribbon p{color: #b8b8b8; font: 11pt Lato-Bold,Helvetica,sans-serif; padding: 8px;font-weight: bold;}
.quotes{padding: 10px;margin-top: 10px;}
.client{float: left; width: 100%; margin: 20px 0;}
.client a img{float: right; padding: 20px;}
.intwo{display: none;}
.inone{display: none;}
.breades{padding-bottom: 30px; display: block;}
.breades a{color: #ff9000; text-decoration: none;}
.logo-bread{display: none;}
.sub-bottom a{color: #ffffff;font-weight: bold;text-decoration:none;}
.sub-bottom a:hover{color:orange; text-decoration:underline;}
.maps{float: left;}
.contek{float: left; margin:0 20px; width:350px;}

#contactus fieldset
{
    width:320px;
    padding:20px;
    border:1px solid #ccc;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px;
}

#contactus legend, h2
{
    font-family : Arial, sans-serif;
    font-size: 1.3em;
    font-weight:bold;
    color:#333;
}

#contactus label
{
    font-family : Arial, sans-serif;
    font-size:0.8em;
    font-weight: bold;
}

#contactus input[type="text"],textarea
{
    font-family : Arial, Verdana, sans-serif;
    font-size: 0.8em;
    line-height:140%;
    color : #000;
    padding : 3px;
    border : 1px solid #999;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;

}

#contactus input[type="text"]
{
    height:18px;
    width:220px;

    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;

}

#contactus #scaptcha
{
    width:60px;
    height:18px;
}

#contactus input[type="submit"]
{
    width:100px;
    height:30px;
    padding-left:0px;

    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

#contactus textarea
{
    height:120px;
    width:310px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}

#contactus input[type="text"]:focus,textarea:focus
{
    color : #009;
    border : 1px solid #990000;
    background-color : #ffff99;
    font-weight:bold;
}

#contactus .container
{
    margin-top:8px;
    margin-bottom: 10px;
}

#contactus .error
{
    font-family: Verdana, Arial, sans-serif;
    font-size: 0.7em;
    color: #900;
    background-color : #ffff00;
}

#contactus fieldset#antispam
{
    padding:2px;
    border-top:1px solid #EEE;
    border-left:0;
    border-right:0;
    border-bottom:0;
    width:350px;
}

#contactus fieldset#antispam legend
{
    font-family : Arial, sans-serif;
    font-size: 0.8em;
    font-weight:bold;
    color:#333;
}

#contactus .short_explanation
{
    font-family : Arial, sans-serif;
    font-size: 0.6em;
    color:#333;
}

/* spam_trap: This input is hidden. This is here to trick the spam bots*/
#contactus .spmhidip
{
    display:none;
    width:10px;
    height:3px;
}
#fg_crdiv
{
    font-family : Arial, sans-serif;
    font-size: 0.3em;
    opacity: .2;
    -moz-opacity: .2;
    filter: alpha(opacity=20);
}
#fg_crdiv p
{
    display:none;
}

.rTable {   	display: table;   	width: 100%; }
.rTableRow {   	display: table-row; }
.rTableHeading {   	display: table-header-group;   	background-color: #ddd; }
.rTableCell, .rTableHead {   	display: table-cell;   	padding: 3px 10px;   	border: 1px solid #999999; }
.rTableHeading {   	display: table-header-group;   	background-color: #FFA500;   	font-weight: bold; }
.rTableFoot {   	display: table-footer-group;   	font-weight: bold;   	background-color: #ddd; }
.rTableBody {   	display: table-row-group; }