.kurang-jarak {
    margin-top: -20px;    
}
h1 {
    font-size: 24px;
}
/*----------------JM Intro Article ----------------------*/
.jmm-title, .mod-articles-category-title {
    font-family: Roboto Slab, sans-serif;
    font-size: 15px;
    font-weight: bold;
    line-height: 15px;
    padding-right: 0px;
}
.jm-category-module.default .jmm-intortext {
    margin: 10px 15px 0px 0px;
    text-align: justify;  
}
.jm-category-module.default .jmm-rows > div > .jmm-item {
    float: left;
    padding: 15px 5px 15px 20px;
    box-sizing: border-box;
}
ul.social-icons {
    list-style: none;
    padding: 0;
    margin: 5px;
    display: inline-block;
    font-size: 20px;
}
.nombor-gerak {
    font-family: Roboto Slab, sans-serif;
    font-weight: 700;
    letter-spacing: 5px;
}
.testimoni {
    font-family: Roboto Slab, sans-serif;
    font-size: 16px;
}
.reviews-block__person-role {
    color: #999;
    font-size: 10pt;
}
element {
}
.reviews-block__person-name {
    font-family: Roboto Slab, sans-serif;
    font-weight: 500;
    font-size: 15px;
    line-height: 1;
    margin-bottom: 2px;
}
.reviews-block__slide {
    background: #fff;
    padding: 20px 50px;
}
.top-social {
    float: left;
    list-style: none;;
    margin: 0px;
    color: #999999;
    padding: 6px 0px 0px 0px;
    line-height: 10px;
    font-size: 13px;
}
.top-social  a {
   color: #dadada;
}
.top-social  a:hover {
   color: #666666;
}
@media screen and (min-width: 320px) and (max-width: 767px){
.top-social {
    display: table;
    float: none;
    margin: 0;
    text-align: center;
    width: 100%;
    }
}
.menu-heading {
text-align: center;
text-transform: uppercase;
font-weight: bold;
}
.sp-page-title h3 {
    font-size: 14px;
    font-weight: normal;
    line-height: 1;
    margin-top: 5px;
    color: #adadad;
}
.sp-module ul > li {
    display: block;
    border-bottom: 1px dashed #999;
    -webkit-transition: 300ms;
    transition: 300ms;
}
.sp-megamenu-parent .sp-dropdown.sp-dropdown-sub {
    top: -15px;
    left: 100%;
}
.sp-megamenu-parent .sp-dropdown li.sp-menu-item.active > a:hover {
    color: #333;
}
/*--------- Umum --------------------------------------------------------------------*/

