/* CSS Document */



body {background:#ffffff; font:12px Arial, Helvetica, sans-serif; color:#363636; margin:0px; padding:0px;}



p {font:12px/15px Arial, Helvetica, sans-serif; color:#363636;}

h1 {font:18px/20px Georgia, "Times New Roman", Times, serif; color:#702143; margin:0px; padding:0px;}

h2 {font:15px/18px Georgia, "Times New Roman", Times, serif; color:#702143; margin:0px; padding:0px;}



/*~~~~~~~~~~~~ Site Container ~~~~~~~~~~~~ */

#SiteContainer {position:relative; width:800px; height:auto; margin:0px auto 0px 0px; padding:0px; border:0px; top:0px;}



/*~~~~~~~~~~~~ Header Image, very top ~~~~~~~~~~~~ */

#Header {width:800px; height:92px; margin:0px; padding:0px; background:url(../images/main/Header.gif); background-repeat:no-repeat; border:none;}



	/* --- Added on 20071015 ----*/

#HeaderLinkToHome { width:220px; height:90px; display:block; position:absloute; margin:0px auto auto 0px;}



/*~~~~~~~~~~~~ Sub Header, includes CONTENT and navigation.  ~~~~~~~~~~~~ */

#SubHeader {width:800px; height:auto; min-height:400px; position:relative;}

#NavigationContainer {width:300px; height:300px; top:0px; left:0px; z-index:2; position:absolute;}

#NavigationContainer ul {width:293px; height:auto; margin:0px; padding:0px; list-style-type:none; display:block;}

#NavigationContainer li { width:293px; margin:0px; padding:0px; text-align:left; background-position:top;}

#NavigationContainer a {width:293px; height:32px;}

#NavigationContainer span {text-decoration:none; display:none;}



/*~~~~~~~~~~~~ Sub Header image (big one)   ~~~~~~~~~~~~ */

#ContentContainer img#SubHeaderImage {width:590px; height:auto; top:0px; right:0px; z-index:0; position:absolute;}

#ContentContainer img#ContentTitle {top:135px; right:241px; z-index:1; position:absolute;}





/*~~~~~~~~~~~~ Specific Navigation <li> settings ~~~~~~~~~~~~  Menu is in a <ul> and the items are <li> - The words are one image, in the background of the <li> and the dots are the active rollover, linking images. Rollover images are all 293px wide and ~36px tall, give or take. */

#NavigationContainer li#AboutUs {height:32px; background:url(../images/main/AboutUs_Background.gif) no-repeat;}

#NavigationContainer li#Personnel {height:36px; background:url(../images/main/Personnel_Background.gif) no-repeat;}

#NavigationContainer li#Manufacturers {height:35px; background:url(../images/main/Manufacturers_Background.gif) no-repeat;}

#NavigationContainer li#NewsAnnounce {height:33px; background:url(../images/main/NewsAnnounce_Background.gif) no-repeat;}

#NavigationContainer li#ProjectShowcase {height:36px; background:url(../images/main/ProjectShowcase_Background.gif) no-repeat;}

#NavigationContainer li#CookingLiveDemos {height:36px; background:url(../images/main/CookingLiveDemos_Background.gif) no-repeat;}

#NavigationContainer li#ContactUs {height:43px; background:url(../images/main/ContactUs_Background.gif) no-repeat;}



/*~~~~~~~~~~~~ Content Container (800px wide, sits under the navigation) and Subtitle image (text under VQT logo) ~~~~~~~~~~~~ */

#ContentContainer {width:800px; height:auto; top:0px; right:0px; z-index:1; position:relative; background:url(../images/main/Template2_ContentBackground.gif) top right no-repeat;}

#SubTitleImage {width:293px; height:51px; background:url(../images/main/SubheadText.gif); background-repeat:no-repeat;}



/*~~~~~~~~~~~~ Spacer (sits left under navigation, pushes everything else to the right) ~~~~~~~~~~~~ */

#Spacer {width:300px; height:auto; min-height:400px; float:left;}



/*~~~~~~~~~~~~ Content Settings ~~~~~~~~~~~~ */

#Content {min-height: 225px; width:450px; height:auto; right:0px; float:right; padding-right:30px; z-index:3; margin:180px 0px 0px 0px;}

#Content p{margin:0px 0px 20px 0px;}



/*~~~~~~~~~~~~ Top Link Box - includes Header image and link list. ~~~~~~~~~~~~ */

#TopLinkBox {width:auto; height:auto; margin:0px 0px 20px 0px;}

#Content img#ContentHeader {margin:10px 0px 20px 0px; float:none;}



/*~~~~~~~~~~~~ Top Link List - to get bullet points, had to put image of dot in background of <li> - since IE6 will not display bullets on floated or inline <li>'s. ~~~~~~~~~~~~ */

#TopLinkBox ul#toplinks {width:auto; list-style-type:none; margin:0px 0px 20px 0px; padding:0px; font:12px Arial, Helvetica, sans-serif; font-weight:bold; color:#702143; display:inline;}

#TopLinkBox #toplinks li {width:auto; height:18px; margin:0px 10px 0px 0px; padding:0px 0px 2px 7px; vertical-align:middle; background:url(../images/main/link-dot.gif) no-repeat; background-position:0px 6px; display:inline;}

#TopLinkBox #toplinks li a:link {text-decoration:none; color:#702143;}

#TopLinkBox #toplinks li a:hover {border-bottom:1px solid #702143;}

#TopLinkBox #toplinks li a:visited {text-decoration:none;}



.Bio {margin:0px 0px 20px 0px; float:inherit; width:450px;} 

.Bio img {float:left; margin:0px 15px 0px 0px;}





/*~~~~~~~~~~~~ Footer ~~~~~~~~~~~~ */

#Footer {width:800px; height:50px; clear:both; margin:0; padding:20px 10px 10px 10px; font-size:11px;}

#Footer img {margin:0px 30px 0px 0px; padding:0px; float:left;}

#Footer ul {width:auto; height:20px; list-style-type:none; margin:0px; padding:20px 0px 0px 0px; display:block; right:0px; position:absolute;}

#Footer li {width:auto; height:12px; margin:0px 0px 0px 0px; padding:0px 8px 2px 8px; float:left; border-right:1px solid #363636; text-align:center;}

#Footer li#last {width:auto; height:20px; border:none;}


/*~~~~~~~~~~~~ ADDED - 20071015 - AH ~~~~~~~~~~~~ */

table#ImageTable {
	width:100%;
	height:auto;
	border:none;
	}

#ImageTable td {
	padding:3px;
}	

#ImageTable img {
	border:1px solid #999;
	padding:3px;
}

table#LogoTable {
	width:100%;
	height:auto;
	border:none;
	}

#LogoTablee td {
	padding:3px;
}	

#LogoTable img {
	padding:3px;
}



/*---------------------------------------------------*/