/**
 * @package		SP Flickr Gallery
 * @copyright	Copyright (C) 2010 - 2015 JoomShaper. All rights reserved.
 * @license		GNU General Public License version 2 or later; 
 */
 .sp-flickr-gallery {
 	list-style: none;
 	padding: 0;
 	margin: 0;
 	overflow: hidden;
 	margin: 0 -5px;
 	margin-bottom: -22px;
 	padding-bottom: 5px;
 	position: relative;
    top: -10px;
 }

.sp-flickr-gallery ul {
margin-left: 0px; padding-left: 3px

}

.sp-flickr-gallery li{
	display: block;
	float: left;
	margin: 0;
	padding: 2px;
	box-sizing: border-box;
	margin-bottom: -5px;
}

.flickr-gallery-wrap {
	overflow: hidden;
    height: 163px;

}


.sp-flickr-gallery li a {
	padding: 0 !important;
	position: relative;
	display: inline-block;
	overflow: hidden;
}
.sp-flickr-gallery li div.flickr-gallery-wrap:before{
	background: rgba(0,0,0,.7);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: "";
	opacity: 0;
	-webkit-transition: all .25s;
	-o-transition: all .25s;
	transition: all .25s;
}
.sp-flickr-gallery li div.flickr-gallery-wrap:after{
	content: "+";
	position: absolute;
	top: 50%;
	left: 50%;
	font-size: 24px;
	font-weight: bold;	
	-webkit-transition: all .25s;
	-o-transition: all .25s;
	transition: all .25s;
	-webkit-transform: translate(-50%, -50%) scale(0);
	-moz-transform: translate(-50%, -50%) scale(0);
	-ms-transform: translate(-50%, -50%) scale(0);
	-o-transform: translate(-50%, -50%) scale(0);
	transform: translate(-50%, -50%) scale(0);
	font-family: "FontAwesome";
	color: #fff;
}
.sp-flickr-gallery li:hover div.flickr-gallery-wrap:before{
	opacity: 0.8;
}
// .sp-flickr-gallery li:hover span.flickr-gallery-wrap:after{
// 	-webkit-transform: translate(-50%, -50%) scale(1);
// 	-moz-transform: translate(-50%, -50%) scale(1);
// 	-ms-transform: translate(-50%, -50%) scale(1);
// 	-o-transform: translate(-50%, -50%) scale(1);
// 	transform: translate(-50%, -50%) scale(1);
// }
.sp-flickr-gallery a{
	padding: 0;
}

.title-photo { display: none; position: absolute; bottom: 0; color:#fff; background: rgba(0,0,0,.7); padding: 2px 0px 3px 8px !important; line-height: 16px; font-size: 13px}

.sp-flickr-gallery li:hover .title-photo { display: block; padding: 5px; width: 97%;  min-height: 40px}

// ul.sp-flickr-gallery li {
//     max-width: 33% !important;
// }

@media (max-width: 767px){

ul.sp-flickr-gallery li {
   
    height: auto !important;
    max-width: 100% !important;
}

}