*
{
	margin		: 0;
	padding		: 0;
}
html, body
{
	margin		: 0;
	padding		: 0;
	font		: 11px/14px 'Lucida Grande', 'Lucida Sans Regular', Arial, Helvetica, sans-serif;
	color		: #666;
	
	/*background	: #016ba1;  library.css */
}
body { padding-bottom: 20px; }

a, img, table, td { border: 0; }
td { vertical-align: top; }
th { text-align: left; }

a
{ 
	text-decoration	: none; 
	color			: #346aa1;
	outline			: 0;
}
a:hover { }




a.button
{
	display				: block;
	background-position	: center center;
	background-repeat	: no-repeat;
	text-indent			: -9999px;
	
	outline				: none;
}
/*a:hover.button { background-position: top left; }*/

a.button.jumbo
{
	width				: 266px;
	height				: 44px;
	text-indent			: 0;
	text-align			: center;
	font-size			: 24px;
	line-height			: 44px;
	color				: #FFF;
	background-image	: url(http://assets.wonderfile.com/images/button_jumbo_bg.png);
}

.button.accept		{ background-image: url(http://assets.wonderfile.com/images/icon_accept.png); }
.button.edit 		{ background-image: url(http://assets.wonderfile.com/images/icon_edit.png); }
.button.mark 		{ background-image: url(http://assets.wonderfile.com/images/icon_mark.png); }
.button.unmark 		{ background-image: url(http://assets.wonderfile.com/images/icon_unmark.png); }
.button.delete 		{ background-image: url(http://assets.wonderfile.com/images/icon_delete.png); }
.button.add 		{ background-image: url(http://assets.wonderfile.com/images/icon_add.png); }
.button.watch		{ background-image: url(http://assets.wonderfile.com/images/icon_watch.png); }
.button.share		{ background-image: url(http://assets.wonderfile.com/images/add.png); }
.button.cancel		{ background-image: url(http://assets.wonderfile.com/images/icon_cancel.png); }
.button.remove		{ background-image: url(http://assets.wonderfile.com/images/icon_remove.png); }
.button.download	{ background-image: url(http://assets.wonderfile.com/images/icon_download.png); }

/* default dimensions for icon buttons, overwritten as needed */
.button.accept,	
.button.edit, 
.button.mark, 
.button.unmark, 
.button.delete, 
.button.add, 
.button.watch, 
.button.cancel, 
.button.remove, 
.button.download
{
	width	: 18px;
	height	: 18px;
}


h1
{ 
	font-size		: 24px;
	line-height		: 28px;
	color			: #4d4d4d;
	font-weight		: normal;
}

h2
{ 
	font-size		: 16px;
	color			: #000;
	font-weight		: bold;
	margin-bottom	: 10px;
}
a:hover h2 { text-decoration: underline; }


h3 
{ 
	font-size		: 12px;
	font-weight		: bold;
	color			: #515151;
	text-transform	: uppercase;
}

h4 /* upload-steps 'Select File' etc */
{
	font-size	: 15px;
	font-weight	: normal;
	color		: #333;
}

h5 /* file-view-shares OPTIONAL etc */
{
	text-transform	: uppercase;
	font-size		: 10px;
	color			: #484848;
	margin			: 0 0 8px 0;
}

p { margin: 6px 0; }

em
{
	font-style		: normal;
	font-weight		: bold;
	border-bottom	: #666 1px dotted;
}

.tip 
{ 
	font-size	: 9px;
	font-style	: italic;
	color		: #8a8c79;
}

#message
{
	font-size	: 11px;
	padding		: 10px 25px 10px 45px;
	margin		: 5px 0;
}
#message strong 
{
	font-weight	: bold;
	color		: #000;
	font-size	: 12px;
}
#message span { padding: 0 10px; }
#message a { text-transform: uppercase; }
#message a:hover { text-decoration: underline; }
#message.error
{
	background	: #faf6f6 url(http://assets.wonderfile.com/images/icon_error.png) 15px center no-repeat;
	color		: #921622;
	border		: #dcc2c2 1px solid;
}
#message.confirm
{
	background	: #fcfcf2 url(http://assets.wonderfile.com/images/icon_confirm.png) 15px center no-repeat;
	color		: #564f2f;
	border		: #d5d5c6 1px solid;
}
#main-files #message.confirm { padding-top: 25px; padding-bottom: 25px; }

#message.success
{
	background	: #eefde4 url(http://assets.wonderfile.com/images/icon_success.png) 15px center no-repeat;
	color		: #425834;
	border		: #c1ceb8 1px solid;
}


.divider
{
	height		: 1px;
	font-size	: 1px;
	background	: #c2c2c2;
	margin		: 8px 0;
}





/* -------------------------------------------------------------- form, input */

select option { padding-right: 10px; }
input[type='text'], input[type='password'], textarea
{
	font	: 12px 'Lucida Grande', 'Lucida Sans Regular', Arial, Helvetica, sans-serif;
	color	: #000;
	padding	: 2px;
}
input[type='submit'], input[type='button']
{
	width			: 84px;
	height			: 19px;
	background		: url(http://assets.wonderfile.com/images/button_bg.png) center center no-repeat;
	text-align		: center;
	font-size		: 10px;
	line-height		: 19px;
	color			: #FFF;
	border			: 0;
	padding-bottom	: 3px; 
	margin			: 5px 0;
	outline			: none;
}
input[type='submit'].disabled { background-image: url(http://assets.wonderfile.com/images/button_disabled_bg.png); }

input[type='submit'].big, input[type='button'].big /* Start Upload button */
{
	width			: 128px;
	height			: 26px;
	padding-bottom	: 4px;
	background		: url(http://assets.wonderfile.com/images/button_big_bg.png) center center no-repeat;
	font-size		: 14px;
	text-align		: center;
}

input.inactive, textarea.inactive { color: #a5a5a5; }

form fieldset
{
	margin	: 20px 0;
	border	: 0;
}
form ul { list-style: none; }
form ul li { margin-bottom: 8px; }
form ul label
{
	display		: block;
	float		: left;
	width		: 120px;
	line-height	: 25px; /* vertical alignment, may need to be overwritten */
}





.container
{
	width		: 980px;
	margin		: 0 auto;
	position	: relative;
}

/* -------------------------------------------------------------- demo-bar */

#demo-bar
{
	height			: 30px;
	background		: #666;
	color			: #FFF;	
	text-align		: center;
}

#demo-bar h1
{
	color			: #CCC;
	font-size		: 16px;	
}

#demo-bar a
{
	color			: #FFFFFF;	
}

/* -------------------------------------------------------------- user-bar */

#user-bar
{
	height			: 20px;
	border-top		: #FFF 1px solid;
	color			: #e0e0de;
	background		: transparent url(http://assets.wonderfile.com/images/user-bar.png) top left repeat-x;
	border-bottom	: #CCC 3px solid;
}
#user-nav 
{ 
	list-style	: none;
	float		: right; 
	line-height	: 19px;
}
#user-nav strong 
{ 
	color	: #FFF; 
	padding	: 0 8px;
	float	: left;
}

#user-nav li 
{ 
	display		: block; 
	float		: left; 
	
}
#user-nav a 
{ 
	color			: #e0e0de; 
	padding			: 0 8px;
	font-size		: 10px;
	border-left		: #000 1px solid;
}

#user-nav a:hover 
{ 
	color			: #FFF; 
	text-decoration	: underline;
}

a#user-nav-help
{
	display		: block;
	width		: 47px;
	height		: 23px;
	padding		: 0;
	text-align	: center;
	line-height	: 24px;
	color		: #333;
	background	: url(http://assets.wonderfile.com/images/user-nav-help.png) bottom left no-repeat;
	border		: 0;
	position	: relative;
}
a:hover#user-nav-help 
{ 
	color			: #000; 
	background		: #FFF; 
	text-decoration	: none;
}

.dark #user-nav a, 
.dark #user-nav a:hover, 
.dark #user-nav strong,
.dark a#user-nav-help, 
.dark a:hover#user-nav-help
{ color: #333; }

/* -------------------------------------------------------------- library-head */

#library-head
{
	clear		: both;
	width		: 100%;
	float		: left;
	min-height	: 80px;
	background	: #FFF;
	position	: relative;
	z-index		: 1000;
}
#library-info 
{ 
	position	: relative;
	left		: 4px;
	top			: 30px;
	z-index		: 1000;
}
#library-info h1 
{ 
	float			: left;
	border-bottom	: #cecece 1px solid;
	padding-right	: 30px;
	text-transform	: uppercase;
	height			: 28px;
	position		: relative;
	z-index			: 1000;
}


#library-actions 
{ 
	list-style		: none; 
	float			: left;
	padding-left	: 12px;
	line-height		: 28px;
}
#library-actions li 
{ 
	display			: inline;
	padding-right	: 10px;
}
#library-actions a
{
	font-size		: 9px;
	text-transform	: uppercase;
	color			: #999;
}
#library-actions a:hover { color: #000; }


a#library-action
{
	display			: block;
	width			: 22px;
	height			: 23px;
	margin			: 5px 0 0 10px;
	border-left		: #cecece 1px solid;
	border-right	: #cecece 1px solid;
	background		: url(http://assets.wonderfile.com/images/library-action_bg_2.png) bottom center no-repeat;
	position		: absolute;	
	cursor			: pointer;
	right			: 0px;
	bottom			: 0px;
}
a:hover#library-action, a.selected#library-action { background-position: top center; }

#library-logo 
{ 
	float	: right; 
	padding	: 25px 12px 0px 10px;
}




/* -------------------------------------------------------------- library-switcher */

#library-switcher
{
	width			: 583px;
	position		: absolute;
	background		: url(http://assets.wonderfile.com/images/library-switcher_bottom.png) bottom center no-repeat;
	z-index			: 1000;
	left			: 0px;
	top				: 28px;
	border-top		: #cecece 1px solid;
	padding-bottom	: 10px;
}
#library-switcher .content 
{
	padding		: 10px;
	background	: url(http://assets.wonderfile.com/images/library-switcher_bg.png) top center repeat-y;
}

#library-switcher h3
{
	height			: 19px;
	background		: #747474 url(http://assets.wonderfile.com/images/pill_left.gif) center left no-repeat;
	line-height		: 19px;
	color			: #FFF;
	text-transform	: uppercase;
	padding-left	: 8px;
	margin-bottom	: 4px;
}
#library-switcher h3 div
{
	padding-right	: 8px;
	background		: url(http://assets.wonderfile.com/images/pill_right.gif) center right no-repeat;					
}
				
#library-switcher h4
{
	margin			: 4px 0 5px 8px;
	font-size		: 9px;
	letter-spacing	: 0.5px;
	text-transform	: uppercase;
	font-weight		: bold;
	color			: #016ba1;
}
#library-switcher ul 
{
	margin		: 5px 0 0 0;
	padding		: 5px 8px;
	list-style	: none;
	height		: 200px; 
	overflow-x	: hidden;
	overflow-y	: auto;
}
 
#library-switcher ul li { margin:0; padding: 0; margin-bottom: 4px; }
#library-switcher ul li a { color: #333; }
#library-switcher ul li a:hover { text-decoration: underline; }
#library-switcher input.button
{
	display	: block;
	margin	: 10px auto;
}

#library-switcher td.divider
{
	margin		: 0;
	padding		: 0;
	width		: 14px;
	background	: #FFF url(http://assets.wonderfile.com/images/dots_bg_vertical.gif) top center repeat-y;
}

#library-switcher-yours, #library-switcher-shared, #library-switcher-management
{
	background	: #016ba1 url(http://assets.wonderfile.com/images/overlay_white_90.png);
}
#library-switcher-yours, #library-switcher-shared { width: 180px; }


/* -------------------------------------------------------------- main-nav */

#main-nav 
{
	clear			: both;
	height			: 30px;
	background		: #FFF;
	border-bottom	: #CCC 1px solid;
}
#main-nav ul 
{ 
	list-style: none; 
	position	: relative;
	bottom		: -1px;
}
#main-nav ul li 
{ 
	display	: block; 
	float	: left;
}
#main-nav ul li a
{
	display				: block;
	float				: left;
	width				: 140px;
	height				: 30px;
	font-size			: 14px;
	color				: #333;
	text-transform		: uppercase;
	text-align			: center;
	line-height			: 30px;
	outline				: none;
	cursor				: pointer
	
}
#main-nav ul li span { display: block; }
#main-nav ul li div { background: url(http://assets.wonderfile.com/images/main-nav_item.png) top center no-repeat; }

#main-nav ul li a:hover { color: #000; }

#main-nav ul li a:hover span { background: url(http://assets.wonderfile.com/images/overlay_white_50.png); }
#main-nav ul li a:active span { background: url(http://assets.wonderfile.com/images/overlay_white_80.png); }
#main-nav ul li a.selected 
{ 
	background-color	: transparent;
	background-image	: url(http://assets.wonderfile.com/images/main-nav_item_selected.png);
	color				: #000; 
}




/* -------------------------------------------------------------- sub-nav */

#sub-nav 
{
	height			: 32px;
	background		: url(http://assets.wonderfile.com/images/sub-nav_bg.png) bottom left repeat-x;
}
#sub-nav ul 
{ 
	list-style	: none; 
	padding-top	: 6px;
}
#sub-nav ul li { display: inline; }

#sub-nav ul li a
{
	display			: block;
	height			: 17px;
	float			: left;
	font-size		: 12px;
	line-height		: 17px;
	color			: #666;
	margin-left		: 10px;
	cursor			: pointer;
}
#sub-nav ul li a span
{ 
	display			: block;
	float			: left;
	padding-left	: 12px;
}
#sub-nav ul li a div
{ 
	display		: block;
	float		: left;
	width		: 12px;
	height		: 100%;
	font-size	: 0px;
}

#sub-nav ul li a:hover { color: #333; }
#sub-nav ul li a:hover span { background: url(http://assets.wonderfile.com/images/sub-nav_item_over.png) center left no-repeat; } 
#sub-nav ul li a:hover div { background: url(http://assets.wonderfile.com/images/sub-nav_item_over.png) center right no-repeat; }

/* selected */
#sub-nav ul li a.selected
{
	color		: #FFF;
}
#sub-nav ul li a.selected span { background: url(http://assets.wonderfile.com/images/sub-nav_item_selected.png) center left no-repeat; } 
#sub-nav ul li a.selected div { background: url(http://assets.wonderfile.com/images/sub-nav_item_selected.png) center right no-repeat; }






#main 
{ 
	width		: 100%;
	clear		: both;
	float		: left;
	padding		: 10px 0 30px 0;
	background	: url(http://assets.wonderfile.com/images/main_bg.png);
}






#search 
{
	width			: 296px;
	float			: left;
	margin-right	: 3px;
	padding-top		: 28px;
}
/* -------------------------------------------------------------- search-panel */
.search-panel
{
	width		: 100%;
	font-size	: 10px;
	color		: #535353;
	position	: relative;
}
.search-panel .top 		
{ 
	background	: url(http://assets.wonderfile.com/images/search-panel_top.png) top center no-repeat; 
	height		: 12px;
}
.search-panel .content	{ background: url(http://assets.wonderfile.com/images/search-panel_bg.png) top center repeat-y; }
.search-panel .bottom 	
{ 
	background	: url(http://assets.wonderfile.com/images/search-panel_bottom.png) bottom center no-repeat; 
	height		: 12px;
}

.search-panel h4
{
	width			: 100%;
	height			: 20px;
	font-size		: 10px;
	letter-spacing	: 1px;
	text-transform	: uppercase;
	font-weight		: bold;
	color			: #666;
}
				
			
				
/* CATEGORIES & TAGS */
#search-tags .content { padding: 0 6px; }
#search-tags h4 { text-indent: 5px; }

#search-tags a.button.edit
{
	width				: 14px;
	height				: 14px;
	position			: absolute;
	top					: 11px;
	right				: 12px;
}

.tags-checkbox	{ width: 45px; }
.tags-name 	{ width: 285px; }
.tags-name input { width: 250px; }
.tags-count	{ width: 50px; }
.tags-creator	{ width: 135px; }
.tags-watch	{ width: 45px; }
.tags-edit, 
.tags-delete 	{ width: 35px; }
.tags-watch a,
.tags-edit a, 
.tags-delete a	{ margin: 5px auto 0 auto; }

/* -------------------------------------------------------------- tag-categories */
.tag-categories 
{ 
	border		: #c3c3c3 1px solid; 
	border-top	: 0;
}
.tag-category 
{ 
	clear		: both; 
	background	: #FFF url(http://assets.wonderfile.com/images/tag-category_bg.png) top left repeat-x;
}
.tag-category .divider { margin: 2px 0; }
.tag-category-create
{
	/*width		: 100%;*/
	border-top	: #c3c3c3 1px solid;
	/*float		: left;*/
	background	: #e5e7dd;
}
.tag-category-create div 
{
	padding	: 10px 0px 4px 10px;
	/*float	: left;*/ 
}
.tag-category-create input[type='text'] 
{ 
	float			: left; 
	width			: 165px;
	margin-right	: 6px;
}


.tag-category-head
{
	height		: 24px;
	border-top	: #c3c3c3 1px solid;
	position	: relative;
}
.tag-category-head a.tag-category-name
{
	font-size	: 12px;
	color		: #333;
	display		: block;
	height		: 24px;
	line-height	: 24px;	
	outline		: none;				
}
.tag-category-head a.button.add { display: none; }
a.tag-category-name span 
{ 
	display		: block;
	background	: url(http://assets.wonderfile.com/images/tag-category-name_arrow.png) 9px center no-repeat; 
	text-indent	: 22px;
}
.tag-category-head a:hover.tag-category-name	
{ 
	background	: url(http://assets.wonderfile.com/images/overlay_white_50.png);
	text-decoration: none;
	color		: #000;
}
.tag-category-head a:active.tag-category-name { background	: url(http://assets.wonderfile.com/images/overlay_white_80.png); }
.tag-category-head a.edit
{  
	position	: absolute;
	right		: 32px;
	top			: 4px;
	display		: none;
}
.tag-category-head a.accept
{  
	position	: absolute;
	right		: 32px;
	top			: 4px;
	display		: none;
}
.tag-category-head a.delete 
{  
	position	: absolute;
	right		: 10px;
	top			: 4px;
	display		: none;
}
.tag-category-head.selected a.edit, .tag-category-head.selected a.delete, .tag-category-head a.accept
{
	display		: block;	
}


/* tag cloud */
.tag-category-head.selected { background: none; }
.tag-category-head.selected a.tag-category-name, .tag-category-head.selected a:hover.tag-category-name
{  
	background	: transparent;
	color		: #000;
	width		: 255px;
}
.tag-category-head.selected a.button.add { display: block; }
.tag-category-head.selected a.tag-category-name span { background: url(http://assets.wonderfile.com/images/tag-category-name_arrow_selected.png) 6px center no-repeat; }
.tag-category-head a.button.add
{
	width		: 20px;
	height		: 18px;
	position	: absolute;
	top			: 3px;
	right		: 2px;
}



.tag-category ul 
{ 
	list-style	: none;  
	text-align	: center;
	padding		: 10px;
}
.tag-category ul li { display: inline;}
.tag-category ul li a 
{ 
	padding		: 0px 2px;
	line-height	: 23px;
	border		: rgba(255, 255, 255, 0) 1px solid;
	outline		: none;
}
.tag-category ul li a:hover 
{ 
	background	: #e5e7dd;
	color		: #333; 
}
.tag-category ul li a.selected 
{ 
	background	: #ffffcc; 
	border		: #dadaae 1px solid;
}

/* tags */
.tag1 { font-size: 10px; }
.tag2 { font-size: 12px; }
.tag3 { font-size: 14px; }
.tag4 { font-size: 16px; }
.tag5 { font-size: 18px; font-weight: bold; }






/* KEYWORD */
#search-keywords .content { padding: 0 13px; }
#search-keywords h4 { line-height: 25px; } /* vertically align headings */

#search-keywords #keyword-fields
{
	width		: 201px;
	height		: 23px;
	background	: url(http://assets.wonderfile.com/images/search-keyword_input.png) top left no-repeat;
}
#search-keywords #keyword-fields input[type='text']
{ 
	width		: 160px;
	margin		: 2px 0 0 5px;
	border		: 0;
}
#search-keywords #keyword-fields input[type='submit']
{
	width		: 22px;
	height		: 22px;
	margin		: 0;
	padding		: 0;
	border		: 0;
	background	: url(http://assets.wonderfile.com/images/search-keyword_submit.gif) center center no-repeat;
}
#search-keywords .top 	{ height: 12px; }
#search-keywords .bottom { height: 12px; }

#search-keywords #date-fields input 
{ 
	width		: 50px; 
	font-size	: 10px;
	margin		: 0 3px;
	text-align	: center;
}












/* -------------------------------------------------------------- main-files */
#main-files
{
	width	: 676px;
	float	: left;
}

#files-results 
{ 
	height		: 25px;
	line-height	: 25px;
	padding		: 0 10px; 
}
#files-results
{
	color		: #333;
	font-size	: 13px;
	position	: relative;
}

.pager
{ 
	position	: absolute;
	top			: 0px;
	right		: 0px;
	font-size	: 12px;
}
.pager p, .pager a 
{ 
	float	: left; 
	margin	: 0;
}
.pager input[type='text'] 
{ 
	width		: 24px; 
	text-align	: center;
	padding		: 1px;
}

a#results-previous, a#results-next
{
	width	: 18px; 
	height	: 14px;
	float	: left;
	margin	: 5px 8px 0 8px;
}

a#results-previous  { background-image: url(http://assets.wonderfile.com/images/results-previous.png); }
a#results-next		{ background-image: url(http://assets.wonderfile.com/images/results-next.png); }



#files-no-results { padding: 65px 45px; }






/* -------------------------------------------------------------- sort-bar */

.sort-bar
{ 
	width		: 100%;
	height		: 26px;
	line-height	: 26px;
	background	: url(http://assets.wonderfile.com/images/sort-bar.png) center right no-repeat;
	margin		: 5px 0 5px 2px;
	cursor		: default;
}
.sort-bar div:first-child { text-indent: 20px; }
.sort-bar label 
{ 
	width			: 28px;
	height			: 100%;
	margin-right	: 16px; 
	background		: url(http://assets.wonderfile.com/images/sort-bar.png) center left no-repeat;
}

.sort-bar label, .sort-bar div { float: left; }

.sort-bar, .sort-bar a
{
	font-size		: 9px;
	color			: #333;
	text-decoration	: none;
}
.sort-bar a:hover 
{
	color			: #000;
	text-decoration	: underline;
}
.sort-bar a.selected
{
	font-weight			: bold;
	color				: #000;
	padding-right		: 11px;
	background-position	: right 4px; 
	background-repeat	: no-repeat;
}
.sort-bar a.selected.ascending 	{ background-image: url(http://assets.wonderfile.com/images/sort_ascending.png); }
.sort-bar a.selected.descending	{ background-image: url(http://assets.wonderfile.com/images/sort_descending.png); }



/* sort-files sort-bar */
#sort-files { width: 670px; }
#files-check-all { margin: 5px 0 0 8px; }
#sort-files-type { width: 34px; }
#sort-files-name { width: 305px; }
#sort-files-size { width: 80px; }






	
/* -------------------------------------------------------------- file */

.file
{
	width		: 100%;
	clear		: both;
	position	: relative;
}
.file .top 
{ 
	width		: 100%;
	height		: 12px;
	font-size	: 0px;
	background	: url(http://assets.wonderfile.com/images/file_top.png) top center no-repeat;
}
.file .bottom
{
	width		: 100%;
	height		: 15px;
	font-size	: 0px;
	background	: url(http://assets.wonderfile.com/images/file_bottom.png) bottom center no-repeat;
}
.file-main { background: url(http://assets.wonderfile.com/images/file_bg.png) top center repeat-y; }


.file label.file-checkbox
{
	width		: 26px;
	height		: 32px;
	float		: left;
	margin		: 0 8px 0 4px;
	position	: relative;
}
.file label.file-checkbox input
{
	position	: absolute;
	top			: 7px;
	left		: 6px;
}

.file-name
{	
	width			: 305px;
	float			: left;
	display			: block;
	min-height		: 32px; /* icon height */
	padding-left	: 42px;
	background		: url(http://assets.wonderfile.com/images/file_default.png) top left no-repeat; /* TODO: create default file icon */
}
.file-name h2 
{
	margin		: 0;
	padding 	: 3px 0;
	font-weight	: normal;
}
.file-name input[type='text']
{
	font-size	: 16px;
	width		: 290px;
	font-weight	: bold;
	padding		: 3px;
	color		: #000;
}
div.file-name .file-tags { display: none; }


.file.ai	.file-name { background-image: url(http://assets.wonderfile.com/images/file_ai.png); }
.file.as	.file-name { background-image: url(http://assets.wonderfile.com/images/file_as.png); }
.file.word	.file-name { background-image: url(http://assets.wonderfile.com/images/file_doc.png); }
.file.docx	.file-name { background-image: url(http://assets.wonderfile.com/images/file_doc.png); }
.file.fla	.file-name { background-image: url(http://assets.wonderfile.com/images/file_fla.png); }
.file.gif	.file-name { background-image: url(http://assets.wonderfile.com/images/file_gif.png); }
.file.html	.file-name { background-image: url(http://assets.wonderfile.com/images/file_html.png); }
.file.mp3	.file-name { background-image: url(http://assets.wonderfile.com/images/file_mp3.png); }
.file.mpg	.file-name { background-image: url(http://assets.wonderfile.com/images/file_mpg.png); }
.file.psd	.file-name { background-image: url(http://assets.wonderfile.com/images/file_psd.psd); }
.file.png	.file-name { background-image: url(http://assets.wonderfile.com/images/file_png.png); }
.file.pdf	.file-name { background-image: url(http://assets.wonderfile.com/images/file_pdf.png); }
.file.py	.file-name { background-image: url(http://assets.wonderfile.com/images/file_py.png); }
.file.rtf	.file-name { background-image: url(http://assets.wonderfile.com/images/file_rtf.png); }
.file.swf	.file-name { background-image: url(http://assets.wonderfile.com/images/file_swf.png); }
.file.text	.file-name { background-image: url(http://assets.wonderfile.com/images/file_txt.png); }
.file.zip	.file-name { background-image: url(http://assets.wonderfile.com/images/file_zip.png); }
.file.jpg 	.file-name { background-image: url(http://assets.wonderfile.com/images/file_jpg.png); }
.file.png 	.file-name { background-image: url(http://assets.wonderfile.com/images/file_png.png); }
.file.tiff 	.file-name { background-image: url(http://assets.wonderfile.com/images/file_tiff.png); }
.file.xls 	.file-name { background-image: url(http://assets.wonderfile.com/images/file_xls.png); }
.file.xlsx 	.file-name { background-image: url(http://assets.wonderfile.com/images/file_xls.png); }
.file.powerpoint .file-name { background-image: url(http://assets.wonderfile.com/images/file_ppt.png); }

/* icons needed: */
.file.bmp 	.file-name { background-image: url(http://assets.wonderfile.com/images/file_bmp.png); }
.file.wav	.file-name { background-image: url(http://assets.wonderfile.com/images/file_wav.png); }

.file-tags
{
	font-size		: 9px;
	color			: #666;
	padding-bottom	: 5px;
}

.file-size 
{ 
	float		: left; 
	width		: 80px;
	padding-top	: 4px;
}
.file-date { padding-top: 4px; }



.file-actions
{ 
	list-style	: none; 
	position	: absolute;
	top			: 14px;
	right		: 18px;
}
.file-actions li { display: inline; }
.file-actions a.button
{
	display				: block;
	float				: left;
	width				: 20px;
	height				: 16px;
	margin				: 0 2px;
	background-position	: center center;
	background-repeat	: no-repeat;
}
.file-actions a.button.edit { margin-right: 4px; }






/* -------------------------------------------------------------- file-views */

.file-views
{ 
	clear			: both;
	width			: 100%;
	padding-bottom	: 10px;
}
.file-views-nav
{ 
	list-style		: none;
	float			: right;
	margin-right	: 15px;
}
.file-views-nav li { display: inline; }
.file-views-nav li a
{
	display		: block;
	float		: left;
	font-size	: 10px;
	padding		: 0 6px;
	color		: #999;
	border-left	: #d0d1ce 1px solid;
	height		: 18px;
	line-height	: 18px;
}
.file-views-nav li:first-child a { border: 0; }

.file-views-nav li a:hover { color: #4d4d4d; }
.file-views-nav li a.selected
{ 
	color		: #4d4d4d; 
	background	: #f5f6f1;
}


/* -------------------------------------------------------------- file-view */

.file-view
{
	clear			: both;
	margin			: 0 15px 0 42px;
}

.file-view h3
{
	height		: 25px;
	line-height	: 25px;
	padding		: 0 10px;
	background	: url(http://assets.wonderfile.com/images/file-view_heading_bg.gif);
	text-align	: right;
}
.file-view h3 span { float: left; }
.file-view h3 a
{
	text-transform	: none;
	font-size		: 10px;
	font-weight		: normal;
	text-decoration	: underline;
}
.file-view h3 a:hover 
{ 
	text-decoration	: none; 
	color			: #4d4d4d;
}

.file-view-preview, 
.file-view-plugins,
.file-view-tags,
.file-view-share,
.file-view-revisions,
.file-view-permissions,
.file-view-notes,
.file-view-history
{
	background		: #f5f6f1;
	border-bottom	: #cccccc 1px dotted;
}

.file-view .content 
{ 
	width		: 540px;
	padding		: 15px 0;
	margin-left	: 40px;
}

.file-view-close
{
	text-align	: right;
	padding-top	: 4px;
}
.file-view-close a { font-size: 9px; }
.file-view-close a:hover { color: #4d4d4d; }




/* .file-view form */

.file-view label
{
	font-size	: 12px;
	color		: #484848;
	line-height	: 28px;
}
.file-view p.tip { margin: 2px 0; }
.file-view input[type='text'], .file-view textarea
{
	border		: #a09f97 1px solid;
	background	: #FFF;
	padding		: 4px;
	margin		: 2px 0;
}

.file-view blockquote
{
	background	: #eae9e4;
	margin		: 5px 0;
	padding		: 10px 15px 15px 15px;
}

.file-view ol, .file-view ul { list-style: none; }

.file-view ol { padding: 15px 0; }
.file-view ol table { padding-left: 10px; }

.file-view li { border-bottom: #a3a3a1 1px solid; }
.file-view li.head
{
	font-size		: 10px;
	color			: #000;
	height			: 24px;
	line-height		: 24px;
	padding			: 0;
	background		: url(http://assets.wonderfile.com/images/file-view_list_head.png) top center no-repeat;
}

.file-view li a { text-decoration: underline; }
.file-view li.row
{ 
	display			: block; 
	padding			: 5px 0;
	color			: #666;
	text-decoration	: none;
}
.file-view li a:hover 
{ 
	color			: #333; 
	text-decoration	: none;
}

/* inline editing elements */
.row input[type='text']
{ 
	width		: 70px; 
	padding		: 2px;
	font-size	: 11px;
}



/* PREVIEW */



/* PLUGINS */



/* TAGS */
.file-view-tags .tag-categories
{
	max-height	: 300px;
	overflow	: auto;
	border-top	: #c3c3c3 1px solid;
}
.file-view-tags .tag-categories * a { text-decoration: none; }
.file-view-tags .tag-categories * li { border: 0; }


/* PERMISSIONS */
.permissions-people { width: 315px; }
.permissions-read	{ width: 50px; text-align: center; }
.permissions-revise	{ width: 50px; text-align: center; }
.permissions-share	{ width: 50px; text-align: center; }
.permissions-delete	{ width: 50px; text-align: center; }



/* SHARE */
.share-date 		{ width: 75px; }
.share-people		{ width: 175px; }
.share-expiration	{ width: 85px; }
.share-password		{ width: 130px; }
.share-password input[type='text'] { width: 100px; }
.share-actions		{ text-align: center; }
.share-actions .button
{
	width		: 14px;
	height		: 14px;
	float		: left;
	margin-left	: 9px;
}


/* REVISIONS */
.revisions-date		{ width: 75px; }
.revisions-people	{ width: 130px; }
.revisions-filename	{ width: 260px; }
.revisions-download 
{ 
	width		: 60px;
	text-align	: center;
}
.revisions-download a { margin: 0 auto; }
.head .revisions-download { background: none; }



/* NOTES */
.notes-date 	{ width: 75px; }
.notes-people	{ width: 115px; }
.notes-note		{ width: 280px; }
.notes-delete	
{ 
	width		: 45px; 
	text-align	: right; 
}
.notes-delete a 
{
	width	: 20px;
	height	: 11px;
	margin	: 2px 0 0 20px;
}


/* HISTORY */
.history-people 	{ width: 120px; }
.history-action 	{ width: 270px; padding-right: 10px; }
.history-date		{ width: 65px;}
.history-download	{ width: 60px; text-align: center; }
.history-download a	{ margin: 0 auto; }











/* -------------------------------------------------------------- main-panel */
/* rounded corner panel to appear withing #main div */
.main-panel { width: 718px; }
.main-panel .top
{
	height		: 10px;
	background	: url(http://assets.wonderfile.com/images/main-panel_top.png) top center no-repeat;
}
.main-panel .content 
{ 
	padding		: 10px 20px;
	background	: url(http://assets.wonderfile.com/images/main-panel_bg.png) top center repeat-y; 
}
.main-panel .bottom
{
	height		: 20px;
	background	: url(http://assets.wonderfile.com/images/main-panel_bottom.png) bottom center no-repeat;
}
.main-panel-head 
{ 
	position		: relative; 
	margin-bottom	: 15px;
}

.main-panel a:hover 
{ 
	color			: #333; 
	text-decoration	: underline;
}

.main-panel #message { margin: 5px 4px; }



/* General .main-panel table list styles */
table.list td { line-height: 26px; } /* vertical alignment */
.list input
{
	font-size	: 11px;
	padding		: 1px;
}




/* -------------------------------------------------------------- full-panel */
/* full width panel used in uploads screen */
.full-panel { width: 980px; }
.full-panel .top
{
	width		: 100%;
	height		: 10px;
	font-size	: 1px;
	line-height : 1px;
	padding		: 0px;
	margin		: 0px;
	background	: url(http://assets.wonderfile.com/images/full-panel_top.png) top center no-repeat;
}
.full-panel .content 
{ 
	padding		: 10px 20px;
	background	: url(http://assets.wonderfile.com/images/full-panel_bg.png) top center repeat-y; 
}
.full-panel .bottom
{
	height		: 20px;
	background	: url(http://assets.wonderfile.com/images/full-panel_bottom.png) bottom center no-repeat;
}








/* -------------------------------------------------------------- main-shares */
#main-shares { float: left; } /* width set on .main-panel */



#side-bar
{
	width	: 230px;
	float	: right;
	padding	: 5px 0;
}
#side-bar blockquote
{
	margin		: 8px 0 20px 0;
	font-size	: 13px;
	line-height	: 16px;
	color		: #333;
}

#side-bar div.callout { border: #CCC 1px solid; }


/* shares sort-bar */
#sort-shares-file		{ width: 285px; }
#sort-shares-url		{ width: 85px; }
#sort-shares-expiration	{ width: 80px; }
#sort-shares-password	{ width: 100px; }
#sort-shares-edit		{ width: 35px; }
#sort-shares-delete		{ width: 40px; }
#sort-shares-edit, #sort-shares-delete { text-align: center; }



.shares-checkbox	{ width: 46px;	}
.shares-file 		
{ 
	width		: 285px; 
	font-size	: 12px;
	font-weight	: bold;
	color		: #000;
}
.shares-url			{ width: 85px; }
.shares-url a		
{ 
	text-transform	: lowercase;
	font-size		: 10px;
}
.shares-url a:hover { text-decoration: underline; }

.shares-expiration	{ width: 80px; }
.shares-password	{ width: 100px; }
.shares-password 	{ width: 100px; } 
.shares-password input { width: 80px; }
.shares-edit		{ width: 35px; }
.shares-delete		{ width: 40px; }
.shares-edit a.button, .shares-delete a.button { margin: 5px auto 0 auto; }

#tag-share, #tag-watch
{
	border			: solid 1px #CCC;
	padding			: 10px 15px;
	margin-bottom	: 15px;	
	background		: #FFF;
}









#progress-bar
{
	height		: 25px;
	border		: #CCC 1px solid;
	background	: #FCFCFC;
}
#progress-bar-percent span
{
	color			: #FFF;
	font-size		: 14px;
	padding-right	: 12px;
}
#progress-bar-percent
{
	height		: 25px;
	text-align	: right;
	line-height	: 25px;
	background	: #016ba1 url(http://assets.wonderfile.com/images/progress-bar-percent_bg.png) bottom left repeat-x;
}



/* -------------------------------------------------------------- upload-steps */

/* general styles for upload-steps tables */
table.upload-steps { margin-top: 15px; }

.upload-steps thead
{
	height		: 40px;
	background	: #f5f6f1 url(http://assets.wonderfile.com/images/step_head.png) center left no-repeat;
}
.upload-steps h4
{
	height				: 40px;
	line-height			: 40px;
	padding-left		: 33px;
	background-position	: center left;
	background-repeat	: no-repeat;
}
.step1 h4 { background-image: url(http://assets.wonderfile.com/images/step1.png); margin-left: 15px; }
.step2 h4 { background-image: url(http://assets.wonderfile.com/images/step2.png); }
.step3 h4 { background-image: url(http://assets.wonderfile.com/images/step3.png); }
				
.upload-steps blockquote 
{ 
	margin-top	: 20px;
	padding		: 10px 15px;
	background	: #f5f6f1;
	border		: #eae9e4 1px solid;
}
.upload-steps blockquote table { padding: 5px 0; }	


/* step1 */
.upload-steps td.step1
{
	padding			: 20px 40px;
	padding-left	: 10px;
	padding-right	: 20px;
}


/* step2 */
.upload-steps td.step2 
{ 
	padding		: 20px 0 0 20px;
	border-left	: #CCC 1px dotted;
}
.upload-steps th.step2 h4 { margin-left: 40px; }
.upload-steps th.step2 h4 span { padding-left: 10px; }
.upload-steps th.step2 { background: #f5f6f1 url(http://assets.wonderfile.com/images/step_arrow.png) center left no-repeat; }


/* step3 */
.upload-steps th.step3
{ 
	width		: 180px; 
	background	: #f5f6f1 url(http://assets.wonderfile.com/images/step_arrow.png) center left no-repeat;
}

/* Start Upload */
.upload-steps th.step3 input { margin-left: 35px; }


/* -------------------------------------------------------------- upload-files */

/* step1 */
#upload-files th.step1 { width: 260px; }

/* step2 */
#upload-files th.step2  { width: 498px; }


/* -------------------------------------------------------------- upload-url */

/* step1 */
#upload-url th.step1 { width: 355px; }
#upload-url .step1 input[type='text'] { width: 220px; }

/* step2 */
#upload-url th.step2 { width: 400px; }


/* -------------------------------------------------------------- upload-content */

/* step1 */
#upload-content th.step1 { width: 455px; }
#upload-content th.step1 h4 { margin-left: 10px; }
#upload-content-editor 
{ 
	width	: 360px; 
	height	: 175px;
}

/* step2 */
#upload-content th.step2 { width: 300px; }









/* -------------------------------------------------------------- main-people */

#main-people { float: left; } /* width set on .main-panel */

/* shares sort-bar */
#sort-people-name		{ width: 285px; }
#sort-people-read		{ width: 45px; text-align: center; }
#sort-people-share		{ width: 45px; text-align: center; }
#sort-people-revise		{ width: 45px; text-align: center; }
#sort-people-write		{ width: 45px; text-align: center; }
#sort-people-administer	{ width: 60px; text-align: center; }
#sort-people-edit		{ width: 40px; text-align: center; }
#sort-people-remove		{ width: 50px; text-align: center; }



.people-checkbox { width: 46px;	}
.people-name		
{ 
	width		: 285px; 
	font-size	: 12px;
	font-weight	: bold;
	color		: #000;
}
.people-name a 
{ 
	font-size	: 12px;
	font-weight	: bold;
}
.people-read		{ width: 45px; text-align: center; }
.people-share		{ width: 45px; text-align: center; }
.people-revise		{ width: 45px; text-align: center; }
.people-write		{ width: 45px; text-align: center; }
.people-administer	{ width: 60px; text-align: center; }
.people-edit		{ width: 40px; text-align: center; }
.people-remove		{ width: 40px; text-align: center; }
.people-remove a	{ margin: 0 auto; }

.people-revise, .people-write, .people-administer { padding-top: 5px; }


#people-invite ol 
{
	list-style	: none;
	margin		: 10px 5px;
}
#people-invite input[type='text'] 
{ 
	margin-top	: 0px;
	width		: 215px; 
}
#people-invite ol li { margin-bottom: 3px; }
#people-invite input[type='checkbox'] { margin-right: 10px; }
#people-invite label 
{
	/*padding-left	: 10px;*/
	font-weight		: bold;
	color			: #333;
}
/* Read is checked and disabled by default, make the label look disabled too */
#people-invite ol li:first-child label { color: #999; }



/* -------------------------------------------------------------- footer */

#footer 
{ 
	clear		: both; 
	background	: url(http://assets.wonderfile.com/images/footer_bg.png) top left repeat-x;
	border-top	: #ccc 3px solid;
}
#footer #copyright
{
	height		: 32px;
	line-height	: 32px;
	text-align	: right;
	padding		: 0 15px;
	font-size	: 10px;
	color		: #ccc;
	background	: url(http://assets.wonderfile.com/images/copyright_bg.png) bottom center no-repeat;
}
#footer #copyright a { color: #CCC; }
#footer #copyright a:hover
{
	color			: #FFF;
	text-decoration	: underline;
}

#footer-callouts a:hover, #footer #copyright a:hover { color: #000; }


#footer-callouts 
{
	padding	: 6px 0; 
	color	: #FFF;
}
#footer-callouts .top
{
	height		: 15px;
	background	: url(http://assets.wonderfile.com/images/footer-callouts_top.png) top center no-repeat;
}
#footer-callouts .content
{
	padding		: 0 0 20px 40px;
	background	: url(http://assets.wonderfile.com/images/footer-callouts_bg.png) bottom center no-repeat;
}

#footer-callouts p
{ 
	font-size	: 12px; 
	margin		: 0 0 8px 0;
	font-weight	: bold;
}
#footer-callouts ul, #footer-callouts ol 
{ 
	margin		: 8px; 
	list-style	: none;
}
#footer-callouts li 
{ 
	margin-bottom	: 3px; 
	padding-left	: 10px;
	background		: url(http://assets.wonderfile.com/images/footer-callouts_list_item.png) 0 5px no-repeat;
}
#footer-callouts a { color: #CCC; }
#footer-callouts a:hover
{
	color			: #FFF;
	text-decoration	: underline;
}

#footer a#promo
{
	width				: 97px;
	height				: 95px;
	background-image	: url(http://assets.wonderfile.com/images/promo.png);
}


/* -------------------------------------------------------------- account-usage */

#account-usage p span 
{
	font-weight		: normal;
	text-transform	: lowercase;
	font-size		: 11px;
	color			: #c8c8c8;
	padding-left	: 10px;
}
#account-usage p span a { text-decoration: underline; }
#account-usage p span a:hover { text-decoration: none; }

#account-usage table { margin-top: 4px; }
#account-usage td { vertical-align: middle; }

.account-usage-graph
{
	width		: 130px;float:left;
	height		: 8px;
	border		: #CCC 1px solid;
	background	: #818181 url(http://assets.wonderfile.com/images/account-usage-graph_bg.png) bottom left repeat-x;
}
.account-usage-graph .percentage 
{ 
	height		: 100%; 
	background	: #FFF url(http://assets.wonderfile.com/images/account-usage-graph_percentage.png) bottom left repeat-x;
}

#account-usage-people 		.percentage { background-color: #c600df; }
#account-usage-libraries 	.percentage { background-color: #dfac00; }
#account-usage-storage 		.percentage { background-color: #b5df00; }
#account-usage-bandwidth	.percentage { background-color: #df0000; }




/* -------------------------------------------------------------- public-shares */

#sort-public-shares { margin-bottom: 0; }

#sort-public-shares label { width: 26px; }
#sort-public-shares-type { width: 75px; }
#sort-public-shares-file { width: 375px; }
#sort-public-shares-size { width: 70px; }
#sort-public-shares-date { width: 100px; }


#public-shares 
{ 
	list-style	: none; 
	clear		: both;
}
#public-shares table td { vertical-align: middle; }

.public-shares-checkbox { width: 42px; border-bottom: #CCC 1px dotted; }
.public-shares-type { width: 75px; border-bottom: #CCC 1px dotted; }
.public-shares-file 
{ 
	width		: 375px; 
	font-size	: 14px;
	font-weight	: bold;
	color		: #000;
}
.public-shares-size { width: 70px; border-bottom	: #CCC 1px dotted; }
.public-shares-date { width: 100px; border-bottom	: #CCC 1px dotted; }

#public-shares a 
{ 
	display			: block; 
	padding			: 10px 0;
	border-bottom	: #CCC 1px dotted;
	color			: #666; 
}
/*#public-shares a:hover { background: #f5f6f1; }*/
#public-shares a:hover .public-shares-file { text-decoration: underline; }


#overlay {
	position: absolute;
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	background-color: black;
	z-index:1001;
	-moz-opacity: 0.8;
	opacity:.80;
	filter: alpha(opacity=80);
}

#dataTableContainer { width: 100%; border-spacing:0; }

#dataTableContainer th
{
    text-align    : left;
    background    : none;
    padding		  : 10px;
}
#dataTableContainer caption
{
    font-size        : 16px;
    color            : #000;
    font-weight        : bold;
    margin-bottom    : 10px;
    text-align        : left;
}
td.yui-dt-col-name
{
    width        : 170px;
    font-weight  : bold;
    padding		 : 4px;
}
td.yui-dt-col-size
{
    font-size    : 9px;
    color        : #8a8c79;
	padding		 : 4px;
}
td.yui-dt-col-progress
{
	padding: 4px;	
}
tr.yui-dt-odd td
{
	background: #EFEFEF;	
}
.highlighted 
{
	background-color: #E8EEF7;
}
tr.alt { background-color: #F5F5F5; }