/*
 * Generic properties
 */

	.bug li {
		margin-left: 30px;
	}

	#errorguy {
		float: left;
		margin-right: 20px;
		border: 1px solid #666;
	}

	
	.alignleft {
		text-align: left;
	}

    #slidertip {
        position: absolute;
        z-index: 200;
        background-color: lightyellow;
        color: #000;
        font-size: 11px;
        text-align: left;
        visibility: hidden;
        width: 160px;
        padding: 4px;
        border: 1px solid #000;
    }
    
    #leveltip {
        position: absolute;
        z-index: 200;
        background-color: lightyellow;
        color: #000;
        font-size: 11px;
        text-align: left;
        visibility: hidden;
        width: 300px;
        padding: 4px;
        border: 1px solid #000;
    }
    
    body {
        font-family: verdana, arial, helvetica, sans-serif;
        background-color: #ddd;
        color: #bbb;
        width: 885px;
        text-align: center;
        margin: 0px auto 0px auto;
    }
    
    h1#tooltitle {
    	color: #3b6db0;
    	text-align: left;
    	font-size: 16px;
    	background-color: #fff;
    	margin: 0px;
    	padding: 10px 15px 10px 15px;
    }
    
    #toprule {
    	margin: 0px;
    	background-color: #fff;
    	height: 1px;
    	border-bottom: 1px solid #cacac7;
    	line-height: 1px;
    	font-size: 1px;
    }
    
    
    #floatingbodyleft {
		width: 885px;
		margin: 0px 10px 0px 0px;
		background-image: url(../images/Workspace_Shadow_Left.gif);
		background-repeat: repeat-y;
		background-position: top left;
		position: relative;
    }
    
    #floatingbodyright {
    	margin-left: 10px;
    	width: 875px;
    	background-image: url(../images/Workspace_Shadow_Right.gif);
		background-repeat: repeat-y;
		background-position: top right;
    }
    #floatingbody {
		width: 865px;
		margin-right: 10px;
    }

    a img {
        border: 0px;
    }
    
    .hide {
        display: none;
    }
    
    .printonly {
        display: none;
    }
    
    .emailaddress {
        font-style: italic;
    }

    input.submit {
        background-color: #ffdc92;
        margin: 4px;
    }
    

    input.submit:hover {
        background-color: #ffae00;
    }
    
    
    input.submit-save {
        background-color: #E3E2D0;
        margin: 4px;
    }
    
    input.submit-save:hover {
        background-color: #ffe;
    }

    a, a:link, a:visited {
        color: #33c;
    }
        
    a:hover {
        color: #c90;
    }
    
    table {
        margin: 2px;
        text-align: left;
    }
    
    td {
        color: #000;
        font-size: 10px;
    }

    td.label {
        text-align: right;
        color: #666;
    }
    
    td.forminput {
        text-align: left;
    }
    
    .error {
        color: #f00;
        font-size: 12px;
        text-align: left;
        padding: 10px 15px 0px 15px;
    }
        
    .slider {
        height: 25px;
        width: 250px;
        padding: 0px 20px 0px 21px;
        position: absolute;
    }
    
    .dualslider {
        height: 40px;
        width: 350px;
        padding: 0px 15px 0px 15px;
        position: absolute;
    }
    

            
    tr.rowheader td.left {
        text-align: left;
        font-size: 10px;
        width: 97px; /* slidercell width / 3 */
        max-width: 97px;
        padding: 0px;
    }
        
    tr.rowheader td.center {
        text-align: center;
        font-size: 10px;
        width: 97px; /* slidercell width / 3 */
        max-width: 97px;
        padding: 0px;
    }
        
    tr.rowheader td.right {
        text-align: right;
        font-size: 10px;
        width: 97px; /* slidercell width / 3 */
        max-width: 97px;
        padding: 0px;
    }
        
    td.slidercell {
        width: 291px; /* slider width + padding */
        min-width: 291px;
        max-width: 291px;
        height: 46px;
        vertical-align: top;
    }
    
    /* 
     * Labels the level adjacent to the slider 
     */
    td.levellabel {
        min-width: 200px;
    }
    
    td.reset {
        text-align: left;
    }
    
    form {
        margin: 0px;
    }
        
        
    
                    
