/*=====================================================================
* Filename: main.css
* Template: oogle
* Author: Jarel Remick - http://www.jremick.com
* Date Created: 12/04/2008
* Media: Screen
*
* Description
* -----------
* This style sheet is used for the single (right aligned) column, main (left aligned) column.
* CSS Reset using "reset.css" from 960 framework package, derived from Eric Meyers.
* Uses blueprint CSS as base starting point: http://www.blueprintcss.org/
=====================================================================*/

@import "reset.css";

body { background: #fff; }

/* ===== GLOBAL ===== */
.center { margin: 0 auto; }
.tcenter { text-align: center; }

.clear { clear: both; }

.fl { float: left; }
img.fl {
	float: left;
	margin-top: 2px;
	margin-right: 8px;
	margin-bottom: 8px;
	margin-left: 0;
}
.fr {
	float: right;
	margin-bottom: 8px;
	margin-right: 8px;
	margin-left: 8px;
}
img.fr {
	float: right;
	margin-top: 2px;
	margin-right: 0;
	margin-bottom: 10px;
	margin-left: 8px;
}

.ltc, .rtc, .lbc, .rbc {
	position: absolute;
	width: 4px;
	height: 4px;
	background-image: url(../images/layout/left-corner-btm.gif);
}
.ltc { top: -1px; left: -1px; background: url(../images/layout/left-corner-top.gif) no-repeat; }
.rtc { top: -1px; right: -1px; background: url(../images/layout/right-corner-top.gif) no-repeat; }
.lbc { bottom: -1px; left: -1px; background: url(../images/layout/left-corner-btm.gif) no-repeat; }
.rbc { bottom: -1px; right: -1px; background: url(../images/layout/right-corner-btm.gif) no-repeat; }

/* Top Link (at footer) */
a.top {
	position: absolute;
	top: 9px;
	left: 2px;
	background-image: url(../images/layout/top-icon.gif);
}
a.top { width: 28px; height: 28px; background: url(../images/layout/top-icon.gif) no-repeat 0 -28px; }
a.top:hover { background-position: 0 0; }

/* Use this instead of html hr tag */
div.hr { width: 100%; height: 1px; background: #d5d5d5; }

/* ===== LAYOUT ===== */
#wrapper { width: 900px; margin: 0 auto; background: url(../images/layout/bg.jpg) no-repeat center 0; }

/* HEADER */
#header {
	width: inherit;
	height: 138px;
	position: relative;
	margin-bottom: 20px;
	z-index: 500;
}
#header .advert { position: absolute; top: 20px; right: 15px; }
#header .logo {
	position: absolute;
	top: 15px;
	left: 15px;
}

/* NAVIGATION */
#nav {
	width: 900px;
	height: 38px;
	position: absolute;
	top: 100px;
	background-image: url(/pro_drop_1/blank.gif);
	background-repeat: repeat-x;
	z-index: 500;
}
#nav .left { width: 5px; height: inherit; position: absolute; left: 0; background: url(../images/layout/nav-left.gif) no-repeat; }
#nav .right { width: 5px; height: inherit; position: absolute; right: 0; background: url(../images/layout/nav-right.gif) no-repeat; }
#nav ul { height: inherit; list-style: none; }
#nav ul li { width: 117px; height: 36px; float: left; }
#nav ul li a { width: inherit; height: inherit; display: block; background: url(../images/layout/nav-bg.gif) no-repeat -352px 0; }
#nav ul li a:hover { background-position: -234px 0; }
#nav ul li a:active { background-position: -117px 0; }
#nav ul li a.active { background-position: 0 0; }

/* MAIN CONTENT */
#mainContent { width: 600px; float: left; }
#mainContent ul { list-style-position: inside; }
#mainContent .container {
	position: relative;
	margin-bottom: 10px;
	border: solid 1px #d5d5d5;
	background: #fff;
	text-align: center;
}
#mainContent .padContainer { padding: 10px; padding-bottom: 6px; }
#mainContent .gradient { background: url(../images/layout/blue-gradient-large.jpg) repeat-x; }
#mainContent .story {
	padding-bottom: 0;
	padding-top: 20px;
	padding-right: 20px;
	padding-left: 20px;
	z-index: 600;
	text-align: left;
}
#mainContent .base,
#mainContent .breadCrumbs { background: url(../images/layout/base-gradient.gif) repeat-x; height: 20px; padding: 0 20px; }
#mainContent .base { border-top: solid 1px #d5d5d5; }
#mainContent .breadCrumbs { border-bottom: solid 1px #d5d5d5; }
#mainContent .category {
	height: 31px;
	position: relative;
	margin-bottom: 5px;
	padding: 0 20px;
	border: solid 1px #d5d5d5;
	background: url(../images/layout/category-gradient.gif) repeat-x;
	background-image: url(../images/layout/category-gradient.gif);
}

