@charset "utf-8";
@import url("animate.min.css");
* {margin:0; padding:0; -webkit-box-sizing: border-box;  -moz-box-sizing: border-box;  box-sizing: border-box;}
body { font-family:"Microsoft YaHei",Verdana, Geneva, sans-serif ; font-size:14px; line-height:20px; color:#666666; background:#121529;  }
ul,li {list-style:none;}
img { border:none; width:auto; max-width:100%;}
a {text-decoration:none; color:#444444;}
a:hover {text-decoration:none; color:#e10718;}
.clear {clear:both;}
.fl { float:left}
.fr { float:right;} 
.red { color:#F00}
html,body{height:500%;}

.body { width:100%; }
.tool { width:80px; position:fixed; top:50%; right:0px; height:500px; margin-top:-250px; background-color:#2767ae; text-align:center; padding:10px 0 ; border-radius:10px;}
.tool li{ margin:20px 0;}

@media only screen and (max-width: 640px) {
.tool  { height:500px; top: 60%}
}

.jinggao li { background:#FF5722; color: #fff; padding: 10px; border-radius:10px; margin:5px 10px; }
.header { height:30px;margin-top:10px; line-height:30px; font-size:14px; background:#333; color:#fff; overflow:hidden}
.header .tit2 { padding-left:20px;}
.header .type { padding-right:20px;}
.header .layui-icon-refresh { float: right; margin-right: 10px;}

#list { padding-right: 80px; }

.orderlist {}
.orderlist li { float:left; width:18.8%; margin:15px 0.5% 0px 0.5%;  border-radius:5px; } 
.orderlist li .top { text-align:center;height:30px;line-height:29px;color:#fff;border-top-left-radius:5px;border-top-right-radius:5px;text-align:left;background:#5fd79b; position:relative; text-indent:5px;}
.orderlist li .top span { position:absolute; right:5px; top:7px; font-size:12px; background:#909; color:#fff; float:right; border-radius:5px; padding:0 3px;  height:16px; line-height:16px;text-align:center;text-indent:0px;}
.orderlist li .top em{font-size: 12px;background: #d90a0a;color: #fff;float: left;border-radius: 5px;padding: 0 5px;height: 16px;line-height: 16px;text-align: center;text-indent: 0px; margin-top:7px; margin-left:3px;}


.orderlist li .top.step0 {background:#79e68d; color:#fff;}
.orderlist li .top.step1 {background:#21c7f7; color:#fff;}
.orderlist li .top.step2 {background:#ef7325; color:#fff;}
.orderlist li .top.step3 {background:#000; color:#fff;}
.orderlist li .top.step4 {background:#888; color:#fff;}
.orderlist li .top.step5 {background:#adae2d; color:#fff;}

.orderlist li .cen {font-size:14px; border-bottom-left-radius:8px;border-bottom-right-radius:8px;background:#fff; border-bottom:#CCC 1px dashed; padding:5px; line-height:22px;}
.orderlist li .cen .item { display:block; width:100%; text-align:left;}
em,i {font-style:normal}
.orderlist li .cen .item em{ font-size:15px; }

.orderlist li .cen i { font-style:normal; font-size:12px; line-height:16px;}
.orderlist li .cen i.step0 { background:#79e68d; color:#fff; padding:0 3px;}
.orderlist li .cen i.step1 { background:#1b91b3; color:#fff; padding:0 3px;}
.orderlist li .cen i.step2 { background:#7068de; color:#fff; padding:0 3px;}
.orderlist li .cen i.step3 { background:#ef7325; color:#fff; padding:0 3px;}

.orderlist li .cen p.beizhu { color:#2b6cb6; font-weight:bold;}
.orderlist li .cen p.qjmm { color:#9f2bb6; font-weight:bold;}


.orderlist li .bot {  border-top-left-radius:8px;border-top-right-radius:8px;  border-top:#CCC 1px dashed; background:#fff;}
.orderlist li .bot .fl{margin:15px 0 0 2%;   border-radius:5px; background:#4fafab; color:#FFF; font-size:16px; line-height:30px; height:30px; width:65px; text-align:center;}
.orderlist li .bot .fr{ margin-top:5px;  font-size:12px; color:#999; height:30px; width:90px; margin-right:2%; text-align:right;}
.orderlist li .bot .fr p { font-size:20px; font-weight:bold; padding-top:5px; color:#575757; }
.orderlist li .bot .fr span p ,.orderlist li .bot .fr span  {  color:#ff0000}

.orderlist li .bot .dizhi , .orderlist li .bot .dianhua{ padding:0px 5px;}
.orderlist li .bot .dizhi{ padding-top:0px;}
.orderlist li .bot .dianhua{ padding-top:10px;}

.orderlist li .peisong {   border-top:#CCC 1px dashed; background:#2e6f60;; padding:5px 2px;}
.orderlist li .peisong_str p{ padding:0px 3px; color:#FFF; font-size:14px;}
.orderlist li .peisong_str p.step0{ color:#F4FF00} /*待接单*/
.orderlist li .peisong_str p.step1{ color:#ffffff} /*取餐中*/
.orderlist li .peisong_str p.step4{ color:#9d9d9d} /*已取消*/

.orderlist li .peisong_tishi {padding:0px 3px; color:#FFF; font-size:14px;}
.orderlist li .peisong_tishi span {text-align: center; padding-bottom: 5px;display: block;margin: 0px;color:#fffb00;font-weight: bold;}
.orderlist li .peisongmsg {padding:0px 3px; color:#FFF; font-size:14px;}

.orderlist li .foot { line-height:20px; border-bottom-left-radius:5px;border-bottom-right-radius:5px; background:#666; color:#fff; padding:0 8px;}
@media only screen and (max-width: 840px) {
.orderlist li { width:23%; }
}
@media only screen and (max-width: 640px) {
.orderlist li { width:48%; }
}




.foodlist {}
.foodlist li { float:left; width:18%; margin:15px 1% 0px 1%;  border-radius:5px; } 
.foodlist li .top {line-height:30px;color:#fff;border-top-left-radius:5px;border-top-right-radius:5px;text-align:center;background:#5fd79b;}
.foodlist li .top.on {background:#21c7f7; color:#fff;}
.foodlist li .top p { height:22px; line-height:22px;}

.foodlist li .cen { font-weight:bold;font-size:18px; border-bottom-left-radius:8px;border-bottom-right-radius:8px;background:#fff; border-bottom:#CCC 1px dashed; padding:15px; line-height:25px;}
.foodlist li .cen p.beizhu  { color:#2b6cb6; font-weight:bold; font-size:14px;}


.foodlist li .bot { height:60px; border-top-left-radius:8px;border-top-right-radius:8px;  border-top:#CCC 1px dashed; background:#fff;}
.foodlist li .bot .fl{margin:15px 0 0 5%;   border-radius:8px; background:#4fafab; color:#FFF; font-size:16px; line-height:30px; height:30px; width:60px; text-align:center;}	
.foodlist li .bot .fr{ margin-top:5px;  font-size:12px; color:#999; height:30px; width:90px; margin-right:5%; text-align:right;}
.foodlist li .bot .fr p { font-size:20px; font-weight:bold; padding-top:5px; color:#575757; }
.foodlist li .bot .fr span p ,.foodlist li .bot .fr span  {  color:#ff0000}

.foodlist li .foot { height:30px; line-height:30px; border-bottom-left-radius:5px;border-bottom-right-radius:5px; background:#666; color:#fff; padding:0 8px;}
@media only screen and (max-width: 840px) {
.foodlist li { width:23%; }
}
@media only screen and (max-width: 640px) {
.foodlist li { width:48%; }
}

.tan { width:100%; height:100%; position:fixed; top:0px; left:0px; background:rgba(0,0,0,0.7); z-index:9; padding-top:12%; display:none}
.tan a { display:block; width:200px; height:50px; line-height:50px; background:#21c7f7; color:#fff; text-align:center; margin:3% auto;border-radius:8px; font-size:18px;}

@media only screen and (max-width: 640px) {
	.tan {  padding-top:25%;}
	.tan a{  margin:12% auto;}
}

.load { width:100%; height:100%; position:fixed; top:0px; left:0px; background:rgba(0,0,0,0.7); z-index:20; padding-top:50%; display:none; color:#fff; text-align:center;}
.load span { position:absolute; top:10px; right:10px;  height:30px; background:#999; color:#fff; border-radius:5px; line-height:30px; text-align:center;  z-index:9; padding:0 10px;}


.quyuxuanze {
	position:fixed;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.8);
	z-index:8;
	padding-top:5%;
	/*display:none;*/
}
.quyuxuanze li { display:block; width:200px; height:50px; line-height:50px; background:#21c7f7; color:#fff; text-align:center; margin:3% auto;border-radius:8px; font-size:18px;}
.quyuxuanze span { position:absolute; top:10px; right:10px; width:30px; height:30px; background:#fff; color:#000; border-radius:50%; line-height:30px; text-align:center; font-weight:bold; z-index:9}
.quyuxuanze h2 {text-align: center;color: #fff;}
@media only screen and (max-width: 460px) {
	 .quyuxuanze {  padding-top:20%;}
	 .quyuxuanze li{  margin:10% auto;}
}


.GetData {  padding-top:10px;}
.GetData li {margin:5px 1%; width:48%; max-width:180px; height:39px; line-height:39px; text-align:center; color:#fff; background-color:#30d1a9; border-radius:5px;float:left; font-size:16px }
.GetData li.off { background-color:#999}


/*背景闪送动画*/
.shan{-moz-animation:bgshan .5s infinite;-webkit-animation:bgshan .5s infinite; display:block}
@-moz-keyframes bgshan{
0%{background:#ff0000;}
25%{background:#ff00ea;}
50%{background:#1e00ff;}
75%{background:#2c821b;}
100%{background:#e8eb10;}
} 
@-webkit-keyframes bgshan{
0%{background:#ff0000;}
25%{background:#ff00ea;}
50%{background:#1e00ff;}
75%{background:#2c821b;}
100%{background:#e8eb10;}
} 


.peisong_tixing { display: block; text-align: center; background:#ff00ef; color: #fff; }
.peisong_tixing p { display:block; padding:10px 0;}
.peisong_tixing strong {color:#F7FF00}
.JiaGeTiShi { -moz-animation:bgshan .5s infinite;-webkit-animation:bgshan .5s infinite; display:block}
.peisong_msg { color:#fff;}
.peisong_msg p { margin-top:3px;}
.err { background:#FF5722; color:#fff;}
.ok { background:#5FB878; color:#fff;}

.itemtaocan { background:#E8F8FF; border:#01AAED 1px dashed; margin-top:5px; padding:5px;}
.itemtaocan>em{ color:#1587B5;}
.taocanlist .item { padding-left:10px;}


.fanhui { display: none; }

@media only screen and (max-width: 660px) {
.fanhui { display:block; }
}