@font-face {
  font-family: Open Sans;
  src: url(fonts/Open_Sans/OpenSans-VariableFont_wdth,wght.ttf)
}

body {
	font-family: 'Open Sans', sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-text-size-adjust: 100%;
	background:#20272D;
	margin:0;
	/*font-size: 1em;
	line-height:1em;*/
	font-weight:400;
	min-width:485px;
	color:rgba(255,255,255,0.85)
	}
h1,h2,h3,h4,h5{
	margin:0.5em 0 0.5em;
	font-size: 1.25em;
}
a,
a:link,
a:visited{
	opacity:1;
	text-decoration: none;	
	transition: all 0.5s ease 0s;
	outline: 0;
	color:rgba(255,255,255,0.6)
	}
a:hover,
a.active{
	color:rgba(255,255,255,1)
	}
a.link,
a.link:link,
a.link:visited{
	color:rgba(165,210,236,0.92);
	}
a.link:hover{
	color:rgba(165,210,236,1);
	}
select,
*:focus,
a:focus { 
	outline: none;
	}
img{
	border:0;
	}
small{
	font-size:0.8em;
	font-weight:400;
	}
b,strong{
	font-weight:600;
	}
p{
	font-size: 1.25em;
	}	
h2{
	margin:2em 0 0.7em;
	}
.navi {
    position: fixed;
    top: -80px;
    left: 0;
	right:0;
	height: 70px;
    background-color: rgba(0, 0, 0, 0.65);
    display: block;
    padding: 6px 12px;
    text-align: left;
    z-index: 99;
	transition: all 0.2s ease 0s;
	min-width: 800px;
}
.show .navi{
	top:0;
}
.navi .logo {	
	height:60px;
	}
.navi .links {	
	display: inline-block;
	}
.navi .links a{	
	margin-right: 20px;
	padding-bottom: 10px;
	}
.navi .links.lang{ 
	position: fixed;
	right: 25px;
	top: 11px;
	transition: all 0.2s ease 0s;
	}
.show .navi .links.lang{ 
	top: 47px;
	}
@media only screen and (max-width:1000px) {
.navi {   
    padding: 6px 12px;   
	}
.navi .links a {
    margin-right: 15px;
	}
.block.links{		
	padding: 20px 20px 20px 30px;
	min-width: 465px;
	}	
}
@media only screen and (max-width:900px) {
.show .navi  .links.lang{ 
	top: 7px;
	font-size: 0.8em;
	padding-bottom: 5px;
	}
.navi .links.lang a {
    padding-bottom: 7px;
	}
}
.navi .links a.active{	
	border-bottom: 1px solid rgba(255,255,255,1);
	}
.menu{
	display: inline;
}
#menubutton{
	display: none;
	}
.anchor#idee_link{
	position: absolute;
	top: -200px;
	}
.anchor#partizipation_link{
	position: absolute;
	margin-top: -500px;
	}
.logo_link{
	/*display: flex;
	justify-content: center;*/
	}
.app_logo{
	position:absolute;
	width:11vw;
	left:45vw;
	top:38vh;
/*	right: 25px;
	top:115px;*/
	max-width:170px;
	min-width:120px;
	}
.anfang{
	position: relative;
	/*color: #88B6C7;*/
	display: block;
	font-size: 1.5em;
	height: 91vh;
	}

.anfang h1{
	font-weight: 800;
	font-size: 3em;
	color: #E02020;
	margin: 0;
}
.anfang h3{
	font-weight: 500;
	font-size: 1em;
	color: #fff;
	margin: 0;
	width: 350px;
}
.anfang .kasten.text{
	margin-top: 16vh;
}	
.anfang .kasten p{
	font-weight: 500;
	font-size: 0.85em;
	color: #fff;
	margin: 0.6em 0;
}
.anfang .kasten p.anfordern{
	margin: 1.2em 0 0.75em;
}
.anfang .partner{
	margin-top: 1em;
	position: absolute;
	bottom: 0;
}	
.anfang h4{
font-weight: 600;
font-size: 1.2em;
	color: #fff;
	margin: 0;
}	
.anfang h5{
	font-weight: 500;
	font-size: 0.9em;
	color: #fff;
	margin: 0;
}	
.anfang .button{
	display: none;
}
.ticker{
	font-size: 1em;
	font-weight: 800;
	text-align: center;
}
@media only screen and (max-device-width : 900px) {
.anfang{
	font-size: 1.4em;
	}
}
@media only screen and (min-device-width : 781px) {
	.dropdown{
		display:inline !important;
	}
}

