* {
    font-family: "Sarabun", Sans-serif, serif;
}

.min-h-100vh {
    min-height: 100vh;
}

.tagify__input {
    display: block;
width: 100%;
padding: .775rem 1rem;
font-size: 1.1rem;
font-weight: 500;
line-height: 1.5;
color: #5e6278;
background-color: #fff;
background-clip: padding-box;
border: 1px solid #e1e3ea;
appearance: none;
border-radius: .475rem;
box-shadow: inset 0 1px 2px rgba(0,0,0,.075);
transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.tagify--outside{
    border: 0;
}

.tagify--outside .tagify__tag {
    margin: .5rem;
}

.tagify--outside .tagify__input{
  order: -1;
  flex: 100%;
  border: 1px solid var(--tags-border-color);
  margin-bottom: 1em;
  transition: .1s;
}

.tagify--outside .tagify__input:hover{ border-color:var(--tags-hover-border-color); }
.tagify--outside.tagify--focus .tagify__input{
  transition:0s;
  border-color: var(--tags-focus-border-color);
}

.fill_the_gap_input {
    min-width: 75px;
    width: 75px;
    max-width: 175px;
    border: none;
    outline: none;
    border-bottom: 3px dotted var(--kt-primary);
    padding: 0 .5rem;
    font-weight: bold;
    color: var(--kt-primary);
    background-color: transparent;
    text-align: center;
}

select.fill_the_gap_input option {
    color: var(--kt-form-select-color);
}

.form-check-label {
    color: inherit!important;
}

#toast-container > div {
    width: 500px!important;
}
