/*
 * Default / Global Style
 */
 
@font-face{
    font-family: BankGothicBTM;
    src: url(fonts/BankGothicBT-Medium.ttf);
} 
@font-face{
    font-family: Bebas;
    src: url(fonts/BebasNeue.otf);
} 
@font-face{
    font-family: OpenSans;
    src: url(fonts/OpenSans.ttf);
} 
@font-face{
    font-family: OpenSansL;
    src: url(fonts/OpenSans-L.ttf);
} 
@font-face{
    font-family: OpenSansB;
    src: url(fonts/OpenSans-B.ttf);
} 

body{
    margin:0;
    padding:0;
    color: #333333;
    background: #000000;
}
.floatClear{float:none; clear: both;}

.posLeft{float: left;} .posRight{float: right;} .posTop{position:absolute;top:0px;} .posBottom{position:absolute;bottom:0;}

.alignLeft{text-align: left;} .alignRight{text-align: right;} .alignCenter{text-align: center;} .alignJustify{text-align: justify;}

.bdr-0{border: 1px solid #efefef;}
.bdr-1{border-top: 1px solid #efefef;}
.bdr-2{border-right: 1px solid #efefef;}
.bdr-3{border-bottom: 1px solid #efefef;}
.bdr-4{border-left: 1px solid #efefef;}
.bdr-13{border-top: 1px solid #efefef;border-bottom: 1px solid #efefef;}
.bdr-24{border-right: 1px solid #efefef;border-left: 1px solid #efefef;}
.bcolorW{background-color:rgba(255,255,255,0.5);}
.bcolorB{background-color:rgba(0,0,0,0.6);}

.pg-container,
.pg-wrapper,
.pg-row,
.pg-logo{
    display: block;
    position: relative;
}
.pg-container{    
    width:1360px;
/*    max-width:1360px; */
    min-height:100vh;
    background: url(../images/bg.jpg) top center no-repeat;
    margin:0 auto;        
}
.pg-wrapper{
    width:990px;
    height:auto;
    min-height:20px;
    margin:0 auto;    
}
.pg-row{
    width:100%; 
    height: auto;
}
.pg-row:after{
    float:none;
    clear:both;
}
.logo{
    float:left;
    width:260px;
    height: 84px;
}
.page-content{
    width:820px;
    height:auto;
    min-height:20px;
    margin:0 auto; 
    padding-bottom:30px;
    margin-bottom:30px;
}
.txt-content{
    font-family: OpenSans;
    font-size:13px;
    color:#fff;
}
.txt-content strong{    
    color:#d29900;
}
.page-title{
    display:block;
    height:66px;
    width:100%;
    border-bottom:2px solid #301304;   
    margin-bottom:30px; 
}
span.text-title-page{
    display:table;
    position:relative;
    height: 65px;
    width:820px;
    top:0;
    left:0;
}
span.text-title-page span{
    display:table-cell;
    text-align:center;
    vertical-align:middle;
    font-family:BankGothicBTM;
    font-size:30px;
    color:#fff;
}
.box-phone{
    display:table;
    position:absolute;
    width:300px;
    height: 60px;
    top:-18px;
    right:0;
    background: left center no-repeat; 
}
.box-phone span{
    display:table-cell;
    font-family:OpenSans;
    font-size:24px;
    color:#fff;
    padding-left:55px;
    vertical-align:middle;
}
/** ------------- SEARCH ------------- **/
#searchresults{
    font-family:OpenSans;
    font-size:14px;
    color:#fff;
}
/** ------------- Home ------------- **/
.home-banner {
    display:block;
    position:relative;
    width:100%;
    max-width:1343px;
    height:602px;
    margin:0 auto;
/*    background: rgba(250,250,250,0.5); */
    margin-top:36px;    
}
span.tagline{
    display:table;
    position:absolute;
    width:550px;
    height:165px;
    top:185px;
    left:150px;    
}
span.tagline span{
    display:table-cell;
    text-align: left;
    vertical-align:middle;
    font-family:Bebas;
    font-size: 35px;
    color: #fff;
}
.home-text{
    display:block;
    position:relative;
    padding-top:20px;
    padding-bottom:20px;
    width:630px;
    margin:0 auto;
    font-family: OpenSans;
    font-size: 13.86px;
    color:#fff;
}
.home-text p{text-align: center;}
ul.list-home{
    list-style-type: none;
    margin:0;
    padding:0;
    text-align:center;    
}
    ul.list-home li{
        display: inline-block;
        width:239px;
        height:225px;
        margin:0 1em;
        position:relative;             
    }
    ul.list-home li img{
        width:239px;
        height:114px;
        margin:0;
    }
    span.text-title{
        display:table;
        position:absolute;
        width:239px;
        height:50px;
        top: 115px;
        left:0;
    }
    span.text-title span{
        display:table-cell;
        text-align:center;
        vertical-align:middle;
        color: #f99f15;
        font-family:BankGothicBTM;
        font-size:18px;
        padding-left: 10px;
        padding-right: 10px;
    }
    span.box-button{
        display:table;
        position:absolute;
        width:239px;
        height:50px;
        top: 175px;
        left:0;        
    }
    span.box-button span{
        display:table-cell;
        text-align:center;
        vertical-align:top;        
    }
    .btn-services{
        display:block;
        width:133px;
        height:28px;
        background: url(../images/btn-clickhere.jpg) no-repeat;
        margin:0 auto;
        opacity:.4;
    }
    .btn-services:hover{
        opacity:1;
    }
    .bottom-img{
        width:100%;
        height:372px;
        text-align:center;
        margin:0;
    }
    .bottom-text{
        width:100%;
        height:288px;
        background: url(../images/bg-bottom.jpg) center center no-repeat #1c0000;
    }
    .kol3home{
        position: relative;
        float:left;
        width:33.3%;
        height: 200px;
        margin:0;        
    }
    .kol3home .img-testi{
        display:block;
        margin:0;
        margin-top:28px;
        margin-bottom:5px;
        width:198px;
        height:108px;
    }
    .kol3home .box-fblike{
        display:block;
        width:198px;
        height:180px;
        margin:28px 0;

                
    }
    .kol3home .box-fblike .fb-text{
        color:#fff;
        font-family: OpenSansB;
        font-size:18px;
    }
    span.btn-testi{
        font-family:OpenSans;
        font-size:18px;
        color: #fff;
    }
    span.btn-testi a{
        text-decoration: none;
        color: #fff;
    }
    span.text-bottom{
        display:table;
        position:absolute;
        width:100%;
        height:60px;
        top:28px;
    }
    span.text-bottom span{
        display:table-cell;
        color:#fff;
        text-align:center;
        vertical-align: middle;
        font-family: Bebas;
        font-size:24px;
    }
    span.button-bottom{
        display:table;
        position:absolute;
        width:100%;
        height:60px;
        top:90px;
    }
/**------- About Us ------**/
.page-banner{
    display:block;
    position:relative;
    width:100%;
    text-align:center;
    height:315px;    
}    
.page-banner img{
    margin-top:57px;
}
/**------- Services ------**/
.col-img-srv{
    display:block;
    position:relative;
    width: 263px;
    height:auto;
    min-height:385px;
    margin:0;
    float:left;
}
.box-thumbs{
    position:relative;
    width:245px;
    height: auto;
    margin:10px auto;
        
}
    span.title-srv{
        display:block;
        position:absolute;
/*        width:245px;
        height:100%; */
        top: 0;
        bottom:0;
        left:0;
        right:0;
        cursor:pointer;
        background: rgba(97,17,0,0.8);   
    }
    span.title-srv span{
        display:table;
        width:100%;
        height:100%;
    }
    span.title-srv span span{
        display:table-cell;
        text-align:center;
        vertical-align:middle;
        color: #fff;
        font-family:BankGothicBTM;
        font-size:24px;
    }
    span.title-srv span span a{
        font-size:14px;
        color:#cd7600;
        text-decoration:none;
    }
    span.title-srv{
        display:block;
        position:absolute;
/*        width:245px;
        height:100%; */
        top: 0;
        bottom:0;
        left:0;
        right:0;
        cursor:pointer;
        background: rgba(97,17,0,0.8); 
        opacity:0;
        -webkit-transition:opacity 1s ease-in-out;
            -moz-transition:opacity 1s ease-in-out;
            -ms-transition:opacity 1s ease-in-out;
            -o-transition:opacity 1s ease-in-out;
            transition:opacity 1s ease-in-out;  
    }
.box-thumbs:hover > span.title-srv {
    opacity:1;
    	-webkit-transition:opacity 0.4s;
            -moz-transition:opacity 0.4s;
            -ms-transition:opacity 0.4s;
            -o-transition:opacity 0.4s;
            transition:opacity 0.4s;
}    
/**------- Photo Gallery ------**/
.box-gallery{
    display:block;
    position:relative;
    width:750px;
    padding: 40px 35px;
    background-color: #111111;
    margin-bottom:36px;
}
.gallery-title{
    display:block;
    position:relative;            
    font-family:BankGothicBTM;
    font-size:18px;
    color: #c59001;        
}
ul.list-img{
    list-style-type:none;
    margin:0;
    padding:0;
    text-align:left;
}
ul.list-img li{
    display:inline-block;
    position:relative;
    width:135px;
    height:115px;
    margin:5px;
    background: rgba(250,250,250,0.3);
}
ul.list-img li img{
    width:135px;
    height:115px;
    margin:0;
}
/**------- Contact ------**/
.contact-banner{
    display:block;
    position:relative;
    width:100%;
    text-align:center;
    height:315px;    
}    
.contact-banner img{
    margin-top:57px;
    float:left;
    margin-left:88px;
}

.gmaps{
    display:block;
    position:relative;
    width:510px;
    height:257px;
    margin:57px 0;
    margin-right:88px;
    background: rgba(250,250,250,0.2);
    float:right;    
}
.box-address{
    display:block;
    position:relative;
    width:357px;
    height:auto;
    min-height:257px;    
    float:left;
    background: #000;
}
.box-address table{
    margin-top:35px;
    margin-left:20px
}
.box-address table td{
    height:25px;    
}
.box-contactform{
    display:block;
    position:relative;
    width:450px;
    height:auto;
    min-height:257px;    
    float:right;    
}
.textbox,.text30{
    display: block;
    width: 95%;
    height:30px;
    padding:3px 10px 3px 10px;
    border:none;
    border-radius:2px;        
        -webkit-border-radius:2px;        
    color: #a6a6a6;
    background: #242424;
    font-family: Calibri;
    font-size:14px; 
    margin-bottom: 10px;
}
textarea{
    display: block;
    width: 95%;    
    padding:3px 10px 3px 10px;
    border:none;
    border-radius:5px;        
        -webkit-border-radius:5px;        
    color: #a6a6a6;
    background: #242424;
    font-family: Calibri;
    font-size:14px; 
    margin-bottom: 10px;
    margin-top:10px;
}  
.tombol{
    display: block;
    position: relative;
    width: 150px;
    height: 25px;
    margin:0;
    padding:0;    
    border:none;
    background: #d29900;
    color: #fff;
    margin-top:10px;    
}
.tombol:hover{
    background: #fff;
    color: #656565;
    border:1px solid #656565;
    cursor: pointer;
    
}     
/**------- Footer ------**/
    #footer{
        position:absolute;
        width:100%;
        height:77px;
        background-color: #1c0000;
        left:0;
        bottom:0;
        
    }
    .copyright{
        display:table;
        position: absolute;        
        width:600px;
        height: 77px;
               
    }
    span.text-copyright{
        display:table-cell;
        font-family:"Century Gothic";
        font-size:12px;
        text-align:left;
        vertical-align:middle;
        color:#fff;
        
    }
    span.text-copyright a{
        color:#fff;
        text-decoration:none;
    }
/** ------------- Menu ------------- **/
#navi{
    display:block;
    position:relative;
    height: 30px;    
}
    #navi ul ul { display:none; }
    #navi ul {
        list-style-type: none;
        position:relative;
        display: inline-block;
    }
    #navi ul li {
        float:left;
        text-align:center;        
        font-family: OpenSansL; 
        font-size:14px;       
    }
    #navi ul li a{
        text-decoration:none;
        color: #fff;
        padding:5px 11px;
        border: none;        
    }
    #navi ul li a:hover,
    #navi ul li:hover a{        
        border-bottom: 1px solid #d29900;
        display: block;
        padding:6px 11px 5px 11px;
        margin-top:-6px;
    } 
    #navi ul li.active a{
        display: block;
        border: 1px solid #d29900;
        padding:5px 10px;
        margin-top:-6px;
    }
    #navi ul li:hover > ul{
        display:block;
    }
    #navi ul ul {
        padding:0;
        position:absolute;
        margin-left: 0;        
        top:32px;
        border:none;
        z-index:999;
    }
    #navi ul ul li{
        float: none;
        position:relative;
        text-align: left;
        width:325px;
        /*height:29px;*/
        background: #d29900;
        margin-bottom:6px;
        border-bottom: 2px solid #e0b84d;
    }
    #navi ul ul li a:hover{
        color: #333;
        background: #e0b84d;                            
    }
    .box-find{
        display:block;
        border: none;
        height:26px;
        width:185px; 
        margin-top:-3px;        
        text-align:left;    
    }
    .box-find .txtsearch{
        height: 23px;
        border:none;
    }
    .img-find{
        position:absolute;
        border:none;
        background: url(../images/ico-find.jpg) center center no-repeat;
        width:25px; 
        height:25px;        
        padding:0;
    }
    .img-find:hover{
        cursor:pointer;
    }
    .box-jump{
        display:block;
        position:absolute;
        width:67px;
        height:67px;        
        background: url(../images/circle-arrow-b.png) no-repeat;
        bottom:30px;
        left:50%;        
        transform:translate(-50%,0);
    }
    .box-jump-free{
        display:block;
        position:relative;
        width:67px;
        height:67px;        
        background: url(../images/circle-arrow-b.png) no-repeat;
        margin:0 auto;
    }     
