/************************************************
 *
 * Stylesheet for http://www.hotti.ch/
 * Copyright (c) 2003 Daniel Hottinger
 *
 ************************************************/


body {
  color: #000000;
  background-color: #f5f5f5;
  margin: 0px;
}

#body {
  margin-left:   1em;
  margin-right:  1em;
  margin-top:    1em;
  margin-bottom: 3em;
}

@media screen {
  body {
    font-family: sans-serif;
  }
  em { 
    font-weight: bold; 
    font-style: normal; 
  }
}

@media print {
  #header, #footer, #menupanel {
    display: none;
  }
  #body a[href]:after {
    content: " [" attr(href) "] ";
    color: #222;
  }
  #body a[href]:before {
    content: "";
  }
}
/******************
 * Header
 ******************/

#header {
  left: 0; right: 0; top: 0; bottom: auto;
  padding: 0.5em;
  color: inherit;
  background-color: #20b2aa;
}

/******************
 * Menu
 ******************/

#menupanel {
  right: 0px;
  float: right;
  max-width: 15em;
  padding-bottom: 0.5em;
  padding-left:   0.5em;
  padding-right:  0.5em;
  margin-left:    1em;
  margin-bottom:  1em;
  text-align: center;
  color: inherit;
  background-color: #20b2aa;
}

.menu td {
  font: menu;
  background: #ffc;
  border-bottom: 1px solid #cc9;
  border-right:  1px solid #cc9;
  padding: 3px;
}

.menu tr.title td {
  color: inherit;
  background: #dd9;
  border-bottom: 1px solid #996;
  border-right: 1px solid #996;
}

.menu tr.blank td {
  background: transparent;
  border: none;
  height: 0.5em;
}

.menu form {
  font-size: smaller;
}

/* special menu items */
.menu tr.menuitem td {
  padding: 0;
}

.menu tr.menuitem a {
  text-decoration: none;
}

.menu tr.menuitem a, .menu tr.menuitem span {
  padding: 3px 0;
  text-indent: 3px;
  display: block;
  width: 100%;
}

.menu span, .menu tr.menuitem a:hover {
  background: #dda;
}

.menu td.menulevel1 span, .menu td.menulevel1 a {
  font-size: smaller;
  text-indent: 1em;
}


/******************
 * Footer
 ******************/

#footer {
  width: 80%;
  padding: 0.5em;
  color: inherit;
  background-color: #eeeeee;
  border: 1px solid #aa9999;
  font-size: smaller;
}

/******************
 * Tags
 ******************/

a              { font-weight: bold }
a:link         { color: #191970; background-color: transparent; }
a:visited      { color: #dc1436; background-color: transparent; }
a:active       { color: #c71585; background-color: transparent; }

a.toc          { font-weight: normal; font-size: smaller }
a.ext:before   { content: url("../.img/extlink.png");    margin-right: 0.3em; }
a[hreflang|=de]:before 
               { content: url("../.img/german.png");     margin-right: 0.3em; }
a.mark:after   { content: url("../.img/scrolldown.png"); margin-left:  0.3em; }
a.mail:before  { content: url("../.img/mail.png");       margin-right: 0.3em; }

dt { font-weight: bold; margin-bottom: 1ex; }
dd { margin-bottom: 1em; }

span.fileinfo {
  margin-left: 1em;
  font-style: normal;
  font-weight: normal;
}

.warning {
  color: inherit;
  background-color: #f08080;
  padding: 0.5em;
  width: 80%;
  text-align: left;
}

div.shot img {
  float: left;
  clear: left;
  margin-right: 1em;
}

.news {
  margin-bottom: 3px
}

span.bps2M   { color: green;   background-color: transparent; }
span.bps10M  { color: blue;    background-color: transparent; }
span.bps100M { color: red;     background-color: transparent; }
span.dot1    { color: #ff8c00; background-color: transparent; }
span.dot2    { color: lime;    background-color: transparent; }