﻿/**************************************************
 *         __                                     *
 *        / _|                                    *
 *      _| |_  _  ___  ____  _  _ __    __        *
 *     |_   _|| |/  _|/ __ \| \/_|\ \  / /        *
 *       | |  | |\_ \ | \/_|| |    \ \/ /         *
 *       | |  | | _\ \| |__ | |     \  / _        *
 *       |_|  |_||___/\____/|_| eSol \/ |_|       *
 *                                                *
 * Application: Retail Online 4.1                 *
 * Theme:  west2727                               *
 *                                                *
 **************************************************/
/**************************************************
 * Start CSS Reset                                *
 **************************************************/

/*RESET STYLES START*/
html {margin:0;padding:0;border:0; }
body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, td,
article, aside, dialog, figure, footer, header,
hgroup, nav, section { margin: 0;padding: 0;border: 0;vertical-align: top;}
/* This helps to make newer HTML5 elements behave like DIVs in older browers */ 
article, aside, dialog, figure, footer, header, hgroup, nav, section {display:block;}
/* Line-height should always be unitless! */
body {line-height: 1.5;}
/* Tables still need 'cellspacing="0"' in the markup. */
table { border-collapse: separate; border-spacing: 0; }
/* float:none prevents the span-x classes from breaking table-cell display */
caption, th, td {float:none !important; }
/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before, blockquote:after, q:before, q:after { content: ''; }
blockquote, q { quotes: "" ""; }
/* Remove annoying border on linked images. */
a img { border: none; }
/* Remember to define your own focus styles! */
:focus { outline: 0; }
.wrapper .DataSectionFrame br { display:block; }
/*RESET STYLES END*/

