/* 	global.css */
/* 	http://theatomgroup.com */
/* 	Description: defines styles for the layout and
	individually targeted components of
	the site.
*/



/*	Group: Main
	Description: for all blocks that 
	represent main site container.
------------------------------------------*/
#container-main {
	background-color:#ffffff;
	width: 960px;
	height: 100%;
	padding: 0;
	margin: 0 auto;
	text-align: left;
}


/*	Group: Header
	Description: for all blocks that 
	represent .header div
------------------------------------------*/

#header {
    width: 960px;
	height: 132px;
	margin: 0 auto;
}

#header .paymode-x-banner {
    float: left;
    height: 96px;
}

	#header .paymode-x-banner .tagline {
		text-transform: uppercase;
		font-size: 10px;
		color: #999;
		float: left;
		clear: left;
		margin: 5px 0 0 8px;
		display: block;
	}
		
		#header .paymode-x-banner .tagline .EditableRegionTextBox {
			width: 250px !important;
		}
		
		#header .paymode-x-banner .tagline .CMSEditableRegionTitle {
			display: none;
		}
        
    /* TALK TO US / VISIT BOTTOMLINE.COM MENU */
    #header .menu-talk-to-us {
        float: right;
        text-align: left;
        padding: 3px;
        height: 33px;
        color: #545e71;
    }
    
        #header .menu-talk-to-us a {
            font-size: 11px;
            color: #333333;
        }
        
         #header .menu-talk-to-us a:hover {
            color: #0C6CB6;
        }
    
        #header .menu-talk-to-us li {
            float: left;
            text-align: right;
            padding-left: 2px;
            line-height: 18px;
        }
        
        #header .menu-talk-to-us li.first {
            padding-top: 6px;
        }
        
        #header .menu-talk-to-us .gray-arrow {
            background: url(../img/gray-arrow.png) no-repeat;
            display: block;
            padding: 1px 24px 0 0;
            line-height: 30px;
        }
        
    /* MEMBERS AREA */
    #header .members {
        float: right;
        height:36px;
        width: 410px;
        font-size: 11px;
        clear: right;
        margin-top: 21px;
    }
    
    #header .members a {
    color: #333333;
    }
    
    #header .members li {
        float: left;
    }
    
        #header .members .login {
            background: url(../img/header/login-bg.png) no-repeat;
            float: left;
            height: 35px;
            width: 203px;
            padding-left: 15px;
            padding-top: 1px;
            line-height: 35px
        }
        
        #header .members .join {
            background: url(../img/header/join-today-bg.png) no-repeat;
            float: left;
            width:174px;
            height:35px;
            padding-left: 18px;
            line-height: 35px;
            padding-top: 1px;
        }
          
        
/*	Group: Nav
	Description: for all blocks that 
	represent .nav div
------------------------------------------*/

/*NAV*/
#header .nav {
    height: 36px;
    width: 100%;
    background-color: #0d4a81;
    display: block;
    clear: both;
    position: relative;
}
    
    #header .nav ul {
        position: absolute;
        height: 41px;
        width: 100%;
    }
    
    #header .nav ul a {
        color: #ffffff;
        padding: 0 16px;
        display: inline-block;
        line-height: 36px;
        }
    
    #header .nav ul a:hover {
        background-color: #2a6aa4;
    }
    
    #header .nav ul .CMSListMenuHighlightedLI {
        background: url(../img/nav-active.png) no-repeat;
        height: 41px;
        background-position: bottom;

    }
        
        #header .nav li{
            float: left;
        }
        
         #header .nav li.last {
            float: right;
            line-height: 36px;
		 }

			#header .nav li.last a {
				padding: 0 10px 0 16px;
				background: url(../img/nav-non-active-bank.gif) no-repeat;
				width: 147px;
				height: 36px;
			}

			#header .nav li.last a:hover {
				background: url(../img/nav-non-active-bank.gif) no-repeat;
				background-color: #2a6aa4;
			}

			#header .nav li.last .CMSListMenuHighlightedLI {
				background: url(../img/nav-active-bank.gif) no-repeat;
				height: 41px;
				background-position: bottom;
			}

        #header .nav .white-arrow {
            margin-left: 6px;
        }
        
        
/*	Group: Marquee
	Description: for all blocks that 
	represent #marquee div
------------------------------------------*/

/* MARQUEE FILLER */
div#marquee {
    height: 359px;
    width: 960px;
    clear:both;
}

div#marquee .marquee-img 
{
    height:322px;
    width:959px;
}

div#marquee .marquee-img a.btn {
    background: url('../img/main_marqueesimages/green-btn-marquee.png') no-repeat;
    height: 30px; 
    width: 200px;
    color: #ffffff;
    text-transform: uppercase;
    font-size: 14px;
    font-family: Arial;
    border: 0;
    font-weight: bold;
    position: absolute;
    top:247px;
    left:68px;
    cursor: pointer;
    line-height: 30px;
    text-align:center;
} 

div#marquee .marquee-img a.btn:hover {
    color: #333333;
}

    div#marquee .marquee-img .image-1{
        background-image: url('../img/temp/flash-marquee.png');
        position: absolute;
        height: 322px;
        width: 959px;
        display: none;
    }

    div#marquee .marquee-img .image-2{
        background-image: url('../img/temp/flash-marquee2.png');
        position: absolute;
        height: 322px;
        width: 959px;
        display: none;
    }
    
    div#marquee .marquee-img .image-3{
        background-image: url('../img/temp/flash-marquee3.png');
        position: absolute;
        height: 322px;
        width: 959px;
        display: none;
    }
    
    div#marquee .marquee-img .image-4{
        background-image: url('../img/temp/flash-marquee4.png');
        position: absolute;
        height: 322px;
        width: 959px;
        display: none;
    }

