/*--------------------------------------------------------------*
 * STYLE.CSS						*
 * v1.0 - March 32, 2009					*
 * Author: Jeff Lewis (jeffhlewis@gmail.com)	*
 * Client: The Kitchen Shoppe/Pear Tree		*
 * Browser Target: Firefox 3.0				* 
 *--------------------------------------------------------------*/

/*---------------------------------------------------------*
 * REDEFINED TAGS                                           *
 *---------------------------------------------------------*/
*{padding: 0; margin: 0;}
 
html, body  {	
  background: #FFF url(../images/background.png) repeat-y center 10px;
  text-align: left;
  height: 100%;
}

p {
  font: normal 14px Arial, Helvetica, Sans-Serif;  
  color: #48808D;
  line-height: 1.5em;
  margin: 10px 0px 10px 0px;
}

.hidden {
  display: none;
}

img { border: none; }

img.left {
  float: left;
  margin: 16px 16px 0px 32px;
  padding: 4px;
  /*border: 4px solid #CCDEAD;*/
  background: #CCDEAD url(../images/img-bg.png) repeat-x;
}

img.right {
  float: right;
  margin: 10px 0px 0px 10px;
  padding: 4px;
  background: #CCDEAD url(../images/img-bg.png) repeat-x;
}

a { text-decoration: none; font-weight: bold; color: #48808D; }
a.cd { color: #F7941D; }

h1 {
  width: 100%;
  font: normal 30px Georgia, serif;
  color: #1E6373; 
}

h2 {
  font: normal 22px Georgia, serif;
  color: #1E6373; 
}

h3 {
  font: normal 18px Georgia, serif;
  color: #1E6373; 
}

hr {
  margin: 10px 0px 8px 0px;
  width: 100%;
  height: 1px;
  border: none;
  color: #1E6373;
  background-color: #1E6373;
}

ul {
  list-style: none;
}


/*---------------------------------------------------------*
 * LAYOUT TAGS                                                *
 *---------------------------------------------------------*/
#wrapper {
  width: 703px;
  min-height: 100%;
  height: auto !important;
  margin: 0px auto 0px auto;
  padding: 0px 32px;
} * html #wrapper {
  height: 100%;
}

#header {
  width: 670px;
  height: 60px;
  padding: 20px 16px 16px 16px;
  background: #FFF url(../images/header-bg.png) repeat-x;
}

#header-topmenu {
  float: right;
  margin: 16px 0px 0px 0px;
}

ul#header-navigation {
  float: left;
  width: 625px;
  height: 50px;
  margin: 20px 0px 0px 24px;  
}

ul#header-navigation li {
  float: left;
}

ul#header-navigation li a {
  float: left;
  font: normal 10px Georgia, Serif;
  color: #FFF;
  height: 50px;
}

ul#header-navigation li a.home { width: 89px; background: url(../images/menu-home-off.png) no-repeat; }
ul#header-navigation li a.home:hover, 
ul#header-navigation li a.home.on { background: url(../images/menu-home-on.png) no-repeat; }

ul#header-navigation li a.history { width: 97px; background: url(../images/menu-history-off.png) no-repeat; }
ul#header-navigation li a.history:hover,
ul#header-navigation li a.history.on { background: url(../images/menu-history-on.png) no-repeat; }

ul#header-navigation li a.giftIdeas { width: 119px; background: url(../images/menu-gift-ideas-off.png) no-repeat; }
ul#header-navigation li a.giftIdeas:hover,
ul#header-navigation li a.giftIdeas.on { background: url(../images/menu-gift-ideas-on.png) no-repeat; }

ul#header-navigation li a.locationHours { width: 184px; background: url(../images/menu-location-hours-off.png) no-repeat; }
ul#header-navigation li a.locationHours:hover,
ul#header-navigation li a.locationHours.on { background: url(../images/menu-location-hours-on.png) no-repeat; }

ul#header-navigation li a.contactUs{ width: 135px; background: url(../images/menu-contact-us-off.png) no-repeat; }
ul#header-navigation li a.contactUs:hover, 
ul#header-navigation li a.contactUs.on { background: url(../images/menu-contact-us-on.png) no-repeat; }

