/* CSS Document */

html {
	height: 100%;
}
htmlscroll {
	height: 100%;
}
/* end hide */
#flashcontent, #container {
		height: 95%;
		min-height: 400px;
}
body {
	height: 100%;
	margin: 0;
	padding: 0;
	text-align: center;
	background: #999 url(../images/top-bg.gif) top left repeat-x;
	font-family: "Lucida Grande", verdana, arial, sans-serif;
	font-size: 10px;
	color:#ffffff;
}
a {color: #f3f0ee;}

#container {
	width: 960px;
	margin: 0 auto;
	padding: 0;
}
#header {
	position: relative;
	display: block;
	top: 0;
	height: 91px;
	margin: 0;
	padding: 0;
	}
#header h1 {
	float: left; 
	margin: 0 0 0 40px;
	padding: 0;
	position: relative;
	text-indent: -3000px;
	overflow: hidden;
	background-image: url(../images/logo.gif);
	width: 224px;
	height: 91px;
}
#header h1 a {
	display: block;
	width: 224px;
	height: 91px;
}
#primary-nav {
	float: left;
	position: relative;
	width: 504px;
	height: 20px;
	margin-left: 60px;
	top: 61px;
	background: url(../images/nav-sprite.gif) no-repeat;
	padding: 0;
}
#primary-nav li {
	margin: 0px;
	padding: 0px;
	list-style: none;
	position: absolute;
	top: 0px;
}
#primary-nav li, #primary-nav li a{
	height: 20px;
	display: block;
}

#navBeauty {left: 0px; width: 67px; text-indent: -5000px; overflow: hidden;}
#navCreatures {left: 67px; width: 103px; text-indent: -5000px; overflow: hidden;}
#navThings {left: 170px; width: 78px; text-indent: -5000px; overflow: hidden;}
#navPlaces {left: 248px; width: 77px; text-indent: -5000px; overflow: hidden;}
#navEvents {left: 325px; width: 79px; text-indent: -5000px; overflow: hidden;}
#navBuy {left: 404px; width: 56px; text-indent: -5000px; overflow: hidden;}
#navMe {left: 460px; width: 44px; text-indent: -5000px; overflow: hidden;}

/* Sprite Hovers */

#navBeauty a:hover {background: transparent url(../images/nav-sprite.gif) -0px -20px no-repeat}
#navCreatures a:hover {background: transparent url(../images/nav-sprite.gif) -67px -20px no-repeat}
#navThings a:hover {background: transparent url(../images/nav-sprite.gif) -170px -20px no-repeat}
#navPlaces a:hover {background: transparent url(../images/nav-sprite.gif) -248px -20px no-repeat}
#navEvents a:hover {background: transparent url(../images/nav-sprite.gif) -325px -20px no-repeat}
#navBuy a:hover {background: transparent url(../images/nav-sprite.gif) -404px -20px no-repeat}
#navMe a:hover {background: transparent url(../images/nav-sprite.gif) -460px -20px no-repeat}

/* Page Name States */

body.beauty #navBeauty a {background: transparent url(../images/nav-sprite.gif) -0px -20px no-repeat}
body.creatures #navCreatures a {background: transparent url(../images/nav-sprite.gif) -67px -20px no-repeat}
body.things #navThings a {background: transparent url(../images/nav-sprite.gif) -170px -20px no-repeat}
body.places #navPlaces a {background: transparent url(../images/nav-sprite.gif) -248px -20px no-repeat}
body.events #navEvents a {background: transparent url(../images/nav-sprite.gif) -325px -20px no-repeat}
body.buy #navBuy a {background: transparent url(../images/nav-sprite.gif) -404px -20px no-repeat}
body.me #navMe a {background: transparent url(../images/nav-sprite.gif) -460px -20px no-repeat}

#inner-container {
	float: left;
	text-align: left;
	position: relative;
	margin-top: 30px;
	margin-bottom: 60px;
}
#sidebar {
	float: left;
	margin-left: 43px;
	position: relative;
	display: inline;
	width: 221px;
}
#content {
	float: left;
	position: relative;
	display: inline;
	margin-left: 62px;
	width: 600px;
}	

#footer {
	margin: 0 auto;
	width: 960px;
	font-size: 10px;
}
#footer p {float: right; margin-right: 10px;}
#footer a {margin: 0px; padding: 3px;}
#footer a:hover {background-color: #555; text-decoration: none;}
#footer a.buy:hover {color: #84a3db;}
#footer a.smiles:hover {color: #ff7c7c;}
#footer a.email:hover {color: #d884db;}
#footer .separate {
	color: #555;
}