/* ##################################################
HEADER
################################################## */

/* hiding elements depending on lang defintion of html*/
html[lang="de"] .en                   { display:none; }
html[lang="en"] .de                   { display:none; }

/* Overwriting root variables inside this class*/
.rd-site-header .rd-container         { margin:0 auto; padding:0; --max-container-width : 1280px;}


/* #########
Site Header
########### */
.rd-site-header                       { background-color:var(--color-white); position:fixed; width:100vw; z-index: 100; }
.rd-site-header a                     { text-decoration:none; }
.rd-site-header button                { cursor:pointer; border:0; padding:0; margin:0; }
.rd-logo-container                    { position:relative; max-width:360px; }
.rd-site-header .rd-logo              { display:flex; width:fit-content; margin-right:3rem; padding:1rem 0; position:relative; }
.rd-site-header .rd-logo span         { margin:auto; }
.rd-site-header .rd-logo img          { display: block;}



@media (max-width:340px) {
    .rd-logo-container                              { width:260px; }

}

.rd-extern-menu { min-width:198px; }
.rd-extern-menu a:before {
  content: '';
  background: url(../images/icon-arrow-up-right.svg) 0 2px no-repeat;
  background-size: contain;
  display: inline-block;
  width: 25px;
  height: 15px;
  filter:var(--svg-color-white);
}


/* #########
Meta Menu
########### */
.rd-top-menu-wrapper                  { background-color:var(--color-3); color:var(--white); position:relative; z-index:10; font-size:var(--font-size-small); }
.rd-top-menu-wrapper ul               { padding:0; margin-bottom: 0; margin-top:0; }
.rd-top-menu-wrapper li               { padding:0; list-style-type:none; display: flex;}
.rd-top-menu-wrapper li a,
.rd-top-menu-wrapper li button        { color:var(--color-white); padding:0.5rem 0.5rem 0 0.5rem; display: flex; }
.rd-top-menu-wrapper li a:hover,
.rd-top-menu-wrapper li button:hover,
.rd-top-menu-wrapper li button.active        { color:var(--color-white); text-decoration: underline; text-decoration-thickness: 1.4px; text-underline-offset: 3.5px; }
.rd-top-menu-wrapper li a:focus-visible,
.rd-top-menu-wrapper li button:focus-visible { color:var(--color-white); outline-color: var(--color-white); outline-offset: -2px; background-color:var(--color-2); }


.rd-top-nav                           { display:flex; flex-wrap:wrap; width:100%; }
.rd-top-menu                          { margin:0 auto 0 21rem; display:flex;}

.rd-top-menu li                       { margin:0 1rem 0 0; }
.rd-top-menu > li:last-of-type        { margin:0; }

.rd-top-menu .rd-sub-menu a           { white-space: nowrap; padding:0.8rem 0;  }

.rd-language-search                   { margin:auto 0 auto auto; display:flex;}
.rd-language-search li                { margin:0 0 0 0.5rem; }
.rd-language-search li a              { padding:0.5rem 0.5rem; }
.rd-top-nav .rd-sub-menu              { display:none;  margin:3rem 0 0 0; border: solid 1px var(--color-2); background-color: var(--color-white); min-width: 248px; }
.rd-sub-menu li                       { margin:0; border-bottom:1px solid var(--color-black); }
.rd-sub-menu li:last-of-type          { border-bottom:0; }
.rd-sub-menu > li a,
.rd-sub-menu > li button              { color:var(--cl-black);  display:flex; padding:0.8rem 0;  width:100%;  }

.rd-sub-menu > li a:hover,
.rd-sub-menu > li button:hover        { color:var(--cl-black);  text-decoration: underline;
text-decoration-thickness: 1.5px;
text-underline-offset: 3.5px;
text-decoration-color: var(--color-1);}

/*.rd-top-menu .has-children:hover > .rd-sub-menu,
.rd-top-menu .has-children:focus-within .rd-sub-menu,*/
.rd-top-menu .rd-dropdown-toggle.active + .rd-sub-menu { display: block; position: absolute; top:3rem;  left: 50%; transform: translateX(-50%); padding: 2rem 1.5rem 1rem 1.5rem; }