.marquee-nav {
    height: 36px;
    width: 960px;
    background: url(../img/main_marqueesimages/nav-bg.png) no-repeat;
    position:relative;
    margin: 0;
    padding: 0;
}

.marquee-nav .scroll-wrap {
    margin: 0 auto;
    padding-top: 6px;
    position: absolute;
}

    .marquee-nav .scroll-wrap a.left-arrow {
        height: 23px;
        width: 20px;
        background: url(../img/main_marqueesimages/left-arrow.png) no-repeat;
        float: left;
        margin-right: 5px;
    }
    
    .marquee-nav .scroll-wrap a.right-arrow {
        height: 23px;
        width: 20px;
        display: inline;
        background: url(../img/main_marqueesimages/right-arrow.png) no-repeat;
        float: left;
        margin-left: 5px;
    }
    
    
        .marquee-nav .scroll-wrap .scroll {
            height: 23px;
            float: left;
        }
        
        .marquee-nav .scroll-wrap .scroll .scroll-left {
            height: 23px;
            width: 11px;
            background: url(../img/main_marqueesimages/scroll-left.png) no-repeat;
            float: left;
        }
        
        .marquee-nav .scroll-wrap ul {
            height: 23px;
            background: url(../img/main_marqueesimages/scroll-mid.png) repeat-x;
            float: left;
        }
        
        .marquee-nav .scroll-wrap li {
            float: left;
            margin-right: 13px;
        }
        
        .marquee-nav .scroll-wrap li.last {
            margin-right: 0;
        }
        
            .scroll ul li a {
           /* .marquee-nav .scroll-wrap .option {*/
                height: 8px;
                width: 8px;
                display: block;
                background: url(../img/main_marqueesimages/option.png) no-repeat;
                margin-top: 8px;
            }
            
            .scroll ul li.active a {
            /*.marquee-nav .scroll-wrap .option-active {*/
                height: 8px;
                width: 8px;
                display: block;
                background: url(../img/main_marqueesimages/option-active.png) no-repeat;   
                margin-top: 8px;
            }
        
        .marquee-nav .scroll-wrap .scroll .scroll-right {
            height: 23px;
            width: 11px;
            background: url(../img/main_marqueesimages/scroll-right.png) no-repeat;
            float: left;
        }
    


/*	Group: Home Body
	Description: for all blocks that 
	represent #home-body div
------------------------------------------*/

#home-body {
    margin: 0 auto;
    width: 960px;
}

/* FIRST ROW CONTENT */
.home-row-1 {
    min-height: 195px;
    height: auto !important;
    height: 195px;
    width: 960px;
    padding-top: 30px;
    border-bottom: 1px solid #e1e1e1;
}

.home-row-1 a {
    font-weight: bold;
    font-size: 12px;
}

.home-row-1 p {
    padding-top: 4px;
    margin: 0;
}

.home-row-1 p.news-events {
    margin-bottom: 2px;
}

.home-row-1 .winwin-img {
    margin-right: 11px;
    float: left;
}

    .home-row-1 .home-column {
        float: left;
        width: 299px;
        padding: 0 10px;
    }
    
    .home-column ul.payments-calc-home {
        width: 299px;
        display: block;
        clear: both;
    }
    
    
    .home-column ul.payments-calc-home li {
        float: left;
        line-height: 25px;
        padding-bottom: 4px;
    }
     
    .home-row-1 .inpt-txt {
        width: 93px;
        padding: 3px 5px 5px 5px;
        _padding: 2px 5px 4px 5px;
    }
    
    .home-row-1 .inpt-txt-first {
        width: 93px;
        margin-left: 24px;
        padding: 3px 5px 5px 5px;
        _padding: 2px 5px 4px 5px;
    }
    
    .home-row-1 .equal-sign {
        margin-left: 10px;
        vertical-align: middle;
        height: 23px; 
        width: 22px;
    }
    
    .home-row-1 p.payments-cal-home-divider 
    {
        margin-top:8px;
        padding-top: 12px;
        border-top: 1px solid #d6d6d6;
        width: 274px;
        clear: both;
    }
    
    .home-row-1 .payments-calc-margin-top {
        margin-bottom: 7px;
    }
    

/* FancyBox dialogs used for email a colleague and stay conntected */
div.modal {
 background-color: #3f3f3f;
 color: #fff;
 float: left;
 display: none;
} 

	div#fancybox-wrap div.modal { display: block; }
    
    div.modal p {
        padding: 0 20px 20px 20px; 
        margin: 0;
    }

    div.modal p.title {
        font-size: 18px;
        width: 348px;
        padding: 21px 0 13px 22px;
        margin-bottom: 11px;
        border-bottom: 1px dashed #636363;
    }
    
    div.modal ul {
        padding: 0 20px 20px 20px; 
    }

    div.modal li {
        float: left;
        height: 30px;
    }
    
    div.modal .errors li {
    	color: red;
    	float: inherit;
    	height: auto;
    }
    
    div.modal li.text {
        height: 70px;
    }
    
        div.modal li.label {
            width: 75px;
            line-height: 23px;
        }
    
    div.modal li .input-txt {
        width: 240px;
        float: left;
        padding: 5px 5px 4px 5px;
        _padding: 5px 5px 4px 5px;
        _height: 16px;
        border: 0px;
        height: 17px;
    }
    
    div.modal li textarea {
        width: 240px;
        height: 60px;
        float: left;
        padding: 3px 5px 5px 5px;
        _padding: 2px 5px 4px 5px;  
        margin: 0;
        border: 0px;
    }
    
    
    /* ORANGE BUTTON MODAL */
    div.modal li.btn-area
    {
        width: 252px;
        height: 26px;
        float: left;
        margin-top: 15px;
        padding-bottom: 20px;
    }
    
    div.modal li.btn-area .orange-btn {
        height: 26px;
        float: right;
        display: inline block;
        background: #E77C2A;
        color: #fff;
        font-size: 14px;
        text-transform: uppercase;
        line-height: 26px;
        font-weight: bold;
        border: 0;
        font-family: Arial;
        cursor: pointer;
        padding: 0 18px;
        overflow: visible;
    }
    
    div.modal li.btn-area input.orange-btn.hover
    {
        color: #333;
    }
    
    div.modal li.btn-area .orange-btn-left 
    {
        height: 26px;
        float: right;
        display: inline block;
        width: 10px;
        background: url(../img/btns/orange-btn-modal-left.gif) no-repeat;
    }
    
    div.modal li.btn-area .orange-btn-right 
    {
        height: 26px;
        float: right;
        display: inline block;
        width: 10px;
        background: url(../img/btns/orange-btn-modal-right.gif) no-repeat;
    }
        
        
        
