/* tradepaperbacks.org - mct 2008 */

* { margin: 0; padding: 0; }
body, html { width: 100%; height: 100%; }
body { background-color: #222; font-family: Arial,Verdana; font-size: 12px; color:#CCC; line-height:18px;  }

a {	text-decoration: none; color: #FFF; font-weight: bold; }
a:hover { text-decoration: underline; }
a img { border: none; }

a.block { width: 100%; height: 100%; display: block; }

.status { position: absolute; top: 15px; right: 0; color: #FFF; padding: 10px;  background-color: #000; z-index: 100; width: 300px; font-size: 12px; border:5px solid #31fe01;border-right: none; }
.status p { color: #FFF; font-size: 12px; background-color: #000; }
.status h1 { font-size: 20px; font-weight: normal; margin: 0 0 10px 0; color: #CCC; }

#statusAction { top: 125px; border: 5px solid #23b1e5; border-right: none; }

h1,h2 { color: #23b1e5; }
h3,h4,h5,h6 { color: #cee600; }

h1 { font-size: 24px; margin: 5px 0 5px 0; width: 100%; border-bottom: 1px solid #cee600; padding: 2px 0 10px 0; font-weight:normal; line-height: 26px; }
h2 { font-size: 16px; }
h3 { font-size: 14px; }
h4 { font-size: 12px; }
h5 { font-size: 10px; }

.left { float: left; }
.right { float: right; }
.clear { clear: both; }
.clearLeft { clear: left; }
.clearRight { clear: right; }

.black { color: #000; }
.blue { color: #23b1e5; }
.yellow { color: #cee600; }
.yellowUnder { border-bottom: 1px solid #cee600; padding-bottom: 5px; }
.red { color: #f0000c; }
.grey { color: #9e9e9e; }
.green { color: #31fe01; }
.pink { color: #e525e3; }
.magenta { color: magenta; }

.arrow { position: absolute; top: 2px; }
.smGrey { color: #9e9e9e; font-size: 10px; }
.icon { margin: 0px 4px 0 0px; top: 2px; position: relative; z-index: 2; }

#shim { width: 100%; min-height: 1200px; height: 100%; position: absolute; top: 0; left: 0;  }

#wrapper{ float: left; width: 960px; min-height: 1200px; padding-top: 20px;}
#header { float: left; width: 100px; margin: 5px 1px 1px 3px; }
#topNav { float: left; width: 350px; border-bottom: 1px solid #CCC; margin-bottom: 20px; }

#search { float: right; }
#search input { float: left; margin: 5px 0px 0 5px; }

#main { float: left; width: 740px; margin-left: 5px; }
#main h3 { }

#leftCol { float: left; width: 150px; height: 100%; margin-left: 40px;  }
#logo { margin: 0 0 0 -20px; }

p { margin-bottom: 10px; background-color: #333; padding: 2px 5px; }

form { margin: 0; padding: 0; }
label { display: block; font-weight: bold; color: #cee600; font-family: Arial; font-size: 14px;}
.required { color: #f0000c; }
input, select, textarea {  background-color:#333; border:1px solid #999;	font-size: 14px;	color:#FFF; height: 20px; margin-bottom: 5px; }
.wide { width: 300px; }
.input_height {	height:22px;}
.submit { background-color:#111; font-size: 12px; color: #FFF; margin: 0; padding: 0 2px 5px 2px; height: 22px; }
.input file {	background-repeat:no-repeat;	background-color:#333; }

#browseSort { float: right; }
#browseSort h2 { float: left; margin: 0 5px; }
#browse { float: left; width: 100%; margin: 0px 0 0px 0; padding: 2px 0; }
#browseFrame { width: 740px; max-height: 500px; border: 0px; overflow: scroll; overflow-x: hidden; border-bottom: 1px solid #cee600; margin: -5px 0 20px 0; }

.rowHeader { position: static; }
.rowHeader h4 { float: left; position: relative; height: 20px; margin-top: 5px; }
.rowHeader h4 a { text-decoration: underline; }

.row { float: left; margin: 2px 0; background-color: #333; padding: 2px 0; width: 100%; }

.col { float: left; margin-left: 10px; }
.colStatus { width: 80px; text-align: left; }
.colTitle { width: 340px; }
.colAuthor { width: 140px; }
.colOwner { width: 60px; }
.colAdded { width: 50px; text-align: right;  }
.colEdit { width: 20px; }

.noBooks { margin: 0 0 20px 0px; }

.ledger { clear: left; float: left; width: 340px; }
.shouts { float: left; margin-left: 40px; width: 350px; }
.shouts textarea { width: 348px; height: 60px; }
.shouts .submit { margin-bottom: 20px; }
.shoutRow { margin: 0 0 10px 0; background-color: #333; padding: 2px 5px; }
.shoutRow .when { font-size: 10px; color: #9e9e9e; }

#user { width: 165px; float: left; height: 160px; padding: 5px; margin: 0 0 0 46px; border-top: 5px solid #00AEEF; background-color: #FFF; }

.userLeft { float: left; width: 340px; }
.userRight { float: left; width: 340px; margin-left: 10px; }


#nav { clear: left; float: left; width: 100%; }
#nav h3 { margin: 10px 0; border-left: 2px solid #cee600; padding-left: 5px; }
#nav ul { margin: 10px 0 10px 10px; }
#nav ul li { border-left: 2px solid #cee600; list-style-type: none; margin: 10px 0; font-size: 12px; padding-left: 5px; }


.bookInfo { margin: 10px 0 40px 0; padding: 0px; font-size: 14px; position: relative; }
.bookInfo .status { font-size: 18px; border-bottom: 1px solid #cee600; padding-bottom: 10px; }
.bookInfo .author { font-size: 18px; margin-bottom: 10px; border-bottom: 1px solid #cee600; width: 100%; float: left; height: 30px; }
.bookInfo .author a { font-weight:normal; }
.bookInfo .owner { margin-bottom: 0px; }
.bookInfo .description { margin: 0px 0 0 0px; }
.bookInfo h3 { margin: 0 0 5px 0;  }
.bookInfo .author .aButton { margin-top: -2px; }

.aButton { float: left; margin: 0 0 0px 0; border: 1px solid #999; padding: 0px 5px; background-color: #197da2; font-size: 12px; }
.aButton a { color: #FFF; }

.bookStatus { float: right; font-size: 14px; height: 20px; }
.bookDescription { width: 370px; height: 160px; }

.copies { float: right; width: 300px; margin-bottom: 20px; }
.copies .col { float: left; width: 90px; }

.modal { position: absolute; background: url(/img/scrim.png); padding: 10px; z-index: 10; }
.modal .inner { width: 100%; height: 100%; background-color: #444; }
.modal form { padding: 20px; text-align: center; }

#checkoutBook { top: 60px; left: 200px; width: 220px; height: 150px; }
#editDescription { top: 60px; left: 100px; width: 420px; height: 420px; }
#editDescription input.text { width: 370px; }
#editDescription form { text-align: left; }

#picFull { right: 0px; top:40px;  }

#login { text-align: left; }
#login form { width: 150px; text-align: left;}

#user h1 { text-align: center; }
#user p { text-align: center; }
#user ul { text-align: center; }
#user ul li { list-style-type: none; }
#main ul { margin-left: 0px; }
#main ul li { margin: 10px 0 10px 2px; }

#newUser { padding: 10px; border:1px solid #999; background-color: #333; float: left; }
#newUser label { float: left; text-align: right; width: 150px;}
#newUser .input_height { float: left; width: 180px; margin-left: 10px; background-color: #333; } 
#newUser .instruction { clear: left; float: right; width: 190px; margin-right: 5px; }
#newUser .submit { clear: left; float: left; padding-bottom: 5px; margin: 10px 0 0 160px; }

.bookInfo .artistPic { padding-left: 40px; }
.artistPic { margin: 0 0 10px 0; }
.artistPic img { padding: 5px; background-color: #FFF; border: 5px solid #999; }
.artistBio { margin: 0 0 10px 2px;}

.alt { background-color: #EEE; }

.aboutPage .artistPic { margin-top: 18px; }
.aboutPage .modal { margin-top: 18px; }

.cover { float: left; margin: 0 10px 10px 0; width: 160px; height: 260px;  }
.cover img { width: 99%; border:2px solid #FFF;}

.siteUser { width: 140px; height: 50px; float: left; background-color: #333; padding: 10px; margin: 10px; border: 0px solid #333; }
.siteUser .name { font-size: 18px; margin: 0 0 2px 0;}
.siteUser .name a { font-weight: normal; }
.siteUser .location { font-size: 12px; }
.siteUser .date { font-size: 11px; color: #999; }
.siteUser .userChart { float: right; width: 40px; }

.chart { border: 5px solid #999; padding: 10px; background-color: #333;}
#statsPage .chart { background-color: #FFF; }

.filename { clear: left; float: left; margin: 10px 0 10px 0; border-left: 1px solid #cee600; border-bottom: 1px solid #cee600; padding: 0 0 5px 5px; } 
.filename .name { font-size: 16px; font-weight: bold; float: left; margin: 0 5px 0 0; }
.filename .links { clear: left; float: left; font-size: 12px; }
.filename .link { float: left; margin: 0 10px 0 0;  }

#conversations { }
#conversations .column { float: left; width: 230px; padding: 10px 0 0 0; }
#conversations .convo {  margin: 10px 0 20px 0; width: 240px; border-left: 1px solid #cee600; }
#conversations .shouts { margin: 0px 0 0 0; }
#conversations .shouts .submit { margin: 0px 0 10px 0; }
#conversations .shoutRow { margin: 0 0 5px 0; width: 230px; }
#conversations h3 { padding: 2px 5px; background-color: #555; width: 230px; border-top: 1px solid #cee600;}
#conversations .shoutForm { float: left; background-color: #666; padding: 2px 5px; width: 230px; font-size: 12px; }
#conversations .shoutForm textarea { width: 200px; height: 30px; float: left; margin-top: 5px; }
#conversations .shoutForm .submit { margin-bottom: 5px; }
#conversations textarea { width: 240px; margin-top: 10px; }

.scrollbox { overflow: scroll; max-height: 340px; width: 350px; overflow-x: hidden; border: 1px solid #999; border-left: none; border-right: none; margin: 0 0 10px 0; }
.scrollbox .checkboxRow { float: left; border-bottom: 1px solid #666; padding-top: 5px; }
.scrollbox label { float: left; margin: 0 0 0 5px; width: 310px; font-size: 12px; font-weight: normal; color: #FFF; }
.scrollbox input { float: left; width: 10px; }