﻿A, BODY, DIV, DD, DL, DT, P, TR, TD, LI, UL, 
H1, H2, H3, H4, H5, H6, SELECT, BUTTON { font-family: Verdana, sans-serif; }

FIGURE, FIGCAPTION { font-family: Arial, Helvetica, sans-serif; }

:ROOT
   {
   --qg-background-color: #FFFFC0; //#FFFFC0; // Neu 2021 #F0F0F0;
   --qg-frame-bg-color: #D2B48C;
//   --qg-logo-color: #2D7D9A; /* NEU 2021 RGB: 45, 125, 154 #2D7D9A; */
   --qg-logo-color: #C5000C; /* RGB: 197, 0, 12 #C5000C; */
   --qg-link-color: #C5000C; /* RGB: 197, 0, 12 #C5000C; */
//   --qg-link-color: #2D7D9A; /* NEU 2021 RGB: 45, 125, 154 #2D7D9A; */
   --qg-link-hover: red;
   --qg-table-bg-dark: #E6D7BE;
   --qg-table-bg-bright: #FFFFF0; /* ivory: #FFFFF0; */
   }

BODY
   {
   color: black;
   background-color: var( --qg-background-color );
/* Fängt schon unter der Navigationsleiste an:
   background: linear-gradient( to right, var( --qg-background-color ), #FFFFA0 );
   background: linear-gradient( to bottom right, var( --qg-background-color ), green );
*/
   max-width: 90em; /* 1440px / 16pt */
   }
H1, H2, H3 { text-align: left; line-height: 1.0em; }
H1 { font-size: x-large; line-height: 1.4em; }
H2, SELECT, BUTTON { font-size: medium; }

DIV, DD, DL, DT, P, TR, TD, LI, UL
   {
   -webkit-hyphens: auto;
   -moz-hyphens: auto;
   -ms-hyphens: auto;
   -o-hyphens: auto;
   hyphens: auto;
   }  /* Silbentrennung, geht noch bei wenigen Browsern. "webkit: Safari, Chrome" */

IMG, SVG { margin: 0 0.375em; } /* 6px / 16pt */  /* oben/unten, links/rechts */

ABBR.dtstart, ABBR.dtend { border: none; }

P, DD, DL, DT, LI, UL { line-height: 1.4em; }

DD, UL, LI { margin-left: 0.5em; padding-left: 0.1em; }

DT { font-weight: bold; }

/* ARTICLE { padding-top: 0.5em; } */

A:link, A:visited { color: var( --qg-link-color ); } /*#CC2222;=204,34,34  #AE2012 = 174,32,18 BW; #DC143C = crimson */

A:hover, A:active { color: var( --qg-link-hover ); }

.extern_link A:link    { color: var( --qg-background-color ); }
.extern_link A:visited { color: var( --qg-background-color ); }
.extern_link A:hover   { color: var( --qg-link-hover ); }
.extern_link A:active  { color: var( --qg-link-hover ); }

FIGURE
   {
   float: right;
   max-width: 97%;
   margin: 0 0 0 1em; /* oben, rechts, unten, links */
   padding: 0.5em 0.5em 0.1em 0.5em; /* oben, rechts, unten, links */
   text-align: center; /* Hier definieren, sonst wird in manchen Browsern FIGCAPTION als Ganzes linksbündig plaziert */
/*   font-style: italic; */
/*   font-size: smaller; */
/*   font-size: 0.8em; */
/*   font-size: 0.9em; */
   background: var( --qg-table-bg-bright );
   border-radius: 0.5em;
   }

VIDEO
   {
//   border-radius: 0.5em;
   border-radius: 0.5em;
   }

@media only screen and (max-width: 40em) /* 640px / 16pt */
   {
   FIGURE
      {
      background: none;
      }
   FIGCAPTION
      {
      display: none;
      }
   }

#NavPosFrame
   {
   position: absolute;
   top: 0em;// left: 0em;
   height: auto;
   width: 100%;
   z-index: 999; // Als oberster Layer (99 reicht nicht für PayPal)
   }
@media only screen and (min-width: 320px) and (min-height: 320px)
{
html>body #NavPosFrame
   {  /* nur fuer moderne Browser! */
   position: fixed;
   }
}
* #NavPosFrame
   {  /* versteckt vor Netscape 4 */
   background-color: grey; // = #808080; // #CCCCCC; // black; (Windows 11: #7A7574; )
   }

#NavFrame
   {
   position: absolute;
   top: 0em; left: 0em;
   height: 100%;
   width: 12.5em; /* 200px / 16pt */
   }
html>body #NavFrame
   {  /* nur fuer moderne Browser! */
   position: fixed;
   }

#MainFrame
   {
   margin-left: 12.5em; /* 200px / 16pt */
   }
* #MainFrame
   {  /* versteckt vor Netscape 4 */
   /* background-color: var( --qg-background-color ); überflüssig! */
   }

.logo_text
   {
   font-family: Arial, Helvetica, sans-serif;
   font-weight: 800;
   color: var( --qg-logo-color );
//   color: red;
   letter-spacing: 0.05em;
//   letter-spacing: 0.1em;
//   text-shadow: 0.06em 0.06em var( --qg-link-color );
//   text-shadow: 0.06em 0.06em black;
   text-decoration: none;
   font-size: 1.1em;
//   vertical-align: top;
   }

.image_flex_portrait
   {
   max-width: 97%;
   }

img.image_flex_portrait
   {
   background-color: var( --qg-background-color );
   border-radius: 0.5em;
   }

.image_flex
   {
   max-width: 97%;
   border-radius: 0.5em;
   }

.image_flex_block
   {
   max-width: 97%;
   border-radius: 0.5em;
   }

.infobox
   {
   padding: 0.5em 1em;
   border: 2px solid #794923;
   border-radius: 0.5em;
   background: #FF9900;
   text-align: center;
   }

.event
   {
   color: #4E2F16;
   background-color: #FFFFE0;
   padding: 0.25em 0.5em;
   border: 2px solid #4E2F16;
   border-radius: 0.5em;
   }

.timeshift, MARK
   {
//   font-style: italic;
   background-color: #FF9900;
   padding: 0 0.3em;
   border-radius: 0.5em;
   }

.readmore_link
   {
   display: none;
   }

.readless_link
   {
   display: none;
   }

@media only screen and (max-width: 50em) /* 800px / 16pt */
{
.readmore_link
   {
   display: inline;
   }
.readmore
   {
   display: none;
   }
.readless_link
   {
   display: none;
   }
}
