/* ----- general ----- */

#c738 img:hover,
#c740 img:hover { cursor: pointer; }


#rightcolumn img[alt="Zeitleiste"]:hover { cursor: pointer; }

#timeline_lb_layer {
  visibility: hidden;
  opacity: 0;
}

#history {
  visibility: hidden;
  opacity: 0;
  background: #fff url(../img/history/bg_history.jpg) no-repeat 0 0;
  border: 10px solid #fff;
  height: 576px;
  overflow: visible;
  position: relative;
  width: 796px;
}

#history a { outline-style: none; }

#history img {
  background: none transparent;
  border: none;
  padding: 0;
}

#history ul li { background-color: transparent; margin-bottom: 6px; padding-left: 15px; }

.left { float: left; }
.right { float: right; }


/* ----- controls ----- */

a.controls {
  border: none;
  color: #fff;
  display: none;
  font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
  font-size: 18px;
  height: 36px;
  padding: 9px 0 0 0;
  position: absolute;
  top: 228px;
  text-decoration: none;
  width: 30px;
  z-index: 20;
}

a.controls_act { display: block; }


a.back {
  background: url(../img/history/bg_arrow_back.png) no-repeat 0 0;
  left: -26px;
  padding-left: 24px;
}

a.forward {
  background: url(../img/history/bg_arrow_forward.png) no-repeat 0 0;
  padding-right: 24px;
  right: -26px;
  text-align: right;
}

a.close {
  top: -32px;
  right: 8px;
  background-color: transparent;
}

a.close:active { top: -31px; }

a.close:hover,
a.close:active {
  background-image: none;
}

a.back:hover, a.back:active { left: -28px; }
a.forward:hover, a.forward:active { right: -28px; }

a.back:active, a.forward:active { top: 229px; }


/* ----- content ----- */

#history_content {
  height: 515px;
  left: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
  width: 796px;
}

#history_sections {
  height: 498px;
  position: relative;
  width: 7768px;
}

#history .history_section img.left { margin: 10px 0 0 15px; }
#history .history_section img.right { margin: 10px 15px 0 0; }

.history_section {
  float: left;
  height: 498px;
  width: 996px;
}

.history_section_80 {
  width: 796px;
}

.history_section .top,
.history_section .bottom {
  height: 255px;
  position: relative;
  width: 100%;
}


.history_section .bottom {
  float: left;
  margin-top: 20px;
  height: auto;
}

.history_section .top div {
  margin: 32px 0 0 0;
  width: 480px;
}

.history_section .bottom div {
  margin: 12px 0 0 0;
  width: 437px;
}

#history .history_section .right { padding-right: 200px; }
#history .history_section_80 .right { padding-right: 0; }

.history_section div.right,
.history_section div.left {
  border-top: 3px solid #c21027;
  position: relative;
}

.history_section img.year {
  position: absolute;
  top: 15px;
}

#folge #history .history_section ul {
  margin: 13px 0 0 0;
}


/* ----- content top right ----- */

#folge #history .history_section .top div.right img.year { left: 0; }

#folge #history .history_section .top div.right ul {
  margin-left: 75px;
  margin-right: 28px;
}


/* ----- content top left ----- */

#folge #history .history_section .top div.left img.year { right: 0; }

#folge #history .history_section .top div.left ul {
  margin-right: 75px;
  margin-left: 28px;
}


/* ----- content bottom left ----- */

.history_section .bottom div.left img.year {
  right: 0;
}

#folge #history .history_section .bottom div.left ul {
  margin-right: 75px;
  padding-left: 28px;
}


/* ----- content bottom right ----- */

.history_section .bottom div.right img.year { left: 0; }

#folge #history .history_section .bottom div.right ul {
  margin-left: 75px;
  padding-right: 28px;
}


/* ----- special cases ----- */

.history_section_40 .top { height: 288px; }
.history_section_50 .top { height: 288px; }

.history_section_30 .bottom div.left,
.history_section_50 .bottom div.left,
.history_section_60 .bottom div.right,
.history_section_70 .top div.right {
  width: 768px;
}

.history_section_70 .bottom div.left { width: 495px; }

.history_section_30 .bottom div.left ul,
.history_section_50 .bottom div.left ul,
.history_section_60 .bottom div.right ul,
.history_section_70 .top div.right ul {
  float: left;
  width: 300px;
}

#folge #history .history_section_30 .bottom div.left img+ul,
#folge #history .history_section_50 .bottom div.left img+ul {
  margin-right: 0;
  width: 335px;
}

#folge #history .history_section_60 .bottom div.right img+ul+ul,
#folge #history .history_section_70 .top div.right img+ul+ul {
  margin-left: 0;
  width: 335px;
}

.history_section_20 .bottom img.left {
  position: absolute;
  top: -40px;
}

.history_section_40 .top img.right {
  position: absolute;
  right: 0;
  top: 15px;
}

.history_section_40 .bottom img.left {
  left: 0;
  position: absolute;
  top: -30px;
}

.history_section_50 .top img.left {
  left: 0;
  position: absolute;
  top: 10px;
}

.history_section_70 .top img.left {
  bottom: -100px;
  left: 50px;
  position: absolute;
}

.history_section_70 .bottom img.right {
  position: absolute;
  right: -10px;
  top: -62px;
}

.history_section_80 .bottom img.left {
  left: 10px;
  position: absolute;
  top: -70px;
}


/* ----- timeline, slider ----- */

#history_timeline {
  background: url(../img/history/bg_timeline.png) no-repeat bottom left;
  bottom: 0;
  height: 78px;
  position: absolute;
  width: 796px;
}

#history_timeline .slider {
  background: url(../img/history/bg_slider.gif) repeat-x 0 0;
  bottom: 0;
  height: 29px;
  position: absolute;
  width: 100%;
}

#history_timeline .slider-inner {
  height: 10px;
  margin-left: 10px;
  position: relative;
  width: 771px;
}

#history_timeline .slider img {
  position: absolute;
  top: 0;
}

#history_timeline a {
  display: block;
  float: left;
  padding: 0;
}

#history_timeline a img {
  background: #c2c2c2;
  border-right: 1px solid #eaeaea;
  display: block;
  float: left;
}

#history_timeline a:first-child {
  border-left: 1px solid #eaeaea;
  margin: 0 0 0 20px;
}

#history_timeline a:hover img,
#history_timeline a.act img {
  background: #c21027;
  cursor: pointer;
}