/*
 * ========================================================================================================================
 *	RESET
 * ========================================================================================================================
 */
* 
{
	margin						: 0px;
	padding						: 0px;
	border						: 0px;
	
	font-size					: 100%;
	font-weight					: normal;
	font						: inherit;
	
	text-align					: left;
	vertical-align				: baseline;
	
	background-color			: transparent;
}

ol, ul
{
	list-style	: none;
}

blockquote, q 
{
	quotes	: none;
}

blockquote:before, blockquote:after, q:before, q:after 
{
	content	: '';
	content	: none;
}

table
{
	border-collapse	: collapse;
	border-spacing	: 0;
}

article, aside, details, figure, figcaption, footer, header, hgroup, nav, progress, section, audio, video, source, embed, track, canvas
{
	display	: block;
}

strong, b
{
	font-weight	: bold;
}

em, i 
{
	font-style	: italic;
}

html, body
{
	width	: 100%;
	height	: 100%;
}

body
{
	color		: #563e2e;
	font-family	: Helvetica, Arial, Sans-Serif;
	font-size	: 14px;
}

a
{
	color			: #c1ab86;
	text-decoration	: none;
}

a:hover
{
	text-decoration : underline;
}

/*
 * ========================================================================================================================
 *	VIEWPORT
 * ========================================================================================================================
 */
#viewport
{
	width 			: 740px;
	padding-left	: 12px;
	padding-right	: 12px;
	margin			: 0 auto;
}

/*
 * ========================================================================================================================
 *	HEADER
 * ========================================================================================================================
 */
#header
{
	padding-top		: 60px;
	padding-bottom	: 30px;
	margin-bottom	: 30px;
	border-bottom	: 1px solid #ccc;
}

#header h1
{
	display				: block;
	width				: 320px;
	height				: 32px;
	overflow			: hidden;
	margin				: 0 auto;
	
	text-indent			: -999px;
	
	background-size		: 320px 32px;
	background-repeat	: no-repeat;
	background-image	: url(../images/woodiebag-1.0.png);
}

/*
 * ========================================================================================================================
 *	BAGS
 * ========================================================================================================================
 */
#bags
{
	display			: block;
	margin-bottom	: 10px;
	font-size		: 0px;
}

#bags li
{
	display		: -moz-inline-stack;
	display		: inline-block;
	zoom		: 1;
	*display	: inline;
	width		: 185px;
	height		: 185px;
	overflow	: hidden;
}

/*
 * ========================================================================================================================
 *	MAIN
 * ========================================================================================================================
 */
#main
{
	display			: block;
	width			: 740px;
	height			: 422px;
	margin-bottom	: 10px;
}

/*
 * ========================================================================================================================
 *	CLIPS
 * ========================================================================================================================
 */
#clips
{
	display			: block;
	margin-bottom	: 10px;
	font-size		: 0px;
}

#clips li
{
	display		: -moz-inline-stack;
	display		: inline-block;
	zoom		: 1;
	*display	: inline;
	width		: 240px;
	height		: 158px;
	overflow	: hidden;
	background	: #000;
}

#clips li.first-child
{
	margin-right : 10px;
}

#clips li.last-child
{
	margin-left : 10px;
}

#clips li .videoplayer
{
	width	: 240px;
	height	: 158px;
}

/*
 * ========================================================================================================================
 *	DETAILS
 * ========================================================================================================================
 */
#details
{
	padding-top		: 10px;
	padding-bottom	: 10px;
	
	text-align		: center;
	border			: 1px solid #b89d70; 
}

#details .exclusive
{
	display			: block;
	padding-bottom	: 4px;
	
	font-weight		: bold;
	text-align		: center;
	text-transform	: uppercase;
	line-height		: 12px;
}

#details .contact
{
	display			: block;	
	text-align		: center;
	text-transform	: lowercase;
	line-height		: 12px;
}

/*
 * ========================================================================================================================
 *	FOOTER
 * ========================================================================================================================
 */
#footer
{
	padding-top		: 10px;
	padding-bottom	: 60px;
	margin-top		: 30px;
	border-top		: 1px solid #ccc;
}

#footer small
{
	font-size : 10px;
}

#footer .copyright
{
	float : left;
}

#footer .author
{
	float : right;
}

/*
 * ========================================================================================================================
 *	RETINA SUPPORT
 * ========================================================================================================================
 */
@media only screen and (-webkit-min-device-pixel-ratio: 2)
{
	#header h1 { background-image : url(../images/woodiebag-1.0@2x.png); }
}