/* Style Form */
input[type="checkbox"],
input[type="radio"] {
    height: auto;
    padding: 0;
    border: 0;
    background: none;
}
fieldset { border: 0; margin: 0; padding: 0;}
fieldset[disabled] .form-control {
    background-color: transparent;
    opacity: 1;
    color: #999;
    font-size: 14px;
}
input[type="search"] { -webkit-appearance: none;}
input[type=submit]:disabled, button[type=submit]:disabled, button[type=button]:disabled {
    background-color: #ccc!important;
    color: #FFF;
    cursor: not-allowed;
}
button:focus { outline: 0; }
textarea.form-control { height: auto;}

.input-relative, .col-relative { position: relative;}

.form-control-lg:disabled { font-size: 22px!important;}
.form-container-center { margin: 0 auto;}
.form-container-sm { max-width: 460px;}  /*custom f1*/
.form-container-md { max-width: 580px;}
.form-container-lg { width: 90%;}

.form-container .sc-action { margin-top: 40px!important; text-align: center;}

.heading-form { margin-bottom: 55px; text-align: center;}

/* Styled Select */
.styled-select { position: relative; text-align: left;}
.styled-select-sm { width: 95px!important;}
.styled-select-sm .chosen-container { width: 90px!important;}
.styled-select select { width: 100%;}
.styled-select select, 
.styled-select select:focus { cursor: pointer; text-overflow: "";}
.styled-select select:focus { outline: 0;}
.styled-select-img .chosen-container { width: 100%!important;}
.styled-select-img .chosen-container .chosen-results li { padding: 12px 40px;}
.styled-select-inline { display: inline-block;}

