TD IMG {
	DISPLAY: block
}
BODY
{
	font-size: 15px;
	font-family: Arial;
	scrollbar-face-color: #FFFFFF; /*捲軸顏色*/
	scrollbar-highlight-color: #8A6E68; /*捲軸左與上內邊框*/
	scrollbar-shadow-color: #8A6E68; /*捲軸右與下內邊框*/
	scrollbar-3dlight-color: #FFFFFF; /*捲軸左與上外邊框*/
	scrollbar-darkshadow-color: #FFFFFF; /*捲軸右與下外邊框*/
	scrollbar-arrow-color: #8A6E68; /*捲軸箭頭*/
	scrollbar-track-color: #FFFFFF; /*捲軸底色*/
	margin-top: 0px;
	margin-bottom: 0px;
	color: #8a6e68;
	background-color: #FFFFFF;
}
TD {
	FONT-SIZE: 15px; FONT-FAMILY: Arial
}
TH {
	FONT-SIZE: 15px; FONT-FAMILY: Arial
}
ul, li {
	list-style: none;
}

A:link
{
	color: #8A6E68;
	text-decoration: none;
}
A:visited
{
	color: #8A6E68;
	text-decoration: none;
}
A:hover
{
	color: #8A6E68;
	text-decoration: none;
}
A:active
{
	color: #FF0000;
	text-decoration: none;
}

a img{border-width:0px;}

.tippy-content {
	white-space: pre-line;
}

.btn-QuestionMark{
	width:22px;
}

div.divShowNewBook {
	overflow: auto;
}

input, select
{
	border: 1px solid #C0C0C0;	
}
input.Number{
	text-align:right;
}
input.login{width:50px;font-size:12px;border:solid; border-color:#A18B86; border-width:1px; color:#A18B86;}
a.ClubNew{width:50px;font-size:12px;border:solid; border-color:#A18B86; border-width:1px; color:#A18B86;}
div.Main
{
	text-align: center;
}

.btnAdd, .btnDel, .btnEdit, .btnOther, .btnCancel {
	color: white;
	padding: 2px 10px 5px 10px !important;
	height: 27px !important;
	cursor: pointer;
}
.btnAdd     
{
    border: 1px groove #008000;
    background-color: #009933;
}
	.btnAdd:hover {
		color: #009933;
		background-color: white;
	}

.btnDel {
	border: 1px groove #FF33CC;
	background-color: #FF0000;
}
	.btnDel:hover {
		color: #FF0000;
		background-color: white;
	}
.btnEdit {
	border: 1px groove #FFCC66;
	background-color: #FF9933;
}
.btnEdit:hover {
		color: #FF9933;
	background-color: white;
}
.btnOther {
	background-color: #0066FF;
	border: 1px groove #99CCFF;
}
	.btnOther:hover {
		color: #0066FF;
		background-color: white;
	}
.btnCancel {
	background-color: #807C5B;
	border: 1px groove #333399;
}
	.btnCancel:hover {
		color: #807C5B;
		background-color: white;
	}
.chat {
	color: hotpink;
	border: 1px solid hotpink;
	background-color: white;
}
	.chat:hover {
		color: white;
		background-color: hotpink;
	}
table.dataFill{}
table.dataFill th{border:1px solid #ddd; text-align:center; padding:0 3px; background-color:#eee;}
table.dataFill td{border:1px solid #ddd; text-align:left; padding:5px 0 3px 5px;}
table.dataFill td input[type="text"], table.dataFill td input[type="password"]{ box-shadow:2px 2px 0 #DDD; border:1px solid #AAA; padding:3px 2px; width:202px;}


#loading {
	position: fixed;
	top: 0;
	width: 100%;
	height: 100%;
	color: #999;
	z-index: 9999;
	background-color: #FFFFFFCC;
	text-align: center;
}

.loading1 {
	position: relative;
	display: inline-block;
	top: 42%;
	width: 100px;
	height: 50px;
}

.loading2 {
	position: absolute;
	top: 0;
	left: 0;
	width: 86px;
	height: 45px;
	background-image: url(../Images/loading1.png);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	z-index: 10;
}

.loading3 {
	position: absolute;
	top: -18px;
	right: -20px;
	width: 70px;
	height: 70px;
	background-image: url(../Images/loading2.png);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	-webkit-animation: loading 3s linear infinite;
	-moz-animation: loading 3s linear infinite;
	-o-animation: loading 3s linear infinite;
}

@-webkit-keyframes loading {
	from {
		-webkit-transform: rotate(0deg);
	}

	to {
		-webkit-transform: rotate(-360deg);
	}
}

@-moz-keyframes loading {
	from {
		-moz-transform: rotate(0deg);
	}

	to {
		-moz-transform: rotate(-360deg);
	}
}

@-o-keyframes loading {
	from {
		-o-transform: rotate(0deg);
	}

	to {
		-o-transform: rotate(-360deg);
	}
}

@keyframes loading {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(-360deg);
	}
}


/* The snackbar - position it at the top and left of the screen */
#Snackbar {
	visibility: hidden; /* Hidden by default. Visible on click */
	min-width: 200px; /* Set a default minimum width */
	margin-left: -100px; /* Divide value of min-width by 2 */
	background-color: #680b79f7; /* Black background color */
	color: #fff; /* White text color */
	text-align: center; /* Centered text */
	border-radius: 6px; /* Rounded borders */
	padding: 10px; /* Padding */
	position: fixed; /* Sit on top of the screen */
	z-index: 9999; /* Add a z-index if needed */
	left: 80%; /* Center the snackbar */
	top: 60px; /* 30px from the top */
	border: 2px solid brown;
}

	/* Show the snackbar when clicking on a button (class added with JavaScript) */
	#Snackbar.show {
		visibility: visible; /* Show the snackbar */
		/* Add animation: Take 0.5 seconds to fade in and out the snackbar.
  However, delay the fade out process for 2.5 seconds */
		-webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
		animation: fadein 0.5s, fadeout 0.5s 2.5s;
	}

/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
	from {
		top: 0;
		opacity: 0;
	}

	to {
		top: 60px;
		opacity: 1;
	}
}

