/*                                                                                                      */
/* #################################################################################################### */
/* # Datei css/standard.css 3.28                                                 */
/* #################################################################################################### */
/* # Copyright © 06.2022 ISS-Oberlausitz (www.iss-ol.de)                                                   */
/* # Author: T.Hojenski                                                                                 */
/* # Email:  info@iss-ol.de                                                                             */
/* # URL:    http://www.bluepage-cms.com                                                                  */
/* #################################################################################################### */
/*                                                                                                      */
@import url("./layout.css");
@import url("./basis.css"); 
@import url("./addon.css"); 
@import url("./addon.aktuelles.css"); 
@import url("./dsgvo.css"); 

:root {
  --main-text-color: #05498C;
  --main-h2-color: #05498C;
  --main-link-color: #05498C;
  --main-link-hover-color: #95C11F;
  
  --main-bl-color: #05498C;   
  --main-gn-color: #95C11F;    
  --main-rt-color: #C22E0C;
  --main-ws-color: #ffffff;
  --main-sw-color: #333333;

  --nav1-font-size: 20px;
  --nav2-font-size: 18px;

  --main-font-size: 20px;
  --main-red-size: 18px;
  --main-exp-size: 22px;
  --main-small-size: 16px;
  --main-h1-size: 1em;
  --main-titel-size: 27px;
  --main-h4-size: 52px;
  --main-link-size: 22px;
  --flex-size: 20px; 
}
@media screen and (max-width: 1590px){
         :root {
      --nav1-font-size: calc(14px + (20 - 14) * ((100vw - 840px) / (1530 - 840)));
      --_nav2-font-size: calc(16px + (18 - 16) * ((100vw - 840px) / (1530 - 840)));

      --main-font-size: calc(15px + (20 - 15) * ((100vw - 840px) / (1530 - 840)));
      --main-red-size: calc(13.5px + (18 - 13.5) * ((100vw - 840px) / (1530 - 840)));
      --main-exp-size: calc(16.5px + (22 - 16.5) * ((100vw - 840px) / (1530 - 840)));
      --main-small-size: calc(12px + (16 - 12) * ((100vw - 840px) / (1530 - 840)));

      --main-h1-size: calc(15px + (20 - 15) * ((100vw - 840px) / (1530 - 840)));
      --main-titel-size: calc(20.25px + (27 - 20.25) * ((100vw - 840px) / (1530 - 840)));
      --main-link-size: calc(16.5px + (22 - 16.5) * ((100vw - 840px) / (1530 - 840)));;
      --main-h4-size: calc(32px + (52 - 32) * ((100vw - 840px) / (1470 - 840)));
      --main-odv-size: calc(18px + (22 - 18) * ((100vw - 840px) / (1470 - 840)));
       --flex-size: calc(11px + (20 - 11) * (100vw - 840px) / (1530 - 840 + 45));          
   }                     
}
/*
@media (min-width:400px) and (max-width:800px){
.test {font-size: calc(12px + (24 - 12) * ((100vw - 400px) / (800 - 400)));}
}
*/
@media screen and (max-width: 840px){
            :root {
      --_nav1-font-size: calc(14px + (12 - 14) * ((100vw - 480px) / (840 - 480)));
      --_nav2-font-size: calc(12px + (14 - 12) * ((100vw - 480px) / (840 - 480)));

      --main-font-size: calc(13.5px + (18 - 13.5) * ((100vw - 480px) / (840 - 480)));
      --main-red-size: calc(12px + (16 - 12) * ((100vw - 480px) / (840 - 480)));
      --main-exp-size: calc(15px + (20 - 15) * ((100vw - 480px) / (840 - 480)));
      --main-small-size: calc(12px + (16 - 12) * ((100vw - 480px) / (840 - 480)));

      --main-h1-size: calc(10.5px + (14 - 10.5) * ((100vw - 480px) / (840 - 480)));
      --main-titel-size: calc(20.25px + (27 - 20.25) * ((100vw - 480px) / (840 - 480)));
      --main-link-size: calc(10px + (16 - 10) * ((100vw - 480px) / (840 - 480)));
      --main-h4-size: calc(22px + (32 - 22)  * ((100vw - 480px) / (840 - 480)));
      --main-odv-size: calc(14px + (16 - 14) * ((100vw - 480px) / (840 - 480)));
      --flex-size: calc(6px + (20 - 6) * (100vw - 480px) / (1530 - 480 + 20));          
  }
}
@media screen and (max-width: 480px){
         :root {
      --main-font-size: calc(15px + (20 - 15) * ((100vw - 320px) / (480 - 320)));
      --main-red-size: calc(13.5px + (18 - 13.5) * ((100vw - 320px) / (480 - 320)));
      --main-exp-size: calc(16.5px + (22 - 16.5) * ((100vw - 320px) / (480 - 320)));
      --main-small-size: calc(12px + (16 - 12) * ((100vw - 320px) / (480 - 320)));

      --main-h1-size: calc(9.75px + (13 - 9.75) * ((100vw - 320px) / (480 - 320)));
      --main-titel-size: calc(20.25px + (27 - 20.25) * ((100vw - 320px) / (480 - 320)));
      --main-link-size: calc(16.5px + (22 - 16.5) * ((100vw - 320px) / (480 - 320)));;
      --main-h4-size: calc(27px + (37 - 27)  * ((100vw - 320px) / (480 - 320)));

      --main-odv-size: calc(18px + (20 - 18) * ((100vw - 320px) / (480 - 320)));
      --_flex-size: calc(6px + (20 - 6) * ((100vw - 480px) / (1530 - 480)));          
      --flex-size: 20px;           
   }
}/*
:root {
  --main-text-color: #05498C;
  --main-h2-color: #05498C;
  --main-link-color: #05498C;
  --main-link-hover-color: #95C11F;
  
  --main-bl-color: #05498C;   
  --main-gn-color: #95C11F;    
  --main-rt-color: #C22E0C;
  --main-ws-color: #ffffff;
  --main-sw-color: #333333;

  --main-hbl-color: #cddbe8;   
  --main-hgn-color: #f4f9e8;

  --nav1-font-size: 20px;
  --nav2-font-size: 18px;

  --main-font-size: 20px;
  --main-red-size: 18px;
  --main-exp-size: 22px;
  --main-small-size: 16px;
  --main-h1-size: 1em;
  --main-titel-size: 27px;


  --main-h2-size: 27px;
  --main-h4-size: 52px;
  --main-link-size: 22px;
  --main-odv-size: 22px;

  --mm-nav-font-color: #000000;
  --mm-nav1-font-color: #808080;
  
  --flex-size: 20px; 
}
@media screen and (max-width: 1710px){
      :root {
      --nav1-font-size: calc(16px + (20 - 16) * ((100vw - 840px) / (1470 - 840)));
      --nav2-font-size: calc(16px + (18 - 16) * ((100vw - 840px) / (1470 - 840)));

      --main-font-size: calc(15px + (20 - 15) * ((100vw - 840px) / (1710 - 840)));
      --main-red-size: calc(13.5px + (18 - 13.5) * ((100vw - 840px) / (1710 - 840)));
      --x-main-red-size: calc(14px + (18 - 14) * ((100vw - 840px) / (1470 - 840)));
      --main-exp-size: calc(16.5px + (22 - 16.5) * ((100vw - 840px) / (1470 - 840)));
      --x-main-exp-size: calc(18px + (22 - 18) * ((100vw - 840px) / (1470 - 840)));
      --main-small-size: calc(12px + (16 - 12) * ((100vw - 840px) / (1470 - 840)));

      --main-h1-size: calc(15px + (20 - 15) * ((100vw - 840px) / (1710 - 840)));
      --x-main-titel-size: calc(16px + (27 - 16) * ((100vw - 840px) / (1470 - 840)));
      --main-titel-size: calc(20.25px + (27 - 20.25) * ((100vw - 840px) / (1470 - 840)));
      --main-h4-size: calc(32px + (52 - 32) * ((100vw - 840px) / (1470 - 840)));
      --x-main-h4-size: calc(42px + (52 - 42) * ((100vw - 840px) / (1470 - 840)));
      --main-link-size: calc(18px + (22 - 18) * ((100vw - 840px) / (1470 - 840)));
      --main-odv-size: calc(18px + (22 - 18) * ((100vw - 840px) / (1470 - 840)));

       --flex-size: calc(6px + (20 - 6) * (100vw - 820px) / (1530 - 820 + 45));          
   }
}
@media screen and (max-width: 840px){
      :root {
      --nav1-font-size: calc(14px + (16 - 14) * ((100vw - 480px) / (840 - 480)));
      --nav2-font-size: calc(12px + (14 - 12) * ((100vw - 480px) / (840 - 480)));
      --main-font-size: calc(15px + (20 - 15) * ((100vw - 480px) / (840 - 480)));
      --main-red-size: calc(13.5px + (18 - 13.5) * ((100vw - 480px) / (840 - 480)));
      --main-exp-size: calc(16.5px + (22 - 16.5) * ((100vw - 480px) / (840 - 480)));
      --x-main-red-size: calc(12px + (14 - 12) * ((100vw - 480px) / (840 - 480)));
      --x-main-exp-size: calc(16px + (22 - 16) * ((100vw - 480px) / (840 - 480)));
      --main-small-size: calc(12px + (16 - 12) * ((100vw - 480px) / (840 - 480)));
      --main-h1-size: calc(12.75px + (17 - 12.75) * ((100vw - 480px) / (840 - 480)));
      --x-main-h1-size: calc(15px + (20 - 15) * ((100vw - 480px) / (840 - 480)));
      --x-main-h1-size: calc(12px + (16 - 12) * ((100vw - 480px) / (840 - 480)));
      --main-titel-size: calc(20.25px + (27 - 20.25) * ((100vw - 480px) / (840 - 480)));
      --x-main-h2-size: calc(17px + (27 - 17) * ((100vw - 480px) / (840 - 480)));
      --main-h4-size: calc(22px + (32 - 22)  * ((100vw - 480px) / (840 - 480)));
      --main-link-size: calc(14px + (18 - 14) * ((100vw - 480px) / (840 - 480)));
      --main-odv-size: calc(14px + (18 - 14) * ((100vw - 480px) / (840 - 480)));

      --flex-size: calc(6px + (20 - 6) * (100vw - 480px) / (1530 - 480 + 20));          
   }
}
@media screen and (max-width: 480px){
      :root {
      --nav1-font-size: calc(16px + (20 - 16) * ((100vw - 320px) / (480 - 320)));
      --nav2-font-size: calc(13px + (15 - 13) * ((100vw - 320px) / (480 - 320)));
      --main-font-size: calc(15px + (20 - 15) * ((100vw - 320px) / (480 - 320)));
      --main-red-size: calc(13.5px + (18 - 13.5) * ((100vw - 320px) / (480 - 320)));
      --main-exp-size: calc(16.5px + (22 - 16.5) * ((100vw - 320px) / (480 - 320)));
      --x-main-red-size: calc(16px + (20 - 16) * ((100vw - 320px) / (480 - 320)));
      --x-main-exp-size: calc(20px + (22 - 20) * ((100vw - 320px) / (480 - 320)));
      --main-small-size: calc(12px + (16 - 12) * ((100vw - 320px) / (480 - 320)));
      --main-h1-size: calc(12.75px + (17 - 12.75) * ((100vw - 320px) / (480 - 320)));
      --x-main-h1-size: calc(12px + (16 - 12) * ((100vw - 320px) / (480 - 320)));
      --main-titel-size: calc(20.25px + (27 - 20.25) * ((100vw - 320px) / (480 - 320)));
      --x-main-h2-size: calc(16px + (27 - 16) * ((100vw - 320px) / (480 - 320)));
      --main-h4-size: calc(27px + (37 - 27)  * ((100vw - 320px) / (480 - 320)));
      --main-link-size: calc(20px + (22 - 20) * ((100vw - 320px) / (480 - 320)));
      --main-odv-size: calc(18px + (20 - 18) * ((100vw - 320px) / (480 - 320)));

      --flex-size: calc(6px + (20 - 6) * ((100vw - 480px) / (1530 - 480)));          
   }
}
*/