/* feldwaldwiese.de stylesheet fuer Bildschirmausgabe */


/* Allgemeine Elementeigenschaften */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

html { 
  height: 100%;
  padding: 0;
  margin: 0 0 0 0; 
}

body {
  height: 100%;
  background: url(../images/hintergrund/bg_body.gif) repeat-x right top #E9EBED;
  color: #000;
  font-size: 100.01%;
  font-family: 'lucida grande', verdana, sans-serif;
  padding: 0;
  margin: 0 0 0 0;
}

a:link {
  color: #396801;
  text-decoration: none;
}

a:visited {
  color: #555555;
  text-decoration: none;
}

a:hover {
  background: #FFF;
  color: #396801;
}

a:focus,
a:active {
  background: #396801;
  color: #FFF;
}

a img { border-width: 0; }

ul ul { font-size: 1em !important; }

blockquote {
  padding: 0;
  margin: 0;
}

cite { font-style: normal; }

p, blockquote,
ul, ol, dl, li,
h1, h2, h3, h4, h5, h6,
form, fieldset {
  padding: 0;
  border: 0;
  margin: 0;
}

input, textarea, select  { 
  font-size: 1em; 
  font-family: 'lucida grande', verdana, sans-serif;
}

strong { color: #396801; }


/* Allgemeine Klassen */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

.unsichtbar {
  display: block;
  position: absolute !important;
  top: -6000px !important;
  left: -6000px !important;
  height: 1px !important;
  width: 1px !important;
}

.stopFloat {
  float: none;
  clear: both;
  display: block;
  overflow: hidden;
  height: 1px;
  font-size: 1px;
  line-height: 1px;
}


/* Sprunglinks */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

p.sprunglinks {
  position: absolute;
  top: 0;
  left: -2460px;
  z-index: 3;
  width: 240px;
  height: 27px;
}

p.sprunglinks a:link,
p.sprunglinks a:visited {
  display: block;
  position: absolute;
  z-index: 3;
  width: 219px;
  height: 21px;
  background: #fff;
  color: #fff;
  font-size: .7em;
  padding: 5px 10px 1px 10px;
}

* html p.sprunglinks a:link,
* html p.sprunglinks a:visited {
  height: 28px;  /* fuer IE 5 und 5.5 */
  hei\ght: 22px; /* fuer IE 6 */
  width: 240px;  /* fuer IE 5 und 5.5 */
  wid\th: 220px;  /* fuer IE 5 und 5.5 */
}

p.sprunglinks a:focus,
p.sprunglinks a:active {
  left: 2700px;
  background: #396801;
  text-decoration: none;
}


/* Struktur */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

#rahmen {
  min-width: 771px;
  min-height: 100%;
  background: url(../images/hintergrund/bg_weiss.gif) repeat-y 0 0;
}

* html #rahmen {
  width: 100%;
/* Anfang IEmac-Hack, damit bei laengerem content unten kein grau erscheint.
Problem: bei wenig content ist unten grau \*/
  height: 100%;
/* Ende IEmac-Hack */
}

#rahmenaussen {
  background: url(../images/hintergrund/fw2_block_mit_hase.gif) no-repeat 771px 56px;
}

#rahmeninnen {
  position: relative;
  width: 701px;
  padding: 11px 0 0 0;
  margin: 0 0 0 70px;
}

#foto {
  position: absolute;
  top: 0;
  left: -70px;
  width: 480px;
  height: 271px;
  background: url(../images/hintergrund/bg_links_oben.gif) 0 0px no-repeat #fff;
}

#foto img {
  position: absolute;
  top: 56px;
  left: 70px;
  width: 480px;
  height: 215px;
  background: #B2B8BC;
}

#hase {
  display: block;
  position: absolute;
  top: 227px;
  left: 612px;
  z-index: 2;
  width: 89px;
  height: 64px;
  background: url(../images/hintergrund/hase_halb.gif) no-repeat;
}

#head { height: 260px; }

#inhalt {
  width: 701px;
  padding-bottom: 10px;
}

#hauptbereich {
  float: right;
  position: relative;
  overflow: hidden;
  width: 480px;
  background: url(../images/hintergrund/inhaltbg.gif) no-repeat #DDE0E1;
}


