/* SCREEN.CSS
   This is where all styles for on-screen media are declaired
   
   --------------------------------------------------------------------------------------------------------------------------
   FILE INFO
   Revision number:  1.1.1
   Last updated:     2008/10/14
   Last updated by:  Matt Wilcox
   ----------------------------------------------------------------------------------------------------------------------- */

/* =global_reset | based on http://meyerweb.com/eric/thoughts/2008/01/15/resetting-again/
   ----------------------------------------------------------------------------------------------------------------------- */
   
   html, body, div, span, applet, object, iframe,
   h1, h2, h3, h4, h5, h6, p, blockquote, pre,
   a, abbr, acronym, address, big, cite, code,
   del, dfn, em, font, img, ins, kbd, q, s, samp,
   small, strike, strong, sub, sup, tt, var,
   b, u, i, center,
   dl, dt, dd, ol, ul, li,
   fieldset, form, label, legend,
   table, caption, tbody, tfoot, thead, tr, th, td {
     margin: 0; padding: 0; border: 0; outline: 0;
     font-size: 100%; vertical-align: baseline; background: transparent; }
   body {
     line-height: 1; }
   ol, ul {
     list-style: none; }
   blockquote, q {
     quotes: none; }

   /* remember to define focus styles! */
   :focus {
     outline: 0; }

   /* remember to highlight inserts somehow! */
   ins {
     text-decoration: none; }
   del {
     text-decoration: line-through; }

   /* tables still need 'cellspacing="0"' in the markup */
   table {
     border-collapse: collapse; border-spacing: 0; }

/* =typography | based on http://alistapart.com/articles/settingtypeontheweb/
                          http://24ways.org/2006/compose-to-a-vertical-rhythm/
                          
    NOTE: found that margin-top applied to everything is be a pain - it often messes up layout and requires jumping through
          hoops to fix, so have stopped doing this as a default and now add top margin manually when required instead.
    NOTE: using px for type is bad for people using IE6, but good for my brain. IE6 is dying, so I think that's OK. Feel free
          to tut if you're a purist. I'm a pragmatist.
   ----------------------------------------------------------------------------------------------------------------------- */
   body {
     font : 75%/1.5 Helvetica, Arial, Verdana, sans-serif; }
   html > body {
     font-size : 12px; }
   div, applet, object, iframe,
   h1, h2, h3, h4, h5, h6, p, blockquote, pre,
   address, img, dl, dt, dd, ol, ul, li,
   fieldset, form, label, legend,
   table, caption, tbody, tfoot, thead, tr, th, td {
     margin-bottom : 1.5em; }
   h1,
   .home h2 { font-size : 24px; line-height: 36px; margin-bottom: 18px; font-weight : normal; }
   h2 { font-size : 20px; line-height: 36px; margin-bottom: 18px; font-weight : normal; }
   h3, h4, h5, h6 {
     font-size : 16px; line-height: 18px; margin-bottom: 18px;
     font-weight : normal; }
   
/* =design | now the browser reset and basic typographic layout is done, lets get designing
   ----------------------------------------------------------------------------------------------------------------------- */
   
/* =html =body */
   html {
     background : #ffffff url(../images/html.png) 0 0 repeat-x; color : #3e3d40; }
   body {  }
   
/* =h1 */
   
/* =h2 */
   #content_supp h2 {
     background-color : #eee; }
     
   #nav_main h2,
   #sitemap h2,
   #site_info h2,
   #module_products h2,
   form#newsletter-signup h2,
   form#newsletter-signup h3,
   form#newsletter-signup h4,
   #wrapper h2,
   #nav_product h2 {
     position : absolute; left : -999em;
     overflow : hidden; }
     
/* =h3 */

	h3 {
   		font-size: 16px;
    	font-weight: normal;
    	margin: 0px 0px 14px 0px;
	}

   #nav_task h3 {
	 position : absolute; left : -999em;
	 overflow : hidden; }
     
   #sitemap li h3 {
     border-bottom : 1px solid #e9e9e9; margin-left : 0;
     font-size : 12px; font-weight : bold; color : #9f9f9f; }
     
   .product ul h3 {
     margin-left : 0; }
     
/* =h4 */
   
/* =p */
   p.accessibility {
     position : absolute;
     margin : -3.5em 0 0 0;
     z-index : 2; }
     
   blockquote p:before {
     content : "\201c"; }
   blockquote p:after {
     content : "\201d"; }
   blockquote p.author {
     color : #a8bf40; }
   blockquote p.author:before,
   blockquote p.author:after {
     content : ""; }
     
   .attributed p {
     margin-bottom : 0; }
     
   label p.error {
     padding : .5em; color : #fff;
     background : #c00; text-align : left; }
     
   #site_info p {
     margin-top : 32px; font-size : 13px; }
     
   p.emphasis {
     font-size : 17px; color : #a2ba32; 
     font-weight: normal; 
     margin: 0px 0px 16px 0px; }
     
   body.home #site_context p {
     position : absolute; left : -999em; overflow : hidden; }
     
/* =blockquote */
   blockquote {
     clear : both; }

/* =em =strong =del =ins =abbr =acronym =code */
   em          { font-style : italic; }
   strong      { font-weight : bold; }
   del         { text-decoration : line-through; }
   ins         { text-decoration : none; color : #006; }
   del[title],
   ins[title]  { cursor : help; }
   acronym,
   abbr        { text-decoration : none; border-bottom : none; font-style : italic; cursor : help; }
   code        { font-family : dialogue, 'Courier New', courier, serif; }
   sup         { vertical-align : super; font-size : .8333em; }
   sub         { vertical-align : sub; }
   
/* =address */
   address {  }

/* =dl =dt =dd */
   dl {  }
   dt {
     margin-bottom : 0;
     font-weight : bold; font-style : italic; }
   dd {
     margin-top : 0;
     border-left : .3em solid #ddd; padding : .5em 0 0 .7em; }
   
/* =ul */
   #content ul {
     margin-left : 1em;
     list-style : disc outside; }
   #nav_main ul,
   #sitemap ul {
     margin : 0; list-style-type : none; }
   
/* =ol */
   #content ol {
     margin-left : 1.6em;
     list-style : decimal outside; }

/* =li */
   li {
     margin : .5em 0; }
   #nav_main li {
     display : inline; }
   #sitemap li {
     list-style-type : none; margin : 0; font-size : 10px; }
     
   #sitemap li.item_1 {
     float : left;
     width : 140px; margin-right : 15px; }
   #sitemap li.item_2 {
     float : left;
     width : 300px; margin-right : 15px; }
   #sitemap li.item_3 {
     float : left;
     width : 140px; margin-right : 15px; }
   #sitemap li.item_4 {
     float : left;
     width : 140px; margin-right : 15px; }
   #sitemap li.item_5 {
     float : left;
     width : 140px; }
     
   #sitemap li.item_2 ul {
     float : left;
     width : 140px; }
     
   #sitemap ul li ul li {
     margin-bottom : 4px; }
     
/* =img */
   img,
   img a { border : none; }
   .attributed img {
     margin : 0; }
     
   #site_info .item_1,
   #site_info .item_2  {
     position : relative; top : 14px; }
   #accreditations img {
     margin-left : 10px; }
   
/* =hr */
   hr { display : none; }

