/* The Artists Web Control Panel 01/2009
 *
 * 	Table of Contents:
 * 		Reset
 * 		General elements and classes		
 * 		Positioning
 */

/*-------------------------- Reset  ---------------------------------------------------------------- */

@import "reset.css";
@import "fonts-min.css";

* {
	margin: 0;
	padding: 0;
}

/*-------------------------- Global  ---------------------------------------------------------------- */

img { border: 0; }
label { cursor: pointer; }
li, dd { margin-bottom: 6px; }
p, li, dl, dd, dt { line-height: 140%; }
form { display: inline; }
textarea, input, select { margin: 1px; padding: 3px; }

.floatRight { float: right; } 

th.alignLeft { text-align: left; }

.clear { clear: both; height: 2px; }

.hidden, .hide { display: none; }

/*-------------------------- Typography  ---------------------------------------------------------------- */
body { font-family: helvetica,verdana,sans-serif; }
legend { border-bottom: 1px solid #AAA; font-size: 137%; font-weight: normal; margin: 1em 0; font-family: georgia, serif; text-transform: capitalize; }
textarea, input, select { font: 13px Verdana, Arial, Helvetica, sans-serif; }
input, select, textarea { border: 1px solid #AAA; background: #FCFCEC; color: #333 }
label { font-weight: bold; }
h1 { display: block; font-size: 200%; font-weight: bold; margin: .67em 0; }
h2 { display: block; font-size: 150%; font-weight: bold; margin: .83em 0; }
h3 { display: block; font-size: 117%; font-weight: normal; margin: 1em 0; font-family: georgia, serif; }
h4 { display: block; font-weight: normal; margin: 1.33em 0; font-family: georgia, serif; }
h5 { display: block; font-size: 83%; font-weight: bold; margin: 1.67em 0; } 
a:link, a:visited { text-decoration:none; color: #006; }
a:hover, a:focus, a:active { text-decoration:underline; color: #E33; }
a { text-decoration: none; color: #33F; }
table 	{ font-size: 93%;}
th { font-weight: bold; }
caption   {  font-weight: bold; font-size: 1.1em; }

/* Divs */
#adminContent { padding: 20px; }
#topFrame { font-size: 1.2em;  }
#loginbox { font-size: 9pt; }
#loginbox h2 { font-size: 18pt; }
#loginformbox input { font-size: 1.3em; }
#loginformbox label { font-size: 1.1em; }
#message  { text-align: center; }
#notice { color: #333; font-size: 1.2em; }

/* Classes */
.heading   { color: #FDFDFD; font-weight: bold; font-size: 1.1em; letter-spacing:.2em; text-transform: uppercase; }
.title { font-weight: bold; color: #900; }
.editTitle, .edit h3 { font-variant: normal; font-weight: normal; }
.question { color: #FFF; }
.help { color: #fffeeb; }
a.helpToggle { font-weight: bold; font-size: .8em; }
.error, .warning { color: #333; font-weight: bold; }
table.results input[type=text], table.edit input[type=text], table.results textarea, table.edit textarea { font-size: .9em; } 
a.red { color: #E33; }
.red { color: #E33; }
.selected { font-weight: bold; text-transform: uppercase; text-decoration: underline; color: #F33; }
.ref { text-transform: uppercase; font-size: .7em; }
.problem, accepted { color: #FFF; }
.uploaded, .ready, .submitted, .vetted, .sent, .accepted { font-weight: bold; }

/*-------------------------- Positioning  ---------------------------------------------------------------- */
fieldset { margin: 8px; padding: 0px 10px 10px 10px; border: 0; }
legend { padding: 4px; margin-bottom: 8px;}
table 	{ border-collapse: separate; empty-cells: show; }
td, th 	{ padding: 4px; }
caption   { margin-top: 20px; text-align: center; }

/* DIVS */
#content { padding: 12px; }
#logout { float: right; }
#betaFeedback { display: block; float: left; }
#topLinks a { display: block; float: left; margin: 0 20px 0 0; }

#bottomFrame { text-align: center; background-color: #F3F3F3; }

#loginbox { background: url(/images/40-yellow-fade.gif) #FFFFF9; background-repeat: repeat-x;  position: relative ;margin: 5em auto 1em; padding: 20px 0 0; width: 495px; border: 1px solid #AAA; background-color: #FFF; padding: 4px;}
#loginbox h2 { margin: 20px 0px 6px 10px; display: none;}

#loginformbox { margin: 18px; padding: 60px 8px 8px 8px; border: 1px solid #EEE;  background: url(/images/A-1600x100.gif) ; background-repeat: no-repeat; background-position: -250px 10px; }
#loginformbox input { border: 1px solid #AAA; overflow: visible; }
#loginformbox label { display: block; margin: 10px 0px; }

#default { margin: 10px; }
#dontWorry { width: 250px; }

#message { position: absolute; z-index: 999; float: left; margin: 10px; padding: 9px; text-align: center; border-bottom-width: 1px; border-bottom-style: solid; border-top-width: 1px; border-top-style: solid; }
#notice { float: right; padding: 8px; margin: 0px; background-color: #FFF9AA; border-top: 1px solid #E7DF00; border-bottom: 1px solid #E7DF00; } 

#options { width: 400px; }

#backgrounds th { font-size: 80%; text-align: right; background-color: #EEE; }
#backgrounds td { font-size: 80%; }

#list li { display: block; margin: 0px; text-align: center; }

#images { padding: 100px; }

#cdForm { width: 600px; border: 1px solid #AAA; margin: 10px; padding: 10px; }
#cdForm table { padding: 10px; margin: 10px; }
#cdForm th { text-align: right; margin: 10px; }
#cdForm td { margin: 10px; border: 1px solid #AAA; width: 400px;}
#cdForm pre { background-color: #FFF; border: 1px solid #AAA; padding: 10px; font-size: 1.2em; }

#templateChooser li { display: inline; float: left; padding: 0 20px 20px 0; }

#otrs b {font-size: 1.3em; }
#otrs ul { margin: 5px 0 10px 10px; }
#otrs li { margin: 2px 0 ; }

/*
CLASSES
*/

.heading   { padding: 0px; border-top: 1px solid #333; border-right: none; border-left: none; border-bottom: 1px solid #333; text-align: center; background-color: #A2A3B1; }

.edit { border: 1px solid #DDD; background: url(/images/40-yellow-fade.gif) #FFFFF9; background-repeat: repeat-x; margin: 10px 0px; padding: 10px; } 
.edit table { width: 100%; }
.edit table th, .edit th { text-align: right; padding: 4px; }
.edit table.results th { text-align: left; }

.editTitle, .edit h3 { border-bottom: 1px solid #AAA; text-align: left; }
.submitRow { text-align: right; }
.edit table td { padding: 4px; }

.helppage { background: #FFE; padding: 2px 8px 2px 8px; border: 1px solid #CCC; }
.helppage h3 { margin: 0px; }
.helppage li { list-style: disc; margin: 4px 4px 4px 12px; }

.question { background: url(/images/misc/question_mark.gif) no-repeat; padding: 1px 5px 1px 5px;}

.help { margin-top: 10px; padding: 9px; border-bottom-width: 1px; border-bottom-style: solid; border-top-width: 1px; border-top-style: solid; background-color: #fffeeb; border-bottom-color: #ccc; border-top-color: #ccc; color: #555;}
.help h3 { margin-top: 0px; }
.help img { border: 1px solid #AAA; float: left; }
.helpToggle { display: block; margin: 0 10px 10px 0px; }
.column ul, .help ul { margin: 8px; }
.column li, .help li { list-style: disc; margin: 4px 0px 4px 16px; }
.manageThumbnail { float: left; width: 30px; margin-right: 40px; }

.error, .warning { background: #ffd; border: 1px solid #c66; padding: 10px; margin: 10px 0; }

.stats td, .stats th, .results td, .results th { vertical-align: top; padding: 4px 2px;}

img.remaining { border: 1px solid #AAA; border-left: 0px; } 
img.used { border: 1px solid #AAA; border-right: 0px; }
img.thumbnail { margin: 4px; float: left; clear: left; border: 1px solid #AAA; }
img.tinythumbnail { vertical-align: middle; border: none; margin: 4px; }
img.largethumbnail { margin: 4px 20px 4px 20px; float: right; border: 1px solid #AAA; }
img.sidebarthumbnail { margin: 4px; border: 1px solid #AAA; }

div.centered { text-align: center; }
div.centered table { margin: 0 auto; text-align: left; } 
td.centered, th.centered { text-align: center; }

ul.normal { margin: 20px; }
.normal li { list-style: square; } 
.roman li { list-style: upper-roman; } 

.dragClass { background: #FCC; color: #FFF; }

tr.selected td, td.selected { background-color: #FAA; }

.inline li { display: inline; padding-right: 10px; }

.colorEdit { padding: 0px 4px 0px 4px; margin: 2px; }

ul.style { margin: 20px; }
.style li { display: inline; padding: 10px; margin:  10px; }

.arrow ul { list-style: none; } 
.arrow li { padding-left: 20px; background-image: url(/images/misc/arrow-10-red.gif); background-repeat: no-repeat; background-position: left center; display: list-item; }

.submitArrow { border: 0; vertical-align: middle }

.problem { background-color: #CC0000; padding: 10px; }
.uploaded { background-color: #EEEEEE; padding: 10px; }
.ready { background-color: #FCC364; padding: 10px; }
.submitted { background-color: #BFFF48; padding: 10px; }
.vetted { background-color: #72FF43; padding: 10px; }
.sent { background-color: #46CA00; padding: 10px; }
.accepted { background-color: #006F0E; padding: 10px; }

/* Pagination */
.pagination { clear: left; text-align: right; margin: 0px; font-size: 1.3em; }
.pagination ul { margin: 10px; }
.pagination li { display: inline; margin: .2em;}
.pagination li a { padding: .2em .6em; border: 1px solid #CCC; } 
.pagination li a:hover { background-color: #CCC; color: #FFF; } 
li.current a { color: #333; border: 0; font-weight: bold; }


.stats, .results { border-width: 1px; border-style: solid; border-collapse: collapse; clear: both; margin: 0; }
.stats a, .results a { text-decoration: none; } 
.stats td, .stats th, .results td, .results th { border-bottom-width: 1px; border-bottom-style: solid; font-size: 85%; vertical-align: text-top; }
.stats td, .results td { padding: 7px 15px 9px 10px; vertical-align: top; } 
.stats th, .results th { padding: 9px 15px 6px 10px; text-align: left; line-height: 1.3em; }
.stats th input, .results th input { margin: 0 0 0 8px; padding: 0; } 


/* Stupid internet explorer
*/
.checkbox { border: none; background: none; }
.radio { border: none; background: none; }

/*-------------------------- Special Elements  ---------------------------------------------------------------- */

/* Order Form */
.box { padding: 4px; width: 540px; margin-bottom: 10px; background: #FCFCFC; border: 1px solid #CCC }
.box h2 { margin: 0px; background: #FAFAFA; border-bottom: 1px solid #CCC; }
.box ul { list-style: none; }
.box li { padding-left: 20px; background-image: url(/images/misc/arrow-10-red.gif); background-repeat: no-repeat; background-position: left center; display: list-item; }
.box table { padding: 0px; background: #FFF; border: #CCC; }
.box th { color: #F00; } 

#sortable-tbl tr.nodrag, #sortable-tbl  tr.nodrag td { background: #eee; }

/* Tool Tip */
#tooltip { position: absolute; z-index: 3000; border: 1px solid #111; background-color: #333; color: #FFF; padding: 8px; }
#tooltip h3, #tooltip div { margin: 0; }


.colorwell { border: 1px solid #ccc; width: 6em; text-align: center; cursor: pointer; }
body .colorwell-selected { border: 1px solid #000; font-weight: bold; } 

/*
 SIMPLE STYLE CHOOSER
 */

#TEST { text-align: center; width: 200px; }
#TEST_BODY { padding: 10px; }
#TEST_IMAGE { margin: 10px; border: 1px solid #000; } 
#TEST_CONTENT { border: 1px solid #000; } 

/*
 * Style Chooser
 */



.styleChooser li { list-style: none; float: left; margin: 10px; font-size: .7em; }
.styleChooser li.selected { border: 1px solid #f00; }
.styleChooser li input { margin: 5px; }
.styleChooser img { margin: 14px 2px; }
.styleChooserBackground { width: 200px; padding: 10px; text-align: center; border: 1px solid #eee; }
.styleChooserTitle { font-size: 1.5em; padding: 10px; }


#head a, #mainLinks a, #submenu a, #settingsLinks a, #taglist a, #catlist a { text-decoration: none; }

#head #viewSite {}
#head #viewSite a {
	font-size: 16px; margin: 6px 3px; display: inline; 
}

#head h1 {
	font: normal 36px Georgia, "Times New Roman", Times, serif;
	padding: 11px 170px 16px 12px;
	margin: 0;
	margin-right: 15%;
}


/* menu stuff */
#topBar { background: #333; color: #aaa; padding: 8px; margin: 0; text-align: right; }
#topBar a { color: #eee; text-decoration: underline; }
#auxilaryLinks ul { margin: 0; padding: 0; }
#auxilaryLinks li { font-size: .9em; text-transform: lowercase; display: inline; margin-left: 1em; padding-left: 1em; border-left: 1px solid #aaa; }

#mainLinks {
	margin: 0;
	list-style: none;
	padding-left: 11px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
}

#mainLinks a {
	font-size: 123.1%;
	padding: 5px 7px;
	line-height: 30px;
}

#mainLinks a.current, #settingsLinks a.current {
	font-weight: normal;
	padding-left: 6px;
	padding-right: 6px;
	-moz-border-radius-topleft: 4px;
	-khtml-border-top-left-radius: 4px;
	-webkit-border-top-left-radius: 4px;
	border-top-left-radius: 4px;
	-moz-border-radius-topright: 4px;
	-khtml-border-top-right-radius: 4px;
	-webkit-border-top-right-radius: 4px;
	border-top-right-radius: 4px;
	border-width: 1px;
	border-style: solid;
}

#mainLinks a.current {
	border-bottom-width: 2px;
}

#settingsLinks { margin: -30px 15px 0 315px; list-style: none; position: relative; float: right; padding-left: 10px; font-size: 93%; }
#settingsLinks a { padding: 0 7px; display: block; float: left; line-height: 28px; border-top-width: 1px; border-top-style: solid; border-bottom-width: 1px; border-bottom-style: solid; }

#mainLinks li,  #settingsLinks li { display: inline; line-height: 200%; list-style: none; text-align: center; white-space: nowrap; margin: 0; padding: 0; }

#mainLinks li a .count-0, #settingsLinks li a .count-0 { display: none; }

/* content */

#rightcolumn { position: absolute; width: 45%; margin-left: 48%; z-index: 15; } 

#leftcolumn { position: absolute; width: 45%; z-index: 10; } 
.column h3 { margin: 20px 0px 10px 0px; padding: 0 0 4px 0;  color: #333; border-bottom: 1px solid #AAA; width: 100%; font-size: 140%; }
.column h3 img { display: none; float: left; margin-right: 8px; } 

.submit{
	margin: 10px 0;
	padding: 3px 5px;
	font-size: 138.5%;
	line-height: 1.5em;
}

.smallsubmit {	padding: 2px 3px;
	font-size: 93%;
	line-height: 1.3em;
}
	
.submit, .smallsubmit {
	border-width: 1px;
	border-style: solid;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	cursor: pointer;
	text-decoration: none;	
	text-align: center;
	font-weight: bold;
	background: url(/images/40-fade.gif);
	background-repeat: repeat-x;
	overflow: visible;
} 

a.actionLink { border-bottom: 1px solid; font-weight: bold;}


#newPage form { margin: 0 0 10px 0; display: block; }
#newPage li { float: left;  margin: 0; text-align: right; padding-right: 20px; }
#newPage ul { margin: 0; padding: 0; }