@font-face
   {
   font-family: 'sport2000';
   src: url('images/sport2000.otf') format('opentype');
   font-style: normal;
   }
      	      	      	
@font-face
   {
   font-family: 'sport2000_bold';
   src: url('images/sport2000_bold.otf') format('opentype');
   font-style: bold;
   }
      	      	      	
@font-face
   {
   font-family: 'sport2000_display';
   src: url('images/sport2000_display.otf') format('opentype');
   font-style: normal;
   }
      	      	      	
@font-face
   {
   font-family: 'sport2000_display_bold';
   src: url('images/sport2000_display_bold.otf') format('opentype');
   font-style: bold;
   }
      	      	      	
*
{
box-sizing: border-box;
font-family: Verdana;
}
      	      	      	
html,body
   {
   background-color: rgba(255,255,255,1);
   color: rgba(59,56,55,1);
   top: 0;
   width: 100%;
   margin: 0;
   padding: 0;
   }
   @media only screen and (max-width: 499px) { html,body { font-size: 14px; } }
   @media only screen and (min-width: 500px) and (max-width: 769px) { html,body { font-size: 14px; } }
   @media only screen and (min-width: 770px) and (max-width: 1199px) { html,body { font-size: 16px; } }
   @media only screen and (min-width: 1200px) { html,body { font-size: 16px; } }
      	      	      	
   html { height: 100%; overflow-y: scroll; }
   body { height: 100%; overflow-y: scroll; }
      	      	      	
      body
      	{
      	background-image: url("images/bg.jpg");
      	background-attachment: fixed;
      	-webkit-background-size: cover;
      	background-size: cover;
      	background-repeat: no-repeat;
      	background-position: center center;
      	}
      	      	      	
a
   {
   color: rgba(130,177,46);
   font-weight: bold;
   text-decoration: none;
   transition: color 0.5s;
   }
      	      	      	
a:hover, a:focus, a:active
   {
   color: rgba(130,177,46);
   transition: color 0.5s;
   }
      	      	      	
h1
   {
   margin-bottom: 30px;
   color: rgba(171,34,32,1);
   font-weight: bold;
   }
   @media only screen and (max-width: 499px) { h1 { font-size: 20px; text-shadow: 1px 1px 1px rgba(59,56,55,1); } }
   @media only screen and (min-width: 500px) and (max-width: 769px) { h1 { font-size: 24px; text-shadow: -1px -1px 1px rgba(59,56,55,1), -1px 1px 1px rgba(59,56,55,1), 1px -1px 1px rgba(59,56,55,1), 1px 1px 1px rgba(59,56,55,1); } }
   @media only screen and (min-width: 770px) and (max-width: 1199px) { h1 { font-size: 28px; text-shadow: -1px -1px 1px rgba(59,56,55,1), -1px 1px 1px rgba(59,56,55,1), 1px -1px 1px rgba(59,56,55,1), 1px 1px 1px rgba(59,56,55,1); } }
   @media only screen and (min-width: 1200px) { h1 { font-size: 36px; text-shadow: -1px -1px 1px rgba(59,56,55,1), -1px 1px 1px rgba(59,56,55,1), 1px -1px 1px rgba(59,56,55,1), 1px 1px 1px rgba(59,56,55,1); } }
      	      	      	
h2
   {
   margin-bottom: 10px;
   color: rgba(59,56,55,1);
   font-weight: bold;
   text-align: center;
   }
   @media only screen and (max-width: 499px) { h2 { font-size: 16px; } }
   @media only screen and (min-width: 500px) and (max-width: 769px) { h2 { font-size: 18px; } }
   @media only screen and (min-width: 770px) and (max-width: 1199px) { h2 { font-size: 24px; } }
   @media only screen and (min-width: 1200px) { h2 { font-size: 30px; } }
      	      	      	
h3
   {
   margin: 0px;
   color: rgba(59,56,55,1);
   font-weight: bold;
   }
   @media only screen and (max-width: 499px) { h3 { font-size: 16px; } }
   @media only screen and (min-width: 500px) and (max-width: 769px) { h3 { font-size: 18px; } }
   @media only screen and (min-width: 770px) and (max-width: 1199px) { h3 { font-size: 22px; } }
   @media only screen and (min-width: 1200px) { h3 { font-size: 26px; } }
      	      	      	
