@charset "utf-8";

/* ---------- general ---------- */

body {
	background:#333333 url('test/images/background/bricks-1680x1050.jpg') no-repeat fixed top center;
	font-family: Arial, sans-serif;
	font-size: 14px;
}

html, body, #container {
}

body > #container {
	height: auto;
	min-height: 100%;
}

#main-wrap {
	position:relative;
	margin: 0 auto;
	padding-bottom:123px;
	width:1006px;
}

#background {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	overflow:hidden;
	z-index:-10;
}

/* ---------- END general ---------- */

/* ---------- menu ---------- */

#menu {
	position:absolute;
	left:181px;
	top:0;
	width:450px;
}
#menu ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
#menu ul li {
	display: inline;
	float:left;
	text-indent:-200px;
	overflow:hidden;
}
#menu ul li a {
	display:block;
	color: none;
	text-decoration: none;
	margin-top:55px;
	height:84px;
	width:86px;
	background-position: left bottom;
}
#menu ul li a:hover {
	background-position: center bottom;
}
#menu ul li a:active, #menu ul li.selected a {
	background-position: right bottom;
	width:86px;
}

/* home */

#menu ul li.home a {
	text-decoration: none;
	background: url('test/images/nav-home.png') left bottom no-repeat;
	width: 88px;
}
#menu ul li.home-blog a {
	text-decoration: none;
	background: url('test/images/nav-home-blog.png') left bottom no-repeat;
	width: 88px;
}
#menu ul li.home a:hover, #menu ul li.home-blog a:hover {
	background-position: center bottom;
	width: 88px;
}
#menu ul li.home a:active, #menu ul li.selected-home a, #menu ul li.home-blog a:active, #menu ul li.selected-home-blog a {
	background-position: right bottom;
	width: 88px;
}
/* END home */

/* blog */

#menu ul li.blog a {
	background: url('test/images/nav-blog.png') left bottom no-repeat;
}
#menu ul li.blog a:hover {
	background-position: center bottom;
}
#menu ul li.blog a:active, #menu ul li.selected a {
	background-position: right bottom;
}
/* END blog */

/* photos */

#menu ul li.photos a {
	background: url('test/images/nav-photos.png') left bottom no-repeat;
}
#menu ul li.photos a:hover {
	background-position: center bottom;
}
#menu ul li.photos a:active, #menu ul li.selected a {
	background-position: right bottom;
}
/* END photos */

/* portfolio */

#menu ul li.portfolio a {
	background: url('test/images/nav-work.png') left bottom no-repeat;
}
#menu ul li.portfolio a:hover {
	background-position: center bottom;
}
#menu ul li.portfolio a:active, #menu ul li.selected a {
	background-position: right bottom;
}
/* END work */

/* social media */

#menu ul li.social-media a {
	background: url('test/images/nav-social-media.png') left bottom no-repeat;
}
#menu ul li.social-media a:hover {
	background-position: center bottom;
}
#menu ul li.social-media a:active, #menu ul li.selected a {
	background-position: right bottom;
}
/* END work */

/* ---------- END menu ---------- */

/* ---------- layout ---------- */

/* content */

#content-wrap {
	position:relative;
	top:0;
	left:58px;
	margin: 0 75px 0 0;
	border:2px solid #000000;
	border-bottom:none;
	background: url('test/images/content.png') repeat;
	z-index:3;
}
#content {
	float:left;
	clear:none;
	width:720px;
	min-height:400px;
	margin:0px 0 0 0;
	padding:0 10px 0 10px;
}

/* END content */

/* logo */


#logo {
	position:absolute;
	left:0;
	top:53px;
	height:481px;
	width:60px;
	overflow:hidden;
	z-index:0;
}
#logo-blog {
	position:absolute;
	left:0;
	top:135px;
	height:293px;
	width:60px;
	overflow:hidden;
	z-index:0;
}
#logo a {
	display: block;
	height:481px;
	width:60px;
	background: url('test/images/logo-arrow-left.png') left no-repeat;
	z-index:1;
}
#logo-blog a {
	display: block;
	height:293px;
	width:60px;
	background: url('test/images/logo-arrow-left-blog.png') left no-repeat;
	z-index:1;
}
#logo a span, #logo-blog a span {
	text-indent:-300px;
	float:left;
}
#logo a:hover {
	background: url('test/images/logo-arrow-left.png') right no-repeat;
}
#logo-blog a:hover {
	background: url('test/images/logo-arrow-left-blog.png') right no-repeat;
}
/* END logo */

/* header elements */

#pipes-wrap {
	position:absolute;
	left:613px;
	top:0;
	clear:none;
}

#nav-arrow {
	position:relative;
	left:60px;
	top:0;
	height:139px;
	width:121px;
	background: url('test/images/nav-arrow-top-right.png') no-repeat;
	clear:none;
	z-index:0;
}
#nav-arrow.blog {
	background: none;
}
#nav-arrow-hover {
	position:absolute;
	left:0;
	top:34px;
	height:185px;
	width:185px;
	z-index:1;
}
#nav-arrow-hover a {
	display: block;
	width:185px;
	height:185px;
	overflow:hidden;
	z-index:2;
}
#nav-arrow-hover a:hover {
	background: url('test/images/nav-arrow-spots.png') no-repeat;
}
#nav-arrow-hover a span {
	text-indent:-300px;
	float:left;
}
#nav-arrow-bottom {
	position:relative;
	left:0px;
	top:-2px;
	height:35px;
	width:123px;
	background: url('test/images/nav-arrow-bottom-right.png') no-repeat;
}
#nav-pipe-junction {
	float:left;
	width:15px;
	height:139px;
	background: url('test/images/nav-pipe-junction.png') bottom left no-repeat;
}
#nav-pipe-straight {
	float:left;
	width:165px;
	height:139px;
	background: url('test/images/nav-pipe-straight.png') bottom repeat-x;
}
#nav-pipe-corner {
	float:right;
	width:213px;
	height:251px;
	background: url('test/images/nav-pipe-corner.png') bottom no-repeat;
}

