.ref.blank:hover, .href.blank:hover { text-decoration: underline; }
.boxitem a
{
    color:#222222;
    text-decoration:none; 
}
.boxitem a:hover, .boxitem a:focus {
  text-decoration: none;
}
.boxitem
{
    font-size: 16px;
    margin: 0 4px 4px 0;
    padding: 2px;
    /*border: solid 1px rgba(0,96,0,0.02);*/
    background-color: ghostwhite;/*snow;*/
    box-shadow: 2px 2px 6px 0px rgba(0,0,0,0.2);
    /*border: solid 1px rgba(0,0,0,0.01);
    background-color: rgba(0,0,0,0.02);
    box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.22);
    border-radius: 4px;*/
    vertical-align: text-top;
}
.tabpages {
    /*border-bottom: solid 1px rgba(0,0,0,0.02);
    border-left: solid 2px rgba(0,0,0,0.02);*/
    padding: 4px 0 1px 1px; /*margin:0 0px 4px -1px;*/
    background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.0) 0%,rgba(0,0,0,0.0) 20%,rgba(0,0,0,0.08) 100%);
    background-image: -ms-linear-gradient(top, rgba(0,0,0,0.0) 0%,rgba(0,0,0,0.0) 20%,rgba(0,0,0,0.08) 100%);
}
.tabpages .boxitem { border-radius: 4px 15px 0 0; margin:0 0 0 1px; 
    padding: 4px 12px 2px 8px;
    box-shadow: 1px 1px 0px -1px rgba(0,0,0,0.2);
    /*background-color:rgba(226,226,226, 0.8); border: solid 1px rgba(0,0,0,0.032);*/border-color: rgba(0,0,0,0.068);
    border-bottom: solid 2px rgba(0,0,0,0.68); background-color: rgba(0,0,0,0.006);
}
.tabpages .boxitem:hover { border-bottom: solid 2px coral; }
.tabpages .boxitem.selected, .tabpages .boxitem.select
{background-color:cornsilk;/*White*/ border-bottom: solid 2px coral; 
    background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0.0) 50%,rgba(0,0,0,0.0) 100%);
    background-image: -ms-linear-gradient(top, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0.0) 50%,rgba(0,0,0,0.0) 100%);
}
.tabpages .boxitem a { color:#4d4e53; }
.boxitem table {
    width: 100%;min-width:50px;
}
.boxitem .img
{
    vertical-align:bottom;
}
.boxgroup
{
    border-bottom:dotted 2px cadetblue;margin-bottom:2px;margin-top:4px;
}
.boxgroupfooter { font-size:small; color: dimgray; }
.boxgroup .text
{
    padding: 0 20px 0 12px;
    border-radius: 16px 40px 12px 0px;
    background-color: cadetblue;
    background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.0) 50%,rgba(0,0,0,0.1) 100%);
    background-image: -ms-linear-gradient(top, rgba(0,0,0,0.0) 50%,rgba(0,0,0,0.1) 100%);
    color: white;text-shadow:1px 1px #666; font-size:1.08em;
}
/*.float*/ .boxitem 
{
    padding: 4px 8px;
    display: inline-block;
}
#sidebar .boxitem .ob { margin:2px 0; }
#sidebar .boxitem .lb { width: 44px; }
#sidebar .boxitem .lb .img { }
#sidebar .boxitem { display: block; }/*because of removing float*/
#sidebar .capsule .sidebar-box {
    margin-left: 5px;
    padding: 2px 12px 2px 0px;
}

#sidebar .capsule.mini .sidebar-box-img {
    top: 18px;
    left: 10px;
}

#sidebar .capsule .sidebar-box-img {
    top: 20px;
    left: 4px;
}

#sidebar .capsule .sidebar-box a {
    padding: 4px 15px 4px 40px;
    margin-left: 5px;
    border-radius: 1.2em;
    width: 100%;
    display: block;
    box-shadow: 4px -2px 12px -4px inset;
    color: darkslategray;
}

