/* Color specifications:
 *
 * cardgate-green:
 *  #669900 normal
 *  #446600 darker
 *  #77b200 semi
 *  #88cc00 lighter
 *
 */

/* REMEMBER:
 *
 * all.css is referenced first, check there for more style definitions!
 *
 */

/* basic layout */
    body {
        background: #669900;
        margin: 1em;
        font-family: Verdana, sans-serif;
        font-size: 76%;
        text-align: center;
    }
    /* hr should never be seen */
    hr {
        visibility: hidden;
        height: 0;
        display: block;
        clear: both;
        font-size: 9pt;
        margin: 0;
        padding: 0;
    }
    div {
        text-align: left;
        background: white;
        width: 57em;
        margin: 0 auto;
        padding: 0;
    }
    div div {
        padding: 0.3em 2em;
    }

/* rounded corner bits */
    div.rounded {
        clear: none;
        height: 10px;
        background: white;
        margin: 0;
        padding: 0;
    }
    div.rounded_r {
        float: right;
    }
    div.rounded_tl {
        background: url('../i/tl.gif') no-repeat top left;
    }
    div.rounded_tr {
        background: url("../i/tr.gif") no-repeat top right;
    }
    div.rounded_bl {
        background: url("../i/bl.gif") no-repeat bottom left;
    }
    div.rounded_br {
        background: url("../i/br.gif") no-repeat bottom right;
    }

/* header */
    div#hdr_cardgate {
        float: left;
        width: 235px;
        margin-top: 0.5em;
    }
    div#hdr img {
        border: 0;
    }
    div#hdr_commbank {
        float: right;
        font-size: 70%;
        width: 36em;
        min-width: 285px;
        text-align: center;
    }

/* centered nav bar with hover effects */
    div#nav, div#ftr, div#ftr * {
        background: transparent;
    }
    div#nav {
        margin: 0 auto;
        padding: 0;
    }
    div#nav ul {
        font-size: 75%;
        text-align: center;
        padding: 0.5em 0;
        margin: 0;
        line-height: 1.5em;
    }
    div#nav ul li {
        display: inline;
        padding: 0;
    }
    div#nav ul li a {
        padding: 0.5em 0.5em;
        text-decoration: none;
        font-weight: bold;
        margin: 0;
        color: white;
        font-size: 110%;
        border-right: solid 1px #446600;
    }
    div#nav ul li.first a {
        border-left: solid 1px #446600;
    }
    div#nav li.current a {
        background: #88cc00;
    }
    div#nav a:hover {
        background: #88cc00 !important;
        text-decoration: underline;
    }

/* main section */
    .statement {
        background: white;
        color: #669900;
        text-align: center;
        font-size: 1.7em;
    }
    div#main_nav {
        width: 13em;
        float: right;
    }
    div#main_content {
        float: left;
        width: 36em;
    }
    div#main_content .title {
        margin-top: 0;
    }

/* document nav */
    div.docnav {
        width: 100%;
        font-weight: bold;
        font-size: 1.1em;
        background: #669900;
        color: white;
        text-align: center;
        padding: 0.2em;
        margin-bottom: 0;
    }
    ul.docnav {
        padding: 0;
        margin: 0;
    }
    ul.docnav li {
        padding: 0.5em 0;
        padding-bottom: 0;
        margin-left: 1em;
        color: #446600;
    }
    ul.docnav li a {
        display: block;
        color: black;
        text-decoration: none;
    }
    ul.docnav li a:hover {
        color: #446600;
        text-decoration: underline;
    }

/* footer */
    div#ftr div {
        font-size: 90%;
        display: inline;
        width: auto;
        margin: 0;
    }
    div#ftr_site {
        float: left;
    }
    div#ftr_info {
        float: right;
    }
    div#ftr ul li * {
        color: white;
    }

/* piped link list */
    div#ftr ul.piped {
        padding: 0;
        margin: 0;
    }
    div#ftr ul.piped li {
        display: inline;
        border-left: solid 1px #446600;
        padding: 0 0.5em;
        padding-right: 0.25em;
    }
    div#ftr ul.piped li.first {
        border-left: 0;
    }
/* eg used by the outages page to highlight a hot issue */

   .alert {
	text-decoration: blink;
	color: red;
	font-weight: bold;
   }