@font-face {
    font-family: "Roboto";
    src: url("../fonts/Roboto.ttf");
}
h1, p, a {
    color: white;
    font-family: Roboto;
}
body { 
    background-color: black;
}
button.sidebarbutton {
    background-color: green;
    font-size: 25px;
    border: 2px solid black;
    width: 50px;
    height: 50px;
    cursor: pointer;
}
div.logo {
    margin: 25px 1% 25px 5%;
    justify-content: center;
    align-items: center;
    display: flex;
}
div.main {
    border: 2px solid gray;
    border-radius: 25px;
    text-align: center;
    /* margin value order: top, right, bottom, left*/
    margin: 1px 25% 75px 25%;
    padding: 25px 50px 25% 100px;
}
div.sidebar {
    border: 2px solid gray;
    border-radius: 25px;
    margin: 150px 50% 75px 50%;
    position: fixed;
    right: 28%;
    top: 5%;
    /*padding: 25% 25px 75px 10%;*/
    /*padding: 1% 7% 20% 5%;*/
    padding-left: 4%;
    width: 15%;
    height: 50%;
    float: left;
    box-sizing: border-box;
}
div.footer {
    border: 2px solid gray;
    border-radius: 25px;
    margin: 100px 25% 75px 25%;
    text-align: center;
}