.left {
    clear:both;
    display:block;
    float:left;
    text-align:right;
    margin-right:0.25em;
    margin-left:auto;
}
.cleft {
    clear:both;
    float:left;
}

.right {
    clear:both;
    display:block;
    float:right;
    text-align:left;
    margin-left:0.25em;
    margin-right:auto;
}

.cright {
    clear:both;
    float:right;
}

.spacer {
    display:block;
    float:left;
    width:25%;
    text-align:right;
}

span.spacer {
    width:15%;
}

.center {
   text-align: center;
}

.box {
    border:1px dashed #cfdfff;
    background-color:#e8f9ff;
    padding-top:0.25em;
    padding-bottom:0.25em;
}

.important {
    font-variant:small-caps;
    font-weight:bold;
    border-bottom:1px dashed;
    background-color:#ffd7d7;
}

.lowlight {
    background-color:#dfefff;
}

.highlight {
    background-color:#f9f9ff;
}
.help {
    font-size:x-small;
}
/* Divs dont align to center properly since they autosize, fix it */
div.center {
   /*padding-left: 1em;
   padding-right: 1em;*/
   width:auto; /* Real width */
}
/* And for some reason tables dont center at all so fix this too */
div.center table {
   margin: 0px auto;
   width: 95%;
}

div.center table.results {
   width: 90%;
}

img {
    border-width:0px;
    vertical-align:top;
}

html, body {
    color:#002255;
    background-color:#cfdfff;
    font-family: tahoma,verdana,sans-serif;
    font-size:12pt;
    margin:0px;
    padding:0px;
}

/*Using a little CSS trick to get the title image to "scale", a repeating gradient is used as a background to the div
then the image of the antarctic mountains is floated to the right in the h1 tag*/
div.title {
    position:fixed;
    overflow:hidden;
    width:100%;
    top:0px;
    left:0px;
    height:81px;
    font-variant:small-caps;
    z-index:3;
    background-color:#cfdfff;
    background-image: url('http://www.npm.ac.uk/rsdas/projects/rothera/images/Antarctica_cont.gif');
    background-repeat: repeat-x;
    background-position: left;
}


.title h1 {
    padding:0px;
    margin:0px;
    text-indent:1em;
    /*Height of the atarctica image used in the title*/
    line-height: 81px;
    width:100%;
    background-image: url('http://www.npm.ac.uk/rsdas/projects/rothera/images/Antarctica.gif');
    background-repeat: no-repeat;
    background-position: right;
}

.title img.logo {
    position:absolute;
    float:right;
    top:0.125em;
    right:0.25em;
}

div.main {
    background:transparent;
    top:81px;
    margin-top:1em;
    position:relative;
    float:right;
    right:1.5%;
    width: 80%;
    text-align:justify;
    z-index:1;
}

div.nav {
    clear:both;
    background:transparent;
    position:fixed;
    float:left;
    left:1.5%;
    top:81px;
    margin-top:1em;
    overflow:auto;
    width: 15%;
    z-index:2;
}

.nav ul {
    width:100%;
    margin: 0px;
    padding:0px;
    list-style:none;
}

.nav h3 {
    text-align:center;
}

.nav img {
    max-width: 100%;
    text-align:center;
}

.nav p{
    padding:0px;
    margin:0px;
}

div.foot {
    clear:both;
    float:right;
    margin-top:7em;
    position:relative;
    overflow:hidden;
    right:1em;
    width:80%;
    z-index:1;
}

fieldset {
    margin-top:1em;
    padding-left: 1em;
    border:1px dashed #cfdfff;
}

legend {
    border:1px dashed #cfdfff;
    background-color:#e8f9ff;
    margin-bottom:1em;
}

button, input, textarea, select {
    clear:both;
    color:#002255;
    background-color:#f9f9ff;
    font-family: tahoma,verdana,sans-serif;
    font-weight:normal;
    border-width:1px;
    border-color:#a2bac7;
}
button, input {
    text-align:center;
}
.center input {text-align:left;}

input.button {
    border-style: outset;
    font-variant: small-caps;
    text-align: center;
}

form.button, form.button input {
    padding: 0px;
    margin: 0px;
    display: inline;
}

.select {
    background-color:#ffd7d7;
}

input.wide {
    font-weight:bold;
    font-size:14pt;
    width: 100%;
}

/*Overide login dialog defaults*/
#login_button {
    margin-left:11em;
}

.results table {
    width:100%;
}

.results th {
    text-align:center;
    border-bottom: 1px dashed;
}

.results td {
    text-align:center;
    border-width:0px;
    margin:0px;
    /*font-size:small;*/
}
.results td.just {
    text-align:justify;
}

.nav ul {
    margin:0px;
    padding:0px;
}

.nav li {
    display:block;
    text-align:center;
    border-width:0px;
    padding:0px;
    margin:0px;
    color:#cfdfff;
    border-bottom:1px dashed;
    border-right:1px dashed;
}

.nav li:hover {
    background: #e8f9ff;
    border-bottom:none;
    border-right:none;
    border-top:1px dashed;
    border-left:1px dashed;
}

a {
    font-weight:bold;
    text-decoration: none;
}

a.nav {
    font-weight:bold;
}
a:link {color: #335588;}
a:visited {color: #335588;}
a:hover {color: #aabbcc;}
.nav a:hover{background: #e8f9ff;font-weight:normal;}
a:active {color: #aabbcc;}