/*Logo*/
header .ce_image .image_container img                   { width: 100%; height: auto; }
header  #isSticky .ce_image .image_container img        { width: 190px; }


/* Stick Header */
header #noSticky                                        { position: relative; z-index: 7000; width: 100%; padding: 40px 0 40px 0; box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.15); }
header #isSticky                                        { position: fixed; right: 0; top: 0; z-index: 80000; transition: top .25s cubic-bezier(.25,.1,.25,1), opacity .25s cubic-bezier(.25,.1,.25,1);
		                                                  width: 100%; opacity: 0; background: #fff; padding: 25px 0; box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.15); display: block; }

/* Anordnung der Navigation und Top Icons */
header 	#noSticky .navigation_wrapper                   { display: flex; justify-content: flex-end; align-items: end; flex-direction: column; height: 100%;  }
header 	#isSticky .navigation_wrapper                   { display: flex; justify-content: flex-end; align-items: flex-end; height: 100%;  }
header 	#isSticky .navigation_wrapper .mod_navigation   { order: 1; }
header 	#isSticky .navigation_wrapper .header_top_icons { order: 2; margin-left: 10px; margin-top: 10px; }


/* Top Icons */
.mail-icon .color,
.phone-icon .color,
.search-icon .color,
.mobileMenuOpen svg                                     { fill: var(--icons_header); }

header .header_top_icons                                { display: flex; margin-bottom: 30px; }
header #isSticky .header_top_icons                      { margin-bottom: 10px; }
header .header_top_icons div                            { margin-left: 25px; }
header .header_top_icons .mail-icon svg                 { width: 25px; }
header .header_top_icons .search-icon svg               { width: 19px; }


/* Mobile Menu */
.mobileMenuOpen                                         { text-align: right; display: none; }
#close_menu                                             { position: absolute; top: 15px; right: 15px; width: 17px; height: auto; z-index: 10; cursor: pointer; }
.mod_mmenu                                              { position: fixed !important; }

/*Logo*/

.menuOpen 											{ display: none; justify-content: end; position: fixed; z-index: 99999; }
.menuOpenIcon 										{ width: 40px; height: 25px; position: relative; z-index: 150; transform: rotate(0deg); top: -8px; right: 15px;
                                                      transition: .5s ease; cursor: pointer;   }
.menuOpenIcon span 									{ display: block; position: absolute; height: 2px; width: 100%; background: var(--farbe1); border-radius: 0; opacity: 1; left: 0; 
												 	  transform: rotate(0deg); transition: .25s ease-in-out; }
.menuOpenIcon span:nth-child(1) 					{ top: 0px;  } 
.menuOpenIcon span:nth-child(2) 					{ top: 8px; }
.menuOpenIcon span:nth-child(3) 					{ top: 8px; }
.menuOpenIcon span:nth-child(4) 					{ top: 16px; }
.menuOpenIcon.open span:nth-child(1) 				{ top: 18px; width: 0%; left: 50%; }
.menuOpenIcon.open span:nth-child(2) 				{ transform: rotate(45deg); z-index: 10; display: block; }
body.menu_opened  .menuOpenIcon.open span:nth-child(2) {  }
.menuOpenIcon.open span:nth-child(3) 				{ transform: rotate(-45deg); }
.menuOpenIcon.open span:nth-child(4) 				{ top: 18px; width: 0%; left: 50%; }
.menuOpen.invert .menuOpenIcon span:nth-child(1) 	{ top: 0px;  } 
.menuOpen.invert .menuOpenIcon span:nth-child(2) 	{ top: 6px; }
.menuOpen.invert .menuOpenIcon span:nth-child(3) 	{ top: 6px; } 
.menuOpen.invert .menuOpenIcon span:nth-child(4) 	{ top: 12px; }

/* Navigation */

header .mod_navigation                                  {  }

header .mod_navigation                                  { font-weight: 600; }
.superfish 												{ position:relative; z-index:70000; text-transform: uppercase; }