/*
 * #header box contains #headerlinks and #divider boxes.
 */
    #header {
        background-color: #ffae00;
        width: 865px;
        text-align: left;
        white-space: nowrap;
        margin: 0px;
    }

    #header img {
        background-image: url(../images/CarmaxMasthead.jpg);
        background-color: #006;
        height: 97px;
        width: 865px;
    }


        
    #footer {
        font-size: 11px;
        text-align: left;
        background-color:#ebebeb;
        line-height:26px; /* needed for IE */
        white-space: nowrap;
        height: 26px;
        width: 865px;
    }

    #footer a:link, #footer a:visited {
    	color : #878787;
        font-size : 11px;
        text-decoration : none;
    }
    
    #footer a:hover {
        color: #aac;
    }
    
    #footerlinks {
    	margin-left: 10px;
    }
    
    #feedback {
    	float: right;
    	padding-right: 10px;
    }


	#leftcorner {
		background-image: url(../images/Workspace_Shadow_Bottom_Left.gif);
		background-position: bottom left;
		background-repeat: no-repeat;
		margin: 0px;
		padding: 0px;
	}
	
	#rightcorner {
		background-image: url(../images/Workspace_Shadow_Bottom_Right.gif);
		background-position: bottom right;
		background-repeat: no-repeat;
		height: 15px;
		margin: 0px;
		padding: 0px;
	}

	#bottomedge {
		margin: 0px;
		padding: 0px;
		height: 15px;
		background-color: #ebebeb;
		background-image: url(../images/Workspace_Shadow_Bottom.gif);
		background-position: bottom;
		background-repeat: repeat-x;
	}
	
	#cobrand {
		text-align: right;
		vertical-align: middle;
		font-size: 10px;
		color: #878787;
		padding-right: 10px;
		width: 875px;
	}

	#cobrand img {
		background-image: url(../images/mpa_carmax_cobrand.gif);
		height: 37px;
		width: 103px;
		vertical-align: middle;
	}

/*
 * #navbar contains navigation links such as MPA Home Page, My Auto Advisor
 */
    #navbar {
        background-color: #006;
        white-space: nowrap;
        height: 26px;
        width: 865px;
        text-align: right;
        margin: 0px;
        line-height: 26px;
        display: none;
    }

    #navbar a:link, #navbar a:visited {
    	color : #ddd;
        font-size : 11px;
        text-decoration : none;
        padding-right: 10px;
    }
    
    #navbar a:hover {
        color: #fff;
    }
    

    
    

/*
 * #content contains everything underneath the header and navbar.  
 */
    #content {
        background-color: #fff;
        color: #000;
        margin: 0px;
        width: 865px;
        padding: 10px 0px 10px 0px;
    }



/*
 * For pages with buttonarea, #contentframe is an invisible child of the #content
 * box and just gives us a box to place the #buttonarea and #workarea inside.
 */
    #contentframe {
        margin: 0px auto 0px auto;
        width: 845px;
    }
    

    /*
     * Unsaved work indicator is defaulted to hidden, but could be set
     * to visible by a script.
     */
    #unsavedwork {
        visibility: hidden;
        font-size: 9px;
        float: right;
        color: #006;
        padding-top: 8px;
    }

/*
 * #buttonarea is a table that holds the question buttons.
 */         
    #buttonarea {
        font-size: 11px;
        color: #000;
        border-spacing: 0px;
        border-collapse: collapse;
        margin: 0px 0px 10px 0px;
        text-align: left;
    }

    
    #buttonarea tr#buttons {
        vertical-align: top;
        font-weight: bold;
        height: 52px;
    }
    
    /*
     * Default button image properties.
     */
    #buttonarea tr#buttons img, #buttonarea td#autoslikethisbuttons img {
        height: 45px;
        width: 98px;
        background-repeat: no-repeat;
        background-position: top left;
        vertical-align: top;
        margin: 0px;
    }
    
    
    #buttonarea td#recommendationbuttons img {
        width: 145px;
        height: 32px;
        background-repeat: no-repeat;
        background-position: top left;
        vertical-align: top;
    }
    

    
