.index-isotope.v2 { article.pluto-post-box { .post-body { position: relative; .post-top-share { .transition(all 0.7s ease); .opacity(0); position: absolute; left: 12px; top: 12px; background-color: rgba(0,0,0,0.8); z-index: 1000; padding: 0px 6px; border-radius: 6px; .box-shadow(0px 1px 4px 0px rgba(0,0,0,0.4)); i.share-activator-icon { vertical-align: middle; line-height: 24px; font-size: 10px; color: #fff; padding-right: 3px; } span.share-activator-label { line-height: 24px; vertical-align: middle; font-size: 10px; text-transform: uppercase; color: #fff; padding-left: 10px; border-left: 1px solid #555; } &:hover { cursor: pointer; i.share-activator-icon { color: #fff; } span.share-activator-label { color: #fff; } } .os_social-head-w { display: none; margin-left: 2px; vertical-align: middle; .os_social { font-size: 10px; img { padding: 0px 4px; width: 25px!important; } a { .opacity(.65); &:hover { .opacity(1); } } } } &.active { span.share-activator-label { display: none; } .os_social-head-w { display: inline-block; } } } } .post-media-body { min-height: 100px; } .post-content-body { position: absolute; bottom: 0px; padding: 15px 25px; left: 0px; right: 0px; .transition(all 0.4s ease); background-image: linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,0.6) 100%); .post-title { margin-bottom: 0px; margin-top: 0px; a { color: #fff; font-size: floor(@baseFontSize * 1.8); border-bottom: 1px solid transparent; .transition(all 0.2s ease); &:hover { text-decoration: none; border-color: #fff; } } } .post-content { color: #fff; text-shadow: 0px 0px 4px rgba(0,0,0,0.9); margin-top: 10px; .transition(all 1s ease); .opacity(0); position: absolute; } } &:hover { .post-content-body { background-image: none; bottom: 80px; .post-content { .opacity(1); } } .post-title { } .post-top-share { .opacity(1); } .figure-shade { background-color: @postFigureShadeBackgroundColor; } .figure-icon { bottom: 80%; display: none; } } } }