/*Main-menü*/

#header{
    background-color: #fff;
    display: flex;
    justify-content: space-between;
    padding: 0.8em 0;
    align-items:center;
    border-bottom: 0.75rem solid #91C7B0;
}

#header .content-box{
    display: flex;
    flex-direction: row;
    align-items: center;
}

#main-menu ul{
    display: flex;
    justify-content: space-between;
    margin-bottom: 0;
    align-items: center;
}


#main-menu li{
    margin:0 1em;
    display: inline-block;
}

#main-menu li:last-of-type{
    margin-right:0;  
}

#main-menu li>a {
    color: #004f77;
    text-transform: uppercase;
    font-size: 1rem;
    position: relative;
    font-weight: 400;    
}

#main-menu li>a:after{
    content: '';
    position: absolute;
    width: 100%;
    height: 3px; 
    bottom: -10px;
    left: 0;
    z-index: 12;
    background-color: #ffb757;
    
    /* Az animáció előkészítése: balra toljuk és eltüntetjük */
    transform: scaleX(0);
    transform-origin: bottom left;
    transition: transform 0.3s ease-out;
}



#main-menu .current-menu-item > a::after,
#main-menu .current-menu-ancestor > a::after,
#main-menu li:hover > a::after,
#main-menu li.menu-item-has-children:hover>.sub-menu:hover{
    transform: scaleX(1);
}


/*Almenü formázása*/
.menu-item-has-children{
    position: relative;
}


.submenu-open {
    background-size: 100% 150% !important;
}


#main-menu .sub-menu {
    opacity: 0;
    background-color: #fff;
    position: absolute;
    display: block;
    overflow:visible;
    z-index: 10;
    top: 30px;
    text-align: left;
    transition: opacity 0.7s ease, max-height 0.7s ease, visibility 0.7s ease;
}

#main-menu .sub-menu .sub-menu {
    top: 60px;
    left: 100%;
}

#main-menu .sub-menu li {
    display: block;
    width: 180%;
    padding: 1rem 0.5rem;
    background-color: #fff;
    margin: 0;
}

#main-menu .sub-menu li:last-of-type{
border-bottom: none;
}

#main-menu .sub-menu li a {
    text-transform:unset;
}



#logo{
    max-width: 200px;
}

.mail-icon, .phone-icon{
    height: 1.5rem;
    width: auto;
    margin-right: 10px;  
}



/*Portfolio-menu*/


/*Footer*/

footer{
    background-color: #0F4060;
    color: #fff;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 1rem;
}

#footer-menus, #copyright{
    font-size: 16px; 
}

#footer-menus{
    text-align: right;
}

#foot-menu ul{
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}

#foot-menu li{
    margin-bottom: 0.5rem;
    padding-left: 1rem;
}

#copyright{
    text-align: center;
    border-top: 1px #fff solid;
}

footer .row>*{
    width: 50%;
    align-items: flex-start;
}

#footer-main,
#copyright{
    padding: 1rem 0;
}


footer a{
    text-decoration: none;
    color:#fff;
}

footer a:hover{
    color:#ffb757;
}


footer #social-icons{
    justify-content: flex-end;

}

footer #social-icons > div{
    width: auto;
    margin-left: 2rem;
    margin-bottom: 1rem;

}




/* Töréspontok */



@media only screen and (min-width: 1050px) {

    #main-menu li.menu-item-has-children> .sub-menu{
        max-height: 0px;
        opacity: 0;
        visibility: hidden;/*ez kell, hogy csak akkor jelenlen meg, amikor a menü elemre megyek, a sub-menu helyén ne*/
       
    
  
    }

    #main-menu li.menu-item-has-children:hover > .sub-menu {
        max-height: 500px;
        opacity: 1;
        top: 30px;
        display: block;
        visibility: visible;/*ettől látszik*/
        transition: opacity 0.7s ease, max-height 0.7s ease, visibility 0.7s ease;
    
   
    }

    #main-menu .sub-menu li.menu-item-has-children:hover > .sub-menu {
        top: 62px;
    }
}

