@font-face {
  font-family: "CSChatThaiUI";
  font-weight: normal;
  font-style: normal;
  src: url("../fonts/CSChatThai/CSChatThaiUI.eot"); /* IE9 Compat Modes */
  src: url("../fonts/CSChatThai/CSChatThaiUI.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  url("../fonts/CSChatThai/CSChatThaiUI.otf") format("opentype"), /* Open Type Font */
  url("../fonts/CSChatThai/CSChatThaiUI.svg") format("svg"), /* Legacy iOS */
  url("../fonts/CSChatThai/CSChatThaiUI.ttf") format("truetype"), /* Safari, Android, iOS */
  url("../fonts/CSChatThai/CSChatThaiUI.woff") format("woff"), /* Modern Browsers */
  url("../fonts/CSChatThai/CSChatThaiUI.woff2") format("woff2"); /* Modern Browsers */
}

body {
  font-size: 1rem;
  font-family: "CSChatThaiUI", SansSerif;
}

.content-top-padding{
  margin-top:80px;
}
.sidebar-color {
  background-color: #2b383e !important;
  color:RGBA(255,255,255,0.6) !important;
  font-family: "CSChatThaiUI";
}
.sidebar-link-color {
  color:#aaafb2 !important;
  font-size: 14px !important;
  font-weight:500 !important;
  font-family: "CSChatThaiUI";
}
.sidebar-link-color:hover {
  color: #d5d7d8 !important;
  font-size: 14px !important;
  font-weight:500 !important;
  font-family: "CSChatThaiUI" !important;
}
.sidebar-fa-size {
  font-size: 14px !important;
  font-weight:bold !important;
}
.navbar-link-color {
  color:#ffffff;
  text-decoration: none;
}
.navbar-link-color:hover {
  color:#ffffff;
  text-decoration: none;
}
.navbar-fa-size-header {
  font-size: 20px !important;
}
.navbar-fa-size {
  font-size: 14px !important;
}
.brand-img {
  height: 30px;
}
.nav-text{
  font-family: "CSChatThaiUI" !important;
  color:#ffffff !important;
  font-size: 18px !important;
  font-weight: 500 !important;
  text-transform: capitalize !important;
  font-family: "CSChatThaiUI" !important;
}
.text-shadow-header {
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 1)!important;
}
.text-normal {
  font-size: 14px !important;
  font-family: "CSChatThaiUI";
  color: #5a5a5a !important;
}
.text-normal {
  font-size: 14px !important;
  font-family: "CSChatThaiUI";
  color: #5a5a5a !important;
}
.text-header {
  font-size: 16px !important;
  font-weight : bold !important;
  font-family: "CSChatThaiUI";
}
.text-header-x2 {
  font-size: 20px !important;
  font-weight : 400 !important;
  font-family: "CSChatThaiUI";
}
.box-radius{
  border-radius: .25rem !important;
  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.1) !important;
  /*border: 1px solid #ddd;*/
  border: 1px solid #eaecec;
}
.ddc-color {
  color: #000000 !important;
}
.ddc-color-text{
  color: #5a5a5a !important;
}
.text-color-caption{
  color: #a9a9a9 !important;
}
.text-color-form{
  font-size: 14px !important;
  font-family: "CSChatThaiUI";
  font-weight: 500;
  color: #424242 !important;
}

.bootstrap-select .btn:focus {
  outline: none !important;
}
.form-control:focus {
  border-color:  #e84c93 !important;
  outline: none !important;
}

.text-breadcrumb {
  font-size: 12px !important;
  font-family: "CSChatThaiUI";
  color: #979c9f !important;
}


.text-breadcrumb-active {
  font-size: 12px !important;
  font-family: "CSChatThaiUI";
  font-weight: 500;
  color: #5a6675 !important;
}

.bg-color {
  background-color: #e84c93 !important;
  font-family: "CSChatThaiUI";
}
.font-color {
  color: #ffffff !important;
  font-family: "CSChatThaiUI";
  font-size: 24px;
}
.font-ddc {
  color: #e84c93 !important;
  font-family: "CSChatThaiUI";
  font-size: 24px !important;
}
.btn-ddc {
  background-color: #f0c9d7 !important;
  color: #000000 !important;
  border: 1px solid #000000 !important;
  font-size: 24px !important;
  font-family: "CSChatThaiUI";
}
.btn-ddc-menu {
  background-color: #f0c9d7 !important;
  color: #000000 !important;
  border: 1px solid #000000 !important;
  width: 100% !important;
  height: 80px !important;
  font-size: 24px !important;
  font-family: "CSChatThaiUI";
}
.btn-ddc-menu-0 {
  background-color: #f0c9d7 !important;
  color: #000000 !important;
  border: 1px solid #000000 !important;
  width: 100% !important;
  font-size: 24px !important;
  font-family: "CSChatThaiUI";
}
.table-ddc {
  background-color: #e0e0e0 !important;
  color: #404040 !important;
  font-family: "CSChatThaiUI";
  font-size: 14px !important;
  font-weight:bold;
  vertical-align: middle;
}
.th-ddc-next {
  background-color: #e0e0e0 !important;
  color: #404040 !important;
  font-family: "CSChatThaiUI";
  font-size: 14px !important;
  font-weight:normal !important;
  vertical-align: middle;
}
.padding-lr {
  padding-right: 5px;
  padding-left: 5px;
  font-family: "CSChatThaiUI";
}

