
/* ---------------------------------------- general ---------------------------------------- */

body       { font: 62.5% Verdana, Arial, Helvetica, sans-serif; /* sets default font size to 10px = 1em */
             background: #000000; color: #000000; margin: 0; padding: 0; text-align: center; }
table, td  { font-size: 100%; } /* to fix IE 5.x font inheritance bug */
#container { width: 769px; margin: 0 auto; text-align: left; font-size: 1.2em; position: relative; }

h1         { font-size: 1.3em; margin: 1em 0; }
h2         { font-size: 1.2em; color: #339; margin: 1em 0 0.5em 0; }
h3         { font-size: 1em; margin: 0 0 0.5em 0; }
p          { line-height: 1.5em; margin: 0 0 1em 0; }
li         { line-height: 1.5em; margin: 0 0 0.5em 0;  }
hr         { height: 1px; border: 1px dotted; color: #999999; background: #999999; clear: both; margin: 0; }
input, textarea { font: 1em Verdana, Arial, Helvetica, sans-serif; }

.right     { float: right; margin: 0 0 10px 15px; }
.left      { float: left; margin: 0 15px 10px 0; }
.center    { margin: 1em auto; text-align: center; }
.top       { margin-top: 0; }
.bottom    { margin-bottom: 0; }
.indent    { padding-left: 15px; }
.textRight { text-align: right; }
.small     { font-size: 0.8em; }
.none      { list-style-type: none; margin: 0; padding: 0; }
.clear     { clear: both; }
.border    { border: 1px solid #000; }
.error     { color: #000; font-weight: bold; text-align: center; font-size: 1.4em; background: #ff9; border: 5px solid #fc0; padding: 10px; }
.frame     { background: url("/images/portraitFrame.gif") top left no-repeat; padding: 11px; }
.nobr      { white-space: nowrap; }
.hide      { position: absolute; top: 0; right: -10px; }

/* ----------------------------------------- links ----------------------------------------- */

a:link    { color: #900; font-weight: bold; text-decoration: none; }
a:visited { color: #963; font-weight: bold; text-decoration: none; }
a:hover, a:active, a:focus { color: #33c; font-weight: bold; text-decoration: underline;  }

#sections a { text-decoration: none; border-bottom: 1px solid #fc9; position: relative; }

#nav a:link, #nav a:visited { color: #fff; }
#nav a:hover, #nav a:active, #nav a:focus { color: #f96 }

#foot a:link, #foot a:visited, #lang a:link, #lang a:visited { color: #6cf; font-weight: normal; }
#foot a:hover, #foot a:active, #lang a:hover, #lang a:active, #lang a:focus { color: #f96; font-weight: normal; }

#skip a { color: #fff; display: block; padding: 2px 8px; background: #ffff }
#skip a:active, #skip a:focus { background: #96f; }

/* ------------------------------------------ head ----------------------------------------- */

.homepage      { background-image: url("/images/bannerHome.jpg"); height: 175px; }
.homepage h1   { margin: 0; }
.subpage       { background-image: url("/images/bannerSmall.jpg"); height: 120px; }

#head          { height: 80px; padding: 0 0 0 20px; background-repeat: no-repeat; background-position: top left; }
#skip          { clear: left; float: left; }
#lang          { position: absolute; top: 2px; right: 10px; background: #000; }
#logo          { float: left; margin-top: 10px; }
#banner        { position: relative; background-repeat: no-repeat; background-position: bottom left; }
#bubble1       { position: absolute; top: 125px; left: 120px; width: 90px; text-align: center; }
#bubble2       { position: absolute; top: 125px; right: 165px; width: 110px; text-align: center; }
.talk          { font-size: 0.9em; }
a.talk:link, a.talk:visited, a.talk:hover, a.talk:active { font-weight: normal; }

#version       { position: absolute; bottom: 0; right: 0; z-index: 100; }
#nav           { width: 100%; float: left; background: #c00 url("/images/nav.jpg") repeat-y top left; text-align: center; }
#nav a         { padding-right: 25px; }
.home          { vertical-align: bottom; margin: -5px 5px 0 0px; }
.star          { vertical-align: middle; }
.icon          { float: left; vertical-align: middle; margin: 0 10px 5px 0; }

/* ------------------------------------- home page body ------------------------------------ */

#sections      { float: left; width: 100%; background: #ffffff url("/images/paper.jpg") no-repeat bottom left; padding-bottom: 1em; }
#sections div  { float: left; width: 256px; padding-bottom: 1em; }
#sections p    { clear: left; margin: 10px 10px 0 25px; display: inline-block; }

/* ------------------------------------- sub pages body ------------------------------------ */

#binderHead    { background: #e9eef2 url("/images/binderBody.jpg") repeat-y top left; float: left; }
#binderFoot    { background: url("/images/binderFoot.jpg") no-repeat bottom left; float: left; }
#binderFoot #margins { padding-bottom: 130px; padding-left: 60px; }
#sideNav       { width: 210px; float: left; background: url("/images/binderHead.jpg") no-repeat top left; padding: 50px 0; }
#sideNav h3    { width: 180px; }
#sideNav span  { padding: 10px 5px 5px 10px; margin-left: 10px; display: block; }
#sideNav .red  { background: url("/images/labelRed.gif") no-repeat top left; border-bottom: 1px solid #cc3333; }
#sideNav .blue { background: url("/images/labelBlue.gif") no-repeat top left; border-bottom: 1px solid #3333cc; }
#sideNav p     { margin: 0 20px 0 10px; clear: left; }
#sideNav ul    { margin: 0; padding: 0; }
#sideNav li    { margin: 0 25px 0.5em 25px; }
#content       { width: 559px; float: left; background: url("/images/binderHead.jpg") no-repeat top right; }
#margins       { padding: 30px 20px; float: left; }
#message       { background: #fff url("/images/binderMessage.jpg") no-repeat top left; text-align: center; height: 200px; }
#message p     { margin: 50px 120px 50px 280px; }
#flash         { background: #e9eef2; }
#blank         { width: 769px; background: url("/images/plainHead.gif") no-repeat; float: left; padding-top: 2em; text-align: center; }

/* ------------------------------------------ foot ----------------------------------------- */

#foot          { color: #ffffff; clear: left; margin: 0; padding: 20px 0; display: inline-block; }