.pd20TB { padding: 20px 0; }
.bg-gray{ background: #d4d4d4; }
.bg-white{ background: #ffffff; }

.more{border: 2px solid #000;/* background: #fffac6; */box-shadow: 5px 5px 0 #f7ff25;font-size: 16px;color: #000;padding: 15px 0;text-align: center;width: 100%;display: block;margin: 12px auto 6px;font-weight: bold;transition: 1s;}
.hvr-fade:hover, .hvr-fade:focus, .hvr-fade:active {
    background-color: #fff109;
    color: #000;
    box-shadow: 0px 0px 0 #f7ff25;
}
.btn-contact-yellow{ background-color: #fff109; border: 2px solid #fff;  font-size: 16px; color: #000; padding: 15px 0; text-align: center;  width: 100%; display: block;; margin: 20px auto 0; transition: all 0.3s;}
.btn-contact-yellow:hover { border: 2px solid #000; }


/* carousel */
.carousel-images{ display: flex; flex-wrap: wrap; padding: 12px; }
.carousel-images .full-images{ width: 65%;}
.carousel-images .full-images .thumbnail-images{ width: 100%;}
.carousel-images .content-slide { width: 35%; padding: 0 0 0 12px; }
.carousel-images .content-slide .datacar-slide { margin-bottom: 8px; padding: 16px; }
.carousel-images .content-slide .highlight-yellow {background: #f7ff25;display: block;padding: 8px;font-weight: bold;}
.carousel-images .content-slide h2 {font-size: 18px;margin: 5px 0 5px;line-height: 1.2;}
.carousel-images .content-slide h2 strong { font-size: 28px; }
.carousel-images .price { display: table; width: 100%; }
.carousel-images .img-left { display: table-cell; vertical-align: middle; width: 60px;  }
.carousel-images .price-right { display: table-cell; text-align: right; vertical-align: middle; padding-left: 12px; font-weight: bold; }
.carousel-images .price-right strong { font-size: 22px; color: #fb0000; }

.box-slider #sync1 .item{
    background: #fff;
}
.box-slider #sync1 .item img{ width: 100%;}
.box-slider #sync2 .item{
    background: #fff;
    margin: 8px 2px 0;
    cursor: pointer;
    border: 1px solid #ccc;
    border-radius: 4px;
    overflow: hidden;
}
.box-slider #sync2 .item img{ width: 100%;}
.box-slider #sync2 .synced .item{
  border: 3px solid #f7ff25;
}
.box-slider #sync1{width:100%;float:left; }
.box-slider #sync2{width:100%; margin-top: 8px;}
.box-slider #sync2 .owl-item{width:10%!important;}
.box-slider #sync2 .owl-wrapper{width: 100%!important; display: flex !important; flex-wrap: wrap; 
  transform: translate3d(0px, 0px, 0px) !important;
  -moz-transform: translate3d(0px, 0px, 0px) !important;
  -webkit-transform: translate3d(0px, 0px, 0px) !important; }

.warpper-table{ position: relative;}
.warpper-table .line-top {
    background: url(../images/curve-top.png);
    height: 12px;
    width: 100%;
    position: absolute;
    top: -12px;
}


.content-tab{margin:22px auto;}
.content-tab .tabs { list-style: none; text-align: center; display: flex; }
.content-tab .tabs li { color:#000; display: inline-block; padding:15px 8px; width: 50%; text-align: center; cursor: pointer; font-weight: bold; background: #fff; font-size: 16px; border: 2px solid #ccc;}

.content-tab .tabs li.current { background: #d4d4d4; color: #000; border: 2px solid #fff; border-bottom: 2px solid #f7ff25; }
.content-tab .tab-pane { display: none; margin: 0 auto;}
.content-tab .tab-pane.current { display: block;}
.content-tab .tab-contents{ background: #fff; font-weight: normal;}

.carspec{font-size: 0; padding: 10px 0;}
.carspec div{display: inline-block; width:25%; font-size: 14px; vertical-align: top;}
.carspec strong{display: inline-block; border-radius: 3px; padding: 2px 20px; background: #34bfff; color: #FFF; margin: 0 10px 0 0;}

/* car spec*/
.car-spec{display: flex; flex-wrap: wrap; width: 100%; margin: auto; }
.car-spec li{display: flex; width: 50%; float: left; border-bottom: 1px solid #e6e6e6;}
.car-spec li div{display: inline-block; padding: 15px 0; vertical-align: top; color: #000;}
.car-spec li div:nth-child(1){text-align: center; width:40%; background: #f5f8f9;}
.car-spec li div:nth-child(2){text-align: left; width:40%; padding-left: 12px;}

/*box color*/
.color-car{ margin: 12px auto; padding: 8px; background: #fff; display: block; }
.color-car h2{ text-align: left; color: #000; font: 20px; font-weight: bold;}
.box-color{ text-align: left; padding: 12px;}
.box-color li{ background-color: #ffface; padding: 7px 20px; margin:4px; display: inline-block; font-weight: normal; color: #000; border-radius: 22px;}

/*------------- item car -------------*/
.item-car { display: block; }
.item-car ul { display: flex; flex-wrap: wrap; margin: 0 -2% 0 0; }
.item-car ul li { position: relative; display: block; width: 23%; margin: 0 2% 18px 0; border: 2px solid #ccc; padding: 4px; font-size: 12px; transition: all 0.3s; }
.item-car ul li:hover { border: 2px solid #f7ff25; }
.images-car img { width: 100%; }
.data-car { padding: 4px; margin-bottom: 28px; }
.name-car { font-weight: bold; }
.name-car strong { font-size: 15px; margin-left: 8px; }
.detail-car { display: block; height: 36px; overflow: hidden; }
.info-car { display: block; margin-top: 8px; }
.price-car { display: block; font-weight: bold; text-align: right; position: absolute; bottom: 0px; right: 8px; }
.price-car span { font-size: 22px; color: #fb0000; }


@media(max-width:980px) {
  .box-slider #sync2 .owl-item{width:20%!important;}
}

@media(max-width:768px) {
  .carousel-images .full-images{ width: 100%;}
  .carousel-images .content-slide { width: 100%; padding: 8px 0; }
  .car-spec li{ float: none; width: 100%;}

  .content-tab .tabs li { width: 100%; }
  /* .content-tab .infomation { display: none !important; } */

  
 }

 @media(max-width:680px) {
  .item-car ul li { width: 48%; }
 }