{{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>


<div class="sc_div_grid_2col">
	<div class="sc_div_grid_2col_left">
		<div 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 -->
					{{AUTOCOMPLETE_JAVASCRIPT}}
					<form name="scSearchForm" method="get" action="{{SELF_LINK}}">
					<label for="txtSearch" style="display: none;">Product Search</label>
					<input name="txtSearch" id="txtSearch" type="text" /> 
					<input type="submit" value="Go" title="Search Shop Cart" />
					<input type="hidden" name="command" value="doCartSearch">
					</form>	
    		</div>
    		 

				<div class="sc_outerbox_border">
					{{MENU_2}}
					{{INCLUDE_EMPTY_CATEGORIES}}
	 				
	 				
	 		

	 				<div class="sc_sidenav_headers">Product Navigation</div>
					<div class="sc_sidenav_sideborders">
						<ul>
			        {{LEVEL_1}}
			        	{{1_CURRENT_CATEGORY_DATA}}
			          	{{1_STANDARD}}
			              <li><a href="{{CATEGORY_LINK}}">{{CATEGORY_NAME}}</a>
			              	</li>
			          	{{/1_STANDARD}}
			          	{{1_CURRENT}}
			          	<!-- start of 1_CURRENT -->
			             <li><a href="{{CATEGORY_LINK}}">{{CATEGORY_NAME}}</a>
										{{LEVEL_2}}
										<!-- start of LEVEL_2 -->
										{{2_CURRENT_CATEGORY_DATA}}
										<ul>
				            	{{2_STANDARD}}
				              <li><a href="{{CATEGORY_LINK}}">{{CATEGORY_NAME}}</a></li>
				              {{/2_STANDARD}}
				              {{2_CURRENT}}
				              <li><a href="{{CATEGORY_LINK}}">{{CATEGORY_NAME}}</a>
				              	
				              	{{LEVEL_3}}
				              	<div style="padding-left: 25px;">
							<ul>
								{{3_CURRENT_CATEGORY_DATA}}
	                {{3_STANDARD}}
	                <li><a href="{{CATEGORY_LINK}}">{{CATEGORY_NAME}}</a></li>
	                {{/3_STANDARD}}
	                {{3_CURRENT}}
	                <li><a href="{{CATEGORY_LINK}}">{{CATEGORY_NAME}}</a></li>
	                {{/3_CURRENT}}
								{{/3_CURRENT_CATEGORY_DATA}}
							</ul>
						</div>
							{{/LEVEL_3}}
				              	
				              	</li>
				              {{/2_CURRENT}}
				            </ul>
										{{/2_CURRENT_CATEGORY_DATA}}
										<!-- end of LEVEL_2 -->
			             	{{/LEVEL_2}}
			             	</li>
			             	<!-- end of 1_CURRENT -->
			          	{{/1_CURRENT}}
			        	{{/1_CURRENT_CATEGORY_DATA}}
			        {{/LEVEL_1}}
			      </ul>
					</div>
					<br>
					
					{{/MENU_2}}
				</div>
			</div>
		</div>
	</div>
	<div class="sc_div_grid_2col_right">
	  <div class="sc_main_column sc_content_style">
	  	<div class="sc_topheader_pad">
	  		<div class="sc_breadcrumb_style">
	        <a href="{{SELF_LINK}}">Home</a>
	        {{BREAD_CRUMB}}
	        {{LEVEL_1}} &gt; <a href="{{LINK}}">{{NAME}}</a>{{/LEVEL_1}}
	        {{LEVEL_2}} &gt; <a href="{{LINK}}">{{NAME}}</a>{{/LEVEL_2}}
	        {{LEVEL_3}} &gt; <a href="{{LINK}}">{{NAME}}</a>{{/LEVEL_3}}
	        {{LEVEL_4}} &gt; <a href="{{LINK}}">{{NAME}}</a>{{/LEVEL_4}}
	        {{LEVEL_5}} &gt; <a href="{{LINK}}">{{NAME}}</a>{{/LEVEL_5}}
	        {{/BREAD_CRUMB}}
	        
	        <div style="float: right;"><a href="{{SELF_LINK}}?command=manageAccount">My Account</a> - {{LOGIN_LOGOUT_LINK}}</div>
	      </div>
	    </div>
	    
			<!-- ############################################################ -->
			{{CATEGORY_FEATURED_ITEMS}}{{PULL_ITEMS_FROM_SUB_CATEGORIES}}
			{{CURRENT_CATEGORY_DATA}}
			<div class="sc_featureheaders">
				<div class="sc_featured_box">Featured {{CATEGORY_NAME}}</div>
				{{CATEGORY_DESCRIPTION_ONCE_CONT}}
	      <div class="sc_cat_desc">{{CATEGORY_DESCRIPTION}}</div>
	      {{/CATEGORY_DESCRIPTION_ONCE_CONT}}
			</div>
			{{/CURRENT_CATEGORY_DATA}}
			
			<div>
				{{PRODUCT_LOOP}}
	      {{PRODUCT_1}}
	      	<div class="sc_product_pad_style">
	      		<div class="sc_div_grid_featured">
	      			<div class="sc_div_grid_featured_left sc_product_image sc_align_center">
			      			<a href="{{PRODUCT_LINK}}"><img src="./photos/shopcart/productThumbnails/{{PRODUCT_FILENAME}}" class="sc_product_border" alt="Click to view {{PRODUCT_NAME}}" /></a>
			      	</div>
			      	<div class="sc_div_grid_featured_right">
			      		<div class="sc_cat_product_list_right">
			      			<div class="sc_product_text_spacer">
			      				<span class="sc_sale_price sc_align_center">
			      					<span class="style18">Sale Price: ${{PRICE_BLOCK}}{{PRODUCT_PRICE_FORMATTED}}{{/PRICE_BLOCK}}{{PRODUCT_SPECIAL_BLOCK}}{{PRODUCT_SPECIAL_PRICE_FORMATTED}}{{/PRODUCT_SPECIAL_BLOCK}}</span>
			      				</span>
			      			</div>
			      			
			      			<div class="sc_product_text_spacer">
			      				<span class="style14"><a href="{{PRODUCT_LINK}}">{{PRODUCT_NAME}}</a></span> ({{PRODUCT_NUMBER}}) <br />
	              	</div>
	              	
	              	<div class="sc_product_text_spacer sc_align_center">
	                	<span class="sc_product_desc">{{PRODUCT_DESCRIPTION}}</span>
	                </div>
	                
	                <div>
	                	<span class="button_style_grey"><a href="{{PRODUCT_LINK}}">More Info</a></span>
	                	<span class="sc_featured_button_padding">&nbsp;</span>
	                  {{IS_ACTIVE}}<span class="button_style_green"><a href="{{SELF_LINK}}?command=addToCart&productID={{PRODUCT_ID}}&quantity=1&fpid={{pID}}&fcid={{cID}}&nextCommand=viewCart">Add To Cart</a></span>{{/IS_ACTIVE}}
	                  {{IS_SOLDOUT}}<span class="sold_out">Out Of Stock</span>{{/IS_SOLDOUT}}
	                </div>
	              </div>
	            </div>
	          </div>
	        </div>
	       {{/PRODUCT_1}}
	       {{/PRODUCT_LOOP}}
	    </div>
	    {{/CATEGORY_FEATURED_ITEMS}}

			<!-- ############################################################## -->
			{{CATEGORY_PRODUCT_DISPLAY}}
				{{CATEGORY_INFORMATION}}
		    <div class="sc_featureheaders">
					<div class="sc_featured_box">{{CATEGORY_NAME}}</div>
					{{CATEGORY_DESCRIPTION_ONCE_CONT}}
		      <div class="sc_cat_desc">{{CATEGORY_DESCRIPTION}}</div>
		      {{/CATEGORY_DESCRIPTION_ONCE_CONT}}
				</div>
				{{/CATEGORY_INFORMATION}}

				{{CATEGORY_PRODUCTS_LOOP}}
				
				<div>
	      	{{PRODUCT_LOOP}}
	        {{PRODUCT_1}}
	        <div class="sc_product_pad_style">
	        	<div class="sc_product_inner_pad_style">
		      		<div class="sc_div_grid_featured">
		      			<div class="sc_div_grid_featured_left sc_product_image sc_align_center">
				      		<!--<div class="sc_cat_product_list_left ">-->
				      			<a href="{{PRODUCT_LINK}}"><img src="./photos/shopcart/productThumbnails/{{PRODUCT_FILENAME}}" class="sc_product_border" alt="Click to view {{PRODUCT_NAME}}" /></a>
				      		<!--</div>-->
				      	</div>
				      	<div class="sc_div_grid_featured_right">
				      		<div class="sc_cat_product_list_right">
				      			
				      			<div class="sc_product_text_spacer">
				      				<span class="style14"><a href="{{PRODUCT_LINK}}">{{PRODUCT_NAME}}</a></span> ({{PRODUCT_NUMBER}}) <br />
		              	</div>
		              	
		              	<div class="sc_product_text_spacer">
				      				<span class="style18">${{PRICE_BLOCK}}{{PRODUCT_PRICE_FORMATTED}}{{/PRICE_BLOCK}}{{PRODUCT_SPECIAL_BLOCK}}{{PRODUCT_SPECIAL_PRICE_FORMATTED}}{{/PRODUCT_SPECIAL_BLOCK}}</span>
		              	</div>
		              	
		              	<div class="sc_product_text_spacer sc_align_center">
		                	<span class="sc_product_desc">{{PRODUCT_DESCRIPTION}}</span>
		                </div>
		                
		                <div>
		                	<span class="button_style_grey"><a href="{{PRODUCT_LINK}}">More Info</a></span>
		                	<span class="sc_featured_button_padding">&nbsp;</span>
		                  {{IS_ACTIVE}}<span class="button_style_green"><a href="{{SELF_LINK}}?command=addToCart&productID={{PRODUCT_ID}}&quantity=1&fpid={{pID}}&fcid={{cID}}&nextCommand=viewCart">Add To Cart</a></span>{{/IS_ACTIVE}}
		                  {{IS_SOLDOUT}}<span class="sold_out">Out Of Stock</span>{{/IS_SOLDOUT}}
		                </div>
		              </div>
		            </div>
		          </div>
		        </div>
	        </div>
	        {{/PRODUCT_1}}
					{{/PRODUCT_LOOP}}
	      </div>
	      {{/CATEGORY_PRODUCTS_LOOP}}
			{{/CATEGORY_PRODUCT_DISPLAY}}
		</div>
	</div>
</div>