


 
/*
 * Input summary
 */

 	
 	.firstTimeGuidance {
 		text-align: left;
 		padding: 0px 15px 10px 15px;
 	}
 	
 	.workareaheader h1 {
 		color: #fff;
 	}
 		
	.workareaheader .submit {
		background-color: #69c;
		color: #fff;
		float: right;
	}
	
	.workareaheader .submit:hover {
		background-color: #9cf;
		color: #000;
	}
	
	#inputsummary {
		width: 99%;
	}
		
	#inputsummary tr td {
		vertical-align: top;
	}
	
	#inputsummary table {
		border-collapse: collapse;
		border-spacing: 0px;
		width: 100%;
	}
		
	#inputsummary table td {
		padding-top: 2px;
		padding-bottom: 2px;
	}
			

		
	#inputsummary .questionlink {
		color: #008800;
		white-space: nowrap;
	}
	
	#inputsummary .basicprefslink {
		color: #008800;
		white-space: nowrap;
	}
	
	#inputsummary .usagelink {
		color: #008800;
		white-space: nowrap;
	}

	#inputsummary .refineprefslink {
		color: #008800;
		white-space: nowrap;
	}

		
	#inputsummary a, #inputsummary a:link, #inputsummary a:visited {
		color: #008800;
		font-size: 10px;
	}
	
	#inputsummary a:hover {
		color: #c90;
	}

	#inputsummary .oddrow {
		background-color: #e6ebf1;
	}
		
	#inputsummary .evenrow {
		background-color: #f2f5f8;
	}

	#inputsummary .headerrow {
		white-space: nowrap;
	}
	
	#inputsummary .resetlink {
		background-color: #69c;
		text-align: center;
		white-space: nowrap;
	}
		
	#inputsummary .resetlink a, #inputsummary .resetlink a:link, #inputsummary .resetlink a:visited {
		color: #000;
	}
		
	#inputsummary .resetlink a:hover {
		color: #fff;
	}
	
	/*
	 * .item selects the individual input.  .item-1 is one level deeper
	 * (e.g. "Compact Sedan" which would be displayed indented under
	 * "4 Door Sedan").
	 */
	#inputsummary .item {
		font-size: 10px;
		padding-left: 10px;
	}
	
	#inputsummary .item a, #inputsummary .item a:link, #inputsummary .item a:visited {
		color: #008800;
	}
	
	#inputsummary .item a:hover {
		color: #c90;
	}
	
	#inputsummary .item-1 {
		font-size: 10px;
		padding-left: 20px;
	}
	
	#inputsummary .rating {
		text-align: center;
		vertical-align: middle;
		padding-right: 4px;
	}
	
	#legend {
		background-color: #69c;
		text-align: center;
		width: 128px;
		margin: 20px auto 20px auto;
	}
	
	#legend td {
		vertical-align: top;
		font-size: 11px;
	}
	
	td #legendtitle {
		vertical-align: top;
		font-size: 14px;
		font-weight: bold;
		padding: 0px 0px 10px 0px;
	}
	
	td.legendrating {
		padding: 5px;
	}


	#suggestionarea {
		text-align: left;
	}
	
	#suggestionbox {
		border-bottom: 1px solid #fff;
		background-color: #e6ebf1;
	}
	
	#suggestionimage-left {
		position: relative;
		background-image: url(../images/try_next_arrow.jpg);
		background-repeat: no-repeat;
		height: 44px;
		width: 64px;
		vertical-align: bottom;
	}
	
	#suggestionimage-right {
		position: relative;
		background-image: url(../images/try_next_arrow.jpg);
		background-repeat: no-repeat;
		height: 44px;
		width: 64px;
		vertical-align: bottom;
	}
	
	#suggestionimage-rec {
		position: relative;
		background-image: url(../images/blank.gif);
		background-repeat: no-repeat;
		height: 44px;
		width: 64px;
		vertical-align: bottom;
	}
	
	#tryNextRec {
		position: absolute;
		background-image: url(../images/try_next_arrow_right.jpg);
		background-repeat: no-repeat;
		height: 64px;
		width: 38px;
		left: 500px;
		z-index: 1000;
		margin: 0px;
		padding: 0px;
	}
	
	
	/* IE6 box model bugs make the arrow appear in the wrong place, we hack this to fix it under IE6 */
	* html #tryNextRec {
		position: absolute;
		background-image: url(../images/try_next_arrow_right.jpg);
		background-repeat: no-repeat;
		height: 64px;
		width: 38px;
		left: 498px;
		z-index: 1000;
		margin: 0px;
		padding: 0px;
	}
	
	#inputSummaryContainer {
		display: none;
		margin: 0px;
		padding: 0px;
    }
    
    #whatnextshadow {
    	
		background-image: url(../images/drop_shadow_frame.gif);
		background-repeat: no-repeat;
		background-position: bottom right;
		top: 4px;
		position: relative;
		width: 500px;
		border: 1px solid #f2f5f8;
    }
    
    #whatnextbox {
    	background-color: #fcf27f;
		background-image: url(../images/yellow_gradient.jpg);
		background-repeat: repeat-x;
		background-position: top left;
		position: relative;
		top: -1px;
		margin: -5px 5px 5px -5px;
		padding-bottom: 10px;
    }
    
    .whatnext {
		text-align: left;
		font-size: 10px;
		margin-top: 2px;
		margin-bottom: 2px;
		
	}
	
	.whatnext a, .whatnext a:link, .whatnext a:visited {
		color: #008800;
	}
	
	.whatnext a:hover {
		color: #c90;
	}

	.whatnext li {
		padding-top: 4px;
		padding-bottom: 4px;
	}

	#whatnextintro {
		text-align: left;
		padding-bottom: 10px;
	}

	#whatnextintro h1 {
		padding-left: 10px;
		font-size: 12px;
		margin-top: 0px;
		padding-top: 5px;
	}

	#whatNextImage {
		margin: 0px 25px 0px 10px;
		border: 1px solid #000;
		float: left;
		display: none;
	}

	#currentInputsHeading {
		color: #3b6db0;
		font-size: 12px;
	}
	
	#currentInputsHeading a, #currentInputsHeading a:link, #currentInputsHeading a:visited {
		color: #008800;
		font-weight: normal;
		font-size: 10px;
	}

	#currentInputsHeading a:hover {
		color: #c90;
	}
	
		
	#inputSummarySpacer {
		height: 30px;
	}
	
	.workareaheader .clearEnclosed, .workareaheader2 .clearEnclosed {
		background-image: url(../images/buttons/StartOver_image_states.gif);
		width: 84px;
		height: 25px;
	}

	.workareaheader input.clearEnclosed:hover, .workareaheader2 input.clearEnclosed:hover {
		background-image: url(../images/buttons/StartOver_image_states.gif);
		background-position: 0 25px;
	}