/*---Color---*/
/* SB Admin 2*/
/* ---- Custom Color ----*/
/************** Basic CSS **************/
/*@font-face {
    font-family: 'thai_sans_literegular';
    src: url('../fonts/thaisanslite_r1-webfont.eot');
    src: url('../fonts/thaisanslite_r1-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/thaisanslite_r1-webfont.woff2') format('woff2'),
        url('../fonts/thaisanslite_r1-webfont.woff') format('woff'),
        url('../fonts/thaisanslite_r1-webfont.ttf') format('truetype'),
        url('../fonts/thaisanslite_r1-webfont.svg#thai_sans_literegular') format('svg');
    font-weight: normal;
    font-style: normal;
}*/
/***********
    Fonts
***********/
/*font-family: 'Kanit', sans-serif;*/
/* kanit-regular - thai_latin */
@font-face {
    font-family: 'Kanit';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/kanit-v1-thai_latin/kanit-v1-thai_latin-regular.eot');
    /* IE9 Compat Modes */
    src: local('Kanit'), local('Kanit-Regular'), url('../fonts/kanit/kanit-v1-latin_thai-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/kanit/kanit-v1-latin_thai-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('../fonts/kanit/kanit-v1-latin_thai-regular.woff') format('woff'), /* Modern Browsers */ url('../fonts/kanit/kanit-v1-latin_thai-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('../fonts/kanit/kanit-v1-latin_thai-regular.svg#Kanit') format('svg');
    /* Legacy iOS */
}
/* kanit-500 - latin_thai */
@font-face {
    font-family: 'Kanit';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/kanit-v1-latin_thai/kanit-v1-latin_thai-500.eot');
    /* IE9 Compat Modes */
    src: local('Kanit Medium'), local('Kanit-Medium'), url('../fonts/kanit/kanit-v1-latin_thai-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/kanit/kanit-v1-latin_thai-500.woff2') format('woff2'), /* Super Modern Browsers */ url('../fonts/kanit/kanit-v1-latin_thai-500.woff') format('woff'), /* Modern Browsers */ url('../fonts/kanit/kanit-v1-latin_thai-500.ttf') format('truetype'), /* Safari, Android, iOS */ url('../fonts/kanit/kanit-v1-latin_thai-500.svg#Kanit') format('svg');
    /* Legacy iOS */
}
.font_thai_sans {
    font-family: 'Kanit', sans-serif;
}
/*End Fonts*/
body {
    color: #4d4d4d;
}
.font-weight-bold {
    font-weight: 500;
}
.font-weight-normal {
    font-weight: 400;
}
.fs11 {
    font-size: 11px;
}
.fs12 {
    font-size: 12px;
}
.fs13 {
    font-size: 13px;
}
.fs14 {
    font-size: 14px;
}
.fs15 {
    font-size: 15px;
}
.fs16 {
    font-size: 16px;
}
.fs17 {
    font-size: 17px;
}
.fs18 {
    font-size: 18px;
}
.fs19 {
    font-size: 19px;
}
.fs20 {
    font-size: 20px;
}
.fs21 {
    font-size: 21px;
}
.fs22 {
    font-size: 22px;
}
.fs23 {
    font-size: 23px;
}
.fs24 {
    font-size: 24px;
}
.fs25 {
    font-size: 25px;
}
.text-blue {
    color: #23527c;
}
.text-require {
    color: #B8302C ;
}
.text-warning {
    color: #E6AC00 !important;
}
.text-danger {
    color: #B23633 !important;
}
.keep-left {
    text-align: left;
}
.keep-right {
    text-align: right;
}
p.thai {
    text-indent: 30px;
}
label,
b,
strong {
    font-weight: 500;
}
.label-orange {
    background-color: #F67A2A;
}
.remark {
    color: #808080;
    font-size: 13px;
}
/************************/
#page-wrapper {
    color: #4d4d4d;
    margin: 0px;
    padding: 0px;
    padding-top: 70px;
    /*for fixed fix-top*/
    font-family: 'Kanit', sans-serif;
    font-size: 17px;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /*letter-spacing: 0.5px;*/
}
.modal {
    font-family: 'Kanit', sans-serif;
}
#page-wrapper .form-control,
#page-wrapper .btn,
.modal .form-control,
.modal .btn {
    font-size: 14px;
}
#page-wrapper .btn-icon {
    font-size: 14px;
}
#page-wrapper h1,
.modal h1 {
    font-size: 28px;
}
#page-wrapper h2,
.modal h2 {
    font-size: 24px;
}
#page-wrapper h3,
.modal h3 {
    font-size: 22px;
}
#page-wrapper h4,
.modal h4 {
    font-size: 18px;
}
#page-wrapper h5,
.modal h5 {
    font-size: 16px;
}
.modal-footer-center {
    text-align: center !important;
}
.wrapper-content {
    background-color: #f9f9f9;
    padding: 10px 20px 20px 20px;
    border: 1px solid #CCCCCC;
    border-radius: 7px;
    box-shadow: 3px 3px 3px rgba(50, 50, 50, 0.28);
}
.wrapper-content-inner {
    padding: 20px 0px 30px 0px;
    margin-bottom: 30px;
}
.wrapper-content-outer {
    padding-bottom: 30px;
    margin-bottom: 30px;
}
.label-padding {
    padding-top: 7px;
    margin-bottom: 0;
}
.label {
    font-weight: normal;
}
form h2,
form h3,
.form h2,
.form h3 {
    margin-top: 10px;
    color: #337AB7;
    padding-bottom: 4px;
    border-bottom: 1px dotted #B3B3B3;
}
.wrap-scroll-table {
    overflow: auto;
    /*overflow-y : hidden;*/    
}
.textbox-bootstrap {
    border-radius: 4px;
    border: 1px solid #ccc;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    padding: 6px 12px;
}
input[type='file'] {
    font-size: 14px;
}
/************** End Basic CSS **************/
/*************** Template basic ***************/
.navbar {
    /*opacity: 0.9;
      background-color: #235093;*/
    background: rgba(20, 60, 118, 0.92);
    /*#143C76*/
    border: none;
}
.navbar-brand {
    padding-top: 2px;
    padding-bottom: 2px;
}
.navbar-brand img {
    display: inline-block;
}
.navbar-brand #logo-lb {
    vertical-align: bottom;
    color: #fff;
    font-family: 'Kanit', sans-serif;
    font-size: 22px;
}
a.navbar-brand:hover {
    opacity: 0.7;
    color: #1c54be;
}
/*menu top main*/
.navbar-default #menu-top-main > li > a,
.navbar-default #menu-top-main > li > a:visited {
    color: #fff;
    border-radius: 5px;
}
.navbar-default #menu-top-main > li > a:focus,
.navbar-default #menu-top-main > li > a:hover,
.navbar-default #menu-top-main > .active > a,
.navbar-default #menu-top-main > .active > a:focus,
.navbar-default #menu-top-main > .active > a:hover,
.navbar-default #menu-top-main > .open > a,
.navbar-default #menu-top-main > .open > a:focus,
.navbar-default #menu-top-main > .open > a:hover {
    background-color: #163767;
    color: #6B91C9;
}
.navbar-default #menu-top-main .dropdown-menu {
    background: #ffffff;
}
.navbar-default #menu-top-main .dropdown-menu > .active > a,
.navbar-default #menu-top-main .dropdown-menu > .active > a:focus,
.navbar-default #menu-top-main .dropdown-menu > .active > a:hover {
    background-color: #143C76;
}
.navbar-default #menu-top-main > li:last-child {
    margin-right: 10px;
}
.navbar-collapse {
    font-family: 'Kanit', sans-serif;
}
.menu-top .menu-top-search {
    width: 200px;
    padding: 10px 10px 0px 10px;
}
.help-block {
    font-size: 14px;
    font-weight: 400;
}
.nav-menu-show-xs {
    display: none;
}
/*end menu top main*/
/* menu top notification */
.navbar-default #menu-top-notification > li > a,
.navbar-default #menu-top-notification > li > a:visited {
    color: #fff;
    border-radius: 5px;
}
.navbar-default #menu-top-notification > li > a:focus,
.navbar-default #menu-top-notification > li > a:hover,
.navbar-default #menu-top-notification > .active > a,
.navbar-default #menu-top-notification > .active > a:focus,
.navbar-default #menu-top-notification > .active > a:hover,
.navbar-default #menu-top-notification > .open > a,
.navbar-default #menu-top-notification > .open > a:focus,
.navbar-default #menu-top-notification > .open > a:hover {
    background-color: #163767;
    color: #6B91C9;
}
.navbar-top-links {
    margin-right: 20px;
}
.navbar-top-links li {
    display: block;
}
.navbar-default #menu-top-notification > li {
    margin-right: 5px;
}
ul.dropdown-user {
    min-width: 250px;
    width: auto;
}
.dropdown-job li {
    border-bottom: 1px dotted #ccc;
}
.dropdown-job li.no-border {
    border-bottom: none;
}
.ul-notification-header {
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 5px;
    /*margin-bottom: 5px;*/
    font-weight: bold;
    color: #808080;
    border-bottom: 1px solid #ccc;
}
.ul-notification-header-normal {    
    font-weight: normal !important;    
    color: #808080;
    line-height: 20px;
}
.ul-notification-user-header {
    padding: 7px 10px;
    margin-bottom: 6px;
    font-weight: bold;
    color: #23527c;
    border-bottom: 1px solid #ccc;
}

