.topimage { position: relative; min-height: 270px; }
	.topimage.nominheight { min-height: 0; }
	.topimage .topimageText { position: absolute; top: 50%; transform: translateY(-50%); width: 100%; z-index: 3; }
		.topimage .topimageText .mainHeader { max-width: 800px; width: 100%; text-align: center; margin: 0 auto 0 auto; font-size: 52px; color: #fff; }
		.topimage .topimageText h2 { text-align: center; margin: 15px auto 0 auto; font-size: 36px; color: #fff; }
			.topimage .topimageText h2 img { max-width: 100%; }
	.topimage .filter { height: 100%; width: 100%; position: absolute; bottom: 0; background: rgba(0,0,0,0.5); z-index: 2; }

	.textContent {max-width: 900px; margin: 0 auto 70px auto; }

#editorPuffs {width: 100%; overflow:hidden;}
	#editorPuffs .puffitem {width: 32%; margin: 0 2% 1.25% 0; float:left;}
	#editorPuffs .puffitem:nth-child(3n) { margin: 0 0 1.25% 0; }
		#editorPuffs .puffitem .image, #editorPuffs .puffitem a .image { width: 100%; display: block; overflow: hidden; position: relative; }
		#editorPuffs .puffitem .image img {width: 100%;}
		#editorPuffs .puffitem h2 {margin: 0 0 10px 0; font-size: 28px; line-height: 1em;}
		#editorPuffs .puffitem .content p {font-size: 16px;}

	.PagePuffList {margin: 25px 0 0 0;}

@media screen and (max-width: 700px) { 
	.topimage { min-height: 200px; display: flex; justify-content: center; overflow: hidden; }
	.topimage img { max-height: 250px !important; width: auto !important; flex: none; }

	.topimage .topimageText .mainHeader { width: 95%; font-size: 2.2em; }
	.topimage .topimageText h2 { width: 95%; font-size: 1.7em; }

	#editorPuffs .puffitem { width: 100%; margin: 0 0 25px 0; float: none; }
		#editorPuffs .puffitem:nth-child(3n) { margin: 0 0 25px 0; }


	.textContent { margin: 0 auto 7% auto; }
	#editorPuffs .puffitem h2 { font-size: 24px; }
}

@media screen and (max-width: 480px) {
	.topimage { min-height: 150px; }

		.topimage .topimageText .mainHeader { font-size: 1.8em; }
		.topimage .topimageText h2 { font-size: 1.3em; }
}