@keyframes fadein {
	from {
		top: 0;
		opacity: 0;
	}

	to {
		top: 60px;
		opacity: 1;
	}
}

@-webkit-keyframes fadeout {
	from {
		top: 60px;
		opacity: 1;
	}

	to {
		top: 0;
		opacity: 0;
	}
}

@keyframes fadeout {
	from {
		top: 60px;
		opacity: 1;
	}

	to {
		top: 0;
		opacity: 0;
	}
}

/*End of The snackbar */

/* OrderState */
.OrderState {
	border: 1px solid gray;
	border-radius: 5px;
	padding: 3px 5px;
	margin: 2px 5px;
}

.OrderState_0 {
	background-color: gray;
	color: black;
}

.OrderState_10 {
	background-color: red;
	color: white;
}

.OrderState_20 {
	background-color: orange;
	color: white;
}

.OrderState_30 {
	background-color: yellow;
	color: blue;
}

.OrderState_40 {
	background-color: green;
	color: white;
}

.OrderState_50 {
	background-color: blue;
	color: white;
}

.OrderState_60 {
	background-color: darkviolet;
	color: white;
}

.OrderState_99 {
	background-color: darkgrey;
	color: white;
}

.PayType {
	border-radius: 5px;
	padding: 3px 5px;
	margin: 2px 5px;
}

.PayType_1 {
	border: 1px solid blue;
	color: blue;
}

.PayType_2 {
	border: 1px solid darkgreen;
	color: darkgreen;
}

.PayType_3 {
	border: 1px solid darkred;
	color: darkred;
}

.PayType_4 {
	border: 1px solid darkgoldenrod;
	color: darkgoldenrod;
}

.PayType_5 {
	border: 1px solid darkmagenta;
	color: darkmagenta;
}

.SendType {
	border: 1px solid gray;
	border-radius: 5px;
	padding: 3px 5px;
	margin: 2px 5px;
}

.SendType_1 {
	border: 1px solid blue;
	color: blue;
}

.SendType_2 {
	border: 1px solid darkgreen;
	color: darkgreen;
}

.SendType_3 {
	border: 1px solid darkred;
	color: darkred;
}


.AddrNumber, .AddrRoom {
	width: 40px !important;
	text-align: right;
	margin: 3px;
}

.ProductImg {
	width: 50px;
	height: 50px;
	background-size: contain;
	background-repeat: no-repeat;
	margin: auto;
	background-position: center;
}