.bg-ddc {
  background-image: linear-gradient(#ea689f, #c64890, #f0c9d7, #f5e7ec);
  font-family: "CSChatThaiUI";
}
.bg-ddc-color {
  background-color: #ea689f !important;
  font-family: "CSChatThaiUI";
}

.input-ddc {
  font-family: "CSChatThaiUI";
  font-size: 20px !important;
  border-radius: 15px !important;
  -webkit-box-shadow: 0px 0px 5px -1px #7c7c7c;
  -moz-box-shadow: 0px 0px 5px -1px #7c7c7c;
  box-shadow: 0px 0px 5px -1px #7c7c7c;
}


.table {
  border: 1px solid rgb(255, 255, 255);
}

.table thead th {
  border-top: 2px solid rgb(255, 255, 255)!important;
  border-bottom: 2px solid #ffffff!important;
  border-left: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
  vertical-align: middle !important;
}

.table td {
  border-left: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
  border-top: none!important;
}

.breadcrumb .breadcrumb-item:nth-child(2)::before {
  content: ">";
}

.breadcrumb .breadcrumb-item:nth-child(3)::before {
  content: ">";
}

.btn-no-border:focus{
  outline:0 !important;
}
.btn-color-searchv2{
  font-size: 14px !important;
  font-family: "CSChatThaiUI";
  font-weight: normal;
  color: #ffffff !important;
  background-color:#e84c93 !important;
  border:0 !important;
  border-radius: 10px !important;
}
.btn-color-search{
  font-size: 14px !important;
  font-family: "CSChatThaiUI";
  font-weight: normal;
  color: #ffffff !important;
  background-color:#7c7c7c !important;
  border:0 !important;
  border-radius: 10px !important;
}
.btn-color-submit{
  font-size: 14px !important;
  font-family: "CSChatThaiUI";
  font-weight: normal;
  color: #ffffff !important;
  background-color:#179c98 !important;
  border:0 !important;
  border-radius: 10px !important;
}
.btn-color-menu{
  font-size: 18px !important;
  font-family: "CSChatThaiUI";
  font-weight: normal;
  color: #ffffff !important;
  background-color:#179c98 !important;
  border:0 !important;
  border-radius: 10px !important;
}
.btn-color-add{
  font-size: 18px !important;
  font-family: "CSChatThaiUI";
  font-weight: normal;
  color: #ffffff !important;
  background-color:#e84c93 !important;
  border:0 !important;
  border-radius: 10px !important;
}
.btn-color-add-small{
  font-size: 14px !important;
  font-family: "CSChatThaiUI";
  font-weight: normal;
  color: #ffffff !important;
  background-color:#e84c93 !important;
  border:0 !important;
  border-radius: 10px !important;
}
.btn-color-delete{
  font-size: 18px !important;
  font-family: "CSChatThaiUI";
  font-weight: normal;
  color: #ffffff !important;
  background-color:#a54c0f !important;
  border:0 !important;
  border-radius: 10px !important;
}
.btn-color-submit2{
  font-size: 18px !important;
  font-family: "CSChatThaiUI";
  font-weight: normal;
  color: #ffffff !important;
  background-color:#179c98 !important;
  border:0 !important;
  border-radius: 10px !important;
}

.btn-color-submit-small{
  font-size: 14px !important;
  font-family: "CSChatThaiUI";
  font-weight: normal;
  color: #ffffff !important;
  background-color:#179c98 !important;
  border:0 !important;
  border-radius: 10px !important;
}

.btn-color-delete-small{
  font-size: 14px !important;
  font-family: "CSChatThaiUI";
  font-weight: normal;
  color: #ffffff !important;
  background-color:#a54c0f !important;
  border:0 !important;
  border-radius: 10px !important;
}

.date-picker-1{
  background-color: #ffffff;
  padding : 0px 15px 5px 15px;
  height: 40px;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  box-shadow: inset 0 0 0 rgba(0, 0, 0, 0);
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.date-picker-2{
 border:0px !important;
 padding: 0 !important;
 margin: 0 !important;
}
.date-picker-2:focus{
  border-width: 0px !important;
  outline:0 !important;
 }
.react-datepicker-popper {
  z-index: 9999999 !important;
}
.react-datepicker__input-container:focus {
  border-width: 0px !important;
  outline:0 !important;
}

.tab-active{
  border-top-right-radius: 10px !important;
  border-top-left-radius: 10px !important;
  background-color:#979c9f !important;
  color:#ffffff;
}
.tab-active:hover{
  border-top-right-radius: 10px !important;
  border-top-left-radius: 10px !important;
  background-color:#979c9f !important;
  color:#ffffff;
}

fieldset {
  -moz-border-radius: 10px;
  border-radius: 10px;
  -webkit-border-radius: 10px;
}

#overlay {
  position: fixed;
  display:none;
  z-index: 999;
  height: 2em;
  width: 2em;
  overflow: visible;
  margin: auto;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

/* Transparent Overlay */
#overlay:before {
  content: '';
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.3);
}

/* :not(:required) hides these rules from IE9 and below */
#overlay:not(:required) {
  /* hide "loading..." text */
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

.modal-320px {
  width:320px;
  max-width: none !important;
}

.modal-90w {
  width:90%;
  max-width: none !important;
}

.sigOutline {
  outline-style: dashed;
  outline-width: 2px;
  outline-color: gainsboro;
}

.rdonly {
  pointer-events: none;
}

@media (max-width: 768px) {
  .text-middle {
    vertical-align: middle !important;
    font-size: 20px !important;
    line-height: 18px !important;
    font-family: "CSChatThaiUI";
  }

  .sidebar-link-color {
    color:#aaafb2 !important;
    font-size: 12px !important;
    font-weight:500 !important;
    font-family: "CSChatThaiUI";
  }
  .sidebar-link-color:hover {
    color: #d5d7d8 !important;
    font-size: 12px !important;
    font-weight:500 !important;
    font-family: "CSChatThaiUI" !important;
  }
}

.nav-tabs .nav-link.disabled {
  color: #6c757d66 !important;
}