@charset "utf-8";
/* CSS Document */

/*_______________________________________________________________________________
___________STYLES FOR CHOOSING PAGES_____________________________________________________
__________________________________________________________________________________________________*/	



/*_______domCollapseMain________________________________________________________________________
__________________________________________________________________________________________
__________________________________________________________________________________________________*/	
		
		.explenations {
		
			float: left;
			clear: both;
		}
			
		div.domBlock {
		
			float: left;
			clear: both;
			width: 560px;
			display:inline;
		
		}	
	

		.domBlock .trigger{
			cursor:pointer;
			background: #FFFFFF url(../images/dom_header.gif) no-repeat top left;
			margin-bottom: 10px;

		}		
		.domBlock .trigger:hover{
			cursor:pointer;
			background:#ccc;
			background: #FFFFFF url(../images/dom_header.gif) no-repeat top left;
			background-position: 0 -28px; 
			color: #fff;
		
		}		
		.domBlock .expanded{
			background: #FFFFFF url(../images/dom_header.gif) no-repeat top left; 
			background-position: 0 -56px;		
			cursor:pointer;


		}
		.domBlock .expanded:hover{
			background: #FFFFFF url(../images/dom_header.gif) no-repeat top left;
			background-position: 0 -84px; 
			cursor:pointer;
		}
		.domBlock .show{
     	position:static;
    	 display: table;
		 margin-bottom:0px;
		}
		.domBlock .hide{
			position:absolute;
			left:-999em;
			height:1px;
			width:100px;
			overflow:hidden;
		}
		.domBlock h3 {
			
			color:	#eee;
			font-size: 1em;
			font-weight: bold;
			padding-top: 3px;
			padding-left: 5px;
			height: 21px;

		}
		
		.domBlock p {
		
			padding: 5px;
			margin-bottom: 10px;
			clear:left;
		
		}
		
/*_______domCollapse Example Table________________________________________________________________________
__________________________________________________________________________________________
__________________________________________________________________________________________________*/		
		#exampleTable {

			width: 210px;
			float:left;
			margin: 0px;
			padding: 0px;
            clear: none;
            display:inline;
            margin-left:29px;

		}
	
		div.domExampleBlock {

			width: 210px;
			
		
		}	
		
		
		#exampleTable .trigger{
			cursor:pointer;
			background: #FFFFFF url(../images/dom_header_small.gif) no-repeat top left;
			margin-bottom: 10px;

		}		
		#exampleTable .trigger:hover{
			cursor:pointer;
			background:#ccc;
			background: #FFFFFF url(../images/dom_header_small.gif) no-repeat top left;
			background-position: 0 -25px; 
			color: #fff;
		
		}		
		#exampleTable .expanded{
			background: #FFFFFF url(../images/dom_header_small.gif) no-repeat top left; 
			background-position: 0 -50px;		
			cursor:pointer;
		}
		
		#exampleTable .expanded:hover{
			background: #FFFFFF url(../images/dom_header_small.gif) no-repeat top left;
			background-position: 0 -75px; 
			cursor:pointer;
		}
		
		#exampleTable .show{
		
     		 position:static;
    		 display: table;
			 margin-bottom:0px;
		}
		
		#exampleTable .hide{
			position:absolute;
			left:-999em;
			height:1px;
			width:100px;
			overflow:hidden;
		}
		
		#exampleTable h3 {
			
			color:	#eee;
			font-size: 1em;
			font-weight: bold;
			font-size: 1em;
			height: 17px;
			padding-top: 3px;
			padding-left: 5px;
		}
		
		div.example {
		
			font-size: 0.8em;
			color: #FF6600;
			padding-bottom:15px;


		}
		
		.example p{
		
			padding: 5px;
			margin: 0px;	
			color: #000000;
			text-align: left;

		}
		
		.example h4 {
		
			padding-left: 5px;
			color: #000000;
			font-weight: bold;
			font-size: 1em;
			margin: 0px;
			clear: both;
		}

		.example span.price {
			padding-right: 10px;
			font-weight: bold;
			font-size: 1.1em;
			float:right;
			clear: none;
			display: block;
			margin-bottom: 5px;
			
			}
			
		.example span.partName {
			padding-left: 5px;
			width: 150px;
			font-weight: bold;
			text-align: left;
			font-size: 0.9em;
			float:left;
			clear: none;
			display: block;
			margin-bottom: 5px;
	
			}
			
/*_______Example Products________________________________________________________________________
__________________________________________________________________________________________
__________________________________________________________________________________________________*/			
			
.exampleProducts {

		color: #333333;
		width: 205px;
		margin-left: 5px;
		display:inline;

			
}

