<style type="text/css"> 
.logo{ width:360px; margin:10px 0 0 0; float:left;} 
.logo img{ float:left;} 
.logo span{ font-size:22px; margin:15px 0 0 20px; float:left;}

.progress{ width:450px; height:60px; margin-top:0; padding:0 0 20px 0; float:right; } 
.progress ul{ background:#f4f4f4;  border-radius:20px; }
.progress li{ width:150px; height:18px; padding:2px 0 1px 0; text-align:center; position:relative; color:#999999; z-index:2;float:left; } 
.step1::before{ position:absolute; right: 0; top:53px; content:' '; width:50%; height:2px; background:#FF0000;}
.step1::after{ position:absolute; left: 0; top:53px; content:' '; width:50%; height:2px; background:#FF0000; } 
.step1 .number{ background:#FF0000; } 
.step0::before{ position:absolute; right: 0; top:53px; content:' '; width:50%; height:2px; background: #CCC;}
.step0::after{ position:absolute; left: 0; top:53px; content:' '; width:50%; height:2px; background:#CCC; } 

.step0 .number{ background:#ccc; } 
.step .ttl{ text-align:center; padding:10px 0 10px 0; font-weight:bold; font-size:14px; }
.step .number{ width:21px; height:21px; z-index:2; position: relative; line-height:20px; text-align:center; margin:0 auto; border-radius:40px;  color:#fff;} 
.step .meta{ padding:10px 0 10px 0; }
 
</style>
<div class="main_bar" style="padding:10px 0 0 0; height:70px; ">
	<div class="main"> 
		<div class="logo"><a href="index.php"><img src="<{$__IMG__}><{$UQCMS.site_logo}>"/></a></div>
		<div class="progress <{if $smarty.get.a == ''}>p1<{elseif $smarty.get.a == 'settle'}>p2<{elseif $smarty.get.a == 'finish'}>p3<{/if}>">
			<ul> 
				<li class="step step<{if $smarty.get.a == 'settle'}>1<{else}>0<{/if}>">
					<div class="ttl">购物车</div>
					<div class="number">√</div>  
				</li>
				<li class="step step0">
					<div class="ttl">确认订单</div>
					<div class="number">√</div> 
				</li>
				<li class="step step0">
					<div class="ttl">完成付款</div>
					<div class="number">√</div> 
				</li> 
			</ul>
		</div>  
	</div>
</div>