.div-main-skills {
    max-width: 900px;
}

.skills-items {
    border-radius: .50rem;
    padding-top: .75rem;
    padding-bottom: .75rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    margin: .5rem;
    background-color: #1e2226;
    font-family: Helvetica, sans-serif;
    height: 40px;
    align-items: center;
    width: auto;
    color: hsla(0,0%,100%,.8);
    z-index: 1;
    transition: transform 1000ms;
}

.skills-list {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 2rem;
    justify-content: center;
}

.skill-icons {
    height: 4rem;
    margin: .5rem;
}

.git-icon {
    background-color: hsla(0,0%,100%,.8);
    border-radius: .50rem;
}

.skill-list-icon {
    animation: icon-move linear forwards;
    animation-timeline: view();
    animation-range-start: continer;
    animation-range-end: 350px;
    position: relative;
    opacity: 0;
    scale: 0;
}

@keyframes icon-move {
    to {
        scale: 1;
        opacity: 1;
        transform: rotate(360deg);
    }
}

.skills-items:hover {
    transform: translateY(-1rem);
    transition: transform 200ms;
}