@import url('https://fonts.googleapis.com/css2?family=Roboto&family=Roboto+Condensed&display=swap');

/*                                                                                                          *\
    Manage the main site strucutre. Specific subsection parts are specified in their own files. 
    Also imports the Roboto font and the roboto condensed font which will be availible to use in all files.
\*                                                                                                          */

body {
    margin: 0px;
    padding: 0px;
    background-color: #36393F;
}

div.sl-menu-container {
    position: absolute;
    left: 0px;
    width: 250px;
    border: none;
    padding: 0px;
    margin: 0px;
    padding-top: 10px;
    height: calc(100% - 60px);
    background-color: #2F3136;
    z-index: 2;
}

div.sl-header {
    position: absolute;
    left: 250px;
    top: 0px;
    width: calc(100% - 250px);
    border: none;
    margin: 0px;
    height: 50px;
    background-color: #36393F;
    box-shadow: 0px 2px 5px #202225;
    z-index: 1;
}

div.sl-body {
    position: absolute;
    top: 50px;
    z-index: 0;
    left: 250px;
    height: calc(100% - 70px);
    width: calc(100% - 270px);
    font-family: "Roboto";
    padding: 10px;
    color: whitesmoke;
}

div.sl-login {
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: calc(250px);
    height: 50px;
    background-color: #23272A;
    z-index: 2;
}