/*
CSS document for EMC
http://www.equipmentmanufacturing.com
Created by Nate Hibma, Industrial Quick Search, 2010
Last Edited: 6/23/2010



Color Key:		
				Red: #cf1504;
				Redder: #c60717;
				Darker Red: #a20b00;
				Dark Blue: #1664a6;x
				Deep Green: #429548;


*/






/* ******************************** */
/*				GENERAL				*/
/* ******************************** */

html,body {
	height: 100%;
	width: 100%;
	margin: 0;
	padding: 0;
	font-size: 12px;
}

.clear {
	clear: both;
	margin: 0;
	padding: 0;
}

a, img {
	outline: none;
	border: none;
}

sup {
	font-size: 50%;
	margin: 0 0 0 .2em;
}


/*	HEADINGS		
_____________________________*/
h1, h2, h3, h4, h5 {
	display: block;
	height: auto;
	width: auto;
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 1.2em;
}

h1 {
	font-family: Impact, Arial, Helvetica, sans-serif;
	font-weight: normal;
}

h1.home {
	font-size: 1.8em;
	position: absolute;
	top: 30px;
	left: 0;
	width: 960px;
	z-index: 2;
	margin: 0 auto;
	text-align: center;
	color: #777;
	text-shadow: #fff 1px 1px 5px
}

h1.sub {
	font-size: 3em;
	text-align: left;
	text-shadow: #fff 1px 1px 5px
}

h2 {
	font-size: 2.5em;
	font-weight: normal;
	color: #222;
	font-family: Impact, Arial, Helvetica, sans-serif;
	text-shadow: #fff 1px 1px 2px
}

h2.home {
	position: absolute;
	font-weight: normal;
	font-style: italic;
	font-size: 1.5em;
	top: 64px;
	left: 0;
	width: 960px;
	z-index: 2;
	margin: 0 auto;
	text-align: center;
	color: #3E3E3E;
	font-family: Arial, Helvetica, sans-serif;
}

h2.sub {
	font-size: 2em;
	font-weight: bold;
	text-align: left;
	text-shadow: #fff 1px 1px 5px;
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
	margin: 10px 0;
}


h3 {
	font-size: 1.5em;
	margin: 10px 0 0;
	color: #333;
}

h4, h5 {
	font-size: 5em;
	font-family: "Times New Roman", Times, serif;
	font-weight: normal;
	text-align: center;
	text-shadow: #fff 1px 1px ;
}

h5 {
	font-size: 1.5em;
}

/*		SPANS	
_____________________________*/

.red, .redder, .blue, .green {
	font-size: 1.5em;
}

.red {
	color: #9a010e;
}

.redder {
	color: #c60717;
}

.blue {
	color: #1e8eec;
}

.green {
	color: #4c984b;
}




/*		PARAGRAPHS	
_____________________________*/
p {
	color: #000;
	font-size: 14px;
	line-height: 1.8em;
	margin: 5px 0 20px;
	padding: 0;
}



/*		 LINKS
_____________________________*/
a {
	color: #cf1504;
	text-decoration: underline;
}

a:hover {
	color: #f00;
}



/*		 LISTS
_____________________________*/
ul.standard {
	margin: 10px 0;
	font-size: 1.2em;
	line-height: 1.5em;
}

ul.standard li {
	margin: 10px 10px 20px 0;
}



/*		 TABLES
_____________________________*/
table {
	border: 1px solid #000;
	width: auto;
	margin: 0 auto;
	padding: 0;
	font-size: 1.2em;
}

table td {
	padding: 5px;
	border: 1px solid #000;
}

tr:hover {
	background-color: #eee;
}

tr.bold {
	font-weight: bold;
}

td.constrained {
	width: 70%;
}

table#chart {
	width: 400px;
}

table#compare {
	border: 1px solid green;
	height: auto;
	width: 580px;
	margin: 20px 0;
	font-size: 1em;
}

table#compare td {
	margin: 0;
	padding: 5px;
	border: 1px solid green;
}

table#compare td.description {
	width: 260px;
}

table#compare td.value {
	width: 60px;
}

.bold-red {
	font-size: 2em;
	font-style: italic;
	font-weight: bold;
	color: red;
}


/*		 IMAGES
_____________________________*/
img.float-right {
	position: relative;
	float: right;
	display: block;
	height: auto;
	width: auto;
	margin: 0 0 20px 20px;
	padding: 0;
}






