{{SHOPCART_CSS}}

<script type="text/javascript" src="/javascript/jquery.js"></script>
<script type="text/javascript">

$(function() {
	$(".sc_mobi_nav_trigger").click(function() {
		
		$(".sc_mobi_nav_container").toggleClass("sc_mobi_showme");
	});
});
	
</script>

<table width="100%"  border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td valign="top" class="sc_sidenav_pad">
    	<div class="sc_cart_summary">
    		Cart - {{MINI_CART}}{{TOTAL_PRODUCTS_COUNT}} Items - <strong>${{SUBTOTAL_LINE}}{{MINI_CART_SUBTOTAL_FORMATTED}}{{/SUBTOTAL_LINE}}</strong>{{/MINI_CART}}
    		
    		<a href="{{SELF_LINK}}?command=viewCart" class="sc_view_cart_button sc_filled_button sc_filled_color">View Cart</a>
    		</div> 
    		
    	<div class="sc_mobi_nav_trigger"><a href="javascript:void(0);">Open/Close Navigation</a></div>
    	<div class="sc_mobi_nav_container">
    	<div class="sc_sidenav_headers">Product Search</div>
    		
    		<div class="sc_cart_search_leftcol sc_sidenav_sideborders">
    			<!-- Search auto complete code -->
				<style>.ui-menu-item {background-color:#ffffff !important; z-index:500;}</style>
				
				
				<form name="scSearchForm" method="get" action="{{SELF_LINK}}">
				<input name="txtSearch" id="txtSearch" type="text" /> 
				<input type="button" value="Go" onClick="javascript:document.scSearchForm.submit();" />
				<input type="hidden" name="command" value="doCartSearch">
				</form>	
    			
    			
    		</div>
    	<table width="100%"  border="0" cellpadding="0" cellspacing="0" class="sc_outerbox_border">

	{{MENU}}
        <tr>
          <td><table width="100%"  border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td class="sc_sidenav_headers">Product Navigation </td>
              </tr>
              <tr>
                <td class="sc_sidenav_sideborders">
                	<ul>
                  {{LEVEL_1}}
                  	{{CURRENT_CATEGORY_DATA}}
	                  	{{STANDARD}}
	                      <li><a href="{{CATEGORY_LINK}}">{{CATEGORY_NAME}}</a></li>
	                  	{{/STANDARD}}
	                  	{{CURRENT}}
	                      <li><a href="{{CATEGORY_LINK}}">{{CATEGORY_NAME}}</a></li>
	                  	{{/CURRENT}}
                  	{{/CURRENT_CATEGORY_DATA}}
                  {{/LEVEL_1}}
                </ul>
                </td>
              </tr>
          </table></td>
        </tr>
	{{/MENU}}
    </table>
  </div>
    </td>
    <td valign="top" class="sc_content_style"><table width="100%"  border="0" cellpadding="0" cellspacing="0">
        
        <tr>
          <td class="sc_topheader_pad"><table width="100%"  border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td class="sc_breadcrumb_style"><a href="{{SELF_LINK}}">Home</a> > Shopping Cart > Billing &amp; Shipping ><strong> Payment Information </strong> 
                <div style="float: right;"><a href="{{SELF_LINK}}?command=manageAccount">My Account</a> - {{LOGIN_LOGOUT_LINK}}</div>
                </td>
              </tr>
          </table></td>
        </tr>
       
        <form name="theForm" method="post" action="{{SELF_LINK}}">
        
{{PAYMENT_BLOCK}}
		<input type="hidden" name="command" value="{{COMMAND}}">
		<input type="hidden" name="subCommand" value="{{SUBCOMMAND}}">
		<input type="hidden" name="orderID" value="{{ORDERID}}">
       <tr>
          <td><table width="100%"  border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td class="sc_featureheaders"><table width="100%"  border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td class="sc_featured_box">Payment information </td>
                    </tr>
                </table></td>
              </tr>
              <tr>
                <td valign="top"><table width="100%"  border="0" cellspacing="5" cellpadding="0">
                  <tr>
                    <td align="left" valign="top" class="co_bs_header_style"><table width="100"  border="0" cellspacing="0" cellpadding="0">
                      <tr>
                        <td><img src="photos/shopcart/templates/images/icon-visa.gif" width="43" height="31" /></td>
                        <td><img src="photos/shopcart/templates/images/icon-mastercard.gif" width="42" height="31" /></td>
                        <td><img src="photos/shopcart/templates/images/icon-amex.gif" width="47" height="31" /></td>
                      </tr>
                    </table></td>
                    </tr>
                  <tr>
                    <td align="center" valign="top" class="co_info_box"><table width="100%"  border="0" cellspacing="5" cellpadding="0">
                      <tr>
                        <td><table width="100%"  border="0" cellspacing="0" cellpadding="0">
                          <tr>
                            <td align="left" class="personalData">*Credit Card Type</td>
                            <td class="personalData">*Credit Card Number</td>
                            <td class="personalData">*Expiration Date</td>
                          </tr>
                          <tr>
                            <td align="left"><select name="select">
                                <option>Visa</option>
                                <option>Mastercard</option>
                                <option>Discover</option>
                                <option>American Express</option>
                            </select></td>
                            <td><input name="cardNumber" type="text" size="30" /></td>
                            <td><select name="expMon">
                                <option>01</option>
                                <option>02</option>
                                <option>03</option>
                                <option>04</option>
                                <option>05</option>
                                <option>06</option>
                                <option>07</option>
                                <option>08</option>
                                <option>09</option>
                                <option>10</option>
                                <option>11</option>
                                <option>12</option>
                              </select>
      /
      <select name="expYear">{{YEAR_SELECT_LIST}}</select></td>
                          </tr>
                        </table></td>
                      </tr>
                      <tr>
                        <td align="left" class="personalData">*CCID: 
                          <input name="cardCode" type="text" size="7" />                          </td>
                      </tr>
                      <tr>
                        <td align="left"><table width="97%"  border="0" cellpadding="0" cellspacing="0">
                          <tr>
                            <td width="100%" valign="top" class="ccid_info_box1">As an added security measure, we ask that you
                              enter the last 3 digits on the back of your credit
                              card, on or near the signature panel, called the
                              CCID. See sample on right.</td>
                            <td class="ccid_info_box2"><img src="photos/shopcart/templates/images/visa_ccid.jpg" width="154" height="100" /></td>
                          </tr>
                        </table></td>
                      </tr>
                    </table></td>
                    </tr>
                </table></td>
              </tr>
          </table></td>
        </tr>
{{/PAYMENT_BLOCK}}
{{SHOP_CART_DISPLAY}}
{{SHOP_CART_TOTALS_LINE}}
        <tr>
          <td><table width="100%"  border="0" cellspacing="5" cellpadding="0">
            <tr>
              <td><table width="100%"  border="0" cellpadding="0" cellspacing="0" class="co_submit_box">
                <tr>
                  <td><table width="100%"  border="0" cellpadding="0" cellspacing="0">
                      <tr>
                        <td width="80%" align="right" class="subtotal">Your Subtotal </td>
                        <td width="20%" align="right" class="subtotal">${{SHOP_CART_SUBTOTAL_FORMATTED}}</td>
                      </tr>
                      <tr>
                        <td width="80%" align="right" class="sc_taxes_format">Shipping </td>
                        <td width="20%" align="right" class="sc_taxes_format">${{SHOP_CART_SHIPPING_COST_FORMATTED}}</td>
                      </tr>
                      {{TAXES_LOOP}}
                      <tr>
                        <td align="right" class="sc_taxes_format">{{TAX_NAME}}</td>
                        <td align="right" class="sc_taxes_format">${{TAX_COST_FORMATTED}}</td>
                      </tr>
                      {{/TAXES_LOOP}}
                      <tr>
                        <td align="right" class="total_style_co">Your Total </td>
                        <td align="right" class="total_style_co2">${{SHOP_CART_TOTAL_COST_FORMATTED}}</td>
                      </tr>
                  </table></td>
                  <td align="right" valign="bottom"><table  border="0" cellspacing="0" cellpadding="0">
                      <tr>
                        <td align="center" valign="middle" class="button_style_grey_bb"><a href="javascript:document.theForm.submit();">Submit Order </a> </td>
                      </tr>
                  </table></td>
                </tr>
              </table></td>
            </tr>
          </table></td>
        </tr>
{{/SHOP_CART_TOTALS_LINE}}
{{/SHOP_CART_DISPLAY}}
    </table></td>
  </tr>
  </form>
</table>
<p>&nbsp;</p>