/*
Bootstrap Image Carousel Slider with Animate.css
Code snippet by Hashif (http://hashif.com) for Bootsnipp.com
Image credits: unsplash.com

Yellow brown: #c09332
Dark brown : #33250e


yellow rgb(255, 206, 50)
orange  rgb(243,101,13)

*/

@import url(https://fonts.googleapis.com/css?family=Quicksand:400,700);


@font-face {
    font-family: EBGaramond;
    src: url(fonts/EB_Garamond/EBGaramond-VariableFont_wght.ttf);
}

@font-face {
    font-family: MaShanZheng;
    src: url(fonts/MaShanZheng-Regular.ttf);
}

@font-face {
    font-family: ZhiMangXing;
    src: url(fonts/ZhiMangXing-Regular.ttf);
}

@font-face {
    font-family: LoraVariableFontwght;
    src: url(fonts/Lora/Lora-VariableFont_wght.ttf);
}

@font-face {
    font-family: LoraSemiBoldItalic;
    src: url(fonts/Lora/Lora-SemiBoldItalic.ttf);
}
@font-face {
    font-family: LoraSemiBold;
    src: url(fonts/Lora/Lora-SemiBold.ttf);
}


@font-face {
    font-family: LoraRegular;
    src: url(fonts/Lora/Lora-Regular.ttf);
}

@font-face {
    font-family: LoraMediumItalic;
    src: url(fonts/Lora/Lora-MediumItalic.ttf);
}

@font-face {
    font-family: LoraMedium;
    src: url(fonts/Lora/Lora-Medium.ttf);
}

@font-face {
    font-family: LoraItalic;
    src: url(fonts/Lora/Lora-Italic.ttf);
}

@font-face {
    font-family: LoraBoldItalic;
    src: url(fonts/Lora/Lora-BoldItalic.ttf);
}

@font-face {
    font-family: LoraBold;
    src: url(fonts/Lora/Lora-Bold.ttf);
}

@font-face {
    font-family: LoraItalicVariableFontwght;
    src: url(fonts/Lora/Lora-Italic-VariableFont_wght.ttf);
}

@font-face {
    font-family: SourceHanSerifCNRegular;
    src: url(fonts/SourceHanSerifCN-Regular-1.otf);
}
@font-face {
    font-family: SourceHanSerifCNHeavy;
    src: url(fonts/SourceHanSerifCN-Heavy-4.otf);
}
@font-face {
    font-family: SourceHanSerifCNSemiBold;
    src: url(fonts/SourceHanSerifCN-SemiBold-7.otf);
}


.card {
	padding:0;
}
.card-header{
	background-color:#007bff ;
	color:#ffffff;
}
body, body span {
	color:#333;
   font-family: 'Raleway', Arial;
    font-weight:400;
	background-color:#f8f9fa;
	}

.dt-right{
	text-align:right;
}

.form-control{
	/*font-size:1.1em;*/
}
.content-wrapper {
	/*background-color:#ffffff !important;*/
	
}

/********************************/
/*          Main CSS     */
/********************************/

.lblinfo, .lbl_product_title{
		color: #33250e;
		/*font-size:1.2em;*/
}
.txt_product_price{
	font-weight:bold;
	/*font-size:1.2em;*/
}
.bg_back, .btn-dd{
    color: #33250e;
	margin: 5px;
	padding: 5px 10px;
	border-radius:0px;
	/*font-size:1em;*/
}

.btn-select{
	background: rgb(243,101,13);
    color: #000000;
	margin: 5px;
	padding: 5px 10px;
	border-radius:0px;
	width:100%;
}

.btn-select:hover{
	background: rgb(255, 206, 50) ;
	margin: 5px;
	padding: 5px 10px;
	border-radius:0px;
}
.btn{
	/*font-size:1em;*/
}

.btn-menu{
	background: rgb(243,101,13);
    color: #000000;
	margin-bottom: 5px;
	margin-top: 5px;
	padding: 5px 10px;
	border-radius:0px;
	/*font-size:1em;*/
}

.btn-menu:hover{
	background: rgb(255, 206, 50) ;
}


.btn-menu-profile{
	background: rgb(243,101,13);
    color: #000000;
	margin: 5px;
	padding: 10px 20px;
	border-radius:0px;
	width:100%;
	/*font-size:1em;*/
}

.btn-menu-profile:hover{
	background: rgb(255, 206, 50) ;
   
}


#btn-search{
	background-color:#004289;
	color:white;
}
#btn-search:hover{
	background-color:#007bff;
	color:white;
}
.btn-custom{
	background-color:#004289;
	color:white;
}
.btn-custom:hover{
	background-color:#007bff;
	color:white;
}

#img_product{
	margin:0 auto;
}

.ui-widget-header{
	color:#000000 !important;
}
.hypl{
	text-decoration:underline !important;
}

.text-center{
	text-align:center;
}
.text-right{
	text-align:right;
}
.text-left{
	text-align:left;
}

.fa-color-1{
	color:#f5f5f5;
}
.fa-color-1:hover{
	color:#B1B4B8;
}
.fa-color-2{
	color:#f5f5f5;
}
.fa-color-2:hover{
	color:#B1B4B8;
}