/* =a */
   a:link    { color : #005e81; text-decoration : none; } 
   a:visited { color : #005e81; text-decoration : none; }
   a:hover   { text-decoration : underline; }
   a:focus   { background-color : #ff9; color : #333; }
   a:active  { background-color : #ff6; color : #000; outline : none; }
   :target   { background-color : #ff6; }
  
   p.accessibility a {
     margin : 0; padding : 0; line-height : 1em; }
   p.accessibility a:focus {
     position : absolute; left : 1em;
     margin-top : 2.5em;
     background-color : #ffff99; }
     
   p.cta {
   	font-weight: bold;
	font-size: 13px;
   }
   
   ul.longlist {
   	width: 50%;
   	float: left;
   	height: auto;
   }
     
   #site_context a,
   #page_context a {
     display : block; width : 245px; height : 56px; }
   #accreditations a {
     margin-left : 20px; }
     
   #sitemap li a {
     color : #9f9f9f; }
     
/* =table */
   table {
     width : 100%; border : 1px solid #ddd; }

/* =caption */
   caption {  }

/* =thead */
   thead {
     text-align : left; background : #ddd; }

/* =tfoot */
   tfoot {
     background-color : #ddd; }
   
/* =tbody */
   tbody {  }
   
/* =tr */
   tbody tr:hover { background-color : #f6f6f6; }
   
/* =th */
   th {
     font-weight : bold; padding : 2px; }

/* =td*/
   td {
     border : 1px dotted #ddd; padding : 2px; }

/* =form */
   form {
     position : relative;
     width : auto;
     overflow : hidden; }
     
   #nav_main form {
     margin : 0; }
   
/* =fieldset */
   fieldset {  }

/* =legend */
   legend {
     margin : 0; }
   
   #nav_main legend {
     display : none; }

/* =label */
   label {
     position : relative; /* so we can absolutely position errors */
     display : block;
     overflow : hidden; /* so no collapsing float issues */ }
   
/* =input */
   input[type="text"],
   input[type="password"],
   textarea {
     border : 1px solid #999; }
   input[type="text"]:focus,
   input[type="password"]:focus,
   textarea:focus {
     background-color : #ffd; }
     
   label input {
     width : 97%; }
   .boolean input {
     width : auto; margin-right : .5em; }
   
/* =textarea */
    textarea {
      width : 99%; height : 8em; }

/* =select */
   label select {
     width : 100%; }
   select:focus {
     background-color : #ff9; }
     
/* =div */
   #container {
     position : relative;
     width : 920px; margin : 0 auto; padding-top : 20px; }
   #page_context,
   #site_context  {
     height : 122px; }
   #nav_main {
     position : absolute; top : 94px; left : 0;
     display : block; width : 849px; height : 29px; margin : 0; }
   #content {
     margin-top : 96px;
     overflow : hidden; }
   body.product #content {
     margin-top : 96px; }
   body.home #content,
   body.modules #content {
   	margin-top: 69px;
   }
  
   #content_main {
     float : left;
     width : 620px; }
   #content_sub {
     float : left;
     margin-left : 40px; width : 260px; }
     
   #nav_task {
	   position : absolute; top : 0; right : 0;
	   display : block; width : 261px; height : 69px; margin : 0;
	   background : url(../images/nav_task.jpg) 0 0 no-repeat; }
	 #non-semantic-1 {
	   background : url(../images/non-semantic-1.png) 0 0 repeat-x; }
	 #non-semantic-2 {
	   position : relative;
	   width : 920px; margin : 0 auto;
	   overflow : hidden; }
	 #sitemap {
	   padding : 96px 0 20px 0; }
	 #site_info {
	   position : absolute; top : 0; left : 0;
	   color : #9f9f9f; }
	 #accreditations {
	   position : absolute; top : 10px; left : 415px; width : 630px; }
	   
	 div.image {
	   display : block; width : 188px; height : 118px; padding : 11px;
	   background : url(../images/screenshot.jpg) 0 0 no-repeat; }

   body.home #site_context,
   body #page_context {
     position : relative;
   
     display : block; width : 245px; height : 56px; margin : 0 0 0 25px; }
   
   body #page div {
     margin: 30px;
   }  
    body.news #page div {
      margin-right: 0px;
    } 
  body.news #page div div,
  body.blog #page div div {
     margin: 0;
   }
   
  body.news #page div.col1 {
    margin: 0 0 0 25px; float: left; width: 350px;
  }
   
   

   
   body.events #page .archive {
     margin-left: 30px;
   }
   
   body #page div#details {
     margin-top: 0; margin-right: 0;
   }
   
   #fancy_outer {
     width: 640px !important;
     height: 498px !important;
   }
/* =span */
   label span {
     display : block; }
   label.boolean span {
     display : inline; }
   
   #site_context a span,
   #page_context a span {
     position : absolute; top : 0; left : 0;
     display : block; width : 245px; height : 56px;
     background : url(../images/logo.png) 0 0 no-repeat; }
   #site_context a:hover span,
   #site_context a:focus span,
   #page_context a:hover span,
   #page_context a:focus span {
     background-position : 0 -56px; }
   
/* =layout-classes */
   .float-left {
     float : left;
     margin-right : 30px; }
   .float-right {
     float : right;
     margin-left : 20px; }
   .float-left.last {
     margin-right : 0; }
   .clear {
     clear : both; }
     
   /* full width portions */
   .one-third {
     width : 300px; text-align : justify; /* text align to show column bounds */ }
   .two-thirds {
     width : 630px; text-align : justify; /* text align to show column bounds */ }
   .half {
     width : 465px; text-align : justify; /* text align to show column bounds */ }
     
   /* portions inside a two-third parent portion */
   .two-thirds .one-third {
     width : 190px; }
   .two-thirds .two-thirds {
     width : 410px; }
   
/* =display-classes */
   .attributed {
     padding : 9px; border : 1px solid #eee;
     background-color : #f6f6f6; }
     
/* main navigation */

   /* place and size the anchors in their default state */
   #nav_main a {
     position : absolute; top : 0; left : 0;
     display : block; width : 88px; height : 22px; padding-top : 7px;
     text-align : center; }
   #nav_main .item_1 a {
     left : 0px;
     width : 64px; }
   #nav_main .item_2 a {
     left : 64px;
     width : 88px; }
   #nav_main .item_3 a {
     left : 152px;
     width : 78px; }
   #nav_main .item_4 a {
     left : 230px;
     width : 95px; }
   #nav_main .item_5 a {
     left : 325px;
     width : 86px; }
   #nav_main .item_6 a {
     left : 411px;
     width : 161px; }
   #nav_main .item_7 a {
     left : 572px;
     width : 94px; }
   #nav_main .item_8 a {
     left : 666px;
     width : 92px; }
   #nav_main .item_9 a {
     left : 758px;
     width : 120px; }
     
   /* place the span over the top of the anchor so it hides the replaced text */
   #nav_main a span {
     position : absolute; top : 0; left : 0;
     display : block; width : 88px; height : 29px;
     background : url(../images/nav_main.png) 0 0 no-repeat; }
   #nav_main .item_1 a span {
     left : 0px;
     width : 64px;
     background-position : 0 0; }
   #nav_main .item_2 a span {
     width : 88px;
     background-position : -64px 0; }
   #nav_main .item_3 a span {
     width : 78px;
     background-position : -152px 0; }
   #nav_main .item_4 a span {
     width : 95px;
     background-position : -230px 0; }
   #nav_main .item_5 a span {
     width : 86px;
     background-position : -325px 0; }
   #nav_main .item_6 a span {
     width : 160px;
     background-position : -411px 0; }
   #nav_main .item_7 a span {
     width : 94px;
     background-position : -571px 0; }
   #nav_main .item_8 a span {
     width : 92px;
     background-position : -665px 0; }
   #nav_main .item_9 a span {
     width : 120px;
     background-position : -757px 0; }
     
   /* change the background position when hovered/focused */
   #nav_main .item_1 a:hover span,
   #nav_main .item_1 a:focus span {
    width: 64px;
     background-position : 0px -29px; }
   #nav_main .item_2 a:hover span,
   #nav_main .item_2 a:focus span {
     width : 88px;
     background-position : -64px -29px; }
   #nav_main .item_3 a:hover span,
   #nav_main .item_3 a:focus span {
     width : 78px;
     background-position : -152px -29px; }
   #nav_main .item_4 a:hover span,
   #nav_main .item_4 a:focus span {
     width : 95px;
     background-position : -230px -29px; }
   #nav_main .item_5 a:hover span,
   #nav_main .item_5 a:focus span {
     width : 86px;
     background-position : -325px -29px; }
   #nav_main .item_6 a:hover span,
   #nav_main .item_6 a:focus span {
     width : 160px;
     background-position : -411px -29px; }
   #nav_main .item_7 a:hover span,
   #nav_main .item_7 a:focus span {
     width : 94px;
     background-position : -571px -29px; }
   #nav_main .item_8 a:hover span,
   #nav_main .item_8 a:focus span {
     width : 92px;
     background-position : -665px -29px; }
   #nav_main .item_9 a:hover span,
   #nav_main .item_9 a:focus span {
     width : 120px;
     background-position : -757px -29px; }
     
   /* make the current page a "selected" tab.
      This requires increasing the anchor size by a pixel on the left so it masks the vertical seperator. */
   body.home #nav_main .item_1 a span {
     width : 64px;
     background-position : -0px -58px; }
   body.product #nav_main .item_2 a span {
     width : 88px;
     background-position : -64px -58px; }
   body.modules #nav_main .item_3 a span {
     width : 78px;
     background-position : -152px -58px; }
   body.e-invoicing #nav_main .item_4 a span {
     width : 95px;
     background-position : -230px -58px; }
   body.international-payments #nav_main .item_5 a span {
     width : 86px;
     background-position : -325px -58px; }
   body.professional-services #nav_main .item_6 a span {
     width : 161px;
     background-position : -411px -58px; }
   body.customers #nav_main .item_7 a span {
     width : 94px;
     background-position : -571px -58px; }
   body.resources #nav_main .item_8 a span {
     width : 92px;
     background-position : -665px -58px; }
   body.news #nav_main .item_9 a span {
     width : 140px;
     background-position : -757px -58px; }

