@import url("https://fast.fonts.net/lt/1.css?apiType=css&c=61397acf-bbf8-4dc9-8feb-29830c7d2eca&fontids=5664081,5664093");

@font-face{
        font-family:"Helvetica N Thin";
        src:url("fonts/5664081/da266c3a-a094-4adc-a81e-12f73609ba16.eot?#iefix");
        src:url("fonts/5664081/da266c3a-a094-4adc-a81e-12f73609ba16.eot?#iefix") format("eot"),
        	url("fonts/5664081/7d63ccf8-e0ae-4dee-ad4d-bbc798aa5803.woff2") format("woff2"),
        	url("fonts/5664081/b2c1327f-ab3d-4230-93d7-eee8596e1498.woff") format("woff"),
        	url("fonts/5664081/922917a9-4ca8-4c0b-b1bb-417b6ff0210e.ttf") format("truetype");
        font-style: normal;
    }
@font-face{
        font-family:"Helvetica N Roman";
        src:url("fonts/5664093/522972a6-5867-47ae-82fc-a7cf9bd5d4d4.eot?#iefix");
        src:url("fonts/5664093/522972a6-5867-47ae-82fc-a7cf9bd5d4d4.eot?#iefix") format("eot"),
        	url("fonts/5664093/08b57253-2e0d-4c12-9c57-107f6c67bc49.woff2") format("woff2"),
        	url("fonts/5664093/08edde9d-c27b-4731-a27f-d6cd9b01cd06.woff") format("woff"),
        	url("fonts/5664093/8f4a1705-214a-4dd0-80b8-72252c37e688.ttf") format("truetype");
    }

/* This CSS resource incorporates links to font software which is the valuable copyrighted property of Monotype and/or its suppliers. You may not attempt to copy, install, redistribute, convert, modify or reverse engineer this font software. Please contact Monotype with any questions regarding Web Fonts: http://www.fonts.com */

body {
	font-family: "Helvetica N Roman";
}


h1,h2,h3,h4,h5,h6 {font-family: "Helvetica N Roman"; }

/*keine underlines*/
a, a:link, a:visited, a:hover, a:active {
    text-decoration: none;
}

p {
	font-size: 3.5vw;
	line-height: 140%;
	padding-bottom: 8%;
	font-family: "Helvetica N Roman";
}

h1 {
	font-size: 8vw;
	line-height: 140%;
	margin: 7% 8% 8% 8%;
}

h2 {
	font-size: 6vw;
	line-height: 140%;
}

h3.subtitle {
  font-size: 4vw;
  margin: -7% 8% 8% 8%;
  line-height: 150%;
}

.footer a {
	font-size: 4vw;
	color: #fff;
	display: block;
	font-family: "Helvetica N Thin";
}

.standorte h3 {
	font-size: 3.5vw;
	line-height: 160%;
	font-family: "Helvetica N Thin";
}

.standorte h3:first-line {
	font-size: 4vw;
	font-family: "Helvetica N Roman";
}

/*Standorte 2. Spalte*/
.content td {
	font-size: 4vw;
	padding-bottom: 5vw;
	line-height: 130%;
	font-family: "Helvetica N Roman";
}

.content td:nth-child(2) {
	color: #939393;
}

.content td:first-child {
}

.menu li a {
	font-size: 4vw;
	color: #fff;
	font-family: "Helvetica N Thin";
}

.active a {
	font-family: "Helvetica N Roman" !important;
}

.tabbed label {
	font-size: 4vw;
	color: #fff;
	font-family: "Helvetica N Roman";
}

/*andere schriftfarbe auf der Startseite*/

.startseite p {
	font-size: 4vw;
	line-height: 150%;
	color: #fff;
	padding-bottom: 0%;
}

.startseite .standorte p {
	color: black;
}

/*Wienkarte Abstände*/

img {
	width: 100%;
}

.wienkarte {
	margin-top: 3%;
	margin-bottom: 10%;
	margin-left: -4%;
	margin-right: -4%;
}

