#page { margin: 0 auto; width: 960px; }
#head { position: relative; height: 180px; }
#body { position: relative; }
#foot { position: relative; padding: 10px 0; font: 8pt Verdana; }
#main { position: relative; padding: 10px 10px 0; background: #fff url("common/left.gif") repeat-y left; float: left; }
#logo { position: absolute; left: 7px; top: 15px; width: 240px; height: 68px; cursor: pointer; }

#menu-bar             { position: absolute; bottom: 0; left: 15px; height: 77px; }
#menu-bar ul          { float: left; margin: 0; padding: 0; list-style: none; }
#menu-bar li          { float: left; margin: 0; padding: 0; }
#menu-bar li a        { display: inline-block; padding: 52px 8px 10px; color: #fff; text-decoration: none; }
#menu-bar li a:hover  { color: #fff; text-decoration: none; background: url("common/hilite.png"); cursor: pointer; }
#menu-bar li.active a { background: url("common/hilite.png"); }

#search-bar    { position: absolute; height: 32px; width: 323px; bottom: 0; right: 0; }
#search-form   { padding: 2px 0 0 120px; color: #fff; font-size: 90%; }
#search-form input[type=text] { background: #ddd; border: 1px solid #fff; border-top-color: #999; border-left-color: #999; }
#search-button { display: inline-block; border: 0; padding: 0; background: transparent url("common/search.gif"); width: 16px; height: 12px; margin-left: 5px; cursor: pointer; }

#user-bar         { position: relative; height: 72px; background: url("common/welcome.gif") no-repeat top left; }
#user-box         { padding: 10px 0 0 115px; color: #fff; font-size: 90%; }
#user-box a       { display: inline-block; margin: 0 20px 5px 0; color: #fff; text-decoration: underline; }
#login-box        { position: absolute; height: 72px; width: 323px; top: 0; right: 0; background: url("common/login-box.png") no-repeat top right; }
#login-form       { padding: 2px 0 0 65px; color: #fff; font-size: 90%; }
#login-form label { display: inline-block; width: 50px; padding-right: 5px; text-align: right; }
#login-form input[type=text],
#login-form input[type=password] { background: #ddd; border: 1px solid #fff; border-top-color: #999; border-left-color: #999; }
#login-button     { display: inline-block; border: 0; padding: 0; background: transparent url("common/login.gif"); width: 31px; height: 13px; margin-left: 5px; cursor: pointer; }
#login-form a     { margin-right: 20px; color: #fff; text-decoration: underline; }
#login-help       { margin: 5px 0 0 55px; }

#left      { float: left; width: 210px; }
#mid-right { float: left; width: 720px; margin-left: 10px; }
#mid       { float: left; width: 410px; }
#right     { float: left; width: 300px; margin-left: 10px; }
#lower-mid { clear: left; padding-top: 10px; }
#bottom    { clear: left; height: 20px; background: url("common/bottom.gif") no-repeat bottom center; }

