/*
 * Attention:
 * ===========
 * All color and border definitions MUST be defined in /common/css/default.css
 * file, otherwise the Skinning of administration tool would not be worked 
 * properly.
 */

/*
 * This stylesheet is used for scrollable tables aka datagrids
 */
 
div.datagrid {
    position: static;
}

div.datagrid-noborder {
    position: static;
}

/* infotext before thead oder after tfoot */
.datagrid tr.info td {
    padding: 4px 10px 4px 10px; 
}

/* data table */
table.datatable {
    border-spacing: 0px;
    table-layout: fixed;
    width: 100%;
}

.datatable thead tr th {
    height: 22px;
    padding: 1px 10px 1px 10px; 
    overflow: hidden;
}

.datatable td, .datatable thead tr th,
.datatable td a, .datatable thead tr th a {
    font-size: 11px;
    font-family:     verdana, arial, geneva, helvetica;
    letter-spacing: 0.02em;
    text-align: left;
    font-weight: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    text-decoration: none;
    white-space: nowrap;    
}

.datatable thead tr th a img {
    vertical-align: text-bottom;
}


.datatable tbody {
/*  overflow: auto; */
}
.datatable tfoot tr td {
    text-align: right;
}

.datatable tfoot input.text {
    height: 17px;
    margin: 0px 0px 0px 8px;
    padding: 0px;
    font-size: 11px;    
    font-family:     verdana, arial, geneva, helvetica;
    vertical-align: top;
}
.datatable tfoot input,
.datatable tfoot select {
    height: 19px;
    margin: 0px 0px 0px 5px;
    padding: 0;
    font-size: 11px;
    font-family:     verdana, arial, geneva, helvetica;
}

/* cell/row formats */
.datatable td {
    padding: 4px 10px 4px 10px; 
}

/* Multi Action ROW */
.datatable td.marow,
.datatable th.marow {
    width: 60px;
    padding: 1px 5px 1px 5px;   
    text-align: center;
}
.datatable th {
    line-height: 25px;
}
.datatable .marow label {
    white-space: nowrap;
}
.datatable .marow label input {
    padding: 0; 
    margin: 0;
}

/* forms nested in datagrids */
.datagrid form {
    display: inline;
}

.datagrid .noData {
    text-align: left;
    font-style: italic;
}

/* legends: icons + text */
.datagrid .legendicon {
    cursor: pointer; 
    cursor: hand; 
}

.datagrid .legendtext {
    display: none;
}

.legendtext {
    padding: 3px;
}

div.dataBottomToolbar {
    margin:     10px -3px 0px 0px;
    text-align: right;
    padding:    0px;
}

.dataBottomToolbar input {
    font-family:     verdana, arial, geneva, helvetica;
    font-size:         11px;
    vertical-align:    middle;
    height:            19px;
}

td.adjustRight {
   text-align: right;
}

/***********************************************************/
/*                         tab colors                      */
/***********************************************************/
.tabarea {
	position:	relative;
	width:		100%;
	padding: 0;
}

.tabcontrol .tabtitle {
	font-size:		11px;
	font-family:     verdana, arial, geneva, helvetica;
	cursor:			Default;
	display:		inline;
	margin-left: 	0px;
	float:			left;
	padding:		3px 6px 3px 6px;
	cursor:			hand;
	cursor:			pointer;
	z-index:		1;
	position:		relative;
	top:			1px;
}

.tabcontrol .tabtitle.selected {
	z-index:		3;
	padding:		2px 6px 5px 6px;
	margin-left: 	0px;
	top:			0px;
}

.tabcontrol .tabtitle a {
	font-size:			11px;
	font-family:     verdana, arial, geneva, helvetica;
	text-decoration:	none;
	cursor:			hand;
	cursor:			pointer;	
}

.tabcontrol .tabtitle.selected a {
}

.tabpage {
	clear:			both;
	z-index:		2;
	position:		relative;
	top:			-1px;
	font-size:      11px;
	font-family:     verdana, arial, geneva, helvetica;
	padding:		10px;
	overflow:       auto;
}

.tabarea.withButtons .tabpage {
	height: 		360px;
}

.tabcontrol {
	z-index:		1;
	white-space:	nowrap;
	vertical-align: bottom;
	width:			100%;
}

/***************************************************************/
/*                           tab colors                        */
/***************************************************************/
.tabtitle.selected {
    background-color: transparent;
}

.tabpage {
    border-top: 1px solid #7A7A7A;
    border-left: 1px solid #7A7A7A;
    border-right: 2px ridge #D5D5D5;
    border-bottom: 2px ridge #D5D5D5;
}

.tabtitle {
    background-position: right top;
    background-repeat: no-repeat;
    background-color: #D5D5D5;
    background-image: url(../../libs/tabs/tab.gif);
    border-left: 1px solid #7A7A7A;
    border-top:         0;
    border-right:	0;
    border-bottom: 0;
}

.tabtitle.selected {
	border-bottom: 0;
    background-image: url(../../libs/tabs/tab.gif);
}