body
{
  font-family: arial, sans-serif;
  font-size: 100%;
  color: #000;
  background-color: #CCC;
  margin: 10px;
  text-align: justify;
}

/* -------- */
/*   Page   */
/* -------- */
	
#page
{
  background-color: #FFF;
  border: #000 1px solid;
  margin: 0px;
  padding: 5px;
  min-width: 825px;
}  

#top
{
  clear: both;
  float: none;
}

#menu
{
  margin-top: 5px;
  margin-left: 10px;
  width: 180px;
  float: left;
  text-align: left;
}

#content
{
  margin-left: 205px; /* equals to the menu width + 25px */
  margin-right: 10px;
  margin-top: 15px;
  margin-bottom: 15px;
  clear: none;
  float: none;
  min-width: 610px
}

#bottom
{
  font-size: 80%;
  font-style: italic;
  clear: both;
  float: none;
  border-width: 1px 0 0 0;
  border-style: solid none none none;
  border-color: #000;
  margin: 5px 10px 5px 10px;
}

img {
  background-color: transparent;
  border: none;
  margin: 0;
  vertical-align: middle;
}

/*
 * Rounded corners are inspired from:
 * http://kalsey.com/2003/07/rounded_corners_in_css/
 */

.roundcontent {
  background-color: #F5F5F5;
}

.roundtop { 
  background: url(../images/corners/tr.gif) no-repeat top right; 
}

.roundbottom {
  background: url(../images/corners/br.gif) no-repeat top right; 
  margin: 0;
}

img.corner {
  width: 15px;
  height: 15px;
  border: none;
  display: block !important;
}

/* ------------ */
/*   Headings   */
/* ------------ */

h1 {
  font-size: 170%;
  border-width: 0 0 1px 0;
  border-style: none none solid none;
  border-color: #000;
  margin: 10px 10px 10px 10px;
  line-height: 27px;
}

span.logo { 
  color: #D42F2F;
}

h2 {
  color: #000;
  font-size: 140%;
  font-weight: bold;
  margin: 5px 10px 5px 10px;
}

h3 {
  color: #000;
  font-size: 110%;
  font-weight: bold;
  margin: 10px 10px 5px 10px;
}

/* -------------- */
/*   Paragraphs   */
/* -------------- */

p {
  color: black;
  font-weight: normal;
  margin: 5px 10px 10px 10px;
}

.warning {
  background-image: url('../images/tango/32x32/dialog-warning.png');
  background-repeat: no-repeat;
  background-position: 5px center;
  border: 1px solid #CCC;
  background-color: #FFFFE0;
  padding: 10px;
  padding-left: 50px;
  margin: 5px 10px 10px 10px;
}

.warning p {
  margin: 5px 5px 5px 5px;
}

.error {
  background-image: url('../images/tango/32x32/dialog-error.png');
  background-repeat: no-repeat;
  background-position: 5px center;
  border: 1px solid #CCC;
  background-color: #FFFFE0;
  padding: 10px;
  padding-left: 50px;
  margin: 5px 10px 10px 10px;
}

.error p {
  margin: 5px 5px 5px 5px;
}

.information {
  background-image: url('../images/tango/32x32/dialog-information.png');
  background-repeat: no-repeat;
  background-position: 5px center;
  border: 1px solid #CCC;
  background-color: #FFFFE0;
  padding: 10px;
  padding-left: 50px;
  margin: 5px 10px 10px 10px;
}

.information p {
  margin: 5px 5px 5px 5px;
}

blockquote {
  color: black;
  font-size: 95%;
  line-height: 15px;
  font-weight: normal;
  font-style: italic;
  margin: 15px 10px 15px 20px;
}

.small {
  font-size: 80%;
}

.tooltip { 
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 2;
  width: 380px;
  visibility: hidden;
  font: small 'MS Comic Sans', 'Arial', sans-serif;
  background-color: #FFFFE6;
  padding: 20px 20px 20px 50px;
  margin-top: 10px;
  border: 1px solid black;
  background-image: url('../images/tango/32x32/dialog-information.png');
  background-repeat: no-repeat;
  background-position: 5px center;
  text-align: left;
}

.systemChecksOk { 
  color: green;
}

.systemChecksKo { 
  color: red;
}

/* ------------------- */
/*   Links and menus   */
/* ------------------- */

