/*******************************Mosaic View layout*************************************/ .clearfix:before, .clearfix:after{ content: ""; display: table; } .clearfix:after{ clear: both; } .table-outer{ display: table; width:100%; height: 100%; } .table-inner{ display: table-cell; vertical-align: middle; } /* ---- Thumb view style ---- */ .thumb-view .thumb-elem{ position: relative; overflow: hidden; margin-bottom: 0; } .thumb-view .thumb-elem.hovermove header.thumb-elem-header .featimg img.the-thumb{ width: 130%; height: auto; position: absolute; top: -15%; left: -15%; max-width: none; } /* ---- End Thumb view style ---- */ .featimg a { display: block;} .grid-small{ width: 16.6666%; } .grid-medium{ width: 33.3333%; } .grid-large{ width: 33.3333%; } .transparent-image{ width: 100%; vertical-align: middle; } .grid-hover{ position: absolute; display: none; } .grid-small { padding: 5px; } .grid-medium { padding: 3px 5px 5px 5px; } .grid-large { padding: 5px; } #owl-demo .item{ margin: 3px; } #owl-demo .item img{ display: block; width: 100%; height: auto; } .owl-carousel .owl-item { float: left; } .owl-carousel .owl-wrapper-outer { overflow: hidden; position: relative; width: 100%; } .thumb-elem-header{ position:relative; } .image-hover { background:rgba(0, 0, 0, 0.4); padding:10px 20px; position: absolute; bottom: -100%; left: 0px; width: 100%; height: auto; line-height: normal; text-align: center; -webkit-transition: all 3s ease 0s; -moz-transition: all 3s ease 0s; transition: all 3s ease 0s; } .masonry_elem .image-hover, .masonry_elem .image-hover:active, .masonry_elem .image-hover:hover, .masonry_elem .image-hover:focus{ color:#ffffff; } .owl-item:hover .image-hover, .masonry_elem:hover .image-hover{ bottom:0; cursor: pointer; -webkit-transform: scale(1); -ms-transform: scale(1); -moz-transform: scale(1); transform: scale(1); -webkit-transition: all 0.4s ease 0s; -moz-transition: all 0.4s ease 0s; transition: all 0.4s ease 0s; } span.follow{ float:left; } span.follow_icon{ float:right; } .owl-item:hover .instagram_like_count, .masonry_elem:hover .instagram_like_count{ opacity:1 } span.instagram_like_count span{ display: inline-block; font-size:1em; } span.instagram_like_count { opacity:0; display: block; position: absolute; top: 50%; width:100%; text-align: center; margin-top: -14.5px; color:#ffffff; -webkit-transition: all .3s ease 0s; -moz-transition: all .3s ease 0s; transition: all .3s ease 0s; } .instagram_imge_like:before { position: absolute; content: ''; display: block; background: -moz-linear-gradient(left,rgba(255,255,255,0) 0%,rgba(255,255,255,0.85) 100%); background: -webkit-gradient(linear,left top,right top,color-stop(0%,rgba(255,255,255,0)),color-stop(100%,rgba(255,255,255,0.85))); background: -webkit-linear-gradient(left,rgba(255,255,255,0) 0%,rgba(255,255,255,0.85) 100%); background: -o-linear-gradient(left,rgba(255,255,255,0) 0%,rgba(255,255,255,0.85) 100%); background: -ms-linear-gradient(left,rgba(255,255,255,0) 0%,rgba(255,255,255,0.85) 100%); background: linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.85) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff',endColorstr='#d9ffffff',GradientType=1); width: 35%; top: 30%; height: 1px; left: 5%; } .instagram_imge_like:after { position: absolute; content: ''; display: block; background: -moz-linear-gradient(left,rgba(255,255,255,0.85) 0%,rgba(255,255,255,0) 100%); background: -webkit-gradient(linear,left top,right top,color-stop(0%,rgba(255,255,255,0.85)),color-stop(100%,rgba(255,255,255,0))); background: -webkit-linear-gradient(left,rgba(255,255,255,0.85) 0%,rgba(255,255,255,0) 100%); background: -o-linear-gradient(left,rgba(255,255,255,0.85) 0%,rgba(255,255,255,0) 100%); background: -ms-linear-gradient(left,rgba(255,255,255,0.85) 0%,rgba(255,255,255,0) 100%); background: linear-gradient(to right,rgba(255,255,255,0.85) 0%,rgba(255,255,255,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#d9ffffff',endColorstr='#00ffffff',GradientType=1); width: 35%; top: 30%; height: 1px; right: 5%; } .instagram_imge_like{ position:relative; } .instagram_imge_like .count{ display: block; } .instagram-widget { width: 100%; padding: 8px 0 } .instagram-widget li { width: 31.33%; float: left; margin-right: 3%; margin-bottom: 1%; list-style: none; overflow: hidden; height: auto; padding-top: 5px; } .widget_apif_sidewidget > :last-child { margin-bottom: 0; padding-top: 3px; } .instagram-widget li:nth-child(3n){ margin-right: 0 } .widget-title-insta { text-align: center; font-family: 'Playfair Display', serif; color: #d28d56; font-size: 20px; line-height: normal; position: relative; } .widget_apif_sidewidget .apif-profile{ background:#295988; padding:10px; } .widget_apif_sidewidget .apif-profile-img{ width:15%; border:1px solid #ffffff; overflow: hidden; border-radius: 100%; display: inline-block; vertical-align: middle; } .widget_apif_sidewidget .apif-profile-img img{ width:100%; height:100%; border-radius: 100%; display: inline-block; vertical-align: middle; } .widget_apif_sidewidget .apif-profile-name{ font-size:16px; font-weight:bold; text-transform: uppercase; color:#ffffff; line-height: 18px; text-align: left; display: inline-block; vertical-align: middle; margin-left: 10px; } .widget_apif_sidewidget .apif-profile-follow{ background: #F8F8F8; padding:5px; border-bottom:1px solid #eeeeee; position:relative; min-height: 45px; } .widget_apif_sidewidget .apif-profile-follow>div{ float:left; width:25%; text-align:center; font-weight:bold; font-size:12px; color:#295988; } .widget_apif_sidewidget .apif-profile-follow>div>span{ display: block; font-weight:normal; font-size:10px; color:#999999; text-transform: capitalize; } .widget_apif_sidewidget .apif-profile-follow .follow{ position:absolute; top:0; right:0; width:25%; height:100%; padding:5px; } .widget_apif_sidewidget .follow-inner { height: 100%; } .widget_apif_sidewidget .apif-profile-follow .follow a{ display: inline-block; width:100%; padding:5px 0px; background:#275A89; color:#ffffff; border:1px solid #275A89; text-transform: capitalize; font-weight:bold; font-size:10px; } .widget_apif_sidewidget .apif-profile-follow .follow a:hover{ background:transparent; color:#275A89; border:1px solid #275A89; } .widget_apif_sidewidget li img{ /* transition: transform .2s ease-in-out; -webkit-transition: transform .2s ease-in-out; -moz-transition: transform .2s ease-in-out; transform: scale(1.1),translateZ(0); -webkit-transform: scale(1.1),translateZ(0); -moz-transform: scale(1.1),translateZ(0);*/ max-width: none; width: -webkit-calc(100% + 10px); width: calc(100% + 10px); opacity: 0.7; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-10px,0, 0); transform: translate3d(-10px,0,0); } .widget_apif_sidewidget li img:hover{ /* transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1);*/ -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); opacity: 1 } /*.apif-widget-wrapper span.follow { font-size: 10px; margin-left:-20px; .apif-widget-wrapper .image-hover{ padding:0; } .apif-widget-wrapper .fa-heart-o:before { content: "\f08a"; font-size: 16px; }*/ /* reset css */ .widget_apif_sidewidget ul{ padding: 0; margin: 0;}