/* 1.Overall style of the widget.
   The position of the widget-tabs has to be :absolute (The element is positioned relative to its first positioned (not static) ancestor element).
   So the position of the widget cannot be static (default) or inherit (if the parent is static or default).
   The position of the widget should be absolute, fixed or relative.
   
   By default, the last element is shown. So the direction should be rtl. 
   
   The top of the widget-tabs should be identify, 0 or some small number. It determines the location of the tabs.
 */

.tabWidget {
  position: relative; 					/*Must*/
  width: 99%;                           /* Cover all the page */
  min-width: 900px;
  border: 1px solid #6C8C22;      
  border-radius: 8px;  
  margin:auto;
}

.tabBar {
  padding: 10px 0 0 10px;
  margin:0;
  border-bottom: 1px solid #6C8C22;	    /*Must: show a line to connect all the tabs.*/
}

/* Common part for all tabs*/
.tabItem,
.currentTabItem,
.disabledTabItem
{  
  position: relative; 				
  display: inline-block;
  vertical-align: top;
  border: solid #6C8C22;
  border-radius: 5px 5px 0 0;
  line-height: 30px;

  color: #0000ff;  
  text-align: center;
  text-decoration: none;
  min-width: 100px;
  padding: 0 15px;
}

/*Separate the selected tab and the non-selected tabs*/
.tabItem,
.disabledTabItem
 {
  bottom: 2px;  
  border-width: 1px 1px 1px 1px;					
  font-weight: normal;
  background: #B8FAC0;
}

.currentTabItem
 { 
  bottom: -1px;  
  border-width: 1px 1px 0 1px;
  border-top: 5px solid #0000ff; 
  font-weight: bold;
  background: white;
}

.disabledTabItem
 { 
  color: black;
  background: gray;
}

.pageWidget
 {
  padding: 10px;
}


/*Style for google chart table*/
  .headerRow {
    font-style: italic;
    color: darkblue;
    font-size: 15px;
    font-weight: bold;	
    text-align: center;				
  }
  
  .tableRow {
    background-color: white;
  }
  .oddTableRow {
    background-color: beige;
  }
  
  .hoverTableRow {
    background-color: orange;
  }

  .headerCell {
    border: 3px solid green;
  }
  
  .tableCell {
    text-align: center;
    border-left: 1px solid green;
    border-right: 1px solid green;
    width: 120px;
  }	
  
  .tableCell_wo_width {
    text-align: center;
    border-left: 1px solid green;
    border-right: 1px solid green;
    min-width: 100px;
  }	
  .rowNumberCell {
    text-align: center;
    width: 20px;
  }		
  
  .modified {
  	border: 2px solid red;
  	padding: 7px; 
  	background-color: orange;
    margin-bottom: 20px; 	
    width: 700px;
  }			

  .logo_img {
      display: inline;
      margin: 0 auto;
  }

