/* 
	CSS index: (append = and search to get to the section (=SOMETHING))
		Global:
			- WRAPPER
			- HEADER
			- CONTENT AREA
			- ACTIONS: on the right, contact me, etc.
			- SIDEBAR TABS: on the right, news, hot topics, etc.
			- PROMOTION: the small block for featured promotion at the bottom
			- FOOTER
			- HACKS
		Page Specific:
			- SPOTLIGHT (home)
			- M_CONTENT (home)
			- SIDEBAR (home)
			- 2_INTRO: contains h1, flash, etc.
			- 2_CONTENT (left, two col layout)
			- 2_SIDEBAR (right, two col layout)
			- 3_BREADCRUMBS (left, three col layout)
			- 3_CONTENT (center, three col layout)
			- 3_SIDEBAR (right, three col layout)
			- BASIC_CONTENT FORMATTING
			- LIST_CUSTOMERS: customer list
		
	Color guide:
		canvas #e3e3e3
		text #333
		link #669900
		site options link #006699
		main nav link #333
		nav hover background #5381ac
*/



* {margin: 0; padding: 0;}
body {background: #e3e3e3; color: #333; font: normal 62.5%/1.4 Verdana, Arial, lucida, sans-serif;}

/* basic tag definitions */
a {color: #669900; text-decoration: none;}
a:hover {text-decoration: underline;}
a img {border: none;}

fieldset {border: none;}
input {font: normal 100% Verdana, Arial, lucida, sans-serif;}

p.read-more {text-align: right; font-weight: bold;}

h3 a:hover  {text-decoration: none;}

.img_border {border: 1px solid #c5c5c5; margin-top: 3px;}

/* =WRAPPER */
#wrapper {width: 880px; margin: 0 auto; padding: 0 25px; background: url(../images/wrapper_stretch_bg.gif) 0 0 repeat-y;}

/* =HEADER */
#header {position: relative; z-index: 100; width: 880px; margin: 0; padding: 15px 0 7px;}

#logo {display: block; overflow: hidden; height: 38px; width: 271px; position: relative;top: 5px;}
#logo img {display: block;}

/*  search */
#headerSearch {float: right; width: 180px; margin: 0; padding: 24px 0 0;}
* html #headerSearch {margin: 0 -6px 0 0;}
*+html #headerSearch {margin: 0 -6px 0 0;}
#headerSearch fieldset {float: right;}
#headerSearch legend {display: none;}
#headerSearch-term {width: 95px; border: 1px solid #767676; margin: 0 3px 0 0; padding: 2px 1px;}
#headerSearch-submit {background: #fff; border: none; padding: 2px 0; color: #333; cursor: pointer; font-weight: bold; vertical-align: top;}

/*  external navigation */
#navExternal {clear: both; list-style-type: none; position: absolute; z-index: 1000; right: -13px; top: 36px;}
#navExternal li {display: inline; float: left; line-height: 1;}
#navExternal li a {display: block; padding: 7px 12px; color: #006699; font-size: .9em; font-weight: bold;}
#navExternal li a:hover {text-decoration: underline;}
#navExternal li.dropdown {position: relative;}
#navExternal li.dropdown:hover a, #navExternal li.dropdown.sfhover a {background: #5381ac; color: #fff; text-decoration: none;	}

#navExternal li.dropdown div.dropdown_wrapper {display: none; position: absolute; right: -4px; z-index: 1000; width: 121px; padding: 8px 0 0 0; background: url(../images/ww_dropdown_top.png) 0 0 no-repeat;}
#navExternal li.dropdown div.dropdown_inside {width: 121px; padding: 0 0 13px 0; background: url(../images/ww_dropdown_bottom.png) bottom left no-repeat;}
#navExternal li.dropdown ul {list-style-type: none; padding: 0 10px 7px 18px; background: url(../images/ww_dropdown_mid.png) 0 0 repeat-y;}
* html #navExternal li.dropdown div.dropdown_wrapper {right: 0; border: 1px solid #336699; padding: 0; background: #f7f7f7;}
* html #navExternal li.dropdown div.dropdown_inside {padding: 0; background: transparent;}
* html #navExternal li.dropdown ul {padding: 8px 6px 10px 14px; background: transparent;}
#navExternal li.dropdown:hover div.dropdown_wrapper, #navExternal li.dropdown.sfhover div.dropdown_wrapper {display: block;}
#navExternal li.dropdown li {display: block; float: none; padding: 2px 0 1px; line-height: 1.2;}
#navExternal li.dropdown li a {display: inline; padding: 0; color: #4b4b4b; font-weight: normal;}
#navExternal li.dropdown:hover li a, #navExternal li.dropdown.sfhover li a {background: transparent; color: #4b4b4b;}
#navExternal li.dropdown li a:hover {background: transparent; color: #4b4b4b; text-decoration: underline;}

/*  main navigation */
#navMain {float: left; list-style-type: none; margin: -25px 0 0 -14px;width:740px;border:0px solid #000000;}
* html #navMain {position: relative;}
#navMain li {display: inline; float: left; line-height: 1;}
#navMain li a {display: block; padding: 7px 14px; color: #333; font-size: 1em; font-weight: bold;}
#navMain li a:hover {background: #5381ac; color: #fff; text-decoration: none;}
#navMain li.dropdown {position: relative;}
#navMain li.dropdown:hover a, #navMain li.dropdown.sfhover a {background: #5381ac; color: #fff; text-decoration: none;}
#navMain li.dropdown div.dropdown_wrapper {display: none; position: absolute; left: 0px; z-index: 1000; width: 190px; padding: 2px 0 0 0; background-color: #f7f7f7; border: #5381ac solid 1px;}
#navMain li.dropdown ul {list-style-type: none; padding: 0 10px 10px 13px;}
* html #navMain li.dropdown div.dropdown_wrapper {right: 0; border: 1px solid #336699; padding: 0; background-color: #f7f7f7;}
* html #navMain li.dropdown ul {padding: 8px 6px 10px 14px; background: transparent;}
#navMain li.dropdown:hover div.dropdown_wrapper, #navMain li.dropdown.sfhover div.dropdown_wrapper {display: block;}
#navMain li.dropdown li {display: block; float: none; padding: 6px 0 1px; line-height: 1.2;}
#navMain li.dropdown li a {display: inline; padding: 0; color: #4b4b4b; font-weight:bold;}
#navMain li.dropdown:hover li a, #navMain li.dropdown.sfhover li a {background-color:#f7f7f7; color: #4b4b4b;}
#navMain li.dropdown li a:hover {background: transparent; color: #4b4b4b; text-decoration: underline;}







/* = SPOTLIGHT (Flash area) */
#spotlight {position: relative; z-index: 10; left: -5px; overflow: hidden; height: 225px; width: 890px; background-image:  url(../images/flashsubstitute_home_bg.jpg); background-repeat:no-repeat;}

#spotlight h1 { font-size:1.4em; line-height: 1 em; font-weight:normal;}

/* =CONTENT AREA */
#contentArea {padding: 16px 0 50px;}
#contentArea.main {padding: 10px 0 50px;}


/*  tabs */
.tabbed {list-style-type: none; overflow: hidden; position: relative; z-index: 11; height: 23px;}
.tabbed li {display: inline; float: left; overflow: hidden; height: 22px; margin: 0 3px 0 0; background: url(../images/tab_left_bg.jpg) 0 0 no-repeat;}
.tabbed li a {display: inline; float: left; height: 21px; padding: 0 8px; color: #666; background: url(../images/tab_right_bg.jpg) right top no-repeat; font-size: 1em; font-weight: bold; line-height: 2.2;}
.tabbed li.active {height: 23px;}
.tabbed li.active a {height: 23px; color: #336699;}
.tabbed li.active a:hover {cursor: default; text-decoration: none;}

div.tabbed_content {clear: both; display: none; position: relative; z-index: 10; border-top: 1px solid #d8d8d8; padding: 20px 0 0 11px; top: -1px;}
div.tabbed_content.active {display: block;}

div.tabbed_content p {margin: 0 0 1.5em;}

/* =ACTIONS */
#userActions {padding: 0;}
#userActions li {list-style-type: none; padding: 0 0 10px; font-size: 1em;}
* html #userActions li {padding: 0 0 8px;}
#userActions li a {display: block; height: 30px; width: 100%; line-height: 32px;}
#userActions li a strong {display: block; height: 30px; padding-left: 50px;}
#userActions li a:hover {cursor: pointer;}

#userActions-contact a {background: url(../images/action_bg.gif) 0 6px no-repeat; color: #fff;}
#userActions-contact a strong {background: url(../images/icon_phone.gif) 11px 0 no-repeat;}
#userActions-email a strong {background: url(../images/icon_mail.gif) 8px 7px no-repeat;}
#userActions-share a strong {background: url(../images/icon_share.gif) 10px 6px no-repeat;}
#userActions-blog a strong {background: url(../images/icon_blog.gif) 9px 8px no-repeat;}

/* =M_CONTENT (home page) */
.main #content {float: left; width: 627px; padding: 0 0 0 20px;}
.main #content div.intro {margin: 3px 0 25px;}
.main #content h2 {padding: 0 0 8px; color: #135688; font-size: 1.2em;}
.main #content p {margin: 0 0 25px;}

/*  tabs on home page */
#navSolutions li a {padding: 0 11px;}

#solutions div.tabbed_content {padding-top: 30px;}
#solutions div.tabbed_content h3 {display: none;}

#solutions div.tabbed_content p.intro {display: inline; float: left; width: 193px; padding: 0 40px 0 0; line-height: 1.7;}

#solutions div.tabbed_content ul.featured li {display: inline; float: left; position: relative; width: 142px; padding: 112px 40px 0 8px;}
#solutions div.tabbed_content ul.featured li img {position: absolute; left: 0; top: 0;}
#solutions div.tabbed_content ul.featured li h4 {color: #336699; font-size: 1.1em;}
#solutions div.tabbed_content ul.featured li p {margin: 0 0 .5em;}

/* =SIDEBAR */
.main #sidebar {float: right; width: 9px; padding: 0 0px 0 0;border:1px solid #000000;;}

.main #sidebar #userActions {width: 187px; padding: 0 0 0 1px;border:1px solid #000000;}

/* =SIDEBAR TABS */
#sidebarTabs h2, #sidebarTabs a.login {display: block; overflow: hidden; height: 21px; width: 159px; margin: 4px 0 0; padding: 0 15px; background: url(../images/sidebar_tab_bg.gif) 0 0 no-repeat; color: #666; cursor: pointer; font-size: 1em; font-weight: bold; line-height: 21px;}
#sidebarTabs a.login:hover {text-decoration: none;}

div.sidebarTabBox {display: block; width: 159px; padding: 0 15px 10px; font-size: .9em;}
 
div.sidebarTabBox dl {color: #666; padding: 0 5px 0 0;}
div.sidebarTabBox dt {padding: 8px 0 1px; font-size: 1.11em;}
div.sidebarTabBox dt a {font-size: .9em;}
div.sidebarTabBox dl a {color: #333;}
div.sidebarTabBox dl a:hover {color: #669900; text-decoration: none;}

div.sidebarTabBox dl a.resource {color: #669900;}
div.sidebarTabBox dl a.resource:hover {text-decoration: underline;}

div.sidebarTabBox dl.alternate dt {color: #333; font-size: 1em;}

/* =2_INTRO */
.twocol #intro {position: relative; z-index: 9; height: 157px; width: 351px; margin: 5px 0 16px -1px; padding: 15px 500px 0 30px; background: url(../images/twocol_heading.jpg) 0 0 no-repeat;}

.twocol #intro h1 {color: #125687; font-size: 1.6em; line-height: 1.2;}
.twocol #intro p.tagline {margin: 0 0 .8em; color: #125687; font-size: 1.2em;}
.twocol #intro p.tagline strong {font-weight: normal;}

.twocol #intro div.container {font-size: 1.1em; margin: 0 0 .5em;}
.twocol #intro div.container p {margin: 0 0 .5em;}
.twocol #intro div.container ul, .twocol #intro div.container ol {margin: 0 0 .5em 30px;}

/*  flash area */
.twocol #intro #featured {position: absolute; right: -7px; top: -5px; height: 178px; width: 486px; color: #fcfcfc; font-size: .9em;}
.twocol #intro #featured a {font-weight: bold;}

/* =2_CONTENT */
.twocol #content {float: left; width: 672px;}

.twocol #content h2 {margin: 0 0 .4em; padding: .5em 0 0; color: #336699; font-size: 1.2em;}
.twocol #content h3 {color: #666; font-size: 1.1em;}
.twocol #content h4 {color: #333; font-size: 1em;}

.tabbed_content p {margin: 0 0 1.5em; font-size: 1em;}
.tabbed_content ul, .twocol #content ol {margin: 0 0 1.5em 30px; font-size: 1em;}
.tabbed_content li {margin: 0 0 .2em;}

/* =2_SIDEBAR */
.twocol #sidebar {float: right; width: 180px; padding: 15px 0 0;}

/* =3_BREADCRUMBS */
.threecol #breadcrumbs {float: left; width: 134px; padding: 0 10px 10px 0;}
.threecol #breadcrumbs ul {list-style-type: none;}
.threecol #breadcrumbs ul ul {margin: 6px 0 0 0;}
.threecol #breadcrumbs ul ul ul {margin: 3px 0 0 9px;}
.threecol #breadcrumbs li a {color: #333; font-weight: bold;}
.threecol #breadcrumbs li li a {color: #666;}
.threecol #breadcrumbs li li {margin: 0 0 2px;}
.threecol #breadcrumbs li li li a {color: #333; font-weight: normal;}
.threecol #breadcrumbs li strong {color: #336699;}
.threecol #breadcrumbs li li li strong {font-weight: normal;}

/* =3_CONTENT */
.threecol #content {float: left; width: 530px;}

/*  heading */
.threecol #intro {position: relative; z-index: 1; width: 530px; height: 131px; margin: 0 0 36px -2px; padding: 0 0 11px 2px; background: url(../images/threecol_heading.gif) 0 0 no-repeat;}
.threecol #intro h1 {color: #fff; font-size: 1.4em; padding: 11px 120px 19px 20px;}
.threecol #intro img.intro_image {position: absolute; right: 7px; top: 8px;}
.threecol #intro div.container {padding: 0 130px 0 20px; color: #666;}
.threecol #intro p {margin: 0 0 .5em;}

/* =3_SIDEBAR */
.threecol #sidebar {float: right; width: 180px;}

/*  actions */
.threecol #sidebar #userActions {width: 180px; margin: 0 0 40px;}

.threecol #sidebar #userActions-contact a {background-image: url(../images/action_threecol_bg.gif);}

/*  boxes */
#sidebar div.highlighted {margin: 10px 0 0; background: url(../images/sidebar_gbox_top.gif) 0 0 no-repeat;}
#sidebar div.highlighted div.infoBox_inside {background: url(../images/sidebar_gbox_bottom.gif) bottom left no-repeat;}

.infoBox_inside {padding: 10px 13px;}
.infoBox_inside h2 {margin: 0 0 .8em -2px; color: #336699; font-size: 1em;}
.infoBox_inside dl {color: #666; font-size: .9em;}
.infoBox_inside dd {padding: 0 0 .9em;}
.infoBox_inside dl a {color: #333;}
.infoBox_inside dl a:hover {color: #669900; text-decoration: none;}

#sidebar div.promotion {margin: 10px 0 0;}
#sidebar div.promotion a {display: block;}
#sidebar div.promotion a img {display: block;}

/* =BASIC_CONTENT FORMATTING */
.threecol div.tabbed_content h2 {clear: both; margin: 0 0 .5em; color: #336699; font-size: 1.1em;}
.threecol div.tabbed_content h3 {color: #666; font-size: 1em;}
.threecol div.tabbed_content h3 a {color: #666;}
.threecol div.tabbed_content h3 a:hover {color: #669900;}
#wrapper .threecol div.tabbed_content p.excerpt {margin: 0 0 8px; font-size: .9em;}
#wrapper .threecol div.tabbed_content p.data {margin: 0; font-size: 1em;}
.threecol div.tabbed_content p.data em {font-style: normal;}
.threecol div.tabbed_content p.action {margin: -8px 0 2em; font-size: .9em;}

/*  blogs */
.threecol div.blogs h3 {clear: both; color: #333; font-size: 1.1em;}
.threecol div.blogs h3 a {color: #333;}
.threecol div.blogs h3 a:hover {color: #669900;}
.threecol div.blogs img.blog_picture {float: left; border: 1px solid #848484; margin: 0 10px 1em 0;}
.threecol div.blogs p {font-size: 1em; line-height: 1.6;}
.threecol div.blogs p.date {clear: both; margin: 0; font-size: 1em; font-weight: bold;}
.threecol div.blogs p.category {margin: 0 0 .4em; font-size: .9em; font-weight: bold;}

/* =LIST_CUSTOMERS */
#customer_list {margin-top: -22px; padding: 0 0 0 4px;}
#customer_list p.sort {margin: 0 0 20px;}
#customer_list p.sort a {color: #333;}
#customer_list p.sort em {font-style: normal; font-weight: bold;}
#customer_list p.sort strong {color: #336699; font-weight: bold;}

#customer_list_content {clear: both; width: 519px; border-top: 1px solid #d8d8d8; margin: 0 0 0 -4px; padding: 0 7px 0 4px;}
#customer_list_content div.intro {clear: both; padding: 17px 0 0; margin: 0 0 3em;}
#customer_list_content div.intro p {clear: both; margin: 0 0 1em;}

#customer_list_content ul.list li {clear: both; list-style-type: none; padding: 0 0 1.5em 140px;}
#customer_list_content ul.list img.list_image {float: left; position: relative; top: -1.2em; z-index: 50; margin: 0 0 15px -140px;}
#customer_list_content ul.list h2 {color: #333; font-size: 1em;}
#customer_list_content ul.list p {margin: 0 0 1em;}
#customer_list_content ul.list p.action {margin: 0; text-align: right;}


/*  dropdowns */
div.dropdown {display: inline; float: left; position: relative; z-index: 100; margin: 0 0 17px;}
#customer_list_content div.dropdown {display: inline; float: right; margin: 10px 0 0;}

div.dropdown h2 {overflow: hidden; height: 20px; width: 110px; border: 1px solid #c2c2c2; padding: 0 30px 0 4px; background: url(../images/dropdown.gif) 128px 1px no-repeat; font-size: 1em; font-weight: normal; cursor: pointer; line-height: 20px;}
div.dropdown_content {display: none; position: absolute; left: 0; top: 21px; width: 18em; border: 1px solid #c2c2c2; padding: 6px 10px 8px 10px; background: #fff;}
#customer_list_content div.dropdown_content {left: auto; right: 0;}

div.dropdown:hover div.dropdown_content, div.dropdown.sfhover div.dropdown_content {display: block;}

div.dropdown_content h3 {font-size: .9em;}
div.dropdown_content h3.border {border-top: 1px solid #ccc; margin: 8px 0 0; padding: 6px 0 0;}
div.dropdown_content ul {list-style-type: none; padding: 0 10px 0 0;}
div.dropdown_content li {margin: 0 0 1px;}
div.dropdown_content a {color: #333; font-size: .9em;}

/* =PROMOTION */
#promotion {width: 880px;}

/* = FOOTER */
#footer {position: relative; width: 905px; margin: 21px -25px 0 -25px; padding: 25px 0 35px 25px; background: #e3e3e3 url(../images/footer_bg.gif) 0 0 no-repeat; color: #4d4d4d;}
#footer a {color: #4d4d4d;}

#navSitemap {width: 895px; border-collapse: collapse;}
#navSitemap td {padding: 0 30px 30px 20px; vertical-align: top;}
#navSitemap h2 {display: inline; padding: 0 7px 6px 0; font-size: .9em; border-bottom: 1px solid #535353;}
#navSitemap ul {padding: 15px 0 0;}
#navSitemap li {list-style-type: none; padding: 2px 0; font-size: .9em;}

#footerFinal {clear: both; width: 880px; padding: 35px 0 0; text-align: center;}
#footerFinal p {display: inline; font-size: .9em;}
#footerFinal p#copyright {padding-right: 30px;}

/* =HACKS */

/*  clearfix (clearing of floats) */
#header:after, #contentArea:after, div.tabbed_content.active:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}

#header, #contentArea, div.tabbed_content.active {display: inline-block;}

/* Hides from IE-mac \*/
* html #header, * html #contentArea, * html div.tabbed_content.active {height: 1%;}
#header, #contentArea, div.tabbed_content.active {display: block;}
/* End hide from IE-mac */


/* customer overview page */

.customer_dirbox { width: 245px; }
#customer_dirbox div.highlighted {margin: 10px 0 0; background: url(../images/cust_dir_tabletop.jpg) 0 0 no-repeat;}
#customer_dirbox div.highlighted div.infoBox_inside {padding: 7px 11px 14px 14px; background: url(../images/cust_dir_tablebot.jpg) bottom left no-repeat;}


#customer_headlines { margin-right: 10px; margin-left: 14px;}
#customer_headlines dd {padding: 8px 0 1px;}
#customer_headlines dd a {color: #333;}
#customer_headlines dd a:hover {color: #669900; text-decoration: none;}

/* end customer overview page */





/* text style for dates and summary */
div.datestyle {font-size: .9em;}

div.datestyle dl {color: #666; padding: 0 5px 0 0;}
div.datestyle dt {font-size: 1.11em;}
div.datestyle dt a {font-size: .9em;}
div.datestyle dl a {color: #333;}
div.datestyle dl a:hover {color: #669900; text-decoration: none;}
div.datestyle dd {padding: 0px 0 12px; font-size: 1.11em;}

.greentext {color: #669900;  text-decoration: none;} 
.greentext a {color: #669900; text-decoration: none;} 
.greentext a:link {color: #669900; text-decoration: none;} 
.greentext a:visited {color: #669900; text-decoration: none;} 
.greentext a:hover {color: #669900; text-decoration: underline;}


.graytext {color: #666;  text-decoration: none;} 
.graytext a {color: #666; text-decoration: none;} 
.graytext a:link {color: #666; text-decoration: none;} 
.graytext a:visited {color: #666; text-decoration: none;} 
.graytext a:hover {color: #666; text-decoration: underline;}

.maintext {color: #333;  text-decoration: none;} 
.maintext a {color: #333; text-decoration: none;}
.maintext a:link {color: #333; text-decoration: none;} 
.maintext a:visited{color: #333; text-decoration: none;}  
.maintext a:hover {color: #669900; text-decoration: none;}


.Customers_text{
color:#000000;	
font-family:Tahoma;
font-size:11px;
padding-left:18px;
font-weight:bold;
}