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

html {
     overflow: 			scroll;
}

body {
	background:			#222222 url('stripe.png') center;
	border-top:			5px solid #FF9900;
	color:				#DDDDDD;
	font-family:		verdana,helvetica,sans-serif;
	font-size:			0.9em;
	line-height:		1.3em;
	margin:				1px;
}

h1 {
	font-size:			20px;
	position:			relative;
	text-align:			right;
	top:				70px;
}

h2 {
	color:				#0D58A6;
	font-family:		"Lucida Console";
	font-size:			30px;
	font-weight:		normal;
	letter-spacing:		0.15em;
	margin:				0 40px 0 0;
}

span {
	display:			block;
	font-size:			15px;
	padding:			15px 0 0;
}

#steam span a, #youtube span a, #twitter span a, .steam_more a, .youtube_more a, .twitter_more a {
	color:				#FF9900;
	display:			block;
	padding:			15px 0 0;
	text-decoration:	none;
}

#steam span a:hover, #youtube span a:hover, #twitter span a:hover, .steam_more a:hover, .youtube_more a:hover, .twitter_more a:hover {
	color:				#DDDDDD;
}

/* --------------------------------------------------  Layout */

#wrap {
	border-top:			0;
	margin:				50px auto;
	padding:			0;
	width:				540px;
}

#head {
	margin:				0 0 10px;
}

#steam, #youtube, #twitter {
	background:			url('../image/stripe.png');
	display:			block;
	min-height: 		100px;
	margin:				0 0 10px;
	padding:			25px 20px;
	position:			relative;
	text-align:			right;
	top:				-90px;
	width:				500px;
}

#foot {
	margin:				20px 0 0;
	padding:			0;
	text-align:			right;
}

/* --------------------------------------------------  expand/collapse */

.expand {
	background: url("../image/add.png") no-repeat scroll right center transparent;
	display:			block;
	height:				24px;
	float: 				right;
    position: 			relative;
	top: 				4px;
	width:				24px;
}

.expand:hover {
	background: 		url("../image/add_hover.png") no-repeat scroll right center transparent;
}

.collapse {
	background: 		url("../image/minus.png") no-repeat scroll right center transparent;
	display:			block;
	height:				24px;
	float: 				right;
    position: 			relative;
	top: 				4px;
	width:				24px;
}

.collapse:hover {
	background: 		url("../image/minus_hover.png") no-repeat scroll right center transparent;
}

.expand span, .collapse span, .direct span, h2 span {
	display:			none;
}

/* --------------------------------------------------  head */

#head img {
	position:			relative;
	right:				85px;
}

/* --------------------------------------------------  steam */

#steam  .direct {
	background:			url('../image/steam.png') no-repeat;
	float:				left;
	height:				100px;
	width:				125px;
}

#steam h2 {
	background: 		url("../image/mi1ky.png") no-repeat scroll right center transparent;
    height: 			35px;
}

#steam span span {
	padding: 			10px 0 15px;
}

#steam span .game {
	
	display:			inline;
	margin:				0 0 0 10px;
}

#steam span .game img {
	background:			#222222;
	border:				2px solid #FF9900;
	padding:			1px;
}

#steam span .game:hover img {
	border:				2px solid #FFFFFF;
}

/* --------------------------------------------------  youtube */

#youtube  .direct {
	background:			url('../image/youtube.png') no-repeat;
	float:				left;
	height:				100px;
	margin:				0 0 20px;
	width:				244px;
}

#youtube h2 {
	background: 		url("../image/mi1kytube.png") no-repeat scroll right center transparent;
    height: 			35px;
}

#youtube iframe {
	padding:			20px 0 0;
}

/* --------------------------------------------------  twitter */

#twitter  .direct {
	background:			url('../image/twitter.png') no-repeat;
	float:				left;
	height:				100px;
	width:				97px;
}

#twitter h2 {
	background: 		url("../image/mi1kytweet.png") no-repeat scroll right center transparent;
    height: 			35px;
}

/* --------------------------------------------------  foot */

#foot img {
	vertical-align:		text-top;
}
