h1, h2, h3, h4, h5{font-family:Microsoft JhengHei,Arial,Helvetica,sans-serif;}
a:focus, a:visited{ outline: none; outline-offset: 0;}

/* CSS Document */
.dis-none{ display: none;}
.dis-block{ display: block;}
.dis-inlineblock{ display:  inline-block;}
a.disabled, button.disabled, .btn.disabled{ pointer-events: none; -webkit-opacity: 0.65; opacity: 0.65;}
.bold{ font-weight: bold;}
.thin{ font-weight: normal;}
.underline{ text-decoration: underline;}
.ellipsis{ display: block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.bradius0 {border-radius: 0px !important;}
.bdr0 {border-width: 0px !important;}
.noshadow {-webkit-box-shadow: none !important;box-shadow: none !important;}
.vertical-middle th, .vertical-middle td{ vertical-align: middle !important;}
.vertical-top th, .vertical-top td{ vertical-align: top !important;}
.vertical-bottom th, .vertical-bottom td{ vertical-align: bottom !important;}

.text-muted{ color: #a2a2a2 !important;}
.alert-info{background-color: #f8f8f8;border-color: #eee; color: #898d9f;}

/* Margin */
.ma15 { margin: 15px !important;}
.ma10 {margin: 10px !important;}
.ma5 { margin: 5px !important;}
.nm {margin: 0px !important;}
.ma-15 {margin: -15px !important;}
.ma-10 {margin: -10px !important;}
.ma-5 { margin: -5px !important;}
.mt15 {margin-top: 15px !important;}
.mt10 { margin-top: 10px !important;}
.mt5 {margin-top: 5px !important;}
.mt0 {margin-top: 0px !important;}
.mt-15 {margin-top: -15px !important;}
.mt-10 {margin-top: -10px !important;}
.mt-5 {margin-top: -5px !important;}
.mr15 {margin-right: 15px !important;}
.mr10 {margin-right: 10px !important;}
.mr5 {margin-right: 5px !important;}
.mr0 {margin-right: 0px !important;}
.mr-15 {margin-right: -15px !important;}
.mr-10 {margin-right: -10px !important;}
.mr-5 {margin-right: -5px !important;}
.mb15 {margin-bottom: 15px !important;}
.mb10 {margin-bottom: 10px !important;}
.mb5 {margin-bottom: 5px !important;}
.mb0 {margin-bottom: 0px !important;}
.mb-15 { margin-bottom: -15px !important;}
.mb-10 {margin-bottom: -10px !important;}
.mb-5 { margin-bottom: -5px !important;}
.ml15 { margin-left: 15px !important;}
.ml10 {margin-left: 10px !important;}
.ml5 {margin-left: 5px !important;}
.ml0 {margin-left: 0px !important;}
.ml-15 { margin-left: -15px !important;}
.ml-10 {margin-left: -10px !important;}
.ml-5 {margin-left: -5px !important;}
/* Padding */
.pa15 {padding: 15px !important;}
.pa10 {padding: 10px !important;}
.pa5 {padding: 5px !important;}
.np {padding: 0px !important;}
.pt15 {padding-top: 15px !important;}
.pt10 { padding-top: 10px !important;}
.pt5 {padding-top: 5px !important;}
.pt0 {padding-top: 0px !important;}
.pr15 {padding-right: 15px !important;}
.pr10 { padding-right: 10px !important;}
.pr5 {padding-right: 5px !important;}
.pr0 { padding-right: 0px !important;}
.pb15 {padding-bottom: 15px !important;}
.pb10 { padding-bottom: 10px !important;}
.pb5 {padding-bottom: 5px !important;}
.pb0 {padding-bottom: 0px !important;}
.pl15 {padding-left: 15px !important;}
.pl10 {padding-left: 10px !important;}
.pl5 {padding-left: 5px !important;}
.pl0 { padding-left: 0px !important;}

/* width pct */
.pct60{ width:60%;}
.pct50{ width:50%;}
.pct40{ width:40%;}
.pct30{ width:30%;}
.pct20{ width:20%;}
.pct18{ width:16%;}
.pct16{ width:16%;}
.pct15{ width:15%;}
.pct14{ width:14%;}
.pct13{ width:13%;}
.pct12{ width:12%;}
.pct10{ width:10%;}
.pct8{ width:8%;}
.pct6{ width:6%;}
.pct4{ width:4%;}
.pct2{ width:2%;}

/* font size */
.fsize12{ font-size: 12px;}
.fsize14{ font-size: 14px;}
.fsize16{ font-size: 16px;}
.fsize18{ font-size: 18px;}
.fsize20{ font-size: 22px;}
.fsize22{ font-size: 20px;}
.fsize24{ font-size: 24px;}
.fsize28{ font-size: 28px;}
.fsize32{ font-size: 32px;}
.fsize36{ font-size: 36px;}
.fsize42{ font-size: 42px;}
.fsize48{ font-size: 48px;}
.fsize64{ font-size: 64px;}

/* gritter-notice-wrapper */
#gritter-notice-wrapper{position:fixed;top:100px;right:50%;margin-right:-200px;width:400px;z-index:9999}#gritter-notice-wrapper.top-left{left:20px;right:auto}#gritter-notice-wrapper.bottom-right{top:auto;left:auto;bottom:20px;right:20px}#gritter-notice-wrapper.bottom-left{top:auto;right:auto;bottom:20px;left:20px}
@media screen and (min-width:768px){#gritter-notice-wrapper.top-left{left:20px;right:auto}#gritter-notice-wrapper.bottom-right{top:auto;left:auto;bottom:20px;right:20px}#gritter-notice-wrapper.bottom-left{top:auto;right:auto;bottom:20px;left:20px}}.gritter-item-wrapper{position:relative;margin:0 0 10px;background-color:rgba(0,0,0,.9);}.gritter-item{display:table;table-layout:fixed;width:100%;color:#eee;padding:15px 30px 15px 15px}.gritter-close{display:none;position:absolute;top:15px;right:10px;font-family:'Glyphicons Halflings';font-weight:400;width:20px;height:20px;line-height:20px;font-size:13px;text-align:center;color:#eee;border-radius:2px}.touch .gritter-close{display:block}.gritter-close:active,.gritter-close:focus,.gritter-close:hover{color:#fff;background-color:#000; text-decoration: none;}.gritter-close:after{content:"\e014"}.gritter-title{font-size:14px;font-weight:600;padding:0 0 3px;display:block}.gritter-image{display:table-cell;width:54px;vertical-align:middle}.gritter-image>img{display:block;width:100%;border-radius:50%}.gritter-with-image,.gritter-without-image{display:table-cell;width:100%;vertical-align:middle;padding-left:20px}.gritter-without-image{padding-left:0}.gritter-with-image p,.gritter-without-image p{padding:0;margin:0}.gritter-item-wrapper.gritter-light{background-color:#fff;-webkit-box-shadow:0 0 3px 0 rgba(0,0,0,.15);box-shadow:0 0 3px 0 rgba(0,0,0,.15)}.gritter-item-wrapper.gritter-light .gritter-close,.gritter-item-wrapper.gritter-light .gritter-item{color:#999}.gritter-item-wrapper.gritter-light .gritter-close:active,.gritter-item-wrapper.gritter-light .gritter-close:focus,.gritter-item-wrapper.gritter-light .gritter-close:hover{color:#666;background-color:#eee;}.gritter-item-wrapper.gritter-light .gritter-title{color:#555}

.gritter-item-wrapper.gritter-success{padding-left:45px; color:#fff; background-color:rgba(78,115,37,0.8);-webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.15);box-shadow: 0 0 10px 0 rgba(0,0,0,0.15);}
.gritter-item-wrapper.gritter-success .gritter-item{color:#fff; }
.gritter-item-wrapper.gritter-success:before{position:absolute; left:15px; top:12px; content:"\e013";font-family:'Glyphicons Halflings';font-style: normal;font-variant: normal; font-weight: normal; line-height: 1; font-size:2em; text-transform: none; speak:none;}
.gritter-item-wrapper.gritter-success .gritter-close{ color:#4e7325; background-color:#d2e8b8; transition:all 0.5s ease 0s; display:block !important;}
.gritter-item-wrapper.gritter-success .gritter-close:hover{ color:#fff;  background-color:#4e7325;}

.gritter-item-wrapper.gritter-error{padding-left:45px; color:#fff; background-color:rgba(237,84,102,0.8);-webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.15);box-shadow: 0 0 10px 0 rgba(0,0,0,0.15);}
.gritter-item-wrapper.gritter-error .gritter-item{color:#fff; }
.gritter-item-wrapper.gritter-error:before{position:absolute; left:15px; top:12px; content:"\e014";font-family:'Glyphicons Halflings';font-style: normal;font-variant: normal; font-weight: normal; line-height: 1; font-size:2em; text-transform: none; speak:none;}
.gritter-item-wrapper.gritter-error .gritter-close{ color:#e8263d; background-color:#faccd1; transition:all 0.5s ease 0s; display:block !important;}
.gritter-item-wrapper.gritter-error .gritter-close:hover{ color:#fff; background-color:#e8263d;}

.gritter-item-wrapper.gritter-warning{ padding-left:45px; color:#a98300; background-color:rgba(217,205,158,0.9);-webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.15);box-shadow: 0 0 10px 0 rgba(0,0,0,0.15);}
.gritter-item-wrapper.gritter-warning .gritter-item{color:#a98300; }
.gritter-item-wrapper.gritter-warning:before{position:absolute; left:15px; top:12px; content:"\e107";font-family:'Glyphicons Halflings';font-style: normal;font-variant: normal; font-weight: normal; line-height: 1; font-size:2em; text-transform: none; speak:none;}
.gritter-item-wrapper.gritter-warning .gritter-close{ color:#da9e00; background-color:#fff3d5; transition:all 0.5s ease 0s; display:block !important;}
.gritter-item-wrapper.gritter-warning .gritter-close:hover{ color:#fff; background-color:#da9e00;}

/* hr */
hr {border: none; margin: 20px auto; -webkit-box-sizing: content-box; box-sizing: content-box;}
hr.hr-style-1 {
    background-image: -webkit-repeating-linear-gradient(45deg,#c0c4d2,#c0c4d2 5px,#e8e9ef 0,#e8e9ef 10px);
    background-image: -o-repeating-linear-gradient(45deg,#c0c4d2,#c0c4d2 5px,#e8e9ef 0,#e8e9ef 10px);
    background-image: repeating-linear-gradient(45deg,#c0c4d2,#c0c4d2 5px,#e8e9ef 0,#e8e9ef 10px);
    height: 6px;
}
hr.hr-style-2 {
	background-image: -webkit-repeating-linear-gradient(left,#c0c4d2,#c0c4d2 10px,#e8e9ef 0,#e8e9ef 20px);
	background-image: -o-repeating-linear-gradient(left,#c0c4d2,#c0c4d2 10px,#e8e9ef 0,#e8e9ef 20px);
	background-image: repeating-linear-gradient(90deg,#c0c4d2,#c0c4d2 10px,#e8e9ef 0,#e8e9ef 20px);
	height: 5px;
}

hr.hr-style-3 {
    height: 7px;background-image: -webkit-repeating-linear-gradient(135deg,#ff4961,#ff4961 20px,#28d094 0,#28d094 40px,#85baff 0,#85baff 60px,#ffc06a 0,#ffc06a 80px,#666ee8 0,#666ee8 100px,#1e9ff2 0,#1e9ff2 120px,#414b92 0,#414b92 140px,#ffaad8 0,#ffaad8 160px);
background-image: -o-repeating-linear-gradient(135deg,#ff4961,#ff4961 20px,#28d094 0,#28d094 40px,#85baff 0,#85baff 60px,#ffc06a 0,#ffc06a 80px,#666ee8 0,#666ee8 100px,#1e9ff2 0,#1e9ff2 120px,#414b92 0,#414b92 140px,#ffaad8 0,#ffaad8 160px);
background-image: repeating-linear-gradient(-45deg,#ff4961,#ff4961 20px,#28d094 0,#28d094 40px,#85baff 0,#85baff 60px,#ffc06a 0,#ffc06a 80px,#666ee8 0,#666ee8 100px,#1e9ff2 0,#1e9ff2 120px,#414b92 0,#414b92 140px,#ffaad8 0,#ffaad8 160px);
}


/* modal */
.modal-backdrop{ background-color: #becdd9;}
.modal-content{ border: 0; -webkit-box-shadow: 0 0 25px rgba(0,0,0,0.3); box-shadow: 0 0 25px rgba(0,0,0,0.3); border-radius: 0;}
.modal-title{ font-size: 18px; font-weight: bold;}
.modal-header{ border: 0;  padding: 10px 15px 5px;}
.modal-body, .modal-header{ background-color: #fafafa;}
.modal-footer{ padding: 10px 15px; text-align: center;}
.modal-header .close{ font-size: 30px; opacity: 0.3; line-height: 25px; font-weight: normal;}
.modal-header .close:hover{opacity: 0.6;}

/* form */
.btn{ border-radius: 0; padding: 10px 25px; transition: all 0.3s ease 0s; }
.btn:focus{ outline: none;}
.btn-group-xs>.btn, .btn-xs{padding: 1px 5px; }
.btn-teal, .btn-teal:focus {color: #fff; background-color: #2298a2; border-color: #157c85;}
.btn-teal:hover{color: #fff;  background-color: #18868f; border-color: #117a83;}
.btn-default{ color: #7a7a7a;}
.btn.btn-sm{ padding: 7px 10px; font-size: 12px; line-height: 1.5;}
.form-control{ border-radius: 0;}
.form-group{ margin-left: -15px; margin-right: -15px; margin-bottom: 0;}
.form-group + .form-group{ margin-top: 10px;}
.form-group::before, .form-group::after{ content: ""; display: table; clear: both;}
.control-label{ padding-top: 7px; margin-bottom: 0; margin-top: 0; color: #6f6f6f; font-weight: bold; text-align: right;}

.load-text{margin: 0;  padding: 5px 0; line-height: 24px;}
.help-block{ margin: 0; padding: 7px 0; line-height: 20px; font-size: 12px; color: #999;}

/* pane */
.panel{ -webkit-box-shadow: none; box-shadow: none;}
.panel-heading{ display: table; width: 100%;}
.panel-heading > .panel-title, .panel-heading > .panel-toolbar{display: table-cell; vertical-align: middle;}
.panel-heading > .panel-toolbar{ text-align: right;}
.dropdown-menu .divider { background-color: #d7e0e2; margin: 4px 0;}

.panel-shadow{-webkit-box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);}

.tabs-lg.nav-tabs{ border-bottom:2px solid #eee; margin-bottom: 20px;}
.tabs-lg.nav-tabs li { margin-bottom: 0;}
.tabs-lg.nav-tabs li a{ padding: 10px 30px; font-size: 16px; line-height: 20px; border: 0; font-weight: bold; letter-spacing: 2px; border-radius:0;}
.tabs-lg.nav-tabs li + li{ margin-left: 10px;}
.tabs-lg.nav-tabs li.active a{padding: 10px 30px;  color: #fff;}


label.error{font-weight: normal; font-size: 12px; margin-right: 10px; color: #ed5466; margin-top: 5px;  background-color: #f7f2f2; border-radius: 2px; border: 1px solid #eed3d7; padding: 0 5px;}
.form-control.error{ border: 1px solid #eed3d7; background-color: #f7f2f2;}
.form-control.error[disabled]{border: 1px solid #eed3d7; background-color: #eee;}

/*group title*/
.bs-callout { padding: 6px 20px; margin: 20px 0 15px; border: 1px solid #e0e0e0; border-left-width: 5px;}
.bs-callout h4{font-size: 16px; line-height: 24px; font-weight: bold; margin: 0;}
.bs-callout p{ line-height: 20px; margin: 0;}

.bs-callout.bs-callout-danger{ border-left-color:#ce4844; }
.bs-callout.bs-callout-danger h4{ color: #ce4844;}

.bs-callout.bs-callout-primary{ border-left-color:#337ab7; }
.bs-callout.bs-callout-primary h4{ color:#337ab7;}

.bs-callout.bs-callout-teal{ border-left-color:#2298a2; }
.bs-callout.bs-callout-teal h4{ color:#2298a2;}

.bs-callout.bs-callout-success{ border-left-color:#3c763d; }
.bs-callout.bs-callout-success h4{ color:#3c763d;}

.bs-callout.bs-callout-warning{ border-left-color:#aa6708; }
.bs-callout.bs-callout-warning h4{ color:#aa6708;}

/* ul li table */
.table-fixed{ table-layout: fixed;}
.table-fixed .fixed{ overflow: hidden; display: inline-block; white-space: nowrap; text-overflow: ellipsis;}
.table-list{margin-bottom: 20px; display: table; width: 100%; max-width: 100%; border-spacing: 0; border-collapse: collapse;}
.table-list ul{ display: table-row; margin: 0; padding: 0; list-style: none;}
.table-list li{ display: table-cell; padding: 8px; line-height: 1.42857143; vertical-align: top; }
.table-list .table-head{ display: table-header-group;}
.table-list .table-body{ display: table-row-group;}
.table-list .table-head li{vertical-align: bottom; border-bottom: 2px solid #ddd; font-weight: bold; color: #999;}
.table-list .table-body li{border-top: 1px solid #ddd;}
.mobile-title{ display: none;}
.table-list .table-body li .photo{ width: 60px; height: 60px; margin: 0 auto; text-align: center; -webkit-box-shadow: 0 0 0 1px #ddd; box-shadow: 0 0 0 1px #ddd; background-color: #fff;}
.table-list .table-body li .photo span{ vertical-align: middle; height: 100%; display: inline-block;}
.table-list .table-body li .photo img{ max-width: 60px; max-height: 60px; vertical-align: middle;}

.table-striped .table-body ul:hover, .table-striped.table-hover .table-body ul:hover:nth-of-type(odd){ background-color: #f2f2f2;}
.table-striped .table-body ul:nth-of-type(odd){ background-color: #fafafa;}
.table-bordered li{border: 1px solid #ddd;}

.dropdown-menu.fixed-height, .dropdown-menu .fixed-height{max-height: 300px;overflow-x: hidden; overflow-y: auto;}

/*no data*/
.alert-nodata{ text-align: center; padding-top: 30px;}
.alert-nodata p{ margin-bottom: 0; line-height: 30px; font-size: 18px; color: #999; font-family:Microsoft JhengHei,Arial,Helvetica,sans-serif;}
.alert-nodata img{ max-width: 100%; padding-bottom: 10px;}
.alert-nodata p a{ color: #2298a2; text-decoration: underline;}

/*animation*/
.rockItem{ -webkit-animation: rockItem 1.2s ease-in infinite; animation: rockItem 1.2s ease-in infinite;}
@-webkit-keyframes rockItem {
  0% { -webkit-transform: translateY(0); }
  50% {  -webkit-transform: translateY(-5px);}
  70% { -webkit-transform: translateY(1px); }
  100% { -webkit-transform: translateY(0); }
}

@keyframes rockItem {
  0% { transform: translateY(0);}
  50% { transform: translateY(-5px) ;}
  70% {transform: translateY(1px) ;}
  100% {transform: translateY(0);}
}


/*loading*/
.loading-group{ height: 120px; position: relative; background-color: rgba(255,255,255,0.3);}
.loading-group .loading{left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); top: 50%; background: #fff url("../image/img_load2.gif") no-repeat 10px center; border: 2px solid #ccc; border-radius:5px; -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.2); box-shadow: 0 0 15px rgba(0,0,0,0.2); height: 46px; margin-top: -23px; position: absolute;}
.loading-group .loading p{height: 42px; line-height: 42px; padding-left: 60px; padding-right: 20px; font-size:16px; color:#666;}

body > .loading-group{ z-index: 1060; left: 0; top: 0; right: 0; bottom: 0; position: fixed; height: 100%; display: none;}
body > .loading-group .loading{ width: 96px; height:96px; overflow: hidden; background:#fff url("../image/img_load2.gif") no-repeat center 10px; border: 0; border-radius:0; margin-top: -48px; border-radius: 10px;}
body > .loading-group .loading span{ display: block; padding-top: 60px; text-align: center;}

.modal-body > .loading-group{ position: absolute; z-index: 10002; width: 100%; height: 100%; left: 0; top: 0;}

@media (max-width: 767px) {
	.control-label{ margin-bottom: 10px;}
	.nav-tabs{ border-bottom: 0;}
	.nav-tabs>li{ float: inherit; display: block; margin-bottom:0;}
	.nav-tabs>li + li{ margin-top: 10px;}
	.nav-tabs>li>a{ margin-right: 0;border-bottom-color:transparent; text-align: center;}
	.nav-tabs>li.active>a,.nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover{border-bottom-color:#ff7f00;}
	
	.table-list{display: block;}
	.table-list ul{ display: block; }
	.table-list li{ display: block; width: 100%;}
	.table-list .table-head{ display: none;}
	.table-list .table-body{ display: block;}
	.table-list .table-head li,.table-list .table-body li{ border: 0; text-align: left;}
	.table-list .table-head ul{border-bottom: 2px solid #ddd;}
	.table-list .table-body ul{border-top: 1px solid #ddd;}

	.table-bordered ul{border: 1px solid #ddd;}
	.mobile-title{ display: inline; margin-right: 5px; font-size: 12px; color: #999;}
}