/*  Projekt: HOLPUP
    Stylesheet for SCREEN
    Date: 2008/09/10
    Author: Kai Kuehn, mic-app IT-Services
*/


/* COMMON */
* { /* overall reset */
  padding: 0;
  margin: 0;
}

/* Firefox scrollbar visible */
html { height: 101%; }

body {
  color: black;
  background: GhostWhite; /*#66ccff*/
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: small;
  min-width: 900px;
  min-height: 500px;
}
h1 { font-size: 160%; }
h2 { font-size: 130%; }
h3 { font-size: 120%; }
h4 { font-size: 110%; }
h5 { font-size: 100%; }

ul {
  padding-left: 40px;
}
li {
  margin-bottom: 1em;
}


/* IDs & CLASSES */
#wrapper {
  color: black;
  background: #4e5d6d url(images/kuen-sports-holzpuppen2.jpg) no-repeat;
  width: 900px;
  border: 1px solid black;
  margin-top: 5px;
  margin-right: auto;
  margin-bottom: 10px;
  margin-left: auto;
}
  #wrapper a {
   color: FireBrick;
   text-decoration: none;
   outline: none;
  }

  #wrapper a:hover,
  #wrapper a:focus {
    text-decoration: none;
    color: Red;
    border-bottom: 1px dotted;
    background: White;
  }
  #wrapper a:visited {
    color: Maroon;
  }

#menubar {
  text-align: left;
  color: white;
  font-size: 85%;
  font-weight: normal;
  width: 90%;
  padding: 10px;
  margin: 150px 0 0 80px;
}
  #menubar ul {
    margin-bottom: 0;
  }
  #menubar li {
    display: inline;
    list-style-type: none;
    margin: 5px;
  }
  #menubar a {
    text-decoration: none;
    color: white;
    padding: 10px;
  }
  #menubar a:hover,
  #menubar a:focus {
    color: black;
    background: #66ccff;
    border-bottom: 2px inset #66ccff;
  }
  #menubar a:active {
    color: white;
  }
  #menubar a:visited {
    color: white;
  }

  #startseite #item01 a,
  #holzpuppen #item02 a,
  #ausruestung #item03 a,
  #kontakt #item04 a,
  #agb #item05 a,
  #impressum #item06 a {
    color: black;
    background: White;
    border: 2px outset WhiteSmoke;
    border-bottom: 2px solid White;
  }

#content {
  font-size: 85%;
  background: White;
  width: 95%;
  min-height: 400px;
  padding: 10px;
  border: 2px outset WhiteSmoke;
  margin: 0 auto 0 auto;
}
  #content h1 {
    text-align: center;
  }
  #content h2 {
    text-align: center;
    margin-bottom: 1em;
  }
  #content h4 {
    margin-bottom: 1em;
  }
  #content p {
    padding: 0 0 1em 0;
  }
  #content p span {
    color: Red;
  }
  #content table {
    margin-bottom: 1em;
  }
  #content table span {
    color: Red;
  }
  #content hr {
    width: 100%;
    margin: 15px 0 15px 0;
    size: 2px;
  }

.lsimg { /* Langstock */
  float: right;
  border: none;
  margin-right: 100px;
}


.leftimg {
    float: left;
    border: 0;
    margin-right: 20px;
}

.rightimg {
    float: right;
    border: 0;
    margin-left: 20px;
}

.gallery {
  background: LightSlateGray;
  text-align: center;
  width: 95%;
  padding: 10px;
  border: 2px outset black;
  margin: 5px;
}
  .gallery h1 {
    color: white;
    margin-bottom: 0.5em;
  }
  .gallery table h1 {
    font-size: 100%;
    margin-top: 0.5em;
  }

.galleryimg {
  border: 5px solid white;
  margin-bottom: 10px;
}
.galleryselect {
  border: 1px solid white;
}

.gallery2 {
  float: right;
  background: LightSlateGray;
  text-align: center;
  width: 250px;
  padding: 10px;
  border: 2px outset black;
  margin: 5px;
}
  .gallery2 h1 {
    color: white;
    margin-bottom: 0.5em;
  }
  .gallery2 table h1 {
    font-size: 100%;
    margin-top: 0.5em;
  }

.biggi {
  font-size: 200%;
}

.bigger {
  background-color: WhiteSmoke;
  font-size: 120%;
  padding: 2px 10px 2px 10px;
  border: 1px solid DarkGray;
}


.wdlink img {
  border: none;
}


.centerlist ul {
  width: 80%;
  padding: 0;
  padding-left: 20px;
  margin-top: 20px;
  margin-bottom: 20px;
}
  .centerlist li {
    text-align: center;
    color: DarkSlateBlue;
    font-weight: bold;
    list-style: none;
    padding: 3px;
    padding-bottom: 5px;
    margin: 0;
    margin-bottom: 10px;
    margin-left: 20px;
  }
  .centerlist h1 {
    color: black;
    font-size: 140%;
    margin-bottom: 0.5em;
  }


