/*
*  File:         demo_table.css
*  CVS:          $Id$
*  Description:  CSS descriptions for DataTables demo pages
*  Author:       Allan Jardine
*  Created:      Tue May 12 06:47:22 BST 2009
*  Modified:     $Date$ by $Author$
*  Language:     CSS
*  Project:      DataTables
*
*  Copyright 2009 Allan Jardine. All Rights Reserved.
*
* ***************************************************************************
* DESCRIPTION
*
* The styles given here are suitable for the demos that are used with the standard DataTables
* distribution (see www.datatables.net). You will most likely wish to modify these styles to
* meet the layout requirements of your site.
*
* Common issues:
*   'full_numbers' pagination - I use an extra selector on the body tag to ensure that there is
*     no conflict between the two pagination types. If you want to use full_numbers pagination
*     ensure that you either have "example_alt_pagination" as a body class name, or better yet,
*     modify that selector.
*   Note that the path used for Images is relative. All images are by default located in
*     ../images/ - relative to this CSS file.

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* DataTables features
 */
 
.dataTables_wrapper
{
	position: relative;
	clear: both;
	zoom: 1;
	/*Feeling sorry for IE*/
	font-family: Arial;
	font-size: 10.8pt;
}
.dataTables_processing
{
	position: absolute;
	top: 50%;
	left: 50%;
	width: 250px;
	height: 30px;
	margin-left: -125px;
	margin-top: -15px;
	padding: 14px 0 2px;
	border: 1px solid #DDD;
	text-align: center;
	color: #999;
	font-size: 14px;
	background-color: #FFFFFF;
}
.dataTables_length
{
	width: 40%;
	float: left;
	font-size: 9pt;
	padding-bottom: 20px;
	padding-top: 10px;
}
.dataTables_filter
{
	width: 50%;
	float: right;
	text-align: right;
	padding-bottom: 20px;
	padding-top: 10px;
	font-size: 12pt;
}
.dataTables_info
{
	width: 60%;
	float: left;
	font-size: 10pt;
	padding-top: 10px;
}
.dataTables_paginate
{
	float: right;
	text-align: right;
	padding-top: 10px;
}
/*Pagination nested*/
.paginate_disabled_previous, .paginate_enabled_previous, .paginate_disabled_next, .paginate_enabled_next
{
	height: 19px;
	float: left;
	cursor: pointer;
	=cursor: hand;
	color: #111 !important;
}
.paginate_disabled_previous:hover, .paginate_enabled_previous:hover, .paginate_disabled_next:hover, .paginate_enabled_next:hover
{
	text-decoration: none !important;
}
.paginate_disabled_previous:active, .paginate_enabled_previous:active, .paginate_disabled_next:active, .paginate_enabled_next:active
{
	outline: none;
}
.paginate_disabled_previous, .paginate_disabled_next
{
	color: #666 !important;
}
.paginate_disabled_previous, .paginate_enabled_previous
{
	padding-left: 23px;
}
.paginate_disabled_next, .paginate_enabled_next
{
	padding-right: 23px;
	margin-left: 10px;
}
.paginate_disabled_previous
{
	background: url('images/back_disabled.png') no-repeat top left;
}
.paginate_enabled_previous
{
	background: url('images/back_enabled.png') no-repeat top left;
}
.paginate_enabled_previous:hover
{
	background: url('images/back_enabled_hover.png') no-repeat top left;
}
.paginate_disabled_next
{
	background: url('images/forward_disabled.png') no-repeat top right;
}
.paginate_enabled_next
{
	background: url('images/forward_enabled.png') no-repeat top right;
}
.paginate_enabled_next:hover
{
	background: url('images/forward_enabled_hover.png') no-repeat top right;
}
/** * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* DataTables display
 */
TABLE.display
{
	margin: 0 auto;
	clear: both;
	width: 100%;
	/*Note Firefox 3.5 and before have a bug with border-collapse
* ( https://bugzilla.mozilla.org/show%5Fbug.cgi?id=155955 )
* border-spacing: 0; is one possible option. Conditional-css.com is
* useful for this kind of thing
*
* Further note IE 6/7 has problems when calculating widths with border width.
* It subtracts one px relative to the other browsers from the first column, and
* adds one to the end...
*
* If you want that effect I'd suggest setting a border-top/left on th/td's and
* then filling in the gaps with other borders.
*/
}
TABLE.display THEAD TH
{
	padding: 3px 18px 3px 10px;
	border-right : 1px solid #fff;
	border-bottom: 1px solid #000000;
	font-weight: bold;
	cursor: pointer;
	=cursor: hand;
	background-color: #fff;
	font-size: 11.5pt;
}
TABLE.display TFOOT TH
{
	padding: 3px 18px 3px 10px;
	border-top: 1px solid #000000;
	font-weight: bold;
}
TABLE.display TR.heading2 TD
{
	border-bottom: 1px solid #AAA;
}
TABLE.display TD
{
	padding: 3px 10px;
	border-right : 2px solid #fff;
	border-top: 2px solid #fff;
	border-bottom: 2px solid #fff;
	
}
TABLE.display TD.center
{
	text-align: center;
}
/** * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* DataTables sorting
 */
