/* FIVE FOUR CLOTHING */
/* Media Page Stylesheet
----------------------------------------------------------------------------- */


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


	#content {

		float: none;
		width: 800px;

		}

	#press {

		float: left;
		margin-top: 45px;
		height: 200px;
		overflow: hidden;

		}
		
		
/* Content
----------------------------------------------------------------------------- */


	#content > div {

		float: left;
		width: 100%;
		border-top: 1px solid #ccc;
		padding-top: 20px;
		overflow-x: hidden;

		}

	.clear {

		clear: left;

		}
		
	.hide {
	
		display: none;
	
		}
		
		
/* Actions */


	#content .actions {
	
		width: 100%;
		position: relative;
		margin: 0 6px 0 0;
	
		}
		
	#content .actions li {
	
		float: right;
		margin: 0 0 20px 20px;
	
		}
		
	.actions a.browse {
	
		height: 12px;
		background: url('../images/page-media/a-seemore.png') right center no-repeat;
	
		}
		

/* Headings
----------------------------------------------------------------------------- */

		
	#content h3 {
	
		text-indent: -5000px;
		overflow: hidden;
		height: 25px;
		background-position: left center;
		background-repeat: no-repeat;
	
		}


/* Photos
----------------------------------------------------------------------------- */


	.photos {
	
		float: left;
		margin: 0 0 18px -5px;
	
		}

	.photos li {
	
		float: left;
		margin: 0 0 5px 5px;
	
		}

	.photos a {
	
		display: block;
		overflow: hidden;
	
		}
		
	.photos img {
	
		display: block;
		width: 100%;
	
		}
		
	.photos strong {
	
		display: none;
	
		}
		
		
/* Media Clips
----------------------------------------------------------------------------- */
			
		
	.clips {
	
		float: left;
		margin-left: -20px;
	
		}
		
	.clips li {
	
		float: left;
		margin: 0 0 20px 20px
	
		}
		
	.clips a {
	
		display: block;
		overflow: hidden;
		margin-bottom: 5px;

		}
		
	.clips img {
	
		display: block;
		width: 100%;
	
		}
		
	.clips div {
	
		font-size: 14px;
		line-height: 1.2em;
		font-weight: bold;
		color: #000;
	
		}
		
	.clips div p {
	
		font-size: 11px;
		color: #959595;
		font-weight: normal;
		margin: 0;
	
		}
			
	.clips .actions {
	
		display: none;
	
		}		
		
		
/* Common Exceptions
----------------------------------------------------------------------------- */
		

	div#jump,
	div#look,
	div#photography,
	div#projects,
	div#portraits,
	div#faces {
	
		width: 390px;
	
		}
		
	#jump,
	#photography,
	#portraits {
	
		padding-right: 20px;
	
		}

		
/* Celebrity Fans
----------------------------------------------------------------------------- */
		
		
	#celebs .photos {
	
		margin-left: -20px;
	
		}
		
	#celebs h3 {
	
		background-image: url('../images/page-media/h3-celebrities.png');
	
		}
		
	#celebs .photos {
	
		margin-bottom: 5px;
	
		}	
		
	#celebs .photos li {
	
		width: 132px;
		padding: 6px;
		background: #dcdcdc;
		margin: 0 0 20px 20px;
		text-align: right;
		min-height: 217px;
	
		}
		
	#celebs .photos a {
	
		height: 170px;
		margin-bottom: 5px;
		position: relative;
	
		}
		
	#celebs img {
	
		height: 100%;
		width: auto;
	
		}
		
	#celebs img.portrait {
	
		width: 100%;
		height: auto;
	
		}
		
	#celebs a span {
	
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		background: #111;
		background: rgba(0,0,0,.6);
		padding: 70px 10px 10px;
		color: #fff;
		text-align: center;
		font-weight: bold;
		text-decoration: none;
		opacity: 0;
		filter: alpha(opacity=0);
		-webkit-transition: opacity .25s ease-out;
		-moz-transition: opacity .25s ease-out;
	
		}
		
	#celebs a:hover span {
	
		opacity: 1;
		filter: alpha(opacity=100);
	
		}
		
	#celebs h4 {
	
		margin: 0;
	
		}
		
	#celebs dt,
	#celebs dd {
	
		display: none;
	
		}
		
	#celebs dd.photographer {
	
		display: block;
	
		}
		
	#celebs .actions {
	
		display: none;
	
		}
		
		
/* TV
----------------------------------------------------------------------------- */
		
		
	div#tv {
	
		width: 490px;
		padding-right: 20px;
	
		}
		
	#tv h3 {
	
		background-image: url('../images/page-media/h3-tv.png');
	
		}		
	
	#tv .clips > li {
	
		width: 235px;
	
		}
		
	#tv .clips > li > a {
	
		height: 134px;
	
		}
		
	#tv img {
	
		margin-top: -21px;
	
		}
		
	#tv .actions {
	
		display: none;
	
		}
		
	
/* Social
----------------------------------------------------------------------------- */
		
		
	div#social {
	
		width: 290px;
	
		}
		
	#social h3 {
	
		text-indent: 0 !important;
	
		}
		
	#social h3 a {
	
		float: left;
		height: 25px;
		text-indent: -5000px;
		overflow: hidden;
		background-position: center center;
		background-repeat: no-repeat;
		opacity: .5;
		filter: alpha(opacity=50);
		
		}
		
	#social h3 a.selected,
	#social h3 a:hover {
	
		opacity: 1;
		filter: alpha(opacity=100);
	
		}
		
	#social h3 .facebook {
	
		width: 55px;
		background-image: url('../images/page-media/h3-facebook.png');
	
		}
		
	#social h3 .twitter {
	
		width: 46px;
		background-image: url('../images/page-media/h3-twitter.png');

		}
		
	#social h3 span {
	
		float: left;
		font-size: 11px;
		line-height: 25px;
		padding: 0 10px;
		opacity: .4;
	
		}
		
		
