.artwork { background: #000; padding: 15px 20px; color: #fff; }
#chapter-info {display: inline; float: right; margin: 6px 0 0 0; color: #fff; }
#chapter-info p { font-size: 16px; }
#chapter-titlearea { background: #000; padding: 15px 20px 10px 20px; margin-bottom: 10px; }
#chapter-titlearea h1 { text-transform: uppercase; font-size: 27px; padding: 0; margin: 0; letter-spacing: 1px; }
#chapter-titlearea h2 { color: #ccc; font-size: 17px; margin: 2px 0 0 0; padding: 0; text-transform: uppercase; font-weight: 700; letter-spacing: 1px; }
.dark { color: #999; font-size: 15px; font-weight: 300; }
#blackout { background-image: url(/img/fadeout.png); }
#blackout-description { background-color: #000; z-index: 801; }
#blackout-title {  margin: 0 0 15px 0; padding: 0; }


#icon-cluster { background-image: url(/img/icon_cluster.gif); background-position: 0 0; background-repeat: no-repeat; width: 19px; height: 17px; display: block; }
#icon-cluster:hover { background-position: 0 -17px; }
#icon-uniform { background-image: url(/img/icon_uniform.gif); background-position: 0 0; background-repeat: no-repeat; width: 19px; height: 17px; display: block; }
#icon-uniform:hover { background-position: 0 -17px; }

.artwork-chapter { font: 700 13px "mentone-1","mentone-2", sans-serif; color: #bbb; text-transform: uppercase; letter-spacing: 3px;  }
.artwork-title { font: 700 28px "mentone-1","mentone-2", sans-serif; color: #fff; text-transform: uppercase; padding: 0 18px 0 0; letter-spacing: 1px; }
.artwork-authors-copyright { font: 500 20px "sirba-web-1","sirba-web-2", serif; color: #fff; padding: 7px 4px 0 0; }
.artwork-authors-top { font: 700 14px "sirba-web-1","sirba-web-2", serif; color: #fff; padding: 13px 15px 1px 0; }
.artwork-authors-top a { color: #fff !important; }
.artwork-authors-top a:hover { color: #b7fff9 !important; }
.artwork-authors-bottom { font: 500 11px "museo-sans-1","museo-sans-2", sans-serif; color: #ddd; padding: 0 15px 0 0; }

#artbox { background: #000; padding: 10px 20px 40px 20px; }
#blackout-chapter { margin: 0; }
#blackout-authors { font: 700 13px "museo-sans-1","museo-sans-2", sans-serif; letter-spacing: normal; color: #eee; }
#blackout a { color: #B7E8FF; }
#blackout a:hover { color: #b7fff9; }
#blackout-details { color: #bbb; margin: 0 0 10px 0; padding: 4px 10px; background: #000; border: solid 1px #1a1a1a; text-align: center; }
#blackout-details p { margin: 0; padding: 0; }
#blackout-details  strong { color: #e9e9e9; }
#blackout-artwork { text-align: center; padding: 0 10px 30px 10px; background-color: #000; z-index: 802; }
#blackout-artdescription p { margin: 0 15px 15px 0; padding: 0 0 13px 13px; color: #ddd; border-left: solid 15px #222; }
#blackout-share { margin: 0; padding: 0; z-index: 806; text-align: right; background: #000; }
#blackout-share p { color: #fff; margin: 5px 0 0 0; padding: 0; }
#blackout-options { float: right; display: inline; margin: 0; padding: 0; text-align: right; }
#blackout-options p { color: #fff; margin: 5px 0 0 0; padding: 0; }


#chapter-music { margin-bottom: 2px; background: #161616; padding: 15px; border: solid 1px #242424; }
#chapter-music-description { background: #333; color: #fff; font: 500 14px "sirba-web-1","sirba-web-2", serif; line-height: 140%; text-align: left; padding: 10px 14px; margin-top: 5px; }
#media-gone p { margin: 0; padding: 0; color: #fff; font-size: 14px; }
#media-gone p strong { color: #ffb4b4; font-size: 16px; }

#details-right { display: inline; float: right; }
#details-right p { margin: 0; padding: 0; font: 700 13px "museo-sans-1","museo-sans-2", sans-serif; letter-spacing: normal; }

.browsebar { margin: 0 0 5px 0; background: #111; height: 30px; }
.browse-left { display: inline; float: left; width: 46px; height: 30px; }
.browse-left a { display: block; background-color: #525252; height: 30px; width: 46px; background-image: url(/img/karat_previous.png); background-repeat: no-repeat; background-position: 0 -30px; }
.browse-left a:hover { background-color: #323232; background-position: 0 0; }
.browse-left a:active { background-color: #444; }

.browse-right { display: inline; float: right; width: 46px; height: 30px; }
.browse-right a { display: block; background-color: #525252; height: 30px; width: 46px; background-image: url(/img/karat_next.png); background-repeat: no-repeat; background-position: 0 -30px; }
.browse-right a:hover { background-color: #323232; background-position: 0 0; }
.browse-left a:active { background-color: #444; }
.browse-middle-left { display: inline; float: left; text-align: center; width: 329px; height: 21px; font: 10px "museo-sans-1","museo-sans-2", sans-serif; color: #fff; padding-top: 10px; text-transform: uppercase; }
.browse-middle { display: inline; float: left; text-align: center; width: 329px; height: 21px; font: 13px "museo-sans-1","museo-sans-2", sans-serif; color: #fff; padding-top: 7px; }
.browse-middle-right { display: inline; float: left; text-align: center; width: 329px; height: 21px; font: 10px "museo-sans-1","museo-sans-2", sans-serif; color: #fff; padding-top: 10px; text-transform: uppercase; }

#topbar { font: 500 14px "museo-sans-1","museo-sans-2", sans-serif; margin: -8px 0 15px 0; }
#topbar a { color: #e2e2e2; }
#topbar a strong { color: #fff; }
#topbar a:hover { color: #b7fff9; }
#topbar-left { display: inline; float: left; width: 400px; }
#topbar-right { display: inline; float: right; width: 400px; text-align: right; }