.filters-loading-small, .filters-loading-large {
	
	-webkit-transition-property:-webkit-transform;
	-webkit-transform:rotate(0deg) translateZ(0);
	-webkit-transition-duration:0ms;
	-webkit-animation-name:filters-loading;
	-webkit-animation-duration:2s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:linear;
	
	-moz-transition-property:-webkit-transform;
	-moz-transform:rotate(0deg) translateZ(0);
	-moz-transition-duration:0ms;
	-moz-animation-name:filters-loading;
	-moz-animation-duration:2s;
	-moz-animation-iteration-count:infinite;
	-moz-animation-timing-function:linear;
}

.filters-loading-small {
	width:15px; height:15px;
	background: url("../../images/mobile/loadingSmall.png") 0 0 no-repeat;
}

.filters-reset-loading {
	display: inline-block;
	position: relative;
	top: 3px;
	left: 4px;
}

.filters-search-icon {
	width:20px; height:20px;
	background: url("../../images/mobile/search.png") 0 0 no-repeat;
	float: right;
	display: inline-block;
	position: relative;
	cursor: pointer;
	margin: 11px;
}

.filter-search-form {
	padding: 0; margin: 0;
	border-radius: 5px;
	border: 1px solid rgb(230, 230, 230);
	padding-left: 5px;
	padding-right: 5px;
	height: 30px;
	background-color: white;
	position: relative;
	margin-right: 10px;
	margin-bottom: 5px;
	line-height: normal;
}

.filter-search-form.withBtn {
	padding-right: 27px;
}

.filter-search-input {
	position: relative; 
	top: 0; 
	left: 0;
	padding: 0; 
	margin: 0;
	border-width: 0; 
	border: none;
	width: 100%;
	height: 100%;
	overflow: hidden;
	height: 2em; 
	line-height: 2em;
	margin: 2px;
}

.filterMenu-Undo {
	color: var(--primary-color);
}

@-webkit-keyframes filters-loading {
	from { -webkit-transform:rotate(0deg) translateZ(0); }
	to { -webkit-transform:rotate(360deg) translateZ(0); }
}
@-moz-keyframes filters-loading {
	from { -moz-transform:rotate(0deg) translateZ(0); }
	to { -moz-transform:rotate(360deg) translateZ(0); }
}

.filterView {
	margin: 8px;
	margin-right: 10px;
	color: var(--dark-grey);
}

.filterView.firstItem {
	margin-top: 8px; /* Extra margin on the first filter item
						 as the drop-shadow creates an optical illusion
						 such that it appears the item is not aligned correctly. */
}

.context-menu .item table {
	border-collapse: collapse;
	table-layout: fixed;
}

.context-menu .item table th, 
.context-menu .item table td {
	padding: 0;
	vertical-align: top;
}

.context-menu .item .iconContainer {
	vertical-align: middle;
}

.context-menu .item .promptItemColourIcon {
	width: 25px; 
	height: 25px;
	margin-left: 5px;
	border: 1px solid #ccc;
}

.context-menu .item .promptItemImageIcon {
	border: 0;
	display: block;
	margin: 0 auto;
}

.context-menu .item .promptItem {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    display: block;
    vertical-align: middle;
    margin-left: 5px !important;
    margin-top: 7px !important;
    margin-bottom: 7px !important;
}

.context-menu .item .filterEntryError {
	margin: 8px;
	color: red;
}

.context-menu .item.focused {
	background-color: var(--primary-color);
	color: var(--white);
}

.context-menu .item.focused .filterView {
	color: var(--white);
}

.filterMenu-header {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor:default;
}
.filterMenu-titleRow, 
.filterMenu-functionRow {
	margin: 0;
	margin-left: 8px;
	margin-right: 0px;
	height: 44px;
	position: relative;
}
.filterMenu-functionRow {
	color: var(--primary-color);
	font-size: 80%;
	line-height: 44px;
}
.filterMenu-Title { 
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	padding-right: 40px;
	line-height: 44px;
	
}
.filterMenu-SubTitle {
	font-size: 80%;
	color: #AAA;
	line-height: 0;
}
.filterMenu-button {
	min-width: 25px;
	height: 23px;
	cursor: pointer;
}
.filterMenu-Close {
	float: right;
	color: #888;
	background-image: none;
	border-radius: 0.25em;
	border: 1px solid #7E7E7E;
	cursor: pointer;
	position: absolute;
	top: 0px;
	right: 0px;
	margin: 8px;
	color: rgb(102, 102, 102);
	font-family: Arial,Helvetica,sans-serif;
	font-size: 16px;
	text-align: center;
}
.filterMenu-Go {
	float: right;
	border-radius: 0.25em;
	border: 1px solid var(--primary-color); 
	background-color: var(--primary-color);
	color: white;
	text-align: center;
	cursor: pointer;
	position: absolute;
	top: 0px;
	right: 0px;
	margin: 8px;
	line-height: 24px;
}

.filterFunctionMenu-reset,
.filterFunctionMenu-refreshContainer,
.filterFunctionMenu-refresh {
	cursor: pointer;
	line-height: 44px;
	width: 25px;
	height: 25px;
	position: absolute;
	top: 12px;
	left: 2px;
}