/*Logo*/
.logo {
	position: absolute;
	top: 3%;
	left: 5%;
	width: 30%;
}

/*anderer Hintergrund auf der Startseite*/

body.startseite {
	background-color: #939393;
}

body.startseite p {
	margin-top: 15%;
	margin-bottom: 10%;
}

/*Headerbild*/
.header img {
	height: 100%
}

.content {
	margin: 8% 8% 5% 8%;
	height: 100%;
	position: relative;
}

/*Zweispaltiges Text-Layout in Tabelle*/

.content table {
	width: 100%;
}

.content td:first-child {
	padding-right: 3%;
  width: 50%;
}

.content td:nth-child(2) {
		padding-left: 3%;
    width: 50%;
}

.content td a {
	color: black;
	text-decoration: underline;
}

.content td:nth-child(2) a {
	color: #939393;
	text-decoration: underline;
}


/*Fotorama*/
.fotorama {
	margin-bottom: 11%;
}

/* Standorte Theming */

.wrapper {
	width: 100%;
	display: table;
	background-color: #fff;
	margin-bottom: 4%;
		-webkit-box-shadow: 0.5vw 0.5vw 1.5vw 0 rgba(0,0,0,0.5);
	-moz-box-shadow: 0.5vw 0.5vw 1.5vw 0 rgba(0,0,0,0.5);
	box-shadow: 0.5vw 0.5vw 1.5vw 0 rgba(0,0,0,0.5);
}

.column-1 {
	display: table-cell;
	width: 20%;
	vertical-align: middle;
}

.standorte img {
	display: block;
}

.column-2 {
	display: table-cell;
	width: 80%;
	vertical-align: middle;
}

.standorte h3 {
	padding-left: 4%;
	color: black;
	padding-bottom: 1%;
}

/*Fußleiste*/
.footer {
	background: #939393;
	position: relative;
	padding: 12% 8% 8% 8%;
}

/*Video*/

video {
	position: relative;
	width: 100%;
}

/*Menu Navigation*/

input[type=checkbox] {
	display: none;
}

input[type=checkbox] ~ label {
	z-index: 22;
	display: block;
	position: absolute;
	top: 3%;
	right: 5%;
}

.menu {
	display: none;
}

input[type=checkbox]:checked ~ label ~ .menu {
	display: block;
	background-color: #939393;
	height: 100%;
	width: 84%;
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	padding: 12% 8% 10% 8%;
	z-index: 1;
}

.menu li {
	padding-bottom: 7%;
	width: 84%;
}

.content {
	z-index: 0;
}

label.toggle /* Menu mittlere linie*/ {
	position: absolute;
	top: 10%;
	right: 100%;
	color: #fff;
	font-size: 5vw;
	height: 3vw;
	width: 5vw;
}

.toggle span {
	position: relative;
	height: 1px;
	margin: 30% 0px;
	display: block;
	background: #ffffff;
	-webkit-transition: background 0.3s ease-in-out;
	transition: background 0.3s ease-in-out;

}

