/*
#wrapcontent { background-color: #eee; }
#titlebar { background-color: #aaa; }
#title td { background-color: #bbb; }
#main_image { background-color: #ccc; }
#nav_center a, #nav_right a { background-color: #ddd; }
*/

html {
  background-color: white;
  background-attachment: fixed;
  background-image: url(/images/sugar/tile.jpg);
}

body {
  font-family: 'Futura', 'Helvetica', 'arial', sans-serif;
  font-size: 0.8em;
  color: #888;
/*  background: top left url(/images/bg-edge.png) no-repeat;*/
  margin: 0 auto;
  width: 960px;
  height: 680px;
}

img {
  border: none;
}

body, a {
  color: #888;
}

a:hover, li.youarehere a:hover, #footer a:hover {
  color: #db0000;
}

li.youarehere a {
  color: #ec008c;
}

#footer, #footer a {
  color: #bbb;
}

td {
  vertical-align: middle;
}

a:hover {
  text-decoration: none;
}

a {
  text-decoration: none;
}

#subscribe td {
  vertical-align: middle;
  padding: 0;
  margin: 0;
}
#subscribe form {
  margin: 0;
  padding: 0;
}

#subscribe_label {
  text-align: right;
}

div#wrapcontent {
  background-color: white;
  width: 940px;
  height: 660px;
  padding: 10px;
}

ul {
  margin: 0;
  padding: 0;
}

li {
  display: inline;
}

div#footer {
  position: absolute;
  top: 690px;
}

#titlebar {
  padding: 0;
  height: 60px;
  width: 800px;
  margin: 0 auto;
}
#title {
  width: 800px; height: 60px;
  background: url(/images/sugar/buttons/navigation4.png);
  /*margin: 10px auto; padding: 0;*/
  position: relative;
}
#title li {
  margin: 0; padding: 0; list-style: none;
  position: absolute; top: 0;
}
#title li, #title a {
  height: 60px; display: block;
}

#logo {left: 0; width: 175px;}
#title li#portfolio {left: 340px; width: 75px; height: 33px;}
#title li#portfolio a { height: 33px; }
#title li#portfolio_0 {top: 30px; left: 367px; width:10px; height: 15px; /*border: 1px solid gray;*/}
#title li#portfolio_1 {top: 30px; left: 377px; width:10px; height: 15px; /*border: 1px solid gray;*/}
#title li#portfolio_2 {top: 30px; left: 387px; width:10px; height: 15px; /*border: 1px solid gray;*/}
#title li#portfolio_3 {top: 30px; left: 397px; width:10px; height: 15px; /*border: 1px solid gray;*/}
#play {left: 415px; width: 40px;}
#shop {left: 455px; width: 50px;}
#inspire {left: 670px; width: 50px;}
#love {left: 720px; width: 35px;}
#contact {left: 755px; width: 45px;}

#portfolio a:hover {
  background: transparent url(/images/sugar/buttons/navigation4_over.png) -340px 0 no-repeat;
}
#portfolio_0 a:hover {
  background: transparent url(/images/sugar/buttons/navigation4_over.png) -367px -30px no-repeat;
}
#portfolio_1 a:hover {
  background: transparent url(/images/sugar/buttons/navigation4_over.png) -377px -30px no-repeat;
}
#portfolio_2 a:hover {
  background: transparent url(/images/sugar/buttons/navigation4_over.png) -387px -30px no-repeat;
}
#portfolio_3 a:hover {
  background: transparent url(/images/sugar/buttons/navigation4_over.png) -397px -30px no-repeat;
}
#play a:hover { 
  background: transparent url(/images/sugar/buttons/navigation4_over.png) -415px 0 no-repeat;
}
#shop a:hover { 
  background: transparent url(/images/sugar/buttons/navigation4_over.png) -455px 0 no-repeat;
}
#inspire a:hover { 
  background: transparent url(/images/sugar/buttons/navigation4_over.png) -670px 0 no-repeat;
}
#love a:hover { 
  background: transparent url(/images/sugar/buttons/navigation4_over.png) -720px 0 no-repeat;
}
#contact a:hover { 
  background: transparent url(/images/sugar/buttons/navigation4_over.png) -755px 0 no-repeat;
}

.youarehere { background-image: url(/images/sugar/buttons/navigation4_on.png); }

#portfolio.youarehere { background-position: -340px 0; }
#portfolio_0.youarehere { background-position: -367px -30px; }
#portfolio_1.youarehere { background-position: -377px -30px; }
#portfolio_2.youarehere { background-position: -387px -30px; }
#portfolio_3.youarehere { background-position: -397px -30px; }
#play.youarehere { background-position: -415px 0; }
#shop.youarehere { background-position: -455px 0; }
#inspire.youarehere { background-position: -670px 0; }
#love.youarehere { background-position: -720px 0; }
#contact.youarehere { background-position: -755px 0; }