@media only screen and (max-width: 1270px) {
    #header>.row{
        flex-direction: column;
    }

    #main-menu{
        margin-top: 2rem;
    }

    #foot-menu ul{
        flex-direction: column;
    }

    #main-menu li.menu-item-has-children:hover > .sub-menu {
      
        top: 30px;
       
    
   
    }


}

@media only screen and (min-width: 945px){
    #main-menu-content{
        display: block!important ;
    }
}

@media only screen and (max-width: 944px){
 
    /*Menü*/

    

    #header>.row{
        flex-direction: row;
    }

    #logo{
        max-width: 150px;
    }   

    #main-menu{
        margin-top: 0;
    }

    #main-menu-content{
        display: none;
        background-color: #fff;
        color:#004f77;
        position: absolute;
        top: 0;
        left:0;
        width: 60%;
        z-index: 8;
        padding: 20px;
    }

    #main-menu ul{
        flex-direction: column;
        align-items: stretch;
    }

    #main-menu li{
        margin: 0 0 20px 0 ;
        display: block;  
    }
  
    #main-menu li>a {
        color:#004f77;
        font-size: 1rem;
    }

    #header{
        position: relative;
    }

    #main-menu .menu-item-has-children > .sub-menu{
        
        max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.7s ease, opacity 0.7s ease;
    }

   #main-menu .sub-menu.submenu-open {
        max-height: 1500px;
        opacity: 1;
        position: relative;
        top: 20px;
    }

    #main-menu .sub-menu li {
        display: block;
        width: 100%;
        padding-left:1.5rem;
    }


    .open-sub {
        display: inline-block;
        cursor: pointer;
    }

    .open-sub:before,
    .close-sub:before{
        content: "";
        position: absolute;
       
        width:30px;
        height:30px;
        
      
        top: 0px;
        right: 60px;
        display: inline-block;
    }

    .open-sub:before{
        background: url(../img/angle-down.svg);  
        background-repeat: no-repeat;
        background-position: center center;
        background-size: contain;
    }

    .close-sub:before{
        transform:rotate(180deg);
    }


    .hamburger {
        
        display: inline-block;
        cursor: pointer;
        text-align: right;
    }
    
    .hamburger:after {
        content: "";
        height: 30px;
        width: 30px;
        background-image: url(../img/hamburger.svg);
        background-repeat: no-repeat;
        background-position: center center;
        display: inline-block;
        transition: all 0.7s ease-in-out;
        z-index: 9;
    }
    
    .hamburger-open:after {
        content: "";
        height: 30px;
        width: 30px;
        transition: all 0.7s ease-in-out;
        background-image: url(../img/x.svg);
        background-repeat: no-repeat;
        background-position: center center;
        display: inline-block;
        position: absolute;
        top: 20px;
        right: 45%; 
        z-index: 9;
    }



    footer .row{
        flex-direction: column;
    }
    
    footer .row>*{
        width: 100%!important;
        margin-bottom: 1rem;
    }

    footer ol,
    footer ul{
        margin-bottom: 0;
        
    }

   #foot-menu li{
        padding-left: 0;
    }

    #footer-menus{
        text-align: left;
    }
  
    #foot-menu{
        margin-top: 1rem;
    }

    footer #social-icons{
        flex-direction: row;
        justify-content: flex-start;
    }

    footer #social-icons>div{
       
        margin-left: 0;
        margin-right: 2rem;
        width:auto!important;
    }


    
}

@media only screen and (max-width: 552px) {
    #main-menu-content{
        width: 100%;
    }

    .hamburger-open:after {
        right: 5%;
    }

   

    #main-menu-content{
        width: 100%;
    }

    .hamburger-open:after {
        right: 5%;
    }

    footer h2{
        font-size: 1.4rem;
    }


}