/*
 * Contains the right column table, which lives in
 * a rowspan.  It must have a background-color set
 * that corresponds to the tip background color, since
 * we use this to make it look like the tip area extends
 * to the bottom of the workarea.  Should be overridden
 * by subsections.
 */
    #rightcolumn-holder {
        vertical-align: top;
        margin: 0px;
        padding: 0px;
        background-color: #fff;
    }
    
    #rightcolumn {
        border-spacing: 0px;
        border-collapse: collapse;
        text-align: center;
        margin: 0px;
        padding: 0px;
        width: 155px;
    }
    
    /*
     * The area for the input summary and favorites links.
     */
    #inputsfavorites {
        margin-top: 0px;
        margin-bottom: 10px;
        text-align: left;
        padding: 4px;
    }
    
    #inputsresetbox {
    	background-color: #f2f5f8;
        border: 1px solid #cacac7;
        white-space: nowrap;
        width: 144px;
        padding-top: 4px;
        padding-bottom: 4px;
    }
        
    #inputsfavorites a, #inputsfavorites a:link, #inputsfavorites a:visited {
        font-size: 10px;
        margin-left: 10px;
        color: #008800;
    }
    
    #inputsfavorites a:hover {
        color: #c90;
    }

/*
 * Tip areas for the various sections.  These areas all contain
 * a #tipcontent section.  Subsections should define a #tip
 * style to override this default one.
 */
    #tip {
        background-color: #fff;
    }

    
    #tipcontent {
    	display: none;
        margin: 10px;
        font-size: 11px;
        color: #000;
        padding: 6px 0px 0px 0px;
        text-align: left; /* Needed to counteract the IE center hack */
    }

    #learnmoreclickimage {
        background-image: url(../images/LearnMoreClickIcon.gif);
        background-repeat: no-repeat;
        width: 111px;
        height: 75px;
    }

    #learnmoreimage {
        background-image: url(../images/LearnMoreIcon.gif);
        background-repeat: no-repeat;
        width: 74px;
        height: 73px;
    }    
    
    #tooltip {
    	border: 1px solid #000;
    	background-color: #35425F;
		color: #FFF;
    	position: absolute;
    	left: -1000px;
    	top: -1000px;
    	margin-left:-275px;
    	margin-top: -200px;
    	z-index: 500;
    	visibility: hidden;
		padding: 15px;
		line-height: 16px;
		font-size: 12px;
		text-align: left;
		width: 550px;
    }
    
    #tooltip table {
    	border: 1px solid #000;
    	padding: 0px 0px 0px 0px;
    	margin: 0px auto 0px auto;
    }
    
    #tooltip td {
    	font-size: 12px;
    	background-color: #5F5F5F;
    	color: #FFF;
    }

    #tooltip th {
    	font-weight: 500;
    	font-size: 12px;
    	background-color: #5F5F5F;
    	color: #FEFF5F;
    }
    
    
    #closebutton {
        visibility: hidden;
    }
    
    #tooltip #closebuttonimage {
        width: 13px;
        height: 13px;
        z-index: 10000; 
        cursor: pointer;
        float: right;
        border-top: 1px solid #AFAFAF;
        border-right: 1px solid #AFAFAF;
        border-bottom: 1px solid #5F5F5F;
        border-left: 1px solid #5F5F5F;
        margin: 0px 0px 7px 7px;
    }

    
    

