* { margin: 0; padding: 0; }

/* font */
html 
{ 
   font-size: 100.01%; 
}

body 
{ 
   font-size: 62.5%;
}

input, select, textarea { font-size: 100%; }

/* layout - general */
img { border: none; }
acronym { cursor: help; }
a:link, a:visited { cursor: pointer; }

input.text, textarea { 
   padding: 1px 0px; 
}
.submit { 
   cursor: pointer; 
}

ul, ol 
{ 
   margin: 0 0 1em 2.5em; 
   padding: 0; 
   list-style: disc; 
   line-height:1.7em;  /* jcl modified */
      letter-spacing:normal;  
}

ul li, ol li { margin: .2em 0; padding: 0; }
select > option { margin: 0 5px 0 3px; }

.ul 
{ 
   margin: 0; 
   padding: 0; 
   list-style-type: none; 
   line-height:1.8em;
}

.ul li { margin: 0; padding: 0; list-style: none; list-style-image: none; list-style-type: none; }

#page .flR { float: right; }
#page .flL { float: left; }
#page .alR { text-align: right; }
#page .alC { text-align: center; }

.hide { display: none; }

.ir { position: relative; overflow: hidden; }
.ir span { position: absolute; width: 100%; height: 100%; text-indent: -1000em; }

a:link, a:visited {
   color: #1c3766;
   text-decoration: none;
}
a:visited {
   color: #1c3766;
}

a:link:hover, a:visited:hover {
   color: #641124;
   text-decoration: underline;
}
/*
a.inv:link, a.inv:visited 
{
   text-decoration: underline;
}
a.inv:link:hover, a.inv:visited:hover {
   text-decoration: none;
}
*/

.cols {
   overflow: hidden;
   margin: 0;

}

.cols .col {
   float: left;
   width: 48%;
   margin: 0 3.5% 0 0;
}

body #page .last {
   margin-right: 0;
}


/* Clear Floats Without Structural Markup */
#ie7 .clearFix {
   min-height: 1%;
}

.clearFix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

/* layout - specific */
body 
{
   font-family: Verdana, sans-serif;
   text-align: center;
   background: #FFFFFF url(../img/page-t.png) repeat-x 0 0;
}

.page {
   width: 793px;
   margin: 0 auto;
   text-align: left;
   font-size: 1.2em;
   line-height:1.5em; /* jcl modified */
   position: relative;
   color: #585454;   
}

#page 
{
/*
   background: url(http://localhost:8080/PayScan2.0/img/line-h2.png) no-repeat 0 210px;
   */
}

/* footer bottom */
html {
   height: 100%;
}
body {
   height: 100%;
}
#page {
   position: relative;
   min-height: 100%;
}
#colWrap {
   padding-bottom: 120px;
}
#bot {
   position: relative;
   margin-top: -95px;
}
/* end footer bottom */


#top {
   position: relative;
   width: 100%;
   overflow: hidden;
   height: 98px;
   background: url(../img/header.jpg) no-repeat 0 0;

}
   #top a:link, #top a:visited {
   }

#logo
{
      float: left;
      width: 240px;
      height: 90px;

   }
#logo a:link, #logo a:visited 
{
         display: block;
         width: 240px;
         height: 90px;
}

#logo a:link span, #logo a:visited span 
{
   background: url(../img/header.jpg) no-repeat 0 0;
}
   
   #motto {
      position: absolute;
      left: 300px;
      top: 50px;
      width: 460px;
      font-family: Verdana, sans-serif;
      color: #FFFFFF;
      line-height: 1.5;
   }