/* Logo */ 
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

#slogan {
  position: absolute;
  top: 28px;
  left: 184px;
  z-index: 2;
  width: 296px;
  height: 28px;
}

#slogan img {
  background: #EAF4DB;
  border-bottom:1px solid #EAF4DB;
}

#logo {
  display: block;
  position: absolute;
  top: 10px; ;
  left: -62px;
  z-index: 2;
  width: 246px;
  height: 84px;
  background-color: #FFF;
  background-position: 1px 60px;
  background-repeat: no-repeat;
}

#logo img {
  border: 1px solid #FFF;
  vertical-align: bottom;
}

#logo a:focus img { border: 1px solid #396801; }

#logo a { background: #FFF !important; }

/* Farben unter dem Logo */

.fuchs { background-image: url(../images/dreifarben/farben_fuchs.gif); }
.hase { background-image: url(../images/dreifarben/farben_hase.gif); }
.marini { background-image: url(../images/dreifarben/farben_rot.gif); }
.biber { background-image: url(../images/dreifarben/farben_biber.gif); }
.enten { background-image: url(../images/dreifarben/farben_enten.gif); }
.vogel { background-image: url(../images/dreifarben/farben_vogel.gif); }
.armeisen { background-image: url(../images/dreifarben/farben_armeisen.gif); }
.schmetterling { background-image: url(../images/dreifarben/farben_rot.gif); }
.referenzenphoto { background-image: url(../images/dreifarben/farben_rot.gif); }
.moewe { background-image: url(../images/dreifarben/farben_moewe.gif); }
.fuesse { background-image: url(../images/dreifarben/farben_fuesse.gif); }
.hummel { background-image: url(../images/dreifarben/farben_hummel.gif); }
.eichhoernchen { background-image: url(../images/dreifarben/farben_fuchs.gif); }
.wolf { background-image: url(../images/dreifarben/farben_wolf.gif); }
.schaf { background-image: url(../images/dreifarben/farben_schaf.gif); }
.frosch { background-image: url(../images/dreifarben/farben_frosch.gif); }


/* Servicemenue */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

ul#servicemenue {
  position: absolute;
  top: 25px;
  left: 496px;
  width: 204px;
  margin: -.8em 0 0 0;
  list-style: none;
}

ul#servicemenue li {
  background: url(../images/sonstiges/pfeil_gruen.gif) no-repeat 0 .4em;
  font-size: .7em;
  line-height: 1.3em;
  padding: 0 0 0 11px;
  margin: 0 0 2px 0;
}

ul#servicemenue a:link,
ul#servicemenue a:visited {
  color: #396801;
}

ul#servicemenue a:hover { border-bottom: 1px solid #89C006; }

ul#servicemenue a:focus,
ul#servicemenue a:active {
  color: #FFF;
  border-bottom: 1px solid #396801;
}


/* Hauptmenue */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

#hauptmenue {
  position: absolute;
  top: 56px;
  left: 480px;
  width: 221px;
  height: 215px;
  background: #528201;
}

#hauptmenue ul {
  position: relative;
  padding-top: 30px;
  list-style-type: none;
}

#hauptmenue li {
  display: inline;
  font-weight: 600;
}

#hauptmenue a,
#hauptmenue strong {
  position: relative;
  display: block;
  width: 193px;
  text-transform: uppercase;
  padding: 5px 0 5px 28px;
}

* html #hauptmenue a,
* html #hauptmenue strong {
  width: 221px;  /* fuer IE 5 und 5.5 */
  wid\th: 193px; /* fuer IE 6 */
}

#hauptmenue a:link,
#hauptmenue a:visited,
#hauptmenue strong {
  color: #fff;
  font-size: .8em;
  line-height: 1.4em;
}

#hauptmenue a:focus,
#hauptmenue a:hover,
#hauptmenue a:active {
  background-color: #89C006 !important;
}

#hauptmenue li.on strong a:link,
#hauptmenue li.on strong a:visited {
  padding: 0;
  font-size: 1em;
  background-color: #fff !important;
  color: #234C02 !important;
}

