html {
  scroll-behavior: smooth;
  scroll-padding-top: 80px; /* height of sticky header */
}


/*BETTER BLUR*/

#bg_picked_id
{
  transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  will-change: transform;
}


/*CSS @ WITHIN PAGE */

.menu-header-container {
  position: relative;

}


#main-menu_ul {
    padding-top: 0;
    height: 57px;
}



#main-menu_finteo_logo {
    /*transform: scale(0.75);*/
    width: 100px; 
    top: -3px;
    margin-top: 0;
    position: relative;
}

#main-menu_ul {
    background: #273655;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 2px 2px rgba(0, 0, 0, 0.12), 0 4px 4px rgba(0, 0, 0, 0.12), 0 8px 8px rgba(0, 0, 0, 0.12), 0 16px 16px rgba(0, 0, 0, 0.12);
    padding-bottom: 5px;
}



@media (min-width: 976px) {



  .sub-menu.top_of_page  {
    box-shadow: 0 0px 0px rgba(0, 0, 0, 0);
    background: transparent;
    margin-top: 17px;
  }
  
  .sub-menu {
    
    background: #273655;
    font-size: medium ;
    padding-right: 25px !important;

  }


  .sub-menu.top_of_page {
    background: transparent;
  }

#a_fur_investoren,
#a_fur_unternehmen {
    padding-bottom: 15px;
}
}



/*CSS @ TOP OF PAGE */




#main-menu_ul.top_of_page {
 /* padding-top: 30px; */
  height: 90px;
  box-shadow: 0 0px 0px rgba(0, 0, 0, 0);
  background: transparent;
}




#main-menu_finteo_logo.top_of_page  {
  transform: scale(0.9);
  top: -4px;
  margin-top: 0;
  position: relative;
}

#main-menu_ul.top_of_page  {
  background: transparent;
}

@media (min-width: 976px) {


  .fur-investoren.top_of_page ,
  .fur-unternehmen.top_of_page  {
    box-shadow: 0 0px 0px rgba(0, 0, 0, 0);
    background: transparent;
  /*  margin-top: 17px; */
  }
  


#a_fur_investoren.top_of_page ,
#a_fur_unternehmen.top_of_page {
  padding-bottom: 15px;
}
}


#main-menu_ul.top_of_page  {

  box-shadow: 0 0px 0px rgba(0, 0, 0, 0.12);

}



/* ANFANG APP menu bar */

.page-template-finteo-app-main #arcontactus {
  display: none;
}



.fusion-text-impressum {
  color: whitesmoke;
}

.finteologoapp {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50% !important;
}

#mainnavwrapper {
  display: none;
}

#myCheckBox {
  display: none;
}

.fusion-text>h4 {
  margin: 0 !important;
}


#hamburgerapp {

  visibility: hidden;
  position: fixed;
  top: 0; 
  right: 0px;
  z-index: 999999;
  position: fixed;
  overflow: hidden;
  height: fit-content;
  /* margin: 10px; */
  padding: 30px;
  color: whitesmoke;
  padding-bottom: 75px;
}

#myCheckbox {
  display: none;
}

/* DRAWER BUTTON STYLING #appnav */

#appnav {
  font-size: 1em;
  color: grey;
  position: fixed;
  z-index: 0;
  background: whitesmoke;
}

/* The side navigation menu */

.sidenav {
  height: 100%;
  /* 100% Full-height */
  width: 0;
  /* 0 width - change this with JavaScript */
  position: fixed;
  /* Stay in place */
  z-index: 99999;
  /* Stay on top */
  top: 0;
  right: 0;
  background-color: #111;
  /* Black*/
  overflow-x: hidden;
  /* Disable horizontal scroll */
  padding-top: 60px;
  /* Place content 60px from the top */
  transition: 0.1s;
  /* 0.5 second transition effect to slide in the sidenav */
}



/* The navigation menu links */

/*

@media (max-height: 1000px) {


  .sidenav a {
    padding: 2px 8px 8px 0px;
    text-decoration: none;
    font-size: 1em;
    color: whitesmoke;
    display: block;
    transition: 0.8s;

    position: relative;
  }


}


@media (min-height: 1000px) { 


  .sidenav a {
    padding: 8px 8px 8px 0px;
    text-decoration: none;
    font-size: 1em;
    color: whitesmoke;
    display: block;
    transition: 0.8s;
    position: relative;
  }
  

}

*/

/* When you mouse over the navigation links, change their color */

.sidenav a:hover {
  color: #f1f1f1;
}

/* Position and style the close button (top left corner) */

.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */

#mainnavwrapper {
  transition: margin-left .5s;
  padding: 0px;
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */

@media screen and (max-height: 450px) {
  .sidenav {
    padding-top: 15px;
  }
  .sidenav a {
    font-size: 18px;
  }
}

/* Anchor offset with class="app-nav" */

a.app-nav {
  display: block;
  position: relative;
  top: -135px;
  visibility: hidden;
}

/* ENDE APP menu bar */




/* finteo MENU CSS */


