/********************
 * EDITABLE GRID CSS
 *********************/

body {
	font-family:'lucida grande', tahoma, verdana, arial, sans-serif;
	
}

h1 { 
	font-size: 15px;
}

h2 { 
	font-size: 13px;
}

a { 
	color: #548dc4;
	text-decoration: none;
}

h1 a {
	font-size: 12px;
	float: right;
}

a:hover {
	text-decoration: underline;
}

img {
	border: 0;
}

.ok { 
	background-color: #0a8819; 
	color: white; 
	padding: 5px;
}

input.invalid {
	background: red;
	color: #FDFDFD;
}

#message {
	width: 100%;
}

#tablelayout {
	padding:0px;

}

table.testgrid { 
	border-collapse: collapse; 
	border: 1px solid #CCB;
	
        font-size: 18px;

}

.val-grid-hover:hover {
	background-color:red;
}

.valgrid-even-row {
	background-color:red;
}
.valgrid-odd-row {
	background-color:blue;
}

.valgrid-error {
	background-color:red;
}

.valgrid-modified {
	background-color:yellow;
}



input[type=text], input[type=password], input[type=email], input[type=tel] {
   height: 22px !important;
}
table.testgrid th {
	background-color:#E5E5E5;
	border: 1px solid black;/*#D5D5D5;*/
	color: #555;
	text-align: left;
	padding-left: 2px;
	padding-right: 2px;
	padding-top: 5px;
	padding-bottom: 5px;
	overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      
      
       
       
}


table.testgrid td {
	padding: 2px;
	border: 1px solid black;
	border-bottom: 1px solid black;
	border-top: 1px solid black;
	overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        
}


#edition {
	padding-top: 5px;
	width: 600px;
	border: 0px;	
}

.ui-resizable-helper { border: 2px dotted black; }
.paginator {
	font-family:  Helvetica, Arial, sans-serif;
  	margin:auto;
	font-size: 12px;
	text-align: center;
	display:inline-block;
	width:65%;
	z-index:1;
}

.paginator a { color:  #0078cc; text-decoration: none; font-size: 12px; }           
.paginator a:hover { color: #000; }
.paginator a:active { color: #777; }
.paginator a:focus { outline: 1px; }

.allele-missing{
	background-color:"red";
}

.allele-present{
	background-color:"green"

}

.allele-dubious{
	background-color:"orange"
}


#paginator {
	font-family:  Helvetica, Arial, sans-serif;
  	margin: 10px 0;
	font-size: 12px;
	text-align: center;
	margin-bottom: 5px;
}

#paginator a { color:  #0078cc; text-decoration: none; font-size: 12px; }           
#paginator a:hover { color: #000; }
#paginator a:active { color: #777; }
#paginator a:focus { outline: 1px; }

#filter { 
	width: 250px;
	margin-bottom: 10px; 
}

#wrap {
	width: 950px;
}

#barchartcontent {
	float: left;
	width: 650px;
	height: 250px;
	margin-top: 10px;
	margin-bottom: 10px;
}

#piechartcontent {
	width: 300px;
	height: 250px;
	margin-top: 10px;
	margin-bottom: 10px;
}

#pagecontrol {
	padding-bottom: 5px;
	float: right;
}

.val-grid-white-background{
	background-color:white;
}


.ind-edit-dialog-label {
	text-align:right;


}

.ind-edit-dialog-cell {
	padding:2px;
	
}

.ind-edit-input {
	
	width:172px;
}

/**********************
 * SMOOTH MENU CSS
 *********************/

.ddsmoothmenu{
font: bold 12px Verdana;
/*/background: #414141; /*background of menu bar (default state)*/
background:#F4F4F4;
color:#333;
width: 100%;
}

.ddsmoothmenu ul{
z-index:100;
margin: 0;
padding: 0;
list-style-type: none;
}

/*Top level list items*/
.ddsmoothmenu ul li{
position: relative;
display: inline;
float: left;
cursor:pointer;


}

/*Top level menu link items style*/
.ddsmoothmenu ul li a{
display: block;
background:#F4F4F4;
/*background: #414141; /*background of menu items (default state)*/
color: white;
padding: 8px 10px;
border-right: 1px solid #778;
color: #2d2b2b;
text-decoration: none;
}

* html .ddsmoothmenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
display: inline-block;
}

