/*
============================================================================
Clarity Audiology Main Theme Stylesheet
----------------------------------------------------------------------------
Date        Ver.    User    Changes
 1/18/06    1.0     EWS     Original Version
============================================================================
*/

/* HTML */
/* Standard HTML */
*
{
    margin: 0;
    padding: 0;
    text-align: left; 
}

body, body div, body p, body li
{
    color: #444444;
    font-weight: normal;
    letter-spacing: normal;
    text-transform: none;
    word-spacing: normal

}

html>body
{
    font-size: small; 
}

/*
not used here
html>body, html>body div, html>body p, html>body li
{
    font-size: small; 
}
*/

/* General */
h1, h2, h3, h4, h5, h6 
{
    font-weight: bold;
    letter-spacing: normal;
    word-spacing: normal;    
}
h1
{
    font-size: 120%;
}
h2
{
    font-size: 110%;
}
h3
{
    font-size:100%;
}
h4
{
    font-size:90%;
}

INPUT, SELECT, TEXTAREA
{
    font-family: Arial, Helvetica, Verdana, sans-serif;
    font-size: small;
}

TD, TH
{
    text-align: left;
    vertical-align: top;
}

UL
{
    margin-top: 0px;
    margin-left: 0px;
    padding-left: 1.5em;
    list-style-type: square;
    list-style-position: outside;
}

HR
{
    height: 1px;
}

a
{
    text-decoration: none;
}

a:link
{
    text-decoration: none;
}

a:visited
{
    text-decoration: none;
}
a:hover
{
    text-decoration: underline;
}
a:active
{
    text-decoration: none;
}

/* End of Standard HTML */


/* Site HTML */
body
{
    background-color: #FFFFFF;
    font-family: Arial, Helvetica, Verdana, sans-serif;
    text-align: center;
    padding-top: 0px;
}

h1, h3, h5
{
    color: #0263AF;
}

h2, h4, h7
{
    color: #94BEE4;
}

a
{
    COLOR: #1F3F68;
    
}

a:link
{
    COLOR: #1F3F68;
}

a:visited
{
    COLOR: #1F3F68;
}
a:hover
{
    COLOR: #1F3F68;
}
a:active
{
    COLOR: #1F3F68;
}

/* End of Site HTML */


/* Site IDs/Classes */

#container
{
    text-align: center;
	background-image: url("images/BG.hdr.gif");
	background-attachment: scroll;	
	background-position: top left;
	background-repeat: repeat-x;	
	margin-left: auto;
	margin-right: auto;

}


#hdr
{
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;	
	height: 130px;
	min-width: 740px;
	width: 740px;
}

#hdr h1
{
	margin-left: -3000px;
}

#hdr h2
{
	font-family: Arial;
	font-size: 16px;
	color: #E06A24;	
	text-align: right;
	margin-top: 10px;
}

#hdr img
{
	float: left;
	margin-top: -63px;
}

#hdr p
{
	text-align: right;
	color: #000000;
	font-family: Arial;
	font-size: 12px;
	font-weight: bold;
	padding-top: 18px;
}

#hdr input
{
	font-size: 10px;
	width: 115px;
	margin-right: 8px;
}

#hdr a, #hdr a:hover
{
    color: #74A0DD;
}

#mainMenu 
{
	background-image: url("images/BG.mainmenu.gif");
	background-color: #427FD0;
	font-weight: bold;
	min-width: 740px;
	width: 740px;
	height: 30px;
	margin-left: auto;
	margin-right: auto;
}

#mainMenu ul
{
	list-style: none;
}
#mainMenu ul li
{
	padding: 7px 10px 7px 10px;
	display: block;
	float: left;    
    border-right: solid 2px #84A0C1;
	font-size: 13px;	
	font-weight: bold;
}

#mainMenu ul li.first, .first
{
    padding-left: 0px;
    margin-left: -3px;
   
}

#mainMenu ul li.last
{
    border-right: none;
    padding-right: 0px;
}

#mainMenu ul li a, #mainMenu ul li a:hover
{
    color: #FFFFFD;
}

#mainMenu ul li.current, .current
{
    color: #29497D;
}

#contentWrapper
{
    color: #808181;
	background-color: #FFFFFF;
	min-width: 740px;
	width: 740px;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
}

#content
{
    float:left;
    width: 504px;
}
#content h1, h2, h3, h4, h5, h6 
{
    margin-top: .5em;    
    margin-bottom: .25em;
}

