
/* latin-ext */
@font-face {
  font-family: 'Play';
  font-style: normal;
  font-weight: 400;
  src: local('Play Regular'), local('Play-Regular'), url(fonts/6aez4K2oVqwIvts2H68T.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Play';
  font-style: normal;
  font-weight: 400;
  src: local('Play Regular'), local('Play-Regular'), url(fonts/6aez4K2oVqwIvtU2Hw.woff2) format('woff2');
  src: local('Play Regular'), local('Play-Regular'), url(fonts/6aez4K2oVqwIvtU2GQ.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Play';
  font-style: normal;
  font-weight: 700;
  src: local('Play Bold'), local('Play-Bold'), url(fonts/6ae84K2oVqwItm4TCp4y2knT.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Play';
  font-style: normal;
  font-weight: 700;
  src: local('Play Bold'), local('Play-Bold'), url(fonts/6ae84K2oVqwItm4TCpAy2g.woff2) format('woff2');
  src: local('Play Bold'), local('Play-Bold'), url(fonts/6ae84K2oVqwItm4TCpAy3A.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/*########################################################################################################*/
/* Firefox */
* {
 scrollbar-width: thin;
 scrollbar-color: #14143c #14143c;
}

/* Chrome, Edge, and Safari */
body::-webkit-scrollbar {
  width: 8px; /*14*/
}

body::-webkit-scrollbar-track {
  background: #14143c;
}

body::-webkit-scrollbar-thumb {
  background-color: #14143c;
}


body {
 background:#14143c;
 font-size:100%;
 margin:0em;
 /*padding:0em;    */
  padding:10px 10px 0px 10px;     

 font-family: 'Play', sans-serif;
}

h1 {
 font-size:2.3em;
 line-height:2.3em; /*3.8em;*/
 margin: 0em 0em 0em 0em;
/* padding:0em; */
 padding: 0px 10px 0px 10px;
 font-weight:100;
 color: #FFFFFF;
 text-align:left;
}

.headline h2 {
 font-size:1.563em;
 line-height:1.8em;
 margin:0em 0em 0em 2em;
 padding:0em;
 font-weight:100;
 color:#FFFFFF;
 text-align:left;
}

p {
 font-size:1.2em;
 line-height:1.2em;
 margin:0em;
 padding: 0px 10px 0px 10px; /* 2em 0em 2em; padding: 0em 2em 0em 2em;*/
 font-weight: normal;
 color:#FFFFFF;
 margin:0em;
 text-align:left;
}

ul {
 margin:0px;/*px*/
 padding:0em;
}

li {
 list-style:none;
 font-size:1.563em;
 line-height:1.25em;
 margin:0em;
 padding:0em;
 font-weight:100;
 color:#A2D8DB;
 margin:0.313em 0em 0.313em 0em;
 padding:0em;
 text-align:left;
} 

/* Player */
.embed-container {
position: relative; 
padding-bottom: 56.25%; /* ratio 16x9 */
height: 0; 
overflow: hidden; 
width: 100%;
height: auto;
}                                                                                                                               



.embed-container iframe {
position: absolute; 
top: 0; 
left: 0; 
width: 100%; 
height: 100%; 
}

/* ratio 4x3 */
.embed-container.ratio4x3 {
  padding-bottom: 75%;
}
/* Player Ende */

a {
 text-decoration:none;
 color: #FFFFFF;
}

/* //////////////////////// */
/*#menubar {
 display:block;
}  */

/*.menubardiv {
 width:100%;
 max-width:1920px; 
 margin: auto;   */
}

ul#menubar  {
 display:block;
}

ul#menubar  li {
 display:inline;
}

ul#menubar  li a.menubutton,
.m_nav {
 display: none;
} 

ul#menubar  li a.header_nav_aktiv,
ul#menubar  li a.header_nav {
 color: #F0F0F0;
 font-size: 1.0em;
 padding: 0em 0em 0.1em 0em;
 margin:  0em 0em 0.1em 1em;    
} 

ul#menubar  li a.header_nav_aktiv,
ul#menubar  li a.header_nav:hover {
 color: #10fefe;
 font-size: 1.0em;
 padding: 0em 0em 0.1em 0em;
 margin:  0em 0em 0.1em 1em;    
}

 /* .header_nav_active,
#menubar ul li a.header_nav:hover {
 border-bottom:0.1em solid #75fd00;

}  */

