body {
  background: #000 url('img/algo-logo.png') center fixed;
}

.navbar {
  position: absolute;
  z-index: 100;
}

.navi0 {
  background: #bbb;
  height: 25px;
  border-color: #fff;
  border-style: solid;
  border-width: 0 0 2px 0;
}

.navi1 {
  background: #ccc;
  height: 25px;
  border-color: #fff;
  border-style: solid;
  border-width: 2px 0 0 0;
}



.dropdown {
  margin: 2px 5px 0 5px;
  border-width: 0;
  border-color: #fff;
  border-style: solid;
  width: 125px;
}

.dropdown * {
  font-size: 14px;
  background: #444;
  color: #fff;
  padding: 3px;
  display: none;
  border-color: #bbb;
  border-style: solid;
  border-width: 0;
  cursor: default;
}

.dropdown .top {
  font-size: 14px;
  font-weight: bold;
  color: #333;
  height: 20px;
  padding: 3px 0 0 0;
  width: 125px;
  text-align: center;
  cursor: pointer;
  border: 0;
}

.dropdown .group {
  padding: 0;
}

.dropdown .entries {
  top: -1px;
  left: 133px;
  width: 125px;
  padding: 0;
  border-width: 1px 1px 0 1px;
}

.dropdown .entry, .dropdown .header {
  border-width: 0 0 1px 0;
  width: auto;
}

.dropdown .entry {
  cursor: pointer;
}

.dropdown .header {
  background: #444 url('img/next.png') no-repeat right 4px;
  padding-right: 15px;
  width: 107px;
}

.dropdown .side {
  top: -1px;
  left: -9px;
  width: 7px;
  height: 100%;
  background: #ddd;
  padding: 1px 0 0 0;
  border-width: 0 0 0 1px;
}

.dropdown:hover {
  border-color: #bbb;
  margin: 2px 3px 0 5px;
  border-width: 0 1px;
  left: -1px;
}

.dropdown:hover .top {
  height: 26px;
  color: #222;
  border: 0;
}

.dropdown .group:hover > .header {
  background: #222 url('img/nexth.png') no-repeat right 4px;
}

.dropdown .entry:hover {
  background: #777;
}

.dropdown > .drop0 {
  background: url('img/tab3.png') no-repeat ;
}

.dropdown:hover > .drop0 {
  background: url('img/tab3.png') no-repeat 0 -30px;
}

.dropdown > .drop1 {
  background: url('img/tab4.png') no-repeat ;
}

.dropdown:hover > .drop1 {
  background: url('img/tab4.png') no-repeat 0 -30px;
}

.dropdown > .drop2 {
  background: url('img/tab5.png') no-repeat ;
}

.dropdown:hover > .drop2 {
  background: url('img/tab5.png') no-repeat 0 -30px;
}

.dropdown > .drop3 {
  background: url('img/tab2.png') no-repeat ;
}

.dropdown:hover > .drop3 {
  background: url('img/tab2.png') no-repeat 0 -30px;
}

.dropdown > .drop4 {
  background: url('img/tab1.png') no-repeat ;
}

.dropdown:hover > .drop4 {
  background: url('img/tab1.png') no-repeat 0 -30px;
}

.dropdown > .drop5 {
  background: url('img/tab6.png') no-repeat ;
}

.dropdown:hover > .drop5 {
  background: url('img/tab6.png') no-repeat 0 -30px;
}



.abs {
  width: 10px;
}

.scrollup {
  background: url('img/scrollup.png') no-repeat;
}

.scrolldown {
  background: url('img/scrolldown.png') no-repeat;
}

.scrollup:hover {
  background: url('img/scrolluph.png') no-repeat;
}

.scrolldown:hover {
  background: url('img/scrolldownh.png') no-repeat;
}




/* The following piece of css, namely the "screen" stuff,
is not correctly formatted css, as it is only used by a PHP script
that is requested by the JavaScript environment of Algohol.
That is the reason why it is commented out.
It is kept in the css file for ease of use.
All numbers are in the "px" unit and must be written without a unit.
screen {
  hheight: 25;  the height of a window header
  margin_g: 5;    the general margin of a window
  margin_t: 2;  the margin at the top of a window
  bw: 16;       box width; includes the window icon and the minimize/maximize/close buttons.
  bh: 16;       box height; includes the window icon and the minimize/maximize/close buttons.
}
*/

.window {
  background: #fff;
}

.window > .tl {
  background: url('img/corners.png') no-repeat -20px 0;
}

.window > .t {
  background: #999;
}

.window > .tr {
  background: url('img/corners.png') no-repeat -25px 0;
}

.window > .r {
  background: #999;
}

.window > .br {
  background: url('img/corners.png') no-repeat -30px 0;
}

.window > .b {
  background: #999;
}

.window > .bl {
  background: url('img/corners.png') no-repeat -35px 0;
}

.window > .l {
  background: #999;
}

.window#active > .tl {
  background: url('img/corners.png') no-repeat 0 0;
}

.window#active > .t {
  background: #444;
}

.window#active > .tr {
  background: url('img/corners.png') no-repeat -5px 0;
}

.window#active > .r {
  background: #444;
}

.window#active > .br {
  background: url('img/corners.png') no-repeat -10px 0;
}

.window#active > .b {
  background: #444;
}

.window#active > .bl {
  background: url('img/corners.png') no-repeat -15px 0;
}

.window#active > .l {
  background: #444;
}

.window > .title {
  color: #fff;
}

.window > .data {
  background: #fff;
}

.window > .icon {
  background-repeat: no-repeat;
  background-image: url('../icons/img/default.png');
}

.window > .title {
  font-size: 14px;
}

.window > .options > * {
  background-image: url('img/action_icons.png');
}

.window > .options > .minimize {
  background-position: 0 0;
}

.window > .options > .minimize:hover {
  background-position: -16px 0;
}

.window > .options > .maximize {
  background-position: -32px 0;
}

.window > .options > .maximize:hover {
  background-position: -48px 0;
}

.window_max > .options > .maximize {
  background-position: -64px 0;
}

.window_max > .options > .maximize:hover {
  background-position: -80px 0;
}

.window > .options > .close {
  background-position: -96px 0;
}

.window > .options > .close:hover {
  background-position: -112px 0;
}



.appboxes * {
  width: 100px;
  margin: 2px;
  padding: 2px;
  border-color: #fff;
  border-style: outset;
  border-width: 1px;
  float: left;
  cursor: default;
}

.appboxes .current {
  border-style: inset;
}

.appboxes *:hover {
  background: #e2fbff;
}

.appboxes .current:hover {
  background: #d1ffea;
}



.clock {
  margin: 3px 2px 0 0;
  padding: 2px;
  border-left: 1px solid #aaa;
  position: absolute;
  right: 0;
}