.jarak-bawah-10 {
  padding-bottom: 10px;
}
.jarak-bawah-20 {
  padding-bottom: 20px;
}
.h1, h1 {
    font-size: 24px;
}
.h4, h4 {
    font-size: 17px;
}
.tengah {
  text-align: center;
}
.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}
.sppb-col, .sppb-col-auto, .sppb-col-lg, .sppb-col-lg-1, .sppb-col-lg-10, .sppb-col-lg-11, .sppb-col-lg-12, .sppb-col-lg-2, .sppb-col-lg-3, .sppb-col-lg-4, .sppb-col-lg-5, .sppb-col-lg-6, .sppb-col-lg-7, .sppb-col-lg-8, .sppb-col-lg-9, .sppb-col-lg-auto, .sppb-col-md, .sppb-col-md-1, .sppb-col-md-10, .sppb-col-md-11, .sppb-col-md-12, .sppb-col-md-2, .sppb-col-md-3, .sppb-col-md-4, .sppb-col-md-5, .sppb-col-md-6, .sppb-col-md-7, .sppb-col-md-8, .sppb-col-md-9, .sppb-col-md-auto, .sppb-col-sm, .sppb-col-sm-1, .sppb-col-sm-10, .sppb-col-sm-11, .sppb-col-sm-12, .sppb-col-sm-2, .sppb-col-sm-3, .sppb-col-sm-4, .sppb-col-sm-5, .sppb-col-sm-6, .sppb-col-sm-7, .sppb-col-sm-8, .sppb-col-sm-9, .sppb-col-sm-auto, .sppb-col-xl, .sppb-col-xl-1, .sppb-col-xl-10, .sppb-col-xl-11, .sppb-col-xl-12, .sppb-col-xl-2, .sppb-col-xl-3, .sppb-col-xl-4, .sppb-col-xl-5, .sppb-col-xl-6, .sppb-col-xl-7, .sppb-col-xl-8, .sppb-col-xl-9, .sppb-col-xl-auto, .sppb-col-xs-1, .sppb-col-xs-10, .sppb-col-xs-11, .sppb-col-xs-12, .sppb-col-xs-2, .sppb-col-xs-3, .sppb-col-xs-4, .sppb-col-xs-5, .sppb-col-xs-6, .sppb-col-xs-7, .sppb-col-xs-8, .sppb-col-xs-9 {
    position: relative;
    /*width: 100%;*/
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}
/*--------- Header ---------------*/
#sp-header .logo a {
    padding-bottom: 10px;
    padding-top: 10px;
}
#sp-header {
    box-shadow: 0 3px 3px rgba(0,0,0,0);
}
#sp-top-bar .sp-module {
    display: inline-block;
    margin: 0 0 0 0px;
}
/*----------------Page Title---------------*/
.sp-page-title {
    background: #1a3867;
    padding: 20px 0;
}
.page-header {
    padding-bottom: 9px;
    margin: 40px 0 20px;
    border-bottom: 1px solid #eee;
    font-size: 24px;
}
/*--------- Front Page --------*/
.bayang {
    text-shadow: 1px 1px 10px #000, 1px 1px 10px #000;
}
.white {
   color: #ffffff;
}
/*--------- Main Menu -----------*/
.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {
    padding: 0 10px;
}
.offcanvas-menu .offcanvas-inner .sp-module ul > li ul > li > a  {
   text-transform: none ;
}
.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a:hover {
    color: #22b8f0;
    background: #fff;
} 
.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a, .sp-megamenu-parent .sp-dropdown li.sp-menu-item span {
    display: block;
    padding: 7px;
    color: #333;
    cursor: pointer;
    font-size: 13px;
    line-height: 17px;
    font-weight: normal;
}
.sp-megamenu-parent .sp-dropdown .sp-dropdown-inner {
    background: #fff;
    box-shadow: 0 3px 5px 0 rgba(0,0,0,0.2);
    padding: 10px;
}
/* -------- Top Bar ---------- */
.top-menu {
    color: #fc9928;
    margin: 0px 22px;
    padding: 10px 0px;
    font-size: 90%;
}
.top-menu > a {
    color:#dadada;
}
.top-menu > a:hover {
    color:#666666;
}
/* -------- Footer & Sidebar Widgets ---------- */
.footer .sp-module {
    padding-bottom: 30px;
}
.footer#sp-bottom .sp-module-title::after {
    background: #fc9928;
}
.footer .sp-module ul > li,
.footer .sp-module ul > li > a {
    display: block;
    /* padding: 12px 0; */
    line-height: 24px;
    -webkit-transition: 300ms;
    transition: 300ms;
}
.footer .nav > li > a:hover {
    background-color: transparent;
    color: #dadada;
}
.widget {
  margin-bottom: 40px;
}
.widget .widget-title {
  margin-top: 0;
  margin-bottom: 20px;
}
.widget ul li {
  margin-bottom: 5px;
  padding-bottom: 5px;
}
.widget ul.list li,
.widget .post {
  margin-bottom: 10px;
  padding-bottom: 10px;
}
.widget .list-border li {
  margin-bottom: 0;
  padding: 10px 0;
}
.widget.brochures > li {
  margin-bottom: 10px;
  padding: 10px;
}
.widget.brochures i {
  color: #666666;
  font-size: 16px;
  margin-right: 10px;
}
.widget.address > li {
  font-size: 13px;
  margin-bottom: 10px;
  padding: 5px 10px;
}
.widget.address > li i {
  font-size: 16px;
  margin-right: 8px;
  vertical-align: middle;
}
.widget .twitter-feed li,
.widget .twitter-feed-carousel li {
  font-size: 13px;
  margin-bottom: 15px;
  margin-top: 0px;
  padding-left: 30px;
}
.widget .twitter-feed li.item,
.widget .twitter-feed-carousel li.item {
  position: relative;
}
.widget .twitter-feed li::after,
.widget .twitter-feed-carousel li::after {
  content: "\f099";
  font-size: 24px;
  font-family: fontawesome;
  left: 0;
  position: absolute;
  top: 0;
}
.widget .styled-icons li {
  margin-bottom: 0;
  padding-bottom: 0;
}
.widget .styled-icons li a {
  margin-bottom: 0;
}
.widget .tags a {
  border: 1px solid #d3d3d3;
  display: inline-block;
  font-size: 11px;
  margin: 5px 4px 5px -2px;
  padding: 5px 10px;
}
.widget .tags a:hover {
  color: #fff;
}
.widget .search-input {
  background: transparent none repeat scroll 0 0;
  border: 1px solid #c0c0c0;
  border-radius: initial;
  box-shadow: none;
  height: 45px;
  padding: 10px;
}
.widget .search-button {
  background: transparent none repeat scroll 0 0;
  border: 1px solid #c0c0c0;
  border-radius: 0;
  height: 45px;
}
.widget .nav-tabs li {
  border-bottom: 1px solid transparent;
  margin-bottom: -2px;
  padding-bottom: 0;
}
.widget .nav-tabs li:hover {
  border-bottom: 1px solid transparent;
}
.widget .post-title a {
  font-size: 13px;
  letter-spacing: 0;
}
.widget .quick-contact-form .form-control {
  background-color: rgba(241, 241, 241, 0.8);
  border-color: #d3d3d3;
  color: #a9a9a9;
}
.widget .product-list .product-title {
  font-size: 14px;
  font-weight: 400;
}
.widget .testimonial-widget-carousel .item img {
  display: inline;
  width: auto;
  float: right;
}
.widget.dark .widget-title {
  color: #fff;
}
.footer#sp-bottom .blog_recent {
  margin-top: 12px;
  display: inline-block;
}
.footer#sp-bottom .sp-module-title {
  color: #fff;
  font-size: 18px;
  line-height: 24px;
  text-transform: none;
  position: relative;
  padding-bottom: 10px;
  margin-bottom: 20px;
}
.footer#sp-bottom .sp-module-title:after {
  border-radius: 10px;
  bottom: -1px;
  content: "";
  height: 2px;
  left: 0;
  position: absolute;
  width: 50px;
}
.footer .nav > li {
  border-bottom: 1px dashed #333333;
  margin-bottom: 0;
  padding: 10px 0px;
}
.footer .nav > li > a {
  padding: 0;
}
.footer .nav > li > a{
    color: #808080;
}
.footer .nav > li > a:hover {
    background-color: transparent;
    color: #ebebeb;
}
.widget.dark .tags a {
  border: 1px solid #777777;
}
.widget.dark .widget-image-carousel .title {
  color: #fff;
}
.widget.dark .search-input {
  border: 1px solid #333333;
}
.widget.dark .styled-icons li a:hover i {
  color: #fff;
}
.widget.dark .search-button {
  border: 1px solid #333333;
}
.widget.dark .widget-subscribe .subscribe-title {
  color: #fff;
}
.widget.dark .widget-subscribe .subscribe-sub-title {
  color: #666666;
}
.widget.dark .nav-tabs li {
  border-bottom: 1px solid transparent;
  margin-bottom: -2px;
  padding-bottom: 0;
}
.widget.dark .nav-tabs li:hover {
  border-bottom: 1px solid transparent;
}
.widget.dark .nav-tabs li:hover a {
  border: 1px solid #555555;
}
.widget.dark .nav-tabs li.active a {
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  -moz-border-right-colors: none;
  -moz-border-top-colors: none;
  background: #333333 none repeat scroll 0 0;
  border-color: #555555 #555555 transparent;
  border-image: none;
  border-style: solid;
  border-width: 1px;
}
.widget.dark .product-title a {
  color: #808080;
}
.footer .widget.dark .post-title a {
  color: #808080;
}
.widget.dark .post-title a {
  color: #333333;
}
.widget.dark .tab-content {
  background: #333333 none repeat scroll 0 0;
  border: 1px solid #555555;
}
.widget.dark .quick-contact-form .form-control {
  background-color: rgba(51, 51, 51, 0.3);
  border-color: #333333;
}
.widget.no-border ul li {
  border: none;
  padding-bottom: 0;
  margin-bottom: 0;
}
.widget ul.list li::before {
  display: none;
}
.widget.dark ul.list li::before {
  display: none;
}
.sidebar .sp-module-title {
  position: relative;
  font-size: 16px;
}
.sidebar .sp-module-title:after {
  height: 2px;
  width: 40px;
  margin-top: 10px;
  background-color: #333333;
  content: "";
  display: block;
}
.footer a {
  color: #808080;
}
.footer a:focus,
.footer a:hover,
.footer a:active {
  color: #666666;
}
.footer .widget .widget-title {
  margin-top: 0px;
}
.footer .widget.dark .quick-contact-form button {
  border-color: #333333;
  color: #909090;
}
.footer .widget.dark .quick-contact-form button:hover {
  background-color: #eeeeee;
  border-color: #eeeeee;
  color: #333333;
}
/* fixed footer */
footer#footer.fixed-footer {
  bottom: 0;
  left: 0;
  position: fixed;
  right: 0;
  z-index: 1;
}
@media screen and (max-width: 992px) {
  footer#footer.fixed-footer {
    position: relative;
  }
}
body.has-fixed-footer .main-content {
  background-color: #fff;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 992px) {
  body.has-fixed-footer .main-content {
    margin-bottom: 0 !important;
  }
}
/* waktu operasi */
.footer .sp-module ul > li {
    display: block;
    border-bottom: 1px dashed #333;
    line-height: 24px;
    padding: 10px 0px;
}
.opening-hours ul li .closed {
    border-radius: 4px;
    font-size: 13px;
    padding: 0 25px;
    background-color: #fc9928 !important;
    color: #ffffff;
}
/*---------------- Button ---------------------*/
.btn-group-lg > .btn, .btn-lg {
    padding: 10px 20px;
    font-size: 15px;
    line-height: 1.3333333;
    border-radius: 27px;
}
.btn-default{
    color: #fff;
    background-color: transparent;
    border-color: #fff;
    text-shadow: 1px 1px 10px #000, 1px 1px 10px #000;
    margin: 5px;
}
.btn-default:hover {
    color: #fff;
    background-color: #fc9928;
    border-color: #adadad;
    text-shadow: none;
}
/*--------------Banner --------------------------------*/
.camera_prevThumbs, .camera_nextThumbs, .camera_prev, .camera_next, .camera_commands, .camera_thumbs_cont {
    background: #d8d8d8;
    background: rgba(216, 216, 216, 0.2);
}
.camera_prev > span,
.camera_next > span {
    opacity: 50%;
}
.camera_commands > .camera_stop {
        opacity: 50%;
}
/*--------------------------Image Border -----------------------------*/
img.foto-border {
    padding: 3px;
    border: 1px solid rgba(0,0,0,0.2);
    background: #fff;
}
img.image-border {
    padding: 5px;
    border: 1px solid rgba(0,0,0,0.2);
    background: #fff;
}
.jm-category-module.default .mod-article-image {
    padding: 5px;
    border: 1px solid rgba(0,0,0,0.2);
    background: #fff;
    margin-bottom: 20px;
}
.jm-category-module.default .mod-article-image.pull-left {
    margin-right: 10px;
}
/*-------------------------Side Module --------------------------------*/
.sp-module ul >li >a:before {
    content: "";
    margin-right: 0px;
}
.sp-module ul > li > a {
    display: block;
    padding: 5px 0;
    line-height: 24px;
    padding: 10px 0;
    -webkit-transition: 300ms;
    transition: 300ms;
    color: #3071a9;
}  
/*---------------------- article ----------------------------*/
.article-footer-top {
    display: table;
    clear: both;
    width: 100%;
    padding-top: 15px;
}
/*--------------------------------------------------------------------*/
@media screen and (min-width: 320px) and (max-width: 374px){
.col-dir-f{
  	width:303px;}
.col-dir-1{
  	width:273px}
.col-dir-2{
  	width:273px; margin-bottom: 0px;}
}
@media screen and (min-width: 375px) and (max-width: 413px){
.col-dir-f{
  	width:333px;}
.col-dir-1{
  	width:243px}  
.col-dir-2{
  	width:243px; margin-bottom: 20px;}  
}
@media screen and (min-width: 414px) and (max-width: 667px){
.col-dir-f{
  	width:303px;}
.col-dir-1{
  	width:280px}
.col-dir-2{
  	width:280px; margin-bottom: 0px;} 
}
@media screen and (min-width: 668px) and (max-width: 768px){
.col-dir-f{
  	width:337px;}
.col-dir-1{
  	width:252px} 
.col-dir-2{
  	width:252px; margin-bottom: 20px;}   
}
@media screen and (min-width: 769px)and (max-width: 1023px){
.col-dir-f{
  	width:333px;}
.col-dir-1{
  	width:273px}  
.col-dir-2{
  	width:273px; margin-bottom: 20px;}  
}
@media screen and (min-width: 1024px) and (max-width: 1199px){
.col-dir-f{
  	width:343px;}
.col-dir-1{
  	width:247px} 
.col-dir-2{
  	width:247px; margin-bottom: 20px;}   
}
@media screen and (min-width: 1200px){
.col-dir-f{
  	width:353px;}
.col-dir-1{
  	width:310px}
.col-dir-2{
  	width:310px; margin-bottom: 0px;}    
}
@media screen and (max-width: 767px){
.tajuk-2 {
    margin: 30px 0px 20px 0px;
    font-size: 15px;
    text-transform: uppercase;
    line-height: 1.3;
    text-align: center;
    font-weight: bold;
    background: #253039;
    padding: 15px;
    color: #fff;
    }
}
@media screen and (min-width: 768px){
.tajuk-2 {
    margin: 30px 0px 20px 0px;
    font-size: 15px;
    text-transform: uppercase;
    line-height: 1.3;
    text-align: center;
    font-weight: bold;
    background: #253039;
    padding: 5px 15px 5px 15px;
    color: #fff;
    }
}
.tajuk-1 {
    margin: 30px 0px 20px 0px;
    font-size: 15px;
    text-transform: uppercase;
    line-height: 1.3;
    text-align: center;
    font-weight: bold;
    background: #253039;
    padding: 15px;
    color: #fff;
    }