﻿.masterHeight {
    height: 80vh;
    overflow-y: auto;
}
.form-horizontal .form-group {
    margin-right: 0;
    margin-left: 0;
}

body {
    padding-top: 10px;
    font-size: 13px/1.231;
    font-family: Glyphicons Halflings, 微軟正黑體,微軟雅黑,新細明體,Verdana,Calibri,Palatino Linotype,Verdana,Arial;
    color: #000000;
}

button, input, optgroup, select, textarea
{
    font-size:13px/1.231;
    font-family: Glyphicons Halflings, 微軟正黑體,微軟雅黑,新細明體,Verdana,Calibri,Palatino Linotype,Verdana,Arial;
    color: #000000;
}

.ui-widget
 {
   font-family: Glyphicons Halflings, 微軟正黑體,微軟雅黑,新細明體,Verdana,Calibri,Palatino Linotype,Verdana,Arial;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6
{
    font-family: inherit;
}

/* Set padding to keep content from hitting the edges */
.body-content {
   /* padding-left: 10px;
    padding-right: 25px; */
    margin-top: -10px;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 1000px;
}

/* styles for validation helpers */
.field-validation-error {
    color: #b94a48;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #b94a48;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #b94a48;
}

.validation-summary-valid {
    display: none;
}


/* 右邊選單 */
.menu-r {
min-height: 530px;
background-color: #f5f5f5;
border: 1px solid #e3e3e3;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
right: 0px; position: fixed; top: 32px; width: 400px; height: auto;
font-size:14px;
z-index: 1000;
/*background-color:rgba(76, 173, 76, 0.85098);*/
background-image:linear-gradient(#51D633, rgba(76,173,76,1) 50%, rgba(76,173,76,0.85));
 }
/* 右邊選單第2階 */
.list-unstyled li > ul > li, .list-unstyled li > ul > li> ul > li{
   margin-left:8px;
   padding-top:2px;
   padding-bottom:2px;
}
/* 右邊選單第3階 */
.list-unstyled li > ul > li> ul > li{
   margin-left:25px;
}

/* 上方navbar */
.navbar-brand {
    padding-top: 3px;
    padding-bottom: 0px;
    line-height: 20px;
    height: 28px;
}

/* 上方navbar */
.navbar-brand img {
    max-height: 100%;
    /*margin-top: -12px;*/
}
.navbar-inverse{
    min-height: 20px; 
    height:30px;
    color: rgba(76, 173, 76, 0.85098);
}

.navbar-nav > li{
    padding-top: 6px;
    padding-bottom: 3px;
    line-height: 20px;
}
/* 以下改在.navbar-nav > li控制 */
.navbar-nav > li > a,.navbar-nav > li > a:hover 
{
    padding-top: 0px;
    padding-bottom: 0px;
    line-height: 0px;
}

.navbar-nav > li.nav-clock {
    padding-top:4px;
}

#time_Now {
    margin-right:20px;
    color:#FFF;
}

#langSwitch {
    padding-top:0px;
}

.glyphicon
{
    margin-right:3px;
}

.form-control
{
    height:30px;
    padding: 2px 6px;
    color: #000000;
    font-size: inherit;
    border: 1px solid #999999;
}

.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
cursor: not-allowed;
background-color: #8FF5A7;
opacity: 1;
}

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
padding-left: 3px;
padding-right: 3px;
}
.form-group {
margin-bottom: 10px;
}

.modal-footer {
    margin-top: 5px;
    padding: 5px 20px 20px;
    text-align: center;
}


.panel
{
    margin-bottom: 10px;
}

.panel-heading 
{
   padding: 3px 15px;
}

.panel-body
{
   padding: 5px 10px;
}


/* 不可空白欄位之Label為紅色*/
.required-label {
    color:#dd1144;
}