.finteo-menu_wrapper {

  width: 100%;
  height: 90px;
  position: fixed;
  top: 0;
  z-index: 999999;
  }
  
  
  .finteo-menu_wrapper:hover {
  
  width: 100%;
  height: 90px;
  position: fixed;
  top: 0;
  z-index: 999999;
  }
  
  



#finteo-menu_wrapper {
  -webkit-transform: translate3d(0,0,0);
  display: none; 

}

    
.fur-investoren , .fur-unternehmen {
    
  -webkit-animation: slide 0.5s forwards;
  -webkit-animation-delay: 2s;
  animation: slide 0.5s forwards;
  animation-delay: 2s;

}

  
#main-menu_finteo_logo {

transition: transform 2s ease;
width: 120px;
}




.main-menu {
    
  display: flex;
  flex-wrap: nowrap;
  align-items: center;

  /*transition-timing-function: ease-in-out;
  transition: height 2s , background-color 2s; */
  justify-content: center;
  gap: 5px;

  
  height: 90px;
  padding-top: 30px;
  background: transparent;
  box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px;
  --awb-padding-right: var(--container_padding_100_right, var(--hundredp_padding));
  --awb-padding-bottom: var(--container_padding_100_bottom, 0px);
  --awb-padding-left: var(--container_padding_100_left, var(--hundredp_padding));
  margin-left: var(--hundredp_padding-hundred_percent_negative_margin);
  margin-right: var(--hundredp_padding-hundred_percent_negative_margin);
  }

  #finteo-menu_wrapper ul {
    
    list-style: none;
    margin-top: 0;
    padding-left: 0;
    padding-right: 0;  
  }

  @media (max-width: 1200px) {


    .main-menu, #finteo-menu_wrapper ul:not(.sub-menu) {
  
      gap: 0px;
      padding-right: 30px;
      padding-left: 30px;
  
    }
  
  }
    
  

    /*IND MENU ITEMS*/
    #finteo-menu_wrapper li { 
    color: white; 
    display: block;
    float: left;
    padding-left: 15px;
    padding-right: 15px;

    position: relative;
    text-decoration: none;
   /* transition-duration: 0.5s; */
  
    opacity: 0.9; 
    text-align: center; 
    
  }


  #finteo-menu_wrapper ul li ul {
    visibility: hidden;
    min-width: 5rem;
    position: absolute;
   /* transition: all 0.5s ease; */
    margin-top: 0rem;
    left: 0;
    display: none;
  }
  
  #finteo-menu_wrapper a {
  
   /* transition: all 0.5s ease; */
   
  }



     
  #finteo-menu_wrapper ul li ul:hover {
    
  
      visibility: hidden;
      min-width: 5rem;
      position: absolute;
      /* transition: all 0.5s ease; */
      margin-top: 0rem;
      left: 0;
      display: none;
    }

    #finteo-menu_wrapper ul li ul li {
      clear: both;
      width: 100%;
      font-size: 15px;
          padding-right: 15px;
    padding-left: 15px;
    padding-bottom: 5px;
        text-align: left;
 /*       transition: all 0.5s ease; */
    }
    
    #main-menu_ul {
      /*color: whitesmoke; */
      transition: height 2s , padding 2s , background-color 2s; 
      
    
    }






#divider {color: white}
#divider:hover {color: white !important}





  /*SWITCH DESKTOP AND MOBILE MENU */




/*vertical CSS*/

@media (max-height: 500px)

{
    #mySidenavcontent {    
      transform: scale(0.65);
      margin-top: -250px
    }

}

@media (min-height: 500px) AND (max-height: 750px)

{
    #mySidenavcontent {    
      transform: scale(0.8);
      margin-top: -150px
    }

}

@media (min-height: 750px)

{
    #mySidenavcontent {    
      transform: scale(1);
      margin-top: 0px
    }

}

@media (min-width: 976px)

{
    .finteo-menu_wrapper {display: block ; }

}

/*OPTIMIZE FOR LARGE TOUCH DEVICES*/

@media (hover: none) {

  #finteo-menu_wrapper ul li ul li {

    font-size: 18px !important;

  }

}


