@charset "utf-8";
body {
	margin: 0px;
	padding: 0px;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:12px;
	background-color: #41494C;
	background-image: url(gui/pagebg.jpg);
	background-repeat: repeat-y;
	background-position: left top;
	line-height:18px;
}

#wrapper {width:950px;}
	
#hptext {width:900px; color:#FFFFFF;}

#hpnews {
	background-image: url(gui/home-headlines.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	height: 139px;
	width: 236px;
	color:#FFFFFF;
	padding-left:6px;
	font-weight:normal;
}

a.newslink:link {color:#E49538;}
a.newslink:visited {color:#E49538;}
a.newslink:hover {color:#FFFFFF; text-decoration:none;}

#header {
	background-image: url(gui/header.jpg);
	height: 135px;
	background-repeat: no-repeat;
	background-position: left center;
	width:950px;		
}
#topbuttons {
	width:930px;
	text-align:right;
	height: 28px;
	margin-top:7px;
	position:absolute;
	left:0px;
}
.logo {margin-top:16px;}
#nav {width:768px; position:absolute; top:98px; left:200px;}
#contentwrapper {width:950px;	}
#columnleft {float:left;	width: 689px;	margin-right:2px;}
#columnright {float:left;	width: 236px;}	
	
#content {
	padding-left:24px;
	padding-right:36px;
	padding-bottom:24px;
	background-image: url(gui/content-bottom.jpg);
	background-repeat: no-repeat;
	background-position: left bottom;
	margin-top:0px;
}
	