ul.showcase { list-style: none; margin: 0; }
ul.showcase li {
	width: 190px;
	float: left;
	color: #996633;
	text-align: left;
	height: 330px;
	border-top-width: thin;
	border-right-width: thin;
	border-bottom-width: thin;
	border-left-width: thin;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	border-top-color: #CCC;
	border-right-color: #CCC;
	border-bottom-color: #CCC;
	border-left-color: #CCC;
	padding: 0px;
}
ul.showcaselong li {
	width: 380px;
	float: left;
	color: #6E5330;
}
#showcaseicons {
	float: left;
}
ul.showcase li img {
	margin-bottom: 5px;
	position: static;
}
ul.showcase span { display: block; }

#mainContent .gridContainer { width: 532px; margin: 0 auto; }
#mainContent .gridContainer ul { margin-top: 8px; }
#mainContent .gridContainer ul li { margin-bottom: 15px; }

/* MAIN CONTENT TABS */
#mainTabs .tabContent {
	width: 598px;
	height: 184px;
}
#mainTabs .ui-tabs-hide { display: none; }
#mainTabs .info {
	position: absolute;
	top: 76px;
	left: 49px;
}
#mainTabs .info ul {
	margin-left: 5px;
	color: #FC0;
	font-weight: bold;
}

#mainTabs ul.nav { margin: 0; height: 16px; list-style: none; background: url(../images/layout/tab-bg-repeat.gif) repeat-x; }
#mainTabs ul.nav li {
	height: inherit;
	width: 49px;
	float: left;
	color: #999;
}
#mainTabs ul.nav li a {
	height: inherit;
	width: 49px;
	display: block;
	background: url(../images/layout/tab-bg.gif) no-repeat -148px 0;
}
#mainTabs ul.nav li a:hover {
	background-position: -98px 0;
}
#mainTabs ul.nav li a:active {
	background-position: -49px 0;
	color: #ccc;
}
#mainTabs ul.nav .ui-tabs-selected a { background-position: 0 0; }

#productTabs .ui-tabs-hide-p { display: none; }
#productTabs .linksList {
	width: 158px;
	border: solid 1px #d5d5d5;
	position: relative;
	float: left;
	margin-bottom: 5px;
	margin-right: 5px;
}
#productTabs .linksList { background: url(../images/layout/grey-gradient-med.gif) repeat-x; }
#productTabs .linksList ul {
	list-style: none;
	margin: 7px 0;
	text-align: left;
}
#productTabs .linksList li a {
	display: block;
	padding: 0 5px;
}
#productTabs .linksList li a:hover,
#productTabs .linksList .ui-tabs-selected-p a {
	background-color: #000;
}

/* FOOTER */
#footer {
	width: inherit;
	position: relative;
	margin-top: 20px;
	padding-bottom: 15px;
}
#footer .nav {
	margin-left: 28px;
	width: 555px;
	margin-top: 0px;
}
#footer ul {
	list-style: none;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
}
#footer ul li {
	float: left;
	border-right: solid 1px #666;
	margin-top: 22px;
	padding-top: 2px;
	padding-right: 7px;
	padding-bottom: 2px;
	padding-left: 7px;
}
#footer ul li.last { border: none; }


/* ===== FONTS =====  Default font settings. The font-size percentage is of 16px. (0.75 * 16px = 12px) */
/* Global */
body { font-size: 75%; color: #222; background: #fff; font-family: "Myriad Pro", "Helvetica Neue", Arial, Helvetica, sans-serif; }

.readmore {
	font-style: italic;
	padding-left: 0px;
}

/* NAVIGATION */
#nav ul { font-size: 1.2em; line-height: 38px; text-align: center; }
#nav ul li a {
	color: #CCC;
	text-decoration: none;
}
#nav ul li a:hover,
#nav ul li a:active,
#nav ul li a.active {
	color: #CCC;
}

/* MAIN CONTENT */
#mainContent .story p { font-size: 1.15em; line-height: 1.3em; color: #666; }
#mainContent .base,
#mainContent .breadCrumbs { font-size: .85em; line-height: 23px; letter-spacing: .05em; color: #999; }
#mainContent .breadCrumbs a { padding: 0 3px; }
#mainContent .base .author { color: #666; }
#mainContent .category h4 {
	font-size: 1.3em;
	line-height: 35px;
	color: #FFF;
}
#mainContent ul {
	font-size: 1.05em;
	line-height: 1.3em;
	color: #000;
}

ul.showcase { color: #666; line-height: 1.3em; }
ul.showcase span {
	font-weight: bold;
	color: #000;
	font-size: 105%;
}

/* MAIN CONTENT TABS */
#mainTabs { text-align: center; }
#mainTabs noscript { font-size: 1em; line-height: 2em; color: red; }
#mainTabs ul.nav a {
	text-align: center;
	font-size: 0.8em;
	line-height: 1.45em;
	color: #ccc;
	text-decoration: none;
}
#mainTabs ul.nav a:hover,
#mainTabs ul.nav .ui-tabs-selected a { color: #fff; }
#mainTabs .info { text-align: left; }
#mainTabs .info ul {
	font-size: 1.1em;
	line-height: 1.5em;
	color: #999;
}

#productTabs .linksList ul {
	line-height: 1.8em;
	font-size: 1.05em;
}
#productTabs .linksList ul a {
	color: #9A6A39;
	font-size: 0.95em;
}
#productTabs .linksList ul a:hover { color: #4185d2; text-decoration: none; }
#productTabs .linksList ul a:active {
	color: #4185d2;
	text-decoration: none;
}

