<?php echo $header; ?>



<div id="content_container" class="ccc_interior">

    <div class="container full-width">

        <div id="content" class="full-width">

            <div id="main-content" class="alpha">

                <ul id="order" class="steps">

                    <li class="inactive" id="step_1"><h3><a href="/bases/"><?php echo $step_1; ?></h3></a></li>

                    <li class="active" id="step_2"><h3><a href="/ingredients/<?php if ($base) { echo $base; }?>"><?php echo $step_2; ?></h3></a></li>

                    <li class="inactive" id="step_3"><h3><a href="/mixname/"><?php echo $step_3; ?></h3></a></li>

                </ul>



                <div id="tabs" class="ui-tabs">



                    <ul id="ingredient-types">

                        <li class="title"><?php echo $text_ingredient_type; ?></li>

                        <?php foreach ($categories as $category) {?>

                            <li><a href="#category-<?php echo $category['category_id']; ?>"><?php echo $category['category_name']; ?></a></li>

                        <?php } ?>

                    </ul>



                    <br class="clear"/>



                    <?php foreach ($categories as $category) {
                        $first_cat = $category['category_id'];
                    ?>


                        <div id="category-<?php echo $category['category_id']; ?>">

                            <table class="ingredients" cellpadding="0" cellspacing="0" border="0">

                            <?php for ($i = 0; $i < sizeof($category['products']); $i = $i + 3) { ?>

                                <tr>

                                <?php $k = 0; ?>

                                <?php for ($j = $i; $j < ($i + 3); $j++) { ?>

                                    <?php $k++; ?>

                                    <td class="grid_3 ingredient <?php echo 'column_' . $k; ?>">

                                        <?php if (isset($category['products'][$j])) { ?>

                                            <div class="pic">

                                                <a href="<?php echo $category['products'][$j]['zoom_href']; ?>" class="zoom"><img src="<?php echo $category['products'][$j]['thumb']; ?>" title="<?php echo $category['products'][$j]['product_name']; ?>" alt="<?php echo $category['products'][$j]['product_name']; ?>" /></a>

                                            </div>

                                            <form action="/cart" method="post" enctype="multipart/form-data" id="add_<?php echo $category['products'][$j]['product_id'] ?>">



                                                <div class="add_to_mix">

                                                    <a onclick="$('#add_<?php echo $category['products'][$j]['product_id'] ?>').submit();" class="add-to-cart button" href="#add-to-mix"><span><?php echo $text_add_to_mix; ?></span></a>

                                                    <input type="hidden" name="quantity" value="1" />

                                                    <input type="hidden" name="product_class_id" value="<?php echo $category['products'][$j]['product_class'] ?>" />

                                                    <input type="hidden" name="product_id" value="<?php echo $category['products'][$j]['product_id'] ?>" />

                                                </div>

                                            </form>



                                                <div class="view_larger"><a href="<?php echo $category['products'][$j]['zoom_href']; ?>" class="zoom"><?php echo $text_more_info; ?></a></div>

                                                <h3><a href="<?php echo $category['products'][$j]['href']; ?>"><?php echo $category['products'][$j]['product_name']; ?></a></h3>

                                                <p class="product_serving"><?php echo $text_ingredient_size; ?></p>

                                                <p class="product_price"><?php echo $category['products'][$j]['price']; ?></p>





                                        <?php } ?>

                                    </td>

                                    <?php } ?>

                                </tr>

                                <?php } ?>

                            </table>



                        <ul id="ingredient-types2">

                        <li class="title"><?php echo $text_ingredient_type; ?></li>

                        <?php foreach ($categories as $category) {
                            if ($category['category_id'] == $first_cat)
                            {
                        ?>
                            <li><a rel="category-<?php echo $category['category_id']; ?>" style="cursor:pointer;" class="bnav activate"><?php echo $category['category_name']; ?></a></li>

                        <?php
                            } else
                            {

                        ?>
                            <li><a rel="category-<?php echo $category['category_id']; ?>" style="cursor:pointer;" class="bnav"><?php echo $category['category_name']; ?></a></li>
                        <?php
                            }
                        <?php } ?>

                    </ul>





                            <a class="back button" href="/bases"><span><< Select Base</span></a>



                          <a class="forward button" href="/mixname"><span>Place Order >></span></a>

                        </div>

                    <?php } ?>



                    </div>

            </div>





            <div id="sidebar" class="omega">

                <?php echo $column_right; ?>

            </div>

        <br class="clear"/>

        </div>

    </div>

</div>





<?php echo $footer; ?>

 <script type="text/javascript">

 $("#tabs").tabs();

$('#ingredient-types2 a').click(function() {

   $("#tabs").tabs().tabs("select", $(this).attr("rel"));

   return false;

  });





 </script>