@charset 'UTF-8';

body { background: #74a8c3; background: linear-gradient(135deg, #8363a1 0%, #74a8c3 100%); background: -webkit-linear-gradient(135deg, #8363a1 0%, #74a8c3 100%); background: -moz-linear-gradient(135deg, #8363a1 0%, #74a8c3 100%); }

#wrapper { position: relative; min-height: 100%; }

.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: 'Microsoft JhengHei', Verdana, Arial, sans-serif;; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{ font-weight: 500; line-height: 1.1; color: #317eac; }

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; }

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

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

/* login */
.login-box { opacity: 0; transition: 0.5s; }
.login-box.init { opacity: 1; }
.login-box-body { box-shadow: 2px 2px 3px #ccc; margin-top: -9px; }
.login-box-msg { font-size: 16px; }

/* login owl */
.owl { margin: auto; width: 211px; height: 108px; background-image: url('../img/owl-login.png'); position: relative; }
.owl .hand { width: 34px; height: 34px; border-radius: 40px; background-color: #472d20; transform: scaleY(0.6); position: absolute; left: 14px; bottom: -8px; transition: 0.3s ease-out; }
.owl .hand.password { transform: translateX(42px) translateY(-15px) scale(0.7); }
.owl .hand.hand-r { left: 170px; }
.owl .hand.hand-r.password { transform: translateX(-42px) translateY(-15px) scale(0.7); }
.owl .arms { position: absolute; top: 58px; height: 41px; width: 100%; overflow: hidden; }
.owl .arms .arm { width: 40px; height: 65px; background-image: url('../img/owl-login-arm.png'); position: absolute; left: 20px; top: 40px; transition: 0.3s ease-out; }
.owl .arms .arm.password { transform: translateX(40px) translateY(-40px); }
.owl .arms .arm.arm-r { left: 158px; transform: scaleX(-1); }
.owl .arms .arm.arm-r.password { transform: translateX(-40px) translateY(-40px) scaleX(-1); }

/* content title icon */
.content-header h1 i { color: #aaa; }

/* content button */
.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-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 */ }

/* image upload */
.image-canvas { position: relative; width: 100%; }
.image-canvas .img-del { position: absolute; top: 0; left: 0; padding: 3px 6px; border-radius: 4px; background: rgba(0, 0, 0, 0.4); color: #fff; }
.image-canvas .img-del:hover { background: rgba(255, 0, 0, 0.7); }

/* 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; }

/* 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 thead th,
.dtable-less-padding table.dataTable tbody td { padding: 4px; }

.dataTables_wrapper .dataTables_paginate .paginate_button { padding: 0.2em 1em; } /* 分頁按鈕大小 */
.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%); } /* loading */

.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; }

.search-panel { padding:5px 10px; margin-bottom: 10px; border:1px solid #ddd; border-radius: 4px; box-shadow: 1px 1px 1px #eee; background: rgba(255, 255, 255, 0.2); }
.search-panel select, .search-panel input[type=text] { margin-right: 15px; }

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);
}