/* 錯誤icon設定*/
.error-block {
    line-height:30px;
    width:0px;
    padding:0px;
}
.error-icon {
    vertical-align:baseline;
    color:#dd1144 !important;
    margin-left:-27px;
    z-index: 80;
}
.error-icon-quBtn {
    margin-left: -57px;
}

.btn-qumodal {
    z-index: 80;
}

/*-- ngGrid之設定---*/
.ngCell.pinned {
z-index: 81;
}


.ngCellElement .btn-info{
  border: 0px solid #cccccc;
  padding-bottom: 0px!important;
  border-top-right-radius: 3px!important;
  border-bottom-right-radius: 3px!important;
}

.ngCellElement .btn .caret {
  margin-top: -10px!important;
  margin-left: -2px!important;
  border-width: 5px!important;
}


.ngGrid .input-group{
  padding-top: 3px;
}

.ngCellElement .input-group-addon {
  padding: 8px 8px;
  font-size: 13px;
}

.ngColMenu {
background-color: #EDF0D5!important;
}

.ngHeaderButton {
top: 0px!important;
width: 24px!important;
height: 24px!important;
background-color: rgb(247, 202, 87)!important;
}

.input-group-addon {
  padding: 6px 12px 8px 12px;
}


div[ng-cell] .error-icon {
    float:right;
    top:-27px;
}


/*.has-feedback .form-control-feedback {
position: absolute;
top: 25px;
right: 0;
display: block;
width: 34px;
height: 34px;
line-height: 34px;
text-align: center;
}*/

.tooltip{
    width:120px;
}

.cellToolTip {
    overflow:visible;
}

.notNull-input:invalid {
    border: 1px solid #dd1144;
    box-shadow: 1px 1px 1px 1px #fac7c7;
}

/*--- ng-Grid ---------------------------- */

.gridMasterStyle {
    border: 1px solid rgb(212,212,212);
    width: 100%; 
    height: 480px;
}

.gridDetailStyle {
    border: 1px solid rgb(212,212,212);
    width: 100%; 
    height: 480px;
}

.ngRow.odd {
/*background-color: #ADF1B8; *//*#B6F1B6;*/
/*background-color:#fdcf7d;*/
/*background-color:#FDCE7D;*/
  background-color:#DDE6D8;
}

.gridDetailStyle .ngRow.even{
/*background-color: #ADF1B8; *//*#B6F1B6;*/
/*background-color: #ffffff;*/
}
.ngRow.even{
   /* background-color:#ffebc0;*/
    background-color:#ffffff;
}
.gridDetailStyle .ngRow.even{
   /* background-color:#ffebc0;*/
    background-color:#ffffff;
}
 

