/*_______________________________________________________________________________________________

	Title: Comsci
	
	1. BASE
			1.1 Defaults
			1.2 Typography
			1.3 Objects

	2. LAYOUT
			2.1 Structure
			2.2 Header
			2.3 Content
			2.4 Footer
      
  3. PLUGINS
      3.1 Lightbox
	
_______________________________________________________________________________________________*/



/* 1. BASE
_______________________________________________________________________________________________
_______________________________________________________________________________________________*/	


/* 1.1	Defaults
_______________________________________________________________________________________________*/	

  body { margin:0px; padding:0px; background-color:#FFFFFF; font-size:13px; font-family: "Trebuchet MS"; color:#405263;}
  img { border:0px}
  
/* Clearfix */
  
  .clearfix:after,
	#branding .branding_inner:after,
	dl:after,
	ul.clients:after
	{content:".";display:block;height:0;clear:both;visibility:hidden;}

	.clearfix,
	#branding .branding_inner,
	dl,
	ul.clients
	{zoom:1;}
	
	.clear { clear:both; }


/* 1.2	Typography
_______________________________________________________________________________________________*/	

  h6{font-size:13px; font-weight:bold; color:#36789D; margin:0px; margin-bottom:2px; padding:0px}
  h2 {font-size:18px;}
  #body_1 h3 {font-size:15px;}
  h3{color:#369; font-size:13px}
  h3 a:link{color:#369}
  h3 a:visited{color:#369}
  h4{font-size:16px; margin:15px 0 15px 0px; font-weight:bold; color:#36789D; padding-bottom:6px; border-bottom:1px solid #ccc; font-family:"Trebuchet MS"}
  h4.center {text-align:center;border:none;margin:4px 0;}
  h5{font-size:13px;  font-weight:bold; color:#36789D; margin-bottom:0px; padding:0px}
  h5.events{border-top:1px solid #eee; margin-top:10px; padding-top:20px; width:400px}
  p.right {text-align:right;}
  p {margin:12px 0;}
  
  a {color:#0073d2;text-decoration:none}
  a:visited{color:#5093cb;}
  a:hover,
  a:active {text-decoration:underline;}
  
  
  .ul { margin:0px; padding:0px; font-size: 13px; }
  .ul li{ margin:0px; padding:0px; list-style:url(../images/bullet.gif); padding-left:5px; margin-left:20px; line-height:20px; margin-bottom:5px}
  .ul1{ margin:0px; padding:0px; margin-left:20px}
  .ul1 li{ margin:0px; padding:0px; list-style:url(../images/bullet1.gif);color:#FFFFFF }
  
  .title_1 { color:#005dab; font-size:15px; font-weight:bold}
  .title_1 h3 {margin-top:0;margin-bottom:14px;}
  .title_1 a { color:#005dab; }
  .text_blue { color:#005DAB; font-weight:bold; font-size: 12px;}
  .text_blue a{ color:#005DAB; font-weight:bold; text-decoration:none}
  .text_blue a:hover{ color:#005DAB; font-weight:bold; text-decoration:none}
  .news { color:#005DAB; font-weight:bold}
  .news a{ color:#005DAB; font-weight:bold; text-decoration:none}
  .news a:hover{ color:#005DAB; font-weight:bold; text-decoration:none}
  
  .more_b a { color:#005DAB; }
  
  dl {margin:18px 0;padding:0 0 1px 0;border-bottom:1px solid #eee;}
  dl dt {float:left;clear:left;width:200px;margin:0 0 9px 0;padding:9px 10px 0 0;font-size:14px;line-height:18px;border-top:1px solid #eee;}
  dl dd {margin:0 0 9px 210px;line-height:18px;padding:9px 0 0 0;border-top:1px solid #eee;}
  
  
/* 1.3	Objects
_______________________________________________________________________________________________*/	

  .slideheader{width:870px; color:#fff; background-color:#369; padding:8px; font-weight:bold; margin-top:5px; cursor:pointer}
  .submit-button{width:140px; float:left; border:1px solid #23658A}
  .spacer{line-height:0; font-size:0; clear:both}
  
  .product_box { float:left; width:200px; margin:0px 5px;}
  .product_box span{ color:#FFFFFF}
  .product_box ul{ margin:0px; padding:0px; margin-left:20px}
  .product_box ul li{ margin:0px; padding:0px; list-style:url(../images/bullet1.gif);color:#FFFFFF }
  .textbox{ float:right; width:423px; background:url(../images/box_bg.jpg) no-repeat; height:190px; margin-left:10px;  }
  .textbox1{ float:left; width:423px; background:url(../images/box_bg.jpg) no-repeat; height:190px; margin-right:10px;  }
  
  .add_bg { background:url(../images/add_bg.jpg) center no-repeat; height:300px; width:876px; margin-left:auto; margin-right:auto}
  .add_logo { width:200px; height:200px; float:left; padding-left:15px; padding-top:28px}
  .add_text { width:200px; height:200px; float:right; padding-right:10px; padding-top:28px}
  .text_bg { background:url(../images/text_bg.jpg) center no-repeat; height:275px; width:876px; margin-left:auto; margin-right:auto}
  .p_box { float:left; width:200px; height:200px; padding-left:5px}
  .line { background:url(../images/dot.gif) repeat-x center; height:10px}

  /* date */
  .date {display:block;width:32px;height:36px;padding:1px 5px 5px 1px;background-image:url(../images/bg_date.png);background-position:0 0;background-repeat:no-repeat;text-align:center;}
  .date abbr {border:none;display:block;height:14px;line-height:14px;color:#fff;text-transform:uppercase;font-weight:bold;font-size:10px;margin:0 0 1px 0;}
  .date span {display:block; font-family: Georgia, Palatino, "Palatino Linotype", Times, "Times New Roman", serif; font-weight:normal; font-size:18px; line-height:18px; color:#005dab;}

  /* Images */
  img.right {float:right;margin:10px 0 10px 10px;}
  img.left  {float:left; margin:10px 10px 10px 0;}
  
  /* Sideboxblue */
  .sidebox-blue {float:right;width:43%;margin:0 0 18px 18px;background-color:#0460ad;padding:4px 9px;color:#fff;}
  .sidebox-blue h5 {margin:9px 0;color:#fff;}
  .sidebox-blue ul {padding-left:20px;margin:9px 0;}
  
  .vcard {margin:0 0 18px 0;}

/* 2. LAYOUT
_______________________________________________________________________________________________
_______________________________________________________________________________________________*/	


/* 2.1	Structure
_______________________________________________________________________________________________*/	


  .container {margin:0 auto;width:878px;}


/* 2.2	Header
_______________________________________________________________________________________________*/

  #top { background:url(../images/top_bg.gif) repeat-x; height:80px; width:100%}
  #top .inner{ height:80px; width:900px; margin: 0px auto}
  #top .logo{ float:left; height:65px; width:224px; padding-left:15px; padding-top: 8px}
  #top .ricon{ float:right; height:24px; width:120px;  padding-top: 30px}
  
  /* 2.2.1	Navigation
  _______________________________________________*/

  #nav { background:url(../images/nav_bg.gif) repeat-x; height:45px; width:100%}
  #nav .nav{  height:45px; width:878px; margin: 0px auto}
  
  ul.menu {list-style:none; margin:0; padding:0; background-image:url(../images/nav_sep.gif);background-position:0 0;background-repeat:no-repeat;height:45px;}
  ul.menu * {margin:0; padding:0; height:34px; margin-top:0}
  ul.menu a {float:left; color:#fff; text-decoration:none; text-align:center; font-size:16px; font-family: Arial; font-weight:bold; line-height:39px;  }
  ul.menu li {position:relative; float:left; margin-right:0px; background-image:url(../images/nav_sep.gif);background-position:100% 0;background-repeat:no-repeat;}
  ul.menu ul {position:absolute; top:44px; left:0; display:none; opacity:0; list-style:none; margin-bottom:20px; padding-bottom:1px;}
  ul.menu ul li.last-dropdown {padding-bottom:102px;}
  ul.menu ul li {position:relative;width:280px;margin:0;}
  ul.menu ul li li {width:325px;}
  ul.menu ul li:first-child {background-image:url(../images/sub_nav_h.gif);background-position:0 0;background-repeat:repeat-x;}
  ul.menu ul li a {display:block;float:none;padding:8px 5px 8px 14px; color:#232f3a; text-align:left; width:auto; font-weight:normal; font-size:14px; line-height:17px; height:17px;border-top:1px solid #fff;background:#e3e8ef;}
  ul.menu ul li a:hover,
  ul.menu ul li:hover > a {background-color:#f3f3f3; color:#000;}
  ul.menu ul ul {left:280px; top:-1px}
  ul.menu .menulink { padding:0 18px 6px 18px;  background:url(../images/btn_seperator.gif) 0px no-repeat; text-align:center; height:39px;}
  ul.menu .active { padding:12px 7px 6px;  background:url(../images/nav_bg_h.gif); width:95px; color:#405263}
  ul.menu .menulink:hover, ul.menu .menuhover, ul.menu li:hover > .menulink {background:url(../images/nav_bg_h.gif);color:#405263}
  ul.menu .sub {background:#F3F3F3 url(../images/arrow.gif) 136px 8px no-repeat}
  ul.menu .topline {border-top:1px solid #aaa}
  
  /* Graceful Degradation of the navigation when JS is not available */
  body.nojs ul.menu ul {display:block;left:-999em;opacity: 1; -moz-opacity: 1; filter:alpha(opacity=1);}
  body.nojs ul.menu li:hover ul {left:0;}
  body.nojs ul.menu li:hover ul ul {left:-999em;}
  body.nojs ul.menu li:hover ul li:hover ul {left:280px;}

/* 2.3	Content
_______________________________________________________________________________________________*/		

  #content {text-align:left;clear:both;padding:1px 0 0 5px;}
  
  /* News */
  /*CollapsiblePanel*/
  #form1 .ContainerPanel{width:870px; border:1px; border-color:#1052a0; border-style:double double double double}
  #form1 .collapsePanelHeader{width:870px; height:30px; line-height:30px; background-image:url(../images/bg-menu-main.png); background-repeat:repeat-x; color:#FFF; font-weight:bold}
  #form1 .HeaderContent{float:left; padding-left:5px}
  #form1 .Content{padding:12px;}
  #form1 .ArrowExpand{background-image:url(../images/expand_blue.jpg); width:13px; height:13px; float:right; margin-top:7px; margin-right:5px}
  #form1 .ArrowExpand:hover{cursor:hand}
  #form1 .ArrowClose{background-image:url(../images/collapse_blue.jpg); width:13px; height:13px; float:right; margin-top:7px; margin-right:5px}
  #form1 .ArrowClose:hover{cursor:hand}
  
  #content .wide {width:898px;margin:18px -13px 0px -12px;}
  
  /* Technlogy Financial */
  #technology-financial {display:inline;float:left;position:relative;width:503px;height:300px;margin:18px 0px 0px -12px;}
  #technology-financial a#manage-cost-drivers,
  #technology-financial a#manage-demand {position:absolute;top:0px;z-index:2;width:247px;height:115px;background-position:0 0;background-repeat:no-repeat;text-align:left;text-indent:-999em;background-image:url(../images/blank.gif);}
  
  #technology-financial a#manage-cost-drivers {left:0px;background-position:0 0;}
  #technology-financial a#manage-demand {width:256px;left:247px;background-position:100% 0;}
  #technology-financial a#manage-demand:hover,
  #technology-financial a#manage-cost-drivers:hover {background-image:url(../images/technology-financial-hover.jpg);}
  
  
  blockquote {margin:18px 36px;padding:0;}
  blockquote p {font-style:italic;margin:0;}
  blockquote p.author {text-align:right;font-style:normal;}

  ul.clients {margin:18px 0;padding:0;}
  ul.clients li {float:left;height:110px;line-height:110px;padding:0 23px;list-style:none;}
  ul.clients li img {}

/* 2.4	Footer
_______________________________________________________________________________________________*/


  #body_2 { background:url(../images/footer_1.gif) repeat-x top; height:250px; width:100%}
  #body_2 #body_2_inner { height:200px; width:865px; padding-top:30px; margin-left:auto; margin-right:auto}

  #footer { height:50px; line-height:50px; margin: 20px auto 0 auto; color:#465666; font-family: Arial, "Helvetica Neue", Helvetica, Verdana, sans-serif; border-top:8px solid #005DAA;}
  body.home #footer {border-top:none; width:878px;margin-top:0;}
  #footer .left{ float:left; width:200px; padding-left: 20px; }
  #footer .left a{ color:#465666; font-family: Arial, "Helvetica Neue", Helvetica, Verdana, sans-serif;}
  #footer .left a:hover {color:#0073d2;}
  #footer .right{ float:right; width:658px;text-align:right;}
  #footer .left1{ float:left; width:200px;}
  #footer .left1 a{ color:#465666; font-family: Arial, "Helvetica Neue", Helvetica, Verdana, sans-serif}
  #footer .left1 a:hover{ color:#0073d2;}
  #footer .right1{ float:right; width:658px; text-align:right;}
  
  #footer .fn {display:none;}
  
  .box_1 { float:left; height:200px; width:375px; margin:0px 5px}
  .box_1 a {color:#fff; text-decoration:none;}
  .box_2{ float:left; height:200px; width:230px; margin:0px 5px}
  .box_2 a {color:#fff; text-decoration:none;}
  
  .img_bg { background:url(../images/img_bg.gif) no-repeat; height:166px; width:114px; text-align:center; padding-top:3px}
  .more_w a { color:#FFF; text-decoration:underline;}
  .more_w a:hover {text-decoration:none;}
  
  /* Business Circles */
  .business-circles {position:relative;float:right;margin:0 0 0 10px;}
  .business-circles img {margin:0;float:left;}
  .business-circles a {position:absolute;}
  .business-circles a.circle-home     {width:143px;height: 73px;top:105px;left:0px;}
  .business-circles a.circle-business {width:181px;height:105px;top:0px;left:114px;}
  .business-circles a.circle-cio      {width:157px;height:108px;top:120px;left:143px;}



/* 3. INDIVIDUAL PAGES
_______________________________________________________________________________________________
_______________________________________________________________________________________________*/	


/* 3.1	Homepage
_______________________________________________________________________________________________*/	
    
  #branding { background:url(../images/branding_bg.gif) repeat-x top; min-height:360px; width:100%;}
  #branding .branding_outer {background-repeat:no-repeat;background-position:top center;background-image:url(../images/bg_branding-outer.png);}
  body.home #branding .branding_outer {background-image:url(../images/bg_branding-outer-home.png);}
  #branding .branding_inner{  width:878px;  margin: 0px auto}
  #branding .branding_site{  height:340px; width:26px; margin-top:20px; float:left; background-repeat:no-repeat}
  #branding .branding_middle{  height:300px; width:878px; margin-top:20px; float:left}
  #branding .branding_1{  height:225px; width:878px;}
  #branding .branding_2{  height:109px; width:878px;background:url(../images/branding_2.jpg) no-repeat;}
  #branding .branding_2 .anyClass {width:716px;height:105px;overflow:hidden;}
  #branding .branding_2 .anyClass ul {margin:0;}
  #branding .branding_2 .anyClass ul li {width:716px;height:105px;overflow:hidden;float:left;list-style-type:none;}
  #branding .branding_2 .anyClass ul li table td {height:85px;vertical-align:middle;padding-top:5px;}
  body.nojs #branding .branding_2 td.prev img,
  body.nojs #branding .branding_2 td.next img {display:none;}
  #branding .branding_2 td.prev {padding:35px 0 0 0;width:70px;vertical-align:top;text-align:center;cursor:pointer;}
  #branding .branding_2 td.next {padding:35px 0 0 0;width:70px;vertical-align:top;text-align:center;cursor:pointer;}
  #branding .branding_2 .anyClass ul li table td img {margin-left:20px;}
  #branding .branding_2 .anyClass ul li table td blockquote {color:#405263; font-family:"Trebuchet MS",Helvetica,Jamrul,sans-serif;padding:0;font-style:italic;margin:0;}
  #branding .branding_2 .anyClass ul li table td blockquote p {line-height:1.5em;font-size:12px;margin:0;text-align:justify;}
  #branding .branding_2 .anyClass ul li table td blockquote strong {display:block;font-weight:normal;text-align:right;}
  #branding .branding_site_1{  height:206px; width:26px; margin-top:20px; float:left; background-repeat:no-repeat;}
  #branding .branding_middle_1{ width:878px; margin-top:20px; float:left}
  #branding .branding_11{  height:123px; width:878px;}
  #branding .branding_22{  height:60px; width:878px;background:url(../images/branding_22.jpg) no-repeat; margin-top:7px; margin-bottom:-10px;}
  
  table.clickable {cursor:pointer;}
  
  #body_1 { width:878px; margin: 0px auto;}
  #body_1 .body_1_left {float:left;width:214px;}
  #body_1 .body_1_right {float:right;width:627px;}
  #body_1 .body_1_right table#itservicecosting ul {margin:0 50px 0 20px;}
  #body_1 .body_1_right table#itservicecosting p.right {margin-right:35px;}

  body.home #body_1 h2 {text-align:left;margin-top:0;margin-bottom:10px; color:#005DAB;}
  body.home #body_1 .body_1_right {padding-left:4px;}
  body.home #body_1 .ul li {font-size:12px;line-height:18px;}
  
  .spotlight {width:214px;}
  .spotlight a.cfo {display:block;width:172px;height:248px; background:#003f73 url(../images/bg_spotlight-cfo.jpg) 0 0 no-repeat; color:#fff; text-decoration:none; padding:24px 20px 0 22px;font-size:13px;line-height:18px; font-weight:bold;}
  .spotlight a.cfo:hover {text-decoration:underline;}
  
  .spotlight-blog {width:214px;margin:0 0 18px 0;}
  .spotlight-blog a.cfo {display:block;width:176px;height:173px;background:#003f73 url(../images/bg_spotlight2-cfo.jpg) 0 0 no-repeat; color:#fff; text-decoration:none; padding:12px 20px 0 18px;font-size:13px;line-height:18px; font-weight:bold;}
  .spotlight-blog a.cfo:hover {text-decoration:underline;}

  .spotlight-blog a.blog {display:block;width:176px;height:113px; background:#003f73 url(../images/bg_spotlight-blog.jpg) 0 0 no-repeat; color:#fff; text-decoration:none; padding:16px 20px 0 18px;font-size:13px;line-height:18px; font-weight:bold;}
  .spotlight-blog a.blog:hover {text-decoration:underline;}

/* 3. PLUG-INS
_______________________________________________________________________________________________
_______________________________________________________________________________________________*/	


/* 3.1	Lightbox
_______________________________________________________________________________________________*/	

  #lightbox{position:absolute; left:0; width:100%; z-index:100; text-align:center; line-height:0}
  #lightbox a img{border:none}
  #outerImageContainer{position:relative; background-color:#fff; width:250px; height:250px; margin:0 auto}
  #imageContainer{padding:10px}
  #loading{position:absolute; top:40%; left:0%; height:25%; width:100%; text-align:center; line-height:0}
  #hoverNav{position:absolute; top:0; left:0; height:100%; width:100%; z-index:10}
  #imageContainer>#hoverNav{left:0}
  #hoverNav a{outline:none}
  #prevLink, #nextLink{width:49%; height:100%; background:transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */display:block}
  #prevLink{left:0; float:left}
  #nextLink{right:0; float:right}
  #prevLink:hover, #prevLink:visited:hover{background:url(../images/prev.gif) left 50% no-repeat}
  #nextLink:hover, #nextLink:visited:hover{background:url(../images/next.gif) right 50% no-repeat}
  /*** START:next / previous text links ***/
  #nextLinkText, #prevLinkText{color:#FF9834; font-weight:bold; text-decoration:none}
  #nextLinkText{padding-left:20px}
  #prevLinkText{padding-right:20px}
  /*** END:next / previous text links ***/
  /*** START:added padding when navbar is on top ***/
  .ontop #imageData{padding-top:5px}
  /*** END:added padding when navbar is on top ***/
  #imageDataContainer{font:10px Verdana,Helvetica,sans-serif; background-color:#fff; margin:0 auto; line-height:1.4em}
  #imageData{padding:0 10px}
  #imageData #imageDetails{width:70%; float:left; text-align:left}
  #imageData #caption{font-weight:bold}
  #imageData #numberDisplay{display:block; clear:left; padding-bottom:1.0em}
  #imageData #bottomNavClose{width:66px; float:right;  padding-bottom:0.7em}
  #imageData #helpDisplay{clear:left; float:left; display:block}
  #overlay{position:absolute; top:0; left:0; z-index:90; width:100%; height:500px; background-color:#000; filter:alpha(opacity=60); -moz-opacity:0.6; opacity:0.6; display:none}
  .clearfix:after, 
  #body_1:after
  {content:"."; display:block; height:0; clear:both; visibility:hidden}
  .clearfix,
  #body_1
  {zoom:1;}
  #lightboxIframe{display:none}