.on {border: 1px solid #fff;line-height:1.2em;}
.on thead th {
	text-decoration: underline;
	font-weight: bold;
	/*background-color: #481773;*/
	background-color: #6a0032;
    color: #fff;

}
.on th, .on td {border: 1px solid #fff;}


.on tbody tr:nth-of-type(odd) {
	/*background: #E9D9F7;*/
	background: #fdeaf2;
}

.on tbody tr:nth-of-type(even) {
	/*background: #F3ECFA;*/
	background: #fff3f9;
}

.on thead th.sorting_disabled {
	text-decoration: none;
}

.on thead th.sorting_desc {
	/*background: #481773 url('../images/sort_desc.png') no-repeat 100% 50% !important;*/
	background: #6a0032 url('../images/sort_desc.png') no-repeat 100% 50% !important;
}

.on thead th.sorting_asc {
	/*background: #481773 url('../images/sort_asc.png') no-repeat 100% 50% !important;*/
	background: #6a0032 url('../images/sort_asc.png') no-repeat 100% 50% !important;
}

.on thead th.sorting_asc,
.on thead th.sorting_desc {
	padding-right: 20px !important;
}

.on th.sorting_desc:focus, .on th.sorting_desc:active,
.on th.sorting_asc:focus, .on th.sorting_asc:active,
.on th:focus, .on th:active {
	outline:1px dashed red !important;
	background-color: #ffffcc !important;
	color: #000000 !important;
}

/*w1437
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = =
2020-08-31
*/

/*Search etc DIV*/
#wetDev_filter {
	margin-bottom: 0em;
 
}

/*Show N Entries - nope*/
/*Show pagination - nope*/
#wetDev_length,
#wetDev_paginate {
	display: none;
}

#wetDev_filter input,
#wetDev_filter button {
	margin-left: 0.38em;
    
}
#wetDev_filter input,
#wetDev_filter label {
	display: inline;
}
#wetDev_filter input {
	height: 25px;
	width:50%;
}
/*Table*/
	/*Mobile*/
		/*Width*/
			/*
			https://developer.mozilla.org/en-US/docs/Web/CSS/table-layout
			TLDR;
			table-layout:fixed; allows us to set the width. 'auto', the default, does not.
			The top row of TDs/THs sets the width, later rows are ignored as far as width
			goes.
			*/

			.jsTop {
				display: none;
			}

			@media only screen and (max-width: 1020px) {

				.jsTop {
					display: block;
					float: right;
					padding: 0.38em 1.2em;
					background: #eee;
					border-radius: 0 0 0.38em 0.38em;
					margin-top: -1.2em;
					font-size: 120%;
					text-decoration: none !important;
					border-bottom: 1px solid #222;
				}

				#wetDev {
					/*table-layout:fixed;*/
				}

				#wetDev th,
				#wetDev td {
					display: block;
				}

				#wetDev tbody td {
					text-align: left;
					border: 1px solid #ccc;
					border-top: none;
				}

/*				#wetDev tbody td:before {
					content: "";
					margin-right: 0.2em;
					border-radius: 0.38em 0 0 0;
					display: block;
					display: inline-block;
					background: #222;
					color: #fff;

					background: inherit;
					color: inherit;
					font-weight: bold;
				}*/

				#wetDev tbody td:nth-of-type(1) {
					border-top: 16px solid #eee;
				}

				.mobileLabel {
					margin-right: 0.2em;
					border-radius: 0.38em 0 0 0;
					display: block;
					display: inline-block;
					background: #222;
					color: #fff;
					background: inherit;
					color: inherit;
					font-weight: bold;
				}



/*

NOPE, when looking like a column, TH relationships still hold true, as they
should, and AT still reads out TH before TD, so adding labels with CSS results
in label read twice. So this approach is NOT ok. See JS for better progressive
enhancement.
				html:lang(en) #wetDev tbody td:nth-of-type(1):before { content: "Year: "; }
				html:lang(en) #wetDev tbody td:nth-of-type(2):before`	 { content: "Registered Party: "; }
				html:lang(en) #wetDev tbody td:nth-of-type(3):before { content: "Event Beneficiaries: "; }
				html:lang(en) #wetDev tbody td:nth-of-type(4):before { content: "Event date or General Election: "; }
				html:lang(en) #wetDev tbody td:nth-of-type(5):before { content: "Venue name: "; }
				html:lang(en) #wetDev tbody td:nth-of-type(6):before { content: "Venue address: "; }
				html:lang(en) #wetDev tbody td:nth-of-type(7):before { content: "Regulated Fundraising Event Report: "; }

				html:lang(fr) #wetDev tbody td:nth-of-type(1):before { content: "Ann&eacute;e : "; }
				html:lang(fr) #wetDev tbody td:nth-of-type(2):before { content: "Parti enregistr&eacute; : "; }
				html:lang(fr) #wetDev tbody td:nth-of-type(3):before { content: "B&eacute;n&eacute;ficiaires : "; }
				html:lang(fr) #wetDev tbody td:nth-of-type(4):before { content: "Date de l'activit&eacute; ou &eacute;lection g&eacute;n&eacute;rale : "; }
				html:lang(fr) #wetDev tbody td:nth-of-type(5):before { content: "Lieu de l'activit&eacute; : "; }
				html:lang(fr) #wetDev tbody td:nth-of-type(6):before { content: "Adresse : "; }
				html:lang(fr) #wetDev tbody td:nth-of-type(7):before { content: "Rapport sur une activit&eacute; de financement r&eacute;glement&eacute;e : "; }

*/

			}/*@media only screen and (max-width: 1020px)*/


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
									.note
Add in the .note style that was in HEAD in prod
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
	.note {
		background:#ffffee;
		border-top: 1px solid;
		border-bottom: 1px solid;
	}















/* The End */