.ngHeaderCell
{
   /* background-image:linear-gradient(#FAFAFA, #8DDFF8 50%, #CAF3EB);*/
   /*  background-image:linear-gradient(#FAFAFA, #5CADCC 90%, #5CADCC);*/
    /*linear-gradient(#FAFAFA, #8EDF92 50%, #BBF5B4);*/
    background-image: linear-gradient(rgba(7, 133, 181, 0.30), rgba(7, 133, 181, 0.86) 90%, #0785B5);
   /*background-image: linear-gradient(#f9e0ad, #f5c461 20%, #db7e2e);*/
}

.ngRow.selected {
 /*background-color: #6BADF5 !important;*/
 background-color: #A8E4FF !important;
 /*background-image: linear-gradient(#A8E4FF 0%, #beebff 80%, #A8E4FF 100%);*/
}

.ngHeaderSortColumn
{
    color: navy;
}

.ngGrid .form-control {
    height: 24px;
    margin-top: 3px;
    /*border: 0px;*/
    border: 1px solid #dddddd;
    border-radius: 2px;
}

.ngCell {
 padding: 0px 3px 0px 2px;
}

.ngGrid i {
    margin: 1px 1px 1px 1px;
    color:navy;
}

.ngGrid .error-icon{
    margin: 8px 3px 8px 3px;
}

.ngCellElement:focus {
  background-color: transparent !important;
}

.form-control:focus {
  border: 2px solid #66afe9 !important;
  border-color: #66afe9 !important;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6) !important;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6) !important;
  background-color: #ffffff !important;
}


/*--- form control ---------------------------- */
.form-horizontal .control-label, .form-horizontal .radio, .form-horizontal .checkbox, .form-horizontal .radio-inline, .form-horizontal .checkbox-inline {
padding-top: 5px;
}

.error-block .tooltip-inner,.cellToolTip .tooltip-inner
{
background-color: red;
}

.error-block .tooltip.right .tooltip-arrow,.cellToolTip .tooltip.right .tooltip-arrow{
border-right-color: red;
}

.form-group .ng-invalid,.ngCell .ng-invalid{
    border: 1px solid #dd1144;
    box-shadow: 1px 1px 1px 1px #fac7c7;
}

.radio-inline, .checkbox-inline {
padding-left: 20px;
}

.radio-inline + .radio-inline, .checkbox-inline + .checkbox-inline {
  margin-left: 0;
}


.radio-inline .form-control, .checkbox-inline .form-control {
  margin-top: 0px;
}


.tab-content{
    margin-top: 8px;
}


.form-panel{
 background-color: #eed3d7;
 padding-top: 3px;
 padding-bottom: 3px;
 min-height: 38px;
 border-color: #eed3d7;
 margin-bottom: 20px;
 border: 1px solid transparent;
 border-radius: 4px;
 -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}




/*--- Modal with CSS3 animation ---------------------------- */
@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInDown {
  -webkit-animation-duration: 0.6s;
  animation-duration: 0.6s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;  
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}
/*-- faster --*/
.fadeInDown-f {
  -webkit-animation-duration: 0.15s;
  animation-duration: 0.15s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;  
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

/*-- input-group --*/
.input-group .btn-info{
color: #ffffff;
cursor: pointer;
}

.ngGrid .input-group .form-control {
margin-top: 0px;
}

.cellBtn{
    cursor: pointer;
}

.checkBoxCell {
margin-top: 9px!important;
margin-left: 6px!important;
}

.number {
    text-align: right; 

}
/*-------------更改後分割線---配色更改--------------*/
.panel-info > .panel-heading{
    background:#dcdcdc ;
    border-color:#dcdcdc;
}

.panel-info{
    border-color:rgba(76, 173, 76, 0.85098);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary{
    /*background:#980934;*/
    background:#26802A;
    /*border-color:#cb446b;*/
    border-color:#26802A;
}

.btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary:active.focus, .btn-primary:active:focus, .btn-primary:active:hover, .open>.dropdown-toggle.btn-primary.focus, .open>.dropdown-toggle.btn-primary:focus, .open>.dropdown-toggle.btn-primary:hover {
    /*color: #fff;
    background-color: #a5cba8;
    border-color: #122b40;*/
   background:#26802A;
}

.btn-primary:hover{
    background-image:  linear-gradient(#51D633, rgba(76,173,76,1) 50%, rgba(76,173,76,0.85));
}
.btn-primary{
    background:#319235;
    color:#FFF;
    border-color:#FFF !important;
}
.btn-primary.disabled, .btn-primary[disabled], fieldset[disabled] .btn-primary, .btn-primary.disabled:hover,
 .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus,
 .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus, .btn-primary.disabled:active,
 .btn-primary[disabled]:active, fieldset[disabled] .btn-primary:active, .btn-primary.disabled.active,
 .btn-primary[disabled].active, fieldset[disabled] .btn-primary.active{
    background:#4D9E4E;/*無作用之按鈕顏色*/
    color:#FFF;
    border-color:#db717a;
}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus{
    /*background-image: linear-gradient( #f9adb4,#f9adb4 50%, #fadde0);分頁標頭*/
    /*background-image: linear-gradient( #d0d0d0,#d0d0d0 50%, #d0d0d0);*/
    background-image: linear-gradient( rgba(208, 208, 208, 0.42),rgba(49, 146, 53, 0.58) 35%, #E2E1E1);
    border:0;
}
.nav-tabs > li{
    margin-bottom:-3px;
}
.tab-content{/*分頁設定*/
    margin-top:0;
    /*background:#fadde0;*/
    background:#E2E1E1;
}
.ngHeaderSortColumn{
    color:#FFF;
}

.btn-info{
    /*background-image: linear-gradient(#f9e0ad, #f5c461 20%, #db7e2e);*/
    background-image: linear-gradient(#61DE67, rgba(49, 146, 53, 0.82)25%, #319235);
    border-color:#db7e2e;
}
.btn-info:hover{
    /*background-image: linear-gradient(#e49653, #db7e2e 50%, #a95c1a);*/
    background-image:  linear-gradient(#51D633, rgba(76,173,76,1) 50%, rgba(76,173,76,0.85));
    border-color:#a95c1a;
}
  .col-sm-2 {
    width: 16.26666667%;
  }
  .nav-tabs{
      border:0;
  }
/*-----------------RWD響應式網頁------------------------*/
  /*寬*/
@media (max-width: 768px) {
    .body-content {
        /*width: 600px !important;*/
        width: 97% !important;
    }
    .menu-r {
        width: 100% !important;
    }
    .menu-content {
        width: 90% !important;
    }
}
@media (min-width: 768px) {
    .body-content {
        width: 97% !important;
        /*width: 768px !important;*/
    }
}
@media (min-width: 992px){
   .body-content {
    width: 992px !important;
  }
}
@media (min-width: 1100px){
  .body-content{
    width: 1100px !important;
  }
}
@media (min-width: 1200px){
  .body-content{
    width: 1200px !important;
  }
}
@media (min-width: 1280px){
  .body-content{
    width: 1280px !important;
  }
}
@media (min-width: 1360px){
  .body-content{
    width: 1360px !important;
  }
}
@media (min-width: 1400px){
   .body-content{
    width: 1400px !important;
  }
}
@media (min-width: 1700px){
   .body-content{
    width: 1700px !important;
  }
}


@media (min-width: 1280px){
    .container {
        width: 1250px;
    }
  /*高*/
  iframe{
      height:96% !important;
  }
   .body-content{
       height:101% !important;
   }
}
@media (max-height: 700px) {

    /*細目內容*/
    #panelGridMaster >.gridMasterStyle {
        height: 474px !important;
    }
    /*整體大小
    .body-content{
     height:600px !important;
    }*/
   iframe{
      min-height:600px !important;
   }

}
 /*900 - 200 = 700*/
@media (min-height: 700px) {

    #panelGridMaster > .gridMasterStyle {
        height: 591px !important;
    }
   iframe{
       min-height:700px !important;
   }

  /*搜尋頁面*/
 .modal-body > iframe{
      min-height:650px !important;
   }
}
 /*1000 - 200 = 800*/
@media (min-height: 800px) {

    #panelGridMaster > .gridMasterStyle {
        height: 591px !important;
    }
   iframe{
       min-height:700px !important;
   }
  /*搜尋頁面*/
 .modal-body > iframe{
      min-height:650px !important;
   }
}
 /*1024 - 200 = 824*/
@media (min-height: 824px) {

    #panelGridMaster > .gridMasterStyle {
        height: 606px !important;
    }
   iframe{
       min-height:765px !important;
   }

  /*搜尋頁面*/
 .modal-body > iframe{
      min-height:727px !important;
   }
}
 /*1080 - 200 = 880*/
@media (min-height: 880px) {

    #panelGridMaster > .gridMasterStyle {
        height: 680px !important;
    }
   iframe{
       min-height:815px !important;
   }

  /*搜尋頁面*/
 .modal-body > iframe{
      min-height:727px !important;
   }
}
@media (min-height: 940px) {

    #panelGridMaster > .gridMasterStyle {
        height: 890px !important;
    }
   iframe{
       min-height:900px !important;
   }

  /*搜尋頁面*/
 .modal-body > iframe{
      min-height:940px !important;
   }
}
@media (min-height: 980px) {

    #panelGridMaster > .gridMasterStyle {
        height: 874px !important;
    }
    /* .body-content{
  height:980px !important;
  }*/
   iframe{
      min-height:980px !important;
   }
   /*搜尋內容卷軸*/
    .modal-body > iframe{
      min-height:880px !important;
   }

}
/*右邊的MENU
body,html{
    height:100%;
}
    */
