/*CSS Reset*/
* {
	font-family: Georgia, Arial, Sans-Serif;
	margin: 0;
	padding: 0;
	border: 0;
	outline: none;
	color: #fff;
}
/*Layout*/
html, .frame p {
	background-color: #2b4655;
}
html {
	background-image: url(../images/pattern.png);
	background-repeat: repeat;
	background-position: 0 0;
}
body {
	background: url(../images/light.png) no-repeat center 0;
}
#header, #stage, #footer {
	padding: 25px 0;
}
.container {
	width: 846px;
	margin: 0 auto;
}
/*Header*/
#header {
	background: url(../images/divider-horizontal.png) repeat-x 0 bottom;
	text-align: center;
}
h1 {
	display: inline-block;
	width: 225px;
	height: 51px;
	background: url(../images/logo.png) no-repeat 0 0;
	margin: 0 20px 0 0;
	text-indent: -9999px;
	zoom: 1;
 *display: inline;
}
h2 {
	display: inline-block;
	background: url(../images/divider-vertical.png) repeat-y 0 0;
	padding: 18px 0 18px 25px;
	font-size: 16px;
	zoom: 1;
 *display: inline;
}
/*Stage*/
h3 {
	font-family: 'Lucida Sans', Arial, Sans-Serif;
	position: absolute;
	top: 20px;
	left: 335px;
	font-weight: normal;
	color: #2d2d2d;
	text-shadow: 0 1px 0 #ccc;
	font-size: 13px;
}
h3 span {
	color: #2d2d2d;
}
#stage {
	background: url(../images/background.png) repeat 0 0;
}
#stage .container {
	position: relative;
	height: 409px;
	background: url(../images/stage.png) no-repeat 0 0;
}
.frame {
	position: absolute;
	text-transform: uppercase;
}
.frame p {
	font-family: Arial, Verdana, Sans-Serif;
	text-align: center;
}
.frame span {
	display: block;
}
.medium {
	top: 132px;
	left: 121px;
	width: 142px;
	height: 140px;
	background: url(../images/frame-medium.png) no-repeat 0 0;
}
.medium p {
	width: 120px;
	height: 105px;
	padding: 10px 0 0;
	margin: 11px 0 0 11px;
	font-size: 55px;
}
.medium span {
	font-size: 35px;
	line-height: 0.5em;
	padding: 0 0 10px;
}
.big {
	top: 118px;
	left: 240px;
	width: 168px;
	height: 167px;
	background: url(../images/frame-big.png) no-repeat 0 0;
}
.big p {
	width: 144px;
	height: 130px;
	padding: 9px 0 0;
	margin: 11px 0 0 12px;
	font-size: 85px;
}
.big span {
	font-size: 24px;
	line-height: 0;
	line-height: 0.2em;
	padding: 0 0 10px;
}
.small {
	top: 145px;
	left: 412px;
	width: 114px;
	height: 113px;
	background: url(../images/frame-small.png) no-repeat 0 0;
}
.small p {
	width: 96px;
	height: 83px;
	padding: 8px 0 0;
	margin: 9px 0 0 9px;
	font-size: 50px;
}
.small span {
	font-size: 12px;
	line-height: 0.3;
	padding: 0 0 10px;
}
.draft {
	top: 55px;
	left: 555px;
	width: 132px;
	height: 200px;
	background: url(../images/frame-draft.png) no-repeat 0 0;
	padding: 100px 2px 0;
}
.draft p {
	background: #fff;
	color: #000;
	padding: 25px 0 0 37px;
	font-size: 55px;
	line-height: 0.4em;
	text-align: left;
}
.draft span {
	position: relative;
	display: inline;
	color: #000;
	font-size: 14px;
	background: url(../images/text-edit.png) no-repeat 0 11px;
	padding: 0 0 0 5px;
 *line-height: 3.5em;
	margin: 0 20px 0 0;
}
.draft img {
	position: absolute;
	top: -2px;
	right: 0;
}
/*Footer*/
#footer {
	background: url(../images/shadow.png) no-repeat center 0;
}
#box {
	width: 726px;
	height: 87px;
	background: url(../images/box.png) no-repeat 0 0;
	padding: 0 30px 0;
	margin: 0 auto;
}
#box p {
	float: left;
	padding: 28px 0 0;
}
#social {
	float: right;
	margin: 23px 0 0;
}
#social li, #social li a {
	float: left;
	display: block;
}
#social li a {
	width: 28px;
	height: 28px;
	margin: 0 0 0 10px;
	background-image: url(../images/social-icon.png);
	background-repeat: no-repeat;
	text-indent: -9999px;
}
#facebook a {
	background-position: 0 0;
}
#facebook a:hover {
	background-position: right 0;
}
#twitter a {
	background-position: 0 -28px;
}
#twitter a:hover {
	background-position: right -28px;
}
#linkedin a {
	background-position: 0 -56px;
}
#linkedin a:hover {
	background-position: right -56px;
}
#instagram a {
	background-position: 0 -84px;
}
#instagram a:hover {
	background-position: right -84px;
}
#rss a {
	background-position: 0 -112px;
}
#rss a:hover {
	background-position: right -112px;
}
/*Mobile*/
@media only screen and (max-device-width: 480px) {
html {
	height: 416px;
}
#header, #footer {
	padding: 35px 0;
}
#stage {
	padding: 15px 0;
}
.container {
	width: auto;
}
h2 {
	display: block;
	background: none;
	text-align: center;
	padding: 0;
	margin: 5px 0 0;
}
#stage .container {
	width: auto;
	height: auto;
	background: none;
}
h3 {
	font-family: Georgia, Arial, Sans-Serif;
	position: static;
	font-size: 25px;
	text-align: center;
}
h3 span {
	display: block;
	font-size: 50px;
}
h3 span span {
	display: none;
}
.frame {
	display: none;
}
#box {
	background: none;
	width: auto;
}
#box p {
	margin: 0 0 20px;
	padding: 0;
	text-align: center;
	font-size: 18px;
}
#social {
	clear: both;
	float: none;
	width: 190px;
	margin: 0 auto;
}
#social li a {
	margin: 0 5px;
}
}