/* ******************************** */
/*			ARCHITECTURE			*/
/* ******************************** */
body {
	background-color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000;
}

#container {
	position: relative;
	height: auto !important; /* real browsers */
	height: 100%;
	min-height: 100%;
	width: 960px;
	margin: 0 auto;
	padding: 0;
}


/* ******************************** */
/*			MAIN ELEMENTS			*/
/* ******************************** */


/*			HEADER
_____________________________*/
#header {
	position: relative;
	top: 0;
	z-index: 99;
	height: 100px;
	width: 960px;
}

img#logo {
	position: absolute;
	display: block;
	height: 83px;
	width: 171px;
	margin: 0;
	padding: 8px;
}


/*		NAVIGATION
_____________________________*/
#navigation {
	position: absolute;
	top: 0;	
	right: 0;
	height: 92px;
	width: auto;
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 14px;
	text-shadow: #000 1px 1px 1px;
	background-image: url(images/nav_spacer2.png);
	background-repeat: repeat-y;
	background-position: right;
	z-index: 99;
	border-bottom: 8px solid #333;
}

#navigation ul {
	position: relative;
	float: right;
	list-style: none;
	margin: 0;
	padding: 0;
	}
	
#navigation ul.current {
	border-bottom: 8px solid #f00;
	}	
	
#navigation ul.current:hover {
	border-bottom: none;
	}

	
#navigation ul li.top-drop-down {
	height: 92px;
}

#navigation ul li.top-drop-down:hover {
	background-image: url(images/navbutton_on.jpg);
	background-repeat: repeat-x;
	border-bottom: 8px solid #f00;
	}

#navigation ul li.top-drop-down a {
	display: block;
	height: 8px;
	width: auto;
	padding: 42px 20px;
	background-image: url(images/nav_spacer2.png);
	background-repeat: repeat-y;
	background-position: left;
}

#navigation ul li.top-drop-down a:hover {
	height: 8px;
}
	
#navigation ul li.top a {
	display: block;
	height: 8px;
	width: auto;
	padding: 42px 20px;
	background-image: url(images/nav_spacer2.png);
	background-repeat: repeat-y;
	background-position: left;
}

#navigation ul li.top a:hover {
	background-image: url(images/navbutton_on.jpg);
	background-repeat: repeat-x;
	height: 8px;
	border-bottom: 8px solid #f00;
	border-left: 1px solid #333;
	margin-left: -1px;
}

#navigation ul a {
	padding: 0;
	color: #fff;
	text-decoration: none;
} 

#navigation ul .item {
	display: none;
	}
	
#navigation ul:hover .item {
	position: relative;
	display: block;
	background: #333;
	}

#navigation ul:hover .item a {
	position: relative;
	display: block; /*important, for clicking area */
	height: auto;
	width: auto;
	padding: 5px;
	margin: 0;
	color: #fff;
	text-decoration: none;
	border-bottom: 1px solid #555;
	}
	
#navigation ul:hover .item a:hover {
	background-color: #222;
	color: #f00;
	}

#navigation ul.submenu {
	position: absolute;
	top: 100px;
	left: 0;
}

#navigation ul.submenu li.item a {
	display: block;
	padding: 6px 8px;
	height: auto;
	width: 220px;
	background-image: none;
	border-bottom: 1px solid #555;
	z-index: 99;
	text-transform: none;
}

#navigation ul.submenu li.item a.current {
	color: red;
}






/*	CONTENT	
_____________________________*/
#contentUpper {
	position: relative;
	height: 730px;
	width: 960px;
}

#contentUpper.sub {
	margin: 40px 0 20px;
	width: 920px;
	height: auto;
}

#contentUpper.sub img {
	position: relative;
	display: block;
	height: auto;
	width: auto;
}

img#water-eater-lg {
	margin: -60px auto 0;
}

img#powerjet-lg {
	margin: 0 0 0 10px;
}

img#jetsink-lg {
	margin: -80px auto 0 140px;
}

#contentLower {
	position: relative;
	margin: 40px 0 0 0;
}

#lowerGradient {
	position: absolute;
	top: 830px;
	left: 0;
	background-color: red;
	height: 77px;
	width: 100%;
	background-image: url(images/content_bg.jpg);
	background-repeat: repeat-x;
}

