@charset "utf-8";

/* UNIVERSAL */

body {
	text-align: center;
	background: #e2e2e2 url('../images/body-bg.png') top center no-repeat;
	color: #5c5c5c;
	font-size: 12px;
	line-height: 140%;
	text-shadow: #F00 5px;
}

#wrapper {
	position: relative;
}

#top-panel-holder {
	height: 22px;
	width: 940px;
	margin: auto;
	position: relative;
	display: none; /* TEMPORARY - until I finish this section */
}

#news {
	position: absolute;
	top: 0;
	left: 10px;
	font-size: 11px;
}

a.blog-button {
	background: url('../images/top-buttons.png') -235px -2px no-repeat;
	width: 87px;
	height: 24px;
	display: block;
	text-indent: -99999px;
	position: absolute;
	right: 244px;
	top: 0;
}

a.blog-button:hover {
	background-position: -235px 0;	
}

/* LINKS (TOP PANEL) */

#links {
	position: absolute;
	top: 0;
	right: 112px;
}

#links #links-inner {
	border-bottom: 1px solid #00a3e7;
	height: 100%;
	background: url('../images/panel-bg.png');
	display: none;
	height: 308px;
	width: 330px;
}

#links #links-button a {
	width: 127px;
	height: 24px;
	display: block;
	background: url('../images/top-buttons.png') 0 -2px no-repeat;
	float: right;
	text-indent: -99999px;
}

#links #links-button a:hover {
	background-position: 0 0;
}

#links #links-button a.active {
	background-position: 0 -26px;
}

/* CONTACT (TOP PANEL) */

#contact {
	position: absolute;
	top: 0;
	right: 0;
}

#contact #contact-inner {
	border-bottom: 1px solid #00a3e7;
	height: 100%;
	background: url('../images/panel-bg.png');
	display: none;
	height: 308px;
	width: 330px;
}

#contact #contact-button a {
	width: 108px;
	height: 24px;
	display: block;
	background: url('../images/top-buttons.png') -127px -2px no-repeat;
	float: right;
	text-indent: -99999px;
}

#contact #contact-button a:hover {
	background-position: -127px 0;
}

#contact #contact-button a.active {
	background-position: -127px -26px;
}

/* HEADER */

#header {
	width: 960px;
	margin: auto;
	overflow: hidden;
	margin-bottom: 65px;
}

#header #logo {
	float: left;
	margin: 0 10px;
}

#header #logo h1 a {
	width: 380px;
	height: 209px;
	background: url('../images/logo.png') no-repeat;
	display: block;
	text-indent: -99999px;
}

#header #header-text-box {
	float: right;
	margin: 30px 10px 0 0;
	width: 550px;
	height: 179px;
	background: url('../images/header-text-bg.png') no-repeat;
}

#header #header-text-box #header-text-box-inner {
	padding: 10px 20px 10px 105px;	
}

#header #header-text-box #header-text-box-inner p {
	padding: 5px 0;
	text-align: left;
	font-size: 11px;
}

/* FOLLOW ME SECTION */

#follow {
	background: url('../images/follow-bg.png') repeat-x;
	overflow: hidden;
}

#follow #follow-inner {
	margin: auto;
	width: 960px;
}

#follow #follow-inner .follow-box {
	margin: 20px 10px 21px 10px;
	float: left;
}

#follow #follow-inner .follow-box a {
	display: block;	
	width: 220px;
	height: 104px;
	text-indent: -99999px;
	background: url('../images/follow-me-buttons.png') no-repeat;
}

#follow #follow-inner .follow-box a.follow01 {
	background-position: 0 0;
}

#follow #follow-inner .follow-box a.follow01:hover {
	background-position: 0 -104px;
}

#follow #follow-inner .follow-box a.follow02 {
	background-position: 0 -208px;
}

#follow #follow-inner .follow-box a.follow02:hover {
	background-position: 0 -312px;
}

#follow #follow-inner .follow-box a.follow03 {
	background-position: 0 -416px;
}

#follow #follow-inner .follow-box a.follow03:hover {
	background-position: 0 -520px;
}

#follow #follow-inner .follow-title {
	background: url('../images/follow-my-work.png')	center left no-repeat;
	width: 220px;
	height: 104px;
	text-indent: -99999px;
}

/* FOOTER */

#footer {
	width: 960px;
	margin: auto;
	padding: 20px 0;
	font-size: 11px;
}