/**
 * Upload Progress UI styles
 */

#divUploadPageVeil /* dialog */
{
	width: 400px;
	height: 300px;
	margin-bottom: 20px; /* for vertical centering, due to dialog header */
}
#divUploadPageVeil div.upload-progress /* dialog main content */
{
	background-color: Transparent;
}

div.upload-progress-top
{
	position: relative;
	width: 1px;
	height: 1px;
	top: 0px;
	left: 0px;
}
div.upload-progress
{
	background-color: #FFFFFF;
	text-align: center;
	
	/* absolutely positioned within upload-progress-top */
	position: absolute;
}
.upload-progress table
{
	width: 100%;
	height: 100%;
}
.upload-progress .area-container
{
	/* use table for vertical centering */
	text-align: center;
	vertical-align: middle;
}
.upload-progress .area
{
	width: 100%;
}
.upload-progress td
{
	padding: 0px;
	text-align: center;
	vertical-align: middle;
}

/**
 * Text
 */
.upload-progress .status
{
    font-family: Arial, Verdana, Helvetica, Sans-Serif;
    color: #000000;
}
.upload-progress .status-text
{
    font-family: Arial, Verdana, Helvetica, Sans-Serif;
    color: #000000;
}
.upload-progress .label-text
{
    font-family: Arial, Verdana, Helvetica, Sans-Serif;
    color: #000000;
}
.upload-progress .bar-percent
{
    font-family: Arial, Verdana, Helvetica, Sans-Serif;
}


/**
 * Progress / process bars
 */
.upload-progress .bar-area
{
	/* bar */
	/* this seems necessary for IE to propertly hide the bars */
	position: relative;
}
.upload-progress .bar-container
{
	/* process bar */
	position: relative;
	overflow: hidden;
}
.upload-progress .bar-dot
{
	top: 2px;
	left: 2px;
	width: 14px;
	height: 14px;
	/* process bar */
	font-size: 1px;
	position: absolute;
}
.upload-progress .bar-filler
{
	/* progress bar */
	font-size: 1px;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 15%;
	height: 100%;
}
.upload-progress .bar-progress
{
	/* progress bar */
	font-size: 1px;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 10%;
	height: 100%;
}
.upload-progress .bar-percent
{
	font-weight: bold;
	font-size: 12px;
	line-height: 20px;
	/* progress bar */
	position: absolute;
	text-align: center;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
}


/** 
 * Waiting bar
 */
.upload-progress .waiting-bar-container
{
	/*background-color: #FFFFFF;*/
}

.upload-progress .waiting-bar-dot
{
	background-color: #2E3F91;
}


/** 
 * Progress bar
 */
.upload-progress .transfer-bar-container
{
	background-color: #DDDDDD;
	border: solid 1px black;
}

.upload-progress .transfer-bar-filler
{
	background-color: #A7BFEB;
}

.upload-progress .transfer-bar-progress
{
	background-color: #2E3F91;
}

.upload-progress .transfer-bar-percent
{
    color: #FFFFFF;
}

/** 
 * Processing bar
 */
.upload-progress .processing-bar-container
{
	background-color: #FFFFFF;
	border: solid 1px black;
}

.upload-progress .processing-bar-dot
{
	background-color: #2E3F91;
}


/**
 * Upload Progress Area
 */
.upload-progress-area .area-container /* padding on whole UI */
{
    padding: 10px;
}
.upload-progress-area .status
{
    font-size: 14px;
    font-weight: bold;
    padding-bottom: 4px;
}
.upload-progress-area .status-text
{
    font-size: 12px;
}
.upload-progress-area .label-text
{
    font-size: 12px;
    font-weight: bold;
    line-height: 20px;
}
.upload-progress-area .bar-area /* padding on bar */
{
    padding: 15px 5px 15px 5px;
}
.upload-progress-area .bar-container
{
    height: 20px;
}

/**
 * Upload Progress Bar
 */
.upload-progress-bar .area-container /* padding on whole UI */
{
    padding: 0px 4px 0px 4px;
}
.upload-progress-bar .status
{
    font-size: 12px;
    font-weight: bold;
    text-align: right;
}
.upload-progress-bar .area-table
{
    width: 100%;
}
.upload-progress-bar .status-cell
{
    width: 75px;
}
.upload-progress-bar .bar-area /* padding on bar */
{
    padding: 5px 5px 5px 5px;
}
.upload-progress-bar .bar-container
{
    height: 20px;
}

/**
 * Upload Progress Box
 */
.upload-progress-box .area-container /* padding on whole UI */
{
    padding: 2px;
}
.upload-progress-box .status
{
    font-size: 12px;
    font-weight: bold;
    text-align: center;
}
.upload-progress-box .bar-dot
{
    top: 8px;
    left: 8px;
    width: 14px;
    height: 14px;
}
.upload-progress-box .bar-area /* padding on bar */
{
    padding: 10px 5px 10px 5px;    
}
.upload-progress-box .bar-container
{
    height: 30px;
}
.upload-progress-box .bar-percent
{
    font-size: 14px;
    line-height: 30px;
}