.work {
    --gap: 10px;
    --margin: 12px;
    min-height: 100vh;
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
    padding: var(--margin);
    padding-top: 30px;
    margin-top: 100px;
    font-family: 'VerizonNHG', Helvetica, sans-serif;
}
.work .project-item {
    --thumbWidth: calc(25vw - var(--gap) * 3 / 4 - var(--margin) * 2 / 4 - 4px);
    width: var(--thumbWidth);
    border-radius: 10px;
    text-align: center;
    color: white;
    text-decoration: none;
}
.work .project-item img {
    width: 100%;
    height: calc(var(--thumbWidth) * 1.4);
    border-radius: 10px;
    object-fit: cover;
    border: 1px dotted #333333;
}

.work .project-item video {
    width: 100%;
    height: calc(var(--thumbWidth) * 1.4);
    border-radius: 10px;
    object-fit: cover;
    border: 1px dotted #333333;
}

.work .project-item h3 {
    font-family: 'VerizonNHG', Helvetica, sans-serif;
    margin: 6px 0px;
    color:black;
    text-decoration: none;
}
.work a {
    text-decoration: none;
    color: black;
}

.header {
font-size:600px;
text-align: center;
margin-top:0;
margin-bottom:0;
line-height: .75;
}
@media screen and (max-width: 735px) {
    .work .project-item {
        --thumbWidth: calc(50vw - var(--gap) * 1 / 2 - var(--margin) - 8px);
    }
}
@media screen and (max-width: 965px) {
    .work .project-item {
        --thumbWidth: calc(33.333vw - var(--gap) * 2 / 3 - var(--margin) * 2 / 3 - 6px);
    }
}