ul#menuBar {
   width: 100%;
   z-index: 10;
   top: -60px;
   height: 44px; /* used 14px to get correct spacing; used 44px for correct image */
   margin: 0 0 0 0; /* 0 0 26px 0 */
   background: #FFFFFF url(../img/menu-m2.jpg) repeat-x 0 0;
   float: left;
   list-style-type: none;
   display: inline;
   position: relative;
}
   ul#menuBar li {
      float: left;
   }
   ul#menuBar li.sp {
      background: url(../img/but-special.gif) repeat-x 0 0;
   }
   
   ul#menuBar li a:link, ul#menuBar li a:visited { 
      float: left;
      /* display: inline; */
      
      font-size: 117%;
      color: #494343;
      line-height: 44px;
      padding: 0 15px;
      text-decoration: none;
   }
   ul#menuBar li.sp a:link, ul#menuBar li.sp a:visited { 
      padding: 0 14px;
      color: maroon;
   }
   ul#menuBar li a:link:hover, ul#menuBar li a:visited:hover {
      background: #dee9e9 url(../img/but-o.gif) repeat-x 0 0;
   }

   ul#menuBar li a.here, ul#menuBar li a.here:link:hover, ul#menuBar li a.here:visited:hover { 
         color: #0c2754; 
         text-decoration: underline;
         background: #FFFFFF url(../img/menu-m2.jpg) 0 0;
   }

   ul#menuBar li a.parent {
      text-decoration: underline;
      color: #0c2754; 
      background: url(../img/but-submenu2.gif) repeat-x 0 0;
   }

   ul#menuBar li ul#menuBar2 {
      /* float: left; */
      display: inline;
      position: absolute; 
/*    right: 15%; */
      text-align: left;       
      margin: 46px 0 5px 0;
      border-bottom: 1px solid #888888;
      border-left: 1px solid #0c2754;
      border-right: 1px solid #0c2754;
   }
   
   .right10 {   right: 10%;   }  
   .right20 {   right: 20%;   }
   .right30 {   right: 30%;   }
   .right35 {   right: 35%;   }
   .right40 {   right: 40%;   }
   .right50 {   right: 50%;   }
   
   .pad1em { padding: 0 1em; }
   .pad2em { padding: 0 2em; }
   .pad3em { padding: 0 3em; }
   .pad4em { padding: 0 4em; }
   .pad5em { padding: 0 5em; }
   
   .tight { padding: 0; }
   
   .compact, .compact p { 
      font-size:95%;
      line-height:90%;
      }
      
   * html #menuBar #menuBar2 {
      margin: 2px 0 5px 0; /* IE hack */
      }

   ul#menuBar li ul#menuBar2 li {
      padding: 3px 0 0 0;
      }

   ul#menuBar li ul#menuBar2 li a {
      border: 0;
      background: url(../img/but-submenu2.gif) repeat-x 0 0;
      }

   ul#menuBar li ul#menuBar2 li a:hover {
      background: #d4de7c;
      background: #dee9e9 url(../img/but-o.gif) repeat-x 0 0;
      }

   ul#menuBar li ul#menuBar2 li.here {
      padding: 3px 6px 3px 8px;
      font-weight: bold;
      }

.hr1 {
   margin: 7px 0; /* 7px 0 trh */
   height: 3px;
   overflow: hidden;
   background: url(../img/line-h1.png) no-repeat 50% 0;
}

#colWrap {
   overflow: hidden;
   width: 100%;
   top: -64px; /* -44px; shift up to remove gap after menubar */
   position:relative;
}
/* .hp #colWrap { margin: 15px 0 0; } */

#content {
   float: left;
   width: 515px;
   padding: 0 10px;
   letter-spacing: -.05em;

}

/* jcl added */
#faqcontent
{  
   float: left;
   width: 715px;
   padding: 0 10px;
   letter-spacing: -.05em;
   
}
   

.hp #content {
   padding: 0;
   width: 535px;
}
   #content h1, #faqcontent h1 {
      color: #a0b842;
      font-size: 207%;
      font-weight: normal;
      margin: .5em 0 .5em;
      letter-spacing: -1px;
   }
   #content h2, #faqcontent h2 {
      font-size: 145%;
      margin: 1em 0 .25em 0;
      letter-spacing: -1px;
   }
   #colWrap h3 {
      font-size: 127%;
      margin: 1em 0 .25em 0;
      letter-spacing: -1px;
   }
   #colWrap h4 {
      font-size: 127%;
      margin: 1em 0 .25em 0;
      letter-spacing: -1px;
   }
   #content p, #faqcontent p{
      line-height: 1.7em;  /* jcl modified */
      margin: 0 0 .75em 0; 
      letter-spacing:normal;  
   }
      #content p a:link, #content p a:visited, 
         #content li a:link, #content li a:visited, 
         .faqanswer a:link, .faqanswer a:visited,
         .shadelink:link, .shadelink:visited { 
            /* p, li, .shadelink added */
            padding: .15em .25em;
            background: url(../img/link-m.gif) repeat-x 0 100%;
            }

      #content p a:link:hover, #content p a:visited:hover, 
         #content li a:link:hover, #content li a:visited:hover, 
         .faqanswer a:link:hover, .fawanswer a:visited:hover,
         .shadelink:link:hover, .shadelink:visited:hover {
            text-decoration: underline;
            }

