

/* =============================================================================
   Typography
   ========================================================================== */
   

/* ROOT TEXT */
html           { font-size: 22px; }

/* HEADLINES */
h1             { font-size: 2.8rem; }                          /* Seitentitel */ 
h2             { font-size: 1.4rem; }                          /* Rubrikentitel */
h3             { font-size: 1.0rem; padding-bottom: 5px; }     /* Absatztitel */ 

/* TEXTE */
.ch_title      { font-size: 2.8rem; }  /* Title */    
.ch_intro      { font-size: 1.3rem; }  /* Intro */
.ch_text       {  }                    /* Fließtext */
.ch_rubrictitle{ font-size: 0.6rem; }  /* Rubrikentitel */
.ch_bt_label   {  }                    /* Button Label */   




/* =============================================================================
   Links
   ========================================================================== */
  
/* NAVIGATION */
.linknav          { font-size: 1.5rem; line-height: 1.2; text-decoration: unset; }  
.linknav.sub      {  }
.linknav.active   {  }

/* NOTES */
.linknotes     {  }     /*Marginalien*/
   
   


/* =============================================================================
   Other Elements
   ========================================================================== */



/* =============================================================================
   Embedded Content
   ========================================================================== */



/*-------------------------------*/
/*            NAVBAR             */
/*-------------------------------*/

#navbar {  }
   /* LOGO */
   #navbar .lrg-logo,
   #navbar .sml-logo {
      width:         245px;
      height:        40px;
   }

   /* EMERGENCY BT */
   #navbar .bt_emergency {
   }
      #navbar .bt_emergency .button {
      }
      #navbar .bt_emergency .button span {
         padding-right: 10px; 
      }
      #navbar .bt_emergency .button span:after {
         display:       none;
         padding-right: 10px;
      }

   /* BURGER */
   #navbar .hamburger {
      transform:      scale(0.9) !important;
   }  

   .nav-bg {  }
      .nav-bg.open {
         transition: height 0.4s ease 0s;
      }
      .nav-bg.close {
         transition: height 0.4s ease 0s;
      }

   /* MENU */
   #navbar .menu {
      transition: visibility 0.1s, opacity 0.1s; 
   }



/*-------------------------------*/
/*        HERO FULLSCREEN        */
/*-------------------------------*/

.hero-start{   
}
   /* BRANDICON */
   .hero-start .brandicon{ 
      /* 1/3 of height in pixels */
      width:      270px;
      height:     270px;
      top:        calc(80vh - 135px - 13px);
   }
   /* IMAGE */
   .hero-start .imagebox{  
      height:     80vh;
   }

/* TITLE (MOBILE) */
.hero-start .txt-intro .titlebox {
}
   .hero-start .txt-intro h1{
      width: 70%;
                                          /*border:  solid 1px #2FC3C1;*/
   }




/*-------------------------------*/
/*        TEXT: 1-COLUMN         */
/*-------------------------------*/

.txt-1col {
}
   .txt-1col .txt.box {
      grid-column: span 3 !important;  
   }




/*-------------------------------*/
/*             FOOTER            */
/*-------------------------------*/

#footer {
   height: auto;
}
   /* BRANDICON */
   #footer  .brandicon{ 
      height:     180px;
   }

   #footer .contact {
      padding-right:  60%;
   }
   #footer .social {
   }
   #footer .imprint {
      text-align:    right;
   }
      #footer .imprint a{
         padding-left: 15px;
      }








/* =============================================================================
   CHANGE: BASE and ADDONS
   ========================================================================== */



/*-------------------------------*/
/*           BUTTONS             */
/*-------------------------------*/

/* BUTTON DEFAULT */
.button {
   transition:    none;
   padding:       6px 10px 6px 20px;
   border:        0.2em solid var(--color2);
}
   .button span {
      padding-right: 25px;
   }
   .button span:after {
      transition:    none;
      transform:     scale(1.6);
      opacity:       1;
      padding-right: 20px;
      top:           -2px;
      right:         -20px;
   }
   .button:hover span {
      padding-right: 25px;
   }

/* BUTTON INVERS */
.button.invers {
   border:  solid 0.2em #FFF;
}
   /* HOVEREFFECT */
   .hover-teaser span,
   .button:hover span,
   .button-boarder:hover span,
   .button-light:hover span {
      padding-right: -20px;
   }
   .hover-teaser span:after,
   .button:hover span:after,
   .button-boarder:hover span:after,
   .button-light:hover span:after {
      right:   -20px;
   }

/* BUTTON ORANGE */
.button.orange {
}
   .button.orange span{
   }
   .button.orange span:after{
   } 



