/* -------------------------------------------------------------- 

AA: Content wrapper
BB: Header
CC: Footer & Navigation
DD: Product Menu
EE: Home page navigation/categories
FF: Main Content   
GG: Product Headers
HH: forms
PP: plugins and tools 

-------------------------------------------------------------- */

@import "lib/reset.css";
@import "lib/typography.css";
@import "lib/forms.css";


/* 
00: Core
-------------------------------------------------------------- */


h2.indent {
  margin-left: 15px;
  margin-top: 15px;
}


/* 
AA: Content wrapper
-------------------------------------------------------------- */

#wrapper {
  width: 999px;
  margin: 0 auto;
}


/* 
BB:  Header
-------------------------------------------------------------- */
  
#header {
  width: 693px;
  height: 53px;
  margin: 0 auto;
  text-align: left;
  position: relative;
}

h1.logo a {
  display: block;
  text-indent: -9999px;
  width: 318px;
  height: 53px;
  padding: 0;
  margin: 0;
  line-height: 0;
  float: left;
  background: url('images/logo.gif') left top no-repeat;
}

h2.hidden {
  text-indent: -9999px;
  height: 0;
  width: 0;
  line-height: 0;
  margin: 0;
  padding: 0;
}

h2.blind {
  text-indent: -9999px;
  width: 250px;
  height: 17px;
  background-position: left top;
  background-repeat: no-repeat;
}

h2.headAbout,
h2.headDesigner,
h2.headOrdering,
h2.headLinks {
  text-indent: -9999px;
  height: 17px;
  background-position: left top;
  background-repeat: no-repeat;
}
h2.headAbout {
  width: 53px;
  background-image: url('images/headAbout.gif');
}

h2.headDesigner {
  width: 128px;
  background-image: url('images/headDesigner.gif');
}

h2.headOrdering {
  width: 81px;
  background-image: url('images/headOrdering.gif');
}

h2.headLinks {
  width: 45px;
  background-image: url('images/headLinks.gif');
}

/* use these 2 as examples (not those above) */
h2.headContact {
  background-image: url('images/headContact.gif');
}

h2.headMailingList {
  background-image: url('images/headMailingList.gif');
}

h2.head_thanks {
  background-image: url('images/head_thanks.gif');
}

h2.head_press {
  background-image: url('images/head_press.gif');
}


/* hide the H2 */
h2.headAbout,
h2.headDesigner,
h2.headOrdering,
h2.headLinks,
h2.headContact,
h2.head_press {background: transparent; margin: 0px 0; margin-top: 0;}


/* Category headers */

h2.headCoffeeTables {
  text-indent: -9999px;
  width: 119px;
  height: 16px;
  background: url('images/headCoffeeTables.jpg') left top no-repeat;
}

h2.headCabinets {
  text-indent: -9999px;
  width: 77px;
  height: 16px;
  background: url('images/headCabinets.jpg') left top no-repeat;
}

h2.headBookcases {
  text-indent: -9999px;
  width: 92px;
  height: 16px;
  background: url('images/headBookcases.jpg') left top no-repeat;
}

h2.headSeating {
  text-indent: -9999px;
  width: 64px;
  height: 18px;
  background: url('images/headSeating.jpg') left top no-repeat;
}

h2.headConsoleTables {
  text-indent: -9999px;
  width: 132px;
  height: 16px;
  background: url('images/headConsoleTables.jpg') left top no-repeat;
}

h2.headSideTables {
  text-indent: -9999px;
  width: 99px;
  height: 14px;
  background: url('images/headSideTables.jpg') left top no-repeat;
}

h2.headBeds {
  text-indent: -9999px;
  width: 42px;
  height: 14px;
  background: url('images/headBeds.jpg') left top no-repeat;
}

h2.headDiningTables {
  text-indent: -9999px;
  width: 120px;
  height: 20px;
  background: url('images/headDiningTables.jpg') left top no-repeat;
}


p.thumb {
  text-align: center;
  margin: 0 0 0 -16px;
}

p.thumb img {
  float: none;
  display: inline;
  margin: 5px 5px 0 0px;
  border: 1px solid #666;
}

p.thumb img:hover {
  border: 1px solid #333;
}


/* 
CC: Footer & Navigation
-------------------------------------------------------------- */

.page_bottom {
  clear: both;
  width: 692px;
  margin: 0px auto 10px auto;
  padding: 0em 15px;
  text-align: center;
}

.page_bottom ul {
  margin: 0;
  padding: 0;
  width: 100%;
}

.page_bottom ul li, #copyright .copy {
  display: block;
  text-indent: -9999px; 
  float: left;
  padding: 0;
  height: 25px; 
}