@media (max-width: 976px) {

  .sub-menu {

    font-size: medium ;

  }


  #mySidenavcontent > nav > ul {

    list-style-type: none;
    text-align: center !important;
    padding: 0;

  }


  #ul_fur_investoren {

    padding: 0; 

  }

  #ul_fur_investoren, #ul_fur_unternehmen {
    font-size: large;
    padding: 0;
  }

  .finteo-menu_wrapper {display: none !important; }


  

  .main-menu_finteo_logo {

    transform: scale(1.2);

  }
  .menu_item_a.heading, .heading {

    font-size: x-large !important; 
    color: white; 

  }

  .heading:hover {

    font-size: x-large !important; 
    color: white; 

  }


  .fur-investoren {    
    padding: 0;
    color: white; }
  .fur-unternehmen {    
    padding: 0;
    color: white; }

    .fur-investoren:hover {    
      padding: 0;
      color: white; }
    .fur-unternehmen:hover {    
      padding: 0;
      color: white; }

  .avada-page-titlebar-wrapper {display: none !important}; 

  #a_projekte,  #a_fur_investoren, #a_fur_unternehmen, #a_blog, #menu-text-kontakt, #menu-text-impressum {

    font-size: 1.5em; 

  }

  #mySidenav {
    width: 180px;
    height: 180px;
    overflow: hidden;
    background: linear-gradient(45deg, rgba(39, 54, 85, 0) 50%, rgba(39, 54, 85, 1));
    white-space: nowrap;

   /* border-radius: 50% 0% 0px; */
  }



    nav {   
      padding: 0;
      text-align: -webkit-center;
    }

    .fur-investoren.top_of_page ,
    .fur-unternehmen.top_of_page  {
      box-shadow: 0 0px 0px rgba(0, 0, 0, 0);
      background: transparent;
    /*  margin-top: -10px; */
    }
    
    

    #li_fur_unternehmen, #li_fur_investoren, #li_blog {

     
      padding-left: 0;

    }

    #mySidenavcontent > nav > ul {padding: 0;
    /*  font-weight: 500; */
    }; 


}


/*TALL SCREEN MENU FIX */
@media (max-height: 800px) {
  #mySidenav {
    width: 180px;
    height: 180px;
    overflow: hidden;
    background: linear-gradient(45deg, rgba(39, 54, 85, 0) 50%, rgba(39, 54, 85, 1));
    white-space: nowrap;

    padding-top: 35%;
   /* border-radius: 50% 0% 0px; */
  }

}

/*TALL SCREEN MENU FIX */
@media (min-height: 800px) {
  #mySidenav {
    width: 180px;
    height: 180px;
    overflow: hidden;
    background: linear-gradient(45deg, rgba(39, 54, 85, 0) 50%, rgba(39, 54, 85, 1));
    white-space: nowrap;

    padding-top: 15%;
   /* border-radius: 50% 0% 0px; */
  }

}



@media (min-width: 976px) and (max-width: 1200px) 
{
#main-menu_ul {

  padding-left: 35px;
  padding-right: 35px;
}


}

/*@media (max-width: 976px) and (hover: none)*/
@media (max-width: 976px)

/*MOBILE ONLY NAV STYLE NO HOVER DEVICES*/

{

  ul ul {
    list-style-type: none;
    padding-left: 0;
}

}

    /*
    #main-menu_ul:hover {
        background:  #273655; 
    }
    */
    
    a#a_fur_investoren:hover , a#a_fur_unternehmen:hover, a#a_projekte:hover , a#a_blog:hover , #ul_fur_unternehmen > li > a:hover ,  #ul_fur_investoren > li > a:hover , .menu_item:hover , #finteo-menu_wrapper li:hover {
    
        color: #4d648d;
    
    }
    

    
    .dropdown {
    
        box-shadow: 0 1px 1px rgba(0,0,0,0.12), 
                    0 2px 2px rgba(0,0,0,0.12), 
                    0 4px 4px rgba(0,0,0,0.12), 
                    0 8px 8px rgba(0,0,0,0.12),
                    0 16px 16px rgba(0,0,0,0.12);
    
                    padding: 0;
    }
    
    
    

    
    #finteo-menu_wrapper a {
      text-decoration: none;
    }
    
    #finteo-menu_wrapper nav {
      font-family: Palanquin;
    }
    


    
    #finteo-menu_wrapper li:hover,
    #finteo-menu_wrapper li:focus-within, 
    #ul_fur_investoren > li:nth-child(1) > a:hover ,      
    #ul_fur_unternehmen > li:nth-child(1) > a:hover ,
    #ul_fur_investoren > li:nth-child(1) > a:focus-within ,      
    #ul_fur_unternehmen > li:nth-child(1) > a:focus-within 
    
    {
      cursor: pointer;
    }

    #finteo-menu_wrapper li:focus-within a {
      outline: none;
    }
    
    
    #finteo-menu_wrapper ul li:hover > ul,
    #finteo-menu_wrapper ul li:focus-within > ul,
    #finteo-menu_wrapper ul li ul:hover,
    #finteo-menu_wrapper ul li ul:focus {
      visibility: visible;
      opacity: 1;
      display: block
    }
    


ul ul {
    list-style-type: none;
}


/* SIDE MENU CSS */

.fusion-scroll-section-nav {
	background-color: #273655 !important;
}

a.fusion-scroll-section-link:before {
	background-color: #273655 !important;
}

.menu-item , .menu-item > a, .menu-item:hover, .menu-item > a:hover {
color: white !important;
padding-top: 10px; 
}

/* unvisited link */
.main-menu a:link {
  color: white ;
}

/* visited link */
.main-menu a:visited {
  color:  white  ;
}

/* mouse over link */
.main-menu a:hover,  .menu-item:hover, .menu-item > a:hover {
  color: #4d648d !important;
}

/* selected link */
.main-menu a:active {
  color:  white  ;
}


.menu_item_a, .login_register_account , .logout  {
  color:  white  ;
}

.menu_item_a:hover, .login_register_account:hover , .logout:hover {
  color:  #4d648d !important;
}

