add new template and update application layout.

@@ -8,13 +8,50 @@
   <meta name="author" content="">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <link rel="shortcut icon" href="/favicon.ico">
-<script src="javascripts/libs/modernizr-1.7.min.js"></script>
+<script src="/javascripts/libs/modernizr-1.7.min.js"></script>
 <%= stylesheet_link_tag :all %>
 <%= csrf_meta_tag %>
 <%= yield :head %>
 </head>
 <body>
 
+
+<!-- start ribbon background -->
+<div id="page_bg">
+  <!-- start content -->
+  <div id="container">
+    <!-- start header -->
+    <div id="header">
+      <div id="header_logo"> <a href="index.html#"><img src="/images/template/logo.png" alt="Logo" width="322" height="56" border="0" /></a> </div>
+      <div id="header_slogan"><img src="/images/template/slogan.png" alt="Gourmet Online Shop" width="213" height="40" /></div>
+    </div>
+    <!-- end header -->
+    <div id="menu_container">
+      <ul id="navigation">
+        <li class="current"><a href="index.html">Home</a></li>
+        <li><a href="about.html">About</a></li>
+        <li><a href="shop.html">Products</a>
+          <ul class="second-level">
+            <li> <a href="index.html#">Product 1</a> </li>
+            <li> <a href="index.html#">Product 2</a> </li>
+            <li> <a href="index.html#">Product 3</a> </li>
+            <li> <a href="index.html#">Product 4</a> </li>
+            <li> <a href="index.html#">Product 5</a> </li>
+          </ul>
+        </li>
+        <li><a href="index.html#">Gifts</a></li>
+        <li><a href="index.html#">Stores</a></li>
+        <li><a href="index.html#">FAQ</a></li>
+        <li class="last"><a href="contact.html">Contact</a></li>
+      </ul>
+    </div>
+    <div id="mainContent">
+      <!-- start body content -->
+      <div id="right_side">
+        <div id="s1" class="slide"> <img style="display: none;" src="/images/template/banner_cupcakes.jpg" alt="" width="666" height="226" /> <img style="display: none;" src="/images/template/banner_weddings.jpg" alt="" width="666" height="226" /> </div>
+        <div id="body_text">
+          <!-- begin main page content -->
+
 <% form_tag(search_index_path, :method => "get") do %>
     <%= text_field_tag(:q) %>
     <%= submit_tag("search") %>
@@ -37,6 +74,59 @@
 <% end %>
 
 <%= yield %>
+          <!-- end main page content -->
+        </div>
+      </div>
+      <!-- end body content -->
+      <div id="left_side">
+        <!-- start left menu -->
+        <div style="position:relative; margin-top:-47px; width:147px; height:93px; background:url(/images/template/tag_top.gif);"></div>
+        <div class="tag">
+          <ul>
+            <li><a href="index.html#">Father's Day</a></li>
+            <li><a href="index.html#">Chocolates</a></li>
+            <li><a href="index.html#">Fudge</a></li>
+            <li><a href="index.html#">Lollies</a></li>
+            <li><a href="index.html#">Hampers</a></li>
+            <li><a href="index.html#">Special Diet</a></li>
+            <li><a href="index.html#">On Sale</a></li>
+          </ul>
+          <p>&nbsp; </p>
+        </div>
+        <!-- end left menu -->
+        <!-- start search tag -->
+        <div id="search_box">
+          <form action="index.html#" method="get" name="search">
+            <div>
+              <div id="search_box_inner">
+                <input name="search_query" id="search_query" type="text" style="" value="    SEARCH" onfocus="if(this.value=='    SEARCH')this.value='';" />
+              </div>
+              <!-- set padding-top:1px in IE 6 and 7 if statement -->
+              <div id="search_box_go">
+                <input type="image" src="/images/template/go.gif" alt="Go!" style="margin:0px; padding:0px;" />
+              </div>
+            </div>
+          </form>
+        </div>
+        <!-- end search -->
+        <div id="shopping_cart_summary">
+          <div> <a href="index.html#">3 Items</a> | <a href="index.html#">$2.00</a> </div>
+          <div> <a href="index.html#">Check out</a> </div>
+        </div>
+      </div>
+      <hr class="clear" />
+    </div>
+    <!-- start footer -->
+    <div id="footer">
+      <div style="float:left">&copy; Candy Cakes</div>
+      <div style="float:right; "><a href="http://themeforest.net/user/dtbaker/portfolio?ref=dtbaker">Template design by dtbaker</a> | <a href="index.html#">Privacy Policy</a> | <a href="sitemap.php">Site Map</a></div>
+    </div>
+    <!-- end footer -->
+  </div>
+</div>
+<!-- end content --><script type="text/javascript">
+
+
 
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
 <%= javascript_include_tag :all %>
@@ -53,3 +143,4 @@
   </script>
 </body>
 </html>
+

Binary file

