/* PROJECT DETAILS PAGE */

.portfolio-description .tool-used {
    display: inline-block;
    margin-top: 2.5rem;
    font-size: 1.33rem;
    color: #677792;
    transition: color 650ms;
}

.portfolio-description .tool-used a {
    text-decoration: none;
    color: var(--text-theme-link);
}

.portfolio-description .tool-used a :hover {
    text-decoration: underline;
	text-decoration-color: var(--text-theme-link);
    -webkit-text-decoration-color: var(--text-theme-link);
    text-decoration-thickness: 0.12em;
    -webkit-text-decoration-thickness: 0.12em;
    color: var(--text-theme-link);
}

.project-details img {
    cursor: pointer;
}

/* Aligns the first image to the top next to the description text. */
.portfolio-item {
    align-items: flex-start;
}

/* Thumbnail gallery */
.project-thumbnail-gallery {
    padding-top: 20px;
}

.project-img-thumbnail {
    object-fit: cover;
}

/* Automatic scaling for images in thumbnail gallery */
.project-thumbnail-gallery-row {
    display: flex;
    flex-wrap: wrap;
    padding: 0 4px;
}

.project-thumbnail-gallery-col {
    flex: 25%;
    max-width: 50%;
    padding: 0 4px;
}

.project-thumbnail-gallery-col img {
    margin-top: 8px;
    vertical-align: middle;
    width: 100%;
    border: 4px solid rgba(255, 255, 255, 0.15);
}

@media screen and (max-width: 800px) {
    .project-thumbnail-gallery-col {
        flex: 50%;
        max-width: 50%;
    }
}