/* SECOND ROW CONTENT */
.home-row-2 {
    height: 231px;
    padding-top: 27px;
    border-top: 1px solid #ffffff;
    background: url(../img/home-row-2-bg.png) repeat-x;
    width: 960px;
}

    /* COLUMN 1 */
    .home-row-2 .column-1 {
        float: left;
        width: 620px;
        padding: 0 10px;
    }
     
        .home-row-2 .column-1 ul {
            margin: 9px;
        }
    
        .home-row-2 .column-1 li {
            float: left;
            width: 80px;
            padding: 0 29px 0 10px;
            text-align: center;
        }

    
    /* COLUMN 2 */
    .companies-that-use {
        float: left;
        width: 280px;
        padding: 0 10px;
    }
    
    .companies-that-use img {
        height: 39px;
        width: 60px;
        padding: 8px 0 0 4px;
        
    }
    
        .companies-that-use li {
            float: left; 
            margin-right: 25px;
            margin-bottom: 12px;
            height: 53px;
            width: 68px;
            background: url(../img/companies-icon-bg.png) no-repeat;
        }
        
        .companies-that-use li.bottom {
            margin-bottom: 17px;
        }
        
        .companies-that-use li.last {
            margin-right: 0;
}
    
    /* ODOMETER */
    .odometer-title  {
        float: left;
        width: 87px;
    }
    
    .odometer  {
        margin: 2px 0 0 17px;
        float: left;
        width: 118px;
    }
    
       .odometer li {
            background: url(../img/odometer-bg.png) repeat-x;
            height: 16px;
            width: 8px;
            float: left;
            color: #545e70; 
            font-weight: bold;
            margin: 0;
            padding: 3px 4px;
            border-top: 1px solid #e7e9e2;
            border-bottom: 1px solid #e7e9e2;
            border-left: 1px solid #e7e9e2;
        }
    
        .odometer li.last {
            border-top: 1px solid #e7e9e2;
            border-bottom: 1px solid #e7e9e2;
            border-left: 1px solid #e7e9e2;
            border-right: 1px solid #e7e9e2;
            }
 
 
 /*	Group: Body
	Description: for all blocks that 
	represent #body div
------------------------------------------*/

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

    /* MAIN CONTENT AREA */
    #section 
    {
        float: right;
        width: 790px;
        padding-bottom: 50px;
    }

    #section_full
    {
		
        padding-bottom: 50px;
    }

    /* BREADCRUMB */
    .breadcrumb {
        margin: 15px 0 28px 10px;
        font-size: 12px;
        color: #aaaaaa;
    }

        .breadcrumb a {
            font-size: 12px;
        }


/*	Group: Secondary-Nav
	Description: for all blocks that 
	represent #secondary-nav
------------------------------------------*/

#secondary-nav {
    float: left;
    width: 160px;
    height: 100%;
    margin-right: 10px;
}

    #secondary-nav a 
    {
        display: block;
        border-top: 1px solid #e1e1e1;
        color: #333333;
        width: 140px;
        padding: 7px 10px;
        font-size: 12px;
    }
    
	#secondary-nav .CMSListMenuLinkHighlighted
    {
        font-weight: bold;
        border-top: 2px solid #e1e1e1;
        border-bottom: 1px solid #e1e1e1;
        background: url(../img/secondary-nav-active.png) no-repeat;
    }
    
    #secondary-nav li.last {
        border-bottom: 1px solid #e1e1e1;

    }
    
    #secondary-nav li.last .CMSListMenuLinkHighlighted {
        font-weight: bold;
        border-top: 2px solid #e1e1e1;
        border-bottom: 1px solid #e1e1e1;
        background: url(../img/secondary-nav-active.png) no-repeat;
    }
    
    #secondary-nav a.active:hover {
        color: #333333;
    }
    
    #secondary-nav a:hover {
        color: #666666;
    }
    
    
/*	Group: Left Column
	Description: for all blocks that 
	represent .left-column
------------------------------------------*/

/* LEFT COLUMN */

.left-column {
    float: left;
    width: 500px;
}

.left-column-padding {
    width: 522px;
    padding: 0 18px;
    float: left;
}

.left-column-padding li {
    margin-bottom: 13px;
    line-height: 23px;
}

.left-column-padding ul {
	list-style: disc;
	margin-left: 20px;
}


/*	Group: Right Column
	Description: for all blocks that 
	represent .right-column
------------------------------------------*/

