#coralCover, #nitrogen {
	height: 400px;
}

.actual, .target, .current, .nocots, .baseline {
	fill: none;
	stroke-width: 2;
}

.actual {
	stroke: #c2491f;
}

.nocots, .noCOTSline {
	stroke: #49c2d0;
}

.current, .COTSline {
	stroke: #abb8bd;
}

.noCOTSline, .COTSline {
    stroke-dasharray: 3,3;
} 

.target {
	stroke: #4d4d4d;
}

.trend {
	fill: none;
	stroke-width: 1;
	stroke: #c2491f;
	stroke-dasharray:5,5;
}

.baseline {
	stroke: #218290;
	stroke-width: 1;
}

.baselineLabel {
	fill: #218290;
}

.actualCirc. .targetCirc, .tipRect, .tipRectCOTS, .tipRectnoCOTS {
	opacity: 0.8;	
}

.actualCirc:hover, .targetCirc:hover {
	opacity: 1;	
}

.actualCirc, .trend2025, .actual2014 {
	fill: #c2491f;
}

.targetCirc, .tipRect, .targ2018, .targ2025 {
	fill: #4d4d4d;
}

.tipRectCOTS, .realLabel {
	fill: #7a9098;
}

.tipRectnoCOTS, .noCOTSLabel {
	fill: #49c2d0;
}

.targ2018, .targ2025, .trend2025, .actual2014, .noCOTSLabel, .baselineLabel, .realLabel {
    font: 0.9em BrandonRegular, sans-serif;
}

.tip, .tipComp, .tipnoCOTS, .tipCompnoCOTS, .tipCOTS, .tipCompCOTS {
  font: 1rem BrandonRegular, sans-serif;
  fill: #fff;	
  text-anchor: middle;
}

.tipCompCOTS, .tipCompnoCOTS {
  font-size: 0.9rem;
}

.tipBold, .tipBoldCOTS, .tipBoldnoCOTS {
  font: 2.3em BrandonBold, sans-serif;
  fill: #f2f6cb;	
  text-anchor: middle;
}

.tipBold {
  fill: #f2f6cb;	
}

.tipBoldCOTS {
  fill: #4d4d4d;	
}

.tipBoldnoCOTS {
  fill: #247f92;	
}

.date {
	color: #ccc;
	margin-left: 0;
	display: block;
}

.value {
	color: #fff;
	margin-left: 0;
}

.focus, .ccFocus {
	position: relative;
}

.vertLine {
	stroke: #4d4d4d;
    stroke-dasharray: 3,3;
    opacity: 0.5;
} 

@media only screen and (max-width: 570px) {
  
	#coralCover, #nitrogen {
		height: 260px;
	}

}