#giftImage {
  float: left;
  width: 393px;
  margin: 25px 0px 0px 26px;
  padding-top: 24px;
  background: #FFF url(../images/gifts/loading.jpg) no-repeat;
} * html #giftImage {
  margin: 25px 0px 0px 13px;
}

#giftImage img {
  position: absolute;
  margin-top: -24px;
  z-index: 1;
}

#giftImage h2.callout {
  position: relative;
  float: right;
  width: 160px;
  margin: 11px 0px 0px 0px;
  padding: 5px 6px 6px 8px;
  font: bold 14px Georgia, Serif;
  color: #732129;
  background: #eee;
  clear: right;
  z-index: 2;
  visibility: hidden;
}

#giftImage h2.callout.on {
  visibility: visible;
}

ul#giftMenu {
  float: left;
  margin: 10px 0px 0px 10px
} * + html ul#giftMenu {
  margin: 36px 0px 10px 10px
} * html ul#giftMenu {
  margin: 36px 0px 0px 10px;
}

ul#giftMenu li a{
  display: block;
  width: 131px;
  height: 26px;
  margin: 2px 0px 0px 0px;
}

ul#giftMenu li a#gmnu1 { background: url(../images/gifts-menu-1-off.png) no-repeat; }
ul#giftMenu li a#gmnu1:hover, 
ul#giftMenu li a#gmnu1.on { background: url(../images/gifts-menu-1-on.png) no-repeat; }

ul#giftMenu li a#gmnu2 { background: url(../images/gifts-menu-2-off.png) no-repeat; }
ul#giftMenu li a#gmnu2:hover, 
ul#giftMenu li a#gmnu2.on { background: url(../images/gifts-menu-2-on.png) no-repeat; }

ul#giftMenu li a#gmnu3 { background: url(../images/gifts-menu-3-off.png) no-repeat; }
ul#giftMenu li a#gmnu3:hover, 
ul#giftMenu li a#gmnu3.on { background: url(../images/gifts-menu-3-on.png) no-repeat; }

ul#giftMenu li a#gmnu4 { background: url(../images/gifts-menu-4-off.png) no-repeat; }
ul#giftMenu li a#gmnu4:hover, 
ul#giftMenu li a#gmnu4.on { background: url(../images/gifts-menu-4-on.png) no-repeat; }

ul#giftMenu li a#gmnu5 { background: url(../images/gifts-menu-5-off.png) no-repeat; }
ul#giftMenu li a#gmnu5:hover, 
ul#giftMenu li a#gmnu5.on { background: url(../images/gifts-menu-5-on.png) no-repeat; }

ul#giftMenu li a#gmnu6 { background: url(../images/gifts-menu-6-off.png) no-repeat; }
ul#giftMenu li a#gmnu6:hover, 
ul#giftMenu li a#gmnu6.on { background: url(../images/gifts-menu-6-on.png) no-repeat; }

ul#giftMenu li a#gmnu7 { background: url(../images/gifts-menu-7-off.png) no-repeat; }
ul#giftMenu li a#gmnu7:hover, 
ul#giftMenu li a#gmnu7.on { background: url(../images/gifts-menu-7-on.png) no-repeat; }

ul#giftMenu li a#gmnu8 { background: url(../images/gifts-menu-8-off.png) no-repeat; }
ul#giftMenu li a#gmnu8:hover, 
ul#giftMenu li a#gmnu8.on { background: url(../images/gifts-menu-8-on.png) no-repeat; }

ul#giftMenu li a#gmnu9 { background: url(../images/gifts-menu-9-off.png) no-repeat; }
ul#giftMenu li a#gmnu9:hover, 
ul#giftMenu li a#gmnu9.on { background: url(../images/gifts-menu-9-on.png) no-repeat; }

ul.giftSubMenu {
  float: left;
  width: 35px;
  height: 270px;
  margin: 18px 0px 0px 6px;
} * + html ul.giftSubMenu {
  margin: 40px 0px 0px 6px;
} * html ul.giftSubMenu {
  margin: 40px 0px 0px 6px;
}

