@charset "iso-8859-1";

/* Reihe: (...,100,72),50,36,25,18,(12.5,9,...) */


.carousel {
  overflow: hidden;
  /*_direction: rtl; - TEST */
  margin: 0;
  padding: 0 0 0 2.2em; /* Platz für < */
  /* was: padding: 0 0 0 1.2em; // Platz für < */
  position: relative;
}

.carousel.with-border b a img, .carousel.with-border span a img { border: 1px solid #ccc; }
.carousel.with-bg b a img, .carousel.with-bg span a img { background-color: white; }
.carousel span a img { width: 10em; }

.carousel::after  { display: block; content: ''; clear: both; }
.carousel > div {
  /*_max-height: 10em;*/
  max-width: 40em;
}
.carousel > div > div {
  /*_max-width: 40em; _float: right;*/
  overflow: visible;
  white-space: nowrap;
  direction: ltr;

}
.carousel > div > div > b,
.carousel > div > div > span { display: inline; _font-size: 0; }
.carousel > div > div > b a,
.carousel > div > div > span a { _display: inline-block; }
/*.carousel > div > div > b a i { display: none; _display: block; }
.carousel > div > div > b a i::before { display: inline; white-space: pre; content: '\a'; }*/
.carousel > div > div > b a img,
.carousel > div > div > span a img { vertical-align: middle; position: relative; }
.carousel > div > div > b a img,
.carousel > div > div > span a img{ display: none; width: 25%; z-index: 94; }
.carousel.smaller > div > div > b a img,
.carousel.smaller > div > div > span a img{ width: 18%; }

.carousel > div > div > input:checked ~ b a img,
.carousel > div > div > input:checked ~ span a img { display: inline; z-index: 95; }

.carousel.carousel > div > div > input:first-of-type:checked + b + input+ b + input + b a img,
.carousel.carousel > div > div > input:first-of-type:checked + span + input+ span + input + span a img,
.carousel.carousel > div > div > input:nth-of-type(2):checked + b + input + b a img,
.carousel.carousel > div > div > input:nth-of-type(2):checked + span + input + span a img { margin-left: 0; }

.carousel > div > div > input:checked + b + input + b + input + b a img,
.carousel > div > div > input:checked + span + input + span + input + span a img
    { display: inline; width: 50%; margin: 0 -6.3%; z-index: 98; } /* -5.5% */
.carousel.smaller > div > div > input:checked + b + input + b + input + b a img,
.carousel.smaller > div > div > input:checked + span + input + span + input + span a img
    { width: 36%; margin: 0 -6.3%; }
.carousel > div > div > input:checked + b + input + b + input + b label,
.carousel > div > div > input:checked + span + input + span + input + span label { display: block; }
/*.carousel > div > div > input:checked + b + input + b + input + b i { display: inline; }*/

.carousel > div > div > input:checked + b + input + b a img,
.carousel > div > div > input:checked + b + input + b + input + b + input + b a img,
.carousel > div > div > input:checked + span + input + span a img,
.carousel > div > div > input:checked + span + input + span + input + span + input + span a img
    { display: inline; width: 36%; margin: 0 -6.3%; z-index: 97; }
.carousel.smaller > div > div > input:checked + b + input + b a img,
.carousel.smaller > div > div > input:checked + b + input + b + input + b + input + b a img,
.carousel.smaller > div > div > input:checked + span + input + span a img,
.carousel.smaller > div > div > input:checked + span + input + span + input + span + input + span a img
    { width: 25%; margin: 0 -6.3%; }
.carousel > div > div > input:checked + b a img,
.carousel > div > div > input:checked + b + input + b + input + b + input + b + input + b a img,
.carousel > div > div > input:checked + span a img,
.carousel > div > div > input:checked + span + input + span + input + span + input + span + input + span a img
    { display: inline; width: 25%; z-index: 96; }
.carousel.smaller > div > div > input:checked + b a img,
.carousel.smaller > div > div > input:checked + b + input + b + input + b + input + b + input + b a img,
.carousel.smaller > div > div > input:checked + span a img,
.carousel.smaller > div > div > input:checked + span + input + span + input + span + input + span + input + span a img
    { width: 18%; }

/*.carousel > div > div > input:last-of-type:checked*/

input[id$="-1"]:checked + b + input + b + input + b,
input[id$="-1"]:checked + span + input + span + input + span { margin-left: -2.2em; } /* Platz fuer < wieder weg */

@media (max-width: 40em) {
  .carousel > div > div > input:checked + b a img,
  .carousel > div > div > input:checked + span a img { display: none; }
  .carousel > div > div > input:checked + b + input + b a img,
  .carousel > div > div > input:checked + span + input + span a img { margin-left: 0; }

  .carousel > div > div > input:checked + b + input + b + input + b a img,
  .carousel > div > div > input:checked + span + input + span + input + span a img { width: 45%;/*40%;*/ }
  .carousel > div > div > input:checked + b + input + b a img,
  .carousel > div > div > input:checked + b + input + b + input + b + input + b a img,
  .carousel > div > div > input:checked + span + input + span a img,
  .carousel > div > div > input:checked + span + input + span + input + span + input + span a img { width: 32%;/*28%;*/ }
}
@media (max-width: 20em) {
  .carousel > div > div > input:checked + b + input + b a img,
  .carousel > div > div > input:checked + span + input + span a img { display: none; }
  .carousel > div > div > input:checked + b + input + b + input + b a img,
  .carousel > div > div > input:checked + span + input + span + input + span a img { margin-left: 0; }

  .carousel > div > div > input:checked + b + input + b + input + b a img,
  .carousel > div > div > input:checked + span + input + span + input + span a img { width: 72%; }
  .carousel > div > div > input:checked + b + input + b a img,
  .carousel > div > div > input:checked + b + input + b + input + b + input + b a img,
  .carousel > div > div > input:checked + span + input + span a img,
  .carousel > div > div > input:checked + span + input + span + input + span + input + span a img { width: 50%; }
}
.carousel label.prev, .carousel label.next {
  position: absolute;
  top: 0; bottom: 100%; /* was: top: 50% */
  height: 100%; _width: 1em; box-sizing: border-box;
  padding: 0; margin: 0;
  z-index: 99;
  background-color: white; /* XXX */
  /*_font-size: 2em;*/ display: none;
}
.carousel label.prev::after, .carousel label.next::after {
  display: inline-block; content: '';
  height: 100%; width: 0;
  vertical-align: middle;
}
.carousel label.prev img, .carousel label.next img {
  vertical-align: middle;
  width: 2em; border-radius: 35%;
  /*was: width: 1em; border-radius: 50%;*/
  padding: 2em; margin: -2em;
  /*was: padding: 1em; margin: -1em; */
  background: radial-gradient(white 10%, rgba(255,255,255,0));
  /* was: 30% */
}
.carousel label.prev img { padding-left: 0.8em; margin-left: -0.8em;}
.carousel label.next img { padding-right: 0.8em; margin-right: -0.8em; }
.carousel label.prev { left: -0em; text-align: left; }
.carousel label.next { right: -0em; text-align: right; }

.ann-texts > * { display: none; text-align: center; margin: 0 auto; }
input[id$="-1"]:checked ~ .ann-texts > *:nth-child(1) { display: block; }
input[id$="-2"]:checked ~ .ann-texts > *:nth-child(2) { display: block; }
input[id$="-3"]:checked ~ .ann-texts > *:nth-child(3) { display: block; }
input[id$="-4"]:checked ~ .ann-texts > *:nth-child(4) { display: block; }
input[id$="-5"]:checked ~ .ann-texts > *:nth-child(5) { display: block; }
input[id$="-6"]:checked ~ .ann-texts > *:nth-child(6) { display: block; }
input[id$="-7"]:checked ~ .ann-texts > *:nth-child(7) { display: block; }
input[id$="-8"]:checked ~ .ann-texts > *:nth-child(8) { display: block; }
input[id$="-9"]:checked ~ .ann-texts > *:nth-child(9) { display: block; }
input[id$="-10"]:checked ~ .ann-texts > *:nth-child(10) { display: block; }
input[id$="-11"]:checked ~ .ann-texts > *:nth-child(11) { display: block; }
input[id$="-12"]:checked ~ .ann-texts > *:nth-child(12) { display: block; }
input[id$="-13"]:checked ~ .ann-texts > *:nth-child(13) { display: block; }
input[id$="-14"]:checked ~ .ann-texts > *:nth-child(14) { display: block; }
input[id$="-15"]:checked ~ .ann-texts > *:nth-child(15) { display: block; }
input[id$="-16"]:checked ~ .ann-texts > *:nth-child(16) { display: block; }
input[id$="-17"]:checked ~ .ann-texts > *:nth-child(17) { display: block; }
input[id$="-18"]:checked ~ .ann-texts > *:nth-child(18) { display: block; }
input[id$="-19"]:checked ~ .ann-texts > *:nth-child(19) { display: block; }
input[id$="-20"]:checked ~ .ann-texts > *:nth-child(20) { display: block; }
input[id$="-21"]:checked ~ .ann-texts > *:nth-child(21) { display: block; }
input[id$="-22"]:checked ~ .ann-texts > *:nth-child(22) { display: block; }
input[id$="-23"]:checked ~ .ann-texts > *:nth-child(23) { display: block; }
input[id$="-24"]:checked ~ .ann-texts > *:nth-child(24) { display: block; }
input[id$="-25"]:checked ~ .ann-texts > *:nth-child(25) { display: block; }
input[id$="-26"]:checked ~ .ann-texts > *:nth-child(26) { display: block; }
input[id$="-27"]:checked ~ .ann-texts > *:nth-child(27) { display: block; }
input[id$="-28"]:checked ~ .ann-texts > *:nth-child(28) { display: block; }
input[id$="-29"]:checked ~ .ann-texts > *:nth-child(29) { display: block; }
input[id$="-30"]:checked ~ .ann-texts > *:nth-child(30) { display: block; }
input[id$="-31"]:checked ~ .ann-texts > *:nth-child(31) { display: block; }
input[id$="-32"]:checked ~ .ann-texts > *:nth-child(32) { display: block; }
input[id$="-33"]:checked ~ .ann-texts > *:nth-child(33) { display: block; }
input[id$="-34"]:checked ~ .ann-texts > *:nth-child(34) { display: block; }
input[id$="-35"]:checked ~ .ann-texts > *:nth-child(35) { display: block; }
input[id$="-36"]:checked ~ .ann-texts > *:nth-child(36) { display: block; }
input[id$="-37"]:checked ~ .ann-texts > *:nth-child(37) { display: block; }
input[id$="-38"]:checked ~ .ann-texts > *:nth-child(38) { display: block; }
input[id$="-39"]:checked ~ .ann-texts > *:nth-child(39) { display: block; }
input[id$="-40"]:checked ~ .ann-texts > *:nth-child(40) { display: block; }