@media only screen and ( max-width: 800px )
{
    body 
    {
        --frw-font-size-smaller: 19px;
        --frw-font-size-small: 27px;
        --frw-font-size-medium: 31px;
        --frw-font-size-large: 33px;
        --frw-font-size-larger: 35px;
        
    }

    /* Menü Icon */

    label.menuIcon 
    { 
        z-index: 100;
        display: block;
        background: transparent; 
        width: 75px; height: 50px; 
        position: relative; 
        margin-left: auto; margin-right: auto;
        border-radius: 4px; 
    }

    input#menuIcon {display:none}

    .navigationIconLine 
    { 
        position: absolute; 
        height: 4px; width: 55px; 
        background: #424242; 
        border-radius: 2px;
        display: block; 
        transition: 0.5s; 
        transform-origin: center; 
    }

    .navigationIconLine:nth-child(1) { top: 12px; }
    .navigationIconLine:nth-child(2) { top: 24px; }
    .navigationIconLine:nth-child(3) { top: 36px; }

    #menuIcon:checked + .menuIcon .navigationIconLine:nth-child(1){
        transform: translateY(12px) rotate(-45deg);
    }

    #menuIcon:checked + .menuIcon .navigationIconLine:nth-child(2){
        opacity:0;
    }

    #menuIcon:checked + .menuIcon .navigationIconLine:nth-child(3){
        transform: translateY(-12px) rotate(45deg);
    }

    .navigationIconBox{
        z-index: 10000;
        position: fixed;
        top: 35px;
        right: 35px;
        display: unset;
    }

    .navigationIconLabel
    {
        height: 55px;
        width: 55px;
        display: block;
        position: relative;
    }

    mobilenavigation
    {
        
    }

    mobilenavigation > mobilenavigationframe
    {
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
        overflow-y: auto;
        background: var(--frw-accent-lightes-color);
        z-index: 9999;
        position: fixed;
        display: grid;
        justify-items: center;
        align-items: start;
    }

    mobilenavigation > mobilenavigationframe > naventry 
    {
        display: flex;
        width: 95%;
        height: 75px;
        border-top: 2px solid var(--frw-accent-darkest-transparent-color);
        color: var(--clr-white);
        justify-content: space-between;
        align-items: flex-end;
    }

    mobilenavigation > mobilenavigationframe > naventry.header
    {
        height: 100px;
    }

    mobilenavigation > mobilenavigationframe > naventry.header > a.home > imgbox > span
    {
        text-align: left;
    }



    mobilenavigation > mobilenavigationframe > naventry > a.home
    {
        
    }

    mobilenavigation > mobilenavigationframe > naventry > a.home > imgbox
    {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    mobilenavigation > mobilenavigationframe > naventry > a.home > imgbox > img
    {
        width: 125px;
        height: 125px;
    }

    mobilenavigation > mobilenavigationframe > naventry > a.home > imgbox > span
    {
        font-size: var(--frw-font-size-larger);
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        justify-content: flex-start;
    }

    mobilenavigation > mobilenavigationframe > naventry > h2
    {
        text-decoration: underline;
        font-size: var(--frw-font-size-large);
        margin-block-end: 0px;
        height: inherit;
        display: grid;
        align-items: center;
    }

    mobilenavigation > mobilenavigationframe > naventry > phones
    {
        color: var(--clr-white);
        position: relative;
        top: 15px;
    }

    mobilenavigation > mobilenavigationframe > naventry > phones > a:first-child
    {
        margin-bottom: 15px;
    }

    mobilenavigation > mobilenavigationframe > naventry > phones > a , mobilenavigation > mobilenavigationframe > naventry > a
    {
        height: inherit;
        font-size: var(--frw-font-size-medium);
        display: grid;
        align-items: center;
        text-align: right;
        color: var(--clr-white);
    }

    mobilenavigation > mobilenavigationframe > mobileurlbox
    {
        width: 100%;
        display: grid;
        justify-items: center;
        align-items: center;
    }

    mobilenavigation > mobilenavigationframe > mobileurlbox > ul
    {
        width: 90%;
        display: grid;
        justify-items: start;
        align-items: center;
        list-style: none;
    }

    mobilenavigation > mobilenavigationframe > mobileurlbox > ul > li
    {
        width: inherit;
        height: 50px;
        border-bottom: 1px solid var(--frw-accent-light-color);
    }

    mobilenavigation > mobilenavigationframe > mobileurlbox > ul > li > a
    {
        height: inherit;
        width: inherit;
        display: flex;
        align-items: center;
        font-size: var(--frw-font-size-smaller);
        text-decoration: none;
        color: var(--frw-accent-light-color);
    }

    mobilenavigation > mobilenavigationframe > mobileurlbox > ul > li > a::before
    {
        display: block;
        content: '> ';
        position: relative;
        margin-right:15px;
    }

    mobilenavigation
    {
        display: unset !important;
    }

    portfolio > portfolioholder > portfolioelements > portfolioelement
    {
        width: unset;
    }

}