@charset "utf-8";

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	   CSS fuer die Haupstadt handelt
	   Chronik von resch media
	   
	   www.resch-media.de
	   
   ~~~~~~~~~~~~~~~~~~~~~~~~~ */
   
/* default */   
html,body{
	font-family:'FrutigerLTStd47LightCnRegular',Helvetica,sans-serif;
	font-size: 12px;
	color: #d7d7d7;
	background-color: #333333;
	padding:0;
	margin:0;
	height:100%;
	font-weight:100;
}
h1{ text-transform:uppercase;font-weight:100; display:block;}

h2{color:#d7d7d7;cursor:pointer;font-size:1.6em;font-weight:100;font-family: 'FrutigerLTStd47LightCnRegular',Helvetica,sans-serif; line-height:1.2em;}


h3{text-transform:uppercase;font-weight:100; font-size:1.2em; }
h4{text-transform:uppercase;font-weight:100; display:block;}
a,a:link,a:visited{color:#41b0f9; cursor:pointer;}
a:hover,a:active{color:#ff9601}
a img {border:none;}

/* clearing */
html[xmlns] .clearfix{display:block}
* html .clearfix{height:1%}
.clearfix:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}
.clearfix{display:inline-block;clear:both;}


 .timelineMajor h2 span.headsub{
	font-size:12px;
	background:none;
	color: #d7d7d7;
	text-transform:uppercase;
	margin-bottom:-10px;
	position:relative;
 }

.headinfo { 
	display:block;
	position:relative;
	
	height:150px;
}
.headinfo .logo {
	float: right;
}
.headinfo h1 {
	font-size:38px;
	padding:10px 30px
}
#wrap {
	height: 100%;
	width: 920px;
	margin:0 auto;
	position: relative;
	
}

.container{
	display:block;
	
}


#wrap .subcl{
	width:50%;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	   Overlay
   ~~~~~~~~~~~~~~~~~~~~~~~~~ */

   
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	   TIMELINE CSS
   ~~~~~~~~~~~~~~~~~~~~~~~~~ */
div.timelineContainer{border-left:2px solid #ccc;}
div.timelineToggle{float:right;margin-right:0;white-space:nowrap}
a.expandAll{color:#f39936;cursor:pointer;background:#000;border:none;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;font-size:12px;padding:3px 5px}
a.expandAll:hover{border:none;color:#f9a952;cursor:pointer}
div.timelineMajor{clear:left;float:left;margin:0 0 40px}
.timelineMajor h2{background:url(../img/timeline_century_tick.gif) left center no-repeat;color:#f39936;cursor:pointer;font-size:3.4em;font-weight:100;margin:0 0 10px;padding:4px 4px 4px 20px }
.timelineMajor h2 span{background:#ccc;border:none;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;color:#131313;letter-spacing:.1em;line-height:1.7em;padding:3px 5px 1px}
.timelineMajor h2 a:hover{border-bottom:none;color:#c50000}
.timelineMajor  h2:hover {opacity: 0.8}





.timelineMajorMarker img {padding:0 10px 0 10px}
.timelineMajor h2 {}

.dl.timelineMinor{clear:left;float:left;position:relative;width:880px;margin:0 12px 0 0 ;padding: 0 }
.timelineMinor dt{ font-family: "Times New Roman", Times,Georgia, serif; font-style:italic;background:url(../img/timeline_decade_tick.gif) left center no-repeat;clear:left;font-size:1.8em; font-weight:100;list-style-type:none;line-height:1.2em;white-space:nowrap;margin:0 0 12px;padding:0 0 0 24px }
.timelineMinor dt a{color:#d7d7d7;cursor:pointer; background-color:transparent; padding:0px; }
.timelineMinor dt a.closed{color:#999;font-size:1em;margin-left:0; background-color:transparent;}
.timelineMinor dt a.open {background:#ff9500 url(../img/minus.png) center right no-repeat;color:#333; display:block; width:820px; font-weight:100;padding:5px 10px;}
.timelineMinor dt a.open:hover {color:#333;}
.timelineMinor dd{padding-left:24px;width:100%}
.timelineMinor dd h3{color:#FFF;white-space:nowrap;margin:0; background-color:#13abff}

.timelineEvent { }
.timelineEvent .linie {border-top:6px solid #ff9500; width:800px;}
 .timelineEvent .content{background-color:#13abff; clear:left;float:left;line-height:1.6em;width:760px;margin:3px 0 10px;padding:20px 20px 30px 20px; }
  .timelineEvent .content p {display:block; }
 
 .col_left { width:45%; display:block; float:left; color:#fff; font-size:1.4em; font-weight:100; line-height:1.7em;  padding:0; margin:0; }
 .col_right{width:50%; display:block; float:left; color:#fff; font-size:1.4em; font-weight:100; line-height:1.7em;padding-left:15px;}
 
 .vorschaubild {border:5px solid #fff; width:380px; margin-top:1.3em;}
 
 
 
 
 
.timelineEvent h4{clear:left;float:left;font-size:1.4em;font-weight:100;margin:10px 0 0;padding:0 0 0 20px }
.timelineEvent blockquote{clear:left;float:left;width:400px;padding:0 30px}
.timelineEvent blockquote *{float:none;width:400px}
.timelineEvent ul.moreInfo{clear:left;float:left;line-height:1.2em;list-style-type:none;width:100%;margin:0;padding:0}
.timelineEvent ul.moreInfo li{clear:left;background:none;font-size:1em;line-height:1.5em;margin:8px 0;padding:0 0 0 20px }
.timelineEvent ul.moreInfo li a:link,.timelineEvent ul.moreInfo li a:visited{color:#f39936}
.timelineEvent div.media{float:right;width:300px;padding:0 0 12px}
.timelineEvent .media img{border:2px solid #000;margin:0}
.timelineEvent .media p{font-size:1.2em;}
.timelineEvent .media a:link,.timelineEvent .media a:visited{border:none;color:#ab221b}
.timelineEvent .media p span.source{font-style:italic}
.timelineMinor dt a:hover{color:#f9a952}
.timelineEvent ul.moreInfo li a:hover,.timelineEvent .media a:hover{color:#f9a952}





.topnav dl.timelineMinor{width:auto;margin: 0;}

/*Impressum*/
#impressum { background:none; padding:none;margin:0; }
.timelineMajor.topimpressum {margin:0; position:absolute; z-index:100;  }
.timelineMajor.topimpressum  h2 {font-size:0.8em;}
.timelineMajor.topimpressum .timelineEvent, .timelineMajor.topimpressum .timelineMinor dd {padding-left:0; margin-left:0;}
.timelineMajor.topimpressum  .content{background-color:#000;  clear:left;float:left;line-height:1.6em;width:840px;margin:0;padding:40px; box-shadow:2px 4px 10px #141414;  }
.timelineMajor.topimpressum .timelineMinor dt {margin:0; padding:10px 0 0 0; font-size:14px; 
font-family:'FrutigerLTStd47LightCnRegular',Helvetica,sans-serif; font-style:normal; text-transform:uppercase;;}
.timelineMajor.topimpressum .timelineMinor dt a.open {font-size:3em!Important; display:inline-block; padding:20px; width:100%;}
.headinfo2 {}

.timelineMajor.topimpressum  .content  .col_left .upper , .timelineMajor.topimpressum  .content  .col_right .upper{
text-transform:uppercase; text-decoration:underline;}

.timelineMajor.topimpressum  .col_left, .timelineMajor.topimpressum   .col_right {font-size:1.2em!Important;}
.timelineMajor.topimpressum  .col_left {width:45%; }
.timelineMajor.topimpressum  .col_right {width:45%;float:right;}




#datenschutz  { background:none; padding:0;margin:0; }
#datenschutz a {  padding:10px 0 0 127px;display: inline-block;; }
#datenschutz a.open {  padding:20px; }
.timelineMajor.topdatenschutz {margin:0; position:absolute; z-index:100; left:0; }
.timelineMajor.topdatenschutz  h2 {font-size:0.8em;}
.timelineMajor.topdatenschutz .timelineEvent, .timelineMajor.topdatenschutz .timelineMinor dd {padding-left:0; margin-left:0;}
.timelineMajor.topdatenschutz  .content{background-color:#000;  clear:left;float:left;line-height:1.6em;width:840px;margin:0;padding:40px; box-shadow:2px 4px 10px #141414;  }
.timelineMajor.topdatenschutz .timelineMinor dt {margin:0; padding:10px 0 0 0; font-size:14px; 
font-family:'FrutigerLTStd47LightCnRegular',Helvetica,sans-serif; font-style:normal; text-transform:uppercase;;}
.timelineMajor.topdatenschutz .timelineMinor dt a.open {font-size:3em!Important; display:inline-block; padding:20px; width:100%;}


#datenschutz a.open {
    padding: 20px;
    margin-top: 34px;
}
#impressum  a.open {

    margin-top: 34px;
}
.ce-bodytext {
    font-size: 17px;
}


.headinfo2 {}

.timelineMajor.topdatenschutz  .content  .col_left .upper , .timelineMajor.topdatenschutz  .content  .col_right .upper{
text-transform:uppercase; text-decoration:underline;}

.timelineMajor.topdatenschutz  .col_left, .timelineMajor.topdatenschutz   .col_right {font-size:1.2em!Important;}
.timelineMajor.topdatenschutz  .col_left {width:45%; }
.timelineMajor.topdatenschutz  .col_right {width:45%;float:right;}




.justify {text-align:justify;}





a .kopf:hover, a img:hover{ opacity:0.9}
.headinfo2 { display:block; height:600px; width;890px; } /* check!!   height:380px; */
.footer {border-top:5px solid #ff9600; display:block;width:980px; margin:130px 0 10px 0;}
.innerfooter { display:block;margin-top:2px;  padding:20px 20px 0 20px; } 


.footer .info {padding:5px; background-color:#FFFFFF; display:inline-block; color:#000;}
.footer .info a {color:#000; text-decoration:none; font-size:15px;}
.footer .totop {float:right; display:block;}
.footer .totop a {color:#f2f2f2;}
.clear {clear:both;}




#back-top {
	position: fixed;
	bottom: 20px;
	margin-left:860px;
}

#back-top a {
	width: 100px;
	display: block;
	text-align: center;
	font-size: 14px;
	text-transform: uppercase;
	text-decoration: none;
	color:#d7d7d7 ;

	/* transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
}
#back-top a:hover {
	color: #fff;
}

/* arrow icon (span tag) */
#back-top span {
	width: 100px;
	height: 100px;
	display: block;
	margin-bottom: 7px;
	background:  #ff9601 url(../img/arrow.png) no-repeat center center;

	/* rounded corners 
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;*/

	/* transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
}
#back-top a:hover span {
	background-color: #c50000 ;
}


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	  TYPO3 CSS
   ~~~~~~~~~~~~~~~~~~~~~~~~~ */
DIV.csc-textpic-caption-r .csc-textpic-caption{text-align:right}
DIV.csc-textpic DIV.csc-textpic-imagecolumn{float:left;display:inline}
DIV.csc-textpic-border DIV.csc-textpic-imagewrap .csc-textpic-image IMG,DIV.csc-textpic-border DIV.csc-textpic-single-image IMG{border:2px solid #000;padding:0}
DIV.csc-textpic-imagewrap{padding:0}
DIV.csc-textpic DIV.csc-textpic-imagewrap UL{list-style:none;margin:0;padding:0}
DIV.csc-textpic DIV.csc-textpic-imagewrap UL LI{float:left;margin:0;padding:0}
DL.csc-textpic-image DT{display:inline;margin:0}
DIV.csc-textpic-left DIV.csc-textpic-imagewrap .csc-textpic-image,DIV.csc-textpic-intext-left-nowrap DIV.csc-textpic-imagewrap .csc-textpic-image,DIV.csc-textpic-intext-left DIV.csc-textpic-imagewrap .csc-textpic-image{display:inline;margin-right:10px}
DIV.csc-textpic-right DIV.csc-textpic-imagewrap .csc-textpic-image,DIV.csc-textpic-intext-right-nowrap DIV.csc-textpic-imagewrap .csc-textpic-image,DIV.csc-textpic-intext-right DIV.csc-textpic-imagewrap .csc-textpic-image{display:inline;margin-left:10px}
DIV.csc-textpic-center DIV.csc-textpic-imagewrap .csc-textpic-image{display:inline;margin-left:10px;text-align:left}
DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-image IMG{vertical-align:bottom;margin:0}
DIV.csc-textpic-equalheight DIV.csc-textpic-imagerow{margin-bottom:10px;display:block}
DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-firstcol{margin-left:0!important}
DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-lastcol{margin-right:0!important}
DIV.csc-textpic-intext-left DIV.csc-textpic-imagewrap,DIV.csc-textpic-intext-left-nowrap DIV.csc-textpic-imagewrap{margin-right:10px!important}
DIV.csc-textpic-intext-right DIV.csc-textpic-imagewrap,DIV.csc-textpic-intext-right-nowrap DIV.csc-textpic-imagewrap{margin-left:10px!important}
DIV.csc-textpic-center DIV.csc-textpic-imagewrap{margin:0 auto}
DIV.csc-textpic-right DIV.csc-textpic-text{clear:right}
DIV.csc-textpic-left DIV.csc-textpic-text{clear:left}
DIV.csc-textpic-intext-right-nowrap DIV.csc-textpic-imagewrap{float:right;clear:both}
DIV.csc-textpic-intext-left-nowrap DIV.csc-textpic-imagewrap{float:left;clear:both}
.csc-textpic-intext-left ol,.csc-textpic-intext-left ul{padding-left:40px;overflow:auto}
DIV.csc-textpic-caption-c .csc-textpic-caption,DIV.csc-textpic-center{text-align:center}
DIV.csc-textpic-caption-l .csc-textpic-caption,DIV.csc-textpic-center DIV.csc-textpic-text{text-align:left}
DIV.csc-textpic IMG,DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image DD IMG{border:none}
DIV.csc-textpic DIV.csc-textpic-imagewrap DIV.csc-textpic-image,DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image,DIV.csc-textpic-left DIV.csc-textpic-imagewrap,DIV.csc-textpic-intext-left DIV.csc-textpic-imagewrap{float:left}
DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image DT,DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image DD{float:none}
DL.csc-textpic-image,DL.csc-textpic-image DD,DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-image .csc-textpic-caption{margin:0}
DIV.csc-textpic-clear,DIV.csc-textpic DIV.csc-textpic-imagerow,DIV.csc-textpic-above DIV.csc-textpic-text{clear:both}
DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-image,DIV.csc-textpic DIV.csc-textpic-single-image IMG,*+html DIV.csc-textpic DIV.csc-textpic-imagerow{margin-bottom:10px}
*+html DIV.csc-textpic DIV.csc-textpic-imagerow .csc-textpic-image,DIV.csc-textpic DIV.csc-textpic-imagerow-last{margin-bottom:0}
DIV.csc-textpic-right DIV.csc-textpic-imagewrap,DIV.csc-textpic-intext-right DIV.csc-textpic-imagewrap{float:right}
* html DIV.csc-textpic-intext-right-nowrap .csc-textpic-text,* html DIV.csc-textpic-intext-left-nowrap .csc-textpic-text,* html .csc-textpic-intext-left ol,* html .csc-textpic-intext-left ul{height:1%}



DIV.introText  ,DiV.finalText{

/*font-style: italic;
*/
clear: left;
font-size: 1.5em;
/*font-weight: 100;
list-style-type: none;*/
line-height: 1.4em;
white-space: nowrap;
margin: 0 0 0px; 
padding: 0px 0 0 24px;

}

.ftl:hover {opacity:0.7;}