h4
   {
   margin: 0px;
   color: rgba(59,56,55,1);
   font-weight: bold;
   }
   @media only screen and (max-width: 499px) { h4 { font-size: 16px; } }
   @media only screen and (min-width: 500px) and (max-width: 769px) { h4 { font-size: 16px; } }
   @media only screen and (min-width: 770px) and (max-width: 1199px) { h4 { font-size: 18px; } }
   @media only screen and (min-width: 1200px) { h4 { font-size: 18px; } }
      	      	      	
input#checkbox_unsichtbar
   {
   
   }
      	      	      	
input#radiobutton_unsichtbar
   {
   
   }
      	      	      	
#transparent
   {
   z-index: 0;
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   margin: 0;
   padding: 0;
   background-color: rgba(35,35,35,0.3);
   }
      	      	      	
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* +++++++++++++++++++++++++ STANDARDINHALT ++++++++++++++++++++++++ */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#head
   {
   z-index: 2;
   display: -webkit-flex;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   flex-direction: column;
   flex-wrap: wrap;
   -webkit-align-items: stretch;
   align-items: stretch;
   -webkit-justify-content: flex-end;
   justify-content: flex-end;
   
   width: 100%;
   max-width: 1600px;
   height: 65px;
   margin-left: auto;
   margin-right: auto;
   }
   @media only screen and (max-width: 499px) { #head { position: relative; align-content: center; text-align: center; } }
   @media only screen and (min-width: 500px) and (max-width: 769px) { #head { position: relative; align-content: flex-end; text-align: right; } }
   @media only screen and (min-width: 770px) and (max-width: 1199px) { #head { position: absolute; align-content: flex-end; text-align: right; } }
   @media only screen and (min-width: 1200px) { #head { position: absolute; align-content: flex-end; text-align: right; } }
      	      	      	
   #head img
      {
      margin-right: 30px;
      width: auto;
      max-width: 80%;
      height: auto;
      }
      @media only screen and (max-width: 499px) { #head img { max-height: 40px; } }
      @media only screen and (min-width: 500px) and (max-width: 769px) { #head img { max-height: 45px; } }
      @media only screen and (min-width: 770px) and (max-width: 1199px) { #head img { max-height: 50px; } }
      @media only screen and (min-width: 1200px) { #head img { max-height: 50px; } }
      	      	      	
#container
   {
   z-index: 2;
   display: -webkit-flex;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   flex-direction: column;
   flex-wrap: wrap;
   -webkit-align-items: stretch;
   align-items: stretch;
   align-content: center;
   -webkit-justify-content: flex-start;
   justify-content: flex-start;
   position: relative;
   width: 100%;
   max-width: 1600px;
   height: auto;
   min-height: 100%;
   margin-left: auto;
   margin-right: auto;
   padding: 10px 0px 15px 0px;
   text-align: center;
   }
      	      	      	
#content
   {
   
   }
   @media only screen and (max-width: 499px) { #content{width: 95%;} }
   @media only screen and (min-width: 500px) and (max-width: 769px) { #content{width: 90%;} }
   @media only screen and (min-width: 770px) and (max-width: 1199px) { #content{width: 80%;} }
   @media only screen and (min-width: 1200px) { #content{width: 80%;} }
      	      	      	
   #alle
      {
      width: 95%;
      margin-top: 0px;
      margin-bottom: 30px;
      text-align: right;
      }
      	      	      	
   .text_rechts
      {
      text-align: right;
      }
      	      	      	
   .text_zentral
      {
      text-align: center;
      }
      	      	      	
   .kleines_datum
      {
      width: auto;
      margin-top: 0px;
      margin-bottom: 10px;
      }
      	      	      	
#row
   {
   display: -webkit-flex;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   -webkit-align-items: stretch;
   align-items: stretch;
   align-content: flex-start;
   -webkit-justify-content: space-around;
   justify-content: space-around;
   position: relative;
   width: 100%;
   margin-top: 0px;
   text-align: justify;
   }
      	      	      	
   #informationen
      {
      display: -webkit-flex;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      flex-direction: column;
      flex-wrap: wrap;
      -webkit-align-items: center;
      align-items: center;
      align-content: center;
      -webkit-justify-content: center;
      justify-content: center;
      position: relative;
      margin: 20px;
      padding: 10px;
      border: solid 2px rgba(171,34,32,1);
      border-radius: 5px;
      background-color: rgba(225,225,225,0.85);
      box-shadow: 0px 0px 4px rgba(59,56,55,1);
      }
      @media only screen and (max-width: 499px) { #informationen { width: 100%; } }
      @media only screen and (min-width: 500px) and (max-width: 769px) { #informationen { width: 100%; } }
      @media only screen and (min-width: 770px) and (max-width: 1199px) { #informationen { width: 50%; } }
      @media only screen and (min-width: 1200px) { #informationen { width: 50%; } }
      	      	      	
      #informationen ul li
      	{
      	text-align: left;
      	}
      	      	      	
   #podcast
      {
      display: -webkit-flex;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      -webkit-align-items: stretch;
      align-items: stretch;
      align-content: flex-start;
      -webkit-justify-content: space-around;
      justify-content: space-around;
      position: relative;
      margin: 20px;
      padding: 10px;
      border: solid 2px rgba(171,34,32,1);
      border-radius: 5px;
      background-color: rgba(225,225,225,0.85);
      box-shadow: 0px 0px 4px rgba(59,56,55,1);
      }
      @media only screen and (max-width: 499px) { #podcast { width: 100%; } }
      @media only screen and (min-width: 500px) and (max-width: 769px) { #podcast { width: 100%; } }
      @media only screen and (min-width: 770px) and (max-width: 1199px) { #podcast { width: 50%; } }
      @media only screen and (min-width: 1200px) { #podcast { width: 50%; } }
      	      	      	
      #podcast_titel
      	{
      	width: 100%;
      	margin-bottom: 0px;
      	text-align: center;
      	font-weight: bold;
      	}
      	      	      	
      	#podcast_datum
      	   {
      	   width: 100%;
      	   text-align: left;
      	   }
      	      	      	
      #podcast_bild
      	{
      	position: relative;
      	width: 28%;
      	margin: 10px 5px 0px 0px;
      	font-weight: bold;
      	text-align: center;
      	}
      	      	      	
      	#podcast_bild img
      	   {
      	   width: auto;
      	   max-width: 100%;
      	   height: auto;
      	   box-shadow: 2px 2px 2px rgba(130,177,46);
      	   }
      	      	      	
      	#podcast_bild #folge
      	   {
      	   display: -webkit-flex;
      	   display: -webkit-box;
      	   display: -ms-flexbox;
      	   display: flex;
      	   flex-direction: row;
      	   flex-wrap: wrap;
      	   -webkit-align-items: center;
      	   align-items: center;
      	   align-content: center;
      	   -webkit-justify-content: center;
      	   justify-content: center;
      	   position: absolute;
      	   padding: 3px 1px 1px 1px;
      	   border: solid 1px rgba(255,255,255,1);
      	   border-radius: 100%;
      	   box-shadow: 0px 0px 3px rgba(255,255,255,1);
      	   color: rgba(255,255,255,1);
      	   text-shadow: -2px -2px 2px rgba(0,0,0,1), -2px 2px 2px rgba(0,0,0,1), 2px -2px 2px rgba(0,0,0,1), 2px 2px 2px rgba(0,0,0,1);
      	   background-color: rgba(50,150,77,0.7);
      	   background-image: url("images/logo_rund.png");
      	   background-size: cover;
      	   background-repeat: no-repeat;
      	   background-position: center;
      	   font-family: Arial;
      	   font-weight: bold;
      	   }
      	   @media only screen and (max-width: 499px) { #podcast_bild #folge { top: 5px; left: 5px; width: 20px; height: 20px; font-size: 18px; } }
      	   @media only screen and (min-width: 500px) and (max-width: 769px) { #podcast_bild #folge { top: 5px; left: 5px; width: 26px; height: 26px; font-size: 18px; } }
      	   @media only screen and (min-width: 770px) and (max-width: 1199px) { #podcast_bild #folge { top: 5px; left: 5px; width: 32px; height: 32px; font-size: 18px; } }
      	   @media only screen and (min-width: 1200px) { #podcast_bild #folge { top: 5px; left: 5px; width: 40px; height: 40px; font-size: 24px; } }
      	      	      	
      #podcast_beschreibung
      	{
      	width: 68%;
      	margin: -8px 0px 0px 5px;
      	text-align: justify;
      	hyphens: auto;
      	word-wrap: break-all; overflow-wrap: anywhere;
      	}
      	      	      	
      #podcast_audio
      	{
      	width: 100%;
      	margin-top: 10px;
      	}
      	      	      	
      	#podcast_audio audio
      	   {
      	   width: 100%;
      	   background: rgba(130,177,46);
      	   border-radius: 10px;
      	   }