/* contextual navigation (top right) */
   /* There's no way to gracefully degrade if JS isn't enabled as this is a simulated drop-down, so just hide the content in CSS here */
   #nav_task li.item_3 ul {
	   position : absolute; left : -999em;
	   -webkit-box-shadow: 0 20px 20px rgba(0,0,0,.25); -moz-box-shadow: 0 20px 20px rgba(0,0,0,.25); box-shadow: 0 20px 20px rgba(0,0,0,.25);
	   overflow : hidden; }
	   
   #nav_task li.item_1 a {
	   position : absolute; top : 0; left : 1px;
	   display : block; width : 165px; height : 24px; padding-top : 10px;
	   text-align : center; }
   #nav_task li.item_2 a {
	   position : absolute; top : 0; left : 167px;
	   display : block; width : 93px; height : 24px; padding-top : 10px;
	   text-align : center; }
	 #nav_task li.item_3 h4 {
	   position : absolute; top : 35px; left : 1px;
	   display : block; width : 259px; height : 23px; padding-top : 10px;
	   text-align : center; font-size : 12px; }
	   
	 /* place the spans over the anchor so we can put the graphic over the top of the text */
	 #nav_task li.item_1 a span {
	   position : absolute; top : 0; left : 0;
	   display : block; width : 100%; height : 100%;
	   background : url(../images/nav_task.jpg) -1px 0 no-repeat; }
	 #nav_task li.item_2 a span {
	   position : absolute; top : 0; left : 0;
	   display : block; width : 100%; height : 100%;
	   background : url(../images/nav_task.jpg) -167px 0 no-repeat; }
	 #nav_task li.item_3 h4 span {
	   position : absolute; top : 0; left : 0;
	   display : block; width : 259px; height : 33px;
	   background : url(../images/nav_task.jpg) -1px -35px no-repeat; }
	   
	 /* give them some hover/focus interaction */
	 #nav_task li.item_1 a:hover span,
	 #nav_task li.item_1 a:focus span {
	   background-position : -1px -69px; }
	 #nav_task li.item_2 a:hover span,
	 #nav_task li.item_2 a:focus span {
	   background-position : -167px -69px; }
	 #nav_task li.item_3 h4:hover span {
	   background-position : -1px -104px; }
	   
	 /* this behaves as a drop down, and needs styling accordingly */
	 #nav_task li.item_3 li {
	   margin : 0; }
	 #nav_task li.item_3:hover,
	 #nav_task li.item_3.hover {
	   cursor : pointer; }
   #nav_task li.item_3:hover ul,
   #nav_task li.item_3.hover ul {
	   top : 68px; left : auto; right : 0;
	   width : 259px; border : 1px solid #e7e7e7;
	   background-color : #fff; }
	 #nav_task li.item_3 a {
	   display : block; padding : 6px 14px; }
	 #nav_task li.item_3 a:hover {
	   background-color : #a3ba3b; color : #fff; text-decoration : none; }
	   
/* product navigation */
   #nav_product {
     position : absolute; top : 146px; }
   #nav_product ul {
     list-style-type : none; }
   #nav_product ul li {
     display : inline; }
     
   /* place and size the anchors in their default state */
   #nav_product a {
     position : absolute; top : 0; left : 0;
     display : block; width : 88px; height : 36px;
     text-align : center; }
   #nav_product .item_1 a {
     left : 0px;
     width : 73px; }
   #nav_product .item_2 a {
     left : 73px;
     width : 133px; }
   #nav_product .item_3 a {
     left : 206px;
     width : 118px; }
   #nav_product .item_4 a {
     left : 324px;
     width : 71px; }
   #nav_product .item_5 a {
     left : 395px;
     width : 77px; }
   #nav_product .item_6 a {
     left : 471px;
     width : 74px; }
   
   /* spans */
   #nav_product span {
     position : absolute; top : 0; left : 0;
     display : block; width : 100%; height : 100%;
     background : url(../images/nav_product.png) 0 0 no-repeat; }
   #nav_product .item_2 span {
     background-position : -73px 0; }
   #nav_product .item_3 span {
     background-position : -206px 0; }
   #nav_product .item_4 span {
     background-position : -324px 0; }
   #nav_product .item_5 span {
     background-position : -395px 0; }
   #nav_product .item_6 span {
     background-position : -471px 0; }
     
   /* spans hover */
   #nav_product a:hover span,
   #nav_product a:focus span {
     background-position : 0 -36px; }
   #nav_product .item_2 a:hover span,
   #nav_product .item_2 a:focus span {
     background-position : -73px -36px; }
   #nav_product .item_3 a:hover span,
   #nav_product .item_3 a:focus span {
     background-position : -206px -36px; }
   #nav_product .item_4 a:hover span,
   #nav_product .item_4 a:focus span {
     background-position : -324px -36px; }
   #nav_product .item_5 a:hover span,
   #nav_product .item_5 a:focus span {
     background-position : -395px -36px; }
   #nav_product .item_6 a:hover span,
   #nav_product .item_6 a:focus span {
     background-position : -471px -36px; }
     
   /* make the current page a "selected" tab.
      This requires increasing the anchor size by a pixel on the left so it masks the vertical seperator. */
   body.overview #nav_product .item_1 span {
     background-position : 0 -72px; }
     
   body.why-bacsactive-ip #nav_product .item_2 a {
     left : 72px; width : 134px; }
   body.why-bacsactive-ip #nav_product .item_2 span {
     background-position : -73px -72px; }
     
   body.web-professional #nav_product .item_3 a {
     left : 204px; width : 120px; }
   body.web-professional #nav_product .item_3 span {
     background-position : -207px -72px; }
   
   body.business #nav_product .item_4 a {
     left : 323px; width : 73px; }
   body.business #nav_product .item_4 span {
     background-position : -326px -72px; }
     
   body.enterprise #nav_product .item_5 a {
     left : 393px; width : 77px; }
   body.enterprise #nav_product .item_5 span {
     background-position : -398px -72px; }
    
   body.total-bacs #nav_product .item_6 a {
     left : 470px; width : 76px; }
   body.total-bacs #nav_product .item_6 span {
     background-position : -476px -72px; }
     
/* sub navigation */

#nav_sub { 
	position: absolute; top: 139px; left: auto; }
	
#nav_sub ul { 
	list-style-type: none; padding: 0px 0px 0px 7px; }	
	
#nav_sub ul li { 
	display: block; float: left; height: 28px; }
	
#nav_sub ul li a { 
	width: auto; color: #a1a1a1; line-height: 24px;
    display: block; height: 28px; padding: 0px 11px;
	text-transform: lowercase;
	background: url(../images/nav_sub_divider.png) no-repeat top right; }
 #nav_sub ul li a:hover {
    text-decoration: none; color: #000000; }

#nav_sub ul .current {
	background: url(../images/nav_sub_indicator.png) no-repeat bottom center; }
#nav_sub ul .current a:hover { 
	color: #256e8e; }
#nav_sub ul .current a {
	font-weight: normal;
	color: #256e8e; }

#nav_sub ul .last a {
	background: none; }
			     
