@charset "UTF-8";
body {
	background-color: lightgrey;
}

.container {
	line-height: 30px;
	background-color: white;
	box-shadow: 3px;
	border-radius: 5px;
	font-size: 12px;
	font-family: "Droid Sans","微軟正黑體";
	background-color: lightgrey;
	margin-top: 10px;
	margin-bottom: 10px;
}
.dialogContainer{
	font-family: "Droid Sans","微軟正黑體";
}
.form-horizontal {
	background-color: white;
}

.input-xs {
	margin-top: 3px;
	margin-bottom: 3px;
	height: 24px;
	padding: 0px 3px;
	font-size: 10px;
	line-height: 1.5;
	border-radius: 5px;
}

div {
	/*
	border-style: solid;
 	border-width: 1px;
 	*/
	
}

.control-label {
	background-color: lightblue;
	text-align: right;
	border-radius: 3px;
}

.contorl-bar {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

.input-bar {
	margin: 0px;
	margin-top: 10px;
	margin-bottom: 10px;
	padding: 0px;
	padding-bottom: 5px;
	border-bottom-width: 3px;
	border-bottom-style: solid;
	border-bottom-color: lightgray;
}

.glyphicon {
	margin-right: 5px;
	vertical-align: middle;
	text-align: center;
}
.datetime {
	font-size: 8px;
	color: silver;
	font-weight: bold;
}
.title{
/* 	text-align: center; */
	border-bottom:3px solid gray;
	padding: 10px;
}
.sub-title{
	border-bottom:3px solid gray;
	padding: 10px;
}
.table tr td {
/* 	white-space: nowrap; */
}
.table thead tr th {
	vertical-align: middle;
	text-align: center;
	line-height: 15px;
}

.form-horizontal {
	margin: 3%;
	padding: 1%;
	box-shadow: none;
	border-radius: none;
}

.form-group {
	margin: 2px;
	padding: 2px;
}

.form-horizontal .control-label {
	margin-top: 0px;
	margin-botton: 0px;
	padding-top: 0px;
	padding-botton: 0px;
}
a span{
	padding-right: 2px;
}
.table a span{
	padding-right: 0px;
}
.location-text{
 	font-weight: bold;
}
.inner-addon { 
    position: relative; 
}

.inner-addon .fa {
  position: absolute;
  padding-top: 11px;
  padding-left: 25px;
  pointer-events: none;
	color: lightgray;
}
.left-addon .fa  { left:  0px;}
.right-addon .fa { right: 0px;}

.left-addon input  { padding-left:  30px; }
.right-addon input { padding-right: 30px; }
.table tr td{
/* 	white-space:nowrap; */
}
.table tbody tr:hover{
	background-color: lightgray;
	font-weight: normal !important;
}
.notFound{
	color: red;
}
.error-message{
	color: red;
	float: both;
}
.valid-message{
	color: red;
}
.waitting-msg{
	font-size: medium;
}

.animate-container {
    position:relative;
    margin-bottom:-1px;
    width: 300px;
    text-align:center;
    border:1px solid black;
    line-height:40px;
}
.repeat-container {
    position:absolute;
}
.animate-container.ng-move {
    transition:all 1s;
    opacity:0;
    max-height:0;
}
.animate-container.ng-move-active {
    opacity:1;
    max-height:40px;
}
.animate-container.ng-enter {
    transition:left 0.5s, max-height 1s;
    left:-300px;
    max-height:0;
}
.animate-container.ng-enter-active {
    left:0px;
    max-height:40px;
}
.animate-container.ng-leave {
    transition:left 0.5s, max-height 1s;
    left:0px;
    max-height:40px;
}
.animate-container.ng-leave-active {
    left:-300px;
    max-height:0;
}

.waitting-container{
	padding: 5px;
	z-index: 100;
}
.waitting-msg{
	padding-left: 10px;
}

.checkboxShift{
		float: left;
		padding-left: 10px;
}

.checkboxLabel:hover {
    cursor: pointer;
}
.focus-highline:focus{
	    border-style: dashed;
 				border-width: 1px;
 				border-color: black;
}

.suspend-status{
	color: red;
	font-weight: bold;
}

.namal-status{
	color: green;
	font-weight: bold;
}
/* .row:nth-child(even) */
tbody tr:nth-child(even){
	background-color: lightskyblue;
}
.odd{
	background-color: white;
}
.even{
	background-color: lightskyblue;
}
.padding0{
	padding: 0 !important;
}
.btn-div{
	padding-left: 3px;
	padding-right: 3px;
}
@media ( min-width : 480px) {
	.container {
		width: 100%;
	}
	.datetime {
		font-size: 10px;
		font-weight: bold;
	}
}

.sortorder:after {
    content: '\25b2';
  }
  .sortorder.reverse:after {
    content: '\25bc';
  }
.outsize-status{
	background-color: #E8CCFF;
}
/* 待備貨 */
.waiting-read-status{
/* 	background-color: white; */
}
/* 已備貨 */
.read-status{
	background-color: #FFFF33;
}
/* 攜出 */
.carry-status{
	background-color: #FFCC22;
}
/* 送達 */
.arrival-status{
	background-color: #FF7744;
}
.over0{
    animation-name: over0;
    animation-duration: 2s;
	animation-fill-mode: forwards;
}
.over1{
    animation-name: over1;
    animation-duration: 2s;
	animation-fill-mode: forwards;
/* 	background-color: #FF0000; */
/* 	color: white; */
}
.over2{
    animation-name: over2;
    animation-duration: 2s;
	animation-fill-mode: forwards;
/* 	background-color: #000000; */
/* 	color: white; */
}
@keyframes over0 {
    to {
    	background-color: #FFB7DD;
    }
}
@keyframes over1 {
    to {
    	background-color: #FF0000;
		color: white;
    }
}
@keyframes over2 {
    to {
    	background-color: #000000;
		color: white;
    }
}
.specially-status{
	background-color: #0000FF;
	color: white;
}

@media ( min-width : 768px) {
	.container {
		width: 80%;
	}
	.datetime {
		font-size: 12px;
	}
}

@media ( min-width : 992px) {
	.container {
		width: 80%;
	}
	.datetime {
		font-size: 12px;
	}
}

@media ( min-width : 1200px) {
	.container {
		width: 1000px;
	}

}

/* @font-face { */
/*   font-family: msjh; */
/*   src: url('../fonts/msjh.ttf'); */
/* } */
.spec1{
	background-color: #0000FF;
	color: white;
}
.spec2{
	background-color: #227700;
	color: white;
}
.spec3{
	background-color: #7A0099;
	color: white;
}
.ngdialog{
	z-index: 99;
}
.clearable{
	background: #fff url(data:image/gif;base64,R0lGODlhBwAHAIAAAP///5KSkiH5BAAAAAAALAAAAAAHAAcAAAIMTICmsGrIXnLxuDMLADs=) no-repeat right -10px center;
/*   background: #fff url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD//gAqSW50ZWwoUikgSlBFRyBMaWJyYXJ5LCB2ZXJzaW9uIDEsNSw0LDM2AP/bAEMAAwICAwICAwMDAwQDAwQFCAUFBAQFCgcHBggMCgwMCwoLCw0OEhANDhEOCwsQFhARExQVFRUMDxcYFhQYEhQVFP/bAEMBAwQEBQQFCQUFCRQNCw0UFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFP/EAaIAAAEFAQEBAQEBAAAAAAAAAAABAgMEBQYHCAkKCxAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6AQADAQEBAQEBAQEBAAAAAAAAAQIDBAUGBwgJCgsRAAIBAgQEAwQHBQQEAAECdwABAgMRBAUhMQYSQVEHYXETIjKBCBRCkaGxwQkjM1LwFWJy0QoWJDThJfEXGBkaJicoKSo1Njc4OTpDREVGR0hJSlNUVVZXWFlaY2RlZmdoaWpzdHV2d3h5eoKDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uLj5OXm5+jp6vLz9PX29/j5+v/AABEIAA4ADgMBEQACEQEDEQH/2gAMAwEAAhEDEQA/APSviH8Q/il+xv8AHvVdV1XVW8ceHPFTS3UUN7ceWtwq4CgKAfIlh3RplV2OmOM4Edbgdj+yFovxX+Let+I/iprnji70fTdbU2sFvaLFMs7RyYykMgdIYosOijG9izknq0gwDRP2QtR+LX7QfjjXPip4jXxJpum3ItoLayaSBp1eISQocY8mKJJV+RGJZ8kt94yFwNP9nj9nfx58Ffi1460LQfHVrF4VS2guI4ru0a5eZpWbyneLKKkqrDIjOjYcbDt6BE2A/9k=) no-repeat right -15px center; */
  border: 1px solid #999;
  padding: 3px 18px 3px 4px;     /* Use the same right padding (18) in jQ! */
  border-radius: 3px;
  transition: background 0.4s;
}
.clearable.x  { background-position: right 15px center; } /* (jQ) Show icon */
.clearable.onX{ cursor: pointer; }              /* (jQ) hover cursor style */
.clearable::-ms-clear {display: none; width:0; height:0;} /* Remove IE default X */

/* input:required:invalid, input:focus:invalid { */
/*     background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAT1JREFUeNpi/P//PwMpgImBRMACY/x7/uDX39sXt/67cMoDyOVgMjBjYFbV/8kkqcCBrIER5KS/967s+rmkXxzI5wJiRSBm/v8P7NTfHHFFl5mVdIzhGv4+u///x+xmuAlcdXPB9KeqeLgYd3bDU2ZpRRmwH4DOeAI07QXIRKipYPD35184/nn17CO4p/+cOfjl76+/X4GYAYThGn7/g+Mfh/ZZwjUA/aABpJVhpv6+dQUjZP78Z0YEK7OezS2gwltg64GmfTu6i+HL+mUMP34wgvGvL78ZOEysf8M1sGgZvQIqfA1SDAL8iUUMPIFRQLf+AmMQ4DQ0vYYSrL9vXDz2sq9LFsiX4dLRA0t8OX0SHKzi5bXf2HUMBVA0gN356N7p7xdOS3w5fAgcfNxWtn+BJi9gVVBOQfYPQIABABvRq3BwGT3OAAAAAElFTkSuQmCC"); */
/*     background-repeat: no-repeat; */
/*     -moz-box-shadow: none; */
/*     background-position: right 10px; */
/*   } */
/* input:required:valid { */
/*    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAZZJREFUeNpi/P//PwMpgImBRMAy58QshrNPTzP8+vOLIUInisFQyYjhz98/DB9/fmT48/+35v7H+8KNhE2+WclZd+G0gZmJmYGThUNz1fUVMZtvbWT59eUXG9wGZIWMUPj993eJ5VeWxuy8veM/CzPL3yfvH/9H0QBSBDYZyOVm4mGYfn6q4cory5lYmFh+MrEwM/76/YsR7mk2ZjbWP///WP37/y8cqIDhx58fjvtu7XV6//ndT34G/v8FasUsDjKO/+A2PP3wpGLd+TVsfOz8XH6KAT+nHpokcu7h6d9q/BoMxToVbBYqlt9///+1GO4/WVdpXqY/zMqXn13/+vTjI9mj94/y//v9/3e9ZRObvYbDT0Y2xnm///x+wsfHB3GSGLf41jb3rv0O8nbcR66d+HPvxf2/+YZFTHaqjl8YWBnm/vv37yly5LL8+vuLgYuVa3uf/4T/Kd8SnSTZpb6FGUXwcvJxbAPKP2VkZESNOBDx8+9PBm4OwR1TwmYwcfzjsBUQFLjOxs52A2YyKysrXANAgAEA7buhysQuIREAAAAASUVORK5CYII=");  */
/*    background-repeat: no-repeat; */
/*    background-position: right 10px; */
/* } */
/* input.ng-invalid, input:focus.ng-invalid { */
/* 	border:1px solid red; */
/* } */
input.ng-dirty.ng-invalid {
	background: #ffecec;
}
.xs-label, .xs-select{
	font-size: 18pt;
}
.box {
  background-color: #eee; 
  height: 500px;
  overflow-y: auto;
}
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
  display: none !important;
}

