plot-main-alt.css

/* style for the settings still on the top
 * without tabs for now
 */

html, body {
	font-family: sans-serif;
	height: 100%;
	margin: 0;
	padding: 0;
}

div span {
	margin-left: 10px;
}

/* top panel */
#settings-panel {
	float: left;
	width: 100%;
	height: 30%;
	font-size: 13px;
	overflow: hidden;
	background: #ededed;
	border-bottom: 1px solid gray;
}

/* top-left */
#chart-settings {
	width: 20%;
	height: 100%;
	float: left;
	padding: 10px;
	border-right: 1px solid gray;
	background: #ededed;
}

#chart-settings input {	width: 30%; }

/* middle-left; list view of series/files */
#series-view {
	float: left;
	display: inline block;
	background: #e1e1e1;
	height: 100%;
	border-bottom: 1px solid #bdbdbd;
}

/* series selection + button area */
.select-series {
	float: left;
	padding: 15px;
	height: 100%;
	background: #ededed;
}

#series-view span {
	margin-left: 5px;
	font-size: 12px;
}

/* contains options */
#series-view #set-series {
	float: left;
	padding: 10px;
	background: #e1e1e1;
}

/* selection list */
#series-view #series-list {
	margin-top: 10px;
	width: 125px;
	height: 50%;
}

/* tab + tab content region */
#tab-view {
	float: left;
	width: 30%;
	height: 100%;
	display: none; /* unused for now */
	background: #ededed;
	padding-left: 10px;
	border-right: 1px solid #bdbdbd;
}

/* tab area */
#tabs {
	margin: 0;
	padding: 5px;
	list-style: none;
	overflow: hidden;
}

/* individual tab */
#tabs li {
	float: left;
	display: block;
	padding: 5px;
	background-color: #bbb;
	margin-right: 5px;
	height: 17px;
	border-left: 1px solid gray; 
	border-right: 1px solid gray;
	border-top: 1px solid gray;
	z-index: 1;
}

#tabs li a { color: black; text-decoration: none; }
#tabs li.current { background-color: #ededed; }
#tabs li.current a { color: #000; text-decoration: none; }
#tabs li a.remove {	color: #f00; margin-left: 10px; }

/* displays on tab click */
.tab-content {
	padding: 5px;
	height: 100%;
	border-left: 1px solid gray;
	border-top: 1px solid gray;
	margin-left: 5px;
	margin-top: -6px;
	z-index: 2;
}

/* chart mouseover labels */
.edit {
	background-color: #FCF79F;
	position: absolute;
	display: none;
	padding: 10px;
	width: 220px;
	height: 80px;
	font-size: 13px;
}

.edit span {
	margin-left: 10px;
}

button {
	font-size: 13px;
	margin: 0;
}

/* remainder region containing chart */
#chart-container {
	float: left;
	display: inline block;
	margin-right: 0;
	width: 100%;
}

/* chart container */
#chart {
	position: relative;
	width: 70%;
	height: 60%;
	margin-left: 15%;
	margin-top: 3%;
	float: left;
	display: inline block;
	border: 1px solid gray;
	text-align: center;
}