#sidebar{
    display: none;
    height: 100vh;
    width: 250px;
    left: 0;
    box-shadow: 0px 0px 30px 5px rgba(0,0,0,0.05);
}

#content{
    width: 100%;
}

.project-thumb{
    height: 250px;
}

.project-thumb .background-image-holder{
    width: calc(100% - 30px);
    right: 0;
    margin: 0 auto;
}

.hover-element__reveal{
    opacity: 0;
    height: 250px;
    transition: all .35s ease-in-out;
}

.project-thumb:hover .hover-element__reveal{
    opacity: 1;
}

.project-thumb h5{
    /* text-shadow: 0px 0px 10px rgba(0,0,0,0.75); */
}

@media (min-width: 768px){
    #sidebar{
        display: flex;
    }

    #content{
        width: calc(100% - 250px);
    }
}

.hover-element__reveal{
    background-color: rgb(125 125 125 / 75%);
}
