html { padding: 0px 0px 10px 0px; border: 0;  }

body
{ 
 padding: 0px 0px 10px 0px;
 border: 0;
 background-color:white;
 background-repeat:no-repeat;
 background-image:url('../img/tubejuke_bg.jpg');	
 font: normal 11px verdana, sans-serif;
 color: #333;
 line-height: 12px;
 margin:5px;
}

a { text-decoration: none; color: #202020; }
a:hover { text-decoration: underline; color: #202020; }

h1, h2, h3, h4, h5, h6 { font-family: verdana; }

.border_2px { border: 1px solid #D8D8D8; padding: 2px; background: #fff; }
.border_5px { border: 1px solid #D8D8D8; padding: 5px; background: #fff; margin: 0 0 4px 0; }

img { padding: 0; margin: 0; border: 0; }
form { padding: 0; margin: 0; }
.input { width: 85px; font-size: 9px; }
.submit { font-size: 9px; }

.sortList { cursor:move; width:100px; font-size:14px; }
.sortListHidden { width:100px; font-size:14px;visibility:hidden }

.listGroup1 { border:2px solid #dddddd; }
.listGroup2 { border:2px solid #dddddd; background-color:#eeeeee; }


div.workarea
{
	background:#E8E8E8;
	border:1px solid #AAA;
	margin:2px;
	padding:10px;
	position:absolute;
}

ul.draglist_alt { 
    position: relative;
    width: 350px; 
    height:300px;
    background: #f7f7f7;
    border: 1px solid gray;
    list-style: none;
    margin:0;
    padding:0;
}

ul.draglist_alt li {
    margin: 1px;
    cursor: move; 
}

ul.draglist { 
    position: relative;
    width: 300px; 
    list-style: none;
    background:#EEE;
    margin:0;
    padding:0;
    /*
       The bottom padding provides the cushion that makes the empty 
       list targetable.  Alternatively, we could leave the padding 
       off by default, adding it when we detect that the list is empty.
    */
    padding-bottom:40px;
}

ul.draglist li
{
    margin: 2px;
    cursor: move; 
	background-repeat:repeat-x;
	background-image:url('../img/tubejuke_button_bg.gif');    
}

li.list
{
    background-color: #F4F4F4;
    border: 1px solid #BBB;
    overflow: hidden;
    width: 293px;
    white-space: nowrap;
}