#sidebar .capsule .sidebar-box-title > .sidebar-box-tip {
    padding-left: 30px;
}
#sidebar .capsule a:hover {
    color: brown!important;
}
#sidebar .capsule .imenu .caption a {
    box-shadow: inset 8px 0 #a77372;
    padding-left: 15px;
    margin-left: 8px;
}
/*.tbox, .fbox, */
/*.attachfiles { --2017/7/26
    padding: 0 4px;
}*/
/*.float*/.tbox { margin:0; }
.tipbox a {color:gray;font-size:small;}
.boxitem .img
{
    width: 36px;
    float: left;
}
.block, .block.box {
    background-color: cornflowerblue;
    margin: 4px;
    padding: 4px 8px;
    color: white;
}
.floatbox , .numberbox
{
     display: inline-block; text-align: center; margin:0 1px 1px 0;
}
.rightbar .floatbox { background-color: seagreen; }
/*.numberbox { background-color: #00BCD4; }*/
.block { display:inline-block; min-width:150px; border-radius: 2px; overflow: hidden;vertical-align:top; cursor:default; }
.block a { color:White; text-decoration:none; }
.dark .block .b1 a, .dark .block .b2 a, .dark .block .b3 a { color: black; }
.dark .block .b1 a:hover, .dark .block .b2 a:hover, .dark .block .b3 a:hover { color: #333; }
.block .b1 a:hover,.block .b2 a:hover,.block .b3 a:hover {
    color: inherit;
}
.block .b1 
{
    border-bottom: solid 1px rgba(0,0,0,0.12);
    margin-bottom: 4px;
    line-height: 26px;
    /*border-bottom: none!important;
    background-color:rgba(0,0,0,0.02)!important;*/
}
    .block .b1 a { /*font-size: 1.2em;*/
        white-space: nowrap;
    }
.block .b2 { text-align:center; }
.block .b2 a { font-size: 1.8em; line-height:1.48em; font-weight: 700; }
.block .b2 a:hover { /*color: rgba(255,255,105,0.8);*/ }
.block .b3 { text-align:right; }
.block .b3 a { font-size:small; color:rgba(255,255,255,0.8); }
.block.box { text-align:center; }
.numberbox .b1 {
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    border-bottom: solid 1px rgba(0,0,0,0.06);
    margin-bottom: 4px;
    line-height: 26px;
    margin: -4px -8px;
    padding: 2px 8px;
    background-color: rgba(0,0,0,0.036);
}
.numberbox .b2 a {
    font-size: 2.2em;font-weight: 700;
}
.numberbox .b2 {
    margin-top: 4px;
    margin-bottom: -4px;
    padding: 5px 10px;
}
.htc1:hover
{
    color:Orange; cursor:pointer;
}
.htc2box
{
    text-decoration: none;
    color: blue;
    font-size: 24px;
    border-radius: 16px;
    padding: 6px 12px;
    background-image: -webkit-linear-gradient(top,lightcyan 0%,paleturquoise 100%);
    background-image: -ms-linear-gradient(top,lightcyan 0%,paleturquoise 100%);
}
.htc2box:hover
{
    background-color: pink;
}
.htbc1:hover
{
    color: rgba(0,0,0,0.2);cursor:pointer;
}
.hbox { margin:0 1px 1px 0; }
.hbox,
.hbox .b2, .hbox .b3 {
    display: inline-block;
}
.hbox .b2 { line-height:30px; }
.hbox .b1 a {  }
.hbox .b3 { margin-left:6px; }

.ubitemnavbox
{
     font-size:small;text-decort;line-height:20px;background-color: whitesmoke;padding: 1px 12px;margin-right: 8px;border-radius: 12px;
     display: inline-block; border:solid 1px rgba(0,0,0,0.08);
}
.ubitemnavbox a {
    padding: 0 5px;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    color: #777777;
}
.ubitemnavbox a:hover {
  background-color: rgba(0,0,0,0.02);
}
.rightbox .bx1, .rightbox .navbox.bx1, .leftbarbody .bx1, .dangerbox
{
    background-color:rgb(255,102,0) !important;
}
.rightbox .bx2, .rightbox .navbox.bx2, .leftbarbody .bx2, .infobox
{
    background-color:rgb(252,210,2) !important;
}
.rightbox .bx3, .rightbox .navbox.bx3, .leftbarbody .bx3, .successbox
{
    background-color:rgb(176,222,9) !important;
}
.rightbox .bx4, .rightbox .navbox.bx4, .leftbarbody .bx4, .activebox
{
    background-color:rgb(13,142,207) !important;
}
.rightbox .bx5, .rightbox .navbox.bx5, .leftbarbody .bx5
{
    background-color:rgb(219,112,147) !important;
}
.rightbox .bx6, .rightbox .navbox.bx6, .leftbarbody .bx6
{
    background-color:rgb(255,15,0) !important;
}
.rightbox .bx7, .rightbox .navbox.bx7, .leftbarbody .bx7, .warningbox
{
    background-color:rgb(255,158,1) !important;
}
.rightbox .bx8, .rightbox .navbox.bx8, .leftbarbody .bx8
{
    background-color:rgb(4,210,21) !important;
}
.rightbox .bx9, .rightbox .navbox.bx9, .leftbarbody .bx9
{
    background-color:rgb(13,82,209) !important;
}
.rightbox .navbox.bx0, .rightbox .navbox.bx0, .leftbarbody .bx0
{
    background-color:rgb(138,12,207) !important;
}
#sidebar .bx0, #sidebar .bx1, #sidebar .bx2, #sidebar .bx3, #sidebar .bx4, 
#sidebar .bx5, #sidebar .bx6, #sidebar .bx7, #sidebar .bx8, #sidebar .bx9
{
  background-image: -webkit-linear-gradient(top, rgba(0,80,250,0.16) 0%,rgba(0,80,250,0.25) 100%) !important;
}
.bx0 .ref:hover,.bx1 .ref:hover,.bx2 .ref:hover,.bx3 .ref:hover,.bx4 .ref:hover,
.bx5 .ref:hover,.bx6 .ref:hover,.bx7 .ref:hover,.bx8 .ref:hover,.bx9 .ref:hover
{ text-shadow:1px 1px rgba(0,0,0,0.5) !important; }

.imenu .caption { font-size:16px; 
  background-color: salmon; font-weight: 700;
  color: wheat; cursor:pointer; margin-bottom:1px; padding:4px 8px; }
.imenu .tip { border-bottom:solid 1px rgba(0,0,0,0.2); }
.imenu .items {
  /*border: 1px solid rgba(255,255,255,0.2);*/
}
.pagemenubar .imenu { float:left; position:relative;  text-align: left;  white-space: nowrap; z-index:9999;}
.pagemenubar .imenu .caption { font-weight: normal; background-color: transparent; padding:0; margin-bottom:0; }
.pagemenubar .imenu .items { position:absolute; background-color:gray; padding:8px; border-radius:4px;}
.pagemenubar .imenu .navbox { display:inline; }

.imenu.popup { display:inline-block; }
.imenu.popup .items {
  position: absolute;
  background-color: wheat;
  padding: 4px 0 0 4px;
  margin-top:-4px;
 }
 .imenu.popup .caption {
  background-color: transparent;
  background-image: inherit;
  text-shadow: inherit;
}
.btngroupbox {
  display: inline-block;
}
.btngroupbox .imenu {
  float: left;
  margin: 2px 1px;
}
table.card td, .block table td, .ui-grid .td td{
  white-space: normal;
}
.ui-grid table.card caption {
    padding-top: 0px;
    padding-bottom: 0;
}
.ui-grid table.card .group { line-height:1.25em; }
/*.tbox > table td {
  padding: 0 2px;
}
.parmedit
{
    border: dashed 1px brown;
    padding: 1px 15px;
    display: inline-block;
    border-radius: 20px;
    background-color: blanchedalmond;
}*/
.parmedit {
    border: 1px solid #ddd;
    border-radius: 3px;
    padding: 3px 6px 3px 3px;
    display: inline-block;
    background-color: #f0f0f0;;
    margin: 3px 6px;
	font-size: 16px;
}
.parmedit > label {
	font-weight: bold;
	padding: 0 3px;
}
.parmedit > input {
	border-radius: 3px;
	padding: 0 3px;
}
.objeditorhref {
    padding-left: 20px;
    background-image: url('/pic/setting.png');
    background-repeat: no-repeat;
    font-size: small;
    margin: 4px 0;
}
/*image layout*/
.image-group {
    margin: 0;
    padding: 0;
    position: relative;
    z-index: 1;
}
.image-group > .image-group-header {
    background-color: rgba(0,0,0,0.36);
    color: rgba(255,255,255,0.9);
    text-align: center;
    font-size: 18px;
    line-height:36px;
    font-weight: bold;
    margin: 0 15px;
    box-shadow: 1px -1px 6px rgba(0,0,0,0.12)
}
.image-group > .image-group-body {
    border-collapse: collapse;
    clear: both;
    width: calc(100% - 15px);
    overflow: hidden;
    margin: 0 0 0 15px;
    padding-top: 15px;
}
.image-group > .image-group-body > .image-group-cell {
    border: 1px solid #ccc;
    float: left;
    padding: 10px;
    margin: 0 15px 15px 0; 
    text-align: center;
    border-radius: 2px;
}
.image-group > .image-group-body > .image-group-cell:hover {
    background-color: #eee;
    border: 1px solid #bbb;
}
.image-group[data-row="1"] .image-group-cell {
    width: calc(100% - 15px);
}
.image-group[data-row="2"] .image-group-cell {
    width: calc(50% - 15px);
}
.image-group[data-row="3"] .image-group-cell {
    width: calc(33.33333% - 15px);
}
.image-group[data-row="4"] .image-group-cell {
    width: calc(25% - 15px);
}
.image-group[data-row="5"] .image-group-cell {
    width: calc(20% - 15px);
}
.image-group[data-row="6"] .image-group-cell {
    width: calc(16.6666% - 15px);
}
.image-group[data-row="8"] .image-group-cell {
    width: calc(12.5% - 15px);
}
.image-group[data-row="10"] .image-group-cell {
    width: calc(10% - 15px);
}
.image-group[data-row="12"] .image-group-cell {
    width: calc(8.3333% - 15px);
}
.image-group .image-group-tip {
    color: #555;
    display: none;
    font-size: 16px;
    font-weight: 400;
    width: 100%;
}
.image-group[data-tip="top"] .image-group-tip:first-child {
    display: block !important;
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
}
.image-group[data-tip="bottom"] .image-group-tip:last-child {
    display: block !important;
    border-top: 1px solid #ccc;
    padding-top: 15px;
    margin-top: 5px;
}
.canvas .funs {
    margin-top: 4px;
    font-size: 0.8em;
}

/* topicchart background-color */
.box .bg-color0, box .bg-default { background-color:#e6e6e6!important; }
.box .bg-color1, .box .bg-red, .box .bg-danger {background-color: #facdc7f8 !important;}
.box .bg-color2, .box .bg-blue, .box .bg-normal, .bg-primary {background-color: #b1cde3f8 !important;}
.box .bg-color3, .box .bg-green, .bg-success {background-color: #a5c2b0f8 !important;}
.box .bg-color4, .box .bg-yellow, .box .bg-warning {background-color: #fffad1f8 !important;}/*#e5b31c*/
.box .bg-color5, .box .bg-orange, .box .bg-important {background-color: #fde7d2f8 !important;}
.box .bg-color6, .box .bg-purple {background-color: #d3dae4f8 !important;}
.box .bg-color7, .box .bg-azure {background-color: #cbd0ccf8 !important;}
.box .bg-color8, .box .bg-teal {background-color: #b4d6d5f8 !important;}
.box .bg-color9, .box .bg-pink {background-color: #edd1d8f8 !important;}
.box .bg-color10, .box .bg-info {background-color: #b0e5fff8 !important;}
a.jsc-topicitem.bg-default {
    background-color: #23527c !important;
}
a.jsc-topicitem.bg-info {
    background-color: #3e88e1 !important;
}
a.jsc-topicitem.bg-success {
    background-color: #6fab5f !important;
}
a.jsc-topicitem.bg-warning {
    background-color: #e76647 !important;
}
a.jsc-topicitem.bg-danger {
    background-color: #c72355 !important;
}

.bg0, .bg-color0, .bg-default { background-color:#e6e6e6!important; }
.bg0 a, .bg-color0 .b1, .bg-default a, .bg-default .b1 { 
    border-bottom: none!important;
    background-color:rgba(0,0,0,0.02)!important;
}
.bg0 a, .bg-color0 a, .bg-default a {
    color: #333333!important;
    text-shadow: initial;
}
.numberbox:not([class*="bg"]) {background-color: rgba(0,0,0,0.06)!important;}
.numberbox:not([class*="bg"]) a,.numberbox:not([class*="bg"]) a:hover {color: rgba(20,20,50,0.68);}

.bg1, .bg-color1, .bg-red, .bg-dangerx, .block.bg-danger {background-color: #cb4946 !important;}
.bg2, .bg-color2, .bg-blue, .bg-normal, .bg-primaryx, .block.bg-primary {
    background-color: #5F8AB7 !important;
}
.bg3, .bg-color3, .bg-green, .bg-successx, .block.bg-success {background-color: #6fab5f !important;}
.bg4, .bg-color4, .bg-yellow, .bg-warningx, .block.gb-warning {background-color: #ec971f !important;}
.bg5, .bg-color5, .bg-orange, .bg-importantx {background-color: #e76647 !important;}
.bg10, .bg-color10, .bg-infox, .block.bg-info { background-color: #5bc0de !important; /*#00BCD4*/ }
.bg6, .bg-color6, .bg-purple {background-color: #716fc7 !important;}
.bg7, .bg-color7, .bg-azure {background-color: #406089 !important;}
.bg8, .bg-color8, .bg-teal {background-color: #34a2a3 !important;}
.bg9, .bg-color9, .bg-pink {background-color: #ce73d0 !important;}
.bg11, .bg-color11 {background-color: rgba(106, 202, 197, 0.96) !important;}
.bg12, .bg-color12 {background-color: rgba(190, 138, 164, 0.96) !important;}
.bg13, .bg-color13 {background-color: rgba(217, 135, 80, 0.96) !important;}
.bg14, .bg-color14 {background-color: rgba(246, 216, 0, 0.96) !important;}
.bg15, .bg-color15 {background-color: rgba(178, 154, 128, 0.96) !important;}
.bg-white {
    background-color: white!important;
}
.bg-white div {
    border-color: rgba(0,0,0,0.52)!important;
}
.bg-white a {
    color: #333!important;
}
.block.bg-white {
    border: solid 1px rgba(0,0,0,0.05);
    border-radius: 3px;
    background-color: rgba(0,0,0,0.02)!important;
}
/*-------------jsc chart-------------*/
.bg-icon-x { background-image: url('/pic/icon/Factory.png'); }
.bg-icon1, .bg-icon-strategy { background-image: url('/pic/icon/Strategy.png'); }
.bg-icon2, .bg-icon-auditorial { background-image: url('/pic/icon/Auditorial.png'); }
.bg-icon3, .bg-icon-business { background-image: url('/pic/icon/Business.png'); }
.bg-icon4, .bg-icon-product { background-image: url('/pic/icon/Product.png'); }
.bg-icon5, .bg-icon-ehs { background-image: url('/pic/icon/EHS.png'); }
.bg-icon6, .bg-icon-manufacture{ background-image: url('/pic/icon/Manufacture.png'); }
.bg-icon7, .bg-icon-sales { background-image: url('/pic/icon/Sales.png'); }
.bg-icon8, .bg-icon-factory { background-image: url('/pic/icon/Factory.png'); }
.bg-icon9, .bg-icon-admin { background-image: url('/pic/icon/Administrative.png'); }
.bg-icon10, .bg-icon-chart { background-image: url('/pic/icon/chart1.png'); }
.bg-iconC1, .bg-icon-chart1 { background-image: url('/pic/icon/chart1.png'); }
.bg-iconC2, .bg-icon-chart2 { background-image: url('/pic/icon/chart2.png'); }
.bg-iconC3, .bg-icon-chart3 { background-image: url('/pic/icon/chart3.png'); }
.bg-iconC4, .bg-icon-chart4 { background-image: url('/pic/icon/chart4.png'); }
.bg-icon11, .bg-icon-coin { background-image: url('/pic/icon/coin.png'); }
.bg-icon12, .bg-icon-business-log { background-image: url('/pic/icon/business_log.png'); }
.bg-icon13, .bg-icon-meeting-log { background-image: url('/pic/icon/meeting_log.png'); }
.bg-icon14, .bg-icon-gmi-project { background-image: url('/pic/icon/project.png'); }
.bg-icon15, .bg-icon-gmi-sample { background-image: url('/pic/icon/sample.png'); }
.bg-icon16, .bg-icon-id-card { background-image: url('/pic/icon/id_card.png'); }
.bg-icon17, .bg-icon-my-meeting { background-image: url('/pic/icon/my_meeting.png'); }
.bg-icon18, .bg-icon-my-works { background-image: url('/pic/icon/work_log.png'); }
.numberbox > .b1 > a {
    cursor: default;
    /*color: #fff;font-family: "Arial", sans-serif;*/
}
.numberbox > .b1 > a:hover {
    /*color: #eee;*/
}

a[disabled="disabled"] {
    /*opacity:0.4;
    filter:alpha(opacity=40);
    cursor: not-allowed;*/
}
/*jsc-ring*/
.jsc-ring {
    position: relative;
    top: 0;
    width: 100px;
    height: 100px;
    margin: 10px auto;
    border-radius: 50%;
}
.jsc-ring div {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 50%;
}
.jsc-ring .ring-track,
.jsc-ring .ring-cover {
    background-color: border-color: rgb(255, 143, 143) !important;
}
.jsc-ring .ring-right {
    opacity: 0;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}
.jsc-ring .ring-text {
    border: none;
    font-family: "Arial", sans-serif;
    text-align: center;
    /*color: rgba(0,0,0,0.7);
     進度文字顏色 */
}
.jsc-ring .ring-percent {
    font-size: .55em;
    font-style: italic;
    font-family: "Microsoft Yahei", sans-serif;
}
.jsc-ring .tip {
    padding: 10px 4px;
    font-size: 0.26em;
}
/*Topic item*/
.topicgroup
{
    margin: 0 auto;
    background-color: rgba(0,0,0,0.05);
    box-shadow: 0px 0px 3px rgba(0,0,0,0.12);
}
.topic-caption {
    text-align: center;
    background-color: rgba(0,0,0,0.5);
    color: white;
    font-size: 32px;
    padding: 15px;
    font-weight: 700;text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
    background-size: 100%;
    background-repeat: no-repeat;
}
.topic-main {
    line-height: 68px;
}
.topic-sub 
{
    font-size:0.86em;
    color:gold;
}
.topic-body {
    padding: 4px;
    border: solid 1px rgba(0,0,0,0.125);
    border-top: none;
 }
.td1 .jsc-topicitem, .td1 .numberbox, .td1 .box { width: calc(100% - 8px)!important; } 
.td2 .jsc-topicitem, .td2 .numberbox, .td2 .box { width: calc(50% - 8px)!important; } 
.td3 .jsc-topicitem, .td3 .numberbox, .td3 .box { width: calc(33.333% - 8px)!important; } 
.td4 .jsc-topicitem, .td4 .numberbox, .td4 .box { width: calc(25% - 8px)!important; } 
.td5 .jsc-topicitem, .td5 .numberbox, .td5 .box { width: calc(20% - 8px)!important; } 
.td6 .jsc-topicitem, .td6 .numberbox, .td6 .box { width: calc(16.666% - 8px)!important; } 
.td7 .jsc-topicitem, .td7 .numberbox, .td7 .box { width: calc(14.2857% - 8px)!important; } 
.td8 .jsc-topicitem, .td8 .numberbox, .td8 .box { width: calc(12.5% - 8px)!important; } 
.td9 .jsc-topicitem, .td9 .numberbox, .td9 .box { width: calc(11.111% - 8px)!important; } 
.td10 .jsc-topicitem, .td10 .numberbox, .td10 .box { width: calc(10% - 8px)!important; } 
.td11 .jsc-topicitem, .td11 .numberbox, .td11 .box { width: calc(9.0909% - 8px)!important; } 
.td12 .jsc-topicitem, .td12 .numberbox, .td12 .box { width: calc(8.333% - 8px)!important; } 
.td1>div, .td2>div, .td3>div, .td4>div, .td5>div, .td6>div, .td7>div, .td8>div, .td9>div, .td10>div, .td11>div, .td12>div {
    min-width: unset!important; border-radius: 8px; display: inline-block;
}
.td1, .td2, .td3, .td4, .td5, .td6, .td7, .td8, .td9, .td10, .td11, .td12 {
    margin-bottom: -4px;
}
.jsc-topicitem
{
    background-color: #4F5A6E;
    width:180px;height:180px;
    display: inline-block;
    border-radius: 9px;
    position:relative;
    background-repeat: no-repeat;
    background-size: 76px;/*30%;*/
    background-position-x: center;
    background-position-y: 33%;
    font-size:16px;
    margin:4px;
}
.jsc-topicitem:hover
{
    background-size: 80px;/*36%;*/
}
.jsc-topicitem .desc
{
    position:absolute;
    top:70%;
    text-align:center; text-shadow: 0px 0px 8px rgba(0,0,0,0.6);
    color:White; width: 100%; /*background-color: rgba(255,255,255,0.036);*/
    white-space:nowrap;
}
.portal .bitext { position: relative; }
.portal a.bi-item  
{
    position: absolute;
    top: 2px;
    opacity: 0;
    z-index: 9999;
    /*width: 100%;*/
    background-color: #FFB74D;
    color: white;
    padding: 1px 16px;font-size:small;
    /*background-image: -webkit-linear-gradient(top,rgba(0,0,0,0) 10%, rgba(0,0,0,0.26) 100%);*/
    border-radius: 4px 16px 16px 4px;
    cursor: pointer;
    background-image: url(/pic/reference.png);
    padding-left: 26px;
    background-repeat: no-repeat;
    background-position-x: 8px;
}
.portal .dark a.bi-item {
    color: black;    background-color: #f1c686;
}
.portal .bi-grid a.bi-item { /*width:calc(100% - 9px);*/ top:4px; }
.portal a.bi-item:hover { opacity: 1; }
.portal .bi-grid .dssql
{
    min-height: unset;
}
.portal .bi-jschart .jscaption {
    display: none;
}
.portal .ui-grid .ui-table { width:100%; }
.portal .bi-grid .rowno, .portal .bi-grid .caption {
    display: none;
}
.portal .bi-grid {
}
.portal .bi-grid .row th {
    background-color: #666666;
    color: white;
    padding: 6px 4px!important;
    line-height: 14px;
}
.portal .EISC { display:none; }
/*APs link*/
.pdca, .notice, .paper {
	margin:1px 10px;
}
.pdca .body, .notice .body, .paper .body {
    padding: 4px 4px 3px;
    max-height: 150px;
    overflow: auto;background-color: rgba(255,255,255,0.68);
}
.pdca .title, .notice .title, .paper .title {
    background-color: rgba(0,0,0,0.02);
    padding: 2px 4px;
    border-bottom: solid 1px rgba(0,0,0,0.12);
    color:#555; font-size: 1.068em;
}
.pdca .new, .notice .new, .paper .new { font-size:0.86em!important;margin-left:4px;float: right; }
.pdca .item, notice .item, .paper .item { margin-bottom: 1px; }
.pdca .item a.href, .notice .item a.href, .paper .item a.href {
    display: block;
    padding: 0 4px;
    font-size: 0.96em!important;
    line-height: 22px;
}
.pdca .item.F0 a {
    background-color: rgba(0,0,0,0.036);
}
.pdca .item.S0 a {
    color: #f44336;
}
.pdca .item.SX a {
    text-decoration: line-through!important;
}
.notice .item.S1 a, .paper .item.S1 a {
    color: #f44336;
}
.notice .item.C1 a, .paper .item.C1 a {
    text-decoration: line-through!important;
}
.notice .item.I1 a {
    font-weight:700!important;
}
/*sql grid paging*/
.page-tab {
	margin: 10px 0;
}
.page-tab > tbody > tr > td {
	padding: 5px;
}
.page-tab div {
	display: inline-block;
	margin: -5px;
	padding: 0;
}
    .page-tab div > a {
        float: left;
        padding: 5px 10px;
        list-style: none;
        border: 1px solid rgba(0,0,0,0.12);
        position: relative;
        z-index: 1;
    }
.page-tab div > a:first-child {
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}
.page-tab div > a:last-child {
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}
.page-tab div > a + a {
	margin-left: -1px;
}
.page-tab div > a:hover {
	background-color: #f0f0f0;
	border-color: #cccccc;
	z-index: 3;
}
.page-tab div > a.active {
	background-color: #337ab7;
	border-color: #23527c;
	color: #fff;
	z-index: 2;
}
.itable {
    border: rgba(0,0,0,0.12);
}
.itable th, .itable td.th {
    /*padding: 4px 0px 4px;*/
    background-color: rgba(0,0,0,0.038);
    /*background-color: rgba(0,0,0,0.6);
    color: white;
    border-color: rgba(255,255,255,0.12);*/
    font-size: 1em;
    font-weight: normal;
}
.itable.editable th { background-color: #2196f3; }
.itable td {
    /*padding: 4px 2px;*/
}
.itable th, .itable td, .itable td.th {
    padding:  4px;
}
.itable input, .itable select, .itable textarea {
    border: none;
    margin: 0;
    padding: 0;
}
.itable input[type="submit"] { border: solid 1px rgba(0,0,0,0.18); }
.itable input.btn, .itable a.href {
    padding: 2px 10px;
    /*margin: -6px -15px -6px;*/
}
.itable .notesbox .notesedit .btn-group .href {
    padding: 2px 10px !important;
}
.notesbox .btn-group {
    min-width: 178px;
}
.itable input[disabled] {
    background-color: unset!important;
}
.defaultedit.portalscript {
    background-color: #555555!important;
    color: #f5deb3!important;
    /*margin: 0 10px;
    width: calc(100% - 20px)!important;*/
}
.gridedit td .tbx{ width:100%; }
.gridedit.lg .th, .gridedit.lg .td {
    line-height: 2.6em !important;
}
.defaultedit {
    background-color: #555555!important;
    color: white!important; padding-left: 2px!important;
}
.chapter>.section {margin:10px 0 10px 20px; font-size:16px;}
.chapter>.section>.topic { font-weight:700; }
.numcol { text-align:right; }
#sidebar .block.box, #sidebar .block.numberbox {
    width: calc(100% - 20px);margin-left:10px; margin-right:10px;
}
/*****RWD Design******/
.rwd { margin:15px; }
.rwd .caption {
font-size: 1.56em;
    padding: 0.32em 0;
    text-align: center;
    color: #333333;
    background-color: transparent;
    border-bottom: solid 1px rgba(0,0,0,0.068);
    font-weight: 700;
}
.rwd .block{
    width: 100%;margin: 2px 0;
}
.rwd .caption a {
    font-size: 0.68em;
    font-weight: normal;
    border-bottom: solid 1px rgba(0,0,0,0.06);float:right
}
.rwd.fit {
    margin: 15px 20px 0;
}
.rwd.fit > .row .content {
    margin: -5px -10px 10px;
}
.rwd .jsc-topicitem {
    width: 100%;
    margin: 0;
}
.rwd .jschart .jsbody, .rwd .jsc .jsbody { padding:0; }
.rwd .boxitem {
    width: 100%;
    padding: 4px; margin:0;
    line-height: 2em;
    font-size:1.32em;
    text-align:center;
}
.rwd .tabpages .boxitem {
    width: inherit;
    font-size: inherit;
    padding: 0 8px;
}
.rwd table {
    width: 100%;
}
.rwd.input .row, .rwd.x .row {
    margin: 0 -15px;
}
.rwd .th, .rwd .td { vertical-align:top; }
.rwd.gridedit .tbx, .rwd.gridedit .mtbx, .rwd.gridedit .dtpicker, .rwd.gridedit .ddlb {
    width: 100%;
    padding: 0 4px;
    border: none;
    height: 30px;
    box-shadow: unset;
}
    .rwd.gridedit .sqlwhere .tbx, .rwd.gridedit .sqlwhere .mtbx, .rwd.gridedit .sqlwhere .dtpicker, .rwd.gridedit .sqlwhere .ddlb {
        padding: 6px 12px;
        height: 34px;
        border: solid 1px lightgray;
    }
.rwd.gridedit .ckb { margin-left:4px; }
.rwd.gridedit .pradio {
    padding: 0px 4px;
}
.rwd.gridedit .mtbx { line-height:1.432em; }
.rwd.gridedit .tbx:focus-within, .rwd.gridedit .mtbx:focus-within {
    box-shadow:0 0 2px rgba(255,0,0,0.5);
}
.rwd.input th.th {
    display: table-cell;
    width: unset;
}
.rwd.input .th {
    display: inline-block;
    width: 80px;
    padding: 2px 4px;
    border-right: solid 1px rgba(0,0,0,0.12);
    background-color: #eeeeee;
    color: #222;
    border-radius: 2px 0 0 2px;
    overflow: hidden;
}
.rwd.input .td { display:inline-block;width:calc(100% - 80px);background-color: white; }
.rwd.input { line-height:2em; margin-top: 1px; margin-bottom: 0px; }
.rwd.noborder .content {
    border: none !important
}
.rwd.input .content {
    margin: 0 -15px;
    border: solid 1px rgba(0,0,0,0.12);
    margin-top: -1px;
    margin-bottom: -1px;
}
.rwd.input .htmltag .content {
    margin: 0;
    padding: 8px;
    background-color: rgba(0,0,0,0.03);
    border: none;
    line-height: 1.42em;
}
.rwd.input .up .th { width:100%; line-height:1.72em;text-align:left; border-radius:2px 2px 0 0; }
.rwd.input .up .td { width:100%; line-height:2em; }
.popup-background .rwd.input .row .content {
    min-height: inherit;
    padding: 0px;
}
/*.input-group .input-group-addon {
    min-width: 120px;
}*/
/*.topicgroup .rwd {
    margin: 0 15px;
}*/
.topicgroup .rwd { /*.rwd.adjust*/
    margin: 0 10px;
}
.topicgroup .rwd .content {
    margin: 0 -15px;
}
.topicgroup .rwd .topic .content {
    margin: 0 -10px;
}
.rwd {/*.rwd.adjust*/
    margin: 10px 15px;
}
.rwd .row.topic {/*.rwd.adjust*/
    margin: 5px -10px;
}
.rwd .topic .content {/*.rwd.adjust*/
    margin: 0 -10px -5px;
}
.rwd .topic .caption {
    margin: 8px -10px 0; padding:0;
}
.rwd .jsc { padding-bottom:0; }
 .topicgroup .row {
    margin: 0 -10px;
}
.topicgroup .row .content {
    margin: 5px -10px;
}
/*case-path*/
.casepath {
	display: block;
	padding: 0;
	margin: 4px 0 12px;
}
.casepath .btn {
	display: inline-block;border:none;
    font-size: 1.126em;
    margin: 0 8px;
    padding: 4px 12px 4px 8px;
}
.casepath .btn.selected {
	background-color: #337ab7;
}
.casepath .btn.selected a {
	color: #fff;
}
.casepath .btn-group span.gap {
    float: left;
    padding: 6px 3px;
    font-weight: 700;
    color: rgba(0,0,0,0.6);
    font-family: cursive;
}
.casepath span.other {
    float: left;
    padding: 6px 3px;
}
/*===menupages===*/
.barmenus {
    background-color: rgba(0,0,0,0.36);
    border: 1px solid rgba(250,250,250,0.65);
    line-height: 36px;
    position: relative;
    z-index: 3;
}
.barmenus .item, .barmenus .dropdown {
    background-color: rgba(250,250,250,0.96);
    border-right: 1px solid rgba(0,0,0,0.086);
    color: rgba(0,0,0,0.8);
    cursor: pointer;
    display: inline-block;
    padding: 0 10px;
    min-width: 60px;
    text-align:center;
    /*font-size: 16px;*/
    line-height: inherit;
}
.barmenus .item:hover {
	background-color: #f0f0f0;
}
.barmenus .item.select, .barmenus .select a {
	background-color: #698bb7;
	color: #ffffff;
}
.sfileempty {
    text-align: center;
    border: dotted 2px #fce4ec;
    background-color: rgba(255,0,0,0.012);
    margin-bottom: 1px;
}
.sfileempty img {
    height: 86px; opacity: 0.1;width: initial!important;
}
img.sfile.img {
    max-width: 800px;
}
.groupbox { padding: 0 10px; }
#sidebar .groupbox, .advbox .groupbox { width: 100%; }
.groupbox .body {
    background-color: inherit;
}
#maincontent .groupbox {
    display: inline-block;
    min-width: 168px;
}
.groupbox .text {
    color: white;
    background-color: rgba(0,0,0,0.032);
    padding: 2px 0 2px 8px;
    border-radius: 3px 3px 0 0;
    background-image: linear-gradient(45deg, #795548, transparent);
    font-weight: bolder;
    font-size: 1.12em;
}
.groupbox .text .btn {
    padding: 0px 12px;
}
.groupbox .body { padding: 8px 4px; }
#maincontent .groupbox .body {
    background-color: #f8f8ff;
}
.groupbox .href 
{
    display: block;
}
.mini .btn {
    padding: 4px 8px;
}
.mini .form-control {
    padding: 4px 8px;
    height: 30px;
}
.tiny .btn {
    padding: 2px 4px;
}
.tiny .form-control {
    padding: 2px 4px;
    height: 26px;
}
.iconlist {
    margin: 0 10px;
}
.iconlist .item {
    background-color: rgba(255,255,255,0.5);
    margin-bottom: 2px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.06);
}
.iconlist .icon {margin-right:8px;margin-left:8px;}
.iconbox .boxtitle {
    cursor: pointer;
}
.iconbox .icon {
    margin-right: 4px;
}
.href .icon {
    margin-right:4px;
}
.pagemenubar .href .icon {
    margin-left: 0;
}
.icons .itembox {
    display: block;
    margin-bottom: -8px;
    margin-top: 8px;
    padding: 4px 0;
    margin: 8px 0 -8px 22px;
}
.iconlist .itembox {
    display: block;
    padding: 4px 0;
    border-bottom: solid 1px rgba(0,0,0,0.06);
}
.iconbox .itembox {
    background-color: rgba(255,255,255,0.65);
    border-bottom: solid 1px rgba(0,0,0,0.05);
}
.iconbox span.oc {
    float: right;
    padding: 0 5px;
    border-radius: 16px;
    background-color: rgba(0,0,0,0.045);
    cursor: pointer;
    margin-right: 2px;
    background-image: -webkit-linear-gradient(top,rgba(255,255,255,0.6) 0%, rgba(0,0,0,0.06) 100%);
    color: gray;    font-family: cursive;
}
.datalist {
    border: solid 1px rgba(0,0,0,0.12);
    padding: 1px 2px;
    position: relative;
    display: inline-block;
}
.datalist input {
    border: none;
    margin: 0;
    padding: 0;
    width: calc(50% - 18px)!important;
}
.datalist .icon {
    padding: 4px 2px;
    cursor: pointer;
    opacity: 0.25;float: right;
}
.datalist .display { cursor: default; }
.portal .ui-grid .footer {
    margin-left: 2px;
}
.portal .ui-grid .footer .text {
    /*margin-left: 45px;*/
}
.portal .ui-paging {
    margin-left: 0!important;
}
.dtpicker, .dtpicker.form-control {
    width: 120px;
    display: inline-block;
    text-align: center;
}
.dtmpicker, .dtmpicker.form-control {
    width: 135px;
    display: inline-block;
    text-align: center;
}
.table .dtpicker, .table .dtmpicker {
    height: unset;
    border: none;
    box-shadow: none;
    border-bottom: solid 1px lightgray;
    border-radius: 0;
}
.emailmsg
{
    color: red;
    margin: 4px;
    padding: 4px 8px;
    font-weight: 700;
}
/*signature object*/
.input-group.buttonsign { width:250px;display: inline-table;}
.buttonsign .sign {
    white-space: nowrap;
}
span.displayonly {
    border-bottom: solid 1px rgba(0,0,0,0.1);
    margin: 0 4px 0 4px;
    font-weight: 700;
    display: inline-table;
}
/* RWD Table */
div.rwd-table-content {
	max-width: 100vw;
	overflow-x: auto;
}
div.rwd-table-content::-webkit-scrollbar {
	  width: 8px;
	  height: 8px;
}
div.rwd-table-content::-webkit-scrollbar-track {
	  background: #f1f1f1; 
}
div.rwd-table-content::-webkit-scrollbar-thumb {
	  background: #aaa; 
}
div.rwd-table-content::-webkit-scrollbar-thumb:hover {
	  background: #777; 
}
.selectbox .item {
    padding: 2px 4px;
    border: solid 1px #ccc;
    margin: -1px;
}
.input-group .empty {
    margin:0;padding:0!important;border:none;background-color: rgba(0,0,0,0.16);
}
.form-control.layout {
    margin: 0;
    padding: 0;
}
.form-control.layout select {
    width: 100%;
    border: none;
    padding: 6px 12px; margin: 0 -12px 0 0;
}
.input-group.sqlwhere 
{
    margin-top: 4px;
    margin-bottom: 4px;
}
.sidebar-box .icon 
{
    font-size: 1.32em;
    margin: 1px 11px;
    color: steelblue;
}
.mini .sidebar-box .icon 
{
    font-size:1em;
    top: -2px;
    margin: 0 8px;
}
tr.even { background-color:rgba(0,0,0,0.036); }
tr.hlight:hover {
    border-bottom: solid 1px rgba(0,0,0,0.35);
}
.itable .dtpicker {
    height: initial;
}
.input-group .pradio label {
    display: contents;
}
.input-group .pradio input {
    margin-right: 4px;
}
/*popup object*/
.popup-background {
	position: fixed;
    z-index: 99999;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,.5);color: initial;
    text-align: left;
}
.popup-background > div.body{
    max-width: 90vw;width:65vw;
    max-height: 100vh;
    position: relative;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    border-radius: 5px;
    overflow: auto;
    /*padding:10px 20px;*/
    background-color: white;
}
.popup-background .header {
    border-bottom: solid 1px rgba(0,0,0,0.25);
    color: gray;
    margin:0;
    padding: 6px 15px;
    font-weight: 700;
    /*font-size: 1.12em;*/
}
.popup-background .body > span {
    margin: 6px 15px;
}
.popup-background .content{
    padding: 0; min-height:120px;
}
.popup-background .footer{
    border-top: solid 1px rgba(0,0,0,0.02);
    padding-top:2px;
}
.popup-background.popupobject .content {
    padding: 15px;
}
.popup-background.popupobject .footer {
    padding: 0 15px 15px;
}
.popup-background .body .emailmsg {
    position: absolute;
    right: 40px;
    top: 0;
}
#main .popup-background input[type="text"], #main .popup-background select {
    background-color: #fff;
    border-color: rgba(0,0,0,0.12);
    color: black;
}
.counter .icon {
	top: 0;bottom:0;
    font-size: 0.92em;
    padding: 4px;
    border: solid 1px rgba(0,0,0,0.036);
    background-color: rgba(0,0,0,0.2);color:white;
}
.counter .left .icon {
    border-radius: 4px 0 0 4px;
}
.counter .right .icon {
    border-radius: 0 4px 4px 0;margin-right:-1px;
}
.counter .data { text-align:center;width:30px;border:none;background-color: rgba(0,0,0,0.032); }
.counter .modified .icon { color:Red; }
.portal .bitext a.bi-item {
    top: 18px;left:0;
}
.slide { position:relative; }
.slide .slideitem {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
/*switchbox*/
.switchbox .sidebar-box-img {
    display: none;
}
.switchbox .sidebar-box-title {
    margin-left: 10px;
    border: solid 1px rgba(0,0,0,0.12);
    border-radius: 15px;
    background-color: transparent;
}
.switchbox .sidebar-box.selected .sidebar-box-title a:hover {
    color: white !important;
}
.switchbox .sidebar-box {
    padding: 1px 10px 0 0!important;
}
.switchbox .sidebar-box-title a {
    padding-left: 10px!important;padding-right: 10px!important;color: #424242;
}
.switchbox .sidebar-box-title:hover {
    background-color: rgba(0,0,0,0.03);
}
.switchbox .sidebar-box:hover {
    background-color: transparent!important;
}

.switchbox .sidebar-box.selected .sidebar-box-title {
    background-color: cornflowerblue;
}
.switchbox .sidebar-box.selected .sidebar-box-title a {
    color: white;
}
.newpanel {
    padding: 10px;margin: -14px -19px;
    background-color: #ffebee;
}
.newpanel table {
    width: 100%;
}
.newpanel .title {
    font-size: 1.12em;
    font-weight: 700;
    border-bottom: solid 1px rgba(0,0,0,0.12);
    margin-bottom: 8px;
}
.barmenus .item .btn {
    border: none;
    background-color: transparent;
    color: #337ab7;
}
.form-control input.switch
{
	display: block;
    width: 100%;
    height: 21px;
    margin: 0;
    padding: 0;min-width: 1em;
}
/*欄位檢查機制字體顏色 for datacheck()*/
.eformc.need-input[data-check]::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: red;
  opacity: 1; /* Firefox */
}
.eformc.need-input[data-check]:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: red;
}
.eformc.need-input[data-check]::-ms-input-placeholder { /* Microsoft Edge */
  color: red;
}
.eformc.need-input[data-check] {
	border: 1px solid red !important;
	color: red !important;
}
.btn-group input[type="radio"], .btn-group input[type="checkbox"] {
    margin: 0;
}
.download { cursor:pointer; }
input.forcdate
{
    line-height: 1em!important;
    border: none!important;
    width: 46px!important;
    margin-left: -20px!important;
    background-color: transparent!important;
    color: transparent!important;
}
span.exported
{
    color: red;
    display: inline-block;
    padding: 4px 18px;
    border: solid 1px lightgray;
    background-color: rgba(0,0,0,0.025);
    border-radius: 20px;
    margin: 4px;
}
span.exported .filedownload { margin-left:8px; }
.cdtdisplay {
    min-width: 106px;
    display: inline-block;
}
.stampbox {
    height: 40px;
}
.sign .userstamp {
    border: solid 3px indianred;
    border-radius: 8px;
    height: 40px;
}
label.sign {
    cursor: pointer;
}
.buttonsign.stampbox img.userstamp {
    height: 34px;
    border: solid 2px indianred;
    border-radius: 4px;
    margin: 0 2px;
}
span.sms { margin: 0 4px; }
span.sms.failed {
    color: red;
}
.btn-group > .dropdown {
    float: left;
}
.btn-group .dropdown:not(:first-child):not(:last-child):not(.dropdown-toggle) .btn {
    border-radius: 0;
    margin-left: -1px;
    margin-right: -1px;
}
.btn-group .dropdown:last-child:not(:first-child):not(.dropdown-toggle) .btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    margin-left: -1px;
}
.btn-group .dropdown:first-child:not(:last-child):not(.dropdown-toggle) .btn {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    margin-right: -1px;
}
.nav-tabs {
    border-bottom: 1px solid #ddd;
    margin: 4px 0 !important;
}
.nav {
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}
.leftbarbody .list-group-item {
    padding: 6px 10px;
}
.list-group-item-heading {
    margin-bottom: 0 !important;
}
.list-group-item-text {
    color: rgba(0,0,0,0.5);
    font-size: 0.86em;
}
.leftbarbody > .list-group {
    padding: 0 10px;
}
.defaultsavebox {
    padding: 2px 3px;
    background-color: rgba(0,0,0,0.015);
}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    background-color: #fff7f0!important;
}
input[type="date"].tbx, input[type="time"].tbx, input[type="datetime-local"].tbx, input[type="month"].tbx {
    line-height: inherit;
}
/*range input from*/
input[type=range] {
    width: 100%;
    margin: 5px 0;
    background-color: transparent;
    -webkit-appearance: none;
    border: none;
}
input[type=range]:focus {
    outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
    background: #d8d8e5;
    border: 0;
    border-radius: 25px;
    width: 100%;
    height: 10px;
    cursor: pointer;
}

input[type=range]::-webkit-slider-thumb {
    margin-top: -3px;
    width: 8px;
    height: 16px;
    background: rgba(1, 118, 254, 0.68);
    border: 0;
    border-radius: 4px;
    cursor: pointer;
    -webkit-appearance: none;
}

input[type=range]:focus::-webkit-slider-runnable-track {
    background: #e7e7ef;
}

input[type=range]::-moz-range-track {
    background: #d8d8e5;
    border: 0;
    border-radius: 25px;
    width: 100%;
    height: 10px;
    cursor: pointer;
}

input[type=range]::-moz-range-thumb {
    width: 8px;
    height: 16px;
    background: rgba(1, 118, 254, 0.68);
    border: 0;
    border-radius: 4px;
    cursor: pointer;
}

input[type=range]::-ms-track {
    background: transparent;
    border-color: transparent;
    border-width: 3px 0;
    color: transparent;
    width: 100%;
    height: 10px;
    cursor: pointer;
}

input[type=range]::-ms-fill-lower {
    background: #c9c9db;
    border: 0;
    border-radius: 50px;
}

input[type=range]::-ms-fill-upper {
    background: #d8d8e5;
    border: 0;
    border-radius: 50px;
}

input[type=range]::-ms-thumb {
    width: 16px;
    height: 16px;
    background: rgba(232, 52, 0, 0.6);
    border: 0;
    border-radius: 4px;
    cursor: pointer;
    margin-top: 0px;
    }

input[type=range]:focus::-ms-fill-lower {
    background: #d8d8e5;
}

input[type=range]:focus::-ms-fill-upper {
    background: #e7e7ef;
}
@supports (-ms-ime-align:auto) {
     input[type=range] {
        margin: 0;
     }
}
/*range input end*/
.inputbox {
    padding: 4px 0;
}
.inputbox .item {
    vertical-align: bottom;
}
    .inputbox input, .inputbox select, .inputbox .pradio {
        border: none;
        border-bottom: solid 1px lightgray;
        box-shadow: none;
    }
.inputbox input.ckb {
    height: 25px;
}
.inputbox .h {
    padding-left: 12px;
    border-top: solid 1px rgba(0,0,0,0.05);
    border-radius: 20px;
}
#sidebar .inputbox .item {
    width: 100% !important;
}
.contentbox .inputbox .btn {
    margin-left: 4px;
    line-height:42px;
}
#sidebar .inputbox .btn {
    width: 100%;
    margin-top: 10px;
}

element.style {
}

.gridedit td .tbx {
    width: 100%;
}
tr.new td {
    vertical-align: middle;
    background-color: lavenderblush;
    padding: 2px 1px 2px 0;
}
tr.new .eformc {
    border-radius: 3px;
    border: solid 1px rgba(0, 0, 0, 0.15);
}
tr.new td input, tr.new td select, tr.new td textarea {
    padding: 2px 4px;
}
.input-group .pradio span.item {
    /* border: solid 1px lightgray; */
    padding: 1px 2px;
    /* border-radius: 12px; */
    margin-left: -4px;
    /* background-color: rgba(0, 0, 0, 0.032); */
}
.radvbox {/*pradio*/
    cursor: pointer;
}
.clientsign .icon {
    cursor: pointer;
    margin-right: 2px;
    opacity: 0.5;
}
.clientsign span.tip {
    color: lightgray;
}

.input-group .form-control .eformc:not([type="radio"]) {
    border: none;
    /*padding: 6px;*/
}

.leftbarbody .input-group .form-control .eformc:not([type="radio"]) {
    border: none;
    /*margin: -6px;
    padding: 0 3px;
    */
}
.form-control .ddlb {
    padding: 0;
    margin: 0 -5px;
    width: calc(100% + 10px);
}
.xdsoft_datetimepicker { z-index:10000!important; }
.pagingbox {
    clear: both;
    padding-top: 10px;
    margin: 0 -1px;
}
.label_switchbox {
    vertical-align: top;
}
.withficonbar .jscmaxspace {
    padding-left: 55px !important
}
.withficonbar .uchart .jscmaxspace {
    padding-left: 0 !important;
}
.withficonbar .jschart.jscmaxspace {
    padding-left: 0 !important;
    margin-left: 55px !important;
    width: calc(100% - 55px) !important;
}
.jsc, .jsc-ring, img, canvas, .notebox, .box {/*not include tr*/
    page-break-inside: avoid;
}
tr {
    page-break-inside: unset !important;/*避免空白頁*/
}
.psobj.infobox {
    display: inline-block;
    padding: 10px 20px;
    border: solid 1px rgba(0,0,0,0.12);
    border-radius: 4px;
    margin: 1px;
}
table.mini th,  table.mini td { padding:4px!important; }
th.dssort {
    text-decoration: underline;
    text-decoration-color: rgba(0,0,0,0.08);
    text-decoration-thickness: 3px;
}
.cblist .cbitem, .pradio .item {
    white-space: nowrap;
}
.cblist .cbitem input, .pradio .item input {
    margin-right: 2px;margin-top: 2px;
    border: none;
    border-bottom: solid 1px lightgray;
    /*vertical-align: top;*/
}
.cblist .cbitem label, .pradio .item label {
    vertical-align: top;
}
.underline {
    border: none !important;
    border-bottom: solid 1px lightgray !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    height: unset !important;
    padding:0!important;
}
.pradio td {
    padding: 0 4px 0 0 !important;
}
.form-control .form-control {
    height: unset;
    padding: 0;
    border: none;
    box-shadow: unset;
    margin: 0;
}
.btn_no {
    display: inline-block;
    padding: 0 4px;
    cursor: pointer;
    color: #333;
}
.btn_no:hover {
    background-color: #e6e6e6;
}

/**PDF*/
.pdf tr, .pdf th, .pdf td {
    background-color: transparent !important;
}
blink, .blink {
    animation: blink 1s step-end infinite;
}

@keyframes blink {
    67% {
        opacity: 0.15
    }
}
/*hackmd like*/
.li.c1 {
    padding-left: 1em;
}

.li.c2 {
    padding-left: 2em;
}
/*readmore*/
.readmorerows .ui-paging {
    display: none !important;
}
.readmorerows table {
    margin-bottom: 0;
}
.readmorerows table th, .readmorerows table td {
    padding: 4px 8px !important;
}
.readmorerows .apinext {
    background-color: linen;
    padding: 4px;
}
.notesbox .header {
    padding: 4px 0;
    border-bottom: solid 1px lightgray;
}

.tabpages {
    padding: 4px 0 0 0;
    margin-bottom: 4px;
    border-bottom: 1px solid lightgray;
    background-image: -webkit-linear-gradient(top, rgb(255 255 255) 0%, rgb(255 255 255) 20%, rgb(255 255 255) 100%);
}
.tabpages .boxitem {
    padding: 6px 12px; 
    border-color: rgb(193 191 191);
    background-color: white; 
    font-size: 1em;
    border-radius: 10px 10px 0 0 !important;
    border-bottom: 0 !important;
}
.tabpages .boxitem:hover {
    border: solid 1px gray;
}
.boxitem.navbox.selected, .boxitem.navbox.select {
    background-color: #457345;
}
.readmorerows .apinext {
    background-color: #cedae9;
}
.itable .notesedit .btn-group .href {
    padding: 6px 10px !important;
}
.itable .notesbox {
    margin-top: -4px;
}
/*popup 會跑版 scroolbar*/
.popup .title {
    font-size: 16px;
    line-height: 20px;
    padding: 2px 4px 2px 4px !important;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    line-height: 1em !important;
}