@font-face{
font-family:GeometricSlab712W10-Bd;
src:url("GeometricSlab712W10-Bd.eot?#iefix");
src:url("GeometricSlab712W10-Bd.eot?#iefix") format("eot"),
	url("GeometricSlab712W10-Bd.woff") format("woff"),
	url("GeometricSlab712W10-Bd.ttf") format("truetype"),
	url("GeometricSlab712W10-Bd.svg#GeometricSlab712W10-Bd") format("svg");
}

body {
	background-color: white;
}

#idIframeExampleBody,
#idBodyNotInIframe {
	background: white url(../Images/BackgroundTop.jpg) repeat-x;
}

.clsCentrePanelAutoMargin {
	max-width: 958px;
	border-left-color: #DBDBDB;
	border-right-color: #E1E1E1;
	border-top-style: none;
	border-bottom-style: none;
	background-color: white;
	margin-top: -30px;
	padding-left: 0em;
}

#idPanel1Child {
	background-color: #FFD300;
	display: inline-block;
	float: left;
	position: relative; left: -1px; /* Hides the border */
	padding-top: 49px;
	padding-left: 14px;
	padding-right: 18px;
	padding-bottom: 49px;
}

#idPanel1Child + span {
	display: block;
	background-color: black;
	height: 30px;
	margin-right: -1px;
}

#idDivOuter > span {
	display: block;
	background-color: black;
	height: 29px;
}

.clsPanel2 {
	font-family: GeometricSlab712W10-Bd, serif;
	color: #7d7d7d;
	font-size: 1.95em;
	margin-top: 1.6em;
	margin-left: 270px; /* 208+14+18=240 (logo width) plus 30px */
	line-height: 0.9em;
}

.clsIframeContainer {
	clear: left;
	padding-top: 2em;
}

#idDivInner {
	padding-right: 0em;
}

.clsPreResults,
.clsResultsContainer,
.clsFooter {
	margin-left: 1em;
	margin-right: 1em;
}

form {

	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#FFFDF4+0,ffd300+100 */
	background: #FFFDF4; /* Old browsers */
	background: -moz-linear-gradient(top,  #FFFDF4 0%, #ffd300 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #FFFDF4 0%,#ffd300 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #FFFDF4 0%,#ffd300 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFDF4', endColorstr='#ffd300',GradientType=0 ); /* IE6-9 */
	border-radius: 15px;
	padding: 1em;
	margin-bottom: 2em;
}

#idDatasetMenu {
	float: right;
	margin-bottom: 1em;
	border: 1px solid #c0c0c0;
	border-radius: 4px;
	padding: 0.5em;
	background-color: rgba(255, 255, 255, 0.2);
}

#idDatasetMenu label {
	margin-left: 0.3em;
}

.clsResetDiv {
	clear: right;
}

.clsResetDiv > input[type="submit"] {
	background-color: black;
	color: white;
	border-style: none;
	border-radius: 5px;
	padding: 4px 9px;
}

.clsResetDiv > input[type="submit"]:hover {
	background-color: #4B4749;
}

#txtFragmentModelDesc {
	border-style: none;
	padding-top: 2px;
	padding-bottom: 2px;
	height: 24px;
	border-radius: 8px 0px 0px 8px;
	padding-left: 0.5em;
}

#cmdOkSearch {
	background: white url(../Images/IconSearch.png) no-repeat center 4px;
	color: rgba(255, 255, 255, 0);
	border-style: none;
	border-radius: 0px 8px 8px 0px;
	margin-left: 0em;
	height: 28px;
}

#cmdOkSearch:hover {
	background: white url(../Images/IconSearch.png) no-repeat center -21px;
}

.clsEquipmentMakeModelContainer {
	background-image: none; /* Undo Default.css's value. */
	padding-left: 0em; /* Undo Default.css's value. */
	min-height: 0px; /* Undo Default.css's value. */
}

.clsCompartment0,
.clsCompartment1 {
	color: #464646;
	background-color: #f2f2f2;
	border: 1px solid #adadad;
}

.clsLubeProductsQuantityAndNoteRefs > :not(.clsLubeQuantityAndNoteReferences) + .clsProductContainer {
	/* A product with no notes nor qty. */
	margin-top: 1em;
}

.clsCompartmentType > span {
	float: right;
	xheight: 60px;
	width: 80px;
	text-align: center;
	margin-left: 0.5em; /* So it doesn't bang into text to its left. */

	padding-top: 1%;
	padding-bottom: 1%;

}

.clsResultsContainer > .clsEngine        { border: 2px solid rgba(0,112,192,1); } /*blue*/
.clsResultsContainer > .clsMultifunction { border: 2px solid rgba(112,48,160,1); } /*purple*/
.clsResultsContainer > .clsTransmission  { border: 2px solid rgba(0,176,80,1); } /*green*/
.clsResultsContainer > .clsHydraulic     { border: 2px solid yellow; }
.clsResultsContainer > .clsGear          { border: 2px solid red; }
.clsResultsContainer > .clsGrease        { border: 2px solid rgba(166,166,166,1); } /*grey*/
.clsResultsContainer > .clsCoolant       { border: 2px solid black; }
.clsResultsContainer > .clsBrakeClutch   { border: 2px solid rgba(255,131,51,1); } /*orange*/

