/* {{pp-protected|small=yes}} */

/* TODO: All font-size declarations need review or something */

.climate-chart {

	border: 1px solid #c0c0c0;

	background-color: #f8f9fa;

	color: black;

	padding: 0.5em 0.7em;

	font-size: 88%;

	line-height: 1.5em;

	box-sizing: border-box;

}



@media (min-width: 720px) {

	.climate-chart {

		/* @noflip */

		margin: 0.5em 1em 0.5em 0;

		width: 22em;

	}

	

	.climate-chart-right {

		/* @noflip */

		margin: 0.5em 0 0.5em 1em;

		/* @noflip */

		float: right;

	}

	

	.climate-chart-left {

		/* @noflip */

		float: left;

	}

}



.climate-chart-title {

	font-weight: bold;

}



.climate-chart-secondary-title,

.climate-chart-explainer {

	font-weight: bold;

	font-size: 90%;

}



.climate-chart-internal {

	text-align: center;

	padding: 0.2em;

	font-size: 90%;

	width: 100%;

	border-spacing: 0;

}



.climate-chart-internal th {

	width: 1.5em;

	vertical-align: top;

	font-weight: normal;

}



.climate-chart-internal td {

	vertical-align: top;

}



.climate-change-explain-bar-temp,

.climate-change-explain-bar-precip {

	font-size: 90%;

}



.climate-change-explain-bar-temp > span {

	color: red;

}



.climate-change-explain-bar-precip > span {

	color: #ace;

}



.climate-chart-column {

	width: 1.6em;

	height: 17em;

	position: relative;

	padding: 0;

	margin: 0;

}



.climate-chart-column-spacer,

.climate-chart-column-spacer2 {

	height: 0;

	width: 1.6em;

	position: absolute;

	left: 0;

	padding: 0;

	margin: 0;

}



.climate-chart-column-spacer {

	bottom: 2em;

	border-bottom: dotted 1px #abc;

}



.climate-chart-column-spacer2 {

	bottom: 8em;

	border-bottom: dotted 1px #cba;

}



.climate-chart-column-precip-bar {

	background: #ace;

	position: absolute;

	bottom: 2em;

	left: .2em;

	width: 1.2em;

	overflow: hidden;

}



.climate-chart-column-value {

	position: absolute;

	left: 0;

	width: 1.6em;

	height: 1.5em;

}



.climate-chart-column-precip {

	color: blue;

	bottom: .5em;

	text-align: center;

}



.climate-chart-column-precip > span {

	font-size: 70%;

}



.climate-chart-column-temp-bar {

	background: #e44;

	position: absolute;

	left: .4em;

	width: 0.8em;

	overflow: hidden;

}



.climate-chart-column-high-temp,

.climate-chart-column-low-temp {

	color: red;

}



.climate-chart-column-high-temp > span,

.climate-chart-column-low-temp > span {

	 font-size: 80%;

}