/*
 * Button areas
 */




    #buttonarea tr#buttons a#usagebutton img {
        background-image: url(../images/buttons/top_button_states.gif);
    }
    #buttonarea tr#buttons a#usagebutton:hover img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: 0 -45px;
    }


    #buttonarea tr#buttons a#usagebutton-checked img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: 0 -90px;
    }
    #buttonarea tr#buttons a#usagebutton-checked:hover img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: 0 -135px;
    }
    
    #buttonarea tr#buttons a#usagebutton-pressed img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: 0 -45px;
    }    
    #buttonarea tr#buttons a#usagebutton-pressedandchecked img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: 0 -45px;
    }


    #buttonarea tr#buttons a#pricebutton img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -98px 0px;
    }
    #buttonarea tr#buttons a#pricebutton:hover img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -98px -45px;
    }

    #buttonarea tr#buttons a#pricebutton-pressed img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -98px -45px;
    }
        
    #buttonarea tr#buttons a#pricebutton-pressedandchecked img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -98px -45px;
    }

    #buttonarea tr#buttons a#pricebutton-checked img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -98px -90px;
    }
    #buttonarea tr#buttons a#pricebutton-checked:hover img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -98px -135px;
    }


    #buttonarea tr#buttons a#brandsbutton img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -294px 0px;
    }
    #buttonarea tr#buttons a#brandsbutton:hover img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -294px -45px;
    }

    #buttonarea tr#buttons a#brandsbutton-pressed img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -294px -45px;
    }

    #buttonarea tr#buttons a#brandsbutton-pressedandchecked img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -294px -45px;
    }


    #buttonarea tr#buttons a#brandsbutton-checked img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -294px -90px;
    }
    #buttonarea tr#buttons a#brandsbutton-checked:hover img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -294px -135px;
    }





    #buttonarea tr#buttons a#sizebutton img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -392px 0px;
    }
    #buttonarea tr#buttons a#sizebutton:hover img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -392px -45px;
    }

    #buttonarea tr#buttons a#sizebutton-pressed img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -392px -45px;
    }

    #buttonarea tr#buttons a#sizebutton-pressedandchecked img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -392px -45px;
    }


    #buttonarea tr#buttons a#sizebutton-checked img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -392px -90px;
    }
    #buttonarea tr#buttons a#sizebutton-checked:hover img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -392px -135px;
    }

    

    #buttonarea tr#buttons a#modelyearbutton img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -196px 0px;
    }
    #buttonarea tr#buttons a#modelyearbutton:hover img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -196px -45px;
    }

    #buttonarea tr#buttons a#modelyearbutton-pressed img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -196px -45px;
    }

    #buttonarea tr#buttons a#modelyearbutton-pressedandchecked img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -196px -45px;
    }


    #buttonarea tr#buttons a#modelyearbutton-checked img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -196px -90px;
    }
    #buttonarea tr#buttons a#modelyearbutton-checked:hover img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -196px -135px;
    }
    

    #buttonarea tr#buttons a#otherattributesbutton img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -490px 0px;
    }
    #buttonarea tr#buttons a#otherattributesbutton:hover img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -490px -45px;
    }

    #buttonarea tr#buttons a#otherattributesbutton-pressed img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -490px -45px;
    }

    #buttonarea tr#buttons a#otherattributesbutton-pressedandchecked img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -490px -45px;
    }

   
    #buttonarea tr#buttons a#otherattributesbutton-checked img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -490px -90px;
    }
    #buttonarea tr#buttons a#otherattributesbutton-checked:hover img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -490px -135px;
    }

  
    #buttonarea tr#buttons a#importancesbutton img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -588px 0px;
    }
    #buttonarea tr#buttons a#importancesbutton:hover img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -588px -45px;
    }

    #buttonarea tr#buttons a#importancesbutton-pressed img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -588px -45px;
    }

    #buttonarea tr#buttons a#importancesbutton-pressedandchecked img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -588px -45px;
    }
 

    #buttonarea tr#buttons a#importancesbutton-checked img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -588px -90px;
    }
    #buttonarea tr#buttons a#importancesbutton-checked:hover img {
        background-image: url(../images/buttons/top_button_states.gif);
        background-position: -588px -135px;
    }
    
    #buttonarea tr#buttons a#importancesbutton-inactive img {
        background-image: url(../images/buttons/WhatsImportant_GREYED_OUT.gif);
    }
    
    
    
    
    
    
    
    /*
     * The cell that holds the label (currently blank) for the section 
     * that contains the recommendation button.
     */
    #recommendationlabel {
        width: 162px;
    }
    
    /*
     * The cell that holds the recommendation button.
     */
    #recommendationbuttons {
        background-color: #fff;
        padding: 48px 2px 6px 2px;
        vertical-align: bottom;
    }
    
    

    #buttonarea a#recommendationbutton img {
        background-image: url(../images/buttons/rec_button_states.gif);
        background-position: 0 -32px;
    }
    #buttonarea a#recommendationbutton:hover img {
        background-image: url(../images/buttons/rec_button_states.gif);
        background-position: 0 -64px;
    }
    
    #buttonarea a#recommendationbutton-inactive img {
        background-image: url(../images/buttons/rec_button_states.gif); 
    }

/*
 * Hack to create a little space between the top and right edges of the work area.
 */
    #workarea-padding {
        padding: 5px 0px 0px 0px;
        vertical-align: top;
        text-align: center;
    }
    