ul.giftSubMenu.right {
  height: 230px;
  margin-top: 60px;
} * + html ul.giftSubMenu.right {
  margin-top: 80px;
} * html ul.giftSubMenu.right {
  margin-top: 80px;
}

ul.giftSubMenu li a {
  float: left;
  width: 35px;
  height: 52px;
  margin-bottom: 28px;
}

ul.giftSubMenu li a#idea1 { width: 35px; background: url(../images/gifts-submenu-1-off.png) no-repeat; }
ul.giftSubMenu li a#idea1:hover, 
ul.giftSubMenu li a#idea1.on { background: url(../images/gifts-submenu-1-on.png) no-repeat; }

ul.giftSubMenu li a#idea2 { width: 35px; background: url(../images/gifts-submenu-2-off.png) no-repeat; }
ul.giftSubMenu li a#idea2:hover, 
ul.giftSubMenu li a#idea2.on { background: url(../images/gifts-submenu-2-on.png) no-repeat; }

ul.giftSubMenu li a#idea3 { width: 35px; background: url(../images/gifts-submenu-3-off.png) no-repeat; }
ul.giftSubMenu li a#idea3:hover, 
ul.giftSubMenu li a#idea3.on { background: url(../images/gifts-submenu-3-on.png) no-repeat; }

ul.giftSubMenu li a#idea4 { width: 35px; background: url(../images/gifts-submenu-4-off.png) no-repeat; }
ul.giftSubMenu li a#idea4:hover, 
ul.giftSubMenu li a#idea4.on { background: url(../images/gifts-submenu-4-on.png) no-repeat; }

ul.giftSubMenu li a#idea5 { width: 35px; background: url(../images/gifts-submenu-5-off.png) no-repeat; }
ul.giftSubMenu li a#idea5:hover, 
ul.giftSubMenu li a#idea5.on { background: url(../images/gifts-submenu-5-on.png) no-repeat; }

ul.giftSubMenu li a#idea6 { width: 35px; background: url(../images/gifts-submenu-6-off.png) no-repeat; }
ul.giftSubMenu li a#idea6:hover, 
ul.giftSubMenu li a#idea6.on { background: url(../images/gifts-submenu-6-on.png) no-repeat; }

#content-home {
  width: 672px;
  height: 421px;
  padding: 0px;
  margin: 0px auto;
  background: url(../images/body-bg.png) no-repeat;
} * html #content-home {
  margin: -32px auto 0px auto;
}

#content-gifts {
  width: 672px;
  height: 421px;
  padding: 0px;
  margin: 0px auto;
  background: url(../images/body-bg-giftideas.png) no-repeat;
} * html #content-gifts {
  margin: -32px auto 0px auto;
}

#content-elastic {
  width: 672px;
  height: auto;
  padding: 0px 0px 0px 0px;
  margin: 17px auto 0px auto;
  background: url(../images/body-bg-elastic.png) repeat-y;
} * html #content-elastic {
  width: 598px;
  margin: -32px auto 0px auto;
} * + html #content-elastic {
  margin: 6px auto 0px auto;
}

#content-elastic img.top {
  margin: -20px 0px 0px 0px;
} * html #content-elastic img.top {
  margin: 0px;
}

#content-elastic img.bottom {
  margin: 8px 0px 0px 0px;
} * + html #content-elastic img.bottom {
  margin: 8px 0px -4px 0px;
} * html #content-elastic img.bottom {
  margin: 8px 0px -4px 0px;
}

#content-elastic img.normal {
  margin: 0px 0px 0px 32px;
}

#content-elastic p {
  padding: 0px 32px;
}

#content-elastic h1 {
  color: #6e2127;
  margin: 16px 0px 0px 32px;
} * + html #content-elastic h1 {
  display: inline;  
  margin: 16px 0px 0px 32px;
} * html #content-elastic h1 {
  display: inline;  
  margin: 16px 0px 0px 32px;
}

