/* ------------------------------------------------------------------
[Master Stylesheet]

Project:	Ken Blanchard - Cost of Doing Nothing Calculator
Version:	0.1
Last change:	05/08/2009

||****==================================================================****||

[Typography]

All Text:		Georgia, Arial, sans-serif;

Notes:

||****==================================================================****||

# [Color codes]

# Dark Blue (page backgrounds): #0b2244

||****==================================================================****||

/*
 ***  Eric Meyer Reset CSS
 ***  Many thanks to Eric and everyone else who contributed to this reset file
 ***  http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
*
/* -------------------------------------- */
/* ========== BEGIN SECTION ============= */
/* -------------------------------------- */


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	/*font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;*/
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
/*
body {
	line-height: 1;
	color: black;
	background: white;
}
*/
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}


/* -------------------------------------- */
/* ========== END SECTION =============== */
/* -------------------------------------- */

/****==================================================================****/

/* ------------------------------- */
/* PAGE ELEMENTS - Begin Section
/* ------------------------------- */



#cdnCalculator {
	display:block;
	position:relative;
	width:831px;
	height:750px;
    margin: 0 auto;
	font-family:Arial, Helvetica, Georgia, sans-serif;
	font-weight:normal;
}
#cdnCalculator h3 {
	font-family:Georgia, Arial, Helvetica, sans-serif;
}

#cdnCalculator h2.head {
	color:#d04100;
	font-family:Arial;
	font-size:18px;
	padding:20px 0 0 10px;
	margin:0;
}

#cdnCalculator p.head {
	color:#000;
	font-family:Arial;
	font-size:12px;
	padding:10px 0 20px 10px;
	margin:0;
}


#startScreen {
	background: url(../images/startPageBG.jpg) 0 0 no-repeat #fff;
	width:831px;
	height:514px;
	position:absolute;
	z-index: 99;
}
#startScreen span {
	position:absolute;
	top:182px;
	left:71px;
	width:280px;
}
#startScreen span p {
    line-height:24px;
	display:block;
	font-family:Georgia;
	font-size:18px;
	color:#676734;
	font-weight:normal;
    margin:0 0 20px 0;
}
#startScreen .startBtn {
	position:relative;
	top:363px;
	left:76px;
	cursor:pointer;
}

#kbCalc {
	background: url(../images/calc_bg.jpg) 0 0 no-repeat #fff;
	width:831px;
	height:514px;
}

#calcHead { 
	padding:0 12px 0 11px;
}
#calcHead  h3 {
	text-indent: -99999em;
	text-align:center;
	display:block;
	position:relative;
	line-height:41px;
	height:41px;
}

#calcHead .breadCrumb {
	position:relative;
	list-style: none;
    margin: 0;
    padding: 0;
	width:808px;
	height:31px;
	background: url(../images/bc_bg_sprite.jpg) 0px -62px repeat-x #0f0;
}

#calcHead .breadCrumb li {
    display:inline-block;
	float:left;
	height:31px;
	text-align:center;
	background: url(../images/bc_bg_sprite.jpg) 0px -62px repeat-x #0f0;
	font-family:Arial;
	font-size:13px;
	line-height:31px;
    color:#46463b;
	vertical-align:middle;
	position:relative;
}

#calcHead .breadCrumb .bc_cap {
	position:absolute;
	width:18px;
	height:31px;
	top:0px;
	right:0px;
	background: url(../images/bc_cap_sprite.jpg) 0 -93px repeat-x #0f0;
}
#calcHead .breadCrumb .bc_s1 {
	width:216px;
	
	background: url(../images/bc_bg_sprite.jpg) 0px -62px repeat-x #0f0;
}
#calcHead .breadCrumb .bc_s2 {
	width:202px;
	

}
#calcHead .breadCrumb .bc_s3 {
	width:202px;
	
}
#calcHead .breadCrumb .bc_re {
	width:188px;
	line-height:31px;
}



.calcContent { 
	height: 375px;
    width: 808px;
    overflow: auto;
    position: relative;
    clear: left;
	margin:0 12px 0 11px;
	background: url(../images/results_content_bg.jpg) 0 0 repeat;
}
.slideContent div.calcView { 
	position:relative;
 	height: 210px;
  	width: 808px;
	
}

div.calcView form.stepCalc {
	width: 703px;
	position:relative;
	padding:0;
	margin:0px 20px;
	display:block;
}

div.calcView span.stepValue { 
	padding:5px 32px;
}

div.calcView span.stepValue span.fieldAssoc {
    display:inline-block;
	padding:0;
    margin:0;
    width:20px;
    line-height:38px;
    text-indent:0;
	text-align:center;
}