#contentLower #leftSide {
	position: relative;
	float: left;
	width: 600px;
}

#leftSideSub {
	position: relative;
	float: left;
	width: 580px;
}

#contentLower #rightSide {
	position: relative;
	float: right;
	width: 360px;
}

#contentLower #rightSide img {
	position: relative;
	display: block;
	height: auto;
	width: auto;
	margin: 0 auto;
	padding: 5px 5px 5px 0;
}

.imgContainer {
	position: relative;
	float: right;
	background-image: url(images/img_bg.png);
	background-repeat: no-repeat;
	height: 285px;
	width: 320px;
}

.imgContainer2 {
	position: relative;
	float: right;
	background-image: url(images/img_bg.png);
	background-repeat: no-repeat;
	background-position: bottom;
	height: 175px;
	width: 320px;
	margin-bottom: 20px;
}

ul.bigBold {
	display: block;
	position: relative;
	height: auto;
	width: 270px;
	margin: 10px 0 0 40px;
	font-size: 2em;
}

#contentLower #rightSide img.small-divider {
	margin: 10px 0;
}

a.return {
	font-size: 1.3em;
}



/*	Supplemental Links (right side-bar)	
__________________________________________________*/
#supplemental-links {
	padding-left: 40px;

}

#supplemental-links a {
	display: block;
	height: auto;
	width: auto;
	margin: -1px 0 0 0;
	padding: 20px 0;
	color: #777;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.8em;
	text-decoration: none;
	line-height: 1.1em;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
}

#supplemental-links a.current {
	color: #c60717;
}

#supplemental-links a:hover {
	color: #c60717;
	text-decoration: underline;
}



/*	Separator Graphic
__________________________________________________*/
img.separator {
	display: block;
	position: relative;
	height: 6px;
	width: 884px;
	margin: 40px auto;
}


/*	Machine Models	
__________________________________________________*/
#machine-models {
	position: relative;
	height: auto;
	width: 960px;
	margin: 20px 0;
	padding: 0;
}

#machine-models.centered {
	width: 576px;
	margin: 0 auto;
}

.model-container {
	position: relative;
	float: left;
	height: 300px;
	width: 178px;
	margin: 0 5px;
	background-image: url(images/model-bg.jpg);
	background-repeat: repeat-x;
	border: 1px solid #ccc;
}

.model-container:hover {
	border-color: #c60717;
}

.model-container a {
	position: absolute;
	z-index: 99;
	top: 0;
	left: 0;
	display: block;
	height: 300px;
	width: 180px;
	text-decoration: none;
}

.model-container h4 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.5em;
	text-shadow: none;
	height: auto;
	width: 180px;
	margin: -1px 0 5px -1px;
	padding: 5px 0;
	color: #fff;
	text-align: center;
	background-color: #333;
}

.model-container:hover h4 {
	background-color: #c60717;
}

.model-container img {
	position: relative;
	display: block;
	height: auto;
	width: auto;
	margin: 0 auto;
}

.model-container ul {
	position: absolute;
	top: 220px;
	left: 30px;
	width: 140px;
	margin: 0;
	padding: 0;
	color: #333;
	font-size: 1.1em;
	text-shadow: #fff 1px 1px 1px;
}

.model-container ul li {
	margin: 0;
	padding: 0;
}



/*	SEGMENT (generic)
__________________________________________________*/
.segment {
	position: relative;
	height: auto;
	width: 960px;
	margin: 20px 0;
	padding: 0;
}


/*	LIST COLUMNS
__________________________________________________*/
ul.four-column {
	position: relative;
	display: block;
	float: left;
	margin: 0;
	padding: 0;
	height: auto;
	width: 240px;
}

ul.four-column li {
	font-size: 1.4em;
	margin: 10px 0 10px 20px;
	padding: 0;
}

ul.two-column {
	position: relative;
	display: block;
	float: left;
	margin: 0;
	padding: 0;
	height: auto;
	width: 470px;
}

ul.two-column li {
	font-size: 1.4em;
	margin: 10px 0 10px 50px;
	padding: 0;
}





/* Featured Product Columns */

#productColumnLeft, #productColumnMiddle, #productColumnRight {
	position: relative;
	display: block;
	float: left;
	height: 730px;
}
	