/* homepage */
   body.home #content_main {
     width : 920px; }
   body.home #content_supp {
     clear : both; }
   
   /* style the product module as though jQuery is not available */
   #module_products {
     position : relative; float : left;
     width : 620px; margin-bottom : 40px; padding-bottom : 1px;
     background : url(../images/home_module-products.png) 0 100% no-repeat; font-size : 14px; }
   #module_products div {
     position : relative;
     margin : 0 20px 40px 30px; padding-top : 20px; border-top : 1px solid #ddd; }
   #module_products ul {
     position : relative;
     display : block; width : 620px; height : 250px; margin : 0;
     list-style-type : none; background : url(../images/home_products.jpg) 0 0 no-repeat; }
   #module_products ul li {
     float : left;
     display : block; margin : 0; padding : 0; height : 190px;
     background-color : #005; }
   #module_products ul li.item_1 {
     width : 110px; }
   #module_products ul li.item_2 {
     width : 130px; }
   #module_products ul li.item_3 {
     width : 125px; }
   #module_products ul li.item_4 {
     width : 125px; }
   #module_products ul li.item_5 {
     width : 130px; }
   
   #module_products ul li a {
     position : relative;
     display : block; width : 100%; height : 100%;
     text-align : center; font-size : 14px; }
   #module_products ul li a span {
     position : absolute; top : 0; left : 0;
     display : block; width : 100%; height : 100%;
     background : url(../images/home_products.jpg) 0 0 no-repeat; }
     
   #module_products ul li.item_2 span {
     background-position : -110px 0; }
   #module_products ul li.item_3 span {
     background-position : -240px 0; }
   #module_products ul li.item_4 span {
     background-position : -365px 0; }
   #module_products ul li.item_5 span {
     background-position : -490px 0; }
     
   #module_products #mp_overview {
     margin-top : -50px; }
   #module_products div em {
     font-size : 16px; color : #005e81; font-style : normal; }
     
   /* hover state */
   #module_products ul li a:hover,
   #module_products ul li a:focus {
     background-color : #33b; }
   #module_products ul li.item_1 a:hover span {
     background-position : 0 -250px; }
   #module_products ul li.item_2 a:hover span {
     background-position : -110px -250px; }
   #module_products ul li.item_3 a:hover span {
     background-position : -240px -250px; }
   #module_products ul li.item_4 a:hover span {
     background-position : -365px -250px; }
   #module_products ul li.item_5 a:hover span {
     background-position : -490px -250px; }
   
     /* content area */
     #module_products h3 {
       font-family : "Myriad Pro", Helvetica, Arial; font-size : 26px; letter-spacing : -1px; color : #005e81; }
     #module_products h3 a {
      color : #005e81; }
   
   /* style the product module as though jQuery is available */
	 #module_products.jquery-available {
	   width : 620px; height : 456px;
	   border-bottom : 0; padding-bottom : 0; }
	   
	 /* advert section */
	 #advert {
	   float : left;
	   margin : 0 49px 0 0;
	   background-color : #eee; }
	 #advert,
	 #advert a,
	 #advert a span {
	   position : relative;
	   display : block; width : 286px; height : 169px; }
	 #advert a {
	   position : absolute; top : 0; left : 0;
	   height : 69px; padding-top : 100px; }
	 #advert a span {
	   position : absolute; top : 0; left : 0;
	   background : url(/images/advert-1.jpg) 0 0;}
	   
	 /* news */
	 #module_news {
	   float : left;
	   width : 285px; margin-bottom : 0; }
	 #module_news h2 {
	   position : relative;
	   display : block; width : 285px; height : 30px; margin : 0 0 10px 0; padding : 0;
	   font-size : 14px; line-height : 28px; }
	 #module_news h2 a {
	   position : absolute; top : 0; right : 0;
	   font-size : 12px; 
	   color: #69cbe2; }
	 #module_news h2 span {
	   position : absolute; top : 0; left : 0;
	   display : block; width : 285px; height : 30px;
	   background : url(../images/module-news_h2.png) 0 0 no-repeat; }
	 #module_news h3 {
	   margin : 5px 0 4px 0;
	   font-size : 12px; 
	   font-weight: bold;
	   line-height : 18px; }
	 #module_news h3 a {
	   color : #000; }
	 #module_news h3 a span {
	 	color: #69cbe2;
	 }
	 #module_news p {
	   font-size : 10px; margin-bottom : 10px; 
	   border-bottom: 1px solid #e9e9e9;
	   padding-bottom: 10px;
	   }
	 #module_news .more {
	 	text-align: left;
	 	font-weight: bold;
	 }
	 #module_news .more a {
	 	color: #69cbe2;
	 }
	   
/* newsletter signup */
	 form#newsletter-signup {
	   position : relative; float : left;
	   width : 260px; height : 260px;
	   background : #eee url(../images/newsletter-bg.jpg) 0 0 no-repeat; 
    }
	 body.home form#newsletter-signup {
	   margin-left: 40px; }
	 form#newsletter-signup p {
	   position : relative;
	   width : 260px; height : 50px; margin : 0 0 16px 0; overflow : hidden; }
	 form#newsletter-signup p span {
	   position : absolute; top : 0; left : 0;
	   display : block; width : 100%; height : 100%;
	   background : url(../images/newsletter-bg.jpg) 0 0 no-repeat; }
	 #newsletter-signup fieldset {
	   margin : 0 18px; }
	 #newsletter-signup label {
	   width : 100%; margin : 6px 0px 0px 0px; }
	 #newsletter-signup label input {
	   width : 216px; height : 18px; line-height : 18px; border : 0; margin : 0; padding : 5px;
	   background : #ccc url(../images/newsletter-input.png) 0 0 no-repeat; font-size : 14px; color : #888; }
	 form#newsletter-signup a {
	   position : absolute; top : 273px; left : 20px;
	   display : block; width : 97px; height : 13px;
	   font-size : 10px; }
	 form#newsletter-signup a span {
	   position : absolute; top : 0; left : 0;
	   display : block; width : 100%; height : 100%;
	   background : url(../images/newsletter-bg.jpg) -20px -233px no-repeat; }
	 form#newsletter-signup input.submit {
	   float : right; position : absolute; top : 219px; left : 181px; margin-top: 10px;
	   }
	   
     /* jquery enabled */
     form#newsletter-signup.jquery-available {
       background: url(../images/newsletter-bg-jq.jpg) 0 0 no-repeat !important;
       width : 260px; height : 240px; }
     form#newsletter-signup.jquery-available p {
       margin : 0 0 10px 0; }
     form#newsletter-signup.jquery-available p {
         margin : 0; }
     form#newsletter-signup.jquery-available label {
       margin-top : 10px; }
     form#newsletter-signup.jquery-available input.submit {
       float : none; position : absolute; top : 176px; left : 181px; margin-top: 10px;}
     form#newsletter-signup.jquery-available p {
       margin : 0px 0px 10px 0px; }
     form#newsletter-signup.jquery-available a span {
       background : url(../images/newsletter-bg.jpg) -20px -219px no-repeat; }
       
     form#newsletter-signup.jquery-available a.about-bacstel {
       position : absolute; top : 191px; left : 20px;
       display : block; width : 97px; height : 13px;
       font-size : 10px; }
     form#newsletter-signup.jquery-available a.about-bacstel span {
       position : absolute; top : 0; left : 0;
       display : block; width : 100%; height : 100%;
       background : url(../images/newsletter-bg.jpg) -20px -233px no-repeat; }
     form#newsletter-signup.jquery-available a.privacy {
       position : absolute; top : 191px; left : 133px;
       display : block; width : 32px; height : 13px;
       font-size : 10px; overflow : hidden; }
     form#newsletter-signup.jquery-available a.privacy span {
       position : absolute; top : 0; left : 0;
       display : block; width : 100%; height : 100%;
       background : url(../images/newsletter-bg.jpg) -133px -233px no-repeat; }
       
  /* demo/case-study widget */
  #wrapper {
    width : 260px; height : 206px;
    background : url(../images/home-module-demo-bg.png) 0 0 no-repeat; overflow : hidden; }
  .product #wrapper {
    background-image : url(../images/product-module-demo-bg.png);}
  #wrapper #controls {
    display : block; width : 260px; height : 43px; }
  #controls #c_demo {
    float : left;
    display : block; width : 130px; height : 34px;
    cursor : pointer; }
  #controls #c_case-study {
    float : left;
    display : block; width : 130px; height : 34px;
    cursor : pointer; }
  #module_case-study,
  #module_request-a-call {
    margin : 20px 20px 0 20px;}
    
