﻿/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/


.joinButton
{
    height: 42px;
    width: 180px;
}
a.joinButton
{
	display: block;
	text-align: center;
	padding-top: 8px;
	padding-bottom: auto;
	text-decoration: none;
	font-size: 16px;
	font-weight: bold;
}

a.joinButton:link
{
	background-color: transparent;
	background-image: url(../images/getstarted_button.gif);
	background-repeat: no-repeat;
}

a.joinButton:hover
{
    background: transparent url(../images/getstarted_button_over.gif) no-repeat;
}
a.joinButton:visited
{
    background: transparenturl(../images/getstarted_button_over.gif) no-repeat;
}

.featureButton
{
    padding: 5px;
    border: solid 2px #CED649;
}

a.featureButton:link
{
    height: 35px;
    width: 240px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    color: #000;
    text-decoration: none;
}
a.featureButton:hover
{
    background: no-repeat left #D1E2D3;
    border: solid 2px #CED649;
    height: 35px;
    width: 240px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    color: #000;
    text-decoration: none;
    padding: 5px;
}
a.featureButton:visited
{
    border: solid 2px #CED649;
    height: 35px;
    width: 240px;
    display: block;
    text-align: center;
    line-height: 3em;
    font-size: 16px;
    font-weight: bold;
    color: #000;
    text-decoration: none;
}

/*Overload jquery styles*/
.ui-widget-content
{
    border: 0px solid #494C49;
    background: #ffffff; /* url(images/ui-bg_highlight-soft_100_eeeeee_1x100.png) 50% top repeat-x;*/
    color: #333333;
}
.ui-widget-content a
{
    color: #333333;
}
.ui-widget-header
{
    border: 0px solid #494C49;
    background: #fff; /* url(images/ui-bg_gloss-wave_35_CED649_500x100.png) 50% 50% repeat-x; */
    color: #ffffff;
    font-weight: bold;
}
.ui-widget-header a
{
    color: #ffffff;
}
.ui-tabs
{
    padding: 0;
    zoom: 1;
    width: 100%;
}
.ui-tabs .ui-tabs-nav
{
    list-style: none;
    position: relative !important;
    padding: 0 0 0 0;
    text-align: center;
    width: 100%;
}
.ui-tabs .ui-tabs-nav li
{
    position: relative;
    float: left;
    border-bottom-width: 0 !important;
    margin: 0 0 0px 0;
    height: 50px;
    width: 16%;
    text-align: center;
    padding-top: 0.5%;
}
.ui-tabs .ui-tabs-nav li a
{
    float: none;
    text-decoration: none;
    text-transform: uppercase;
    padding: 0;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-selected
{
    padding-bottom: 1px;
    border-bottom-width: 0;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a
{
    cursor: text;
}
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a
{
    cursor: pointer;
}
/* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
.ui-tabs .ui-tabs-panel
{
    padding: 1em 1.4em;
    display: block;
    border-width: 0;
    background: none;
}
.ui-tabs .ui-tabs-hide
{
    display: none !important;
}
/* Interaction states
----------------------------------*/
.ui-state-default, .ui-widget-content .ui-state-default
{
	border: 0px solid #cccccc;
	font-weight: bold;
	color: #494C49;
	outline: none;
	background-color: #f6f6f6;
	background-image: url(../images/getstarted_button_over.gif);
	background-repeat: repeat-x;
	background-position: 50% 50%;
}
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited
{
    color: #494C49;
    text-decoration: none;
    outline: none;
}
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus
{
    border: 0px solid #CED649;
    background: #D1E2D3 url(../images/getstarted_button_over.gif) 50% 50% repeat-x;
    font-weight: bold;
    color: #494C49;
    outline: none;
}
.ui-state-hover a, .ui-state-hover a:hover
{
    color: #494C49;
    text-decoration: none;
    outline: none;
}
.ui-state-active, .ui-widget-content .ui-state-active
{
    border: 0px solid #494C49;
    background: #ffffff url(../images/getstarted_button_over.gif) 50% 50% repeat-x;
    font-weight: bold;
    color: #CED649;
    outline: none;
}
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited
{
    color: #CED649;
    outline: none;
    text-decoration: none;
}

#slider
{
    width: 620px;
    height: 250px;
    margin: 7px auto 25px auto;
    position: relative;
    background: white;
}
ul.navigation
{
    list-style: none;
    margin: 0;
    padding: 9px 3px;
    width: 600px;
    height: 60px;
    background: #fff none repeat scroll 0 0;
}

ul.navigation li
{
    display: inline;
    width: 154px;
    height: 60px;
}

ul.navigation a
{
	text-align: center;
	margin-left: 25px;
	margin-right: 5px;
	color: #007732;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: bold;
	width: 165px;
	line-height: 1em;
	height: 60px;
	display: block;
	float: left;
	background-color: #FFF;
	padding-top: 10px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	font-size: 14px;
	font-family: Verdana, Geneva, sans-serif;
}
ul.navigation a:visited
{
	background-color: #CCC;
}
ul.navigation a:hover
{
	background-image: url(../images/panelbuttons.gif);
	background-repeat: no-repeat;
	background-position: 5px 0px;
}

ul.navigation a.selected
{
	background-image: url(../images/panelbuttons.gif);
	background-repeat: no-repeat;
	background-position: 5px 0px;
}

ul.navigation a:focus
{
    outline: none;
}

.scroll
{
    height: 220px;
    overflow: auto;
    position: relative; /* fix for IE to respect overflow */
    clear: left;
    background: transparent; /* url(images/BG-RotatingPhoto.jpg) no-repeat;*/
    border: solid 1px D1E2D3;
}
.scrollContainer
{
    background: transparent;
}
.scrollContainer div.panel
{
	height: 265px;
	width: 620px; /* change to 560px if not using JS to remove rh.scroll */
	background: transparent;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 2px;
}
.scrollContainer div.panelText
{
    width: 280px;
    margin-right: 1%;
    padding-right: 10px;
    float: right;
    background: transparent;
}
.scrollContainer img
{
    float: left;
}

.scrollContainer h2
{
	font-family: Verdana;
	font-weight: normal;
	padding-top: 0px;
	background: transparent;
	color: #b3740e;
	font-size: 16px;
	text-align: left;
}

.scrollContainer p
{
	color: #666;
	font-size: .9em;
	width: 295px;
	line-height: 14px;
	font-family: Verdana, Geneva, sans-serif;
	text-align: left;
}

.scrollButtons
{
    position: absolute;
    top: 250px;
    cursor: pointer;
}

.scrollButtons.left
{
    left: -20px;
}

.scrollButtons.right
{
    right: -20px;
}

