.extensor-box {
	background: #fff;
	border: 1px solid #ccc;
	border-radius: 2px;
	padding: 10px;
	float: left;
	margin: 0 20px 20px 0;
	width: 300px;
	position: relative;
	overflow: hidden;

	.ribbon {
		float: right;
		text-align: center;
		color: white;
		font-weight: bold;
		padding: 5px 10px;
		right: -40px;
		top: 30px;
		position: absolute;
		width: 205px;
		background: #e74c3c;
		-webkit-transform: rotate(30deg);
		-moz-transform: rotate(30deg);
		-ms-transform: rotate(30deg);
		-o-transform: rotate(30deg);
		transform: rotate(30deg);
	}

	img {
		max-width: 100%;
		height: auto;
		margin-bottom: 10px;
	}

	.extensor-header {
		margin: -10px;
	}
	.extensor-content {
		height: 60px;
	}
	.extensor-title {
		padding: 8px 0 !important;
		margin: 0;
	}

	.extensor-footer {

		.pull-left { float: left; }
		.pull-right { float: right; }
		.bold { font-weight: bold; }

		.notify {
			line-height: 28px;

			&:focus {
				-webkit-box-shadow: none;
				-moz-box-shadow: none;
				box-shadow: none;
			}
			.dashicons {
				text-decoration: none;
				color: #444;
				margin-right: 15px;
				font-size: 30px;
				line-height: 28px;
			}
			.dashicons-heart {
				color: #ff5e52;
			}
		}
	}


	.will-be-notified {
		width: 100%;
		height: 100%;
		position: absolute;
		background: rgba( 255, 255, 255, 0.95 );
		top: 0;
		left: 0;
		padding: 10px;
		box-sizing: border-box;

		.notified-close {
			float: right;
			color: #bbb;
			cursor: pointer;
		}
		.notified-text {
			text-align: center;
			-webkit-transform: translateY(-50%);
			-moz-transform: translateY(-50%);
			-ms-transform: translateY(-50%);
			-o-transform: translateY(-50%);
			transform: translateY(-50%);
			margin-top: 50%;
		}
		.extensor-update-email {
			text-decoration: none;
		}
	}


	.animated {
		-webkit-animation-duration: 1s;
		animation-duration: 1s;
		-webkit-animation-fill-mode: both;
		animation-fill-mode: both;
	}

	.animated.infinite {
		-webkit-animation-iteration-count: infinite;
		animation-iteration-count: infinite;
	}

	@-webkit-keyframes bounce {
		from, 20%, 53%, 80%, to {
			-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
			animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
			-webkit-transform: translate3d(0,0,0);
			transform: translate3d(0,0,0);
		}

		40%, 43% {
			-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
			animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
			-webkit-transform: translate3d(0, -30px, 0);
			transform: translate3d(0, -30px, 0);
		}

		70% {
			-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
			animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
			-webkit-transform: translate3d(0, -15px, 0);
			transform: translate3d(0, -15px, 0);
		}

		90% {
			-webkit-transform: translate3d(0,-4px,0);
			transform: translate3d(0,-4px,0);
		}
	}

	@keyframes bounce {
		from, 20%, 53%, 80%, to {
			-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
			animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
			-webkit-transform: translate3d(0,0,0);
			transform: translate3d(0,0,0);
		}

		40%, 43% {
			-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
			animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
			-webkit-transform: translate3d(0, -30px, 0);
			transform: translate3d(0, -30px, 0);
		}

		70% {
			-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
			animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
			-webkit-transform: translate3d(0, -15px, 0);
			transform: translate3d(0, -15px, 0);
		}

		90% {
			-webkit-transform: translate3d(0,-4px,0);
			transform: translate3d(0,-4px,0);
		}
	}

	.bounce {
		-webkit-animation-name: bounce;
		animation-name: bounce;
		-webkit-transform-origin: center bottom;
		transform-origin: center bottom;
	}


	@-webkit-keyframes pulse {
		from {
			-webkit-transform: scale(1);
			transform: scale(1);
		}

		50% {
			-webkit-transform: scale(1.25);
			transform: scale(1.25);
		}

		to {
			-webkit-transform: scale(1);
			transform: scale(1);
		}
	}

	@keyframes pulse {
		from {
			-webkit-transform: scale(1);
			transform: scale(1);
		}

		50% {
			-webkit-transform: scale(1.25);
			transform: scale(1.25);
		}

		to {
			-webkit-transform: scale(1);
			transform: scale(1);
		}
	}

	.pulse {
		-webkit-animation-name: pulse;
		animation-name: pulse;
	}

}