.news-block .body                { float: left; padding: 5px 10px 0; }
.news-block .body .tabpage       { float: left; }
.news-block .body ul             { float: left; }
.news-block .body li             { float: left; padding: 10px 0 8px; background: url("common/line.gif") repeat-x top; overflow: hidden; }
.news-block .body li.first-child { padding-top: 5px; background-image: none; }
.news-block .body li .icon       { float: left; margin-right: 5px; border: 1px solid #888; width: 92px; height: 62px; }
.news-block .body li .text       { float: left; color: #d80; width: 291px; overflow: hidden; }
.news-block .body li a           { color: #048; }
.news-block .foot                { clear: left; }

.new-single-block .body                       { float: left; padding: 5px 10px 0; }
.new-single-block .body .tabpage              { float: left; }
.new-single-block .body ul                    { float: left; width: 390px; }
.new-single-block .body li                    { float: left; padding: 10px 0 0; width: 195px; height: 75px; padding-top: 5px; }
.new-single-block .body li.first-child        {  }
.new-single-block .body li .icon              { float: left; border: 1px solid #888; width: 60px; height: 60px; }
.new-single-block .body li .text              { float: left; color: #d80; width: 195px; }
.new-single-block .body li a                  { color: #048; }
.new-single-block .body li .avatar            { float: left; width: 62px; margin-right: 5px; }
.new-single-block .body li .title-name        { float: left; width: 128px; }
.new-single-block .body li .album-name        { float: left; width: 128px; }
.new-single-block .body li .artist-name       { float: left; width: 128px; }
.new-single-block .foot                       { clear: left; }

.new-single-page-block .body                       { float: left; padding: 5px 10px 0px 10px; }
.new-single-page-block .body .tabpage              { float: left; }
.new-single-page-block .body ul                    { float: left; width: 696px; }
.new-single-page-block .body li                    { float: left; padding: 10px 0 0; width: 232px; height: 75px; padding-top: 5px; }
.new-single-page-block .body li.first-child        {  }
.new-single-page-block .body li .icon              { float: left; border: 1px solid #888; width: 60px; height: 60px; }
.new-single-page-block .body li .text              { float: left; color: #d80; width: 232px; }
.new-single-page-block .body li a                  { color: #048; }
.new-single-page-block .body li .avatar            { float: left; width: 62px; margin-right: 5px; }
.new-single-page-block .body li .title-name        { float: left; width: 165px; }
.new-single-page-block .body li .album-name        { float: left; width: 165px; }
.new-single-page-block .body li .artist-name       { float: left; width: 165px; }
.new-single-page-block .foot                       { clear: left; }

.new-release-list-block .content                 { float: left; padding: 5px 10px 0px 10px; background: #ddd url("common/body-line-v.gif") repeat-x; }
.new-release-list-block .content .tabpage        { float: left; }
.new-release-list-block .content ul              { float: left; width: 696px; }
.new-release-list-block .content li              { float: left; padding: 10px 0 0; width: 232px; height: 75px; padding-top: 5px; }
.new-release-list-block .content li.first-child  {  }
.new-release-list-block .content li .icon        { float: left; border: 1px solid #888; width: 60px; height: 60px; }
.new-release-list-block .content li .text        { float: left; color: #d80; width: 232px; }
.new-release-list-block .content li a            { color: #048; }
.new-release-list-block .content li .avatar      { float: left; width: 62px; margin-right: 5px; }
.new-release-list-block .content li .title-name  { float: left; width: 165px; }
.new-release-list-block .content li .album-name  { float: left; width: 165px; }
.new-release-list-block .content li .artist-name { float: left; width: 165px; }
.new-release-list-block .foot                 { clear: left; }

.new-single-release-list-block .body                       { float: left; padding: 5px 10px 0; }
.new-single-release-list-block .body .tabpage              { float: left; }
.new-single-release-list-block .body ul                    { float: left; width: 300px; }
.new-single-release-list-block .body li                    { float: left; padding: 5px 0 0 10px; width: 195px; height: 75px; }
.new-single-release-list-block .body li.first-child        {  }
.new-single-release-list-block .body li .icon              { float: left; border: 1px solid #888; width: 60px; height: 60px; }
.new-single-release-list-block .body li .text              { float: left; color: #d80; width: 195px; }
.new-single-release-list-block .body li a                  { color: #048; }
.new-single-release-list-block .body li .avatar            { float: left; width: 62px; margin-right: 5px; }
.new-single-release-list-block .body li .title-name        { float: left; width: 128px; }
.new-single-release-list-block .body li .album-name        { float: left; width: 128px; }
.new-single-release-list-block .body li .artist-name       { float: left; width: 128px; }
.new-single-release-list-block .foot                       { clear: left; }

.foot-locker           { float: left; width: 240px; margin-bottom: 10px; color: #fff; }
.foot-locker .head     { }
.foot-locker .body     { padding: 5px 40px; }
.foot-locker .caption  { padding: 0 40px; background: url("common/foot-m.gif") repeat-x center; line-height: 30px; vertical-align: middle; font-weight: bold; }
.foot-locker ul        { margin: 0; padding: 0; list-style: none; }
.foot-locker li        { margin: 0; padding: 0 0 1px; }
.foot-locker a         { color: #fff; }
.foot-locker a:link    { text-decoration: none; }
.foot-locker a:visited { text-decoration: none; }
.foot-locker a:hover   { text-decoration: underline; }
.foot-locker a:active  { text-decoration: underline; }

.text-menu .head    { background: url("common/foot-l.gif") no-repeat left; }
.text-menu .body    { margin-left: 20px; }
.text-menu .caption { margin-left: 20px; }

.about-us .head    { background: url("common/foot-r.gif") no-repeat right; }
.about-us .body    { margin-right: 20px; }
.about-us .caption { margin-right: 20px; }

#copyright         { clear: both; padding: 10px 0 0; background: url("common/dotend.gif") repeat-x top; color: #ccc; text-align: center; }
#copyright a       { color: #fff; text-decoration: none; }
#copyright a:hover { text-decoration: underline; }

.dh_new_media       { background: transparent url('common/new_media_button.gif') no-repeat scroll left top; display: block; float: left; color: rgb(119, 119, 119); text-decoration: none; }
.dh_new_media .tr   { background: transparent url('common/new_media_button.gif') no-repeat scroll right top; }
.dh_new_media .bl   { background: transparent url('common/new_media_button.gif') no-repeat scroll left bottom; }
.dh_new_media .br   { background: transparent url('common/new_media_button.gif') no-repeat scroll right bottom; }
.dh_new_media span  { padding: 3px 9px 5px 13px; background: transparent url('common/new_media_button_plus.gif') no-repeat scroll left center; color: rgb(51, 51, 51); margin-left: 9px; font-size: 11px; font-weight: bold; display: block; text-shadow: 0px 1px 1px white; }
.dh_new_media:hover { text-decoration: underline; }
.dh_new_media:active, .dh_new_media:active .tr, .dh_new_media:active .bl, .dh_new_media:active .br { background-image: url('common/new_media_button_active.gif'); }
.dh_new_media_done, .dh_new_media_done .tr, .dh_new_media_done .bl, .dh_new_media_done .br { background-image: url('common/new_media_button_done.gif'); }

.social-panel            { clear: both; padding: 10px 0 0; }
.social-panel h2         { }
.social-panel ul         { padding: 10px 10px; border: 1px dotted #999; background: #eee; font-weight: bold; }
.social-panel li         { margin: 2px; }
.social-panel li a       { display: inline-block; padding: 2px 0 2px 22px; background-repeat: no-repeat; background-position: center left; color: #009; text-decoration: none; }
.social-panel li a:hover { text-decoration: underline; }
.social-panel .negative  { color: #f00; }
.social-panel .add-action     { background-image: url("../common/a-add.png"); }
.social-panel .back-action    { background-image: url("../common/a-left.png"); }
.social-panel .comment-action { background-image: url("../common/a-comment.png"); }
.social-panel .delete-action  { background-image: url("../common/a-delete.png"); }
.social-panel .edit-action    { background-image: url("../common/a-edit.png"); }
.social-panel .folder-action  { background-image: url("../common/a-folder.png"); }
.social-panel .next-action    { background-image: url("../common/a-right.png"); }
.social-panel .profile-action { background-image: url("../common/a-profile.png"); }
.social-panel .reload-action  { background-image: url("../common/a-refresh.png"); }
.social-panel .reset-action   { background-image: url("../common/a-reset.png"); }
.social-panel .upload-action  { background-image: url("../common/a-upload.png"); }
.social-panel .view-action    { background-image: url("../common/a-view.png"); }