/* --------------------------- /////////// VIII. PORTFOLIO SECTION /////////// --------------------------- */

.portfolio-grid {
    margin-left: 0;
}
.portfolio-tags li {
    display: inline;
    margin-right:0;
    font-size: 1.125rem;
}
.portfolio-tags {
    text-align: center;
    margin-bottom: 3%;
    padding: 0;
}
/* -Portfolio Projects- */
.grid-item {
    display: inline-block;
    padding: .3rem;
    margin-bottom: 0;
}
.grid-item a {
    color: #333;
}
.lb-caption a {
    color: #3498DB;
}
.lb-caption a:hover {
    color: #2980B9;
}
.caption-title {
    border-left: 3px solid #c5a47e;
    height: 0;
    width: 50%;
    overflow: hidden;
    position: absolute;
    bottom: 0;
    left: 0;
    padding-right: 30%;
    background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9));
    transition: 0.5s ease;
    -webkit-clip-path: polygon(0% 0%, 0% 100%, 100% 100%, 100% 50%, 50% 0);
    clip-path: polygon(0% 0%, 0% 100%, 100% 100%, 100% 50%, 50% 0);
}
.caption:hover > .caption-title {
    height: 100%;
    width: 100%;
}
.caption:hover > .caption-title .text-wrap {
    opacity: 1;
}
.text-wrap {
    margin-top: 15%;
    margin-left: 7%;
    padding: 10px;
    opacity: 0;
    transition: 0.5s ease-in-out;
}
.text-wrap p {
    margin-top: 5px;
}
.text-wrap h2 {
    font-size: 1.4rem;
    margin-bottom: 5px;
}
/* -RESPONSIVE STYLES- */
@media (min-width : 560px) and (max-width : 760px) {
    .caption-title h2 {
        font-size: 2.5rem;
    }
}