/*
================================================
	BoxNinja - Master Screen Style Sheet
================================================
 */


/*	Reset
------------------------------------------------ */
	html, body, div, span, applet, object, iframe,
	h1, h2, h3, h4, h5, h6, p, blockquote, pre,
	a, abbr, acronym, address, big, cite, code,
	del, dfn, em, font, img, ins, kbd, q, s, samp,
	small, strike, strong, sub, sup, tt, var,
	dl, dt, dd, ol, ul, li,
	fieldset, form, label, legend, input, select, textarea,
	table, caption, tbody, tfoot, thead, tr, th, td {
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
		font-weight: normal;
		font-style: normal;
		font-size: 100%;
		font-family: inherit;
		vertical-align: baseline;
		text-decoration: none;
	}
	:focus { outline: 0; }
	body { line-height: 1; color: black; background: white; }
	ol,ul { list-style: none; }
	table { border-collapse: separate; border-spacing: 0; }
	caption, th, td { text-align: left; font-weight: normal; }
	blockquote:before, blockquote:after, q:before, q:after { content: ""; }
	blockquote, q { quotes: "" "";}
	em, i { font-style: italic; }
	strong, b { font-weight: bold; }
	label { cursor:pointer; }
	hr { display: none; }
	img { display: block; }

/*	Global Classes
------------------------------------------------ */
	.hidden { display: none; }
	.invisible { visibility: hidden; }
	.clear { clear: both; }
	.clear-right { clear: right; }
	.clear-left { clear: left; }
	.float-left { float: left; }
		p img.float-left { float: left; margin: 0 20px 20px 0; }
	.float-right { float: right; }
	.matte { border: 1px solid #DDD; padding: 4px; }
	.img-left { float: left; padding: 0 20px 20px 0; }
	.img-left-no-bottom { float: right; padding: 0 20px 0 0; }
	.img-left-sm { float: left; padding: 0 10px 10px 0; }
	.img-right { float: right; padding: 0 0 20px 20px; }
	.img-right-no-bottom { float: right; padding: 0 0 0 20px; }
	.img-right-sm { float: right; padding: 0 0 10px 10px; }
	.bold { font-weight: bold; }
	.italic { font-style: italic; }
	.lowercase { text-transform: lowercase; }
	.uppercase { text-transform: uppercase; }
	.capitalized { text-transform: capitalize; }
	.smallcaps { font-variant: small-caps; }
	.text-left { text-align: left; }
	.text-right { text-align: right; }
	.text-center { text-align: center; }
	.text-justify { text-align: justify; }
	.inline { display: inline; }
	.block { display: block; }


/*	Typography
------------------------------------------------ */
	/* General */
	body { font-size: 87.5%;}
	html>body { font-size: 14px; }

	/* Font Families*/
	.sans-serif { font-family: Arial, Helvetica, "Lucida Grande", Verdana, sans-serif; }
	.serif { font-family: "Times New Roman", Times, Georgia, serif; }
	.monospace { font-family: Monaco, "Andale Mono", Courier, "Courier New", monospace; }

	/* Headlines */
	h1 { font-size: 3.333em;  line-height: 1; 	margin: 20px 0; }
	h2 { font-size: 2.499em;  line-height: 1; 	margin: 20px 0;  }
	h3 { font-size: 1.666em;  line-height: 1; 	margin: 20px 0;  }
	h4 { font-size: 1.666em;  line-height: 1.3; 	margin: 20px 0;  }
	h5 { font-size: 1.249em;  line-height: 1.3; 	margin: 20px 0;  }
	h6 { font-size: 1.249em;  line-height: 1.3; 	margin: 20px 0;  }
	h1,h2,h3,h4,h5,h6 { display:block; clear:both; color: #000; }

	/* Paragraphs and Body Copy */
	p,q { color: #555; font-size: 1em; line-height: 1.5em; margin: 1.33em 0; overflow: hidden; clear: both; }

	small, .small { font-size:0.8333em; line-height: 2em; }
	big { } /* Note: Any size above 1.666em currently creates 1px increase in line height. Bug? */
	.footnote { margin: .25em 0; font-size: .833em; line-height: 1.66em; }

	hr { display: block; color:#DDD; background:#031625; height:2px; border:none; border-top: 1px solid #0a2f4a; margin: 4px 0 5px 0; clear:both; overflow: hidden; }

	/* Links */
	a { color: #0077c3; }
	a:hover { color: #0077c3; text-decoration: underline; }

	/* Quotations and Cites */
	blockquote { margin: 0 1.666em; }
	blockquote cite { display: block; }
	cite { font-style: italic; }

	/* Monospaced */
	code, pre, kbd, tt, samp, var { margin: 1.666em 0; font-size: 1em; line-height: 1.666em; color: #222; font-family: Monaco, "Andale Mono", Courier, "Courier New", monospace; }
	code { background: #eee; }
	pre { background: #eee; }

	/* Lists */
	ul,ol,li,dl,dd,dt { color: #555; font-size: 1em; line-height: 1.666em; margin: 1.666em 0; }
	ul ul, ul ol, ol ul, ol ol { margin: 0; }
	ul { list-style:disc; }
	ul.none { list-style:none; }
	ol { list-style: decimal; }
	ol li, ul li, dd { margin: 0 0 0 1.666em; }
	dd,dt { color: #555; font-size: 1em; line-height: 1.666em; margin:0; }

	/* Tables */
	table { color: #555; font-size: 1em; line-height: 1.666em; margin: 1.666em 0; width:100%; }
	table caption { }
	table thead {}
	table tbody {}
	table tfoot {}
	tr { }
	th { font-size: 1em; line-height: 1.666em; margin: 1.666em 0; padding: 0 1.666em 0 0; font-weight:bold; color:#333; }
	td { font-size: 1em; line-height: 1.666em; margin: 1.666em 0; padding: 0 1.666em 0 0; }

	/* Accronyms and Abbreviations */
	abbr, acronym { cursor: help; text-transform: lowercase; font-variant: small-caps; font-size: 1.166em; font-style: italic; line-height: 1em; letter-spacing: 0.083em; }

	/* Deletions and Insertions */
	del { color: #999; text-decoration: line-through; }
	ins { color: #222; }
	del, ins { cursor: help; }

	/* Subscript and Superscript */
	sub { position: relative; top: 0.5em; font-size: 0.8333em; }
	sup { position: relative; bottom: 0.5em; font-size: 0.8333em; }

	/* Definition */
	dfn { font-style: italic; cursor: help; }

/*	Navigation
------------------------------------------------ */
	ul#nav-horiz { clear: both; list-style: none; overflow: hidden; }
	ul#nav-horiz li { display: block; float: left; margin: 0 0.833em 0 0; }
	ul#nav-horiz li a { background: #EEE; display: block; float: left; height: 2.499em; line-height: 2.499em; padding: 0 0.833em; }
	ul#nav-horiz li a:hover, ul#nav-horiz li.selected a { background: #888; color: #FFF; }

	ul#nav-vert { clear: both; overflow: hidden; list-style: none; }
	ul#nav-vert li { display: block; float: left; margin: 0 0 0.833em 0; clear: left; }
	ul#nav-vert li a { float: left;  display: block; height: 2.499em; line-height: 2.499em; padding: 0 0.833em; background: #EEE; }
	ul#nav-vert li a:hover, ul#nav-vert li.selected a { background: #888; color: #FFF; }

/*	Forms
------------------------------------------------ */
	form { margin: 0 0 1.666em 0; }
	form legend { display: none; }
	form dl { margin: 0; padding: 0; }
	form dl dt, form dl dd { float: left; padding: 0; margin: 0; overflow: hidden; margin: 0 0 0.833em 0; }
	form dl dt { clear: left; }
	form label { padding: 0 1.666em 0 0; display: block; width: 12em; float: left; font-size: 1em; line-height: 1.666em; }
	form label span.required { }
	form input { width: 300px; }
	form input:focus { background: #999; color: #FFF;}
	form textarea { width: 300px; height: 6.666em; line-height: 1.3; }
	form textarea:focus { background: #999; color: #FFF;}
	form input { display: block; float: left; height: 1.666em; line-height: 1.666em;  }
/*
	form select { width: 300px; height: 1.666em; }
	form select:focus option.message { display: none; }
*/

	/* Validation Errors */
	form dl dd label.error { width: 280px; display: block; clear: both; background: #D23A3A; font-size: 0.8333em; line-height: 2em; padding: 0 10px 0 10px; color: #FFB9B9; }

	/* Buttons and Submit Inputs */
	form dl dd.submit { clear: both; overflow: hidden; padding: 0 0 0 13.666em; }
	button, input.submit { line-height: 2.499em; height: 2.499em; padding: 0 0.833em; width: auto; float: left; }

/*	Columns
------------------------------------------------ */
	div.column_container_top, div.column_container { clear: both; overflow: hidden; margin: 0; padding: 0; }

	div.twocol_left_column, div.twocol_right_column { margin: -20px 0 0 0; float: left; width: 320px; }
	div.twocol_left_column { margin: -20px 20px 0 0; }

	div.fourcol_one_column, div.fourcol_two_column, div.fourcol_three_column, div.fourcol_four_column { margin: -20px 20px 0 0; float: left; width: 150px; }
	div.fourcol_four_column { margin: -20px 0 0 0; }

/*	Gallery
------------------------------------------------ */
	ul.gallery { float: left; margin: -20px -20px 0 0; padding: 20px 0 0 0; clear: both; overflow: hidden; }
	ul.gallery li { float: left; margin: 0 20px 20px 0; list-style: none; }
	ul.gallery li img { display: block; width: 150px; height: 150px; background: url(/public/themes/handcraft/images/image.jpg); }



/*
================================================
	Layout
================================================ */
	body { background: #042137 url(/images/body-bg.jpg) repeat 0px 0px; }

	div#wrapper { background: url(/images/body-bg-top.jpg) repeat-x 0px 0px; padding: 0px; }

	div#content { z-index: 100px; overflow: hidden; clear: both; width: 800px; margin: 0 auto; }

/* Header */
	div#header { padding: 0 0 0 40px; }

/* Breadcrumbs */
	div#breadcrumbs { border-bottom: 1px solid #DDD; height: 19px; margin: 0 0 20px 0; }
	div#breadcrumbs span { color: #999; }
	div#breadcrumbs a { color: #777; }

/* Menus */
	ul.navigation { clear: both; list-style: none; overflow: hidden; margin: 0; }
	ul.navigation li { display: block; float: left; margin: 0 20px 0 0; }
	ul.navigation li a { font-size: 14px; display: block; float: left; height: 20px; line-height: 20px; padding: 0; }
	ul.navigation li a:hover, ul.navigation li a.current { color: #000; }

	ul.footer_navigation { clear: both; list-style: none; overflow: hidden; margin: 0; }
	ul.footer_navigation li { display: block; float: left; margin: 0 20px 0 0; }
	ul.footer_navigation li a { font-size: 14px; display: block; float: left; height: 20px; line-height: 20px; padding: 0; }
	ul.footer_navigation li a:hover, ul.footer_navigation li a.current { color: #000; }

/* Footer */
	#footer { z-index: 100px; overflow: hidden; clear: both; width: 800px; margin: 0 auto; text-align:center; }
	#footer img { display:inline; }

/* Typography Styles */
	h1 { display:none; }
	h2 { margin: 10px 0px; color:#8f999d; }
	h3 { color:#8f999d; }
	h4 { color:#8f999d; }

	p,q { color:#598ca6; }
	blockquote p { margin: 0px 0px 0px 40px; color:#7f632e; }
p.info { clear:both; display:block; margin: 270px 0px 0px 0px; font-size:10px; color:#0a2f4a; text-align:center; }
p.info a { color:#0a2f4a; }


/* Common Styles */
	.more { display:block; clear:both; }
	.more p { float:none; width:auto; }
	.read-more { float:left; clear:none; margin: 20px 0px; }

	div.img { float:left; clear:none; margin: 0px 20px 20px 0px; width:260px; }
	div.img img { margin: 0px 20px 20px 0px; }
	.intro { float:right; clear:none; margin: 1em 0px; width:380px; }
	.caption { display:block; margin: px 0px; font-size:10px; color:#008dd2; }

/* Block Areas */
	#news { overflow:hidden; padding: 60px 0px 20px 0px; }
	#about,
	#store,
	#music,
	#newsletter,
	#contact { overflow:hidden; padding: 20px 0px; }


/* News Area */
	#news img { width:180px; }

/* About */
	#about { }
	#about .img { float:left; clear:none; margin:0px; width:380px; }
	#about img.logo { float:left; clear:both; margin: 20px 0px; width:380px; }
	#about h2 { float:right; clear:none; margin: 20px 0px; width:380px; }
	#about p.intro { float:right; clear:none; margin: 1em 0px; width:380px; }
	#about .read-more { float:left; clear:none; margin: 0px 40px; }

/* Music */
	#music .album { overflow:hidden; }
	#music .album .info { float:right; clear:none; margin: 0px 0px 0px 20px; width:500px; }
	#music .album .info .img { float:left; clear:none; margin: 0px 20px 20px 0px; width:260px; }
	#music .album .info .img img { margin: 10px 0px 10px 0px; }
	#music .album .info .img img.cover { margin: 0 0 10px 0; width:260px; }
	#music .album .info ol { float:right; clear:none; margin:0; width:220px; }
	#music .album .info ol li { line-height:1.4; color:#7f632e; }
	#music .album p.intro { float:left; clear:none; margin:0; width:280px; }
	#music .album .more { float:right; clear:none; margin: 0px 0px 20px 20px; width:500px; }
	#music .album .read-more { float:left; clear:none; margin: 20px 0px 40px 0px; }

/* Store Area */
	#store h2 { display:block; float:left; clear:none; margin: 0 20px 20px 0; width:280px; }

	#store p.link { display:inline; float:right; clear:none; margin: 0px 0px 20px 10px; font-size:0.75em; text-align:center; }

	#store img,
	#store input.submit { opacity:0.7;filter:alpha(opacity=70); }
	#store div:hover img,
	#store p:hover img,
	#store div:hover input.submit { opacity:1.0;filter:alpha(opacity=100); }
	#store .caption { width:140px; }

	#store .album,
	#store .shirt { position:relative; display:block; overflow:hidden; float:left; clear:right; margin:0; width: 160px; height:240px; }
	#store .album img,
	#store .shirt img { margin: 10px 0; }
	#store .album img.cover,
	#store .shirt img.thumb { float:none; margin: 0px 20px 20px 0px; width:128px; }
	#store .shirt form { float:none; margin: 10px 0px; width:160px; }

	#store img.button { position:absolute; left:0px; bottom:0px; }
	#store input.submit { margin: 10px 0px; width:113px; height:33px; background: url(http://tinfoil.retrix.net/store/images/add_to_cart.gif) no-repeat 0px 0px; text-indent:-30000px; }


/* Newsletter */
	#newsletter form dt { float:left; clear:none; margin:0; width:auto; }
	#newsletter form dt label { clear:none; margin:0; width:auto; line-height:30px; }
	#newsletter form dd { float:left; margin: 0 20px 0 0; width:200px; }
	#newsletter form input.submit { float:right; clear:none; margin:0; }

/* Contact */
	form { }
	form fieldset { overflow:hidden; clear:both; margin: 0 0 20px 0; border: 10px solid #0a2f4a; padding:20px; background:#031625; }

	fieldset label { display:block; clear:both; color:#008dd2; }
	fieldset span.required { color: #0a2f4a; }

	fieldset input { border: 1px solid #031625; padding: 2px 4px; width:220px; background:#1b4767; color:#02101c; } }
	fieldset input:focus { border: 1px solid #008dd2; background:#0c3a5b; color:#008dd2; }
	fieldset textarea { border: 1px solid #031625; padding: 2px 3px; background:#1b4767; color:#02101c; }
	fieldset textarea:focus { border: 1px solid #008dd2; background:#0c3a5b; color:#008dd2; }

	fieldset p { margin: 0.33em 0; }
	fieldset p strong { margin: 0; font-size: 14px; font-weight: bold; color:#000; }

	fieldset ul { position:relative; margin:0; border:0px; padding:0; width:678px; }
	fieldset li { float:left; clear:left; margin:0; padding:0; width:220px; list-style:none; }

	fieldset.simple li.textarea { position:absolute; right:0px; top:0px; clear:none; width:400px; height:200px; }
	fieldset.simple li.textarea textarea { padding:4px; width:392px; height:200px; }

	fieldset.simple li#captcha-field { margin:0; }
	fieldset.simple li#captcha-field label { width:auto; }
	fieldset.simple li#captcha-field .important { display:inline; font-size:1.25em; color:#d7b866; }
	fieldset.simple li#captcha-field input { width:auto; }

	form fieldset input.submit { display:block; clear:both; margin: 20px 0px 0px 0px; background:#008dd2; }

	fieldset label.error,
	fieldset.simple li#captcha-field label.error { background: #d0473c; color:#FFF; text-decoration: none; margin: 4px 0 6px 0; }


/* Footer Nav */
	#footer-nav { position:fixed; right:10px; top:10px; margin:0; padding:0; font-size:10px; }
	#footer-nav li { margin:0; padding:0; list-style:none; text-align:right; text-transform:uppercase; }
	#footer-nav l