#colSide {
   float: right;
   width: 242px;
   font-size: 92%;
   letter-spacing: -.05em;
}
   #colSide h2 {
      font-family: 'LucidaGrande', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', 'Trebuchet MS', Tahoma, Arial, Sans-Serif;
      font-size: 150%;
      font-weight: normal;
      color: #0a2552;
      text-transform: uppercase;
   }



.box4 {
   background: url(../img/box-4.jpg) no-repeat 0 0;
}
   .box4 h2 {
      line-height: 32px;
      margin: 0 0 .75em 20px;
   }

#news {
   margin: 0 0 2.5em;
}
   #news li {
      margin: 0 1em 1.5em;
      line-height: 1.4em;
   }

      #news li a:link, #news li a:visited {
         color: #244a89;
         padding: 0;
      }
         #news li a:link b, #news li a:visited b {
            display: block;
         }
            #news li a:link b span, #news li a:visited b span {
               padding: 0 1em 0 0;
            }
         #news li a:link .txt, #news li a:visited .txt {
            display: block;
            margin: 0 0 0 10px;
         }
      #news li a:link:hover, #news li a:visited:hover {
         color: #641124;
         text-decoration: none;
      }



.items {
}
   .items li {
      background-position: 0 0;
      background-repeat: no-repeat;
      margin: 0 0 1.5em;
   }
      .items li p {
         margin: 0 0 0 15px;
         font-weight: bold;
      }

.box5 { padding:4em 0 0 1em; }

   .box5 h2 {
      background: url(../img/box-5-t.png) no-repeat 50% 0;
      line-height: 35px;
      text-align: center;
      margin: -6px 0 1em;  /* 0 1em trh */
   }
   

#facts {
}
   #facts ul {
      margin: 0 1.5em;
   }
#facts li 
{
         background-image: url(../img/bullet-1.png);

}

#bot {
   background: url(../img/page-b.png) repeat-x 0 0;

   height: 95px;
}
   #bot .page {
      height: 95px;
      background: url(../img/logo-bot.jpg) no-repeat 5% 50%;
      position: relative;
      color: #124058;
   }
   #bot a:link, #bot a:visited {
      color: #124058;
   }

   #links1 {
      margin: 0 0 0 225px;
      line-height: 95px;
      /* text-transform: uppercase; */
      font-size: 7pt;
   }
      #links1 a:link, #links1 a:visited {
         padding: 0 .5em;
      }


/* homepage */

#sw {
      text-align:center;
      top:-44px;
      position:relative;
}

#boxes {
   margin: 0 0 15px;
}
   #boxes .col {
      width: 175px;
      height: 215px;
      margin-right: 4px;
      color: #FFFFFF;
      font-weight: bold;
      font-size: 92%;
      position: relative;
   }
      #boxes .col p {
         line-height: 1.4;
         position: absolute;
         top: 92px;
         left: 10px;
         width: 155px;
      }
      #boxes .col a:link, #boxes .col a:visited {
         position: absolute;
         left: 75px;
         top: 180px;
         font-size: 91%;
         color: #FFFFFF;
         padding: 0;
         background: none;
      }

   /* billers box on home page */
   .box1
   {     
   
      
   
   }

   #billershomepg
   {     position: relative;
         top: -180px;
         left: -75px;
         background: url(../img/HomeBillersActive.jpg) no-repeat 0 0;
         width: 175px;
         height: 215px;
         text-indent:-9999px;
   }

   #customershomepg
   {
         position: relative;
         top: -180px;
         left: -75px;
         background: url(../img/HomeConsumersActive.jpg) no-repeat 0 0;
         width: 175px;
         height: 215px;
         text-indent:-9999px;
   }
   #retailershomepg
   {
         position: relative;
         top: -180px;
         left: -75px;
         background: url(../img/HomeRetailersActive.jpg) no-repeat 0 0;
         width: 175px;
         height: 215px;
         text-indent:-9999px;
   }