#copyright div.copy  { 
  margin-top: 25px;
	width: 100%;
	background: url('images/bg-copyright_2010.gif') 250px top no-repeat; 
	}

#footer ul li {
  margin-right: 20px;
}

#footer ul li a {
	height: 20px;
	display: block;
}

#footer ul li.mailing_list a { 
	width: 125px;
	background: url('images/bg-mailing_list.gif') left top no-repeat; 
	}

#footer ul li.email {
  margin-right: 0;
}
#footer ul li.email a { 
	width: 175px;
	background: url('images/bg-email.gif') left top no-repeat;  
}

#footer ul li a:hover  { 
	background-position: left -50px; 
	}
	
#footer ul li.phone {
	width: 100px; 
	margin-left: 0;
	background: url('images/bg-phone.gif') left top no-repeat; 
	}
#footer ul li.address { 
	width: 227px; 
	background: url('images/footer-address.gif') left top no-repeat; 
	}


/*  navigation  */

ul.navigation     { 
  list-style: none; 
  margin: 4px 0 0 0; 
  float: right; 
  padding: 0; 
  position: absolute; 
  bottom: -3px; 
  right: -5px; 
  }
ul.navigation li  { 
  display: inline; 
  float: left; 
  height: 25px; 
  padding: 0; 
  margin: 0; }

ul.navigation li.first  { background: none; }

ul.navigation li a {
  display: block;
  height: 25px;
  margin: 0 -1px 0 -1px;
  padding: 0;
  text-indent: -9999px;
}

ul.navigation li.press a       { width: 52px; background: url('images/press.gif') left top no-repeat; }

ul.navigation li.about a       { width: 48px; background: url('images/about.gif') left top no-repeat; }

ul.navigation li.designer a       { width: 69px; background: url('images/designer.gif') left top no-repeat; }

ul.navigation li.ordering a       { width: 68px; background: url('images/ordering.gif') left top no-repeat; }

ul.navigation li.contact a       { width: 59px; background: url('images/contact.gif') left top no-repeat; }

ul.navigation li.links a       { width: 39px; background: url('images/links.gif') left top no-repeat; }

ul.navigation li a:hover        { background-position: left -50px; }
ul.navigation li.active a       { background-position: left -25px; }
ul.navigation li.active a:hover { background-position: left -25px; }


/* DD:
Product menu
-------------------------------------------------------------- */

ul#menu {
  float: left;
  margin: 50px 0 0 0;
  list-style: none;
  width: 150px;
}

ul#menu li  { height: 25px; padding: 0; margin: 0; display: block; }

ul#menu li a {
  display: block;
  height: 25px;
  background: #fff;
  text-decoration: none;
  background: #aaa7a4;
  margin: 0;
  padding: 0;
  border-bottom: 0;
  text-indent: -9999px;
}


ul#menu li.coffee_tables-left a       { width: 150px; background: url('images/coffee_tables.jpg') right top no-repeat; }
ul#menu li.coffee_tables-left a:hover { background-position: right -50px; }

ul#menu li.cabinets-left a       	{ width: 150px; background: url('images/cabinets.jpg') right top no-repeat; }
ul#menu li.cabinets-left a:hover 	{ background-position: right -50px; }

ul#menu li.bookcases-left a       	{ width: 150px; background: url('images/bookcases.jpg') right top no-repeat; }
ul#menu li.bookcases-left a:hover 	{ background-position: right -50px; }

ul#menu li.seating-left a       	{ width: 150px; background: url('images/seating.jpg') right top no-repeat; }
ul#menu li.seating-left a:hover 	{ background-position: right -50px; }

ul#menu li.console_tables-left a       { width: 150px; background: url('images/console_tables.jpg') right top no-repeat; }
ul#menu li.console_tables-left a:hover { background-position: right -50px; }

ul#menu li.side_tables-left a       	{ width: 150px; background: url('images/side_tables.jpg') right top no-repeat; }
ul#menu li.side_tables-left a:hover 	{ background-position: right -50px; }

ul#menu li.beds-left a       		{ width: 150px; background: url('images/beds.jpg') right top no-repeat; }
ul#menu li.beds-left a:hover 		{ background-position: right -50px; }

ul#menu li.dining_tables-left a       { width: 150px; background: url('images/dining_tables.jpg') right top no-repeat; }
ul#menu li.dining_tables-left a:hover { background-position: right -50px; }

ul#menu li.other-left a       { background: url('images/other.gif')}
ul#menu li.interiors-left a       { 
  background: url('images/menu_interiors.jpg')
  }

ul#menu li a.left-menu {width: 150px; 
                        background-position: right top;
                        background-repeat: no-repeat;}
ul#menu li a.left-menu:hover { background-position: right -50px; }