header {
 display:block;
 text-align:right;
 height: 100px; /*100*/
 
 /*padding-left:40px; */
 background: transparent url('header_bg.png') no-repeat; 
 background-size: contain; /*auto 150px;contain;     */
 background-position: 0px 0px;
 width:100%;

}

nav {
 display:block;
 height:2.5em; 
/* background:#121C28; */
 text-align:center;
 margin: 20px 0px 0px 0px;
 padding:0px;/* 0.35em 0px 0.35em;*/
}

nav ul {
 display:block;
 width:100%; /*98*/
 margin: auto;
 padding: 0em;/* 0.35em 0em 0.35em; */
}

nav ul li {
 display:inline;
 float:left;
/* margin: 0em 0.188em 0em 0.188em;*/

}

.tvradionav {
 display:inline-block; 
 width:50%;
}

.tv,
.tvaktiv,
.radio,
.radioaktiv {
 width: calc( 100% - 2px);
 height: 80px;
 display: block;
}

.tv {
 border:1px solid #009aff;
 background: transparent url('tv_icon.png') no-repeat; 
 background-size: auto 50%; /*auto 150px;contain;     */
 background-position: center;
}

.tv:hover,
.tvaktiv {
 border:1px solid #10fcfc;
 background: transparent url('tv_akt_icon.png') no-repeat; 
 background-size: auto 50%; /*auto 150px;contain;     */
 background-position: center;
}

.radio {
 border:1px solid #009aff;
 background: transparent url('radio_icon.png') no-repeat; 
 background-size: auto 50%; /*auto 150px;contain;     */
 background-position: center;
}

.radio:hover,
.radioaktiv {
 border:1px solid #10fcfc;
 background: transparent url('radio_aktiv_icon.png') no-repeat; 
 background-size: auto 50%; /*auto 150px;contain;     */
 background-position: center;
}


nav ul li a {
 color: #C0C0C0; /*#454545;  */
 font-size:1em;
 line-height:1.6em;
 /*padding: 0.563em 0.938em 0.375em 0.983em;   24.03.2022*/
 transition:background 0.2s;
 -webkit-transition:background 0.2s;
}
/*      
nav ul li a:hover {
 border-bottom: 0.188em solid #75fd00;
}  

nav ul li a:active{
 border-bottom:0.188em solid #75fd00;
}
   */

/*.active_tvk,
.active_tvnk,
.active_rk,
.active_rnk {
 background-color:#00AAD2;
 color:#FFFFFF;
 height:2.5em;  
 line-height:1em;
 border-top-left-radius:5px;
 border-top-right-radius:5px;
}


.active_tvnk {
 background-color:#4C8D9E;

}

.active_rk {
 background-color:#F8B333;
}

.active_rnk {
 background-color:#E1C229;
} */

/* Inhalt */
#main {
 display:block;
 width:100%;         
/* max-width:1920px; */
 margin: 40px auto 20px auto;
 padding:0px;/* 10px 0px 10px; */
/* background:#FF0000;*/
}   

#statcontent,
#lokaltv {
 display:block;
 width:100%; /*97*/      
 /*max-width:1900px; */
 padding: 1.2em 0em 0.8em 0em;       /* 1.2em 0.6em 0.8em 0.6em;*/
 margin: auto;
/*  border-bottom-left-radius:20px;
 border-bottom-right-radius:20px;
 border-top-left-radius:20px;
 border-top-right-radius:20px;
  */
  overflow: hidden;                      
}

#center {
 overflow: hidden; 
 width:107%;   
}  

#statcontent {
 padding: 0em 0em 2em 0em;  
 text-align:left;
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  -khtml-hyphens: auto;
  hyphens: auto;
}

#lokaltv article{
 display:block;
 float:left;  
 width:23%;
 vertical-align:top;
/* padding: 0.35em 0.35em 0.35em 0.35em; */
 padding: 5px;/*0.35em 0.35em 0.35em 0.35em; */
}

#anbieterkontakt {
 margin-top: 3em;
 margin-left: auto;
 margin-right: auto;
 width:90%;
 overflow: hidden;
}

