﻿/* cascaded style sheet "shadedsheet" by Thomas Eckert */
/*   design partly taken from theme "garland" found somewhere */

/* to do
	• z-index?
*/

body {
  margin: 0;
  padding: 0;
  background: #f1f2f2 url(backgroundstrip.png) repeat-x;
  color: #494949;
  font: .32cm/150% Verdana, sans-serif;
}


#header {
  position: absolute; left: 0; top: 0; right: 0;
  height: 70px;
  min-width: 660px; max-width: 930px;
  margin: 11px 35px 10px 10px;
  padding: 15px 10px 10px 20px;
  color: Silver;
  z-index: 4;
}
#header a, #header a:link, #header a:visited {color: Silver; text-decoration: none}
#header a:hover {color: WhiteSmoke; text-decoration: none}

#header #externals {
  position: absolute; top: 0; right: 0;
  margin: 0;
}

ul#externals li {
  margin: 0;
  padding: 0;
  float: left;
  background-image: none;
  list-style-type: none;
}

ul#externals li a, ul#externals li a:link, ul#externals li a:visited {
  background: transparent url(bg-navigation-item.png) no-repeat 50% 0;
  display: block;
  margin: 0 1em;
  padding: .75em 0 0;
  color: Silver;
}

ul#externals li a:hover {
  background: transparent url(bg-navigation-item-hover.png) no-repeat 50% 0;
  color: WhiteSmoke;
}


#navigation {
  position: absolute; left: 15px; top: 150px;
  width: 200px;
  margin: 0;
  z-index: 3;
}


.breadcrumb {
  position: absolute; top: 10px; left: 20px;
  max-width: 530px;
  font-size: 85%;
  color: #c65050;
}


#contents {
  background: white;
  opacity: .8; filter: alpha(opacity=80);
  position: absolute; left: 230px; top: 100px; right: 20px;
  min-width: 440px; max-width: 740px;
  min-height: 450px;
  z-index: 2;
  border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  box-shadow: 1px 1px 4px #aaa;
  -moz-box-shadow: 1px 1px 4px #aaa;
  -webkit-box-shadow: 1px 1px 4px #aaa;
  padding: 30px 20px 20px 20px;
}
/*
#contents:before {content: url(bg-contents-left.png); position: absolute; left: -50px; top: 0px; z-index: 2}
#contents:after {content: url(bg-contents-right.png); position: absolute; right: -50px; top: 0px; z-index: 2}
#contents {
  background: white;
  opacity: .7; filter: alpha(opacity=70);
  position: fixed; left: 230px; top: 91px; right: 20px;
  min-width: 400px; max-width: 700px;
  min-height: 400px;
  z-index: 2;
  border: white solid;
  border-width: 0 40px 0 40px;
  background: url(bg-contents.png) repeat-x white border-box;
  padding: 40px -20px 40px -20px;
}
*/

#watermark:before {
	content: url(fh-logo.png);
	position: absolute; left: 5px; top: 5px;
	opacity: .1; filter: alpha(opacity=10);
	z-index: 1;
}


.title {
  font-size: 200%;
  margin-top: .5em; margin-bottom: .2em;
}


h1, h2, h3, h4, h5, h6 {
  margin: 0; margin-bottom: .3em;
  padding: 0; padding-top: .8em;
  font-weight: normal;
}

h1 {font-size: 170%}
h2 {font-size: 150%; line-height: 120%}
h3 {font-size: 130%}
h4 {font-size: 120%}
h5 {font-size: 100%; font-weight: bold}
h6 {font-size: 100%; font-style: italic}

.top {padding-top: 0px; margin-top: 0px}

p {margin: 0.6em 0 1.2em; padding: 0}

.sub {font-size: 75%; opacity: .8; filter: alpha(opacity=80); margin-top: .3em}


a:link, a:visited {color: #b000b0; text-decoration: none}
a:hover {color: #8a0101; text-decoration: underline}
a:active, a.active {color: #ac5959}

hr {
  margin: 0; padding: 0; border: none;
  height: 1px;
  background: #7a7a7a;
}