#content p
{
    margin-bottom: 1em;
}

#content ul
{
    margin-bottom: 1em;
}

#imageBox
{
	float: left;
}

#options
{
	float: right;
	width: 435px;
}

#signup
{
	background: #FFFFFF url("images/BG.signup.jpg") no-repeat;
	min-width: 209px;
	width: 209px;
	height: 193px;
	float: left;
	margin-left: 8px;
}
#signup h1
{
	color: #FFFFFF;
	padding: 20px 14px 0px 14px;	
	margin: 0;
}

#signup p
{
	color: White;
	font-size: 12px;
	padding: 14px 14px 20px 14px;
}
#signup a, #signup a:hover
{
	color: #90BBE6;
	font-size: 16px;
}

#login
{
	background: #FFFFFF url("images/BG.login.jpg") no-repeat;
	min-width: 207px;
	height: 193px;
	float: left;
	margin-left: 10px;
}

#login h1
{
	padding: 20px 14px 12px 14px;
	margin: 0;
	color: white;
}

#login p
{
	color: White;
	font-size: 10px;
	padding-left: 12px;
	
}

#login a, #signup a:hover
{
	color: White;
	
}

#login img
{
	float: right;
	padding-right: 16px;
	border-style: none;
}

#welcome
{
	clear: both;
	margin: 25px 0px 0px 10px;
}

#welcome h1
{
	color: #1776CC;
}

#welcome p
{
	color: #666666;
	padding-top: 14px;
}

#bottomBar
{
	margin-top: 8px;
	background: Transparent url("images/BG.bar.gif") no-repeat;
	min-width: 740px;
	width: 740px;
	height: 11px;
	margin-left: auto;
	margin-right: auto;
}

#ftr
{
	background-color: #FFFFFF;
	min-width: 740px;
	width: 740px;
	margin-top: 10px;
	color: Black;
	font-size: 10px;
	margin-left: auto;
	margin-right: auto;
}


#ftr a, #ftr a:hover
{
    color: #427FD0;
    
}

#homeHelp ul li
{
    display: inline;
    color: #A9A9A9;
    border-right: solid 1px #A9A9A9;
    padding-right: 8px;
    padding-left: 8px;
	font-size: 11px;
}

#homeHelp ul li.last
{
    border-right: none;
}

#wrapper
{
	margin: 0 auto;
	width: 850px;	
	min-width: 850px;	
}

#workspace
{
	float: right;
	min-width: 768px;
	width: 768px;
}



#controls h1
{
	font-size: 13px;	
	font-weight: bold;
	color: #676767;
}

#controls ul
{
	list-style: none;
	padding-bottom: 6px;
}

#controls ul li
{
    display: inline;
    color: #999999; 
    border-right: solid 1px #FFFFFF;
    padding-right: 8px;
    padding-left: 8px;
	font-size: 11px;	
	font-weight: bold;
}

#controls ul li a, #controls ul li a:hover
{
    color: #999999;
}

#controls ul li.first
{
	padding-left: 0px;
	margin-left: -21px;
}

#branding
{	
	margin-top: 45px;
	background-image: url("../../images/background.brand.gif");
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position: top left;
	height: 108px;
	min-width: 82px;
	float: left;
}

#branding h1
{
	margin-left: -3000px;
}

#palette 
{
	margin-top: 2px;
	margin-bottom: 2px;
	background-color: #F9F9F9;
	min-width: 191px;
	width: 191px;
	float: left;
	height: 385px;
}

#palette p
{
	
}

#backBtn
{	
	float: left;
	margin-top: 16px;
	min-width: 217px;
	width: 217px;
}

#instructions
{	
	float: left;
	margin-top: 16px;
	min-width: 333px;
	width: 333px;
}

#instructions p
{
	color: #999999;
	font-size: 12px;
	line-height: 1.8;
}

#nextBtn
{	
	text-align: right;
	float: left;
	margin-top: 16px;
	min-width: 191px;
	width: 191px;
}

.clear
{
	clear: both;
}

#sideBar
{
    float:left;
    width: 235px;
}


#sideBar ul
{
    margin: 0;
	padding: 0;
	list-style: none;
	width: 235px;
	margin-bottom: 15px;
}

#sideBar ul li
{
}

#sideBar ul li a
{
    display: block;
    color: #102975;
	padding-top: 1px;
	padding-bottom: 1px;
	font-size: 12px;
	font-weight: normal;
}

#sideBar ul li.last
{
    border-bottom: none;
    padding-bottom: 20px;
}

