body {
  font: 18px/1.5em Arial;
}

pre {
  margin: 0.25em;
}

h1 {
  position: relative;
/*   left: 440px;
  top: 30px; */
/*   width: 850px; */
  width: 100%;
  text-align: center;
  font: bold 22px Arial;
}

h2 {
  position: absolute;
  left: 40px;
  top: 30px;
  font: bold 20px "proxima-nova", Helvetica, Arial, sans-serif;
}

h3 {
  font-family: Helvetica, Arial, sans-serif;
  font-size: 14px;
}

h4 {
  text-align: center;
  font: bold 22px "proxima-nova", Helvetica, Arial, sans-serif;
}
  
.content-container {
	position: relative;
	top: 80px;
	width: 100%;
	height: 850px;
}
.content-container:after {
	content: "";
	display: table;
	clear: both;
}
  
.equipment-container {
	position: absolute;
	margin: auto;
	width: 20%;
	height: 75%;
/* 	border: 1px solid red; */
	padding: auto;
	float: left;
	
	  
  }
  
  .chart-container {
	position: absolute;
	margin-left: 20%;
	height: 75%;
	width: 60%;
	padding: auto;
  }
  
  canvas {
/* 	 border: 1px dotted red; */
  }
  
  .timescale-buttons {
	  text-align: center;
/* 	  border: 1px solid red; */
	  margin: auto;
  }
  
  .download-buttons {
/* 	border: 1px solid red; */
	margin: auto;
	text-align: center;
  }
  
  .readout-container {
	position: absolute;
	margin-left: 80%;	  
	height: 75%;
	width: 20%;
	padding: auto;
	/* font: bold 18px Arial; */
/* 	 border: 1px dotted red; */
  }
  
  .time-and-date {
	  position: relative;
	  text-align: center;
  }
  
  .footer {
	position: relative;
	/* bottom: 0; */
	text-align: center;
/* 	 border: 1px dotted red; */
	 width: 100%;
	 margin: auto;
	
	color: #999;
  }
  
  .time {
  position: relative;
/*   bottom: 20px;
  height: 50px;
  width: 850px; */
  width: 49%;
  text-align: center;
  font-size: 14px;
  color: #999;
/*   border: 1px dotted red; */
  margin: 0 auto;
  }
    .date {
  position: relative;
/*   bottom: 40px;
  height: 50px;
  width: 850px; */
  width: 49%;
  text-align: center;
  font-size: 14px;
  color: #999;
/*   border: 1px dotted red; */
  margin: 0 auto;
  }