/*Layout*/
body {text-align:left !important; margin:0px !important; padding: 0px; font: 12px 'CenturyGothic',Arial, Helvetica, sans-serif; background: url('bg.jpg') repeat-x bottom left #fff; }
.wrapper {top:0; position:relative; width:998px; margin: 0 auto; background-color: #ffffff; z-index:1}
.DataSectionFrame {padding: 85px 15px 30px; margin-bottom: 50px !important; min-height: 190px;}

/*Fonts above the data tables. To keep the page name fonts consistent make h3 and big tags the same*/
.LandingPageWelcomeMessage {font-size:12px;font-weight:bold; padding-bottom:10px}
h3 {font-size:12px;font-weight:bold}
big {font-size:12px;font-weight:bold}

/*Navigation - Set the top and left properties in Author and set the top also in the CSS to overrides the -7 pixel subtraction in IE. Also add any background colors and background images for the navigation here.*/
.Nav1 {top:10px !important; left:850px !important}
.Nav2 {top:120px !important; border-bottom: 1px solid #A7A9AC; width:980px; margin-left: 10px; }
.Nav3 {top:164px !important;}
.Nav4 {overflow:hidden;} /*Fixes Nav4 Footer Issue*/

/*Navigation Area 1*/
#nav1t > ul{display:block;height:15px;}
/*Navigation Area 1 Main Buttons*/
#nav1t ul.sf-menu > li:first-child {border-left: none;}
#nav1t ul.sf-menu > li {float:left; height:15px; padding:0 10px !important; margin:0px !important; border-left: 1px #808284 solid;}
#nav1t ul.sf-menu > li > a {display:block;height:15px; line-height:15px; font: 10px/15px 'CenturyGothic',Arial, Helvetica, sans-serif; color: #808284;}
#nav1t ul.sf-menu > li > a:hover {color: #005594; text-decoration: underline;}
/*Navigation Area 1 Flyout Menus If Needed*/
#nav1t ul.sf-menu li ul {margin-top:0px;} 
#nav1t ul.sf-menu li ul li ul {margin-top:0px;}
#nav1t ul.sf-menu li.sf-shadow ul {padding-top:0px;}
#nav1t ul.sf-menu li ul li {margin: 0px; padding: 0px; text-align:left !important; width:15em !important; height:auto !important;}
#nav1t ul.sf-menu li ul li a {text-transform:none; padding:3px 0px 10px 5px; line-height:normal;}
#nav1t ul.sf-menu li ul li a:hover {}

/*Navigation Area 2*/
#nav2t > ul{display:block;height:29px;}
/*Navigation Area 2 Main Buttons*/
#nav2t ul.sf-menu > li {float:left; height:29px; padding:0 20px !important; margin:0px !important;}
#nav2t ul.sf-menu > li > a {display:block;height:29px; line-height:29px; color: #6C6E70; font: 15px/29px 'CenturyGothic',Arial, Helvetica, sans-serif; }
#nav2t ul.sf-menu > li > a:hover {color: #005594;}
/*Navigation Area 2 Flyout Menus*/
#nav2t ul.sf-menu li ul {margin-top:5px;} 
#nav2t ul.sf-menu li ul li ul {margin-top:0px;}
#nav2t ul.sf-menu li.sf-shadow ul {padding-top:0px;}
#nav2t ul.sf-menu li ul li {background-color: #fff !important; margin: 0px; padding: 0px; text-align:left !important; width:15em !important; height:auto !important;}
#nav2t ul.sf-menu li ul li a {text-transform:none; padding:3px 0px 10px 5px; line-height:normal; color: #6C6E70 !important; font: 12px/14px 'CenturyGothic',Arial, Helvetica, sans-serif;}
#nav2t ul.sf-menu li ul li a:hover {color: #FFFFFF !important; background-color: #005594 !important;}


/*Navigation Area 3*/
#nav3t > ul{display:block;}
/*Navigation Area 3 Main Buttons*/
#nav3t .sf-menu > li {padding:0 15px !important; margin:0px !important; text-align:left;}
#nav3t .sf-menu > li > a {display:block;height:20px; line-height:20px; font: bold 13px/20px 'CenturyGothic',Arial, Helvetica, sans-serif; color: #00467E}
#nav3t ul.sf-menu > li > a:hover {text-decoration:underline;}
/*Navigation Area 3 Flyout Menus*/
#nav3t ul.sf-menu li ul {margin-top:0px;}
#nav3t ul.sf-menu li ul li ul {margin-top:0px;}
#nav3t ul.sf-menu li.sf-shadow ul {padding-top:0px;}
#nav3t ul.sf-menu li ul li {background-color: #fff !important; margin: 0px; padding: 0px; text-align:left !important; width:15em !important; height:auto !important;}
#nav3t ul.sf-menu li ul li a {text-transform:none; padding:3px 0px 10px 5px; line-height:normal; color: #6C6E70 !important; font: 12px/14px 'CenturyGothic',Arial, Helvetica, sans-serif;}
#nav3t ul.sf-menu li ul li a:hover {color: #FFFFFF !important; background-color: #005594 !important;}

/*Navigation Area 4*/
#nav4t a{text-decoration:underline !important;}
#nav4t a:hover{text-decoration:none !important;}

/*Banner/Logo - To keep the flow of the site correct it is recommended to put the banner in the logo section and only use the banner area for banner ads*/
#Logo { position:relative !important;top:0px !important;left:0px !important;} /*Adjust top and left for the logo*/
.Banner {position:absolute;top:0px !important;left:0px !important;}

/*Footer*/
#FooterDiv {background: url('footer.png') no-repeat top center; height: 183px; position: absolute; width: 998px;}
.footerButtons table tr td{vertical-align: bottom;}

/*Copyright*/
#CopyrightDiv {padding-top: 66px; color: #FFFFFF; font: 14px/20px 'CenturyGothic',Arial, Helvetica, sans-serif; position:relative; margin: -12px 0 !important; text-align: center; background: url('bg_coprigt.jpg') repeat-x top left; height: 176px; z-index: -1; text-indent: -659px;}

/*Cross browser css fixes for the copyright area*/
*:first-child+html #CopyrightDiv { margin-top:0px;} /* IE7 only */
:root #CopyrightDiv { margin-top:0px \0/IE9; }  /* IE9 */
@media screen and (-webkit-min-device-pixel-ratio:0) {#CopyrightDiv {margin-top:0px;}}
html>/**/body #CopyrightDiv , x:-moz-any-link, x:default {margin-top:0px;}
#CopyrightDiv {margin-top:0px;}

/*Fixes*/
#Disclosure {background:#ffffff;}
.percent {padding-right:20px !important;}
.AcctAmountRow {width:100px;}
.wrapper br:last-child {display:none;}
#FooterDiv hr {display:none;}
#FooterDiv br {display:none;}
#FooterDiv p {display:none;}
#CopyrightDiv p {display:none}
th {vertical-align: bottom !important;}
#SecureMailArea tr {background-color:#ffffff !important;}
/*Fix widget spacing and line up*/
table .spacer10px:first-child {display: none;}
.spacer10px {width:3px !important; max-width:3px !important; min-width:3px !important;}
/*bottom align text in Account Information widget on Account Summary page*/
form#BalanceInfo table.DataTable td{vertical-align:bottom;}
/*bottom align balance text in Account List widget on Landing page*/
div.AccountListWidget li.AcctListData td.AvailableBalance,div.AccountListWidget li.AcctListData td.Balance{vertical-align: bottom;}
/*Add padding to bottom of checkfree widget so that link is not so close to the bottom border*/
div#_CheckFree{padding-bottom:10px;}
/*IE7 display issue with print icon in account list header not floating left*/
h3.HEADER>div.floatr{*margin-top:-17px}
/*IE7 display issue for account list subheader*/
.AccountList-Accounts > li.Subheader > div{display:inline;}
/*Spacing for Username and Take Me To Tool*/
select#Destination {margin-left:10px;}
input#AccessId {margin-left:10px;}
/*Removes grey box on active state in IE*/
a:active{background:transparent;}

/*checkfree widget display on ie 7 8*/
iframe #CheckfreeWidget {position:relative;} 
#CheckfreeWidget {position:relative !important;} 

/*For IPay/Paytraxx
.FocusWidget td.RightMultiColumn {width:110px;}*/

/*Use for top left of account summary page if Express Transfer is on the right*/
#BalanceInfo DIV.ieouter{/*width:390px;*/}
@media all and (min-width:0px) {/*#BalanceInfo div {width:390px !important;}*/}
@media screen and (-webkit-min-device-pixel-ratio:0) {/*#BalanceInfo div {width:390px !important;}*/}
html>/**/body #BalanceInfo div, x:-moz-any-link, x:default {/*width:390px !important;*/}
/*.spacer10px {width:3px !important; max-width:3px !important; min-width:3px !important;}*/

/*Vertical Navigation and flyout fixes*/
/*
.sf-vertical li {height:31px !important;}
.sf-vertical li li {height:20px !important;}
.sf-menu ul{font-size:11px !important; width:18.75em !important;}
.sf-menu ul li ul{width:18.75em !important;}
#nav2 ul.sf-menu li li:hover ul, #nav2t ul.sf-menu li li:hover ul, #nav2 ul.sf-menu li li.sfHover ul, #nav2t ul.sf-menu li li.sfHover ul { left: 18.75em !important;}
*/


@font-face {
	font-family: 'CenturyGothic';
	src: url('fonts/gothic.eot');
	src: local('gothic'), url('fonts/gothic.woff') format('woff'), url('fonts/gothic.ttf') format('truetype');
}