body, input {
    font: 300 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
}

.copynotice {
	color: #aaaaaa;
	margin-top: 10px;
	display:block;
}

.copynotice a:link, .copynotice a:visited{
	color: #aaaaaa;
}

#page
{
  width: 100%;
  max-width: 1600px;
  display: block;
  margin: 0 auto;
}

#intro
{
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
  display: block;
}

#firstgroup
{
display: flex;
flex-direction: column;
min-width: auto;
margin: 3px;
}

#secondgroup
{
display: flex;
flex-direction: column;
min-width: auto;
margin: 3px;
}

#thirdgroup
{
display: flex;
flex-direction: column;
flex-grow: 1;
}


.section {
   /*border: 1px solid black;*/
	flex-grow: 1;
}   

.section-header {
	font-variant: small-caps;
	background-color: lightgray;
	padding-top: 0.3em; 
	padding-left: 0.3em; 

}

.section-content {
	padding: 3px;
}

@media (min-width: 1500px)
{
.fields {
	display: flex;
	flex-direction: row;
	width: 100%;
}

#thirdgroup
{
flex-direction: row;
}

}


@media (min-width: 1000px) and (max-width: 1500px)
{
.fields {
	display: flex;
	flex-direction: row;
	width: 100%;
}
#secondgroup
{
	flex-direction: row;
}

}


@media (min-width:650px) and (max-width: 1000px)
{
.fields {
	display: flex;
	flex-direction: column;
	width: 100%;
}

#firstgroup
{
	flex-direction: row;
}
#secondgroup
{
	flex-direction: row;
}
}

@media (max-width:650px)
{
.fields {
	display: flex;
	flex-direction: column;
	width: 100%;
}

#firstgroup
{
	border-bottom: 2px solid gray;
}

.section-content
{
	margin: 0 auto;
	display: block;
}

}



#graph
{
height: auto;
display: flex;
flex-direction: column;
flex-grow: 1;
padding: 3px;
}

#svgContainer
{
	height: auto;
}

.hidden{ display:none;}

th
{
	font-size: 13px;
	font-weight: 300;
}

.output {
	text-align:right;
	white-space: nowrap;
	}
.data {
	width:4em;
}
#basicdata {
	white-space: nowrap;
}
#computed {
	white-space: nowrap;
}


#Name-w {width: 14em;}

#waggle th {
 padding-right: 1em;
}

pre
{
  padding-left: 1em;
}
svg { 
/*overflow: hidden;*/
  width: 100%;
}
#drawing{
	cursor: crosshair;
}

.centeredImage
{
	text-align:center;
	margin-top:0px;
	margin-bottom:0px;
	padding:0px;
}

dl
{
	margin-left: 3em;
}

dt {
	font-weight: bold;
}
dt:after
{ 
	content: ":";
}

dd {
	margin: 0 0 0 2em;
}

.dataurl
{
	width: 100%;
	word-wrap:break-word;
	resize: none;
}

.measurementTab
{
	padding: 10px;
}

.delete
{
	color:#ff0000;
	cursor: pointer;
}

.watch
{
    border: none;
    display: inline-block;
    width: 30px;
    background: url("img/Stopwatch.svg") no-repeat;
    background-position: 5px;
}

.stoppedWatch
{
	background-color: lightgray;
}

.runningWatch
{
	background-color:#ff0000;
}