/* Device Mobile */
.device-mobile .styled-select select {
    height: 35px;
    font-family: 'gothamrounded-medium', 'sukhumvittadmai_bol';
    font-size: 14px;
    line-height: 35px;
    border-radius: 0;
    color: #aaa;
    border: 0;
    padding: 0;
    border-bottom: 1px solid #bbb;
    background-color: transparent;
}
.device-mobile .styled-select:after {
    border-color: #333 transparent transparent transparent;
}
.device-mobile .styled-select:after {
    content: '';
    position: absolute;
    top: 17px;
    right: 6px;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 5px 4px 0 4px;
    border-color: #bbb transparent transparent transparent;
}
.device-mobile .styled-select.filled select:focus {
    color: #333;
    font-size: 16px;
}
.device-mobile .styled-select.filled select {
    color: #333;
}
.device-mobile .styled-select.filled select { font-size: 16px; color: #333!important}

.form-control {
    display: block;
    width: 100%;
    height: 35px;
    font-family: 'gothamrounded-medium', 'sukhumvittadmai_bol';
    line-height: 34px;
    font-size: 16px;
    color: #333;
    padding: 0;
    background-color: #fff;
    background-image: none;
    border:0;
    border-radius: 0px;
    border-bottom: 1px solid #bbb;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
.form-control-default { font-size: 14px;}
.form-control-sm { width: 200px!important;}
.form-control-lg { font-size: 22px;}
.form-control:focus {
    border-color:#333;
    outline: 0;
    -webkit-box-shadow: inset 0 0 0;
    box-shadow: inset 0 0 0;
}
.form-control::-moz-placeholder {
    color: #bbb;
    opacity: 1;
    font-size: 14px;
}
.form-control:-ms-input-placeholder {
    color: #bbb;
    opacity: 1;
    font-size: 14px;
}
.form-control::-webkit-input-placeholder {
    color: #bbb;
    opacity: 1;
    font-size: 14px;
}
.form-control::-ms-expand {
    background-color: transparent;
    border: 0;
}
.form-control[disabled],
.form-control[readonly],
.form-control[disabled], fieldset[disabled] .form-control { cursor: not-allowed;}
.disabled-text[disabled], fieldset[disabled] .form-control { cursor: not-allowed; color: #999; } /*custom f1*/

.fieldset { margin-bottom: 25px;}
.fieldset:last-child { margin-bottom: 0;}
.fieldset-label { margin-bottom: 15px;}

.fieldset-group { position: relative; margin-bottom: 30px;}
.fieldset-group:last-child { margin-bottom: 0; border-bottom: 0; padding-bottom: 0;}

.field { margin-bottom: 30px; }
.field:last-child,
.field.last-child { margin-bottom: 0;}
.field-group { margin-bottom: 12px;}
.field-text {
    font-family: 'gothamrounded-medium', 'sukhumvittadmai_bol';
    font-size: 13px; 
    color: #999;
}
.field-text a.btn-otp { margin-left: 5px;}
.form-inline {
    display: table-cell;
    vertical-align: middle;
}
.form-inline-label {
    display: table-cell;
    vertical-align: middle;
    font-family: 'gothamrounded-medium', 'sukhumvittadmai_bol';
    font-size: 14px; 
    line-height: 1;
    color: #333;
    text-align: right;
}
.field-result-info { display: block;}
.field-result-info .form-info,
.field-result-info .form-control-lg {
    font-family: 'gothamrounded-medium', 'sukhumvittadmai_bol';
}
.field-result-info .form-info {
    font-size: 16px;
}
.field-result-info .form-control-lg {
    font-size: 22px;
}
.field-result-info span { display: inline-block; vertical-align: unset; margin-left: 2px;}

/* Checkbox & Radio */
.choice { position: relative; line-height: 1;}
.choice.inline {
    display: inline-block;
    vertical-align: top;
}
.choice.inline:not(:last-child) {
    margin-right: 20px;
}
.choice > label {
    position: relative;
    display: inline-block;
}
.choice input.choice-input {
    position: absolute; 
    z-index: -1000; 
    overflow: hidden; 
    clip: rect(0 0 0 0); 
    height: 1px; width: 1px; 
    margin: -1px; padding: 0; 
    border: 0;
}
.choice input.choice-input + .choice-name {
    min-width: 20px;
    min-height: 20px;
    display: inline-block;
    padding-left: 30px;
    height: auto;
    line-height: 20px;
    vertical-align: top;
    cursor: pointer;
    background-size: 20px 20px;
    -webkit-transition: all 0.25s linear;
}
.choice input.choice-input + .choice-name.empty { padding-left: 0;}
.choice .choice-name {
    display: inline-block;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-family: 'gothamrounded-medium', 'sukhumvittadmai_bol';
    color: #333;
    font-size: 14px;
}
.choice .choice-col {
    display: table-cell;
    width: 100%;
    vertical-align: middle;
}
.choice .choice-col:not(:last-child) { padding-right: 15px;}
.choice label.choice-col { width: 1%; white-space: nowrap;}
.choice-o input.choice-input + .choice-name {
    min-width: 20px;
    min-height: 20px;
    display: inline-block;
    padding-left: 30px;
    height: auto;
    line-height: 20px;
    vertical-align: top;
    cursor: pointer;
    background-size: 20px 20px;
    -webkit-transition: all 0.25s linear;
}

/* Image */
.choice input.choice-input + .choice-name {
    background-repeat: no-repeat;
    background-position: left top;
}
.choice input[type=radio].choice-input + .choice-name {
    background-image: url(../img/icon/radio.png);
}
.choice input[type=radio].choice-input:checked + .choice-name {
    background-image: url(../img/icon/radio-chk.png);
}
.choice input[type=checkbox].choice-input + .choice-name {
    background-image: url(../img/icon/checkbox.png);
}
.choice input[type=checkbox].choice-input:checked + .choice-name {
    background-image: url(../img/icon/checkbox-chk.png);
}

.choice-o input[type=radio].choice-input + .choice-name {
    background-image: url(../img/icon/radio-o.png);
}
.choice-o input[type=radio].choice-input:checked + .choice-name {
    background-image: url(../img/icon/radio-o-chk.png);
}

.label-form {
    display: block;
    font-family: 'gothamrounded-medium', 'sukhumvittadmai_bol';
    font-size: 16px;
    line-height: 1.3;
    color: #333;
}
.label-subform { margin-bottom: 3px; line-height: 1;}
.label-block { display: block;}

.form-alt { font-family: 'gothamrounded-medium', 'sukhumvittadmai_bol'; font-size: 11px; color: #999; margin-top: 3px;}

.field-padding { display: block; padding-left: 30px;}
.field-padding input { width: 300px;}

.row-col { font-size: 0; margin-left: -10px; margin-right: -10px;}
.row-col .col { 
    display: inline-block; 
    vertical-align: middle; 
    font-size: 16px;
    padding: 0;
}
.row-col .col-vtop { vertical-align: top;}
.col-form {
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    padding-left: 10px;
    padding-right: 10px;
}

.col-form-3 { width: 25%;}
.col-form-4 { width: 33.333333%;}
.col-form-5 { width: 41.666667%;}
.col-form-6 { width: 50%;}
.col-form-7 { width: 58.333333%;}
.col-form-8 { width: 66.666667%;}
.col-form-9 { width: 75%;}
.col-form-12 { width: 100%;}

/*.form-calendar { max-width: 290px;}*/
.form-calendar .ic-calendar { 
    position: absolute; 
    top: 10px; 
    right: 10px; 
    color: #333;
    pointer-events: none;
}
.input-control { position: relative;}
.form-control.is-invalid {
    border-color: #dc3545;
}
.invalid-feedback {
    display: block;
    margin-top: 5px;
    font-family: 'gothamrounded-medium', 'sukhumvittadmai_bol';
    font-size: 12px;
    color: #D71F3E;
}
.form-error-message {
    position: absolute;
    top: 0;
    right: 0;
    display: inline-block;
    padding: 6px 12px;
    font-family: 'gothamrounded-medium', 'sukhumvittadmai_bol';
    font-size: 10px;
    color: #FFF;
    border-radius: 5px;
    background-color: #D71F3E;
}
.form-error-message:after {
    content: '';
    display: block;
    width: 0; 
    height: 0; 
    position: absolute;
    top: 6px;
    left: -4px;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent; 
    border-right: 8px solid #D71F3E; 
}

/* Switch */
.switch {
    position: relative;
    display: inline-block;
    vertical-align: bottom;
    width: 54px;
    height: 28px;
}
.switch input { display:none;}
.toggle-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #eee;
    -webkit-transition: .4s;
    transition: .4s;
}
.toggle-slider:before {
    position: absolute;
    content: "";
    height: 24px;
    width: 24px;
    left: 2px;
    bottom: 2px;
    background-color: #FFF;
    -webkit-transition: .4s;
    transition: .4s;
}
.toggle-slider:after {
    content: '';
    display: inline-block;
    position: absolute;
    top: 5px;
    right: -35px;
    font-family: 'gothamrounded-bold', 'sukhumvittadmai_bol';
    font-size: 14px;
    line-height: 1.3;
    color: #333;
}
input:checked + .toggle-slider { background-color: #D71F3E;}
input:focus + .toggle-slider { box-shadow: 0 0 1px #D71F3E;}
input:checked + .toggle-slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}
input:checked + .toggle-slider:after {
    content: '';
}

/* Rounded sliders */
.toggle-slider.round { border-radius: 34px;}
.toggle-slider.round:before { border-radius: 50%;}

.group-form { width: 100%; display: table;}

.chosen-container-single {
    border-color: #333 transparent transparent transparent;
}


/* Media Queries */

@media (max-width: 767px) { 
    
    .col-form,
    .col-form-3,
    .col-form-4,
    .col-form-5,
    .col-form-6,
    .col-form-7,
    .col-form-8,
    .col-form-9 { width: 100%!important;}
    
    .field-text { font-size: 11px;}
    .label-form { font-size: 14px; margin-bottom: 5px;}
    
    .form-control,
    .form-control-lg { font-size: 16px;}
    .form-inline { width: 95%;}
    .form-inline-label { text-align: right; font-size: 13px;}
    
    .switch { margin-top: 10px;}
    
    .form-calendar { max-width: 100%;}
    
    .field-padding { padding-left: 0;}
    
    .form-control::-moz-placeholder { font-size: 13px;}
    .form-control:-ms-input-placeholder { font-size: 13px;}
    .form-control::-webkit-input-placeholder { font-size: 13px;}
    .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control { font-size: 13px;}
    
    .group-choice { margin-top: 20px;}
    .group-choice .choice-name { margin-bottom: 5px;}
}