body, .page-header .navbar-fixed-top { background: url("../img/bg.png") no-repeat top center #224465; background-size: cover; }
.page-header .navbar .navbar-nav > li, .page-header .navbar .navbar-nav .dropdown-menu>li>a { font-family: "thaisans_neueregular", Helvetica; font-size: 1.5em; }
.page-header .navbar .navbar-nav > li > a { background: #3598dc; color: #fff; font-size: 1.1em; font-family: inherit; padding-top: 18px; padding-bottom: 18px; }
.page-header .navbar-collapse .navbar-nav .more-dropdown > a::after { top: 18px; }
.page-header .navbar .navbar-nav>li>a>i { font-size: 1.1em; float: left; top: 2px; }
/*.page-header .navbar .navbar-nav li a:hover { background: #0078aa!important; color: #fff!important; }*/
.page-header .navbar .navbar-nav li.open:hover > a, .page-header .navbar .navbar-nav li.open > a { background: #0069b0; color: #fff; font-weight: bold; }
.page-header .navbar .navbar-nav .dropdown-menu>li>a, .dropdown-menu>li>a>[class*=" icon-"], .dropdown-menu>li>a>[class^=icon-] { color: #cce6f1; }
.page-header .navbar .navbar-nav .dropdown-menu li.active>a, .page-header .navbar .navbar-nav .dropdown-menu li.active>a>i, .page-header .navbar-collapse .navbar-nav .more-dropdown>a:after { color: #fff; }
.page-header .navbar .topbar-actions .btn-group-notification { margin: 0 15px; position: relative; }
.page-header .navbar-collapse .navbar-nav .more-dropdown>a:hover:after { color: #ccc; }
.page-header .nav-collapse .navbar-nav li > a::after, .page-header .nav-collapse .navbar-nav li.open > a::after { color: #fff!important; }
.page-header .nav-collapse .navbar-nav li > a:hover::after, .page-header .nav-collapse .navbar-nav li.open > a:hover::after { color: #4aabd4!important; }
.page-header .navbar .search .form-control { background: #222930; }

.page-header .navbar .navbar-nav .dropdown-menu { background: #2884c2; }
.page-header .navbar-collapse .navbar-nav .more-dropdown>a:hover, .page-header .navbar-collapse .navbar-nav .more-dropdown:hover>a, .page-header .navbar-collapse .navbar-nav .more-dropdown>a:hover::after, .page-header .navbar-collapse .navbar-nav li.open.more-dropdown > a, .page-header .navbar-collapse .navbar-nav li.open.more-dropdown:hover > a, .page-header .navbar-collapse .navbar-nav li.open.more-dropdown:hover > a::after { background: #2884c2!important; color: #fff!important; }

.page-header .nav-collapse .navbar-nav li > a:hover { background: #2884c2; }
.page-header .nav-collapse .navbar-nav li > a::after { content: ""!important; }
.page-header .nav-collapse .navbar-nav li.more-dropdown > a::after { content: "\f105"!important; }
.page-header .nav-collapse .navbar-nav li.open.more-dropdown > a::after { content: "\f107"!important; }

.breadcrumbs { margin-bottom: 15px; }

.page-header .navbar .navbar-nav .dropdown-menu > li > a { padding: 15px!important; font-size: 1.35em; }
.page-header .navbar .navbar-nav .dropdown-menu > li i { font-size: 0.75em; }
.page-header .navbar-collapse .navbar-nav .more-dropdown-sub > a::after { top: 22px; }
.dashboard-stat2 { padding-bottom: 15px; }
.dashboard-stat2 .display .icon { padding-top: 20px; }
.dashboard-stat2 .display .icon > i { font-size: 54px; }
.dashboard-stat2 .display .number small { font-size: 1.1em; color: #999; }
.dashboard-stat2.blue { background: #3598dc; border-color: #288acd; }
.dashboard-stat2.blue .display .number small { color: #ddd; }
.dashboard-stat2.blue .display .number h3 { color: #fff; }

.branch { font-family: "thaisans_neuebold", Helvetica; }
.page-content { background: rgba(255, 255, 255, 0.5); border-top: 8px solid #0069b0; }
.breadcrumbs .breadcrumb { border-radius: 0; text-align: left; }
.breadcrumbs .breadcrumb > li > a, .breadcrumbs .breadcrumb > li > a:hover { color: #fff; }
.breadcrumbs .breadcrumb li.active { color: #fff; }
.breadcrumbs .breadcrumb > li + li::before { color: #0069b0; }

.icon-user.register, .icon-magnifier.register { font-size: 4em; border-radius: 100%; width: 120px; height: 120px; line-height: 110px; text-align: center; border: 4px solid rgba(203, 212, 224, 0.5); color: #3598dc; margin: 15px auto; display: block; }

.portlet.light > .portlet-title > .caption > .caption-subject, .form-title { font-family: "thaisans_neuebold", Helvetica; font-size: 24px; line-height: 1em; }
.portlet.light.bordered > .portlet-title, .form-title { border-width: 3px; }

.portlet .btn { font-family: "thaisans_neuebold", Helvetica; font-size: 1.4em; }
.portlet .btn:last-child { margin-right: 0; }
.portlet .btn > i { font-size: 0.7em; }

.table .btn { min-width: 38px; height: 38px; line-height: 38px!important; padding-top: 0; padding-bottom: 0; }
.table button.btn i { line-height: 38px!important; }

.form-inline { white-space: nowrap; }
.td-action { white-space: nowrap; }
td:last-child.text-right { white-space: nowrap; }

.dt-buttons > .dt-button { line-height: 1em!important; }

.dataTable td > .btn-group { position: relative!important; }
.input-group-btn .btn > i { font-size: 14px; line-height: 1.44em; }

.form-title { min-height: 48px; border-bottom: 1px solid #eef1f5; margin: 10px 0 30px 0; font-weight: bold; padding: 10px 0; }

.navbar-fixed-top { background: none!important; }
.page-on-scroll .navbar-fixed-top { background: #224465!important; }

/* Bootstrap */
.btn { padding-top: 8px; padding-bottom: 8px; }
.btn-xs { padding-left: 10px; padding-right: 10px; }
.btn-xs, .btn-sm, .btn-md, .btn-lg { padding-top: inherit; padding-bottom: inherit; }
td > .btn-xs { line-height: 1em!important; padding-top: 6px; padding-bottom: 6px; }
.form-control { background: rgba(203, 212, 224, 0.35); height: 38px; }
.form-control::-moz-placeholder { color: #9fabbc; }
.form-control:-ms-input-placeholder { color: #9fabbc; }
.form-control:-webkit-input-placeholder { color: #9fabbc; }

.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control { background: rgba(203, 212, 224, 0.9); }

.form-inline .form-group { margin: 0 0 5px 0!important; }
.form-filter { margin: 30px 0; }

.radio > .form-control { margin-top: 7px; }

/* Components.min */
.portlet.light.bordered, .dashboard-stat2.bordered { border-color: #3598dc!important; border-left-width: 4px!important; }
.dashboard-stat2 .display .number h3 { font-size: 2.8em; font-weight: bold; }

/* Login */
body.login { background: url("../img/bg-login.jpg") no-repeat top center #224465; background-size: cover; }
.user-login-5 .login-logo { left: auto; right: 20px; top: 75%; width: 350px; }
.user-login-5 .login-container { background: #fff; }
.user-login-5 .login-container > .login-content > h1 { font-family: "thaisans_neuebold", Helvetica; font-size: 3em; color: #3598dc; }
.user-login-5 .login-container > .login-content > p { font-family: "thaisans_neueregular", Helvetica; font-size: 1.5em; color: #333; }
.user-login-5 .login-container > .login-content > .login-form .form-control { background: none; }
.user-login-5 .login-container .login-copyright, .user-login-5 .login-container .login-social, .user-login-5 .login-container > .login-content { padding: 0 60px; }
.font-blue-sharp { color: #3598dc!important; }

.bootstrap-tagsinput { padding-bottom: 0; }
.bootstrap-tagsinput .tag { margin-bottom: 5px; display: inline-block; padding: 8px; vertical-align }
.bootstrap-tagsinput .tag a.edit { line-height: 1em; margin-left: 10px; color: #fff; background: rgba(0, 0, 0, 0.5); }
.bootstrap-tagsinput .tag [data-role="remove"] { margin-left: 1px; background: rgba(204, 0, 0, 0.5); }
.bootstrap-tagsinput .tag [data-role="remove"]:after { content: ""!important; }
.bootstrap-tagsinput .tag a.edit, .bootstrap-tagsinput .tag [data-role="remove"] { display: inline-block; width: 1.5em; height: 1.5em; line-height: 1.5em; vertical-align: middle; text-align: center; padding: 0 5px; }

table.dataTable > tbody > tr.child .child { padding: 30px; }
table.dataTable > tbody > tr.child span.dtr-title { min-width: 150px; }

.check-input { position: relative; }
.check-input .checkbox { position: absolute; left: 7px; top: 5px; }
.check-input .form-control { padding-left: 25px; }

.date + .inline { padding: 10px; display: inline-block; *display: inline; zoom: 1; }

.tr-add { background: rgba(50, 197, 210, 0.1)!important; }

@media(min-width:991px) {
.mega-menu .dropdown-menu-fw { left: 14px; right: 14px; }
.page-header .navbar-collapse .navbar-nav .more-dropdown-sub>a:after { color: #fff; }
.page-header .navbar .navbar-nav li.open.selected>a { color: #fff; }
.page-content { padding-top: 15px; padding-bottom: 10px; }
.dashboard-stat2, .dashboard-stat2 .display { margin-bottom: 30px; }

/*.nav > li, .nav > li > a { position: static; }*/
.navbar-responsive-collapse { position: relative!important; }
/*.dropdown > .dropdown-menu { left: 0; width: 100%; }
.dropdown > .dropdown-menu > li { width: 25%; float: left; }*/
}
@media(max-width:1023px) {
.user-login-5 .login-logo { top: 50%; width: 280px; }
}

@media(max-width:992px) {
.page-header .navbar .navbar-toggle .icon-bar { background: #fff; }
.dropdown-menu > li > a { border-bottom: 1px solid rgba(255, 255, 255, 0.15); }
.dropdown-menu > li:last-child > a { border-bottom: none; }

.page-header .navbar .navbar-nav > li > a { padding-left: 20px; padding-right: 20px; }
.page-header .navbar .page-logo img { max-height: 50px; }

.user-login-5 .login-container > .login-content { margin-top: 0; padding-top: 40px; }

.form_datetime { max-width: 170px; }
}

@media(max-width:767px) {
.page-content { padding: 15px; }
.page-header .navbar .page-logo img { max-height: inherit; }

.user-login-5 .login-container > .login-content > h1 { font-size: 2.4em; margin-top: 15px; }
.user-login-5 .login-container > .login-content > p { font-size: 1.3em; line-height: 1.1em; margin: 15px 0; }
.user-login-5 .login-container > .login-content .login-form { margin-top: 20px; }
.user-login-5 .login-container > .login-content > .login-form .form-control { margin-bottom: 15px; }
.user-login-5 .login-container > .login-footer { margin-top: 20px; }

.form_datetime { max-width: 100%; }
}

@media(max-width:640px) {
.user-login-5 .login-logo { width: 200px; }
.user-login-5 .login-container .login-copyright, .user-login-5 .login-container .login-social, .user-login-5 .login-container > .login-content { padding: 0 15px; }
.user-login-5 .login-container > .login-content { padding: 15px; }
.user-login-5 .col-xs-6 { width: 100%; }

table.dataTable > tbody > tr.child span.dtr-title { min-width: 110px; }
}
@media(max-width:480px) {
body.login { background-size: 280%; }
.user-login-5 .login-logo { top: 100px; }
}

.form-p {
    margin: 0 0 10px 0;
}

.table-borderless-no-padding td {
    border: 0;
    padding: 0;
    vertical-align: top;
}
