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

/* Preformatting */
html{
	font-size: 62.5%;
}

html, body, div, td, tr, table, img, h3{
	padding: 0px;
	margin: 0px;
	border-width: 0px;
}


/* Major Formatting */
body{
	background-color: #8fc1e6;
	background-image: url("../images/bg_gradient.jpg");
	background-repeat: repeat-x;
	background-attachment: fixed;
	background-position: top left;

	font-size: 9pt;
	font-family: Arial, Helvetica, sans-serif;
	color: #273185;
}

p{
	font-weight: bold;
	line-height: 12pt;
}

h1{
	margin-top: 0px;
	color: #EF9E56;
}

h3{
	font-size: 14pt;
	color: #EF9E56;
}

#page_frame{
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;

	background-image: url("../images/bg_frame.png");
	background-repeat: no-repeat;
	width: 750px; 	/* 780px without forced 'padding' */
	height: 740px;	/* Visible Area (w/ padding): 760px */
	padding-left: 40px;
	padding-right: 50px;
	padding-top: 27px;
	padding-bottom: 37px;
}

#page_table{
	width: 750px; /*760*/
	height: 742px;
	border-collapse: collapse;
}
#page_table td{
	vertical-align: bottom;
}

/* Row Heights */
.t_row_1 {height: 240px;}
.t_row_2 {height: 380px;} /*Must be +10px higher than .section height to allow margin between links and SWF banner*/
.t_row_3 {height: 12px; background-color: #EF9E56;}
.t_row_4 {height: 70px; background-color: #273185;}
.t_row_5 {height: 30px;}



/*
		INDUSTRY SECTION IMAGES
	
		Background images setup to allow backwards compatibility
		for older browsers that don't support PNG transparency (most
		commonly Internet Explorer 5. At runtime, a seperate CSS is loaded
		if an agent's platform is detected as being IE5, allowing the following
		attribute to be swapped with an uglier image.
	
		Naturally, an opaque image would've been a more logical choice, but I
		had to assume the background colour might've changed at some point, so
		I wanted a bit of flexibility with the image (and didn't want to adhere
		myself to copying+pasting background contents, instead relying on what
		transparent images are meant for).
		
		Really isn't the prettiest way of working, to say the least, but it's
		the most compatible. At least, until we can be assured nobody's left
		in the world using legacy browsers.
		~ John
*/
.section{
	width: 180px;
	height: 370px; /*Formerly 320px*/
	padding: 0px;
	margin: 0px 10px 0px 0px;
	border-width: 0px;
	background-color: #273185;
	float: left;
}
	.section a:focus{
		outline: none !important;
	}

#s_units{
	margin-right: 0px;
}

.section img{
	border: 0px none transparent;
	background-repeat: no-repeat;
	width: 180px;
	height: 370px;
}

.section:hover			{background-color: #EF9E56;}
#s_dairy			img	{background-image: url("../images/s_dairy.png");}
#s_commercial		img	{background-image: url("../images/s_commercial.png");}
#s_domestic			img	{background-image: url("../images/s_domestic.png");}
#s_units			img	{background-image: url("../images/s_units.png");}

#slogan		{text-align: right;}
#slogan	img{
	width: 366px;
	height: 70px;
	background-image: url("../images/slogan.png");
	background-repeat: no-repeat;
}


#underline .toothpick{
	width: 1px;
	height: 12px;
	visibility: hidden;
}

#footer{
	vertical-align: middle;
	font-size: 9pt;
	color: #8FC2E6;
}

#footer a:link,
#footer a:visited,
#footer a:active
{
	color: inherit !important;
	text-decoration: none;
}

#footer a:hover{
	text-decoration: underline;
}

#footer_table{
	width: 750px;
	padding: 0px;
	margin: 0px;
}

#footer_left	{text-align: left;}
#footer_right	{text-align: right !important;}
.faxlabel		{font-weight: bold;}