Link to home
Start Free TrialLog in
Avatar of P-Daddy
P-Daddy

asked on

Trouble with floated div text

I have a layout that displays a PO Number. The max length is 35 char. I can't get my test string, "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa" to wrap at width of div.

User generated image
Here's my HTML:

	
	
	
	
	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
	<html xmlns="http://www.w3.org/1999/xhtml"> 
	<head> 
	<meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
	<title>Sales Order Details</title> 
	<link href="http://www.ssgecom.com/QOE/css/style.css" rel="stylesheet" type="text/css" /> 
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
	<script type="text/javascript"> 
	
	
	function toggler(id,newId){ 
	jQuery("#"+id).slideToggle("slow"); 
	if(jQuery("a."+newId).html() == "Read More"){ 
	jQuery("a."+newId).addClass("read-less").html("Read Less"); 
	} 
	else 
	if(jQuery("a."+newId).html() == "Read Less") { 
	jQuery("a."+newId).removeClass("read-less").html("Read More"); 
	} 
	} 
	
	
	function showDiv(divid,moreid,lessid) { 
	document.getElementById(divid).style.display=''; 
	document.getElementById(lessid).style.display=''; 
	document.getElementById(moreid).style.display='none'; 
	} 
	
	function hideDiv(divid,moreid,lessid) { 
	document.getElementById(divid).style.display='none'; 
	document.getElementById(lessid).style.display='none'; 
	document.getElementById(moreid).style.display=''; 
	} 
	
	
	
	function pushAndGo(okcode) { 
	document.getElementById('okcode').value=okcode; 
	document.listForm.submit(); 
	} 
	
	function dlinv(selline) { 
	document.getElementById('invselect').value=selline; 
	document.getElementById('okcode').value='DINV'; 
	document.listForm.submit(); 
	} 
	</script> 
	<style type="text/css"> 
	<!-- 
	.style1 {color: #000000} 
	--> 
	</style> 
	</head> 
	<body> 
	<div id="wrapper"> 
	
	
	
	
	<!---header start---> 
	<div id="top-header"> 
	<div class="header"> 
	<div class="customer-img"> <img src="http://ssgecom.com/QOE/260x235/0000100050.jpg" style="width: 134px;" /> </div> 
	<div class="headerlink"> 
	<div class="toplink"> 
	<ul> 
	<li class="sign-out"><a href="" title="">Sign Out</a></li> 
	
	</ul> 
	</div> 
	<div class="clear"></div> 
	<div class="userinfo"> 
	<div class="username"> <span><span>Gyula Kalman<span class="icon">&nbsp;</span></span></span> </div> 
	<div class="topmenu"> 
	<ul> 
	<li><a href="/sap(cz1TSUQlM2FBTk9OJTNhU1NHREVWX0Q2MF8wOSUzYUhhcFpFTVRrNVNYWTVjN09nZFZWQ01UNFJ3UVlBYl9odnZCUGlyemstQVRU)/bc/gui/sap/its/zwqe/~flNUQVRFPTQ5MTIuMDgwLjA1LjE1====?~okcode[1]=DBRD&~target[1]=_parent" target="_parent" title="Dashboard" ><span>Dashboard</span></a></li> 
	<li><a href="/sap(cz1TSUQlM2FBTk9OJTNhU1NHREVWX0Q2MF8wOSUzYUhhcFpFTVRrNVNYWTVjN09nZFZWQ01UNFJ3UVlBYl9odnZCUGlyemstQVRU)/bc/gui/sap/its/zwqe/~flNUQVRFPTQ5MTIuMDgwLjA1LjE1====?~okcode[1]=CLST&~target[1]=_parent" target="_parent" title="Customer List" class="selected"><span>Customer List</span></a></li> 
	<li><a href="/sap(cz1TSUQlM2FBTk9OJTNhU1NHREVWX0Q2MF8wOSUzYUhhcFpFTVRrNVNYWTVjN09nZFZWQ01UNFJ3UVlBYl9odnZCUGlyemstQVRU)/bc/gui/sap/its/zwqe/~flNUQVRFPTQ5MTIuMDgwLjA1LjE1====?~okcode[1]=STAN&~target[1]=_parent" target="_parent" title="Standings" ><span>Standings</span></a></li> 
	<li><a href="/sap(cz1TSUQlM2FBTk9OJTNhU1NHREVWX0Q2MF8wOSUzYUhhcFpFTVRrNVNYWTVjN09nZFZWQ01UNFJ3UVlBYl9odnZCUGlyemstQVRU)/bc/gui/sap/its/zwqe/~flNUQVRFPTQ5MTIuMDgwLjA1LjE1====?~okcode[1]=PROD&~target[1]=_parent" target="_parent" title="Tracking" ><span>Tracking</span></a></li> 
	<!--<li><a href="#" title="Search"><span>Search</span></a></li>--> 
	</ul> 
	</div> 
	</div> 
	<div class="logo"> <img src="http://www.ssgecom.com/QOE/images/logo.png" alt="BSN Sports" title="BSN Sports" /> </div> 
	</div> 
	</div> 
	</div> 
	<!---header end---> 
	<!---content area---> 
	<div id="customer-content"> 
	
	
	
	
	
	<div class="customer-box"> 
	<div class="backlink"><a href="Javascript:void(0)" onclick="pushAndGo('OORD');" title="Back to Test D46 Customer - PK Test School">&lt; Back to Test D46 Customer - PK Test School</a></div> 
	<div class="invoice-box">&nbsp;</div> 
	<div class="invoice-infobox"> 
	<div class="top-dark"><span>Sales Order Details</span></div> 
	<div class="left-shade"> 
	<div class="right-shade"> 
	<div class="invoice"> 
	
	<div class="order-details"> 
	<div class="inner-div"> <span class="corner"></span> <span class="corner top-right"></span> 
	<div class="open-order"> 
	<div class="column"> <span>P.O. Number</span> <span class="big">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<!--`X_DATA_9961-BSTKD`--></span> </div> 
	
	<div class="column last"> <span>Total Invoice</span> <span class="big">$961.99</span> </div> 
	</div> 
	<div class="order-amount"> 
	<div class="column"> <span>Credit Status</span> <span class="big">Not approved</span> </div> 
	<div class="column"> <span>Completion Status</span> <span class="big">Being processed</span> </div> 
	<div class="column last"> <span>Shipping Status</span> <span class="big">Hold</span> </div> 
	</div> 
	<span class="corner btm-left"></span> <span class="corner btm-right"></span> </div> 
	</div> 
	<div class="info"> 
	<p><span>1000780</span><br /> 
	<span class="big">Test D46 Customer - PK Test School</span><br /> 
	School<br>3526 Timberview<br>DALLAS TX 75229</p> 
	</div> 
	<div class="subscribe"> 
	<a href="Javascript:void(0)" onclick="pushAndGo('ALERT');"><img border="0" src="http://www.ssgecom.com/QOE/images/subcribed-btn.png" title="" /></a> <img src="http://www.ssgecom.com/QOE/images/email-btn.png" title="" /> </div> 
	<div class="clear"></div> 
	<div class="invoice-history"> 
	<div class="title">Invoice History</div> 
	<table class="invoice-data"> 
	<tr> 
	<th>Invoice</th> 
	<th>Date</th> 
	<th>Amount</th> 
	</tr> 
	
	
	<tr> 
	<td><a class="order-btn" href="Javascript:void(0)" onclick="dlinv('90000359');"><span>90000359</span></a></td> 
	<td>10/24/2008</td> 
	<td><div align="right">$961.99</div></td> 
	</tr> 
	
	
	</table> 
	</div> 
	<div class="contact"> 
	<div class="contact-text">Main Contact:</div> 
	<span class="big">Coach John</span> <span>X7142</span> <span><a class="order-btn" title="pkruger@sportsupplygroup.com" alt="pkruger@sportsupplygroup.com" href="mailto:pkruger@sportsupplygroup.com"><span> 
	send email</span></a></span> </div> 
	</div> 
	</div> 
	</div> 
	<div class="btm-curve"> <span></span> </div> 
	</div> 
	</div> 
	
	<!-- 
	
	<html> 
	<head> 
	<title>`~windowtitle`</title> 
	</head> 
	<body> 
	`~messageline` 
	<form method="post" action="`WGateURL()`"> 
	<p> 
	`TEXT_SO.label` 
	`X_DATA_9961-VBELN.value` 
	`TEXT_CREDIT_STATUS.label` 
	`X_DATA_9961-CMGST_BEZ.value` 
	`G_ORD_9961.value` 
	<input type=submit name="~OKCode=ORDD" value="`PUSHBUTTON_ORDER_DETAILS.label`"> 
	<p> 
	`TEXT_PO_NUMBER.label` 
	`X_DATA_9961-BSTKD.value` 
	`TEXT_COMPL_STATUS.label` 
	`X_DATA_9961-GBSTA_BEZ.value` 
	`G_HIS_9961.value` 
	<input type=submit name="~OKCode=LWOH" value="`PUSHBUTTON_LWO_HISTORY.label`"> 
	<table> 
	<thead> 
	<tr> 
	<td>`TEXT_INVOICE.label`</td> 
	<td>`TEXT_DATE.label`</td> 
	<td>`TEXT_AMOUNT.label`</td> 
	</tr> 
	</thead> 
	<tbody> 
	`repeat with j from 1 to X_INV_9961-VBELN.max` 
	<tr> 
	<td>`X_INV_9961-VBELN[j].value`</td> 
	<td>`X_INV_9961-ERDAT[j].value`</td> 
	<td>`X_INV_9961-RFWRT[j].value`</td> 
	</tr> 
	`end` 
	</tbody> 
	</table> 
	<p> 
	`TEXT_TOTAL_INV.label` 
	`X_DATA_9961-RFWRT.value` 
	`TEXT_SHIPPING_STAT.label` 
	`X_DATA_9961-ORDSTTX.value` 
	`X_DATA_9961-ALERT.value` 
	<input type=submit name="~OKCode=ALERT" value="`PUSHBUTTON_ALERT.label`"> 
	<p> 
	`TEXT_CUSTOMER.label` 
	`X_DATA_9961-KUNNR.value` 
	`TEXT_CONTACT_NAME.label` 
	`X_DATA_9961-BNAME.value` 
	<p> 
	`TEXT_NAME1.label` 
	`X_DATA_9961-NAME1.value` 
	`TEXT_CONTACT_EMAIL.label` 
	`X_DATA_9961-ZZINTAD.value` 
	<p> 
	`TEXT_ADDRESS_LINE.label` 
	`X_DATA_9961-ADDR.value` 
	`TEXT_CONTACT_PHONE.label` 
	`X_DATA_9961-TELF1.value` 
	</form> 
	</body> 
	</html> 
	--> 
	
	
	<div class="clear"></div> 
	<form method="post" action="/sap(cz1TSUQlM2FBTk9OJTNhU1NHREVWX0Q2MF8wOSUzYUhhcFpFTVRrNVNYWTVjN09nZFZWQ01UNFJ3UVlBYl9odnZCUGlyemstQVRU)/bc/gui/sap/its/zwqe/~flNUQVRFPTQ5MTIuMDgwLjA1LjE1====" style="display:inline" name="listForm"> 
	<input type="hidden" id="okcode" name="~OkCode"> 
	<input type="hidden" id="invselect" name="G_INVOICE_SELECT"> 
	<div class="tab-btn"><img src="http://www.ssgecom.com/QOE/images/order-details-btn1.jpg" alt="" border="0" usemap="#Map" /> 
	<map name="Map" id="Map"> 
	<area shape="rect" coords="175,1,332,45" href="Javascript:void(0)" onclick="pushAndGo('LWOH');" title="LWO History" /> 
	</map> 
	</div> 
	</form> 
	</div> 
	</div> 
	<!---content end---> 
	<div class="item-box"> 
	
	
	
	
	<div class="team-print-box"> 
	<div class="top"> 
	<div class="left"></div> 
	<div class="middle-text">Decorator<span>NON DECORATED</span></div> 
	<div class="right">LWO Status<span>COMPLETE</span></div> 
	</div> 
	<div class="expand-colleps"> 
	<div class="main-content"> 
	<div class="top"> 
	<table class="team-table" cellpadding="0" cellspacing="0"> 
	
	<thead> 
	<tr> 
	<th style="padding: 0 0 0 15px;" width="65"></th> 
	<th align="left" width="250">Style</th> 
	<th align="center">Ordered</th> 
	<th class="center">Open</th> 
	<th align="center">Shipped</th> 
	<th align="center">Plant</th> 
	<th align="center" colspan="3">Product POs</th> 
	</tr> 
	</thead> 
	
	
	
	
	
	<tr class="row"> 
	<td style="padding: 0 0 0 15px;"></td> 
	<td align="left">VPG85HXX<br/>VOIT PLAYGROUND BALL 8.5" RED<br/></td> 
	<td align="center">250</td> 
	<td align="center">0</td> 
	<td align="center">250</td> 
	<td align="center">BM</td> 
	
	
	<td colspan="3" align="center"> 
	<table border="0"> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000372<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000373<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000374<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000375<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000376<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000377<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000378<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000379<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000380<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000381<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000382<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000383<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000384<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000385<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000386<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000387<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	
	80000388<br> 
	
	
	</td> 
	
	
	<td> 
	
	
	250<br> 
	
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	
	10/24/2008<br> 
	
	
	</td> 
	</tr> 
	
	</table> 
	</td> 
	
	
	
	
	
	
	
	</tr> 
	
	
	
	
	
	<tr class="row"> 
	<td style="padding: 0 0 0 15px;"></td> 
	<td align="left">VPG85HXX<br/>VOIT PLAYGROUND BALL 8.5" RED<br/></td> 
	<td align="center">1</td> 
	<td align="center">1</td> 
	<td align="center">0</td> 
	<td align="center">BM</td> 
	
	
	<td colspan="3" align="center"> 
	<table border="0"> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	<tr> 
	<td style="padding: 0 10px 0 0;"> 
	
	</td> 
	
	
	<td> 
	
	</td> 
	<td style="padding: 0 0 0 10px;"> 
	
	</td> 
	</tr> 
	
	</table> 
	</td> 
	
	
	
	
	
	
	
	</tr> 
	
	
	
	
	
	
	
	
	
	
	
	<tr bgcolor="#dddddd" style="margin: 10px 0 0 0;"> 
	<td colspan="9"> 
	<div class="total-content" style="padding: 10px 10px 0 0;"> 
	<div class="total"> 
	<span>Sub-total</span> 
	<span>$<span class="subtotal">838.63</span></span> 
	</div> 
	</div> 
	</td> 
	</tr> 
	
	
	
	</table> 
	
	<div class="clearBoth"></div> 
	</div></div> 
	
	<div class="bottom"> 
	
	
	
	</div> 
	</div> 
	
	</div> 
	
	
	
	
	
	</div> 
	<div class="bottom-text"> 
	<div class="notes"> 
	
	<p> 
	
	
	Essential Oils 
	
	
	
	The single most popular category that sets Nature's Oil apart from the 
	
	
	
	competition is our Pure Essential Oils and Essential Oil Blends. We 
	
	
	
	scour the globe to source the absolute finest quality therapeutic grade 
	
	
	
	essential oils from ethical producers in dozens of countries world-wide. 
	
	
	
	These suppliers are highly screened and audited regularly for quality 
	
	
	
	and consistency. This screening process ensures that we only supply the 
	
	
	
	highest quality essential oils available anywhere in the U.S. 
	
	
	</p> 
	
	
	</div> 
	<div class="detail-sum"> 
	<table width="100%" border="0" cellspacing="4" cellpadding="4" class="table-data"> 
	<tr> 
	<td class="a-right" style="padding:0 20px 0 0;"><span>Summary Sub-total</span></td> 
	<td class="a-right"><div class="total"><span>$<span class="subtotal">838.63</span></span></div></td> 
	</tr> 
	<tr> 
	<td class="a-right" style="padding:0 20px 0 0;"><span>Freight</span></td> 
	<td class="a-right"><div class="total"><span>$<span class="subtotal">142.41</span></span></div></td> 
	</tr> 
	<tr> 
	<td class="a-right" style="padding:0 20px 0 0;"><span>Tax</span></td> 
	<td class="a-right"><div class="total"><span>$<span class="subtotal">0.00</span></span></div></td> 
	</tr> 
	<tr> 
	<td class="a-right" style="padding:0 20px 0 0;"><span>Total</span></td> 
	<td class="a-right"><div class="total"><span>$<span class="subtotal">981.04</span></span></div></td> 
	</tr> 
	</table> 
	</div> 
	
	
	
	</div> 
	<div id="footer-new"> </div> 
	</div> 
	</body> 
	</html> 
	

Open in new window



And CSS:

*{ margin:0; padding:0;}
.clear{ clear:both;}
body{background:#fff; font-family:Arial, Helvetica, sans-serif; color:#333; font-size:12px; line-height:15px;}
.seles:after {display:block;content:".";clear:both;font-size:0;line-height:0;height:0;overflow:hidden}
a {text-decoration:none; color:#E51937; cursor:pointer;}
img {border:none;}
:focus {outline:none;}
.center{ text-align:center !important;}
.a-right {text-align:right!important;}
.a-left {text-align:left!important;}
.a-center {text-align:center!important;}
.a_row2 {background:#eee;}
.goal {background-color: #b0d89b;}
.rounded-img { border:1px solid #; -webkit-border-radius: 10px;-moz-border-radius: 10px; border-radius: 10px;  }
#wrapper{ width:100%;}
#top-header{ width:100%; background:url(../images/header_bg.jpg) top repeat-x; height:150px;}
.header{ width:950px; height:141px; margin:0 auto;}
.user-img{ width:194px; height:191px; float:left;margin-top: 14px;}
.headerlink{ width:738px; float:left; height:auto; margin-left: 18px; height:141px;}
.toplink{ width:auto; float:right; margin:6px auto;}
.toplink ul{ margin:4px 0 0 ; padding:0;}
.toplink ul li{ list-style-type:none; display:block; background:url(../images/top-link-bg.png) top left no-repeat; margin:0 0 0 10px;line-height: 14px; float:left;}
.toplink ul li a{ font-family:Arial, Helvetica, sans-serif; font-weight:bold; font-size:12px; color:#fff; text-transform:uppercase; text-decoration:none;}
.toplink li a:hover{ text-decoration:none;}
.toplink ul li.sign-out{background-position: 0 0;padding-left: 14px;}
.toplink ul li.setting{background-position: 0 -15px;padding-left: 14px;}

.userinfo{ width:515px; float:left; clear:both;}
.username{ float:left; width:330px; font-family:Arial, Helvetica, sans-serif;font-size:20px; line-height:20px; color:#fff; height:48px; display:block;margin-top: 13px;}
.username span{background: url(../images/userinfo-bg.png) no-repeat 0 0; margin:0; padding:0 0 0 10px; height:48px; display:block;}
.username span span{background:none;line-height:48px;}
.username span span span.icon{background: url(../images/top-link-bg.png) no-repeat 0 -31px;float: right;height: 18px;margin: 11px !important; width: 13px;}

.topmenu{ float:left; clear:both; margin-top:17px;width: 525px; }
.topmenu ul li{ display:block; line-height:32px; float:left;}
.topmenu a{margin:0; padding:0 0 0 21px !important; display:block;font-family:Arial, Helvetica, sans-serif; font-weight:bold; font-size:12px; color:#fff; text-transform:uppercase; text-decoration:none;}
.topmenu a span {padding:0 8px 0 0 !important; display:block; height:36px; line-height:36px;}
.topmenu a:hover, .topmenu a.selected {background: url(../images/topmenu-bg.png) no-repeat 0 0; margin:0; padding:0 0 0 21px; display:block;font-family:Arial, Helvetica, sans-serif; font-weight:bold; font-size:12px; color:#e51937; text-transform:uppercase; text-decoration:none;}
.topmenu a:hover span, .topmenu a.selected span{background:url(../images/topmenu-bg.png) no-repeat 100% -42px; padding:0 8px 0 0!important; display:block;}
.logo{ width:183px; height:80px; float:right;margin-top: 15px;}

#content{width:950px; height:auto;margin:0 auto; margin-top:16px;}
.left-panel{position:absolute; margin-top:45px;width:192px; float:left;}
.rank-box{ width:192px; float:left; }
.rank-box .top-dark {background:url(../images/bkg_rounded_box.png) no-repeat 0 0; height:39px; padding-left:12px;}
.rank-box .top-dark span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -50px; height:39px; display:block; color:#fff; font-size:15px; text-align:center; line-height:39px; text-transform:uppercase;}
.rank-box .left-shade {background:url(../images/rank-box-bg.png) repeat-y 0 0; padding-left:10px; margin-left:3px;}
.rank-box .right-shade {background:url(../images/rank-box-bg.png) repeat-y 100% -101px; padding:10px 4px 10px 0; margin-right:5px; height:81px;}
.rank-box .rank{font-family:Arial, Helvetica, sans-serif;font-size:66px; color:#f5002f;text-align: center;line-height: 66px;}

.order-box{ width:192px; float:left; margin-top:15px;}
.order-box .top-dark {background:url(../images/bkg_rounded_box.png) no-repeat 0 0; height:39px; padding-left:12px;}
.order-box .top-dark span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -50px; height:39px; display:block; color:#fff; font-size:15px;padding: 0 0 0 25px; line-height:39px; text-transform:uppercase;}
.order-box .left-shade {background:url(../images/rank-box-bg.png) repeat-y 0 0; padding-left:10px; margin-left:3px;}
.order-box .right-shade {background:url(../images/rank-box-bg.png) repeat-y 100% -101px; padding:10px 4px 10px 0; margin-right:5px; height:81px;}
.order-box .order{font-family:Arial, Helvetica, sans-serif;font-size:35px; color:#f5002f;text-align: center; padding-top:20px; line-height:35px;}
.order-box .order span{font-size:20px;vertical-align: top; line-height:20px;}

.content-box{ width:750px; float:right;margin-top: 16px;}
.content-box .top-dark {background:url(../images/bkg_rounded_box.png) no-repeat 0 0; height:39px; padding-left:12px;}
.content-box .top-dark span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -50px; height:39px; display:block; color:#fff; font-size:15px; padding: 0 0 0 25px; line-height:39px; text-transform:uppercase;}
.content-box .left-shade {background:url(../images/bkg_mid_left_shade.png) repeat-y 0 0; padding-left:10px; margin-left:2px;}
.content-box .right-shade {background:url(../images/bkg_mid_shade.png) repeat-y 100% -101px; padding:10px 4px 0px 0; margin-right:3px; height:103px;}

.seles{ width:100%; margin:0; padding:0; color:#333;font-family:Arial, Helvetica, sans-serif;font-size:12px;}
.seles .rank{ float:left; font-size:51px;padding-left:10px;margin-top:5px; line-height:51px;}
.seles .rank span{font-size:12px;line-height:12px;}
.seles .amount{width:180px; float:left; font-size:38px;margin-top: 32px;margin-left: 10px; margin-right: 10px; line-height:38px;}
.seles .amount span{font-size:20px !important;vertical-align: top;}
.seles .percent-img{float: left;font-size: 14px;height: 79px;width: 80px; background:url(../images/percent-img-new.png) no-repeat 0 0; line-height:80px; text-align:center; margin:10px 0 0 10px;}
.detail-box{ width:296px; float:right; background:url(../images/detail-box-bg.png) no-repeat center;height: 100px;padding-right: 10px;}
.detail-box .table-data {border-collapse:collapse; width:270px;margin: 13px 0 0 20px; color:#333; font-size:22px;line-height: 22px;}
.detail-box .table-data td span{font-size:12px; text-align:left !important;}

.title-shade{ background:#636466; width:740px; float:left; height:29px; margin:0 auto 0 4px; display:block; color:#fff; font-size:15px;text-transform:uppercase; text-align:center; font-weight:600; line-height:29px;}
.title-shade ul{ margin:0; padding:0;}
.title-shade ul li{ display: block; border-right:1px solid #d5d5d5; width:246px; float:left;}
.title-shade ul li.last{border-right:0px !important; width:245px !important;}
.shadow{ background:url(../images/shadow-bg.png) bottom no-repeat; height:14px; width:100%;}

.seles1{width:100%; color:#333;font-family:Arial, Helvetica, sans-serif;font-size:12px;}
.seles1 .left-shade {background:url(../images/bkg_mid_left_shade.png) repeat-y 0 0; padding-left:10px; margin-left:2px;}
.seles1 .right-shade {background:url(../images/bkg_mid_shade.png) repeat-y 100% -101px; padding:0 4px 0 0; margin-right:3px; height:113px; width:730px;}
.sales-rank-box{ width:245px; float:left; border-right:1px solid #d5d5d5;}
.sales-rank-box-last{width:243px; float:left;border-right:0px !important;}
.sales-rank-box-first{width:240px; float:left;border-right:1px solid #d5d5d5;}
.sales-rank-box-first .rank-amount{ width:98px; float:left; padding-left: 15px; }
.sales-rank-box .rank-amount, .sales-rank-box-last .rank-amount{ width:98px; float:left; padding-left: 25px;}
.seles1 .rank{float:left; font-size:39px; color:#333;margin-top:5px; line-height:39px; white-space: nowrap;}
.seles1 .rank span{font-size:12px; line-height:12px;}
.seles1 .amount{font-size:25px;margin-top: 20px; clear:left; line-height:25px; }
.seles1 .amount span{font-size:20px !important;vertical-align: top;}
.seles1 .percent-img{float: left;font-size: 14px;height: 80px; margin:10px 0 10px 15px;width: 80px; background:url(../images/percent-img-new.png) no-repeat; line-height:80px; text-align:center;}
.seles1 .sales-rank-box .percent-img{background-position:0 -157px;}
.seles1 .sales-rank-box-last .percent-img{background-position:0 -236px;}
.seles1 .sales-rank-box-first .percent-img{background-position:0 -78px;}
.seles1 .percent-img2{float: left;height: 79px; margin:10px 0 0 15px;}
.seles .percent-img3{float: left;height: 79px; margin:10px 0 0 0;}
#account-box{width:950px; margin-top:15px !important;}
#account-box .top-dark {background:url(../images/bkg_rounded_box.png) no-repeat 0 0; height:39px; padding-left:12px;}
#account-box .top-dark span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -50px; height:39px; display:block; color:#fff; font-size:18px; text-align:center; line-height:39px; text-transform:uppercase;}
#account-box .btm-curve {background:url(../images/bkg_rounded_box.png) no-repeat -1px -108px; height:12px; padding-left:12px; margin-left:2px;}
#account-box .btm-curve span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -120px; height:12px; display:block; margin-right:1px;}
#account-box .left-shade {background:url(../images/bkg_mid_left_shade.png) repeat-y 0 0; padding-left:4px; margin-left:2px;}
#account-box .right-shade {background:url(../images/bkg_mid_shade.png) repeat-y 100% 0; padding:10px 4px 10px 0; margin-right:3px;}
#account-box .table-data {border-collapse:collapse; width:100%;}
#account-box .table-data td {font-size:14px; color:#333; padding:11px 0 0 17px; vertical-align:middle; text-align:center;}
#account-box .total{ background:url(../images/account-total-bg.png) no-repeat;padding:23px 0 0 3px;width:178px; height:55px; font-size:25px; line-height:25px;}
#account-box .small-table th.first{background: url(../images/button-all-bg.png) repeat 0 46px;height: 46px;width: 104px;}
#account-box .small-table th.last{background: url(../images/button-all-bg.png) repeat -418px 46px;height: 46px;width: 104px; border:0px !important;}
#account-box .small-table th{background: url(../images/button-all-bg.png) repeat -5px 46px;border-right: 1px solid #e7e7e7;height: 46px;width: 104px; font-size:20px; color:#fff; font-weight:normal;}
#account-box .amount-row .small-table{ height:43px;}
#account-box .amount-row span.amount{ background:none;}

#product-box{width:950px;  margin:15px auto 0;}
#product-box .top-dark {background:url(../images/bkg_rounded_box.png) no-repeat 0 0; height:39px; padding-left:12px;}
#product-box .top-dark span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -50px; height:39px; display:block; color:#fff; font-size:18px; text-align:center; line-height:39px; text-transform:uppercase;}
#product-box .btm-curve {background:url(../images/bkg_rounded_box.png) no-repeat -1px -108px; height:12px; padding-left:12px; margin-left:2px;}
#product-box .btm-curve span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -120px; height:12px; display:block; margin-right:1px;}
#product-box .left-shade {background:url(../images/bkg_mid_left_shade.png) repeat-y 0 0; padding-left:4px; margin-left:2px;}
#product-box .right-shade {background:url(../images/bkg_mid_shade.png) repeat-y 100% 0; padding:0 4px 0 0; margin-right:3px;}
#product-box .table-data {border-collapse:collapse; width:100%;}
#product-box .table-data th {font-size:14px; color:#000; text-align:left; padding:0 14px; vertical-align:middle; height:43px;}
#product-box .table-data .odd td {background:#eee;}
#product-box .table-data td {font-size:14px; color:#333; padding:0 20px; vertical-align:middle; text-align:left; height:43px; text-transform:uppercase;}

#recent-box{width:950px;margin:15px auto;}
#recent-box .top-dark {background:url(../images/bkg_rounded_box.png) no-repeat 0 0; height:39px; padding-left:12px;}
#recent-box .top-dark span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -50px; height:39px; display:block; color:#fff; font-size:18px; text-align:center; line-height:39px; text-transform:uppercase;}
#recent-box .btm-curve {background:url(../images/bkg_rounded_box.png) no-repeat -1px -108px; height:12px; padding-left:12px; margin-left:2px;}
#recent-box .btm-curve span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -120px; height:12px; display:block; margin-right:1px;}
#recent-box .left-shade {background:url(../images/bkg_mid_left_shade.png) repeat-y 0 0; padding-left:4px; margin-left:2px;}
#recent-box .right-shade {background:url(../images/bkg_mid_shade.png) repeat-y 100% 0; padding:0 4px 10px 0; margin-right:3px;}
#recent-box .table-data {border-collapse:collapse; width:100%;}
#recent-box .table-data th {font-size:14px; color:#000; text-align:left; padding:0 15px; vertical-align:middle; height:43px;}
#recent-box .table-data .odd td {background:#eee;}
#recent-box .table-data td {font-size:14px; color:#333; padding:0 15px; vertical-align:middle; text-align:left;height:56px;}
#recent-box .name-btn{background: url(../images/button-all-bg.png) no-repeat;padding: 0 0 0 3px;width: 304px;height: 46px;}
#recent-box .name-btn span{ background: url(../images/button-all-bg.png) no-repeat 100% -46px;display: block;height: 46px;line-height: 46px;padding: 0 0 0 5px;color:#fff; text-transform:uppercase; font-size:13px; font-weight:bold;}
#recent-box .order-btn{background: url(../images/button-all-bg.png) no-repeat;padding: 0 0 0 3px;width: 90px;height: 46px; margin:0 auto;}
#recent-box .order-btn span{ background: url(../images/button-all-bg.png) no-repeat 100% -46px;display: block;height: 46px;line-height: 46px;padding: 0px;color:#fff; text-transform:uppercase; font-size:13px; font-weight:bold; text-align:center;}
#recent-box .order-btn span a {color:#fff;}




#ar-details{width:950px;margin:15px auto;}
#ar-details .top-dark {background:url(../images/bkg_rounded_box.png) no-repeat 0 0; height:39px; padding-left:12px;}
#ar-details .top-dark span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -50px; height:39px; display:block; color:#fff; font-size:18px; text-align:center; line-height:39px; text-transform:uppercase;}
#ar-details .btm-curve {background:url(../images/bkg_rounded_box.png) no-repeat -1px -108px; height:12px; padding-left:12px; margin-left:2px;}
#ar-details .btm-curve span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -120px; height:12px; display:block; margin-right:1px;}
#ar-details .left-shade {background:url(../images/bkg_mid_left_shade.png) repeat-y 0 0; padding-left:4px; margin-left:2px;}
#ar-details .right-shade {background:url(../images/bkg_mid_shade.png) repeat-y 100% 0; padding:0 4px 10px 0; margin-right:3px;}
#ar-details .table-data {border-collapse:collapse; width:100%;}
#ar-details .table-data th {font-size:14px; color:#000; text-align:left; padding:0 15px; vertical-align:middle; height:43px;}
#ar-details .table-data .odd td {background:#eee;}
#ar-details .table-data td {font-size:14px; color:#333; padding:0 15px; vertical-align:middle; text-align:left;height:56px;}
#ar-details .name-btn{background: url(../images/button-all-bg.png) no-repeat;padding: 0 0 0 3px;width: 304px;height: 46px;}
#ar-details .name-btn span{ background: url(../images/button-all-bg.png) no-repeat 100% -46px;display: block;height: 46px;line-height: 46px;padding: 0 0 0 5px;color:#fff; text-transform:uppercase; font-size:13px; font-weight:bold;}
#ar-details .order-btn{background: url(../images/button-all-bg.png) no-repeat;padding: 0 0 0 3px;width: 90px;height: 46px; margin:0 auto;}
#ar-details .order-btn span{ background: url(../images/button-all-bg.png) no-repeat 100% -46px;display: block;height: 46px;line-height: 46px;padding: 0px;color:#fff; text-transform:uppercase; font-size:13px; font-weight:bold; text-align:center;}
#ar-details .order-btn span a {color:#fff;}

#footer{ width:100%; margin-top:22px; height:110px; background:url(../images/footer-bg.png) repeat-x;}
/*==========Customer page==================*/
.customer-img{ width:194px; height:147px; float:left;margin-top: 14px;}
.customer-img img{ float:right !important;}
#customer-content{width:950px; height:auto;margin:0 auto; margin-top:16px;}
.customer-box{}
h1.title{ font-family:Arial, Helvetica, sans-serif; font-size:19px; color:#333; text-align:left; margin:25px auto;}
.customer-box .table-data {border-collapse:collapse; width:100%;}
.customer-box .table-data th {background:url(../images/bkg_table_head.png) repeat-x 0 0; font-size:14px; color:#000; text-align:left; padding:0 14px; vertical-align:middle; height:38px;font-weight: normal;}
.customer-box .table-data .odd td {background:#eee;}
.customer-box .table-data td {font-size:14px; color:#333; padding:0 12px; vertical-align:middle; text-align:left; height:60px;}
.customer-box .table-data td a {color:#333;}
.customer-order .order-btn span a {color:#fff;}
.customer-box .table-data td.a-left{ padding:0 0 0 15px !important;}

.customer-box .order-btn{background: url(../images/customer-btn-bg.png) no-repeat;padding: 0 0 0 7px;height: 44px; display:block;}
.customer-box .order-btn span{ background: url(../images/customer-btn-bg.png) no-repeat 100% -44px;display: block;height: 44px;line-height: 44px;padding:0 11px 0 7px;color:#fff; text-transform:uppercase; font-size:18px;text-align:center;}
.customer-box .order-btn-sm{background: url(../images/customer-btn-bg.png) no-repeat;padding: 0 0 0 7px; width: 190px; height: 44px; display:block;}
.customer-box .order-btn-sm span{ background: url(../images/customer-btn-bg.png) no-repeat 100% -44px;display: block;height: 44px;line-height: 44px;padding:0 0 0 7px;color:#fff; text-transform:uppercase; font-size:13px;}
.customer-box .history-btn{background: url(../images/customer-btn-bg.png) no-repeat;padding: 0 0 0 7px;height: 44px; display:block;}
.customer-box .history-btn span{ background: url(../images/customer-btn-bg.png) no-repeat 100% -44px;display: block;height: 44px;line-height: 44px;padding:0 5px 0 11px;color:#fff; text-transform:uppercase; font-size:18px;text-align:center;}
.customer-box .history-btn span span{ font-size:13px !important; background:url(../images/calendar-icon.png) no-repeat 0 12px; padding-left:18px; font-weight:bold;}

.pagination{height: 50px; display: table; margin: 30px auto;}
.pagination ul{ margin:0; padding:0;}
.pagination li a.first{background: url(../images/pagination-bg.png) repeat 0 0;height: 47px !important;display:block; width:52px;}
.pagination li a.first span{ width:50px;}
.pagination li a.last{background: url(../images/pagination-bg.png) repeat -98px 0;border: 0 none !important;height: 47px;display:block; width:52px;}
.pagination li a{background: url(../images/pagination-bg.png) no-repeat -47px -47px;border-right: 1px solid #E6E6E6;color: #999;font-size: 22px;font-weight: normal;height: 47px;text-decoration: none; display:block; width:43px;line-height: 47px;text-align: center;}
.pagination li{list-style-type:none !important; display:block; float:left;}
.pagination li a.selected{background: url(../images/pagination-bg.png) repeat -51px 0;height: 47px;display:block; width:43px; color:#fff;}
/*==========Customer Order page==================*/
.backlink{font-family:Arial, Helvetica, sans-serif; font-size:19px; color:#f00; text-align:left; margin:25px auto;}
.standings-disclaimer {font-family:Arial, Helvetica, sans-serif; font-size:16px; text-align:center; width:950px;}
.standings-nav{font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333; text-align:left; width:475px; float:left; margin:25px auto;}
.rsm-rep-toggle{font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333; text-align:right; width:475px; float:right; margin:25px auto;}
.rsm-rep-toggle a, .standings-nav a, {color:#f00; text-decoration:underline;}


.customer-infobox{ height:180px; background:url(../images/customer-info-bg.png) repeat-x;}
.info{font-size:16px; line-height:20px; color:#404040; text-align:left; padding:31px 5px; float:left; width: 425px; }
.info span{ font-size:19px; line-height:24px;}
.order-details {position:relative; border:1px solid #d6d6d6; height:107px; width:417px; float:right;margin: 31px 5px;}
.order-details .parent-div {border:1px solid #f5f5f5; background:#fff; height:105px;}
.order-details .corner {background:url(../images/bkg_group_curve.png) no-repeat 0 0; width:5px; height:5px; display:block; position:absolute; top:-1px; left:-1px;}
.order-details .corner.top-right {right:-1px; top:-1px; background-position:100% 0; left:auto;}
.order-details .corner.btm-left {bottom:-1px; top:auto; background-position:0 -7px;}
.order-details .corner.btm-right {bottom:-1px; right:-1px; background-position:100% 100%; top:auto; left:auto;}
.open-order{width:100%; border-bottom:1px solid #ccc; color:#999; font-size:15px;height:46px;padding: 7px 0 0;}
.open-order span{ width:45px; float:left; padding-left:118px;}
.open-order span.amount{float:left; padding-left:35px; width:217px; color:#333; font-size:33px; line-height:33px;}
.open-order span.amount span{ float: left;font-size: 20px;line-height:20px;padding-left: 0;width: 11px;}	
.order-amount{width:100%;color:#999; font-size:15px;height:53px;}
.cfy{ width:206px; float:left;border-right:1px solid #ccc;padding: 7px 0 7px;}
.order-amount span{ width:31px; float:left; padding-left:12px;}
.order-amount span.amount{float:left; padding-left:29px; width:134px; color:#333; font-size:33px; line-height:33px;}
.order-amount span.amount span{ float: left;font-size: 20px;padding-left: 0;width: 11px;}	
.lfy{ width:50%; float:left;padding: 7px 0 7px;}

.details-top{height:85px; width:945px; margin:0 auto;}
.toggle-buttons{ width:230px; height:48px; background:url(../images/day-order-bg.png) no-repeat 0 -110px; margin-top:20px; line-height:48px; float:left; text-transform:uppercase; font-size:12px; font-weight:bold;}
.toggle-buttons a{ display:block; width:50%; float:left; text-align:center;}
.toggle-buttons span{/*text-align:center; padding:0 0 0 23px;*/ color:#fff;/* margin-left:10px;*/}
.toggle-buttons span.sales{text-align:center;/* padding:0 0 0 30px; */color:#636363;}

.day-sorter{ float:right; width:445px; height:49px;margin-top:20px;}
.day-sorter span{ float:left; font-size:14px; padding: 16px 5px;}
.day-sorter .sorter{height: 49px;width:195px; float:left; margin:0 !important; font-size:16px;}
.day-sorter .sorter ul{ margin:0; padding:0;}
.day-sorter .sorter li a.first{background: url(../images/day-order-bg.png) repeat 0 0;height: 49px !important;display:block; width:52px;}
.day-sorter .sorter li a.first span{ width:50px;}
.day-sorter .sorter li a.last{background: url(../images/day-order-bg.png) repeat -98px 0;border: 0 none !important;height: 49px;display:block; width:52px;}
.day-sorter .sorter li a{background: url(../images/day-order-bg.png) no-repeat -47px -56px;border-right: 1px solid #E6E6E6;color: #999;font-weight: normal;height: 49px;text-decoration: none; display:block; width:44px;line-height: 47px;text-align: center;}
.day-sorter .sorter li{list-style-type:none !important; display:block; float:left;}
.day-sorter .sorter li a.selected{background: url(../images/day-order-bg.png) repeat -52px 0;height: 49px;display:block; width:44px; color:#fff;}

.customer-order{}
.customer-order .table-data {border-collapse:collapse; width:100%;}
.customer-order .table-data th {font-size:15px; color:#000; text-align:left; padding:14px 5px; vertical-align:middle; background:none !important;height: 19px;}
.customer-order .table-data .odd td {background:#eee;}
.customer-order .table-data td {font-size:16px; color:#333;vertical-align:middle; text-align:left; height:60px; padding:0 5px;}
.customer-order .order-btn {background: url(../images/button-all-bg.png) no-repeat;padding: 0 0 0 3px;height: 44px; float:left;}
.customer-order .order-btn span{ background: url(../images/button-all-bg.png) no-repeat 100% -46px;display: block;height: 44px;line-height: 44px;padding:0 20px 0 15px !important;color:#fff; text-transform:uppercase; font-size:13px; font-weight:bold; text-align:center;}
/*==========Customer Account page==================*/
.toggle-buttons-new{ width:230px; height:48px; background:url(../images/toggle-btn-bg.png) no-repeat; margin-top:20px; line-height:48px; float:left; text-transform:uppercase; font-size:12px; font-weight:bold;}
.toggle-buttons-new a{ display:block; width:50%; float:left; text-align:center;}
.toggle-buttons-new span{color:#636363;}
.toggle-buttons-new span.sales{color:#fff;}

.day-sorter-new{ float:right; width:280px; height:49px;margin-top:20px;}
.day-sorter-new span{ float:left; font-size:14px; padding:16px 5px;}

.pagination-btn{}
.pagination-btn ul{ margin:0; padding:0;}
.pagination-btn li a.first{background: url(../images/pagination-bg.png) repeat 0 0;height: 47px !important;display:block; width:52px;}
.pagination-btn li a.first span{ width:50px;}
.pagination-btn li a.last{background: url(../images/pagination-bg.png) repeat -98px 0;border: 0 none !important;height: 47px;display:block; width:52px;}
.pagination-btn li a{background: url(../images/pagination-bg.png) no-repeat -47px -47px;border-right: 1px solid #E6E6E6;color: #999;font-size: 22px;font-weight: normal;height: 47px;text-decoration: none; display:block; width:43px;line-height: 47px;text-align: center;}
.pagination-btn li{list-style-type:none !important; display:block; float:left;}
.pagination-btn li a.selected{background: url(../images/pagination-bg.png) repeat -51px 0;height: 47px;display:block; width:43px;}

.top-account-box{}
.top-account-box .top-dark {background:url(../images/bkg_rounded_box.png) no-repeat 0 0; height:39px; padding-left:12px;}
.top-account-box .top-dark span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -50px; height:39px; display:block; color:#fff; font-size:18px; text-align:center; line-height:39px; text-transform:uppercase;}
.top-account-box .btm-curve {background:url(../images/bkg_rounded_box.png) no-repeat -1px -108px; height:12px; padding-left:12px; margin-left:2px;}
.top-account-box .btm-curve span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -120px; height:12px; display:block; margin-right:1px;}
.top-account-box .left-shade {background:url(../images/bkg_mid_left_shade.png) repeat-y 0 0; padding-left:4px; margin-left:2px;}
.top-account-box .right-shade {background:url(../images/bkg_mid_shade.png) repeat-y 100% 0; margin-right:3px;}
.top-account-box .table-data {border-collapse:collapse; width:100%;}
.top-account-box .table-data th {font-size:13px; color:#000; text-align:center;vertical-align:middle; background:none !important;padding:0!important;}
.top-account-box .table-data td.odd {background:#eee;}
.top-account-box .table-data th.odd {background:#eee !important;}
.top-account-box .table-data td {font-size:13px; color:#333; padding:0 8px !important;vertical-align:middle; text-align:right; height:50px;}

.middle-account-box{margin-top: 15px;}
.middle-account-box .top-dark {background:url(../images/bkg_rounded_box.png) no-repeat 0 0; height:39px; padding-left:12px;}
.middle-account-box .top-dark span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -50px; height:39px; display:block; color:#fff; font-size:18px; text-align:center; line-height:39px; text-transform:uppercase;}
.middle-account-box .btm-curve {background:url(../images/bkg_rounded_box.png) no-repeat -1px -108px; height:12px; padding-left:12px; margin-left:2px;}
.middle-account-box .btm-curve span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -120px; height:12px; display:block; margin-right:1px;}
.middle-account-box .left-shade {background:url(../images/bkg_mid_left_shade.png) repeat-y 0 0; padding-left:4px; margin-left:2px;}
.middle-account-box .right-shade {background:url(../images/bkg_mid_shade.png) repeat-y 100% 0; margin-right:3px;}
.middle-account-box .small-table td.first{background: url(../images/button-all-bg.png) repeat 0 46px;height: 46px;width: 104px;}
.middle-account-box .small-table td.last{background: url(../images/button-all-bg.png) repeat -418px 46px;height: 46px;width: 104px; border:0 !important;}
.middle-account-box .small-table td{background: url(../images/button-all-bg.png) repeat -5px 46px;height: 46px;width: 104px; font-size:15px; color:#fff; font-weight:bold; text-align:center;}
.middle-account-box .small-table th{font-size:13px; color:#666666; font-weight:normal;text-align:center;}
.middle-account-box .small-table{ height:43px; width:833px; margin:0 auto;padding: 15px 0;}

.table-content{ margin-top: 15px;}
.table-content .left-table, .table-content .right-table{ width:465px; float:left; margin-left:5px;}
.left-table .top-dark {background:url(../images/bkg_rounded_box.png) no-repeat 0 0; height:39px; padding-left:12px;}
.left-table .top-dark span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -50px; height:39px; display:block; color:#fff; font-size:18px; text-align:center; line-height:39px; text-transform:uppercase;}
.left-table .btm-curve {background:url(../images/bkg_rounded_box.png) no-repeat -1px -108px; height:12px; padding-left:12px; margin-left:2px;}
.left-table .btm-curve span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -120px; height:12px; display:block; margin-right:1px;}
.left-table .left-shade {background:url(../images/bkg_mid_left_shade.png) repeat-y 0 0; padding-left:4px; margin-left:2px;}
.left-table .right-shade {background:url(../images/bkg_mid_shade.png) repeat-y 100% 0; padding:10px 4px 10px 0; margin-right:3px;}
.left-table .table-data {border-collapse:collapse; width:100%;}
.left-table .table-data th {background:none !important; font-size:13px; color:#333; text-align:left; padding:0 15px !important; vertical-align:middle; height:53px; width:auto;}
.left-table .table-data .odd td {background:#eee;}
.left-table .table-data td {font-size:13px; color:#333; padding:0 15px !important; vertical-align:middle; text-align:right; height:55px;}

.summary{}
.sales, .shop-sales, .last-field-sales{ margin-top:11px;}
.right-table .top-dark {background:url(../images/bkg_rounded_box.png) no-repeat 0 0; height:39px; padding-left:12px;}
.right-table .top-dark span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -50px; height:39px; display:block; color:#fff; font-size:18px; text-align:center; line-height:39px; text-transform:uppercase;}
.right-table .btm-curve {background:url(../images/bkg_rounded_box.png) no-repeat -1px -108px; height:12px; padding-left:12px; margin-left:2px;}
.right-table .btm-curve span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -120px; height:12px; display:block; margin-right:1px;}
.right-table .left-shade {background:url(../images/bkg_mid_left_shade.png) repeat-y 0 0; padding-left:4px; margin-left:2px;}
.right-table .right-shade {background:url(../images/bkg_mid_shade.png) repeat-y 100% 0; padding:0px 4px 0px 0; margin-right:3px;}
.right-table .table-data {border-collapse:collapse; width:100%;}
.right-table .table-data th {background:none !important; font-size:13px; color:#333; text-align:right; padding:0px 25px 0 0 !important; vertical-align:middle; height:53px; width:auto;}
.right-table .table-data .odd td {background:#eee; text-align:right;}
.right-table .table-data td {font-size:13px; color:#333; padding:0px 25px 0 0 !important; vertical-align:middle; text-align:right; height:55px;}
.right-table .table-data td.right{ text-align:right !important; padding:0 20px 0 0!important;}

.right-table .sales .table-data td.right{ text-align:right !important; padding:0 55px 0 0!important; width:100px;}
.right-table .last-field-sales .table-data td{ height:28px !important; text-align:left; padding:0 25px !important;}


/*==========Standings Home==================*/


.standings-home-content{ margin-top: 15px;}
.standings-home-content .left-side { width:475px; float:left; }
.standings-home-content .right-side { width:475px; float:right; }

.standings-home-content .right-side .top-dark {background:url(../images/bkg_rounded_box.png) no-repeat 0 0; height:39px; padding-left:12px;}
.standings-home-content .right-side .top-dark span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -50px; height:39px; display:block; color:#fff; font-size:18px; text-align:center; line-height:39px; text-transform:uppercase;}
.standings-home-content .right-side .btm-curve {background:url(../images/bkg_rounded_box.png) no-repeat -1px -108px; height:12px; padding-left:12px; margin-left:2px;}
.standings-home-content .right-side .btm-curve span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -120px; height:12px; display:block; margin-right:1px;}
.standings-home-content .right-side .left-shade {background:url(../images/bkg_mid_left_shade.png) repeat-y 0 0; padding-left:4px; margin-left:2px;}
.standings-home-content .right-side .right-shade {background:url(../images/bkg_mid_shade.png) repeat-y 100% 0; padding:0px 4px 0px 0; margin-right:3px;}

.standings-home-content .right-side .table-data {border-collapse:collapse; width:100%;}
.standings-home-content .right-side .table-data th {background:none !important; font-size:13px; color:#333;  padding:0px 25px 0 25px !important; vertical-align:middle; height:53px; width:auto;}
.standings-home-content .right-side .table-data .odd td {background:#eee;}
.standings-home-content .right-side .table-data td {font-size:13px; color:#333; padding:0px 25px 0 25px !important; vertical-align:middle; height:60px;}
.standings-home-content .right-side .table-data td.right{ !important; padding:0 20px 0 0!important;}

.right-side .sales .table-data td.right{ !important; padding:0 60px 0 0!important; width:100px;}
.right-side .last-field-sales .table-data td{ height:28px !important; padding:0 25px !important;}

.standings-home-content .left-side .top-dark {background:url(../images/bkg_rounded_box.png) no-repeat 0 0; height:39px; padding-left:12px;}
.standings-home-content .left-side .top-dark span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -50px; height:39px; display:block; color:#fff; font-size:18px; text-align:center; line-height:39px; text-transform:uppercase;}
.standings-home-content .left-side .btm-curve {background:url(../images/bkg_rounded_box.png) no-repeat -1px -108px; height:12px; padding-left:12px; margin-left:2px;}
.standings-home-content .left-side .btm-curve span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -120px; height:12px; display:block; margin-right:1px;}
.standings-home-content .left-side .left-shade {background:url(../images/bkg_mid_left_shade.png) repeat-y 0 0; padding-left:4px; margin-left:2px;}
.standings-home-content .left-side .right-shade {background:url(../images/bkg_mid_shade.png) repeat-y 100% 0; padding:0px 4px 0px 0; margin-right:3px;}

.standings-home-content .left-side .table-data {border-collapse:collapse; width:100%;}
.standings-home-content .left-side .table-data th {background:none !important; font-size:13px; color:#333;  padding:0px 25px 0 25px !important; vertical-align:middle; height:53px; width:auto;}
.standings-home-content .left-side .table-data .odd td {background:#eee;}
.standings-home-content .left-side .table-data td {font-size:13px; color:#333; padding:0px 25px 0 25px !important; vertical-align:middle; height:60px;}
.standings-home-content .left-side .table-data td.right{ !important; padding:0 20px 0 0!important;}

.left-side .sales .table-data td.right{ !important; padding:0 60px 0 0!important; width:100px;}
.left-side .last-field-sales .table-data td{ height:28px !important; padding:0 25px !important;}




/*==========Standings==================*/
table.tablesorter thead tr .header {
background-image: url(../images/bg2.gif);
background-repeat: no-repeat;
background-position: center right;
cursor: pointer;
}
table.tablesorter thead tr .headerSortUp {
background-image: url(../images/asc.gif);
}
table.tablesorter thead tr .headerSortDown {
background-image: url(../images/desc.gif);
}

.standings-content{ margin-top: 15px;}
.standings-content .left-side { width:260px; float:left;}
.standings-content .right-side { width:690px; float:right;}

.right-side .top-dark {background:url(../images/bkg_rounded_box.png) no-repeat 0 0; height:39px; padding-left:12px;}
.right-side .top-dark span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -50px; height:39px; display:block; color:#fff; font-size:18px; text-align:center; line-height:39px; text-transform:uppercase;}
.right-side .btm-curve {background:url(../images/bkg_rounded_box.png) no-repeat -1px -108px; height:12px; padding-left:12px; margin-left:2px;}
.right-side .btm-curve span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -120px; height:12px; display:block; margin-right:1px;}
.right-side .left-shade {background:url(../images/bkg_mid_left_shade.png) repeat-y 0 0; padding-left:4px; margin-left:2px;}
.right-side .right-shade {background:url(../images/bkg_mid_shade.png) repeat-y 100% 0; padding:0px 4px 0px 0; margin-right:3px;}

.right-side .table-data {border-collapse:collapse; width:100%;}
.right-side .table-data th {background:none !important; font-size:13px; color:#333;  padding:0px 25px 0 25px !important; vertical-align:middle; height:53px; width:auto;}
.right-side .table-data .odd td {background:#eee;}
.right-side .table-data td {font-size:13px; color:#333; padding:0px 25px 0 25px !important; vertical-align:middle; height:60px;}
.right-side .table-data td.right{ !important; padding:0 20px 0 0!important;}

.right-side .sales .table-data td.right{ !important; padding:0 60px 0 0!important; width:100px;}
.right-side .last-field-sales .table-data td{ height:28px !important; padding:0 25px !important;}



/*==========Sales order Details==================*/
.invoice-box{ background:url(../images/invoice-box-bg.png) top repeat-x; height:40px;}
.invoice-infobox{ width:100%;}
.invoice-infobox .top-dark {background:url(../images/bkg_rounded_box.png) no-repeat 0 0; height:39px; padding-left:12px;}
.invoice-infobox .top-dark span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -50px; height:39px; display:block; color:#fff; font-size:18px; text-align:center; line-height:39px; text-transform:uppercase;}
.invoice-infobox .btm-curve {background:url(../images/bkg_rounded_box.png) no-repeat -1px -108px; height:12px; padding-left:12px; margin-left:2px;}
.invoice-infobox .btm-curve span {background:url(../images/bkg_rounded_box.png) no-repeat 100% -120px; height:12px; display:block; margin-right:1px;}
.invoice-infobox .left-shade {background:url(../images/bkg_mid_left_shade.png) repeat-y 0 0; padding-left:4px; margin-left:2px;}
.invoice-infobox .right-shade {background:url(../images/bkg_mid_shade.png) repeat-y 100% 0; padding:0px 4px 0px 0; margin-right:3px;}

.invoice{ padding:20px; height:295px;}
.invoice .info{font-size:14px; color:#404040; text-align:left; padding:0 0 0 14px; float:left;width: 254px; line-height:25px;}
.invoice .info span{ font-size:23px; clear:both;}
.invoice .info span a {color:#333;}
.invoice .info span.big{ font-size:18px;}
.invoice .subscribe{padding: 0 0 0 14px;float: right;width: 180px;}
.invoice .subscribe img{ margin-bottom:5px;}

.invoice-history{ width:400px; float:left; padding-top:15px;}
.invoice-history .title{ font-size:20px; text-align:left; color:#333;}
.invoice-history .invoice-data th{font-size:15px; color:#999; text-align:left; padding:2px 40px 2px 0;}
.invoice-history .invoice-data td{ font-size:19px; color:#333; text-align:left;padding:2px 40px 2px 0;}

.contact{ width:325px; float:left;padding-top:15px; padding-left:46px;}
.contact-text{ font-size:15px; color:#999;}
.contactspan.big{font-size:28px; color:#333;}
.contact span{ font-size:23px; color:#333;line-height: 35px;clear: both;display: block;}

.invoice .order-details {position:relative; border:1px solid #d6d6d6; height:131px; width:418px; float:left;margin: 0px 5px;}
.invoice .order-details .parent-div {border:1px solid #f5f5f5; background:#fff; height:131px;}
.invoice .order-details .corner {background:url(../images/bkg_group_curve.png) no-repeat 0 0; width:5px; height:5px; display:block; position:absolute; top:-1px; left:-1px;}
.invoice .order-details .corner.top-right {right:-1px; top:-1px; background-position:100% 0; left:auto;}
.invoice .order-details .corner.btm-left {bottom:-1px; top:auto; background-position:0 -7px;}
.invoice .order-details .corner.btm-right {bottom:-1px; right:-1px; background-position:100% 100%; top:auto; left:auto;}

.top-row{width:100%;color:#999; font-size:15px;height:53px;}
.inner-div .open-order, .inner-div .order-amount{width:100%; border-bottom:1px solid #ccc;  font-size:15px; color:#333; height:65px !important; padding:0 !important;}
.inner-div .open-order .column { width:207px; float:left;height:60px !important; border-right:1px solid #ccc; padding-top:5px;}
.inner-div .open-order .column { width:207px; float:left;height:60px !important; border-right:1px solid #ccc; padding-top:5px;}
.inner-div .open-order .column.last{border-right:0px !important;}

.inner-div .open-order .column span{ width:100%; padding-left:0px; text-align:center; display:block;}
.inner-div .open-order .column span.big{ font-size:18px; color:#333; line-height:25px;}

.order-amount .column{width:33%; float:left; height:55px; border-right:1px solid #ccc;padding-top:10px;}
.order-amount .column.last{border-right:0px !important;}
.order-amount .column span{width:100%; padding-left:0px; text-align:center;}
.order-amount .column span.big{font-size:18px; color:#333; text-transform:uppercase; padding-top:5px;}

.tab-btn{ margin-top: 14px; height:44px; text-align:left;}
.item-box{background:#313131 url(../images/bottom-bg.jpg) top repeat-x; width:100%;height:auto; padding:20px 0 0;}
.item-box .box-container {width:1000px; margin:0 auto;}
.item-box, #footer-new, #top-header, #footer {min-width:1000px;}

.team-print{ background:url(../images/team-print-bg.png) top no-repeat;height: 449px !important; position:relative;}
.required-team{ background:url(../images/required-box-bg.jpg) top no-repeat; height: 253px !important; position:relative}  
.non-decorated{ background:url(../images/non-decorated-bg.jpg) top no-repeat; height: 385px !important; position:relative;}
.order-background{background:url(../images/background-box-img.png) top no-repeat; height:832px !important; position:relative;}
.active-btn {position:absolute; right:27px; bottom:100px; width:235px; text-align:right; }
.active-btn1 {position:absolute; bottom:42px; right:27px; width:235px; text-align:right;}
.non-decorated .active-btn {bottom:210px}
.non-decorated .active-btn1 {bottom:135px;}
.non-decorated .active-btn2 {position:absolute; right:27px; bottom:60px; text-align:right}

.left, .middle-text, .right{ font-size:16px; height:33px; line-height:16px; width:auto; display:block; float:left; padding:0 36px;}
.left {width:155px;}
.middle-text {width:425px;}

.right{ text-align:right;}
.middle-text span, .right span{ color:#e51937; text-transform:uppercase; padding-left:5px;}

.expand-contents { background:url(../images/toggle-bg.jpg) repeat-x; height:77px;}
.expand-contents td{ padding:8px 10px;width: 88px;}
.expand-contents table{ margin-left:50px;}
.box-content{ width:100%; margin:0 auto;}
#expand .expand{ width:500px; float:left;}

.team-print-box .bottom .bottom-content{ width:900px; margin:0 auto;}
.team-print-box1 .bottom .bottom-content{ width:900px; margin:0 auto;}
.bottom .bottom-content .middle, .bottom .bottom-content .last, .bottom-content .total{ float:left; padding:5px 56px 0 0; font-size:16px; line-height:30px;color:#333; text-align:left;}
.bottom .bottom-content .last{ float:left; padding:5px 21px 0 0; font-size:16px; line-height:30px;color:#333; text-align:right;}
.hide-text{ font-size:16px; line-height:16px; color:#333; text-transform:uppercase;}
.team-print-box .bottom-content .total{ background:url(../images/total-bg.png) no-repeat; float: right; height:70px; width:156px; padding:0 !important; text-align:center !important;}
.team-print-box .bottom-content .total span{ text-align:center; vertical-align:top; line-height:25px;}
.team-print-box .bottom-content .total span span.subtotal{ font-size:36px; line-height:36px;}


.team-print-box .total-content .total{ float:left; padding:5px 56px 0 0; font-size:16px; line-height:30px;color:#333; text-align:left;}
.team-print-box .total-content .total{ background:url(../images/total-bg.png) no-repeat; float: right; height:70px; width:156px; padding:0 !important; text-align:center !important;}
.team-print-box .total-content .total span{ text-align:center; vertical-align:top; line-height:25px;}
.team-print-box .total-content .total span span.subtotal{ font-size:36px; line-height:36px;}



.team-print-box1 .bottom .bottom-content .last{ text-align:right;}
.bottom-content .last span{ background:url(../images/round-bg.png) no-repeat;height:30px; display:block; padding-right:30px;}
.bottom-content .last span.team{ background-position:100% 6px;}
.bottom-content .last span.high{ background-position:100% -21px;}
.bottom-content .last span.arcadia{ background-position:100% -48px;}
.team-print-box1 .bottom-content .total{ background:url(../images/total-bg.png) no-repeat; float: right; height:70px; width:156px; padding:0 !important; text-align:center !important;}
.team-print-box1 .bottom-content .total span{ text-align:center; vertical-align:top; line-height:25px;}
.team-print-box1 .bottom-content .total span span.subtotal{ font-size:36px; line-height:36px;}
.team-print-box1 .bottom .bottom-content{ width:760px;}
.team-print-box1 .bottom .bottom-content .middle, .team-print-box1 .bottom .bottom-content .last, .team-print-box1 .bottom-content .total{ float:left; padding:5px 63px 0 0; font-size:16px; line-height:30px;color:#333; text-align:left;}
.team-print-box1 .bottom .bottom-content .last{ float:left; padding:5px 21px 0 0; font-size:16px; line-height:30px;color:#333; text-align:right;}
.team-print-box1 .bottom-content .total{ float:right !important;margin-top: 14px;}
.team-print-box1 .expand-colleps .bottom .bottom-content{ padding:6px 0; height:77px; float:right; margin-right: 47px;}


.detail-sum {float:right; margin-top:20px; margin-right:33px;}
.detail-sum .total { font-size:16px; line-height:30px;color:#333;}
.detail-sum .total span{ text-align:center; vertical-align:top; line-height:25px;}
.detail-sum span span.subtotal{ font-size:36px; line-height:36px;}


.expand-colleps {clear:both}
.expand-colleps .top {background:url(../images/bkg_big_top_crv.png) no-repeat top; padding:0 30px 0 35px;}
.expand-colleps .bottom {background:url(../images/bkg_big_btm_crv.png) no-repeat bottom; height:131px;}
.expand-colleps .bottom .bottom-content{ padding:15px 0; height:77px; float:right; margin-right: 47px;}
.expand-colleps .main-content {background:url(../images/bkg_middle_content.png) repeat-y top;}
.team-print-box .expand-colleps .bottom {background:url(../images/bkg_big_btm_crv.png) no-repeat bottom; height:80px;}
.team-print-box .expand-colleps .bottom .bottom-content{ padding:10px 0 15px 0; height:71px; float:right; margin-right: 47px;}

.team-print-box1 .team-table th{color: #333;font-size: 16px;font-weight: normal;line-height: 16px;padding: 5px 0;}
.team-table th{ color: #333;font-size: 16px;font-weight: normal;line-height: 16px;padding: 5px 0px;}
.team-table th.last{ color: #333;font-size: 16px;font-weight: normal;line-height: 16px;padding:5px 15px 5px 0;}
.team-print-box {width:1024px; margin:0 auto; }
.team-print-box1 {width:1024px; margin:0 auto; }
.team-print-box1 .top div {color:#fff;}
.team-print-box .top div {color:#fff;}
.team-print-box1 .left{width:150px;}
.team-print-box1 .middle-text{width:350px;}
.team-print-box1 .right{width:255px;}

.read-more, .read-more1{ background:url(../images/hide-show-btn.png) no-repeat 0 0; width:49px; display:block; height:49px; font-size:0; text-indent:-10000px;}
.read-less{ background:url(../images/hide-show-btn.png) no-repeat 100% -49px; width:49px; display:block; height:49px;}


td, th{ border:none !important;}
.team-table{width:100%; border:0px !important; border-collapse:collapse;}
.team-table .row{}
.team-table thead{ height:33px;}
.team-table .row td{ padding:5px 0; font-size:16px; line-height:22px; color:#333;}
.team-table .row td.a-left{ padding:11px 0 0 0px !important;}
.team-table .row td.toggle-bt{ padding:11px 0 0 11px !important;}

col.small{ width:55px !important;}


.expand-colleps .order-btn{background: url(../images/customer-btn-bg.png) no-repeat;padding: 0 0 0 7px;height: 44px; display:block; width: 200px;}
.expand-colleps .order-btn span{ background: url(../images/customer-btn-bg.png) no-repeat 100% -44px;display: block;height: 44px;line-height: 44px;padding:0 11px 0 7px;color:#fff; text-transform:uppercase; font-size:16px;text-align:center;}

.contact .order-btn{background: url(../images/customer-btn-bg.png) no-repeat;padding: 0 0 0 7px;height: 44px; display:block; width: 150px;}
.contact .order-btn span{ background: url(../images/customer-btn-bg.png) no-repeat 100% -44px;display: block;height: 44px;line-height: 44px;padding:0 11px 0 7px;color:#fff; text-transform:uppercase; font-size:16px;text-align:center;}

.bottom-text { width:950px; margin:0 auto; padding:25px 0; height:220px;}
.notes{ width:515px; float:left; margin-top:20px; padding:0 0 0 20px;}
.bottom-text h4 {color:#000; font-weight:normal; color:#333; margin-bottom:5px;}
.bottom-text p {font-size:12px; line-height:20px; color:#333;}
.decorated-btn2{position: relative;right: -347px;top: -169px;width: 235px !important;}

#footer-new{ width:100%;height:110px; background:url(../images/footer-bg.png) repeat-x;}

.seles:after, .tracking-title:after, .bottom-text:after, .bottom-content:after, .top:after, .day-sorter:after, .toggle-buttons;after, .pagination:after, .invoice:after {display:block;content:".";clear:both;font-size:0;line-height:0;height:0;overflow:hidden}

/*Tracking Popup*/
.tracking-popup {background:url(../images/bkg_popup.png) no-repeat 0 0; width:1000px; height:860px; clear:both; position:absolute; z-index:9; left:50%; top:10%; margin:0 0 0 -500px;}
.tracking-popup .tracking-title {width:960px; margin:5px auto;}
.tracking-popup .tracking-title h3 {color:#fff; font-weight:normal; font-size:28px; line-height:65px; padding:0 25px; float:left;}
.tracking-popup .close {background:url(../images/bkg_close.png) no-repeat top; width:48px; height:48px; display:block; float:right; margin:8px 30px 0 0;}
.tracking-popup p.order-no {float:left; margin:60px 0 0 110px!important; clear:both;}
.shipment-info {float:right; width:345px; margin:22px 30px 0 0;}
.shipment-info label {font-size:15px; color:#999; display:block; margin-bottom:15px;}
.shipment-info p, .tracking-popup p.order-no {margin:0 0 30px; font-size:23px; color:#000; line-height:32px;}
.overlay {background:url(../images/bkg_tranparent.png) repeat 0 0; width:100%; height:100%; position:fixed; left:0; top:0; z-index:1;}


.reveal-modal-bg { 
position: fixed; 
height: 100%;
width: 100%;
background: #000;
background: rgba(0,0,0,.8);
z-index: 100;
display: none;
top: 0;
left: 0; 
}

.reveal-modal {
visibility: hidden;
top: 100px; 
left: 50%;
margin-left: -484px;
width: 960px;
background: #eee url(../images/modal.png) no-repeat -200px -80px;
position: absolute;
z-index: 101;
padding: 30px 40px 34px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-moz-box-shadow: 0 0 10px rgba(0,0,0,.4);
-webkit-box-shadow: 0 0 10px rgba(0,0,0,.4);
-box-shadow: 0 0 10px rgba(0,0,0,.4);
}

.reveal-modal.small 		{ width: 200px; margin-left: -140px;}
.reveal-modal.medium 		{ width: 400px; margin-left: -240px;}
.reveal-modal.large 		{ width: 600px; margin-left: -340px;}
.reveal-modal.xlarge 		{ width: 800px; margin-left: -440px;}

.reveal-modal .close-reveal-modal {
font-size: 22px;
line-height: .5;
position: absolute;
top: 8px;
right: 11px;
color: #aaa;
text-shadow: 0 -1px 1px rbga(0,0,0,.6);
font-weight: bold;
cursor: pointer;
} 

Open in new window

Avatar of P-Daddy
P-Daddy

ASKER

I want the PO Number to stay in the PO Number box.
ASKER CERTIFIED SOLUTION
Avatar of Shaun Kline
Shaun Kline
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial