/*
 * main.css - EDV-Service Jenczewski - Zentrale Styles
 * - Diese Version: Hintergrund schwarz, Freiflaechen
 * (c) 2012 Holger Jenczewski
 */
@import url('/css/default.css');
@import url('/css/menu.css');
@font-face {
    font-family: 'EuphemiaRegular';
    src: url('/css/euphemia-webfont.eot');
    src: url('/css/euphemia-webfont.eot?#iefix') format('embedded-opentype'),
         url('/css/euphemia-webfont.woff') format('woff'),
         url('/css/euphemia-webfont.ttf') format('truetype'),
         url('/css/euphemia-webfont.svg#EuphemiaRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
html, body {
  margin: 0;
  border: 0 none;
  padding: 0;
}
html {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #000002;
  /* Mozilla syntax: */
  /*background-image: -moz-radial-gradient(right top -45deg, rgb(54, 54, 54) 0, rgb(0, 0, 2) 30%);
  background-position: right top;
  background-repeat: no-repeat;
  background-attachment: fixed;*/
}
body {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  font-family: 'Helvetica','Verdana',sans-serif;
  font-size: 10px; /* standard measurement */
  /* default background tile */
  background: #000002 url('/images/backgrounds/tile.png') repeat fixed center center;
  /* Radial gradient, top right corner, simulating a light source. */
  background-image: -webkit-gradient(radial, right top, 0, center center 25%, from(#363636), to(#000002));
  background-image: -webkit-radial-gradient(right top, circle farthest-corner, rgb(54, 54, 54) 0, rgb(0, 0, 2) 25%);
  background-image: -webkit-radial-gradient(right top, circle farthest-corner, rgba(128, 128, 128, .5) 0, rgba(0, 0, 2, .5) 25%);
  background-image: -moz-radial-gradient(right top, circle farthest-corner, rgba(128, 128, 128, .5) 0, rgba(0, 0, 2, .5) 25%);
  background-image: -o-radial-gradient(right top, circle farthest-corner, rgba(128, 128, 128, .5) 0, rgba(0, 0, 2, .5) 25%);
  background-image: -ms-radial-gradient(right top, circle farthest-corner, rgba(128, 128, 128, .5) 0, rgba(0, 0, 2, .5) 25%);
  background-image: radial-gradient(right top, circle farthest-corner, rgba(128, 128, 128, .5) 0, rgba(0, 0, 2, .5) 25%);
  background-position: right top;
  background-repeat: no-repeat;
  background-attachment: fixed;
  /* Same plus the tile below: */
  background-image: -webkit-gradient(radial, right top, 0, center center 25%, from(#363636), to(#000002)),url('/images/backgrounds/tile.png');
  background-image: -webkit-radial-gradient(right top, circle farthest-corner, rgb(54, 54, 54) 0, rgb(0, 0, 2) 25%),url('/images/backgrounds/tile.png');
  background-image: -webkit-radial-gradient(right top, circle farthest-corner, rgba(128, 128, 128, .5) 0, rgba(0, 0, 2, .5) 25%),url('/images/backgrounds/tile.png');
  background-image: -moz-radial-gradient(right top, circle farthest-corner, rgba(128, 128, 128, .5) 0, rgba(0, 0, 2, .5) 25%),url('/images/backgrounds/tile.png');
  background-image: -o-radial-gradient(right top, circle farthest-corner, rgba(128, 128, 128, .5) 0, rgba(0, 0, 2, .5) 25%),url('/images/backgrounds/tile.png');
  background-image: -ms-radial-gradient(right top, circle farthest-corner, rgba(128, 128, 128, .5) 0, rgba(0, 0, 2, .5) 25%),url('/images/backgrounds/tile.png');
  background-image: radial-gradient(right top, circle farthest-corner, rgba(128, 128, 128, .5) 0, rgba(0, 0, 2, .5) 25%),url('/images/backgrounds/tile.png');
  background-position: right top, center center;
  background-repeat: no-repeat, repeat;
  background-attachment: fixed, fixed;
  color: #363636;
  text-align: center; /* IE auto-margins hack */
  z-index: 1;
}
header, nav, section, article, footer {
  display: block;
}
hr {
  clear: both;
  margin: 1em 0;
}
h1,h2,h3,h4,h5,h6 {
  display: block;
  font-family: "EuphemiaRegular",Euphemia,"Trebuchet MS",Trebuchet,Helvetica,sans-serif;
  font-weight: normal;
  color: #1a72d8;
  margin-bottom: 0;
}
h1 {
  font-size: 125%;
  margin-bottom: 1em;
}
h2 {
  font-size: 115%;
  margin-top: 1em;
  margin-bottom: .5em;
}
p, form {
  margin-top: .8em;
}
label {
  display: inline-block;
  width: 8em;
}
label:after {
  content: ":";
}
input[type="text"], textarea {
  font-size: 1em;
  border: .1em solid #1a72d8;
  border-radius: .3em;
  width: 20em;
  padding: .2em;
  box-shadow: 0 .1em .1em .2em rgba(128, 128, 128, .5) inset;
}
a, a:visited {
  font-weight: normal;
  color: #1a72d8;
  text-decoration: underline;
}
/*
 * lists inside teaser
 */
.col > ul {
  position: relative;
  margin: 0;
  padding: 0 0 0 1em;
}
.col > ul > li {
  position: relative;
  margin: 0;
  padding: 0;
  list-style-type: none;
}
.col > ul> li:before {
  display: block;
  position: absolute;
  left: -1em;
  content: "-";
  color: #1a72d8;
}
/*
 * photos
 */
.photo {
  display: block;
  float: right;
  position:relative;
  top: -3em;
  margin: 2em;
  padding: .8em;
  box-shadow: 0 .3em .5em rgba(96,96,96,.5);
}
/*
 * Impressum
 */
.impressum th {
  vertical-align: top
}
.spacer {
  clear: both;
  width: 100%;
  height: .8em;
}
/*
 * whole page area
 */
#page {
  position: relative;
  width: 80em;
  margin: 0 auto 0 auto;
  padding-top: 3.2em;
  text-align: left;
  /* DEBUG: */
  /*min-height: 32em;
  background-color: yellow;*/
  z-index: 10;
}
/*
 * header bar - TODO: will contain breadcrumb for subpages!
 */
header, #header {
  /*height: 106px;*/
  margin: 0 0 1em 0;
  padding: 0;
}
header>a, #header>a {
  display: block;
  float: left;
  margin: 0 0 .5em .5em;
}
header>a>img, #header>a>img {
  display: block;
  width: 405px;
  height: 48px;
  margin: 0;
  padding: 0;
}
/* Use breadcrumb div for clearing! */
#breadcrumb {
  clear: both;
  margin-top: 1em;
}

/*
 * page content
 */
#content {
  position: relative;
  padding: 2em;
  border-radius: .5em;
  background-color: #fafafa;
  font-size: 140%;
  /*margin-left: 14em;*/
}
.portal #content {
  padding: 1em;
}
/*
 * banner on portal page
 */
#banner {
  position: relative;
  width: 100%;
  height: auto;
  background-color: #fff;
  margin: 0 0 1em 0;
  padding: 0;
  font-size: 133%; /* set here to get border radius consistent! */
}
#banner>img {
  display: block;
  width: 100%;
  height: auto;
  padding: 0;
  border-radius: .3em;
}
#banner>p {
  position: absolute;
  left: 0;
  bottom: 0;
  margin: 0;
  padding: .5em .8em;
  /*font-size: 125%;*/
  /*color: #1058a8;*/
  color: #fafafa;
  background-color: rgba(200,200,200,.4);
  border-top-right-radius: .4em;
  border-bottom-left-radius: .4em;
}
footer, #footer {
  clear: both;
  font-size: 1px;
  color: #fafafa;
}
/*
 * teaser
 */
.col {
  width: 32%;
}
.col > h1 {
  margin-left: .67em;
}
.left.col {
  float: left;
  position: relative;
  /*background-color: yellow;*/
}
.right.col {
  float: right;
  position: relative;
  /*background-color: red;*/
}
.center.col {
  float: none;
  margin: 0 0 0 34%;
  /*background-color: green;*/
}
