@charset "utf-8";
body {
    /*background: #d2d6de;*/ background: #ecf0f5;
    background: -webkit-linear-gradient(to left, #ecf0f5, #CFDEF3);
    background: linear-gradient(to left, #ecf0f5, #CFDEF3);
}
.main-header .logo,
.content-header h1,.content-header h2,.content-header h3,.content-header h4,.content-header h5,.content-header h6,
body, h1,h2,h3,h4,h5,h6 { font-family: "微軟正黑體";  }
input[type=text], textarea, select, .btn { font-family: "Verdana"; font-size: 13px; }
.btn-sm, .btn-xs { font-family: "Verdana"; font-size: 12px; }

.table input[type=text],
.table input[type=password],
.table textarea,
.table select { width:100%; max-width:100%; }

.text-xs { font-size: 11px !important; }
.text-sm { font-size: 12px !important; }
.text-md { font-size: 13px !important; }
.text-lg { font-size: 15px !important; }

.content-header h1 span i { color: #aaa; }

.main-footer { font-size: 11px; font-family: "Verdana"; padding:5px 15px; }

/* web ui style */

.skin-blue .main-header .navbar {
background: #2C3E50;
background: -webkit-linear-gradient(to left, #2C3E50 , #4CA1AF);
background: linear-gradient(to left, #2C3E50 , #4CA1AF);
}
.skin-blue .main-header .logo {
background: #396576;
}
/*.skin-blue .wrapper, .skin-blue .main-sidebar, .skin-blue .left-side {
background: #232526;
background: -webkit-linear-gradient(to left, #232526 , #414345);
background: linear-gradient(to left, #232526 , #414345);
}*/

/* common style */
.linear-grad-a, .btn.btn-dblue, .btn.btn-submit {
    color: #fff;
    background: #333; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#333, #000); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#333, #000); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#333, #000); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#333 50%, #111 100%); /* Standard syntax */
    text-shadow: 1px 1px 2px #000;
}
.btn.btn-dblue:hover, .btn.btn-submit:hover {
    background: #900; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#900, #600); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#900, #600); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#900, #600); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#900, #600); /* Standard syntax */
}
.form-style input, .form-style select, .form-style textarea,
input.form-control, select.form-control, textarea.form-control { font-size: 13px; }

.form-style .permission-table input[type=checkbox] { margin-right:5px;}
.form-style .permission-table label { padding:6px 6px 5px 5px;  color: #666; font-weight: normal; letter-spacing: 1px;}
.form-style .permission-table label.checked { color: #369; }
.form-style .permission-table label:hover { color:#900; }
.form-style .permission-table label.disabled,
.form-style .permission-table label.disabled:hover { color: #ccc; }
.form-style .permission-table th label { margin:0; padding:0; }
#ptb tbody tr td:first-child { line-height: 40px; }

.form-control { border-color: #ccc; color:#333; }
.form-control:hover { border-color: #3c8dbc; }

.form-group > label { font-size: 15px; color:#333; }

.border-style-a { border: 1px solid #ccc; border-radius: 4px; }

.word-autohide { white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow: hidden; }

.label-black { background-color: #333; color: #fff; }
.label-gray { background-color: #666; color: #fff; }

.modal-form .form-group {
  padding: 8px 0 6px;
  border-bottom: 1px dotted #f0f0f0;
  margin-bottom: 5px;
}

/* login */
.login-box { opacity: 0; transition: 0.5s}
.login-box.init { opacity: 1;}
.login-box-body { box-shadow: 2px 2px 3px #ccc; }

.login-box-msg { font-size: 16px; }

/* colorbox */
#colorbox { border:1px solid #243a45; box-shadow: 3px 3px 5px #333; border-radius: 4px; background: #243a45; }
#cboxLoadedContent, #cboxLoadingOverlay { background: #fff; }
#cboxTitle { font-size: 18px; color: #fff; text-shadow: 1px 1px 2px #000; top:-28px; left:15px; font-family: '微軟正黑體';}
#cboxClose { top:-28px; right:10px;}

/* jqxWidget */
#jqxWidget { box-shadow: 2px 2px 3px #999; }
    #jqxToolBar { margin-bottom: 5px; }
    .jqx-item .btn { margin:0 5px; }

    /* jqxgrid sorting style */
    .jqx-grid-cell-sort:not(.jqx-grid-cell-hover):not(.jqx-grid-cell-selected){ background: #e8ffe8 !important; }
    .jqx-grid-cell-filter:not(.jqx-grid-cell-hover):not(.jqx-grid-cell-selected){ background: #def3ff !important; }
    .jqx-grid-cell-sort.jqx-grid-cell-filter:not(.jqx-grid-cell-hover):not(.jqx-grid-cell-selected){ background: #c7eced !important; }
    /*div[role=row] { min-height:32px !important; }*/

    div.custom-filter-row { position: relative; width: 100%; padding:2px 5px; margin:-2px 0 0 0; height: 35px; border-left:1px solid #999;}
    [role=columnheader]:first-child div.custom-filter-row { border-left:none; }
    input.custom-filter-input { width: 100%; padding:2px; height: auto;  }


    /* jqxWindow */
    .subWin { box-shadow: 1px 1px 2px #999; }
    /*.subWin .jqx-window-header { line-height: 20px; }*/


/* chosen */
.chosen-container-multi .chosen-choices { border-color : #bbb; padding:3px 5px; border-radius: 4px; }

/* jquery confirm */
.jconfirm .jconfirm-box div.title,
.jconfirm .jconfirm-box .btn { font-family: "微軟正黑體"; }
.jconfirm.white .jconfirm-box div.title { background: #e9e9e9; border-radius: 5px 5px 0 0;}
.jconfirm.white .jconfirm-box .buttons button.btn-default:first-child { background: #243a45; color:#fff;}
.jconfirm.white .jconfirm-box .buttons button.btn-default:first-child:hover { background: #600; }

.jconfirm .content {
    font-size: 15px;
    min-height: 0;/* 被 AdminLTE 樣式影響 */
}

/* 統一各 plug-in modal background 樣式 ( colorbox option 須把背景 opacity 改成 1 ) */
.jconfirm .jconfirm-bg,
#cboxOverlay
 { background-color: rgba(0,0,0,0.5) !important; }

/* checkbox , radio with iCheck, bootstrap custom style
 * color:'black','red','green','blue','aero','grey','orange','yellow','pink','purple'
 */
.checkbox input[type=checkbox]
.checkbox-inline input[type=checkbox],
.radio input[type=radio],
.radio-inline input[type=radio] { margin-left: 0; }
.checkbox label, .radio label { padding-left: 0;  margin-right:0 5px;}

.iradio_square, .icheckbox_square,
.icheckbox_square-black, .iradio_square-black,
.icheckbox_square-red, .iradio_square-red,
.icheckbox_square-green, .iradio_square-green,
.icheckbox_square-blue, .iradio_square-blue,
.icheckbox_square-aero, .iradio_square-aero,
.icheckbox_square-grey, .iradio_square-grey,
.icheckbox_square-orange, .iradio_square-orange,
.icheckbox_square-yellow, .iradio_square-yellow,
.icheckbox_square-pink, .iradio_square-pink,
.icheckbox_square-purple, .iradio_square-purple { margin:0 5px; }

/* jqGrid with bootstrap style rewrite */
.ui-jqgrid { border:1px solid #bbb; border-radius: 4px; box-shadow: 1px 1px 2px #ddd; font-size: 13px; font-family: Verdana}
.ui-jqgrid .ui-jqgrid-htable { background: #3c8dbc; font-family: '微軟正黑體' }
.ui-jqgrid .ui-jqgrid-htable>thead>tr>th { padding:5px 8px 7px; text-align: center; font-size: 14px; line-height: 18px; color: #fff; text-shadow: 1px 1px 1px rgba(0,0,0,0.2); font-weight: normal; }
.ui-jqgrid .table-bordered>tbody>tr>td,
.ui-jqgrid .ui-jqgrid-htable>thead>tr>th { border-color:rgba(0,0,0,0.1); }
.ui-jqgrid .ui-jqgrid-htable .ui-th-div { margin-top: 0; }
.ui-jqgrid .ui-jqgrid-htable>thead>tr>th[aria-selected=true],
.ui-jqgrid .ui-jqgrid-htable>thead>tr>th.active { background-color: #357ca5; }
.ui-jqgrid .btn-act { margin:1px; text-shadow: 1px 1px 2px rgba(0,0,0,0.1); padding-top: 2px;  padding-bottom: 2px; }
.ui-jqgrid .btn { font-size: 13px; text-shadow: 1px 1px 1px rgba(0,0,0,0.1);}
.ui-jqgrid .btn i { font-size: 14px; }
.ui-jqgrid .table>tbody>tr>td { line-height: 26px; }
.ui-jqgrid .fa.fa-info-circle { font-size: 16px;  }
.ui-jqgrid .btn-act.btn-default { background: #39c; color:#fff; }
.ui-jqgrid .table-bordered>tbody>tr>td.overflow-visible { overflow: visible; }

.ui-jqgrid .ui-jqgrid-btable tbody tr.jqgrow td { padding: 5px; }

/* 資料長但沒有捲軸時，jqgrid會預留 scroll bar 的padding 位置，暫時用這方法隱藏，之後再找解決方法 */
.ui-jqgrid .ui-jqgrid-hbox { padding-right: 0; }


/***************** jw table *******************/
/* datatable style */
.dtable-wrap { position: relative;  width:100%; }
.dtable-wrap table.dataTable { width:100%; }
table.dataTable th { border:solid #ccc; border-width: 1px 1px 1px 0px; }
table.dataTable thead th { color:#333 !important; text-decoration: none !important; }
table.dataTable th:first-child { border-left-width: 1px; }
table.dataTable tfoot th { padding-right: 10px; padding-left: 10px; }
table.dataTable td { font-family: 'Verdana'; font-size: 13px; }
table.dataTable tfoot th.text-right,
table.dataTable td.text-right { text-align: right; }
table.dataTable tfoot th.text-left,
table.dataTable td.text-left { text-align: left; }
table.dataTable .sorting_asc,
table.dataTable .sorting_desc { background:rgba(50,150,250,0.1); }
table.dataTable button { margin: 2px; font-family: 'Verdana'; text-shadow: 1px 1px 2px rgba(0,0,0,0.2); padding-top: 3px; padding-bottom: 2px; }
table.dataTable button i { font-size: 1.2em; min-width: 15px;}

table.dataTable.dtr-inline.collapsed>tbody>tr>td.child { padding: 5px; }
table.dataTable .child ul { width:98%; }
table.dataTable .child ul li span { float:left;}
table.dataTable .child ul li span:first-child { text-align: left; }

table.dataTable .child ul li:before,
table.dataTable .child ul li:after { content: " "; display: table;}
table.dataTable .child ul li:after { clear: both; }
table.dataTable .child ul li { *zoom: 1;}

table.dataTable.display thead>tr { background-color:aliceblue;}

table.dataTable.display tbody>tr.odd.selected,
table.dataTable.display tbody>tr.even.selected,
table.dataTable.display tbody>tr.odd.selected>.sorting_1,
table.dataTable.display tbody>tr.even.selected>.sorting_1 { /*background: #E0EAFC;*/ background-color:#e1f5df; }

table.dataTable.display tbody>tr.odd:hover,
table.dataTable.display tbody>tr.even:hover,
table.dataTable.display tbody tr:hover>.sorting_1 ,
table.dataTable.display tbody>tr.odd.selected:hover>.sorting_1,
table.dataTable.display tbody>tr.even.selected:hover>.sorting_1 { /*background: #E0EAFC;*/ background-color:#e1f3f2;  }
table.dataTable tbody td.dataTables_empty { padding-top: 50px; padding-bottom: 50px; }

table.dataTable .cell-click { text-decoration: underline; cursor: pointer; }
table.dataTable .cell-click:hover { background-color: rgba(30,120,250,0.1); }

.dtable-less-padding table.dataTable tbody th,
.dtable-less-padding table.dataTable tbody td { padding: 4px; }

.countdown-wrap { position: absolute; top: -45px; right: 0 }
.dataTables_length select{ padding:3px; }
.dataTables_length label { line-height: 30px; }
.search-panel .input-group, .search-panel .btn { margin-top: 3px; }
.input-group .btn { margin-top: 0; }

.dataTables_wrapper .dataTables_processing {
    top: 0; height: 100%; padding-top: 20%; margin-top: 0; font-size: 24px; color: #666;
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.1) 25%, rgba(255,255,255,0.1) 75%, rgba(255,255,255,0) 100%);
}
div.dt-button-collection { width: 300px; }
div.dt-button-collection button.dt-button, div.dt-button-collection div.dt-button, div.dt-button-collection a.dt-button {
    display:inline-block; margin-left: 1%; margin-right: 1%; width: 48%;
}
div.dt-button-collection button.dt-button:active:not(.disabled),
div.dt-button-collection button.dt-button.active:not(.disabled),
div.dt-button-collection div.dt-button:active:not(.disabled),
div.dt-button-collection div.dt-button.active:not(.disabled),
div.dt-button-collection a.dt-button:active:not(.disabled),
div.dt-button-collection a.dt-button.active:not(.disabled) {
    background: rgba(33, 150, 243, 0.28);
    box-shadow: inset 1px 1px 2px rgba(0,0,0,.2);
}

div.dt-button-collection button.dt-button:hover:not(.disabled),
div.dt-button-collection button.dt-button.active:hover:not(.disabled),
div.dt-button-collection div.dt-button:hover:not(.disabled),
div.dt-button-collection div.dt-button.active:hover:not(.disabled),
div.dt-button-collection a.dt-button:hover:not(.disabled),
div.dt-button-collection a.dt-button.active:hover:not(.disabled) {
    background: rgba(63, 142, 181, 0.8);
    color: #fff;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.4);
}

div.dt-button-collection button.dt-button,
div.dt-button-collection div.dt-button,
div.dt-button-collectiona.dt-button {

}


/* z-index reset */
.jconfirm {  z-index: 99999999; }
.autocomplete-suggestions { z-index: 999999999; }

.dtb-link { cursor: pointer; text-decoration: underline; color: #0099ff; }
.dtb-link i { position:absolute; top:0; right:0; width: 0; height: 0; border-bottom: 6px solid transparent; border-left: 6px solid transparent; border-top: 6px solid #0099ff;}

.row.row-less { margin-left: -3px; margin-right: -3px }
.row-less.col-xs-1, .row-less .col-sm-1, .row-less .col-md-1, .row-less .col-lg-1,
.row-less .col-xs-2, .row-less .col-sm-2, .row-less .col-md-2, .row-less .col-lg-2,
.row-less .col-xs-3, .row-less .col-sm-3, .row-less .col-md-3, .row-less .col-lg-3,
.row-less .col-xs-4, .row-less .col-sm-4, .row-less .col-md-4, .row-less .col-lg-4,
.row-less .col-xs-5, .row-less .col-sm-5, .row-less .col-md-5, .row-less .col-lg-5,
.row-less .col-xs-6, .row-less .col-sm-6, .row-less .col-md-6, .row-less .col-lg-6,
.row-less .col-xs-7, .row-less .col-sm-7, .row-less .col-md-7, .row-less .col-lg-7,
.row-less .col-xs-8, .row-less .col-sm-8, .row-less .col-md-8, .row-less .col-lg-8,
.row-less .col-xs-9, .row-less .col-sm-9, .row-less .col-md-9, .row-less .col-lg-9,
.row-less .col-xs-10, .row-less .col-sm-10, .row-less .col-md-10, .row-less .col-lg-10,
.row-less .col-xs-11, .row-less .col-sm-11, .row-less .col-md-11, .row-less .col-lg-11,
.row-less .col-xs-12, .row-less .col-sm-12, .row-less .col-md-12, .row-less .col-lg-12 { padding: 3px; }

.row .col-margin { margin-top: 5px; }

.animate-add-notice {
    animation-name: addnotice;
    animation-duration: 2s;
}
@keyframes addnotice {
    0%   {background-color: #C02425; opacity: 0.7}
    25%  {background-color: #F0CB35; opacity: 0.7}
    50%  {background-color: #C02425; opacity: 0.7}
    100% {background-color: #F0CB35; opacity: 0.7}
}

/* Multipal select */
.ms-wrap { width: 200px; overflow: visible; }
.ms-options-wrap > button:focus, .ms-options-wrap > button { margin-top: 0;}
.ms-wrap .ms-options-wrap > .ms-options { min-width: 400px;  }
.ms-options-wrap > .ms-options > ul > li.optgroup { padding: 0; margin-bottom: 5px; }
.ms-options-wrap > .ms-options > ul > li.optgroup .label { color: #369; font-size: 15px; background: rgba(0,147,255,.1); line-height: 25px; margin:0; width: 100%; border-radius:0; }
.ms-options-wrap > .ms-options > ul > li.optgroup > a { margin-left: 5px; }
.ms-options-wrap > .ms-options > ul > li.optgroup + li.optgroup { border-top: 1px solid rgba(0,147,255,.2);}
.ms-options-wrap > button, .ms-options-wrap > button:focus { border-color:#ccc; color: #000; font-family: 'Verdana' }
.ms-options-wrap > button:focus, .ms-options-wrap > .ms-options { border-color:#3c8dbc; }
.ms-options-wrap > .ms-options > ul li.selected label { background-color: #cbe3e8; }
.ms-options-wrap > .ms-options > ul li label:hover { border-color: #dd4b39; background-color:#fbdad5; }
.ms-options-wrap > .ms-options .optgroup > span.label { }


/* daterangepicke */
.daterangepicker.dropdown-menu { border: 1px solid #999; background: #eee; box-shadow: 3px 3px 3px rgba(0,0,0,0.2); }
.daterangepicker .calendar-table { box-shadow: 1px 1px 1px rgba(0,0,0,0.2); border-color: rgba(0,0,0,0.2);  }
.daterangepicker td.in-range { background-color: rgba(253, 160, 13, 0.5); }
.daterangepicker td.start-date.active, .daterangepicker td.start-date.active:hover { background-color: #f39c12; }
.daterangepicker td.end-date.active, .daterangepicker td.end-date.active:hover { background-color: #dd4b39; }
.daterangepicker td.available:hover { background-color: #39a8dd; color: #fff; }
.daterangepicker td.off, .daterangepicker td.off.in-range, .daterangepicker td.off.start-date, .daterangepicker td.off.end-date { background-color: #fff; }

/* jqc-select */
.jqcSelect { max-width: 1024px; margin: 0 auto; height: 730px; overflow: hidden; }
.jqcSelect input[type="checkbox"] { margin: 0 5px 0 0; vertical-align: middle; }
.jqcSelect-top { width: 100%; margin: 5px auto 5px; padding: 5px 10px; border: 1px solid #ccc; }
.jqcSelect-top .all-selected { margin-bottom: 10px; }
.jqcSelect-mid, .jqcSelect-sub { width: 100%; margin: 0 auto; padding: 15px 10px; border: 1px solid #ccc; background-color: #d9edf7; }
.jqcSelect-mid { height: auto; overflow-x: hidden; overflow-y: auto; }
.jqcSelect-mid .label, .jqcSelect-sub .label { color: #369; font-size: 14px; padding: 0; }
.jqcSelect-mid ul li { padding: 0 5px; width: 110px; margin: 0 0 10px 0; }
.jqcSelect-sub { height: 550px; overflow: auto; background-color: #fcf8e3; }
.jqcSelect-sub .title { font-size: 18px; font-weight: bold; margin: 0 0 10px 10px; padding-bottom: 10px; border-bottom: 1px solid #ccc; }
.jqcSelect-sub .content .label { width: 305px; display: inline-block; padding: 0 10px; margin: 0 0 10px 0; text-align: left; }
.area-block { width: 100%; margin: 0 auto 15px; }

.notifications-menu .dropdown-menu { box-shadow: 2px 2px 2px rgba(0,0,0,.4); }

/* 單行文字超過寬度時，隱藏超過的文字並加上"..." */
.text-autohide {
    white-space:nowrap;
    text-overflow:ellipsis;
    -o-text-overflow:ellipsis;
    overflow: hidden;
}
.demo-ip { z-index: 0 !important; }
.sort-handler { cursor: move; }

.go-top-btn { position: fixed; bottom: 30px; right: 5px; background: #900; color:#fff; display: block; opacity: 0; }

/* bootstrap popover custom style */
.popover {
    background-color: #fff;
    border: 1px solid #999;/*rgba(0,0,0,.2);*/
    -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.3);
    box-shadow: 0 5px 10px rgba(0,0,0,.3);
}
.popover-title {
    color:#fff;
    background-color: #666;
    border:none;
    /*border-bottom-color: #ebebeb;*/
}
.popover.bottom>.arrow,
.popover.top>.arrow,
.popover.left>.arrow,
.popover.right>.arrow  {
    border-bottom-color: #999;
}
.popover-for-label .label { display: inline-block; margin-right: 5px; } /* for label only style */

.label { font-size: 12px; }