#content-elastic ul.list {
  margin-left: 32px;
}

#content-elastic h2 {
  color: #6e2127;
  margin: 32px 0px 0px 32px;
}

#content {
  float: left;
  padding: 0px 16px;
  clear: both;
}

#flashWrapper {
  float: left;
  width: 393px;
  margin: 25px 0px 0px 27px;
} * html #flashWrapper {
  margin: 25px 0px 0px 13px;
}

#smallColumn {
  float: right;
  width: 248px;
  margin: 10px 0px 0px 16px;
  padding: 16px;
  border: 2px solid #CCDEAC;
}

#smallColumn li {
  font: normal 14px Arial, Helvetica, Sans-Serif;  
  color: #48808D;
  line-height: 1.5em;
  border-top: 1px solid #deebc8;
  padding: 8px 0px;
  margin: 8px auto;
}

#smallColumn ul.bulletList {
  list-style-type: disc;
  list-style-position: outside;
  margin: 4px 16px 0px 16px;
}

#smallColumn ul.bulletList li {
  border: none;
  margin: 0px;
  padding: 0px;
}

#smallColumn h3 {  
  font: bold 14px Georgia, Serif;
  color: #1E6373;
}

#smallColumn h4 {  
  font: normal 14px Georgia, Serif;
  color: #1E6373;
  text-align: right;
}

#footer {  
  float: left;
  width: 670px;
  height: 36px;
  background: url(../images/header-navigation-bg2.png) repeat-x;
  text-align: center;
  padding: 0px 0px 4px 0px;
  margin: 16px 0px 0px 16px;
  clear: both;
} * html #footer {
  margin: 16px 0px 0px 8px;
}


/*---------------------------------------------------------*
 * ONE COLUMN TABLE                                      *
 *---------------------------------------------------------*/
ul.oneColumnTable {
  clear: both;
}

ul.oneColumnTable li {
  float: left;
  margin: 0px 0px 8px 16px;
  padding: 8px 0px 0px 0px;
}

ul.oneColumnTable li.title {
  float: left;
  width: 100%;
  margin: 32px 0px 0px 0px; 
  padding: 0px 0px 8px 0px;
  font: normal 30px Georgia, serif;
  color: #1E6373; 
  border-bottom: 1px solid #CCDEAC;
}

ul.oneColumnTable li.last {
  padding: 8px 0px 8px 0px;  
}


/*---------------------------------------------------------*
 * TWO COLUMN TABLE                                      *
 *---------------------------------------------------------*/
ul.twoColumnTable {
  margin: 10px 0px 0px 0px;
}

ul.twoColumnTable li {  
  padding: 16px;
  border: 1px solid #deebc8;
  clear: both;
}

ul.twoColumnTable li.highlight { background-color: #deebc8; }
ul.twoColumnTable .title {  }
ul.twoColumnTable .data { text-align: left; }


/*---------------------------------------------------------*
 * FEATURED PRODUCT LISTINGS                   *
 *---------------------------------------------------------*/
ul.featured {
  border-bottom: 1px solid #CCDEAC;
}

ul.featured li {
  float: left;
  width: 265px;
  margin: 16px 16px 0px 0px;
}


/*---------------------------------------------------------*
 * PERIPHERY ITEMS                                           *
 *---------------------------------------------------------*/
.siteLinkBox {
  float: left;
  width: 224px;
  margin: 16px 0px 0px 0px;
}

#newsBox {
  float: left;
  width: 200px;
  margin: 10px 0px 0px 10px;
  padding: 0px;
} * + html #newsBox {
  margin: 34px 0px 0px 10px;
} * html #newsBox {
  margin: 34px 0px 0px 14px;
}

#newsBox img { float: left; }

#newsBox img.category { margin-right: 8px; }

#newsBox h2 {  
  font: normal 10pt Georgia, serif;
  color: #6e2127;
}

#newsBox h3 {
  font: normal 10pt Georgia, serif;
  color: #1E6373;
}

