*, *::before, *::after {
    box-sizing: border-box;
  }

body {
    background-color: #1f1f1f;
    margin: 0;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.container {
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.drums {
    display: grid;
    grid-template-columns: auto auto auto auto;
    grid-column-gap: 50px;
    grid-row-gap: 50px;
}

.key {
    background-color: #c1292e;
    width: 100px;
    height: 100px;
}

.key.active {
    background-color:#e74757;
}