.sorting_asc
{
	background: url('images/sort_asc.png') no-repeat center right;
}
.sorting_desc
{
	background: url('images/sort_desc.png') no-repeat center right;
}
.sorting
{
	background: url('images/sort_both.png') no-repeat center right;
}
.sorting_asc_disabled
{
	background: url('images/sort_asc_disabled.png') no-repeat center right;
}
.sorting_desc_disabled
{
	background: url('images/sort_desc_disabled.png') no-repeat center right;
}
TABLE.display THEAD TH:active, TABLE.display THEAD TD:active
{
	outline: none;
}
/** * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* DataTables row classes
 */
TABLE.display TR.odd.gradeA
{
	background-color: #BEAEDB;
	font-size: 9pt;
	font-family: Arial;
}
TABLE.display TR.even.gradeA
{
	background-color: #F4F4F4;
	font-size: 9pt;
	font-family: Arial;
}
TABLE.display TR.odd.gradeC
{
	background-color: #DDDDFF;
}
TABLE.display TR.even.gradeC
{
	background-color: #EEEEFF;
}
TABLE.display TR.odd.gradeX
{
	background-color: #FFDDDD;
}
TABLE.display TR.even.gradeX
{
	background-color: #FFEEEE;
}
TABLE.display TR.odd.gradeU
{
	background-color: #DDD;
}
TABLE.display TR.even.gradeU
{
	background-color: #EEE;
}
TR.odd
{
	background-color: #E2E4FF;
}
TR.even
{
	background-color: #FFFFFF;
}
/** * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* Misc
 */
.dataTables_scroll
{
	clear: both;
}
.dataTables_scrollBody
{
	=margin-top: -1px;
	-webkit-overflow-scrolling: touch;
}
.top, .bottom
{
	padding: 15px;
	background-color: #F5F5F5;
	border: 1px solid #CCCCCC;
}
.top .dataTables_info
{
	float: none;
}
.clear
{
	clear: both;
}
.dataTables_empty
{
	text-align: center;
}
TFOOT INPUT
{
	margin: 0.5em 0;
	width: 100%;
	color: #444;
}
TFOOT INPUT.search_init
{
	color: #999;
}
TD.group
{
	background-color: #D1CFD0;
	border-bottom: 2px solid #A19B9E;
	border-top: 2px solid #A19B9E;
}
TD.details
{
	background-color: #D1CFD0;
	border: 2px solid #A19B9E;
}
.example_alt_pagination DIV.dataTables_info
{
	width: 40%;
}
.paging_full_numbers
{
	width: 400px;
	height: 22px;
	line-height: 22px;
}
.paging_full_numbers A:active
{
	outline: none;
}
.paging_full_numbers A:hover
{
	text-decoration: none;
}
.paging_full_numbers A.paginate_button, .paging_full_numbers A.paginate_active
{
	border: 1px solid #AAA;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	padding: 2px 5px;
	margin: 0 3px;
	cursor: pointer;
	=cursor: hand;
	color: #333 !important;
}
.paging_full_numbers A.paginate_button
{
	background-color: #DDD;
}
.paging_full_numbers A.paginate_button:hover
{
	background-color: #CCC;
	text-decoration: none !important;
}
.paging_full_numbers A.paginate_active
{
	background-color: #99B3FF;
}
TABLE.display TR.even.row_selected TD
{
	background-color: #B0BED9;
}
TABLE.display TR.odd.row_selected TD
{
	background-color: #9FAFD1;
}
/*
* Sorting classes for columns

For the standard odd/even*/
TR.odd TD.sorting_1
{
	background-color: #B3A0E1;
}
TR.odd TD.sorting_2
{
	background-color: #D5C5FA;
}
TR.odd TD.sorting_3
{
	background-color: #E0E2FF;
}
TR.even TD.sorting_1
{
	background-color: #EAEBFF;
}
TR.even TD.sorting_2
{
	background-color: #F2F3FF;
}
TR.even TD.sorting_3
{
	background-color: #F9F9FF;
}
/*For the Conditional-CSS grading rows

Colour calculations (based off the main row colours)
Level 1:
dd > c4
ee > d5
Level 2:
dd > d1
ee > e2
 */