/* jquery-confirm */
.jconfirm.jconfirm-material .jconfirm-box { padding: 0; }
.jconfirm.jconfirm-material .jconfirm-box div.jconfirm-title-c,
.jconfirm.jconfirm-material .jconfirm-box .btn { font-family: '微軟正黑體'; }
.jconfirm.jconfirm-material .jconfirm-box div.jconfirm-title-c { background: #e9e9e9; border-radius: 5px 5px 0 0; margin-bottom: 15px; padding: 10px 15px 15px; }
.jconfirm.jconfirm-material .jconfirm-box div.jconfirm-title-c .jconfirm-title,
.jconfirm.jconfirm-material .jconfirm-box div.jconfirm-title-c .jconfirm-icon-c { padding-bottom: 0; }
.jconfirm.jconfirm-material .jconfirm-box .jconfirm-buttons { padding-right: 15px; }
.jconfirm.jconfirm-material .jconfirm-box .jconfirm-buttons button.btn-default:first-child { background: #243a45; color:#fff; }
.jconfirm.jconfirm-material .jconfirm-box .jconfirm-buttons button.btn-default:first-child:hover { background: #600; }
.jconfirm .jconfirm-content { font-size: 15px; padding: 0 15px; }

.jconfirm.jconfirm-supervan .jconfirm-bg{ background-color: rgba(0, 0, 0, 0.67); }

/* Nestable */
.dd { position: relative; display: block; margin: 0; padding: 0; /*max-width: 600px;*/ list-style: none; font-size: 13px; line-height: 20px; }

.dd-list { display: block; position: relative; margin: 0; padding: 0; list-style: none; }
.dd-list .dd-list { padding-left: 30px; }
.dd-collapsed .dd-list { display: none; }

.dd-item,
.dd-empty,
.dd-placeholder { display: block; position: relative; margin: 0; padding: 0; min-height: 20px; font-size: 13px; line-height: 20px; }

.dd-handle { display: block; height: 30px; margin: 5px 0; padding: 5px 10px; color: #333; text-decoration: none; font-weight: bold; border: 1px solid #ccc;
    background: #fafafa;
    background: -webkit-linear-gradient(top, #fafafa 0%, #eee 100%);
    background:    -moz-linear-gradient(top, #fafafa 0%, #eee 100%);
    background:         linear-gradient(top, #fafafa 0%, #eee 100%);
    -webkit-border-radius: 3px;
            border-radius: 3px;
    box-sizing: border-box; -moz-box-sizing: border-box;
}
.dd-handle:hover { color: #2ea8e5; background: #fff; }

.dd-item > button { display: block; position: relative; cursor: pointer; float: left; width: 25px; height: 20px; margin: 5px 0; padding: 0; text-indent: 100%; white-space: nowrap; overflow: hidden; border: 0; background: transparent; font-size: 12px; line-height: 1; text-align: center; font-weight: bold; }
.dd-item > button:before { content: '+'; display: block; position: absolute; width: 100%; text-align: center; text-indent: 0; }
.dd-item > button[data-action="collapse"]:before { content: '-'; }

.dd-placeholder,
.dd-empty { margin: 5px 0; padding: 0; min-height: 30px; background: #f2fbff; border: 1px dashed #b6bcbf; box-sizing: border-box; -moz-box-sizing: border-box; }
.dd-empty { border: 1px dashed #bbb; min-height: 100px; background-color: #e5e5e5;
    background-image: -webkit-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff),
                      -webkit-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff);
    background-image:    -moz-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff),
                         -moz-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff);
    background-image:         linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff),
                              linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff);
    background-size: 60px 60px;
    background-position: 0 0, 30px 30px;
}

.dd-dragel { position: absolute; pointer-events: none; z-index: 9999; }
.dd-dragel > .dd-item .dd-handle { margin-top: 0; }
.dd-dragel .dd-handle {
    -webkit-box-shadow: 2px 4px 6px 0 rgba(0,0,0,.1);
            box-shadow: 2px 4px 6px 0 rgba(0,0,0,.1);
}

/* Nestable Draggable Handles */
.dd3-content { display: block; height: 30px; margin: 5px 0; padding: 5px 10px 5px 40px; color: #333; text-decoration: none; font-weight: bold; border: 1px solid #ccc;
    background: #fafafa;
    background: -webkit-linear-gradient(top, #fafafa 0%, #eee 100%);
    background:    -moz-linear-gradient(top, #fafafa 0%, #eee 100%);
    background:         linear-gradient(top, #fafafa 0%, #eee 100%);
    -webkit-border-radius: 3px;
            border-radius: 3px;
    box-sizing: border-box; -moz-box-sizing: border-box;
}
.dd3-content:hover { color: #2ea8e5; background: #fff; }

.dd-dragel > .dd3-item > .dd3-content { margin: 0; }

.dd3-item > button { margin-left: 30px; }

.dd3-handle { position: absolute; margin: 0; left: 0; top: 0; cursor: move; width: 30px; text-indent: 100%; white-space: nowrap; overflow: hidden;
    border: 1px solid #aaa;
    background: #ddd;
    background: -webkit-linear-gradient(top, #ddd 0%, #bbb 100%);
    background:    -moz-linear-gradient(top, #ddd 0%, #bbb 100%);
    background:         linear-gradient(top, #ddd 0%, #bbb 100%);
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.dd3-handle:before { content: '≡'; display: block; position: absolute; left: 0; top: 3px; width: 100%; text-align: center; text-indent: 0; color: #fff; font-size: 20px; font-weight: normal; }
.dd3-handle:hover { background: #ddd; }

.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; }

/* 移除input number 自帶箭頭 */
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type='number']{ -moz-appearance:textfield; }

/* 單行文字超過寬度時，隱藏超過的文字並加上'...' */
.text-autohide { white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; }

/* datatable list base64 image */
.base64-image img { max-width: 100px; max-height: 100px; }

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