/*
  default styles for HP of WG-Walding
  
  2006-02-05  Peter Atz. First attempt
  2007-04-10  Peter Atz.
  2009-06-18  Peter Atz. Adapt for new layout 
  2022-05-12  Peter Atz. consider mobile devices, streamline content 

  for testing position  of divs: border:1px solid black;
*/

/* basics : font and general colors and headlines */
body {color:#202020; background-color:white;}
body,h1,h2,h3,h4,p,ul,ol,li,dl,dt,dd,div,tr,table,td,th,address,blockquote,a,input {
  Font-size: 17px; Font-family: Arial, sans-serif, Segoe, Segoe UI, Calibri;
}
/* * {box-sizing: border-box;} */
li,dt { margin-top:0.2em; }

/* headlines */
h1 {font-weight:bold; font-size:1.4em; margin:0.2em 0 0.5em  0;}
h2 {font-weight:bold; font-size:1.3em; margin:0.2em 0 0.3em  0;}
h3 {font-weight:bold; font-size:1.2em; margin:0.1em 0 0.1em  0;}
h4 {font-weight:bold; font-size:1.1em; margin:0.1em 0 0.05em 0;}

/* ===============================================
   wide screen - eg Computer or tablet in landscan
   =============================================== */
@media only screen and (min-width:990px)
{
  /* total width=990px,
     contentBody net width=970px; (padding 10px),
     content:750px : 20px between navibox and content */
  #header {width:990px; height:120px; background-color: #009DE0;} 
  #contentBody {width:990px; padding:10px;}

  #naviBox {float:right; width:200px;}
  
  ul#mainMenu li.first {margin:0;}
  ul#mainMenu li {margin-top:1em; font-size:1.1em;}
  ul#mainMenu li.sub {margin:0.2em 0 0 1em; font-size:1em;}

  #infoBox1 {display: none;}
  #infoBox2 {margin-top:2em;}

  #contentSeparator {display: none;}
  #content {float:left; width:750px; overflow:auto;}
  #TOCbox {float:right; color:#009DE0; padding:0 0 0.5em 2em;}

  #footer {clear:both; width:990px;}
}

/* =========================================
   narrow screen - eg smartphone in portrait
   ========================================= */
@media only screen and (max-width:989px)
{
  #header {height:120px; background-color: #009DE0;}
  
  #naviBox {margin:1em 0 1em 0;}
  
  ul#mainMenu li {display:inline; margin-right:3em; font-size:1.5em;}
  ul#mainMenu li.sub {font-size:1.3em;}

  #infoBox1 {float:left; width:12em; margin-right:1em; }
  #infoBox2 {display: none;}

  #contentSeparator {clear:both;}
  #content {clear:both;}
  #TOCbox {display: none;}

  #footer {clear:both;}
}

#redPhone {padding:0.5em; margin:0; color:black; background-color:#eee;}
#redPhone p {margin:0.5em 0 0 0;}

#loginout {margin:0.5em 0 0.5em 0.5em;}
#loginout a {text-decoration: none; color:#202020;}

/* main menu */
ul#mainMenu {padding:0; margin-top:0.5em; list-style:none;}
ul#mainMenu li {font-weight:normal; text-align:left;}
ul#mainMenu li a {text-decoration:none; color:#202020; }
ul#mainMenu li span {color:#009DE0; font-weight:bold; }
ul#mainMenu a:hover {color:white; background-color:#009DE0;}

/* TOC menu */
ul#TOC-menu {padding:0; margin-top:0.5em; list-style:none;}
ul#TOC-menu li {padding:0.2em 1em 0.2em 0; color:#009DE0; text-align:right; }
ul#TOC-menu li a {text-decoration:none; color:#009DE0;}
ul#TOC-menu a:hover {color:white; background-color:#009DE0;}

/* navigation elements */
.nav {vertical-align:middle; margin:1em 0 1em 0; font-size:1.2em; font-weight:bold;
      color:#009DE0; background-color:#blue; background-image:linear-gradient(to right, #009DE0 , white);}
.nav a {text-decoration:none; color:#202020;}

/* special formatting */
.topNewsDate {color:gray; font-size:0.8em;}
.topNewsNormal {color:black; font-weight:bold;}
.topNewsAlert {color:red; font-weight:bold;}
.topNewsCurrent {color:green; font-weight:bold;}
.topNewsModify {font-size:0.9em;}
.hint {background-color:#eee; clear:both;}
.news {margin:1em; }
span.ueberfl {display: none; }
.attention {font-weight:bolder; font-size:1.5em; color:#cc0000;}
.attentionSmall {font-weight:bolder; color:#cc0000;}

/* images */
img.widePic {float:bottom; margin:0.6em 0 0.6em 0; clear:both;}
img.rightSidePic {float:right; margin:0.6em 0 0.6em 1.2em; }
img.leftSidePic {float:left; margin:0.6em 1.2em 0.6em 0;}
img.narrowPic {margin:0.6em 0 0.6em 0;}

/* tables */
table {border-spacing:0; border-collapse:collapse; border:solid 0px #bbb; }
td,th {padding:3px; font-size:1em;}
table.teamlist td {vertical-align:top; padding:0.6em; border:solid 0;}

th {color:#202020; background-color:#ddd; font-weight:bold;} 
td.rowH {color:#202020; background-color:#ddd;}
td.n {color:#202020; background-color:white;}
td.a {color:#202020; background-color:#FF8040;}
td.sev1 {color:black; background-color:#80FF80;}
td.sev2 {color:black; background-color:yellow;}
td.sev3 {color:white; background-color:red;}
tr.altColor {color:#202020; background-color:#eee;}
th.watanacol1 {width:10em;} 
th.watanacol2 {width:5em;} 
th.watanacol3 {width:5em;} 
th.watanacol4 {width:10em;} 
th.feescol1 {width:20em;}