#chart-temp-container {
	overflow: hidden;
}


#chart-temp {
	float: left;
	width: 100%;
}
.chart-axis {
	font-size: 12px;
	font-family: Arial;
}

.chart-axis .domain {
	stroke: #666;
	fill: none;
}

#chart-temp-yaxis .domain {
	stroke: none;
	fill: none;
}

#chart-temp-xaxis .domain {
	stroke: none;
	fill: none;
}


#chart-temp-line-avg {
	fill: none;
	stroke: white;
	stroke-width: 2px;
}

#chart-rec-temp-deviation {
	fill: #FFF4DE;
}

#chart-avg-temp-deviation {
	fill: #FFE2A8;
}


.tick-line {
	stroke-width: 1px;
	stroke: #eee;
}

.tick-text {
	font-size: 10px;
	fill: #999;
}

#chart-freezing-line {
	stroke-width: 1px;
	stroke: #0061A5;

}

#chart-freezing-lbl {
	font-family: arial;
	font-size: 12px;
	font-weight: bold;
}

#chart-year-temp {
	stroke-width: 1px;
	stroke: black;
}

.forecast-bar-bg {
	fill: #eee;
}

.forecast-bar {
	fill: #F0BC56;
}


.chart-city-lbl {
	font-family: arial;
	font-weight: bold;
	font-size: 11px;
}

.chart-key-lbl {
	font-family: arial;
	font-weight: normal;
	font-size: 12px;
}

.chart-key-lbl-h {
	font-family: arial;
	font-weight: bold;
	font-size: 14px;
}


.chart-city-temp-lbl {
	font-family : Arial;
	font-weight: normal;
	font-size: 11px;
	fill: #ccc;
}

.chart-city-temp-lbl-l {
	font-family : Arial;
	font-weight: normal;
	font-size: 12px;
	fill: #ccc;
}

#temp-avg-day-circle {
	fill: black;
}

#chart-temp-table {
	display: none;
}

.chart-city-forecast-lbl {
		font-family: GuardianTitlepieceWeb-Regular, Georgia, monospace;
	font-weight: normal;
	font-size: 120%;
	fill: #000;
}

#temp-key-bg {
	fill: #fff;
}

.graphic-header {
	width: 75%;
	float: left;
}

.graphic-header-small {
	width: 25%;
	float: left;
	margin-top: 35px;
		font-family: GuardianTitlepieceWeb-Regular, Georgia, monospace;
	font-weight: normal;
	font-size: 120%;
	fill: #000;
}

@media screen and (max-width: 700px) {
	
	.graphic-header {
		width: 100%;
	}
	
	.graphic-header-small {
		display: none;
	}
	
	#temp-key-bg {
		display: none;
	}
	
	#chart-temp-table {
		width: 100%;
		float: left;
		display: block;
	}
	.temp-cell-header {
		width: 100%;
		font-family: GuardianTitlepieceWeb-Regular, Georgia, monospace;
		font-size: 150%;
		padding-bottom: 10px;
	}
	.temp-cell {
		float: left;
		background: #f6f6f6;
		width: 23%;
		margin: 0 1%;
	}
	.temp-value {
		padding-top: 5px;
		display: block;
		padding-left: 8px;
		font-family: GuardianTitlepieceWeb-Regular,Georgia, monospace;
	    font-weight: normal;
	    font-style: normal;
		font-size: 225%;
		line-height: 100%;
	}
	.temp-lbl {
		display: block;
		padding-left: 8px;
		font-family: arial;
		font-size: 100%;
	}
	
}