@import './components/tab.css';
@font-face {
    font-family: "NexaReg";
    src: url('../fonts/Nexa-Font/NexaRegular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
  } 
  @font-face {
    font-family: "NexaBold";
    src: url('../fonts/Nexa-Font/NexaBold.otf') format('opentype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
  }
  @font-face {
    font-family: "NexaXBold";
    src: url('../fonts/Nexa-Font/NexaXBold.otf') format('opentype');
    font-weight: bolder;
    font-style: normal;
    font-display: swap;
  }
  @font-face {
    font-family: "NexaBlack";
    src: url('../fonts/Nexa-Font/NexaBlack.otf') format('opentype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
  }
  @font-face {
    font-family: "NexaHeavy";
    src: url('../fonts/Nexa-Font/NexaHeavy.otf') format('opentype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
  }
*{
    box-sizing: border-box;
}
a:active, a:focus, a:visited, button:focus, button:visited, input:focus, input:visited, .btn.focus, .btn:focus{
    outline: 0 !important;
    box-shadow: none;
}
body{
    font-size: 16px;
    font-family:'NexaReg', Arial, Helvetica, sans-serif;
    background: #f5f5f5;
}
.no-margin{
    margin: 0;
}
.no-padding{
    padding: 0;
}
a:hover{
    text-decoration: none;
}
section{
    margin-bottom: 60px;
}
.img-responsive{
    width: 100%;
}
h1{
    font-size: 18px;
}
h2{
    font-size: 18px;
}
.bg-white{
    background: #fff;
}

.title, .custom-title, b, strong{
    font-family: 'NexaHeavy';
}
.box-img{
    border: 1px solid #ebebeb;
    padding: 10px 8px;
}
.box-img img{
    width: 100%;
    height: 230px;
    object-fit: cover;
}
.news-item .box-img:hover {
    opacity: .7;
}
.red-link{
    color: #ee3342;
}
.red-link:hover{
    color: #ee3342;
    text-decoration: underline;
}
input::placeholder{
    color:#C3C3C3
}
.homeslider{
    position: absolute;
}
.custom-tab-menu .tab-content> .tab-pane, .custom-tab .tab-content> .tab-pane{
    height: auto;
}
.slider-item:active, .slider-item:focus{
    outline: none;
}
.slider-item{
    position: relative;
}
.slider-item img{
    width: 100%;
}
.slider-item .slider-caption{
    position: absolute; 
    z-index: 999;
    left: 0;
    right:0;
    top: 0; bottom: 0;
    color: #fff;
}
.slider-caption .container {
    height: 100%;
}
.slider-caption .caption-content{
     width: 270px;
     text-align: center;
     padding-top: 40px;
}
.caption-content .title{
    font-size: 24px;
    letter-spacing: 2px;
    text-transform: uppercase;

} 
.caption-content .periode{
    font-size: 16px;
    font-family: 'NexaBold';
    letter-spacing: 3.2px;
    text-transform: uppercase;
    padding: 20px 0 0px;
    border-bottom: 1px solid #fff;
}
.caption-content .date{
    font-size: 12px;
    padding-top: 10px;
    font-family: 'NexaBold';
    text-transform: uppercase;
    margin-bottom: 10px;
}
.caption-content .slider-button{
    border-radius: 20px;
    font-size: 12px;
    color: #1f2a63;
    background: #fff;
    padding: 13px 20px 10px;
    display: block;
    font-family: 'NexaHeavy';
    text-transform: uppercase;
}
.slick-slide .slider-button img{
    display: inline-block;
    width: 20px;
    margin-left: 10px;
    margin-top: -2px;
}
.slick-arrow{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 99;
    font-size: 0;
    background: #000;
    padding: 20px;
    border-radius: 50%;
    border:0;
    left:5%;
    opacity: 0.5;
}
.slick-arrow:hover{
    opacity: 80%;
}
.slick-arrow:before{
    content: '';
    width: 10px;
    height: 10px;
    border-radius: 0px;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(45deg);
    display: block; 
}
.slick-next{
    right: 5%;
    left:auto;
}
.slick-next:before{
    transform: rotate(-135deg);
}
.slick-dots{
    position: absolute;
    bottom: 50px;
    left: 50%;
    transform: translateX(-50%); 
    
}
.slick-dots li{
    display: inline-block;
    padding: 0 1px;
}
.slick-dots li button{
    background: #fff;
    border: 0;
    font-size: 0;
    border-radius: 3px;
    height: 6px;
    transition: all 0.5s ease-in-out;
    width: 8px;
} 
.slick-dots .slick-active button{
    width: 30px;
    transition: all 0.5s ease-in-out;
}
.slider-section {
    position: relative;
}
.frontpage .slider-section{
    margin-bottom: 30px;
}
.slider-aditional-info{
    position: absolute;
    z-index: 999;
    top: 40%;
    right: -130px; 
    color: #fff;
    display: flex;
    transform: rotate(-90deg);
    
}
.slider-aditional-info >div{
    padding:0 10px;
    color:#fff;
    font-size: 40px;
    line-height: 25px;
    font-family: 'NexaHeavy';
}
.slider-aditional-info span{
    font-size: 10px;
    display: block;
}
.search-container{ 
    background: #212c68;
    margin-top: -40px;
    position: relative;
    margin-bottom: 30px;
    text-align: center;
    padding: 25px 0;
}
.search-container > form > input{ 
    vertical-align: top;
}
.search-container input[type=text]{
    width: 40%; 
    border-radius: 3px;
    border: 0;
    font-size: 12px;
    padding:8px 10px 5px 10px;
}
.search-container .search-btn{
    width: 30%;
    padding:9px 10px 5px 10px;
    background: #EE3342;
    color: #fff;
    font-size:12px;
    text-align:center;
    border-radius: 3px;
    border:0;
    text-transform: uppercase;
    transition: 300ms ease;
}
.search-container .search-btn:hover {
    background: #f7606d;
}
.search-container  .adv-search-btn, .search-container  .basic-search-btn{
    border:1px solid #fff;
    background:#212c68;
    color: #fff;
    font-size: 9px;
    font-family: NexaBold;
    border-radius:3px;
    padding: 9px 10px 8px;
    transition: 300ms ease;
    text-align: center;
}
.search-container  .adv-search-btn:hover, .search-container  .basic-search-btn:hover {
    background: #4b5baf;
}
.search-container  .advance-search{
    width: 95%;
    display: none;
    margin: 0 auto;
}
.advance-search select, .advance-search input{
    width: 100%;
    border-radius: 3px;
    border: 1px solid rgb(195, 195, 195);
    margin: 0 4px 5px;
    display: inline-block;
    font-size: 12px;
    padding: 10px 7px 6px;
    color: #333;
}

.basic-search select {
    width: 100%;
    border-radius: 3px;
    border: 1px solid rgb(195, 195, 195);
    margin: 0 4px 5px;
    display: inline-block;
    font-size: 12px;
    padding: 10px 7px 6px;
    color: #333;
}
.select2-results__option{
    font-size: 12px;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable{
    background: #ddd;
    color: #333333;
}
.search-container .advance-search select{
    width: 160px;
  
}

.search-container .basic-search select{
    width: 160px;
  
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
    color: #C3C3C3;
}
.select2-container--below .select2-selection--single .select2-selection__rendered,
.select2-container--above .select2-selection--single .select2-selection__rendered {
    color: #333!important;
}
.lang-container .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 1.8;
}
.search-container .advance-search .search-btn{
     width: 48%;
     margin-right: 10px;
 }
 .search-btn-container{
     display: flex;
     font-size: 11px;
     justify-content: space-between;
 }
 .slide-continer{
     padding: 15px 0;
 }
 .slide-continer:after,  .slide-continer:before{
     content: ' ';
     clear: both;
     display: table;
 }
 .noUi-horizontal {
    height: 5px;
}
.noUi-horizontal .noUi-handle{
    height: 11px;
    width: 11px;
    border-radius: 50%;
    right: -1px;
    background:#ee3342;
    border:0;
    top: -3px;
    box-shadow:none
}
.noUi-target{
    border:0;
    box-shadow: 0;
}
.noUi-horizontal .noUi-handle .noUi-touch-area:focus{
    outline: none;
}
.noUi-handle:after, .noUi-handle:before{
    display: none;
}
.noUi-handle-upper .noUi-tooltip{
    right: 0;
    left:auto;
    transform: none;
}
 
.caraikut-container img{
    max-width: 100%;
    margin-bottom: 20px; 
    height: auto;
}
.caraikut-container .caraikut-item{
    margin-bottom: 30px;
}
.caraikut-container h2{
    font-family: NexaHeavy;
    font-size: 20px;
    color: #212C68;
 
}
.caraikut-item a, .caraikut-item a:visited, .link-otherinfo a, .link-otherinfo a:visited{
    color: #ed2c3c;
}
.caraikut-item a:hover, .link-otherinfo a:hover{
    color: #212C68;
}
.video-homepage-container{
    margin-top: -150px;
}
.other-info-container{

}
.other-info-container img{
    max-width: 100%;
    height: auto;
}
.other-info-slider .slider-point{
    padding: 0 15px;
}
.other-info-slider .slick-list {
    margin:0 -15px;
}
.other-item {
    height: 100%;
    padding: 15px;
    background: #fff;
    box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.05); 
}
.other-info-container .row > div{
    margin-bottom: 20px;
}
.other-title{
    font-size: 16px;
    color: #212c68;
    font-family: NexaHeavy; 
    border-bottom: 1px solid #ebebeb;
    padding: 15px 0 5px;
    margin-bottom: 15px;

}
.sidebar-container .other-info-container{
    margin: 0;
    padding-top: 30px;
}
.noUi-handle-lower .noUi-tooltip{
    left: 0;
    transform: none;
}
.noUi-tooltip{
    font-size: 10px;
    background: transparent;
    border: 0;
    color: #fff;
}
.noUi-connect{
    background:#ee3342;
}
.grade-list a{
    display: block;
    border-radius: 5px;
    box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.05);
    position: relative;
    margin-bottom: 20px;
    overflow: hidden;
}
.grade-info {
    position: absolute;
    z-index: 99;
    bottom: 10px;
    left: 15px;
    text-align: center;
    color: #fff;
}
.grade-info img{
    margin-left: 10px;
    width: 13px;
}
.grade-letter {
    font-size: 90px;
    line-height: 65px;
    font-family: 'NexaBlack';
}
.page-title, .sub-title {
    margin-bottom: 30px;
}
.page-title h1, .sub-title h2{
    text-transform: uppercase;
    display:  flex;
    -webkit-box-align: center!important;
    -ms-flex-align: center!important;
    align-items: center!important;
    margin:0;
    padding-top: 7px;
}
.page-title h1:before, .sub-title h2:before{
    content: '';
    height: 30px;
    width: 31px;
    background-color: #212c68;
    display: inline-block;
    margin-right: 10px;
    border-radius: 50%;
    margin-top: -7px;
    flex: 0 0 31px;
} 
.schedule-item{
    margin: 10px 0;
    height: 120px; 
    padding: 8px 10px;
    border-radius: 10px;
    overflow: hidden; 
}
.schedule-item.car-bid{
    background: url(../img/car-schedule-bg.svg) no-repeat left bottom #fff;
    background-size: 85px; 
}
.schedule-item.bike-bid{
    background: url(../img/bike-schedule-bg.svg) no-repeat  left bottom #fff; 
    background-size: 85px;
    color: #EE3342;
}
.schedule-slider .slick-slide, .schedule-slider-bike .slick-slide{
    /* padding: 20px; */
    margin: 0 10px;
    position: relative;
    overflow: hidden;
}
.bid-location {
    font-family: NexaHeavy;
    font-size: 16px;
    text-align: right;
} 
.bid-date{
    font-family: NexaBold;
    font-size: 12px;
    text-align: right;
}
.search-tab-menu{
    background: #fff;
}
.search-tab-menu .nav-tabs .nav-item:last-child{
    padding-top: 7px;
}
.btn-showhide-searchtab {
    width: 28px;
    height: 28px;
    background:#ed2c3c;
    padding: 5px;
    text-align: center;
    display: block;
    border-radius: 5px;
    overflow: hidden;
}
.btn-showhide-searchtab:before{
    content: '';
    height: 10px;
    width: 10px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    display: inline-block;
    transform: rotate(-45deg);
    position: relative;
    top: 0;

}
.btn-showhide-searchtab.collapsed:before{ 
    transform: rotate(135deg);
    top: -3px; 
} 
.video-item{
    background:url('../img/bg-video.svg') no-repeat;
    background-size: cover;
    border-radius: 5px; 
    padding: 50px 30px;
    margin:0 10px;
    position: relative;
}
.video-slider .slick-dots, .other-info-slider .slick-dots{
    position: static;
    text-align: center; 
    padding-top: 20px;
    transform: unset;
}
.video-slider .slick-dots li, .other-info-slider  .slick-dots li{
    padding: 0 3px;
}
.video-slider .slick-dots button, .other-info-slider  .slick-dots button{
    background-color: #C1C1C1;
    height: 10px;
    border-radius: 6px;
}
.video-slider .slick-dots .slick-active button, .other-info-slider  .slick-dots .slick-active button{
    background-color: #212C68;
   
}
.video-title{
    position: absolute;
    top: 0;
    left: 0;
    background: #EE3342;
    color: #fff;
    padding: 5px 15px 2px;
    font-size: 18px;
    border-radius: 0px 0px 15px;
}
.tips-item{
    font-size: 13px;
    color: #212c68;
}

.tips-item img{
    width: 100%;
    height: 160px;
    object-fit: cover;
    border-radius: 4px;
    border: solid 1px #fff;
}
.tips-number {
    width: 40px;
    height: 40px;
    background: #222b68;
    color: #fff;
    margin: -24px auto 0;
    border-radius: 50%;
    text-align: center;
    padding: 10px;
    z-index: 99;
    position: relative;
    font-size:16px;
}
.tips-text{
    padding-top: 10px;
    text-align: center;
}
.tips-item >  a.titiplual-link { 
    position: relative;
    display: block;
}
.titipjual-tips .row > div:last-child   .tips-text {
    padding-top: 25px;
}
.tips-text a{
    color: #212c68;
}
.btn-titip{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;  
    display: inline-flex;
    -webkit-box-align: center!important;
    -ms-flex-align: center!important;
    align-items: center!important; 
    text-align: center;
    color: #fff;
}
.btn-titip > div{
    width: 100%;
    text-align: center; 
    padding: 10px;
}
.btn-titip .arrow{
    display: block;
    border-radius: 50%;
    background: #ed2c3c;
    width: 40px;
    height: 40px;
    padding: 13px 0 0;
    margin:0 auto
}
.btn-titip .arrow:before{
    content: '';
    width: 10px;
    height: 10px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    transform: rotate(45deg);
    display: inline-block;
} 
.why-us-section{
    position: relative;
    padding-bottom: 200px;
}
.whyus-content-container{
    background: linear-gradient(-180deg, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%);
}
.whyus-list {
    margin-bottom: 40px;
}
.whyus-list li{
    width: 32%;
    margin-bottom: 20px; 
    display: inline-flex;
    justify-content: left;
    align-items: center;

}
.whyus-list li img{
    display: inline;
    margin-right: 10px;
    width: 50px;
    border-radius: 5px;
    box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.1);
}
.why-us-section h2{
    font-size: 28px; 
}
.why-us-section h2 > span{
    display: block;
    font-size: 14px;
    font-family: 'NexaReg';
    padding-bottom:10px;
}
.why-us-section .whyus-text{
    line-height: 36px;
    margin-bottom:25px;
}
.hand{
    position: absolute;
    bottom: 0;
    right: 0;
}
.news-list{
    height: 100%;
    background-color: #fff;
    padding: 25px 30px;
}
.promote-news .news-img:before{
    width: 40px;
    height: 40px;
    background: url(../img/promote.svg);
    content: '';
    position: absolute;
    top: 15px;
    left: 15px;
    z-index: 99;
    
}
.news-img{
    margin-bottom:10px;
    position: relative;
}
.meta-news {
    color: #9d9b9b;
    font-size: 11px;
    margin-bottom: 15px;
}
.meta-news img{
    margin-right: 8px;
}
.meta-news > div{
    display: inline-flex; 
    margin-right: 20px;
    padding:5px 0 0 25px;
    font-family: 'NexaBold';
}
.meta-news > div.date{
    background: url(../img/icon-date.svg) no-repeat left;
    background-size: 15px;
}
.meta-news > div.time{
    background: url(../img/icon-time.svg) no-repeat left;
    background-size: 15px;
}
.news-category{
    text-transform: uppercase;
    color: #ed2c3c;
    font-size: 12px;
    font-family: 'NexaHeavy';
}
.news-title{
    color:#212c68;
    margin-bottom: 10px;
    font-size: 14px;
}
.news-info{
    color: #2e2e2f;
    font-size: 14px;
}
.news-section{
    margin-bottom:60px;
}
.budget-list{
    margin:0 -15px
}
.budget-list:before, .budget-list:after{
    content:'';
    display: table;
    clear: both;

}
.budget-list > .budget-item:first-child{
    width: 50%;
}
.budget-list > .budget-item{
    display: inline-block;
    float: left;
    width: 25%;
    padding: 15px; 
}
.budget-list > .budget-item a{
    display: block;
    position: relative;
    border-radius: 5px;
    box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}
.budget-list > .budget-item img{
    width: 100%;
    height: auto;
}
.budget-caption{
    position: absolute;
    bottom: 5px;
    right: 10px;
    z-index: 9;
    font-family: 'NexaBold';
    text-align: right; 
    color: #fff;
    font-size: 14px; 
}
.budget-item:first-child {
    bottom: 20px;
    right: 20px;
}
.budget-caption:after{
    display: inline-block;
    background: url('../img/arrow-right-white.svg') no-repeat;
    background-size: contain;
    content: ' ';
    width: 16px;
    height: 16px;
}
.budget-item .budget-caption span{ 
    font-family: 'NexaHeavy';
    font-size: 18px;
    display: block;
    line-height: 18px;
}
.budget-item:first-child .budget-caption{
    font-size: 16px;
}
.budget-item:first-child .budget-caption span{ 
    font-size: 30px; 
    line-height: 30px;
}
.container{
    position:relative;
}
.footer-social-media{
    margin-top: 0px;
}
.footer-social-media a{
    display: inline-block;
    border-radius: 5px;
    border: 1px solid #EE3342;
    overflow: hidden;
}
  /* .schedule-slider .slider-item > div{
 filter: blur(3px);
 } 
 .schedule-slider .slider-item.slick-active > div{
     filter: none;
 } */
 .schedule-slider:before,  .schedule-slider-bike:before{
    content:'';
    height:100%;
    width:150px;
    background: rgb(245,245,245);
    background: linear-gradient(90deg, rgba(245,245,245,1) 0%, rgba(245,245,245,0) 100%);
    position:absolute;
    z-index: 10;
    left:0;	 
    opacity:0.7
 }
 .schedule-slider:after,  .schedule-slider-bike:after{
    content:'';
    height:100%;
    width:150px;
    background: rgb(245,245,245);
    background: linear-gradient(90deg, rgba(245,245,245,0) 0%, rgba(245,245,245,1) 100%);
    position:absolute;
    z-index: 10;
    right:0;	 
    opacity:0.7;
    top:0;
 }
 .footer .footer-contact {
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
 }
 .footer-contact a{
    color: #212c68;
    margin-right: 20px; 
    display: inline-flex;
    align-items: center;
    font-size: 12px;
 }
 .footer-contact a img{
    margin-right: 5px;
 }
  .desktop-show{
     display: block;
 }
 .mobile-hide{
    display: inline-block;
} 
.mobile-show {
    display: none;
    
} 
#jba-footermenu{
    display: flex;
} 
.recomendation-slider2 .slider-item.recomendation-item{
   margin: 0 10px
} 