/* Twitter */


	#twitter {
	
		padding: 25px 30px;
		background: #dcdcdc;
		height: 249px;
		position: relative;
		
		}
		
	.tweet_list {
	
		position: relative;
		display: none;
	
		}
		
	.tweet_list li {
	
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
	
		}
		
	.tweet_text {
	
		display: block;
		font-size: 23px;
		line-height: 1em;
		font-weight: bold;
	
		}
		
	.tweet_time {
	
		display: block;
		padding: 10px 0;
	
		}
		
	.tweet_time a {
	
		text-decoration: none;
	
		}
		
	#follow {
	
		position: absolute;
		bottom: 25px;
		left: 30px;
		display: block;
		text-indent: -5000px;
		overflow: hidden;
		width: 210px;
		height: 30px;
		background: #3c3c3c url('../images/page-media/a-follow.png') center center no-repeat;
		border-radius: 20px;
	
		}
		
		
/* Graduating Class
----------------------------------------------------------------------------- */
		
		
	div#graduating {
	
		width: 490px;
		padding-right: 20px;
	
		}
		
	#graduating h3 {
	
		background-image: url('../images/page-media/h3-graduating.png');
	
		}		
		
		
/* Features
----------------------------------------------------------------------------- */
		
		
	div#features {
	
		width: 290px;
	
		}
		
	#features h3 {
	
		background-image: url('../images/page-media/h3-features.png');
	
		}		
		
	#features .photos a {
	
		width: 142px;
		height: 80px;
	
		}
		
		
/* Gallery
----------------------------------------------------------------------------- */
			
		
	#gallery .photos a {
	
		width: 194px;
		height: 110px;
	
		}
		
	#gallery h3 {
	
		background-image: url('../images/page-media/h3-gallery.png');
	
		}		
		
		
/* Jump
----------------------------------------------------------------------------- */
		
		
	#jump h3 {
	
		background-image: url('../images/page-media/h3-jump.png');
	
		}	
				
	#jump .photos a {
	
		width: 93px;
		height: 109px;
	
		}		

		
/* Look
----------------------------------------------------------------------------- */
		

	#look h3 {
	
		background-image: url('../images/page-media/h3-look.png');
	
		}	
		
	#look .photos a {
	
		width: 192px;
		height: 109px;
	
		}
		
	#look img {
	
		margin-top: -20%;
	
		}
		
		
/* Photography
----------------------------------------------------------------------------- */
		

	#photography h3 {
	
		background-image: url('../images/page-media/h3-photography.png');
	
		}	
		
	#photography .photos a {
	
		width: 93px;
		height: 53px;
	
		}	
		
	#photography img {
	
		margin-top: -20%;

		}
		
		
/* Special Projects
----------------------------------------------------------------------------- */
		

	#projects h3 {
	
		background-image: url('../images/page-media/h3-projects.png');
	
		}	
		
	#projects .photos a {
	
		width: 93px;
		height: 53px;
	
		}
		
		
/* Portraits
----------------------------------------------------------------------------- */


	#portraits h3 {
	
		background-image: url('../images/page-media/h3-portraits.png');
	
		}
		
	#portraits .photos a {
	
		width: 93px;
		height: 53px;
	
		}
		
		
/* Faces
----------------------------------------------------------------------------- */
		

	#faces h3 {
	
		background-image: url('../images/page-media/h3-faces.png');
	
		}	
		
	#faces .photos a {
	
		width: 93px;
		height: 93px;
	
		}
		
		
/* Overlay
----------------------------------------------------------------------------- */


	#overlay {
	
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background: #111;
		background: rgba(0,0,0,.8);
		z-index: 100;
	
		}
		
	#overlay > div {
	
		position: absolute;
		top: 50%;
		left: 50%;
		width: 650px;
		height: 395px;
		height: px;
		border: solid 20px #000;
		margin: -218px 0 0 -345px;
		background: #000 url('../images/page-media/loading.gif') center center no-repeat;
		-webkit-box-shadow: rgba(0,0,0,.9) 0 0 20px;
		-webkit-animation: load .5s 1;

		}
		
	#overlay.photo > div {
	
		width: 650px;
		height: 650px;
		margin-top: -345px;
		line-height: 650px;
		text-align: center;
	
		}
		
	#overlay.photo > div img {
	
		vertical-align: middle;
		max-width: 100%;
		height: auto;
	
		}
		
	#overlay.photo > div.portrait img {
	
		max-width: none;
		max-height: 100%;
		width: auto;
	
		}
		
	#overlay .close {
	
		display: block;
		position: absolute;
		top: -30px;
		right: -30px;
		width: 30px;
		height: 30px;
		text-indent: -5000px;
		overflow: hidden;
		background: #000 url('../images/page-media/a-close.png') center center no-repeat;
		border-radius: 30px;
		opacity: .5;
		filter: alpha(opacity=50);
	
		}
		
	#overlay .close:hover {
	
		opacity: 1;
		filter: alpha(opacity=100);
	
		}
		
		
/* Photos
----------------------------------------------------------------------------- */
			
		
	#photos .photos a {
	
		width: 194px;
		height: 110px;
	
		}		
	
		
/* Misc
----------------------------------------------------------------------------- */
		
		
	a.comments {
	
		display: none;
	
		}