#filterFunctionMenuloadingSpinner,
.filterFunctionMenu-refreshContainer {
	left: 29px;
	top: 12px;
}

#filterFunctionMenuloadingSpinner {
	top: 5px;
}

.filterFunctionMenu-reset {
	background-image: url(../../images/reset_grey.png);
	background-repeat: no-repeat;
	background-position: 0 0;
}
.filterFunctionMenu-reset:hover {
   background-image: url(../../images/reset.png);
}

.filterFunctionMenu-refresh {
	background-image: url(../../images/report_refresh_grey.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	top: 0px; left: 0px;
}
.filterFunctionMenu-refresh:hover {
   background-image: url(../../images/report_refresh.png);
}

.filterMenu-button.highlighted {
	box-shadow: 0px 0px 4px 3px #666;
}

.filterMenu-reset,
.filterMenu-Undo {
	cursor: pointer;
	line-height: 44px;
}

.filterMenu-reset.highlighted,
.filterMenu-Undo.highlighted {
	text-decoration:underline;
}

.filterView .filterTitleRow {
	padding-top: 5px;
	padding-bottom: 5px;
}
#filterTextForm .between {
	padding-bottom: 5px;
}
#filterTextInput {
}
#filterTextInput .hint {
	color: gray;
}
.filterView .filterTextValueAdd {
	padding-left: 5px;
	padding-right: 5px;
}
.filterView .filterTextValueRemove {
	position: absolute;
	left: 10px;
	top: 10px;
}
.filterView .filterTextCSVClear {
	position: absolute;
	right: 8px;
	top: 6px;
	cursor: pointer;
}
.filterTextValueAdd {
	padding-top: 5px;
	padding-bottom: 5px;
}
.filterPromptListExpandDetails {
	width: 9px; height: 15px;
	background: url("../../images/mobile/FilterExpand.png") 0 0 no-repeat;
	float: right;
	padding-right: 0px;
	padding-left: 0px;
	text-align: center;
	display: inline-block;
	margin-top: 4px;
	cursor: pointer;
}
.context-menu .item.focused .filterView .filterPromptListExpandDetails {
    background: url("../../images/mobile/FilterExpandOn.png") 0 0 no-repeat;
}
.context-menu .item.focused .filterView  .filterPromptListExpandDetails.close {
	background: url("../../images/mobile/FilterCloseRollout.png") 0 0 no-repeat;
}
.filterPromptListSearch {
	width: 20px; height: 22px;
	background: url("../../images/mobile/search.png") 0 0 no-repeat;
	position: absolute;
	top: 5px; right: 5px;
	border: none;
	cursor: pointer;
}
.promptListSelectionControl {
	color: var(--primary-color);
}

#filterTitle {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	padding-right: 5px;
	max-width: 70%;
	display: inline-block;
}

#filterSubTitle { 
	display: inline-block;
	overflow: hidden;
	text-overflow: ellipsis;
	text-align: right;
	color: #AAA;
	white-space: nowrap;
}

/* Date & time */
.dateTimeFields {
	display: inline-block;
}
.filterView .customDateRow {
	margin: 2px;
}
.filterView .DayInput, 
.MonthInput, 
.hourInput, 
.minutesInput,
.YearInput,
.timeStampInput {
	
	padding: 0;
	margin: 0;
	border-radius: 5px;
	border: 1px solid #E6E6E6;
	padding-left: 5px;
	height: 25px;
	background-color: white;
	position: relative;
	line-height: normal;
	
	width: 25px;
}
.filterView .AMPMInput {
	padding-left: 5px;
	margin-left: 5px;
	height: 29px;
}
.filterView .YearInput {
	width: 50px;
}
.filterView .calendarBtn {
	padding-left: 5px;
	vertical-align: middle;
	width: 32px; height: 32px;
}

.filterView .calendarBtn.highlighted {
	position: relative;
	left: 1px;
	top: 1px;
}
.filterView .timeStampInput {
	font-size: 75%;
	width: 140px;
}
.filterView .dateTimeFieldTitle {
	margin-bottom: 10px;
}

/* Numeric slider */
#filterSlider .labelTable {
	width: 100%;
	color: #999;
}
#filterSlider .resultCell,
#filterSlider .minCell,
#filterSlider .maxCell {
	display: inline-block;
	vertical-align: middle;
	font-size: 75%;
    -webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;	
	top: -2px;
	position: relative;
}

#filterSlider .limitsRow {
	height: 7px;
}



#filterSlider .valuesAsLimits .minCell {
	text-align: left;
	float: left;
}

#filterSlider .valuesAsLimits .maxCell {
	float: right;
}

#filterSlider .valuesAsLimits .resultCell {	
	margin: 0 auto;
}

#filterSlider .resultCell {
	float : left;
	left: 20px;
	
}