/* product page */
  body.product #overview {
    position : relative;
    display : block; width : 620px; height : 198px; }
  body.product #overview span {
    position : absolute; top : 0; left : 0;
    display : block; width : 620px; height : 198px; }
    
  body.product.overview #overview span {
    height : 228px;
    background : url(../images/product-top-overview.jpg) 0 0 no-repeat; }
  body.enterprise #overview span {
    background : url(../images/product-top-enterprise.jpg) 0 0 no-repeat; }
  
  #details h2, #ewww h2 {
    padding : 3px 0px 6px 0px; border-bottom : 1px solid #d3d3d3;
    /* background : url(../images/arrows-heading-blue_small.png) 0 3px no-repeat; */ 
   	font-size : 16px; line-height : 19px; color : #005e81; }
  #details h2 em {
    display : block; font-weight : bold; letter-spacing : -1px; font-style : normal; }
  #details h2 {
    background-position: 0px 4px; } 
  #details ul {
    margin-left : 0; }
  #details li {
    padding-left : 22px; margin-left : 0;
    list-style-type : none;
    background : url(../images/bullet-blue.png) 0 4px no-repeat; }
    
  #product, #page {
    position : relative; float : left;
    width : 620px; margin-bottom : 40px; padding-bottom : 1px;
    background : url(../images/home_module-products.png) 0 100% no-repeat; font-size : 14px; }
  #details {
    float : left;
    width : 340px; margin-left : 30px; font-size : 13px; }
  #additional {
    float : left;
    width : 210px; margin-left : 20px; 
    font-size: 10px;
    }
  .news #additional,
  .blog #additional {
    border-top: 1px solid #D3D3D3;
	padding: 7px 0 0 0; 
	margin: 6px 0 0 20px;}
  
  .page div h1 {
    padding : 28px 20px 36px 30px; color : #05607D; border-bottom : 2px solid #05607D;
    background : url(../images/page_h1_graphic.png) 0 0 no-repeat; font-family : "Helvetica Neue", "Myriad Pro", Helvetica, Arial; font-weight : bold; letter-spacing : -.75px; }
    
  /* products page */
  body.product.overview #overview {
    padding-top : 240px; overflow : hidden; height : auto; margin-bottom : 0; }
  body.product.overview #overview h1 {
    margin : 0 30px 1em; border-bottom : 1px solid #005E81;
    text-transform : lowercase; color : #005E81; font-weight : bold; letter-spacing : -1px; }
  body.product.overview #overview p.emphasis {
    float : left; width : 265px; margin-left : 30px;
    font-size : 18px; }
  body.product.overview #overview p {
    float : right; width : 265px; margin-right : 30px;
    font-size : 12px; }
  body.product.overview #details {
    margin : 0; width : auto; }
  body.product.overview .modules_available {
    width : auto; height : auto; background-image : none; }
    
  body.product.overview .product {
    position : relative;
    height : 201px;
    background : url(../images/products-bg.jpg) 0 0 no-repeat; }
  body.product.overview #product_business {
    background-position : 0 -201px; }
  body.product.overview #product_enterprise {
    background-position : 0 -402px; }
  body.product.overview #product_total-bacs {
    background-position : 0 -603px; }
    
  body.product.overview .product .description {
    margin : 25px 140px 0 130px; }
  body.product.overview .learn-more {
    position : absolute; top : 150px; left : 499px;
    display : block; width : 87px; height : 22px;
    text-align : center; }
  body.product.overview .learn-more span {
    position : absolute; top : 0; left : 0;
    display : block; width : 100%; height : 100%;
    background : url(../images/button_learn-more.png) 0 0 no-repeat; }
  .modules_available h4 {
    position : absolute; top : 153px; left : 22px;
    font-size : 12px; }
  body.product.overview #details ul {
    position : absolute; top : 143px; left : 127px;
    margin-left : 0; }
  body.product.overview #details .modules_available li {
    position : relative;
    display : block; float : left; width : 26px; height : 23px; margin-right : 5px; padding : 0;
    background : red none; }
  body.product.overview #details .modules_available li a {
    position : absolute; top : 0; left : 0;
    display : block; width : 26px; height : 23px; text-indent : -999em; }
  body.product.overview .modules_available li div {
    display : none; position : absolute; }
    
  .product h3 {
    margin-left : 20px; font-weight : bold; letter-spacing : -.5px; color : #A3BB33; }
    
  #product_business h3 {
    color : #f78f1e; }
  body.product.overview #product_business .modules_available li a {
    background-color : #f78f1e }
  body.product.overview #product_business .learn-more span {
    background-position : 0 -22px; }
  #product_enterprise h3 {
    color : #076486; }
  body.product.overview #product_enterprise .modules_available li a {
    background-color : #076486; }
  body.product.overview #product_enterprise .learn-more span {
    background-position : 0 -44px; }
  #product_total-bacs h3 {
    color : #67CBE2; }
  body.product.overview #product_total-bacs .modules_available li a {
    background-color : #67CBE2; }
  body.product.overview #product_total-bacs .learn-more span {
    background-position : 0 -66px; }
    
  body.product.overview .modules_available li a {
    background : #A3BB33 url(../images/icon-mask.png) 0 0; }
  body.product.overview .modules_available li.account-validate a {
    background-position : -26px 0; }
  body.product.overview .modules_available li.direct-debit-manager a {
    background-position : -52px 0; }
  body.product.overview .modules_available li.direct-debit-web-collect-module a {
    background-position : -79px 0; }
  body.product.overview .modules_available li.faster-payments-module a {
    background-position : -105px 0; }
  body.product.overview .modules_available li.bureau-module a {
    background-position : -131px 0; }
  body.product.overview .modules_available li.sage-direct-module a {
    background-position : 0 -23px; }
  body.product.overview .modules_available li.remittance-module a {
    background-position : -26px -23px; }
  body.product.overview .modules_available li.hardware-security-module-hsm a {
    background-position : -52px -23px; }
  body.product.overview .modules_available li.bank-grade-module a {
    background-position : -79px -23px; }
  body.product.overview .modules_available li.integrate-module a {
    background-position : -105px -23px; }
  body.product.overview .modules_available li.location_12 a {
    background-position : -131px -23px; }
    
  /* modules widget */
  #modules_available {
    position : relative;
    width : 210px; height : 267px;
    background : url(../images/modules.png) 0 0 no-repeat; }
  #modules_available h2 {
    padding : 13px 0 0 18px;
    font-size : 17px; color : #fff; line-height : 18px; font-weight : normal; }
  #modules_available h2 em {
    font-weight : bold; letter-spacing : -1px; font-style : normal; }
  #modules_available ul {
    list-style-type : none; margin : 0; }
  #modules_available ul li {
    position : absolute;
    display : block; width : 61px; left : 48px;
    list-style-type : none; margin : 0; }
  #modules_available li.workflow-module {
    top : 58px; left : 11px; }
  #modules_available li.account-validate {
    top : 58px; left : 75px; }
  #modules_available li.direct-debit-manager {
    top : 58px; left : 138px; }
  #modules_available li.direct-debit-web-collect-module {
    top : 107px; left : 11px; }
  #modules_available li.faster-payments-module {
    top : 107px; left : 75px; }
  #modules_available li.bureau-module {
    top : 107px; left : 138px; }
  #modules_available li.sage-direct-module {
    top : 157px; left : 11px; }
  #modules_available li.remittance-module {
    top : 157px; left : 75px; }
  #modules_available li.hardware-security-module-hsm {
    top : 157px; left : 138px; }
  #modules_available li.bank-grade-module {
    top : 207px; left : 11px; }
  #modules_available li.integrate-module {
    top : 207px; left : 75px; }
  #modules_available li.location_12 {
    top : 207px; left : 138px; }
  #modules_available ul li a {
    position : relative;
    display : block; width : 59px; height : 46px; padding : 2px;
    font-size : 10px; z-index : 5; }
  #modules_available ul li span {
    position : absolute; top : 0; left : 0;
    width : 100%; height : 100%;
    background : url(../images/modules.png) 0 0 no-repeat; z-index : 5; }
  
  /* module IS avalable with this product */
  #modules_available li.workflow-module span {
    background-position : -221px -58px; }
  #modules_available li.account-validate span {
    background-position : -285px -58px; }
  #modules_available li.direct-debit-manager span {
    background-position : -348px -58px; }
  #modules_available li.direct-debit-web-collect-module span {
    background-position : -221px -107px; }
  #modules_available li.faster-payments-module span {
    background-position : -285px -107px; }
  #modules_available li.bureau-module span {
    background-position : -348px -107px; }
  #modules_available li.sage-direct-module span {
    background-position : -221px -157px; }
  #modules_available li.remittance-module span {
    background-position : -285px -157px; }
  #modules_available li.hardware-security-module-hsm span {
    background-position : -348px -157px; }
  #modules_available li.bank-grade-module span {
    background-position : -221px -207px; }
  #modules_available li.integrate-module span {
    background-position : -285px -207px; }
  #modules_available li.location_12 span {
    background-position : -348px -207px; }
    
  /* hover */
  #modules_available li.workflow-module a:hover span,
  #modules_available li.workflow-module a:focus span {
    background-position : -431px -58px; }
  #modules_available li.account-validate a:hover span,
  #modules_available li.account-validate a:focus span {
    background-position : -495px -58px; }
  #modules_available li.direct-debit-manager a:hover span,
  #modules_available li.direct-debit-manager a:focus span {
    background-position : -558px -58px; }
  #modules_available li.direct-debit-web-collect-module a:hover span,
  #modules_available li.direct-debit-web-collect-module a:focus span {
    background-position : -431px -107px; }
  #modules_available li.faster-payments-module a:hover span,
  #modules_available li.faster-payments-module a:focus span {
    background-position : -495px -107px; }
  #modules_available li.bureau-module a:hover span,
  #modules_available li.bureau-module a:focus span {
    background-position : -558px -107px; }
  #modules_available li.sage-direct-module a:hover span,
  #modules_available li.sage-direct-module a:focus span {
    background-position : -431px -157px; }
  #modules_available li.remittance-module a:hover span,
  #modules_available li.remittance-module a:focus span {
    background-position : -495px -157px; }
  #modules_available li.hardware-security-module-hsm a:hover span,
  #modules_available li.hardware-security-module-hsm a:focus span {
    background-position : -558px -157px; }
  #modules_available li.bank-grade-module a:hover span,
  #modules_available li.bank-grade-module a:focus span {
    background-position : -431px -207px; }
  #modules_available li.integrate-module a:hover span,
  #modules_available li.integrate-module a:focus span {
    background-position : -495px -207px; }
  #modules_available li.location_12 a:hover span,
  #modules_available li.location_12 a:focus span {
    background-position : -558px -207px; }
    
  /* the pop-up information bubbles */
  #modules_available li div,
  .modules_available li div {
    position : relative;
    display : none; width : 158px; height : 100px; padding : 20px;
    background : url(../images/tooltip.png) 0 0 no-repeat; z-index : 10; font-size : 12px; line-height : 16px; }
    
  /* case study */
  #case-study,
  #case-studies,
  #documents {
    padding-bottom : 1px;
    background : url(../images/module_case-study-bg.png) 0 100% no-repeat; }
  #case-study h2 {
    width : 215px; height : 25px; padding : 20px 0 0 45px; margin-bottom : 5px;
    background : url(../images/h2_case-study.png) 0 0 no-repeat; font-size : 21px; line-height : 21px; color : #a2ba32; }
  #case-study h3 {
    font-size : 13px; font-weight : bold; border-bottom : 1px solid #a2ba32; padding : 0 0 5px 0; margin : 0 18px 12px 18px; }
  #case-study h3 a { color: #a2ba32; text-decoration: none; border: none; }
  	#case-study h3 a:hover { color: #bad357; text-decoration: none; border: none; }
  #case-study p {
    margin : 0 18px 18px 18px;
    font-size : 10px; }
  
  #documents h2,
  #case-studies h2,
  #next-steps h2 {
    width : 224px; height : 35px; padding : 10px 18px 0 18px; margin-bottom : 0;
    background : url(../images/h2_documents.png) 0 0 no-repeat; font-size : 16px; color : #a2ba32; }
  #case-studies h2 {
    color: #05607D; }
  #documents ul,
  #case-studies ul,
  #next-steps ul {
    border-top : 1px solid #a2ba32; padding-top : 12px; margin : 0 18px 18px 18px;
    list-style-type : none; }
  
  #documents li a,
  #next-steps li a {
    display : block; 
    background : #a2ba32 url(../images/documents-a-top.png) 0 0 no-repeat; color : #fff; }
  #case-studies li a {
    display: block;
    background: #05607D url(../images/documents-a-top.png) 0 0 no-repeat; color : #fff; }

  #documents li a span,
  #case-studies li a span, 
  #next-steps li a span {
    display : block; padding : 3px 0 2px 26px;
    background : transparent url(../images/documents-a-bottom.png) 0 100% no-repeat; }
  #documents li a:hover,
  #documents li a:focus,
  #next-steps li a:hover,
  #next-steps li a:focus {
    background-color : #BAD357; text-decoration : none; color : #393E23; }

  #case-studies li a:hover,
  #case-studies li a:focus {
        background-color : #02B5FA; text-decoration : none; color : #fff; }
        
  body.case-studies #content_main div li {
    padding-left : 0; margin-left : 0; } 
   
  /* contactus module */
  div.contact {
    padding-bottom : 1px;
    background : url(../images/callus-bottom.png) 0 100%; color : #fff; }
  div.contact span {
    display : block; width : 100%; height : 9px; margin-bottom : 6px;
    background : url(../images/callus-top.png) 0 100%; }
  div.contact p {
    margin : 0 10px 1em 10px; }
  div.contact strong {
    position : relative; margin-left : -20px; padding-left : 50px;
    display : block;
    background : url(../images/callus-arrows.png) 0 50% no-repeat; color : #fff; font-size : 17px; }
    
/* modules pages */
  body.modules #overview {
    position : relative;
    display : block; width : 620px; height : 198px; }
  body.modules #overview span {
    position : absolute; top : 0; left : 0;
    display : block; width : 620px; height : 198px; }
  body.modules #overview span {
    background : url(../images/module-top.jpg) 0 0 no-repeat; }
  body.modules.workflow #overview span {
    background : url(../images/module-top-workflow.jpg) 0 0 no-repeat; }
    
  body.modules #additional {
    margin-top : -129px;  }
    
  body.modules #ewww {
    clear : both; margin : 0 20px 0 30px; }
  #ewww ul {
    margin : 0 0 0 -20px; list-style-type : none; }
  #ewww ul li {
    float : left;
    display : block; width : 175px; height : 150px; margin-left : 20px;
    font-size : 12px; }
  #ewww li h3 a {
    display : block; width : 135px; height : 40px; padding-left : 40px;
    border-bottom : 1px solid #005e81; color : #005e81; vertical-align : bottom; }
  #ewww li.workflow-module h3 a {
    background : url(../images/icon-workflow.png) 0 0 no-repeat; }
  #ewww li.account-validate h3 a {
    background : url(../images/icon-account-validate.png) 0 0 no-repeat; }
  #ewww li.direct-debit-manager h3 a {
    background : url(../images/icon-direct-debit-manager.png) 0 0 no-repeat; }
  #ewww li.direct-debit-web-collect-module h3 a {
    background : url(../images/icon-direct-debit-web-collect.png) 0 0 no-repeat; }
  #ewww li.faster-payments-module h3 a {
    background : url(../images/icon-faster-payments.png) 0 0 no-repeat; }
  #ewww li.bureau-module h3 a {
    background : url(../images/icon-bureau.png) 0 0 no-repeat; }
  #ewww li.sage-direct-module h3 a {
    background : url(../images/icon-sage-direct.png) 0 0 no-repeat; }
  #ewww li.remittance-module h3 a {
    background : url(../images/icon-remittance.png) 0 0 no-repeat; }
  #ewww li.hardware-security-module-hsm h3 a {
    background : url(../images/icon-hsm.png) 0 0 no-repeat; }
  #ewww li.bank-grade-module h3 a {
    background : url(../images/icon-bank-grade.png) 0 0 no-repeat; }
  #ewww li.integrate-module h3 a {
    background : url(../images/icon-integrate.png) 0 0 no-repeat; }
    
  .modules #details h3 {
    color : #005E80; font-size : 14px; font-weight : bold; margin-bottom : 0; }
    