@@ -0,0 +1,74 @@
+function hideSelectBoxes(object)
+{
+	if (!object) return;
+	if (!object.sboxes)
+		object.sboxes = [];
+	var ol = getElementX(object);
+	var ot = getElementY(object);
+	var ow = object.offsetWidth;
+	var oh = object.offsetHeight;
+	var sboxes = document.all.tags("select");
+	for (var i=0; i<sboxes.length; i++)
+	{
+		var node = sboxes[i].parentNode;
+		while (node != object && node.tagName != "BODY")
+			node = node.parentNode;
+		var skip = (node == object);
+		if (skip) continue;
+		var t = getElementY(sboxes[i]);
+		var l = getElementX(sboxes[i]);
+		var w = sboxes[i].offsetWidth;
+		var h = sboxes[i].offsetHeight;
+		var ver = false;
+		if (t > ot && t < (ot + oh))
+			ver = true;
+		else if ((t + h) > ot && (t + h) < (ot + oh))
+			ver = true;
+		var hor = false;
+		if (l > ol && l < (ol + ow))
+			hor = true;
+		else if ((l + w) > ol && (l + w) < (ol + ow))
+			hor = true;
+		else if (l < ol && (l + w) > ol)
+			hor = true;
+		if (true || ver && hor && sboxes[i].style.visibility != "hidden")
+			object.sboxes[object.sboxes.length] = sboxes[i];
+	}
+		
+	for (var i=0; i<object.sboxes.length; i++)
+		object.sboxes[i].style.visibility = "hidden";
+}
+
+function showSelectBoxes(object)
+{
+	if (!object) return;
+	if (!object.sboxes) return;
+	for (var i=0; i<object.sboxes.length; i++)
+		object.sboxes[i].style.visibility = "";
+	object.sboxes = [];
+}
+
+function getElementX(object) {return getElementC(object, true)}
+function getElementY(object) {return getElementC(object, false)}
+
+function getElementC(element, xAxis)
+{
+	var initialElement = element;
+	var c = 0;
+
+	while (element != null)
+	{
+		c += (xAxis) ? element.offsetLeft : element.offsetTop;
+		if (element.style.position == "absolute")
+			break;
+		else
+			element = element.offsetParent;
+	}
+
+	var elementWnd = document.window;
+	if (!elementWnd) return c;
+
+	if (!elementWnd.frameElement) return c;
+
+	return c + getElementC(elementWnd.frameElement, xAxis);
+}