#cosmopolitanaut {
	position:absolute;
	left:60px;
	top:33px;
	width:121px;
	height:111px;
	background: url('test/images/cosmopolitanaut.png') left no-repeat;
	clear:none;
	z-index:5;
}

#cosmopolitanaut:hover {
	background: url('test/images/cosmopolitanaut.png') right no-repeat;
}
#cosmopolitanaut a {
	display:block;
	background:none;
	width:121x;
	height:111px;
	overflow:hidden;
	z-index:5;
}
#cosmopolitanaut a span {
	text-indent:-300px;
	float:left;
}


/* END header elements */

/* sidebars */

#sidebar-wrap-1 {
	float:right;
	width:214px;
	height:auto;
	clear:both;
}
#sidebar-wrap-2 {
	position:relative;
	top:0;
	right:0;
	width:214px;
	height:auto;
	z-index:5;
}
#sidebar-menu {
	float:right;
	width:180px;
	height:100%;
	margin:0 18px 0 6px;
	padding:0 3px;
}

#lifestream {
	float:right;
	margin:0 0 0 8px;
	padding:0 21px 0 5px;
	width:180px;
	height:auto;
	background: url('test/images/banner-straight.png') repeat-y;
}
#lifestream-bottom {
	float:right;
	margin:0 0 0 8px;
	padding:0 21px 0 5px;
	width:180px;
	height:30px;
	background: url('test/images/banner-bottom.png') right no-repeat;
}
.friendfeed.widget .feed {
	padding:0 3px !important;
}
.friendfeed.widget,
div.friendfeed.widget div,
div.friendfeed.widget span,
div.friendfeed.widget img,
div.friendfeed.widget table,
div.friendfeed.widget tr,
div.friendfeed.widget td {
	font-family: Arial, sans-serif !important;
	background-color: transparent !important;
	padding: 0 !important;
	margin: 0 !important;
	border: none !important;
	text-align: left !important;
}
.friendfeed.widget,
.friendfeed.widget a:link,
.friendfeed.widget a:visited {
	color: #cc0000 !important;
	font-family: Arial, sans-serif !important;
	font-size: 8pt !important;
	text-decoration: none !important;
	border:none !important;
	width: auto !important;
}
.friendfeed.widget a:hover {
	background-color: #cc0000 !important;
	color: #ffffff !important;
	width:auto !important;
}
.friendfeed.widget .feed .entry .media img {
	border: 2px solid transparent !important;
}
.friendfeed.widget .feed .entry .media a:hover img {
	border: 2px solid #cc0000 !important;
}
.friendfeed.widget .summary a:link,
.friendfeed.widget .summary a:visited,
.friendfeed.widget .summary a:active {
	font-weight:bold !important;
	text-shadow: #cccccc 2px 2px 2px !important;
	font-size: 110% !important;
}
.friendfeed.widget .info,
.friendfeed.widget .info a:link,
.friendfeed.widget .info a:visited,
.friendfeed.widget .info a:active {
	font-size: 90% !important;
}

.friendfeed.widget .info {
	margin-left:30px !important;
	padding-bottom:10px !important;
}
.friendfeed.widget .feed .cluster .body {
	margin-left:0px !important;
}
.friendfeed.widget .feed .cluster .summary {
	margin-bottom:4px !important;
	margin-left:20px !important;
}

/* END sidebars */

/* footer */

#footer-wrap {
	position:relative;
	top:0;
	width:1006px;
	height:123px;
	margin: -123px auto 0 auto;
	clear: both;
}
#contact {
	float:left;
	width:95px;
	height:90px;
	margin-bottom:33px;
	overflow:hidden;
}
#contact a {
	display: block;
	width:95px;
	height:90px;
	overflow:hidden;
	background: url('test/images/contact.png') left no-repeat;
}
#contact a span {
	text-indent:-300px;
	float:left;
}
#contact a:hover {
	background: url('test/images/contact.png') right no-repeat;
}
#bottom-left {
	float:left;
	width:151px;
	height:123px;
	background: url('test/images/bottom-left.png');
}
#footer {
	float:left;
	width:642px;
	height:123px;
	background: url('test/images/footer-background.png') bottom repeat-x;
	text-align:center;
}
#footer ul {
	margin: 40px 0 0 0;
	font-size:90%;
}
#footer ul li {
	display:inline;
	padding: 0 8px;
	margin:0 auto;
	text-align:center;
	border-right: 1px solid #003366;
}
#footer ul li.last{
	border-right: none;
}
#bottom-right {
	float:left;
	width:118px;
	height:123px;
	background: url('test/images/bottom-right.png') bottom;
}

/* END footer */

/* ---------- END layout ---------- */

/* ---------- miscellaneous ---------- */

#clear {
	clear:both;
}

/* IE fix */
.ie-fix {
	.ie-fix:after {
		content: ".";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
		}
.ie-fix {
	display: inline-block;
}

/* Hide from IE on Mac */
* html .ie-fix {
	height: 1%;
}
.ie-fix {
	display: block;
	}
	
/* END hide from IE on Mac */

/* END IE fix */
/* ---------- END miscellaneous ---------- */