#hauptmenue li#haupt0 a:link,
#hauptmenue li#haupt0 a:visited {
  background-color: #649A07;
}

#hauptmenue li#haupt1 a:link,
#hauptmenue li#haupt1 a:visited {
  background-color: #578903;
}

#hauptmenue li#haupt2 a:link,
#hauptmenue li#haupt2 a:visited {
  background-color: #356500;
}

#hauptmenue li#haupt3 a:link,
#hauptmenue li#haupt3 a:visited {
  background-color: #407002;
}

#hauptmenue li#haupt4 a:link,
#hauptmenue li#haupt4 a:visited {
  background-color: #356500;
}

#hauptmenue li.on strong {
  background: #FFF;
  color: #234C02 !important;
  font-weight: 700;
}


/* Kruemelnavi */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

#hauptbereich div.ariadne {
  margin-bottom: 0;
  padding-bottom: 0;
}

#hauptbereich div.ariadne p {
  margin-top: 0;
  margin-bottom: 0;
  padding: 20px 0 5px 0;
}

#hauptbereich div.ariadne { border-bottom: 1px solid #FFF; }


/* Hauptbereich */ 
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

#hauptbereich h1 {
  font-size: 1em;
  margin: 30px 18px .8em 18px;
}

#hauptbereich h2 {
  font-size: .8em;
  margin: 1.6em 0 .8em 0;
  padding: 0 10px 0 18px;
}

#hauptbereich h2.abschnitt {
  font-size: .9em;
  padding-top: 1.6em;
  border-top: 1px solid #FFF;
  margin-top: 1.6em;
}

#hauptbereich h2.klein {
  font-size: .8em;
}

#hauptbereich h3 {
  font-size: .75em;
  margin: 1.4em 18px .8em 18px;
}

#hauptbereich p {
  font-size: .75em;
  line-height: 1.6em;
  margin: .85em 18px;
}

#hauptbereich p.datum {
  color: #414141;
  font-size: .7em;
  margin-top: -.9em;
  margin-bottom: -.6em;
}

#hauptbereich p.mindesthoehe { min-height: 150px; }

* html #hauptbereich p.mindesthoehe { height: 150px; }


/* Neuigkeiten */

#hauptbereich #neuigkeiten h3 {
  margin-top: 1.8em;
}

/* Zitate */

#hauptbereich blockquote { padding-left: 25px; }

#hauptbereich blockquote p { margin: .4em 18px .4em 18px; }


/* Listen */

#hauptbereich ul {
  font-size: .75em;
  line-height: 1.6em;
  margin: .8em 18px 0 34px;
  padding: 0;
  list-style-image: url(/images/sonstiges/aufzaehlungspunkt.gif);
}

* html #hauptbereich ul {
  list-style-image: url(/images/sonstiges/aufzaehlungspunkt_ie.gif);
}

#hauptbereich li { margin: 0 0 .5em 0; }

#hauptbereich ul.eng li {
  margin: 0;
}

#hauptbereich li p {
  font-size: 1em;
  margin: 0;
}

#hauptbereich li h2,
#hauptbereich li h3 {
  font-size: 1em;
  padding: 0;
  margin: 1em 0 .2em 0;
}


/* Links */

#hauptbereich a:link,
#hauptbereich a:visited {
  border-bottom: 1px solid #a6a6a6;
}

#hauptbereich a:focus,
#hauptbereich a:hover,
#hauptbereich a:active {
  color: #396801 !important;
  background: #FFF !important;
  border-bottom: 1px solid #89C006;
}


/* Bilder */

img.links {
  float: left;
  margin: 6px 12px 0 0;
}

img.rechts {
  float: right;
  margin: 4px 0 5px 5px;
}

.neuigkeiten img.links { margin: 0; }

img.rechts { float: right; }


/* Abstaende */

.abstandOben1-6 {
  padding-top: 1.6em;
  margin-top: 0 !important;
}


/* Nach oben */

p.nachoben {
  font-size: .7em !important;
  text-align: right;
  margin-right: 10px !important;
}

