/* --------------------------------------------------------------
  
[4*] Content Styles

-------------------------------------------------------------- */

#content {
	position:relative;
	float:left;
	clear:both;
	width:820px;
	margin-top:20px;
}

.panel {
	position:relative;
	color:#fff;
	margin-bottom:20px;
	padding:20px;
	background:#222527;
}


#intro p {
	font-size:24px;
	font-style: italic;
	font-weight:lighter;
	line-height:1.2;
	margin:5px 0;
}



#tweets small {
	display:block;
	margin-top:10px;
}

#featured {
	float:left;
	width:940px;
	height:201px;
	padding:0;
	background:red;
}



#work,
#experiments {
	position:relative;
	margin:0;
	padding:0;
	width:930px;
	height:191px;
	overflow:hidden;
	border:5px solid #b5d7fa;
}

.prev-next {
	position:absolute;
	z-index:1000;
	top:0;
	left:0;
	width:101px;
	padding:0 5px 5px 0;

}

.arrow {
	display:block;
	width:50px;
	height:50px;
	text-indent:-9999px;
	background:#222527;
	overflow:hidden;
	border:none;
	-webkit-transition:background-position 200ms ease;
	-moz-transition:background-position 200ms ease;
	-ms-transition:background-position 200ms ease;
	-o-transition:background-position 200ms ease;
	transition:background-position 200ms ease;
}

.arrow.left,
.arrow.up {
	float:left;
	margin-right:1px;
}

.arrow.right,
.arrow.down {
	float:right;
}

.arrow.left {
	background:url(../images/arrow-left.png) 0 0 no-repeat;
}

.arrow.left:hover {
	background-position:-50px 0;
}

.arrow.right {
	background:url(../images/arrow-right.png) -50px 0 no-repeat;
}

.arrow.right:hover {
	background-position:0 0;
}

.arrow.up {
	background:url(../images/arrow-up.png) 0 0 no-repeat;
}

.arrow.up:hover {
	background-position:0 -50px;
}

.arrow.down {
	background:url(../images/arrow-down.png) 0 -50px no-repeat;
}

.arrow.down:hover {
	background-position:0 0;
}