.rd-top-nav .rd-sub-menu:after
{
  content: '';
  position: absolute;
  top: -23px;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 0 23px 24px 23px;
  border-color: transparent transparent #fff transparent;
  transform: rotate(0deg);
  display: block;
  left: calc(50% - 23px);
}
.rd-top-nav .rd-sub-menu:before
{
  content: '';
  position: absolute;
  top: -24px;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 0 23px 24px 23px;
  border-color: transparent transparent  var(--color-3) transparent;
  transform: rotate(0deg);
  display: block;
  left: calc(50% - 23px);
}
.rd-language-search li.search-link           { margin-left:0.5rem; }
.rd-icon-search {
    box-sizing: border-box;
    position: relative;
    display: block;
    transform: scale(0.75);
    width: 16px;
    height: 16px;
    border: 2px solid;
    border-radius: 100%;
    margin-top: 1px;
}
.rd-icon-search::after {
  content: "";
    display: block;
    box-sizing: border-box;
    position: absolute;
    border-radius: 3px;
    width: 3px;
    height: 8px;
    background: currentColor;
    transform: rotate(-45deg);
    top: 10px;
    left: 11px;
}
.rd-icon-darkmode {
  display: inline-block;
  position: relative;
  top: 2px;
  width: 19px;
  height: 16px;
  background: url('../Icons/darkmode.svg') no-repeat center;
    background-size: auto;
  background-size: contain;
  filter: var(--svg-color-white);
}
@media (max-width:1080px) {
  .rd-top-menu                          { margin:0 auto 0 15.5rem; }
  .rd-language-search li.search-link    { margin-left: 0rem; }
}

/* hiding Metamenu after Breakpoint Completely*/
@media (max-width:990px) {
  .rd-top-menu                          { display:none; }
}


/*#########
 Mega navi
########### */
.rd-menu-wrapper                       { position:relative; border-bottom: 1px solid var(--color-black);}
.rd-menu-wrapper .rd-container         { display:flex; }
.rd-mega-nav ul                        { padding:0; }
.rd-mega-nav li                        { margin:0; padding:0; list-style-type:none; position:static; }

.rd-menu-wrapper .rd-mega-nav          { margin:auto 0 auto 4.8rem; }
.rd-mega-menu                          { margin:0; display: flex; gap:1.5rem; }
.rd-mega-menu li                       { font-size:var(--font-size-main-navi); }
.rd-submenu-title                      { font-weight:var(--font-weight-bold); margin:0; padding: 0.8rem 0; }
.rd-mega-nav li a,
.rd-mega-nav li button                 { color:var(--color-link); position: relative; padding: 0.5rem; display: flex;}
.rd-mega-nav .rd-mega-sub-menu li      { margin-bottom:1rem; border-bottom:1px solid var(--color-black); font-size:1.6rem; }

.rd-mega-nav .rd-mega-sub-menu li:last-of-type           { border:0; }
.rd-mega-nav .rd-mega-sub-menu li a,
.rd-mega-nav .rd-mega-sub-menu li button                 { padding: 0.8rem 0; width:100%; display: flex;}

.rd-mega-nav li a:hover,
.rd-mega-nav li button:hover,
.rd-mega-nav li button.active                            {
  color:var(--color-link-hover);
  text-decoration: underline;
  text-decoration-color: var(--color-1);
text-decoration-thickness: 1.5px;
text-underline-offset: 3.5px;
}

.rd-mega-nav .rd-mega-sub-menu li a:hover,
.rd-mega-nav .rd-mega-sub-menu li button:hover,
.rd-mega-nav .rd-mega-sub-menu li button.active          { text-decoration: underline; text-decoration-color: var(--color-1); text-decoration-thickness: 1.5px; text-underline-offset: 3.5px; }

.rd-mega-nav li  a:focus-visible,
.rd-mega-nav li  button:focus-visible                    { color:var(--color-white); background-color:var(--color-1); }

