@charset "utf-8";
@import url(/scripts/styles/menu.css);

main > h2 {text-align: center; margin: 0 0 0.25em;}
.newFlash:nth-of-type(1) {position: absolute; top: 1em; left: 11em;} 
.genmenu {clear: both;}
#flexintro {display: flex;}
.btnmore {margin: 8px 0 0;}

@media screen 
{
	#map {background-image: url(images/hampshire_css.png); background-position: 0 0; background-repeat: no-repeat;  margin: 10px auto; /*width: 379px; */height: 400px;} /* height is 403px without this */
	#hampshireImage {width: 379px; height: 400px;}
}
@media print 
{
	/*#map {display: none;}*/
}

@media only screen and (max-width: 750px) 
{
	#flexintro {flex-direction: column;}
}

@media only screen and (max-width: 520px) 
{
	/*#hampshireImage {width: 340px; height: 359px;}
	#hampshiremap {width: 340px; height: 359px;} Has no effect
	#map {background-size: 340px 1794px; width: 340px; height: 359px; margin: 0 calc((100% - 340px) / 2);}*/
	#map {transform: scale(calc(340 / 379)); transform-origin: left;}
}