@@ -0,0 +1,542 @@
+/*
+ * jQuery Cycle Plugin for light-weight slideshows
+ * Examples and documentation at: http://malsup.com/jquery/cycle/
+ * Copyright (c) 2007-2008 M. Alsup
+ * Version: 2.10 (02/10/2008)
+ * Dual licensed under the MIT and GPL licenses:
+ * http://www.opensource.org/licenses/mit-license.php
+ * http://www.gnu.org/licenses/gpl.html
+ * Requires: jQuery v1.1.3.1 or later
+ *
+ * Based on the work of:
+ *  1) Matt Oakes (http://portfolio.gizone.co.uk/applications/slideshow/)
+ *  2) Torsten Baldes (http://medienfreunde.com/lab/innerfade/)
+ *  3) Benjamin Sterling (http://www.benjaminsterling.com/experiments/jqShuffle/)
+ */
+(function($) {
+
+var ver = '2.10';
+var ie6 = $.browser.msie && /MSIE 6.0/.test(navigator.userAgent);
+
+$.fn.cycle = function(options) {
+    return this.each(function() {
+        options = options || {};
+        if (options.constructor == String) {
+            switch(options) {
+            case 'stop':
+                if (this.cycleTimeout) clearTimeout(this.cycleTimeout);
+                this.cycleTimeout = 0;
+                return;
+            case 'pause':
+                this.cyclePause = 1;
+                return;
+            case 'resume':
+                this.cyclePause = 0;
+                return;
+            default:
+                options = { fx: options };
+            };
+        }
+        var $cont = $(this);
+        var $slides = options.slideExpr ? $(options.slideExpr, this) : $cont.children();
+        var els = $slides.get();
+        if (els.length < 2) return; // don't bother
+
+        // support metadata plugin (v1.0 and v2.0)
+        var opts = $.extend({}, $.fn.cycle.defaults, options || {}, $.metadata ? $cont.metadata() : $.meta ? $cont.data() : {});
+        if (opts.autostop) 
+            opts.countdown = opts.autostopCount || els.length;
+            
+        opts.before = opts.before ? [opts.before] : [];
+        opts.after = opts.after ? [opts.after] : [];
+        opts.after.unshift(function(){ opts.busy=0; });
+
+        // clearType corrections
+        if (ie6 && opts.cleartype && !opts.cleartypeNoBg)
+            clearTypeFix($slides);
+
+        // allow shorthand overrides of width, height and timeout
+        var cls = this.className;
+        var w = parseInt((cls.match(/w:(\d+)/)||[])[1]) || opts.width;
+        var h = parseInt((cls.match(/h:(\d+)/)||[])[1]) || opts.height;
+        opts.timeout = parseInt((cls.match(/t:(\d+)/)||[])[1]) || opts.timeout;
+
+        if ($cont.css('position') == 'static') 
+            $cont.css('position', 'relative');
+        if (w) 
+            $cont.width(w);
+        if (h && h != 'auto') 
+            $cont.height(h);
+
+        if (opts.random) {
+            opts.randomMap = [];
+            for (var i = 0; i < els.length; i++) 
+                opts.randomMap.push(i);
+            opts.randomMap.sort(function(a,b) {return Math.random() - 0.5;});
+            opts.randomIndex = 0;
+            opts.startingSlide = opts.randomMap[0];
+        }
+        else if (opts.startingSlide >= els.length)
+            opts.startingSlide = 0; // catch bogus input
+        var first = opts.startingSlide || 0;
+        $slides.css('position','absolute').hide().each(function(i) { 
+            var z = first ? i >= first ? els.length - (i-first) : first-i : els.length-i;
+            $(this).css('z-index', z) 
+        });
+        
+        $(els[first]).show();
+        if (opts.fit && w) 
+            $slides.width(w);
+        if (opts.fit && h && h != 'auto') 
+            $slides.height(h);
+        if (opts.pause) 
+            $cont.hover(function(){this.cyclePause=1;}, function(){this.cyclePause=0;});
+
+        // run transition init fn
+        var init = $.fn.cycle.transitions[opts.fx];
+        if ($.isFunction(init))
+            init($cont, $slides, opts);
+
+        $slides.each(function() {
+            var $el = $(this);
+            this.cycleH = (opts.fit && h) ? h : $el.height();
+            this.cycleW = (opts.fit && w) ? w : $el.width();
+        });
+
+        opts.cssBefore = opts.cssBefore || {};
+        opts.animIn = opts.animIn || {};
+        opts.animOut = opts.animOut || {};
+
+        $slides.not(':eq('+first+')').css(opts.cssBefore);
+        if (opts.cssFirst)
+            $($slides[first]).css(opts.cssFirst);
+
+        if (opts.timeout) {
+            // ensure that timeout and speed settings are sane
+            if (opts.speed.constructor == String)
+                opts.speed = {slow: 600, fast: 200}[opts.speed] || 400;
+            if (!opts.sync)
+                opts.speed = opts.speed / 2;
+            while((opts.timeout - opts.speed) < 250)
+                opts.timeout += opts.speed;
+        }
+        if (opts.easing) 
+            opts.easeIn = opts.easeOut = opts.easing;
+        if (!opts.speedIn) 
+            opts.speedIn = opts.speed;
+        if (!opts.speedOut) 
+            opts.speedOut = opts.speed;
+
+ 		opts.slideCount = els.length;
+        opts.currSlide = first;
+        if (opts.random) {
+            opts.nextSlide = opts.currSlide;
+            if (++opts.randomIndex == els.length) 
+                opts.randomIndex = 0;
+            opts.nextSlide = opts.randomMap[opts.randomIndex];
+        }
+        else
+            opts.nextSlide = opts.startingSlide >= (els.length-1) ? 0 : opts.startingSlide+1;
+
+        // fire artificial events
+        var e0 = $slides[first];
+        if (opts.before.length)
+            opts.before[0].apply(e0, [e0, e0, opts, true]);
+        if (opts.after.length > 1)
+            opts.after[1].apply(e0, [e0, e0, opts, true]);
+        
+        if (opts.click && !opts.next)
+            opts.next = opts.click;
+        if (opts.next)
+            $(opts.next).bind('click', function(){return advance(els,opts,opts.rev?-1:1)});
+        if (opts.prev)
+            $(opts.prev).bind('click', function(){return advance(els,opts,opts.rev?1:-1)});
+        if (opts.pager)
+            buildPager(els,opts);
+        if (opts.timeout)
+            this.cycleTimeout = setTimeout(function(){go(els,opts,0,!opts.rev)}, opts.timeout + (opts.delay||0));
+    });
+};
+
+function go(els, opts, manual, fwd) {
+    if (opts.busy) return;
+    var p = els[0].parentNode, curr = els[opts.currSlide], next = els[opts.nextSlide];
+    if (p.cycleTimeout === 0 && !manual) 
+        return;
+
+    if (!manual && !p.cyclePause && 
+        ((opts.autostop && (--opts.countdown <= 0)) ||
+        (opts.nowrap && !opts.random && opts.nextSlide < opts.currSlide)))
+        return;
+
+    if (manual || !p.cyclePause) {
+        if (opts.before.length)
+            $.each(opts.before, function(i,o) { o.apply(next, [curr, next, opts, fwd]); });
+        var after = function() {
+            if ($.browser.msie && opts.cleartype)
+                this.style.removeAttribute('filter');
+            $.each(opts.after, function(i,o) { o.apply(next, [curr, next, opts, fwd]); });
+        };
+
+        if (opts.nextSlide != opts.currSlide) {
+            opts.busy = 1;
+            if (opts.fxFn)
+                opts.fxFn(curr, next, opts, after, fwd);
+            else if ($.isFunction($.fn.cycle[opts.fx]))
+                $.fn.cycle[opts.fx](curr, next, opts, after);
+            else
+                $.fn.cycle.custom(curr, next, opts, after);
+        }
+        if (opts.random) {
+            opts.currSlide = opts.nextSlide;
+            if (++opts.randomIndex == els.length) 
+                opts.randomIndex = 0;
+            opts.nextSlide = opts.randomMap[opts.randomIndex];
+        }
+        else { // sequence
+            var roll = (opts.nextSlide + 1) == els.length;
+            opts.nextSlide = roll ? 0 : opts.nextSlide+1;
+            opts.currSlide = roll ? els.length-1 : opts.nextSlide-1;
+        }
+        if (opts.pager)
+            $(opts.pager).find('a').removeClass('activeSlide').filter('a:eq('+opts.currSlide+')').addClass('activeSlide');
+    }
+    if (opts.timeout)
+        p.cycleTimeout = setTimeout(function() { go(els,opts,0,!opts.rev) }, opts.timeout);
+};
+
+// advance slide forward or back
+function advance(els, opts, val) {
+    var p = els[0].parentNode, timeout = p.cycleTimeout;
+    if (timeout) {
+        clearTimeout(timeout);
+        p.cycleTimeout = 0;
+    }
+    opts.nextSlide = opts.currSlide + val;
+    if (opts.nextSlide < 0) {
+        if (opts.nowrap) return false;
+        opts.nextSlide = els.length - 1;
+    }
+    else if (opts.nextSlide >= els.length) {
+        if (opts.nowrap) return false;
+        opts.nextSlide = 0;
+    }
+    if (opts.prevNextClick && typeof opts.prevNextClick == 'function')
+        opts.prevNextClick(val > 0, opts.nextSlide, els[opts.nextSlide]);
+    go(els, opts, 1, val>=0);
+    return false;
+};
+
+function buildPager(els, opts) {
+    var $p = $(opts.pager);
+    $.each(els, function(i,o) {
+        var $a = (typeof opts.pagerAnchorBuilder == 'function')
+            ? $(opts.pagerAnchorBuilder(i,o))
+            : $('<a href="#">'+(i+1)+'</a>');
+        // don't reparent if anchor is in the dom
+        if ($a.parents('body').length == 0)
+            $a.appendTo($p);
+        $a.bind('click',function() {
+            opts.nextSlide = i;
+            var p = els[0].parentNode, timeout = p.cycleTimeout;
+            if (timeout) {
+                clearTimeout(timeout);
+                p.cycleTimeout = 0;
+            }            
+            if (typeof opts.pagerClick == 'function')
+                opts.pagerClick(opts.nextSlide, els[opts.nextSlide]);
+            go(els,opts,1,!opts.rev);
+            return false;
+        });
+    });
+   $p.find('a').filter('a:eq('+opts.startingSlide+')').addClass('activeSlide');
+};
+
+// this fixes clearType problems in ie6 by setting an explicit bg color
+function clearTypeFix($slides) {
+    function hex(s) {
+        var s = parseInt(s).toString(16);
+        return s.length < 2 ? '0'+s : s;
+    };
+    function getBg(e) {
+        for ( ; e && e.nodeName.toLowerCase() != 'html'; e = e.parentNode) {
+            var v = $.css(e,'background-color');
+            if (v.indexOf('rgb') >= 0 ) { 
+                var rgb = v.match(/\d+/g); 
+                return '#'+ hex(rgb[0]) + hex(rgb[1]) + hex(rgb[2]);
+            }
+            if (v && v != 'transparent')
+                return v;
+        }
+        return '#ffffff';
+    };
+    $slides.each(function() { $(this).css('background-color', getBg(this)); });
+};
+
+
+$.fn.cycle.custom = function(curr, next, opts, cb) {
+    var $l = $(curr), $n = $(next);
+    $n.css(opts.cssBefore);
+    var fn = function() {$n.animate(opts.animIn, opts.speedIn, opts.easeIn, cb)};
+    $l.animate(opts.animOut, opts.speedOut, opts.easeOut, function() {
+        if (opts.cssAfter) $l.css(opts.cssAfter);
+        if (!opts.sync) fn();
+    });
+    if (opts.sync) fn();
+};
+
+$.fn.cycle.transitions = {
+    fade: function($cont, $slides, opts) {
+        $slides.not(':eq('+opts.startingSlide+')').css('opacity',0);
+        opts.before.push(function() { $(this).show() });
+        opts.animIn    = { opacity: 1 };
+        opts.animOut   = { opacity: 0 };
+        opts.cssAfter  = { display: 'none' };
+    }
+};
+
+$.fn.cycle.ver = function() { return ver; };
+
+// override these globally if you like (they are all optional)
+$.fn.cycle.defaults = {
+    fx:           'fade', // one of: fade, shuffle, zoom, slideX, slideY, scrollUp/Down/Left/Right
+    timeout:       4000,  // milliseconds between slide transitions (0 to disable auto advance)
+    speed:         1000,  // speed of the transition (any valid fx speed value)
+    speedIn:       null,  // speed of the 'in' transition
+    speedOut:      null,  // speed of the 'out' transition
+    click:         null,  // @deprecated; please use the 'next' option
+    next:          null,  // id of element to use as click trigger for next slide
+    prev:          null,  // id of element to use as click trigger for previous slide
+    prevNextClick: null,  // callback fn for prev/next clicks:  function(isNext, zeroBasedSlideIndex, slideElement)
+    pager:         null,  // id of element to use as pager container
+    pagerClick:    null,  // callback fn for pager clicks:  function(zeroBasedSlideIndex, slideElement)
+    pagerAnchorBuilder: null, // callback fn for building anchor links
+    before:        null,  // transition callback (scope set to element to be shown)
+    after:         null,  // transition callback (scope set to element that was shown)
+    easing:        null,  // easing method for both in and out transitions
+    easeIn:        null,  // easing for "in" transition
+    easeOut:       null,  // easing for "out" transition
+    shuffle:       null,  // coords for shuffle animation, ex: { top:15, left: 200 }
+    animIn:        null,  // properties that define how the slide animates in
+    animOut:       null,  // properties that define how the slide animates out
+    cssBefore:     null,  // properties that define the initial state of the slide before transitioning in
+    cssAfter:      null,  // properties that defined the state of the slide after transitioning out
+    fxFn:          null,  // function used to control the transition
+    height:       'auto', // container height
+    startingSlide: 0,     // zero-based index of the first slide to be displayed
+    sync:          1,     // true if in/out transitions should occur simultaneously
+    random:        0,     // true for random, false for sequence (not applicable to shuffle fx)
+    fit:           0,     // force slides to fit container
+    pause:         0,     // true to enable "pause on hover"
+    autostop:      0,     // true to end slideshow after X transitions (where X == slide count)
+    delay:         0,     // additional delay (in ms) for first transition (hint: can be negative)
+    slideExpr:     null,  // expression for selecting slides (if something other than all children is required)
+    cleartype:     0,     // true if clearType corrections should be applied (for IE)
+    nowrap:        0      // true to prevent slideshow from wrapping
+};
+
+})(jQuery);
+
+/*
+ * jQuery Cycle Plugin Transition Definitions
+ * This script is a plugin for the jQuery Cycle Plugin
+ * Examples and documentation at: http://malsup.com/jquery/cycle/
+ * Copyright (c) 2007 M. Alsup
+ * Version:  2.07
+ * Dual licensed under the MIT and GPL licenses:
+ * http://www.opensource.org/licenses/mit-license.php
+ * http://www.gnu.org/licenses/gpl.html
+ */
+
+//
+// These functions define one-time slide initialization for the named
+// transitions. To save file size feel free to remove any of these that you 
+// don't need.
+//
+
+// scrollUp/Down/Left/Right
+jQuery.fn.cycle.transitions.scrollUp = function($cont, $slides, opts) {
+    $cont.css('overflow','hidden');
+    opts.before.push(function(curr, next, opts) {
+        jQuery(this).show();
+        opts.cssBefore.top = next.offsetHeight;
+        opts.animOut.top = 0-curr.offsetHeight;
+    });
+    opts.cssFirst = { top: 0 };
+    opts.animIn   = { top: 0 };
+    opts.cssAfter = { display: 'none' };
+};
+jQuery.fn.cycle.transitions.scrollDown = function($cont, $slides, opts) {
+    $cont.css('overflow','hidden');
+    opts.before.push(function(curr, next, opts) {
+        jQuery(this).show();
+        opts.cssBefore.top = 0-next.offsetHeight;
+        opts.animOut.top = curr.offsetHeight;
+    });
+    opts.cssFirst = { top: 0 };
+    opts.animIn   = { top: 0 };
+    opts.cssAfter = { display: 'none' };
+};
+jQuery.fn.cycle.transitions.scrollLeft = function($cont, $slides, opts) {
+    $cont.css('overflow','hidden');
+    opts.before.push(function(curr, next, opts) {
+        jQuery(this).show();
+        opts.cssBefore.left = next.offsetWidth;
+        opts.animOut.left = 0-curr.offsetWidth;
+    });
+    opts.cssFirst = { left: 0 };
+    opts.animIn   = { left: 0 };
+};
+jQuery.fn.cycle.transitions.scrollRight = function($cont, $slides, opts) {
+    $cont.css('overflow','hidden');
+    opts.before.push(function(curr, next, opts) {
+        jQuery(this).show();
+        opts.cssBefore.left = 0-next.offsetWidth;
+        opts.animOut.left = curr.offsetWidth;
+    });
+    opts.cssFirst = { left: 0 };
+    opts.animIn   = { left: 0 };
+};
+jQuery.fn.cycle.transitions.scrollHorz = function($cont, $slides, opts) {
+    $cont.css('overflow','hidden').width();
+//    $slides.show();
+    opts.before.push(function(curr, next, opts, fwd) {
+        jQuery(this).show();
+        var currW = curr.offsetWidth, nextW = next.offsetWidth;
+        opts.cssBefore = fwd ? { left: nextW } : { left: -nextW };
+        opts.animIn.left = 0;
+        opts.animOut.left = fwd ? -currW : currW;
+        $slides.not(curr).css(opts.cssBefore);
+    });
+    opts.cssFirst = { left: 0 };
+    opts.cssAfter = { display: 'none' }
+};
+jQuery.fn.cycle.transitions.scrollVert = function($cont, $slides, opts) {
+    $cont.css('overflow','hidden');
+//    $slides.show();
+    opts.before.push(function(curr, next, opts, fwd) {
+        jQuery(this).show();
+        var currH = curr.offsetHeight, nextH = next.offsetHeight;
+        opts.cssBefore = fwd ? { top: -nextH } : { top: nextH };
+        opts.animIn.top = 0;
+        opts.animOut.top = fwd ? currH : -currH;
+        $slides.not(curr).css(opts.cssBefore);
+    });
+    opts.cssFirst = { top: 0 };
+    opts.cssAfter = { display: 'none' }
+};
+
+// slideX/slideY
+jQuery.fn.cycle.transitions.slideX = function($cont, $slides, opts) {
+    opts.animIn  = { width: 'show' };
+    opts.animOut = { width: 'hide' };
+};
+jQuery.fn.cycle.transitions.slideY = function($cont, $slides, opts) {
+    opts.animIn  = { height: 'show' };
+    opts.animOut = { height: 'hide' };
+};
+
+// shuffle
+jQuery.fn.cycle.transitions.shuffle = function($cont, $slides, opts) {
+    var w = $cont.css('overflow', 'visible').width();
+    $slides.css({left: 0, top: 0});
+    opts.before.push(function() { jQuery(this).show() });
+    opts.speed = opts.speed / 2; // shuffle has 2 transitions        
+    opts.random = 0;
+    opts.shuffle = opts.shuffle || {left:-w, top:15};
+    opts.els = [];
+    for (var i=0; i < $slides.length; i++)
+        opts.els.push($slides[i]);
+
+    for (var i=0; i < opts.startingSlide; i++)
+        opts.els.push(opts.els.shift());
+
+    // custom transition fn (hat tip to Benjamin Sterling for this bit of sweetness!)
+    opts.fxFn = function(curr, next, opts, cb, fwd) {
+        var $el = fwd ? jQuery(curr) : jQuery(next);
+        $el.animate(opts.shuffle, opts.speedIn, opts.easeIn, function() {
+            fwd ? opts.els.push(opts.els.shift()) : opts.els.unshift(opts.els.pop());
+            if (fwd) 
+                for (var i=0, len=opts.els.length; i < len; i++)
+                    jQuery(opts.els[i]).css('z-index', len-i);
+            else {
+                var z = jQuery(curr).css('z-index');
+                $el.css('z-index', parseInt(z)+1);
+            }
+            $el.animate({left:0, top:0}, opts.speedOut, opts.easeOut, function() {
+                jQuery(fwd ? this : curr).hide();
+                if (cb) cb();
+            });
+        });
+    };
+};
+
+// turnUp/Down/Left/Right
+jQuery.fn.cycle.transitions.turnUp = function($cont, $slides, opts) {
+    opts.before.push(function(curr, next, opts) {
+        jQuery(this).show();
+        opts.cssBefore.top = next.cycleH;
+        opts.animIn.height = next.cycleH;
+    });
+    opts.cssFirst  = { top: 0 };
+    opts.cssBefore = { height: 0 };
+    opts.animIn    = { top: 0 };
+    opts.animOut   = { height: 0 };
+    opts.cssAfter  = { display: 'none' };
+};
+jQuery.fn.cycle.transitions.turnDown = function($cont, $slides, opts) {
+    opts.before.push(function(curr, next, opts) {
+        jQuery(this).show();
+        opts.animIn.height = next.cycleH;
+        opts.animOut.top   = curr.cycleH;
+    });
+    opts.cssFirst  = { top: 0 };
+    opts.cssBefore = { top: 0, height: 0 };
+    opts.animOut   = { height: 0 };
+    opts.cssAfter  = { display: 'none' };
+};
+jQuery.fn.cycle.transitions.turnLeft = function($cont, $slides, opts) {
+    opts.before.push(function(curr, next, opts) {
+        jQuery(this).show();
+        opts.cssBefore.left = next.cycleW;
+        opts.animIn.width = next.cycleW;
+    });
+    opts.cssBefore = { width: 0 };
+    opts.animIn    = { left: 0 };
+    opts.animOut   = { width: 0 };
+    opts.cssAfter  = { display: 'none' };
+};
+jQuery.fn.cycle.transitions.turnRight = function($cont, $slides, opts) {
+    opts.before.push(function(curr, next, opts) {
+        jQuery(this).show();
+        opts.animIn.width = next.cycleW;
+        opts.animOut.left = curr.cycleW;
+    });
+    opts.cssBefore = { left: 0, width: 0 };
+    opts.animIn    = { left: 0 };
+    opts.animOut   = { width: 0 };
+    opts.cssAfter  = { display: 'none' };
+};
+
+// zoom
+jQuery.fn.cycle.transitions.zoom = function($cont, $slides, opts) {
+    opts.cssFirst = { top:0, left: 0 }; 
+    opts.cssAfter = { display: 'none' };
+    
+    opts.before.push(function(curr, next, opts) {
+        jQuery(this).show();
+        opts.cssBefore = { width: 0, height: 0, top: next.cycleH/2, left: next.cycleW/2 };
+        opts.animIn    = { top: 0, left: 0, width: next.cycleW, height: next.cycleH };
+        opts.animOut   = { width: 0, height: 0, top: curr.cycleH/2, left: curr.cycleW/2 };
+    });    
+};
+
+// fadeZoom
+jQuery.fn.cycle.transitions.fadeZoom = function($cont, $slides, opts) {
+    opts.before.push(function(curr, next, opts) {
+        opts.cssBefore = { width: 0, height: 0, opacity: 1, left: next.cycleW/2, top: next.cycleH/2, zIndex: 1 };
+        opts.animIn    = { top: 0, left: 0, width: next.cycleW, height: next.cycleH };
+    });    
+    opts.animOut  = { opacity: 0 };
+    opts.cssAfter = { zIndex: 0 };
+};

