/*
* tv-news.css
* File include item demo only specific css only
******************************************************************************/
/* roboto-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/roboto-v30-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/roboto-v30-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/roboto-v30-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/roboto-v30-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/roboto-v30-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

.light-style .menu .app-brand {
  height: 64px;
}

.dark-style .menu .app-brand {
  height: 64px;
}

.app-brand-logo svg {
  width: 38px;
  height: 20px;
}

.app-brand-text {
  font-size: 1.25rem;
}

/* ! For .layout-navbar-fixed added fix padding top tpo .layout-page */
.layout-navbar-fixed .layout-wrapper:not(.layout-without-menu) .layout-page {
  padding-top: 64px !important;
}

/* Navbar page z-index issue solution */
.content-wrapper .navbar {
  z-index: auto;
}

/*
* Content
******************************************************************************/

body {
  color: #333333 !important;
}
body a {
  color: #2c4081;
}
body a:hover {
  color: #ff2c01;
}
.demo-blocks > * {
  display: block !important;
}

.demo-inline-spacing > * {
  margin: 1rem 0.375rem 0 0 !important;
}

/* ? .demo-vertical-spacing class is used to have vertical margins between elements. To remove margin-top from the first-child, use .demo-only-element class with .demo-vertical-spacing class. For example, we have used this class in forms-input-groups.html file. */
.demo-vertical-spacing > * {
  margin-top: 1.25rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing.demo-only-element > :first-child {
  margin-top: 0 !important;
}

.demo-vertical-spacing-lg > * {
  margin-top: 1.875rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing-lg.demo-only-element > :first-child {
  margin-top: 0 !important;
}

.demo-vertical-spacing-xl > * {
  margin-top: 5rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing-xl.demo-only-element > :first-child {
  margin-top: 0 !important;
}

.rtl-only {
  display: none !important;
  text-align: left !important;
  direction: ltr !important;
}

[dir='rtl'] .rtl-only {
  display: block !important;
}

/* Dropdown buttons going out of small screens */
@media (max-width: 576px) {
  #dropdown-variation-demo .btn-group .text-truncate {
    width: 300px;
    position: relative;
  }
  #dropdown-variation-demo .btn-group .text-truncate::after {
    position: absolute;
    top: 45%;
    right: 0.65rem;
  }
}
/*
* Layout demo
******************************************************************************/

.layout-demo-wrapper {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-top: 1.25rem;
}
.layout-demo-placeholder img {
  width: 900px;
}
.layout-demo-info {
  text-align: center;
  margin-top: 1.25rem;
}

.navbar.landing-navbar .navbar-nav .nav-item:last-of-type .nav-link {
  padding-right: 0;
}
.frontend .app-brand-logo img, .app-brand-logo svg {
	width: 220px;
	margin-right: 10px;
}
body {
  overflow-x: hidden;
}
header {
  position: relative;
  height: 110vh;
  background: url('../img/frontpage/headerpic_1.jpg');
  background-position: center 25%;
  background-size: cover;
}

header .hero {
  position: absolute;
  left: 5%;
  bottom: 20%;
}
header h1 {
  font-size: 4rem;
  color: #fff;
}
header h2 {
  font-size: 2.5rem;
  color: #fff;
}
.template-customizer {display: none !important;}
main.frontPage {margin-bottom: 150px}

.layout-navbar-fixed .layout-navbar {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    width: 100%;
    background: rgba(255,255,255,.67);
    /* border-top: 10px solid #2c4081; */
}
.navbar-nav .nav-link {font-size: 1.2rem;}
nav.layout-navbar {box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;}

.search_form.seperate {
  position: relative;
  height: 50px;
}
.search_form.seperate .seperate_one,
.search_form.seperate .seperate_two,
.search_form.seperate .seperate_three {
  position: absolute;
  z-index: 2;
  width: 120%;
  height: 150px;
  top: 0;
  left: 0;
  opacity: 0.83;
  background-color: #ffffff;
}
.search_form.seperate .seperate_one {
  transform: rotate(-4deg) translateY(-80px);
  -webkit-transform: rotate(-4deg) translateY(-80px);
  -moz-transform: rotate(-4deg) translateY(-80px);
  -ms-transform: rotate(-4deg) translateY(-80px);
  -o-transform: rotate(-4deg) translateY(-80px);
}
.search_form.seperate .seperate_two {
  transform: rotate(-3deg) translateY(-60px);
  -webkit-transform: rotate(-3deg) translateY(-60px);
  -moz-transform: rotate(-3deg) translateY(-60px);
  -ms-transform: rotate(-3deg) translateY(-60px);
  -o-transform: rotate(-3deg) translateY(-60px);
}
.search_form.seperate .seperate_three {
  transform: rotate(-2deg) translateY(-40px);
  -webkit-transform: rotate(-2deg) translateY(-40px);
  -moz-transform: rotate(-2deg) translateY(-40px);
  -ms-transform: rotate(-2deg) translateY(-40px);
  -o-transform: rotate(-2deg) translateY(-40px);
  opacity: 1;
}
.search_form.seperate form {
  position: absolute;
  z-index: 20;
  top: -30px;
  right: 5%;
}

.search_form.seperate form input,
.search_form.seperate form select {
  background-color: #fff;
  color: #9b9b9b;
  border: 1px solid #9b9b9b;
  padding: 5px 10px;
  height: 35px;
  margin-right: 1rem;
}
.search_form.seperate form button {
  background-color: #2c4081;
  color: #ffffff;
  border: 1px solid #2c4081;
  padding: 5px 30px;
  height: 35px;
}

.stoerer {
  position: relative;
  z-index: 25;
  background-color: rgba(187, 218, 229, 0.5);
  color: #323232;
  padding: 5.25rem 5% 1.75rem;
}
.stoerer a {
  white-space: nowrap;
}

.stoerer .seperate_one,
.stoerer .seperate_two {
  position: absolute;
  z-index: -1;
  width: 120%;
  top: 0;
  left: -10%;
}
.stoerer .seperate_one {
  transform: rotate(-1deg) translateY(15px);
  -webkit-transform: rotate(-1deg) translateY(15px);
  -moz-transform: rotate(-1deg) translateY(15px);
  -ms-transform: rotate(-1deg) translateY(15px);
  -o-transform: rotate(-1deg) translateY(15px);
  background-color: rgba(187, 218, 229, 0.5);
  height: 93%;
}
.stoerer .seperate_two {
  transform: rotate(-2deg) translateY(35px);
  -webkit-transform: rotate(-2deg) translateY(35px);
  -moz-transform: rotate(-2deg) translateY(35px);
  -ms-transform: rotate(-2deg) translateY(35px);
  -o-transform: rotate(-2deg) translateY(35px);
  background-color: rgba(187, 218, 229, 1);
  height: 85%;
}
.stoerer .stoerer_content {
  position: relative;
  z-index: 30;
  /* padding: 5.5rem 5% 0; */
}
.stoerer h2 {
  font-size: 1.5rem;
  color: #2c4081;
}
.stoerer ul {
  list-style-type: none;
  padding-left: 1rem;
}
.stoerer li:before {
  content: '//';
  position: relative;
  left: -1rem;
}
.hiddenOffer {display:none !important;}

.not_found {
	text-align: center;
	font-size: 1.25rem;
	position: relative;
	z-index: 50;
}

section.newslist {
  display: flex;
  justify-content: flex-start;
  z-index: 50;
  position: relative;
  padding: 1rem 5%;
  flex-wrap: wrap;
}
.newslist article {
  width: 31%;
  margin: 0 1% 1.5rem;
  border: 1px solid #333;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.newslist article .heading {
  padding: 10px;
  border-bottom: 1px solid #333;
  display: flex;
  justify-content: flex-start;
}
.newslist article .flag {
  margin-right: 20px;
}
.newslist article .flag img {
  height: 60px;
}
.newslist article .date {
  font-size: 1.25rem;
}
.newslist article .place {
  font-size: 0.8rem;
  line-height: 1.2;
  margin-top: 1px;
}
.newslist article .news {
  padding: 10px;
}
.newslist article .pic {
  overflow: hidden;
}
.newslist article .pic img {
  object-fit: cover;
  width:100%;
	height:100%
}
.newslist article .headline {
	font-size: 1.25rem;
	color: #2c4081;
	padding: 1rem 0 0;
	line-height: 1;
	padding-bottom: .5rem;
}
.newslist article .subline {
  font-size: 0.8rem;
  line-height: 1.2;
  color: #2c4081;
}
.newslist article .news_content {
  font-size: 0.8rem;
  padding: 1rem 0;
}
.newslist article .btn,
button.btn {
  padding: 10px 20px;
  background: #2c4081;
  color: #fff;
  border: none;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
}
button.btn {margin: 1rem auto; display: block !important;}
.newslist article .btn:hover,
button.btn:hover {
  background: #ff2c01;
  color: #fff;
}
.newslist article .news_meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.newslist article .pics,
.newslist article .videos {
  font-size: 2.5rem;
  margin-left: 0.85rem;
}
.newslist article .pics img,
.newslist article .videos img {
  height: 36px;
  margin-top: -10px;
  margin-left: -7px;
}
.newslist article .news_footer {
  display: flex;
  justify-content: flex-end;
  flex-direction: column;
}
.newslist article .news_meta {
  padding: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.border_top {
  border-top: 1px solid #333;
}

.entwurf {
  background-color: #e7c9b7;
}
.vorab {
  background-color: #fff0b3;
}
.update {
  background-color: #bbdae5;
}
.final {
  background-color: #bed7be;
}

footer .nav-link {color: #ffffff;}
footer .nav-link.active, footer .nav-link:hover,
.main_menu a.nav-link.active {color: #ff2c01 !important}
.navbar.landing-navbar .navbar-nav.main_menu a.nav-link.active,
footer .navbar-nav.footer_menu a.nav-link.active {color: #ff2c01 !important}

/* Angebots-Detail */
header.detail {
  background: url('../img/frontpage/headerpic_2.jpg');
  background-position: center center;
  background-size: cover;
  height: 70vh;
}
header.detail .hero {
	position: absolute;
	left: 0;
	bottom: 0;
	padding: 1rem 5% 3rem;
	width: 100%;
	background: rgba(0,0,0,.5);
}
main.frontPage.detail h1, main.frontPage.detail h4 {
  color: #2c4081;
}
.search_form.seperate.detail {height: 0px;}
main.detail {
  position: relative;
  z-index: 100;
  padding: 1rem 5%;
}
main.detail h1, main.detail h2, main.detail h3, main.detail h4, main.detail h5, main.detail h6 {color: #333;}
.bottom_bordered {
  border-bottom: 1px solid #999;
  padding: 1rem;
  margin-bottom: 3rem;
}
article.news_content {margin-top: 2rem;}
article.news_content .news {min-width: 55%; padding-right: 2rem;}
article.news_content .pics {min-width: 45%;}
article.news_content .pics img {
  width: 32%;
  height: auto;
  margin-bottom: 1rem;
  object-fit: cover;
}
#lightBox {
  position: fixed;
  top: 0%;
  left: 0%;
  width: 100%;
  height: 100%;
}
#lightBox {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0%;
  padding: 2%;
  z-index: 999;
  background: rgba(0,0,0,.75);
}
#lightBox.show {
  top: 0;
  transition: top 1s ease;
  -webkit-transition: top 1s ease;
  -moz-transition: top 1s ease;
  -ms-transition: top 1s ease;
  -o-transition: top 1s ease;
}
#lightBox.hide {
  top: 100vh;
  transition: top 1s ease;
  -webkit-transition: top 1s ease;
  -moz-transition: top 1s ease;
  -ms-transition: top 1s ease;
  -o-transition: top 1s ease;
}
#lightBox img {
	object-fit: contain;
	width: 100%;
	height: 100%;
}
article.news_content .tags span {
	margin-right: .5rem;
  margin-top: .5rem;
	padding: 5px 10px;
	display: inline-block;
	background: #ddd;
}
button#goBack {
	margin: 4rem 0 2rem;
	display: block !important;
}