.clearboth {clear:both;	height: 0px;	width: 0px;}
h1 {color:#E1983C; font-size:18px;}


.box {
	padding-right: 20px;
	padding-left: 25px;
	font-size: 13px;
	color: #FFFFFF;
	background-repeat: no-repeat;
	background-image:url(gui/box.png);
	background-position:left top;
	padding-top: 5px;
	height:55px;
	margin-left:-12px;
	
}

.orangina {
	font-size: 11px;
	color: #e4963a;
	text-decoration: underline;
}

.copy {
	font-size: 10px;
	float:left;
	color: #A0A0A0;
}

.pic1 {margin-right:25px; margin-left:15px; margin-bottom:20px; clear:left}
.pic2 {margin-right:25px}
#footerBox {margin:0px auto; width:680px}






/* from links.css */



@charset "utf-8";

a.leftnav:link {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #000000;
	text-decoration: none;

}
a.leftnav:visited {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #000000;
	text-decoration: none;

}
a.leftnav:hover {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FF0000;
	text-decoration: none;
	
}


a.navleft:link {
	color: #000000;
	text-decoration: none;
	margin-right:6px;
	font: bold 10px sans-serif;
	line-height:24px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}
a.navleft:visited {
	color: #000000;
	text-decoration: none;
	margin-right:6px;
	font: bold 10px sans-serif;
	line-height:24px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}
a.navleft:hover {
	color: #FF0000;
	text-decoration: none;
	margin-right:6px;
	font: bold 10px sans-serif;
	line-height:24px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	
}


a.locationlink:link {color: #E1983C;}
a.locationlink:visited {color: #E1983C;}
a.locationlink:hover {color: #007EBF;}

a:link {color: #E1983C;}
a:visited {color: #E1983C;}
a:hover {color: #007EBF;}
a:active {color: #007EBF;}


#contact-inner a:link {color: #c06d24;}
#contact-inner a:visited {color: #c06d24;}
#contact-inner a:hover {color: #007EBF;}
#contact-inner a:active {color: #007EBF;}

#footer-nav {color:white; font-size:11px; padding-top:20px; padding-bottom:5px}
img {border:0px}

/* end from links.css */









/* SpryCollapsiblePanel.css - Revision: Spry Preview Release 1.4 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/* This is the selector for the main CollapsiblePanel container. For our
 * default style, the CollapsiblePanel is responsible for drawing the borders
 * around the widget.
 *
 * If you want to constrain the width of the CollapsiblePanel widget, set a width on
 * the CollapsiblePanel container. By default, our CollapsiblePanel expands horizontally to fill
 * up available space.
 *
 * The name of the class ("CollapsiblePanel") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style the
 * CollapsiblePanel container.
 */
.CollapsiblePanel {
	margin: 0px;
	padding: 0px;
	margin-right:6px;

}

/* This is the selector for the CollapsiblePanelTab. This container houses
 * the title for the panel. This is also the container that the user clicks
 * on to open or close the panel.
 *
 * The name of the class ("CollapsiblePanelTab") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * CollapsiblePanel panel tab container.
 */
.CollapsiblePanelTab {
	font: bold 10px sans-serif;
	margin: 0px;
	padding: 0px;
	padding-top:8px;
	padding-bottom:8px;
	cursor: pointer;
	-moz-user-select: none;
	-khtml-user-select: none;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	
}

/* This is the selector for a CollapsiblePanel's Content area. It's important to note that
 * you should never put any padding on the content area element if you plan to
 * use the CollapsiblePanel's open/close animations. Placing a non-zero padding on the content
 * element can cause the CollapsiblePanel to abruptly grow in height while the panels animate.
 *
 * The name of the class ("CollapsiblePanelContent") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style a
 * CollapsiblePanel content container.
 */
.CollapsiblePanelContent {
	margin: 0px;
	padding: 0px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	padding-bottom:12px;
	padding-right:4px;
}

.CollapsiblePanelContent ul {
	margin: 0px;
	padding: 0px;
	
}

.CollapsiblePanelContent ul li {
	list-style-type: none;	
}


/* An anchor tag can be used inside of a CollapsiblePanelTab so that the
 * keyboard focus ring appears *inside* the tab instead of around the tab.
 * This is an example of how to make the text within the anchor tag look
 * like non-anchor (normal) text.
 */
.CollapsiblePanelTab a {
	color: black;
	text-decoration: none;
	
}
.CollapsiblePanelContent ul li a {
	color: black;
	text-decoration: none;
}
.CollapsiblePanelContent ul li a:visited {
	color: black;
	text-decoration: none;
}
.CollapsiblePanelContent ul li a:hover {
	color: #E1983C;
	text-decoration: none;
}
/* This is an example of how to change the appearance of the panel tab that is
 * currently open. The class "CollapsiblePanelOpen" is programatically added and removed
 * from panels as the user clicks on the tabs within the CollapsiblePanel.
 */
.CollapsiblePanelOpen .CollapsiblePanelTab {
	
}

/* This is an example of how to change the appearance of the panel tab as the
 * mouse hovers over it. The class "CollapsiblePanelTabHover" is programatically added
 * and removed from panel tab containers as the mouse enters and exits the tab container.
 */
.CollapsiblePanelTabHover,  .CollapsiblePanelOpen .CollapsiblePanelTabHover {
	color: #007EBF; 
}

/* This is an example of how to change the appearance of all the panel tabs when the
 * CollapsiblePanel has focus. The "CollapsiblePanelFocused" class is programatically added and removed
 * whenever the CollapsiblePanel gains or loses keyboard focus.
 */
.CollapsiblePanelFocused .CollapsiblePanelTab {
	color: #000000; 
}








/*

Here's a demo stylesheet used to format a menu and its content.
Feel free to alter the menu layout however you want!
All you have to do is ensure the script has the correct CSS property name
(like 'visibility' or 'display') that changes to show/hide menus.

If you want to extend this layout, one good resource for UL/LI formatting is:
    http://www.alistapart.com/articles/taminglists/
Alternatively, you can use any other CSS dropdown layout instead. More here:
    http://www.alvit.de/css-showcase/
Consult your favourite CSS reference for customising fonts/borders/etc.

Otherwise, you can just change the #RGB border/background colours where
suitable to customise for your site -- easy :).

*/



/* HORIZONTAL FREESTYLE MENU LAYOUT */


/* All <ul> tags in the menu including the first level */

#mainnav {font-size:11px; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif}

.menulist, .menulist  ul {
 margin: 0;
 padding: 0;
 list-style: none;
 width:100%;
}

/* Submenus (<ul> tags) are hidden and absolutely positioned downwards from their parent */
.menulist ul {
 display: none;
 position: absolute;
 margin-top: 0px; /* I'm using ems and px to allow people to zoom their font */
 left: -1px;
 width: auto;
 background:url(gui/gray.png);
 padding-left:4px;
 padding-bottom:12px;
 padding-top:0px;
}

.menulist ul li {
padding-top: 16px;
}

/* Second and third etc. level submenus - position across from parent instead */
.menulist ul ul {
	top: -2px;
	margin-top: 2px;
	left: 100%;
	width: auto;	
	padding-left:4px;
	padding-bottom:12px;
	z-index:5000;
	
	
}







.menulist li ul li {
		
}


/*
 All menu items (<li> tags). 'float: left' lines them up horizontally, and they are
 positioned relatively to correctly offset submenus. Also, they have overlapping borders.
*/
.menulist li {
	float: left;
	display: block;
	position: relative;
	
	width:auto;
	margin-left:0px;
	margin-right:-1px;
	font-weight:bold;
	border-right-width: 0px;
	border-right-style: solid;
	border-right-color: #CCCCCC;
}

.menulist li:last-child {
	float: left;
	display: block;
	position: relative;

	width:auto;
	margin-left:0px;
	margin-right:-1px;
	font-weight:normal;
    border-right-width: 0px;
	border-right-style: solid;
	border-right-color: #CCCCCC;
}

/* Items in submenus - override float/border/margin from above, restoring default vertical style */
.menulist ul li {
	float: none;
	margin: 0px;
	margin-bottom: -1px;
	width:100%;	
	font-weight:normal;
	border-right-width: 0px;
	border-right-style: none;	
}



.menulist ul>li:last-child {
 margin-bottom: 1px; /* Mozilla fix */
 width:100%;
 font-weight:normal;
 border-right-width: 0px;
 border-right-style: none;
}

/* Links inside the menu */
.menulist a {
	display: block;
	padding-left:20px;
	padding-right:20px;
	padding-bottom:0px;
	padding-top:0px;
	color: #FFFFFF;
	text-decoration: none;
	width:auto;
	background-image: url(gui/mainnavbg.png);
	background-repeat: no-repeat;
	font-weight:normal;
}

.menulist a:visited {
	display: block;
	padding-left:20px;
	padding-right:20px;
	padding-bottom:0px;
	padding-top:0px;
	color: #FFFFFF;
	text-decoration: none;
	width:auto;
	background-image: url(gui/mainnavbg.png);
	background-repeat: no-repeat;
	font-weight:normal;
}

.navindustry ul {width:180px;}
.navindustry ul ul {width:120px;}
.navproducts ul {width:210px;}
.navproducts ul ul {width:140px;}
.navapplications ul {width:225px;}
.navabout ul {width:132px;}
.navmedia ul {width:116px;}
/* Lit  items: 'hover' is mouseover, 'highlighted' are parent items to visible menus */
.menulist a:hover, .menulist a.highlighted:hover, .menulist a:focus {
 color: #E1983C;
}
.menulist a.highlighted {
 color: #E1983C;
}

/*
 If you want per-item background images in your menu items, here's how to do it.
 1) Assign a unique ID tag to each link in your menu, like so: <a id="xyz" href="#">
 2) Copy and paste these next lines for each link you want to have an image:
    .menulist a#xyz {
      background-image: url(out.gif);
    }
    .menulist a#xyz:hover, .menulist a.highlighted#xyz, .menulist a:focus {
     background-image: url(over.gif);
    }
*/

/* Only style submenu indicators within submenus. */
.menulist a .subind {
 display: none;
}
.menulist ul a .subind {
 display: block;
 float: right;
}


/* 'Escaped Comment' hack for horizontal menubar width in IE5/Mac */
.menulist a {
 float: left;
}
.menulist ul a {
 float: none;
}
/* \*/
.menulist a {
 float: none;
}
/* */


/*
 HACKS: IE/Win:
 A small height on <li> and <a> tags and floating prevents gaps in menu.
 * html affects <=IE6 and *:first-child+html affects IE7.
 You may want to move these to browser-specific style sheets.
*/
*:first-child+html .menulist ul li {
 float: left;
 width: 100%;
}

* html .menulist ul li {
 float: left;
 height: 1%;
}
* html .menulist ul a {
 height: 1%;
}
/* End Hacks */