/* yantramanav-300 - latin */
@font-face {
  font-family: 'Yantramanav';
  font-style: normal;
  font-weight: 300;
  src: url('/fileadmin/default/fonts/yantramanav/yantramanav-v3-latin-300.eot'); /* IE9 Compat Modes */
  src: local('Yantramanav Light'), local('Yantramanav-Light'),
       url('/fileadmin/default/fonts/yantramanav/yantramanav-v3-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fileadmin/default/fonts/yantramanav/yantramanav-v3-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('/fileadmin/default/fonts/yantramanav/yantramanav-v3-latin-300.woff') format('woff'), /* Modern Browsers */
       url('/fileadmin/default/fonts/yantramanav/yantramanav-v3-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/fileadmin/default/fonts/yantramanav/yantramanav-v3-latin-300.svg#Yantramanav') format('svg'); /* Legacy iOS */
}
/* yantramanav-700 - latin */
@font-face {
  font-family: 'Yantramanav';
  font-style: normal;
  font-weight: 700;
  src: url('/fileadmin/default/fonts/yantramanav/yantramanav-v3-latin-700.eot'); /* IE9 Compat Modes */
  src: local('Yantramanav Bold'), local('Yantramanav-Bold'),
       url('/fileadmin/default/fonts/yantramanav/yantramanav-v3-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fileadmin/default/fonts/yantramanav/yantramanav-v3-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('/fileadmin/default/fonts/yantramanav/yantramanav-v3-latin-700.woff') format('woff'), /* Modern Browsers */
       url('/fileadmin/default/fonts/yantramanav/yantramanav-v3-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/fileadmin/default/fonts/yantramanav/yantramanav-v3-latin-700.svg#Yantramanav') format('svg'); /* Legacy iOS */
}






/*! HTML5 Boilerplate v5.3.0 | MIT License | https://html5boilerplate.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {
	color: #000;
	font-family: 'Yantramanav', helvetica, arial, sans-serif;
	font-size: 1em;
	font-weight: 300;
	line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
	background: rgba(87,87,87,.25);
	text-shadow: none;
}

::selection {
	background: rgba(87,87,87,.25);
	text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #666;
	margin: 1em 0;
	padding: 0;
	clear: both;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
	vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
	border: 0;
	margin: 0;
	padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
	resize: vertical;
}

/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */

.browserupgrade {
	margin: 1em 0;
	background: #e6342d;
	color: #fff;
	padding: 1em 0;
}

/* ==========================================================================
   Author's custom styles

   grey #666 rgba(102,102,102,1)
   red #e6342d rgba(230,52,45,1)

   font-family: 'Yantramanav', helvetica, arial, sans-serif;
   light: 300 / bold: 700

   .no-svg
   ========================================================================== */

img, embed, object { max-width: 100%; height: auto; width: 100%; }
a, a:visited { cursor: pointer; text-decoration: none; }
.center { margin: 0 auto; max-width: 64em; width: 90%; }
strong { font-weight: 700; }

a,
table tr {
	-webkit-transition: all .2s ease-out;
	-moz-transition: all .2s ease-out;
	-o-transition: all .2s ease-out;
	transition: all .2s ease-out;

	box-sizing: border-box;
}

.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; margin:0 0 1em; }
.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* ==================================================
   sticky footer
   ================================================== */

html { position: relative; min-height: 100%; }
body { margin: 0 0 5em; /* 80px, bottom = pagefooter height */ }


/* ==================================================
   general form definitions
   ================================================== */

form * { box-sizing: border-box; }
legend { display: none; }

input[type="text"],
input[type="email"],
input[type="password"],
select,
textarea {
	background: #fff;
	border: 1px solid #666;
	margin: 0 0 1em;
	padding: .35em .4em .3em;
	transition: all .2s ease-out;
	width: 100%;
}

input[type="text"]:focus,
input[type="text"]:hover,
input[type="email"]:focus,
input[type="email"]:hover,
input[type="password"]:focus,
input[type="password"]:hover,
select:focus,
select:hover,
textarea:focus,
textarea:hover { background: #e5e5e5; }

select { width: auto; }
textarea { padding: .35em .4em .3em; }

input[type="radio"] {
	margin: 0 .25em 0 0;
}

input[type="checkbox"] {
	margin: 0 .25em 0 0;
}

input[type="submit"] {
	background: #e5e5e5;
	border: 1px solid #666;
	color: #666;
	display: block;
	margin: 0 0 1em;
	padding: .35em 2em .3em;
	transition: all .2s ease-out;
	width: auto;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;

	-webkit-border-radius: 0;
	border-radius: 0;
}

input[type="submit"]:focus,
input[type="submit"]:hover { background: #666; color: #fff; }

.tx-powermail h3 { display: none; }
.powermail_fieldwrap { margin-bottom: 1em; }
.powermail_message_error { color: #e6342d; }
.content ul.powermail-errors-list { color: #e6342d; list-style: none; margin: 0 0 2rem; padding: 0; }

input[type="text"].powermail_field_error,
input[type="email"].powermail_field_error,
input[type="password"].powermail_field_error,
input[type="textarea"].powermail_field_error { border-color: #e6342d; }

.powermail_confirmation form:nth-child(2) { float: right; margin: -3em 0 3em; }
.powermail_confirmation h1 { font-size:1.25em; }


/* ==================================================
   general table definitions
   ================================================== */

table {
	border: 0;
	border-collapse: collapse;
	border-spacing: 0;
	margin: 0 0 1em;
	padding: 0;
}

table caption {
	color: #666;
	margin: 0 0 1em;
	text-align: left;
}

table tr:nth-child(even) {
	background: #f5f5f5;
}

table tr:hover {
	background: #e5e5e5;
}

table td,
table th {
	border: none;
	overflow: hidden;
	padding: .5em;
	text-align: left;
	vertical-align: top;
	word-break: normal;
}


/* =========================
   specific table definitions
   ========================= */

table.mytable { }


/* ==================================================
   pageheader
   ================================================== */

.pageheader { background: #fff; margin-bottom: 2.19em; /* 35px */ }


/* =========================
   meta navigation top
   ========================= */

.nav-meta-top {
	float: left;
	font-size: .8125em; /* 14px */
	letter-spacing: 1px;
	line-height: 1.5em;
	margin: 1.6em 4em 0 0;
}

.nav-meta-top ul { list-style: none; margin: 0; padding: 0; }
.nav-meta-top a { color: #666; }
.nav-meta-top a:hover { color: #e6342d; }


/* =========================
   language navigation
   ========================= */

.nav-language {
	float: left;
	font-size: 1.3125em; /* 21px */
	font-style: italic;
	margin: 1.5em 2em 0 0;
	text-transform: uppercase;
}

.nav-language ul { list-style: none; margin: 0; padding: 0; }
.nav-language li { float: left; }
.nav-language a { color: #000; }
.nav-language a:hover, .nav-language a.active { color: #e6342d; }
.nav-language .separator { margin: 0 .25em; }


/* =========================
   social navigation
   ========================= */

.nav-social { float: left; margin: 2.125em 0 0; }
.nav-social ul { list-style: none; margin: 0; padding: 0; }
.nav-social ul li { float: left; margin-right: .5em; }

.nav-social a {
	/*background-size: 100%;*/
	display: block;
	height: 1.25em; /* 20px */
	width: 1.25em; /* 20px */
}

/*.nav-social a.facebook { background: url('../img/facebook.svg') no-repeat center center; }*/
/*.nav-social a.twitter { background: url('../img/twitter.svg') no-repeat center center; }*/

.nav-social a svg:hover path { fill: #e6342d; }

/* =========================
   main logo
   ========================= */

a.logo-main {
	background: url('../img/logo_hauptstadtregion.svg') no-repeat 0 0;
	background-size: 100%;
	display: block;
	float: right;
	height: 4.4375em; /* 71px */
	margin: .625em 0; /* 10px */
	width: 26.0625em; /* 417px */
}


/* =========================
   menu-btn (oc-nav)
   ========================= */

.menu-btn {
	background: url('/fileadmin/default/img/menu_btn.svg') no-repeat center center;
	background-size: 100%;
	cursor: pointer;
	display: none;
	float: right;
	height: 1.69em; /* 27px */
	position: relative;
	width: 2.19em; /* 35px */
}

/*.menu-btn:hover { background: #ffcc00; }*/


/* ==================================================
   header img
   ================================================== */

.header-img {
	/*background: url('../img/bsp/02.jpg') no-repeat center center;*/
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 18.75em; /* 300px */
	overflow: hidden;
	padding-top: 0;
	position: relative;
}

/* different height on homepage*/
#page-1 .header-img { height: 30em; /* 480px */ }

/* temporary: fixed banner in headerimg on page-1 */
/* see condition in typoscript header img */
.header-img-bilinguisme { background: rgba(230,86,100,100) url('/fileadmin/user_upload/default/public/Zweisprachigkeit/bannerspacer.png') repeat center center; }
.header-img-bilinguisme a { display: block; height: 100%; }


/* ==================================================
   main navigation
   ================================================== */

.nav-main {
	background: #000;
	color: #fff;
	letter-spacing: 1px;
	padding: .62em 0; /* 10px */
}

.nav-main a { color: #fff; display: block; }
.nav-main a.active, .nav-main a:hover { color: #666; }

.nav-main ul { list-style: none; margin: 0; padding: 0; }
.nav-main ul.level-1 li { float: left; text-align: left; width: 22%; }
.nav-main ul.level-1 li:first-of-type { width: 19%; }
.nav-main ul.level-1 li:last-of-type { text-align: right; width: 15%; }
.nav-main ul.level-1 a { font-weight: 700; }

.nav-main ul.level-2 { display: block; margin-left: .5em; }

.nav-main ul.level-2 li,
.nav-main ul.level-2 li:first-of-type,
.nav-main ul.level-2 li:last-of-type {
	float: none;
	text-align: left;
	width: 100%;
}

.nav-main ul.level-2 a { font-weight: 300; }


/* ==================================================
   main content area
   ================================================== */

.main { color: #666; }


/* =========================
   content
   ========================= */

.content {
	float: left;
	font-size: 1.125em; /* 18px */
	margin-bottom: 3.5em;
	width: 70%;
}

.content h2,
.content p.lead { font-size: 1.125em; /* 18px */ font-weight: 700; margin: 0 0 1em; }

.content p { margin: 0 0 1em; }

.content figure { margin: 0 0 1.75em; }
.content figcaption { font-size: .833333333em; /* 15px */ line-height: 1.2; padding: .33em 0 0; }

.content ul { margin: 0 0 1em; padding: 0 0 0 1em; }
.content ol { margin: 0 0 1em; padding: 0 0 0 1.5625em; }

.content a, .content a:visited { border-bottom: 1px dotted #666; color: #666; }
.content a:hover { border-color: #e6342d; color: #e6342d; }
.content .red-line-link a { border-bottom: 1px solid #e6342d; color: #e6342d; display: block; margin: 1em auto 0; text-align: center; width: 17.78em; /* 320px */ }


/* =========================
   aside
   ========================= */

.aside {
	background: #fff;
	float: right;
	margin-bottom: 3.5em;
	width: 25%;
}

.aside h2 {
	border-top: 1px solid #666;
	font-size: 1.25em; /* 20px */
	margin: 0 0 2em;
	padding-top: .33em;
	text-align: center;
	text-transform: uppercase;
}


/* ==================================================
   pagefooter (a sticky one)
   ================================================== */

.pagefooter {
	background: #000;
	bottom: 0;
	color: #fff;
	height: 5em; /* 80px */
	left: 0;
	position: absolute;
	width: 100%;
}

.pagefooter .nav-meta-bottom ul { font-size: .75em; /* 12px */ list-style: none; margin: 2.5em 0 0; padding: 0; }
.pagefooter .nav-meta-bottom li { display: inline-block; }
.pagefooter .nav-meta-bottom a { color: #fff; }
.pagefooter .nav-meta-bottom .separator { margin: 0 .25em; }


/* ==================================================
   gridelements
   ================================================== */

/* =========================
   ge 2 columns
   ========================= */

.ge-2col { margin-bottom: 1.75em; }

.ge-2col-col1,
.ge-2col-col2 { float: left; margin-right: 4%; width: 48%; }
.ge-2col-col2 { margin: 0; }


/* ==================================================
   ce-elements
   ================================================== */


/* =========================
   ce mainheader
   ========================= */

/* 22.06.16: ALLE header über content zentrieren */
/*
.ce-mainheader { color: #e6342d; margin: 0 auto 2.19em; text-align: center; width: 75%; }
*/
.ce-mainheader { color: #e6342d; margin:0 0 2.19em 0; /* 35px */ text-align: center; width:70%; }

/* 20.06.16: header ohne subtitle über content zentrieren */
.ce-mainheader.without-sub { color: #e6342d; margin:0 0 2.19em 0; /* 35px */ text-align: center; width:70%; }

.ce-mainheader hr { border-top: 1px solid #e6342d; margin: 0 auto; width: 20em; /* 320px */ }
.ce-mainheader h1 { font-size: 1.25em; font-weight: 700; margin: .25em 0; text-transform: uppercase; }
.ce-mainheader h1 .subtitle { display: block; font-weight: 300; text-transform: none; }


/* =========================
   ce-topicbox
   ========================= */

.ce-topicbox {
	background: #fff;
	border: 1px solid #dedede;
	box-shadow: 0px 0px 10px -3px rgba(0,0,0,0.5);
	margin: 0;
	width: 100%;
}

.ce-topicbox h2 {
	background: #000;
	color: #fff;
	letter-spacing: 1px;
	line-height: 1.2;
	margin: 0;
	padding: .28em;
	text-align: center;
	text-transform: uppercase;
}

.ce-topicbox figure { margin: 0; }
.ce-topicbox .text { padding: .75em; }
.ce-topicbox h3 { font-size: .888888889em; /* 16px */ letter-spacing: 0px; margin: 0; }
.ce-topicbox p { font-size: .888888889em; /* 16px */ letter-spacing: 0px; margin: 0; }


/* =========================
   ce-person
   ========================= */

.ce-person { margin: 0; width: 100%; }
.ce-person figure { margin: 0 0 .5em; }
.ce-person .text { font-size:.833333333em; /* 15px */ }
.ce-person p.title { border-bottom: 1px solid #666; font-weight: 700; margin: 0 0 .75em; padding: 0 0 .25em; }


/* =========================
   ce-blockquote
   ========================= */

.ce-blockquote { font-size: 1.28em; /* 23px */ margin: 0; text-align: center; }
.ce-blockquote hr { border-top: 1px solid #666; width: 13.913043478em; /* 320px */ }
.ce-blockquote hr:first-of-type { margin: 0 auto .8em; }
.ce-blockquote hr:last-of-type { margin: .8em auto 1.25em; }
.ce-blockquote p { margin: 0; }


/* =========================
   ce-toplink
   ========================= */

.ce-toplink a {
	background: url('/fileadmin/default/img/toplink.svg') no-repeat center center;
	background-size: 100%;
	border: none;
	clear: both;
	display: block;
	height: 1em;
	margin: 1em auto 0;
	text-align: center;
	width: 17.777777778em; /* 320px */
}


/* ==================================================
   ce-uploads (standard filelinks)
   ================================================== */

ul.ce-uploads { list-style: none; margin: 0 0 1em !important; padding: 0; }
ul.ce-uploads li { margin: 0 0 .25em; }
ul.ce-uploads li a { border: none; display: block; padding: 0; }
ul.ce-uploads li span { display: inline; }
ul.ce-uploads li span.wrap { border-bottom:1px dotted #666; display:inline-block; }
ul.ce-uploads li .ce-uploads-filetype { text-transform: uppercase; }
ul.ce-uploads li .separator { margin: 0 .25em; }


/* ==================================================
   ext: news;
   ================================================== */

.news-list-view .news-list-date { font-size: 0.61em; /* 11px */ text-align: center; }
.news-list-view .header h2 { font-size: 1em; /* 18px */ text-transform: uppercase; }
.news-list-view .header h2 a { border: none; }
.news-list-view .news-img-wrap { float: right; width: 48%; }
.news-list-view .news-img-wrap img { margin: 0 0 1.75em 4%; }
.news-list-view a.more { border: none; color: #e6342d; }
.news-list-view hr { margin: 0 auto 1.5em; width: 17.777777778em; }

.news-single .news-list-date { font-size: 0.61em; /* 11px */ text-align: center; }
.news-single .header h2 { font-size: 1em; /* 18px */ text-transform: uppercase; }
.news-single .teaser-text { font-weight: 700; }
.news-single .news-text-wrap { margin-bottom: 1.75em; }
.news-single .news-related-wrap { margin-bottom: 1.75em; }

/*.news .f3-widget-paginator { margin:25px 0; }*/
/*.news .page-navigation p { float:left; }*/
.news ul.f3-widget-paginator { display: flex; justify-content: center; list-style:  none; margin: 0; padding: 0; width: 100%; }
.news ul.f3-widget-paginator li { padding: 0 5px; }
.news ul.f3-widget-paginator li a { display: block; }


/* ==================================================
   ext: dp_cookieconsent
   ================================================== */

.dp--cookie-check { display: none !important; }
.cc-allow, .cc-deny { display: none !important; }



/* ==================================================
   ext: cookies
   ================================================== */

/*#tx_cookies_inner {
	background: #000;
	bottom: 0;
	color: #fff;
	font-size: 12px;
	left: 0;
	padding: 25px;
	position: fixed;
	right: 0;
	width: auto;
}

#tx_cookies_accept input[type="submit"] {
	background: #000;
	border: 2px solid #fff;
	color: #fff;
	float: right;
	font-size: 12px;
	line-height: 1;
	text-transform: uppercase;
	transition: opacity .2s;
	width: auto;
}

#tx_cookies_close {
	display: none;

	background: #000;
	border: none;
	color: #fff;
	margin: 0 0 10px;
	padding: 0;
	text-align: right;
	text-decoration: underline;
	width: 100%;
}

#tx_cookies_close:hover { text-decoration: none; }
#tx_cookies_inner h3 { display: none; }
.cookie_text { float: left; margin-top: 0; max-width: 70%; }
.cookie_text p { margin: 0; }
#tx_cookies_link a { color: #fff; text-decoration: underline; }
#tx_cookies_link a:hover { text-decoration: none; }
#tx_cookies_accept input[type="submit"]:hover { opacity: .5; }*/


/* ==================================================
   ext: felogin
   ================================================== */

.error { color: #e6342d; }

.logout-wrap {
	border-top: 1px solid #e6342d;
	color: #e6342d;
	margin-bottom: 3.5em;
	padding-top: .33em;
}

.logout-btn {
	background: #e5e5e5;
	border: 1px solid #e6342d;
	color: #e6342d;
	display: block;
	margin: 0 0 1em;
	padding: .35em 2em .3em;
	text-align: center;
	transition: all .2s ease-out;
	width: auto;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;

	-webkit-border-radius: 0;
	border-radius: 0;
}

.logout-btn:focus,
.logout-btn:hover { background: #e6342d; color: #fff }



/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers:
 */

.hidden {
	display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */

.visuallyhidden {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
	clip: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	position: static;
	width: auto;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
	visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
	content: " "; /* 1 */
	display: table; /* 2 */
}

.clearfix:after {
	clear: both;
}


/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   http://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
	*,
	*:before,
	*:after,
	*:first-letter,
	*:first-line {
		background: transparent !important;
		color: #000 !important; /* Black prints faster:
								   http://www.sanbeiji.com/archives/953 */
		box-shadow: none !important;
		text-shadow: none !important;
	}

	a,
	a:visited {
		text-decoration: underline;
	}

	a[href]:after {
		content: " (" attr(href) ")";
	}

	abbr[title]:after {
		content: " (" attr(title) ")";
	}

	/*
	 * Don't show links that are fragment identifiers,
	 * or use the `javascript:` pseudo protocol
	 */

	a[href^="#"]:after,
	a[href^="javascript:"]:after {
		content: "";
	}

	pre,
	blockquote {
		border: 1px solid #999;
		page-break-inside: avoid;
	}

	/*
	 * Printing Tables:
	 * http://css-discuss.incutio.com/wiki/Printing_Tables
	 */

	thead {
		display: table-header-group;
	}

	tr,
	img {
		page-break-inside: avoid;
	}

	img {
		max-width: 100% !important;
	}

	p,
	h2,
	h3 {
		orphans: 3;
		widows: 3;
	}

	h2,
	h3 {
		page-break-after: avoid;
	}
}