/*
 * #workarea is the container that holds the various questions, 
 * recommendations, etc.  It is basically a wrapper that lets us 
 * set common properties for all pages with the concept of a work area. 
 */
    #workarea {
        font-size: 12px;
        vertical-align: top;
        text-align: center; /* Hack to get IE to center content.
                             * Child sections must explicitly set
                             * text-align to compensate.
                             */
        border-top: 1px solid #cacac7;
        border-right: 1px solid #cacac7;
        width: 678px;
        margin-left: auto;
        margin-right: auto;
    }

    #workarea h1 {
        font-size: 12px;
        margin-top: 5px;
        margin-bottom: 5px;
        color: #3B6DB0;
    }
    
    /**
     * The following two styles set display to inline
     * and block respectively in order to force IE
     * to align the question area name with the 
     * submit buttons on Question Area Pages. IE appears
     * to not align floated elements with block level elements
     * and insists on adding extra spacing above the element
     * even when setting padding and margin to 0;
     */
    #workarea h1.questionAreaHeading {
        font-size: 12px;
        margin-top: 5px;
        margin-bottom: 5px;
    }

    #workarea .questiontext {
        font-size: 10px;
        display: block;
    }


    #purposerule {
        height: 0px;
        border-bottom: 1px solid #cacac7;
        display: none;
    }
    
    .purposekey {
    	padding: 15px 15px 0px 15px;
        font-weight: bold;
        color: #3B6DB0;
        font-size: 12px;
    }
    
    .purposekey img {
        vertical-align: middle;
        display: none;
    }
    
    .purposetext {
        padding: 5px 15px 20px 15px;
        font-size: 10px;
    }
    
    #bigwarning {
        color: #f00;
        font-size: 28px;
        font-weight: bold;
        background-color: #fff;
        text-align: left;
        padding: 10px;
    }
    
