[v-cloak] {
    display: none;
}

/* html,body {
    text-size-adjust: none;
    -webkit-text-size-adjust: none;
    -ms-text-size-adjust: none;
    -moz-text-size-adjust: none;
} */

body {
    font-size: 1rem;
    font-family: 'Helvetica Neue', 'Noto Sans Thai', sans-serif;
    background-color: #f5f5f5;
}

.label-required::after {
    content: " *";
    color: red;
}

.v1-header-menu {
    font-size: 1.0rem;
    margin: 0 0.75rem;
    color: rgb(2, 64, 137);
    text-decoration: none;
}
.v1-header-menu:hover {
    color: rgb(2, 64, 137);
}

.v1-footer-menu {
    font-size: 0.9rem;
    margin-bottom: 0.75rem;
    margin-right: 0.5rem;
    color: white;
    text-decoration: none;
}
.v1-footer-menu:hover {
    color: white;
}

.badge {
    font-size: 1rem; 
    font-weight: 400; 
    white-space: inherit; 
    line-height: 1.5;
}

.btn {
    border-radius: 0.5rem; 
    box-shadow: none !important;
}

.btn-primary {
    color: #fff;
    background-color: rgb(2, 64, 137);
    border-color: rgb(2, 64, 137);
}
.btn-primary:hover, .btn-primary:active, .btn-primary:focus {
    color: #fff;
    background-color: rgb(2, 64, 137);
    border-color: rgb(2, 64, 137);
}

.btn-secondary {
    color: #fff;
    background-color: rgb(51, 204, 204);
    border-color: rgb(51, 204, 204);
}
.btn-secondary:hover, .btn-secondary:active, .btn-secondary:focus {
    color: #fff;
    background-color: rgb(51, 204, 204);
    border-color: rgb(51, 204, 204);
}

/* colorful background & border: start */

.bg-gray, .bg-gray:hover, .bg-gray:active, .bg-gray:focus {
    background-color: #656D78;
}

.bg-yellow, .bg-yellow:hover, .bg-yellow:active, .bg-yellow:focus {
    background-color: #FFCE54;
}

.bg-orange, .bg-orange:hover, .bg-orange:active, .bg-orange:focus {
    background-color: #FC6E51;
}
.text-orange {
    color: #FC6E51;
}

.bg-mint, .bg-mint:hover, .bg-mint:active, .bg-mint:focus {
    background-color: #48CFAD;
}

.bg-violet, .bg-violet:hover, .bg-violet:active, .bg-violet:focus {
    background-color: #AC92EC;
}

.bg-cyan, .bg-cyan:hover, .bg-cyan:active, .bg-cyan:focus {
    background-color: #4FC1E9;
}

.bg-blue, .bg-blue:hover, .bg-blue:active, .bg-blue:focus {
    /* background-color: #5D9CEC; */
    background-color: #170995;
}

.bg-green, .bg-green:hover, .bg-green:active, .bg-green:focus {
    background-color: #A0D468;
}

.bg-pink, .bg-pink:hover, .bg-pink:active, .bg-pink:focus {
    background-color: #EC87C0;
}

.bg-red, .bg-red:hover, .bg-red:active, .bg-red:focus {
    background-color: #ED5565;
}

/* colorful buttons: end */

.bg-primary {
    background-color: rgb(2, 64, 137) !important;
}

.text-primary {
    color: rgb(2, 64, 137) !important;
}

.bg-secondary {
    background-color: rgb(51, 204, 204) !important;
}

.text-secondary {
    color: rgb(51, 204, 204) !important;
}

.lead {
    font-size: 1.25rem;
    font-weight: 400;
}

.supertext {
    font-size: 1.1rem;
}

.subtext {
    font-size: 0.9rem;
}



.fw-600 {
    font-weight: 600;
}