﻿div ,a,span{
    font-family:'Kanit','Open Sans', sans-serif;
}

@font-face {
    font-family: 'ThaiSansNeueRegular';
    src: url('../font/ThaiSansNeueRegular.eot');
    src: url('../font/ThaiSansNeueRegular.eot') format('embedded-opentype'), url('../font/ThaiSansNeueRegular.woff2') format('woff2'), url('../font/ThaiSansNeueRegular.woff') format('woff'), url('../font/ThaiSansNeueRegular.ttf') format('truetype'), url('../font/ThaiSansNeueRegular.svg#ThaiSansNeueRegular') format('svg');
}

@font-face {
    font-family: 'ThaiSansNeueSemiBold';
    src: url('../font/ThaiSansNeue-ExtraBold.ttf') format('truetype');
    /*src: url('../font/ThaiSansNeueSemiBold.eot') format('embedded-opentype'), url('../font/ThaiSansNeueSemiBold.woff2') format('woff2'), url('../font/ThaiSansNeueSemiBold.woff') format('woff'), url('../font/ThaiSansNeueSemiBold.ttf') format('truetype'), url('../font/ThaiSansNeueSemiBold.svg#ThaiSansNeueSemiBold') format('svg');*/
}

@font-face {
    font-family: 'Kanit';
    src: url('../font/Kanit-Light.ttf') format('truetype');
    /*src: url('../font/ThaiSansNeueSemiBold.eot') format('embedded-opentype'), url('../font/ThaiSansNeueSemiBold.woff2') format('woff2'), url('../font/ThaiSansNeueSemiBold.woff') format('woff'), url('../font/ThaiSansNeueSemiBold.ttf') format('truetype'), url('../font/ThaiSansNeueSemiBold.svg#ThaiSansNeueSemiBold') format('svg');*/
}

@font-face {
    font-family: 'KanitBold';
    src: url('../font/Kanit-Bold.ttf') format('truetype');
    /*src: url('../font/ThaiSansNeueSemiBold.eot') format('embedded-opentype'), url('../font/ThaiSansNeueSemiBold.woff2') format('woff2'), url('../font/ThaiSansNeueSemiBold.woff') format('woff'), url('../font/ThaiSansNeueSemiBold.ttf') format('truetype'), url('../font/ThaiSansNeueSemiBold.svg#ThaiSansNeueSemiBold') format('svg');*/
}

.fontBold {
      font-family:'KanitBold','Open Sans', sans-serif;
}
.content2 {
    padding: 20px 0;
}
.textBig {
    font-size:18px;
    font-weight:300;
}
.text16{
    font-size:16px;
    font-weight:lighter;
}

/*.text26{
    font-size:26px;
    font-weight:lighter;
}
.text28{
    font-size:28px;
    font-weight:lighter;
}
.text30{
    font-size:30px;
    font-weight:lighter;
}*/

@media (min-width:375px) and (max-width:640px) {
.text18 {
    font-size:16px;
    font-weight:lighter;
}
.text22 {
    font-size:18px;
    font-weight:lighter;
}
.text26{
    font-size:20px;
    font-weight:lighter;
}
.text28{
    font-size:20px;
    font-weight:lighter;
}
.text30{
    font-size:14px;
    font-weight:lighter;
}
}

@media (min-width:641px) {
.text18 {
    font-size:18px;
    font-weight:lighter;
}
.text22 {
    font-size:22px;
    font-weight:lighter;
}
.text26{
    font-size:26px;
    font-weight:lighter;
}
.text28{
    font-size:28px;
    font-weight:lighter;
}
.text30{
    /*font-size:30px;*/
    font-size:26px;
    font-weight:lighter;
}
}

h1 {
    font-size: 24px;
	line-height: 30px;
}

.project-content2 h4 {
    margin-bottom: 12px;
    padding-bottom:4px;
    border-bottom: 1px solid #eee;
}

.project-content2 h4 span {
  
   
    border-bottom: 1px solid;
  border-bottom-color: #ee3733;
}




a span.text ,.textNormal {
    font-size:18px;
    font-weight:300;
}

.filter-option {
     font-size:18px;
    font-weight:300;
}


.siteFontStyle {
    font-family:'Kanit';
}

.thumbnail {
    margin-bottom: 5px;
    padding: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
      box-shadow: 0 2px 4px 0 rgba(0,0,0,0.1), 0 2px 5px 0 rgba(0,0,0,0.15);
   
}

