* {
margin: 0;
padding: 0;
}
body {
font: 12px/20px Arial, Sans-Serif;
text-align: center;
}
h1 {
margin: 0 0 20px;
padding: 0 0 10px;
font: 24px/20px Arial, Sans-Serif;
text-align: center;
text-shadow: 1px 1px 2px #ccc;
color: #555;
border-bottom: 3px double #eee;
}
h2 {
margin: 0 0 20px;
padding: 0 0 5px;
font: bold 18px/20px Arial, Sans-Serif;
letter-spacing: -1px;
color: #333;
border-bottom: 1px solid #eee;
}
strong {
margin: 0 0 5px;
display: block;
color: #666;
font-weight: normal;
}
a {
text-decoration: none;
color: #222;
}
	a:hover {
	text-decoration: underline;
	}
#container {
margin: 50px auto;
width: 700px;
text-align: left;
}
.classic {
float: left;
width: 340px;
}
.new {
margin-left: 20px;
float: right;
width: 340px;
}
.clear {
clear: both;
}
.demo {
margin: 0 0 20px;
}
.box {
margin: 0 auto;
width: 100px;
height: 100px;
background: #ccc;
}
.note {
font-style: italic;
text-align: center;
}
.note:before {
content: 'Note: ';
}