#filterSlider .minCell {
	text-align : left;
	padding-right: 5px;
}
#filterSlider .maxCell {
	text-align : right;
	padding-left: 5px;
}
#filterSlider .valueCell {
	text-align : center;
	color: #CCC;
}
#filterSlider .labelSpacer {
	height: 2px;
}
#filterSlider .sliderRow {
	padding: 0; 
	margin: 0;
	border: 0;
}
#filterSlider .sliderRailContainer {
	height: 1.5em;
	position: relative;
	display: inline-block;
	vertical-align: middle;
	padding: 0; margin: 0;
}

#filterSlider .sliderRailEnd {
	display: none;
}

#filterSlider .sliderRailEnd.left {
	left: 0px;
}

#filterSlider .sliderRailEnd.right {
	right: 0px;
}

#filterSlider .sliderRail {
	background-image: linear-gradient(top, #555 25%, #666 75%);
	background-image: -o-linear-gradient(top, #555 25%, #666 75%);
	background-image: -moz-linear-gradient(top, #555 25%, #666 75%);
	background-image: -webkit-linear-gradient(top, #555 25%, #666 75%);
	background-image: -ms-linear-gradient(top, #555 25%, #666 75%);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#555555', EndColorStr='#666666'); /* IE6,IE7 */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#555555', EndColorStr='#666666')"; /* IE8 */
	
	width: 100%; height: 0.35em;
	border: none;
	position: relative;
    top: 0.575em;
}
#filterSlider .sliderSpacer {
	height: 4px;
}
#filterSlider .sliderHandle {
	width: 1.5em; height: 1.5em;
	background-image: linear-gradient(top, #BBB 25%, #AAA 75%);
	background-image: -o-linear-gradient(top, #BBB 25%, #AAA 75%);
	background-image: -moz-linear-gradient(top, #BBB 25%, #AAA 75%);
	background-image: -webkit-linear-gradient(top, #BBB 25%, #AAA 75%);
	background-image: -ms-linear-gradient(top, #BBB 25%, #AAA 75%);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#BBBBBB', EndColorStr='#AAAAAA'); /* IE6,IE7 */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#BBBBBB', EndColorStr='#AAAAAA')"; /* IE8 */
	
	-moz-box-shadow: 0px 5px 5px #222222;
	-webkit-box-shadow: 0px 5px 5px #222222;
	box-shadow: 0px 5px 5px #222222;
	position: absolute;
	top: 0;
	border-radius: 1.5em;
	border: 1px solid #BBB;
	cursor: pointer;
}
#filterSlider .sliderHandleHint {
	background-image: linear-gradient(bottom, #000 25%, #333 75%);
	background-image: -o-linear-gradient(bottom, #000 25%, #333 75%);
	background-image: -moz-linear-gradient(bottom, #000 25%, #333 75%);
	background-image: -webkit-linear-gradient(bottom, #000 25%, #333 75%);
	background-image: -ms-linear-gradient(bottom, #000 25%, #333 75%);
  	filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#000000', EndColorStr='#333333'); /*IE6,IE7*/
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#000000', EndColorStr='#333333')"; /*IE8 */
 
	width: auto; height: 1.25em;
	position: relative;
	border-radius: 0.25em;
	border: 2px solid #EEEEEE;
	text-align: center;
	vertical-align: middle;
	font-size: 75%;
	display: inline-block;
	padding-left: 5px;
    padding-right: 5px;
    min-width: 2em;
    color: white;
    
    -webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

/* Boolean */
.filterBoolean .switchContainer {
	width: 150px; height: 30px;
	border-radius: 0.2em;
	border: 1px solid #AAA;
	line-height: 30px;
	position: relative;
	font-size: 80%;
	box-shadow: inset -1px 1px 1px #555;
	background-color: #6DB3C9
}
.filterBoolean .switchOnText {
	text-align: center;
	white-space: nowrap;
 	overflow: hidden;
  	text-overflow: ellipsis;
  	display:inline-block;
  	padding-left: 5px;
}
.filterBoolean .switchOffText {
	text-align: right;
	white-space: nowrap;
  	overflow: hidden;
  	text-overflow: ellipsis;
  	display:inline-block;
  	float: right;
  	padding-right: 5px;
	
}
.filterBoolean .switch {
	background-image: linear-gradient(top, #D1CECE 25%, #EEE 75%);
	background-image: -o-linear-gradient(top, #D1CECE 25%, #EEE 75%);
	background-image: -moz-linear-gradient(top, #D1CECE 25%, #EEE 75%);
	background-image: -webkit-linear-gradient(top, #D1CECE 25%, #EEE 75%);
	background-image: -ms-linear-gradient(top, #D1CECE 25%, #EEE 75%);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#D1CECE', EndColorStr='#EEEEEE'); /* IE6,IE7 */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#D1CECE', EndColorStr='#EEEEEE')"; /* IE8 */

	width: 50%; height: 27px;
	border-radius: 0.2em;
	border: 1px solid #FFF;
	position: absolute;
	top: 1px; left: 1px;
	-moz-box-shadow: 1px 1px 1px #222;
	-webkit-box-shadow: 1px 1px 1px #222;
	box-shadow: 1px 1px 1px #222;
	cursor: pointer;
}

.values-display {
   background: var(--background-white);
}