* {
    font-family: 'Roboto', sans-serif;
}

body {
    background:white;
    padding:0;
    height:100vh;
    width:100vw;
    overflow:hidden;
    margin:0;
    display:flex;
}

.left {
    width:15%;
    height:100%;
    border-right:1px solid black;
    padding:4px;
    margin:0;
}

.right {
    height:100%;
    padding:0px;
    margin:0;
    flex-grow:1;
    display:flex;
    justify-content: space-evenly;
}

section {
    background:white;
    border:1px solid black;
    padding:8px;
    margin:0 0 15px 0;
    display:inline-block;
    width:calc(100% - 24px);
    height:auto;
}

meter {
    height:20px;
}

section.inventory {
    overflow-y:auto;
    max-height:500px;
}

section.one, section.two, section.three, section.four {
    width:24%;
    border:none;
    height:100%;
    padding:8px 0 8px 0;
}

.square {
    aspect-ratio: 1;
}

button.square {
    height:75px;
}

.mine-select {
    width:50%;
}

.mine-progress-bar {
    width:50%;
}

.mine-alert {
    border:1px dashed black;
    padding:2px 8px 2px 8px;
    border-radius: 50px;
    opacity:0;
}

.smeltery-gui {display:none;}

#particles{
    position:absolute;
    left:0;
    top:0;
    height:100vh;
    width:100vw;
    z-index:100;
    pointer-events: none;
}

#crafting-recipes {
    height:250px;
    border:1px solid black;
    overflow-y:scroll;
    padding:4px;
    display:flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: start;
}

.recipe {
    width:22.5%;
    margin:2px;
    border:1px solid black;
    aspect-ratio: 1/1;
    padding:2px;
}