#sideBar ul li ul
{
    width: 235;
    max-width: 235px;
    padding-left: 10px;
    background: #FFFFFF;
}

#sideBar ul li ul li
{
    border-bottom: none;
}

#sideBar ul li ul li a
{
    /* color: #78BDE8; */
    color: #102975;
}

#sideBar ul li ul li ul
{
    font-style: italic;
    padding-left: 0px;
}

#sideBar ul li ul li ul li a
{
    /*color: #005481; */
    color: #173CAB;
}

#sideBar ul li ul li ul li ul, #sideBar ul li ul li ul li ul li ul li ul
{
    font-style: normal;
}

#sideBar ul li ul li ul li ul li ul, #sideBar ul li ul li ul li ul li ul li ul li ul
{
    font-style: italic;
}

#signUpForm
{
    margin-left: 140px;
}

#signUpForm label
{
    position: absolute;
    float: left;
    width: 125px;
    margin-left: -140px;
    text-align: right;
    color: #316BBD;
    margin-right: 15px;
    margin-top: 4px;
}
SPAN.instructions
{
    font-size: .7em;
}

INPUT.cmdButton
{
    padding: 3px;
    padding-bottom: 2px;
    text-align: center;
    border: none;
}

.productListing
{
    margin-left: 150px;
    min-height: 137px;
}

.productListing img
{
    position:absolute; 
    margin-left: -150px;
}

.productListing h1
{
    color: #94BEE4;
}
.productListing h2
{
    color: #E06A24;
}
.productListing p
{
    font-size: small;
}

#orderreceipt TD
{
    padding: 2px;
}

/* ORDERING */
/*
TD.TField
*/
TABLE.OrderTable
{
    border: 0;
    margin: 0;
    border-style: none;
}

TD.THeader
{
    margin: 3px;
    color: #386AAE;
    font-size: 13px;
    border: 0px;
    padding: 3px;
    padding-right: 8px;
}

TD.TField, TD.TFieldRight, TD.TFieldCenter
{
    background: #E3E3E3 url(images/BG.orders.gif) repeat-x scroll top left;
    color: #666666;
    font-size: 12px;
    height: 17px;
    border: 0px;
    padding: 3px;
    padding-right: 8px;
}
TD.TField a
{
    color: #666666;
}
TD.TFieldRight
{
    text-align: right;
}
TD.TFieldCenter
{
    text-align: center;
}





/*
=========== NEW CSS ===========
*/


div#home_content div#top_hero {
    width:100%;
    overflow:hidden;
    position:relative;
}

div#home_content div#top_hero div#imageBox {
    position:relative;
    float:left;
}
div#home_content div#top_hero div#hero_right {
    position:relative;
    float:right;
    width:209px;
}

div#home_content div#top_hero div#hero_right div#signup, 
div#home_content div#top_hero div#hero_right div#login {
    margin:0;
    background-repeat:repeat-x;
    width:100%;
    height:132px;
    background-color:#3d76c3;
}

div#home_content div#top_hero div#hero_right div#login {
    height:179px;
}

div#home_content div#top_hero div#hero_right div#login h1 {
    padding:20px 14px 10px;
}

div#home_content div#top_hero div#hero_right div#login p {
    margin:0 0 5px;
}

div#home_content div#options {
    float:none;
    width:100%;
    margin:0;
    font-size:12px;
    line-height:1.5;
}

div#home_content div#options h1, 
div#home_content div#options h2, 
div#home_content div#options h3 {
    color:#ff6600;
}

div#home_content div#options h1, 
div#home_content div#options h2 {
    font-size:17.5px;
}

div#home_content div#options h3 {
    font-size:12px;
    line-height:1.2;
}

div#home_content div#options div.box {
    position:relative;
    float:left;
    margin:0 0 0 10px;
    width:232px;
}

div#home_content div#options div.welcome {
    margin:0 10px 0 0;
    width:270px;
}
div#home_content div#options div.welcome p {
    color:#555;
}

div#home_content div#options div.how_it_works p {
    font-weight:bold;
    margin:0 0 6px;
}

div#home_content div#options div.how_it_works p strong {
    color:#9D9D9D;
}

div#home_content div#options div.product_box {
    padding:10px 0 0;
    width:208px;
    line-height:1.2;
}

div#home_content div#options div.product_box img {
    float:right;
}

div#home_content div#options div.product_box a.continue img {
    border:0;
    float:none;
}





