.portfolio-main{ position:relative;}
.portfolio-main .grid-col-two{ width:50%; float:none; }
.portfolio-main .grid-col-three{ width:33.3333%; float:none; }
.portfolio-main .grid-col-four{ width:25%; float:none; }

.portfolio-item { position:relative; margin:15px; display:block;}
.port-inner { position:relative;}
.port-thumb { position:relative; overflow:hidden;}
.port-thumb img { width:100%; height:auto; display:block; -webkit-transition:all 1.5s ease; transition:all 1.5s ease;}

.port-overlay { position:absolute; opacity:0; display:block; bottom:0; left:0; right:0; width:100%; height:100%; overflow:hidden; background-color:rgba(0, 0, 0, 0.8); color:#ffffff; -webkit-transition:all 0.5s; transition:all 0.5s;}
.portfolio-meta { position:absolute; left:0; top:0; text-align:left; width:100%; height:100%; -webkit-transition:all 0.6s ease; transition:all 0.6s ease;}
.portfolio-meta:after { content:''; position:absolute; z-index:-1; background-color:rgba(0, 0, 0, 0.1); -webkit-transition:all 0.4s ease-out; transition:all 0.4s ease-out;}
.portfolio-meta a.port-link { position:relative; display:inline-block; height:40px; width:40px; line-height:40px; font-size:15px; bottom:100%; z-index:1; text-align:center; background-color:#77997e; color:#ffffff; border-radius:50%;}
.portfolio-meta a.port-link:hover { background-color:#ffffff; color:#181d18;}
.portfolio-meta a.port-link:first-child { margin:30px 0 0 30px; -webkit-transition:all 0.6s ease; transition:all 0.6s ease;}
.portfolio-meta a.port-link:last-child { margin-left:5px; -webkit-transition:all 0.9s ease; transition:all 0.9s ease;}

.port-content { position:absolute; right:0; bottom:-100%; text-align:right; max-width:100%; padding:0 40px; -webkit-transition:all 0.6s ease; transition:all 0.6s ease;}
.port-content h4 { font-size:18px; text-transform:capitalize; margin-bottom:5px;}
.port-content h4 a { color:#ffffff;}
.portfolio-category a { font-size:17px; color:#77997e;}

.portfolio-item:hover .port-thumb img { -webkit-transform:scale(1.2); -ms-transform:scale(1.2); transform:scale(1.2);}
.portfolio-item:hover .port-overlay { opacity:1;}
.portfolio-item:hover .portfolio-meta a.port-link { bottom:0;}
.portfolio-item:hover .port-content { bottom:30px;}

.grid-col-four .portfolio-meta a.port-link { height:35px; width:35px; line-height:35px; font-size:14px;}
.grid-col-four .portfolio-meta a.port-link:first-child { margin:15px 0 0 15px;}
.grid-col-four .port-content h4 { font-size:16px;}

/* Single Portfolio */
.portfolio-single { position:relative;}
.portfolio-single .portfolio-content { width:100%; position:relative; margin-bottom:30px; padding-bottom:15px; border-bottom:1px solid #181d18;}
.portfolio-metadeta { position:relative; width:100%;}
.portfolio-metadata-item { position:relative; display:block; text-align:center; margin-bottom:30px;}
.portfolio-metadata-item span { display:block; font-size:17px; padding:5px 0;}
.portfolio-metadata-item h4 { position:relative; font-size:18px; z-index:5; display:block; margin-bottom:10px; text-transform:capitalize; letter-spacing:1px; padding:12px 30px 7px; background-color:#181d18; color:#ffffff; -webkit-transition:all .4s; transition:all .4s;}

.portfolio-share { text-align:center; display:block; margin-top:20px;}
.portfolio-share ul.social-share-post{ margin:0; border-radius:0; display:inline-block; text-align:center; }
.portfolio-share ul.social-share-post li{ border-radius:0; margin:0 5px;}
.portfolio-single .image-carousel{ margin:0 auto 50px; }

/* Related Portfolio Posts */
.related-port { position:relative;}
.related-port h3 { position:relative; padding:10px 25px 10px 0; display:block; font-size:25px; font-weight:500; border-bottom:2px solid #2d9596; text-transform:uppercase;}
.rel-port-inner { position:relative; display:flex;}
.rel-port-inner .portfolio-item.col-4 { padding:0; margin-left:10px; margin-right:10px;}