* { font-family:Helvetica, 'Segoe UI', 'Trebuchet MS', Calibri, Arial, Tahoma, sans-serif; font-size:12px; }

input[type='radio'] { margin:2px; }

body { overflow:auto; }

input[type='text'] { margin:0px 0px 2px; text-align:right; }
input[type='number'] { width:40px; text-align:right; }
textarea { width:134px; tab-size:20; margin:0px; }
textarea[name='tracetext'] { height:141px; }
textarea[name='peaktext'] { height:141px; }
textarea[name='histotext'] { height:141px; }

body { background-color:#f8f8f8; margin:0px; font-family:sans-serif; font-size:12px; padding:4px 8px;}


#inputdata, #findpeaks, #outputpeaks, #outputhisto {
	width:134px; border-bottom:1px dotted #aaa;
	padding:6px 0px;
}
#outputhisto { border:none; }
#inputdata { padding:0px 0px 6px; }


input[name='divide'], input[name='downsample'] { margin-left:34px; }


button {
	height:24px;
	width:140px;
	position:relative;
	text-align:center;
	color:#333;
	padding-top:0px;
	border:1px solid #999;
	border-radius:4px;
	background:linear-gradient(to bottom,#fff,#ccc);
	cursor:pointer;
	margin-top:6px;
}
button:active {
	padding-left:4px; padding-right:2px;
	background:linear-gradient(to top,#eee,#888);
}
button[disabled] {
	color:#888;
	background:#eee;
	border:1px solid #aaa;
}


p { margin:3px 0px; }
label { line-height:20px; }


.binright {
	display:inline-block;
	position:absolute;
	left:89px;
	/*float:right;*/
}

.floatright {
	display:inline-block;
	float:right;
}


label, body {
	cursor:pointer;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
}

input.disclose+label~div { display:none; }
input.disclose:checked+label~div { display:block; }

input.disclose { display:none; }
input.disclose+label span {
	width:0px; height:0px;
	border-top:5px solid transparent;
	border-bottom:5px solid transparent;
	border-left:5px solid #666;
	border-right:none;
	float:left;
	margin:4px 8px 0px 12px;
}
input.disclose:checked+label span {
	border-left:5px solid transparent;
	border-right:5px solid transparent;
	border-top:5px solid #666;
	border-bottom:none;
	margin:6px 6px 0px 9px;
}

.extra { margin-top:4px; }
.extra {
	-moz-column-gap:6px;
	-moz-column-count:2;
	-webkit-column-gap:6px;
	-webkit-column-count:2;
	column-count:2;
	column-gap:6px;
}

p.group, div.group {
	background:#fff;
	border:1px solid #ccc;
	border-radius:4px;
	padding:4px;
	margin:0px 0px 4px 0px;
	-webkit-column-break-inside: avoid;
	page-break-inside: avoid;
	break-inside: avoid;
}
p.notes { height:66px; font-size:10px; padding-top:1px; }

.extra p:nth-child(2) {
	-webkit-column-break-after: always;
	break-after: column;
}

input[type="text"]:disabled { color:#888; }

hr { border:none; border-top:1px solid #ccc; margin-top:12px; margin-bottom:4px; }



#peakform { position:relative; }
#inputdata, #peakwindow, #outputpeaks, #outputhisto { position:relative; left:0px; }
#inputdata { top:0px; }
#peakwindow { top:0px; }
#outputpeaks { top:0px; }
#outputhisto { top:0px; }
#trace { position:absolute; left:150px; width:845px; height:350px; }
#peaks { position:absolute; left:150px; top:350px; width:530px; height:350px; }
#histogram { position:absolute; left:518px; top:350px; width:322px; height:350px; }



/***********************/

/*body { background:#f8f4f0; font-family:Arial, Helvetica, sans-serif; font-size:12px; }*/

svg.zoomx #xside, svg.zoomx #x-labels { cursor:ew-resize; }
svg.zoomy #yside, svg.zoomx #y-labels { cursor:ns-resize; }
svg.zoomx #plotoverlay, svg.zoomy #plotoverlay { cursor:zoom-in; }

svg .axislabel { font-size:12px; }
svg .axistitle { font-size:14px; }
svg {font-family:Arial, Helvetica, sans-serif; }

svg .plotframe { fill:#f8f8f8; }
svg .plotback { fill:#fff; }

svg, svg * {
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
}

svg rect { shape-rendering:crispEdges; }

.thresholdhandlehtml {
	width:12px;
	height:11px;
	border-radius:7px 3px 3px 7px;
	background:#888;
	border:1px solid #000;
	opacity:0.3;
	cursor:row-resize;
}
.thresholdlinehtml {
	border-top:1px dotted #000;
	opacity:0.3;
}

.thresholdhandle {
	fill:#888;
	stroke-width:1;
	stroke:#000;
	opacity:0.3;
	cursor:row-resize;
}
.thresholdline {
	opacity:0.3;
	stroke-dasharray:1 1;
	stroke-width:1;
	stroke:#000;
}