table .fa-eye:hover{
	color:#B1B4B8;
}
table .fa-eye{
	color:#004289;
}

table .fa-user:hover{
	color:#B1B4B8;
}
table .fa-user{
	color:#004289;
}

table .fa-trash:hover{
	color:#ff9d9d;

}
table .fa-trash{
	color:#ff0000;
}

table .fa-qrcode{
	color:#004289;
}

table .fa-qrcode:hover{
	color:#B1B4B8;
}

table .fa-pen{
	color:#004289;
}

table .fa-pen:hover{
color:#B1B4B8;
}
	
table .fa-image{
	color:#004289;
}

table .fa-image:hover{
color:#B1B4B8;
}

table .fa-file-circle-plus{
	color:#004289;
}

table .fa-file-circle-plus:hover{
color:#B1B4B8;
}

table.dataTable td.dt-control:before{
	color:#004289 !important;
	
}	
table.dataTable tr.dt-hasChild td.dt-control:before{
	color:#004289 !important;
	
}
/* Sticky footer styles
-------------------------------------------------- */
html {
  position: relative;
  min-height: 100%;
}
body {
  /* Margin bottom by footer height */
  margin-bottom: 60px;
}
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  background-color: #f5f5f5;
}


/* Custom page CSS
-------------------------------------------------- */
/* Not required for template or sticky footer method. */

.container {
  width: auto;
  padding: 0 15px;
}
.container .text-muted {
  margin: 20px 0;
}

input[type="text"],input[type="password"],input[type="email"], select{
	border: 1px solid rgb(20, 133, 255) !important;
	border-radius: 0px;
}

.footer{
	 font-family: 'Raleway', Arial;
}

table.dataTable  tr th {
 background-color: /*#007bff*/ #0400ff !important;
  color: #ffffff;
}

.bd-code-snippet {
	padding:8px;
    border: 1px solid #B1B4B8;
	 border-radius: 8px;
}

.padding-none{
	padding-left:0px;
	padding-right:0px;
}

div.jqi .jqibuttons button{
	width:100%;
}

.reminder_row{
	background-color:#FDD9D9 !important;
}


.bd-placeholder-img {
        font-size: 1.125rem;
        text-anchor: middle;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
      }

      @media (min-width: 768px) {
        .bd-placeholder-img-lg {
          font-size: 3.5rem;
        }
      }

      .b-example-divider {
        width: 100%;
        height: 3rem;
        background-color: rgba(0, 0, 0, .1);
        border: solid rgba(0, 0, 0, .15);
        border-width: 1px 0;
        box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
      }

      .b-example-vr {
        flex-shrink: 0;
        width: 1.5rem;
        height: 100vh;
      }

      .bi {
        vertical-align: -.125em;
        fill: currentColor;
      }

      .nav-scroller {
        position: relative;
        z-index: 2;
        height: 2.75rem;
        overflow-y: hidden;
      }

      .nav-scroller .nav {
        display: flex;
        flex-wrap: nowrap;
        padding-bottom: 1rem;
        margin-top: -1px;
        overflow-x: auto;
        text-align: center;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
      }

      .btn-bd-primary {
        --bd-violet-bg: #712cf9;
        --bd-violet-rgb: 112.520718, 44.062154, 249.437846;

        --bs-btn-font-weight: 600;
        --bs-btn-color: var(--bs-white);
        --bs-btn-bg: var(--bd-violet-bg);
        --bs-btn-border-color: var(--bd-violet-bg);
        --bs-btn-hover-color: var(--bs-white);
        --bs-btn-hover-bg: #6528e0;
        --bs-btn-hover-border-color: #6528e0;
        --bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
        --bs-btn-active-color: var(--bs-btn-hover-color);
        --bs-btn-active-bg: #5a23c8;
        --bs-btn-active-border-color: #5a23c8;
      }

      .bd-mode-toggle {
        z-index: 1500;
      }

      .bd-mode-toggle .dropdown-menu .active .bi {
        display: block !important;
      }
	  
	  
.hide_edit{
	display:none;
}

@media only screen and (min-width: 960px) {
        /* styles for browsers larger than 960px; */
		.btn-menu, .btn-cancel,.bg_back{
			width:200px;
		}
}
@media only screen and (min-width: 1440px) {
	/* styles for browsers larger than 1440px; */
	.btn-menu, .btn-cancel,.bg_back{
			width:200px;
		}
}
@media only screen and (min-width: 2000px) {
	/* for sumo sized (mac) screens */
	.btn-menu, .btn-cancel,.bg_back{
			width:200px;
		}
}
@media only screen and (max-device-width: 480px) {
   /* styles for mobile browsers smaller than 480px; (iPhone) */
   .btn-menu, .btn-cancel,.bg_back{
			width:100%;
		}
}
@media only screen and (device-width: 768px) {
	.btn-menu, .btn-cancel,.bg_back{
			width:250px;
		}
   /* default iPad screens */
}
/* different techniques for iPad screening */
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
  /* For portrait layouts only */
  .btn-menu, .btn-cancel,.bg_back{
			width:250px;
		}
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
  /* For landscape layouts only */
  .btn-menu, .btn-cancel,.bg_back{
			width:100%;
		}
}