/* FOOTER */
#footer { color: #999; text-align: left; line-height: .8em; font-size: .9em; }

/* Headings */
h1,h2,h3,h4,h5,h6 { font-weight: normal; color: #111; }

h1 {
	font-size: 3em;
	line-height: 1;
	margin-bottom: 0.2em;
	text-align: left;
}
h2 {
	font-size: 2em;
	text-align: left;
	color: #151515;
}
h3 {
	font-size: 1em;
	margin-bottom: 0.75em;
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 1em;
}
h3 {
	color: #963;
	font-weight: bold;
}
h4 { font-size: 1.3em; line-height: 1.25; margin-bottom: 1.25em; }
h5 {
	font-size: 1em;
	font-weight: bold;
	margin-bottom: 0.1em;
	color: #FFF;
}
h6 {
	font-size: 1.3em;
	font-weight: bold;
	color: #996633;
	text-align: left;
}
h7 {
	font-size: 1.3em;
	margin-bottom: 0.5em;
	font-weight: bold;
}
#events {
	float: left;
	height: 140px;
	width: 410px;
	margin-left: 5px;
	margin-top: 5px;
}
#eventsthumb {
	float: left;
	height: 105px;
	width: 132px;
}

h1 img, h2 img, h3 img, 
h4 img, h5 img, h6 img { margin: 0; }


/* Text elements */
p           {
	margin-top: 0;
	margin-right: 0px;
	margin-bottom: 0.2em;
	margin-left: 0px;
	color: #000;
	font-size: small;
	text-align: left;
}
p img.left  { float: left; margin: 1.5em 1.5em 1.5em 0; padding: 0; }
p img.right { float: right; margin: 1.5em 0 1.5em 1.5em; }

a           {
	color: #4185d2;
	text-decoration: none;
	cursor: pointer;
	text-align: left;
} 
a:hover     {
	text-decoration: underline;
}

blockquote  { margin: 1.5em; color: #666; font-style: italic; }
strong      {
	color: #996633;
}
em,dfn      {
	font-style: italic;
	color: #666;
}
dfn         { font-weight: bold; }
sup, sub    { line-height: 0; }

abbr, 
acronym     { border-bottom: 1px dotted #666; }
address     { margin: 0 0 1.5em; font-style: italic; }
del         { color:#666; }

pre 		{ margin: 1.5em 0; white-space: pre; }
pre,code,tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; }


/* Lists */
li ul, 
li ol       { margin:0 1.5em; }
ul, ol      { margin: 0 1.5em 1.5em 1.5em; }

ul          { list-style-type: disc; }
ol          { list-style-type: decimal; }

dl          { margin: 0 0 1.5em 0; }
dl dt       { font-weight: bold; }
dd          { margin-left: 1.5em;}


/* Misc classes */
.small      { font-size: 1em; line-height: 1.3em; }
.medium		{ font-size: 1.2em; line-height: 1.6em; }
.large      { font-size: 1.45em; line-height: 2em; }
.hide       { display: none; }

.white		{ color: #fff; }
.bright		{
	color: #351B09;
}
.quiet      { color: #666; }
.black       { color: #000; }
.highlight  { background:#ff0; }
.added      { background:#060; color: #fff; }
.removed    { background:#900; color: #fff; }

.first      { margin-left:0; padding-left:0; }
.last       { margin-right:0; padding-right:0; }
.top        { margin-top:0; padding-top:0; }
.bottom     { margin-bottom:0; padding-bottom:0; }

.hr01
{
	width: 407px;
	height: 28px;
	background-image: url(../images/img_09.gif);
	background-repeat: no-repeat;
	float: right;
}
.hr01 div
{
	line-height: 30px;
	font-size: 11px;
	float: left;
}
.hr01 a:link, .hr01 a:visited
{
	color: white;
	text-decoration: none;
}
.hr01 a:hover, .hr01 a:active
{
	color: white;
	text-decoration: underline;
}
.hr0101
{
	padding-left: 52px;
	float: left;
}
.hr0102
{
	padding-left: 30px;
	float: left;
}
.whitetext {
	color: #FFF;
}
#mainContent .story2 {
	padding-bottom: 0;
	padding-top: 5px;
	padding-right: 0px;
	padding-left: 0px;
}
#sgkn {
	margin-left: 45px;
}
#mainContent .container2 {
	position: relative;
	margin-bottom: 2px;
	border: solid 0px #d5d5d5;
	background: #fff;
	text-align: center;
	left: auto;
	right: auto;
	width: 810px;
}
#mainContent .container3 {
	position: relative;
	margin-bottom: 10px;
	border: solid 1px #d5d5d5;
	background: #fff;
	text-align: center;
}
#mainContent2 {
	width: 600px;
	float: left;
}
#mainContent .breadCrumbs2 {
	position: relative;
	width: 810px;
	left: auto;
	right: auto;
	text-align: center;
	border-bottom-style: solid;
	border-bottom-color: #d5d5d5;
	padding-bottom: 4px;
}