.authentication-inner .loginPic {background: url('../img/frontpage/login.jpg')}
.authentication-bg {color: #d2d2e8}
.authentication-bg a {color: rgb(160, 161, 184)}
#formAuthentication .btn-primary:hover,
#formAuthentication .btn-check:checked + .btn-primary, #formAuthentication .btn-check:active + .btn-primary, #formAuthentication .btn-primary:active, #formAuthentication .btn-primary.active, #formAuthentication .btn-primary.show.dropdown-toggle, #formAuthentication .show > .btn-primary.dropdown-toggle {
	color: #fff !important;
	background-color: rgba(255, 43, 1, .5) !important;
	border-color: rgba(255, 43, 1, .5) !important;
}

/* Unterseiten */

header.information {
  background: url('../img/frontpage/info.jpg');
  background-position: center top;
  background-size: cover;
  height: 70vh;
}
header.contact {
  background: url('../img/frontpage/contact.jpg');
  background-position: center top;
  background-size: cover;
  height: 70vh;
}
header.imprint {
  background: url('../img/frontpage/imprint.jpg');
  background-position: center top;
  background-size: cover;
  height: 70vh;
}
header.data_protection {
  background: url('../img/frontpage/data_protection.jpg');
  background-position: center top;
  background-size: cover;
  height: 70vh;
}
header.information .hero,
header.contact .hero,
header.imprint .hero,
header.data_protection .hero {
	position: absolute;
	left: 0;
	bottom: 0;
	padding: 1rem 5% 3rem;
	width: 100%;
	background: rgba(0,0,0,.5);
}
#contactDetails .contact_information {flex-basis: 25%; padding-right: 2rem; margin-right: 2rem; border-right: 1px solid #2c4081;}
#contactDetails .formular {flex-basis: 75%; margin-right: 20%; }
form#contactForm .form-control, form#eventForm .form-control {
	background-color: #ffffff !important;
  border-color: #2c4081 !important;
  color: rgb(51, 51, 51) !important;
}
form#contactForm label, form#eventForm label {
  color: #2c4081 !important;
}

