/*
	$RCSfile: OnQProjectDetail.css,v $
	$Revision: 1.10 $
	$Date: 2007/02/22 20:27:03 $
	$Author: dgerlach $

	Description:
	CSS used to format OnQProjectDetail.jsp pages.
*/

/* Control the display of the featured product */
#featured-project {
	display: none;
}

table.product-inventory {
	width: 100%;
}

td.partNumber {
	font-family: Arial, sans-serif;
	font-size: 10px;
	color: #01b6f1;
	line-height: 16px;
	width: 90px;		
}

td.partNumber a:hover {
	text-decoration: none;
}

td.partNumber a {
	color: #01b6f1;
}

td.partQuantity {
	width: 32px;
	text-align: right;
	padding-right: 10px;
	width: 32px;
}

/* Part Description column table settings */
td.part-description {
	padding-left: 10px;
}

/* Define content description container area */
#OnQcontent .description-container {
	width: 647px;
}

/* Define content description area */
#OnQcontent .description-container .description {
	position: relative; 
	background-color: #eef5e6;
	width: 647px;
}

/* Project desciption characteristics */
#OnQcontent .description .text {
	float: left;
	margin: 24px;
	width: 310px;
}

#OnQcontent .description .text a {
	color: #01b6f1;
    font-weight:bold;
	text-decoration:none;
}

#OnQcontent .description .text a:hover {
    text-decoration: none;
}

/* Project attribute labels */
#OnQcontent .description .labels {
	float: left;
	margin-top: 6px;
	padding-left: 361px; 
	border-left: 1px solid #c8cfc0;
	padding-left: 10px; 
	border-right: 1px solid #c8cfc0;
	padding-right: 8px; 
	padding-top: 8px; 
	padding-bottom: 8px; 
	line-height: 22px; 
	text-align: right;
}


/* Project attribute text */
#OnQcontent .description .attributes {
	float: left;
	margin-top: 6px;
	padding-left: 8px;
	padding-top: 8px;
	padding-bottom: 8px;
	line-height: 22px;
}


/* Difficulty image characteristics */
#OnQcontent .description .diff-image {
	float: left;
	padding-top: 60px; 
}

/* What You'll Need Section */
#OnQcontent .what-you-need {
	position: relative; 
	margin-top: 15px; 
	height: 45px; 
	width: 647px;
	border-bottom: 1px solid #e1e7d9;
}

/* What You'll Need Image characteristics */
#OnQcontent .what-you-need .image {
	position: absolute; 
	left: 190px; 
	top: 0px;
}

/* Print button characteristics */
#OnQcontent .what-you-need .print-button {
	position: absolute; 
	right: 117px; 
	bottom: 2px
}

/* Download PDF button characteristics */
#OnQcontent .what-you-need .download-button {
	position: absolute; 
	right: 10px; 
	bottom: 2px;
}

/* This is the container for all the required tools and product inventory */
#OnQcontent .product-tool-container {
	margin-top: 30px; 
	padding-left: 22px;
	width: 647px;
}

/* List of required tools */
#OnQcontent div.product-inventory {
	float: left; 
	width: 425px; 
}

img.product-inventory {
	display: block; 
	margin-bottom: 22px; 
}

/* List of required tools */
#OnQcontent div.required-tools {
	float: left; 
	width: 172px; 
	margin-left: 25px; 
}

/* Control the location of the list of tools */
#OnQcontent div.required-tools ul {
	/* No settings required */
}

img.required-tools {
	display: block; 
	margin-bottom: 22px; 
}


/* Step-by-step Instructions section */
#OnQcontent .how-to-do-it {
	position: relative;
	display: block;
	width: 647px;
}

/* Step-by-step Instructions image characteristics */
#OnQcontent .how-to-do-it .image{
	position: relative;
	top: 15px; 
	border-bottom: 1px solid #e1e7d9;
}

/* This is the area that contains the step number and title */
#OnQcontent .how-to-do-it .step-heading {
	position: relative;
	margin-top: 10px;
	height: 45px;
}
#OnQcontent .how-to-do-it .step-button-image {
	position: absolute;
	top: 10px;
	left: 20px;
}

/* Step number on image */
#OnQcontent .how-to-do-it .step-num {
	position: absolute;
	top: 18px;
	left: 20px;
	text-align: center;
	color: white;
	font-size: 14px;
	font-weight: bold;
	width: 64px;
}

/* Step Title text */
#OnQcontent .how-to-do-it .step-title {
	position: absolute;
	top: 18px;
	left: 102px;
	font-size: 18px;
	color: #6b6e56;
}

#OnQcontent div.step-image-container {
	padding-left: 30px;
	float: left;
	width: 236px;
	text-align: center;
	margin-top: 10px;
}

/* Step-by-Step detail image */
#OnQcontent .how-to-do-it .step-image {
	margin-right: 10px;
	width: 226px;

}

/* Blank Step-by-Step detail image 
   Used when no image is supplied
*/
#OnQcontent .how-to-do-it .step-image-blank {
	top: 2px;
	float: left;
	width: 236px;
	height: 1px;
}


/* Step-by-Step description */
#OnQcontent .how-to-do-it .step-desc {
	float: left;
	width: 198px; 
	margin-top: 10px;
}

#OnQcontent .how-to-do-it .step-desc-2wide {
	padding-left: 30px;
	float: left;
	width: 434px; 
	margin-top: 10px;
}

#OnQcontent .how-to-do-it .step-desc a {
	color: #01b6f1;
    font-weight:bold;
	text-decoration:none;
}

#OnQcontent .how-to-do-it .step-desc a:hover {
    text-decoration: none;
}

/* Step-by-Step Tools Needed container */
#OnQcontent .how-to-do-it .step-tool-container {
	float: left;  
	margin-left: 17px; 
	width: 166px;
	margin-top: 10px;
}

