.div-ma-tbl-opt {
	margin: auto;
    width: 50%;
    /*border: 3px solid green;*/
    background: #D7E6FD;
    padding: 10px;
}
.ma-tbl-opt{
	/*margin: 0 auto;*/
	display: table; /* Make the container element behave like a table */
    width: 100%; /* Set full-width to expand the whole page */
    background-: #D7E6FD;
    /*text-align: center;*/
    
    
}
.ma-tbl-opt td{
	display: table-cell; 
	
	overflow:hidden; 
	line-height: 100%;
	/*text-align: center;*/
	height: 100%;
	padding: 0;
    border: 0;
	/*height: 10px;*/
}



.count-sect{
	height: 50%;	
	
}

.tx-sect{
	height: 50%;
}

.ma-chart-holder{
  width: 100vw;
  position: relative;
  left: calc(-50vw + 50%);
}

.ma-svg{
	/*height: 50%;*/
	width: 100%;
	display: block;
    margin: auto;
    border: 0;
    background-color: white;
}

.d3-tip {
   /*position: absolute;*/
  line-height: 1;
  font-weight: bold;
  padding: 12px;
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
  border-radius: 2px;
}

/* Creates a small triangle extender for the tooltip */
.d3-tip:after {
  box-sizing: border-box;
  display: inline;
  font-size: 10px;
  width: 100%;
  line-height: 1;
  color: rgba(0, 0, 0, 0.8);
  content: "\25BC";
  position: absolute;
  text-align: center;
}

/* Style northward tooltips differently */
.d3-tip.n:after {
  margin: -1px 0 0 0;
  top: 100%;
  left: 0;
}

.arrow_box {
	position: absolute;
	background: #88b7d5;
	border: 4px solid #c2e1f5;
}
.arrow_box:after, .arrow_box:before {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.arrow_box:after {
	border-color: rgba(136, 183, 213, 0);
	border-top-color: #88b7d5;
	border-width: 30px;
	margin-left: -30px;
}
.arrow_box:before {
	border-color: rgba(194, 225, 245, 0);
	border-top-color: #c2e1f5;
	border-width: 36px;
	margin-left: -36px;
}

.ma-yr-float{
	float: left;
	display: inline-block;
	width: 100%;
	height: 100%;
}



.div-ma-tbl-yrs-opt{
	margin: auto;
    /*border: 3px solid purple;*/
    background: #D7E6FD;
    padding: 10px;
}

.ma-yr-btn {
    border-width: 3px;
    border-color: #104E8B;
    border-radius: 10px;
    background-color: inherit;
    padding: 14px 28px;
    font-size: 16px;
    cursor: pointer;
    display: inline-block;
}

/* On mouse-over */
.ma-yr-btn:hover {background: #eee;}

.x-axis{
	color: black;
}

.y-axis{
	color: black;
}

.line {
  fill: none;
  stroke-width: 1.5px;
}


.lines, .point, .circle-wt {
  transition: stroke-width 250ms linear;
  -moz-transition: stroke-width 250ms linear;
  -webkit-transition: stroke-width 250ms linear;
}

.lines, .point.hover {
  stroke-width: 20px;
  stroke-opacity: .5;
}

/*.point, .circle-wt {
  transition: stroke-width 250ms linear;
  -moz-transition: stroke-width 250ms linear;
  -webkit-transition: stroke-width 250ms linear;
  border-color: pink;
  border-width: 2px;
}*/

.point.hover, .circle-wt.hover {
  stroke: #000 !important;
  stroke-width: 25px;
  stroke-opacity: .2;
}

ul {
  list-style-type: none;
}

.legend-rect {
  width: 10px;
  height: 10px;
  display: inline-block;
  padding: 2px;
  border-style: solid;
  border-width: 2px;
}

.label {
  margin-left: 10px;
}

#ma-zone-opts {
  width: 250px;
  float: left;
  /*background-color: steelblue;*/
}

#ma-stage-opts {
  width: 250px;
  height: 225px;
  float: left;
  /*background-color: yellow;*/
}

#ma-years-opts {
  width: 250px;
  height: 225px;
  float: left;
  /*background-color: yellow;*/
}


.axis-grid line {
  /*stroke: #def;*/
  stroke: #cdcdcd;
}

.ma-years{
	float: left;
}

/*data sheet colours*/ 
.ma-data-sheet td.green-cell{
  /*background-color: #00BFFF;*/
  background: rgba(206, 246, 206, 0.4);
}
.ma-data-sheet td.af{
  /*background-color: #00BFFF;*/
  background: rgba(0, 191, 255, 0.4);
}
.ma-data-sheet td.paam{
  /*background-color: #104E8B;*/
  background: rgba(16, 78, 139, 0.4);
}
.ma-data-sheet td.chal{
  /*background-color: #EE7600;*/
  background: rgba(238, 118, 0, 0.4);	
}
.ma-data-sheet td.cal{
  /*background-color: #BF3EFF;*/
  background: rgba(191, 62, 255, 0.4);	
}
.ma-data-sheet td.mob{
  /*background-color: #000080;*/
  background: rgba(0, 0, 128, 0.4);	
}
/*tx sheet colours*/
.ma-tx-sheet td.emb{
  /*background-color: #c16760;*/
  background: rgba(193, 103, 96, 0.4);
}
.ma-tx-sheet td.dm{
  /*background-color: #58a862;*/
  background: rgba(88, 168, 98, 0.4);
}
.ma-tx-sheet td.az{
  /*background-color: #bf61bb;*/
  background: rgba(191, 97, 187, 0.4);	
}
.ma-tx-sheet td.tef{
  /*background-color: #9b9c3b;*/
  background: rgba(155, 156, 59, 0.4);	
}
.ma-tx-sheet td.h2o2{
  /*background-color: #726bc9;*/
  background: rgba(114, 107, 201, 0.4);	
}
.ma-tx-sheet td.ivm{
  /*background-color: #c8863f;*/
  background: rgba(200, 134, 63, 0.4);	
}
.ma-tx-sheet td.ww{
  /*background-color: #61a0d0;*/
  background: rgba(97, 160, 208, 0.4);	
}
.ma-tx-sheet td.hydro{
  /*background-color: #d24b39;*/
  background: rgba(210, 75, 57, 0.4);	
}

/*.x-axis, .y-axis-grid, .y-axis-grid-rt, .tick {
	font-size: 15px;
}
*/