/* css/global.css
   site-wide styles for stepback.ca */

@import url(basic.css);

/** containers **/
#container {
   background: url(../img/bg_container_top.gif) 0 0 no-repeat;
   margin: 50px auto 0 auto;
   padding: 50px;
   text-align: left;
   width: 724px;
   \width: 824px;
   w\idth: 724px;
   }
#topic-columns {
   display: inline;
   float: left;
   margin-right: 50px;
   width: 550px;
   }


/** center column **/
#page-topic {
   display: inline;
   float: right;
   width: 376px;
   }
#page-topic h2 {
   background: url(../img/vline_asterisk.gif) bottom left repeat-x;
   clear: both;
   margin: 2em 0;
   padding: 0 0 1.5em 0;
   }
   
/* promo box */
.promo-container {
   background: url(../img/bg_promo_btm.gif) bottom left no-repeat;
   margin: 0 0 2em 0;
   padding: 0 0 11px 0;
   }
.promo {
   background: url(../img/bg_promo_top.gif) 0 0 no-repeat;
   padding: 16px;
   position: relative;
   width: 344px;
   \width: 376px;
   w\idth: 344px;
   }
.promo img {}
.promo h1, .promo h3 {
   padding: 0 5px;
   }
#page-topic .promo h2 {  /* more specific to override styles from #page-topic h2 */
   background: none;
   font-size: 1em;
   font-weight: normal;
   margin: 1.5em 0 0 0;
   padding: 0 5px;
   }
.promo p {
   padding: 0 5px;
   }
.promo-description h1 {
   background: url(../img/vline_asterisk.gif) bottom left repeat-x;
   padding: 0 10px 1em 10px;
   }
.promo-description p {
   padding: 0 10px;
   }
.promo-item {
   margin: 1em 0 0 0;
   width: 190px;
   }


/* categories / items */
.item {
   clear: both;
   margin: 20px 0;
   }
.item .description {
   float: right;
   margin: 0 0 20px 0;
   width: 290px;
   }
.item h3 {
   margin: 0 0 0.5em 0;
   }
.item p.image {
   margin: 0 0 20px 0;
   }
.item p.image .enlarge {
   color: #a6bbcc;
   font-size: 0.9em;
   vertical-align: top;
   }
.item p.image .enlarge .text {
   background: url(../img/btn_enlarge.gif) 0 50% no-repeat;
   padding: 0 0 0 1.6em;
   text-decoration: underline;
   }

   
/* enlargement box */
#enlargement {
   background: #fff url(../img/bg_enlarge_wait.png) 12px 12px no-repeat;
   border: 1px solid #a6bbcc;
   color: #a6bbcc;
   display: none;
   font-size: 0.9em;
   left: 0;
   padding: 5px;
   position: absolute;
   top: 0;
   }
#enlargement img {
   display: block;
   }
#enlargement span {
   margin: 0 0 0 5px;
   vertical-align: top;
   }
   

/** left-side column **/
#topic-meta {
   display: inline;
   float: left;
   margin-right: 50px;
   width: 124px;
   }
#logo {
   margin: 0 0 2em 0;
   }

/* generic left-side module */
.module {
   background: url(../img/vline_asterisk.gif) 0 0 repeat-x;
   padding: 2em 0 1em 0;
   }
.module h2 {
   font-size: 1em;
   font-weight: normal;
   margin: 0;
   }
.module h2 :link {
   color: #bf311a;
   }
.module img {
   margin: 1.5em 0 0 0;
   }
.module dl {
   margin: 0;
   padding: 0;
   }
.module dt {
   color: #4d7899;
   margin: 0.5em 0;
   }
.module dd {
   padding: 0;
   margin: 0.5em 0 1.5em 0;
   }

/* side nav */
#site-nav h2 {
   font-size: 1.18em;
   font-weight: bold;
   margin: 0 0 .83em 0;
   }
#site-nav ul {
   list-style: none;
   margin: 0;
   padding: 0;
   }
#site-nav li {
   list-style: none;
   margin: 0;
   padding: 0.6em 0;
   }
           
/* email list signup */
#email-list {}
#email-list h2 {
   background: none;
   font-size: 1em;
   margin: 0.5em 0;
   padding: 0;
   }
#email-list .aside {
   color: #999;
   font-size: 0.9em;
   }
#email-list .error {
   color: #bf311a;
   }

   
/** right-side column **/
#store-info {
   display: inline;
   float: left;
   width: 124px;
   }
#store-info img {}
#store-info h3 {
   font-weight: normal;
   margin: 0.5em 0;
   }
#store-info p {
   line-height: 1.5em;
   margin: 0 0 1.5em 0;
   }
#store-info .inlined {
   margin: 0 0 1.5em 0;
   }
#store-info .inlined h3 {
   display: inline;
   float: left;
   margin: 0 0.5em 0 0;
   }
#store-info .inlined p {
   line-height: 1.2em;
   margin: 0 0 0.5em 0;
   }

/* back to top link */
.back-to-top {
   text-align: right;
   }
   

/** footer **/
#footer {
   background: url(../img/bg_container_btm.gif) 0 0 no-repeat;
   clear: both;
   font-size: 0.9em;
   margin: 0 auto;
   padding: 2.5em 0;
   text-align: center;
   width: 824px;
   }