.homeslider.slick-initialized .slick-slide .img-responsive {
    display: block;
    max-height: 420px;
    object-fit: cover;
    object-position: top; 
}
.modal-custom-homepage .close {
    background: red;opacity: 1;width: 30px;height: 30px;border-radius: 50%;color: #fff;z-index: 999;font-size: 30px;outline: none;padding: 2px;
}
.lang-container .form-control-select {
    padding: 3.5px;
}
.slider-section .slick-list {
    background: #333;
}

/* Lang Menu */
/* ================== */
.top-menu .lang-container .select2-container {
    width: auto!important;
}
.top-menu .lang-container .select2-container .select2-selection__rendered span{
    font-size: 12px;
    padding: 5px 10px 5px 0;
    line-height: 1;
    color: #000;
}
.top-menu .lang-container .select2-container--default .select2-selection--single {
    border-color: #000;
}
.top-menu .lang-container .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-width: 7px 7px 0 7px;
    margin-left: -12px;
    margin-top: -4px;
    border-color: #000 transparent;
}
.top-menu .lang-container .select2-search.select2-search--dropdown {
    display:none;
}
.top-menu .lang-container span.select2.select2-container.select2-container--default.select2-container--below.select2-container--focus.select2-container--open .select2-selection__arrow b {
    transform: rotate(180deg);
}
/* Lang Menu */
/* ================== */

