.title-banner {
    font-size: 2em;
    color: #ff8800;
}

.subtitle-banner {
    font-size: 1.5em;
    font-weight: 600;
    color: #ff8800;
}

.two-grid {
    display: grid;
    grid-template-columns: auto auto;
    gap: 20px;
}

.terminal {
    background-color: black;
    .terminal-text {
        color: #00c800;
        text-align: start;
        line-height: 0.1rem;
        margin-top: 30px;
        font-family: 'Courier New', Courier, monospaced;
    }
}

@font-face {
    font-family: 'Scumm-Menu';
    src: url('fonts/lucasarts-scumm-menu.otf/lucasarts-scumm-menu.otf'); /* IE9 Compat Modes */
    src: url('fonts/lucasarts-scumm-menu.otf/lucasarts-scumm-menu.otf?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/lucasarts-scumm-menu.otf/lucasarts-scumm-menu.otf') format('otf'), /* Modern Browsers */
         url('fonts/lucasarts-scumm-menu.otf/lucasarts-scumm-menu.otf')  format('truetype'), /* Safari, Android, iOS */
}

.scumm {
    display: grid;
    grid-template-columns: 95px 150px 95px;
    background-color: black;
    padding:10px;
    gap: 10px;
    font-family: 'Scumm-Menu';
    color: #a03c9a;
    font-size: 32px;
    
    .verb {
        background-color: #0f030b;
        margin-top: 6px;
        margin-bottom: 6px;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        align-self: center;
        justify-self: center;
        
        &:hover {
            color: #cb54bd;
            cursor: pointer;
        }
    }
}

.inventory {
    background-color: black;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    
    .slot {
        width: 100px;
        height: 58px;
        background-color: #0f030b;
        margin-top: 11px;
        margin-left: 5px;
        margin-right: 4px;
    }
}