/* hacks */
img
{
/* prevent img's exceeding the page width */
    max-width:100%;
    width:auto\9;
    height:auto;
    vertical-align:middle;
    border:0;
    -ms-interpolation-mode:bicubic;
}

/* default font*/
*
{
    font-family:"Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight:400;
}

/* any message */
.success_message,.warning_message,.error_message
{
    background:#FFF;
    border:solid 3px #000;
    padding:10px;
    width:60%;
    margin:5px auto;
    min-width:350px;
    text-align:justify;
    font-size:medium;
}

.success_message h1,.warning_message h1,.error_message h1
{
    margin:.25em 0;
    text-align:center;
    font-weight:bold;
    color:#000;
    font-size:large;
}
.success_message p,.warning_message p,.error_message p
{
    text-align: center;
}

.success_message h1:after,.success_message h1:before,.warning_message h1:after,.warning_message h1:before,.error_message h1:after,.error_message h1:before
{
    content:'';
    background-image:url(/images/exclamation.png);
    background-position:center;
    background-repeat:no-repeat;
    width:16px;
    height:16px;
    display:inline-block;
    padding:0 5px;
}

/* error message */
.error_message
{
    background:#FDD;
    border-color:#700;
    color:#700;
}

.error_message h1
{
    color:#700;
}

.error_message h1:after,.error_message h1:before
{
    background-image:url(/images/exclamation.png);
}

/* warning message */
.warning_message
{
    background:#FFD;
    border-color:#770;
    color:#770;
}

.warning_message h1
{
    color:#770;
}

.warning_message h1:after,.warning_message h1:before
{
    background-image:url(/images/error.png);
}

/* sucess message */
.success_message
{
    background:#DFD;
    border-color:#070;
    color:#070;
}

.success_message h1
{
    color:#070;
}

.success_message h1:after,.success_message h1:before
{
    background-image:url(/images/tick.png);
}

html,page,body
{
    margin:0;
    padding:0;
    height:100%;
    width:100%;
    display:table;
    background:white;
    color:black;
}

body > div
{
    border:solid 1px transparent;
    display:table-cell;
    height:100%;
    position:relative;
    padding:0 20px;
    z-index:100;
}

header,footer
{
    text-align:center;
    display:table-row;
    vertical-align:bottom;
    height:auto;
}

header > div
{
    display:table;
    width:100%;
    table-layout:fixed;
    border-spacing:20px;
}

header > div > div
{
    border:solid 3px #777;
    display:table-cell;
}

input,button,.button
{
    margin-right:1px;
    margin-bottom:1px;
}

input[type=password],input[type=text], #scorebar
{
    width:20em;
    border:solid 1px #AAA;
    font-size: small;
}

button,input[type=submit],.button
{
    display:inline-block;
    padding:5px 20px;
    background:#0A0;
    border:none;
    text-decoration:none;
    color:#FFF;
    font-weight:bold;
    font-size:medium;
    height:auto;
    width:auto;
    margin:0;
/*CSS3*/
    border-radius:30px;
    text-shadow:0 2px 1px #000;
    box-shadow:0 3px 2px #AAA;
}

input[type=submit]::-moz-focus-inner
{
    border:0;
    padding:0;
}

button:hover,input[type=submit]:hover,.button:hover
{
    color:#DDD;
    background:#070;
    cursor:pointer;
}

label.required:after
{
    content:'*';
    display:inline-block;
    padding:0;
    font-size:x-small;
    vertical-align:text-top;
}

p.required:after
{
    content:"* Required Field";
}

p.required
{
    font-size:x-small;
    text-align: right;
    line-height: 100%;
}

/* popout_dialog's and dialog's */

.popout_dialog,
.dialog_container
{
    vertical-align:middle;
    text-align: center;
}

.popout_dialog > div > div,
.dialog_container > div
{
    display:inline-block;
    border:solid 3px black;
    border-radius:10px;
    padding:10px;
    background:white;
    text-align:left;
    vertical-align:middle;
    z-index:1;
    position:relative;
}
.popout_dialog > div > div{
    text-align: center;
}
.popout_dialog{
    position:absolute;
    top:0;
    left:0;
    height: 100%;
    width: 100%;
}

.popout_dialog > div {
    display: table-cell;
    vertical-align: middle;
}
.popout_dialog:before,
.dialog_container:before{
    position:fixed;
    content:'';
    background:rgba(0,0,0,0.5);
    top:0;
    bottom:0;
    left:0;
    right:0;
    z-index:0;
}

.dialog_container h1,.popout_dialog h1
{
    font-weight:bold;
    text-align: center;
}

.dialog_container label,.popout_dialog label
{
    width:150px;
    display:inline-block;
    text-align:right;
    padding-right:.5em;
}

/* popout_dialog */
.popout_dialog:target
{
    display:table;
}

.popout_dialog
{
    display:none;
}

.popout_dialog > div > div > a:first-child > img
{
/*border + padding + 1/2 width*/
    top:-13px;
    right:-13px;
    border-width: 3px;
    padding:2px;
    width:16px;
    position:absolute;
    border:solid #000;
    background:#FFF;
    border-radius:10px;
}

/* dialog */
/* tx log */
.txlog
{
    width:100%;
}

.txlog *
{
    font-family:monospace;
    font-size:medium;
}

.txlog th
{
    text-align:left;
    font-weight:bold;
}

.txlog .th_date,.txlog .th_time,.txlog .th_duration,.txlog .th_amount,.txlog .th_balance
{
    width:5em;
}

.txlog .th_r
{
    width:2em;
}

.negative:before
{
    content:"-";
}

.dialog_container .submit,
.dialog_container .tandc{
    text-align: center;
}

.negative
{
    color:red;
}


/* password strength */

#pwdmeter {
    display: none;
    text-align: left;
}

#scorebarBorder {
    background: none repeat scroll 0 0 #333333;
}

#scorebar {
    background-image: url("/images/bg_strength_gradient.jpg");
    background-position: 0 0;
    background-repeat: repeat-y;
    width: 50px;
    border: 1px solid #000000;
    display: inline-block;
    text-align: center;
    color: #000;
}
#complexity {
    padding-left: 0.5em;
    font-size: small;
}