/* Generic pages */

  body.page #content_main h2 {
    padding : 3px 0px 6px 0px; border-bottom : 1px solid #d3d3d3;
   	font-size : 17px; line-height : 19px; color : #005e81; }

  body.page #content_main h2 em {
    display : block; font-weight : bold; letter-spacing : -1px; font-style : normal; }
    
  body.page #content_main ul {
    margin-left : 0; }
    
  body.page #content_main li {
    padding-left : 22px; margin-left : 0;
    list-style-type : none;
    background : url(../images/bullet-blue.png) 0 4px no-repeat; }

/*  body.page #content_main div.archive h2 {
    	border-bottom : 0; padding-top: 2px; }

	body.page #content_main div.archive h2.second {
    	margin-top : 2em; }
  
  	body.page #content_main div.archive h2 a {
    	color : inherit; } */
    
/* Contact page */

  body.contact #content_main fieldset.details label {
    float: left;/*
    width: 275px; margin-right: 10px;*/ margin-bottom : 4px; }
    
  body.contact #content_main fieldset input {
    padding: 3px 4px; width: 265px;
    font-size: 14px; }
    
  body.contact #content_main fieldset input.submit {
    width : auto; }
    
  body.contact #content_main fieldset.address label span,
  body.contact #content_main fieldset.details label span {
    float: left; width: 180px; padding-right: 10px; margin: 0;
    line-height: 26px; text-align: right; }
    
  body.contact #content_main fieldset.address label input,
  body.contact #content_main fieldset.details label input {
    width: 360px; }
    
  body.contact #content_main fieldset.enquiry label span {
    display: none; }
    
  body.contact #content_main fieldset.enquiry label textarea {
    height: 200px; padding: 3px 4px; width: 550px;
    font: 14px/1.5 Helvetica, Arial, Verdana, sans-serif; }
    
  body.contact #content_main fieldset.address h3,
  body.contact #content_main fieldset.enquiry h3 {
    border-top: 2px solid #cdcdcd; padding-top: 22px; }
    
  body.contact #content_main fieldset.address label { margin-bottom: 4px; }
  
  body.page #page label.reg_username div { margin: 0; }