@@ -0,0 +1,440 @@
+/*Template Layout*/
+
+body {
+	font: 12px tahoma, Arial, Helvetica, sans-serif;
+	line-height: 1.5em;
+	margin: 0px;
+	padding: 0px;
+	color: #241a10;
+	background:#c9e4ec url(../images/template/page_bg.gif);
+}
+a, a:link, a:active, a:visited {
+	color: #605646;
+}
+a:hover {
+	text-decoration:none;
+}
+#page_bg {
+	background:url(../images/template/ribbon.gif) no-repeat center 108px;
+}
+#container {
+	width:850px;
+	margin: 0px auto;
+	padding:0px;
+}
+#header {
+	height: 108px;
+	padding: 0px;
+	background-image:url(../images/template/header_bg.jpg);
+	background-position:top;
+	background-repeat:no-repeat;
+}
+#header_logo {
+	height: 56px;
+	width: 322px;
+	float:left;
+	margin:40px 0px 0px 25px;
+}
+#header_slogan {
+	width:213px;
+	height:40px;
+	float:right;
+	margin:45px 25px 0px 0px;
+}
+#mainContent {
+	padding:0px;
+	background:#fffdee url(../images/template/body_top_shadow.jpg);
+	background-repeat:repeat-x;
+	background-position:top;
+	min-height:400px;
+}
+#left_side {
+	width:142px;
+	float:left;
+	margin-left:6px;
+}
+#right_side {
+	width:666px;
+	float:right;
+	margin-right:10px;
+	margin-top:10px;
+	padding-bottom:30px;
+}
+.inner_right {
+	float:right;
+	width:160px;
+	height:300px;
+	padding:4px 0 0 7px;
+}
+#footer {
+	padding: 10px;
+	height:15px;
+	margin:0px auto;
+	clear:both;
+	font-size:10px;
+	color:#1d6d85;
+	font-family:Verdana, Arial, Helvetica, sans-serif;
+}
+#footer a, #footer a:link, #footer a:visited {
+	color: #1d6d85;
+	text-decoration:none;
+}
+#footer a:hover {
+	color: #FFFFFF;
+	text-decoration:underline;
+}
+#footer a:active {
+	color: #1d6d85;
+	text-decoration:none;
+}
+/*-- navigation--*/
+
+#menu_container {
+	height:44px;
+}
+ul#navigation {
+	float:right;
+	position:relative;
+	z-index:30;
+	margin-top:2px;
+	margin-right:117px; /* Change this value to move the menu left / right */
+	margin-bottom:0;
+	margin-left:0;
+	padding:0;
+}
+ul#navigation li {
+	float:left;
+	list-style:none;
+	display:inline;
+	margin:0 0 0 0px;
+	padding:0;
+}
+ul#navigation li a, ul#navigation li a:link, ul#navigation li a:visited {
+	float:left;
+	color:#241a10;
+	padding:12px 16px;
+	display:block;
+	text-decoration:none;
+	font:13px tahoma, Arial, Helvetica, sans-serif;
+	text-transform:uppercase;
+	border-right:1px solid #eece81;
+}
+ul#navigation li.last a, ul#navigation li.last a:link, ul#navigation li.last a:visited {
+	border-right:0;
+}
+ul#navigation li.current a, ul#navigation li.hover a, ul#navigation li:hover a, ul#navigation a.active, ul#navigation a:hover {
+	color:#FFFFFF;
+	background-color:#eece81;
+}
+/*--second-level--*/
+ul#navigation li.hover, ul#navigation li:hover {
+	position:relative;
+}
+ul#navigation li.hover ul.second-level, ul#navigation li:hover ul.second-level {
+	display:block;
+}
+ul#navigation ul.second-level {
+	position:absolute;
+	top:40px;
+	left:-1px;
+	margin:0;
+	padding:0;
+	width:160px;
+	display:none;
+	background-color:#eece81;
+}
+ul#navigation ul.second-level li {
+	width:160px;
+	margin:0;
+}
+ul#navigation ul.second-level a, ul#navigation ul.second-level a:link, ul#navigation ul.second-level a:visited {
+	display:block;
+	float:none;
+	width:140px;
+	border-top: 1px solid #cfb371;
+	border-right:0;
+	padding:4px 10px;
+	background:none;
+	font:12px/20px tahoma, Arial, Helvetica, sans-serif;
+	color:#241a10;
+}
+ul#navigation ul.second-level li.hover a, ul#navigation ul.second-level li:hover a, ul#navigation ul.second-level a:hover {
+	color:#FFFFFF;
+	background:#cfb371;
+}
+/*end menu*/
+
+/*Tag Menu*/
+.tag {
+	background-image:url(../images/template/tag_bottom.gif);
+	background-repeat:no-repeat;
+	background-position:0px bottom;
+	width:148px;
+	margin-bottom:20px;
+}
+.tag p {
+	padding:0px 5px;
+}
+.tag ul {
+	padding:0 0 13px 0;
+	margin:0px;
+}
+.tag li {
+	list-style:none;
+	padding:0 0 0 15px;
+	margin:0px 0px 0px 8px; /* used to center the menu on its bg image */
+	line-height:22px;
+	background:url(../images/template/tag_line.gif) no-repeat 0 bottom;
+}
+.tag a, .tag a:link, .tag a:visited {
+	background-image:url(../images/template/tag_icon.gif);
+	background-position:left;
+	background-repeat:no-repeat;
+	display:block;
+	padding:0px 0 2px 15px;
+	color:#644d38;
+	text-decoration:none;
+	font-family:Tahoma, Arial;
+	font-size:12px;
+}
+.tag a:hover {
+	text-decoration:underline;
+	color:#605646;
+}
+/*Search Box on menu*/
+#search_box {
+	width:142px;
+	height:30px;
+	margin:0 0 16px 3px;
+}
+#search_box input {
+	font-family:"Times New Roman", Times, serif;
+	font-size:12px;
+	color:#605646;
+}
+#search_box p {
+	padding:0px 5px;
+}
+#search_box_inner {
+	margin-left:0px;
+	padding:0px;
+	width:105px;
+	height:21px;
+	float:left;
+}
+#search_query {
+	border:0px;
+	padding:3px 0px 0px 6px;
+	margin:0px 0px 0px 5px;
+	background-image:url(../images/template/search.gif);
+	background-repeat:no-repeat;
+	background-position:left;
+	width:105px;
+	height:20px;
+}
+#search_box_go {
+	float:left;
+	padding-top:0px;
+}
+/*Shopping Cart On the Menu*/
+#shopping_cart_summary {
+	background:url(../images/template/we_accept.gif) no-repeat;
+	width:142px;
+	height:71px;
+	color:#8f6637;
+	padding:24px 0 0 0;
+	font-family:Tahoma, Arial;
+	font-size:11px;
+	margin:0 0 0 4px;
+}
+#shopping_cart_summary div {
+	text-align:center;
+}
+#shopping_cart_summary a, #shopping_cart_summary a:link, #shopping_cart_summary a:visited {
+	color:#8f6637;
+	text-decoration:none;
+}
+#shopping_cart_summary a:hover {
+	color:#8f6637;
+	text-decoration:underline;
+}
+/*General Content*/
+
+h1 {
+	font-family:Georgia, "Times New Roman", Times, serif;
+	font-size:18px;
+	color:#cb4c72;
+	font-weight:normal;
+}
+h2 {
+	font-family:Georgia, "Times New Roman", Times, serif;
+	font-size:16px;
+	color:#936a39;
+	font-weight:normal;
+}
+h3 {
+	font-family:Georgia, "Times New Roman", Times, serif;
+	font-size:14px;
+	color:#1d6d85;
+}
+h4 {
+	font-family:Georgia, "Times New Roman", Times, serif;
+	font-size:12px;
+	color:#634f34;
+}
+form {
+	margin:0px;
+	padding:0px;
+}
+.image_border {
+	border: 1px solid #dfd0be;
+	margin: 3px 10px;
+	padding: 3px;
+}
+hr {
+	border: 0;
+	color: #dfd0be;
+	background-color: #dfd0be;
+	height: 1px;
+	width: 100%;
+	text-align: left;
+	clear:both;
+}
+hr.clear {
+	margin-top:10px;
+	margin:0px;
+	clear:both;
+	visibility:hidden;
+}
+/* font sizes */
+.size9 {
+	font-size:9px;
+}
+.size10 {
+	font-size:10px;
+}
+.size11 {
+	font-size:11px;
+}
+.size12 {
+	font-size:12px;
+}
+.size14 {
+	font-size:14px;
+}
+.size20 {
+	font-size:20px;
+}
+.size22 {
+	font-size:22px;
+}
+/*HOME PAGE*/
+
+.slide {
+	width:666px;
+	height:226px;
+}
+ul.ticklist {
+	padding:0px 0px 0px 15px; /*indent whole list*/
+}
+ul.ticklist li {
+	list-style:none;
+	background-image:url(../images/template/icon_tick.gif);
+	background-position:left 3px; /*the number here moves the tick down*/
+	background-repeat:no-repeat;
+	margin:0px 0px 5px 0px;
+	padding:0px;
+	padding-left:20px;
+	line-height:normal;
+}
+/*About Page*/
+
+.service_table td {
+	padding:3px 8px;
+	color:#624f34;
+	font-size:12px;
+	height:28px;
+}
+th { /*top row of the table*/
+	background-color:#fec1d1;
+	color:#FFFFFF;
+	font-weight:bold;
+	border-bottom:1px solid #ffffff;
+	height:28px;
+}
+.row1 {
+	background-color:#fff5f8;
+}
+.row2 {
+	background-color:#FFFFFF;
+}
+/*SHOP*/
+
+.product_box {
+	width:132px; /*140px minus padding*/
+	height:137px;
+	float:left;
+	background-color:#FFFFFF;
+	border:1px solid #e2dacf;
+	padding:4px;
+	margin:0px 9px 25px 9px;
+	text-align:center;
+	font-family:"Times New Roman", Times, serif;
+	font-size:13px;
+}
+.product_box p {
+	margin:0px;
+	padding:0px 0px 5px 0px;
+}
+/*Contact Page*/
+
+.left_details {
+	float:left;
+	width:240px;
+}
+.photo_contact {
+	width:357px;
+	height:225px;
+	float:right;
+}
+.contact_title {
+	color:#f07398;
+	font-weight:bold;
+	float:left;
+	width:70px;
+}
+.contact_detail {
+	float:left;
+	width:100px;
+	clear:right;
+}
+.forms {
+	background-color:#FFFFFF !important; /*the important gets rid of the yellow google toolbar field style*/
+	border:1px solid #f6a1ba !important;
+	margin:3px 0px;
+	padding:4px;
+}
+.pink {
+	color:#f07398;
+}
+#contact {
+	border:0;
+	width:480px;
+}
+#contact label {
+	float:left;
+	width:80px;
+	margin-right:15px;
+	clear:left;
+	color:#f07398;
+	font-weight:bold;
+	text-align:right;
+	height:32px;
+}
+#contact input, #contact textarea {
+	margin-right:40px;
+}
+#contact #submit {
+	clear:left;
+	margin-left:95px;
+}

Commit 830b33f6

Commit `830b33f6`