form#contactForm .form-control:focus,
form#contactForm .form-select:focus,
form#eventForm .form-control:focus {
	border-color: #2c4081 !important;
}
form#contactForm .form-floating-outline label::after,
form#contactForm .form-floating-outline > span::after,
form#eventForm .form-floating-outline label::after,
form#eventForm .form-floating-outline > span::after  {
	background: #ffffff;
}
form#contactForm .form-floating > .form-control:focus ~ label,
form#contactForm .form-floating > .form-control:focus:not(:placeholder-shown) ~ label,
form#eventForm .form-floating > .form-control:focus ~ label,
form#eventForm .form-floating > .form-control:focus:not(:placeholder-shown) ~ label,
form#contactForm .form-floating > .form-select:focus ~ label,
form#contactForm .form-floating > .form-select:focus:not(:placeholder-shown) ~ label {
	color: #2c4081;
}
form#contactForm .form-select {
  display: block;
  width: 100%;
  padding: 0.45rem 1.875rem 0.45rem 0.875rem;
  -moz-padding-start: calc(0.875rem - 3px);
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.47;
  color: #2c4081;
  background-color: #fff;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAYCAYAAACfpi8JAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACDSURBVHgB7dSxCYAwEIXhp46iYO8ONhaZwrGcIq072IvgLOYKQSRGvVwK5X4IpDq+aw7QNO2jZWDWmb7NgRYCuTljAWbLPK1V3dAmJSIihLUDHyKB2RH0j4LEYI4IEQgHc0aIQd5gfAhRyBPMFUIcEsKEEEkgPswdInl09Ix70DTtz21KQECtmJVdEwAAAABJRU5ErkJggg==");
  background-repeat: no-repeat;
  background-position: right 0.875rem center;
  background-size: 17px 12px;
  border: 1px solid #2c4081;
  border-radius: 0.5rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
