.projectsFrame {
    overflow: hidden;
}

.projectsFrame > * {
    margin-bottom: calc(var(--vertical-margin)/1.5);
}

.projectFrame {
    width: 100%;
    aspect-ratio: 1.75;
    
    position: relative;
    box-sizing: border-box;
    display: block;

    border: none;
    
    overflow: hidden;

    border-radius: var(--corner-small);
}

.project {
    width: 100%;
    height: 100%;

    position: relative;
    box-sizing: border-box;
    display: block;

    border: none;

    overflow: hidden;
}

.project > .imageContainer {
    width: 100%;
    height: 100%;
    position: absolute;
}

.project > .imageContainer > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;

    border-radius: var(--corner-small);
}
.project > .imageContainer > .imageOverlay {
    width: 100%;
    height: 100%;
    position: absolute;

    border-radius: var(--corner-small);
    background: linear-gradient(0deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.45) 17%, rgba(0,0,0,0.05) 75%);
}

.project > .storeGameTitle {
    position: absolute;
    bottom: 25px;
    left: 25px;
    
    width: calc(100% - 50px);
    background-color: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%)
}