#main_image {
  display: block;
  position: relative;
  height: 600px;
  top: 0;
  left: 0;
  text-align: center;
}

#subscribe {
  width: 960px;
}

ul.nav {
padding: 0;
margin: 0;
/*  font-size: 1.4em;*/
}

.nav a {
display: block;
width: 20px;
height: 25px;
float: left;
/*  padding: 0.2em 0.6em;*/
/*padding-right: 10px;*/
}

table#title {
/*  float: center;*/
/*  margin-top: 10px;*/
  width: 800px;
  text-align: center;
}

#image_pair {
  position: relative;
  top: 0;
  left: 0;
  /*width: 800;*/
/*  border: 1px solid red;*/
  text-align: center;
  padding: 0;
  margin: 0;
}

#right_image, #left_image {
  display: inline;
}

/* --------- nav image rollovers ---------- */

#nav_center {
  vertical-align: middle;
  text-align: center;
}

#nav_center div {
  margin: 0 auto;
}

a#nav_logo {
  display: block;
  float: left;
}

#nav_center a, #nav_right a {
  display: block;
  float: right;
  width: 50px;
  height: 25px;
  margin: 0;
  padding: 0;
  background-repeat: no-repeat;
}

#title li a {
/*  width: 80px;*/
/*  padding-left: 35px;*/
}

#nav_new {
  background-image: url(/images/sugar/buttons/sugar_power_new.gif);
}

#nav_new:hover {
  background-image: url(/images/sugar/buttons/sugar_power_new_over.gif);
}

.youarehere#nav_new {
  background-image: url(/images/sugar/buttons/sugar_power_new_ON.gif);
}

#nav_client {
  background-image: url(/images/sugar/buttons/sugar_power_client.gif);
}

#nav_client:hover {
  background-image: url(/images/sugar/buttons/sugar_power_client_over.gif);
}

.youarehere#nav_client {
  background-image: url(/images/sugar/buttons/sugar_power_client_ON.gif);
}

#nav_play {
  background-image: url(/images/sugar/buttons/sugar_power_play.gif);
}

#nav_play:hover {
  background-image: url(/images/sugar/buttons/sugar_power_play_over.gif);
}

.youarehere#nav_play {
  background-image: url(/images/sugar/buttons/sugar_power_play_ON.gif);
}

#nav_inspire {
  background-image: url(/images/sugar/buttons/sugar_power_inspire.gif);
}

#nav_inspire:hover {
  background-image: url(/images/sugar/buttons/sugar_power_inspire_over.gif);
}

.youarehere#nav_inspire {
  background-image: url(/images/sugar/buttons/sugar_power_inspire_ON.gif);
}

#nav_love {
  background-image: url(/images/sugar/buttons/sugar_power_love.gif);
}

#nav_love:hover {
  background-image: url(/images/sugar/buttons/sugar_power_love_over.gif);
}

.youarehere#nav_love {
  background-image: url(/images/sugar/buttons/sugar_power_love_ON.gif);
}

#nav_contact {
  background-image: url(/images/sugar/buttons/sugar_power_contact.gif);
}

#nav_contact:hover {
  background-image: url(/images/sugar/buttons/sugar_power_contact_over.gif);
}

.youarehere#nav_contact {
  background-image: url(/images/sugar/buttons/sugar_power_contact_ON.gif);
}

#nav_logo {
  display: block;
  height: 62px;
  width: 170px;
  background-image: url(/images/sugar/buttons/sugar_power_home_button.gif);
}

#nav_logo:hover {
  background-image: url(/images/sugar/buttons/sugar_power_home_ON.gif);
}

/* next/previous arrows */

#next_arrow {
  padding-left: 10px;
}

a#next_arrow:hover  {
  background: white url(/images/sugar/buttons/arrow_right_on.gif) no-repeat center;
}

a#next_arrow {
  display: block;
  position: relative;
  height: 100px;
  background: white url(/images/sugar/buttons/arrow_right.gif) no-repeat center;
}

#previous_arrow {
  padding-right: 10px;
}

a#previous_arrow {
  display: block;
  height: 100px;
  background: white url(/images/sugar/buttons/arrow_left.gif) no-repeat center;
}

a#previous_arrow:hover {
  background: white url(/images/sugar/buttons/arrow_left_on.gif) no-repeat center;
}