#hauptbereich p.nachoben a:link,
#hauptbereich p.nachoben a:visited {
  background/**/: url(../images/sonstiges/pfeil_hoch.gif) 100% .15em no-repeat;
  color: #396801;
  padding-right: 13px;
}

#hauptbereich p.nachoben a:focus,
#hauptbereich p.nachoben a:hover,
#hauptbereich p.nachoben a:active {
  background/**/: #FFF url(../images/sonstiges/pfeil_hoch.gif) 100% .15em no-repeat !important;
  color: #396801;
}

p.abstandOben { margin-top: 2em !important; }


/* Referenzen */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

.referenzen {
  position: relative;
  width: 480px;
  background: url(../images/hintergrund/referenzen.gif) repeat-y;
  padding: 20px 0 15px 0;
  border-top: 1px solid #FFF;
}

.referenzen.erste {
  padding-top: 0;
  border-top: 0;
  margin-top: 20px;
}

.referenz {
  position: relative;
  float: left;
  width: 240px;
  padding: 152px 0 0 0;
}

#hauptbereich .referenzen p.screenshot {
  position: absolute;
  top: -5px;
  left: 13px;
  background: url(../images/hintergrund/bg_screenshot_klein.gif) 0 0 no-repeat;
  padding: 6px;
  border: 0;
  margin: 0;
}

#hauptbereich .referenzen h2,
#hauptbereich .referenzen p {
  font-size: .8em;
  line-height: 1.5em;
  font-weight: normal;
  margin: 0 10px .4em 18px;
  padding: 0;
}

#hauptbereich .referenzen h2 {
  background/**/: url(../images/sonstiges/pfeil_gruen.gif) 0 .45em no-repeat;
  padding-left/**/: 11px;
}

#hauptbereich p.screenshot {
  background: url(/images/hintergrund/bg_screenshot.gif) 15px 15px no-repeat;
  padding: 20px;
  border-top: 1px solid #FFF;
  border-bottom: 1px solid #FFF;
  margin: 1.2em 0 0 0;
}

* html #hauptbereich p.screenshot {
  background-position: 15px 16px; /* fuer IE, rechnet ab border anders ... */
}

#hauptbereich p.screenshot img { vertical-align: bottom; }


/* Referenzen */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

#hauptbereich ul.sitemap,
#hauptbereich ul.sitemap ul {
  position: relative;
  list-style: none;
  list-style-image: none; /* braucht IE */
  margin: 2em 0 2em 60px;
  padding: 0;
}

#hauptbereich ul.sitemap ul {
  margin: 0 0 1.5em 30px;
}

#hauptbereich ul.sitemap li {
  background: url(../images/sonstiges/doppelpfeil.gif) 0 .5em no-repeat;
  font-weight: bold;
  padding: 0 0 0 15px;
  margin: .5em 0 1.5em 0;
}

#hauptbereich ul.sitemap li li {
  background: url(../images/sonstiges/pfeil_gruen.gif) 0 .55em no-repeat;
  font-weight: normal;
  padding: 0 0 0 11px;
  margin: .3em 0 0 0;
}


/* Nebenbereich */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

#nebenbereich {
  float: right;
  position: relative;
  width: 221px;
  background: url(../images/hintergrund/bg_nebenbereich.gif) no-repeat #FFF;
}

#nebenbereich .innen {
  padding: 56px 0 0 16px;
}

* html #nebenbereich .innen { height: 1%; }
/* fuer IE, sonst verschwinden Pfeile */

#nebenbereich .kasten {
  padding: 2px 8px 4px 8px;
  border: 1px solid #C5CACD;
  margin: 10px 0;
}

#nebenbereich .kasten.bild {
  padding: 2px;
  margin-bottom: -2px;
}

#nebenbereich h2,
#nebenbereich h3 {
  font-size: .75em;
  line-height: 1.4em;
  margin: 0 0 6px 0;
}

#nebenbereich .kasten h2,
#nebenbereich .kasten h3 {
  font-size: .75em;
  line-height: 1.4em;
  margin: .7em 0;
}

#nebenbereich p {
  font-size: .7em;
  line-height: 1.45em;
  margin: .5em 0;
}