#productColumnLeft a, #productColumnMiddle a, #productColumnRight a {
	position: absolute;
	display: block;
	z-index: 3;
	height: 730px;
	width: 320px;
	text-decoration: none;
}

#productColumnLeft h2, #productColumnMiddle h2, #productColumnRight h2 {
	z-index: 1;
}

#productColumnLeft h3, #productColumnMiddle h3, #productColumnRight h3 {
	z-index: 1;
}

#productColumnLeft img, #productColumnMiddle img, #productColumnRight img {
	z-index: 1;
}


	
/* LEFT PRODUCT COLUMN */
#productColumnLeft {
	width: 322px;
	background: url(images/box_bg_left.png) no-repeat 0 0;
	overflow: hidden;
}

#productColumnLeft:hover {
	background-position: 0 -730px;
}

#productColumnLeft img {
	position: absolute;
	margin: 165px 0 0 20px;
	}
	
#productColumnLeft h2 {
	margin: 0 0 0 9px;	
	}
	
#productColumnLeft h3 {
	margin: 0 0 0 24px;	
	}
	
#productColumnLeft ul {
	margin-left: 0;	
	}

	


/* MIDDLE PRODUCT COLUMN */
#productColumnMiddle {
	width: 316px;
	background: url(images/box_bg_middle.png) no-repeat 0 0;
	overflow: hidden;
}

#productColumnMiddle:hover {
	background-position: 0 -730px;
}

#productColumnMiddle img {
	position: absolute;
	margin: 125px 0 0 70px;
	}
	
#productColumnMiddle h2 {
	margin: 0 0 0 27px;	
	}
	
#productColumnMiddle h3 {
	margin: 0 0 0 42px;	
	}
	
#productColumnMiddle ul {
	margin-left: 16px;
	}
	
	
	

/* RIGHT PRODUCT COLUMN */
#productColumnRight {
	width: 322px;
	background: url(images/box_bg_right.png) no-repeat 0 0;
	overflow: hidden;
}

#productColumnRight:hover {
	background-position: 0 -730px;
}

#productColumnRight img {
	position: absolute;
	margin: 170px 0 0 45px;
	}
	
#productColumnRight h2 {
	margin: 0 0 0 51px;	
	}
	
#productColumnRight h3 {
	margin: 0 0 0 106px;	
	}
	
#productColumnRight ul {
	margin-left: 42px;
	}



	
	
/* H2 SETTINGS - ALL */
#productColumnLeft h2, #productColumnMiddle h2, #productColumnRight h2 {
	position: absolute;
	top: 448px;
	font-family: "Arial Black", Impact, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 28px;
	text-shadow: #000 0px 0px 5px;
	color: #efefef;
	text-transform: uppercase;
	text-align: center;
	background-image: url(images/black_25_percent.png);
	background-repeat: repeat-x repeat-y;
	height: 60px;
	width: 260px;
	}
	
#productColumnLeft:hover h2, #productColumnMiddle:hover h2, #productColumnRight:hover h2 {
	color: #fff;
	}	
	
	
/* H3 SETTINGS - ALL */
#productColumnLeft h3, #productColumnMiddle h3, #productColumnRight h3 {
	position: absolute;
	top: 486px;
	font-family: Arial, Helvetica, sans-serif;
	font-style: italic;
	font-size: 15px;
	text-shadow: #000 0px 0px 2px;
	color: #ccc;
	text-transform: uppercase;
	text-align: center;
	}	
	
#productColumnLeft:hover h3, #productColumnMiddle:hover h3, #productColumnRight:hover h3 {
	color: #efefef;
	}	
	
	
/* LIST SETTINGS - ALL */	
#productColumnLeft ul, #productColumnMiddle ul, #productColumnRight ul {
	position: absolute;
	display: block;
	top: 510px;
	left: 0;
	width: 220px;
	color: #efefef;
	}
	
#productColumnLeft ul li, #productColumnMiddle ul li, #productColumnRight ul li {
	font-size: 14px;
	margin-bottom: 10px;
	line-height: 1.1em;
	text-shadow: #000 0px 0px 4px;
	font-weight: normal;
	}
	
	