.menu-r{
    height:100%;
}
.body-content {
    overflow-y: auto;
}
body{
    overflow:hidden;
}


.pull-left{
    height:91% !important;
    max-height:91% !important;
}
.navbar-inverse {
    background-image: -webkit-linear-gradient(#51D633, rgba(76,173,76,1) 50%, rgba(76,173,76,0.85));
    /*background-image: linear-gradient(#F196B0, #E95E85 50%, #d73c69);*/
    background-image: linear-gradient(#51D633, rgba(76,173,76,1) 50%, rgba(76,173,76,0.85));
    background-repeat: no-repeat;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffF196B0', endColorstr='#ffd73c69', GradientType=0);
    filter: none;
    border: 1px solid #345578;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3);
}
.navbar-inverse .navbar-nav > li  {
    color: #ffffff;
}
.navbar-inverse .navbar-nav > li > a {
    color: #ffffff;
}
.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:hover, .navbar-inverse .navbar-nav > .open > a:focus {
    background-color: transparent;
    color: #ffffff;
}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
    text-decoration: none;
    color: #ffffff;
    /*background-image: linear-gradient(#f9adb4, #e96874 50%, #d73c69);*/
    background-image: linear-gradient(#26802A, #26802A 50%, #26802A);
}
.navbar .dropdown-menu {
    text-shadow: none;
}

/*蓋過bootstrap，因為DatePicker會在下面*/
.input-group .form-control {
 z-index: 1;
}

/*datepicker*/
.ui-datepicker .ui-state-active {
border: 1px solid rgb(252, 74, 160);
font-weight: normal;
color: #212121;
}

.ui-datepicker{
 z-index: 1051 !important;
}


.ui-datepicker .ui-state-highlight {
    font-weight:bolder;
color: #173FDF;
}

/*angularjs*/
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
display: none !important;
}


.loading {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    opacity: 0.2;
    background-color: #fff;
    z-index: 99;
    text-align: center;
}
        
.loading-image {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -32px; /* -1 * image width / 2 */
    margin-top: -32px; /* -1 * image height / 2 */
    display: block;
    z-index: 100;
    min-height: 40px;
    min-width: 40px;
}

.desc-label{
   color: navy;
   padding-top: 5px;
}

.wrapword{
white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
white-space: -pre-wrap;      /* Opera 4-6 */
white-space: -o-pre-wrap;    /* Opera 7 */
white-space: pre-wrap;       /* css-3 */
word-wrap: break-word;       /* Internet Explorer 5.5+ */
word-break: break-all;
white-space: normal;
}

.btn-link
{
  padding: 0px;
}


input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
    background-color: #ffffff !important; 
}



