body {
    font: 100% Verdana, Helvetica, Arial, sans-serif;
    background: #3CC url('/images/bg.gif') top right repeat-x fixed;
    margin: 0;	padding: 0;
    text-align: center;
    color: #FFF;
    padding-bottom:10px;
}

#mxContainer {
    width: 1024px;
    background: #34679B;
    margin: 0 auto;
    border-left: 1px solid #000;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
    text-align: left;
    padding-top:25px;
    position:relative;
}

a:link, a:active, a:visited { text-decoration:none; }

#mxPass { background:url('/images/pass.jpg') no-repeat; width:200px; height:200px;
          position:absolute; right:15px; padding:48px 30px; color:#D02619; }
#mxPass h4 { font-size:80%; padding-top:0; padding-bottom:10px; margin:0; }
#mxPass form { margin:0; padding:0; }
#mxPass label { color:#D02619; font-size:8pt; font-weight:bold; }


#mxMenu { border-top:1px solid #34679B; border-bottom:1px solid #34679B; }

#mxMenu .sf-menu { width:100%; background:#FFCD31; font-size:10pt; }
#mxMenu .sf-menu li {
    background-image:none;
    background:#FFCD31;
}

#mxMenu .sf-menu #current a { background: red; color:white; } /* NB: can change BG color of anchor's container, but not text...so using a */

#mxMenu .sf-menu a { border:none; font-weight: bold; }
#mxMenu .sf-menu li a { border-left:1px solid #34679B; }
#mxMenu .sf-menu li a:hover { background:red; color:white; }
#mxMenu .sf-menu ul li a { border:none; }

.mxContent { clear:both; padding:10px 15px; }
/* should perhaps swap orange links to more specific selector and have this as default (less specific, easy to override)*/
/* 2010-04-26 swapped to class */
.mxContent a:link, .mxContent a:active, .mxContent a:visited { color:#FFCD31; font-weight:bold; }
.mxContent a:hover { color:#D02619; }

#mxFooter { clear:both; font-size:80%; padding:20px 20px; }
#mxFooter a:link, #mxFooter a:active, #mxFooter a:visited { color:#FFF; }
#mxFooter a:hover { color:#FFCD31; font-weight:bold; }

.coloured { color:#3CC; }

div.message {
    font-weight:bold;
    color:white;
}

.failure {
    color:yellow;
    border-bottom:1px solid red;
}

pre {
    background-color: #eee;
    padding: 10px;
    font-size: 11px;
}

.fieldWithErrors {
    padding: 2px;
    background-color: red;
    display: table;
}

#errorExplanation {
    width: 400px;
    border: 2px solid red;
    padding: 7px;
    padding-bottom: 12px;
    margin-bottom: 20px;
    background-color: #f0f0f0;
}

#errorExplanation h2 {
    text-align: left;
    font-weight: bold;
    padding: 5px 5px 5px 15px;
    font-size: 12px;
    margin: -7px;
    background-color: #c00;
    color: #fff;
}

#errorExplanation p {
    color: #333;
    margin-bottom: 0;
    padding: 5px;
}

#errorExplanation ul li {
    font-size: 12px;
    list-style: square;
    color: #000;
}