.navbar-nav>li>.dropdown-menu{
    padding: 1px 0 9px 0;        
    width: 300px;        
}

.user-header{ 
    color : rgba(255, 255, 255, 0.8);
    padding:10px 0px 5px 0px;
    background-color:#264B81;
}

.user-header>.emp-pic{
    width: 90px;  
    margin: 0 auto;
}

.user-header .circular-img {
    position: relative;
    width: 90px;
    height: 90px;
    overflow: hidden;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.5);
}

.user-header .circular-img img {
    width: 100%;
    height: auto;
}

.user-header>.emp-info{        
    margin:5px 0px 0px 0px;
    text-align: center;
}

.user-footer {
    background-color:#f9f9f9;
    padding:10px;
}

.user-header>.btn.btn-flat {
    border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    border-width: 1px;
}

.recent-item-unread {
    background-color: #EDF2FA    
}

.label-status {    
    display:inline; 
    padding:0px 20px;
}

.label-status-fluid {
    display:block;
    line-height:1.4
}

/* menu top notification */
.width-60-and-xs-full {
    width: 60%;
    margin: 0px auto;
}
.width-80-and-xs-full {
    width: 80%;
    margin: 0px auto;
}
table {
    font-size: 16px;
}
table thead th {
    text-align: center;
}
#page-wrapper table .btn {
    font-size: 14px;
}
#page-wrapper table .btn-group {
    margin-top: 2px;
}
.label-control-inline {
    line-height: 34px;
    vertical-align: middle;
}
.height-20px {
    height: 20px;
}
.padding-tb-10px {
    padding-top: 10px;
    padding-bottom: 10px;
}
.padding-lr-10px {
    padding-left: 10px;
    padding-right: 10px;
}
.padding-lr-20px {
    padding-left: 20px;
    padding-right: 20px;
}
.padding-l-20px {
    padding-left: 20px;
}
.no-padding-lr {
    padding-left: 0px;
    padding-right: 0px;
}
.margin-lr-10px {
    margin-left: 10px;
    margin-right: 10px;
}
.control-label-normal-value {
    padding-top: 7px;
    margin-bottom: 0px;
    font-weight: normal;
}
.control-label-normal-value-no-padding {
    padding: 7px 0px;
    font-weight: normal;
}
h1.page-header {
    margin-top: 5px;
}
.img-spacing {
    margin: 7px;
}
.checkbox-inline-no-padding {
    position: relative;
    display: inline-block;
    padding-top: 7px;
    padding-left: 0px;
    margin-bottom: 0;
    vertical-align: middle;
    font-weight: normal;
    cursor: pointer;
}
/*************** End Template basic ***************/
#page-no {
    text-align: right;
    padding: 5px 10px;
    color: #d14;
}
.fa.arrow {
    width: 9px;
}
.badge-keep-right {
    float: right;
    margin: 0px 3px;
}
.plus-times {
    font-size: 13px;
    line-height: 16px;
    vertical-align: middle;
}
.head-log {
    color: #457017;
    border-bottom: 1px dotted #457017;
    font-size: 18px;
}
.breadcrumb-wrapper {
    -webkit-box-shadow: 1px 1px 10px 1px #DEDEDE;
    box-shadow: 1px 1px 10px 1px #DEDEDE;
    background-color: #fefefe;
}
.breadcrumb-wrappers .breadcrumb {
    background-color: transparent;
    padding-left: 0px;
    margin-bottom: 0px;
}
ol.progtrckr li .progtrckr-item {
    font-size: 14px !important;
}
.header-nopadding {
    padding: 5px 0px;
    margin: 5px 0px;
}
#number-error-box {
    color: #d14;
    position : absolute;
    padding :0px;
    width :300px;
}
.table-show-detail {
    table-layout: fixed;
}
.table-show-detail .detail-title {
    color: #4d4d4d;
    font-weight: bold;
    background-color: #F5F5F5;
}
.ui-autocomplete-loading {
    background: white url('../images/please_wait.gif') right center no-repeat;
}
#ajax-loading {
    margin-left: 5px;
    background-image: url('../images/please_wait.gif');
    background-repeat: no-repeat;
    color: #1d5987;
}
.ui-autocomplete {
    max-height: 300px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
    /* add padding to account for vertical scrollbar */
    z-index: 1000 !important;
}
.control-label-left {
    padding-top: 7px;
    margin-bottom: 0;
    text-align: left;
}
#modal_waiting_frame {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    opacity: 0.8;
    background-color: #222;
    z-index: 9999;
}
#modal_waiting_img {
    background-image: url('../images/wait_big.gif');
    background-position: bottom center;
    background-repeat: no-repeat;
    width: 220px;
    height: 50px;
    margin: 50px auto;
    text-align: center;
    font-weight: bold;
    color: #fff;
}
.table > thead > tr > th {
    vertical-align: top;
}
/* on heading table sorting */
.a-sortable-th {
    display: block;
    width: 100%;
    height: 100%;
}
.a-sortable-th-icon {
    color: #E13300;
}
ul.pagination {
    padding-top: 0px;
    margin-top: 0px;
}
.code-comment {
    background-color: #F9EE85;
    border: 1px solid #F4DD10;
    color: #998A00;
    margin: 5px 0px;
    padding: 5px 8px;
    border-radius: 3px;
    display: none;
}
.title-underline {
    padding-bottom: 8px;
    margin-bottom: 15px;
    border-bottom: 2px solid #585858;
}
.count-total {
    text-align: right;
    padding: 12px;
    color: #777;
}
.panel-body .sub-title {
    font-size: 26px;
    color: #9B9B9B;
}
.checkbox-radio-fix {
    padding-left: 0px;
}
.checkbox-radio-fix label {
    font-weight: normal;
    padding-right: 10px;
}
/*****************
    Button 
*****************/
.button-choice {
    color: #4d4d4d;
    background: none;
    border: 1px dotted #138CD3;
    padding-top: 20px;
    padding-bottom: 20px;
}
.button-choice a {
    color: #4d4d4d;
}
.button-choice:hover {
    background-color: #337AB7;
    border: 1px dotted #337AB7;
    color: #fff;

}
.button-choice-selected{
    background-color: #337AB7;
    border: 2px dotted #337AB7;
    color: #fff;
    padding:20px 20px;
}
.btn-width {
    padding: 6px 35px;
}
.btn-slim {
    padding: 2px 12px;
}
.btn-group .dropdown-menu li {
    font-size: 18px;
}
.btn-pink {
    background-color: #E62C88;
    color: #fff;
}
a.btn-pink,
a:visited.btn-pink {
    color: #fff;
}
a:hover.btn-pink {
    background-color: #EE72B0;
    color: #fff;
    text-decoration: none;
}
.btn-orange {
    background-color: #F67A2A;
    color: #fff;
}
.btn-orange:hover {
    background-color: #D15809;
    color: #fff;
}
a.back-simple {
    color: #c2c2c2;
    vertical-align: bottom;
    font-size: 20px;
}
/* End Button */
.icon-sorting {
    color: #FF6633 !important;
}
/* For bootbox cancel(move right) and spacing*/
.bootbox-cancel-spacing {
    margin-left: 5px;
}
/***********
    Evalution form
***********/
.evalution-wrapper .section-title {
    color: #23527c;
    margin-top: 30px;
    margin-bottom: 20px;
    border-bottom:0px;
}
.evalution-wrapper .evalution-section {
    background-color: #f9f9f9;
    padding: 10px 20px 20px 20px;
    border: 1px solid #CCCCCC;
    border-radius: 7px;
    box-shadow: 3px 3px 3px rgba(50, 50, 50, 0.28);
    background-color: #fff;
    font-size: 16px !important;
}
.evalution-wrapper .evalution-section h3 {
    font-size: 18px !important;
    font-weight: 500;
}
.evalution-wrapper .evalution-section .section-title {
    color: #23527c;
}
.evalution-wrapper .evalution-section .table {
    margin-top: 15px;
}
.evalution-wrapper .evalution-section .table .rated_point {
    font-size: 14px;
    font-weight: 500;
    width: 60px;
    text-align: center;
    vertical-align: middle;
}
.evalution-wrapper .evalution-section .table .radio-choice {
    text-align: center;
    position: relative;
}
.evalution-wrapper .evalution-section .table .radio-choice label {
    display: block;
    width: 100%;
    height: 100%;
}
.evalution-wrapper .evalution-section .table .heading-row {
    background-color: #f2f2f2;
}
/** END Evalution form **/
/***********
    Alert animate
************/
.alert-animate {
    -webkit-animation: cssAnimation 1s ease;
    -moz-animation: cssAnimation 1s ease;
    -o-animation: cssAnimation 1s ease;
}
@-webkit-keyframes cssAnimation {
    from {
        -webkit-transform: scale(0.403);
    }
    to {
        -webkit-transform: scale(1);
    }
}
@-moz-keyframes cssAnimation {
    from {
        -moz-transform: scale(0.403);
    }
    to {
        -moz-transform: scale(1);
    }
}
@-o-keyframes cssAnimation {
    from {
        -o-transform: scale(0.403);
    }
    to {
        -o-transform: scale(1);
    }
}
/* xs */
@media (max-width: 767px) {
    /*Navigation bar*/
    .navbar-default .navbar-brand #logo-lb {
        display: none;
    }
    .navbar-top-links {
        margin-right: 0px;
    }
    #wrapper .navbar-collapse {
        margin-right: -15px;
    }
    .navbar-fixed-bottom .navbar-collapse,
    .navbar-fixed-top .navbar-collapse {
        max-height: 100%;
    }
    .menu-top .menu-top-search {
        width: 300px;
    }
    .navbar-default #menu-top-notification > li {
        margin-right: 0px;
    }
    ul.dropdown-job,
    ul.dropdown-messages,
    ul.dropdown-user {
        background-color: #EEF0F3 !important;
        margin: 0px 3px;
    }
    .navbar-default .navbar-toggle .icon-bar {
        background-color: #fff;
    }
    .navbar-default .navbar-toggle:focus,
    .navbar-default .navbar-toggle:hover {
        background-color: #567EA8;
    }
    .nav-menu-show-xs {
        display: inline-block;
    }
    /*END Navigation bar*/
    .width-60-and-xs-full {
        width: 100%;
    }
    .width-80-and-xs-full {
        width: 100%;
    }
    .page-header {
        font-size: 24px;
        margin-top: 12px;
        font-weight: bold;
    }
    .row-top-margin {
        margin-top: 13px;
    }
    .table-show-detail td {
        display: block;
    }
    .img-spacing {
        margin: 0px;
        margin-bottom: 5px;
        width: 100%;
    }
    .img-xs-width-fit {
        max-width: 100%;
    }
    .control-label-normal-value {
        padding-top: 0px;
        margin-bottom: 6px;
    }
    .xs-tb-padding {
        padding-top: 7px;
        padding-bottom: 7px;
    }
}
/* xs */
@media (min-width: 291px) and (max-width: 767px) {
    .navbar-nav {
        padding-bottom: 5px;
    }
    .sm-padding-top7px {
        padding-top: 7px;
    }
    .sm-tb-padding {
        padding-top: 7px;
        padding-bottom: 7px;
    }
    .menu-top .menu-top-search {
        display: none;
    }
    ol.progtrckr[data-progtrckr-steps="2"] li { width: 2% !important; }
    ol.progtrckr[data-progtrckr-steps="3"] li { width: 2% !important; }
    ol.progtrckr[data-progtrckr-steps="4"] li { width: 2% !important; }
    ol.progtrckr[data-progtrckr-steps="5"] li { width: 2% !important; }
    ol.progtrckr[data-progtrckr-steps="6"] li { width: 2% !important; }
    ol.progtrckr[data-progtrckr-steps="7"] li { width: 2% !important; }
    ol.progtrckr[data-progtrckr-steps="8"] li { width: 2% !important; }
    ol.progtrckr[data-progtrckr-steps="9"] li { width: 2% !important; }
    ol.progtrckr li .progtrckr-item {
        display:none;
    }
    ol.progtrckr {
        padding-left: 0px;
    }    
}

