.clear {
	clear: both;
}



.hidden {
	visibility: hidden;
}

h1 {
	font-family: Helvetica, Arial, sans-serif;
}

p.intro {
	font-family: "Times New Roman", Times, serif;
}

html, 
body, 
#map-canvas {
	height: 100%;
}

#weather {
	font-weight: bold;
}

.resp_inner {
	width: 30%;
	margin-right: 2%;
	height: 100px;
	background-color: red;
	color: yellow;
	float: left;
	font-size: 36px;
	text-align: center;
}

.narrow {
	display: none;
}

@media (min-width: 801px) and (max-width: 1000px) {
	.wide {
		display: none;
	}
	.narrow {
		display: inline;
	}
	.resp_inner {
		background-color: blue;
		font-size: 24px;
		height: 75px;
	}
}

@media (min-width: 601px) and (max-width: 800px) {
	.wide {
		display: none;
	}
	.narrow {
		display: inline;
	}
	.resp_inner {
		background-color: green;
		font-size: 12px;
		height: 50px;
	}
}

@media (max-width: 600px) {
	.wide {
		display: none;
	}
	.narrow {
		display: inline;
	}
	.resp_inner {
		background-color: purple;
		font-size: 8px;
		height: 25px;
	}
}