/* Thumb Info */
.thumb-info {
	display: block;
	overflow: hidden;
	position: relative;
	text-decoration: none;
	max-width: 100%;
	&:hover {
		.thumb-info-action-icon {
			right: 0;
			top: 0;
		}
		.thumb-info-action {
			filter: alpha(opacity = 100);
			opacity: 1;
		}
		.thumb-info-title {
			background: #000;
		}
	}
	.thumb-info-action-icon {
		@include transition (all 0.3s);
		background: #CCC;
		border-radius: 0 0 0 25px;
		display: inline-block;
		font-size: 25px;
		height: 50px;
		line-height: 50px;
		position: absolute;
		right: -100px;
		text-align: center;
		top: -100px;
		width: 50px;
		i {
			font-size: 24px;
			left: 3px;
			position: relative;
			top: -4px;
		}
	}
	.thumb-info-action {
		@include transition (all 0.3s);
		background: rgba(36, 27, 28, 0.9);
		bottom: 0;
		color: #FFF;
		filter: alpha(opacity = 0);
		height: 100%;
		left: 0;
		opacity: 0.0;
		position: absolute;
		right: 0;
		top: 0;
		width: 100%;
	}
	.thumb-info-inner {
		@include transition (all 0.3s);
		display: block;
		white-space: nowrap;
	}
	.thumb-info-title {
		@include transition (all 0.3s);
		background: rgba(36, 27, 28, 0.9);
		bottom: 10%;
		color: #FFF;
		font-size: 18px;
		font-weight: 700;
		left: 0;
		letter-spacing: -1px;
		padding: 9px 11px 9px;
		position: absolute;
		text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
		text-transform: uppercase;
		z-index: 1;
	}
	.thumb-info-type {
		background-color: #CCC;
		border-radius: 2px;
		display: inline-block;
		float: left;
		font-size: 12px;
		font-weight: 400;
		letter-spacing: 0;
		margin: 8px -2px -15px -2px;
		padding: 2px 9px;
		text-transform: none;
	}
	img {
		@include transition (all 0.2s linear);
		border-radius: 3px;
		position: relative;
	}
	&:hover img {
		@include transform(scale(1.1, 1.1));
	}
}

/* Thumb Info Caption  */
.thumb-info-caption {
	padding: 10px 0;
	p {
		font-size: 0.9em;
		line-height: 20px;
		margin: 0 0 8px;
		padding: 10px;
	}
}

/* Thumb Info Social Icons */
.thumb-info-social-icons {
	border-top: 1px dotted #DDD;
	margin: 0;
	padding: 15px 0;
	display: block;
	a {
		background: #CCC;
		border-radius: 25px;
		display: inline-block;
		height: 30px;
		line-height: 30px;
		text-align: center;
		width: 30px;
		&:hover {
			text-decoration: none;
		}
		span {
			display: none;
		}
		i {
			color: #FFF;
			font-size: 0.9em;
			font-weight: normal;
		}
	}
}

/* Thumb Info Secundary */
.thumb-info.secundary {
	.thumb-info-title {
		background: transparent;
		bottom: auto;
		left: 0;
		right: 0;
		top: 35%;
		text-align: center;
		opacity: 0;
	}
	.thumb-info-type {
		float: none;
	}
	&:hover {
		.thumb-info-title {
			top: 42%;
			opacity: 1;
		}
	}
}