/* RIGHT COLUMN */
.right-column 
{
    float: right;
    width: 230px;
}

    .right-column .title {
        background: url(../img/subpages/right-column-title-bg.png) no-repeat;
        background-position: bottom;
        background-color: #98bddd;
        padding: 8px 0 15px 7px;
        width: 223px;
        color: #ffffff;
        font-size: 12px;
        font-weight: bold;
        margin-bottom: 10px;
        display: block;
        text-transform: uppercase;   
    }
    
    .right-column p {
        padding: 0 10px;
    }
    
    .right-column strong {
        font-size: 12px;
    }
    
/* GREEN BUTTON AREA */
.right-column .green-btn-copy {
    border-top: 1px solid #e7e9e2;
    padding-top: 15px;
    margin-top: 30px;
    width: 100%;
}

.right-column .green-btn-copy p {
    margin-bottom: 14px;
}

    .right-column div.btn {
        height: 26px;
        margin: 0 10px;
        }

    .right-column div.btn-left
    {
        background: url(../img/btns/green-btn-left.png) no-repeat;
        height: 26px;
        width: 10px;
        float: left;
    }
    
    .right-column div.btn-right
    {
        background: url(../img/btns/green-btn-right.png) no-repeat;
        height: 26px;
        width: 11px;
        float: left;
    }

   .right-column .btn-middle
    {
        background-color: #8fc756;
        height: 26px;
        line-height: 26px;
        padding: 0 5px;
        font-weight: bold;
        float: left;
        color: #ffffff;
        font-family: Arial;
        font-size: 11px;
        border: 0;
        text-transform: uppercase;
        cursor: pointer;
    }
    
        a.btn-middle:hover{
            color: #333;
        }




/*	Group: Subpage Header Graphics
	Description: for all blocks that 
	are included as the header 
    graphics on the subpagse
------------------------------------------*/

/*	LARGE HEADER GRAPHIC */
.large-graphic {
	background-color: #e7e9e2;
	
	/*-min-height fast hack ie6 -*/
    min-height: 196px;
    height: auto !important;
    height: 196px;
    
    width: 759px;
    margin-bottom: 30px;
}

.ready-made-payment {
    background: #e7e9e2 url(../img/subpages/ready-made-payment-bg.png) no-repeat;
    padding: 27px 15px 1px;
}

.supplier-adoption {
    background: #e7e9e2 url(../img/subpages/supplier-adoption-bg.png) no-repeat;
    padding: 27px 15px;
}

.for-banks {
    background: url(../img/subpages/banks-bg.png) no-repeat;
    height: 201px;
    width: 759px;
    padding: 15px 15px;

}

.calc-ach {
    background: url(../img/subpages/calc-bg.png) no-repeat;
    padding: 24px 15px;
    height: 179px;
}

.calc-invoicing {
    background: url(../img/subpages/calc-bg.png) no-repeat;
    padding: 24px 15px;
    height: 157px;
}

    .calc-ach .left, .calc-invoicing .left {
        float: left;
        width: 380px;
    }

    .calc-ach .right, .calc-invoicing .right {
        float: left;
        padding-top: 36px;
        padding-left: 60px;
        width: 270px;
    }
    
    .calc-ach .right p.number, .calc-invoicing .right p.number {
        padding-bottom: 15px;
        margin-bottom: 13px;    
        font-size: 30px;
        line-height: 32px;
        width: 100%;
    }
    
    .calc-ach .right p.total-net, .calc-invoicing .right p.total-net {
        margin: 0 0 10px 0;
        padding: 0;
        width: 200px;
    }


.for-banks p.divider-line 
{
    border-bottom: 2px solid #F68526;
    line-height: 32px;
    padding-bottom: 3px;
    margin-bottom: 10px;
}

.large-graphic p {
    line-height: 20px;
    width: 364px;
}

.supplier-adoption .copy, .ready-made-payment .copy {
    margin-top: -6px;
}

.large-graphic .slogan {
    font-size: 16px;
    font-weight: normal;
    text-transform: none;
    }

.news-item-header {
     height: auto;
     width: 520px;
     background: #e7e9e2 url(../img/subpages/checkered-bg.png) repeat-x;
     padding: 25px 10px 1px;
     margin-bottom: 30px;
}

.news-header {
     height: auto;
     width: 500px;
     background: #e7e9e2 url(../img/subpages/checkered-bg.png) repeat-x;
     padding: 25px 20px 1px;
     margin-bottom: 30px;
}
    
/* NO GRAPHIC */
.no-graphic {
	/*-min-height fast hack ie6 -*/
	min-height: 95px;
	height: auto !important;
	height: 95px;
    
     width: 500px;
     background: #e7e9e2 url(../img/subpages/checkered-bg.png) repeat-x;
     padding: 25px 20px 1px;
     margin-bottom: 30px;
}
    

/*	Group: What Is Paymode X? Page
	Description: for all blocks that 
	are included on the "what is
    paymode-x" subpage
------------------------------------------*/

/* BEST OPTION GRAPHIC */
.best-option {
	background: #e7e9e2 url(../img/subpages/checkered-bg.png) repeat-x;
    width: 724px;
    padding: 20px 50px 0 15px;
    margin-bottom: 10px;
    float: left;
}

    .best-option p.left {
        float: left;
        width: 185px;
        padding-right: 15px; 
        font-size:18px; 
        color:#333333; 
        line-height: 24px;
    }

    .best-option p.right {
        float: left;
        width: 500px;
    }
    
    
/* READY MADE NETWORK GRAPHIC */
.ready-made {
	/*-min-height fast hack ie6 -*/
    min-height: 198px;
    height: auto !important;
    height: 198px;

    width: 359px;
    background: #e7e9e2 url(../img/subpages/ready-made-network-bg.png) no-repeat;
    padding: 18px 0 0 15px;
    float: left;
    margin-right: 10px;
}

