/* Add here all your CSS customizations */

/* fonts */
/* nav */
/* button */
/* card */
/* modal */
/* table */
/* pagination */
/* Loginbox */

body {
	background-color: #01031a;
	font-family: 'Sarabun', sans-serif;
	font-size: 14px;
	line-height: 26px;
	margin: 0;
}

.body {
	background-color: #01031a;
}

.owl-carousel .owl-dots .owl-dot.active span, .owl-carousel .owl-dots .owl-dot:hover span {
  background-color: rgb(255, 223, 0);
}

html .blockquote-primary {
  border-color: rgb(255, 223, 0) !important;
}

/* fonts */
.kanit
{
    font-family: 'Kanit', sans-serif;
    color: rgb(255, 223, 0) !important;
}

.kanit_text
{
    font-family: 'Kanit', sans-serif;
    color: rgb(255, 255, 255) !important;
}

.sarabun
{
    font-family: 'Sarabun', sans-serif;
}

.sarabun_title
{
    font-family: 'Sarabun', sans-serif;
    color: rgb(255, 223, 0) !important;
}

.sarabun_text
{
    font-family: 'Sarabun', sans-serif;
    color: rgb(255, 255, 255) !important;
}


/* nav */
#header .header-body 
{
  display: flex;
	flex-direction: column;
	background: #0a0928;
  background: linear-gradient(0deg, #0a0928 65%, #203d6d 100%);
	transition: min-height 0.3s ease;
	width: 100%;
	border-top: 3px solid #203d6d;
	border-bottom: 1px solid transparent;
	z-index: 1001;
}

html.sticky-header-active #header .header-body {
    position: fixed;
    border-bottom-color: #203d6d;
    box-shadow: 0 0 3px rgb(234 234 234 / 50%);
}

#header .header-nav-main:before {
  background: #0a0928 !important;
}

#header .header-nav.header-nav-line:not(.header-nav-light-text) nav > ul > li > a 
{
    font-family: 'Kanit', sans-serif;
    font-size: 16px;
    color: rgb(255, 255, 255);
}

#header .header-nav-features 
{
    font-family: 'Kanit', sans-serif;
    font-size: 16px;
    padding-left: 10px;
    margin-left: 5px;
}

#header .header-nav.header-nav-line nav > ul li > a.active {
    color: rgb(255, 223, 0) !important;
}

#header .header-nav.header-nav-line nav > ul li:hover > a 
{
    color: rgb(255, 223, 0) !important;
}

#header .header-nav.header-nav-line nav > ul:not(:hover) li > a.active:before {
    background: rgb(255, 223, 0) !important;
}

#header .header-nav.header-nav-line nav > ul li > a.active:before {
    background: rgb(255, 223, 0) !important;
}

#header .header-nav.header-nav-line nav > ul:not(:hover) li > a.active:after {
    background: rgb(255, 223, 0) !important;
}

#header .header-nav.header-nav-line.header-nav-top-line.header-nav-top-line-with-border nav > ul > li > a:before, #header .header-nav.header-nav-line.header-nav-top-line.header-nav-top-line-with-border nav > ul > li:hover > a:before {
    background: rgb(255, 223, 0) !important;
}

.sort-source.sort-source-style-3 > li.active > a {
	border-bottom-color: rgb(255, 223, 0) !important;
	color: rgb(255, 223, 0) !important;
}

@media only screen and (max-width: 600px){
  .sort-source.sort-source-style-3 > li.active > a {
    border-bottom-color: transparent !important;
  }

}



#header .header-btn-collapse-nav {
  background: #0088CC;
  background-image: linear-gradient(to bottom, rgba(255,255,255,0.5), rgba(255,255,255,0.2) 49%, rgba(0,0,0,0.15) 51%, rgba(0,0,0,0.05));
  background-repeat: repeat-x;
}

/* button */
.gradient-buttons .btn {
    background-image: linear-gradient(to bottom, rgba(255,255,255,0.5), rgba(255,255,255,0.2) 49%, rgba(0,0,0,0.15) 51%, rgba(0,0,0,0.05));
    background-repeat: repeat-x;
}

.btn-danger {
    color: rgb(255, 223, 0) !important;
}

.btn-warning, .btn-warning:hover {
    color: #0a0c0d;
}

/* card */
.card {
    background-color: rgb(242 242 242 / 16%);
    border: 1px solid rgba(0,0,0,.125);
}

/* modal */
.modal-content {
    background-color: #203d6d;
 }

.modal-header {
    border-bottom: 1px solid #0a0928;
}

/* table */
.table th a {
  color: rgb(255, 223, 0) !important;
  font-size: 16px;
}


/* pagination */
.pagination {
  display: inline-block;
}

.pagination a {
  color: rgb(255, 223, 0);
  padding: 8px 16px;
  text-decoration: none;
  border: 1px solid #ffc107;
}

.pagination span.current {
  background-color: #dc3545;
  color: #fff;
  padding: 8px 16px;
  border-radius: 5px;
  text-decoration: none;
  border: 1px solid #bd2130;
}

.pagination a:first-child {
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

.pagination a:last-child {
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}

.pagination a:hover:not(.current) {background-color: #dc354582; border-radius: 5px;}

/* Loginbox */
.featured-box {
  background: rgb(242 242 242 / 16%);
  border-bottom: 1px solid rgba(0,0,0,.125);;
  border-left: 1px solid rgba(0,0,0,.125);;
  border-right: 1px solid rgba(0,0,0,.125);;

}

html .featured-box-primary .box-content {
  border-top-color: #e1b64f;
}