#nebenbereich ul {
  font-size: .7em;
  line-height: 1.45em;
  padding: 0;
  margin: 0 0 .4em 0;
  list-style: none;
}

#nebenbereich li {
  background: url(../images/sonstiges/aufzaehlungspunkt_gruen.gif) no-repeat 0 .6em;
  padding: 0 0 0 11px;
  margin-bottom: .4em;
}

#nebenbereich ul.eng li {
  margin: 0;
}

#nebenbereich img { vertical-align: bottom; }

#nebenbereich a:link,
#nebenbereich a:visited {
  border-bottom: 1px solid #bdbdbd;
}

#nebenbereich a:hover {
  border-bottom: 1px solid #528201;
}

#nebenbereich a:focus,
#nebenbereich a:active {
  border-bottom: 1px solid #396801;
}


/* Navi */

#nebenbereich ul.navilist {
  font-size: .75em;
  line-height: 1.5em;
  margin-bottom: 20px;
}

#nebenbereich ul.navilist li {
  background: url(../images/sonstiges/pfeil_gruen.gif) no-repeat 0 .45em;
  padding: 0 0 0 11px;
  margin-bottom: .4em;
}

#nebenbereich ul.navilist a:link,
#nebenbereich ul.navilist a:visited {
  color: #396801;
  border-bottom: 0;
}

#nebenbereich ul.navilist a:hover {
  background: #FFF;
  color: #396801;
  border-bottom: 1px solid #89C006;
}

#nebenbereich ul.navilist a:focus,
#nebenbereich ul.navilist a:active {
  background: #396801;
  color: #FFF;
  border-bottom: 1px solid #396801;
}


/* Auswahlmenue */

#nebenbereich input,
#nebenbereich select {
  vertical-align: bottom !important;
  margin-top: -2px;
  font-size: 1.1em;
}

#nebenbereich input {
  margin-left: -1px;
}


/* Links */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

p.link {
  background/**/: url(../images/sonstiges/pfeil_gruen.gif) 0 .6em no-repeat;
  padding-left: 11px;
}

#nebenbereich p.link {
  background-position: 0 .45em;
}

a.link:link,
a.link:visited {
  background/**/: url(../images/sonstiges/pfeil_gruen.gif) 1px .3em no-repeat;
  padding-left: 12px;
}

p.email {
  background/**/: url(../images/sonstiges/icon_email.gif) 0 .35em no-repeat;
  padding-left: 17px;
}


/* Kontaktformular */

#contactform {
  position: relative;
  padding-top: 10px;
}

#contactform p {
  clear: left;
  padding: 10px 0 0 0;
  margin: 0 !important;
}

* html #contactform p { height: 1px; }

#contactform span.label {
  float: left;
  width: 120px;
  padding: 1px 6px 0 0;
  text-align: right;
}

* html #contactform span.label { padding-top: 0; }

#contactform span.feld {
  float: left;
  width: 280px;
}

#contactform .feld input,
#contactform .feld textarea {
  float: left;
  width: 280px;
  background: #f1f3f3;
  color: #000;
  padding: 3px;
  border: 1px solid #a0a0a0;
}

#contactform .feld input:focus,
#contactform .feld input:hover,
#contactform .feld textarea:focus,
#contactform .feld textarea:hover {
  background: #FFF;
  color: #000;
}

#contactform .feld input:focus,
#contactform .feld textarea:focus {
  border: 1px solid #649a07;
}

* html #contactform .feld input,
* html #contactform .feld textarea {
  background: #FFF;
}

#contactform input#contactsubmit {
  background: #356500;
  color: #FFF;
  padding-top: 1px;
  padding-bottom: 1px;
  border: 1px solid #356500;
  margin: 10px 0 0 126px;
  text-transform: uppercase;
}

.contacterror { border: 1px solid #ff0000; }

#contactform .error {
  position: relative;
  top: -1em;
  font-weight: bold;
  color: #CC0000;
  margin-left: 18px;
}

#contactform .success { font-weight: bold; }


/* Mini-Screenshot */

p.screenklein {
  float: left;
  width: 80px;
}


/* Fuss */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

p#fuss {
  color: #8a8a8a;
  font-size: .7em;
  padding-bottom: 24px;
}