.ddsmoothmenu ul li a:link, .ddsmoothmenu ul li a:visited{
color: white;
}

.ddsmoothmenu ul li a.selected { /*CSS class that's dynamically added to the currently active menu items' LI A element*/
background: black !important; 
color: white;
}

.ddsmoothmenu ul li a:hover{
background: black; /*background of menu items during onmouseover (hover state)*/
color: white;
}
	
/* sub menus */
.ddsmoothmenu ul li ul{
position: absolute;
left: -3000px;
display: none; /*collapse all sub menus to begin with*/
visibility: hidden;
}

/*Sub level menu list items (alters style from Top level List Items)*/
.ddsmoothmenu ul li ul li{
display: list-item;
float: none;
}

/*All subsequent sub menu levels vertical offset after 1st level sub menu */
.ddsmoothmenu ul li ul li ul{
top: 0;
}

/* Sub level menu links style */
.ddsmoothmenu ul li ul li a{
font: normal 13px Verdana;
width: 160px; /*width of sub menus*/
padding: 5px;
margin: 0;
border-top-width: 0;
border-bottom: 1px solid gray;
}

/* Holly Hack for IE \*/
* html .ddsmoothmenu{height: 1%;} /*Holly Hack for IE7 and below*/


/* ######### CSS classes applied to down and right arrow images  ######### */

.downarrowclass{
position: absolute;
top: 12px;
right: 7px;
}

.rightarrowclass{
position: absolute;
top: 6px;
right: 5px;
}

/* ######### CSS for shadow added to sub menus  ######### */

.ddshadow{ 
position: absolute;
left: 0;
top: 0;
width: 0;
height: 0;
background-color: #ccc; /* generally should be just a little lighter than the box-shadow color for CSS3 capable browsers */
}

.toplevelshadow{
margin: 5px 0 0 5px; /* in NON CSS3 capable browsers gives the offset of the shadow */
opacity: 0.8; /* shadow opacity mostly for NON CSS3 capable browsers. Doesn't work in IE */
}

.ddcss3support .ddshadow.toplevelshadow {
margin: 0; /* in CSS3 capable browsers overrides offset from NON CSS3 capable browsers, allowing the box-shadow values in the next selector to govern that */
/* opacity: 1; */ /* optionally uncomment this to remove partial opacity for browsers supporting a box-shadow property which has its own slight gradient opacity */
}

.ddcss3support .ddshadow {
background-color: transparent;
box-shadow: 5px 5px 5px #aaa; /* box-shadow color generally should be a little darker than that for the NON CSS3 capable browsers background-color */
-moz-box-shadow: 5px 5px 5px #aaa;
-webkit-box-shadow: 5px 5px 5px #aaa;
}

.ddsmoothmenu-v{
display: none;
}

.ddsmoothmenu-v ul{
margin: 0;
padding: 0;
width: 170px; /* Main Menu Item widths */
list-style-type: none;
font: bold 12px Verdana;
}
 
.ddsmoothmenu-v ul li{
position: relative;
float: none;
}

/* Top level menu links style */
.ddsmoothmenu-v ul li a{
display: block;
overflow: auto; /*force hasLayout in IE7 */
color: white;
text-decoration: none;
padding: 6px 23px 6px 6px;
border-bottom: 1px solid #778;
border-right: 1px solid #778;
}

.ddsmoothmenu-v ul li a:link, .ddsmoothmenu-v ul li a:visited, .ddsmoothmenu-v ul li a:active{
background: #1c5a80; /*background of menu items (default state)*/
color: white;
}


.ddsmoothmenu-v ul li a.selected{ /*CSS class that's dynamically added to the currently active menu items' LI A element*/
background: lightblue !important; 
color: navy;
}

.ddsmoothmenu-v ul li a:hover{
background: lightblue; /*background of menu items during onmouseover (hover state)*/
color: navy;
}

/*Sub level menu items */
.ddsmoothmenu-v ul li ul{
position: absolute;
width: 170px; /*Sub Menu Items width */
top: 0;
font-weight: normal;
visibility: hidden;
}

 
/* Holly Hack for IE \*/
* html .ddsmoothmenu-v ul li { float: left; height: 1%; }
* html .ddsmoothmenu-v ul li a { height: 1%; }
/* End */