form#contactForm select.form-select option {
	background-color: #ffffff;
  color: #2c4081;
}
form#contactForm .form-check-input,
form#contactForm .form-check-input:checked {
	background-color: #ffffff;
	border-color: #2c4081;
}
form#contactForm button.btn, form#contactForm button.btn {
	margin: 0 auto 0 0;
}
form#contactForm .btn:hover, form#eventForm button.btn:hover {
	background: #ff2c01;
	color: #fff;
}
form#contactForm .was-validated .form-select:invalid, .form-select.is-invalid,
form#contactForm.was-validated .form-check-input:invalid, .form-check-input.is-invalid,
form#contactForm.was-validated .form-control:invalid, .form-control.is-invalid,
form#eventForm.was-validated .form-check-input:invalid,
form#eventForm.was-validated .form-control:invalid {
	border-color: #ff2c01 !important;
	border-width: 1px;
}
form#contactForm.was-validated .form-select:valid, .form-select.is-valid,
form#contactForm.was-validated .form-check-input:valid, .form-check-input.is-valid,
form#contactForm.was-validated .form-control:valid, .form-control.is-valid,
form#eventForm.was-validated .form-control:valid {
	border-color: #2c4081 !important;
	border-width: 1px;
}
.alert-danger {
	background-color: #bb1c0c !important;
	border-color: #bb1c0c !important;
	color: #fff !important;
	padding-top: 1.5rem !important;
}

