/*   
 ------------------------------------------------------------------------------------------------------------------------------- 

    Programm / Seite:  Cascading-Style-Sheet für möglichst alle Browser
                       (Styles die für mehrere Seiten verwendet werden.)

               Autor:  Michael Gartner

  Entwicklungsbeginn:  13.08.2013  
     letzte Änderung:  01.04.2026

            Änderung:  131
           
 ------------------------------------------------------------------------------------------------------------------------------- 
  */ 
  * { box-sizing:border-box; }
  
  @font-face { font-family:Ueberschrift; src: url('font/Days.otf'); }
  @font-face { font-family:Normalschrift; src: url('font/Roboto-Regular.ttf'); }
  @font-face { font-family:Dichteschrift; src: url('font/RobotoCondensed-Regular.ttf'); }
  @font-face { font-family:Mittelschrift; src: url('font/Roboto-Medium.ttf'); }
  @font-face { font-family:DIN_Schrift; src: url('font/DIN1451alt.ttf'); }
  @font-face { font-family:Eingabeschrift; src: url('font/MonospaceTypewriter.ttf'); }
  @font-face { font-family:LCD_Schrift; src: url('font/LCD.TTF'); }

  body { font-family:Normalschrift,Arial; background:#FFF; padding:0; margin:0; line-height:1.2; overflow-y:scroll; } 
  
  img.icon { width:70px; height:auto; margin-top:6px; border-radius:40px; transition: transform 0.5s ease-out; }
  img.icon:hover { transform: rotate(360deg); }   
 
  h1 { display:inline; font-family:Normalschrift; }
  h2 { display:inline; font-family:Dichteschrift; }
  h3 { display:inline; font-family:LCD_Schrift; }
  h4 { display:inline; font-family:DIN_Schrift; }
  h5 { display:inline; font-family:Ueberschrift; }
 
  #boxtop { z-index:91; position:fixed; left:0px; top:0px; height:85px; width:100%; }
  #boxmenu { z-index:90; position:fixed; left:0px; top:85px; width:100%; height:40px; box-shadow: 0 10px 20px #888; background:#505050; } 
  #boxmainleft { z-index:80; position:fixed; left:calc((100% - 1000px) / 2 + 0px); top:125px; width:70px; height:100%; background:#FFF; text-align:center; }
  #boxmain { z-index:1; position:absolute; left:calc((100% - 1000px) / 2 + 70px); top:125px; width:930px; height:100%; background:#FFF; padding:25px 0px 0px 10px; }
  #boxbottom { z-index:90; position:fixed; left:0px; bottom:0px; height:25px; width:100%; box-shadow:0 -10px 20px #888; background:#505050; }
  #boxleft { z-index:80; position:fixed; left:0px; top:125px; right:calc((100% - 1000px) / 2 + 1000px); bottom:25px; background:#EEE; border-right:1px solid #E0E0E0; }
  #boxright { z-index:80; position:fixed; left:calc((100% - 1000px) / 2 + 1000px); top:125px; right:0px; bottom:25px; background:#EEE; border-left:1px solid #E0E0E0; }

  #menu { position:absolute; left:calc((100% - 1000px) / 2 + 40px); top:0px; width:950px; cursor:default; font-family:Dichteschrift; }
  #menu h6 { font-size:14px; font-weight:normal; color:#FFFFFF; text-shadow: 1px 1px 2px #606060; padding:10px; margin:0; line-height:14px; }
  #menu ul { position:absolute; margin: 0 auto; list-style:none; border-radius:0px 0px 3px 3px; }
  #menu ul li { float:left; margin: 0 18px 0 0; line-height:40px; }
  #menu ul li a { cursor:pointer; font-size:16px; font-weight:normal; color:#FFFFFF; text-shadow:1px 1px 2px #606060; text-decoration:none; background:transparent; transition: all .2s ease-in-out; }
  #menu ul li a:hover { color:#FFD318; background:transparent; }
  #menu ul li a:active { color:#2D9DD9; background:transparent; }
  #menu ul ul { position:absolute; top:-9999px; background:#FFFFFF; padding:0; margin:0 0 0 -5px; box-shadow:0 10px 20px #888; }
  #menu ul ul:before { position:absolute; content:""; width:10px; height:10px; top:-5px; left:20px; transform: rotate(45deg); }
  #menu ul li:hover ul { top:40px; }
  #menu ul ul a { text-decoration:none; color:#303030; }
  #menu ul ul li { color:#303030; float:none; font-size:14px; font-weight:normal; text-shadow:1px 1px 3px #A0A0A0; padding:2px; text-align:left; margin:4px 15px 2px 4px; line-height:20px; }
  #menu ul ul li:hover { border-radius:3px; color:#303030; background-color:#E0E0E0; }
  #menu ul ul li.all { border-bottom:none; }
  .menuicon { border:0px solid #D0D0D0; border-radius:3px; margin:0px 7px 0px 3px; width:auto; height:26px; filter:grayscale(1); }

  #KT { position:absolute; left:10px; top:25px; }
  #LT { position:absolute; left:10px; top:95px; }
  #STI { width:100%; height:280px; overflow-y:auto; } 
  #KlimaKenntageTabelle { position:relative; left:0px; top:0px; height:220px; width:190px; overflow-y:scroll; text-align:left; }  
  #Wetterbild02 { position:absolute; left:0px; top:90px; width:912px; height:calc(100% - 65px); overflow:auto; } 

  /* ---- Version 2025 ---- */  
   
  /* Textfarben */ 
  .sw { color:#404040; }
  .gr { color:#707070; }
  .gn { color:#008800; }
  .bu { color:#2D9DD9; }
  .rt { color:#AA0000; }
  .rs { color:#F69606; }
  .or { color:#FFD318; }
  .ws { color:#FFFFFF; }  

  .t09 { font-size:9px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t10 { font-size:10px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t11 { font-size:11px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t12 { font-size:12px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t13 { font-size:13px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t14 { font-size:14px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t16 { font-size:16px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t18 { font-size:18px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t20 { font-size:20px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t22 { font-size:22px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t24 { font-size:24px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t26 { font-size:26px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t28 { font-size:28px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t30 { font-size:30px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t32 { font-size:32px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t40 { font-size:40px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t50 { font-size:50px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t56 { font-size:56px; font-weight:normal; line-height:56px; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t60 { font-size:60px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t64 { font-size:64px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t68 { font-size:68px; font-weight:normal; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t72 { font-size:72px; font-weight:normal; line-height:72px; text-shadow: 1px 1px 2px #A0A0A0; } 
  .t100 { font-size:100px; font-weight:normal; line-height:100px; text-shadow: 1px 1px 2px #A0A0A0; } 

  /* Hintergrundfarben */ 

  .bgbu { background: #2D9DD9; }
  .bggr { background: #808080; }
/*
  .bgbu { background: #C592F4; }
  .bggr { background: #808080; }
*/
  .bgws { background: #FFFFFF; }
  
  /* sonstige Texteinstellungen */
  .tsh { text-shadow: 1px 1px 2px #606060; }
  .tsh2 { text-shadow: 1px 1px 3px #B0B0B0; }

  .scale0:hover { transform: scale(1.4); z-index:9999; }
  .scale1:hover { transform: scale(1.5); z-index:9999; }
  .scale2:hover { transform: scale(1.9); z-index:9999; }
  .scale3:hover { transform: scale(2.2); z-index:9999; }

  .ppt:hover { transform-origin: 50% 0; }
  .ppb:hover { transform-origin: 50% 100%; }
  .ppl:hover { transform-origin: 0 50%; }
  .ppc:hover { transform-origin: 50% 50%; }
  .ppr:hover { transform-origin: 100% 50%; }
  .pplt:hover { transform-origin: 0 0; }
  .pprt:hover { transform-origin: 100% 0; }
  .pplb:hover { transform-origin: 0 100%; }
  .ppmb:hover { transform-origin: 50% 100%; }
  .pprb:hover { transform-origin: 100% 100%; }
  .bora05 { border:1px solid #E0E0E0; border-radius:5px; }
  .bono { border:1px solid #E0E0E0; }
  .bora05red { border:1px solid #AA0000; border-radius:5px; }
  .bora05ltb  { border-left:1px solid #E0E0E0; border-top:1px solid #E0E0E0; border-bottom:1px solid #E0E0E0; border-top-left-radius:5px; border-bottom-left-radius:5px;  }
  .bora05tb  { border-top:1px solid #E0E0E0; border-bottom:1px solid #E0E0E0; }
  .bora05rtb  { border-right:1px solid #E0E0E0; border-top:1px solid #E0E0E0; border-bottom:1px solid #E0E0E0; border-top-right-radius:5px; border-bottom-right-radius:5px; }
  .bora05ltr  { border-left:1px solid #E0E0E0; border-top:1px solid #E0E0E0; border-right:1px solid #E0E0E0; border-top-left-radius:5px; border-top-right-radius:5px; }
  .bora05lr  { border-left:1px solid #E0E0E0; border-right:1px solid #E0E0E0; }
  .bora05lbr  { border-left:1px solid #E0E0E0; border-bottom:1px solid #E0E0E0; border-right:1px solid #E0E0E0; border-bottom-left-radius:5px; border-bottom-right-radius:5px; }
  .bt { border-top:1px solid #E0E0E0; }
  .br { border-right:1px solid #E0E0E0; }
  .bl { border-left:1px solid #E0E0E0; }
  .bb { border-bottom:1px solid #E0E0E0; }
  .bbd { border-bottom:1px dotted #A0A0A0; }
  .ratl05 { border-top-left-radius:5px; }
 
  .pd02 { padding:2px; }
  .pl02 { padding-left:2px; }
  .pd05 { padding:5px; }
  .pl05 { padding-left:5px; }
  .pt03 { padding-top:3px; }
  .pt05 { padding-top:5px; }
  .pr05 { padding-right:5px; }
  .pb05 { padding-bottom:5px; }
  .pd10 { padding:10px; }
  .pl10 { padding-left:10px; }
  .pr10 { padding-right:10px; }
  .pt10 { padding-top:10px; }
  .pb10 { padding-bottom:10px; }
  .pt15 { padding-top:15px; }
  .pb15 { padding-bottom:15px; }
  .pl15 { padding-left:15px; }
  .pr15 { padding-right:15px; }
  .pl20 { padding-left:20px; }
  .pr20 { padding-right:20px; }
  .pt20 { padding-top:20px; }
  .pb20 { padding-bottom:20px; }

  .ml03 { margin-left:3px; }
  .mr05 { margin-right:5px; }
  .mt05 { margin-top:5px; }
  .mb05 { margin-bottom:5px; }
  .ml05 { margin-left:5px; }
  .mr10 { margin-right:10px; }
  .mt10 { margin-top:10px; }
  .ml10 { margin-left:10px; }
  .mb10 { margin-bottom:10px; }
  .mr20 { margin-right:20px; }
  .mt20 { margin-top:20px; }
  .ml20 { margin-left:20px; }
  .mb20 { margin-bottom:20px; }
  .mr40 { margin-right:45px; }
  .mb60 { margin-bottom:60px; }
  
  .lh10 { line-height:1.0; }
  .lh11 { line-height:1.1; }
  .lh12 { line-height:1.2; }
  .lh13 { line-height:1.3; }
  .lh18 { line-height:1.8; }
    
  .figb { filter:grayscale(1) brightness(1.3); z-index:9990; }
  .figo { filter:grayscale(1) opacity(0.6); }

  .pic18 { width:auto; height:18px; }
  .pic20 { width:auto; height:20px; }
  .pic24 { width:auto; height:24px; }
  .pic28 { width:28px; height:28px; }
  .pic36 { width:auto; height:36px; }
  .pic100 { width:101px; height:auto; }
  .pic140 { width:140px; height:auto; }
  .pic4025 { width:40px; height:25px; }
  .picsp01 { width:auto; max-width:90px; height:34px; }
  .pic50mr { width:auto; height:50px; margin-right:2px; }
  .picbr5 { border:1px solid #E0E0E0; border-radius:5px; }
  .picbr3 { border:1px solid #D0D0D0; border-radius:3px; }
  .pictop1 { border:1px solid #707070; border-radius:3px; margin-right:5px; }
  .pictop2 { border:1px solid #707070; border-radius:3px; margin-right:5px; z-index:99; transform:rotate(20deg); }  
  .pictop2:hover { transform:rotate(0deg); transition:transform 0.5s ease; }
  .picxmas { width:75px; height:auto; }
  .picvert { position:absolute; left:58px; bottom:100px; transform-origin: 0% 100%; transform: rotate(-90deg); }   
  
  .picaq { position:relative; width:20px; height:24px; border:1px solid #A0A0A0; border-radius:3px;  }
  .picbio { width:20px; height:34px; border:1px solid #A0A0A0; border-radius:3px; } 
  .picome15 { width:auto; height:32px; margin:4px 10px 0px 0px; }
  
  .bcol1 { background:#000080; }
  .bcol2 { background:#2D9DD9; }
  .bcol3 { background:#C00000; }
  .bcol4 { background:#FFD800; }
  .bcol5 { background:#008000; }
  .bcol6 { background:#FF9000; }
  .bcol7 { background:#FF5500; }
  .bcol8 { background:#F000FF; }
  .bcol9 { background:#9000FF; }

  .pcol0 { background:#37BA29; }
  .pcol1 { background:#D6FF94; }
  .pcol2 { background:#FFE344; }
  .pcol3 { background:#FFD57F; }
  .pcol4 { background:#FF9944; }
  .pcol5 { background:#FF8080; }
  .pcol6 { background:#E60000; }
  .pcolx { background:#CCCCCC; }

  /* ---------------------- */

  a:link, a:visited { text-decoration: none; }
  
  a.up { text-decoration:none; color:#FFFFFF; transition: all .2s ease-in-out; }
  a.up:hover { color:#FF9F00; }
  a.up:active { color:#C40000; }

  a.linktext { text-decoration:none; color:#2D9DD9; }
  a.linktext:hover { color:#FF9F00; }
  a.linktext:active { color:#C40000; }
  
  .linkpic { border:1px solid #C0C0C0; background:#FFFFFF; border-radius:3px; }
  .linkpic:hover { border:1px solid #FF9F00; }
  .linkpic:active { border:1px solid #C40000; }
  
  .inpf1 { font-family:Normalschrift; color:#303030; background:#FFFFFF; font-size:16px; font-weight:normal; text-align:left; text-shadow: #A0A0A0 1px 1px 3px; padding:4px 8px 4px 8px; border:1px solid #E0E0E0; border-radius:3px; resize:none; }
  .inpf2 { font-family:Dichteschrift; color:#303030; background:#FFFFFF; font-size:16px; font-weight:normal; text-align:left; text-shadow: #A0A0A0 1px 1px 3px; padding:4px 8px 4px 8px; border:1px solid #E0E0E0; border-radius:3px; resize:none; }
  .self1 { font-family:Dichteschrift; height:28px; font-size:14px; text-shadow: #A0A0A0 1px 1px 3px; border-radius:3px; cursor:pointer; border:1px solid #E0E0E0; color:#707070; background:#FFF; }
  .inp_input { background:url("images/xlogo_input.jpg") no-repeat center center; border-radius:3px; width:100px; height:30px; border:1px solid #E0E0E0; }
  .inp_edit { background:url("images/xlogo_edit.jpg") no-repeat center center; border-radius:3px; width:100px; height:30px; border:1px solid #E0E0E0; }
  .inp_delete { background:url("images/xlogo_delete.jpg") no-repeat center center; border-radius:3px; width:100px; height:30px; border:1px solid #E0E0E0; }
  .inp_cancel { background:url("images/xlogo_cancel.jpg") no-repeat center center; border-radius:3px; width:100px; height:30px; border:1px solid #E0E0E0; }
  .inp_send1 { background:url("images/logo_col_pfeil.jpg") no-repeat center center; border-radius:3px; border:1px solid #E0E0E0; margin-top:2px; }
  .inp_ret { background:url("images/logo_col_pfeil_links.jpg") no-repeat center center; border-radius:3px; border:1px solid #E0E0E0; }
  
  input[type="submit"] { cursor:pointer; outline:none; background-size:contain; color:transparent; font-size:0; }
  input[type="submit"]:hover { border:1px solid #FF9F00; }
  
  input[type="radio"] { cursor:pointer; outline:none; width:16px; height:16px; appearance:none; background:white; border:1px solid #E0E0E0; border-radius:50%; }
  input[type="radio"]:hover { border:1px solid #FF9F00; }
  input[type="radio"]:checked { background:#2D9DD9; border:1px solid #E0E0E0; }

  input[type="checkbox"] { cursor:pointer; outline:none; width:18px; height:18px; appearance:none; border:1px solid #E0E0E0; background-color: #FFF; border-radius:3px; vertical-align:middle; } 
  input[type="checkbox"]:hover { border:1px solid #FF9F00; }
  input[type="checkbox"]:checked { background-image: url(images/xlogo_ok.jpg); background-size:18px 18px; background-position:center center; }

  label { cursor:pointer; } 
   
/* ------------------------------------------------------ Ende --------------------------------------------------------------- */