/* Logged-in */

  #member_nav {
    position: absolute; top: 0px; right: 280px;
    padding: 13px 6px 4px; border: 1px solid rgb(215, 215, 215); 
    border-top: 0; -moz-border-radius: 0 0 3px 3px; 
    -webkit-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px;
    background-color: rgb(247, 247, 247); color: #000000; }
    
  #member_nav p { margin: 0; }
  #member_nav a { color: rgb(184, 0, 0); }
    
/* Why-bacsactive-ip */
  
  body.why-bacsactive-ip div#details { width: auto; margin-right: 20px; }
  
  body.why-bacsactive-ip div#details h3 { 
  margin-left: 0; margin-bottom: 3px; 
  font-size: 14px; font-weight: normal; }
    
/* Total-bacs */

  body.total-bacs div#details { width: auto; margin-right : 20px; }
    
/* Social */
 
  div#social {
    position: absolute; top: 200px; right: 15px; }
 
  div#social a.youtube { margin : 0 12px; }
    
div#login-form {
	background: url(../images/login_form_background.png) no-repeat top left;
	height: 122px; }

	div#login-form form { position: relative; top: -40px; }

div#registration-form { padding: 16px 0 0 0; border-top: 1px solid #D3D3D3; }

div#registration-form .left {
   float: left; margin: 0px; width : 280px; }

div#registration-form .right {
   float: right; margin: 0px 0px 0px 0px; width : 280px; }

	div#login-form legend, div#registration-form legend {
	    font: normal 20px helvetica, arial, sans-serif;
		color: #9fb336; }

div#login-form form fieldset, div#registration-form form fieldset {
   background: transparant !important; }

div#login-form label, div#registration-form label {
    color: #3e3d40; margin: 0px; 
    padding: 0px; }

div#login-form label span, div#registration-form label span {
    color: #3e3d40; display: block;
    width: 100px; height: auto;
    float: left; padding: 13px 0px 0px 0px;
    font-size: 12px; }

div#login-form label span.checkboxlabel, div#registration-form label span.checkboxlabel {
    float: left; width: 280px;
    height: auto; margin: 1px 0px 0px 16px;
    color: #666666; font-size: 12px; }

div#login-form #username.input, div#login-form #password.input, div#registration-form #first_name, div#registration-form #last_name, div#registration-form #company_name, div#registration-form #direct_tel, div#registration-form #member_email, div#registration-form #reg_username, div#registration-form #reg_password, div#registration-form #how_found, div#registration-form #reg_password_confirm {
    border: 1px solid #D1D1D1; background: #FFFFFF;
    color: #999999; padding: 3px 0px 3px 6px;
    margin: 10px 0px 0px 0px; font-size: 11px;
    float: left; height: auto;
    width: 155px !important; }
        
span#un_message { 
	color: #FF0000; margin: 8px 0 0 102px; 
	width: 187px; display: block; 
	line-height: 14px; font-size: 12px; }
	
div#registration-form textarea { font-family: helvetica, arial, sans-serif !important; font-size: 12px !important; }

div#login-form form .checkbox, div#registration-form form .checkbox,
div#registration-form #bacstell, div#registration-form #eippinsights {
    display: block; width: auto;
    height: auto; float: left;
    margin: 15px 0px 0px 0px; }

/*div#registration-form #how_found,*/ div#login-form textarea, div#registration-form textarea {
    font-family: helvetica, arial, sans-serif !import;
    height: 80px; }

div#login-form p a {
    color: #00446b; position: relative;
    top: -5px; left: 31px;
    text-decoration: none; }

div#login-form p.ctaregister {
    font: normal 16px helvetica, arial, sans-serif;
    color: #7d7c7e; width: 240px;
    position: relative; top: -142px;
    left: 280px; }

div#login-form p input, div#registration-form .submit {
    display: block; float: left;
    clear: both; width: auto;
    height: auto; margin: 16px 0 0 0; }

div#registration-form .submit {
    margin: -15px 0px 0px 0px; }
    
div#login-form p a:hover { text-decoration: underline; }            

.checkboxes p { padding: 5px 0px 0px 0px; }
.checkboxes label { position: relative; top: -20px; }
    
/* Social */

div#social { position: absolute; top: 200px; right: 15px; }

div#social a.youtube { margin : 0 12px; }
  
/* Case study page */

.case-studies #content_main div h2, .testimonials #content_main div h2,
.case-studies #content_main div p, .testimonials #content_main div p,
.case-studies #content_main div p.case-study, .testimonials #content_main div p.case-study {
    margin: 0px; padding: 0px; }

.case-studies #content_main div h2, .testimonials #content_main div h2 {
    border-bottom: 0px;
    background: none; }

.case-studies #content_main div p, .testimonials #content_main div p {
    padding: 10px 10px 10px 40px;
    background: url(../images/document.png) no-repeat 0px 13px; }

.testimonials #content_main div p {
    padding: 10px 10px 10px 40px;
    background: url(../images/quote.png) no-repeat 0px 13px;
    color: #666666;
    font-style: italic; }

.case-studies #content_main div p.case-study, .testimonials #content_main div p.quotesource {
    padding: 0px 0px 20px 40px;
    background: none; }

.testimonials #content_main div p.quotesource {
	font-weight: bold;
	font-style: normal;
	color: #555555; }

/* Adverts */

#content_sub div.advert a {
	position : relative;
    display : block; width : 260px; height : 115px;
    overflow : hidden; }
    
#content_sub div.advert a span {
	position : absolute; top : 0; left : 0;
    display : block; width : 260px; height : 115px; }
    
/* Resources */

.resources #content_main div ul
.accountis-datasheets-brochures #content_main div ul {
	margin: 0 !important; padding: 0 !important; }

.resources #content_main div ul li,
.accountis-datasheets-brochures #content_main div ul li { 
	background: url(../images/bullet-blue-small.jpg) no-repeat 10px 4px; 
	padding: 0 0 0 26px; margin: 0 0 0 16px; }

