@use './colors' as *;
@use './responsive' as r;
@use './sizes';

body {
    display: flex;
    flex-direction: column;
}

#main-row {
    display: flex;
    flex-direction: column;
    flex: 1 0 auto;
    width: 100%;
    gap: 10px;

    @include r.normal {
        flex-direction: row-reverse;
    }

    #main {
        flex: 1 0 auto;
        padding: 0 15px;
        hyphens: auto;
        text-align: justify;

        @include r.normal {
            flex: 1 1 auto;
        }
    }

    #menu {
        background-color: $black;
        padding: 5px;
        box-sizing: border-box;

        @include r.normal {
            flex: 0 0 sizes.$left-menu-width;
        }
    }
}

#link-to-mobile-menu {
    @include r.normal {
        display: none;
    }
}

#footer {
    padding: 2px 0;
    color: $light-gray;
    background-color: black;
}