/*
img {
  max-width: 100%;
  display:   block;
}

body {
  font-family: "Benton Sans", "Helvetica Neue", helvetica, arial, sans-serif;
  margin: 2em;
}

.desc {
  color: #ccc;
  background-color: rgba(0, 0, 0, 0.9);
  border-radius: 4px;
  padding: 10px;
}

@media (max-width: 640px) {
  h1 {
    color: red;
  }

  .desc:before {
    content: "This browser window is smaller than 640px wide.";
  }
}

@media (min-width: 640px) {
  h1 {
    color: blue;
  }

  .desc:before {
    content: "This browser window is at least 640px wide!";
  }
}

@media (min-width: 500px) and (max-width: 600px) {
  h1 {
    color: fuchsia;
  }

  .desc:after {
    content: " In fact, it's between 500px and 600px wide.";
  }
}

@media (orientation: portrait) {
  .orientation:after {
    content: " Portrait.";
  }
}

@media (orientation: landscape) {
  .orientation:after {
    content: " Landscape.";
  }
}


*/

img {
  max-width: 100%; display:normal;
}

@media only screen and (min-width:599px) and (min-height: 768px) 
{
	body { background: FloralWhite; }
}

@media only screen and (max-width:599px)
{
	body { background: Snow; }
}

@media only screen and (max-width:501px)
{
	body { background: White;	}
}

/* ===== Beispiel als Überblick ===== */

/*
  <style>
  .gelb {
    background-color:yellow; }

  #orange {
  background-color:orange; }
  </style>

  <p id="orange" class="gelb">Welche Farbe gewinnt? --> Orange</p>
*/

      /* Quelle: https://dakitec.de/blog/cookie-banner-selbst-erstellen */
      #footer-cookie,
      #footer-cookie * {
        box-sizing:     border-box;
      }

      #footer-cookie {
        display:        none;
        position:       fixed;
        bottom:         0px;
        left:           0px;
        width:          100%;
        height:         60px;
        padding-left:   30px;
        padding-right:  30px;
        line-height:    60px;
        background:     #303030;
        color:          #fff;
      }
    
      #footer-cookie a {
        color:          #fff;
      }

      #footer-cookie #description {
        float:          left;
      }

      #footer-cookie #accept {
        float:          right;
      }

      #footer-cookie #accept a {
        border:          1px solid #fff;
        padding:         5px 10px;
        text-decoration: none;
      }

      @media (max-width: 1200px)
      {
        #footer-cookie {
          padding-top:    30px;
          padding-bottom: 30px;
          line-height:    inherit;
          height:         auto;
        }

        #footer-cookie #description {
          width:      100%;
        }

        #footer-cookie #accept {
          width:      100%;
          margin-top: 15px;
        }

        #footer-cookie #accept a {
          width:      100%;
          display:    block;
          text-align: center;
        }
      } /* @media (max-width: 1200px) */

/* ===== einmalig (#) in einer HTML-Seite angesprochen z.B. als <div id="block_address_org"> ===== */

#MailLink:link    {color: Gray;    } /* unvisited link  */
#MailLink:visited {color: GrayText;} /* visited link    */
#MailLink:hover   {color: Green;   } /* mouse over link */
#MailLink:active  {color: Blue;    } /* selected link   */

#site_wrapper {
	width:        940px;
	margin-top:   20px;
	margin-left:  auto;
	margin-right: auto;}

#logo {
	float: left;}

#adresse {
	width:        290px;
	text-align:   right;
	font-family:  Verdana, Geneva, sans-serif;
	font-size:    12px;
	float:        right;
	color:        #5D6E66;
	line-height:  16px;}

#nav_container {
	height:             40px;
	width:              940px;
	position:           relative;
	left:               0px;
	top:                0px;
  background-image :  url('/img/bgnd/bg_navi_blau.jpg');
	background-repeat:  repeat;
	text-align:         center;}

#content {
	height: 390px;
	width: 940px;
	position: relative;
	left: 0px;
	top: 0px;
	padding-top: 40px;
  background-color:whitesmoke;}

