.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 0; padding:0; overflow: hidden;}
.portfolio-item.col-4 { padding:0;}
.port-inner { position:relative; overflow:hidden; width:100%;}
.port-thumb { position:relative; display:block; overflow:hidden;}
.port-thumb img { width:100%; height:auto; display:block; -webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1); -webkit-transition:all 300ms ease; transition:all 300ms ease;}

.portfolio-meta { position:absolute; top:20px; right:5px; margin:0; width:55px; opacity:0; z-index:9; -webkit-transform:translateX(50px); -ms-transform:translateX(50px); transform:translateX(50px); -webkit-transition:all 0.5s ease; transition:all 0.5s ease; display:inline-block;}
.portfolio-meta a { background-color:#efad81; color:#2e2925; display:inline-block; width:40px; height:40px; line-height:40px; text-align:center; font-size:15px; margin:2px; border-radius:50%;}
.portfolio-meta a:hover { background-color:#ffffff; color:#2e2925;}

.port-overlay { position:absolute; left:0px; top:-100%; width:100%; height:100%; padding:0px; color:#ffffff; opacity:0; text-align:center; -webkit-transition:all 500ms ease; transition:all 500ms ease;}
.overlay-inner { position:absolute; left:0px; top:0px; width:100%; height:100%; display:table; vertical-align:middle; background:rgba(0,0,0,0.7);}

.port-content { position:absolute; left:-100%; bottom:0px; width:100%; z-index:1; opacity:0;}
.portfolio-category { position:relative; display:inline-block; padding:0 10px; height:30px; color:#ffffff; line-height:30px; background-color:#efad81; font-size:14px; top:60px; z-index:1; text-align:center; -webkit-transition:all 500ms ease; transition:all 500ms ease;}
.portfolio-category a { color:#2e2925;}
.portfolio-category a:hover { color:#ffffff;}
.port-content h4 { position:relative; font-size:18px; display:inline-block; width:100%; height:55px; line-height:55px; background-color:#ffffff; margin-bottom:0; text-transform:capitalize; z-index:1; text-align:center; -webkit-transition:all 500ms ease; transition:all 500ms ease;}

.portfolio-item:hover .port-overlay { top:0px; opacity:1;}
.portfolio-item:hover .port-content { left:0px; opacity:1; -webkit-transition:all 500ms ease 500ms; transition:all 500ms ease 500ms;}
.portfolio-item:hover .portfolio-category { top:0px; -webkit-transition:.3s ease; transition:.3s ease; -webkit-transition-delay:1s; transition-delay:1s;}
.portfolio-item:hover .portfolio-meta { opacity:1; -webkit-transform:translateX(0); -ms-transform:translateX(0); transform:translateX(0);}
.portfolio-item:hover .port-thumb img { -webkit-transform:scale(1.15); -ms-transform:scale(1.15); transform:scale(1.15);}

/* Single Portfolio */
.portfolio-single { position:relative;}
.portfolio-metadeta { position:relative; margin-bottom:20px;}
.portfolio-metadata-item { padding:10px; border:1px solid #efad81; text-align:center; margin:5px;}
.portfolio-metadata-item span { display:inline-block; color:#efad81; font-size:18px; margin-right:10px;}
.portfolio-share { display:block; margin-top:25px;}