.animate-show {
  line-height: 20px;
  opacity: 1;
  padding: 10px;
  border: 1px solid black;
  background: white;
}

.animate-show.ng-hide-add, .animate-show.ng-hide-remove {
  transition: all linear 0.5s;
}

.animate-show.ng-hide {
  line-height: 0;
  opacity: 0;
  padding: 0 10px;
}

.notificationsCount{
	position: absolute;
	top: -1px;
	right: 0px;
	width: 19px;
	height: 22px;
	background-color: red;
	color: white;
	border-radius:2px;
	font-weight: bold;
	padding: 1px;
	display: flex;
justify-content: center; /* align horizontal */
align-items: center; /* align vertical */
 }
 
.padding-right0{
	padding-right: 0px;
}
.padding-left0{
	padding-left: 0px;
}
.padding-horizontal0{
	padding-left: 0px;
	padding-right: 0px;
}

.highlight{
	border: 3px solid red !important;
/* 	border-top: 50px solid red; */
}
.search-highlight{
	font-weight:900;
	color: black;
}
.d-inline{
	display: inline;
}
.col-centered{
    float: none;
    margin: 0 auto;
}


.ngdialog{
	display: flex;
	align-items: center;
	justify-content: center;
}

.ngdialog{
	width:90%;
	margin-left: auto;
	margin-right: auto;
}
@media (min-width: 480px) {
	.ngdialog{
 		width: 400px;
	}
}
.box-center{
	
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.box-horizontal-center{
	
	display: inline-flex;
	align-items: center;
}

.show-broder{
	border:1px blue dashed;
}

/* ng-repeat animation */
/* .fade {  */
/*     transition-property: opacity, max-height; */
/*     transition-duration: 0.5s, 0.5s; */
/*     transition-delay: 0s, 0.5s; */
/*     opacity:0; */
/*     max-height: 0; */
/* } */
/* div{ max-height: 50px; height:auto; } */


./* ng-leave {
     transition: 0.5s;
     opacity:1;
}

.ng-leave-active {
	opacity:0;
} */