.onboarding-support {
	/*-min-height fast hack-*/
    min-height: 198px;
    height: auto !important;
    height: 198px;
    width: 390px;
    background: #e7e9e2 url(../img/subpages/onboarding-support-bg.png) no-repeat;
    padding: 18px 0 0 15px;
    float: left;
}


.onboarding-support a, .ready-made a {
    font-size: 24px;
    color: #f68526;
    line-height: 30px;
    display: block;
}

    .onboarding-support a:hover, .ready-made a:hover {
        color: #f68526;
    }
    
  
/* FIRST ROW CONTENT */
#section .first-row {
    width: 790px;
    min-height: 185px;
    height: auto !important;
    height: 185px;
    clear: both;
    padding-top: 35px;
}

    #section .first-row .left {
        float: left;
        padding-left: 15px;   
        width: 525px; 
    }
    
    #section .first-row li {
        float: left;
        margin-top: 10px;
        margin-right: 17px;
        background: url(../img/subpages/sas-icon.png) no-repeat;
        background-position: bottom right;
        width: 158px;
    }
    
    #section .first-row li.travel {
        background: url(../img/subpages/travel-icon.png) no-repeat;
        background-position: bottom right;
    }
    
    #section .first-row li.lock {
        background: url(../img/subpages/lock-icon.png) no-repeat;
        background-position: bottom right;
    }
    
    #section .first-row .left a {
        font-size: 12px;
        font-weight: bold;
    }
    
    #section .first-row .left p {
        margin-top: 13px;
    }

/* SECOND ROW CONTENT */
.second-row {
    margin-top: 25px;
    width: 731px;
    height: 162px;
    clear: both;
    background: url(../img/subpages/growing-network-bg.png) no-repeat;
    padding: 30px 42px 0 17px;
}

    .second-row a {
        font-size: 12px;
        font-weight: bold;
    }
    
    .second-row .left {
        float: left;
        width: 430px;
    }
    
    .second-row p {
        width: 300px;
    }


 /*	Group: ROI Calculators & Resources 
	Description: for all blocks within
    the ROI Calculators & Resources page
------------------------------------------*/

div.calculator {
    width: 540px;
}

    div.calculator li {
        background-color: #fff;
        padding-left:19px;
        line-height: 50px;
        border-bottom: 1px solid #e7e9e2;
        width: 251px;
        float: left;
        height: 50px;
    }
    
    div.calculator li.first {
        height: 60px;
    }
    
    div.calculator li.right {
        text-align: right;
        line-height: 0;
    }
    
    div.calculator li.left {
        clear: both;
    }
    
    div.calculator li.button {
        height: 28px;
        border: 0;
        padding-top: 10px;
        text-align: right;
    }
    
    div.title {
        background-color: #e7e9e2;
        line-height: 40px;
        font-size: 16px;
        width: 502px;
        padding: 0 19px;
        clear: both;
        font-weight: bold;
    }
    
    div.calculator li.last {
        font-size: 15px;
        font-weight: bold;
        border-top: 1px solid #e7e9e2;
        border-bottom: 0;
        margin-top: 1px;
        line-height: 60px;
        height: 60px;
    }
    
    div.calculator li.last .total 
    {
        font-size: 20px;
        font-weight: bold;  
        padding-right: 8px;
    }
    
    div.calculator li strong.total-costs 
    {
        font-weight: bold;  
        line-height: 66px;
    }
        
    
    div.calculator li strong.total-number {
        font-size: 16px;
        font-weight: bold;  
        line-height: 66px;
        padding-right: 8px;
    }
    
    div.calculator .input-txt {
        margin-top: 12px;
        *margin-top: 11px;
        font-size: 16px;
        width: 180px;
        text-align: right;
        background: url("../img/subpages/input-txt-field-calc.png") no-repeat;
        border: 0;
        height: 18px;
        border-right: 1px #dddddd solid;
        *padding: 6px 5px 2px 5px;
        padding: 6px 5px 2px 5px /9;
        padding: 4px 5px 4px 5px;
    }
    
    p.light-gray {
        color: #999999;
        padding-left: 19px;
        width: 520px;
    }
    
/* CALC INVOICING CALCULATOR PAGE */
div.calc-invoicing-calc
{
    height: 368px;
    width: 790px;
    background: url('../img/subpages/e-invoicing-bg.png') no-repeat;
}

div.calc-invoicing-calc-savings
{
    background: url('../img/subpages/check-to-ach-bg.png') no-repeat !important;
}

    div.calc-invoicing-calc .left
    {
        float: left;
        padding: 25px 20px 0 20px;
        width: 360px;
        position: relative;
    }
    
    div.calc-invoicing-calc .left p.bottom
    {
        line-height: 18px;
        position: absolute;
        top: 183px;
        width: 355px;
    }
   
    
    div.calc-invoicing-calc .right
    {
        float: left;
        padding: 28px 20px 0 25px;
        width: 345px;
    }
    
    div.calc-invoicing-calc .right .input-txt {
        width: 190px;
        padding: 4px 5px 5px 5px;
        *padding: 6px 5px 2px 5px;
        padding: 6px 5px 2px 5px /9;
        margin-top: 13px;
        background: url("../img/subpages/input-txt-field-calc.png") no-repeat;
        border: 0;
        height: 18px;
        font-size:16px;
        text-align: right;
        }
        
    div.calc-invoicing-calc .right select {
        width: 202px;
        margin-top: 15px;
        display: block;
        }
        
    div.calc-invoicing-calc .right option 
    {
        display: block;   
    }
        
    div.calc-invoicing-calc .right .divider 
    {
        margin-top: 20px;
        padding-top: 20px;
        border-top: 1px solid #c1c1c1;
    }
              
    
        