#content_admin {
	height: 520px;
	width: 940px;
	position: relative;
  text-align:center;
	left: 0px;
	top: 0px;
	padding-top: 40px;
  background-color:whitesmoke;}

#footer {
	width:    940px;
	position: relative;
	left:     0px;
	top:      10px;
	height:   47px;}

#accept {
  display:          inline-block;
  background-color: transparent;
  }
#accept:hover {
  display:          inline-block;
  background-color: orangered;
  color:            black;
  }

#line {
	height:             40px;
	width:              940px;
	position:           relative;
	left:               0px;
	top:                0px;
	background-image:   url('/img/bgnd/bg_navi_blau.jpg');
	background-repeat:  repeat;}

#header {
	position:       relative;
	height:         77px;
	width:          940px;
	left:           0px;
	top:            0px;
	margin-bottom:  20px;}

#block_left {
	float:  left;
	height: 350px;
	width:  470px;} /* 2 Pixel Abstand */

#block_right {
	float:  right;
	height: 350px;
	width:  470px; } /* 2 Pixel Abstand */

#impressum {
	float:          left;
	height:         325px;
	width:          990px;
	overflow:       auto;
	padding-bottom: 25px;
	padding-right:  10px;}

#block_address {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 12px;
	line-height: 20px;
	color: #666;
	float: left;
	padding-top: 15px;
	padding-right: 20px;
	padding-left: 20px;
	text-align: justify;
	height: 325px;
	width: 430px;
	overflow: auto;}

#block_address_org {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 12px;
	line-height: 20px;
	color: #666;
	float: left;
	padding-top: 15px;
	padding-right: 20px;
	padding-left: 20px;
	text-align: justify;
	height: 325px;
	width: 430px;
	overflow: auto;}

.AB_text_normal {
	font-family: Verdana, Geneva, sans-serif;
	font-size:   12px;
  line-height: 20px;
  color:       #666;
	float:       left;}

.AB_text_bold {
	font-family: Verdana, Geneva, sans-serif;
	font-size:   12px;
  line-height: 20px;
  color:       #666;
	float:       left;
  font-weight: bold;}

#text .small {
	font-size: 10px;}

#text p {
	margin: 0px;
	padding: 0px;}

#text a {
	color: #546E65;
	text-decoration: underline;}

#text img {
	/*padding-top: 12px;*/
	padding-bottom: 8px;
	padding-top: 8px;}

#logo_wrapper {
	float: left;}

h2 {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 12px;
	line-height: 20px;
	color: #666;}

/* ===== mehrfach (.) in einer HTML-Seite angesprochen (Klasse) z.B. als <strong class="textmarkergelb">Stelle im Text</strong> ===== */

.break {
	height: 6px;
	width: 90px;}

.ie7 #content {
	position:static;}

.logos {
	height: 60px;
	margin-right: 30px;
	float: left;}

.maintitle 	    {font-family: Arial, Verdana, sans-serif; font-size: 18px; font-weight: bold; color:#6D6D60;}
.subtitle 	    {font-family: Arial, Verdana, sans-serif; font-size: 14px; font-weight: bold; color:#6D6D60;}
.text 		      {font-family: Arial, Verdana, sans-serif; font-size: 12px;                    color:#6D6D60;}
.text_white     {font-family: Arial, Verdana, sans-serif; font-size: 12px;                    color:#FFFFFF;}
.fainttext 	    {font-family: Arial, Verdana, sans-serif; font-size: 10px;                    color:#666666;}

.button_passive {font-family: Arial, Verdana, sans-serif; font-size: 14px; font-weight: normal; color: #FFFFFF; background-color: #666666; height:26px;} /* Navigation-Grau */
.button_active  {font-family: Arial, Verdana, sans-serif; font-size: 14px; font-weight: normal; color: #FFFFFF; background-color: #7092bf; height:26px;} /* Navigation-Blau */

.zentrierte-tabelle {width:200px; margin-left:auto; margin-right:auto; text-align:center;}