.row{
    display: flex;
    justify-content: space-between;
    align-items: center;
}


/*Main-menü*/

#header{
    background-color: #fff;
    display: flex;
    justify-content: space-between;
    padding: 0.8em 0;
    align-items:center;
}

#main-menu ul, .portfolio-menu ul{
    display: flex;
    justify-content: space-between;
    margin-bottom: 0;
    align-items: center;
}


#main-menu li, .portfolio-menu li{
    margin:0 1em;
    display: inline-block;
}

#main-menu li:last-of-type, .portfolio-menu li:last-of-type {
    margin-right:0;  
}

#main-menu li>a {
    color: #2A2D2C;
    text-transform: uppercase;
    font-size: 18px;    
}

/*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 li {
    display: block;
    width: 180%;
    padding: 1rem 0.5rem;
    background-color: #fff;
    border-bottom: solid 2px #88A112;
    margin: 0;
}

#main-menu .sub-menu li:last-of-type{
border-bottom: none;
}

#main-menu .sub-menu li a {
    text-transform:unset;
}


/*Top-menu*/
#top-menu{
    color: #2A2D2C;
    background-color:#ACB75F;
    color: #fff;
  
    padding: 0.8em 0;
}

#top-menu a{
    color:#fff;
}

#logo{
    max-width: 250px;
}

.mail-icon, .phone-icon{
    height: 1.5rem;
    width: auto;
    margin-right: 10px;  
}


#top-menu-in-opened-hamburger{
    display: none;
 
}

#top-menu-in-opened-hamburger .row{
    justify-content:initial;
}

#top-menu-in-opened-hamburger>div{
    margin-bottom: 20px;
}

#top-menu-in-opened-hamburger>div:last-of-type{
    margin-bottom: 0px;
}


/*Portfolio-menu*/
.portfolio-menu{
    margin-bottom: 60px;
}

.portfolio-menu ul>li:before{
    display: none;
}

.portfolio-menu ul{
    justify-content: center;
    
}

.portfolio-menu li{
    border-bottom: solid 4px #F3D003;
    padding: 10px 4%;
    margin: 0;
}
.portfolio-menu li>a{
    color: #2A2D2C;
    text-transform: uppercase;
    font-family:"Poppins", sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 1.25rem;
    
}

.portfolio-menu .current-menu-item{
    border-top-left-radius: 10%;
    border-top-right-radius: 10%;
    border-bottom: none;
    border-top: solid 4px #F3D003;
    border-left: solid 4px #F3D003;
    border-right: solid 4px #F3D003;
}

#portfolio-menu-bottom{
    margin-top: 2rem;
}


/*Footer*/

footer, #copyright{
    color: #fff;
    padding: 1rem 0;
}

footer{
    background-color: #ACB75F;
}

#copyright{
    text-align: center;
    background-color: #88A112;
}

footer .row>*{
    width: 25%;
}

footer h2, footer h3, footer nav ul>li{
    font-family:"Poppins", sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 1rem;
    text-transform: uppercase;
}

footer h2{
    margin-bottom: 1rem;
    margin-top: 0;
}

footer h3{
    text-transform:none;
}


footer a{
    text-decoration: none;
    color:#fff;
}

footer a:hover{
    color:#2A2D2C;
}

footer .row{
    align-items: flex-start;
}

#copyright-text{
    margin: 0;
}

#footer-services div,
#foot-menu li{
    margin-bottom: 0.5rem;
}

main#portfolio-taxonomy + footer{
    margin-top: 40px;
}

/* Töréspontok */
@media only screen and (min-width: 1025px) {

    #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*/
        padding-top: 10px;
        transition: opacity 0.7s ease, max-height 0.7s ease, visibility 0.7s ease;
    
   
    }
}

@media only screen and (max-width: 1060px) {
    #header>.row{
        flex-direction: column;
    }

    #main-menu{
        margin-top: 2rem;
    }

    .portfolio-menu li{
        padding:0.5em 2%;
    }

}

@media only screen and (min-width: 769px){
    #main-menu-content{
        display: block!important ;
    }
}

@media only screen and (max-width: 768px){
 
    /*Menü*/

    #top-menu{
        display: none;
    }
  

    #header>.row{
        flex-direction: row;
    }

    #logo{
        max-width: 200px;
    }   

    #main-menu{
        margin-top: 0;
    }

    #main-menu-content{
        display: none;
        background-color: #ACB75F;
        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: #fff;
        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: 500px;
        opacity: 1;
        position: relative;
        top: 20px;
    }

    #main-menu .sub-menu li {
        display: block;
        width: 100%;
        padding: 1rem 0.5rem 1rem 1.5rem;
       background-color: #ACB75F;
        border-bottom: solid 2px #fff;
      
    }


    .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/caret-down-solid.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/bars-solid.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-solid.svg);
        background-repeat: no-repeat;
        background-position: center center;
        display: inline-block;
        position: absolute;
        top: 20px;
        right: 45%; 
        z-index: 9;
    }

    .portfolio-menu li>a{
        
        font-size: 1rem;
        
    }

    .portfolio-menu ul{
        flex-wrap:wrap;
        align-items:center;
    }
    

    .portfolio-menu li>a{
        font-size: 1rem;
    }

    #top-menu-in-opened-hamburger{
        display: block;
    }

    #top-menu-in-opened-hamburger a{
        color: #fff;
    }

    footer .row{
        flex-direction: column;
    }
    
    footer .row>*{
        width: 100%!important;
        margin-bottom: 1rem;
    }

    footer ol,
    footer ul{
        margin-bottom: 0;
    }

    footer h2{
       
        margin-top: 1rem;
    }

    #foot-menu{
        margin-top: 1rem;
    }


    
}

@media only screen and (max-width: 552px) {
    #main-menu-content{
        width: 100%;
    }

    .hamburger-open:after {
        right: 5%;
    }

    .portfolio-menu .current-menu-item{
        border: none;
    }

    .portfolio-menu li{
        padding: 0.25em 4%;
        border: none;
    }
    .portfolio-menu .current-menu-item{
        border: #F3D003 4px solid;
        border-radius: 15%;
    }

    #main-menu-content{
        width: 100%;
    }

    .hamburger-open:after {
        right: 5%;
    }

    footer h2{
        font-size: 1.4rem;
    }


}