/*
 * Styles for ratings bar that appears on input summary and other pages.
 */
    .ratingbarbox {
        width: 50px;
        height: 5px;
        border: 1px solid #000;
        padding: 0px;
        text-align: left;
        margin-left: auto;
        margin-right: auto;
        background-color: #fff;
    }
    
    /*
     * The width of the bar should be set dynamically.
     */
    .ratingbar {
        height: 5px;
        margin: 0px;
        background-color: #039;
        padding: 0px;
    }

    
    /*
     * Default buttons in workarea
     * begin IE 5 Mac hack
     */
    .workareaheader .buttonBorder, .workareaheader2 .buttonBorder {
        margin: 8px 2px 8px 2px;
    }

    .workareaheader .buttonBorderDefault, .workareaheader2 .buttonBorderDefault {
        margin: 8px 2px 8px 2px;
    }
    
    .workareaheader .additionalButtonBorder, .workareaheader2 .additionalButtonBorder {
	    margin: 8px 2px 8px 2px;
    }
    
    .workareaheader .buttonBorder input, .workareaheader2 .buttonBorder input {
        float: right;
    }
    
    .workareaheader .buttonBorderDefault input, .workareaheader2 .buttonBorderDefault input {
        float: right;
    }
    
    .workareaheader .additionalButtonBorder input, .workareaheader2 .additionalButtonBorder input {
	    float: left;
    }
    
    .workareafooter .buttonBorderDefault, .workareafooter2 .buttonBorderDefault {
		margin: 8px 2px 8px 2px;
	}

	.workareafooter .buttonBorderDefault input, .workareafooter2 .buttonBorderDefault input {
		float: right;
    }
    
    .choice {
    	font-size: 10px;
    	max-width: 200px;
    }
    
    
	/*
	 * #workarea subsections for usage
	 */
	#workareacontent, .workareacontent-repeat {
		background-color: #f2f5f8;
		padding-left: 15px;
		padding-right: 15px;
	}
	
	div#workareacontent {
		padding-bottom: 10px;
		background-color: #f2f5f8;
	}
	
	.nopreference {
		padding: 20px 15px 10px 15px;
		margin: 0px auto 0px auto;
		font-size: 10px;
		text-align: left;
	}

	.workareaheader {
		text-align: left; /* Needed to counteract the IE center hack */
		background-color: #e6ebf1;
		border-top: 1px solid #e6ebf1;
		padding: 0px 15px 0px 15px;
		min-height: 44px;
		border-bottom: 1px solid #fff;
	}
	
	.workareaheader2 {
		text-align: left; /* Needed to counteract the IE center hack */
		background-color: #e6ebf1;
		padding: 0px 15px 0px 15px;
		min-height: 44px;
		border-top: 1px solid #fff;
	}
	
	.workareafooter {
		text-align: left; /* Needed to counteract the IE center hack */
		background-color: #e6ebf1;
		padding: 0px;
		border-top: 1px solid #cacac7;
	}
	
	/* IE6 does not respect min-height, so hack it */
	
	* html .workareaheader {
		text-align: left; /* Needed to counteract the IE center hack */
		background-color: #e6ebf1;
		border-top: 1px solid #e6ebf1;
		padding: 0px 15px 0px 15px;
		height: 44px;
		border-bottom: 1px solid #fff;
	}
	
	* html .workareaheader2 {
		text-align: left; /* Needed to counteract the IE center hack */
		background-color: #e6ebf1;
		padding: 0px 15px 0px 15px;
		height: 44px;
		border-top: 1px solid #fff;
	}
	


	/*
	 * Table that holds the sliders.
	 */
	#ratings {
		margin: 0px auto 0px auto;
		border-style: none;
		border-collapse: collapse; 
		border-spacing: 0px;
	}

	#ratings td {
		padding: 4px;
	}

	#ratings tr.oddrow {
		background-color: #f2f5f8;
	}

	#ratings tr.evenrow {
		background-color: #e6ebf1;
	}


	.workareaheader .submitEnclosed, .workareaheader2 .submitEnclosed {
		background-image: url(../images/buttons/Submit_button_states.gif);
		width: 64px;
		height: 25px;
	}
	
	.workareaheader input.submitEnclosed:hover, .workareaheader2 input.submitEnclosed:hover {
		background-image: url(../images/buttons/Submit_button_states.gif);
		background-position: 0 25px;
	}
	
	.workareaheader .cancelEnclosed, .workareaheader2 .cancelEnclosed {
		background-image: url(../images/buttons/Cancel_button_states.gif);
		width: 64px;
		height: 25px;
	}

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

	.workareaheader .continueEnclosed, .workareaheader2 .continueEnclosed {
		background-image: url(../images/buttons/Continue_button_states.gif);
		width: 88px;
		height: 25px;
	}
	
	.workareaheader input.continueEnclosed:hover, .workareaheader2 input.continueEnclosed:hover {
		background-image: url(../images/buttons/Continue_button_states.gif);
		background-position: 0 25px;
	}
	
	.workareaheader .finishEnclosed, .workareaheader2 .finishEnclosed {
		background-image: url(../images/buttons/Finish_button_states.gif);
		width: 61px;
		height: 25px;
	}
	
	.workareaheader input.finishEnclosed:hover, .workareaheader2 input.finishEnclosed:hover {
		background-image: url(../images/buttons/Finish_button_states.gif);
		background-position: 0 25px;
	}
	
	.workareaheader .resetAllSlidersEnclosed, .workareaheader2 .resetAllSlidersEnclosed {
		background-image: url(../images/buttons/Reset_all_sliders_button_states.gif);
		width: 119px;
		height: 25px;
	}

	.workareaheader input.resetAllSlidersEnclosed:hover, .workareaheader2 input.resetAllSlidersEnclosed:hover {
		background-image: url(../images/buttons/Reset_all_sliders_button_states.gif);
		background-position: 0 25px;
	}
	
	.workareaheader .resetSlidersEnclosed, .workareaheader2 .resetSlidersEnclosed {
		background-image: url(../images/buttons/Reset_sliders_button_states.gif);
		width: 88px;
		height: 25px;
	}

	.workareaheader input.resetSlidersEnclosed:hover, .workareaheader2 input.resetSlidersEnclosed:hover {
		background-image: url(../images/buttons/Reset_sliders_button_states.gif);
		background-position: 0 25px;
	}
	
	.workareaheader .checkAllEnclosed, .workareaheader2 .checkAllEnclosed {
		background-image: url(../images/buttons/CheckUncheckAll_button_state.gif);
		width: 82px;
		height: 25px;
	}

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

	.workareaheader .uncheckAllEnclosed, .workareaheader2 .uncheckAllEnclosed {
		background-image: url(../images/buttons/CheckUncheckAll_button_state.gif);
		width: 94px;
		height: 25px;
		background-position: 94px 0;
	}

	.workareaheader input.uncheckAllEnclosed:hover, .workareaheader2 input.uncheckAllEnclosed:hover {
		background-image: url(../images/buttons/CheckUncheckAll_button_state.gif);
		background-position: 94px 25px;
	}
	
	.feedbackEnclosed {
		background-image: url(../images/buttons/RateRecs_button_states.gif);
		width: 161px;
		height: 25px;
	}

	input.feedbackEnclosed:hover {
		background-image: url(../images/buttons/RateRecs_button_states.gif);
		background-position: 0 25px;
	}
	
	.compareEnclosed {
		background-image: url(../images/buttons/Compare_button_states.gif);
		width: 182px;
		height: 25px;
	}

	input.compareEnclosed:hover {
		background-image: url(../images/buttons/Compare_button_states.gif);
		background-position: 0 25px;
	}


	#ratings .submit {
		background-color: #cc9;
	}

	.workareaheader .submitEnclosed:hover, .workareaheader2 .submitEnclosed:hover, #ratings .submit:hover {
		background-color: #dda;
	}
	
	#minmaxsliders {
		padding: 50px 15px 15px 15px;
		height: 60px;
		width: 500px;
		vertical-align: middle;
	}

	.minmaxdisplay {
		text-align: center;
	}

	#ratings {
			margin-left: auto;
			margin-right: auto;
		}
		
	/*
	 * Styles for brands page
	 */
	    

	/*
	 * Table that shows the list of brands with checkboxes
	 */
	#brands {
		border-spacing: 0px;
		border-collapse: collapse;
		margin: 0px auto 0px auto;
		width: 600px;
	}

	#brands .submit, #attributes-rating .submit, #ratings .submit {
		background-color: #cae;
	}

	#brands .submit:hover, #attributes-rating .submit:hover, #ratings .submit:hover {
		background-color: #dbf;
	}

	/*
	 * Table that contains rating sliders for selected brands
	 */
	#attributes-rating {
		border-spacing: 0px;
		border-collapse: collapse;
		margin: 0px auto 0px auto;
	}


	#brands td {
		font-size: 10px;
		padding: 1px 15px 1px 4px;
		white-space: nowrap;
		vertical-align: middle;
		width: 181px;
	}
	
	#brands td input {
		vertical-align: middle;
	}

	#brands td.rating {
		text-align: right;
		border-right: 1px solid #b9d;
		border-left: 1px solid #b9d;
	}

	#attributes-rating td {
		padding: 1px 4px 1px 4px;
	}