/*		PHONE	
_____________________________*/
#phone {
	display: block;
	height: 90px;
	width: auto;
	margin: 0 45px 20px 45px;
	padding: 0;
	text-align: center;
	font-size: 30px;
	font-family: "Arial Black", arial,helvetica, sans-serif;
	font-weight: bold;
	color: #f2f2f2;
	line-height: 1.2em;
	background-image: url(images/phone_bg.jpg);
	background-repeat: repeat-x;
	background-position: bottom;
	}
	
#phone:hover {
	color: #ff9;
	}
	
	
/*	ONE QUESTION	
_____________________________*/
/** Declaration for the a.singleRollover selector **/
a.oneQuestion {
	display: block;
	margin: 0 auto;
	width: 179px;
	height: 183px;
	background: url(images/one_question.gif) no-repeat 0 0;
	overflow: hidden;
	text-indent: -10000px;
	font-size: 0px;
	line-height: 0px;
}

/** Declaration for the additional states of the a.singleRollover selector **/

a:visited.oneQuestion {
	background-position: 0 -50px;
}

a:hover.oneQuestion {
	background-position: 0 -182px;
}

a:active.oneQuestion {
	background-position: 0 -150px;
}




/*			FOOTER	
_____________________________*/
#footerWrapper {
	height: 280px;
	margin: 40px 0 0 0;
	padding: 0;
	background-color: #e0e0e0;
	color: #777;
	text-align: center;
	border-top: 1px solid #ccc;
}

#footer {
	width: 960px;
	margin: 0 auto;
	background-image: url(images/footer_bg.jpg);
	background-repeat: repeat-x repeat-y;
}

#footer #contact {
	float: left;
	height: auto;
	width: 599px;
	border-right: 1px solid #ccc;
	margin: 20px 0 0 0;
	font-size: 1.4em;
	text-align: left;
	text-shadow: #fff 1px 1px 1px;
}

#footer h3 {
	color: #777;
	font-family: Impact, Arial Helvetica;
	font-weight: normal;
	font-size: 36px;
}

#footer ul li {
	list-style-type: none;
	margin-bottom: 12px;
}

#footer #question {
	float: right;
	width: 359px;
	height: 148px;
	margin: 20px 0 -20px 0;
	padding-top: 80px;
	border-left: 1px solid #f5f5f5;
	text-shadow: #fff 1px 1px 1px;
}

#footer #question a {
	color: #777;
	font-family: Impact, Arial Helvetica;
	font-weight: normal;
	font-size: 36px;
	text-decoration: none;
}

#footer #question :hover {
	color: #cf1504;;
	font-family: Impact, Arial Helvetica;
	font-weight: normal;
	font-size: 36px;
}

#footer a {
	color: #777;
}

#footer a:hover {
	color: #cf1504;
}

#map {
	float: left;
	margin: 0 20px 0 0;
	width: 220px
}

#mapFrame {
	border: 1px solid #777;
}

#footer a.googlemap {
	font-size: 11px;
	color: blue;
	text-align: center;
}


/* ******************************** */
/*		SECONDARY ELEMENTS			*/
/* ******************************** */

/*	BACKGROUND GRADIENTS
_____________________________*/
#headerBar {
	position: absolute;
	top: 0;
	left: 0;
	height: 100px;
	width: 100%;
	background-color: #555;
	background-image: url(images/header_bg2.jpg);
	background-repeat: repeat-x;
}

#featuredProductBar {
	position: absolute;
	top: 100px;
	left: 0;
	height: 730px;
	width: 100%;
	min-width: 960px;
	background-color: #ccc;
	background-image: url(images/bg_slice.jpg);
	background-repeat: repeat-x;
	border-top: 1px solid #333;
}

#subPageBar {
	position: absolute;
	top: 100px;
	left: 0;
	height: 275px;
	width: 100%;
	min-width: 960px;
	background-color: #ccc;
	background-image: url(images/gradient-bar-sub.jpg);
	background-repeat: repeat-x;
}

#bottomBar {
	position: relative;
	height: 44px;
	padding: 10px 0 0 0;
	width: 100%;
	background-color: #ccc;
	background-image: url(images/bottombar_bg.jpg);
	background-repeat: repeat-x;
	text-align: center;
	color: #999;
	text-shadow: #000 1px 1px 1px;
	line-height: 15px
}

#bottomBar a {
	color: #999;
}

#bottomBar a:hover {
	color: #ccc;
}






/*	
_____________________________*/


/*			
_____________________________*/










