 

#startbody {
	color: #929292;
	max-width: 1400px;
	padding: 20px
}

#startbody h3 {
	padding: 5px
}

 

#graphCanvas {
	height: 400px;
	width: 100%
}

.search-container {
	box-sizing: border-box;
	float: left
}

.search-header {
	max-width: 650px;
	min-width: 350px;
	border: 1px solid #e3e3e3;
	border-bottom: 0;
	padding: 10px;
	box-sizing: border-box;
	border-radius: 8px 8px 0 0;
	background: #fff;
	margin: 20px 0 0 0
}

.search-header input,.search-header select {
	margin-bottom: 5px
}

.search-header input[type="text"] {
	width: 50px;
	padding: 5px;
	margin-right: 2px;
	border: 1px solid #ddd;
	border-radius: 4px
}

#qSlider,#hSlider {
	width: 200px;
	vertical-align: sub;
	margin: 10px 0 0 0
}

#searchForm label {
	width: 220px;
	display: inline-block
}

.search-header select {
	padding: 5px;
	border: 1px solid #ddd
}

.search-button {
	background-color: red;
	color: white;
	border: 0;
	padding: 5px 10px;
	cursor: pointer
}

.product-filters {
	max-width: 650px;
	min-width: 350px;
	border: 1px solid #e3e3e3;
	border-top: 0;
	padding: 10px;
	box-sizing: border-box;
	border-radius: 0 0 8px 8px;
	background: #fff;
	margin: 0 0 20px 0
}

.product-filters .filters-header {
	margin-top: 10px;
	margin-bottom: 5px;
	font-weight: bold;
	border-top: 1px solid #ddd;
	padding: 10px 0 0 0
}

.filters-body {
	padding-top: 10px;
	overflow-x: auto
}

.filter-group label {
	display: block;
	margin-bottom: 5px
}

.filter-group input[type="checkbox"] {
	margin-right: 5px
}

.filter-group input[type="text"] {
	width: calc(100% - 10px);
	padding: 5px;
	margin-bottom: 5px;
	border: 1px solid #ddd
}

.quick-search {
	width: 100%;
	background-color: #00afd7;
	border: 0;
	padding: 10px 5px;
	cursor: pointer;
	border-radius: 4px;
	font-size: 18px;
	font-weight: bold;
	color: #fff
}

.quick-search:hover {
	background-color: #465e72
}

.show-all-schedule {
	display: none;
	background: #253746;
	border-radius: 0 0 4px 4px
}

.show-all-schedule:hover {
	background: #3b5265
}

table {
	width: 100%;
	border-collapse: collapse;
	margin-top: 20px;
	font-size: 13px
}

table,th,td {
	border: 1px solid #ddd
}

th {
	background-color: #f2f2f2;
	color: #929292
}

th,td {
	padding: 10px;
	text-align: left
}

td {
	background-color: #fff
}

td input {
	height: 20px;
	width: 20px
}

tbody tr:nth-child(odd) {
	background-color: #f9f9f9
}

.view-graph {
	cursor: pointer
}

#show {
	float: left;
	max-width: calc(100% - 700px);
	min-width: 50%;
	padding: 10px;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 20px 0 0 20px;
	border: 1px #e3e3e3 solid
}

.filter-button {
	padding: 10px;
	margin: 5px;
	background-color: blue;
	color: white;
	border: 0;
	cursor: pointer
}

.filter-button.active {
	background-color: blue
}

.filter-button.inactive {
	background-color: grey
}

@media screen and (max-width:1024px) {
	#startbody {
		padding: 0
	}

	#searchForm label {
		display: block
	}

	.search-container {
		box-sizing: border-box;
		float: none
	}

	#show {
		float: left;
		max-width: 100%;
		min-width: 375px;
		padding: 0;
		box-sizing: border-box;
		border-radius: 8px;
		margin: 20px 0 0 0;
		border: 1px #e3e3e3 solid
	}
}