/*.....................................................................
 * Runtime styles
 */
.udc_start_app_button {
  position: absolute;
  color:#626262;
  cursor:pointer;
  top: 3px;
  left: 8px;
  bottom: 3px;
  font-family:Verdana;  
  
  /*
  border-top-color:#8a8aff;
  border-top-style:solid;
  border-top-width:thin;
  border-right-color:#8a8aff;
  border-right-style:solid;
  border-right-width:thin;
  */
}

/*
 * The task bar. This will host various icons.
 */
.udc_task_bar {
  background-color:#eaeaea;
  width:100%;
}

/**===================================================================
 * Application related styling.
 */
.udc_app_frame
{
  width: 100%;
  height: 100%;
  padding: 2px;
}

.claro .dijitSplitContainer-dijitContentPane, 
.claro .dijitBorderContainer-dijitContentPane
{
    padding: 0px;
    overflow: hidden;
}

.udc_app_action_frame
{
    width: 180px;
    height: 100%;
}

.udc_action_header
{
  background:#e1e1e1;
  color:#4b4b4b;
  /*font-family: verdana;*/
  font-weight: bold;
  height: 20px;
  padding-top: 4px;
  text-align: center;
  width: 100%;  
  border-bottom-style:solid;
  border-bottom-width:thin;
  border-bottom-color: #b9b9b9;
}

.udc_app_content_frame
{
  width: 100%;
  height: 100%;
  padding: 2px;
}

/**....................................................................
 * Application action items. User clicks the action to launch a page or
 * task.
 */
.udc_app_action_item {
    border-bottom: thin solid #bbbbbb;
    cursor: pointer;
    height: 20px;
    padding-left: 4px;
    padding-top: 4px;
    vertical-align: middle;
    width: 100%;
}

.udc_app_action_item:hover
{
  background-color: #c4c4ff;
}


/*.....................................................................
 * Topic - the topic of an application that shows in the content area when user selects
 * a command from the application.
 */
.udc_topic_content
{
  width: 100%;
  height: 94%;  
}

.udc_topic_header {
  width: 100%;
  height: 5%;
  min-height: 20px;
  max-height: 20px;
  padding: 4px;
  background: #676767;  
  color: #d8d8d8;
  border-bottom-style:solid;
  border-bottom-width:thin;
  border-bottom-color: #b9b9b9;
  font-size:inherit;
  font-weight:bold;
}

.udc_topic_header span
{
  padding: 0px 7px;
}


/*
 ========================================================= 
 Form Styling.
 ========================================================= 
*/

.udc_form {
  width: 100%;
  height: 100%;
  border:thin;
  border-color:#c0c0c0;
  border-style:solid;
}

/* Form Row */
.udc_form_row {
  width: 100%;
  padding:2px 2px 2px 2px;
}

/* Form Label */
.udc_form_label {
  border-bottom-width:thin;
  border-bottom-color: #d8d8d8;
  border-bottom-style:solid;
  background-color: #dddddd;
}

/* Form Value */
.udc_form_value {
  text-align:left;
  border-bottom-width:thin;
  border-bottom-color: #d8d8d8;
  border-bottom-style:solid;
}

/* Grid styling */
.udc_grid_frame {
   border:thin; 
   border-color:#c0c0c0; 
   border-style:solid;
}

.udc_grid_header {
  border-bottom:thin; 
  border-bottom-color:#c0c0c0; 
  border-bottom-style:solid; 
  background-color: #dddddd; 
  min-height: 20px;
  max-height: 20px;
  
}

.udc_item_action_bar {
  padding: 4px;
}

.udc_grid_action_bar {
  padding: 4px;
}

/*..............................................
 * Ref objects shown in the item view
 */
.udc_item_ref_item {
  border-right:thin;
  border-right-color:#e5e5e5;
  border-right-style:solid;
}

.udc_item_ref_item_header {
  width: 100%;
  height: 10%;
  min-height: 20px;
  max-height: 20px;
  border-bottom:thin; 
  border-bottom-color:#c0c0c0; 
  border-bottom-style:solid; 
  background-color: #dddddd; 
}

.udc_item_ref_item_content {
  
}


/*..............................................
* Chart styling.
*/
#charts {
	clear: both;
	margin-bottom: 50px;
}
.chart-area {
	float: left;
	border: 1px solid #ccc;
	width: 480px;
    height: 400px;
	margin: 3px;
}
.chart {
	width: 450px;
	height: 300px;
}