#anbieterkontakt article {
 display:block;
 float:left;  
 width:11%;
 vertical-align:top;
 /*padding: 0em 0em 0.35em 0.35em;*/ 
 padding: 0em 0.2em 0em 0.2em; 
/* background-color:#0000FF;   */
}

#main article h2 {
 padding: 1em 1.8em 1em 1.8em;
}

footer {
 display:block;
 text-align:center;
 margin: 0em 0em 1em 0em;
}

footer ul {
 display:block;
 width: 100%;
 text-align:center;
 margin:0px auto;
}

footer ul li{
 display:inline;
 font-size:1em;/*0.6*/
 line-height: 1.0em;  /*2.8*/
 color:#E2DBDB;
 padding: 0em 0.625em 0em 0.625em;
}

footer ul li a{
 color:#E2DBDB;
}

/* Kontaktformular */
input[type=text], select, textarea{
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  resize: vertical;
}


label {
  padding: 12px 12px 12px 0;
  display: inline-block;
  font-size:1.2em;
}


input[type=submit] {
  background-color: #0094ff;/*#00AAD2; */
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  float: right;
}


.kontaktform {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
  width: 60%;
  margin: auto;
}


.spalte_s {
  float: left;
  width: 25%;
  margin-top: 6px;
}


.spalte_b {
  float: left;
  width: 75%;
  margin-top: 6px;
}

.spalte_b1 {
  float: left;
  width: 25%;
  margin-top: 6px;
}

.spalte_b2 {
  float: left;
  width: 50%;
  margin-top: 6px;
}
.reihe:after {
  content: "";
  display: table;
  clear: both;
}

ul.faq {
 margin:0em;
 padding: 0em 2em 0em 4.5em;
}

ul.faq li {
 list-style: disc;
 font-size: 1.2em; 
 color:#FFFFFF;
}

/* ++++++++++++++++ Overlay-Player  +++++++++++++++++++++++++++++++++++++++++ */
#lokaltv .fulloverlay {
 z-index: 1;
 top: 0px; 
 left: 0px; 
 position: fixed;
 width: 100%;
 height:100%;
 background-image: url("overlay_bg.png"); 
 background-size: 100% 100%;
 animation: fadeInOverlay ease 1s;
 animation-iteration-count: 1;
 animation-fill-mode: forwards;
}

#lokaltv article.overlay {
 z-index: 2;
 left: 0px; 
 right: 0px; 
 top:50%;
  transform: translateY(-50%);
/* margin-top: auto; 
 margin-bottom: auto; */
 margin-left: auto; 
 margin-right: auto; 
 position: absolute;

 width: 75%;
 animation: fadeInOverlay ease 1s;
 animation-iteration-count: 1;
 animation-fill-mode: forwards;
}

@keyframes fadeInOverlay {
 0% {
     opacity: 0;
    }
 100% {
       opacity: 1;
      }
}

#lokaltv article.overlay a {
 display:block;
 padding: 0px 5px 0px 10px;  
 font-size:30px; 
 font-weight:bold;
 width:calc( 100% - 15px); 
 height:40px; 
 background-color:#14143c;
}
/* ++++++++++++++++ Overlay-Player (Ende)++++++++++++++++++++++++++++++++++++ */













/* Mobile Layout */
@media screen and (max-width:1700px) {
 #lokaltv article {
 padding: 0em 0em 0.3em 0.3em; 
 }
 
 .kontaktform {
   width: 80%;
  }
  
 #anbieterkontakt article { 
 width:10%;
 } 
}

@media screen and (max-width:1500px) {
 #lokaltv article{
 padding: 0em 0em 0.25em 0.25em; 
 }
 #anbieterkontakt article { 
 width:10%;
 }
}

@media screen and (max-width:1300px) {
 body {
  font-size:90%;
  }
  
 #lokaltv article {
  width: 30%;
  display: inline-block;
	margin: auto;
  padding: 0em 0em 0.4em 0.4em;   
 } 
 
 #center {
 width:109%;   
 } 
 
 .kontaktform {
   width: 90%;
  }
 
 #anbieterkontakt article { 
 width:11%;
 padding: 0em 0.4em 0em 0.1em;  
 }
}