/*
 * #workarea sections for Body Type
 */

	/*
	 * Various tables in the attributes section that should be centered
	 */
	#size-categories {
		margin: 0px auto 0px auto;
		border-spacing: 0px;
		border-collapse: collapse;
		width: 600px;
	}
	
	#size-categories tr.evenrow {
		background-color: #e6ebf1;
	}

	.size-rating {
		border-spacing: 0px;
		border-collapse: collapse;
		width: 592px;
		background-color: #f2f5f8;
		margin: 0px auto 0px auto;
	}

	.size-rating td {
		padding: 4px 0px 4px 0px;
		margin: 0px;
	}
	


	#size-categories td {
		padding: 6px;
	}

	#size-categories a {
		color: #000;
	}

	#size-categories a:hover {
		color: #c90;
	}

	.size-continue {
		float: right;
		padding-top: 10px;
	} 


	.size-rating .submit, #size-categories .submit {
		background-color: #cae;
	}


	.size-rating .submit:hover, #size-categories .submit:hover {
		background-color: #dbf;
	}


	.size-rating .oddrow {
		background-color: #f2f5f8;
	}

	.size-rating .evenrow {
		background-color: #e6ebf1;
	}


	/*
	 * Images of body types
	 */
	.col1 img, .col2 img {
		height: 61px;
		width: 128px;
		background-color: #fff;
		margin: 0px;
		border: 1px solid #cacac7;
	}
	
	#size-categories td.col2 {
		padding-left: 150px;
	}

	.size-level-rating-image img {
		height: 61px;
		width: 128px;
		background-color: #fff;
		margin: 0px;
		border: 1px solid #cacac7;
	}


	.levelgroupheader {
		background-color: #c6cbd1;
		font-weight: bold;
	}

	.levelgroupheader td {
		padding: 0px 10px 0px 0px;
	}

	.size-rating .rated-element-label {
		font-size: 10px;
		text-align: left;
		width: 167px;
		padding-left: 3px;
		padding-right: 3px;
	}

	/**
	 * stimuli for convertible:
	 */

	.size-rating #stimuli {
		width: 145px;
		height: 277px;
	}

	/** 
	 *  Note: Had to add valign="top" to the actual td tag that
	 *  uses this style as on IE/Mac Classic and IE 5.0 Windows
	 *  the vertical-align: top did not seem to be honored.
	 */
	.size-rating td.stimuliImage {
		margin: 0px;
		padding: 5px 0px 0px 1px;
		height: 277px;
		vertical-align: top;
	}

	.size-rating td.reset {
		text-align: center;
	}

	.size-rating #slidersWithStimuli {
		width: 405px;
		margin: 0px;
		padding: 0px;
		vertical-align: middle;
	}

	.size-rating #slidersWithStimuliTable {
		border-spacing: 0px;
		border-collapse: collapse;
		vertical-align: top;
		width: 400px;
	}

	/*
	 * exclusively for convertible, to space out the sliders to match the skyscraper image height.
	 */
	.size-rating #slidersWithStimuliTable .oddrow {
		height: 110px;
	}

	.size-rating #slidersWithStimuliTable .rated-element-label {
		width: 116px;
	}

	.size-rating #slidersWithStimuliTable .oddrow td.slidercell {
		vertical-align: middle;
		padding: 0px 0px 25px 0px;
	}


	/*
	 * Table that holds the other attribute selections
	 */
	#select-attribute {
		width: 644px;
		border-spacing: 0px;
		border-collapse: collapse;
		margin: 0px;
	}

	#attributes-rating td {
		padding: 4px;
	}

	#select-attribute td {
		padding: 3px 3px 3px 3px;
	}

	#select-attribute td.checkmark {
		width: 15px;
	}


	#brands .oddrow, #attributes-rating .oddrow, #select-attribute .evenrow {
		background-color: #f2f5f8;
	}

	#brands .evenrow, #attributes-rating .evenrow, #select-attribute .oddrow {
		background-color: #e6ebf1;
	}   


	#select-attribute a, #select-attribute a:link, #select-attribute a:visited {
		color: #008800;
		font-size: 10px;
	}


	#select-attribute a:hover {
		color: #c90;
	}

	img.helpevenrow {
		background-image: url(../images/blank.gif);
		background-repeat: no-repeat;
		height: 32px;
		width: 29px;
		vertical-align: middle;
		padding-right: 2px;
	}


	img.helpoddrow {
		background-image: url(../images/blank.gif);
		background-repeat: no-repeat;
		height: 32px;
		width: 29px;
		vertical-align: middle;
		padding-right: 2px;
	}


	img.attributecheckmarkevenrow {
		background-image: url(../images/CheckMark_on_F2F5F8.gif);
		background-repeat: no-repeat;
		height: 11px;
		width: 13px;
	}

	img.attributecheckmarkoddrow {
		background-image: url(../images/CheckMark_on_E6EBF1.gif);
		background-repeat: no-repeat;
		height: 11px;
		width: 13px;
	}
    
    
    /*
     * IE 5 Mac on classic blows up when it tries to render
     * button borders.
    \*/
    .workareaheader .buttonBorder, .workareaheader2 .buttonBorder {
        float: right;
        margin: 8px 2px 8px 2px;
    }
    
    .workareaheader .additionalButtonBorder, .workareaheader2 .additionalButtonBorder {
		float: left;
		margin: 8px 2px 8px 2px;
	}


    .workareaheader .buttonBorderDefault, .workareaheader2 .buttonBorderDefault {
        float: right;
        margin: 8px 2px 8px 2px;
    }
    
    .workareaheader .buttonBorder input, .workareaheader2 .buttonBorder input {
        float: none;
    }

    .workareaheader .buttonBorderDefault input, .workareaheader2 .buttonBorderDefault input {
        float: none;
    }
    
    .workareaheader .additionalButtonBorder input, .workareaheader2 .additionalButtonBorder input {
	    float: none;
    }
    
    .workareafooter .buttonBorderDefault {
		float: right;
		margin: 8px 2px 8px 2px;
    }
    
    .workareafooter .buttonBorderDefault input {
	    float: none;
    }