p.exampleTitle {

		color: #666;
		font-size: 1em;
		font-weight: bold;
		margin: 0px;
		padding:0px;
		padding-bottom: 3px;
		clear:both;

}

.productImage {

		float:left;
		margin: 0px;
		border:none;


}

.productText {

	float:left;
	margin-bottom: 10px;

}

.productTitle {
	
	margin-bottom: 0px;
	padding-bottom: 0px;
	font-size: 1.1em;
	font-weight:bold;
	

}

p.productSpec {

	font-size: 0.8em;
	margin:0;
	margin-bottom: 3px;
	padding:0;
	
}

.exampleProducts a {

		text-decoration: none;
		text-align: left;
		color:#FF6600;
		font-weight: bold;
		font-size: 1.5em;
		margin-bottom: 10px;
}

.exampleProducts a:visited {

		color:#FF6600;

}

.exampleProducts a:hover {

		text-decoration: underline;

}


img.retailer {
	
		padding:0px;
		margin:0px;
		margin-bottom: -1px;	
		padding-left: 4px;
		border: none;
}

/*_______Full Examples________________________________________________________________________
__________________________________________________________________________________________
__________________________________________________________________________________________________*/			
			
.full_example {

		color: #333333;
		width: 270px;
		height: 120px;
		margin-right: 0px;
		margin-left:10px;
		float:left;
		display:inline;


			
}

.textBlock {

	margin:0px;
	padding:0px;
	float:left;
	width: 200px;
	display:inline;

}

.full_example a {

		text-decoration: none;
		display:block;
		color: inherit;

		
}

p.full_exampleTitle {

		color: #666;
		font-size: 1.2em;
		font-weight: bold;
		margin: 0px;
		padding:0px;
		padding-bottom: 10px;
		padding-top: 5px;


}

.full_productImage {

		float:left;
		margin: 0px;
		margin-right: 10px;
		border:none;


}


h4.full_productTitle {
	
	margin: 0px;
	padding: 0px;
	font-size: 1.1em;
	font-weight:bold;
	color:#333333;

	

}

p.full_productSpec {

	font-size: 0.9em;
	margin:0px;
	padding:0px;
	color:#666666;

	
}

p.linkLine {
		
		margin:0px;
		padding:0px;
		text-align: left;
		color:#FF6600;
		font-weight: bold;
		font-size: 1.3em;
		margin-bottom: 10px;
		color: #FF6600;

}


.full_example a:visited {

		color:inherit;

}

.full_example a:hover {

		text-decoration: underline;
		color: #666;

}


img.full_retailer {
	
		padding:0px;
		margin:0px;
		margin-bottom: -1px;	
		padding-left: 4px;
		border: none;
}

.totalCost {

	float:left;
	width:560px;
	text-align:right;
	font-size: 1.8em;
	

}

.totalCost p {

	text-align:right;
	margin-right: 10px;
	margin-top: 20px;

}

.orange {

	color: #FF6600;
	

}

.uses {

	font-size: 1.2em;
	color: #666666;
	margin:0px;
	padding-left:15px;
	
}

.uses li {
	
		padding-bottom: 4px;

}


/*_______Intro Styles________________________________________________________________________
__________________________________________________________________________________________
__________________________________________________________________________________________________*/	


div.iconListBlock {
	width:560px;
	margin-left:20px;
	margin-bottom: 0px;
	margin-top: 20px;
	padding:0;
}
div.iconList {
	float: left;
	margin:0px;
	padding: 0px;
	margin-right: 40px;
	margin-bottom:10px;
	width: 140px;
	height: 95px;
	font-size: 0.8em;
	font-weight:bold;
	text-align:center;
	display:inline;
}
.iconList a {
	text-decoration:none;
		color:#333333;
		display:block;
}

.iconList a:hover {
	text-decoration:underline;
}

.iconList a:visited {
	color:#333333
}

.iconList img {
float:left;
	border:none;
}

.iconList strong {
padding-top: 73px;
	width: 140px;
	height: 20px;
	clear:left;
	text-align:left;
}

div.introText {
	padding:0;
	width:530px;
	float:left;
	margin-left: 15px;
	margin-top: 20px;
	clear:both;
}


.topMargin {

	width:530px;
	float:left;
	padding:0;
	margin-top: 20px;
	margin-left: 15px;
	margin-bottom: 10px;
	clear: left;

}

ul.pageExample{

	list-style: upper-latin;

}

.retailLinks {

	width: 400px;
	margin-left: 40px;

}

.retailLinks a {

	text-decoration: none;
	color: #333333

}

.retailLinks a:hover {

	text-decoration:	underline;

}
.retailLinks a:visited {

	color: #333333

}

.retailLinks img {

	border:none;

}