/* CALC INVOICING PAGE */


   div.calculator ul.invoicing li {
        background-color: #fff;
        padding-left:19px;
        line-height: 30px;
        border-bottom: 1px solid #e7e9e2;
        float: left;
        height: 30px;
    }
    
    div.calculator ul.invoicing li.right {
        width: 121px;
        text-align: left;
    }
    
    div.calculator ul.invoicing li.left {
        clear: both;
        width: 381px;
    }
    
    div.calculator ul.invoicing li.total-costs {
        font-weight: bold;
        height: 50px;
    }
    
    div.calculator ul.invoicing li.button {
        height: 28px;
        border: 0;
        padding-top: 10px;
        text-align: right;
    }       
    
    div.calculator ul.invoicing li.last {
        font-size: 15px;
        font-weight: bold;
        border-top: 1px solid #e7e9e2;
        border-bottom: 0;
        margin-top: 1px;
        line-height: 45px;
        height: 45px;
    } 

    
 /* ORANGE BUTTON */
   .btn-area{
        height: 26px;
        float: left;
    }
    
    .btn-area-right{
        height: 26px;
        float: right;
    }
    
    
    .orange-btn {
        height: 26px;
        float: left;
        display: inline block;
        background: #E77C2A;
        color: #fff;
        font-size: 11px;
        text-transform: uppercase;
        line-height: 26px;
        font-weight: bold;
        border: 0;
        padding: 0 5px;
    }
    
    input.orange-btn {
        overflow: visible;
        cursor: pointer;
        font-family: Arial;
        line-height: 20px;
    }
    
    .orange-btn-contact-form {
        height: 26px;
        float: left;
        display: inline block;
        background: #E77C2A;
        color: #fff;
        font-size: 11px;
        text-transform: uppercase;
        line-height: 20px;
        font-weight: bold;
        border: 0;
        font-family: Arial;
        cursor: pointer;
        padding: 0 28px;
        overflow: visible;
    }
    
    .btn-area .icon, .btn-area-right .icon  {
        float: left;
    }
    
    a.orange-btn:hover {
        color: #333;
    }
    
    input.orange-btn.hover ,.orange-btn-contact-form.hover {
        color: #333;
    }
    
    .orange-btn-left 
    {
        height: 26px;
        float: left;
        display: inline block;
        width: 10px;
        background: url(../img/btns/orange-btn-left.gif) no-repeat;
    }
    
    .orange-btn-right 
    {
        height: 26px;
        float: left;
        display: inline block;
        width: 10px;
        background: url(../img/btns/orange-btn-right.gif) no-repeat;
    }
    
    
/* ORANGE BUTTON BIG */
   .lg-orange-btn-area{
        height: 30px;
        float: left;
    }
    
    .lg-orange-btn {
        height: 30px;
        float: left;
        display: inline block;
        background: #E77C2A;
        color: #fff;
        font-size: 14px;
        text-transform: uppercase;
        line-height: 26px;
        font-weight: bold;
        border: 0;
        font-family: Arial;
        cursor: pointer;
        padding: 0 20px;
        overflow: visible;
    }
    
    input.lg-orange-btn.hover
    {
        color: #333;
    }
    
    .lg-orange-btn-left 
    {
        height: 30px;
        float: left;
        display: inline block;
        width: 12px;
        background: url(../img/btns/orange-btn-big-left.gif) no-repeat;
    }
    
    .lg-orange-btn-right 
    {
        height: 30px;
        float: left;
        display: inline block;
        width: 12px;
        background: url(../img/btns/orange-btn-big-right.gif) no-repeat;
    }
    
    
/* BLUE BUTTON */

div.bottom-calc-btns {
    padding-top: 25px;
    clear: both;
    height: 56px;
    padding-left: 19px;
    width: 520px;
}

   .blue-btn-area {
        height: 26px;
        float: left;
        margin-right: 10px;
    }
    
    .blue-btn-area-right {
        height: 26px;
        float: right;
    }
    
    
    .blue-btn {
        height: 26px;
        float: left;
        display: inline block;
        background: url(../img/btns/blue-btn.png) repeat-x;
        color: #185394;
        font-size: 11px;
        text-transform: uppercase;
        line-height: 26px;
        font-weight: bold;
        border: 0;
        font-family: Arial;
        cursor: pointer;
        padding: 0 10px;
    }
    
    a.blue-btn:hover 
    {
        color: #579AE3;
    }
    
    .blue-btn-area .icon, .blue-btn-area-right .icon  {
        float: left;
    }
    
    
    .blue-btn-left 
    {
        height: 26px;
        float: left;
        display: inline block;
        width: 11px;
        background: url(../img/btns/blue-btn-left.png) no-repeat;
    }
    
    .blue-btn-right 
    {
        height: 26px;
        float: left;
        display: inline block;
        width: 11px;
        background: url(../img/btns/blue-btn-right.png) no-repeat;
    }


/* GREEN BUTTON */


.green-btn {
    height: 26px;
    margin-left: 10px;
    float: left;
    }

    .green-btn .btn-left
    {
        background: url(../img/btns/green-btn-left.png) no-repeat;
        height: 26px;
        width: 10px;
        display: inline-block;
        float: left;
    }
    
    .green-btn .btn-right
    {
        background: url(../img/btns/green-btn-right.png) no-repeat;
        height: 26px;
        width: 11px;
        display: inline-block;
        float: left;
    }

   .green-btn .btn-middle
    {
        background-color: #8fc756;
        height: 26px;
        width: auto;
        line-height: 26px;
        padding: 0 10px;
        font-weight: bold;
        display: inline-block;
        float: left;
        color: #ffffff;
        font-family: Arial;
        font-size: 11px;
        border: 0;
        text-transform: uppercase;
        cursor: pointer;
    }
       
    .green-btn a.btn-middle:hover {
        color: #333333;
    }


 /*	Group: Contact Form
	Description: for all blocks on
    the Contact Form Pages
------------------------------------------*/