ul#menu li.active a       			{ background-position: right -25px; }
ul#menu li.active a:hover 			{ background-position: right -25px; }

ul#rightmenu {
  float: left;
  margin: -4px 0 0 0;
  list-style: none;
  width: 100px;
  position: absolute;
  top: 0;
  right: -100px;
}

ul#rightmenu li  { 
  padding: 0; 
  margin: 0; 
  text-align: left;
  display: block; }

ul#rightmenu li img {
  float: none;
  display: inline;
  margin: 5px 5px 0 5px;
  border: 1px solid #666;
}


ul#rightmenu li img:hover {
  border: 1px solid #333;
}



/* 
EE: Home page navigation/categories
-------------------------------------------------------------- */

div.furniture_index .clear {
  margin-bottom: 14px;
}

ul.categories {
  display: inline;
  list-style: none;
  float: left;
  margin: 5px 0 0px 6px;
}

ul.categories li {
  float: left;
  background: url('images/bg-categories.gif') left top no-repeat;
  width: 154px;
  height: 154px;
  margin: 14px 0 0  15px;
  text-indent: -9999px;
}

#press ul.categories li {
  margin-top: 0;
}


a.coffeetables        { background: transparent url('images/bg-coffee_tables.jpg') left -154px no-repeat; }
a.coffeetables:hover  { background: #aaa7a4 url('images/bg-coffee_tables.jpg') left top no-repeat; }
 
a.cabinets            { background: transparent url('images/bg-cabinets.jpg') left -154px no-repeat; }
a.cabinets:hover      { background: #aaa7a4 url('images/bg-cabinets.jpg') left top no-repeat; }
 
a.bookcases           { background: transparent url('images/bg-bookcases.jpg') left -154px no-repeat; }
a.bookcases:hover     { background: #aaa7a4 url('images/bg-bookcases.jpg') left top no-repeat; }
 
a.consoletables       { background: transparent url('images/bg-console_tables.jpg') left -154px no-repeat; }
a.consoletables:hover { background: #aaa7a4 url('images/bg-console_tables.jpg') left top no-repeat; }
 
a.sidetables          { background: transparent url('images/bg-side_tables.jpg') left -154px no-repeat; }
a.sidetables:hover    { background: #aaa7a4 url('images/bg-side_tables.jpg') left top no-repeat; }
 
a.diningtables        { background: transparent url('images/bg-dining_tables.jpg') left -154px no-repeat; }
a.diningtables:hover  { background: #aaa7a4 url('images/bg-dining_tables.jpg') left top no-repeat; }

 
a.seating             { background: transparent url('images/bg-seating.jpg') left -154px no-repeat; }
a.seating:hover       { background: #aaa7a4 url('images/bg-seating.jpg') left top no-repeat; }
 
a.beds                { background: transparent url('images/bg-beds.jpg') left -154px no-repeat; }
a.beds:hover          { background: #aaa7a4 url('images/bg-beds.jpg') left top no-repeat; }


/* products */

ul.categories li a, a.index_piece {
  display: block;
  height: 154px;
  width: 154px;
  background-position: left -154px;
  background-repeat: no-repeat;
  background-color: transparent;
}

ul.categories li a:hover, a.index_piece:hover {
  background-color: #BBB7B4;
	background-position: left top; 
  height: 150px;
}

ul.push {
  padding-left: 10px;
  margin-bottom: 30px;
  margin: 20px 0 0 0;
}



/* FF:
Main content
-------------------------------------------------------------- */

.container {
  float: left;
  min-height: 342px;
  width: 697px;
  height: auto;
  margin: 1px auto;
  padding: 0px;
/*  border: 2px solid #666;*/
  position: relative;
}


p.indent,ul.indent {
  margin-left: 35px;
  margin-right: 30px;
}

.furniture_index, .page {
  background-color:#BBB7B4; 
  border: 1px solid #999; 
  width: 697px;
  min-height: 336px;
  padding: 0; margin: 0;
}


.leftProduct, .rightProduct_cell {
  border: 1px solid #999; 
  padding: 10px 9px;
  background-color:#BBB7B4; 
  width: 158px;
}
  
.leftProduct {
  height: 364px;
  width: 495px;
  text-align: center;
  margin-right: 3px;
}

.rightProduct {
  width: 152px;
  font-size: 0.8em;
}

.rightProduct ul {
  list-style: none;
  margin-left: 0.75em;
}

.leftDesigner {
  float: left;
  width: 334px;
  border-right: 2px solid #666;
}

.rightDesigner {
  width: 395px;
  float: right;
}

#holder img {
  border: 1px solid #333;
  margin: 0;
  padding: 0;
}

/* Page content
-------------------------------------------------------------- */
div#main_image {
  padding: 0;
  position: relative;
}

#home_image {
  top: 0;
  left: 0;
  margin: 0;
  border: 1px solid black;
}

#home_loft_text {
  position: absolute;
  left: 1px;
  z-index: 10;
  top: 42px;
  filter:alpha(opacity=70);
  /* CSS3 standard */
  opacity:0.7;
}


div.inline_photo {float: right; margin: 0 35px 15px 35px;}
div.inline_photo img {margin: 0;}
div.inline_photo .caption {display: block; margin: 0; padding: 0; font-size: 80%;}

table#about_content {
  width: 100%;
}
table#about_content p.indent {
  margin-right: 0;
}

table#about_content td.copy {
  margin: 0;
  padding: 0;
}

table#about_content td.copy div.copy {
}

