Hello Computer User!

Hello Mobile User!

Welcome to the Responsive Design Demonstration.

This is the computer viewport. Resize your browser window smaller or view this page on a mobile device to see responsive behavior in action.

This is the mobile viewport. View this page in landscape mode or on a computer to see responsive behavior in action.

Headline 2

This is the same code... same single html, css, and javascript file. Header images are deliberately swapped out to facilitate faster pageloads on mobile devices and higher quality/footprint for desktop machines.

Sidebar content is only loaded on full computer view.

Sidebar content is not added to mobile view for a simplified mobile experience.

Headline 3

This is the paragraph that accompanies the H3 headline.

• Unordered List Line Item 1
• Unordered List Line Item 2

This is the paragraph with a reference to code and pre tags.

			
@media only screen and (max-width:480px){
body {
	background-color:#F00;
}
h1, h2, h3, h4 {
	text-align:center;
	text-transform:uppercase;
	color:#FFF;
	border-top: solid 1px #FFF;
	border-bottom: solid 1px #FFF;
}