.star {
    color: #F68526;
}

ul.contact-form .star-right {
    color: #F68526;
    float: right;
    padding-top: 4px;
    padding-right:0;
}

.orange-lowercase {
    text-transform: none;
}

.contact-form-errors ul
{
	margin-top: 5px;
	margin-bottom: 10px;
}

.contact-form-errors li
{
	margin-bottom: 0px;
}

.contact-form-div ul {
	margin-left: 0px;
	list-style: none;
}

.contact-form-div .has-other {
	position: relative;
}

.contact-form-div .other {
	position: absolute;
	top: 0;
	right: 0;
	display: block;
	clear: both;
}

.contact-form-div .other2 {
	position: absolute;
	bottom: 5px;
	*bottom: 15px;
	left: 160px;
	display: block;
}

.contact-form-div .has-other input.disabled {
	background-color: #f0f0f0;
}

.contact-form-div p {
	margin-bottom: 8px;
}

.contact-form-div .contact-checkbox,
.contact-form-div .contact-checkbox2
{
	display: block;
	margin-bottom: 20px;
}

.contact-form-div .contact-checkbox input,
.contact-form-div .contact-checkbox2 input
{
	display: block;
	float: left;
}

.contact-form-div .contact-checkbox label,
.contact-form-div .contact-checkbox2 label
{
	padding-left: 5px;
	margin-bottom: 8px;
	display: block;
	float: left;
}

.contact-form-div .contact-checkbox br,
.contact-form-div .contact-checkbox2 br
{
	clear: both;
}

ul.contact-form {
    width: 521px;
    height: auto;
    /*height: 390px;*/
}

    ul.contact-form .input-txt {
        width: 306px;
        margin-left:4px;
        padding: 3px 5px 5px 5px;
        vertical-align: middle;
        _padding: 2px 5px 4px 5px;
        border: 1px solid #999999;
    }
    
    ul.contact-form select {
        width: 170px;
        padding: 3px;
        vertical-align: middle;
        _padding: 4px;
        margin-left:4px;
        float: left;
        border: 1px solid #999999;
    }
    
    ul.contact-form strong 
    {
        float: left;
    }
    
    select.wide {
        width: 316px;
        padding: 3px;
        vertical-align: middle;
        _padding: 4px;
        margin-bottom: 17px;
      /*  margin-top: -10px; */
        border: 1px solid #999999;
    }
    
    ul.contact-form li {
        float: left;
        height: 34px;
        width: 383px;
        margin-bottom: 0;
    }
    
    ul.contact-form li.left{
        width: 138px;
        line-height: 22px;
        float:left;
    }
    
    ul.contact-form p.small-txt
    {
        font-size: 12px;
        line-height: 15px;
        float:right;
        width:200px;
    }
    
    .contact-input-txt {
        width: 316px;
        padding: 3px 5px 5px 5px;
        vertical-align: middle;
        _padding: 2px 5px 4px 5px;
        margin-top: -10px;
        margin-bottom: 17px;
        border: 1px solid #999999;
    }
    
    .contact-input-txt-sm {
        width: 170px;
        padding: 3px 5px 5px 5px;
        _padding: 2px 5px 4px 5px;
        margin-left: 10px;
        border: 1px solid #999999;
        vertical-align: middle;
    }
    
    
    div.contact-comments {
        width: 490px;
    }
        
    .contact-comments textarea {
        margin-top: -10px;
        margin-bottom: 30px;
        width: 485px;
        height: 70px;
        border: 1px solid #999999;
    }
    
    
/* CHECK BOXES */
ul.contact-checkbox {
    margin-top: -10px;
    height: 138px;
    margin-bottom: 30px;
}

ul.contact-checkbox2 {
    margin-top: -10px;
    height: 110px;
    margin-bottom: 30px;
}

    ul.contact-checkbox li.right, ul.contact-checkbox2 label {
       width: 380px;
    }
    
    ul.contact-checkbox li.second-to-last {
        margin-bottom: 5px;
        _margin: 0;
    }
    
    ul.contact-checkbox li, ul.contact-checkbox2 li {
       margin: 0px 0px 7px 0;
       height: 15px;
       line-height:15px;
       _margin: 0;
       float: left;
       width: 400px;
       clear: both;
    }
    
    ul.contact-checkbox .checkbox, ul.contact-checkbox2 li.left .checkbox {
        margin-right:5px;
        position:relative;
        top:1px;  
    }
    

    

    

 
 /*	Group: Common Questions Page
	Description: for all blocks on
    the 'common questions' subapges
------------------------------------------*/

dl.questions dt,
dl.questions dd {
    width: 480px;
    border-top: 1px solid #ffffff;
    padding: 10px 20px 10px 40px;
    line-height: 20px;
    cursor: pointer;
    background: url('../img/on-off.gif') no-repeat #e7e9e2 -555px center;
}

dl.questions dt.ui-state-active {
    background-position: left center;
}

dl.questions dd {
    background-color: #fff;
    cursor: default;
    width: 500px;
    position: relative;
    background-image: none;
}
    
    dl.questions dd.answer p {
        line-height: 20px;
		padding: 0 0 8px 0;
		margin: 0;
    }


.questions-title {
    background-color: #565e71;
    width: 500px;
    padding: 0 20px;
    line-height: 41px;
    color: #ffffff;
    font-size: 16px;
    margin: 0;
    font-weight: bold;
}


 /*	Group: News Pages
	Description: for all blocks on
    the Contact Form Pages
------------------------------------------*/
.news-item-header .news-header-title
{
	font-size: 18px;
	line-height: 23px;
}

