/* 
 * Ooid Design Main Stylesheet V2
 * Design by Ooid <www.ooid.co.nz>
 *
 * Developed by Julian Moller
 * MASSIVE MEDIA <www.massivemedia.net.nz>
 *                                                    */

*{ font-family: 'HelveticaNeue', 'Helvetica Neue', 'Helvetica', 'Arial', 'sans-serif'; }
body{ font-size: 14px; color: #6c6d6f; }

a:link, a:visited{ color: #eb5c25; text-decoration: none; outline: none; }
a:hover{ text-decoration: underline; outline: none; }
a:active{ outline: none; }

.clear{ clear: both; }  
.invis{ display: none; }

#page{ width: 820px; margin: 0 auto; padding-bottom: 100px; }

#header{ width: 100%; margin: 0; height: 160px; position: relative; }
  #header .title{ margin: 0; padding: 50px 0 0 0; }
  #header .title a{ display: block; width: 121px; height: 47px; background: url('/images/ooid-logo.png') 0 0 no-repeat; }

#sidebar{ width: 240px; float: right; overflow: visible; }
  
#nav{ width: 220px; padding: 0; margin: 0; position: relative; list-style: none; }
  #nav li{ border-bottom: 1px solid #e5e5e6; }
  #nav a{ display: block; font-size: 14px; line-height: 17px; padding: 10px; color: #6c6d6f; text-decoration: none; }
  #nav a:hover, 
  #nav .current a{ color: #eb5c25; }

  #nav li.image a{ width: 228px; height: 76px; background: url('/images/shop-now.png') 10px 50% no-repeat; }

  #sidebar p{ font-size: 12px; line-height: 18px; padding: 0 0 0 10px; }

#content{ clear: both; margin: 0; padding: 0; }
#content.with-sidebar{ float: left; width: 580px; }
#content.without-sidebar{ width: 100%; }

  #content p{ font-size: 13px; line-height: 18px; }

/* HOME PAGE */

.home div{ float: left; height: 350px; width: 260px; }
.home div.center{ width: 320px;  }
.home p{ width: 100%; height: 100%; margin: 0; padding: 0; text-align: center; }
.home p a{ display: block; width: 100%; height: 100%; text-align: center; line-height: 350px; }
.home img{ display: inline; vertical-align: middle; border: none; }

/* FROM THE PANTRY PAGE */

.pantry h1{ padding: 0; margin: 15px 0 10px 0; width: 229px; height: 74px; background: url('/images/from-the-pantry.jpg') 0 0 no-repeat; }
.pantry .text-content{ float: left; width: 360px; }
.pantry .image{ float: right; width: 220px; overflow: hidden; padding: 0; margin: 0; }
.pantry .image img{ margin: -74px 0 0 -10px; }

/* SPROUT BAG PROJECT PAGE */

.bags .text-content{ float: left; width: 300px; }
.bags .image{ float: right; width: 280px; padding: 10px 0 0 0; margin: 0; text-align: center; }

/* DESIGN INTAKE PAGE */

.intake .text-content{ width: 80%; }

/* SHOPS PAGE */

.shops *{ margin: 0; }
.shops h2{ margin: 25px 0 2px 0; font-size: 24px; }
.shops h2, .shops h3, .shops h4{ color: #454545; }
.shops h2.minih2{ font-size: 18px; }
.shops h4{ color: #999999; }
.shops p{ font-size: 11px; }

/* DESIGNERS PAGE */

.designers ul{ list-style-type: none; padding: 0; margin: 0; }
.designers li{ float: left; margin: 0px; width: 110px; height: 140px; }
.designers img{ border: none; font-size: 0px; color: #fff; overflow: hidden; background: #fff; }
.designers a{ text-decoration: none; }
.designers span{ display: block; font-size: 9px; font-weight: bold; }


/* INDIVIDUAL DESIGNER PAGE */

.designer h1{ font-weight: normal; }
.designer p.image{ float: left; margin: 0 30px 0 0; }
.designer p.text{ float: left; width: 70%; margin: 0; }


/* BAGS PAGE */

.bags #content{ font-size: 13px; line-height: 16px; }
.bags .blurb{ padding: 10px 0; }
.bags .blurb p{ width: 66%; }
.bags h2{ margin-bottom: 0; padding-bottom: 0; }

.bagslist{ clear: both; border-top: 1px solid #e5e5e6; }

.bagslist h2 span{ font-size: 13px; font-weight: normal; }

.bagset{ padding: 0; list-style-type: none; }
.twobag{ width: 570px; margin: 0 auto; }
.onebag{ width: 285px; margin: 0 auto; }

.bagset li{ position: relative; float: left; background: url('/images/bag_outline.png') no-repeat; width: 260px; height: 270px; text-align: center; padding: 85px 0 0 12px; }
.bagset li img{ text-align: center; border: none; }

.bagset a{ text-decoration: none; }

.bagset li .bagtitle{ width: 176px; height: 50px; font-size: 13px; position: absolute; bottom: 10px; display: block; text-align: center; }


/* BAG IMAGE CENTERING */

.wraptocenter { display: table-cell; text-align: center; vertical-align: middle; width: 170px; height: 190px; }
.wraptocenter * {
    vertical-align: middle;
}
/*\*//*/
.wraptocenter {
    display: block;
}
.wraptocenter .centerfix {
    display: inline-block;
    height: 100%;
    width: 1px;
}
/**/

/* SHOP PAGE */

#products-list{ padding: 0 0 20px 0; margin: 20px 0 20px 0; list-style: none; border-bottom: 1px solid #e5e5e6; float: left; width: 880px; }
.product{ width: 184px; height: 280px; float: left; background: #a49d95; border: 3px solid #a49d95; margin: 0 30px 30px 0; padding: 0; color: #fff; }
.product-image-link{ display: block; width: 100%; height: 210px; padding: 0; margin: 0; background: #fff; color: #fff; text-align: center; overflow: hidden; line-height: 210px; }
.product-image{ vertical-align: middle; border: none; font-size: 0; color: #fff; max-height: 210px; }
.product-meta{ display: block; padding: 5px 2px; height: 60px; position: relative; }
.product-title{ display: block; font-size: 12px; line-height: 14px; font-weight: normal; }
.product-designer{ display: block; font-size: 11px; line-height: 13px; font-weight: normal; }
a.product-designer-link{ color: #fff; }
.product-price{ display: block; font-size: 14px; line-height: 18px; }
.product input{ position: absolute; bottom: 0; right: 0; }

#buynow{ width: 100%; clear: both; float: left; }
.webshop h2{ font-size: 19px; margin: 20px 0 5px 0; color: #EB5C25; }

.item{ position: relative; border: none; margin: 2px; padding: 2px 2px 4px 2px; border-bottom: 1px solid #e5e5e6; }
.item .remove{ color: red; font-size: 11px;}
.item .name{ width: 350px; background: transparent; border: none; font-size: 12px; }
.item .price{ width: 50px; text-align: right; background: transparent; border: none; color: #EC2800; font-size: 12px; }
.item .quantity{ width: 50px; margin-left: 10px; text-align: right; border: none; border: 1px solid #cccccc; background: #eeeeee; }
.item .max{ display: inline; font-size: 11px; font-style: italic; margin: 0 5px; width: 50px; text-transform: lowercase;}
.item .subtotal{ position: absolute; right: 4px; margin-top: 2px; text-align: right; width: 80px; background: transparent; border: none; color: #EC2800; font-size: 14px; }

#message{ margin: 10px 2px; font-size: 11px; }
#message.error{ color: #aa2221; }
#message.success{ color: #63b743;  }
#message.warning{ color: #deb343; }

#control{ margin-top: 6px; float: right; width: 350px;}
#control label{ font-size: 12px; font-weight: bold; display: bold; float: left; margin: 2px 0; }
#shipping{ font-size: 12px; margin: 0 5px 20px 5px; float: right; }
#total{ float: right; clear: both; background: transparent; text-align: right; border: none; border-top: 2px solid #000000; font-size: 16px; font-weight: bold; margin-right:  5px; width: 80px;}
#submit{ clear: both; float: right; margin: 4px;  text-align: center; width: 120px; font-size: 18px;}
#buynow{ margin-bottom: 120px; }
#labels{ margin-bottom: 3px; float: left; width: 100%; }
#labels, #items, #control{ clear: both; }
#labels label{ display: block; float: left; font-weight: bold;}
#labels .label_name{ margin-left: 43px; width: 354px; }
#labels .label_price{ width: 56px; }
#labels .label_quantity{ width: 132px; margin-right: 45px;}
#labels .label_subtotal{ float: right; margin-right: 5px; }

#control #gift_wrapping_label{ display: block; width: 100%; margin-top: 20px; }
#control #gift_wrapping_label input{ float: right; margin-right: 5px; }
#control #promo{ clear: both; text-align: right; padding: 5px 5px 20px 0; }

#footnotes{ float: left; }
#footnotes ul{ list-style: square; font-size: 11px; margin: 0; padding: 20px; }

/* THANKS PAGE */
.thanks .text-content{ width: 80%; }
