body                    { background: #FFF url('/new-design/images/bg.png') top center repeat-x; }
body#fullscreen         { background: #FFF url('/new-design/images/bg-fullscreen.png') top center repeat-x; }
html, body              {height: 100%;}
#wrap                   {min-height: 100%;}
#main                   { overflow: auto; padding-bottom:208px; } /* padding same height as footer + 15px for "margin-top" simulation */
.container              { width: 880px; margin: 0 auto; position: relative; }
.box                    { background-color: #F2F8F4; border: 1px solid #DCE9DE; padding: 10px; }

.sprite                 { background: transparent url('/new-design/images/sprite.png?v7') no-repeat; }

.span-185               { float: left; width: 185px; }
.span-30                { float: left; width: 30px; }
.span-665               { float: left; width: 665px; }
.span-190               { float: left; width: 190px; }
.span-140               { float: left; width: 140px; }

input::-webkit-input-placeholder { color: #333; }

/*Opera Fix for sticky footer*/
body:before {/* thanks to Maleika (Kohoutec)*/
content:"";
height:100%;
float:left;
width:0;
margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}

/**
 * Header area (above the gray strip).
 */

#header                 { height: 76px; }

/* Logo */
#header h1              { display: block; float: left; margin: 14px 0 0 -20px; }
#header h1 a            { display: block; background-position: 0 -328px; width: 139px; height: 49px; text-decoration: none; }

#header-right           { float: right; margin: 0 0 10px 0; padding: 0; font-size: 10px;
                         color: #cecece; text-transform: uppercase; }

#header-nav-alpha       { background-position: 0 -564px; height: 38px; padding: 7px 0 0 20px; margin: 0 13px 0 0; }
#header-nav-alpha strong,
#header-nav-alpha a     { color: #7c7c7c; text-decoration: none; font-size: 10px; }
#header-nav-alpha a:hover { text-decoration: underline; }
#header-nav-alpha-username-split { background-position: -168px 0; display: inline-block; height: 29px; margin-top: -17px;
                                   position: relative; top: 10px; width: 9px; }

#header-nav-beta            { float: right; text-align: right; }
#header-nav-beta a          { color: #4e4e4e; font-weight: bold; font-size: 13px; text-decoration: none; text-transform: none; }
#header-nav-beta a:hover    { color: #3e9343; text-decoration: none; }
#header-nav-beta div        { float: left; margin-right: 9px; }
#header-nav-beta div a      { margin-top: 1px; display: block; }
#header-nav-beta-cart       { background-position: 0 -381px; width: 26px; height: 30px; }
#header-nav-beta-cart-count { color: #5d9732; }
#header-nav-beta-self       { background-position: -26px -381px; width: 19px; height: 30px; }


/**
 * Gray strip.
 */

#strip                  { height: 41px; margin-bottom: 30px; }

#strip-nav              { font-size: 15px; font-weight: bold; line-height: 20px;
                          float: left; margin: 10px 0 0; }
#strip-nav a            { color: #fff; text-decoration: none; }
#strip-nav a:hover      { text-decoration: underline; }
/* Bullets */
#strip-nav span         { color: #6dc54f; font-size: 19px; position: relative; top: 2px; }

#strip-search           { position: absolute; right: 0; top: 84px; line-height: 25px; }

#strip-search-label     { color: #fff; font-size: 13px;
                          text-transform: uppercase; padding: 3px 0; cursor: pointer; }
#strip-search-category  { margin: 0 0 0 10px; padding: 1px 8px 1px 5px; width: 131px; background-color: #F6F6F6;
                          -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; }
#strip-search-query     { margin: 0 0 0 10px; padding: 3px 10px 4px; width: 253px;
                          border: none; background-color: #f6f6f6; outline: none;
                          -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; }
/* See zibbet-misc JS for a Firefox fix */
#strip-search-submit    { margin: 0px 0 0 10px; padding: 4px 8px; font-size: 12px; font-weight: bold;
                          border: none; color: #FFFFFF; cursor: pointer; text-decoration: none;
                          background-color: #383838; letter-spacing: 1px;
                          -moz-border-radius: 15px;-webkit-border-radius: 15px; border-radius: 15px; }
#strip-search-submit:hover  { background-color: #c8c8c8; color: #2d2d2d; }

/**
 * Artwork listing card
 */

