/* THE PUDDING INDEX STYLESHEET
----------------------------------------------- */	
body {
	margin: 0; 
	padding:0; 
	background-color:#333;
	text-align:center;
	font:76% Verdana, Arial, Helvetica, sans-serif; 
	color:#7D8A9A;}	

img { border:none;}

.clear { clear: both; font-size:1px; line-height:0px;}
	
/* TEXT
----------------------------------------------- */		
h1 {font-size:1.6em; }	
h2 {font-size:1.2em; margin-top:0 }
h3 {font-size:1em; margin:0;}	
	
/* LINKS
----------------------------------------------- */	
a:link, a:visited { color:#4477A9; text-decoration:none;}	
a:hover, a:active { color:#4477A9; text-decoration:underline;}	

/* SKIP NAVIGATION
----------------------------------------------- */
#skip-navigation { position:absolute; width: 80%; top:-300px; left:0;}
#skip-navigation a { position: absolute; top:0;}

/* IMAGE REPLACEMENT 
----------------------------------------------- */
.replace {
	position:absolute;
	left:-1px;
	top:0px;
	display:block;
}

/* LISTS
----------------------------------------------- */	
ul { margin-left:20px; padding-left:0}

/* FORM
----------------------------------------------- */	
form { margin:0; padding:0;}
input, select { font:11px Verdana, Arial, Helvetica, sans-serif;}
input.button { cursor:pointer;}

/* PAGE LAYOUT
----------------------------------------------- */	
#container { width:714px; margin:0 auto; text-align:left; font-size:1em; background-color:#FFF; color:#000;}
#masthead { clear:left; padding-left:18px; height:150px; background:#FFF url(../images/bg-header.jpg) no-repeat left top; }
#content { padding:0 29px 0 24px; margin-bottom:50px; font-size:0.9em; line-height:18px; background:url(../images/logo-bottom.jpg) no-repeat right top;}
#footer { background-color:#E4E8ED; color:#7C8999;}

/* NAVIGATION
----------------------------------------------- */
#navigation { list-style:none; margin:0; padding:13px 0 0 0; width:714px; height:34px; background:#339966 url(../images/bg-navigation.gif) no-repeat left top;}
#navigation li { float:left; margin:0; padding:0; height:34px; overflow:hidden; line-height:34px; text-align:center; }	
#navigation li a { display:block; font-size:1em; font-weight:bold; color:#CCFFCC; text-decoration:none;}

#navigation li a:hover { color:#FFA512;}
#navigation li.current a, #navigation li.current a:hover {background-position:0 -34px; color:#CCFFCC;}

li#home, li#home a { background: url(../images/nav-home.gif) no-repeat 0 0; width:84px; height:34px; }
li#about, li#about a { width:74px; background: url(../images/nav-about.gif) no-repeat 0 0;}
li#contact, li#contact a { width:81px; background: url(../images/nav-contact.gif) no-repeat 0 0;}
li#calculator, li#calculator a { width:157px; background: url(../images/nav-calculator.gif) no-repeat 0 0;}
li#examples, li#examples a { width:91px; background:url(../images/nav-examples.gif) no-repeat 0 0;}
li#faq, li#faq a { width:51px; background: url(../images/nav-faq.gif) no-repeat 0 0;}
li#resources, li#resources a { width:97px; background: url(../images/nav-resources.gif) no-repeat 0 0;}

/*
li#login, li#login a { width:72px; background: url(../images/nav-login.gif) no-repeat 0 0;}
li#logout, li#logout a { width:72px; background: url(../images/nav-logout.gif) no-repeat 0 0;}
*/

li#about { margin-left:27px;}
#homepage li#about { margin-left:111px; display:inline;}

/* MASTHEAD
----------------------------------------------- */
#masthead h1 { float:right; position:relative; width:189px; height:150px; margin:0; padding:0; font-size:16px;}
#masthead h1 em { width:189px; height:150px; background:transparent url(../images/logo.jpg) no-repeat left top; cursor:pointer; }
#masthead h1 a { color:#6A0504;}

#masthead h2 { float:left; position:relative; margin:56px 0 0 0; padding:0; font-size:16px; color:#FFF;}
#masthead h2.about { width:96px; height:27px; }
#masthead h2.about em { width:96px; height:27px; background:transparent url(../images/h2-about.jpg) no-repeat left top;}
#masthead h2.contact { width:165px; height:27px; }
#masthead h2.contact em { width:165px; height:27px; background:transparent url(../images/h2-contact-us.jpg) no-repeat left top;}
#masthead h2.calculator { width:293px; height:33px; }
#masthead h2.calculator em { width:293px; height:33px; background:transparent url(../images/h2-pudding-calculator.jpg) no-repeat left top;}
#masthead h2.examples { width:146px; height:33px; }
#masthead h2.examples em { width:146px; height:33px; background:transparent url(../images/h2-examples.jpg) no-repeat left top;}
#masthead h2.faq { width:66px; height:31px; }
#masthead h2.faq em { width:66px; height:31px; background:transparent url(../images/h2-faq.jpg) no-repeat left top;}
#masthead h2.resources { width:146px; height:27px; }
#masthead h2.resources em { width:146px; height:27px; background:transparent url(../images/h2-resources.jpg) no-repeat left top;}

/* Hides from IE5-mac \*/
#masthead h1, #masthead h2 {overflow:hidden;} 
/* End hide from IE5-mac */

/* FOOTER
----------------------------------------------- */
#footer ul { width:714px; list-style:none; margin:0 0 34px 0; padding:0; height:37px; line-height:37px; background-color:#D6DCE3; color:#7C8999; text-align:center; font-size:0.9em}
#footer li { display:inline;} 
#copyright { margin-right:50px;}

/* COMMON ELEMENTS
----------------------------------------------- */ 
#left-column { float:left; width:319px}
#right-column { float:right; width:319px}

.gbox-header { margin:0; padding:0; height:35px; line-height:35px; background:#CBE5D7 url(../images/gbox-small-top.gif) no-repeat left top; color:#33865C; text-align:center;}
.gbox { margin:0; padding:5px 10px; background:#DEEFE6 url(../images/gbox-small-bottom.gif) no-repeat left bottom; text-align:center; font:bold 60px/70px Arial, Helvetica, sans-serif; color:#33865C;}
.gbox-hundred-plus { margin:0; padding:10px 10px; background:#DEEFE6 url(../images/gbox-small-bottom.gif) no-repeat left bottom; text-align:center; font:bold 50px/60px Arial, Helvetica, sans-serif; color:#33865C;}
.gbox-small { margin:0; padding:13px 10px; background:#DEEFE6 url(../images/gbox-small-bottom.gif) no-repeat left bottom; text-align:center; font:normal 1em/18px Arial, Helvetica, sans-serif; color:#33865C;}

.bbox-header { margin:0; padding:0; height:35px; line-height:35px; background:#E4E8ED url(../images/bbox-small-top.gif) no-repeat left top; color:#737F8C; text-align:center;}
.bbox { margin:0; padding:5px 10px; background:#EDF0F3 url(../images/bbox-small-bottom.gif) no-repeat left bottom; text-align:center; font:bold 60px/70px Arial, Helvetica, sans-serif; color:#9099A3;}

div.gbox-wide { padding-bottom:25px; background:#DEEFE6 url(../images/gbox-wide-bottom.gif) no-repeat left bottom;}
div.gbox-wide h2 { margin:0; padding:0 0 0 17px; height:35px; line-height:35px; background:#CBE5D7 url(../images/gbox-wide-top.gif) no-repeat left top;}
div.gbox-wide p, div.gbox-wide form { padding:0 17px; }

div.gbox-medium { padding-bottom:25px; background:#DEEFE6 url(../images/gbox-medium-bottom.gif) no-repeat left bottom;}
div.gbox-medium h2 { margin:0; padding:0 0 0 17px; height:35px; line-height:35px; background:#CBE5D7 url(../images/gbox-medium-top.gif) no-repeat left top;}
div.gbox-medium p, div.gbox-medium form { padding:0 17px; }

.no-margin { margin:0;}

/* PAGESTYLE: HOMEPAGE
----------------------------------------------- */ 
#homepage #masthead { padding-left:94px; height:262px; background:#FFF url(../images/bg-header-home.jpg) no-repeat left top; }
#homepage #masthead h1 { width:235px; height:176px; }
#homepage #masthead h1 em { width:235px; height:176px; background:transparent url(../images/logo-home.jpg) no-repeat left top; }
#homepage #masthead h1 a { color:#6A0504;}

#homepage #masthead h2 { margin:15px 0 0 0; color:#006600;}
#masthead h2.question { width:519px; height:45px; }
#masthead h2.question em { width:519px; height:45px; background:transparent url(../images/header-home-txt.jpg) no-repeat left top;}
#masthead h2.question a {color:#006600;}
#homepage #content { background-image:none;}

#homepage #left-column { float:left; width:313px; padding-top:22px;}
#homepage #right-column { float:right; width:313px; padding-top:41px;}

#homepage h3 { font-size:1.1em; margin-bottom:0;}
#homepage p { margin-top:0;}

.bbox-medium-header { margin:0; padding:11px 0 9px 57px; height:15px; background:#E4E8ED url(../images/bbox-medium-top.gif) no-repeat left top; color:#737F8C;}
.bbox-medium { margin:0; padding:10px 17px; background:#EDF0F3 url(../images/bbox-medium-bottom.gif) no-repeat left bottom; text-align:left; font:1em/17px Georgia, "Times New Roman", Times, serif; color:#000;}
.bbox-medium strong { font-size:1.1em;}

#ask-pudding-index { position:relative; width:264px; height:29px; margin:0 0 20px 0; padding:0; font-size:14px;}
#ask-pudding-index em { width:264px; height:29px; background:transparent url(../images/ask-pudding-expert.gif) no-repeat left top; cursor:pointer; }
#ask-pudding-index a { color:#EE7A06;}

#about-pudding-index { position:relative; width:191px; height:15px; margin:0; padding:0; font-size:12px;}
#about-pudding-index em { width:191px; height:15px; background:transparent url(../images/about-pudding-index.gif) no-repeat left top; }
#about-pudding-index { color:#4C5A6A;}

#get-score { position:relative; width:299px; height:36px; margin:0; padding:0; font-size:12px;}
#get-score em { width:299px; height:36px; background:transparent url(../images/get-your-score.gif) no-repeat left top; cursor:pointer; }

/* Hides from IE5-mac \*/
#ask-pudding-index, #about-pudding-index, #get-score {overflow:hidden;} 
/* End hide from IE5-mac */

/* PAGESTYLE: PUDDING CALCULATOR
----------------------------------------------- */ 
#steps { list-style:none; margin:0; padding:0;}
#steps li { float:left; display:inline; height:42px; font:bold 12px/42px Arial, Helvetica, sans-serif; color:#FFF; padding:0 0 0 18px; margin-bottom:20px;}

#steps li.step-1 { width:131px; background:#339966 url(../images/step-1.jpg) no-repeat left top;  }
#steps li.step-2 { width:174px; padding-left:24px; }
#steps li#step-2-incomplete {background:#E9ECEF url(../images/step-2-off.gif) no-repeat left top; color:#BBBCBE;}
#steps li#step-2-current, #steps li#step-2-completed { background:#339966 url(../images/step-2.gif) no-repeat left top; }
#steps li.step-3 { width:168px; padding-left:24px; }
#steps li#step-3-incomplete { background:#E9ECEF url(../images/step-3-off.gif) no-repeat left top; color:#BBBCBE;}
#steps li#step-3-current, #steps li#step-3-completed { background:#339966 url(../images/step-3.gif) no-repeat left top; }
#steps li#step-1-completed, #steps li#step-2-completed, #steps li#step-3-completed {color:#99CCB3;}

div.gbox-medium form { padding:0 5px;}
div.gbox-medium label { float:left; width:152px; margin-right:2px; padding-top:6px; display:block; text-align:right; vertical-align:middle; font-weight:bold; }
div.gbox-medium label span { font-weight:normal;}
div.gbox-medium .pudding-data { float:left; width:150px; padding-top:6px; margin-left:2px;}
div.gbox-medium input { margin-top:6px;}
div.gbox-medium input.field { width:65px; }
div.gbox-medium input.button { margin:5px 0 0 154px;}
div.gbox-medium input.button-2 { margin:5px 0 0 14px; cursor:pointer;}
div.gbox-medium .mmddyy { color:#7C8999;}

div.wbox-medium { background:#FFF url(../images/wbox-medium-faux.gif) repeat-y left top;}
div.wbox-medium p, div.wbox-medium h3 { margin:6px 0; padding:0 17px; }
div.wbox-medium-top { background:url(../images/wbox-medium-top.gif) no-repeat left top; font-size:1px; line-height:4px;}
div.wbox-medium-bottom { background:url(../images/wbox-medium-bottom.gif) no-repeat left bottom; font-size:1px; line-height:4px;}

#right-column #left { float:left; width:149px;}
#right-column #right { float:right; width:149px;}

#right-column h4 { margin:0; padding:0; font-size:1em; }

#right-column #right ul { padding-left:8px; margin-left:8px}
#right-column #right h4 { color:#9099A3;}

.divider { background:url(../images/v-divider.gif) no-repeat 158px 35px; padding-bottom:80px;}

div.piechart { margin:5px 0 20px 0; font-size:1.1em; font-weight:bold;}

div.piechart .acc-growth { color:#FFF; }
div.piechart .pudding-a-pay { color:#33865C; }
div.piechart .benchmark-a-pay { color:#9099A3; }

ul.piechart-results { list-style:none; margin:0; padding:0; font-size:0.9em; line-height:17px;}
ul.piechart-results li { margin:0 0 20px 0; padding-left:15px;}
ul.piechart-results li#green-1 { background:url(../images/icn-chart-green.gif) no-repeat 0 4px;}
ul.piechart-results li#green-2 { background:url(../images/icn-chart-green-2.gif) no-repeat 0 4px;}
ul.piechart-results li#blue-1 { background:url(../images/icn-chart-blue-1.gif) no-repeat 0 4px;}
ul.piechart-results li#blue-2 { background:url(../images/icn-chart-blue-2.gif) no-repeat 0 4px;}

#right-column .gbox, #right-column .gbox-hundred-plus, #right-column .gbox-small, #right-column .bbox { margin-bottom:20px;}

/* PAGESTYLE: RESOURCES
----------------------------------------------- */ 
ul.links { list-style:none; margin:0; padding:0;}

/* PAGESTYLE: EXAMPLES
----------------------------------------------- */ 
div.example { margin:17px 0 0 0; padding:0; float:left; width:319px; background:url(../images/box-example-gradient.gif) no-repeat left top; }
div.example h2 { margin:14px 0 6px 11px; padding:0;}
div.example ul { list-style:none; margin:0 0 10px 11px; padding:0;}

div.example .left-col { float:left; width:149px;}
div.example .right-col { float:right; width:149px;}

div.r-margin { margin-right:21px; }

/* ADDITIONS **/
#error-box {
  text-align: center;
  color: #FF0000;
}

/* PAGESTYLE: FAQ
----------------------------------------------- */
#faq dt {
 font-size:105%;
 font-weight:bold;
}