/*
|--------------------------------------------------------------------------
| Custom for client
|--------------------------------------------------------------------------
|
*/

/*
|--------------------------------------------------------------------------
| Google fonts
|--------------------------------------------------------------------------
*/
/* @import url('https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Krub:wght@300;400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400;1,500&display=swap'); */


/*
|--------------------------------------------------------------------------
| Core files
|--------------------------------------------------------------------------
*/
@import 'topbar.css';
@import 'carousel.css';
@import 'breadcrumb.css';
@import 'button.css';
@import 'text-and-background.css?v=20220206';
@import 'form.css';
@import 'table.css';
@import 'footer.css';
@import 'modal.css';
@import 'bookshelf.css';




/*
|--------------------------------------------------------------------------
| General
|--------------------------------------------------------------------------
*/
@font-face {
	font-family: 'DB-Helvethaica';
	src: url('/styles/fonts/DB-Helvethaica/DB HelvethaicaMon X v3.2.eot'); /* IE9 Compat Modes */
	src: url('/styles/fonts/DB-Helvethaica/DB HelvethaicaMon X v3.2.eot') format('embedded-opentype'); /* IE6-IE8 */
	src: url('/styles/fonts/DB-Helvethaica/DB HelvethaicaMon X v3.2.woff2') format('woff2'); /* Super Modern Browsers */
	src: url('/styles/fonts/DB-Helvethaica/DB HelvethaicaMon X v3.2.woff') format('woff'); /* Pretty Modern Browsers */
	src: url("/styles/fonts/DB-Helvethaica/DB HelvethaicaMon X v3.2.ttf");
	src: url('/styles/fonts/DB-Helvethaica/DB HelvethaicaMon X v3.2.ttf')  format('truetype'); /* Safari, Android, iOS */
}

html {
  font-size: 24px;
}
h1, h2, h3, h4, h5, h6 {
	font-family: 'DB-Helvethaica', sans-serif;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    line-height: 1 !important;
}
body {
	font-family: 'DB-Helvethaica', sans-serif;
	line-height: initial;
}
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  font-family: 'DB-Helvethaica', sans-serif;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
  font-family: 'DB-Helvethaica', sans-serif;
}
::-ms-input-placeholder { /* Microsoft Edge */
  font-family: 'DB-Helvethaica', sans-serif;
}
.font-pri-,
.font-pri-th { font-family: 'DB-Helvethaica', sans-serif !important; }
.font-sec-th { font-family: 'DB-Helvethaica', sans-serif !important; }
.font-pri-en { font-family: 'DB-Helvethaica', sans-serif !important; }
.font-sec-en { font-family: 'DB-Helvethaica', sans-serif !important; }
.white-space-nowrap {
	white-space: nowrap;
}
a {
	color: #2e2e2e;
}
a:hover,
a:active,
a:focus,
a.text-dark:hover,
a.text-dark:active,
a.text-dark:focus,
a figcaption:hover,
a figcaption:active,
a figcaption:focus {
	color: #fab035 !important;
	text-decoration: none;
}
a i:not(.fab):hover,
a i:not(.fab):active,
a i:not(.fab):focus {
	color: #fab035 !important;
	text-decoration: none;
}
p {
    margin-bottom: 0;
}
.pt-4d5 {
	padding-top: 2rem!important;
}
label {
    margin-bottom: 0rem;
}
.nav-link {
	padding: .25rem !important;
}
.nav-pills .nav-link {
	color: #2e2e2e !important;
	border-radius: 0;
	line-height: initial;
}
.nav-pills .nav-link:hover,
.nav-pills .nav-link:active,
.nav-pills .nav-link:focus {
    border-bottom: solid 3px #fab035;
}
.nav-pills .nav-link.active {
	color: #fab035 !important;
	background-color: initial;
    border-bottom: solid 3px #fab035;
}

/*
|--------------------------------------------------------------------------
| Bootstrap
|--------------------------------------------------------------------------
*/
.line-height-inherit {
	line-height: inherit !important;
}

/*
|--------------------------------------------------------------------------
| Page header
|--------------------------------------------------------------------------
*/
.sub-page-header {
	font-family: 'DB-Helvethaica', sans-serif;
	font-weight: 300;
	color: #fab035;
}
.border-top-thick {
	border-top: 3px solid #e6e6e6;
}
.border-top-thick-black {
	border-top: 2px solid #000;
}
.border-bottom-thick {
	border-bottom: 3px solid #e3e3e3;
}
.border-bottom-thick-black {
	border-bottom: 2px solid #000;
}


/*
|-------------------------------------------------------------------------- 
| Product main little box
|--------------------------------------------------------------------------
*/
.rectangle {
	width: 27px;
	height: 22px;
	border-radius: 0px 6px 6px 0px;
}
.rectangle > .text {
	color: #fff;
    font-weight: bold;
    position: relative;
    top: -5px;
    left: 8px;
}

/*
|--------------------------------------------------------------------------
| Paging
|--------------------------------------------------------------------------
*/
.page-item .page-link {
    padding: .25rem .7rem !important;
}
.page-item.active .page-link {
	background-color: #ffc96b;
    border-color: #ffc96b;
}

/*
|--------------------------------------------------------------------------
| Alert message box
|--------------------------------------------------------------------------
*/
.alert {
	margin: 1rem 0rem !important;
	padding: .5rem .75rem !important;
}
.alert > button.close {
	font-size: 1rem !important;
}


/*
|-------------------------------------------------------------------------- 
| Select JS
|--------------------------------------------------------------------------
*/
.select2-selection, .select2-selection__arrow {
	height: 38px !important;
	padding: 0rem .25rem !important;
}
.select2-selection {
	border: 1px solid #ced4da !important;
	border-radius: .25rem !important;
}
.select2-container--default .select2-selection--single {
	display: flex !important;
	align-items: center;
}


/*
|-------------------------------------------------------------------------- 
| Header i.e. login, upgrade user
|--------------------------------------------------------------------------
*/
.nav-tabs .nav-link {
	border: 0;
	color: #999;
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
	border: 0;
	border-bottom: 3px solid #ffc96b;
	color: #ffc96b;
}
.nav-link.px-0 {
	padding-left: 1rem!important;
	padding-right: 1rem!important;
}

.img-error {
	min-width: 179px !important;
	max-width: 179px !important;
	min-height: 250px !important;
	padding-top: 50%;
	padding-left: 10px;
	padding-right: 10px;
	text-align: center;
	/* display: none !important; */
}


/*--- Small devices (landscape phones, 576px and down) ---*/
@media (min-width: 576px) {
	
}

/*--- Medium devices (tablets, 768px and down) ---*/
@media (max-width: 768px) {
    h4 {
		font-size: 1.2rem !important;
	}
	.page-header-pri {
		font-size: 1rem;
	}
	.page-header-sec {
		font-size: 1rem;
	}
	.sub-page-header {
		font-size: .8rem;
	}
}

/*--- Large devices (desktops, 992px and up) ---*/
@media (min-width: 992px) {
	.page-header-pri {
		font-size: 1.2rem;
	}
	.page-header-sec {
		font-size: 1.2rem;
	}
	.sub-page-header {
		font-size: 1.1rem;
	}
}

/*--- Extra large devices (large desktops, 1200px and up) ---*/
@media (min-width: 1200px) {
	.page-header-pri {
		font-size: 1.2rem;
	}
	.page-header-sec {
		font-size: 1.2rem;
	}
	.sub-page-header {
		font-size: 1.1rem;
	}
}