/*
STYLE.CSS - Layout and theme for npslegacy.nookkin.com

Copyright(c) 2009 Lyosha Blinnikov
*/

/* Page body */
html
{
	background-color: #525252;
}
body
{
	margin: 0px;
	padding: 10px 0px 24px 0px;
	background-color: #525252;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #ffffff;
	text-align: center; /* Centers the layout in old IE */
}
img
{
	border: 0px;
}
a, a:link, a:visited
{
	color: #ffcc66;
	text-decoration: none;
}
a:hover, a:active
{
	color: #ffffff;
	text-decoration: underline;
}
a.button {
    display: inline-block;
    border: 1px #ffcc66 solid;
    padding: 1em;
    vertical-align: middle;
}
div.clear
{
	clear: both;
	height: 0px;
	overflow: hidden;
	font-size: 0px;
	line-height: 0px;
}

/* Page frame (shadows around the content column) */
#top
{
	width: 1000px;
	height: 18px;
	margin: 0px auto;
	background: url(images/top.png) no-repeat left top;
}
#upper, #lower
{
	width: 1000px;
	margin: 0px auto;
	background: url(images/sides.png) repeat-y left top;
	text-align: left;
}
#bottom
{
	width: 1000px;
	height: 120px;
	margin: 0px auto;
	background: url(images/bottom.png) no-repeat left top;
}

/* Header and logo */
#header
{
	position: relative;
	width: 960px;
	height: 130px;
	margin: 0px auto;
	background: #000000 url(images/header.png) no-repeat left top;
}
#logo
{
	position: absolute;
	left: 30px;
	top: 28px;
	width: 165px;
	height: 68px;
}
#logo img
{
	display: block;
}

/* Navigation bar */
#navbar
{
	width: 960px;
	height: 30px;
	margin: 0px auto;
	background-color: #000000;
	zoom: 1;
}
#nav
{
	margin: 0px;
	padding: 0px 0px 0px 13px;
	list-style-type: none;
	zoom: 1;
}
#nav li
{
	float: left;
	margin: 0px;
	padding: 0px;
}
#nav li a, #nav li a:link, #nav li a:visited
{
	float: left;
	height: 30px;
	padding: 0px 28px 0px 0px;
	font-size: 10pt;
	line-height: 30px;
	text-transform: uppercase;
	color: #ffffff;
	text-decoration: none;
}
#nav li a:hover, #nav li a:active
{
	color: #ffcc66;
	text-decoration: none;
}
#nav li.current a
{
	color: #ffcc66;
}

/* Hero area (splash band across the whole page) */
#band
{
	height: 268px;
	background: #525252 url(images/hero.png) no-repeat center top;
}
#hero
{
	position: relative;
	width: 960px;
	height: 268px;
	margin: 0px auto;
	text-align: left;
}
#hero h1
{
	position: absolute;
	left: 47px;
	top: 36px;
	margin: 0px;
	font-family: Tahoma, Verdana, Arial, sans-serif;
	font-size: 22pt;
	font-weight: normal;
	line-height: 26px;
	color: #dedede;
}
#hero p.intro
{
	position: absolute;
	left: 48px;
	top: 79px;
	width: 560px;
	margin: 0px;
	font-size: 13pt;
	line-height: 24px;
	color: #d4d4d4;
}
#download
{
	position: absolute;
	left: 42px;
	top: 196px;
	width: 235px;
	height: 43px;
}
#download img
{
	display: block;
}
#shot
{
	position: absolute;
	left: 696px;
	top: 18px;
	display: block;
}

/* Shorter hero for inner pages - just tall enough for the title */
#band.inner, #hero.inner
{
	height: 86px;
}
#band.inner
{
	background-position: center bottom;
}
#hero.inner h1
{
	top: 30px;
}

/* Content area */
#content
{
	width: 960px;
	margin: 0px auto;
	background-color: #000000;
	zoom: 1;
}

/* Feature grid on the home page */
#features
{
	height: 359px;
	padding: 0px 0px 0px 47px;
	overflow: hidden;
	zoom: 1;
}
div.feature
{
	float: left;
	display: inline; /* Fixes the doubled margin in IE6 */
	width: 280px;
	height: 167px;
	margin: 0px 22px 0px 0px;
}
div.feature h2
{
	margin: 18px 0px 0px 0px;
	font-size: 13pt;
	font-weight: normal;
	line-height: 21px;
	color: #d6e7ff;
}
div.feature p
{
	margin: 15px 0px 0px 0px;
	font-size: 10pt;
	line-height: 14.5px;
	color: #ffffff;
}

/* Inner pages */
div.page
{
	padding: 20px 47px 40px 47px;
	font-size: 12px;
	line-height: 18px;
	color: #cccccc;
}
div.page h2
{
	margin: 18px 0px 6px 0px;
	font-size: 18px;
	font-weight: normal;
	color: #d6e7ff;
}
div.page p
{
	margin: 0px 0px 12px 0px;
}
div.page ul
{
	margin: 0px 0px 12px 0px;
}

/* Download buttons */
div.page a.button, div.page a.button:link, div.page a.button:visited
{
	display: block;
	padding: 8px 12px;
	background-color: #141414;
	border: 1px solid #303030;
	line-height: 32px;
	color: #ffcc66;
	text-decoration: none;
	zoom: 1;
}
div.page a.button:hover, div.page a.button:active
{
	background-color: #1f1f1f;
	border-color: #ffcc66;
	color: #ffffff;
	text-decoration: none;
}
div.page a.button img
{
	width: 32px;
	height: 32px;
	vertical-align: middle;
}

/* Footer */
#footer
{
	width: 960px;
	height: 69px;
	margin: 0px auto;
	background: #000000 url(images/footer_sep.png) no-repeat left top;
	text-align: center;
}
#footer p
{
	margin: 0px;
	padding: 20px 0px 0px 0px;
	font-size: 8pt;
	line-height: 13px;
	color: #696969;
}