/* sm */
@media (min-width: 768px) and (max-width: 991px) {
    .navbar-nav {
        padding-bottom: 5px;
    }
    .sm-padding-top7px {
        padding-top: 7px;
    }
    .sm-tb-padding {
        padding-top: 7px;
        padding-bottom: 7px;
    }
    .menu-top .menu-top-search {
        display: none;
    }    
    ol.progtrckr li .progtrckr-item {
        font-size: 11px !important;
        line-height:4.8em;
    }

}
/* md */
@media (min-width: 992px) and (max-width: 1199px) {
    .navbar {
        padding: 10px 0px;
    }
    .menu-top .menu-top-search {
        display: none;
    }
    ol.progtrckr li {
        line-height:3em;
    }
}
/* lg */
@media (min-width: 1200px) {
    .navbar {
        padding: 10px 0px;
    }
    .navbar-header {
        margin-left: 50px;
    }
    ol.progtrckr li {
        line-height:3em;
    }
}
/* stage Process */
/*Print*/
@media print {
    table {
        table-layout: fixed;
        font-size: 12px;
    }
    table .btn,
    table a {
        font-size: 12px !important;
    }
}
.tbl_fix_head tbody {
    overflow: auto;
    height: 380px;
    width: 100%;
    padding-left: 16px;
    padding-right: 0px;
    /*  position: absolute;*/
}
.tbl_fix_head thead,
.tbl_fix_head tbody {
    display: block;
}
/* End Print*/
/*# sourceMappingURL=member.css.map */
.modal{
    z-index: 1050;
}
#main_admin_top_menu{
    z-index: 1200;
}

#boot_waiting,.bootbox{
    z-index: 1050;
}

.ui-autocomplete{
    /*    position: relative;*/
    z-index: 99999; 
}
.calendars-popup{
    position: relative;
    z-index: 99999; 
}
.txt-muted{
    color: #ccc;
}

.navbar-brand .label_is_test{
    float: right;
    font-size: 16px;
}

.modal-xl{
    width: 85%;
  /*  width: auto;*/
}