.hinweis {
 display:block;
 position: absolute;
 top:40%;
 left:25%;
 z-index: 1000;
 width:50%;
 background-color:#EEEEEE;
 
     
 margin-left: auto;
 margin-right: auto;
 /*border: 2px solid;
 border-color: #66666; */
 border-bottom-left-radius:20px;
 border-bottom-right-radius:20px;
 border-top-left-radius:20px;
 border-top-right-radius:20px;
 box-shadow: 2px 5px #AAAAAA;

}

.hinweis p {
 color: #666666;
 padding: 1em 1em 1em 1em;
}

.button {
 color: #FFFFFF;
 width: 6em;
 background-color:#0094ff;/*#00aad2; */
 padding: 1em 1em 1em 1em;
 margin-left: auto;
 margin-right: auto;
 margin-bottom: 1em;
 text-align:center;
 border-bottom-left-radius:10px;
 border-bottom-right-radius:10px;
 border-top-left-radius:10px;
 border-top-right-radius:10px;
 box-shadow: 1px 2px #AAAAAA;
}

/*######################################################################*/
@media screen and (max-width:1100px) {
 body {
  font-size:78%;
 }
 
 #lokaltv article {
 padding: 0em 0em 0.3em 0.3em; 
 }
 
 #anbieterkontakt { 
 width:92%; 
 }
}

/*@media screen and (max-width:940px) {
 body {
  font-size:70%;
  }
} */

/*@media screen and (max-width:840px) {
 #lokaltv article {
 padding: 0em 0em 0.3em 0.3em; 
 }
 body {
 font-size:65%;
 }
} */                       /*800*/

@media screen and (max-width:940px) {
 body {
  font-size:70%;
  }

 #lokaltv {
   width: 97%;
  display:block;
 }
 
 #lokaltv article {
  width: 45%;
  display:inline-block; 
  padding: 0em 0em 0.45em 0.45em;              
 }
 
 .header_nav_aktiv {
  display:none;
 }
 
 ul#menubar  li a.menubutton {
    display:block;
    float:right;
 }
 
  .tv,
  .tvaktiv,
  .radio,
  .radioaktiv {
   height: 40px;
   }
     
 
 nav ul li a,
 .m_nav {
   height:20px;
   text-align: center;
   vertical-align: middle;
   padding: 5px 0em 5px 0em;
   font-size: 110%;
   width:100%;
   border: 1px solid #0096ff; 
 }
 
  .aktiv {
   border: 1px solid #10ffff;
   color: #10ffff;
  }
 
 .header_nav {
  display: none;
 }
 
 header {
  height: 90px; 
 }
 
 #anbieterkontakt article { 
 width:18%;
 padding: 0em 0.5em 0em 0em;  
 }
 
 .spalte_b1 {
  width: 45%;
  }

.spalte_b2 {
  width: 30%;
 }
}  

@media screen and (max-width:600px) {
 #lokaltv .fulloverlay {
 position: relative;
 background: none;
 height: auto;
 width:auto;
}

#lokaltv article.overlay {
 z-index: 0;
 left: 0px; 
 right: 0px; 
 top:0px;
 transform: translateY(0%);
 margin-left: auto; 
 margin-right: auto; 
 position: relative;
 width: 91%; 
}
 
 #lokaltv article.overlay a {
  display: none;
 }
 
 #lokaltv {
  width: 97%;
  display:block;
 }
 
 .tv,
  .tvaktiv,
  .radio,
  .radioaktiv {
   height: 20px;
   }
 
 
 #lokaltv article {
  width: 91%;
  display: block;
  padding: 0em 0em 0.3em 0.2em;
 }
 
 header {
  height: 50px;    /*80*/
 }
 
 .spalte_s, .spalte_b, input[type=submit] {     /* Kontaktformular */
    width: 100%;
    margin-top: 0;
  }
  
 .kontaktform {
   width: 90%;
  }
  
 #anbieterkontakt article { 
 width:22%;
 padding: 0em 0.5em 0em 0em;  
 }
 
  .spalte_b1 {
  width: 50%;
  }

.spalte_b2 {
  width: 50%;
 }
  
}

@media screen and (max-width:500px) {
 .kontaktform {
   width: 85%;
  }
  
}

  