wavelovers/css/vibration-master.css

/* -------------- */
/* GAMEPAD MASTER */
/* -------------- */

@charset 'UTF-8';

.vibration-master {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 16px;
}

.message-box {
    text-align: center;
}

.device-box {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 16px;
    text-align: center;
}

    .device-list {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        gap: 16px;
    }

        .list-item {
            max-width: 100%;
            padding: 16px;
            border: 4px solid var(--color-background);
            outline: 2px solid var(--color-border-alpha);
            border-radius: 4px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            gap: 16px;
        }

        @media only screen and (min-width: 640px) {
            .list-item {
                max-width: 50%;
            }
        }

        .list-item_selected {
            outline: 2px solid var(--color-border);
        }

            .list-item__info {
                padding: 16px;
                display: flex;
                flex-direction: column;
                gap: 16px;
            }

            .list-item__info > div {
                display: grid;
                grid-template-columns: repeat(3, 1fr);
            }

.controls-banner {
    width: 100%;
    text-align: center;
}

    .controls-banner__list {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }