/*
--------------------------------------
Portfolio Header
--------------------------------------
*/


.portfolio-header {

    position:fixed;

    top:0;

    left:0;

    width:100%;

    z-index:1000;

    background:#fff;

    transition:
    height .35s ease;

}


/*
--------------------------------------
Header Innenbereich
--------------------------------------
*/


.portfolio-header-inner {

    height:210px;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    box-sizing:border-box;

    transition:
    height .35s ease,
    padding .35s ease;

}



/*
--------------------------------------
Logo
--------------------------------------
*/


.portfolio-logo {

    display:flex;

    flex-direction:column;

    align-items:center;

    text-align:center;

    transition:
    all .35s ease;

}



.portfolio-logo img {

    max-width:260px;

    height:auto;

    display:block;

    transition:
    all .35s ease;

}



.portfolio-logo a {

    text-decoration:none;

    color:#111;

    font-size:36px;

    font-weight:500;

    transition:
    all .35s ease;

}



/*
--------------------------------------
Untertitel
--------------------------------------
*/


.portfolio-subtitle {

    margin-top:12px;

    font-size:16px;

    letter-spacing:.08em;

    text-transform:uppercase;

    color:#555;

    transition:
    all .35s ease;

}



/*
--------------------------------------
Burger
--------------------------------------
*/


.portfolio-menu-toggle {

    margin-top:30px;

    width:36px;

    height:26px;

    border:0;

    background:none;

    padding:0;

    cursor:pointer;

    display:flex;

    flex-direction:column;

    justify-content:space-between;

}



.portfolio-menu-toggle span {

    display:block;

    width:100%;

    height:2px;

    background:#111;

}



/*
--------------------------------------
Navigation
--------------------------------------
*/


.portfolio-menu {

    display:none;

    width:100%;

    background:#fff;

    padding:30px;

    text-align:center;

}



.portfolio-header.menu-open .portfolio-menu {

    display:block;

}



/*
--------------------------------------
Scroll Zustand
--------------------------------------
*/


.portfolio-header.scrolled {

    height:70px;

}



.portfolio-header.scrolled .portfolio-header-inner {

    height:70px;

    flex-direction:row;

    justify-content:space-between;

    align-items:center;

    padding:0 30px;

}



.portfolio-header.scrolled .portfolio-logo {

    flex-direction:row;

    align-items:center;

    gap:12px;

}



.portfolio-header.scrolled .portfolio-logo img {

    max-width:80px;

}



.portfolio-header.scrolled .portfolio-logo a {

    font-size:22px;

}



.portfolio-header.scrolled .portfolio-subtitle {

    margin:0;

    font-size:11px;

}



.portfolio-header.scrolled .portfolio-menu-toggle {

    margin:0;

}



/*
--------------------------------------
WordPress Admin Bar
--------------------------------------
*/


body.admin-bar .portfolio-header {

    top:32px;

}



@media (max-width:782px) {


    body.admin-bar .portfolio-header {

        top:46px;

    }


}



/*
--------------------------------------
Platz für fixierten Header
--------------------------------------
*/


body {

    padding-top:210px;

}