/* -- Sosmed -- */
#footer #sosmed{
    display: block;
    position: absolute;
    width:220px;
    height: 45px;     
    float:right;
    top:15px;
    right:0;        
}
#footer #sosmed ul{
    list-style: none;
    margin: 0px 5px;
    padding: 0px;
}
#footer #sosmed ul li,#footer #sosmed ul li a {
    float: left;
    display: block;
    margin:1px;
}
#ico-fb,#ico-tw,#ico-in,#ico-gp{
    display: block;
    position: relative;
    width: 45px;
    height: 45px;
}
#ico-fb{ background: url(../images/ico-fb.png) no-repeat; }
#ico-tw{ background: url(../images/ico-tw.png) no-repeat; }
#ico-in{ background: url(../images/ico-in.png) no-repeat; }
#ico-gp{ background: url(../images/ico-gp.png) no-repeat; }

#ico-fb:hover{ background: url(../images/ico-fb-hover.png) no-repeat; }
#ico-tw:hover{ background: url(../images/ico-tw-hover.png) no-repeat; }
#ico-in:hover{ background: url(../images/ico-in-hover.png) no-repeat; }
#ico-gp:hover{ background: url(../images/ico-gp-hover.png) no-repeat; }

/** Testimonials **/
.box-testi{
   display:block;
   position:relative;
   width:330px;
   height:200px;   
   margin:5px auto;   
   overflow:hidden;
}
span.testi-title{
   display:block;
   position:relative;
   width:100%;
   height:auto;
   color:#fff;
   font-size:14px;
   font-family:OpenSansB;   
   text-align:center;   
}
.quo1,.quo2{
   display:block;
   position:relative;
   width:100%;
   height:16px;
   background-repeat:no-repeat;
   background-size:16px 16px;
}
.quo1{background-image: url(../images/q-01.png);background-position:top left;}
.quo2{background-image: url(../images/q-02.png);background-position:right bottom;margin-top:-10px;}
.box-text-testi{
   display:block;
   position:relative;
   width:270px;
   height:auto;
   margin:0 auto;
   color:#fff;
   font-family:OpenSans;
   font-size:13px;
   margin-top:-10px;
   margin-bottom:-10px;
}
.box-text-testi p{
   margin-top:-10px;
}
.qpeople{
   display:block;
   position:relative;
   color:#fff;
   font-family:OpenSansB;
   font-size:13px;
}