.menu {

    width:100%;
    height:100px;
    position:fixed;
    top:0;
    left:0;
    z-index:5;
    transition:background-color 0.3s,height 0.3s;

}

.menu .content {

    background-color:rgba(255,255,255,0);
    /*border-bottom:3px solid rgba(255,255,255,0.28);*/

}

.menu .content .logo {

    width:236px;
    height:100px;
    float:left;
    background-image:url('./files/elements/RK_2021_white.svg');
    background-size:contain;
    background-position:left center;
    background-repeat:no-repeat;
    transition:height 0.3s;

}

.menu .mobileMenu_button {

    width:26px;
    height:100px;
    background-image:url('./files/icons/menu_button_white.svg');
    background-size:contain;
    background-position:center center;
    background-repeat:no-repeat;
    cursor:pointer;
    float:right;
    display:none;
    transition:height 0.3s;

}

.menu .mobileMenu_button.close {
    background-image:url('./files/icons/menu_closeButton_white.svg');
}

.menu .content .menu_holder {

    min-width:10px;
    height:100px;
    float:right;

}

.menu .content .menu_holder .mobileMenuClose_button {

    width:26px;
    height:26px;
    background-image:url('./files/icons/menu_closeButton_black.svg');
    background-size:contain;
    background-position:center center;
    background-repeat:no-repeat;
    cursor:pointer;
    display:none;
    position:absolute;
    top:40px;
    right:40px;
    z-index:9992;

}

.menu .content .menu_holder .menu_table {

    width:10px;
    height:100px;
    border-collapse:collapse;
    transition:height 0.3s;

}

.menu .content .menu_holder .menu_table tr td {

    padding:0;
    margin:0;
    font-size:20px;
    font-weight:700;
    font-family:Proxima,sans-serif;
    color:rgba(255,255,255,1.0);
    text-transform:uppercase;
    padding-left:31px;
    opacity:1;
    transition:opacity 0.3s;
    cursor:pointer;

}

.menu .content .menu_holder .menu_table tr td:hover {
    opacity:0.8;
    transition:opacity 0.3s;
}

/* SMALL MENU */

.menu.small {
    height:75px;
    background-color:rgba(255,255,255,1.0);
    box-shadow:0px 4px 8px 0 rgba(0,0,0,0.50);
}

.menu.small .content {
    border:none;
}

.menu.small .content .logo {
    height:75px;
    background-image:url('./files/elements/RK_2021_color.svg');
}

.menu.small .mobileMenu_button {
    height:75px;
    background-image:url('./files/icons/menu_button_black.svg');
}

.menu.small .mobileMenu_button.close {
    background-image:url('./files/icons/menu_closeButton_black.svg');
}

.menu.small .content .menu_holder {
    height:75px;
}

.menu.small .content .menu_holder .menu_table {
    height:75px;
}

.menu.small .content .menu_holder .menu_table tr td {
    color:rgba(0,0,0,1.0);
}

@media screen and (max-width:800px) {

    .menu .mobileMenu_button {
        display:block;
    }

    .menu .content .menu_holder .mobileMenuClose_button {
        display:block;
    }

    .menu_holder {

        width:calc(100% - 40px);
        height:calc(100% - 40px) !important;
        float:none;
        position:fixed;
        top:20px;
        left:20px;
        z-index:9991;
        background-color:rgba(255,255,255,1.0);
        display:none;
        opacity:0;

    }

    .menu_holder .menu_table {

        width:100% !important;
        height:auto;
        position:absolute !important;
        top:0 !important;
        bottom:0 !important;
        margin-top:auto !important;
        margin-bottom:auto !important;

    }

    .menu_holder .menu_table tr td {

        padding:0 !important;
        margin:0 !important;
        width:100% !important;
        height:60px !important;
        float:left;
        color:rgba(0,0,0,1.0) !important;
        padding-top:10px;
        padding-bottom:10px;
        text-align:center;
        vertical-align:middle !important;

    }

    .menu.small .menu_holder .menu_table tr td {
        color:rgba(0,0,0,1.0) !important;
    }

}

@media screen and (max-width:500px) {

    .menu .content .logo {

        width:142px;

    }

}