@media only screen and (max-device-width : 780px) {
.anfang{
	font-size: 1.3em;
	}
.ticker{
	font-size: .85em;
}
}
.gallery_item .berlin1945{
	margin: 50px 50px 0 0;
	text-align: right;
}
.gallery_item .berlin1945 h1{
	font-weight: 800;
	font-size: 3em;
	color: #E02020;
	margin: 0;
}
.gallery_item .berlin1945 h3{
	font-weight: 500;
	font-size: 1em;
	color: #fff;
	margin: 0;
}
.preise{
	position: relative;
	margin: -98vh 25px 127vh;
	font-size: 0.6em;
	display: flex;
}
.preise .lorbeer {
	width: 160px;
	text-align: center;
	text-align: -moz-center;
	text-align: -webkit-center;
	/*display: flex;
	flex-direction: column;
	justify-content:center;*/
}
.preise .lorbeer img{
	height: 100px;
	display: block;
}

.vote{
	position: absolute;
	bottom: 45px;
	left: 20px;
	font-size: 0.85em;
	font-weight: 600;
	font-weight: 600;
}
.vote img{
	height: 80px;
	display: block;
}

body.start .stores{
	
	}
.stores{
	position: fixed;
	bottom: 30px;
	/*right: -50vw;*/
	color: #88B6C7;
	/*text-align: right;
	width: 97vw;*/
	display: block;
	font-size: 1.5em;
	/*margin: 0 auto;*/
	z-index: 100;
	transition: all 0.3s ease 0s;
	right: calc(50% - 180px);
	}
.show .stores{
	/*text-align: center;*/
	
	}

.stores img{
	width: 170px;
	margin: 0.2em;
	}
@media only screen and (max-device-width : 900px) {
	/*.stores {
    right: -75vw;
}*/
}
.text.kasten{
	position:absolute;
	background: rgba(0,0,0,0.65);
	width: 462px;
	padding: 14px 20px;
	font-size:0.8em;
	margin-top: 4em;
	}
#mithelfen .text.kasten{
	width: 580px;
	padding: 10px 20px 22px;
	}
#mithelfen .flex {
	display: flex;
	align-items: center;	
}
#mithelfen .flex p{
	margin: 0 0 0 35px;
	}
.kasten.left{
	left: 30px;	
	}
.kasten.right{
	right: 30px;	
	}
.kasten.bottom{
	bottom: 30px;	
	}
.text.kasten.left.bottom{
	width: 425px
	}

/*content*/
.block{
	position:relative;
	margin:0 auto;
	max-width:820px;
	min-width:535px;
	z-index:66;
	padding:20px 40px;
	font-size:0.8em;
	}
.static .block{
	padding:120px 40px 20px;
	font-size:0.8em;
	}

.block.links{
	font-size:1em;
}
.block.left{
	float: left;
}
.block.right{
	float: right;
	text-align: right;
}
.block.small{
	font-size:0.7em;
	padding:5px 40px 30px;
}
.block.top{
	padding:20px 40px 0;
}
.ipad{
	background: url(images/ipad.png) no-repeat center center / contain;
	padding:38px 70px !important;
	max-width: 685px !important;
}
#zeitleiste .ipad{
	background: url(images/ipad.png) no-repeat center center / contain;
	padding:55px 70px 25px !important;
	max-width: 685px !important;
	margin-top: -20px;
	}
section#start .ani{
	position:fixed;
	width:100vw;
	}	
section#start .anifull{
	position:fixed;
	width:100vw;
	height: 100vh;
	}
section#start .gallery_item{
	position:static;
	width:100vw;
	height: 100vh;
	}
section#start .anifull img{
	/*min-height: 100%;*/
	width: 100%;
	height: auto;
	}
#kontakt .block.right{
	margin-top: 36px;	
	}

section#schloss div {
	height:100vh;
	width:150vh;
	margin: 0 auto; 
}
section#schloss .ani{
	position:fixed;
	height:100vh;
	}