.listing-card                   { background-color: #f2f2f2; padding: 8px; margin: 0 23px 26px 0; }
.listing-card.no-right-margin   { margin-right: 0; }
.listing-card p                 { margin: 0 !important; padding: 0 !important; }
.listing-card h6.item-title     { margin-bottom: 3px; font-weight: normal; font-size: 12px; }
.listing-card .listing-maker    { float: left; font-size: 12px; width: 100px; }

.listing-card .money-tag        { background-position: -80px -70px; width: 13px; height: 15px; display: inline-block; }
.listing-card .listing-price    { float: right; color: #6d6d6d; font-weight: bold; font-size: 12px; }
.listing-card .currency-symbol  { }
.listing-card .currency-code    { color: #929292; }

.listing-card h6.item-title a   { color: #454545 !important; }
.listing-card .listing-maker a  { color: #59985d !important; }
.listing-card a                 { text-decoration: none; }
.listing-card a:hover           { text-decoration: underline; }


/**
 * Footer.
 *
 * #footer-top is the light gray area.
 * #footer-bottom is the dark gray area.
 */

#footer {position: relative;
	margin-top: -193px; /* negative value of footer height */
    height: 193px;
	clear:both;}

#footer-top             { color: #bababa; background-color: #545454; padding: 16px 0 14px; height: 120px; }
#footer-top h2          { color: #a6a6a6; font-size: 14px; font-weight: bold; margin: 3px 0 8px; border-bottom: none;
                          font-family: arial, sans-serif; line-height: 17px; }
#footer-top-connect,
#footer-top-help        { border-right: 1px solid #7a7a7a; margin-right: 25px; line-height: 17px; }
#footer-top-connect,
#footer-top-help,
#footer-top-secure      { float: left; height: 97px; }

/* Social site icons */
#footer-top-connect     { width: 470px; }
#footer-top-connect div { float: left; margin: 3px 13px 0 0; }
#footer-top-connect div a { margin-top: 9px; display: block; font-size: 12px; }
#footer-top-facebook-logo { background-position: 0 -67px; width: 35px; height: 35px; }
#footer-top-twitter-logo  { background-position: -34px -67px; width: 35px; height: 35px; }

#footer-top-help        { width: 200px; }

#footer-top-verisign-logo { background-position: -41px 0; width: 124px; height: 57px; display: block; }

#footer-top a           { color: #bababa; line-height: 16px; }

#footer-bottom          { color: #bbbbbb;  text-transform: uppercase; font-size: 10px;
                          background-color: #3b3b3b; padding: 14px 0 14px; text-align: center;  }
#footer-bottom a        { color: #bbbbbb; }

#footer-top a,
#footer-bottom a        { text-decoration: none; text-transform: uppercase; font-size: 10px; }
#footer-top a:hover,
#footer-bottom a:hover  { text-decoration: underline; }


/**
 * Rounded buttons (and links that pretend to be buttons).
 */

.button-rounded-gray,
.button-rounded-green   { border: none; height: 25px; cursor: pointer; padding: 4px 8px; margin: 0;
                          color: #fff; font-weight: bold; font-size: 13px; text-decoration: none;
                          -webkit-border-radius: 14px; -moz-border-radius: 14px; border-radius: 14px; }
.button-rounded-gray    { background-color: #383838; }
.button-rounded-green   { background-color: #5d9f22; }

a.button-rounded-gray,
a.button-rounded-green  { padding: 4px 10px; }

.button-rounded-gray:hover  { background-color: #c8c8c8; color: #2d2d2d; }
.button-rounded-green:hover { background-color: #549718; color: #fff; }


/**
 * Breadcrumbs (page history).
 */

#breadcrumb             { font-size: 13px; margin: -10px 0 10px; }


#page-output a          { color: #197B30; text-decoration: none; }
#page-output p          { margin: 0px 0px 1em; }
#page-output h2         { font-size: 1.6em; border-bottom: 1px solid #CCC; }
#page-output h3         { color: #188030; font-size: 1.1em; text-transform: uppercase; font-weight: bold; }
#page-output .small-text { font-size:0.9em; color:#999999; }


/* See zibbet-misc JS */
.trimSingle             { white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis;
                          -ms-text-overflow: ellipsis; overflow: hidden; *width: 100%; }
.trimSingle window      { width: 100%; -moz-user-focus: normal; -moz-user-select: text; }
.trimSingle description { -moz-user-focus: normal; -moz-user-select: text; }

