/* Browser Reset */

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td {margin: 0; padding: 0;}
h1, h2, h3, h4, h5, h6 {font-size: 100%;}
ol, ul {list-style: none;}
address, caption, cite, code, dfn, em, strong, th, var {font-style: normal; font-weight: normal;}
table { border-collapse:collapse; border-spacing: 0;}
fieldset, img {border: 0;}
caption, th {text-align: left;}
q:before, q:after {content: '';}

/* IE PNG fix */


img, div, a, input { behavior: url(iepngfix.htc); }


body {background:url(../i/bg.jpg) repeat-x #f8f8f8;  behavior: url("csshover3.htc"); font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;}

#main_container {width:1019px; margin:0 auto;}
#content_container {width:979px; float:left; background-color:#f4f4f5; padding-bottom:20px; margin-top:0;}


.clearing {clear:both;}
.left {float:left;}
.left2 {float:left;}
.right {float:right;}
.media {margin:5px auto; width:320px;}
.media img {margin:0 5px;}
.media_right{margin:5px 20px 5px 20px; width:320px; float:right;}
.media_right img {margin:5px 5px 5px 5px;}
.media_left{margin:1px 1px 1px 1px; float:left;}
.media_left img {margin:1px 1px 1px 1px;}



/* header */
/* The header is made up of one main box (#header_container) with a left div for the logo and a right div for the uppernav and the search box. The third div is a simple clearing div */ 

#header_container {width:979px; height:118px; margin:0 auto;}
#header_container a {font:11px "Trebuchet MS", Arial, Helvetica, sans-serif;}
#header_container a:link{color:#3d6a9a; text-decoration:none;} #header_container a:visited{color:#3d6a9a; text-decoration:none;}
#header_container a:hover{color:#3d6a9a; text-decoration:underline;} #header_container a:active{color:#3d6a9a; text-decoration:none;}

#header_leftcontent{float:left; margin:16px 16px; width:330px; height:83px;}

#header_rightcontent { width:312px; height:40px;float:right; margin:30px 18px 0 16px;}
#topsearchbox {width:259px; height:21px; background:url(../i/topsearch_bg.jpg) repeat-x; border:none; color:#959595; font:12px "Trebuchet MS", Arial, Helvetica, sans-serif; letter-spacing:.1em; margin-left:4px; border:1px solid #959595; border-right:none; float:left; padding:4px 0 0 8px;}
#topsearchbtn {width:40px; height:27px; background:url(../i/topsearch_btnbg.jpg) no-repeat !important; text-indent:-9999px !important; border:none; font-size:0; line-height:0; border:1px solid #959595; border-left:none; float:left;}
#header_rightcontent ul {width:312px; margin-left:6px;}
#header_rightcontent li {float:left; margin:0 0 5px 7px; font-size:11px; color:#3d6a9a;}

#flags { margin-bottom:0px; display:inline;}
#flags img {margin:0 0 0 10px; float:right;}




/* navigation */
/* The navigation works by using one image and the hover state, each ul had an A tag in it that A has a background in it moved around to show the proper background, the text is indented and the link set to block to hide the text. On hover the background img is moved up 58px to the roll over state.. behold the power of atomic fusion */
#nav ul{width:979px;}
#nav li {}
#nav a { text-indent: -999999px; overflow:hidden; display:block; height:58px;}

#navigation {width:979px; height:58px; position:relative; z-index:2; margin:0;}
#nav_home {width:68px; background:url(../i/navigation2.jpg); float:left; height:58px;}
#nav_home:hover {background-position:0 -58px;}

#nav_products {width:185px; background:url(../i/navigation2.jpg) -68px 0; float:left; height:58px;}
#nav_products:hover {background-position:-68px -58px;}

#nav_services {width:159px; background:url(../i/navigation2.jpg) -253px 0; float:left; height:58px;}
#nav_services:hover {background-position:-253px -58px;}

#nav_casestudies {width:111px; background:url(../i/navigation2.jpg) -412px 0; float:left; height:58px;}
#nav_casestudies:hover {background-position:-412px -58px;}

#nav_customers {width:99px; background:url(../i/navigation2.jpg) -523px 0; float:left; height:58px;}
#nav_customers:hover {background-position: -523px -58px;}

#nav_partners {width:84px; background:url(../i/navigation2.jpg) -622px 0; float:left; height:58px;}
#nav_partners:hover {background-position:-622px -58px;}

#nav_library {width:159px; background:url(../i/navigation2.jpg) -706px 0; float:left; height:58px;}
#nav_library:hover {background-position:-706px -58px;}

#nav_about {width:114px; background:url(../i/navigation2.jpg) -865px 0; float:left; height:58px;}
#nav_about:hover {background-position:-865px -58px;}

.subnav {display:none;}



/* subnavigation */
/* the first part of the subnav is a ul with a roll over state on the li, csshover3 is imported to make it work in ie */
.products_n_services {border-top:2px solid #fff;}
.products_n_services a {font:11px "Trebuchet MS", Arial, Helvetica, sans-serif; margin:0 20px;}
.products_n_services a:link {text-decoration:none; color:#3d6a9a;} .products_n_services a:visited {text-decoration:none; color:#3d6a9a;}
.products_n_services a:hover {text-decoration:underline; color:#3d6a9a;} .products_n_services a:active {text-decoration:none; color:#3d6a9a;}
.products_n_services li {width:240px; height:24px;  border-bottom:2px solid #fff; padding-top:7px;}
.products_n_services li:hover {background:url(../i/subbullet.png) 8px 10px no-repeat #fafafa;}
.ps_sub {padding-left:20px; width:220px !important;}
.ps_sub:hover {background:url(../i/subbullet.png) no-repeat 20px 15px #fafafa !important;}
.ps_sub_active {background:url(../i/subbullet.png) no-repeat 18px 30px #fafafa !important; padding-left:20px; width:220px !important;}

/* the now what box is a div with a ul in it, the background is set on the div and a graphic at the footer. by doing this you can add more items to the list and it will expand */
#nowwhat {width:190px; background:url(../i/nowwhatbg.png) no-repeat; margin:-5px 0 20px 20px;}
#nowwhat img {margin-left:3px; margin-top:3px;}
#nowwhat ul {padding-top:45px;}
#nowwhat li {width:177px; height:18px; margin:0px 0 0 9px; background:url(../i/whatnow_li_bg.png) no-repeat 0 13px; text-align:left; border:none !important; padding-bottom:2px;}
#nowwhat a {font:11px "Trebuchet MS", Arial, Helvetica, sans-serif;}
#nowwhat a:link {text-decoration:none; color:#86a62e;} #nowwhat a:visited {text-decoration:none; color:#86a62e;}
#nowwhat a:hover {text-decoration:underline; color:#86a62e;} #nowwhat a:active {text-decoration:none; color:#86a62e;}
.nowwhat_last {background:none !important;}

#question {border-top:2px solid #fff;}
#question img {margin:15px 16px;}

/* basically its a div with a set background and everything inside is just pushed to line up */
#emaillist {width:240px; border-top:2px solid #fff; height:176px; background:url(../i/emailsignup_bg.png) no-repeat 16px 10px; }
#emaillistinput {border:none; border:0; margin:48px 15px 48px 40px; color:#999; font:9px Arial, Helvetica, sans-serif bold; width:145px; float:left;}
#emaillistbtn {background:url(../i/go_btn.png) no-repeat !important; font-size:0px; line-height:0px; border:none; text-indent:-9999px; width:21px; height:21px; margin:40px 0px 0px 0px; float:left;}
/* main content area */
h1 {font:23px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#3d6a9a; font-weight:bold}
h2 {font:21px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#3d6a9a; font-weight:bold}
h3 {font:20px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#3d6a9a; font-weight:bold}
h4 {font:18px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#3d6a9a; font-weight:bold}
h5 {font:14px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#3d6a9a; font-weight:bold}
h6 {font:12px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#3d6a9a; font-weight:bold}
#main_article{float:left; width:718px;}

#title_n_share div {margin:10px 10px 0 0;}
#title_n_share {margin-top:25px;}
#printicon {border-left:2px solid #fff; margin-left:10px;padding-left:10px;}


#breadcrumb_n_media {background-color:#fcfcfd; height:20px; margin:0; width:685px; padding:5px 10px 0 10px; color:#86a62e; font-size:11px;}
#breadcrumb_n_media a {font:10px Arial, Helvetica, sans-serif; letter-spacing:.1em; margin:0 2px;}
#breadcrumb_n_media a:link {text-decoration:none; color:#86a62e;} #breadcrumb_n_media a:visited {text-decoration:none; color:#86a62e;}
#breadcrumb_n_media a:hover {text-decoration:underline; color:#86a62e;} #breadcrumb_n_media a:active {text-decoration:none; color:#86a62e;}



#bodycopy {width:720px; font:12px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#474747; margin:20px 0; line-height:22px;}
#bodycopy p {margin-bottom:18px; padding-right:15px; padding-left:4px;}
#bodycopy h4 {padding-left:4px;}
#bodycopy h5 {padding-left:4px;}
#bodycopy img {padding:3px; background-color:#f4f4f5; border:none;}
#bodycopy a {font-weight:bold; color:#86a52e;}
#bodycopy a:link {text-decoration:none;} #bodycopy a:visited {text-decoration:none; color:#3d6a9a;}
#bodycopy a:hover { text-decoration:underline;} #bodycopy a:active {}

#bodycopy2 {width:970px; margin:20px 0;}
#bodycopy2 p {margin-bottom:18px; padding-right:15px; padding-left:4px; line-height:25px; font-size:11px;}
#bodycopy2 h4 {padding-left:4px;}
#bodycopy2 img {padding:3px; background-color:#f4f4f5; border:none;}
#bodycopy2 a {font-weight:bold; color:#86a52e; text-decoration:none; font-size:11px;}
#bodycopy2 a:link { padding-bottom:10px;} #bodycopy a:visited {text-decoration:none; color:#3d6a9a;}
#bodycopy2 a:hover { text-decoration:underline;} #bodycopy a:active { }

.hlink {color:#fff !important; background-color:#86a52e;}

/* bodycopy list style */

#bodycopy ul {margin:5px 0;}
#bodycopy li {font:12px "Trebuchet MS"; padding-left:23px; background:url(../i/bullet.png) no-repeat 13px 4px; margin:0px;clear:left;}
.listsub {margin-left:25px !important; background:url(../i/subbullet.png) no-repeat 0px 5px !important;}
.list-squash {position:relative; bottom:15px;}
.list-squash li {line-height:12px !important;}
.list-squash ul {padding-left:10px;}
#bodycopy .list-squash li {background:url(../i/bullet.png) no-repeat 0 0 !important;}

/* the article logo is a box where you can dump in any image as long as it fits width wise into the container, it has some verticle leeway but not a ton */

#articlewrap { float:right; margin-bottom:15px;}
#articlelogo {background:url(../i/logocallout_bg2.png) no-repeat; padding:25px 5px 0px 5px; width:210px; text-align:center; margin:0 0 0 10px;}
#articlelogo img {margin-bottom:10px; padding:0px; border:none;}

#medialib {width:191px; margin-left:21px;}
#medialib_btn {background:url(../i/medialib_top.jpg) no-repeat; width:191px; height:27px; text-indent:-99999px;}
#medialib ul {padding-top:2px; border-right:1px solid #e5e5e5; border-left:1px solid #e5e5e5; margin:0px;}
#medialib img {margin-right:5px; padding:0px; border:none;}
#medialib li { border-bottom:1px solid #e7e7e7; padding:7px 5px 5px 9px; background:none; margin:0px; background-color:#fcfcfd}
#medialib a {font:10px "Trebuchet MS", Arial, Helvetica, sans-serif; letter-spacing:0;}
#medialib a:link {text-decoration:none; color:#86a52e;} #medialib a:visited {text-decoration:none; color:#86a52e;}
#medialib a:hover {text-decoration:underline; color:#86a52e;} #medialib a:active {text-decoration:none; color:#86a52e;}
#sub_media { width:191px;}
#sub_media ul {margin:0px; padding:0px;}
.MoreMedia_btn {padding:5px 0 5px 12px; color:#86A52E; background-color:#fff; border-bottom:1px solid #e7e7e7; border-right:1px solid #e7e7e7; border-left:1px solid #e7e7e7; font-size:10px;}
.LessMedia_btn {padding:5px 0 5px 12px; color:#86A52E; background-color:#fff; border-bottom:1px solid #e7e7e7; border-right:1px solid #e7e7e7; border-left:1px solid #e7e7e7; font-size:10px;}
.MoreMedia_btn2 h5{ font:18px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#86a52e; font-weight:bold;}
.MoreMedia_btn2 h6{ font:12px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#86a52e; font-weight:bold;}
.sub_media2 { width:730px;}
.sub_media2 ul {margin:0px; padding:0px;}

#related_btn {background:url(../i/related_top.jpg) no-repeat; width:191px; height:27px; text-indent:-99999px;}



.tables {background-color:#fff; border-top:10px solid #3d6a9a; }
.tables td {padding:5px;}
.tables th {font-weight:bold; padding:5px;}
.between {background-color:#f6f9fc;}

/* this is the footer of the article */
#pageaction {text-align:center;  margin-top:15px;}
#pageaction a {font:18px Arial, Helvetica, sans-serif; letter-spacing:.1em; margin:0 2px;}
#pageaction a:link {text-decoration:none; color:#3d6a9a;} #pageaction a:visited {text-decoration:none; color:#3d6a9a;}
#pageaction a:hover {text-decoration:underline; color:#3d6a9a;} #pageaction a:active {text-decoration:none; color:#3d6a9a;}

/* Main page */
/* the main page is split into 4 columns col1 - col 4 all nested into a col_container */

#col_container {margin:0 auto; width:960px;}

.fcol {float:left; width:240px; margin:20px 0 0 0; font:11px Arial, Helvetica, sans-serif;}
.fcol h2 {font:15px Arial, Helvetica, sans-serif; font-weight:bold; letter-spacing:.1em; margin:0 auto; margin-bottom:15px; padding-bottom:2px; color:#555; border-bottom:4px solid #aecf60; width:211px; text-align:left;}
.fcol p {width:211px; text-align:left; margin:0 auto; line-height:17px;}
.fcol a {color:#3d6a9a; margin:0;}
.fcol a:link {text-decoration:none;} .fcol a:visited {text-decoration:none;}
.fcol a:hover {text-decoration:underline;} .fcol a:active {text-decoration:none;}

#col1 div {width:211px; margin-left:15px; margin-bottom:20px;}
.icon1 {background:url(../i/page_icon.png) no-repeat;}
.icon2 {background:url(../i/computer_icon.png) no-repeat;}
.icon3 {background:none;}
#col1 p {width:211px;}

#col2 {text-align:center; width:480px;}
#col2 img {margin:0 auto; }
#col2 p {margin-top:10px;  margin-bottom:15px; width:422px;}
#col2 h2 {font:15px Arial, Helvetica, sans-serif; font-weight:bold; letter-spacing:.1em; margin:0 auto; margin-bottom:15px; padding-bottom:2px; color:#555; border-bottom:4px solid #aecf60; width:460px; text-align:left;}

#col3 p {margin:15px 0 4px 15px;}
#col3 a {margin:15px;}
#col3 h2 {font:15px Arial, Helvetica, sans-serif; font-weight:bold; letter-spacing:.1em; margin:0 auto; margin-bottom:15px; padding-bottom:2px; color:#555; border-bottom:4px solid #aecf60; width:211px; text-align:left;}

#col4 {float:right;}
#col4 h3 {font-size:12px; margin:15px; font-weight:bold;}
#col4 a {margin:15px;}
#col4 h2 {font:15px Arial, Helvetica, sans-serif; font-weight:bold; letter-spacing:.1em; margin:0 auto; margin-bottom:15px; padding-bottom:2px; color:#555; border-bottom:4px solid #aecf60; width:211px; text-align:left;}
#freetrial img {padding:30px 0px;}


#footerwrap {width:979px; margin:0 auto; clear:both;} 
#footer {width:979px; margin:0 auto; padding-top:20px; background:url(../i/footerbg.png) no-repeat; height:155px;}
#footer p {font:9px Trebuchet MS, Arial, Helvetica, sans-serif; color:#555;}
#footer ul { margin:0 auto; width:700px;}
#footer li {float:left; font:9px Arial, Helvetica, sans-serif; margin:0 1px;}
#footer a {color:#3d6a9a; margin:0; font:9px Arial, Helvetica, sans-serif;}
#footer a:link {text-decoration:none;} #footer a:visited {text-decoration:none;}
#footer a:hover {text-decoration:underline;} #footer a:active {text-decoration:none;}
#subfoot {margin:25px auto; text-align:center;}
#subfoot p {font:10px Arial, Helvetica, sans-serif;}

#related {width:500; float:left; background:#FFFFFF; margin-right:20px; padding:10px; border:1px solid #ccc;}
#related_right {width:500; float:right; background:#FFFFFF; margin-right:20px; padding:10px;}
.headline {font:trebuchet MS; font-weight:bold; font-size:12px; text-transform:uppercase;}

#caseStudyWrap {position:relative; bottom:30px;}
#caseStudyContent {overflow:hidden; width:705px; position:relative; clear:both;}
.cswrap {position:relative; width:2200px; overflow:hidden;}
.cswrap h4 {font-size:14px;}
#businessProblemContent, #industryContent {float:left; width:705px; color:#666 !important; background-color:#fff; overflow:hidden;}
#endpointContent {float:left; width:707px;}
#industryContent {float:left;}
#csNavInstruct {padding-top:24px !important;}

#endpoint {margin-left:10px;}
#industry {margin-left:10px;}
#caseStudyNavigation li {float:left; padding:10px 25px 20px 20px; font-size:18px; background:none;  clear:none !important;}
#caseStudyNavigation li a {color:#ccc; font-weight:normal;}
#caseStudyNavigation li a:visited {color:#ccc;}

.caseStudyAccordion2 { display:none;}
.caseStudyNavActive {background-color:#3d6a9a; color:#fff !important;}
#caseStudyNavigation {height:55px; width:705px; position:relative; top:20px; z-index:1; padding-bottom:10px; background-color:#fff;}
#csNavInstruct {margin-left:25px !important; color:#999; font-size:10px !important; background:none;}
.caseStudyHeading {background:url(../i/case-studies2-heading-bg.jpg) repeat-x; height:20px; padding:15px; text-indent:30px; border-top:1px solid #d8d8d8;}
.caseStudyHeading a:link, .caseStudyHeading a:visited {color:#999 !important;}
.caseStudyHeading a:hover, .caseStudyHeading a:active {color:#81a32b !important;}
.caseStudyTable th {color:#fff !important; background:#7e9f2a; padding:5px 10px;}
.caseStudyTable td {padding:5px 10px;}
.caseStudyTable a:link, .caseStudyTable a:visited {color:#3d6a9a !important;}
.caseStudyTable a:hover, .caseStudyTable a:active {color:#3d6a9a !important; text-decoration:underline !important;}
.alt {background:#ecf6fc;}
.over {background:#e8ffae;}
.mid-column {border-left:1px solid #dfdfdf; border-right:1px solid #dfdfdf;}
.last-column {border-left:1px solid #dfdfdf; border-right:1px solid #dfdfdf;}
.first-column {border-left:1px solid #dfdfdf; border-right:1px solid #dfdfdf; width:500px;}
.location{font-weight:bold; color:#333333;}
.down-arrow {position:absolute; left:8px; top:0px; border:none !important; z-index:-1;}
.hidden {padding-left:10px;}

/* Case Studies */
/* The entire content area is inside case-study-wrapper. The Case Study info is inside case-container and the sidebar is in case-sidebar */

.case-study-wrapper {
	float: left;
	display: inline;
	width: 710px;
}

.case-container {
	width: 440px;
	margin-right: 10px;
	padding-right: 10px;
	float: left;
	display: inline;
	border-right: 1px solid #e2e2e2;
}

.case-container2 {
	width: 672px;
	margin-right: 10px;
	padding-right: 10px;
	float: left;
	display: inline;
}

.summary-list {
	width: 260px;
	float: left;
	display: inline;
	position: relative;
	right: 10px;
}

.summary-list h4 {
	font-size: 14px;
	padding: 0 !important;
	color: #444;
}

.summary-list li, .case-sidebar-list li {
	font-weight: bold !important;
	background: none !important;
}

.summary-list .summary-link {
	font-weight: normal !important;
	color: #3c6a9b !important;
}

.summary-list2 {
	float: left;
	display: inline;
	position: relative;
	right: 12px;
}

.summary-list2 li, .case-sidebar-list2 li {
	font-weight: bold !important;
	background: none !important;
}

.placeholder {
	text-indent: -9999px;
	line-height: 0;
	width: 220px;
	height: 180px;
	background-color: #666666;
	float: right;
	display: inline;
}

.placeholder2 {
	text-indent: -9999px;
	line-height: 0;
	width: 220px;
	height: 180px;
	background-color: #666666;
	float: right;
	display: inline;
	margin: 20px 40px 0 0;
}

.case-sidebar {
	width: 220px;
	float: right;
	diaplay: inline;
	margin: 30px 20px 0 0;
}

.case-sidebar-img {
	border: none !important;
	padding: 0 !important;
}

.case-sidebar-list {
	padding: 20px;
	border-top: 1px solid white;
	border-bottom: 1px solid white;
}

#sidebar-demo, #sidebar-contact {
	border: none !important;
	padding: 0 !important;
	position: relative;
	top: 4px;
	right: 10px;
	background-color: #f2f2f4 !important;
}

.indented {
	background: none !important;
	padding-left: 20px !important;
	font-size: 11px !important;
	color: #999999;
}

.case-study2-list{
	padding-left: 6px
}

.portlet_content h4 {cursor:pointer; padding-left:20px !important;}

.caseon {color:#ccc !important;}
.caseoff {color:#3d6a9a !important;}

h2 {font:14px Arial, Helvetica, sans-serif bold; color:#85a52e; margin:15px 0 0 0; padding-left:20px; padding-bottom:10px; border-bottom:2px solid #fff;}
#sub_nav {float:left;}
#sub_container {float:left; width:240px;}
.sub_active {background:url(../i/subnav_indicator.jpg) no-repeat #fafafa;}
#sub_container ul {border:none !important;}
#sub_container ul a {font:11px "Trebuchet MS", Arial, Helvetica, sans-serif; margin:0 20px;}
#sub_container ul a:link {text-decoration:none; color:#3d6a9a;} #sub_container ul a:visited {text-decoration:none; color:#3d6a9a;}
#sub_container ul a:hover {text-decoration:underline; color:#3d6a9a;} #sub_container ul a:active {text-decoration:none; color:#3d6a9a;}
#sub_container ul li {width:240px; height:24px;  border-bottom:2px solid #fff; padding-top:7px;}
.sublinkli { background:url(../i/subnav_indicator.png) no-repeat  0px 1px !important;}
.sublinkliopen { background:url(../i/subnav_indicator.jpg) no-repeat #fafafa 0px -29px !important;}

#sub_containerul li:hover {background:none !important;}
.ps_sub {padding-left:20px; width:220px !important;}
.ps_sub:hover {background:url(../i/subbullet.png) no-repeat 20px 14px !important;}
.ps_sub_active {background:url(../i/subbullet.png) no-repeat 20px 14px #fafafa !important;}

.cs_closed {background:url(../i/caseheadbg.jpg) no-repeat 0px -2px; padding-left:20px;}
.cs_open {background:url(../i/caseheadbg.jpg) no-repeat 0px -26px; padding-left:20px;}
.cs_closed2 {background:url(../i/caseheadbg.png) no-repeat 0px -2px; padding-left:20px;}
.cs_open2 {background:url(../i/caseheadbg.png) no-repeat 0px -26px; padding-left:20px;}
.side_active {background:url(../i/subbullet.png) no-repeat 7px 13px #fafafa !important;}