section#schloss .anchor{	
	height:100vh;
	}
section#schloss #navi{
	position:fixed;
	z-index:100;
	height:100px;
	margin:0 auto;
	bottom:0;
	}
section#schloss #navi a{
	float:left;
	height:100px;
	}	
img.quer{
	margin:1.5em 0;
	width: 100%;
	}
section .gone {
    opacity: 0;
	pointer-events:none;
	}
#screens{
	width:250px;
	padding-left:50px;
	float:right;
	}
#screens img{
	width:250px;	
	}
	

/*section*/
section{
	position:relative;
	color:#FFF;
	}
section a:link,
section a:visited{
	color:rgba(255,255,255,1)
	}
section a:hover{
	color:rgba(255,255,255,0.85)
	}
section#partizipation{
	height:100vh; background: url(bilder/partizipation.jpg) top center / cover;
	min-height:810px;
	} 
section#mithelfen{
	height:85vh; background: url(bilder/zeitzeugen.jpg) center center / cover;
	min-height:640px;
	} 
section#partner{
	height:70vh; background: url(bilder/partner.jpg) center center / cover;
	min-height:990px;
	font-size: 0.85em;
	line-height: 1.1em;
	} 
section#partner h2{
		margin:0.3em 0;
	} 
section#partner h3{
		margin:1em 0 0.3em;
	} 
section#partner p{
		margin:0.5em 0;
	} 


section#kontakt{
	height:40vh; background: url(bilder/kontakt.jpg) center center / cover;
	min-height:340px;
	} 


.galerie div img{
	width: 100%;
	width: 700px;
}

/*slider*/
#content .startslider{
	margin:35px 0 60px;
	height:307px;
	border:1px solid rgba(0,0,0,0.35);
	/*box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);*/
	}
.slickslide{
	position:relative;
	text-align:center;
	width:760px;
	display:none;
	}
 .slickslide.slick-initialized{
      display: block;
    }
.slickslide .slide span{
	position:absolute;
	top:150px;
	font-size:18px;
	margin:0 -140px;
	}
.slickslide .slide strong{
	font-weight:600;
	}
.slickslide .button{
	position:absolute;
	font-size:18px;
	line-height: 26px;
	padding:3px 14px 3px 34px;
	top:222px;
	margin:0 -87px;	
	opacity:0.95;
	}
.slickslide .button img{
	left: 9px;
    position: absolute;
    top: 7px;
	}
.galerie .slick-dots {
    position:absolute;
    bottom:1px;
	/*bottom: -47px;*/
    top:auto;
    left:28px;
    right:0;
    text-align: center;
	height:30px;
    line-height:0;
	font-size: 9px;
	font-weight: 400;
}
.galerie .slick-dots li{
    margin:0 17px; 
	display:inline-block;
	opacity:0.8;
	background:rgba(0,10,20,0.2);
	cursor:pointer;
	}
.galerie .slick-dots li:hover{
	opacity:1;
	background:rgba(0,10,20,0.1);
	}
.galerie .slick-dots li .tab{
   display:flex;
	/*align-items: center;*/
    justify-content:center;
	/*margin: 0 12px;*/
}
.galerie .slick-dots li:nth-child(1){
	margin-right: 45px;
	}
.galerie .slick-dots li:nth-child(5){
	margin-right: 45px;
	}
.galerie .slick-dots li:nth-child(9){
	margin-right: 45px;
	}
.galerie .slick-dots li .tab img{
	margin-right:2px;
	height: 26px;
	}
.galerie .slick-dots li.slick-active{
	opacity:0.85;
	background:none;
	cursor:default;
	}
.slick-thumbs {
    position:absolute;
    left: -9999px;
	}
#play{
	position: absolute;
	left: 88px;
	bottom: 62px;
	height: 23px;
	width: 23px;
	overflow: hidden;
	opacity: 0.7;
	background: url(images/playpause.png) no-repeat -23px top / 40px;
	cursor: pointer;
	}
#play.paused{
	background-position: left top;
	}
#play:hover{
	opacity: 1;
	}
