query-form-geography,
query-form-fleet,
query-form-business,
query-form-output,
query-form-overview,
query-form-vehicle,
query-form-cutback,
query-form-price {
	flex: 1 1 auto;
}

query-form-geography,
query-form-fleet,
query-form-business,
query-form-output,
query-form-overview,
query-form-vehicle,
query-form-cutback,
query-form-price {
	display: flex;
	flex-flow: row nowrap;
	align-items: stretch;
}

.query-form-left {
	flex: 1 0 680px;
	display: flex;
	flex-flow: column nowrap;
	align-items: stretch;
	justify-content: flex-start;
	padding: 0;
/* 	border-right: 1px solid #ddd; */
	box-shadow: 1px 1px 11px rgba(0,0,0,.3);
	z-index: 2;
}

.query-form-left > .form-header {
	margin: 0;
	padding: 10px;
	position: relative;
}

.query-form-right {
	flex: 0 1 50%;
	background: #EFEFEF;
	position: relative;
}

.query-form-left > .vertical-tabs-container {
	position: relative;
	background: #ececec;
	border: 1px solid #ddd;
	border-width: 1px 0;
/* 	margin-bottom: 15px; */
	max-height: 155px;
	overflow: auto;
}

.query-form-left-bottom {
    flex: 1 1 auto;
    display: flex;
    flex-flow: column nowrap;
    align-items: stretch;
    position: relative;
    min-height: 500px; /* TEMP - force a minimum height */
}

drop-area.drop-area-fill {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	display: flex;
	flex-flow: column nowrap;
	align-items: center;
	justify-content: center;
	
	background: #53575C;
	
	z-index: 11;
	opacity: 0;
	pointer-events: none;
	transition: all 200ms ease;
}

.query-form-left-bottom > drop-area.drop-area-active {
	pointer-events: auto;
	opacity: .8;
}

.drop-area-square {
	text-align: center;
}

.query-form-left-bottom > drop-area > .drop-area-square {
	flex: 0 1 300px;
	width: 300px;
	max-width: 80%;
	padding: 20px;
	
	border: 8px dashed #fff;
	border-style: dashed;
	color: #fff;
	display: flex;
	flex-flow: column nowrap;
	justify-content: center;
	align-items: center;
	font-size: 18px;
	
	transition: all 200ms ease;
}

.query-form-left-bottom > drop-area:hover > .drop-area-square {
	border-color: var(--ihsm-red);
	box-shadow: 1px 1px 11px rgba(0,0,0,.3);
}

.list-control-btns {
	position: absolute;
	right: 0;
	bottom: 0;
	height: auto;
	display: flex;
}

.sliding-column-container {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	
	display: flex;
	flex-flow: row nowrap;
	align-items: stretch;
	
	overflow-x: auto;
	background: transparent;
}

.selection-filter {
	flex: 1 0 auto;
	display: flex;
	flex-flow: column nowrap;
	align-items: flex-start;
	
	position: relative;
	
	background: #58595b;
	background: #53575C;
	background: #ececec;
}

.selection-filter:last-child {
	min-width: 100%;
}

.selection-filter-header {
	flex: 0 0 auto;
	align-self: stretch;
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1px solid #ddd;
	background: #fff;
}

.selection-filter-header-left {
	flex: 0 0 auto;
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	padding: 6px 15px;
}

.selection-filter-header-left .dropdown-menu:before {
	right: auto;
	left: 12px !important;
}

.selection-filter-name {
	font-size: 15px;
	font-weight: bold;
	padding: 4px 5px;
}

.next-sliding-column-btn {
	flex: 0 0 30px;
	width: 30px;
	align-self: stretch;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 200ms ease;
}

.next-sliding-column-btn:hover {
	color: #00A9E0;
}

.filter-groups-container,
.filter-conditions-wrapper {
	flex: 1 1 auto;
	padding: 0 20px 20px;
	position: relative;
	display: flex;
	flex-flow: column nowrap;
	align-items: flex-start;
	align-items: stretch;
/* 	pointer-events: none; */
	overflow-y: auto;
}

.filter-groups-container > *, 
.filter-conditions-wrapper > * {
	pointer-events: auto;
}

