* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    background-color: #1e1f23;
}

.list {
    display: flex;
    width: 100%;
    padding: 2rem;
    gap: 1rem;
    flex-wrap: wrap;

    .item {
        display: flex;
        width: calc(33.33% - 1rem);
        gap: 0.5rem;
        align-items: center;
        justify-content: center;
        border: 1px solid #fff;
        border-radius: 6px;
        padding: 1rem;
        text-decoration: none;

        .icon {
            width: 100px;
        }

        .infos {
            label {
                color: #fff;
                font-size: 18px;
            }
        }
    }
}

.channel {
    padding: 2rem;

    .header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;

        a {
            color: #000;
            background-color: #9ed12e;
            text-decoration: none;
            padding: 1rem;
            text-align: center;
        }

        label {
            color: #fff;
            font-size: 24px;
        }
    }

    .player {
        display: flex;
        width: 100%;
        margin-top: 2rem;

        video {
            width: 100%;
            min-height: 500px;
        }
    }
}