.slick-prev, .slick-next {
	display: none !important;
    /*position: absolute;
   	background: transparent none repeat scroll 0 0;
    border: medium none;
    color: transparent;
    cursor: pointer;
    font-size: 0;
    height: 100px;
    line-height: 0;
    outline: medium none;
    padding: 0;
    top: 104px;
    width: 23px;
	opacity:0.55;*/
}
.slick-prev:hover, .slick-next:hover{
	opacity:0.75;
	}
.slick-prev{
    left:12px;
	background:url(images/slide-back.png);
	}
.slick-next{
    right:12px;
	background:url(images/slide-next.png);
	}

/*attribution*/	
.attribution{
	position: absolute;
	margin-left:20px;
	bottom:10px;
	padding:0 15px;
	font-size:0.66em;
	z-index:66;
	color:rgba(255,255,255,0.85);
}
.attribution a:hover{
	color:rgba(255,255,255,1);
}
.attribution em{
	font-size:1.3em;
	font-style:normal;	
}
.attribution.pin_orange{
	background:url(images/pin_orange.png) no-repeat left top / contain;	
}
.attribution.pin_rot{
	background:url(images/pin_rot.png) no-repeat left top / contain;	
}
.attribution.pin_oliv{
	background:url(images/pin_oliv.png) no-repeat left top / contain;	
}
.attribution.pin_blau{
	background:url(images/pin_blau.png) no-repeat left top / contain;	
}
.attribution.pin_weiss{
	background:url(images/pin_weiss.png) no-repeat left top / contain;	
}  

.button {
    font-size: 16px;
    background-color: #78960D;
    padding: 4px 12px;
    margin: 0;
	cursor: pointer !important;
}
.anfang .button {
   background: #E02020;
   padding: 4px 8px; 
   color: #fff; 
   text-decoration: none;
}
#newsletter-form input{
	padding: 5px;
	
}

/*allgemein*/			
ul.list {
	padding:0;
    margin:3px 0 20px;
	}
ul.list li {
    list-style: outside none none;
    padding-left: 14px;
    margin:2px 0 ;
	}
	
ul.list li::before {
    content: "• ";
    content: "■ ";
    font-family: "Arial Black";
    color: #F8AB20;
}	

.left{
	float:left;
	}			
.right{
	float:right;
	}
.clear{
	clear:both;
	}
.abstand{
	line-height: 40px;
}

#logos{
	text-align: center;
	padding: 3em 0;
	background: rgba(0,0,0,0.30);
}
#logos .logo{
	width: 30%;
	padding: 0 1% .25em;
	margin: 0 5%;
	border-bottom: 1px solid rgba(113,113,113,0.5);
}
#logos .logo:last-child,
#logos .logo:nth-last-child(2){
	border-bottom: 0 none;
}


#kontakt {
	margin-bottom: 60px;
}

#kontakt .social{
	display:flex;
	justify-content:flex-end;	
	/*float:right;
	text-align: right;*/	
	}	
#kontakt .social img{
	margin:4px 3px 0 3px;
	height:28px;
	opacity:0.65;
	max-width:none;
	}	
#kontakt .social a{
	margin-left: 4px;
}
#kontakt .social a.facebook{
	width:30px;
	height:34px;
	overflow:hidden;
}
#kontakt .social a.facebook img{
	margin-left:1px;
	}
#kontakt .social a.instagram{
	width:30px;
	height:34px;
	overflow:hidden;
	}
#kontakt .social a.instagram img{
	margin-left:-28px;
	height:28px;
	}
#kontakt .social a.twitter{
	width:30px;
	height:34px;
	overflow:hidden;
	}
#kontakt .social a.twitter img{
	margin-left:-57px;
	}
#kontakt .social img:hover{
	opacity:1;
	}	
.store_bottom{
	/*height: 60px;*/
}
.support{
	width: 450px;
	position: relative;
	bottom: 175px;
	left: 10px;
}
.support h5{
	font-size: 0.9em;
	 color:rgba(165,210,236,0.92);
}
.support .logos{
	/*display: flex;
	flex-direction: row;*/
	display: block;
	float: left;
}
.support img{
	height: 100px;
	margin-right: 10px;
}

.unterstuetzung{
  width: calc(100vw - 20px);
    width: 150px;
    padding: 10px;
}