.contact_now {
  background:  #2c4081;
  padding: 5px 0;
}
.contact_now ul {list-style: none; margin: 0;}
.contact_now ul li {display: inline-block; padding: 0 10px;}

.news_headings {
  margin: 0 -10px;
  padding: 0 10px 10px;
  border-top: 1px solid #333;
  border-bottom: 1px solid #333;
  margin-top: 10px;
}

#layer_left, #layer_right {
  position: absolute;
  top: 0;
  height: 100%;
  width: 25vw;
  background:rgba(0,0,0,.5);
  opacity: 0;
}
#layer_left img, #layer_right img {
	width: 50px;
	margin: 0 auto;
	display: block;
	opacity: .5;
}
#layer_left:hover, #layer_right:hover {opacity: 1;}
#layer_left {left: 0;}
#layer_right {right: 0;}
#closer {
	position: absolute;
	right: 50px;
	top: 50px;
	z-index: 9999;
	height: 50px !important;
	width: 50px !important;
  cursor: pointer;
}
#popup {
  position: fixed;
  z-index: 1000;
  width: 50vw;
  min-width: 250px;
  top: 50vh;
  left: 50vw;
  transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  -moz-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  -o-transform: translate(-50%,-50%);
  padding: 35px 15px;
  background: rgba(255,255,255,.95);
  box-shadow: rgba(149, 157, 165, 0.75) 0px 8px 24px;
}

#popup h3 {color: #2c4081;}
#popup input, #popup textarea, #popup button {padding: 15px 20px; width: 100%;}
#popup #closer {right: 10px; top: 10px;}

#share {
	padding: 0 0 20px 0;
}
#share span {
	display: inline-block;
}
#share span#Tweet {
	position: relative;
	top: -2px;
  left: 2px;
}

.share-button {
   /*margin: 0 0 0 10px;
   border-radius: 12px;
   padding: 10px;
   width: 40px;
   height: 40px;
   display: flex;
   justify-content: center;
   */
   margin: 0 5px 0 5px;
   color: #fff;
   padding: 5px 10px;
   width: auto;
   height: 28px;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   border-radius: 12px;
   -webkit-border-radius: 12px;
   -moz-border-radius: 12px;
   -ms-border-radius: 12px;
   -o-border-radius: 12px;
}
.share-button:hover, .share-button:focus {color: #fff;}
.share-button.whatsapp {background-color: #25D366;}
.share-button.facebook {background-color: #4267B2;}
.share-button.telegram {background-color: #29b6f6;}
.share-button.twitter {background-color: #000000;}
.share-button.twitter i {
  height: 1rem;
  width: 1rem;
  margin-right: .5rem;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M0 0h32v32H0z'/%3E%3Cpath d='M17.97 14.162L26.705 4h-2.07l-7.587 8.824L10.99 4H4l9.163 13.343L4 28h2.07l8.013-9.318 6.4 9.318h6.988L17.97 14.162zm-2.837 3.3l-.93-1.33L6.818 5.56h3.18l5.962 8.532.927 1.33 7.75 11.09h-3.18l-6.324-9.05z' fill='%23fff'/%3E%3C/svg%3E");
}
.share-button.mail {background-color: #7d7d7d;}

.share-button img {
  height: 20px;
  width: auto;
}
