/*  
CSS Code and Design copyright 2008 to Sullivan+Wolf Design. All Rights Reserved. 
Copying and/or re-using this code, its sub-code or derivatives without written permission is a violation of copyright law.
Visit us at SullivanandWolf.com
 */
 /* Colors used in the folder are pantone 2748 (#002072)

and orange C 0, M 48, Y 95, K 0. (#f89728)

Fonts, heads: ITC Franklin Gothic and body text: Myriad Pro
*/

 /*html*/
 html { font-size: 90%;}
body { padding: 0px; margin: 0px; background-color: #343434; font-family: "Myriad", Calibri, Arial, Helvetica, sans-serif; margin-bottom: 18px; background-image: url(/assets/bg.png); background-repeat: repeat-y; background-position: center top; }
a, p, ul, h1, h2, h3, h4, h5, h6, input, textarea, td, select, table { font-family: "Myriad", Calibri, Arial, Helvetica, sans-serif; }
small { }
p {  }
 h1, h2, h3, h4, h5, h6 {font-family:  Calibri, Arial, Helvetica, sans-serif;}
h1 { font-size: 2.2em; color: #666666; font-weight: lighter; }

h2 { font-size: 1.7em; color: #777; }
h3 { font-size: 1.1em; color: #343434; }

h4 { font-size: 1.1em; color: #6B7985; }
h5 { font-size: 1em; color: #222222; }
h6 { font-size: 1em; color: #111111; }
ul { list-style-type: square; }
li { margin-bottom: 8px; }
table { font-size:100%; }
td { font-size: 1.0em; }
td p { font-size:1.0em; }
h1 sup { font-size:50%; line-height: 0; }
p sup { font-size:70%; line-height: 0; }
select { font-size: 1em; }
input, textarea { padding-top: 1px; padding-right: 2px; padding-bottom: 1px; padding-left: 3px; font-size: 1em; }
textarea { overflow:auto; }
hr { width: 60%; color: #999999; text-align: center; }
form { margin-top: 12px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; width: auto; }
div { margin: 0px; }
/*  Layout  */
#center { width: 100%;  position: absolute; }
#container { width: 981px;margin: 0 auto; text-align:left; position: relative; }
#masthead { background-color: inherit; height:233px; width: 981px; text-align:left; padding-top: 0px; float: left; background-image: url(/assets/bg-logo.jpg); background-repeat: no-repeat; }
#middle { width:981px; text-align:left; float: left; background-color:#FFFFFF; background-image: url(/assets/bg-content-03.png); background-repeat: repeat-x; }

#footer { width: 100%; height: auto;  float: left; background-image: url(/assets/bg-footer.png); background-repeat: no-repeat; padding-bottom: 28px; margin-top: 0px; padding-top: 14px; }
*html #footer { padding-top: 14px; }
#leftcolumn { float: left; width: 200px; padding-top: 12px; min-height:400px; }
#sidenav { }
#content { width: 700px; margin-left: 210px; padding-top: 12px; display: block; padding-bottom: 32px; }

#homeprods { float: left; width: 235px;}
#homeapplications { width: 219px; float: left; }
#homearticles { width: 286px; float: left; }

.homeprods a, #homeapplications a, #homearticles a {margin-left: 18px;}
/* Links */
.homenews {
	float: left;
	width: 325px;
	display: block;
	height: 135px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-right-color: #CCCCCC;
	border-bottom-color: #CCCCCC;
	clear: right;
	padding-left: 12px;
	padding-right: 12px;position: relative;
}
.leftBorder{border-left: 1px solid #ccc;}
.topBorder{border-top: 1px solid #ccc;}

.readmore{text-align: right; position: absolute; bottom: 0px; right: 6px; font-size: 90%;}
.readmore img{width: 16px; height: 16px; border: none; vertical-align: middle; margin-left: 4px;}
 .readmore a:hover{border-bottom: none;}
.homenews:hover{ background-color:#eee;}
.firstLine {
text-indent: 5px;
padding-left: -5px;
}


a { font-size: 100%; }
a:link { text-decoration: none; color: #000066; }
#content p a:link, #content p a:visited { text-decoration: none; color: #000066; border-bottom-width: 0px; border-bottom-style: dashed; border-bottom-color: #FF9900; }

a.nolines:link, a.nolines:visited, a > img {  border-bottom-width: 0px; border-bottom-style: none; }
#content p a:hover { text-decoration: none; color: #339900; border-bottom-width: 1px; border-bottom-style: dashed; border-bottom-color: #FF9900; }
a:visited { text-decoration: none; color: #222222; }
a:hover { text-decoration: none; color: #006600; }



#liveperson { margin-top: 0px; margin-bottom: 0px; float: left; }
#liveperson a:link, #liveperson a:visited, #liveperson a:hover { width: auto; display:inline; background-color:#FFFFFF; float: none; padding: 0px; color: #000000; }

/*#sidenav a { height: auto; width: 67%; padding-top: 2px; padding-bottom: 2px; margin-bottom: 1px; float:left; padding-left: 13%;padding-right: 13%; font-size: 85%;font-weight: bold;  background-color: #eee;}
*html #sidenav a { width: 80%; font-size: 90%; font-weight: bold; }
#sidenav a:hover { color: #FFFFFF; background-color: #666666; }
#sidenav a.nobg:hover { color: #003399; background-color: #ffffff; }


#sidenav a.leveltwo { background-color: #eee; width: 60%; padding-left: 20%;font-weight: normal; } 
#sidenav a.leveltwo:hover { color: #FFF; background-color: #666666; }*/

#sidenav a { height: auto; width: 69%; padding-top: 2px; padding-bottom: 2px; margin-bottom: 1px; float:left; padding-left: 6%;padding-right: 6%; font-size: 85%;font-weight: bold;  background-color: #eee;}
*html #sidenav a { width: 80%; font-size: 90%; font-weight: bold; }
#sidenav a:hover { color: #FFFFFF; background-color: #666666; }
#sidenav a.nobg:hover { color: #003399; background-color: #ffffff; }


#sidenav a.leveltwo { background-color: #eee; width: 64%; padding-left: 12%;font-weight: normal; }  /*#e3e3e3*/
#sidenav a.leveltwo:hover { color: #FFF; background-color: #666666; }

#sidenav a.bannerside, #sidenav a.bannerside:hover {display: block; height: 118px; float: left; margin-top: -1px; margin-bottom: -1px; background-color: none; margin:0px; padding: 0px; border-bottom: none;}

#sidenav a.eclipselink {margin-left: 18px;}
#sidenav a.eclipselink:first-line {margin-left: -36px;}
.firstLine:first-line{font-weight: bold; font-size: 110%;}


#mainnav { margin: 0px; background-color: #f57d03; height: 33px; width: 100%; vertical-align: middle;  float: left; }
#mainnav a { font-size: 1.0em; color: #FFFFFF; text-decoration: none; margin-right: 0px; margin-left: 0px;  padding-top: 9px; padding-bottom: 8px; display: block; font-weight:inherit; float: left; text-transform: uppercase;  }





#mainnav a.down { color: #fff; background-color: #011f79; }
#footernav { float:right; font-size: .8em; margin-right: 24px; }
#footernav a { text-decoration: none; font-size: .8em; color: #000000; }


#footerSocial {float: left;margin-right: 18px; position: relative; top: -6px;}
#footerSocial a{margin-right: 6px;margin-bottom: 24px;}
#footerSocial img{ height: 24px; width: 24px; vertical-align: bottom; }


 /* Home Page */
#splash{ position: relative; width: 740px; height: 305px;  background:url(../home/bg-splash.png) no-repeat  ; margin-bottom: 8px; float: left;} 
#splashLinks{ position: absolute; color: #444; padding-top: 22px;}
#splashLinks ul{ list-style:none; margin: none; padding: none;}
#splashLinks li{ margin-bottom: 12px;}
#splashLinks a {color: #444;  font-weight: bold;}

#splashPhotos{ position: relative; top:9px; left: 220px; width: 375px; height: 280px; overflow: hidden; background-image: url(../home/photos/1.jpg); background-repeat: no-repeat; }

#splashMsg{position: absolute; top: 10px; right:12px; width: 264px; height: 280px; } 
.splashMsg{position: absolute; top:-18px; right:24px; width: 224px; max-height: 300px; color: #444; font-family:"Times New Roman", Times, serif }
.splashMsg h4{ text-align: center; color: #444; font-size: 130%; margin-bottom: -12px;}
.splashMsg h4 a{color: #666; }
.splashMsg p{margin-bottom: 2px; line-height: 110%; }

#splashNav {position: absolute; top: 230px; right:28px;}
#splashNav a{display: block; width: 30px; height: 28px; font-size: 120%; padding-top: 4px; border: 1px solid #222; text-align: center; color:#f0e9c2; float: left; margin-right: 8px;background-color: inherit ; }
#splashNav a:hover{background: #7d7b69 ; }
 


/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.sf-menu {
	line-height:	1.0;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			15em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width:			100%;
}
.sf-menu ul li {padding-top: -2px; padding-bottom: -2px;}

.sf-top {margin-top: -8px;}

.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative; min-height:31px; vertical-align:middle;
}

.sf-menu li li { min-height: 16px;}
.sf-menu li li a {
	 width: 14.6em; padding-bottom: 2px; min-height:inherit;
}

.sf-menu a {
	display: table;
	position: relative;  min-height: 10px;padding-bottom: 18px; min-height: 16px;
}
.sf-menu  ul  li.sfHover ul li a {
	display: block; width: 14em; min-height: 10px; 
	 /* trying to get a tags to be 100% of the block. Difficult*/
}

 /* final tier on product drop. get ul and a the same and be one line */
ul.sf-menu li li.sfHover ul li ul , .sf-menu  ul  li.sfHover ul li ul  li a {display: block; width: 186px; min-height: 18px; }

.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			31px; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			16.6em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			16.0em; /* match ul width this is where it places the next drop to the right */
	top:			0;
}

/*** DEMO SKIN ***/
.sf-menu {
	float:			left;
	margin-bottom:	0em;
}
.sf-menu a { text-decoration:none; padding-top: 1.05em; padding-right: .60em; padding-bottom: 0.75em; padding-left: .60em; }
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color:			#13a;
}
.sf-menu li { background-color: inherit;  vertical-align:middle;}
.sf-menu li li {
	background:#444;  border-bottom: 1px #777 solid;vertical-align:middle;  font-size: 90%;
}
.sf-menu li li li {background:		#999;vertical-align:middle;}
.sf-menu li li li li {	background:#999;vertical-align:middle; font-size: 1.0em; width: 100%;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
background:#666;outline:		0;
}



/*** arrows **/
.sf-menu a.sf-with-ul {
	padding-right: 	2.0em;
	min-width:		1px; /* trigger IE7 hasLayout so spans position accurately */
}
.sf-sub-indicator { position: absolute; display: block; right: .75em; top: 1.05em; /* IE6 only */ width: 10px; height: 10px; text-indent: 	-999em; overflow: hidden; /* 8-bit indexed alpha png. IE6 gets solid image only */ background-image: url(/assets/arrows-ffffff.png); background-repeat: no-repeat; background-position: -10px -100px; }
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			.8em; 
	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
	background:	url(/assets/shadow.png) no-repeat bottom right;
	padding: 0 8px 9px 0;
	-moz-border-radius-bottomleft: 17px;
	-moz-border-radius-topright: 17px;
	-webkit-border-top-right-radius: 17px;
	-webkit-border-bottom-left-radius: 17px;
}
.sf-shadow ul.sf-shadow-off {
	background: transparent;
}



/*** adding the class sf-navbar in addition to sf-menu creates an all-horizontal nav-bar menu ***/
.sf-navbar {

	height:			32px;
	padding-bottom:	4em;
	position:		relative;
}
.sf-navbar li {
	background:		#000066;
	position:		static;
	height: inherit; 
}
.sf-navbar a {
	border-top:		none;
}
.sf-navbar li ul {
	width:981px; /*IE6 soils itself without this*/	
	border-bottom-width: 1px;
}


.sf-navbar li li { position: relative;background-color: #000066; border-bottom: 1px #999 solid; min-height:17px;  }
.sf-navbar li li a { display: block; width: auto; margin-right: 2px;  }
.sf-navbar li li ul { width:182px;  } /* width of drop nav bar */
.sf-navbar li li li {width:196px; height: auto; }
/*.sf-navbar li li ul li, .sf-navbar li li ul li, .sf-navbar li li ul li a, .sf-navbar li li ul li:hover a{width:19em; height: auto; }*/

.sf-navbar li li li ul li,   .sf-navbar li li li ul li a,   .sf-navbar li li li ul li:hover {width: 200px; height: auto;  }
 .sf-navbar li li li ul li:hover a:hover {width: 186px; height: auto;  }

  /* last drop on products */

.sf-navbar ul li {
	width:			auto;
	float:			left;
}
.sf-navbar a, .sf-navbar a:visited {
	border:			none;
}
.sf-navbar li.current {
	background:		inherit;
}
.sf-navbar li:hover,
.sf-navbar li.sfHover,
.sf-navbar li li.current,
.sf-navbar a:focus, .sf-navbar a:hover, .sf-navbar a:active {	background:		#666; }
.sf-navbar ul li:hover,
.sf-navbar ul li.sfHover,
ul.sf-navbar ul li:hover li,
ul.sf-navbar ul li.sfHover li,
.sf-navbar ul a:focus, .sf-navbar ul a:hover, .sf-navbar ul a:active { background-color: #444; }

ul.sf-navbar ul li.sfHover ul li.sfHover li, ul.sf-navbar ul li.sfHover ul li.sfHover li a:hover {	background-color: #333; } /* different color on 3 level*/
ul.sf-navbar ul li.sfHover ul li.sfHover li:hover, ul.sf-navbar ul li.sfHover ul li.sfHover li:hover a:hover {	background-color: #666; }





ul.sf-navbar li li li:hover,
ul.sf-navbar li li li.sfHover,
.sf-navbar li li.current li.current,
.sf-navbar ul li li a:focus, .sf-navbar ul li li a:hover, .sf-navbar ul li li a:active { background-color: #999; }
ul.sf-navbar .current ul,
ul.sf-navbar ul li:hover ul,
ul.sf-navbar ul li.sfHover ul {
	left:			0;
	top:			31px; /* match top ul list item height */
}
ul.sf-navbar .current ul ul {
	top: 			-999em;
}

.sf-navbar li li.current > a {
	font-weight:	bold;
}

/*** point all arrows down ***/
/* point right for anchors in subs */
.sf-navbar ul .sf-sub-indicator { background-position: -10px -100px; }
.sf-navbar ul a > .sf-sub-indicator { background-position: 0px -100px; }


/* apply hovers to modern browsers */
.sf-navbar ul a:focus > .sf-sub-indicator,
.sf-navbar ul a:hover > .sf-sub-indicator,
.sf-navbar ul a:active > .sf-sub-indicator,
.sf-navbar ul li:hover > a > .sf-sub-indicator,
.sf-navbar ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}
.sf-navbar ul li > ul li > a > .sf-sub-indicator,
.sf-navbar ul li > ul li > a:hover > .sf-sub-indicator,
.sf-navbar ul li > ul li > a:focus > .sf-sub-indicator,
.sf-navbar ul li > ul li:hover > a > .sf-sub-indicator,
.sf-navbar ul li > ul li.sfHover > a > .sf-sub-indicator { background-position: 0px 0px; } /* keep arrow to the right on 2nd level */
.sf-navbar ul li > ul li:hover > a > .sf-sub-indicator,
.sf-navbar ul li > ul li.sfHover > a > .sf-sub-indicator { background-position: -10px 0px; }


/*** remove shadow on first submenu ***/
.sf-navbar > li > ul {
	background: transparent;
	padding: 0;
	-moz-border-radius-bottomleft: 0;
	-moz-border-radius-topright: 0;
	-webkit-border-top-right-radius: 0;
	-webkit-border-bottom-left-radius: 0; 
}
ul.sf-navbar ul li li   {background-color:#33FF66}

.sf-navbar ul.epoxyDrop,.sf-navbar ul.epoxyDrop li, .sf-navbar  ul.epoxyDrop li a,.sf-navbar ul.epoxyDrop li:hover {min-width: 280px ;max-width: 280px ;}
 .sf-navbar  ul.epoxyDrop li a:hover{min-width: 266px ;max-width: 266px ;}

#topnav { position: absolute; color: #FFFFFF; right: 24px; margin-top: 52px; }
#topnav a { color: #FFFFFF; vertical-align: bottom; text-decoration: none; margin-right: 10px; font-size: .8em;  text-transform: uppercase; }
img{border: none;}
#topnav a:hover { color: #f89829; }

#topnav  .sf-menu ul,#topnav  .sf-menu li {}
#topnav  ul li a {font-size: 80%;padding: 0px; font-weight: normal; }
#topnav ul li a.dropit {padding-right: 24px; height: 18px;} 
#topnav .sf-menu li.sfHover ul {
	top:			21px; /* match top ul list item height */
}

#topnav ul li ul li a {font-size: 110%; font-weight: normal;width: 100%;padding: 6px;}

#topnav  li  a:hover, 
#topnav  li:hover, 
#topnav  li.dropit:hover, 
#topnav .sf-menu li.sfHover  {background: none;  }

#topnav ul li ul li:hover{background: #222;  }

#topnav ul li ul li a img{ vertical-align:middle;}


#topnav a > .sf-sub-indicator {
top: .1em;
background-position: 0 -100px;
}