main{
    flex-direction: column;
}

.artProjectNavDivider{
    margin: 50px auto;
    width: 500px;
}

.artProjectNavegation{
    margin: 0px auto;
    flex-direction: row;
}

.subNavLinks{
    margin: 0px 15px;
    text-decoration: none;
}

.subNavLinks h3{
    font-weight: 500;
}

.subNavLinks h3:hover{
    font-weight: bold;
}

.projectRows{
    display: flex;
    margin: 0px auto 75px;
    gap: 25px;
    max-width: 1750;
    width: 100%;
    justify-content: center;
}

.projectRows a{
    color: var(--background-color);
}

.projectThumb{
    position: relative;
    text-align: center;

    margin: 0px;
}

.projectThumb:hover .projectInfo{
    opacity: 1;
}

.projectThumb:hover img{
    border-color: var(--big-text-color);

    filter: brightness(50%);

    transform: scale(1.03);
}

.projectThumb img{
    object-fit: cover;

    min-width: 125px;
    max-width: 480px;
    width: 100%;
    aspect-ratio: 16/9;

    border-radius: 25px;
    border: 5px solid;

    transition: 
        filter 0.3s ease,
        transform 0.3s ease;
}

.projectInfo{
    opacity: 0;

    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

    padding: 0px;

    display: flex;
    flex-direction: column;
}

.projectInfo p{
    line-height: 1em;
    text-indent: 0em;
    padding: 0em;
    margin: 5px 0px 10px;
    text-align: center;
}

.projectInfo > hr{
    margin: 0px 25%;
}

#actualEnv h3{
    font-style: oblique;
}

@media (max-width: 1100px) {
    .projectRows{
    flex-wrap: wrap;
    }
}