.rd-mega-menu-container                                  { display:none; background-color: var(--color-bg-navi); }
.active + .rd-mega-menu-container             { display: flex; width:100%; position: absolute; z-index: -1; left:0; top:75px; max-height: calc(100vh - 120px); overflow: auto; }
.rd-mega-menu-container .rd-container                    {
  display:flex;
  gap:var(--grid-gap);
  padding:3rem 6rem 3rem 6rem;
  margin-bottom: 3rem;
  border:1px solid var(--color-black);
  border-top:0;
  position: relative;
  height:100%;
  background-color: var(--color-white);
}
.rd-mega-sub-menu                                        { margin:0; width:calc(33.333331% - var(--grid-gap)); }

.rd-mega-nav li button.rd-close-mega-menu                { position: absolute; right:0; bottom:0; padding: 0; width: auto; height: 45px; display:flex;}
.rd-mega-nav li button.rd-close-mega-menu:hover          { color:var(--color-2); }
.rd-close-mega-menu:focus-visible .visuallyhidden {
  clip:auto !important;
  clip-path:none;
  display:flex;
  height:auto;
  line-height:normal;
  width:auto;
  padding:1rem;
  position: relative;
  margin:auto 1rem auto 1rem;
 }
.rd-close-mega-menu .rd-icon-button-close                { width:45px; height:45px; margin-right:0; position: relative; }
.rd-close-mega-menu .rd-icon-button-close:before,
.rd-close-mega-menu .rd-icon-button-close:after   {
  content: '';
  position: absolute;
  left: calc(25% - 1px);
  top:calc(50% - 1px);
  width:25px;
  height:3px;
  transform:rotate(-45deg);
  background-color:currentColor;
  display: flex;
}
.rd-close-mega-menu .rd-icon-button-close:after          { transform:rotate(45deg); }

@media (max-width:1080px) {

  .rd-mega-menu                                          { gap:1rem; }
  .rd-menu-wrapper .rd-mega-nav                          { margin:auto 0 auto 0; }
  .rd-mega-nav li a, .rd-mega-nav li button              { padding: 0.5rem 1rem 0.5rem 0; }
}

/* hiding Metamenu after Breakpoint Completely*/
@media (max-width:990px) {
  .rd-mega-menu                                          { display:none; }
}



/*#########
 Burger navi
########### */
.rd-burger-menu { margin: 0 0 0 auto;}


/* Burger Menu Button */
.rd-burger-menu button.rd-burger-menu-toggle                         { position: relative; z-index: 20; height: 30px;
  width: 35px;
  top: calc(50% - 18px); }
.rd-burger-menu .rd-burger-menu-toggle  span                         { display:block; width:35px; height:4px; position: relative; background-color: var(--color-link); margin: 0 0 0 auto;}
.rd-burger-menu .rd-burger-menu-toggle  span.rd-icon-button:before,
.rd-burger-menu .rd-burger-menu-toggle  span.rd-icon-button:after    {
  content:'';
  position: absolute;
  width:100%;
  height:4px;
  transform-origin: 3.5px;
  top:10px;
  background-color: var(--color-link);
  display:block;
}
.rd-burger-menu .rd-burger-menu-toggle:hover span,
.rd-burger-menu .rd-burger-menu-toggle:hover  span.rd-icon-button:before,
.rd-burger-menu .rd-burger-menu-toggle:hover  span.rd-icon-button:after { background-color:var(--color-1); }
.rd-burger-menu .rd-burger-menu-toggle  span.rd-icon-button:before      { top:-10px; }
.rd-burger-menu .rd-burger-menu-toggle.active span                      { background:none; }
.rd-burger-menu-toggle.active span.rd-icon-button:before                { transform:rotate(45deg); left:3px; margin: -2px 0 0 2px; }
.rd-burger-menu-toggle.active span.rd-icon-button:after                 { transform:rotate(-45deg); left:3px; margin: -2px 0 0 2px; }
.rd-burger-menu .rd-burger-menu-toggle.active + .rd-burger-menu-wrapper::before {
  content: '';
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background-color: #fff;
    max-width: 496px;
    border-right: 1px solid #000;
}