.clsCompartmentType > span.clsEngine        { background: rgba(0,112,192,1)   url(../Images/ShadowGradient.png) repeat-x left bottom; }
.clsCompartmentType > span.clsMultifunction { background: rgba(112,48,160,1)  url(../Images/ShadowGradient.png) repeat-x left bottom; }
.clsCompartmentType > span.clsTransmission  { background: rgba(0,176,80,1)    url(../Images/ShadowGradient.png) repeat-x left bottom; }
.clsCompartmentType > span.clsHydraulic     { background: yellow              url(../Images/ShadowGradient.png) repeat-x left bottom; }
.clsCompartmentType > span.clsGear          { background: red                 url(../Images/ShadowGradient.png) repeat-x left bottom; }
.clsCompartmentType > span.clsGrease        { background: rgba(166,166,166,1) url(../Images/ShadowGradient.png) repeat-x left bottom; }
.clsCompartmentType > span.clsCoolant       { background: white               url(../Images/ShadowGradient.png) repeat-x left bottom; border: 1px solid #e8e8e8; }
.clsCompartmentType > span.clsBrakeClutch   { background: rgba(255,131,51,1)  url(../Images/ShadowGradient.png) repeat-x left bottom; }

/*
@media (min-width: 725px) and (max-width: 830px) {
}
*/

.clsVerticalAlignHelper {
	height: 100%;
	display: inline-block;
	vertical-align: middle;
}

.clsCompartmentType span img {
	vertical-align: middle;
	width: 62%;
}

.clsCompartment0 + .clsCompartment1,
.clsCompartment1 + .clsCompartment0 {
	margin-top: 1em;
}

legend {
	color: black; /* For IE8 */
}

.clsCompartmentType {
	font-size: 110%;
}

#idFooterDivOuter {
	height: 89px;
	background-color: black;
	border-top: 4px solid #FFD300;
	font-family: GeometricSlab712W10-Bd, sans-serif;
	font-size: 12pt;
	color: #FFD300;
}

#idFooterDivOuter > div {
	max-width: 958px;
	margin-left: auto;
	margin-right: auto;
	height: 89px;
	vertical-align: middle;
	position: relative;
}

#idFooterDivOuter > div a {
	position: absolute;
	margin-top: -0.7em;
	top: 50%;
	right: 20px;
	color: #FFD300;
	text-decoration: none;
}

#idFooterDivOuter > div > span {
	display: inline-block;
	vertical-align: middle;
}

#idYLS {
	font-size: 150%;
	margin-left: 20px;
}

@media (max-width: 556px) {
	#idFooterDivOuter > div {
		text-align: center;
		position: static;
	}

	#idFooterDivOuter > div a {
		position: static;
		right: auto;
		top: auto;
		display: block;
		margin-top: 0.5em;
	}
}

@media (max-width: 234px) {
	#idFooterDivOuter {
		font-size: 9pt;
	}
}

.clsLubeImage {
	margin-right: 20px;
}

.clsLubeImage ~ .clsLubeProductNameDiv,
.clsLubeImage ~ .clsVerboseProductDescription,
.clsProductHasImage,
.clsLubeImage ~ .clsProductHyperlinkExtra {
	margin-left: 0em; /* Undo Default.css */
}

.clsLubeQuantityAndNoteReferences a,
.clsFooter a {
	color: #846C00;
}

@media (min-width: 725px) and (max-width: 830px) {
	#txtFragmentModelDesc {
		width: 54%;
	}
}

@media (max-width: 724px) {
	#lblFragmentModelDesc {
		display: block;
	}
}

@media (max-width: 800px) {
	#idPanel1Child {
		max-width: 30%;
	}
	#idPanel1Child img {
		width: 100%;
	}
}

@media (max-width: 694px) { .clsPanel2 { margin-left: 40%; } }
@media (max-width: 486px) { .clsPanel2 { font-size: 1.5em; } }
@media (max-width: 382px) { .clsPanel2 { font-size: 1.2em; margin-left: 42%; } }
@media (max-width: 318px) { .clsPanel2 { font-size: 1em; } }
@media (max-width: 346px) { .clsResetAndChoose > span { display: inline-block; } }
@media (max-width: 269px) { .clsPanel2 { margin-top: 5.5em; margin-left: 1em; } }

	@media (max-width: 664px) {
	.clsLubeImage ~ .clsLubeProductNameDiv,
	.clsLubeImage ~ .clsVerboseProductDescription,
	.clsProductHasImage,
	.clsLubeImage ~ .clsProductHyperlinkExtra {
		padding-left: 0px;
	}

	.clsProductOr.clsProductHasImage {
		width: 182px; /* 170px + width of "or" */
		max-width: 30%;
		text-align: right;
		margin-left: 20px;
	}

	.clsLubeImage {
		width: 170px;
		max-width: 40%;
		margin-right: 20px;
	}

	.clsCompartmentType > span {
		width: 14%;
	}

	.clsLubeProductsQuantityAndNoteRefs  {
		clear: right;
	}

}

@media (min-width: 665px) {
	.clsLubeImage ~ .clsLubeProductNameDiv,
	.clsLubeImage ~ .clsVerboseProductDescription,
	.clsProductHasImage,
	.clsLubeImage ~ .clsProductHyperlinkExtra {
		padding-left: 170px; /* To make space for the left-floated product image... */
	}
}

.clsLubeImage {
	margin-bottom: 1em;
}

.clsLubeImage img {
	width: 100%;
}
