html, body { 
}

::-webkit-input-placeholder {
   font-size: 13px;
    color:#c0c0c0 !important;
}

:-moz-placeholder { /* Firefox 18- */
     font-size: 13px;
      color:#c0c0c0 !important;
}

::-moz-placeholder {  /* Firefox 19+ */
     font-size: 13px;
      color:#c0c0c0 !important;
}

:-ms-input-placeholder {
      font-size: 13px;
       color:#c0c0c0 !important;
}

::placeholder {
    font-size: 13px;
    color:#c0c0c0 !important;
}

body { 
	font-family: 'Noto Sans TC', sans-serif;
	 font-size: 14px;
}

.hide {
	display:none;
}

.clickable{
    cursor: pointer;
    color:blue;
    text-decoration: underline;
}

fieldset.fieldset-border {
    border: 1px groove #ddd !important;
    padding: 0 1.4em 1.4em 1.4em !important;
    margin: 0 0 1.5em 0 !important;
    -webkit-box-shadow:  0px 0px 0px 0px #000;
            box-shadow:  0px 0px 0px 0px #000;
}

legend.fieldset-border {
	border:none;
	width:100px;
    font-size: 12px !important;
    text-align: left !important;
}

.loginUserArea {
    margin:3px;
}


.loginUserArea span {
	display:inline-block;
	padding:0.5rem;
	color:#000000;
}

@media only screen and (min-width: 768px) {
  /* For desktop: */
	.fixed-top {
	  position: inherit;
	}
	
	.container {
	    max-width: 100%;
	}
	
	.mt-5, .my-5 {
	    margin-top: 1rem !important;
	}
}

/* 選單 */
.navbar-nav .nav-link {
  padding-left: 0.5rem;
}

.navbar-light .navbar-nav a {
    margin: 3px;
}

.navbar-light .navbar-nav .nav-link.active {
  background-color: #007bff;
  color: #ffffff;
}

.navbar-light .navbar-nav .nav-link{ 
     color: #007bff;
     border-radius:0.25rem;
}

.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {
  color: #ffffff;
  background-color: #007bff;
}

div.loadingdiv {
    height: 100%;
    width: 100%;
    /*100%覆蓋網頁內容, 避免user在loading時進行其他操作*/
    position: fixed;
    z-index: 99999;
    /*須大於網頁內容*/
    top: 0;
    left: 0;
    display: none;
    background: #000;
    opacity: 0.6;
    text-align: center;
}

div.loadingdiv img {
    position: relative;
    vertical-align: middle;
    text-align: center;
    margin: 0 auto;
    margin-top: 50vh;
}

table.table tr.alt {
    background-color: #dce3f4;
}

.table-hover tbody tr:hover {
  background-color: yellow;
}

.inline-flex {
	display:inline-flex;
}

.flex-auto {
	flex: auto;
}
.text-center {
	text-align: center;
}

.text-left {
	text-align: left;
}

.center-font16 {
	text-align: center;
	font-size:16px
}

.margin-zero {
	margin : 0 auto;
}

.width85{
	width:85%;
}

.width100{
	width:100px;
}

.width140{
	width:140px;
}

.width200{
	width:200px;
}

.width250{
	width:250px;
}

.width300{
	width:300px;
}

.width400{
	width:400px;
}

.width500{
	width:500px;
}

.width30rem {
	width:30rem
}

.m-left10{
	margin-left:10px;
}

.m-left15{
	margin-left:15px;
}


.m-left20{
	margin-left:20px;
}

.m-auto{
	margin:auto;
}

.vertical-top {
	vertical-align:top;
}

.margin-left-padding10 {
	padding-left: 10px;
	margin:auto;
}

.text-left-padding30 {
	text-align: left;
	padding-left: 30px;
}

.right-padding5 {
 	padding-right: 5px;
}

.right-padding10 {
 	padding-right: 10px;
}

.right-padding15 {
 	padding-right: 15px;
}

.right-padding18 {
 	padding-right: 18px;
}

.right-padding25 {
 	padding-right: 25px;
}

.right-padding30 {
 	padding-right: 30px;
}


.left-padding10 {
	padding-left: 10px;
}


.left-padding15 {
	padding-left: 15px;
}

.left-padding25 {
	padding-left: 25px;
}

.left-padding30 {
	padding-left: 30px;
}


.float-right {
	float: right;
}

.float-center {
	float: center;
}

.font16 {
	font-size:16px;
}

.font18 {
	font-size:18px;
}

.nowrap{
	white-space: nowrap;
}