@font-face {
    font-family: 'Kanit';
    src: url('../fonts/kanit/Kanit-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
  }
  
  @font-face {
    font-family: 'Kanit';
    src: url('../fonts/kanit/Kanit-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
  }
  
  @font-face {
    font-family: 'Kanit';
    src: url('../fonts/kanit/Kanit-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
  }
  
  @font-face {
    font-family: 'Kanit';
    src: url('../fonts/kanit/Kanit-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
  }
html, body {
    max-width: 100%;
    overflow-x: hidden;
}
body{
    font-family: 'Kanit', sans-serif;
    color: var(--secondary1);
}
footer{
  background-color: var(--secondary2);
  color: var(--secondary3);
  text-align: center;
  padding: 0.2rem;
  font-size: 13px;
  position: fixed;
  width: 100%;
  bottom: 0;
}
.row-foot{
  z-index: 3;
  position: relative;
}
.row-foot a{
  text-decoration: none;
  color: var(--secondary3);
  transition: all 0.3s ease;
}
.row-foot a:hover{
  font-weight: bold;
}
.footspace{
  height: 98px;
}
footer p{
  margin-bottom: 0px;
}
.disable{
    pointer-events: none;
    background-color: gray !important;
}
.ccont { 
    display: -webkit-box; 
    display: -webkit-flex; 
    display: flex; 
    /* flex:1 0 auto;  */
	
}
.btn-blue{
    background-color: var(--primary2) !important;
    color: var(--secondary3) !important;
    border-radius: 20px !important;
    transition: all 0.3s ease;
}
.btn-blue:hover{
    background-color: var(--secondary1) !important;
    border-radius: 20px !important;
}
.btn-span{
    color: var(--secondary2);
    text-decoration: none;
    font-size: 12px;
}
.esp-formgroup label{
  background-color: #f8fafc8c;
  backdrop-filter: blur(3px);
  color: var(--secondary2);
  border-radius: 0.38rem 0rem 0rem 0.38rem;
  margin-left: 9px;
  position: absolute;
  margin-top: -84px;
  padding-right: 5px;
  padding-left: 5px;
}
.esp-formgroup .textarea-label{
  margin-top: -194px;
}
.esp-formgroup .fileinput-label{
  margin-top: -90px;
}
.esp-formgroup input, .esp-formgroup select, .esp-formgroup textarea{
  border: var(--secondary2) 1px solid;
  height: 45px;
  margin-top: 17px;
  margin-bottom: 17px;
}
.esp-formgroup .vselect-style .vs__dropdown-toggle{
  border: var(--secondary2) 1px solid;
  height: 85px;
  margin-top: 17px;
  margin-bottom: 17px;
  padding-top: 10px;
  padding-bottom: 10px;
  border-radius: 0.375rem;
}
.esp-formgroup .labelfor-vueselect{
  margin-top: -122px;
}
.esp-formgroup .form-check-input{
  width: 30px;
  height: 30px;
}
.esp-formgroup .checklabel{
  position: static;
    margin-top: auto;
    margin-bottom: auto;
    margin-right: 20px;
}
.esp-formgroup .vs__search{
  border: #c9c9c9 1px solid;
  border-radius: 0.375rem;
  margin-left: 10px;
}
.esp-formgroup .vs__search::placeholder{
  color: #c9c9c9;
}
.esp-formgroup textarea{
  height: 150px;
}
.esp-formgroup input:active, .esp-formgroup input:focus, .esp-formgroup select:active, .esp-formgroup select:focus, .esp-formgroup textarea:active, .esp-formgroup textarea:focus{
  border: var(--primary2) 1px solid;
}
input.form-control:focus + label.col-form-label, select.form-select:focus + select.col-form-label, textarea.form-control:focus + textarea.col-form-label {
  color: var(--primary2)
}
.mycontainer{
  width: 100%;
  padding-right: 2rem;
  padding-left: 2rem;
  margin-right: auto;
  margin-left: auto;
  max-width: 1632px;
}
.span-p{
    color: gray;
    font-size: 14px;
}
.searchforselect{
  position: absolute !important;
  width: 47.69% !important;
  margin-top: 0px !important;
}
.esp-formgroup .choices{
  margin-bottom: 17px;
  margin-top: 17px;
}
.esp-formgroup .choices__inner{
    border-radius: 0.375rem !important;
    background-color: #fff !important;
    border: var(--secondary2) 1px solid !important;
    height: 45px !important;
}
.imgadj{
  max-width: 400px;
}
.citysvg{
  position: absolute;
  left: 0px;
  top: -48px;
  display: flex;
}
.my-shadow{
  box-shadow: 0 0.125rem 0.25rem var(--primary2) !important;
}
#showsidebarbtnicon{
  color: var(--primary2);
}
.table-color tr{
  border-right: var(--primary2) 1px solid !important;
  border-left: var(--primary2) 1px solid !important;
}
.table-color th{
  background-color: var(--primary2) !important;
  color: var(--secondary3) !important;
  border-right: var(--secondary3) 1px solid !important;
  border-left: var(--secondary3) 1px solid !important;
}
.table-color td{
  border-bottom: var(--primary2) 1px solid !important;
}
.table-color tbody tr:nth-child(odd) td{
  background-color: var(--secondary3) !important;
}

.table-color tbody tr:nth-child(even) td{
  background-color: #ffffff !important;
}
.font-35{
  font-size: 35px;
}

@media screen and (max-width: 400px) {
  .mycontainer{
    padding-right: 1rem;
    padding-left: 1rem;
  }
}