table#about_content td.picture {
  width: 230px;
  padding: 6px 30px 0 0;
  text-align: right;
}

table#about_content td.picture img {
  border: 1px solid black;
}

form.contact {
  margin-left: 30px;
}
form.contact table td {
  padding-right: 10px;
}

/* Links
-------------------------------------------------------------- */

table#links {
  list-style: none;
  width: 95%;
  margin: 0 2%;
}

table#links th     { 
  text-align: right; 
  font-weight: normal;
  }

table#links th, table#links td { 
  border: 0;
  padding: .3em .5em;
  }


/* GG: Product headers */

.rightProduct h4 {
  text-indent: -9999px;
  width: 125px;  height: 35px;
  background-position: top left;
  background-repeat: no-repeat;
}

h4.headPolly, h4.headSide3 {
  background-image: url('images/headPolly.gif');
}

h4.headTank {
  background-image: url('images/headTank.gif');
}

h4.headGothic, h4.headDining1 {
  background-image: url('images/headGothic.gif');
}

h4.headContour, h4.headSeat2 {
  background-image: url('images/headContour.gif');
}

h4.headAngular, h4.headSeat1 {
  background-image: url('images/headAngular.gif');
}

h4.headTapered, h4.headBed1 {
  background-image: url('images/headTapered.gif');
}

h4.headFramed, h4.headSide4 {
  background-image: url('images/headFramed.gif');
}

h4.headAero {
  background-image: url('images/headAero.gif');
}

h4.headBowfront {
  background-image: url('images/headBowfront.gif');
}

h4.headEthereal {
  background-image: url('images/headEthereal.gif');
}

h4.headIO, h4.headIo {
  background-image: url('images/headIo.gif');
}

h4.headLunar {
  background-image: url('images/headLunar.gif');
}

h4.headPinned {
  background-image: url('images/headPinned.gif');
}

h4.headCherry {
  background-image: url('images/headCherry.gif');
}

h4.headTrilogy {
  background-image: url('images/headTrilogy.gif');
}

h4.headFp3 {
  background-image: url('images/headFp3.gif');
}

h4.headCommunal {
  background-image: url('images/head_communal.gif');
}

h4.headKitchen {
  background-image: url('images/head_kitchen.gif');
}

h4.headSling {
  background-image: url('images/head_sling.gif');
}

h4.headLoft_kitchen {
  background-image: url('images/head_loft_kitchen.gif');
  width: 150px;
  height: 18px;
}

h4.headHanging_rack {
  background-image: url('images/head_hanging_rack.gif');
  height: 18px;
}

h4.headMirror {
  background-image: url('images/head_mirror.gif');
  height: 18px;
}

h4.headStepped {
  background-image: url('images/head_stepped.gif');
}


h4.headButtressed {
  background-image: url('images/head_buttressed.gif');
}

h4.headMetallic {
  background-image: url('images/head_metallic.gif');
}

h4.headSlab         {  background-image: url('images/head_slab.gif'); }
h4.headTransformer  {  background-image: url('images/head_transformer.gif'); }
h4.headMedia        {  background-image: url('images/head_media.gif'); }
h4.headGlass        {  background-image: url('images/head_glass.gif'); }


/* HH: forms */

form label {
  font-weight: 400;
  display: block;
  margin-top: .5em;
}

form .formless {
  display: block;
  position: absolute;
  right: -9999px;
}


input.submit {
  background-color: #797979;
  color: white;
  display: block;
  margin-top: 1.5em;
}

input, select, textarea {
  background-color: #CCCCCC;
  border: 1px solid #797979;
}



/* PP: plugins and tools */

/* Drop Shadow Box
   --------------------------------------------------- */

.border_r {
	background: url(images/border_v.gif) no-repeat scroll top right;  
  padding: 0 1px 0 0;
}

.border_b {
  padding-bottom: 1px;
  	background: url(images/border_h.gif) no-repeat scroll bottom left;
}