.scrollBox {
  float: left;
  width: 138px;
  height: 115px;
  padding: 4px;
  margin: 6px 0px 0px 0px;
}

#newsBox p {
  font: normal 10px Arial, Helvetica, Sans-Serif;
  line-height: 1.5em;
  height: 100%;
  margin: 0px; padding: 0px;
}

#newsBox p.menu {
  float: left;
  height: 115px;
  width: 45px;
  margin: 6px 0px 0px 0px;
}

#newsBox p.menu a {
  color: #6e2127;
}

#map {
  border: 2px solid #CCDEAC;
  margin: 16px 0px 0px 32px;
}


/*---------------------------------------------------------*
 * PORTFOLIO STUFF                                        *
 *---------------------------------------------------------*/
#portfolioColumn {
  float: left;
  width: 645px;
}

.portfolioItem {
  float: left;
}

#portfolioColumn p {
  float: left;
  clear: both;
  margin-top: -16px;
  width: 640px;
}

.portfolioBox {
  float: left;
  width: 622px;
  height: 354px;
  border: 8px solid #687673;
  margin: 0px 16px 0px 0px;
}

.portfolioBoxNav {
  float: left;
  position: relative; 
  bottom: 47px;
  left: 490px;
  z-index: 10;
  border: 1px solid #000;
}

.portfolioBoxNav a {
  float: left; 
  font: bold 14px Georgia, Serif;
  color: #FFF;
  background-color: #687673;
  padding: 6px 12px;
}

.portfolioBoxNav a:hover {
  background-color: #5a6260;
}

.portfolioBoxNav a.on {
  background-color: #434948;
}
 
#portfolioMenu {
  float: right;
  width: 200px;
  margin-left: 16px;
  border: 2px solid #CCDEAC;
} * html #portfolioMenu {
  margin-left: 7px;
}

#portfolioMenu li {
  margin: 0px;
}

#portfolioMenu a {
  display: block;
  width: 168px;
  font: normal 16px Georgia, Serif;
  color: #1E6373;  
  padding: 16px;
}

#portfolioMenu h2 {
  margin: 16px 16px 0px 16px;
  padding-bottom: 8px;
  border-bottom: 1px solid #CCDEAD;
}

#portfolioMenu a:hover {
  background-color: #E2EFCA;
  color: #1E6373;
}

#portfolioMenu a.on {
  background-color: #CCDEAD;
  color: #1E6373;
}


/*---------------------------------------------------------*
 * CONTACT MENU                                              *
 *---------------------------------------------------------*/
ul.contactMenu {
  float: right;
  width: 216px;
  height: 100px;
  margin: 0px 0px 0px 0px;
}

ul.contactMenu li { float: left; }

ul.contactData {  
  float: right;
  width: 216px;
  left: 0px;
  margin: 34px -218px 0px 0px;
}

ul.contactData li {
  position: fixed;
  width: 216px;
  text-align: center;
}

ul.contactData p {  
  font: bold 14px Georgia, Serif;
  color: #687673;
}

ul.contactData p.address {
  font: bold 12px Georgia, Serif;
}

ul.contactData a {
  font-size: 12px;
  color: #687673;
}


/*---------------------------------------------------------*
 * CONTACT FORM                                              *
 *---------------------------------------------------------*/
form {
  margin: 10px 0px 0px 0px;
} * + html form {
  margin: 0px;
}
 
fieldset {
  width: 500px;
  margin: 0px 0px 0px 32px;
  padding: 16px;
  border: 2px solid #48808D;
  color: #48808D;
}

legend {
  font: bold 14px Arial, Helvetica, Sans-Serif;
  color: #48808D;
  padding: 0px 8px;
} * + html legend {
  margin-bottom: 1em;
}
 
label {
  font: normal 12px Arial, Helvetica, Sans-Serif;
  display: inline-block;
  width: 125px;
  vertical-align: top;
}

input {
  width: 320px;
  color: #48808D;
  margin-bottom: 6px;
}

input.submit {
  width: auto;
}

textarea {
  width: 320px;
  color: #48808D;
  margin-bottom: 6px;
}