/*
	Name: UglyBogus.com
	Date: June 2010
	Description: Layout for UglyBogus 2010 website
	Version: 1.0
	Author: Brian Behrens
	Autor URI: http://brainbrian.com
*/

@import url("reset.css");

body {
	background: #F5F4EF url('../img/bg.gif');
	color: #442500;
	font-size: 62.5%; /* Base font size: 10px */
	font-family: Georgia, "Times New Roman", Times, serif;
	line-height: 1.429;
	margin: 0;
	padding: 0;
	text-align: left;
}

h2 {font-size: 2.8em}	/* 28px */
h3 {font-size: 1.4em}	/* 14px */
h4 {font-size: 1.4em}	/* 14px */
h5 {font-size: 1.2em}	/* 12px */
h6 {font-size: 1em}		/* 10px */

h2, h3, h4, h5, h6 {
	font-weight: 600;
	line-height: 1.1;
	font-style:italic;
}

a {outline: 0;}
a img {border: 0px; text-decoration: none;}
a:link, a:visited {
	color: #442500;
	text-decoration: none;
}
a:hover, a:active {
	color: #442500;
	text-decoration: underline;
}
	
/* Paragraphs */
p {margin-bottom: 1.143em;}
* p:last-child {margin-bottom: 0;}

strong, b {font-weight: bold;}
em, i {font-style: italic;}

/* Lists */
ul {
	list-style: outside disc;
	margin: 1em 0 1.5em 1.5em;
}

ol {
	list-style: outside decimal;
	margin: 1em 0 1.5em 1.5em;
}

.offscreen {
	position:absolute;
	left:-3000px;
}
.clear {
	clear:both;
}

.main-wrapper {
	width:800px;
	margin:0 auto;
}
.left-column {
	width:252px;
	float:left;
}
.right-column {
	width:531px;
	float:left;
	padding-left:17px;
}

/* logo */
.left-column h1 {
	margin:23px 0 0 10px;
}
.left-column h1 a {
	width:241px;
	height:172px;
	display:block;
	background: url('../img/logo.png');
}
/* main navigation */
.left-column ul.main-navigation {
	list-style-type:none;
	margin:0 0 0 9px;
	padding:0;
}
.left-column ul.main-navigation li {
	float:left;
}
.left-column ul.main-navigation li a {
	width:76px;
	height:31px;
	display:block;
	color:#fff9e8;
	font-size: 1.4em;
	font-style:italic;
	background: url('../img/sprite-nav.png') 0px 0px;
	text-align:center;
	padding-top:8px;
}
.left-column ul.main-navigation li a:hover {
	text-decoration:none;
	background: url('../img/sprite-nav.png') -76px 0px;
}
.left-column ul.main-navigation li a.about {
	background: url('../img/sprite-nav.png') 0px 0px;
	margin-right:8px;
}
.left-column ul.main-navigation li a.about:hover {
	background: url('../img/sprite-nav.png') -76px 0px;
}
.left-column ul.main-navigation li a.contact {
	background: url('../img/sprite-nav.png') 0px -39px;
	margin-right:7px;
}
.left-column ul.main-navigation li a.contact:hover {
	background: url('../img/sprite-nav.png') -76px -39px;
}
.left-column ul.main-navigation li a.store {
	background: url('../img/sprite-nav.png') 0px -78px;
}
.left-column ul.main-navigation li a.store:hover {
	background: url('../img/sprite-nav.png') -76px -78px;
}
/* navigation divider */
.navigation-divider {
	height:10px;
	margin-left:8px;
	background: url('../img/divider-navigation.png') no-repeat;
	clear:both;
}

/* poster nagivation */
.left-column ul.poster-navigation {
	list-style-type:none;
	margin:0 0 0 9px;
	padding:0;
}
.left-column ul.poster-navigation h3 {
	width:61px;
	height:21px;
	color:#fff9e8;
	background: url('../img/bg-date.png');
	padding:2px 0 0 14px;
}
.left-column ul.poster-navigation ul {
	list-style-type:none;
	margin:-23px 0 18px 85px;
	padding:0;
	font-size: 1.1em;
}
/* copyright */
.left-column .copyright {
	width:231px;
	height:41px;
	background: url('../img/bg-copyright.png');
	color:#fff9e8;
	font-size: 1.1em;
	font-style:italic;
	padding:8px 0 0 10px;
	margin:0 0 20px 7px;
}
.left-column .copyright a {
	color:#fff9e8;
}
/* right column content */
.right-column h2 {
	width:530px;
	height:46px;
	padding:7px 0 0 3px;
	margin:192px 0 0 0;
	background: url('../img/bg-headline.png') no-repeat;
}
.right-column p {
	width:530px;
	margin:0 0 25px 3px;
	font-size: 2.4em;
	font-style:italic;
}
.right-column img {
	margin:3px 0 40px 2px;
	box-shadow: rgba(0, 0, 0, .4) 0px 0px 4px;
	-webkit-box-shadow: rgba(0, 0, 0, .4) 0px 0px 4px;
	-moz-box-shadow: rgba(0, 0, 0, .4) 0px 0px 4px;
}

.right-column p.links {
	width:530px;
	margin:0 0 25px 3px;
	font-size: 1.4em;
	font-style:italic;
}
.right-column p.links a {
	display:block;
	color:#fff9e8;
	text-align:center;
	margin:-10px 0 0 0;
}
.right-column p.links a:hover {
	text-decoration:none;
}
.right-column p.links a.email-shane {
	width:287px;
	height:23px;
	background: url('../img/sprite-shane-email.png') 0px 0px;
	letter-spacing:.1em;
}
.right-column p.links a.email-shane:hover {
	background: url('../img/sprite-shane-email.png') -287px 0px;
}
.right-column p.links a.email-rob {
	width:276px;
	height:23px;
	background: url('../img/sprite-rob-email.png') 0px 0px;
	letter-spacing:.08em;
}
.right-column p.links a.email-rob:hover {
	background: url('../img/sprite-rob-email.png') -276px 0px;
}



.right-column p.links a.website-shane {
	width:312px;
	height:23px;
	background: url('../img/sprite-shane-website.png') 0px 0px;
	letter-spacing:.1em;
}
.right-column p.links a.website-shane:hover {
	background: url('../img/sprite-shane-website.png') -312px 0px;
}
.right-column p.links a.website-rob {
	width:296px;
	height:23px;
	background: url('../img/sprite-rob-website.png') 0px 0px;
	letter-spacing:.08em;
}
.right-column p.links a.website-rob:hover {
	background: url('../img/sprite-rob-website.png') -296px 0px;
}