a {
  color: #3F3975;
  background-color: transparent;
  text-decoration: none;
}

a:visited {
  color: #9898CB;
}

a:hover {
  color: #E06611;
  text-decoration: underline;
}

a:active {
  color: #000000;
  text-decoration: underline;
}

a.menu {
  background-image: url('../images/menu/unselected-10x12.png');
  background-repeat: no-repeat;
  background-position: 0px 0px;
  padding-left: 12px;
}

a.menu:hover {
  background-image: url('../images/menu/selected-10x12.png');
  background-repeat: no-repeat;
  background-position: center left;
  padding-left: 12px;
}

a.selectedMenu { 
  background-image: url('../images/menu/selected-10x12.png');
  background-repeat: no-repeat;
  background-position: center left;
  padding-left: 12px;
  text-align: left;
}

/* --------- */
/*   Lists   */
/* --------- */

ul, ol, dl {
  color: black;
}

/* --------- */
/*   Table   */
/* --------- */

th {
  color: #000;
  font-weight: normal;
  text-align: center;
  background-color: #D3DCE3;
  padding: 2px;
  white-space: nowrap;
}

td {
  font-size: 95%;
  color: #000;
  padding: 2px;
  text-align: left;
}

tr.row1 td
{
  background-color: #DDDDDD;
}

tr.row2 td
{
  background-color: #CCCCCC;
}

tr td.invalid
{
  text-align: center;
  background-color: red;
}

tr td.valid
{
  text-align: center;
  background-color: #98FB98;
}

/* ------------ */
/*   Calendar   */
/* ------------ */

.calendar {
  background-color: #FFF;
  padding: 0px;
  border: 1px solid;
  margin-bottom: 5px;
}

table.calendarContainer { 
  border-width: 0;
  border-spacing: 0;
  border-collapse: collapse;
}

table.calendarContainer td { 
  padding: 0;
  border-width: 0;
}

table.calendar th {
  background-color: #FFF;
}

table.calendar td {
  text-align: center;
  width: 30px;
}

td.month
{
  font-weight: bold;
}

td.weekend
{
  background-color: #DDDDDD;
}

td.selectedDay
{
  font-weight: bold;
  background-color: #98FB98;
}

/* -------- */
/*   Form   */
/* -------- */

form {
  font-size: 95%;
  padding: 15px;
  color: #000;
  border: gray 1px solid;
  background: #D3DCE3;
  margin: 5px 10px 10px 10px;
}

fieldset {
  font-weight: normal;
  padding: 0px;
  margin: 0px;
  border: 0px;
}

fieldset.install {
  border: 1px solid black;
  margin-top: 10px;
  margin-bottom: 10px;
}

legend {
  color: #000;
  background: transparent;
  border: 0px;
  margin-left: 10px;
}

form.table { 
  margin: 10px 10px 10px 10px;
  padding: 0px;
  color: #000;
  border: 0px;
  background: transparent;
}

form.table table { 
  width: 100%;
}

label {
  font-size: 95%;
  color: #000;
  font-weight: normal;
  text-align: right;
  width: 37%;
  float: left;
  display: inline-block;
  margin-right: 5px;
}

input {
  font-family: arial, sans-serif;
  font-weight: normal;
  font-size: 95%;
  background: #FAFAFA;
  margin-bottom: 7px;
  margin-right: 3px;
  vertical-align: middle;
}

input[type="checkbox"] {
  background: transparent;
}

input[type="image"] {
  background: transparent;
}

input[type="submit"] {
  font-weight: normal;
  cursor: pointer;
}

input:focus {
  background: #FFF;
}

select {
  font-family: arial, sans-serif;
  font-weight: normal;
  font-size: 95%;
  background: #FAFAFA;
  margin-bottom: 7px;
  margin-right: 3px;
  vertical-align: middle;
}

select:focus {
  background: #FFF;
}

textarea {
  font-family: arial, sans-serif;
  font-weight: normal;
  font-size: 95%;
  background: #FAFAFA;
  margin-bottom: 7px;
  margin-right: 3px;
  vertical-align: middle;
}

textarea:focus {
  background: #FFF;
}

div.form {
  clear: both;
}

object { 
  margin: 0;
}

noscript { 
  margin: 0;
}

script { 
  margin: 0;
}