.resources #content_main div ul li p,
.accountis-datasheets-brochures #content_main div ul li p { 
	padding: 0px 0px 0px 10px; }
	
.resources #content_main div ul li h3,
.accountis-datasheets-brochures #content_main div ul li h3 { 
	margin: 0; padding: 0px 0px 2px 6px; 
	font-size: 13px; }

.accountis-datasheets-brochures #content_main div .zip { 
	background: url(../images/compress.png) no-repeat 0px 0px; 
	padding: 0px 0px 0px 25px; margin: 0; font-size: 13px;
	position: relative; top: 0px; left: 20px; }

/* Calls to action */

#content_sub div#sidebar-calls-to-action {
	float : none; width : 270px; 
	margin-right : 0; margin-left: -3px; }
	  
#content_sub div#sidebar-calls-to-action ul {
	list-style-type : none; margin : 0 0 20px 0;
	overflow : hidden; }
	  
#content_sub div#sidebar-calls-to-action li { display : inline; }
	  
#content_sub div#sidebar-calls-to-action a {
	float : left; position : relative;
	display : block; width : 117px; height : 39px;
	text-align : center; background : #000; text-indent : -999em; }
	  
#content_sub div#sidebar-calls-to-action .item_1 a { margin-right : 12px; }
	  
/* This next block UTTERLY screws IE6/7 page layout

#content_sub div#sidebar-calls-to-action ul li a span { 
	position: absolute; top: 0; 
	left: 0; display: block; 
	width: 112px; height: 39px; } */

/* END of screw-up block */
	 
#content_sub div#sidebar-calls-to-action .item_1 a { background : url(../images/callus_demo.png) 0 0 no-repeat; }
#content_sub div#sidebar-calls-to-action .item_2 a { margin: 0 0 0 18px; }
#content_sub div#sidebar-calls-to-action .item_2 a { background : url(../images/callus_demo.png) -128px 0 no-repeat; }
		
#content_sub div#sidebar-calls-to-action .item_1 a:hover { background-position : 0 -40px; }
#content_sub div#sidebar-calls-to-action .item_2 a:hover { background-position : -128px -40px; }
	  
/* Tidy the demo page a bit */

#page div#flash-demo { margin : 0 0 24px 0; padding : 0; height : 440px !important; }
    
/* Bacsactive-ip page */

body.why-bacsactive-ip div#why-bacsactive-video.video { float : left; margin-right : 24px; }
body.why-bacsactive-ip #content_main h2 { clear : both; }
  
/* Tidy up the forms */

   .validation_icon { position: absolute; right: 20px; top: 11px; }

/* Styling the news */

#content_main div.archive { width: 350px; float: left; margin: 0 0 0 -9px !important; padding: 0 !important; }
.events #content_main div.archive { width: 570px !important; margin: 0 20px !important; }

#content_main div.archive h2,
#content_main div.archive p {
	padding: 0 0 0 34px; }

#content_main div.archive h2 { 
	border-top: 1px solid #D3D3D3; 
	border-bottom: 0;
	padding-top: 10px; 
	margin: 0;
	font-size: 16px; 
	background: url(../images/document.png) no-repeat 4px 9px; }

#content_main div.archive p a { display: block; margin: 10px 0 0 0; text-transform: capitalize; }

#content_main div.archive p.meta { 
	margin: 0; 
	padding-bottom: 6px; 
	color: #999999; }  

#content_main div.archive p.pagination {
	position: relative;
	left: -34px; }

#content_main div.archive p.pagination a, 
#content_main div.archive p.pagination strong { 
	display: inline;
	width: auto; 
	height: auto; 
	padding: 1px 4px;
	letter-spacing: 0.5px; }

#content_main div.archive p.pagination strong {
	border: 1px solid #CCCCCC; background: #D9D9D9; }
	
/* Sidebar */ 

.blog #content_main #additional,
.news #content_main #additional { 
	border-top: 1px solid #D3D3D3;
	padding: 7px 0 0 0; 
	margin: 0 0 0 22px; 
	float: left;
	width: 208px; }
		
/* Sidebar widgets */

.blog #content_main #additional h2,
.news #content_main #additional h2 { 
	font-size: 14px; border-bottom: 0 !important; 
	margin: 0 0 6px 0; padding: 0;
	font-size: 15px !important; }

.blog #content_main #additional h3,
.news #content_main #additional h3 { 
	border-bottom: 1px solid #D3D3D3; margin: 0 0 4px 0; 
	padding: 0 0 4px 0; font-size: 13px; }

.blog #content_main div#additional ul li,	 
.news #content_main div#additional ul li { 
	background : url(../images/bullet-blue-small.jpg) 0 2px no-repeat !important; 
	padding: 0 0 0 16px !important; }

/* Archive widget (on the blog pages) */

.blog #content_main div#additional #blog-archive,
.blog #content_main div#additional #blog-archive li,
.news #content_main div#additional #blog-archive,
.news #content_main div#additional #blog-archive li { 
	margin: 0 !important; padding: 0 !important; }
	
.blog #content_main div#additional #blog-archive li,
.news #content_main div#additional #blog-archive li { 
	font-size: 14px; background: none !important; }
	
.blog #content_main div#additional #blog-archive li a,
.news #content_main div#additional #blog-archive li a { 
	display: block; border-bottom: 1px solid #D3D3D3;
	margin: 0 0 4px 0; }

.blog #content_main div#additional #blog-archive li ul li,
.news #content_main div#additional #blog-archive li ul li {
	font-size: 10px; background: none !important; 
	display: inline; }
	
.blog #content_main div#additional #blog-archive li ul li a,
.news #content_main div#additional #blog-archive li ul li a {
	border: 0 !important; padding: 0 4px 0 0; }
	 
/* Full entry */

#content_main div.entry { margin: 0 20px 0 20px !important; padding: 0; }
#content_main div.entry p.meta { color: #999999; }

/* Blog styles */

.blog #content_main .entry p { margin: 0; padding: 0; }
.blog #content_main .entry p { padding: 0 0 6px 0; }

/* Comments */
		
.comments h4 { margin: 10px 0 0 0; padding: 6px 0 0 0; border-top: 1px solid #D3D3D3; }
.comments p { padding-top: 6px; color: #333333; }
	
/* Comment form */
	
.comments form#comment_form { position: relative; top: 4px; }
	
.comments form#comment_form label { display: block; float: left; clear: both; margin: 0 0 8px 0; padding: 0;}
.comments form#comment_form label span { float: left; width: 70px; padding: 2px; color: #333333; }
.comments form#comment_form label input { float: right; width: 230px; padding: 2px; margin: 0 0 0 2px; color: #666666; }
.comments form#comment_form label textarea { width: 306px; padding: 2px; }
	
.comments form#comment_form div { float: left; clear: both; margin: 8px 0 !important; }
.comments form#comment_form div input { margin: 0 6px 0 0; }
	
.comments form#comment_form .boolean { float: left !important; }
.comments form#comment_form .boolean input { display: block; width: auto; float: left; margin: 0 10px 0 0; }

/* Some overwrites for the events page */ 

.events #content_main div.archive h2 { padding: 10px 0 6px 34px; }
.events #content_main div.archive p { padding: 4px 0 0 34px; margin: 0; }
.events #content_main div.archive p a { margin: 4px 0 16px 0; }

/* Intro text */

p.intro { font-size: 18px !important; padding: 0 0 12px 0; margin: 0; }
p.intro img.left { float: left; margin: 4px 18px 2px 0; }
p.intro img.right { float: left; margin: 4px 0 2px 18px; }

form#register_member_form input.submit { clear: both; float:none;}

     #content_main #additional h2.rss { margin-bottom : 12px; }
    #content_main h2.rss a,
    #content_main h2.rss a:link,
    #content_main h2.rss a:visited,
    #content_main h2.rss a:hover,
    #content_main h2.rss a:active {    
      padding: 0 0 0 18px; margin-bottom : 12px;
      text-decoration: none; background: transparent url(../images/feed-icon-14x14.png) no-repeat 0 50%; }
      
#module_case-study p { line-height:16px; }
#module_case-study img.float-left { margin:0 10px 6px 0; }