.filter-groups-container {
/* 	overflow-y: auto; */
}

.filter-conditions-wrapper > .conditions-container {
	padding: 10px 10px 5px 0;
	border-left: 1px solid #aaa;
}

.filter-conditions-wrapper > .conditions-container > .condition-wrapper:before,
.filter-conditions-wrapper > .conditions-container > .condition-wrapper:after {
	border-left-width: 0 !important;
}

.selection-filter-group {
	flex: 0 0 auto;
	display: flex;
	flex-flow: column nowrap;
	position: relative;
	padding-left: 30px;
	padding-top: 10px;
	border-left: 1px solid #aaa;
/* 	background: #58595b; */
}

.selection-filter-group:last-of-type {
	border-color: transparent;
}

.selection-filter-group:not(.grabbed):before {
	content: 'OR';
	position: absolute;
	left: -1px;
	top: 0;
	height: 30px;
	width: 30px;
	border: 1px solid #aaa;
	border-width: 0 0 1px 1px;
	font-size: 11px;
	color: #888;
    padding: 15px 6px 2px;
    box-sizing: border-box;
}

.selection-filter-group:first-of-type:before {
	content: '';
}

.group-conditions-container {
	position: relative;
	padding: 10px 10px 10px 20px;
}

.group-conditions-container:before {
	content: '';
	position: absolute;
	top: 0;
	left: 20px;
	width: 1px;
	height: 10px;
	background: #aaa;
}

.group-conditions-container > .condition-wrapper:first-child:before {
	border-width: 0 0 1px 1px;
}

.selection-filter-group-name {
	flex: 0 0 20px;
	padding: 8px 6px 8px 25px;
	border: 1px solid #ccc;
	background: #fff;
	position: relative;
	
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: space-between;
}

.qfs-group-name-input {
	flex: 1 0 0px;
	padding: 2px 4px 2px 4px;
	color: #006D89;
	font-size: 15px;
}

.selection-filter-name-input {
	flex: 1 1 auto;
    padding-top: 3px;
    padding-bottom: 3px;
    background: transparent;
}

.selection-filter-name-input:not(:focus),
.qfs-group-name-input:not(:focus) {
	pointer-events: none;
	cursor: default;
    border-color: transparent !important;
    box-shadow: none !important;
}

.nav-tree-item:not(.selected) > .selection-filter-btn {
	display: none;
}

.selection-filter-btn {
	cursor: pointer;
	color: #555;
}

.selection-filter-btn:hover {
	color: #00b140;
	background: #f5f5f5;
}

.selection-filter-btn.selection-filter-delete-btn:hover {
	color: #F4364C;
}


.use-filter-groups-btn,
.add-condition-btn {
	position: relative;
	padding: 6px 10px 0px 6px;
	font-size: 13px;
	color: #888;
	cursor: pointer;
}

.use-filter-groups-btn:hover,
.add-condition-btn:hover {
	color: inherit;
}

.use-filter-groups-btn {
	border-left: 1px solid #aaa;
	padding: 6px 10px 3px 5px;
}

.add-condition-btn {
	padding: 6px 10px 0px 6px;
	user-select: none;
}