/* not supported on IE6 */
#billershomepg:hover
{
/* background: url(../img/HomeBillersHover.jpg) no-repeat 0 0;*/
   text-indent:-9999px;
 cursor: pointer; 
background: url(../img/HomeBillersHover.jpg) no-repeat 0 0;
}
#customershomepg:hover
{
/* background: url(../img/HomeBillersHover.jpg) no-repeat 0 0;*/
   text-indent:-9999px;
 cursor: pointer; 
background: url(../img/HomeConsumersHover.jpg) no-repeat 0 0;
}
#retailershomepg:hover
{
/* background: url(../img/HomeBillersHover.jpg) no-repeat 0 0;*/
   text-indent:-9999px;
 cursor: pointer; 
background: url(../img/HomeRetailersHover.jpg) no-repeat 0 0;
}

   #boxes .box2 { background: url(../img/box-2.jpg) no-repeat 0 0; }
   #boxes .box3 { background: url(../img/box-3.jpg) no-repeat 0 0; }


/* interior */

.box4b {
   background: url(../img/box-4b.jpg) no-repeat 0 0;
   width: 520px;
   padding: 0 0 0 1em; /* right ignored? */
   font-size:86%;
   }
   
   .box4b p { padding:.5em 2em 0 0; }

   .box4b h2, .box4b h3, .box4b h4 {
      text-align:center;
      padding:3pt;
      }
   .box4b h2 ul {
      padding:1em;
      }

.box4a {
   background: url(../img/box-4a.jpg) no-repeat 0 0;
   width: 465px;
}
   .box4a h2 {
      font-family: 'LucidaGrande', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', 'Trebuchet MS', Tahoma, Arial, Sans-Serif;
      font-size: 150%;
      font-weight: normal;
      color: #0a2552;
      text-transform: uppercase;
      line-height: 50px;
      margin: 0 0 .5em 40px;
   }
   .box4a .items {
      margin: 0 30px;
      font-size: 92%;
   }

.boxA {
   clear: both;
   padding: 0 0 0 305px;
   min-height: 375px;
   margin: 0 10px 30px;
}
/* all had .boxA; some now appear stand-alone */
   .buts {
      margin: 0 0 0 30px;
      width: 430px;
      overflow: hidden;
   }

   #news .buts {
      margin: 0 0 0 20px;
   }
   
      .buts a:link, .buts a:visited {
         float: left;
         width: 196px;
         height: 59px;
         margin: 0 15px 0 0;
         
      }
         .buts a:link:hover span, .buts a:visited:hover span {
            background-position: 0 -59px;
            
         }

         .buts a.retailers:link span, .buts a.retailers:visited span 
         {
            background-image: url(../img/but-retailers2.png);
         }
         .buts a.consumers:link span, .buts a.consumers:visited span {
            background-image: url(../img/but-consumers2.png);
         }
         .buts a.billers:link span, .buts a.billers:visited span {
            background-image: url(../img/but-billers2.png);
         }
         .buts a.municipal:link span, .buts a.municipal:visited span {
            background-image: url(../img/but-municipal2.png);
         }
         .buts a.partnership:link span, .buts a.partnership:visited span {
            background-image: url(../img/but-partners2.png);
         }
         .buts a.selfcheckout:link span, .buts a.selfcheckout:visited span {
            background-image: url(../img/but-self-checkout2.png);
         }

#box1a
{
   background: url(../img/box-1a.jpg) no-repeat 0 0;
   
}

#box1a .items li 
{
   background: url(../img/bullet-2.png) no-repeat 0 3px;

   
}
#box2a {
   background: url(../img/box-2a.jpg) no-repeat 0 0;
}

#box2a .items li 
{
      background: url(../img/bullet-3.png) no-repeat 0 3px;
}
#box3a {
   background: url(../img/box-3a.jpg) no-repeat 0 0;
}

/* jcl adjusting the last value moves the arrow up/down */
#box3a .items li 
{
      background: url(../img/bullet-4.png) no-repeat 0 3px;
   }

.footnote
{
   font-size:10px;
   font-weight: normal;
   font-style: italic;
   padding-left:40px;
   
}