/* FORM: Kontaktform */
.kontaktformular {
  color: black;
  width: 70%;
  padding: 5px;
  padding-bottom: 10px;
  margin-top: 20px;
}
  .kontaktformular span {
    color: red;
    font-size: 100%;
  }
  .kontaktformular label {
    display: block;
    float: left;
    cursor: pointer;
    width: 150px;
    text-align: left;
    padding-right: 1em;
    border-bottom: thin dotted Gainsboro;
    margin-bottom: 0.5em;
  }
  .kontaktformular input, select {
    font-size: 100%;
    display: block;
    float: left;
    cursor: pointer;
    width: 300px;
    background: AliceBlue;
    border: none;
    border-bottom: thin dotted Gainsboro;
    margin-right: 1em;
  }
  .kontaktformular textarea {
    cursor: pointer;
    width: 480px;
    background: AliceBlue;
    border: thin solid Gainsboro;
    margin-right: 1em;
    margin-bottom: 1em;
  }
  .kontaktformular input:hover,
  .kontaktformular select:hover,
  .kontaktformular textarea:hover,
  .kontaktformular label:hover {
    background: Lavender;
  }
  .kontaktformular input:focus,
  .kontaktformular select:focus,
  .kontaktformular textarea:focus {
    background: FloralWhite;
  }
  .kontaktformular input#senden {
    float: left;
    width: 50%;
    font-size: 100%;
    background: LightGrey;
    padding: 2px;
    border: 2px solid;
    border-color: #efefef #000000 #000000 #efefef;
  }
  .kontaktformular input#senden:hover {
    background: SteelBlue;
    color: white;
  }
  .kontaktformular input#checkbox {
    display: block;
    float: left;
    cursor: pointer;
    width: 50px;
    margin-right: 0.5em;
    margin-left: 2em;
  }
  .kontaktformular label#title {
    display: block;
    float: left;
    width: 400px;
    text-align: left;
    padding-right: 1em;
    border: none;
    margin-bottom: 0.5em;
  }
  .kontaktformular label#title span {
    color: Black;
    font-weight: bold;
  }


form br { /* Alle Zeilenumbrüche in Formularen auswählen */
  clear: both; /* das floating der labels und inputs aufheben */
}

.checkmarklist {
    list-style-image: url(images/haken.gif);
}
  .checkmarklist li {
    margin-bottom: 15px;
  }

.boldlist {
  list-style-type: none;
  font-size: 110%;
  font-weight: bold;
  padding: 10px;
  text-align: center
}
  .boldlist li {
    margin-bottom: 10px;
  }

.contentbox {
  overflow: hidden;
  color: black;
  background-color: White;
  font-size: 100%;
  width: 100%;
  padding: 5px;
  padding-bottom: 5px;
  border: 1px solid Silver;
  margin-top: 10px;
  margin-bottom: 15px;
}
  .contentbox h1 {
    color: white;
    background: SeaGreen;
    font-size: 100%;
    padding: 3px;
    padding-left: 5px;
  }

  .contentbox p {
    margin: 5px 0 5px 10px;
  }

  .contentbox ul {
    padding: 0;
    padding-left: 40px;
    margin-bottom: 20px;
  }

  .contentbox li {
    padding: 3px;
    padding-bottom: 5px;
    margin: 0;
    margin-left: 20px;
  }

  .contentbox img {
    float: left;
    margin-right: 10px;
  }

.backbox {
  overflow: hidden;
  color: black;
  background: White url(images/trainingsinhalte.jpg) repeat-y;
  font-size: 100%;
  width: 100%;
  padding: 5px;
  padding-bottom: 5px;
  padding-left: 120px;
  border: 1px solid Silver;
  margin-top: 10px;
  margin-bottom: 15px;
}
  .backbox h1 {
    color: white;
    background: SeaGreen;
    font-size: 100%;
    padding: 3px;
    padding-left: 5px;
  }

  .backbox h5 {
    padding-left: 5px;
    margin: 0 0 1em 0;
  }

  .backbox p {
    margin: 5px 0 5px 10px;
  }

  .backbox ul {
    padding: 0;
    padding-left: 40px;
    margin-bottom: 20px;
  }

  .backbox li {
    padding: 3px;
    padding-bottom: 5px;
    margin: 0;
    margin-left: 20px;
  }

  .backbox img {
    float: left;
    margin-right: 10px;
  }


#sidebar {
  float: right;
  color: black;
  width: 20%;
  font-size: 85%;
  margin: 30px 5px 5px 5px;
}

.sidebox {
  color: black;
  background-color: WhiteSmoke;
  font-size: 80%;
  width: 95%;
  padding: 5px;
/*  border: 1px solid Silver;*/
  margin-bottom: 20px;
}
  .sidebox h1 {
    color: white;
    text-align: center;
    background: #336699;
    font-size: 120%;
    padding: 3px;
  }

  .sidebox p {
    margin: 5px 0 5px 0;
  }

  .sidebox ul {
    padding: 0;
    padding-left: 20px;
    margin: 5px 0 5px 0;
  }

  .sidebox li {
    padding: 3px;
    margin: 0;
}

#footer {
  clear: both;
  color: White;
  font-size: 70%;
  line-height: 1.5em;
  text-align: center;
  width: 100%;
  padding: 5px;
  margin: 0 auto 0 auto;
}
  #footer a {
   color: PowderBlue;
   text-decoration: none;
   outline: none;
   padding-right: 50px;
   padding-left: 50px;
  }
  #footer a:visited {
    color: PowderBlue;
  }
  #footer a:hover,
  #footer a:focus {
    text-decoration: none;
    color: black;
    border-bottom: 1px dotted;
    background: #66ccff;
  }