﻿.msgError{color:#d9534f; line-height:28px;}
.table-search{width:100%;}
.table-search tr td{background:#fff; padding-bottom:10px;}
.table-search tr td .inp-note{float:left; clear:both; margin-top:2px;}

.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span {display: none;}
.ui-datepicker .ui-datepicker-header .ui-datepicker-prev::before{padding-top:8px; padding-left:10px;}
.ui-datepicker .ui-datepicker-header .ui-datepicker-next::before{padding-top:8px; padding-right:10px;}
.ui-datepicker .ui-datepicker-title{text-align:center;}

.spanAvailability{position:absolute; top:10px; right:-10px}
.error{margin-top:0 !important; margin-bottom:0 !important;}

.form-detail{margin-bottom:10px;}
.form-detail .label-content{border-bottom:1px dashed #ccc; color:#259dab; font-weight:700; padding-bottom:5px; width:100%; display:block; min-height:20px;}

/*    --------------------------------   1. DataTable       --------------------------------*/
.row-selected{background: #F3F2CD !important;}
.clears{display: inline-block; padding-top:10px}
tr.empty-row td {border:1px solid #C1CAD5;padding: 8px; background:#eee;}
.table > tbody > tr > td .form-control{height:29px; padding:6px;}
.table > tbody > tr > td .select2-container--default .select2-selection--single{height:29px;}
.table > tbody > tr > td .select2-container--default .select2-selection--single .select2-selection__rendered{line-height:28px; padding-left:6px;}
.table > tbody > tr > td .select2-container--default .select2-selection--single .select2-selection__arrow b{top:38%;}
.table > tbody > tr > td .select2-container--default .select2-selection--single{text-align:left;}
.table > tbody > tr > td .btn{padding:5px 12px;}
ul.dropdown-menu li label, ol.dropdown-menu li label{margin-left:5px; font-weight:bold;}

.normalTable > tbody > tr > th{color:#fff;}
.normalTable > tbody > tr > th a{display:block; padding:0;}
.normalTable > tbody > tr > th a i{font-size:18px; padding-left:3px;}
.normalTable > tbody > tr > th i.iCreate{display:block; padding:0; color:#fff; box-sizing:border-box; text-align:center; font-size:13px;}

.inputTable > tbody > tr > th, 
.specialTable > tbody > tr > th{padding:11px; color:#fff;}
.inputTable > tbody > tr > th i, 
.specialTable > tbody > tr > th i{font-size:18px; padding-left:2px;}
.inputTable > tbody > tr > th i.iCreate, 
.specialTable > tbody > tr > th i.iCreate{display:block; padding:13px 12px; color:#fff; box-sizing:border-box; text-align:center; font-size:13px;}
.inputTable > tbody > tr > td{padding:11px 5px;}

.normalTable > tbody > tr > th a:after,
.inputTable > tbody > tr > th a:after,
.specialTable > tbody > tr > th a:after
{content:"\e150"; font-family: "Glyphicons Halflings"; opacity:0.2; font-size:12px; font-weight:normal; float:right;}
.normalTable > tbody > tr > th a.nosort:after,
.inputTable > tbody > tr > th a.nosort:after,
.specialTable > tbody > tr > th a.nosort:after
{content:"";margin-left:0;}

table.dataTable thead > tr > th{padding-right:10px !important;}
table.dataTable thead > tr > th > a,
table.dataTable thead > tr > th > i{padding-left:4px;}
table.dataTable thead > tr > th > a i{color:#fff; font-size:18px; padding-left:2px;}

.paging ul li.prev, .paging ul li.next{display:none;}
.paging td{background:#fff; padding-right:0px !important;}
.paging table{border-collapse:collapse; background:none;}
.paging table td{padding-top:10px;}
.paging table td a
{
    background-color: #d8dce3;
    border: 1px solid #fff;
    color: #505b72;
    line-height: 1.42857;
    position: relative;
    text-decoration: none;
    font-weight: 700;
    padding: 9px 14px;
    transition: all 0.2s ease-out 0s;
}
.paging table td a:hover
{
    background-color: #bac1ce;
    border: 1px solid #fff;
    color: #505b72;
}
.paging table td span
{
    background-color: #259dab;
    border: 1px solid #fff;
    color: #fff;
    line-height: 1.42857;
    position: relative;
    text-decoration: none;
    cursor:default;
    font-weight: 700;
    padding: 9px 14px;
    transition: all 0.2s ease-out 0s;
}
.span_TotalRecord {
  position: relative;
}
.span_TotalRecord p {
  display: inline;
  top: -5px;
  position: relative;
}
.span_TotalRecord-ps p {
  display: inline;
  top: -35px;
  position: relative;
}

/*    --------------------------------   2. Images       --------------------------------*/
.fileUpload {position: absolute;overflow: hidden;padding:3px 8px; vertical-align: top; top:74px; right:-4px;}
.fileUpload input.upload {position: absolute;top: 0;right: 0;margin: 0;padding: 0;font-size: 18px;cursor: pointer;opacity: 0;filter: alpha(opacity=0);}
.fileUpload-wrapp{display:inline-block; position:relative; margin-left:4px; border:1px solid #ccc; padding:2px;}
.fileUpload-wrapp .img-wrapp{position:relative; width:180px; height:100px; float:left; clear:both; overflow:hidden;}
.fileUpload-wrapp .img-wrapp .upload_value{background:url('../images/no_image.gif') no-repeat center center #fff; width:100%; height: auto;}
.fileUpload-wrapp .img-remove {position:absolute; top:-6px; right:-6px; background:#fff; border-radius: 50%; width:18px; height:18px; text-align:center;}
.fileUpload-wrapp .img-remove i{font-size:16px; color:#259dab;}


/*box img*/
.imgBox{background:rgba(0,0,0,0.4); width:100%; height:100%; position:fixed; top:0; left:0; overflow-y:scroll; z-index:9999; display:none;}
.imgBox .imgWrap{background:#fff; position:absolute; top:50%; left:50%; max-width:640px; width:90%; height:auto; border:1px solid #ccc; padding:10px; border-radius:5px;}
.imgBox .imgWrap img.imgValue{border:1px solid #ccc; border-bottom:none; width:100%;}
.imgBox .imgWrap .imgCaption{font-size:13px; padding:8px 10px; color:#333; background:#F5F5F5; border:1px solid #eee; border-top:none;}
.imgBox .imgWrap .imgClose{position:absolute; top:-10px; right:-12px; width:30px; cursor:pointer;}
.imgBox .imgWrap .arrowBox{background: rgba(255, 255, 255, 0.5); font-size: 30px; margin-top: -25px; position: absolute; top: 50%; z-index: 9; cursor:pointer; color:#666; display:none;}
.imgBox .imgWrap .arrowBox:hover{background: rgba(255, 255, 255, 0.8); color:#444;}
.imgBox .imgWrap .arrowBox.arrow-right{border-radius: 5px 0 0 5px; padding: 5px 5px 5px 8px; right: 10px;}
.imgBox .imgWrap .arrowBox.arrow-left{border-radius: 0 5px 5px 0; padding: 5px 8px 5px 5px; left: 10px;}