.footnote2
{
   font-size:10px;
   font-weight: normal;
   font-style: italic;  
   
}
/* used for list footnotes */
.footnotes
{
   font-size:10px;
   padding-top:20px;
   list-style: none;

}

/* jcl added - css styles for contact form */
form fieldset {
  border:0px;
  padding: 10px;        /* padding in fieldset support spotty in IE */
  margin: 0;
}



form {  /* set width in form, not fieldset (still takes up more room w/ fieldset width */
  font:100% verdana,arial,sans-serif;
  margin: 0;
  padding: 0;
  min-width: 400px;
  max-width: 500px;
  width: 460px; 
}

#loginForm {
   width: 200px; 
   height: 60px;
   margin: 0;
   padding: 0;
}

#loginForm form { 
   position: absolute;
   margin: 0;
   padding: 0;
   left: 640px;
   top: 40px;
   min-width: 156px;
   max-width: 156px;
   width: 156px; 
   height: 54px;
   font-family: Verdana, sans-serif;
   font-size: 7pt;
   color: #0c2754;
   background: #deece9;
}

form label { 
   display: block;  /* block float the labels to left column, set a width */
   float: left; 
   width: 150px; 
   padding: 0; 
   margin: 5px 0 0; /* set top margin same as form input - textarea etc. elements */
   text-align: left; 
}

#loginForm form label { 
   display: inline;  
   padding: 0; 
   width: 60px; 
   margin: 0px 0 0; /* set top margin same as form input - textarea etc. elements */
   text-align: right; 
}


form input {
   margin: 5px;
   border: 1px #666666 solid;
}

#loginForm form input {
   margin: 0 0 0 1px;
   width: 90px;
   border: 1px #666666 solid;
}

#loginForm form .submit {
   margin: 1px;
   width: 90px;
   height: 17px;
   position: relative;
   font-size: 7pt;
   left: 61px;
   border: 1px #666666 outset;
}

#logobug {
   margin-top:10px;
}

#logobug a:link:hover, #logobug a:visited:hover {
   text-decoration: none;
}

#logobug #hsl, #logobug #hsl:link:hover, #logobug #hsl:visited:hover {
   display: inline;
   font-size: 10pt;
   font-family: 'LucidaGrande', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', 'Trebuchet MS', Tahoma, Arial, Sans-Serif;
   font-weight: bold;
   color:#a0a0a0;
   vertical-align: 10px;
   text-decoration: none;
}

#logobug #imghsl {
   background: url(../img/hsl32.png);
   width: 32px;
   height: 32px;
}

#content, #side-col  {
   font-size: 110%;
   }

.faqanswer {
   padding:0 0 2em 4em;
   line-height: 140%;
   }  
   
   .faqanswer li {
      padding:.5em 0;
      }
   .faqanswer .tight li {
      padding: 0;
      }

.faqquestion {
   text-indent:-1.6em;
   padding: 0 0 0 1.6em; 
   line-height: 140%;
   }
   
#faqindex {
   }

#faqindex li {
   line-height: 120%;
   margin: 2em 0; 
   }

   #faqindex li ul {
      line-height: 110%;
      margin: .75em 0 0 0; 
      }
   
   #faqindex li ul li {
      list-style: none;
      line-height: 130%;
      text-indent:-1.75em;
      margin: 0 0 .75em 4em; 
      }
   
   #faqindex li ul li a {
      background-image:none;
      }
      
   #faqindex li ul li a:link, #faqindex li ul li a:visited, #faqindex li ul li a:active {
      background-image: none;    
      }
         #faqindex li ul li a:link:hover, #faqindex li ul li a:visited:hover {
               color: #641124;
               background-image:none;
               text-decoration: underline;
            }

      #faqindex #faqlink li, #faqlink li {
            padding: 0;
            margin: 0 0 .1em 4em;
            list-style: none;
            }
            
      #faqindex #faqlink a:link, #faqindex #faqlink a:visited, #faqindex #faqlink a:active {
            padding: .15em .25em;
            background: url(../img/link-m.gif) repeat-x 0 100%;
            }

      #faqindex #faqlink a:link:hover, #faqindex #faqlink a:visited:hover {
            text-decoration: underline;
            }
      

.margin12pt {
   margin: 12pt;
}

/*end*/