div.calcView p {
	display:block;
	margin:20px;
	padding:0 0 0 20px;
	font-family:Arial;
	font-size:12px;
	color:#7d7c51;
	line-height:12px;
	width:720px;
}

div.calcView h3 {
	color:#d04100;
	font-family:Georgia;
	font-size:17px;
	padding:20px 0 0 20px;
	margin:0 20px;
}
div.calcView form {
	width:720px;
	display:block;
	position:relative;
	height:200px;
	left:20px;
}

div.calcView p.userField {
	background: url(../images/fieldBG.jpg) 0 0 no-repeat;
	height: 38px;
	width: 703px;
	margin:10px 0;
	padding:0;
	position:relative;
	display:block;
	line-height:38px;
	text-indent: 20px
}
div.calcView p.userField label {
	display:block;
	float:left;	
	height: 38px;
	width: 397px;
	padding:0;
	line-height:38px;
	font-size:14px;
	font-weight:bold;
}
div.calcView p.userField label span.tooltip {
	display:none;
}
div.calcView .fieldHelp {
	display:inline;
	cursor:pointer;
}
div.calcView .stepTotal {
    position:relative;
	font-family:Arial;
	font-size:14px;
	font-weight:bold;
	color: #58582c;
	height:33px;
	width:703px;;
	margin:20px 0;
	background: url(../images/stepTotalBG.jpg) 0 0 no-repeat;
    line-height:32px;
	text-indent:20px;
}

div.calcView .stepTotal span {
	position:absolute;;
	display:inline;
	left:447px;
    top:0;
}

#calcFooter {
	padding:0;
	margin:0;
}
#calcFooter .cdnDisclaimer {
	text-align:center;
	font-size: 8px;
}
#totalCost {
	display:block;
	font-family:Georgia;
	font-weight: bold;
	font-size:16px;
	color:#FFF;
    height:52px;
    width:808px;
}
.tcDisplay {
	height: 34px;
	line-height: 30px;
	text-indent:60px;
}
#runTally {
	display:inline-block;
	font-size:18px;
    height:34px;
    text-indent:165px;
}

.cdnDisclaimer {
	font-family: Arial;
	font-size: 8px;
	color: #faf9d1;
	line-height:18px;
    height:18px;
    clear:both;
}

.prev {
	float:right;
    margin-right:20px;
	cursor:pointer;
}

.next {
	float:right;
	cursor:pointer;
}

.slideContent {
	width:760px;
}


/* -------------------------------------- */
/* ========== END SECTION =============== */
/* -------------------------------------- */

/****==================================================================****/

/* ------------------------------- */
/* TOOLTIP ELEMENTs - Begin Section
/* ------------------------------- */


#tooltip {
	position:absolute;
	z-index:9999;
	color:#000;
	font-size:10px;
	width:200px;
	height:auto;
	border: 2px solid #8B8A75 ;
}

#tooltip .tipBody {
	background-color:#FBF8E5;
	padding:10px;
}

/* -------------------------------------- */
/* ========== END SECTION =============== */
/* -------------------------------------- */

/****==================================================================****/

/* ------------------------------- */
/* PDF FORM PANEL - Begin Section
/* ------------------------------- */

#pdfRequest {
	height:67px;
	width:831px;
	background:url(../images/re_pdfBG.jpg) 0 0 no-repeat;
}
#pdfRequest .viewReportLink {
	font-weight:bold;
	text-decoration:underline;
	cursor:pointer;
}

.pdfForm {
	height:204px;
	width:831px;
    padding:10px 0;
    position:relative;
	background:url(../images/formPanel.jpg) 0 0 no-repeat;
	overflow:hidden;
}

#tooltip .tipBody {
	background-color:#FBF8E5;
	padding:10px;
}


/* the form itself */

.pdfForm h3 {
	font-size: 16px;
	color:#fff;
	text-indent:60px;

}

.pdfForm p {
    padding:5px 0 9px 0;
	color:#fff;
	font-size:10px;
	text-indent:60px;
}
.pdfForm form {
    padding:0 0 0 40px;
    margin:0;
    display:block;
}

.pdfForm .formRow {
    display:block;
    padding:0 0 6px 0;
    margin:0;
}

.pdfForm form input {
	width:178px;
	height:18px;
	color:#333333;
	padding:0;
	margin:0 0 0 20px;
}

.pdfForm input.spaceRight {
	display:inline-block;
    position:relative;
}

