/*
*  File:         demo_table_jui.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.
*/


/*
* jQuery UI specific styling
*/

.paging_two_button .ui-button {
float: left;
cursor: pointer;
* cursor: hand;
}

.paging_full_numbers .ui-button {
padding: 2px 6px;
margin: 0;
cursor: pointer;
* cursor: hand;
color: #333 !important;
}

.dataTables_paginate .ui-button {
margin-right: -0.1em !important;
}

.paging_full_numbers {
width: 350px !important;
}

.dataTables_wrapper:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}

.dataTables_wrapper .ui-toolbar {
padding: 5px;
}

.dataTables_paginate {
width: auto;
}

.dataTables_info {
padding-top: 3px;
}

table.display thead th {
padding: 3px 0px 3px 10px;
cursor: pointer;
* cursor: hand;
}

div.dataTables_wrapper .ui-widget-header {
font-weight: normal;
}


/*
* Sort arrow icon positioning
*/
table.display thead th div.DataTables_sort_wrapper {
position: relative;
padding-right: 20px;
}

table.display thead th div.DataTables_sort_wrapper span {
position: absolute;
top: 50%;
margin-top: -8px;
right: 0;
}




/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
*
* Everything below this line is the same as demo_table.css. This file is
* required for 'cleanliness' of the markup
*
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* DataTables features
*/

.dataTables_wrapper {
background-color: #D5D0D0;
/* position: relative; */
/* clear: both; */
}

.dataTables_processing {
position: absolute;
top: 0px;
left: 50%;
width: 250px;
margin-left: -125px;
border: 1px solid #ddd;
text-align: center;
color: #999;
font-size: 11px;
padding: 2px 0;
}

.dataTables_length {
/* width: 40%; */
float: left;
}

.dataTables_filter {
/* width: 50%; */
float: right;
/* text-align: right; */
}

.dataTables_info {
/* width: 50%; */
padding: 9px 6px 6px 6px;
float: left;
}

.dataTables_paginate {
float: right;
/*	text-align: right; */
}

.dataTables_length,
.dataTables_filter,
.dataTables_paginate {
padding: 6px;
}


/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* DataTables display
*/
table.display {
margin: 0 auto;
width: 100%;
clear: both;
border-collapse: collapse;
}

table.display tfoot th {
padding: 3px 0px 3px 10px;
font-weight: bold;
font-weight: normal;
}

table.display tr.heading2 td {
border-bottom: 1px solid #aaa;
}

table.display td {
padding: 3px 10px;
}

table.display td.center {
text-align: center;
}

/* Header cells */
th.sorting_disabled {
text-align: center;
background: #134274; /*#66a9bd;*/
color: white;
}


/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* 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;
}




/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* DataTables row classes
*/
table.display tr.odd.gradeA {
background-color: #ddffdd;
}

table.display tr.even.gradeA {
background-color: #eeffee;
}




table.display tr.odd.gradeA {
background-color: #ddffdd;
}

table.display tr.even.gradeA {
background-color: #eeffee;
}

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: white;
}

tr.even {
background-color: #FDF3EA;
}





/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* Misc
*/
.dataTables_scroll {
clear: both;
}

.dataTables_scrollBody {
-webkit-overflow-scrolling: touch;
}

.top, .bottom {
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 a.paginate_button,
.paging_full_numbers a.paginate_active {
display: inline-block;
background-color: #FDF3EA; /*#608995;*/
padding: 2px 6px;
margin-left: 2px;
cursor: pointer;
*cursor: hand;
/*	border: 1px solid #aaa;*/
/*	-webkit-border-radius: 5px;*/
/*	-moz-border-radius: 5px;*/
/*	padding: 2px 5px;*/
/*	margin: 0 3px;*/
/*	cursor: pointer; */
/*	cursor: hand; */
color: #000000; *
}

.paging_full_numbers a.paginate_button {
color: #000000;
}

.paging_full_numbers a.paginate_button_disabled {
color: #ccc;
}

.dataTables_info {
padding: 9px 6px 6px 6px;
}
.paging_full_numbers {
background-color: #ccc;
text-decoration: none !important;
}

.paging_full_numbers a.paginate_active {
background-color: transparent;
border: 1px solid black;
}

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: #D3D6FF;
}

tr.odd td.sorting_2 {
background-color: #DADCFF;
}

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: #c4ffc4;
}

tr.odd.gradeA td.sorting_2 {
background-color: #d1ffd1;
}

tr.odd.gradeA td.sorting_3 {
background-color: #d1ffd1;
}

tr.even.gradeA td.sorting_1 {
background-color: #d5ffd5;
}

tr.even.gradeA td.sorting_2 {
background-color: #e2ffe2;
}

tr.even.gradeA td.sorting_3 {
background-color: #e2ffe2;
}

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;
}

table.pretty tbody td {
text-align: center;
background: #FDF3EA; /*#d5eaf0;*/
}

table.pretty tbody tr.odd td {
background: white; /*#bcd9e1;*/
}
