/* Article Videos cookie consent */
div.elastic-video.consent  {background-repeat:no-repeat; background-size:cover; background-position:center;}
div.elastic-video.consent .cookieconsent-optout-marketing.consent div {position:absolute; width:auto; left:20px; right:20px; bottom:35%; z-index:998; text-align:center; color:#ffffff;}
div.elastic-video.consent .cookieconsent-optout-marketing.consent div span {background:rgba(0, 0, 0, 0.3); border-radius:10px; padding:10px;}
div.elastic-video.consent .cookieconsent-optout-marketing.consent div span a {color:#ffffff; text-decoration:underline;}

/* Modal Popup Videos cookie consent */
div.modal .cookieconsent-optout-marketing.consent div {position:absolute; width:auto; left:20px; right:20px; bottom:35%; z-index:999; text-align:center; color:#ffffff;}
div.modal .cookieconsent-optout-marketing.consent div span {background:rgba(0, 0, 0, 0.3); border-radius:10px; padding:10px;}
div.modal .cookieconsent-optout-marketing.consent div span a {color:#ffffff; text-decoration:underline;}

button.close {width: 40px; height: 40px; background: #fff; position: relative;}

section.bg-blue button.close {top: -30px;}

button.close span,
button.close span::before,
button.close span::after{
	display:block;
	position:absolute;
	width:20px;
	height:1px;
	left:10px;
	background:#000;
	content:'';
}

button.close span::before {top: -6px; left: 0px;}
button.close span::after {bottom: -6px; left: 0px;}

button.close span {background: none; background: transparent;}

button.close span::before {top: 0; -webkit-transform: rotate(45deg); -moz-transform:rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}
button.close span::after {bottom:0; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg);}

.ratio-16x9 iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

.link-visible.mehr::before {content:'Mehr ';}
.link-visible.change::before {content:'Weniger ';}

/* Hack fuer doppelte Landeskoordination */
.standort14, .standort12, .standort10, .standort6, .standort4, .standort2 {display: none;}

@media (max-width: 1023px) {

	body.disabled {height: 100%; overflow-y: hidden;}

	.menu {
  	background: #fff;
  	top: 70px;
  	transition: all 0.5s;
	}

	.logo.active {position: fixed; left: 0; top: 0;}

	.menu.active {display: block;}

	.toggle span {-webkit-transition: background 0s 0.1s; -moz-transition: background 0s 0.1s; -o-transition: background 0s 0.1s; -ms-transition: background 0s 0.1s; transition: background 0s 0.1s;}
	.toggle span::after {-webkit-transition-duration: 0.1s, 0.1s; -moz-transition-duration: 0.1s, 0.1s; -o-transition-duration: 0.1s, 0.1s; -ms-transition-duration: 0.1s, 0s; transition-duration: 0.1s, 0.1s; -webkit-transition-delay: 0.1s, 0s; -moz-transition-delay: 0.1s, 0s; -o-transition-delay: 0.1s, 0s; -ms-transition-delay: 0.1s, 0s; transition-delay: 0.1s, 0s;}
	.toggle span::before {-webkit-transition-property: top, transform; -moz-transition-property: top, transform; -o-transition-property: top, transform; -ms-transition-property: top, transform; transition-property: top, transform;}
	.toggle span::after {-webkit-transition-property: bottom, transform; -moz-transition-property: bottom, transform; -o-transition-property: bottom, transform; -ms-transition-property: bottom, transform; transition-property: bottom, transform;}
	.toggle.active span {background: none; background: transparent;}
	.toggle.active span::before {top: 0; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}
	.toggle.active span::after {bottom:0; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg);}
	.toggle.active span::before, .toggle.active span::after {-webkit-transition-delay: 0.1s, 0s; -moz-transition-delay: 0.1s, 0s; -o-transition-delay: 0.1s, 0s; -ms-transition-delay: 0.1s, 0s; transition-delay: 0s, 0.1s;}
	.menu a {display: block; padding: 0 20px 5px 20px;}
	.menu ul, .menu > li:nth-child(2), .menu > li:nth-child(3) {padding-bottom: 12px;}
	.menu li li a {font-size: 12px; padding: 0 20px 5px 30px;}
}

@media (min-width: 1024px) {

	body.disabled {overflow-y: visible !important;}
	
	.menu>li:hover > ul {display: block; z-index: 1001;}
  	
  	.menu ul {
  	font-size: 12px;
  	background: #fff;
  	display: none;
  	position: absolute;
  	z-index: 10;
  	min-width: 190px;
  	padding-top: 8px;
  	padding-bottom: 8px;
	}
	
	.menu ul li {line-height: 16px; padding-top: 3px; padding-bottom: 3px;}
	
	.menu li:first-child ul {min-width: 220px;}
}

section.table-md header {display: table-caption; background: #fff;}

section.table-md header h1 {margin-top: 0; margin-bottom: 20px;}

.block {display: block;}

.inline {display: inline;}

.ratio-14x5 {padding-top: 35.714286%;}

.ratio-3x2.vw20 {padding-top: 13.333333%; float:left; margin:0 20px 8px 0;}

.small-spacer {display: block; height: 5px; clear: both;}

.medium-spacer {display: block; height: 10px; clear: both;}

.large-spacer {display: block; height: 20px; clear: both;}

.x-large-spacer {display: block; height: 40px; clear: both;}

h3 {
  font-weight:400;
  margin-top: 0;
  margin-bottom: 20px;
}

nav.ueber-wellcome a {
  display: block;
  border-bottom: 1px dotted #ccc;
  padding: 10px 0;
}

nav.ueber-wellcome a:last-child {border-bottom: 0}

h3.diagramm {position: absolute; left: 20px; top: 0;}

.text-center {text-align: center;}

.yellow {color: #fbba01;}
.red {color: #e3011b;}

.button,
input[type=submit] {
  display: table;
  margin-left: auto;
  margin-right: auto;
  font-size: inherit;
  color: #fff;
  border-radius: 3px;
  padding: 9px 20px;
}

.button-small {
  display: table;
  margin-left: auto;
  margin-right: auto;
  font-size: 80%;
  color: #fff;
  border-radius: 3px;
  padding: 6px 12px;
}

article ul {margin: 0; padding: 0 0 0 20px; list-style-type: disc;}

article ul ul {padding-top: 20px;}

.button.vw-auto {width: auto;}

.button.blue, .button-small.blue   {background: #01529e;}
/*.button.green  {background: #55a532;} */
.button.green  {background: #42961d;}
.button.red    {background: #e30613;}
/* .button.orange, .button-small.orange  {background: #f49205;} */
.button.orange, .button-small.orange  {background: #f26c00;} 
.button.petrol {background: #0b8082;}
.button.wine-red {background: #ab2321;}

.ratio-3x2.de,
.ratio-3x2.at,
.ratio-3x2.ch {
  width: 60px;
  padding-top: 40px; 
  border-radius: 5px;
  background-size: 100% 100%;
}


.watch {margin: 0; height: 100%; overflow-y: hidden;}

.modal {
	display: none;
	width: 90%;
	height: 80%;
	position: fixed;
	top: 5%;
	left: 5%;
	z-index: 4;
	background: #fff;
	-webkit-animation-name: fadeIn;
	-webkit-animation-duration: 0.9s;
  	animation-name: fadeIn;
  	animation-duration: 0.9s;
  	-webkit-box-shadow:0 0 8px #9e9e9e;
 	-moz-box-shadow:0 0 8px #9e9e9e;
	-o-box-shadow:0 0 8px #9e9e9e;
 	 box-shadow:0 0 8px #9e9e9e;
	}

@-webkit-keyframes fadeIn {from {opacity: 0;} to {opacity: 1;}}
@keyframes fadeIn {from {opacity: 0;} to {opacity: 1;}}

.ratio-16x9 {width: 100%; padding-top: 56.25%; background: #000;}

.modal button {float: right;}

.bg-jubilaeum,
.bg-jubilaeum-aktion {
	background: #f3f3f0;
}

.bg-jubilaeum figure {
	background-image: url(/img/jubilaeum/20-jahre-wellcome/jubilaeum.jpg);
	background-size: auto 100%;
	background-repeat: no-repeat;
	background-position: center center;
}

.bg-jubilaeum-aktion figure {
	background-image: url(/img/jubilaeum/mit-herz-dabei/jubilaeum-aktion.jpg);
	background-size: auto 100%;
	background-repeat: no-repeat;
	background-position: center center;
}

.bg-spenden {
	background: #dcd7d3;
	background-image: linear-gradient(to left, rgba(255,255,255,0) 50%, rgba(255,255,255,.8));
}

.bg-spenden figure {
	background-image: url(/img/footer/spenden.jpg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: right top;
}

footer.row {position: relative; margin-top: 30px; margin-bottom: 20px;}
footer ul.vw50-xs {margin-bottom: 20px;}
footer ul.vw50-xs ul {margin-top: 8px;}
footer h4 {font-weight: 400; font-size: 16px; margin: 0 0 10px 0;}
footer h4 + ul li, .copyright li {display: inline-block; width: auto;}
footer h4 + ul li:last-child {margin-left: 3px;}
footer ul ul a {font-size: 12px; line-height: 16px; padding-top: 4px; padding-bottom: 4px;}
footer .copyright, footer .small {font-size: 12px;}
footer ul.vw50-xs a {display: block; padding-bottom: 5px;}
footer .icon {display: block; width:24px; height:24px; background-repeat: no-repeat; background-size: contain;}
footer .icon-lg {display: block; width:36px; height:36px; background-repeat: no-repeat; background-size: contain;}
footer hr {background:#ccc; border:0; height: 1px; margin: 10px 0;}
.copyright, footer .small {color: #666; line-height: 18px;}
.copyright li:first-child {width: 100%;}
.copyright a {display: block; margin: 4px 8px 4px 0;}

@media (min-width: 400px) {
	footer .last-ul {position: absolute; left: 10px; top: 330px;}
}

@media (min-width: 600px) {
	.block-sm {display: block;}
	.inline-block-sm {display: inline-block;}
	.none-sm {display: none;}
	.inline-sm {display: inline;}
	.copyright li:first-child {width: auto; margin-right: 10px;}
	footer .last-ul {position: absolute; left: 10px; top: 305px;}
	footer .text-center {display: table; width: 100%;}
	footer .text-center > * {display: table-cell; vertical-align: middle; padding: 5px; width:50%; text-align: right;}
	footer .text-center ul {text-align: left;}
	}

@media (min-width:768px) {
	.vw20-md {width: 20%;}
  	.vw19-md {width: 19%;}
	 .vw16-md {width: 16%;}
	.none-md {display: none;}
	.ratio-14x5.vw50-md {padding-top: 17.857143%;}
	.bg-spenden figure {
		background-size: cover;
		background-position: 50% 50%;
	}
	.news-teaser article:last-child {display: none;}
	footer .last-ul {position: static; left: 0; top: 0;}
}

@media (min-width:1024px) {
	.none-lg {display: none;}
}
small, .small {font-size: 12px; line-height: 16px;}

.mini {font-size: 10px; line-height: 12px;}