.use-filter-groups-btn:before {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	height: 1px;
	width: 20px;
	background: linear-gradient(to right, #aaa, transparent);
}

.add-condition-btn:before {
	content: '';
	position: absolute;
	left: 0px;
	top: 0;
	bottom: 0;
	width: 1px;
	background: linear-gradient(to bottom, #aaa, transparent);
}

.vertical-tabs-container {
	display: block;
	padding: 2px 0;
	background-color: #ececec;
	overflow-y: auto;
	position: relative;
	border: 1px solid #ddd;
}

.vertical-tabs-header {
	padding: 3px 8px 3px 8px;
	font-weight: bold;
	color: #53575C;
}

.vertical-tab {
	display: flex;
    flex-flow: row nowrap;
    align-items: stretch;
    cursor: pointer;
    border-color: transparent;
    border-style: solid;
    border-width: 0 3px 0 0;
    padding: 2px 8px 2px 8px;
    margin: 0;
    user-select: none;
    color: #444;
}

.vertical-tab:hover {
	box-shadow: 0 0 2px rgba(0,0,0,.1);
    border-color: #00B140;
    background: linear-gradient(0deg, rgba(255, 255, 255, .7), rgba(255,255,255, .8));
}

.vertical-tab.active {
    box-shadow: 0 0 2px rgba(0,0,0,.1);
    border-color: #00B140;
    background: #fff;
}

.vertical-tab-btn {
	flex: 0 0 auto;
    display: none;
    flex-flow: row nowrap;
    align-items: center;
    padding: 0 5px;
    cursor: default;
    transition: opacity 200ms ease;
    font-size: 13px;
}

.vertical-tab:hover > .vertical-tab-btn,
.vertical-tab.active > .vertical-tab-btn {
	display: flex;
}

#tag-file-picker-wrapper tr:hover td:last-child .td-content-wrapper {
	padding-right: 136px;
}

.tag-join-list-wrapper {
	display: flex;
	flex-flow: row nowrap;
	align-items: flex-start;
	padding: 10px;
	overflow: auto;
}

.tag-join-list {
	flex: 0 1 auto;
	overflow: hidden;
	align-items: stretch;
}

.tag-join-wrapper {
	position: relative;
	overflow: visible;
}

.tag-join {
	display: flex;
	flex-flow: row nowrap;
	align-items: stretch;
	background: #fff;
	border: 1px solid #ccc;
	border-radius: 8px;
	overflow: hidden;
	position: relative;
}

.tag-join-wrapper + .tag-join-wrapper > .tag-join {
	border-top-width: 0;
}

.tag-join-extend {
	padding-left: 20px;
}

.tag-join-extend:before {
	content: '';
	position: absolute;
	width: 10px;
	top: 0;
	bottom: 50%;
	left: 10px;
	border: 1px solid var(--mid-grey);
	border-width: 0 0 1px 1px;
}

.tag-join-extend + .tag-join-extend:before {
	top: -50%;
}

.tag-file-info {
	flex: 1 0 auto;
	padding: px;
}

.tag-file-name {
	font-weight: bold;
	margin: 3px 10px 1px;
}

.tag-file-summary {
	font-size: 11px;
	color: var(--dark-grey);
	margin: 1px 10px 3px;
}

.tag-join-operator {
	flex: 0 0 auto;
	display: flex;
	flex-flow: row nowrap;
	border-left: 1px solid #aaa;
}

.remove-join-btn-wrapper {
	flex: 0 0 auto;
	position: relative;
}

.remove-join-btn {
	padding: 3px 7px 4px;
}

.remove-join-btn:hover {
    color: #F4364C;
    background: linear-gradient(to left top, rgba(0,0,0,.08), rgba(0,0,0,.12));
}

.geography-filter {
	flex: 1 0 100%;
	display: flex;
	flex-flow: column nowrap;
	align-items: flex-start;
	
	position: relative;
	
	background: #58595b;
	background: #53575C;
	background: #ececec;
}

.geo-picker-table-wrapper {
	flex: 1 0 auto;
	position: relative;
	height:100%;
	width: 100%
}

.geo-filter-wrapper{
    height: 80px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 7px;
}
.geo-filter-wrapper div{
	font-size: 12px;
	padding-left :5px;
	padding-right :5px;
	float: left;
}
.geo-filter-wrapper label{
	font-weight: bold;
	padding-left :5px;
	padding-right :5px;
}
.geo-filter-wrapper select{
    width : 175px;
    font-size: 12px;
}
.geo-filter-wrapper input {
    width : 80px;
    font-size: 12px;
}

.tag-file-upload-container {
/* 	border-top: 2px solid var(--mid-dark-grey); */
}

.geo-form-control {
	padding:1px;   
	height: 25px;
	border: 1px solid #ccc;
	font-size: 1em; 
	color: #555;
}

.vertical-option {
	display: flex;
    flex-flow: row nowrap;
    align-items: stretch;
    border-color: transparent;
    background-color: #FFF;
    border-style: solid;
    border-width: 0 3px 0 0;
    padding: 2px 8px 2px 8px;
    margin: 0;
    color: #444;
}

.cutback-count-header {
	font-weight: bold;
    padding-top: 10px;
    padding-left: 15px;
	margin-bottom: 10px;
    font-size: 15px;
}

.cutback-label {
	padding-left: 8px;
	color: #006D89;
    margin-bottom: 10px;
    padding-top: 8px;
    font-size: 15px;
}

.business-filter-wrapper{
    padding-top: 5px;
    padding-bottom: 10px;
    padding-left: 7px;
    display: flex;
    flex-flow: column nowrap;
    align-items: stretch;
    position: relative;
}
.business-filter-wrapper div{
	font-size: 12px;
	padding-left :5px;
	padding-right :5px;
	float: left;
}
.business-filter-wrapper label{
	font-weight: bold;
	padding-right :5px;
	padding-top : 5px;
}
.business-filter-wrapper select{
    width : 175px;
    font-size: 12px;
}
.business-filter-wrapper input {
    width : 80px;
    font-size: 12px;
}

.selected-bar {
    height: 24px;
    background-color: #ffffff;
    width: 100%;
    min-width: 100%;
    color: #006D89;
}

.fleet-label {
    font-weight: bold;
    font-size: 13px;
    user-select: none;
    width: 110px;
}

.next-footer {
    position: absolute;
	right: 5px;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: space-between;
    overflow: hidden;
}

.status-footer {
    position: absolute;
	right: 10px;
	bottom:5px;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: space-between;
    overflow: hidden;
}

.optionBox{
	background-color: #F9F9F8; 
	min-height:45px; 
	border-radius: 5px;
	padding-bottom: 5px;
	margin-bottom: 10px;
}

.sub-fragment{
 
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 2px solid #5C5C5C;
 	border-radius: 5px; 
	height:20px;
	display:inline-block;
	position: relative;
	margin-right: 5px;
	margin-bottom: 5px;
 	top:5px; 
 	font: normal normal bold 12px/16px Source Sans Pro;
}

.sub-fragment-red{
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 2px solid #C56C00;
	border-radius: 4px;
	height:20px;
	display:inline-block;
	position: relative;
	margin-right: 5px;
	margin-bottom: 5px;
 	top:5px; 
}

.sub-fragment-green{
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 2px solid #009900;
/* 	border-radius: 4px; */
	height:20px;
	display:inline-block;
	position: relative;
	margin-right: 5px;
	margin-bottom: 5px;
 	top:5px; 
}

.remove-fragment{
	display:inline-block;
	position: relative;
	margin-right: 5px;
 	top:9px; 
}

.fragment-label{
	position:relative; 
	display:inline-block; 
	top:7px; 
	padding-right:5px;
}

.fragment{
	background-color:#FFFFFF;
	border: 1px solid #D7D7D7; 
	border-radius: 4px;
	display:inline-block;
	padding-left:5px;
	padding-bottom: 5px;
	position: relative;
	top:6px;
	min-height:30px;
}

.filter-fragment{
	background-color:#FFFFFF;
	border: 1px solid #D7D7D7; 
	border-radius: 4px;
	padding-left:5px;
	position: relative;
	top:6px;
}

.fragment-title {
    color:black;
    font-weight: bold; 
}

.fragment-filter {
	position:relative; 
	padding-left:5px; 
	font-family:arial; 
	font-size:9pt; 
	font-weight: bold; 
	color:#818A98;
	top:2px;
}


#zip-radiate-form {
	display: inline-block;
}

.national-market-container {
	flex: 0 0 auto;
	align-self: flex-start;
}

.update-count-container{
	background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#fff),color-stop(50%,#e0e0e0),color-stop(100%,#fff));
	background: -webkit-linear-gradient(top,#fff 0,#e0e0e0 50%,#fff 100%);
	padding-top:30px;
	font-weight: bold;
	font-size:12pt; 
	color: black;
	text-shadow: 1px 1px 0 #fff;
	min-height:60px;
	justify-content: center;
    text-align: center;
}


.filter-container {
	padding-left: 20px;
    padding-right: 10px;
    color: #4B4B4B;
}

.filter-label {
	font-weight: bold;
    font-size: 13px;
    user-select: none;
}

.filter-text {
    font-size: 12px;
    user-select: none;
}

.filter-container-roll {
	padding-left: 20px;
	padding-right: 10px;
	color: #4B4B4B;
	height: 68px;
	overflow-y: auto;
}