TR.odd.gradeA TD.sorting_1
{
	background-color: #C2B6DE;
}
TR.odd.gradeA TD.sorting_2
{
	background-color: #B9AAD5;
}
TR.odd.gradeA TD.sorting_3
{
	background-color: #B9AAD5;
}
TR.even.gradeA TD.sorting_1
{
	background-color: #EEEAF7;
}
TR.even.gradeA TD.sorting_2
{
	background-color: #EBE8F0;
}
TR.even.gradeA TD.sorting_3
{
	background-color: #EBE8F0;
}
TR.odd.gradeC TD.sorting_1
{
	background-color: #C4C4FF;
}
TR.odd.gradeC TD.sorting_2
{
	background-color: #D1D1FF;
}
TR.odd.gradeC TD.sorting_3
{
	background-color: #D1D1FF;
}
TR.even.gradeC TD.sorting_1
{
	background-color: #D5D5FF;
}
TR.even.gradeC TD.sorting_2
{
	background-color: #E2E2FF;
}
TR.even.gradeC TD.sorting_3
{
	background-color: #E2E2FF;
}
TR.odd.gradeX TD.sorting_1
{
	background-color: #FFC4C4;
}
TR.odd.gradeX TD.sorting_2
{
	background-color: #FFD1D1;
}
TR.odd.gradeX TD.sorting_3
{
	background-color: #FFD1D1;
}
TR.even.gradeX TD.sorting_1
{
	background-color: #FFD5D5;
}
TR.even.gradeX TD.sorting_2
{
	background-color: #FFE2E2;
}
TR.even.gradeX TD.sorting_3
{
	background-color: #FFE2E2;
}
TR.odd.gradeU TD.sorting_1
{
	background-color: #C4C4C4;
}
TR.odd.gradeU TD.sorting_2
{
	background-color: #D1D1D1;
}
TR.odd.gradeU TD.sorting_3
{
	background-color: #D1D1D1;
}
TR.even.gradeU TD.sorting_1
{
	background-color: #D5D5D5;
}
TR.even.gradeU TD.sorting_2
{
	background-color: #E2E2E2;
}
TR.even.gradeU TD.sorting_3
{
	background-color: #E2E2E2;
}
/*
* Row highlighting example
 */
.ex_highlight #example TBODY TR.even:hover, #example TBODY TR.even TD.highlighted
{
	background-color: #ECFFB3;
}
.ex_highlight #example TBODY TR.odd:hover, #example TBODY TR.odd TD.highlighted
{
	background-color: #E6FF99;
}
.ex_highlight_row #example TR.even:hover
{
	background-color: #ECFFB3;
}
.ex_highlight_row #example TR.even:hover TD.sorting_1
{
	background-color: #DDFF75;
}
.ex_highlight_row #example TR.even:hover TD.sorting_2
{
	background-color: #E7FF9E;
}
.ex_highlight_row #example TR.even:hover TD.sorting_3
{
	background-color: #E2FF89;
}
.ex_highlight_row #example TR.odd:hover
{
	background-color: #E6FF99;
}
.ex_highlight_row #example TR.odd:hover TD.sorting_1
{
	background-color: #D6FF5C;
}
.ex_highlight_row #example TR.odd:hover TD.sorting_2
{
	background-color: #E0FF84;
}
.ex_highlight_row #example TR.odd:hover TD.sorting_3
{
	background-color: #DBFF70;
}
/*
* KeyTable
 */
TABLE.KeyTable TD
{
	border: 3px solid #FFFFFF;
}
TABLE.KeyTable TD.focus
{
	border: 3px solid #3366FF;
}
TABLE.display TR.gradeA
{
	background-color: #EEFFEE;
}
TABLE.display TR.gradeC
{
	background-color: #DDDDFF;
}
TABLE.display TR.gradeX
{
	background-color: #FFDDDD;
}
TABLE.display TR.gradeU
{
	background-color: #DDD;
}
DIV.box
{
	height: 100px;
	padding: 10px;
	overflow: auto;
	border: 1px solid #8080FF;
	background-color: #E5E5FF;
}
#dt_example #container
{
	width: 1152px;
	/*+placement:margin-auto 0px 0px;*/
	margin-left: auto;
	margin-right: auto;
	position: relative;
	left: 0px;
	top: 0px;
}
#dt_example
{
	color: #000000;
	background-color: #FFFFFF;
	font-family: Arial;
	font-size: 8pt;
	font-weight: normal;
}