@font-face {
    font-family: 'Noto Sans Thai';
    src: url('../assets/fonts/NotoSerifThai-Regular.ttf') format('truetype');
}
@font-face {
    font-family: 'Sarabun';
    src: url('../assets/fonts/Sarabun-Regular.ttf') format('truetype');
}


html,body{
    font-family: Roboto, Sarabun, serif;
    color: #333333;
}
body.bg-theme2 {
    background:#FFFFFF url('../images/white-bg.jpg') fixed top center no-repeat !important;
}
body .bg-dark-1{
    background: rgba(225,225,225,0.75) !important;
}
h1,h2,h3,h4,h5,h6{
    color : #B6875D;
}
.text-gold {
    color : #B6875D;
}
.border-gold{
    border : 2px solid  #B6875D;
}

.top-menu{
    color: #333333 !important;
}
.top-menu a,
.top-menu .navbar a,
.header-wrapper .top-menu .social-link .nav-link{
    color: #B6875D;
}
.header-content{
    background: #5F5D50 !important;
}
.header-content h5 a{
    color: #B6875D;
}
footer.bg-dark-1{
    background: #5F5D50 !important;
}
.header-content .logo a{
    font-size: 32px;
    font-weight: bolder;
    color: #B6875D;
}
.mobile-toggle-menu{
    color: #B6875D;
}

.filter-sidebar{
    border: 2px solid #B6875D;
}
.filter-sidebar .card{
    background: rgba(225,225,225,0.75) !important;
}
.filter-sidebar .card ul li a{
    color: #B6875D;
}
.filter-sidebar a.post-title{
    color: #B6875D;
}


.primary-menu .navbar .nav-link {
    font-family: "Noto Sans Thai", "Sarabun", Serif, serif;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 20px;
    color: #B6875D;
}


.page-breadcrumb .breadcrumb-title,
.page-breadcrumb ol li,
.page-breadcrumb ol li a,
.page-breadcrumb ol li.breadcrumb-item:before{
    color: #B6875D !important;
}



.number-section-header{
    font-family: "Noto Sans Thai", "Sarabun", Serif, serif !important;
    line-height: 1.5em;
}

.badge-gold{
    border-radius: 0px !important;
    background:#f9e7b8 ;
    color:#333333;
}

.btn-close {
    padding: .5em .5em;
}
.btn-gold{
    color: #B6875D;;
    border-color : #B6875D;
    transition: 0.3s;
    border-radius: 3px !important;
}
.btn-gold:hover{
    color: #FFFFFF;
    background-color : #B6875D;
}




ul.nav-gold{

}
ul.nav-gold li{
    padding: 3px;

}
ul.nav-gold li a{
    background: #B6875D;
    color: #FFFFFF;
}




.panel-intro p{
    font-size: 1.1rem;
}

.number-frame{
    display: block;
    background: url("../images/number-frame.png") center center no-repeat;
    background-size: contain;
    width: 360px;
    max-width: 360px;
    height: auto;
}
.number-frame h1{
    margin: 20px;
    line-height: 124px;
    text-align: center;
    font-size: 3rem;
}
.number-frame h2{
    margin: 20px;
    line-height: 124px;
    text-align: center;
    font-size: 2.4rem;
}

.number-panel{
    border: 2px solid #B6875D;
    border-radius: 5px;
    background: #FFFFFF;
}
.number-panel .number-card{
    transition: 0.3s;
    border-top: 1px dotted #C6A04D;
}
.number-panel .row div:nth-child(-n + 2) .number-card{
    border-top: none;
}
.number-panel .number-card .number-header,
.number-panel .number-card .number-meta{
    color: #000000;
}
.number-panel .number-card .number-header span{
    font-size: 0.75rem;
}
.number-panel .number-card .number-meta{
    line-height: 1rem !important;
    font-size: 12px !important;
}

footer{
    color: #B6875D;
}
footer a,
footer h6{
    color: #B6875D;
}
footer .footer-menu a{
    margin: 0px 15px 0px 0px;
    color: #B6875D;
}



.back-to-top {
    background-color: rgba(182,135,95,0.45);
}

.btn-mobile-filter {
    top: 80%;
}

.blog-left-sidebar{
    background: rgba(225,225,225,0.75) !important;
}
.blog-left-sidebar .blog-categories a{
    color: #B6875D;
}



@media screen and (min-device-width: 1360px) {

    .number-panel .number-card h3.number-header{
        font-size: 1.10rem;
    }
    .number-panel .number-card .number-meta{
        font-size: 0.65rem;
    }
}

@media screen and (max-width: 1280px) {
    .top-menu{
        background: #5F5D50 !important;
    }
    .page-wrapper {
        margin-top: 0px;
    }
    .bg-dark-1{
        background: rgba(0,0,0,50%) !important;
    }
    .primary-menu .navbar .nav-link {
        font-size: 15px;
    }
}

@media screen and (max-device-width: 940px) {
    .number-panel .number-card{
        padding: 3px !important;
        font-size: 0.50rem !important;
    }
    .number-panel .number-card h3.number-header{
        font-size: 0.95rem;
    }
    .number-panel .number-card .number-meta{
        font-size: 0.65rem !important;
    }
}
@media screen and (max-device-width: 768px) {
    .number-panel .number-card{
        padding: 1px !important;
    }
    .number-panel .number-card *{
        line-height: 16px !important;
    }
    .number-panel .number-card h3.number-header{
        font-size: 0.70rem !important;
    }
    .number-panel .number-card h3.number-header span{
        font-size: 0.45rem !important;
        line-height: inherit !important;
    }
    .number-panel .number-card .number-meta{
        font-size: 0.45rem !important;
    }
    .number-panel .number-card .number-meta img{
        max-height: 10px !important;
    }
    .filter-sidebar{
        border:none !important;
        border-radius: 0 !important;
    }
    .filter-sidebar .card{
        background: #FFFFFF !important;
        border-radius: 0 !important;
    }
    .filter-sidebar .btn-close{
        filter: none !important;
    }

    footer .footer-menu a{
        display: block;
        margin: 0 0 10px 0;
    }
    #search_form input.form-control{
        padding: .25rem .5rem;
        font-size: 0.9rem;
        font-weight: 400;
        line-height: 1.5;
    }

    .number-frame{
        background: url("../images/number-frame.png") center center no-repeat;
        background-size: contain;
        width: 413px;
        max-width: 100%;
        height: auto;
    }
    .number-frame h1{
        margin: 15px;
        line-height: 100px;
        text-align: center;
        font-size: 2.8rem;
    }
    .number-frame h2{
        margin: 15px;
        line-height: 100px;
        text-align: center;
        font-size: 2.2rem;
    }

}