.btn-default:hover {
    color:#FFF;
    background-image: -webkit-linear-gradient(#51D633, rgba(76,173,76,1) 50%, rgba(76,173,76,0.85));
    background-image: linear-gradient(#51D633, rgba(76,173,76,1) 50%, rgba(76,173,76,0.85));
    border: 1px solid #242525;
}

.btn-default {
    color:#FFF;
    background:#319235;
    border-color: #474949;
}

.btn-default {
    background-image: -webkit-linear-gradient(#319235, #319235 50%, #319235);
    background-image: linear-gradient(#319235, #319235 50%, #319235);
}

.btn-warning {
  color: #ffffff;
  background-color: #d47500;
  border-color: #d47500;
}
.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.btn-warning.active,
.open .dropdown-toggle.btn-warning {
  color: #ffffff;
  background-color: #ab5e00;
  border-color: #975300;
}

.btn-warning:active,
.btn-warning.active,
.open .dropdown-toggle.btn-warning {
  background-image: none;
}
.btn-warning.disabled,
.btn-warning[disabled],
fieldset[disabled] .btn-warning,
.btn-warning.disabled:hover,
.btn-warning[disabled]:hover,
fieldset[disabled] .btn-warning:hover,
.btn-warning.disabled:focus,
.btn-warning[disabled]:focus,
fieldset[disabled] .btn-warning:focus,
.btn-warning.disabled:active,
.btn-warning[disabled]:active,
fieldset[disabled] .btn-warning:active,
.btn-warning.disabled.active,
.btn-warning[disabled].active,
fieldset[disabled] .btn-warning.active {
  background-color: #d47500;
  border-color: #d47500;
}
.btn-warning .badge {
  color: #d47500;
  background-color: #ffffff;
}

     /*移除modal右方的scrollbar*/
    .modal{overflow:hidden!important;}


/*.ngCell .btn {
    padding: 1px 3px 1px 3px;
}*/


/*出現modal-body捲軸 */Ｆ
.modal-dialog{
    overflow-y: initial !important
}
/*出現modal-body捲軸 */
.modal-body{
    overflow-y: auto;
}

.red {
    color: red;
}

.navy{
   color: navy;
}

.blue{
   color: blue;
}



.btn-circle {
  width: 30px;
  height: 30px;
  text-align: center;
  padding: 6px 0;
  font-size: 12px;
  line-height: 1.428571429;
  border-radius: 15px;
}

.btn-circle44 {
  width: 44px;
  height: 44px;
  text-align: center;
  padding: 6px 0;
  font-size: 12px;
  line-height: 1.428571429;
  border-radius: 22px;
}
.btn-circle.btn-lg {
  width: 50px;
  height: 50px;
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.33;
  border-radius: 25px;
}
.btn-circle.btn-xl {
  width: 80px;
  height: 80px;
  padding-top: 16px;
  font-size: 24px!important;
  line-height: 1.33;
  border-radius: 40px;
}
.btn-circle.btn-xl-en {
  width: 80px;
  height: 80px;
  padding-top: 26px;
  font-size: 20px!important;
  line-height: 1.33;
  border-radius: 40px;
}
.btn-circle.btn-xl-two-line {
  width: 80px;
  height: 80px;
  padding-top: 7px;
  font-size: 24px!important;
  line-height: 1.33!important;;
  border-radius: 40px;
}
.btn-circle.btn-xl-two-line.active, btn-xl-two-line:hover {
  line-height: 1.33!important;
}

.btn-circle.btn-xl-two-line-en {
  width: 80px;
  height: 80px;
  padding-top: 15px;
  font-size: 20px!important;
  line-height: 1!important;
  border-radius: 40px;
}
.btn-circle.btn-xl-two-line-en.active, btn-xl-two-line-en:hover {
  line-height: 1!important;
}

.btn-circle.btn-xl-90 {
  width: 90px;
  height: 90px;
  padding-top: 16px;
  font-size: 24px!important;
  line-height: 1.33;
  border-radius: 45px;
}


.span-circle44 {
    display: inline-block;
    font-size: 22px;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    background-color: #777;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    padding: 6px 0;
    line-height: 1.428571429;
    border-width:1px;
}




/*--圓型的checkbox ---------------------------------------- */
.cb-circle input[type=checkbox] {
  display: none;
}
/* 
- Style each label that is directly after the input
- position: relative; will ensure that any position: absolute children will position themselves in relation to it
*/

.cb-circle input[type=checkbox] + label {
  position: relative;
  height: 44px;
  width: 44px;
  display: block;
  border-radius: 50%;
  border: solid 3px #96c350;
  cursor: pointer;
}
/* Provide a border when hovered and when the checkbox before it is checked */

.cb-circle input[type=checkbox] + label:hover,
.cb-circle input[type=checkbox]:checked + label {
  border: solid 3px #96c350;
  /* Soften the jagged edge */
}
/* 
- Create a pseudo element :after when checked and provide a tick
- Center the content
*/

.cb-circle input[type=checkbox]:checked + label:after {
    font-family: 'Glyphicons Halflings';
    content: "\e013";
  /*content: '\2714';*/
  /*content is required, though it can be empty - content: '';*/
  height: 1em;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  color: #96c350;
  line-height: 1;
  font-size: 30px;
  text-align: center;
}
/*--正方型的checkbox ---------------------------------------- */

/* Base for label styling */
.cb-square [type="checkbox"]:not(:checked),
.cb-square [type="checkbox"]:checked {
  position: absolute;
  left: -9999px;
}
.cb-square [type="checkbox"]:not(:checked) + label,
.cb-square [type="checkbox"]:checked + label {
  position: relative;
  padding-left: 30px;
  cursor: pointer;
}

/* checkbox aspect */
.cb-square [type="checkbox"]:not(:checked) + label:before,
.cb-square [type="checkbox"]:checked + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 14px;
    width: 28px;
    height: 28px;
    border: 2px solid #96c350;
    background: #f8f8f8;
    border-radius: 3px;
    /* box-shadow: inset 0 1px 3px rgba(0,0,0,.3); */
}
/* checked mark aspect */
.cb-square [type="checkbox"]:not(:checked) + label:after,
.cb-square [type="checkbox"]:checked + label:after {
    font-family: 'Glyphicons Halflings';
    content: "\e013";
    position: absolute;
    top: 18px;
    left: 2px;
    font-size: 24px;
    line-height: 0.8;
    color: #96c350;
    /* transition: all .2s; */
}
/* checked mark aspect changes */
.cb-square [type="checkbox"]:not(:checked) + label:after {
  opacity: 0;
  transform: scale(0);
}
.cb-square [type="checkbox"]:checked + label:after {
  opacity: 1;
  transform: scale(1);
}
/* disabled checkbox */
.cb-square [type="checkbox"]:disabled:not(:checked) + label:before,
.cb-square [type="checkbox"]:disabled:checked + label:before {
  box-shadow: none;
  border-color: #bbb;
  background-color: #ddd;
}
.cb-square [type="checkbox"]:disabled:checked + label:after {
  color: #999;
}
[type="checkbox"]:disabled + label {
  color: #aaa;
}
/* accessibility */
/*.cb-square [type="checkbox"]:checked:focus + label:before,
.cb-square [type="checkbox"]:not(:checked):focus + label:before {
  border: 1px dotted blue;
}*/

/* hover style just for information */
/*.cb-square label:hover:before {
  border: 1px solid #4778d9!important;
}*/

/* 修正show modal open時，捲動到主劃面*/
/*body.modal-open {
    overflow: hidden;
    position:fixed;
    width: 100%;
}*/

/* 修正ngGrid總頁數位置*/
.ngGridMaxPagesNumber {
     vertical-align: top; 
}

.btn{
    border-radius:8px;
}


input[type=checkbox], input[type=checkbox]{
    width: 16px;
    height: 16px;
}

.checkbox input[type=checkbox], .checkbox-inline input[type=checkbox], .radio input[type=radio], .radio-inline input[type=radio] {
    position: relative;
}

.ngSelectionCell {
    margin-left: 4px;
}


.tab-content>.active {
    display: block;
    padding-top: 8px;
}



.badge-danger {
    color: #fff;
    background-color: #dc3545;
}