body { font-family: arial }
div { font-size: 1.1em; margin-bottom:10px }
h1 { font-size: 1.7em; margin: 10px 30px }
ul { margin-top: 0 }
li { font-size: .8em }
img.mainimage { width:400px }
div.top-band { background: #acd; border:2px solid teal; color: teal; font-size:1.2em; height:25px; padding:5px; width:auto }
div.main { background: rgba(160, 192, 208, 0.8); border: 1px solid teal; float:left; font-size:1em; margin-left:30px; padding:10px; width:50% }

@media only screen and (max-width: 1100px) {
	img.mainimage { width:300px }
}

@media only screen and (max-width: 500px) {
	h1 { color:teal; font-size: 1em; margin: 5px 10px }
	div { font-size: .8em }
	div.main { margin-left: 10px; width:80% }
	div.top-band { font-size:.8em; height:15px; margin:0; padding:2px 5px }
}