.Skills {
    background: var(--color-orange-black);
    background-image: radial-gradient(circle at 90vw 0, rgba(255,145,0,0.2) 0%, rgba(0,0,0,0) 63%, rgba(0,0,0,0) 100%);
    background-repeat: no-repeat;

    & .skill-list {
        display: flex;
        flex-wrap: wrap;
    }

    & .tech-list ul {
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
    }

    & .bottom {
        align-items: center;
    }

    & .image-container {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    & .skill-card {
        display: flex;
        flex-direction: row;
        align-items: center;

        &.reverse {
            flex-direction: row-reverse;
        }
    }
}

@media (width <= 1601px) {
    .Skills {
        & .skill-container {
            flex-wrap: wrap;
            flex-direction: row;
        }

        & .skill-card.reverse,
        & .skill-card {
            flex: 1 0 300px;
            flex-direction: column;
            text-align: center;
            justify-content: start;
        }

        & .skill-card h3 {
            text-align: center;
        }

        & .text-container,
        & .text-container main {
            height: 100%;
        }

        & .image-container img {
            width: 100%;
        }
    }
}