#deckvue
{
  position: relative;
  margin-top: 120px;
  width: 892px;
  height: 420px;
}

#chooseDeck
{
  position: absolute;
  top: -80px;
  left: 0;
  width: 700px;
  height: 100px;
  background: url("images/chooseDeckBkgd.gif") 0 0 no-repeat;
}

#chooseDeck p a
{
  width: 100px;
  height: 56px;
  display: block;
}

#chooseDeck p a:link, #chooseDeck p a:visited
{
  border: 2px solid #ddd3c8;
}

#chooseDeck p a:hover
{
  border: 2px solid #6e5a42; 
}

#deckvue #chooseDeck p a.current
{
  border: 2px solid #72b414;
}

#deck1, #deck2, #deck4, #deck5, #deck6
{
  position: absolute;
  top: 12px;
}

#deck1
{
  left: 20px;
}

#deck2
{
  left: 150px;
}

#deck4
{
  left: 280px;
}

#deck5
{
  left: 410px;
}

#deck6
{
  left: 540px;
}

#image
{
  position: absolute;
  z-index: 1;
  top: 20px;
  left: 0;
  width: 700px;
  height: 400px;
  border: 1px solid #4a3b28;
}

#controls
{
  position: absolute;
  top: -60px;
  left: 704px;
  width: 159px;
  height: 482px;
  background: url("images/controlsBkgd.gif") 0 0 no-repeat;
}

#components p a
{
  width: 126px;
  height: 14px;
  display: block;
  padding: 0px 0 1px 14px;
  font-weight: bold;
  text-transform: uppercase;
}

#components p a:link, #components p a:visited
{
  color: #ffffff;
  background-color: #b19f8b;
  border: 1px solid #6e5a42;
  border-top-color: #94826e;
  border-left-color: #94826e;
  text-decoration: none;
}

#components p a:hover
{
  color: #ffffff;
  background-color: #7d6c5a;
  border: 1px solid #6e5a42;
  border-top-color: #94826e;
  border-left-color: #94826e;  
}

#controls #components p a.current
{
  color: #ffffff;
  background-color: #72b414;
  border: 1px solid #568e09;
  border-top-color: #a6eb42;
  border-left-color: #a6eb42;
}

#deck a, #rail a, #post a, #cap a, #baluster a, #deckAccent a
{
  position: absolute;
  left: 8px;
}

#deck a
{
  top: 30px;
}

#rail a
{
  top: 51px;
}

#post a
{
  top: 72px;
}

#cap a
{
  top: 93px;
}

#baluster a
{
  top: 114px;
}

#deckAccent a
{
  top: 51px;
}

#deckAccent
{
  display: none;
}

#colors p a
{
  width: 44px;
  height: 44px;
  display: block;
}

#colors p a:link, #colors p a:visited
{
  border: 2px solid #493b28;
}

#colors p a:hover
{
  border: 2px solid #e8dfd4;
}

#controls #colors p a.current
{
  border: 2px solid #72b414;
}

#seasonedMahogany a, #capeCodGray a, #terracotta a, #juniper a, #walnut a
{
  position: absolute;
  left: 25px;
}

#rusticCedar a, #earthtone a, #desertSand a, #tigerwood a
{
  position: absolute;
  left: 90px;
}

#seasonedMahogany a, #rusticCedar a
{
  top: 170px;
}

#capeCodGray a, #earthtone a
{
  top: 233px;
}

#terracotta a, #desertSand a
{
  top: 296px;
}

#juniper a, #tigerwood a
{
  top: 359px;
}

#walnut a
{
  top: 422px;
}

#colors p em
{ 
  color: #ffffff;
  background-color: #000000;
  border: 1px solid #ffffff;
  width: 70px; 
  height: 20px;
  padding: 6px 10px;
  position: absolute; 
  text-align: center; 
  z-index: 200; 
  display: none;
  font-style: normal;
  font-weight: bold;
}

#colors p#seasonedMahogany em
{
  top: 126px; 
  left: 5px;
  height: 34px;
}

#colors p#rusticCedar em
{
  top: 140px; 
  left: 60px;
  width: 80px;
}

#colors p#capeCodGray em
{
  top: 188px; 
  left: 0px;
  height: 34px;
}

#colors p#earthtone em
{
  top: 202px; 
  left: 70px;
}

#colors p#terracotta em
{
  top: 264px; 
  left: 0px;
}

#colors p#desertSand em
{
  top: 264px; 
  left: 60px;
  width: 80px;
}

#colors p#juniper em
{
  top: 326px; 
  left: 0px;
}

#colors p#tigerwood em
{
  top: 326px; 
  left: 60px;
  width: 80px;
}

#colors p#walnut em
{
  top: 388px; 
  left: 0px;
}

#deckOverlay, #railOverlay, #postOverlay, #capOverlay, #balusterOverlay, #deckAccentOverlay, #loadingOverlay
{
  position: absolute;
  z-index: 100;
  top: 20px;
  left: 0;
  width: 700px;
  height: 400px;
}

#deckOverlay
{
  background: url("images/deck1_deck_seasonedMahogany.png") 0 0 no-repeat;
}

#railOverlay
{
  background: url("images/deck1_rail_seasonedMahogany.png") 0 0 no-repeat;
}

#postOverlay
{
  background: url("images/deck1_post_seasonedMahogany.png") 0 0 no-repeat;
}

#capOverlay
{
  background: url("images/deck1_cap_seasonedMahogany.png") 0 0 no-repeat;
}

#balusterOverlay
{
  background: url("images/deck1_baluster_seasonedMahogany.png") 0 0 no-repeat;
}

#loadingOverlay
{
  display: none;
  background: url("images/overlay.png") 0 0 no-repeat;
}

#loadingOverlay h2
{
  margin-top: 100px;
  text-align: center;
}