.item.list-group-item {
    float: none;
    width: 100%;
    background-color: #fff;
    margin-bottom: 0px;
    border: none;
}

    .item.list-group-item img {
        float: left;
        align-content: center;
        max-width: 220px;
         min-width: 220px;
    }

.item.grid-group-item img {
    float: left;
    width: 100%;
}


.thumbnail .caption {
    padding: 0px;
  
}

.caption {
    position:relative;
    padding: 0px;
}

div.inline { float:left;  display: inline-block; }

.btn, .btn-system.btn-small {
    color: #000;
    border-radius: 2px;
    position: relative;
    -webkit-transition: all .3s linear;
    -moz-transition: all .3s linear;
    -ms-transition: all .3s linear;
    -o-transition: all .3s linear;
    transition: all .3s linear;
    /*box-shadow: 0 2px 4px 0 rgba(0,0,0,0.1), 0 2px 5px 0 rgba(0,0,0,0.15);*/
    border: 1px solid rgba(0,0,0,0.1);
    text-transform: uppercase;
        font-size:14px;
        /*font-size:20px;*/
   
       font-family:'Kanit' ,'Open Sans', sans-serif;
}

.btn-system.btn-small {
    color: #fff;
   
}


/*.item.list-group-item:nth-of-type(odd):hover,.item.list-group-item:hover
{
    background: #428bca;
}


.item.list-group-item .thumbnail
{
    margin-bottom: 0px;
}
.item.list-group-item .caption
{
    padding: 9px 9px 0px 9px;
}
.item.list-group-item:nth-of-type(odd)
{
    background: #eeeeee;
}

.item.list-group-item:before, .item.list-group-item:after
{
    display: table;
    content: " ";
}


.item.list-group-item:after
{
    clear: both;
}
.list-group-item-text
{
    margin: 0 0 11px;
}*/

.brandlink {
       /*box-shadow: inset 0px 0px 20px 0px rgba(255, 92, 88, 0.23), 0 2px 5px 0 rgba(255, 0, 0, 0.22);*/
    width: 40px;
    height: 50px;
    display: inline-block;
    BACKGROUND-REPEAT: no-repeat;
    background-size: 40px 40px;
    COLOR: #666;
    FONT-SIZE: 0.7em;
    align-content: center;
    align-items: center;
    margin:2px;
}


.typelink {
 /*box-shadow: inset 0px 0px 20px 0px rgba(255, 129, 129, 0.23), 0 2px 5px 0 rgba(255, 119, 119, 0.22);*/
    width: 80px;
    height: 50px;
    display: inline-block;
    BACKGROUND-REPEAT: no-repeat;
    background-size: 80px;
    COLOR: #666;
    FONT-SIZE: 0.7em;
    margin: 2px;

}


.honda {
    BACKGROUND-IMAGE: url(../img/bHonda.png);
}

.yamaha {
    BACKGROUND-IMAGE: url(../img/bYamaha.png);
}

.kawa {
    BACKGROUND-IMAGE: url(../img/bKawa.png);
}

.suzuki {
    BACKGROUND-IMAGE: url(../img/bSuzuki.png);
}

.ryuka {
    BACKGROUND-IMAGE: url(../img/bRyuka.png);
}



.auto {
    BACKGROUND-IMAGE: url(../img/auto.png);
}

.family {
    BACKGROUND-IMAGE: url(../img/family.png);
}

.sport {
    BACKGROUND-IMAGE: url(../img/sport.png);
}
.brandlink:hover ,.typelink:hover {
    FILTER: alpha(opacity=6);
    opacity: .6;
}

.brandlink:active,.typelink:hover  {
    FILTER: alpha(opacity=6);
    opacity: .6;
}


.ui-widget-header {
   
    background: #ff8705 50% 50% repeat-x;
 
}

.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
   
    border-top: 0px solid #ddd;
}

.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
    background-color: #ee3733;
    border-color: #ee3733;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.1), 0 2px 5px 0 rgba(0,0,0,0.15);
}

.pagination>li>a, .pagination>li>span 
{
    color: #ff0000;
}







.item-list:hover {
    box-shadow: 0px 0px 5px 1px rgba(60,144,190,0.13);
}


.item-list.make-grid {
    float: left;
    clear: none;
 width:32%;
  margin-right:7px;
  min-height:315px;
    
}

.owl-item > .item-list.make-grid {
    float: left;
    clear: none;
 width:95%;
  margin-right:7px;
  min-height:315px;
    
}

.make-grid .table-list .table-cell {
    display: table;
        width: 100%;
}

.item-list.make-grid .table-list .item-thumb {
    width: 100%;
}