.toggle::before,
.toggle::after /*Menu obere und untere linie*/{
	left: 0;
	content: '';
	width: 5vw;
	height: 1px;
	background: #ffffff;
	position: absolute;
	-webkit-transform-origin: center center;
	transform-origin: center center;
	-webkit-transition: width 0.2s ease-in-out, background 0.2s ease-in-out, top 0.2s ease-in-out, bottom 0.2s ease-in-out, left 0.2s ease-in-out, right 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
	transition: width 0.2s ease-in-out, background 0.2s ease-in-out, top 0.2s ease-in-out, bottom 0.2s ease-in-out, left 0.2s ease-in-out, right 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
	transition: width 0.2s ease-in-out, background 0.2s ease-in-out, transform 0.2s ease-in-out, top 0.2s ease-in-out, bottom 0.2s ease-in-out, left 0.2s ease-in-out, right 0.2s ease-in-out;
	transition: width 0.2s ease-in-out, background 0.2s ease-in-out, transform 0.2s ease-in-out, top 0.2s ease-in-out, bottom 0.2s ease-in-out, left 0.2s ease-in-out, right 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
	filter: drop-shadow(-0.8px -0.8px 5px #000 );
}

.toggle::before {
	top: 0;
}

.toggle::after {
	bottom: 0;
}

input[type=checkbox]:checked + .toggle::before {
	top: 45%;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

input[type=checkbox]:checked + .toggle::after {
	bottom: 50%;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

input[type=checkbox]:checked + .toggle::before,
input[type=checkbox]:checked + .toggle::after {
	width: 100%;
	height: 5%;
	background: #fff;
}

input[type=checkbox]:checked + .toggle span {
	display: none;
	-webkit-transition: background 0.3s ease-in-out;
	transition: background 0.3s ease-in-out;
}

.impressum, .projekt{
	color: #fff;
	margin-top: 25%;
	margin-bottom: 10%;
}

body.startseite h1 {
	color: #fff;
}

/*Projektseite Tabbed*/

.tabbed > input,
.tabbed figure > div { display: none; }

/* Tabs mit radio-Buttons */
.tabbed figure {
   display: block;
   clear: both;
}

#tab1:checked ~ figure .tab1,
#tab2:checked ~ figure .tab2 { display: block; }

.tabbed label {
	float: left;
	width: 50%;
	text-align: center;
	padding: 2% 0 2% 0;
	margin: 0% 0% 6% 0;
}

/*Farbwechseln von den Tabs bei wechselnder Sprache*/

#tab1:checked ~ nav label:first-child {
	background-color: rgba(255,255,255,0.4);
	-webkit-transition: background-color 0.3s ease;
	transition: background-color 0.3s ease;
}

#tab2:checked ~ nav label:nth-child(2) {
	background-color: rgba(255,255,255,0.4);
	-webkit-transition: background-color 0.3s ease;
	transition: background-color 0.3s ease;
}

/*Bilder in der Projektunterstützung*/

.support p, .memento p {
	margin-bottom: 5% !important;
	margin-top: 5% !important;
	text-transform: uppercase;
	font-size: 2.5vw;
	color: #333333;
	text-align: center;
}

.memento-link {
	width: 100%;
}

.support2 td {
	width: 33%;
	padding: 2%;
}


.memento a {
	color: #333333;
	width: 100%;
	text-align: center;
}

#projekt-image {
  margin-bottom: 10%;
}

/*alles für große bildschirme*/

@media screen and (min-width: 1140px) {
	body {max-width: 1140px; margin: 0 auto;position:relative;}
	body.startseite p {font-size: 25px;}
	.standorte h3 {font-size: 25px;}
	.standorte h3:first-line {font-size: 40px}
	h1 {font-size: 60px;}
	.content td {font-size:35px}
	.footer a {font-size:30px}
	.menu li a {font-size: 30px}
	.logo {top:1%}
	input[type=checkbox] ~ label {top:1%}
	body.startseite .content {margin-top:0;}
	.wienkarte {margin-top: 15%}
	.projekt {margin-top:3%;padding-top: 20%;}
	.impressum {margin-top:5.7%;padding-top:17.5%;}
}

/*Schatten beim Logo und Menü*/

.logo img {
	filter: drop-shadow(2.25px 2.25px 10px #939393);
	-webkit-filter: drop-shadow(2.25px 2.25px 10px #939393);
	-moz-filter: drop-shadow(2.25px 2.25px 10px #939393);
}

body.startseite .logo img {
	filter: initial;
}

.toggle::before, .toggle::after, .toggle span {
	filter: drop-shadow(2.25px 2.25px 10px #939393);
	-webkit-filter: drop-shadow(2.25px 2.25px 10px #939393);
	-moz-filter: drop-shadow(2.25px 2.25px 10px #939393);
}

body.startseite .toggle::before, body.startseite .toggle::after,  body.startseite .toggle span {
	filter: initital;
	-webkit-filter: initial;
	-moz-filter: initial;
}

/*Bilder downloads verhindern*/
img, .standorte img, .header img, .fotorama img {
    pointer-events: none;
}