/* Topbar Navbar */
.navbar-main-top {
    background: rgb(240, 240, 240)!important;
    z-index: 999;
}
.navbar-text-contact {
    color: rgb(33, 44, 104);
    font-family: 'NexaBold';
    font-size: 12px;
    font-weight: bold;
    text-align: right;
    padding: 11px 6px 7px;
}
.navbar-text-contact b {
    padding-left: 2px;
}
.kendaraan-status .status-title{
    font-size: 12px;
    text-align: center;
    color: #5b5b5b;
    padding: 1px 0 1px;
    background: #e5e5e5;
}
.status-content{
    text-align: center;
    font-size: 11px;
    text-transform: uppercase; 
    
    color: #5b5b5b;
}
.status-content .row > .col{
    border-left: 1px solid #DEDEDE; 
    padding: 10px 0px 8px;
} 
.status-content .row > .col:first-child{
    border: 0;
}
.status-content span img{
    height: 13px;
    display: block;
    margin: 0 auto 5px;
}
.grade-kendaraan-content span{
    font-size: 24px;
    font-family: 'NexaHeavy';
    display: block;
    text-transform: uppercase;
    text-align: center;
}
.schedule-noslider{
    padding: 0 100px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.schedule-noslider .schedule-item{
    width: 100%; 
}
.schedule-noslider  .slider-item{
    flex: 0 0 25%;
    max-width: 25%;
    padding: 0 10px;
}
.hamburger-sitemap {
    border:0;
    background: #212c68;
    color: #fff;
    border-radius: 5px;
    font-size: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 9px 10px;
    padding-bottom: 7px;
    text-transform: uppercase;
    cursor: pointer;
    flex-direction: column;
}
.hamburger-sitemap span
{
  display: block;
  width: 16px;
  height: 2px;
  margin-bottom: 2px;
  position: relative;
  
  background: #cdcdcd;
  border-radius: 3px;
  
  z-index: 1;
  
  transform-origin: 4px 0px;
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}

.hamburger-sitemap span:first-child
{
  transform-origin: 0% 0%;
}

.hamburger-sitemap span:nth-last-child(2)
{
  transform-origin: 0% 100%;
}
.btn-sitemap {
    border:0;
    background: #212c68;
    color: #fff;
    border-radius: 5px;
    font-size: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 9px 10px;
    text-transform: uppercase;
}
.btn-sitemap::before{
    background: url('../img/icon-sitemap.svg') no-repeat;
    background-size: 10px;
    content: '';
    display: inline-block;
    margin-right: 10px;
    height: 10px;
    width: 10px;
}
.btn-sitemap span{
    line-height: 0;
    display: inline-block;
    padding-top: 2px;
}
.sitemap-cont{
    
}
.sitemapmenu-header{
    position: absolute;
    top: 40px; 
    left: 0;
    right: 0;
    height: 200px;
    z-index: -1;
 
    padding-top: 10px;
    opacity: 0;
    transition: all  0.5s ease-in-out;
}
.sitemap-cont:hover .sitemapmenu-header{
    z-index: 999;
    top: 43px; 
    opacity: 1;
    transition: all  0.5s ease-in-out;
}
.sitemap-menu-container{
    background: #fff;
    padding: 20px 0;
}
.top-menu .sitemap-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap; 
}
.sitemap-title{
    font-size: 14px;
    font-family: 'NexaBold';
    text-align: left;
    margin-bottom: 10px;
    padding-left: 25px;
}
.sitemap-title.title-website{
    background: url('../img/icon-browser.svg') no-repeat; 
}
.sitemap-title.title-jba{
    background: url('../img/icon-personal-data.svg') no-repeat; 
}
.sitemap-title.title-help{
    background: url('../img/icon-help.svg') no-repeat; 
}
.top-menu .sitemap-list a.sitemap-link {
    border: 0;
    color: #111;
    font-size: 13px;
    text-transform: capitalize;
    padding: 8px 0 7px;
    max-width: 50%;
    flex: 0 0 50%;
    text-align: left;
}
.top-menu .sitemap-list a.sitemap-link:hover {
    color: #212c68;
}
.logo-link{
    opacity: 1;
    transition: all 0.2s ease-in-out;
}
.logo-link.hide{
    opacity: 0;
    transition: all 0.2s ease-in-out;
}
.title-w-more{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.title-w-more a.btn-selengkapnya{
    color: #ee3342;
    font-family: NexaBold;
}
.title-w-more a.btn-selengkapnya:hover{
    color: #212C68;
}

.table-responsive{
    overflow-x: auto;
}
.detail-product-share {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    padding: 10px;
}
.detail-product-share li{
    list-style: none; 
}
.detail-product-share li a{
    width: 37px;
    height: 37px;
    display: block;
}

.detail-product-share li.fb-icon a, .socialMedia li.fb-icon a{
    background: url(../img/social/icon-facebook-square.svg) no-repeat;  
}
.detail-product-share li.email-icon a{
    background: url(../img/social/icon-mail.svg) no-repeat;  
}
.detail-product-share li.wa-icon a{
    background: url(../img/social/icon-wa-square.svg) no-repeat;  
}
.detail-product-share li.ig-icon a{
    background: url(../img/social/icon-instagram-square.svg) no-repeat;  
}
.detail-product-share li.twitter-icon a{
    background: url(../img/social/icon-twitter-square.svg) no-repeat;  
}
.lSSlideOuter .lSPager.lSGallery li{
    height: 90px;
}
.youtube {
    background-color: #fff; 
    position: relative;
    height: 315px;
    overflow: hidden;
    cursor: pointer;
  }
  .youtube img {
    width: 100%; 
    left: 0;
    opacity: 1;
    height: auto;
  }
  .youtube .play-button {
    width: 68px;
    height: 48px;
    background-color: #333;
    box-shadow: 0 0 30px rgba( 0,0,0,0.0 );
    z-index: 1;
    opacity: 0.8;
    border-radius: 6px;
  }
  .youtube .play-button:hover, .youtube:hover .play-button{
    background-color: #c00;
    opacity: 1;
  }
  .youtube .play-button:before {
    content: "";
    border-style: solid;
    border-width: 10px 0 10px 18px;
    border-color: transparent transparent transparent #fff;
  }
  .youtube img,
  .youtube .play-button {
    cursor: pointer;
  } 
  .youtube .play-button,
  .youtube .play-button:before {
    position: absolute;
  }
  .youtube .play-button,
  .youtube .play-button:before {
    top: 50%;
    left: 50%;
    transform: translate3d( -50%, -50%, 0 );
  }
  .youtube iframe {
    height: 100%;
    width: 100%;
  
  }
/*responsive*/
@media  (min-width: 1024px) {
    .homeslider.slick-initialized .slick-slide .img-responsive {
        min-height: 380px;
    }
}
@media (min-width: 1200px) {
}
@media (max-width: 1023px) {
    .hand{
        width: auto;
        height: auto;
    }
 
} 
@media (max-width: 991px) {
    .hand{
        width: 250px;
        height: auto;
    }
    .why-us-section { 
        padding-bottom: 00px;
    }
    .news-section{
        margin-top: 50px;
    }
    .homeslider.slick-initialized .slick-slide{
        height: 400px;
    }
    .homeslider.slick-initialized .slick-slide img{
        object-fit: cover;
        height: 100%;
    }
    .schedule-item{
        height: 100px;
    }
    .budget-list > .budget-item {
        display: inline-block;
        float: left;
        width: 50%;
        padding: 15px;
    }
    .budget-list > .budget-item:first-child {
        width: 100%;
    }
    .grade-list a > img{
        width: 100%;
    }
    .video-item iframe {
        height: 190px;
    }
    .footer-social-media {
        margin-top: 0px;
    }
    .sitemap-cont:hover .sitemapmenu-header { 
        top: 120px;
    }
    .top-menu .sitemap-list{
        flex-direction: column;
    }
    .top-menu .sitemap-list a.sitemap-link {
    flex: 0 0 100%;
    max-width: none;

    }
    .whyus-list li {
        width: 49%;
    }
    .video-homepage-container{
        margin:20px 0 40px ;
    }
    .news-list .box-img img{
        height: 115px;
    }
    .schedule-noslider{
        padding: 0 60px;
    }
    .schedule-noslider .slider-item{
        flex: 0 0 33.33%;
        max-width: 33.33%;
    }
    .lSSlideOuter .lSPager.lSGallery {
        margin-bottom: 10px;
    }
    .lSSlideOuter .lSPager.lSGallery li{
        height: 83px;
        overflow: hidden;
    }
    .lSSlideOuter .lSPager.lSGallery li img{ 
        height: 100%;
        max-width: none;
        width: 100%;
        object-fit: cover;
    }

}

@media (max-width: 767px) {
    
   .mobile-hide{
      display: none;
   } 
   .top-menu ul li.sitemap-cont{
       display: none;
   }
   .mobile-show {
      display: block;

   }
   #jba-footermenu.collapse:not(.show) {
      display: none;
   }
   #jba-footermenu {
      padding: 20px 10px;
   }
   footer > .container {
      margin-bottom: 0;
   }
   section {
      margin-bottom: 30px;
   }

   .homeslider.slick-initialized .slick-slide {
      height:420px;

   }
   .homeslider.slick-initialized .slick-slide img {
      object-fit: cover;
      height: 100%;
   }
   .slider-aditional-info { 
      transform: rotate(0deg); 
      right: 10px;
      top: 380px;
      text-shadow: 2px 2px 1px rgba(1, 1, 1, 1);
      display: none;
   }
   .slider-item .slider-caption {
      left:40px;
      right: 40px;
   }
   .slick-next {
      right: 0;
   }
   .slick-prev {
      left: 0;
   } 
   .search-container .search-btn, .search-container input[type=text], .search-container .adv-search-btn , .advance-search {
      width: 100%;
      margin-bottom: 10px;
   }
   .search-container .advance-search .search-btn {
      width: 100%;
      margin: 0px;
   }
   .search-btn-container {
      flex-direction: column;
   }
   .advance-search .slide-continer  {
         padding: 40px 0 25px 0;
   }
   .advance-search select {
      width: 100%;
      margin:0  0 10px;
   }
   .basic-search select {
      width: 100%;
      margin:0  0 10px;
   }
   .search-tab-menu .nav-tabs .nav-item  {
         width: 45%;
      text-align: center;
   }
   .search-tab-menu .nav-tabs .nav-item:last-child {
      width: 10%;
      padding-top: 20px;
   }

   .video-slider .slick-dots {
      display: block !important;
   }
   .tips-item {
      margin-bottom: 15px;
   }
   .hand {
      width: 45%;
   }
   .whyus-list li {
      width: 100%;
   }
   .news-item {
      margin-bottom: 20px;
   }
   .budget-list > .budget-item , .budget-list > .budget-item:first-child {
      width: 100%;
   }
   .chat-icon , .chat-button.active .chat-icon {
      width: 60px;
      height: 60px;
   }
   .footer-social-media {
      margin-top: 0px;

   }
   .footer-info .custom-title {
      font-size: 14px;
      font-family: 'NexaBold';
      padding-bottom: 10px;
   }
   footer .row .footer-info {
      font-size: 12px; 
    padding-top: 10px;
   }
   footer .row .footer-address{

   }
   footer .address-contaier {
      margin: 0;
   } 
   .footer-info > div:not(:last-child) {
      margin-bottom: 15px;
   }

   .footer-info .operatinal-container .custom-title {
      font-size: 12px;
   }

   .footer-social-media a {
      margin : 0 5px 0 0
   }
   .site-map-footer > button {
      width: 100%;
      color: #fff;
      display: flex;
      flex-direction: row;
      justify-content: space-between;

   }
   .site-map-footer .navbar-toggler-icon:before , .site-map-footer .navbar-toggler-icon::after {
      display: none; 
   }
   .site-map-footer .navbar-toggler  .navbar-toggler-icon {
      background: transparent;
      border-bottom: 2px solid #fff;
      border-right: 2px solid #fff;
      transform: rotate(-130deg);
      width: 10px;
      height: 10px;
   }
   .site-map-footer .navbar-toggler.collapsed .navbar-toggler-icon {
      background: transparent;
      border-bottom: 2px solid #fff;
      border-right: 2px solid #fff;
      transform: rotate(45deg);
      width: 10px;
      height: 10px;
   }
   .address-contaier {
      border-top: 1px solid #212c68;
   padding-top: 20px;
   }
   .footer-address .footer-social-media {
      padding-top: 10px;
      border-bottom: 1px solid #212c68;
      padding-bottom: 5px;
   }
   .footer-info  {
         display: flex;
   flex-direction: row;
   }
   .cs-container, .operatinal-container {
      position: relative; 
      padding-left: 45px;
      font-size: 9px;
      width: 50%;
   }
   .cs-container:before, .operatinal-container:before {
      background: url(../img/icon-footer-cs.svg) no-repeat center center;
      content: '';
      width: 40px;
      height: 40px;
      display: block;
      position: absolute;
      left: 0;
      top: 0;
      background-size: 20px;
      border-radius: 5px;
      border:1px solid #212c68;
   }
   .operatinal-container:before {
      background: url(../img/icon-footer-support.svg) no-repeat center center;
      background-size: 20px;
   }
   .footer-info .custom-title, .footer-info .operatinal-container .custom-title {
      font-size: 10px;
      text-transform: uppercase;
      padding-bottom: 0;
      font-family: 'NexaHeavy';
   }
   .cs-info span.day {
      display: block;
   }
   .num-tel {
      display: block;
   }
   .frontpage .search-container .basic-search {
      padding: 0 15px;
   }
   .frontpage .search-container .basic-search input[type=text], .frontpage .search-container .basic-search input.search-btn {
      width: 50%;
   }
   .search-container .adv-search-btn  {
         width: 100%;
   }
   .frontpage .search-container {
      padding:15px 0;
      margin-top: -80px;
   }
   .frontpage  .search-container .advance-search {
      width: 100%;
      padding: 0 10px;
   }
   .frontpage .select-container {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
   }
   .frontpage  .search-container .advance-search select {
      width: calc(50% - 10px); 
   margin:0 5px 10px;
   }
   .frontpage  .search-container .basic-search select {
      width: calc(50% - 10px); 
      margin: auto;
   }
   .frontpage  .search-container .advance-search .search-btn-container {
      padding: 5px;
   
   }
   .frontpage  .search-container .advance-search .basic-search-btn {
      margin:0  
   } 
   .frontpage .btn-seemore-container{
      padding: 0 15px;
      margin-bottom: 30px;
   }
   .frontpage .btn-seemore-container .btn-seemore{
      border: 0;
      background: #ee3342;
      color: #fff;
      font-size: 12px;
      padding: 10px ;
      text-align: center;
      display: block;
      width: 100%;
      border-radius: 5px;
   }
   .frontpage .btn-seemore-container.car-blue .btn-seemore{
       background: #212c68;
   }
   .frontpage .whyus-list li{
      margin-bottom: 10px;
   }
   .frontpage  .whyus-list li img{
      width: 40px;
   }
   .frontpage .news-list { 
      padding: 10px;
  }
  .frontpage .news-list  .news-info{
      display: none;
  }
  .frontpage .news-list  .news-title{
     font-size: 16px;
  }
  .recomendation-slider2 .slick-dots{
     position: static;
     width: 100%;
     text-align: center;
     margin: 0;
    padding: 0;
    transform: unset;
  }
  .recomendation-slider2 .slick-dots .slick-active button{
      background: #212C68;
   }
   .recomendation-slider2 .product-item{
      margin: 0 5px;
   }

   .modal-custom-homepage .close {
        position: absolute;
        right: 20px;
        top: 20px;
    }
    .slider-caption .caption-content {
        margin: auto;
    }
    .schedule-noslider, .schedule-slider, .schedule-slider-bike{
        padding:0;
        display:flex;
        flex-direction: row;
        flex-wrap: wrap;
        overflow: hidden;
        position: relative;
        

    }
    .schedule-noslider .slider-item, .schedule-slider  .slider-item, .schedule-slider-bike  .slider-item{
        flex:0 0  50%;
        max-width: 50%;
        padding:0 15px  ;
        margin:0;
    }
    .schedule-noslider .schedule-item, .schedule-slider-bike .schedule-item {
        width: 100%;
        margin: 10px 0;
    }
    .schedule-slider:before, .schedule-slider-bike:before, .schedule-slider:after, .schedule-slider-bike:after{
        display: none !important;
    }
    .auction-space{
        display: block;
        font-size: 0;
    }
    .schedule-item.car-bid{
        background: url(../img/car-schedule-bg.svg) no-repeat left bottom #fff;
        background-size:75px; 
    }
    .schedule-item.bike-bid{
        background: url(../img/bike-schedule-bg.svg) no-repeat  left bottom #fff; 
        background-size:75px;
    }
    .video-homepage-container{
        margin-top: 30px;
    } 
    .lSSlideOuter .lSPager.lSGallery li{
        height: 40px;
        overflow: hidden;
    }
    .lSSlideOuter .lightSlider {
        height: 260px !important;
    }
    .news-list .box-img img{
        height: auto;
    }
    .youtube {
        height: auto;
    }
    .youtube img{
        height: auto;
    }
    
}

.btn-delete-book {
    background: white;
    color: #212c68;
    font-size: 13px;
    font-family: NexaBold;
    text-align: center;
    padding: 8px 0;
    border: 1px solid #212c68;
    width: 100%;
    border-radius: 3px;
    margin-top: 8px;
  }
  .btn-book{
    background: #212c68;
    color: #fff;
    font-size: 12px;
    padding: 15px 0 11px;
    border:0;
    display: block;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transition: 300ms ease;
  }
  .btn-book--uppercase {
  
    text-transform: uppercase;
  }
  .btn-book .booked-price {
    font-weight: bold;
  }
  .btn-delete-book:hover{
    background: #212c68;
    color: #fff;
  }