.rd-burger-menu .rd-burger-menu-toggle.active + .rd-burger-menu-wrapper .rd-container { position:relative; }
.rd-burger-menu .rd-burger-menu-toggle.active + .rd-burger-menu-wrapper .rd-container::before {
  content: '';
  position: absolute;
  bottom: -57px;
  right: -51px;
  width: 1px;
  height: 100%;
  z-index: -1;
  max-width: 496px;
  border-right: 1px solid #000;
}


.rd-burger-menu-wrapper {
    position: fixed;
    top: 106px;
    z-index: 0;
    height: calc(100vh - 106px);
    width: calc(50vw - 200px);
    min-width: 480px;
    background-color: var(--color-white);
    right: 0;
    display: none;
    border-left: 1px solid var(--color-black);
    overflow: auto;

}
.rd-burger-menu-wrapper .rd-container              { margin: 5rem auto 5rem 5rem;  max-width: 395px; height:fit-content; width: 100%; display:block; }


.rd-burger-menu .rd-burger-menu-toggle.active + .rd-burger-menu-wrapper { display:flex; }

.rd-search-container                               { background-color:var(--color-form-fields); display:flex; margin-bottom:2rem; }
.rd-search-container input[type="search"]          { background-color:var(--color-form-fields); color:var(--color-black); border:0; min-height:45px; padding:1rem; width:100%; position:relative; z-index:1; }
.rd-search-container .rd-search                    { width:45px; display:flex; position:relative; z-index:1; }
.rd-search-container .rd-search span               { margin:auto;}

.rd-search-container  input[type="search"]:focus,
.rd-search-container  input[type="search"]:focus-visible,
.rd-search-container  .rd-search:focus-visible      { z-index:2; }

.rd-burger-menu  .rd-menu                         { display:block; margin:0 0 5rem 0; padding:0; }
.rd-burger-menu  .rd-menu li                      { list-style: none; margin:0 0 1rem 0; padding:0; border-bottom: 1px solid var(--color-black);}
.rd-burger-menu  .rd-sub-menu                     { margin: 0; display:none;  }

.rd-burger-menu  .rd-burger-dropdown-toggle.active + .rd-sub-menu { display:block; position: relative; top:inherit; left:inherit; transform:none; padding: 0 0 0 3.3rem; }

.rd-burger-menu li a,
.rd-burger-menu li button                         { padding: 0 0 1rem 0!important; width: 100%; display: flex; }



.rd-burger-menu .rd-icon                          { display:block; width:20px; position:relative; margin:0 0 0 auto; }
.rd-burger-menu .rd-icon:before {
  content:'';
  position:absolute;
  top:6px;
  left:5px;
  width:12px;
  height:12px;
  border-color:var(--color-black);
  border-width:1px 1px 0 0;
  border-style:solid;
  display:block;
  transform:rotate(45deg);
}
.rd-burger-menu .rd-menu li:last-of-type                 { border-bottom:0; }
.rd-burger-menu li.is-parent > a,
.rd-burger-menu li.is-parent > button,
.rd-burger-menu li a.active,
.rd-burger-menu li button.active,
.rd-burger-menu li a:hover,
.rd-burger-menu li button:hover                          { color:var(--color-black);  text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3.5px; text-decoration-color: var(--color-1)}
.rd-burger-menu li.is-parent > button .rd-icon::before,
.rd-burger-menu li button.active .rd-icon::before        { transform:rotate(135deg); top: 3px;}


@media (max-width:1400px) {
  .rd-burger-menu-wrapper .rd-container                  { max-width:390px; }
  .rd-burger-menu .rd-burger-menu-toggle.active + .rd-burger-menu-wrapper::before { border:0; }
}

@media (max-width:490px) {
  .rd-burger-menu-wrapper .rd-container                  { max-width:100%; margin: 3rem; }
  .rd-burger-menu-wrapper                                { right:inherit; left:0;top:90px; padding-top:1rem; border:0; width: 100%; min-width:auto; z-index: -1;}
}