.item-list.make-grid .table-list .item-thumb img{

      min-height:170px;
    min-width:220px;
}

.item-list.make-grid .table-list .item-body {
    padding: 15px 0px;
}



.adds-wrapper .item-list {
    padding: 10px;
    border: 1px solid #eee;
    width: 99%;
    height: auto;
    display: block;
    position: relative;
    overflow: hidden;
    clear: both;
    margin-bottom: 15px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

 .item-list {
    padding: 10px;
    border: 1px solid #eee;
    width: 99%;
    height: auto;
    display: block;
    position: relative;
    overflow: hidden;
    /*clear: both;*/
    margin-bottom: 15px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

 .table-list .table-cell {
    display: table-cell;
    vertical-align: top;
    overflow: hidden;
}

 .table-list .item-body {
    padding: 5px 20px;
}



.item-body {
    padding: 15px 12px 7px;
    width: 100%;
}
.item-body .property-title {
    margin: 0 0 2px 0;
}
.item-body .adderess {
    color: #999;
    font-size: 13px;
    line-height: 22px;
    margin: 0;
}
.adds-wrapper .info {
    display: block;
    clear: both;
    font-size: 12px;
    color: #999;
}

.item-body .info {
    font-size: 13px;
    margin-top: 6px;
    line-height: 16px;
}

/*.table-list .prop-user-agent, .table-list .prop-date {
    color: #aaa;
    font-size: 12px;
    margin-right: 10px;
    line-height: 22px;
    font-weight: 300;
}*/

.item-thumb a {
    display: block;
}

.table-list .item-thumb {
    width: 220px;
}

.item-thumb {
    position: relative;
    width: 100%;
    height: 100%;
    -webkit-transition: all 0.15s ease;
    -moz-transition: all 0.15s ease;
    -o-transition: all 0.15s ease;
    transition: all 0.15s ease;
}
.adderess a {
     font-size: 20px;
    font-weight:500;
    color: #666;
}
.info span {
     font-size: 18px;
    font-weight:600;
    color: #666;
}
li>a {
     /*font-size: 18px;*/
     font-size: 14px;

}
 .navbar-default .navbar-nav>li > a.active {
    
    font-size: 18px;
}
.prop-user-agent ,.prop-date {
     color: #7d7a7a;
    font-size: 18px;
    margin-right: 10px;
    line-height: 22px;
    font-weight: 300;
}

.hint-seq {
    margin-top: 20px;
}

.auct-seq {
     color: #bdbdbd;
    font-size: 18px;
    margin-right: 10px;
    line-height: 22px;
}

.item-body .property-title a {
    /*font-size: 24px;*/
    font-size: 20px;
    font-weight:500;
    color: #2d2d2d;
    /*text-transform: uppercase;*/
}
.item-price {
     font-size: 26px;
    font-weight:500;
    color: #ff8705;
}

.item-price30 {
     font-size:30px !important;
    font-weight:500;
    color: #ff8705;
}
.panel-title a {
      font-size: 20px;
 
}
.btn-system.btn-green {
    background-color: #28962a;
}

table.with-ellipsis td.title {
    text-overflow: ellipsis;
    width: 35%;
}

table.with-ellipsis td.detail {
    text-overflow: ellipsis;
    width: 65%;
}


.btn-system.btn-green.button-float {
    position: absolute;
    color: #fff;
 bottom: 12px;
right: 12px;
    z-index: 3;
    background: #4caf50;
    border-radius: 2px;
    padding: 5px;
}

.pswp__error-img {
  position: absolute;
  left: 0;
  top: 25%;
  width: 100%;
  text-align: center;
  font-size: 14px;
  line-height: 16px;
  margin-top: -8px;
  color: #CCC; 


}

div.dataTables_wrapper div.dataTables_filter input {

    font-size: 20px;
}

div.dataTables_wrapper div.dataTables_filter label {
    font-size: 20px;
}

table.dataTable td.dataTables_empty, table.dataTable th.dataTables_empty {
    font-size: 20px;
}

footer {
   
    padding-top: 0px;
 
}

@media (min-width:100px) and (max-width:640px) 
{
    .table-list .table-cell {
        display: block;
    }

    .table-list .item-body {
        padding: 14px 0;
     
    }

    .item-list.make-grid {
           display: block;
           width:100%;
    }
  
}

@media (min-width:641px) and (max-width:991px) {
    .item-list.make-grid {
           display: block;
           width:47%;
    }
}




@media (min-width:992px) and (max-width:1200px)  {
     .item-list.make-grid {
           display: block;
           width:32%;
    }
}