.pdfForm .rightSide {
    float:right;
    position:absolute;
    top:10px;
    right:10px;
    width:360px;
     text-align:left;
	 color:#fff;
	font-size:10px;
	display:block;
	text-indent:0;
}

.pdfForm .rightSide div.emailUpdates {
    position:absolute;
	display:block;
    color:#fff;
    left:0px;
    top:42px;
    width:130px;
	text-align:left;
	padding:0;
	margin:0;
	text-indent:0px;

}
.pdfForm .rightSide div.contactMe {
    position:absolute;
	display:block;
    color:#fff;
    left:0px;
    top:100px;
	text-align:left;
	width:120px;
	padding:0;
	margin:0;
	text-indent:0px;
}

.pdfForm .rightSide div span {
    display:block;
	font-size:11px;
	line-height:11px;
	padding:0 0 0 5px;
}
.pdfForm .rightSide input {
	float:left;
	padding:0;
	width:10px;
	text-align:left;
	display:block;
	line-height:11px;
	margin:0 8px 0 0;
	padding:0;
}

.pdfForm .rightSide .previewBtn {
    float:right;
    text-align:center;
    width:150px;
    position:relative;
    top:5px;
    right:50px;
    
}
.pdfForm .rightSide .exampleReport {
    padding-bottom:6px;
}
.pdfForm .rightSide .sendMyResults {
	cursor:pointer;
}






/* -------------------------------------- */
/* ========== END SECTION =============== */
/* -------------------------------------- */

/****==================================================================****/

/* ------------------------------- */
/* RESULTS GRAPH - Begin Section
/* ------------------------------- */


#graphDisplay .currentCost .tally {
	display:block;
    font-size:18px;
    padding:23px 0 10px 0;
}

#graphDisplay .projectedSavings .tally {
	display:block;
    font-size:18px;
    padding:23px 0 10px 0;
}


#results .prev {
	float:none;;
	margin:0;
	cursor:pointer;
}

#results .startOverBtn {
	cursor:pointer;
}

#results .STAFBtn {
	cursor:pointer;

}

#results .getReportBtn {
	cursor:pointer;
}

#results div.resultsGraph {
	width:711px;
	height:268px;
	background: url(../images/chartBG.jpg) 0 0 no-repeat;
	padding:0;
	margin:10px 0 2px 40px;
	display:block;
}

.resultsCTA {
        display:inline-block;
        padding:0 0 0 10px;
        margin:0;
        width:392px;
        height:32px;
        line-height:32px;
        text-align:right;
		position:relative;
}	

#results h3 {
    padding:20px 0 0 20px;
	margin:0 20px 10px 20px;
	font-weight:normal;
}
#results div.ctaResultsBar {
	padding:0 0 0 40px;
	margin:0;
	display:block;
}

#results p.resultP {
	font-family:Arial;
	font-size:22px;
	color:#d04100;
    background:url(../images/totalCostBG.jpg) no-repeat;
    height:32px;
    width:303px;
    line-height:32px;
    text-indent:30px;
    padding:0;
    margin:0;
    display:inline-block;
	float:left;

}

#results p.cdnDisclaimer {
	padding:0;
	margin:0 0 0 42px;
	font-size:9px;
	
}

#results .getReportBtn {
    position:absolute;
    top:278px;
    right:85px;;
}

#graphDisplay .leftBar {
    width:181px;
	height:188px;
    background:url(../images/loss_graph.gif) 0 0 no-repeat;
    position:absolute;
    bottom:-128px;
    left:59px;
}
#graphDisplay .rightBar {
    width:181px;
	height:188px;
    background:url(../images/save_graph.gif) 0 0 no-repeat;
    position:absolute;
    bottom:-128px;
    left:241px;
    color:#6b7300;
}
#graphDisplay .currentCost {
    position:relative;
    width:125px;
    font-family: Arial;
    font-size: 14px;
    color:#FFF;
    display:block;
    text-align:center;
    left:12px;
}

#graphDisplay .projectedSavings {
    position:relative;
    width:125px;
    font-family: Arial;
    font-size: 14px;
    display:block;
    text-align:center;
    left:12px;
}

#graphDisplay {
	width:300px;
	height:100px;
	float:left;
    position:relative;
}

#graphKey {
        text-align:right;
	color:#58582c;
	font-family:Arial;
	font-size:13px;
        float:right;
        width:250px;
        padding:2px 25px;
		margin:0;
		text-indent:0;
}
#graphKey li {
        padding:9px 0;
}

#graphKey li span.tooltip {
	display:none;
}


/* -------------------------------------- */
/* ========== END SECTION =============== */
/* -------------------------------------- */

/****==================================================================****/