.news-list 
{
    margin-left: 0 !important;
    padding-left: 0;
    list-style-type: none !important;
}

.news-list li
{
	position: relative;
	margin-left: 155px;
}

.news-list .date
{
	display: block;
	position: absolute;
	right: 0px;
	left: -150px;
	width: 129px;
}

.news-content .byline
{
	font-size: 13px;
	line-height: 20px;
	display: block; 
	padding-right: 10px;
}

.news-content p
{
	line-height: 20px;
}
 
 /*	Group: Thirdparty Extensions
 	Description: Over-ride styles
 	for existing third-party plugins
 ------------------------------------------*/
 
 /*-fancybox-*/
body #fancybox-outer {
 	background-color: #FFFFFF;
 }
 
 
 
 /*	Group: Footer
	Description: for all blocks that 
	represent #footer
------------------------------------------*/ 

 #footer {
    margin: 0 auto 100px auto;
    width: 960px;   
    clear: both; 
 } 
 
 #footer a:hover  {
    color: #0C6CB6;
 }
 
 
/* FOOTER TOP ROW */
.footer-top {
    width: 958px;
    border: 1px solid #e7e9e2;
    height: 51px;
    color: #666;
}

    /* FOOTER TOP LEFT (share this page) */
    .footer-top ul.left {
        padding-left: 12px;
        float: left;
    }
    
        .footer-top ul.left li {
            float: left;
            margin-right: 20px;
            line-height: 51px;
        }
        
        .footer-top ul.left a {
            color: #666;
            font-size: 12px;
            display: inline-block;
            vertical-align: middle;
        }
        
        .footer-top ul.left img {
            float: left;
            margin-right: 5px;
            
        }
    
    /* FOOTER TOP RIGHT (stay connected) */
    .footer-top ul.right {
        float: right;
        padding-right: 20px;
        line-height: 51px;
        height: 51px;
            vertical-align: middle;
    }
    
        .footer-top ul.right li {
			float: left;
        }
        
        .footer-top ul.right .input-txt {
            width: 130px;
            padding: 5px 5px 5px 5px;
            margin: 13px 6px 0 8px;
            border: 1px solid #d8ddd5;
            color: #666;
            float: left;
            
            /*-ie6 double margin bug-*/
            display: inline;
        }
        
        .footer-top ul.right .input-img {
            margin: 15px 0 0;
            height: 22px; 
            width: 20px;
			float: left;
        }

#footer .follow-us {
	float: right;
	line-height: 51px;
	padding: 0 12px 0 20px;
}

#footer .follow-us a {
	padding-left: 7px;
	display: inline-block;
	vertical-align: middle;
	height: 51px;
}

	#footer .follow-us a img {
		padding-top: 13px;
	}

            
/* FOOTER BOTTOM ROW */
.footer-bottom {
    padding: 20px 0;
    clear: both;
    width: 960px;
}

    .footer-bottom p{
        font-size: 11px;
    }
    
        .footer-bottom img {
            float: left;
            margin-right: 10px;
        }
        
         .footer-bottom img.bottom-line {
            margin-top: 2px;
        }
        
        .footer-bottom li.first {
            float: left;
            width: 350px;
            padding-left: 12px;
            margin-right: 50px;
        }

            .footer-bottom li.first .blue {
                text-transform: none;
                font-size: 11px;
                font-weight: normal;
                color: #0c6cb6;
            }
        
        .footer-bottom li.middle {
            float: left;
            width: 125px;
        }
        
            .footer-bottom li.middle p {
                line-height: 14px;
                margin-top: 6px;
            }
        
            .footer-bottom li.middle em {
                font-family: Georgia;
                color: #86bf46;
                font-weight: bold;
            }
        
        .footer-bottom li.last {
            float: right;
            width: 300px;
            padding-right: 12px;
            margin-left: 55px;
            text-align: right;
        }
        
            .footer-bottom li.last a, .footer-bottom li.last p {
                color: #525e70;
            }
   
   
 /*	Group: Role by Role page
	Description: for all blocks that 
	represent .role-by-role
------------------------------------------*/          
            
.role-by-role .left
{
    float: left;
    text-align: center;
    clear: both;
    width: 100px;
}

.role-by-role img
{
    margin-bottom: 3px;
}

.role-by-role ul {
    float: left;
    width: 363px;
    margin-bottom: 30px;
    line-height: 18px;
    margin-left: 0;
}

.role-by-role li {
    margin-bottom: 8px;
    margin-left: 20px;
}
       
       
       
.SelectButton, .ClearButton 
{
    font-weight: bold;
    cursor: pointer;
    color: #185292;
}  


 /*	Group: Join Today
------------------------------------------*/     
                
.join-now-header {
    margin-left:0;
}

.join-now-overview {
	width: 710px;
	float: left;
}

.join-now-overview .col1,
.join-now-overview .col2 {
	padding: 0 15px;
	float: left;
}

	.join-now-overview .col1 {
		margin-right: 20px;
		width: 320px;
	}
	
	.join-now-overview .col2 {
		width: 310px;
	}


.join-now-overview .col1 h3.col-title,
.join-now-overview .col2 h3.col-title {
	background-color: #E7E9E2;
	height: 38px;
	margin: 0 -15px 17px;
	padding: 22px 15px 0;
	color: #F68526;
	font-size: 20px;
	font-weight: bold;
}
	
	.join-now-overview h3#enroll-supplier {
		background: url(../img/supplier-bg.png) no-repeat;
	}
	
	.join-now-overview h3#enroll-payer {
		background: url(../img/payer-bg.png) no-repeat;
	}

    .join-now-overview .secure-link {
        background: url(../img/icons/padlock.png) no-repeat;
        padding-left: 18px;
    }