.nav_superfish											{ margin: 0; padding: 0; list-style: none; transition: margin ease .3s; font-size: 0.9rem; }
.nav_superfish li 										{ position: relative; display: inline-block; list-style: none; white-space: nowrap; }
.nav_superfish li a,
.nav_superfish li strong                                { display: inline-block; position: relative; text-decoration: none; zoom: 1; padding: 0 0 0 0; margin: 0 10px 0 10px;
														  transition: all ease .4s; border-bottom: 3px solid #fff; color: var(--farbe1); }
.nav_superfish li a:hover                               { color: var(--farbe1); }

.nav_superfish li.first a,
.nav_superfish li.first strong                          { margin-left: 0; }
.nav_superfish li.last a,
.nav_superfish li.last strong                           { margin-right: 0; }

.nav_superfish li a.trail                               { font-weight: bold; }
.nav_superfish li strong,
.nav_superfish li a.trail                               { color: var(--farbe1); border-bottom: 3px solid var(--farbe1); }

.nav_superfish li:hover a,
.nav_superfish li a.active 								{ transition: all ease .4s; }

/*Level 2*/
.nav_superfish ul 										{ position: absolute; display: none; top: calc(100% - 3px); left: 10px; z-index: 99999; padding: 0; 
														  text-align: left; text-transform: none; background: #fff; -webkit-box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.15); 
                                                          box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.15); border-top: 3px solid var(--farbe1); font-size: 0.9rem; }
.nav_superfish ul li 									{ display: block; padding: 0; }

.nav_superfish ul li a,
.nav_superfish ul li strong                             { border-bottom: 1px solid var(--text_farbe); padding: 10px 45px 10px 25px; margin: 0; background: #fff; display: block; }
.nav_superfish ul li a:hover,
.nav_superfish ul li strong                             { background: var(--submenu); color: #fff; }

/* mobile Navigation */
header .navigation_mobile                                   { position: absolute; width: 100%; z-index: 2; display: none; }
body.stixxed header .navigation_mobile                      { position: fixed; top: 104px; background: #fff; width: 100%; z-index: 10; }
header .navigation_mobile .mod_navigation                   {  }
header .navigation_mobile .mod_navigation ul                { display: block; background: #fff; text-align: center; padding: 25px 0 15px 0; }
header .navigation_mobile .mod_navigation ul li             { display: block; margin-bottom: 10px; }


/* Icons rechts */
.icons_right                                                { position: fixed; z-index: 9999; top: 300px; right: 0; font-family: 'Nunito Sans'; }
.icons_right .icon_inner                                    { display: flex; flex-direction: column; } 
.icons_right .icon                                          { background: var(--farbe1); width: 51px; height: 51px; display: flex; justify-content: center; align-items: center;
                                                              border-bottom: 1px solid #fff; position: relative;  }
.icons_right .icon.tel                                      { border-bottom: 0; }
.icons_right .icon:hover                                    { background: var(--farbe2); }

.icons_right .icon.grau                                     { background: var(--farbe2); }
.icons_right .icon.grau:hover                               { background: var(--farbe2); }
.icons_right svg                                            { width: 30px; height: auto; }
.icons_right svg path                                       { fill: #fff; }

.icons_right .icon.menu                                     { display: none; }
.icons_right .icon.menu svg                                 { width: 31px; }
.icons_right .icon.menu.desktop.active                      { display: flex; }
.icons_right .icon.menu.mobile.active                       { display: flex; }

.icons_right a:hover                                        { color: #fff; }


/*#####################################################################################################################/
  RESPONSIVE STYLES ###################################################################################################/
######################################################################################################################*/

@media (min-width: 992px) and  (max-width: 1400px) {
    .nav_superfish ul 									{ left: auto; right: 0; }
}


@media (min-width: 1200px) {

}

@media (max-width: 992px) {
    
    .icons_right                                       { position: absolute; z-index: 2; top: 250px; }
    
    main                                               { margin-top: 125px; }
    header .col-lg-18,
    header .navigation_wrapper .header_top_icons,
    header .navigation_wrapper                         { text-align: right;  }
    header .navigation_wrapper                         { width: 100%; }
    header .header_top_icons                           { width: 100%; justify-content: flex-end; }
    
    header 	#noSticky .navigation_wrapper              { padding-bottom: 0; }
    header 	#noSticky .row                             { align-items: center; justify-content: flex-end; }
    header .header_top_icons                           { margin-bottom: 0; }
    header 	#isSticky                                  {  }
    header #noSticky                                   { padding: 30px 0 30px 0; }
    header .mod_navigation                             { display: none; }
    .mobileMenuOpen                                    { display: block; }
    
.menuOpen 											{ display: block; }
    header .navigation_mobile                           { display: block; }
    header .ce_image .image_container img              { width: 120px; margin-left: 10px; }
    header #noSticky                                   { position: fixed; width: 100%; background: #fff; }
    header #isSticky                                   { display: none !important; }
    body header .navigation_mobile                     { position: fixed; top: 104px; background: #fff; width: 100%; z-index: 10; }
}



@media (min-width: 992px) and  (max-width: 1200px) {
}

@media (min-width: 768px) and  (max-width: 992px) {
}

@media (max-width: 767px) {
}